/* //////////////////////////////// CUSTOM LIGHTBOX WITH AJAX //////////////////////////////// */

/* JS FUNCTION FOR REFERENCE */

/* 

function lightbox(page) {
    $('.ajax-lightbox').delay(500).fadeToggle();
    $('.ajax-lightbox-container').load('./inline/' + page);
}

$('.ajax-lightbox').on('click', 'a', function() {
  $('.ajax-lightbox').hide();
}); 

*/

/* LIGHTBOX AJAX CONTAINER */
/* 

<div class="ajax-lightbox">
	<div class="ajax-lightbox-container"></div>
	<a href="#" class="close-btn"></a>
</div> 

*/

/* Typography  */


body { 
	font-family: 'Lato', "helvetica nenu", helvetica, arial, sans-serif !important;
	font-style: normal;
	font-weight: 400;
}


.ajax-lightbox { 
	position: absolute; z-index: 99999; 
	width: 100%; height: 100%; 
	display: none; 
	top: 0px; 
	margin: 0; 
	background: #FFF; 
	padding: 0px;
	overflow: auto;
}

.ajax-lightbox-simple { 
	position: absolute; z-index: 99999; 
	width: 100%; height: 100%; 
	display: none; 
	top: 0px; 
	margin: 0; 
	background: #FFF; 
	padding: 0px;
	overflow: auto;
}

.ajax-lightbox-container { display: block; padding: 20px; overflow: hidden; }

