﻿.navbar {
	font-family: 'Dosis', sans-serif;
	position:relative;
	display:table;
	float:none;
	list-style-type:none;
	padding:0;
    margin:auto 0;
   
       
}
.navbar:before {
	position:absolute;
	display:block;
	content: "";
	z-index:-1;
	width:101%;
	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:0;
	width:101%;
	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:0px;
	border:1px solid rgba(0,0,0,0.5);
	line-height:47px;
    -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.color1 > li {
	background:#1b2b4d;
}
.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:101%;
	height:100%;
	left:0;
	top:0;
	background: -moz-linear-gradient(top,  rgba(255,255,255,0.15) 0%, rgba(0,0,0,0.16) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.15)), color-stop(100%,rgba(0,0,0,0.16)));
	background: -webkit-linear-gradient(top,  rgba(255,255,255,0.15) 0%,rgba(0,0,0,0.16) 100%);
	background: -o-linear-gradient(top,  rgba(255,255,255,0.15) 0%,rgba(0,0,0,0.16) 100%);
	background: -ms-linear-gradient(top,  rgba(255,255,255,0.15) 0%,rgba(0,0,0,0.16) 100%);
	background: linear-gradient(top,  rgba(255,255,255,0.15) 0%,rgba(0,0,0,0.16) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#26ffffff', endColorstr='#29000000',GradientType=0 );
}
.navbar > li:after {
	position:absolute;
	display:block;
	content:"";
	width:100%;
	height:100%;
	top:0;
	left:0;
	
}

.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:#fff;
	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(255,215,75, 4);
	box-shadow: inset 0px -2px 8px 0px rgba(255,215,75, 4); 
    color:#ffd74b;
}
.navbar > li > a > span {
	position:relative;
	font-weight:bold;
	margin:0 15px 0 0;
}

.icon20
{
	position:relative;
	float:left;
	display:block;
	width:20px;
	height:20px;
	margin:10px -10px 0 10px;
	background: url("../Images/download.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;}