/*Menu Structure*/
    .header-ex5 .Navigation { float:left; clear:both; width:100%; height:190px; z-index:3; } 

        /*Menu Elements*/
        .header-ex5 .Navigation .elements { height:250px; width:100%; margin-top:0px; }
        
		/*Phone*/      
			.header-ex5 .Navigation .elements .phone { width:100%; background:#ddd; text-align:right; padding-right:270px; height:80px; }
				.header-ex5 .Navigation .elements .phone a { display:inline-block; font-size:36px; color:#000; text-decoration:none; padding:20px; }
					.header-ex5 .Navigation .elements .phone a:hover { color:#fff; }			
		
		/*SearchContainer*/
			.header-ex5 .Navigation .elements .searchContainer { width:270px; height:200px; position:absolute; right:0; top:0; background:#000; }
				.header-ex5 .Navigation .elements .searchContainer a { color:#fff; text-decoration:none; font-size:30px; font-weight:600; padding:20px 40px; text-align:left; width:80%; display:table; border-bottom:1px solid #fff; margin:0 auto; }
		
		/*MenuContainer*/
			.header-ex5 .Navigation .elements .menuContainer { width:100%; background:#fff; display:flex; padding-right:270px; padding-left:60px; border-bottom:1px solid #ccc; height:110px; }
		
		/*Logo*/
            .header-ex5 .Navigation .elements .logo { width:110px; padding-top:3px; }
				.header-ex5 .Navigation .elements .logo a { width:100%; } 
					.header-ex5 .Navigation .elements .logo a img { width:100%; }
				

		/*Menu*/
            .header-ex5 .Navigation .elements .menuNav { width:100%; display:flex; justify-content:flex-end; }
                .header-ex5 .Navigation .elements .menuNav .menu { display:inline-block; float:right; clear:right; }
                    .header-ex5 .Navigation .elements .menuNav .menu > ul { padding:0; height:100%; }
                        .header-ex5 .Navigation .elements .menuNav .menu > ul > li { margin:0;  display:inline-block; text-align:left; padding:0; height:100%; margin-left:-6px; }
								.header-ex5 .Navigation .elements .menuNav .menu > ul > li > a { height:100%; border-right:1px solid #ccc; padding:43px 30px 0 30px; font-size:22px; font-weight:500; color:#261e07; text-decoration:none; margin:0; transition: color 0.15s ease-out; }
									
									
							.header-ex5 .Navigation .elements .menuNav .menu .mobilePhone { display:none; }
					
							/*Sub Menu*/
                            .header-ex5 .Navigation .elements .menuNav .menu ul li ul { background-color:#fff;  margin-left:0px; padding:0; border-radius:0; }
								.header-ex5 .Navigation .elements .menuNav .menu ul li ul li { padding:0; }
									.header-ex5 .Navigation .elements .menuNav .menu ul li ul li a { color:#000; transition: height 0.20s ease-out; background:none; margin-left:0; font-size:19px; padding:15px; }
								
								
								
								
								
        /*Snap Header Styles*/
        .header-ex5 .Navigation .fixed { position:fixed; top:0; left:0; right:0; box-shadow:0 0 15px #666; }
            .header-ex5 .Navigation .fixed .elements { background:#fff ; margin-top:0px; height:170px; }
			
				.header-ex5 .Navigation .fixed .elements .logo { margin-top:0px; padding-top:0; width:570px; top:10px; }
					.header-ex5 .Navigation .fixed  .elements .menuNav .menu > ul > li > a { padding:36px 30px 0 30px; }
				.header-ex5 .Navigation .fixed .elements .menuContainer { height:90px; }
				
		/*Search Styles*/
		.header-ex5 .Navigation .searchContainer .searchIcon { width:40px; display:block; padding-top:12px; }
		.header-ex5 .Navigation .searchContainer .searchIcon img { width:100%; }
		
		.header-ex5 .Navigation .searchContainer form { float: right; clear: both; position:relative; margin:0 auto; display:block; width:94%; margin-top:10px; }
			.header-ex5 .Navigation .searchContainer form input { width: 184px; height: 50px; margin:0 -1px 0 0; padding:0 5px; text-overflow:ellipsis; font-size:24px; float: left; position: relative;  border: 1px solid #c6c6c6; border-right:0; background: #eeeeee; color: #000; outline: none; border-top-left-radius:10px; border-bottom-left-radius:10px; }
			.header-ex5 .Navigation .searchContainer form button { float: left; right: 0; cursor: pointer;  width: 55px; height: 50px; font-size: 0; background:#000 url("../Images/searchIconWhite.png") center center no-repeat; background-size: contain; border: 1px solid #c6c6c6; transition:all 0.15s ease; border-top-right-radius:10px; border-bottom-right-radius:10px; }
			.header-ex5 .Navigation .searchContainer form button:hover { background-color:#333; }
			 
			.header-ex5 .Navigation .searchContainer  #searchChk { display:none; }
			.header-ex5 .Navigation .searchContainer  .close { display:none; }	
			
				.header-ex5 .searchContainer .popContainer { position:fixed; top:0; right:0; bottom:0; left:0; background-color:rgba(0,0,0,0.5); display: none; opacity:0; justify-content: center; align-items: center; align-content: center; flex-wrap:wrap; z-index:-9999; }
				.header-ex5 .searchContainer .popContainer > div { position:relative; display:none; }

				.header-ex5 .searchContainer .popContainer form { padding:20px 30px; background-color:#fff; border:1px solid #000; border-radius:10px; box-shadow: 0px 10px 5px -5px rgba(0,0,0,0.75); }
				.header-ex5 .searchContainer .popContainer form:before { content:"Site Search"; display:block; text-align:left; color:#000; width:100%; margin-bottom:10px; font-weight:500; }
				.header-ex5 .searchContainer .popContainer label { position:absolute; top:-10px; right:-10px; background-color:#f00; border:1px solid #000; border-radius:100px; width:30px; height:30px; display:flex; justify-content:center; align-items:center; color:#fff; user-select:none; cursor:pointer; }

				.header-ex5 .searchContainer input[type="checkbox"]:checked ~ .popContainer { display: flex; transition: all ease 0.25s; transition-delay:0.15s; opacity:1; z-index:9999; }
				.header-ex5 .searchContainer input[type="checkbox"]:checked ~ .popContainer > div { display:block; }
				.header-ex5 .searchContainer input[type="checkbox"]:checked ~ .popContainer form { display:block; }
				.header-ex5 .searchContainer input[type="checkbox"]:checked ~ .popContainer .close { display:flex; }
				
				
				
				
				
				
/*----Responsive for Header----*/
@media only screen and (max-width: 1679px) {
	.header-ex5 .Navigation .elements .menuNav .menu > ul > li > a { padding:43px 20px 0 20px; }
	.header-ex5 .Navigation .fixed  .elements .menuNav .menu > ul > li > a { padding:36px 20px 0 20px; }
}

@media only screen and (max-width: 1279px) {
	.header-ex5 .Navigation .elements .menuContainer { flex-wrap:wrap; }
    .header-ex5 .Navigation .elements .logo { width:190px; }
	
	.header-ex5 .Navigation .elements .menuNav { margin-top:-3px; }
	
	.header-ex5 .Navigation .fixed .elements .logo { width:190px; }
	.header-ex5 .Navigation .elements .menuNav .menu > ul > li > a { padding:10px 20px 0 20px; }
	.header-ex5 .Navigation .fixed  .elements .menuNav .menu > ul > li > a { padding:10px 20px 0 20px; }
}





@media only screen and (max-width: 992px) {
	.header-ex5 .Navigation { height:110px; }
	.header-ex5 .Navigation .elements { height:70px; background:#fff; }
	.header-ex5 .Navigation .elements .searchContainer { display:none; }
	.header-ex5 .Navigation .elements .menuContainer { padding:0; }
		.header-ex5 .Navigation .elements .logo { width:150px; padding-top:30px; padding-left:30px; }
		.header-ex5 .Navigation .elements .phone { display:none; }
		.header-ex5 .Navigation .elements .quote { margin-right:30px; }
			.header-ex5 .Navigation .elements .quote a { margin-top:9px; }
		.header-ex5 .Navigation .elements .menuNav { border:0; background:transparent; height:70px; width:140px; margin-top:0; position:absolute; right:30px; top:20px; }
			.header-ex5 .Navigation .elements .menuNav .menu { padding-top:4px; }
				.header-ex5 .Navigation .elements .menuNav .menu > ul > li { height:auto; }
				.header-ex5 .Navigation .elements .menuNav .menu > ul > li > a { border-right:none; }
				.header-ex5 .Navigation .elements .menuNav .menu ul li a { margin-top:0; padding:13px; margin-left:0; }
				
				.header-ex5 .Navigation .elements .menuNav .menu ul li ul { margin-left:0; background-color:#fff; }
				.header-ex5 .Navigation .elements .menuNav .menu ul li ul li { padding:5px 0; }
					.header-ex5 .Navigation .elements .menuNav .menu ul li ul li a { color:#000; padding-left:30px; }
		
		.header-ex5 .Navigation .elements .menuNav .menu .mobileMenu::after { background:transparent url(../Images/menuIcon2.png) center center no-repeat; }
        
		.header-ex5 .Navigation .elements .menuNav .menu .callAndClose { background-color:#fff; border-bottom:1px solid #000; }
			.header-ex5 .Navigation .elements .menuNav .menu .callAndClose .callBtn { background-color:transparent; border:2px solid #000; border-radius:0; margin-top:3px; }
				.header-ex5 .Navigation .elements .menuNav .menu .callAndClose .callBtn::after { color:#000; }
		
		.header-ex5 .Navigation .elements .menuNav .menu ul.stMobileMenu { background-color:#fff; font-size:21px; padding:13px 20px; }
	
	.header-ex5 .Navigation .fixed .elements .logo { width:270px; padding-top:28px; }
	.header-ex5 .Navigation .fixed .elements { height:110px; }
	.header-ex5 .Navigation .fixed .elements .menuContainer { height:110px; }
}





@media only screen and (max-width: 768px) {
    .header-ex5 .Navigation .elements .logo { left:30px; }

	.header-ex5 .Navigation .elements .menuNav { width:100px; }
		.header-ex5 .Navigation .elements .menuNav .menu { padding-right:0px; }
}





@media only screen and (max-width: 480px) {
	.header-ex5 .Navigation .elements .logo { width:80px; left:10px; }
	
	.header-ex5 .Navigation .elements .quote { margin-right:20px; }
		.header-ex5 .Navigation .elements .quote a { padding:6px 10px; }
	
	.header-ex5 .Navigation .elements .menuNav { width:70px; }
		.header-ex5 .Navigation .elements .menuNav .menu { padding-right:0px; }
}