/* Northland College WordPress theme slider gallery CSS */

.gallery {
	margin: 1.25em -10px 1.25em 0;
	overflow: hidden;
	position: relative;
	white-space: nowrap;
	width: auto;
}
.gallery:first-child { margin-top: 0; }
.gallery:last-child { margin-bottom: 0; }

	.gallery > ul {
		display: inline-block;
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
		position: relative;
		vertical-align: top;
		white-space: normal;
		width: 100%;
		z-index: 1;
	}

		.gallery > ul > li {
			border: none;
			border-right: 10px solid rgb(255,255,255);
			border-bottom: 10px solid rgb(255,255,255);
			display: inline-block;
			height: auto;
			margin: 0 !important;
			overflow: hidden;
			padding: 0 !important;
			position: relative;
			text-align: center;
			vertical-align: top;
		}
		
		.gallery.grid_1x1 > ul > li { width: 100%; }
		.gallery.grid_1x1_text > ul > li { width: 100%; }
		.gallery.grid_1x2 > ul > li { width: 100%; }
		.gallery.grid_2x1 > ul > li { width: 50%; }
		.gallery.grid_2x2 > ul > li { width: 50%; }
		.gallery.grid_3x1 > ul > li { width: 33.333%; }
		.gallery.grid_3x2 > ul > li { width: 33.333%; }
		.gallery.grid_4x1 > ul > li { width: 25%; }
		.gallery.grid_4x2 > ul > li { width: 25%; }
		
			.gallery > ul > li > * {
				display: block;
				margin: 0 auto !important;
				padding: 0 !important;
				text-align: center;
			}
	
			.gallery.grid_1x1text .image_wrapper {
				float: left;
				width: 47.5%;
			}
	
			.gallery.grid_1x1text .text_wrapper {
				float: right;
				font-size: 100%;
				line-height: 1.5em;
				text-align: left !important;
				width: 47.5%;
			}
		
				.gallery.grid_1x1text .text_wrapper * {
					font-family: 'Alright Sans', sans-serif !important;
					text-align: left !important;
				}
			
			.gallery .image_caption {
				font-family: 'Alright Sans', sans-serif;
				font-size: 85%;
				line-height: 1.5em;
				margin: 0.5em 0 1em 0 !important;
			}

	.gallery_steps {
		height: 50px;
		position: relative; top: -10px;
		text-align: right;
		z-index: 2;
	}
	
	.gallery_steps div {
		background-color: transparent;
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 30px 30px;
		cursor: pointer;
		display: inline-block;
		height: 50px;
		text-align: right;
		transition: opacity 0.25s;
		width: 50px;
	}
	
	.gallery_steps div.inactive {
		cursor: default;
		opacity: 0.333;
	}

	.gallery_steps .prev {
		background-image: url('../images/prev_alt_2_x2.png');
	}

	.gallery_steps .next {
		background-image: url('../images/next_alt_2_x2.png');
	}


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

}


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

	.gallery > ul > li { width: 50% !important; }
	.gallery.grid_1x1 > ul > li, .gallery.grid_1x1text > ul > li { width: 100% !important; }

	.gallery.grid_1x1text .image_wrapper, .gallery.grid_1x1text .text_wrapper {
		float: none;
		margin-bottom: 1.5em !important;
		width: 100%;
	}

	.grid.step {
		background-size: 20px 34px;
		height: 34px;
		margin-top: -17px;
		margin-top: calc(-17px + 1em);
		top: 0 !important;
		width: 20px;
	}
	.gallery_steps .prev { left: auto !important; right: 50px !important; }
	.gallery_steps .next { right: 0 !important; }

}


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

	.gallery_steps .prev { background-image: url('../images/prev_alt_2_x2.png'); }
	.gallery_steps .next { background-image: url('../images/next_alt_2_x2.png'); }

}