/* ////////////////////////////////// HEADER STYLE SHEEET ///////////////////////////////////// */ 

/* Fix Nav Bar to top for mobiles */

.fix-nav { z-index: 9999; position: fixed; left: 0; top: 0; }

/* Mobile Side Bar and Navigation styling */

#mobile-nav { position: fixed; z-index: 9999; top: 0; width: 87%; height: 100%; background: #333; overflow-y: auto; display: none; 
  -webkit-box-shadow: 3px 0px 5px 0px rgba(0, 0, 0, 0.75);
  -moz-box-shadow:    3px 0px 5px 0px rgba(0, 0, 0, 0.75);
  box-shadow:         3px 0px 5px 0px rgba(0, 0, 0, 0.75);
  font-family: 'Chakra Petch', 'helvetica neue', helvetica, arial, sans-serif;
}

#mobile-nav a.close-mobile-nav { position: absolute; right: 0px; top: 0px; padding: 18px; background: url(../img/icons/icon-close.svg) no-repeat center; background-size: 100%; margin: 8px; text-decoration: none; font-weight: normal; }

#mobile-nav ul { clear: both; margin: 0; padding: 0;}
#mobile-nav ul li { margin: 0; padding: 0; }
#mobile-nav ul li a { 
	font-size: 14px; display: block; 
	border-top: 1px solid #484848; border-bottom: 1px solid #2E2E2E; 
	color: #FFF; padding: 15px; 
	text-decoration: none; text-transform: uppercase; font-weight: 400; letter-spacing: 0.2em; 
}
#mobile-nav ul li:last-child a { border-top: 1px solid #484848; border-bottom: 1px solid #484848; }
#mobile-nav ul ul { display: none; background: #212121; }

#mobile-nav a.book { position: relative; margin: 10px; bottom: 0; display: block; padding: 10px 0; border-radius: 0; }
#mobile-nav a.hide { display: none; }

#mobile-nav .social-icons { display: block; position: absolute; bottom: 0; width: 100%; background: #333; overflow: hidden; }
#mobile-nav .social-icons-inner { display: block; padding: 15px; overflow: hidden; }
#mobile-nav .social-icons i.fa { float:right; background-color: rgba(0,0,0,0.4); color:#FFF; font-size: 18px; border-radius:50%; width: 35px; height: 18px; padding: 8px 0; text-align:center; }
#mobile-nav .social-icons i.fa:hover { background-color: rgba(0,0,0,0.6); }

#site-switch-mobile { display: table; table-layout: fixed; width: 100%; position: absolute; bottom: 0; }
#site-switch-mobile a { display: table-cell; padding: 12px; background: #212121; color: #FFF; text-align: center; text-decoration: none; text-transform: uppercase; font-weight: 200; font-size: 14px; letter-spacing: 0.02em; }
#site-switch-mobile a.site-active { background: #0083A0; }


/* ///////////////////////////////////// HEADER ///////////////////////////////////// */

#top-bar { display: none; }

#head { position: absolute; margin-top: 20px; background: transparent; padding: 0; margin: 0; height: 51px; z-index: 6000; width: 100%; }

#head { -webkit-transition: all 0.6s ; transition: all 0.6s; }

#head.fix-nav { position: fixed; background: rgba(0,0,0,0.8); }

#header { height: 100%; }

#menu { display: none; list-style-type: none; }
.subMenu { display: none; }

#head .container { margin: 0; padding: 0;}

a.logo { display: none; margin: 0 auto; padding: 0 20px; display: block; width: 200px; height: 55px; margin-top: 5px; background: url(../img/andy-torbet-logo-2.png) no-repeat center; background-size: 80%;  }

/* Mobile Menu Switch */

#switch { float: left; margin: -10px 0 0 0; top: 0px; width: 20px; color: #CCC; text-align: center; font-size: 35px; cursor: pointer; padding: 8px 15px; }
#switch:hover, #switch:focus { color: #0083A0; }

