#cssmenu { width: 100%;   margin:0px 0px  0px 0px; float:left;  }
#cssmenu #menu-button { display: none;}

#nav { display: block; width:100%;  list-style: none; padding:0px; margin: 0 auto; z-index:99999;}
#nav li { display: inline-block; float:left; margin: 0; padding: 0; }
#nav > li > a { position:relative; display:block; color: #fcfcfc; font-size: 15px; line-height:20px; padding:15px 25px;}
#nav > li > a:hover {  color:#fed700; }
#nav li:hover > ul { display:block; -webkit-animation-name:showAnimation; -webkit-animation-duration: .5s;}

#nav ul { position: absolute; display:none; z-index: 1000; left: auto; top:auto; width:400px; padding: 0; margin: 0;}
#nav ul li { display:block; float:left; position: relative; margin: 0; padding: 0;}
#nav ul li a { display:block; width:260px; padding: 5px 10px; font-size: 15px; color: #484848; border-bottom: 1px solid #eeeeee; background: #CCE6FF;}
#nav ul li a:hover { color: #1A1A1A; background: #f2f2f2;}

#nav ul ul { position: absolute; display:none; z-index: 1000; left: 200px; top:0; width:200px; padding: 0; margin: 0;}
#nav ul ul li { display:block; float:left; position: relative; margin: 0; padding: 0;}
#nav ul ul li a { display:block; width: 180px; padding: 5px 10px; font-size: 14px; color: #484848; border-bottom: 1px solid #eeeeee; background: #C1C1C1;}
#nav ul ul li a:hover { color: #1A1A1A; background: #f2f2f2;}

#cssmenu li a.has-sub::after { display: block; content: ""; position:absolute; width: 0; height: 0; top: 23px; right:0px; border: 5px solid transparent; border-top-color: #ffffff;}
#cssmenu > ul > li:hover::after { border-top-color: #ffffff;}


.p1 #p1,.p2 #p2,.p3 #p3,.p4 #p4,.p5 #p5,.p6 #p6,.p7 #p7{ color:#fed700; }

@media only screen and (max-width: 1300px) {
	#nav > li > a { font-size: 15px; padding:11px 18px;}
}


@media only screen and (max-width: 1120px) {
	#nav > li > a { font-size: 15px; padding:10px 16px;}
}

@media only screen and (max-width: 1015px) {
	#nav > li > a { font-size: 15px; padding:10px 13px;}
}

@media only screen and (max-width: 950px) {
	#nav > li > a { font-size: 15px; padding:10px 24px;}
	#quick{ margin-right:0px;}
	#cssmenu { width: 100%;}
	#cssmenu li a.has-sub::after { display: block; content: ""; position:absolute; width: 0; height: 0; top: 23px; margin-left:67px; border: 5px solid transparent; border-top-color: #ffffff;}
}

@media only screen and (max-width: 750px) {
	#nav > li > a { font-size: 15px; padding:10px 16px;}
}

@media all and (max-width: 650px){
	#cssmenu{ width:100%; margin:0px; float:left; min-height:35px; background: #087dc2;}
	#cssmenu #menu-button { display: block; cursor: pointer; border:none; float:left; width:100%;}
	#cssmenu #menu-button > a { padding:0px; border:none; background:none; float:right; margin-top:-35px; margin-left:15px; width:100%;}
	#cssmenu #menu-button #menubarwd{ float:left; padding-left:15px; padding-top:5px; font-size:15px; color:#FFFFFF; }
	#cssmenu #menu-button img{float: right;padding-right: 20px;}
    #cssmenu ul.open li, #cssmenu > ul.open > li { display: block; }
    #cssmenu ul ul::after { display: none; }
	
	#cssmenu li a.has-sub::after{ right:35%;}
	
	#nav { display: block; margin:40px 0px 0px 0px; }
	#nav li, #nav > ul > li { display: none; width:100%; margin:0px; padding:0px; border-bottom:1px solid #fff; }
	
	#nav > li > a{ color:#F2F2F2; margin:0px; padding: 12px 15px; text-align:center; border:none; font-size:15px; background:#3e724e; -webkit-animation-name: showSubMenu; -webkit-animation-duration: .5s;}
	#nav > li > a:hover{ color:#ffffff; background:#f1c741;}
	#col2{ width:100%; float:left;}
	#nav .lev { position: relative;}

}

@media only screen and (max-width: 450px) {
	#col1{ width:100%;}
	#cssmenu li a.has-sub::after{ right:29%;}
}

@media only screen and (max-width: 300px) {
	#quick{ width:150px; margin:10px 0px; overflow:hidden;}
	#quick #search{ width:110px; margin:0px;}
}

.lev { -webkit-animation-name:showAnimation; -webkit-animation-duration: .6s; }
  
@-webkit-keyframes showAnimation {
	0% { transform:scaleY(0.1); }
	40% { transform:scaleY(1.04); }
	60% { transform:scaleY(0.90); }
	80% { transform:scaleY(1.08); }
	100% { transform:scaleY(0.98); }				
	80% { transform:scaleY(1.04); }
	100% { transform:scaleY(1); }
}

@-webkit-keyframes showSubMenu {
    0% { transform: scale(0,0); }
  100% { transform: scale(1,1); }
}

@-webkit-keyframes hideSubMenu {
  0% { transform: scale(1,1); }
  100% { transform: scale(0,0); }
 
}