@charset "utf-8";
 nav, ul, li,   {margin: 0; padding: 0;}

.container {
    width: 90%;
    max-width: 900px;
    margin: 10px auto;
}
.toggleMenu {
    display:  none;
    background: #8b8989;
    padding: 10px 15px;
    color: #fff;
	width:100%;
	
}
 a:hover{
	 text-decoration:none;
	 color:#dedede;
	 }
.nav {
    list-style: none;
     *zoom: 1;
	 background-color:rgba(255, 255, 255, 0.93);
     
}
.nav:before,
.nav:after {
    content: " "; 
    display: table; 
}
.nav:after {
    clear: both;
}
.nav ul {
    list-style: none;
    width: 9em;
}
.nav a {
    padding: 10px 17px;
    color:#4c4c4c;
	
}
.nav li {
    position: relative;
}
.nav > li {
    float: left;
    
}
.nav > li > .parent {
    background-image: url("images/downArrow.png");
    background-repeat: no-repeat;
    background-position: right;
}
.nav > li > a {
    display: block;
	padding:11px 17px;
	font-family: 'Karla', sans-serif;   font-size:16px;
	text-transform:uppercase;
}
 .nav>li>a:hover, .nav>li >a:active{

	color:#30bede;
	
	


	}
	
	


.nav li  ul {
    position: absolute;
    left: -9999px;
}
.nav>li>a:focus, .nav>li>a:hover {
  
    background-color:inherit;
}
.nav > li.hover > ul {
    left: 0;
}
.nav li li.hover ul {
    left: 100%;
    top: 0;
}
.nav li li a {
    display: block;
    background: #1d7a62;
    position: relative;
    z-index:100;
    border-top: 1px solid #175e4c;
}
.nav li li li a {
    background:#249578;
    z-index:200;
    border-top: 1px solid #1d7a62;
}

@media screen and (max-width: 784px) {
    .active {
        display: block;
    }
    .nav > li {
        float: none;
    }
    .nav > li > .parent {
        background-position: 95% 50%;
    }
    .nav li li .parent {
        background-image: url("images/downArrow.png");
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }
    .nav ul {
        display: block;
        width: 100%;
    }
   .nav > li.hover > ul , .nav li li.hover ul {
        position: static;
    }

}

/*responsive*/



@media only screen and (min-width:  1331px)  and (max-width: 1355px)
{
	.nav > li > a {
		padding-left:16px;
		padding-right:16px;
}
}

@media only screen and (min-width:  1308px)  and (max-width: 1330px)
{
	.nav > li > a {
		padding-left:15px;
		padding-right:15px;
}
}

@media only screen and (min-width:  1286px)  and (max-width: 1307px)
{
	.nav > li > a {
		padding-left:14px;
		padding-right:14px;
}
}
@media only screen and (min-width:  1261px)  and (max-width: 1285px)
{
	.nav > li > a {
		padding-left:13px;
		padding-right:13px;
}
}
@media only screen and (min-width:  1238px)  and (max-width: 1260px)
{
	.nav > li > a {
		padding-left:12px;
		padding-right:12px;
}
}

@media only screen and (min-width:  1215px)  and (max-width: 1237px)
{
	.nav > li > a {
		padding-left:11px;
		padding-right:11px;
}
}

@media only screen and (min-width:  1191px)  and (max-width: 1214px)
{
	.nav > li > a {
		padding-left:10px;
		padding-right:10px;
}
}

@media only screen and (min-width:  1169px)  and (max-width: 1190px)
{
	.nav > li > a {
		padding-left:9px;
		padding-right:9px;
}
}
@media only screen and (min-width:  1146px)  and (max-width: 1168px)
{
	.nav > li > a {
		padding-left:8px;
		padding-right:8px;
}
}


@media only screen and (min-width:  1121px)  and (max-width: 1145px)
{
	.nav > li > a {
		padding-left:7px;
		padding-right:7px;
}
}

@media only screen and (min-width:  1100px)  and (max-width: 1120px)
{
	.nav > li > a {
		padding-left:6px;
		padding-right:6px;
}
}

@media only screen and (min-width:  1062px)  and (max-width: 1099px)
{
	.nav > li > a {
		padding-left:7px;
		padding-right:7px;
		font-size:15px;
}
}

@media only screen and (min-width:  1040px)  and (max-width: 1061px)
{
	.nav > li > a {
		padding-left:6px;
		padding-right:6px;
		font-size:15px;
}
}
@media only screen and (min-width:  1003px)  and (max-width: 1039px)
{
	.nav > li > a {
		padding-left:7px;
		padding-right:7px;
		font-size:14px;
}
}

@media only screen and (min-width:  983px)  and (max-width: 1002px)
{
	.nav > li > a {
		padding-left:6px;
		padding-right:6px;
		font-size:14px;
}
}

@media only screen and (min-width:  968px)  and (max-width: 982px)
{
	.nav > li > a {
		padding-left:8px;
		padding-right:8px;
		font-size:13px;
}
}

@media only screen and (min-width:  946px)  and (max-width: 967px)
{
	.nav > li > a {
		padding-left:7px;
		padding-right:7px;
		font-size:13px;
}
}
@media only screen and (min-width:  921px)  and (max-width: 945px)
{
	.nav > li > a {
		padding-left:6px;
		padding-right:6px;
		font-size:13px;
}
}

@media only screen and (min-width:  900px)  and (max-width: 920px)
{
	.nav > li > a {
		padding-left:5px;
		padding-right:5px;
		font-size:13px;
}
}

@media only screen and (min-width:  800px)  and (max-width: 899px)
{
	.nav > li > a {
		padding-left:6px;
		padding-right:6px;
		font-size:12px;
}
}
@media only screen and (min-width:  839px)  and (max-width: 899px)
{
	.nav > li > a {
		padding-left:5px;
		padding-right:5px;
		font-size:12px;
}
}

@media only screen and (min-width:  800px)  and (max-width: 838px)
{
	.nav > li > a {
		padding-left:5px;
		padding-right:5px;
		font-size:12px;
}
}
@media only screen and (min-width:  804px)  and (max-width: 838px)
{
	.nav > li > a {
		padding-left:6px;
		padding-right:6px;
		font-size:11px;
}
}
@media only screen and (min-width:  785px)  and (max-width: 803px)
{
	.nav > li > a {
		padding-left:5px;
		padding-right:5px;
		font-size:10px;
}
}
/*
@media only screen and (min-width:  700px)  and (max-width: 769px)
{
	.nav > li > a {
		padding-left:5px;
		padding-right:5px;
		font-size:10px;
}
}
8