/*-------------------------

	Simple reset

--------------------------*/





*{

	margin:0;

	padding:0;

}





/*-------------------------

	General Styles

--------------------------*/







a, a:visited {

	text-decoration:none;

	outline:none;

	color:#54a6de;

}



a:hover{

	text-decoration:underline;

}



section, footer, nav{

	display: block;

}





/*----------------------------

	The Navigation Menu

-----------------------------*/

#colorNav img {margin-top:3px}



#colorNav > ul{

	 /* Increase when adding more menu items */dth

	margin:0 auto;text-align:center;text-align:center;

}



#colorNav > ul > li{ /* will style only the top level li */

	list-style: none;

	box-shadow: 0 0 10px rgba(100, 100, 100, 0.2) inset,1px 1px 1px #CCC;

	display: inline-block;

	line-height: 1.0;

	margin: 0.5%;max-width:14%;height:12%;padding-right:15px;

	border-radius: 10px;    border-style: solid;border-color:#045FB4;text-align:center;
    border-width: 1px;


	position:relative;text-align:center;

}






#colorNav > ul > li:hover{ /* will style only the top level li */

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+47,65b6d3+100 */
background: #eeeeee; /* Old browsers */
background: -moz-linear-gradient(top,  #eeeeee 47%, #65b6d3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #eeeeee 47%,#65b6d3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #eeeeee 47%,#65b6d3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#65b6d3',GradientType=0 ); /* IE6-9 */

}

#colorNav > ul > li > a .active{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+47,65b6d3+100 */
background: #eeeeee; /* Old browsers */
background: -moz-linear-gradient(top,  #eeeeee 47%, #65b6d3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #eeeeee 47%,#65b6d3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #eeeeee 47%,#65b6d3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#65b6d3',GradientType=0 ); /* IE6-9 */

}

.active p{color:#084B8A;}

#colorNav > ul > li > a{@import url(https://fonts.googleapis.com/css?family=Roboto);

	color:inherit;font-family: 'Roboto', sans-serif;

	text-decoration:none !important;

	text-align:center;
	padding: 10px;

}
@media (max-width:3000px){                                  

#colorNav{font-size:1.1em;text-align:center}}

@media (max-width:1024px){                                  
	#colorNav {font-size:0.6em;

}
}

#colorNav  ul  li  img{

width:80%

}
#colorNav li ul{

	position:absolute;

	list-style:none;

	text-align:center;

	width:180px;

	left:30%;

	margin-left:-90px;

	top:70px;

	font:bold 12px 'Open Sans Condensed', sans-serif;
}
	


#colorNav li ul{

	position:absolute;

	list-style:none;

	text-align:center;

	width:180px;

	left:30%;

	margin-left:-90px;

	top:70px;

	font:bold 12px 'Open Sans Condensed', sans-serif;

	

	/* This is important for the show/hide CSS animation */

	max-height:0px;

	overflow:hidden;

	

	-webkit-transition:max-height 0.4s linear;

	-moz-transition:max-height 0.4s linear;

	transition:max-height 0.4s linear;text-align:center

}



#colorNav li ul li{

	background-color:#313131;text-align:center

}



#colorNav li ul li a{

	padding:0px;margin-left:auto;margin-right:auto;

	color:#fff !important;

	text-decoration:none !important;

	display:block;text-align:center

}





#colorNav li ul li:nth-child(odd){ /* zebra stripes */

	background-color:#363636;	text-align:center;


}



#colorNav li ul li:hover{

	background-color:#444;

}



#colorNav li ul li:first-child{

	border-radius:3px 3px 0 0;

	margin-top:0;

	position:relative;	text-align:center;


}
#colorNav p{

text-align:center;margin-left:13px

}



#colorNav li ul li:first-child:before{ /* the pointer tip */

	content:'';

	position:absolute;text-align:center;

	width:1px;

	height:1px;

	border:5px solid transparent;

	border-bottom-color:#313131;

	left:50%;

	top:-10px;

	margin-left:-5px;	text-align:center;


}



#colorNav li ul li:last-child{

	border-bottom-left-radius:3px;

	border-bottom-right-radius:3px;	text-align:center;


}



/* This will trigger the CSS */

/* transition animation on hover */



#colorNav li:hover ul{

	max-height:200px; /* Increase when adding more dropdown items */

}





/*----------------------------

	Color Themes

-----------------------------*/





#colorNav li.green{

	/* This is the color of the menu item */

	background-color:#F3F3F3;

	/* This is the color of the icon */

	color:#127a5d;

	border: 1px groove #093;

}



#colorNav li.red{

	background-color:#F3F3F3;

	color:#aa2a52;

	border: 1px groove #900;

}

#colorNav li.blue{	background-color:#F3F3F3;color:#2884a2;	border: 1px groove #09C;

}

#colorNav li.yellow{	background-color:#F3F3F3;color:#ab8426;	border: 1px groove #FC0;

}

#colorNav li.purple{	background-color:#F3F3F3;color:#9f3c85;	border: 1px groove #609;

}

#colorNav li.orange{	background-color:#F3F3F3;color:#9f3c85;	border: 1px groove #F60;

}



#colorNav li.green:hover{

	/* This is the color of the menu item */

	background-color:#999999;

	/* This is the color of the icon */

	color:#127a5d;

	border: 1px groove #093;

}



#colorNav li.red:hover{

	background-color:#999999;

	color:#aa2a52;

	border: 1px groove #900;

}

#colorNav li.blue:hover{		background-color:#999999;color:#2884a2;	border: 1px groove #09C;

}

#colorNav li.yellow:hover{	background-color:#999999;color:#ab8426;	border: 1px groove #FC0;

}

#colorNav li.purple:hover{

	background-color:#999999;

	color:#9f3c85;

	border: 1px groove #609;

}

#colorNav li.orange:hover{	background-color:#999999;color:#9f3c85;	border: 1px groove #F60;

}

/