.topgreybar {
	position: relative;
	top: 0px;
	left: 0px;
	display: block;
	width: 100%;
	height: 219px;
	padding:0px;
	margin: 0px;
	z-index: 90;
}

.hr_topmenu {
	position: relative; 
	top: 20px; 
	margin-left: 3%; 
	float: none; width:97%; 
	max-width:1388px;
}

.fslash {
	display: table; 
	position: absolute; top:10%; 
	left: -5%; 
	font-weight: bold; 
	font-size: 30px; 
	color: #FFD101;'
}

.ctayellow {
		display: relative;
		position: absolute;
		background: rgb(252,193,56);
		text-align: center;
		font-weight: bold;
		line-height: 50px;
		width: 231px;
		height: 50px;
		right:16%;
		top: 36px;
		z-index:20000;
		color: #000000 !important;
		transform: scale(1);
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-o-transform: scale(1);
		transition: all 0.3s ease-in-out;
		/*display: none;*/
}

.ctayellow A:link,
.ctayellow A:visited,
.ctayellow A:active,
.ctayellow A:hover {
	color: rgba(0,0,0,1);
  text-decoration: none;
  font-size: 18px;
 }
 
.ctayellow:hover {
	opacity: 70%;
	transform: scale(0.9);
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-o-transform: scale(0.9);
	transition: all 0.3s ease-in-out;
}

.ctaphone {
	position: absolute;
	top: 9px;
	left: 10px;
	float: left;
	display: block;
	width: 36px;
	height: 33px;
	margin-left: 3%;
	background-image: url("../../images/ctaphone.png");
	background-size: 36px 33px;
	background-repeat: no-repeat;
	
}



.topbar {
	position: relative;
	display: table;
	width: 100%;
	max-width: 1475px;
	height: 219px;
	padding:0px;
	/*padding-left: 3%;*/
	margin: 0px auto;
	z-index: 100;
	/*background: rgba(255,0,255,0.2);*/
}

.topbarmob {
	display: none;
	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 40px;
	z-index: 10000;
	margin: 0px auto;
	/*background: rgb(255,255,255);*/
}

.helogo {
	position: relative;
	float: left;
	display: block;
	top: 25px;
	width: 247px;
	height: 87px;
	margin-left: 3%;
	background-image: url("../../images/wf_logo.png");
	background-size: 247px 87px;
	background-repeat: no-repeat;
	transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	transition: all 0.3s ease-in-out;
}

.helogo:hover {
	opacity: 70%;
	transform: scale(0.9);
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-o-transform: scale(0.9);
	transition: all 0.3s ease-in-out;
}

.menuicon {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 100000;
	float: left;
	display: block;
	width: 38px;
	height: 40px;
	margin-right: 0px;
	background-image: url("../../images/menuicon_mob.png");
	background-size: 38px 40px;
	background-repeat: no-repeat;
}

.heaccount {
	position: absolute;
	float: right;
	display: block;
	width: 57px;
	height: 60px;
	right: 70px;
	top: 45px;
	margin-right: 0%;
	background-image: url("../../images/wf_account_mob.png");
	background-size: 32px 33px;
	background-repeat: no-repeat;
	transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	transition: all 0.3s ease-in-out;
}

.heaccount:hover {
	opacity: 70%;
	transform: scale(0.9);
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-o-transform: scale(0.9);
	transition: all 0.3s ease-in-out;
}

.hecart {
	position: absolute;
	float: right;
	display: block;
	right:20px;
	top: 45px;
	width: 57px;
	height: 60px;
	margin-right: 0%;
	background-image: url("../../images/wf_cart_mob.png");
	background-size: 32px 33px;
	background-repeat: no-repeat;
	transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	transition: all 0.3s ease-in-out;
}

.hecart:hover {
	opacity: 70%;
	transform: scale(0.9);
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-o-transform: scale(0.9);
	transition: all 0.3s ease-in-out;
}

.hesearch {
	float: right;
	display: block;
	width: 57px;
	height: 60px;
	margin-right: 5px;
	background-image: url("../../images/wf_search.png");
	background-size: 57px 60px;
	background-repeat: no-repeat;
}

.hesearch:hover {
	background-image: url("../../images/wf_search_hov.png");
}

#container {
	width: 100%; 
	float: left;
	position: relative;
	margin-top: 12px;
	z-index:10000;
	/*background: rgba(100,100,100,1);*/
}

.menucontainer {
	display: table;
}

