@charset "utf-8";
/* CSS Document */

/*@import url(http://fonts.googleapis.com/css?family=Dosis:400,700);*/
@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 400;
  src: local('Dosis Regular'), local('Dosis-Regular'), url(../fonts/xIAtSaglM8LZOYdGmG1JqQ.woff) format('woff');
}
@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 700;
  src: local('Dosis Bold'), local('Dosis-Bold'), url(../fonts/x-7NZTw0n-ypOAaIE8uSrvesZW2xOQ-xsNqO47m55DA.woff) format('woff');
}

.navbar {
	font-family: 'Dosis', sans-serif;
	position:relative;
	display:table;
	float:none;
	list-style-type:none;
	margin:0px;
	width:100%;
	/*margin:20px auto 250px auto;*/
}
.navbar .item1{
	margin-left:80px;
}
.navbar:before {
	position:absolute;
	display:block;
	content: "";
	z-index:-1;
	width:100%;
	height:18px;
	bottom:-9px;
	left:2px;
	background: -moz-radial-gradient(center, ellipse cover,  rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 75%);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(0,0,0,0.7)), color-stop(75%,rgba(0,0,0,0)));
	background: -webkit-radial-gradient(center, ellipse cover,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 75%); 
	background: -o-radial-gradient(center, ellipse cover,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 75%);
	background: -ms-radial-gradient(center, ellipse cover,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 75%);
	background: radial-gradient(center, ellipse cover,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 75%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#00000000',GradientType=1 );
	opacity:.4;
}
.navbar:after {
	position:absolute;
	display:block;
	content: "";
	z-index:-1;
	width:100%;
	height:100%;
	top:0;
	left:0;
	-webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
	box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
}
.navbar > li {
	position:relative;
	float:left;
	display:inline-block;
	list-style-type:none;
	text-align:center;
	margin:0;
	border-left:0;
	background: url(../images/bg-button.png) repeat-x;
	/*border:1px solid rgba(0,0,0,0.5);*/
	line-height:43px;
	-webkit-box-shadow: inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25);
    box-shadow: inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25);
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}
.navbar > li.active {
	background: url(../images/bg-menu-actif.png) repeat-x;
}
.navbar.color1 > li {
	background:#ea7900;
}
.navbar.color2 > li {
	background:#336277;
}
.navbar.color3 > li {
	background:#3e781b;
}
.navbar.color4 > li {
	background:#ad2259;
}
.navbar.color5 > li {
	background:#b20a22;
}
.navbar > li:before {
	position:absolute;
	display:block;
	content: "";
	z-index:1;
	width:100%;
	height:100%;
	left:0;
	top:0;
	
}
.navbar > li:after {
	position:absolute;
	display:block;
	content:"";
	width:100%;
	height:100%;
	top:0;
	left:0;
	/*background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OERFQkEzRUJDNUM5MTFFMUE3NzBCMTZBMEExNEQ5NUQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OERFQkEzRUNDNUM5MTFFMUE3NzBCMTZBMEExNEQ5NUQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4REVCQTNFOUM1QzkxMUUxQTc3MEIxNkEwQTE0RDk1RCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo4REVCQTNFQUM1QzkxMUUxQTc3MEIxNkEwQTE0RDk1RCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PiSp0pIAAAAySURBVHjaYmBgYOAHYmYGCADR/CDiDxDzQAW5gPgLlM3ACsQKUBqhBYjZkY3CMBMgwACvHQKnyUp+6gAAAABJRU5ErkJggg==");*/
}
.navbar > li.drpdown a > span{
	margin-right:30px;
}
.navbar > li.drpdown > a:after {
	position:absolute;
	content: "\0025bc";
	z-index:1;
	font-size:8px;
	top:0;
	right:10px;
	color:#fff;
	text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.8);
    filter: dropshadow(color=#000, offx=0, offy=-1);
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}
.navbar > li.drpdown a:hover:after,.navbar > li a:hover {
	/*color:#ccc;*/
	color:#CCC;
	/*color:#000;*/
}
.navbar > li.drpdown:hover .drpcontent {
	display:block;
}
.navbar > li:first-child {
	/*border-left:1px solid #1a1a1a;*/
}
.navbar > li:last-child {
	-webkit-box-shadow: inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25),inset -1px 0px 0px 0px rgba(255, 255, 255, 0.25);
    box-shadow: inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25), inset -1px 0px 0px 0px rgba(255, 255, 255, 0.25); 
}
.navbar > li > a {
	position:relative;
	display:block;
	width:100%;
	text-decoration:none;
	font-size:12px;
	color:#000;
	/*text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.4);
    filter: dropshadow(color=#000, offx=0, offy=-1);*/
	z-index:4;
	/*-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;*/
}
.navbar > li:hover {
	-webkit-box-shadow: inset 0px -2px 8px 0px rgba(0, 0, 0, 0.35);
	box-shadow: inset 0px -2px 8px 0px rgba(0, 0, 0, 0.35); 
}
.navbar > li > a > span {
	position:relative;
	font-weight:bold;
	margin:0 15px 0 0;
}
.navbar > li  .drpcontent {
	position:absolute;
	display:none;
	margin:0;
	padding:20px 0 0 0;
	z-index:5;
	top:36px;
	min-width:200%;
	float:none;
	list-style-type:none;
	border:1px solid #737373;
	border-top:0;
	-webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25),inset 0px 6px 4px -4px rgba(0, 0, 0, 0.5);
	box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25),inset 0px 6px 4px -4px rgba(0, 0, 0, 0.5);
	-webkit-border-radius: 0px 0px 4px 4px;
	border-radius: 0px 0px 4px 4px;
	background: rgb(249,249,249);
	background: -moz-linear-gradient(-45deg,  rgba(249,249,249,1) 0%, rgba(229,229,229,1) 100%);
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(249,249,249,1)), color-stop(100%,rgba(229,229,229,1)));
	background: -webkit-linear-gradient(-45deg,  rgba(249,249,249,1) 0%,rgba(229,229,229,1) 100%);
	background: -o-linear-gradient(-45deg,  rgba(249,249,249,1) 0%,rgba(229,229,229,1) 100%);
	background: -ms-linear-gradient(-45deg,  rgba(249,249,249,1) 0%,rgba(229,229,229,1) 100%);
	background: linear-gradient(135deg,  rgba(249,249,249,1) 0%,rgba(229,229,229,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#e5e5e5',GradientType=1 );
	-webkit-transition: opacity 300ms ease-in-out;
	-moz-transition: opacity 300ms ease-in-out;
	-ms-transition: opacity 300ms ease-in-out;
	-o-transition: opacity 300ms ease-in-out;
	transition: opacity 300ms ease-in-out;
}
.navbar > li:not(:last-of-type) .drpcontent {
	left:-1px;
}
.navbar > li:last-child .drpcontent {
	right: -1px;
}
.drpcontent li {
	position:relative;
	text-align:left;
	/*border-bottom:1px solid rgba(0, 0, 0, 0.2);*/
	font-size:12px;
	line-height:35px;
	height:35px;
	font-weight:bold;
	-webkit-box-shadow: inset 0px -1px 0px 0px rgba(255, 255, 255, 0.2);
	box-shadow: inset 0px -1px 0px 0px rgba(255, 255, 255, 0.2);
	overflow:hidden;
}
.drpcontent li:before {
	position:absolute;
	display:block;
	content: "";
	width:100%;
	height:100%;
	top:-100%;
	left:0;
	background: #cecece;
	-webkit-transition: all 500ms ease-in-out;
	-moz-transition: all 500ms ease-in-out;
	-ms-transition: all 500ms ease-in-out;
	-o-transition: all 500ms ease-in-out;
	transition: all 500ms ease-in-out;
	opacity:0;
}
.drpcontent li:after {
	position:absolute;
	display:block;
	content: "\0025b6";
	height:20px;
	width:20px;
	top:0;
	left:6px;
	font-size:8px;
	-webkit-transition: all 500ms ease-in-out;
	-moz-transition: all 500ms ease-in-out;
	-ms-transition: all 500ms ease-in-out;
	-o-transition: all 500ms ease-in-out;
	transition: all 500ms ease-in-out;
}
.drpcontent li:hover:before {
	top:0;
	opacity:0.8;
}
.drpcontent li:hover:after {
	color:#fff;
	left:12px;
}
.drpcontent li:last-child:hover:before {
	-webkit-border-radius: 0px 0px 4px 4px;
	border-radius: 0px 0px 4px 4px;
}
.drpcontent li a {
	display:block;
	height:100%;
	width:100%;
	position:relative;
	color:#000;
	text-decoration:none;
	width:100%;
	padding-left:20px;
	-webkit-transition: all 500ms ease-in-out;
	-moz-transition: all 500ms ease-in-out;
	-ms-transition: all 500ms ease-in-out;
	-o-transition: all 500ms ease-in-out;
	transition: all 500ms ease-in-out;
}
.drpcontent li:hover a{
	color:#fff;
	padding-left:26px;
}
.drpcontent li:first-child {
	border-top:1px solid #a6a6a6;
}
.drpcontent li:last-child {
	border:0;
	-webkit-box-shadow:none;
	box-shadow:none; 
	-webkit-border-radius: 0px 0px 4px 4px;
	border-radius: 0px 0px 4px 4px;
}
.icon20{
	position:relative;
	float:left;
	display:block;
	width:20px;
	height:20px;
	margin:10px 8px 0 8px;
	background: url(../images/icon.png) no-repeat;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}
.icon20.home {background-position:0 0;}
.icon20.upload {background-position:-20px 0;}
.icon20.download {background-position:-40px 0;}
.icon20.comments {background-position:-60px 0;}
.icon20.theme {background-position:-80px 0;}
.icon20.login {background-position:-100px 0;}
.navbar > li:hover .icon20.home {background-position:0 -20px;}
.navbar > li:hover .icon20.upload {background-position:-20px -20px;}
.navbar > li:hover .icon20.download {background-position:-40px -20px;}
.navbar > li:hover .icon20.comments {background-position:-60px -20px;}
.navbar > li:hover .icon20.theme {background-position:-80px -20px;}
.navbar > li:hover .icon20.login {background-position:-100px -20px;}