/* Navigation */ 
.top-pad {margin-top:80px;}
    .navigation {background-color:#fff;  display: -webkit-box;display: -ms-flexbox;display: flex; justify-content:space-between;}
    .logodiv, .navdiv{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;}
    .logodiv {display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;  }
    .logo {max-width:70%;padding-top:10px;}
    .searchbox {position: absolute; height:50px; top:70px; left:10px;}

    .logosize {max-width:300px;}
    .searchbox {-ms-flex-item-align:center;align-self:center; x-index:8888; }
    .logodiv {-ms-flex-item-align:center;align-self:center; }
    
    #nav {position:fixed; top:0px; right:0px; font-size:1.6rem; line-height:3.2rem; z-index:6666;
	color: #333; text-transform: uppercase; font-family:bebas_neueregular, Verdana, Geneva, sans-serif; 
	width:100%; height:auto;}

	#nav ul li {
		display: inline-block;
		list-style-type: none;
		padding:0px; margin:0px;
	}
		#nav ul li a {
			color: #333;
			display: block;
			line-height: 12px;
			text-decoration: none;
		}

        .mobile-menu-link {display:block; text-decoration:none; color:#333; 
        position:relative; z-index: 100; height:60px;} 

        .mobile-menu-link:hover, .mobile-menu-link:visited {color:#333;}   
        ul.menu-large {display:none;}
        #nav li ul {display:none;}
		
		.open ul {      
        color:#333;
        font-size:1.5rem;
        display: block;
        z-index: 9000; 
        position:relative;  
        }
        
        .mobile-home {margin-bottom:16px; margin-top:20px;}
        #nav.open ul li { display: block; list-style: none; text-align: center; width:100%; padding: 14px 2px; border-bottom: 1px solid #888;}
        #nav.open ul li a, .mobile-home { display: inline-block; padding: 4px; color:#333!important; text-decoration: none;  }
        #nav.open ul li a:hover, #nav.open ul li a:active, .mobile-home:hover, .mobile-home:active  { color: #333;}
        #nav.open li ul {display:none;}

         /* lines menu icon */

    	.nav-opener {
    		top: 26px;
    		right: 20px;
    		z-index: 101;
    		display: inherit;
    		position: absolute;
    		text-indent: -9999px;
    		width: 40px;
    		height: 40px;


    	}
    
    	.nav-opener:before,
    	.nav-opener:after,
    	.nav-opener span {
    		top: 7px;
    		left: 0;
    		right: 0;
    		height: 3px;
    		z-index: 101;
    		position: absolute;
    		background: #333;
    		-webkit-transition: all .2s linear;
    		transition: all .2s linear;
    	}
    
    	.nav-opener:before,
    	.nav-opener:after {
    		content: "";
    		top: 0;
    	}
    
    	.nav-opener:after {
    		top: 14px;
    	}
    
    	.nav-opener.overlay {
    		opacity: 0;
    		padding: 0;
    		z-index: 8899;
    		position: fixed;
    		visibility: hidden;
    		top: 60px;
    		left: 0;
    		right: 0;
    		bottom: 0;
    		bottom: auto;
    		width: auto !important;
    		height: 9999px !important;
    		-webkit-transition: all .25s linear;
    		transition: all .25s linear;
    	}
    	

	.nav-opener.overlay:hover {
		opacity: 1;
		background: rgba(255, 255, 255, .95);
	}

	.nav-opener.overlay:after,
	.nav-opener.overlay:before {
		display: none;
	}

	/* close button transition */
	.open .nav-opener {
		height: 16px;
	}

	.open .nav-opener span {
		opacity: 0;
	}

	.open .nav-opener:hover {
		opacity: .9;
	}

	.open .nav-opener:after,
	.open .nav-opener:before {
		top: 7px;
		background: #333;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	.open .nav-opener:after {
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
    
    .open .overlay {
		opacity: 1;
		visibility: visible;
		background: rgba(255, 255, 255, .95);
	}		

/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}


/* Larger than tablet */
@media (min-width: 750px) {

     /* Navigation changes from line menu to on page */
    .mobile-menu-link {display:none;}
    .nav-opener {display:none;}
    .nav-search {display:none;}
     ul.menu-large {display:inline-block; width: 100%;}
     
     #nav {position:relative;}
     #nav > ul
			{ text-align:center; 
				height: 7.8em;
				margin: 0px;	list-style:none; 
				display: -webkit-box;display: -ms-flexbox;display: flex;
			}
				#nav > ul > li
				{
                    -webkit-box-flex: 1;-ms-flex: 1 1 0;flex: 1 1 0;
					height: 100%;
					border-right: 1px solid #dcdddd;
					background-color:#fff;	
					max-width:16.6%;
					box-sizing: border-box;
					display: -webkit-box;display: -ms-flexbox;display: flex;
					padding:5px;
				}
				
					#nav > ul > li > a
					{	padding:20px 0px;
						text-decoration:none;
						color: #504e4e;
				        font-size:15px;
				        line-height:20px;
						font-weight:normal;
						background: url(../img/site/nav-arrow.png) no-repeat;
						background-position:50% 68%; 
					    -webkit-transition: all 0.5s; /* Safari */
                        transition: all 0.5s;
                        width:100%;
					}
					
				#nav > ul > li:first-child 
				{border-left: 1px solid #dcdddd;
				}
				#nav > ul > li a:hover 
						{background-position:50% 94%; }
					#nav > ul > li:hover 
						{background-color: #dcdddd;  }
						
						
			/* second level */

				#nav li ul
				{
					background-color: #d6d7d7;
					display: none;
					position: absolute;
					top: 100%;
					margin:0px;
					font-family:Arial, Helvetica, sans-serif;
					list-style:none;
					-webkit-transition: all 0.5s; /* Safari */
    transition: all 0.5s;
					
				}
					#nav li:hover ul
					{
						
						left: 0;
						right: 0;
						display: block;
    animation-duration: 1s;
    animation-name: fadeInFromNone;
    animation-fill-mode: forwards;
    -webkit-animation-duration: 1s;
    -webkit-animation-name: fadeInFromNone;
    -webkit-animation-fill-mode: forwards;
    -ms-animation-duration: 1s;
    -ms-animation-name: fadeInFromNoneIE;
    -ms-animation-fill-mode: forwards;
}
@-webkit-keyframes fadeInFromNone {
    0% {
        opacity: 0
    }

    1% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes fadeInFromNoneIE {
    0% {
        opacity: 0
    }

    1% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes fadeInFromNone {
    0% {
        opacity: 0
    }

    1% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}
						
					
						#nav li:not( :first-child ):hover ul
						{	left: -1px;
						}
						
						#nav li ul li
						{
						text-align: left;
							width:100%;
						}	
							
						#nav li ul a
						{
							font-size: .9em; /* 20 */
							line-height:20px;
							border-top: 1px solid #fff;
							padding: 10px;
							text-decoration:none;
							text-align: left;
						
							
						}
					#nav li ul li.first
						{border-top: 0px ;}
						
							#nav li ul li a:hover,
							#nav li ul:not( :hover ) li.active a
							{
								background-color: #ccc;
							}

}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}







/* search form
-------------------------------------------------------------- */
.searchbox {display: inline-block; }
.searchbox form {margin: 5px; }
.searchbox input[type="search"] {height:auto; margin-bottom:0px; border-radius:0px; width:100%;}
.searchbox {width:80%; box-sizing: border-box;}

/* reset webkit search input browser style */
input {outline: none;}

input[type=search] {
	-webkit-appearance: textfield;
	-webkit-box-sizing: content-box;
	font-family: inherit;
	font-size: 100%;
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
	display: none; /* remove the search and cancel icon */
}

/* search input field */
input[type=search] {
	background: #fff url(../img/site/search-icon.png) no-repeat 9px center;
	border: solid 1px #ccc;
	padding: 9px 10px 9px 32px;
}

input[type=search]:focus {
	background-color: #fff;
	border-color: #f78513;

}

/* placeholder */
input:-moz-placeholder {
	color: #999;
}
input::-webkit-input-placeholder {
	color: #999;
}

@media (min-width: 478px) and (max-width: 550px) 
{    hr {margin-bottom:80px;}}

/* tablet */
@media (min-width: 550px) and (max-width: 1000px) { 
    .searchbox {position: relative;    top:0px; left:0px;}
    .searchbox input[type="search"] {width:150px;}
    .logodiv {max-width:80%; -webkit-box-orient: horizontal;  -webkit-box-direction: normal;  -ms-flex-direction: row;  flex-direction: row;  -webkit-box-pack:justify;  -ms-flex-pack:justify;  justify-content:space-between;}
    .logo {max-width:70%;padding-top:10px;}

}
@media (min-width: 750px) and (max-width: 1000px){
    .logodiv {max-width:80%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack:start; -ms-flex-pack:start; justify-content:flex-start;} 
    .searchbox {-ms-flex-item-align: start;align-self: flex-start;}
    .searchbox form {margin: 10px 10px 0px 0px; }
}

/* Larger than desktop */
@media (min-width: 1000px) {    
    .searchbox {position: relative;  top:0px; left:0px;}     
    .logo {max-width:90%;}
    .searchbox input[type="search"] {width:180px;}
 .logodiv {-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row; max-width:100%; -webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;}
}

/* Larger than desktop */
@media (min-width: 1200px) {    
    .searchbox {position: relative;}     
    .logo {max-width:90%;}
    .searchbox input[type="search"] {width:250px;}

}