.menucontainer:target{
    display: table;
}
/*
.menuicon {
	display: none;
	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 40px;
	z-index: 10000;
}*/

#navbar {
	width: 94.1%;
	position: relative;
	top: 0px;
	left:0px;
	display: table;
	margin: 0px auto;
	font-size: 15px;
	/*rgb(242,242,242);*/
	/*background: rgba(0,255,242,0.5);*/
}

#navbar ul, #navbar li {
	list-style: none; 
}

.subyellow  {
	background: rgb(252,193,56) !important;
	color: rgb(100,100,100) !important;
	/*font-weight: bold !important;*/
	/*color: rgb(253,206,37) !important;
	font-weight: bold;*/
}

.subyellow:hover  {
	background: rgb(0,0,0) !important;
	color: rgb(255,255,255) !important;
	/*font-weight: bold !important;*/
	/*color: rgb(253,206,37) !important;
	font-weight: bold;*/
}


#nav {
    margin: 0px auto;
    width: 100%;
    z-index: 10;
    display: table;
    padding-left: 0px;
  	/*background: rgba(255,0,242,0.5);*/
}
    		#nav li { float: left; width: 12.5%; text-align: center;} 
   		
        #nav li:hover { position: relative;}
        #nav li:hover > a { 
            /*background: rgba(100,100,100,1);*/
            /*color: #000000;*/
            /*font-weight: bold;*/
            border-bottom: 2px solid rgb(252,193,56);
            
            /* smooth rollovers */
            transition: background-color 0.3s ease;
            -webkit-transition: background-color 0.3s ease;
            -moz-transition: background-color 0.3s ease;
            -o-transition: background-color 0.3s ease;
            -ms-transition: background-color 0.3s ease;
						/*********************/
						
            /*box-shadow: 5px 5px 25px #555;
            -moz-box-shadow: 5px 5px 25px #555;
            -webkit-box-shadow: 5px 5px 25px #555;*/
    
            /*border-radius: 5px;
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px; */
                             
        }
            #nav li.sub:hover > a {
                /*border-radius: 5px 5px 0 0;
                -moz-border-radius: 5px 5px 0 0;
                -webkit-border-radius: 5px 5px 0 0; */
            }
            
            #nav li.subb:hover > a {
                /*border-radius: 5px 5px 5px 5px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;*/
            }

            #nav li a {
                /*color: #FFFFFF;*/
                color: rgb(255,255,255);
                font-weight: normal;
                text-decoration: none;
                padding: 12px;
                display: block;
            }
            #nav li a:hover { 
            	color: rgb(252,193,56);
            	/*background-color: rgba(100,100,100,1);*/
            }        
                    
    #nav li ul { 
        background: rgba(255,255,255,0.8); 
        margin-top: 0px;
        margin-left: 0px;
        display: none;
        
    }
        #nav li:hover ul {
            display:block; 
            position:absolute; 
        }

        #nav li ul {
            background: rgba(255,250,227,0.85); 
            padding: 10px 5px;
            
            box-shadow: 5px 5px 25px #777;
            -moz-box-shadow: 5px 5px 25px #777;
            -webkit-box-shadow: 5px 5px 25px #777;
            
            /*border-radius: 0px 5px 5px 5px;
            -moz-border-radius: 0px 5px 5px 5px;
            -webkit-border-radius: 0px 5px 5px 5px;*/
        }
            #nav li ul li a,
            #nav li ul li a:hover {
                background: transparent;
                color: rgb(100,100,100);
                width: 150px;
                font-size: 0.9em;
                font-weight: normal;
                font-style: italic;
            }
              
                #nav li ul li a:hover { 
                	  text-decoration: none; 
                		background: #000000;
                		color: #FFFFFF; 
                   /* box-shadow: 5px 5px 25px #EEE;
                    -moz-box-shadow: 5px 5px 25px #EEE;
                    -webkit-box-shadow: 5px 5px 25px #EEE;*/
                            
                    /*border-radius: 5px 5px 5px 5px;
                    -moz-border-radius: 5px 5px 5px 5px;
                    -webkit-border-radius: 5px 5px 5px 5px;*/

                }

/*@media screen and (max-width: 1625px) {
	#container {
		width: 65%; 
	}	
	#navbar {
		width: 97%;
	}
}*/

/*@media screen and (max-width: 1460px) {
	#container {
		width: 60%; 
	}	
	#navbar {
		width: 100%;
	}
}*/