.gradient { 
	width: 100%; height: 100px; position: absolute; z-index: 1000; top: 0; left: 0; display: block; 
	background: -webkit-linear-gradient(rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
	background: linear-gradient(rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); 
}	



/* ///////////////////////////////////// FOOTER ///////////////////////////////////// */

#footer { background: none; background-size: cover; color: #FFF; }

.footer-wrap { overflow: hidden; display: block; background: url(../img/bkg/rock.jpg) no-repeat center; background-size: cover; }

#footer .container { padding: 20px; }
#footer .col { display: block; overflow: hidden; }

#footer h4 { color: #FFF; font-weight: 400; margin: 0 0 20px 0; display: block; text-transform: uppercase; }

#footer h4.instagram { background: url(../img/icons/icon-instagram.png) no-repeat left center; }
#footer h4.twitter { background: url(../img/icons/icon-twitter.png) no-repeat left center; }
#footer h4.navigate { background: url(../img/icons/icon-navigate.png) no-repeat left center; }

#footer h4.icon { padding: 15px 0 15px 50px; background-size: 35px; }

#footer p { line-height: 16px; font-size: 14px; color: #CCC; margin-bottom: 15px; }
#footer p span { color: #FFF; font-weight: bold; margin-right: 15px; }
#footer ul { overflow: hidden; margin: 0; padding: 0; }
#footer ul li { overflow: hidden; margin: 0px 10px 10px 0; float: left; display: inline-block; padding: 0; line-height: 40px;  }
#footer ul li a {text-decoration: none; color: #FFF; font-size: 14px; padding: 10px; text-transform: uppercase; }

#footer ul li a { background-color: rgba(255,255,255,0.1); font-weight: 400; }
#footer ul li a:hover { color: #0083A0; background-color: rgba(255,255,255,0.2); text-decoration: none; }

#footer .caa-logo { float: right; margin-left: 20px; }

#footer a { color: #FFF; }
#footer a.button { display: inline-block; margin: 15px 0 0 0; }
#footer a:hover { color: #336699; text-decoration: underline; }

#footer form span { color: #CCC; }
#footer input, #footer select { width: 97%; padding: 7px; border-radius: 4px; background: #FFF; color: #666; -webkit-border-radius: 4px; margin: 10px 0; }
#footer label { font-size: 12px; display: block; color: #CCC; margin: 0; }
#footer input.submit { width: 95%; text-align: center; background: #0099D1; border: none; color: #FFF; font-size: 12px; }
#footer button.book { width: 100%; padding: 5px; margin-top: 10px; cursor: pointer; }

#footer .wrecks { display: none; width: 500px; height: 250px; background: url(../img/footer/profile.png) no-repeat; background-size: 100%; position: absolute; bottom: -20px; right: 0; z-index: 1; }

/* Bottom BAR */

#bottom { clear: both; margin: 0; bottom: 0; padding: 30px 0 20px 0; background: transparent; }

#bottom .container { border-top: 1px solid #21677b; padding-top: 40px; }

#bottom a, #bottom p { color: #666; font-size: 14px; padding-top: 10px; }

#bottom .copyright { float: left; text-align: left; margin-top: 15px; }

#bottom a.admin-login { width: 120px; float: right; text-align: center; color: #FFF; background: rgba(217,217,217,0.2); margin: 0px; text-decoration: none; padding: 5px 0px; border-radius: 4px; -webkit-border-radius: 4px; }

#bottom a.social { margin: 0px 0px 0px 10px !important; float: right; width: 40px; height: 40px; padding: 0; display: block; text-decoration: none; background-color: #999; border-radius: 50%; -webkit-border-radius: 50%; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; display: block; }
#bottom a.social:hover { background-color: #999; }
#bottom a.social.fb { background-color: #336699; }
#bottom a.social.twitter { background-color: #0099CC; }
#bottom a.social.vimeo { background-color: #0099CC; }
#bottom a.social.instagram { background-color: #a28a6d; }
#bottom a.social img { width: 100%; }

/* Social Icons - font awesome */

.widget-social-icons { clear: both; display: block; overflow: hidden; }
.widget-social-icons p { margin: 0; padding: 0 !important; }
.widget-social-icons a { display:inline-table; background:none; margin: 0 5px 0 0; padding: 0; float: left; }
.widget-social-icons i.fa { float:right; background-color: rgba(255, 255, 255, 0.2); color:#FFF; font-size: 15px; border-radius:50%; width: 30px; height: 15px; padding: 7.5px 0; text-align:center; }
.widget-social-icons i.fa:hover { background-color: rgba(255, 255, 255, 0.4); }

#bottom .widget-social-icons { display: inline-block; float: left; }
#bottom .widget-social-icons a { float: left; display: inline-block; }


/* Back to Top Link */

#top-link { display: block; position: fixed; z-index: 500; width: 40px; height: 40px; right: 0px; bottom: 20px; background-color: rgba(0,0,0,0.5); cursor: pointer; }
#top-link:hover { background-color: #999; background-color: rgba(0,0,0,0.8); }
#top-link span { display: block; width: 40px; height: 40px; background: url(../img/icons/icon-arrow2.svg) no-repeat center; background-size: 20px; }




/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////// START OF RESPONSIVE STYLES /////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */






@media screen and (orientation: landscape) and (max-width: 768px) {

	#mobile-nav { width: 50%; }

}

@media screen and (orientation: portrait) {

}



/* ////////////////////////////////  bigger than mobile version //////////////////////////////// */

@media screen and (min-width: 480px) {


	
}

/* //////////////////////////////// ipad mini or galaxy note version //////////////////////////////// */  

@media screen and (min-width: 600px) {



}

/* //////////////////////////////// big ipad version //////////////////////////////// */

@media screen and (min-width: 768px) {

	/* Header */

	#wrapMenu { display: block; }

	#head { margin-top: 0px; position: absolute; padding: 0; margin: 0; height: 55px; z-index: 6000; width: 100%; background: transparent;}
	#head .container { margin: auto; padding: 0 20px; width: auto; }

	a.logo  { 
		display: block; position: absolute; z-index: 3000; top: 5px; margin: 0; padding: 0; 
		width: 200px; height: 55px; 
		background: url(../img/andy-torbet-logo-2.png) no-repeat left center; background-size: 100%; 
		-webkit-transition: all .1s ease-in-out; transition: all .1s ease-in-out; 
	}

	/* Top Bar */

	#top-bar { display: none; background: #CCC; height: 40px; padding-top: 0px; }
	#top-bar a { float: left; margin-left: 10px; text-decoration: none; color: #666; }
  	#top-bar a:hover { color: #666; }

	#top-bar p { color: #666; font-size: 14px; line-height: 40px; margin: 0 20px 0 0; padding: 0; float: right; font-weight: 400;}
  	#top-bar p span { font-weight: bold; }

 	#top-bar a.website-switch { background-color: #c1c1c1; color: #666 !important; top: -10px; height: 40px; line-height: 40px; margin: 0; font-size: 14px; padding: 0 20px; float: right; z-index: 4000; left: 135px;  text-transform: uppercase; font-family: 'Titillium Web', helvetica, arial, serif; font-weight: 400; -webkit-transition: all .3s ease-in; transition: all .3s ease-in; }
 	#top-bar a.website-switch:hover { background-color: #999; color: #FFF !important; }
 	#top-bar a.website-switch.site-active { background-color: #EEE; } 

	#switch { display: none; }

	/*  Menu */

	#menu { display: block; pointer-events: auto; position: static; margin: 0; float: right; list-style-type: none;  }
	#menu ul { float: right; display: block; text-align: right; margin: 0; height: 50px; padding: 0; }
	#menu ul li { float: left; margin: 0; height: 100%; line-height: 0px; list-style-type: none;  }
	#menu ul li a { 
		display: block; position: relative; margin: 0; padding: 20px 10px; 
		text-decoration: none; text-transform: uppercase; font-size: 14px; line-height: 14px; color: #FFF; font-weight: 400; 
		-webkit-transition: all 0.3s ; transition: all 0.3s; 
	}	
	#menu ul li a:hover { color: #0083A0; background: rgba(0,0,0,0.7) !important; }

	#menu li.active a { border-top: 3px solid #FFF; color: #FFF; }

	#menu a:hover, #menu li:hover a, #menu li.hover a { color: #0083A0; } 	
	#menu li:hover, #menu li.hover { position: relative; z-index: 15; cursor: default; }

	#menu ul li.dropdown { font-weight: 400; }
	#menu ul li.dropdown a:hover { background: #000; }
	#menu ul li.dropdown a:after { content: "+"; padding-left: 5px; }
	#menu ul li.dropdown ul li a:after { content: ""; padding-left: 0px; }
	#menu ul li.dropdown:hover > a { padding-bottom: 20px; border-bottom: 0; color: #0083A0; background: rgba(0,0,0,0.7); }


	#menu ul ul { display: none; height: 0; visibility: hidden; position: absolute; padding: 0; top: 100%; left: 0; margin-top: 0px; padding-top: 5px; z-index: 5000; text-align: left; height: auto; overflow: hidden; margin-left: 10px; }
	#menu ul ul li { float: none; display: block; width: 100%; border: none; padding: 0; border-bottom: 1px solid #333; min-width: 200px; }
	#menu ul ul li:last-child { border-bottom: none; }

	#menu ul ul li a { 
		position: static; display: block; height: auto; 
		background: #000; border: 0 !important; 
		border-radius: 0px; -webkit-border-radius: 0px; 
		font-size: 14px; line-height: 14px; padding: 10px; 
		margin: 0; color: #EEE !important; 
		font-weight: 400;
	}
  	#menu ul ul li:first-child a {  }
  	#menu ul ul li:last-child a {  }
	#menu ul ul li a:hover { border: 0 !important; color: #0083A0 !important;}
	#menu li:hover > ul, #menu li.hover > ul { visibility: visible; display: block; }

  	#menu ul li.active:hover a { color: #FFF; }
  	#menu ul li.active ul li a { background: #000; }
  	#menu ul li.active ul li:last-child a { }
	
  	/* Social icons in Nav */
	
  	#menu a.social { width: 20px; height: 20px; padding: 0; background-color: #333; border-radius: 50%; -webkit-border-radius: 50%; }
  	#menu a.social img { width: 100%; }
  	#menu a.social:hover { background-color: #999; }
  	#menu a.social.fb { background-color: #336699; }
  	#menu a.social.twitter { background-color: #0099CC; }
  	#menu a.social.vimeo { background-color: #0099CC; }
  	#menu a.social.instagram { background-color: #a28a6d; }
	
	/* Footer */

	#footer .footer-wrap { }
	#footer .col {  }
	#footer ul li { width: 45%; line-height: 22px; }
	#footer ul li a {text-decoration: none; display: block; background-size: 30px; }
	#footer .profile { display: block; width: 350px; height: 250px; bottom: -53px; right: 0; }
	#footer a.social { width: 40px; height: 40px; }	

	/* Social Media Icons - font awesome */

	.widget-social-icons p a { margin: 0 8px 0 0; float: right; }
	.widget-social-icons i.fa { float:right; font-size: 20px; width: 40px; height: 20px; padding:10px 0; }

	#bottom .widget-social-icons { display: inline-block; float: right; }
	#bottom .widget-social-icons a { float: left; display: inline-block; }


}