.ajax-lightbox h5 { margin: 5px 30px 20px 0; font-size: 20px; line-height: 25px; color: #363A10; text-transform: uppercase; }
.ajax-lightbox p { margin: 0 0 0 0; }
.ajax-lightbox a { color: #336699; }

.ajax-lightbox-simple h5 { margin: 5px 30px 20px 0; font-size: 20px; line-height: 25px; color: #363A10; }
.ajax-lightbox-simple p { margin: 0 0 0 0; }
.ajax-lightbox-simple a { color: #336699; }

.ajax-lightbox p.number { 
	width: 35px; height: 35px; padding: 7px 0; margin: 0 10px 0 0;
	background-color: #D9016E; color: #FFF; text-align: center; 
	border-radius: 100px; -webkit-border-radius: 100px;
	float: left; font-size: 18px;
}

.ajax-lightbox img.inline-image { width: 100%; margin: 0 0 15px 0; clear: both; }
.ajax-lightbox img.inline-image.portrait { width: 25%; margin: 0 0 15px 15px; float: right; }

.ajax-lightbox-simple img.inline-image { width: 100%; margin: 0 0 15px 0; clear: both; }
.ajax-lightbox-simple img.inline-image.portrait { width: 25%; margin: 0 0 15px 15px; float: right; }

.ajax-lightbox .close-btn { 
	width: 35px; height: 35px; 
	top: 18px; right: 20px;
	padding: 0px;
	display: block; position: absolute;
	background: url(../img/close.png) no-repeat center; background-size: 100%; 
	cursor: pointer;
}

.ajax-lightbox-simple .close-btn { 
	width: 35px; height: 35px; 
	top: 18px; right: 20px;
	padding: 0px;
	display: block; position: absolute;
	background: url(../img/close.png) no-repeat center; background-size: 100%; 
	cursor: pointer;
}

/* Columns */

.ajax-lightbox-container .col { width: 100%; display: block; overflow: hidden; }


a.link { 
	display: inline-block; clear: both; padding: 10px 20px; margin: 15px 0 0 0; text-decoration: none; background: #E10F85; color: #FFF; border-radius: 100px; 
	cursor: pointer !important; text-transform: uppercase; font-size: 12px;
}
a.link:hover { background: #af3879; }

/* Social Sharing Version */

.share-box { 
	position: absolute; z-index: 99999; 
	width: 100%; height: 100%; 
	display: none; 
	top: 0px; 
	margin: 0; 
	background: #FFF; 
	padding: 0px;
}

.share-box-container { display: block; padding: 20px; overflow: hidden; }

.share-box h5 { margin: 0 30px 20px 0; font-size: 25px; line-height: 30px; }
.share-box p { margin: 0 0 0 0; }

.share-box .close-btn { 
	width: 40px; height: 40px; 
	top: 15px; right: 15px;
	padding: 0px;
	display: block; position: absolute;
	background: url(../img/close.png) no-repeat center; background-size: 30px; 
	cursor: pointer;
}

/* PDF Download Box */

.pdf-box { 
	position: absolute; z-index: 99999; 
	width: 100%; height: 100%; 
	display: none; 
	top: 0px; 
	margin: 0; 
	background: #FFF; 
	padding: 0px;
}

.pdf-box-container { display: block; padding: 20px; overflow: hidden; }

.pdf-box h5 { margin: 0 30px 20px 0; font-size: 25px; line-height: 30px; }
.pdf-box p { margin: 0 0 0 0; }

.pdf-box .close-btn { 
	width: 40px; height: 40px; 
	top: 15px; right: 15px;
	padding: 0px;
	display: block; position: absolute;
	background: url(../img/close.png) no-repeat center; background-size: 30px; 
	cursor: pointer;
}

/* Standard AJAX Lightbox */

.ajax-lightbox table { table-layout: fixed; width: 100%; margin: 0 0 20px 0; border: 1px solid #EEE;}
.ajax-lightbox table td { padding: 5px; }
.ajax-lightbox table td p { font-size: 12px; line-height: 14px; display: block; text-transform: uppercase; color: #666; }
.ajax-lightbox table td a { font-size: 12px; line-height: 14px; display: block; text-transform: uppercase; color: #FFCC00; }
.ajax-lightbox table th { font-size: 12px; line-height: 14px; text-transform: uppercase; color: #FFF; padding: 10px; background-color: #666; }
.ajax-lightbox table td a:hover { text-decoration: none; color: #FFCC00; }
.ajax-lightbox table tr:nth-child(even) { background-color: #eee; }

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


/* Inline Tabs */

.tabs-menu { list-style: none; display: table; width: 100%; table-layout: fixed; margin: 0 0 20px 0; padding: 0; border: 1px solid #2D448A; }
.tabs-menu li { display: table-cell; text-align: center; border-right: 1px solid #2D448A; padding: 15px 0; }
.tabs-menu li:last-child { border-right: 0; }
.tabs-menu li a { text-decoration: none; text-transform: uppercase; color: #2D448A; font-size: 10px; display: block; }
.tabs-menu li a:hover { text-decoration: none; color: #E50C83; }
.tabs-menu li.current { background-color: #2D448A; color: #FFF; }
.tabs-menu li.book { background-color: #E50C83; color: #FFF; }
.tabs-menu li.book a { color: #FFF; }
.tabs-menu li.current a { color: #FFF; }

#tab-1 { display: block; }
.tab { }
.tab-content { display: none; clear: both; }
.tab-content.current { display: block; }

/* Switch and Tabs */

.switch { position: relative; top: 0px; display: block; overflow: hidden; margin-bottom: 10px; }
.switch a { display: inline-block; float: left; padding: 10px 20px 10px 40px; color: #666; text-decoration: none; text-transform: uppercase; font-size: 12px; outline: none;  }
.switch a:hover, .lang-switch a:focus { text-decoration: none; cursor: pointer; }

.switch a:nth-child(1) { background: url(../img/icon-about2.png) no-repeat left 10px center; background-size: 25px; border-right: 1px solid #CCC; }
.switch a:nth-child(2) { background: url(../img/icon-time2.png) no-repeat left 10px center; background-size: 25px; }

.switch a { background-color: #FFF !important; }
.switch a.active { background-color: #FFF !important; color: #DA1084; }

.ajax-lightbox .tab { display: none; }
.ajax-lightbox #tab1 { display: block; }

.banner { width: 120px; height: 120px; position: fixed; z-index: 100; bottom: 0; right: 0; }
.banner.seasalt { background: url(../img/banner-seasalt.png) no-repeat bottom right; background-size: 100%; }
.banner.skinners { background: url(../img/banner-skinners.png) no-repeat bottom right; background-size: 100%; }

/*  Option Boxes */

.option-boxes { display: table; overflow: hidden; width: 100%; margin: 0 auto; border-spacing: 10px; border-collapse: separate; padding: 20px; }
.option-boxes a { display: table-cell; overflow: hidden; float: left; width: 45%; border: 1px solid #292560; position: relative; margin-right: 10px; }
.option-boxes a img { width: 130%; height: auto; display: block; }
.option-boxes a span { position: absolute; z-index: 100; padding: 10px; background: #292560; color: #FFF; text-decoration: none; bottom: 0; }

/* DEPARTMENT POPUP BOXES */

.department-box { 
	position: absolute; z-index: 99999; 
	width: 100%; height: 100%; 
	display: none; 
	top: 0px; 
	margin: 0; 
	background: #FFF; 
	padding: 0px;
}

.department-box .nav-icon { 
	width: 30px; height: 30px; 
	top: 15px; right: 15px;
}

.department-box h3 { display: block; font-size: 16px; line-height: 16px; color: #FFF; padding: 17px 20px; background: #C3CE25; margin: 0; text-transform: uppercase; }
.department-box h3 a { color: #FFF; text-decoration: none; }
.department-box h3 a:hover, .department-box h3 a:focus { color: #FFF; text-decoration: none; }
.department-box p.description { font-size: 14px; line-height: 18px; color: #666; padding: 18px 20px 0 20px; margin: 0; display: none; }

.department-box h3.blue { background: #22BBFF; }
.department-box h3.pink { background: #FF33FF; }
.department-box h3.green { background: #2BD840; }
.department-box h3.orange { background: #FF5B00; }
.department-box h3.purple { background: #8F21D6; }
.department-box h3.red { background: #F21439; }

.department-box table { table-layout: fixed; width: 100%; }
.department-box table td { border: 1px solid #EEE; }
.department-box table td a { font-size: 12px; line-height: 14px; display: block; text-transform: uppercase; color: #666; padding: 15px 20px; -webkit-transition: all .3s ease-in; transition: all .3s ease-in; }
.department-box table td a:hover { text-decoration: none; color: #666; background: #EEE; }

/*  Department Status */

.department-status { 
	position: absolute; z-index: 1000; 
	width: 100%;
	height: auto; 
	display: none; 
	top: 50px; 
	margin: 0; 
	padding: 0px;
}
.department-status .wrap { position: relative; }
.department-status h3 { margin: 0; padding: 0; width: 100%; }
.department-status h3 a { color: #666; text-decoration: none; text-transform: uppercase; }

.department-status a.blue { background-color: #22BBFF; }
.department-status a.pink { background-color: #FF33FF; }
.department-status a.green { background-color: #2BD840; }
.department-status a.orange { background-color: #FF5B00; }
.department-status a.purple { background-color: #8F21D6; }
.department-status a.red { background-color: #F21439; }

.department-status a { 
	font-size: 14px; line-height: 14px; color: #FFF; 
	padding: 17px 50px 17px 20px; 
	margin: 0; display: block; 
	background: url(../img/arrow-down2.png) no-repeat right 15px center; background-size: 30px; background-color: rgba(255,255,255,1);
	cursor: pointer;
}
.department-status a:hover, .department-status a:focus { text-decoration: none; color: #666; }

/* Thumbnails */

.thumbnail * { -webkit-transition: all 0.3s ; transition: all 0.3s; }
.thumbnail { 
	position: relative; overflow: hidden; display: block; 
	margin-bottom: 10px; padding: 0; border: 0; border-radius: 0; cursor: pointer; 
	box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;
}

.thumbnail .thumb { }
.thumbnail img { width: 100%; height: auto; display: block; }

.thumbnail .caption { position: absolute; background-color: rgba(0, 0, 0, 0.6); display: block; padding: 10px; bottom: 0;}
.thumbnail .caption p { overflow: hidden; margin: 0; padding: 0; color: #CCC; font-size: 14px; font-weight: 400; text-transform: uppercase; }

.thumbnail:hover { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
.thumbnail:hover .caption, .thumbnail:focus .caption { background-color: rgba(0, 0, 0, 0.8); cursor: pointer; }
.thumbnail:hover .caption p, .thumbnail:focus .caption p { color: #FFF; }

/* Sidebar Thumbnails */

.thumbnails-container { display: block; overflow: hidden; }
.thumbnails-container .thumbs-row { display: block; overflow: hidden; width: 100%; }
.thumbnails-container .thumbs-row:nth-child(2) { margin-top: -10px; padding-bottom: 100px; }
.thumbnails-container a { display: block; background: none; clear: both; margin: 15px; max-height: 200px; }
.thumbnails-container a.thumbnail { background: none; border-spacing: 10px; }
.thumbnails-container a.thumbnail .thumb { }

.thumbnails-container a.thumbnail.null { pointer-events: none; display: none; }

.inner-scroll { position: absolute; height: 100%; overflow-y: scroll; padding-bottom: 60px; }


/* Images Floated */

.img-float { display: block; width: 100%; }

.img-float.col-2 img { margin: 20px 0 0 0; }

.img-float.col-2 img { width: 100%; height: auto; }
.img-float.col-3 img { width: 100%; height: auto; }
.img-float.col-4 img { width: 100%; height: auto; }




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


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

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

	.department-box { height: auto; }

	.department-box table td a { font-size: 14px; }

	/* Thumbnails */

	.thumbnails-container { display: table; overflow: hidden; border-collapse: separate; width: 100%;  }
	.thumbnails-container .thumbs-row { width: 100%; clear: both; border-spacing: 5px; }
	.thumbnails-container a { display: table-cell; background: none; }
	.thumbnails-container .thumbnail { }
	.thumbnails-container a.thumbnail.null { display: table-cell; }

	.inner-scroll { position: relative; height: auto; overflow: hidden; padding-bottom: 0px; }

	.thumbnails-container .thumbs-row:nth-child(2) { margin-top: -5px; padding-bottom: 0px; }

}

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

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


}

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

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


	.ajax-lightbox { width: 600px; height: auto; margin: -150px 0 0 -300px; padding: 0px; top: 50%; left: 50%; overflow: initial; }
	.ajax-lightbox-simple { width: 500px; height: auto; margin: -150px 0 0 -250px; padding: 0px; top: 50%; left: 50%; overflow: initial; }
	.ajax-lightbox-simple.wide { width: 700px; margin: -150px 0 0 -350px; }

	.ajax-lightbox .close-btn { 
		width: 35px; height: 35px; 
		top: -15px; right: -15px;
		padding: 0px;
		display: block; position: absolute;
		background: url(../img/close.png) no-repeat center; background-size: 100%; 
	}

	.ajax-lightbox-simple .close-btn { 
		width: 40px; height: 40px; 
		top: -20px; right: -20px;
		padding: 0px;
		display: block; position: absolute;
		background: url(../img/close.png) no-repeat center; background-size: 100%; 
	}

	.share-box { width: 400px; height: auto; margin: -100px 0 0 -200px; top: 50%; left: 50%; }
	.pdf-box { width: 400px; height: auto; margin: -100px 0 0 -200px; top: 50%; left: 50%; }

	.share-box .close-btn { 
		width: 40px; height: 40px; 
		top: -20px; right: -20px;
		padding: 0px;
		display: block; position: absolute;
		background: url(../img/close.png) no-repeat center; background-size: 40px; 
	}

	.pdf-box .close-btn { 
		width: 40px; height: 40px; 
		top: -20px; right: -20px;
		padding: 0px;
		display: block; position: absolute;
		background: url(../img/close.png) no-repeat center; background-size: 40px; 
	}

	.ajax-lightbox img.inline-image { width: 50%; margin: 0 0 0 20px; float: right; }
	.ajax-lightbox-simple img.inline-image { width: 50%; margin: 0 0 0 20px; float: right; }

	.ajax-lightbox h5 { margin-top: 0px; }
	.ajax-lightbox p.number { margin-top: 0px; }

	/* Switch */
	.switch { position: absolute; margin: -62px 0 0 -20px; width: 100%; background: #2A255B; padding: 15px 0 0 0; }

	.switch a:nth-child(1) { background: url(../img/icon-about.png) no-repeat left 15px center; background-size: 30px; border: 0; margin-left: 20px; }
	.switch a:nth-child(2) { background: url(../img/icon-time.png) no-repeat left 15px center; background-size: 30px; }

	.switch a { 
		background-color: rgba(255,255,255,0.8) !important; background-size: 35px !important; 
		padding: 15px 20px 15px 57px; margin-right: 10px; 
		font-size: 12px; color: #2A255B;
		box-sizing: border-box; -webkit-box-sizing: border-box;
		height: 100%;
	}

	.switch a.active { background-color: #FFF !important; border: 0; padding: 15px 20px 15px 57px; }

	/* Columns */

	.ajax-lightbox-container .col { width: 32%; float: left; display: block; overflow: hidden; margin-right: 2%; }
	.ajax-lightbox-container .col:last-child { margin-right: 0; }

	.ajax-lightbox-container table { margin-bottom: 0; }

	.banner { width: 160px; height: 160px; position: absolute; z-index: 100; clear:both;}

	/* Department Box */

	.department-box { width: 600px; height: auto; padding: 0px; top: 50%; left: 50%; margin: -150px 0 0 -300px; }
	.department-box.push-up { margin-top: -250px; } /* fix for amata */
	.department-box h3 { font-size: 18px; line-height: 22px; padding: 15px 20px; background-color: #C3CE25; color: #FFF; }
	.department-box h3 a { color: #333; }
	.department-box h3 a:hover { color: #333; text-decoration: underline; }
	.department-box p.description { font-size: 14px; line-height: 20px; padding: 18px 20px 0 20px; display: block; }
	.department-box .nav-icon { top: 20px; right: 20px; width: 30px; height: 30px; } 
	.department-box table td a { font-size: 18px; line-height: 22px; padding: 15px 20px; }

	.department-box .nav-icon { width: 30px; height: 30px; top: 15px; right: 10px; }

	.department-box table { margin-top: 20px; }

	/* Department Status */

	.department-status { top: auto;bottom: 0px; margin: 0; }
	.department-status .wrap { position: relative; float: left; left: 50%; }
	.department-status h3 { margin: 0; padding: 0; float: left; position: relative; left: -50%; }
	.department-status h3 a { color: #FFF !important; text-transform: uppercase; }
	.department-status a { background: url(../img/arrow-up3.png) no-repeat right 15px center; background-size: 20px; background-color: #C3CE25; color: #333; }
	.department-status a:hover {  }

	/* Thumbnails */

	.thumbnails-container { padding: 10px; }
	.thumbnails-container .thumbs-row { width: 100%; clear: both; border-spacing: 5px; }
	.thumbnails-container a { max-height: 120px; }
	.thumbnails-container .thumbnail { }
	.thumbnails-container a.thumbnail.null { display: table-cell; }

	/* Images Floated */

	.img-float { display: block; width: 100%; margin-top: 20px; }

	.img-float.col-2 img { margin-top: 0; }

	.img-float.col-2 img { width: 49%; height: auto; margin-right: 1.5%; }
	.img-float.col-2 img:nth-child(2) { margin: 0; }


}

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

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

	.share-box { width: 500px; margin: -100px 0 0 -250px; top: 50%; left: 50%; }
	.pdf-box { width: 500px; margin: -100px 0 0 -250px; top: 50%; left: 50%; }

	.ajax-lightbox { width: 600px; margin: -150px 0 0 -300px; }
	.ajax-lightbox-simple { width: 600px; margin: -150px 0 0 -300px; }
	.ajax-lightbox-simple.wide { width: 800px; margin: -150px 0 0 -400px; }

	.ajax-lightbox img.inline-image { width: 50%; margin: 0 0 0 20px; }
	.ajax-lightbox-simple img.inline-image { width: 50%; margin: 0 0 0 20px; }

	.ajax-lightbox h5 { font-size: 25px; line-height: 35px; }
	.ajax-lightbox-simple h5 { font-size: 25px; line-height: 35px; }

	/* Switch */
	.switch { margin-top: -65px; }
	.switch a { 
		background-size: 35px !important; 
		padding: 15px 20px 15px 57px; margin-right: 10px; 
		font-size: 14px; 
	}

	.switch a:nth-child(1) { background: url(../img/icon-about2.png) no-repeat left 15px center; background-size: 30px; border: 0; }
	.switch a:nth-child(2) { background: url(../img/icon-time2.png) no-repeat left 15px center; background-size: 30px; }

	.switch a.active { background-color: #FFF !important; border: 0; padding: 15px 20px 15px 57px; }

	.banner { width: 180px; height: 180px; }

	.ajax-lightbox p.number { margin-top: 0px; font-size: 20px; width: 45px; height: 45px; padding-top: 8px; }

	/* Department Boxes */

	.department-box { width: 600px; margin: -200px 0 0 -300px; }
	.department-box h3 { font-size: 22px; line-height: 22px; padding: 15px 20px; }
	.department-box p.description { font-size: 16px; line-height: 22px; padding: 18px 20px 0 20px; display: block; }

	.department-box .nav-icon { width: 35px; height: 35px; top: 15px; right: 12px; }


}

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

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

	 .department-box { width: 700px; height: auto; margin: -250px 0 0 -350px; }

	 .department-box h3 { font-size: 22px; line-height: 22px; padding: 20px 20px; }

	 .department-box .nav-icon { width: 35px; height: 35px; top: 20px; right: 15px; }

}

/* //////////////////////////////// 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) {


}