/*@media screen and (max-width: 1400px) {
	#container {
		width: 63%; 
	}	
	#navbar {
		width: 100%;
	}
  
}*/

/*@media screen and (max-width: 1300px) {
	.topbar {
		height: 110px;
	}
	
	.ctayellow {
		display: table;
		right: 2%;
		bottom: 10px;
	}
}*/

@media screen and (max-width: 1140px) {

	.fslash {
		top:12%; 
		left: -7%; 
		font-size: 28px; 
	}
	.subyellow  {
		display: none;
	}
	
	.topbar {
		height: 110px;
		/*background: rgba(0,0,0,0.5);*/
	}
	
	.ctayellow {
		display: table;
		right: 2%;
		top: 86px;
	}
	
	.hr_topmenu {
		top: 52px; 
	}
	
	#container {
		margin-top: 45px;
	}
	/*#container {
		width: 52%; 
	}
	
	#navbar {
		width: 100%;
		position: relative;
		top: 0px;
		left: 0px;
		display: table;
		margin: 0px auto;
		font-size: 15px;
	}*/
  
    
  #nav li a {
		/*color: #FFFFFF;*/
		font-weight: normal;
		text-decoration: none;
		padding: 12px;
		padding-right: 8px;
		padding-left: 5px;
	}
}

@media screen and (max-width: 880px) {

	
	#navbar {
		width: 100% !important;
		position: relative;
		top: 0px;
		left: 0px;
		display: table;
		margin: 0px auto;
		font-size: 15px;
	}
	
	/*#container {
		width: 70%; 
	}	*/
	
  #nav li a {
		/*color: #FFFFFF;*/
		font-weight: normal;
		text-decoration: none;
		padding: 12px;
		padding-right: 8px;
		padding-left: 5px;
	}

}

@media screen and (max-width: 800px) {

	
	#navbar {
		width:90%;
		position: relative;
		top: 0px;
		left: 0px;
		display: table;
		margin: 0px auto;
		font-size: 13px;
	}
  
    
  #nav li a {
		/*color: #FFFFFF;*/
		font-weight: normal;
		text-decoration: none;
		padding: 12px;
		padding-right: 8px;
		padding-left: 5px;
	}
}

/*@media screen and (max-width: 660px) {
	#navbar {
		font-size: 13px;
	}
	
	.fslash {
		top:15%; 
		left: -6%; 
		font-size: 23px; 
	}
	
	#container {
		width: 68%; 
	}	
}*/

@media screen and (max-width: 660px) {
	.hecart,
	.heaccount,
	.hesearch {
		display: block;
	}
	
	#container {
		width: 68%; 
	}	
	
	#mobcontainer {
		width: 100%; 
		position: absolute;
		top: 40px; 
		left: 0px;
		background: rgba(0,0,0,0.8);
	}	
	.ctayellow {
		display: none;
	}
	
	#navbar {
		width: 90%;
		position: relative;
		top: 0px;
		left: 0px;
		display: table;
		margin: 0px auto;
		font-size: 12px;
	}
		
	#nav li { 
		float: none;
		width: 100%;
	} 
	.menucontainer {
		display: none;
		z-index:0;
	}

	.topbarmob {
		display: block;
		background: rgba(0,0,0,0.5);
		height: 110px;
	}
	.topgreybar,
	.topbar {
		height: 120px;
	}
	
	.helogo {
		top: -10px;
		left: 0px;
		float: none;
		width: 124px;
		height: 44px;
		margin: 0px auto;;
		background-image: url("../../images/wf_logo.png");
		background-size: 124px 44px;
	}
	.heaccount,
	.heaccount:hover {
		float: left;
		width: 57px;
		height: 60px;
		right:60px;
		top: 55px;
		margin: 0px;
		background-image: url("../../images/wf_account_mob.png");
		background-size: 32px 33px;
	}
	.hesearch,
	.hesearch:hover {
		float: left;
		width: 32px;
		height: 33px;
		margin: 0px;
		background-image: url("../../images/wf_search_mob.png");
		background-size: 38px 40px;
	}
	.hecart,
	.hecart:hover {
		float: left;
		width: 57px;
		height: 60px;
		margin: 0px;		
		right:20px;
		top: 55px;
		width: 57px;
		height: 60px;
		margin-right: 0%;
		background-image: url("../../images/wf_cart_mob.png");
		background-size: 32px 33px;
		background-repeat: no-repeat;
	}
}