/* //////////////////////////////// full wide version //////////////////////////////// */ 

@media screen and (min-width: 960px) {

  	/* Header */
	
  	#head { height: 60px; }

  	a.logo  { top: 5px; width: 200px; height: 55px; }

  	/* Footer */

	#footer .container { padding: 60px 0; }
	#footer .footer-wrap {  }

	#footer ul { }
	#footer ul li a { font-size: 16px; } 
  	#footer p { font-size: 14px; line-height: 18px; font-size: 400; }

  	#bottom { padding: 40px 0 40px 0; }

}

/* //////////////////////////////// wide version //////////////////////////////// */ 

@media screen and (min-width: 1200px) {

	a.logo  { top: 10px; width: 250px; height: 55px; }

	 #head .container { padding: 0 20px; width: 1200px; }

	 #menu ul li a { font-size: 16px; padding: 23px 15px; }
	 #menu ul ul { padding-top: 5px; }
	 #menu ul ul li a { font-size: 16px; line-height: 20px; padding: 15px 20px; }

	 #footer .footer-wrap {  }

}

/* //////////////////////////////// very wide version //////////////////////////////// */ 

@media screen and (min-width: 1500px) {





}

/* //////////////////////////////// extra wide version //////////////////////////////// */ 

@media screen and (min-width: 1750px) {



}

/* //////////////////////////////// extra extra wide version //////////////////////////////// */ 

@media screen and (min-width: 2000px) {



}