/*
	Todd Motto Labs
	URL: www.toddmotto.com
*/


/*------------------------------------*\
    Flaunt JS Navigation
\*------------------------------------*/


ul#navigation {}
ul#navigation li {}
ul#navigation li:last-child{ margin-right:2px; }
ul#navigation li:hover{ background-color:grey; }   
ul#navigation a{ text-decoration:none; }
ul#navigation a:visited{ color:black; }
ul#navigation li a:hover{ color:#7A7A7A; }

.nav { float:left; width: 175px; margin-top: 54px; margin-left:30px;}
#start .nav {margin-top: 25px;}
.nav-list { text-align:left; }
.nav-item { *display:inline; zoom:1; position:relative; margin: 5px 0; height:33px;
		background: #fcfef3; /* Old browsers */ background: -moz-linear-gradient(top, #fcfef3 0%, #cfda97 23%, #cfda97 77%, #fcfef3 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #fcfef3 0%,#cfda97 23%,#cfda97 77%,#fcfef3 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #fcfef3 0%,#cfda97 23%,#cfda97 77%,#fcfef3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfef3', endColorstr='#fcfef3',GradientType=0 ); /* IE6-9 */ }
.nav a, .nav a:hover { text-decoration:none; font-family: Verdana, Arial;  }
.nav ul, .nav ol { list-style:none; margin-left:-20px;}

.nav-item a { display:block; padding: 7px 4px; color:black; }
.nav-item > a:hover {padding: 9px 4px;   }
.nav-item.active {color:#343a78; font-weight:bold; 
		background: #cfda97; /* Old browsers */ background: -moz-linear-gradient(top, #cfda97 0%, #fcfef3 17%, #fcfef3 80%, #cfda97 94%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #cfda97 0%,#fcfef3 17%,#fcfef3 80%,#cfda97 94%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to bottom, #cfda97 0%,#fcfef3 17%,#fcfef3 80%,#cfda97 94%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfda97', endColorstr='#cfda97',GradientType=0 ); /* IE6-9 */}
.nav-item:hover .nav-submenu { display:block; }
.nav ul .nav-submenu { 	display:none; position:absolute; margin-left:0px; top:40px; z-index:10; border:3px solid #343a78; margin-left:0; white-space:nowrap;}
.nav-submenu-item a { background:#FFF; border-bottom:1px solid #343a78; display:block; padding:15px; color:#343a78;}
.nav-submenu-item a:hover { background:#CCCCCC; }
.nav-mobile { display:none; /* Hide from browsers that don't support media queries */ cursor:pointer; position:absolute; top:0; right:0; background-size:18px; height:50px; width:50px;font-size:20px; z-index:20;}
.nav-click { position:absolute; top:0; right:0; display:none; border-left:1px solid white; height:52px; width:50px; cursor:pointer; }
.nav-click i { display:block; height:48px; width:48px; background:url(../img/drop.png) no-repeat center center;	background-size:20px; }
.nav-click:hover { background-color:gray; }
.nav-rotate { -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg); transform:rotate(180deg); }


@media only screen and (min-width: 310px) and (max-width: 766px) {
	    
	.nav-mobile { display:block; padding:7px; background: rgb(125,125,125) url(../img/nav.png) no-repeat center center;	}
	.nav { width:98%; padding:0; z-index: 2; margin:0; top:0; }
	.nav-list { display:none;	position: absolute; width: 300px; right: 0px; top: 64px; z-index: 20; margin: 0; background-color: white; padding: 0; border: 1px solid black;	}
	.nav-item { width:100%; height:44px;  }
	.nav-item a { padding: 13px 4px; }
	.nav-item > a:hover {  background-color: none; padding: 15px 4px;}
	.nav-item.active> a { }
	.nav-click { display:block; }
	.nav-mobile-open { border-radius:5px 5px 0 0; -webkit-border-radius:5px 5px 0 0; -moz-border-radius:5px 5px 0 0; }
	.nav-item:hover .nav-submenu { display:none; }
	.nav-submenu { 	position:static; width:294px; }
	.nav ul .nav-submenu {top:52px;}
}