/* Northland College custom lightbox CSS */

#lightbox {
	background: rgba(0,0,0,0.5);
	display: none;
	position: fixed; top: 0; right: 0; bottom: 0; left: 0;
	z-index: 98;
}

	#lightbox .close {
		background: transparent url('../images/close.png') center center no-repeat;
		background-size: 24px 24px;
		cursor: pointer;
		height: 40px;
		margin-right: -50px;
		overflow: hidden;
		position: absolute; top: 10%; right: 10%;
		text-indent: -999px;
		width: 40px;
		z-index: 2;
	}
	
	#lightbox .loading {
		background: rgb(255,255,255) url('../images/loading.svg') center center no-repeat;
		background-size: 32px 32px;
		box-shadow: 10px 10px 50px rgba(0,0,0,0.5);
		overflow: hidden;
		padding: 1.5em;
		position: absolute; top: 10%; right: 10%; bottom: 10%; left: 10%;
		z-index: 0;
	}

	#lightbox .content {
		background: rgb(255,255,255);
		box-shadow: 10px 10px 50px rgba(0,0,0,0.5);
		overflow: hidden;
		padding: 1.5em;
		position: absolute; top: 10%; right: 10%; bottom: 10%; left: 10%;
		z-index: 1;
	}
	
		#lightbox .content iframe {
			position: absolute; top: 0; right: 0; bottom: 0; left: 0;
		}
		
		#lightbox .content .image_wrapper {
			text-align: center;
		}
		
			#lightbox .content .image_wrapper img {
				display: block;
				margin: 0 auto;
			}

		#lightbox .content .image_caption {
			font-family: 'Alright Sans', sans-serif;
			font-size: 100%;
			line-height: 1.5em;
			margin: 1em 0 0 0;
			text-align: center;
		}

	#lightbox .nav {
		height: 1px;
		margin: -20px -50px 0 -50px;
		position: absolute; top: 50%; right: 10%; bottom: auto; left: 10%; 
		z-index: 2;
	}
	
	#lightbox .nav div {
		background-color: transparent;
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 30px 30px;
		cursor: pointer;
		display: inline-block;
		height: 40px;
		transition: opacity 0.25s;
		width: 40px;
	}
	
	#lightbox .nav div.inactive {
		cursor: default;
		opacity: 0.333;
	}

	#lightbox .nav .prev {
		background-image: url('../images/prev_alt_2_x2.png');
		position: absolute; top: 0; left: 0;
	}

	#lightbox .nav .next {
		background-image: url('../images/next_alt_2_x2.png');
		position: absolute; top: 0; right: 0;
	}


/* CSS3 MEDIA QUERIES */

/* PRINT */
@media print {

}


/* LARGE SCREENS (content area over 1280 pixels) */
@media screen and (min-width: 1280px) {

}


/* INTERMEDIATE SCREENS (content area between 1000 and 1279 pixels) */
@media screen and (min-width: 1000px) and (max-width: 1279px) {

}


/* TABLETS (content area under 1000 pixels) */
@media screen and (max-width: 1000px) {

	#lightbox .content {
		top: 120px; right: 10%; left: 10%;
	}

}


/* PHONES (content area under 782 pixels) */
/* Matched to size where WP mobile admin bar appears */
@media screen and (max-width: 782px) {

	#lightbox {
		font-size: 85%;
		line-height: 1.5em;
	}
	
	#lightbox .close {
		background-size: 16px 16px;
	}

	#lightbox .content {
		top: 100px; right: 5%; left: 5%;
	}

}


/* SMALL PHONES (content area under 600 pixels) */
@media screen and (max-width: 600px) {

}


/* HIGH RESOLUTION IMAGE REPLACEMENTS */
@media	only screen and (-moz-min-device-pixel-ratio: 1.5),
		only screen and (-o-min-device-pixel-ratio: 3/2),
		only screen and (-webkit-min-device-pixel-ratio: 1.5),
		only screen and (min-devicepixel-ratio: 1.5),
		only screen and (min-resolution: 1.5dppx)
{

	#lightbox .close { background-image: url('../images/close_x2.png'); }

}
