/**

 * @package WordPress

 * @subpackage Industrial

 * @since Industrial 1.0

 * 

 * JackBox jQuery Lightbox Plugin Stylesheet

 * Changed by CMSMasters

 * 

 */





/* ----------------------------------------------------------- */

/*                COLORS, FONTS and jackbox                   */

/* ----------------------------------------------------------- */





/* adjust main modal background color and opacity here */

.jackbox-modal {

	

	font: 12px Arial, Helvetica, sans-serif;

	color: #666;

	line-height: 18px;

	background: rgba(0, 0, 0, 0.75);

	

	-webkit-user-select: none;

	-moz-user-select: none;

	-ms-user-select: none;

	-o-user-select: none;

	user-select: none;

	

}



/* headers for descriptions and custom html */

.jackbox-modal h2,

.jackbox-modal h3 {

	

	font: 24px "Mako", sans-serif;

	font-weight: normal;

	color: #444;

	

}



/* the item titles shown beneath the content */

.jackbox-title-text {

	

	font: 14px "Mako", sans-serif;

	color: #222;

	

}



/* small thumb tooltip container */

.jackbox-thumb-tip {

	

	background: url(../img/jackbox/ie_bg.png);

	background: rgba(0, 0, 0, 0.75);

	

}



/* small thumb tooltip text */

.jackbox-thumb-tip-text {



	font: 12px "Mako", sans-serif;

	text-transform: uppercase;

	color: #FFF;

	

}



/* item descriptions (info) background-color */

.jackbox-description-text {

	

	background-color: #FFF;

	text-align: left;

	

}



/* custom html's background-color and border */

.jackbox-html > div {

	

	background-color: #F5F5F5;

	border: 1px solid #E5E5E5;

	text-align: left;

	

}



/* main content container */

.jackbox-holder {

	

	background-color: #FFF;

	

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

	

}



.jackbox-container {



	background: #000;

	background: -moz-radial-gradient(center, ellipse cover, rgba(68, 68, 68, 1) 0%, rgba(0, 0, 0, 1) 100%);

	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(68, 68, 68, 1)), color-stop(100%, rgba(0, 0, 0, 1)));

	background: -webkit-radial-gradient(center, ellipse cover,  rgba(68, 68, 68, 1) 0%, rgba(0, 0, 0, 1) 100%);

	background: -o-radial-gradient(center, ellipse cover, rgba(68, 68, 68, 1) 0%, rgba(0, 0, 0, 1) 100%);

	background: -ms-radial-gradient(center, ellipse cover, rgba(68, 68, 68, 1) 0%,rgba(0, 0, 0, 1) 100%);

	background: radial-gradient(ellipse at center, rgba(68, 68, 68, 1) 0%, rgba(0, 0, 0, 1) 100%);

	

}



/* large prev/next buttons located on the far sides of the modal */

.jackbox-panel:hover {

	

	background-color: #333;

	

}



/* large prev button */

.jackbox-panel-left {

	

	background-image: url(../img/jackbox/panel_left.png);

	

}



/* large next button */

.jackbox-panel-right {

	

	background-image: url(../img/jackbox/panel_right.png);	

	

}



/* large prev button on mouse over */

.jackbox-panel-left:hover {

	

	-webkit-box-shadow: 5px 0px 10px rgba(0, 0, 0, 0.2);

	-moz-box-shadow: 5px 0px 10px rgba(0, 0, 0, 0.2);

	box-shadow: 5px 0px 10px rgba(0, 0, 0, 0.2);

	

	border-right: 1px solid #4D4D4D;

	background-image: url(../img/jackbox/panel_left_over.png);	

	

}



/* large right button on mouseover */

.jackbox-panel-right:hover {

	

	-webkit-box-shadow: -5px 0px 10px rgba(0, 0, 0, 0.2);

	-moz-box-shadow: -5px 0px 10px rgba(0, 0, 0, 0.2);

	box-shadow: -5px 0px 10px rgba(0, 0, 0, 0.2);

	

	border-left: 1px solid #4D4D4D;

	background-image: url(../img/jackbox/panel_right_over.png);	

	

}



/* prev, next, info, close and toggle-thumbs buttons */

.jackbox-button {

	

	width: 20px;

	height: 20px;

	background-size: 20px 20px;

	background-repeat: no-repeat;

	

}



/* previous button */

.jackbox-arrow-left {

	

	background-image: url(../img/jackbox/left_arrow.png);

	

}



/* next button */

.jackbox-arrow-right {

	

	background-image: url(../img/jackbox/right_arrow.png);

	

}



/* info button */

.jackbox-info {

	

	background-image: url(../img/jackbox/info.png);

	

}



/* show thumbnails (+) */

.jackbox-show-thumbs {

	

	background-image: url(../img/jackbox/thumbs_show.png);

	

}



/* hide thumbnails (-) */

.jackbox-hide-thumbs {

	

	background-image: url(../img/jackbox/thumbs_hide.png);

	

}



/* close button */

.jackbox-close {

	

	background-image: url(../img/jackbox/exit.png);

	

}



/* fullscreen button */

.jackbox-fs {



	background-image: url(../img/jackbox/fullscreen.png);

	

}



.jackbox-ns {



	background-image: url(../img/jackbox/normalscreen.png);

	

}



/* button over/active state */

.jb-info-inactive, 

.jackbox-button:hover {

	

	opacity: 0.6;

	

}



/* thumb strip background color and opacity */

.jackbox-thumb-panel {

	

	background: url(../img/jackbox/ie_bg.png);

	background: rgba(0, 0, 0, 0.75);

	

}



/* the thumb panel's left arrow */

.jackbox-thumb-left {

	

	width: 20px;

	height: 20px;

	margin: -9px 0 0 -30px;

	

	background-size: 20px 20px;

	background-repeat: no-repeat;

	background-image: url(../img/jackbox/thumb_left.png);

	

}



/* the thumb panel's right arrow */

.jackbox-thumb-right {

	

	width: 20px;

	height: 20px;

	margin: -9px 0 0 12px;

	

	background-size: 20px 20px;

	background-repeat: no-repeat;

	background-image: url(../img/jackbox/thumb_right.png);

	

}



/* the thumb arrows, on mouse over */

.jackbox-thumb-left:hover,

.jackbox-thumb-right:hover {



	opacity: 0.70;

	

}



/* the preloader */

.jackbox-preloader {



	background: url(../img/jackbox/ie_preloader.gif);

	background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(68, 68, 68, 1) 90%);

	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(25%, rgba(255, 255, 255, 1)), color-stop(90%, rgba(68, 68, 68, 1)));

	background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(68, 68, 68, 1) 90%);

	background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(68, 68, 68, 1) 90%);

	background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(68, 68, 68, 1) 90%);

	

}



/* graphic placed inside preloader to create gradient effect */

.jackbox-pre-inside {

	

	background-color: #000;

	

}



/* a little eye magic, added once the first lightbox item loads */

.jackbox-pre-ready {

	

	background-color: #444;

	

}





/* ----------------------------------------------------------- */

/*                   LAYOUT and POSITIONING                    */

/* ----------------------------------------------------------- */





/* the main modal */

.jackbox-modal {



	position: fixed;

	left: 0;

	top: 0;

	

	width: 100%;

	height: 100%;

	

	display: none;

	z-index: 9999;

	

	-webkit-user-select: none;

	-moz-user-select: none;

	-ms-user-select: none;

	-o-user-select: none;

	user-select: none;

	

}



/* h2 header spacing for custom html */

.jackbox-modal h2 {

	

	margin: 0 0 12px -2px;

	

}



/* h3 header spacing for descrptions/info */

.jackbox-modal h3 {

	

	margin: 0 0 8px -2px;

	

}



/* custom html unordered list */

.jackbox-modal ul {



	margin: 0;

	padding: 0;

	

}



/* custom html unordered list items */

.jackbox-modal li {



	margin: 0 0 10px 0;

	padding: 0;

	

}



/* normalize custom html padding */

.jackbox-modal li:last-child {



	margin-bottom: -10px;

	

}



/* custom html content container */

.jackbox-html > div {

	

	padding: 16px 20px 16px 20px;

	box-sizing: border-box;



}



/* custom html content paragraphs */

.jackbox-html > div p {

	

	margin: 5px 0 0 0;

	color: #808080;

	

}



/* the title text container */

.jackbox-title-text {

	

	position: absolute;

	left: 6px;

	top: 7px;

	

	width: 100%;

	overflow: hidden;

	text-align: center;

	white-space: nowrap;

	z-index: 0;

	

}



/* description text container */

.jackbox-info-text {

	

	display: inline-block;

	overflow-y: auto;

	z-index: 999;

	width: 100%;

	

	position: absolute;

	top: 0;

	left: 0;

	

}



/* description text inner container */

.jackbox-description-text {

	

	padding: 14px 17px 19px 17px;

	

}



/* hide content initially */

.jackbox-html,

.jackbox-wrapper,

.jackbox-content,

.jackbox-description,

.jackbox-hidden-items {



	display: none;

	

}



/* Allow overflow for html divs */

.jackbox-html {



	overflow-y: auto;

	

}



/* https://developer.mozilla.org/en-US/docs/CSS/Image-rendering */

.jackbox-modal img {



	image-rendering: optimizeSpeed;

	

}



/* the main content container */

.jackbox-holder {

	

	position: absolute;

	left: 50%;

	top: 50%;

	

	width: 100%;

	height: 100%;

	overflow: hidden;

	

	opacity: 0;

	padding: 33px 6px 34px 6px;

	

	-webkit-user-select: none;

	-moz-user-select: none;

	-ms-user-select: none;

	-o-user-select: none;

	user-select: none;

	

}



/* the main media container */

.jackbox-container {

	

	width: 100%;

	height: 100%;

	

	position: relative;

	overflow: hidden;

	

	z-index: 0;

	text-align: center;



}



/* gets applied to the media itself (image/iframe) */

.jackbox-content {

	

	margin: 0 auto;

		

}



/* when non-native fullscreen video is activated, gets applied to html/body tags */

.jackbox-overflow {

	

	overflow: hidden !important;

	

}



/* main thumbstrip container */

.jackbox-thumb-holder {

	

	position: absolute;

	width: 100%;

	bottom: 0;

	left: 0;

	

}



/* inner thumbstrip container */

.jackbox-thumb-panel {

	

	position: absolute;

	left: 50%;

	

	overflow: hidden;

	white-space: nowrap;

	padding: 2px 2px 0 2px;

	

}



/* final thumbstrip container */

.jackbox-thumb-strip {

	

	position: relative;

	

}



/* thumbnail container */

.jackbox-thumb {

	

	overflow: hidden;

	position: absolute;

	top: 0;

	

	-webkit-user-select: none;

	-moz-user-select: none;

	-ms-user-select: none;

	-o-user-select: none;

	user-select: none;

	

}



/* thumbnail image */

.jackbox-thumb img {

	

	cursor: pointer;

	

	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

    filter: alpha(opacity=0);

	opacity: 0;

	

	-webkit-transition: opacity 0.4s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-moz-transition: opacity 0.4s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-o-transition: opacity 0.4s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-ms-transition: opacity 0.4s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	transition: opacity 0.4s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	

}



/* gets added when the thumbnail loads */

.jb-thumb-fadein img {

	

	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

    filter: alpha(opacity=50);

	opacity: 0.5;

	

}



/* gets applied to an active thumb item */

.jb-thumb-active img {

	

	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

    filter: alpha(opacity=100);

	opacity: 1;

	

}



/* thumbnail mouse over */

.jb-thumb-hover img:hover {

	

	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

    filter: alpha(opacity=100);

	opacity: 1;

	

}



/* removes the pointer cursor for an active thumbnail */

.jb-thumb-active img {

	

	cursor: auto;

	

}



/* the thumbstrip arrows */

.jackbox-thumb-left,

.jackbox-thumb-right {

	

	cursor: pointer;

	position: absolute;

	display: none;

	

}



/* the content header */

.jackbox-top {

	

	position: absolute;

	top: 7px;

	left: 5px;

	

}



/* cross-browser fix for background */

.jackbox-top:after {

	

	content: "";

	position: absolute;

	top: 26px;

	left: 1px;

	width: 100%;

	height: 1px;

	background-color: #FFF;

	display: block;

	z-index: 999;

	

}



/* the content footer */

.jackbox-bottom {

	

	position: relative;

	white-space: nowrap;

	z-index: 99;

	

}



/* the social widget */

.jackbox-social {

	

	position: absolute;

	

}



/* the header's button container (the close button) */

.jackbox-top-icons {

	

	position: absolute;

	right: -1px;

	

}



/* the footer's button container */

.jackbox-bottom-icons {

	

	position: absolute;

	right: 0px;

	top: 7px;

	

}



/* the prev/next button container */

.jackbox-controls {

	

	position: absolute;

	left: 0;

	top: 7px;

	z-index: 1;

	

}



/* gets applied to header/footer buttons */

.jackbox-button {

	

	cursor: pointer;

	display: inline-block;

	

}



/* the next item button */

.jackbox-arrow-right {

	

	margin-left: 6px;

	

}



/* show/hide, fullscreen/normalscreen buttons */

.jackbox-button-margin {



	margin-left: 6px;

	

}



/* toggle the fullscreen buttons while in fullscreen */

:-webkit-full-screen .jackbox-fs {

	

	display: none !important; 

  

}



/* toggle the fullscreen buttons while in fullscreen */

:-moz-full-screen .jackbox-fs {



	display: none !important; 

	

}



/* toggle the fullscreen buttons while in fullscreen */

:-webkit-full-screen .jackbox-ns {

	

	display: inline-block !important; 

  

}



:-moz-full-screen .jackbox-ns {



	display: inline-block !important; 

	

}



/* large prev/next buttons located on the far sides of the modal */

.jackbox-panel {

	

	display: block;

	cursor: pointer;

	visibility: hidden;

	

	background-position: center center;

	background-repeat: no-repeat;

	background-size: 38px 38px;

	

	width: 58px;

	height: 100%;

	

	position: absolute;

	top: 0;

	

	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

    filter: alpha(opacity=0);

	opacity: 0;

	

	-webkit-transition: all 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-moz-transition: all 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-o-transition: all 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-ms-transition: all 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	transition: all 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	

}



/* large prev button */

.jackbox-panel-left {



	left: 0;

	

}



/* large next button */

.jackbox-panel-right {



	right: 0;

	

}



/* the main preloader container */

.jackbox-preloader {

	

	position: fixed;

	left: 50%;

	top: 50%;

		

	display: none;

	margin: -15px 0 0 -15px;

	z-index: 9999;

	

	width: 30px;

	height: 30px;

	

	-moz-border-radius: 50%;

	-webkit-border-radius: 50%;

	border-radius: 50%;

	

}



/* only gets added when the preloader is shown */

.jackbox-spin-preloader {

	

	display: block;

	

	-webkit-animation: rotator 1s linear infinite;

	-moz-animation: rotator 1s linear infinite;

	-ms-animation: rotator 1s linear infinite;

	animation: rotator 1s linear infinite;

	

}



/* graphic placed inside preloader to get that nice spinning gradient look */

.jackbox-pre-inside {

	

	display: block;

	margin: 5px 0 0 5px;

	width: 20px;

	height: 20px;

	

	-moz-border-radius: 50%;

	-webkit-border-radius: 50%;

	border-radius: 50%;

	

	-webkit-transition: background-color 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-moz-transition: background-color 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-o-transition: background-color 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-ms-transition: background-color 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	transition: background-color 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	

}



/* small thumb tooltip container */

.jackbox-thumb-tip {

	

	display: block;

	position: fixed;

	overflow: hidden;

	

	opacity: 0;

	z-index: 9999;

	visibility: hidden;

	pointer-events: none;

	padding: 5px 10px 5px 10px;

	

	-webkit-transition: all 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-moz-transition: all 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-o-transition: all 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-ms-transition: all 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	transition: all 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	

}



/* small thumb tooltip text */

.jackbox-thumb-tip-text {



	white-space: nowrap;

	display: inline-block;

	text-transform: uppercase;

	

	-webkit-transition: width 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-moz-transition: width 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-o-transition: width 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	-ms-transition: width 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	transition: width 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);

	

}



/* CSS3 Preloader */

@-webkit-keyframes rotator {

	

	from { 

		-webkit-transform: rotate(0deg); 

	}

	

	50%  { 

		-webkit-transform: rotate(180deg);

	}

	

	to   { 

		-webkit-transform: rotate(360deg);

	}

	

}



/* CSS3 Preloader */

@-moz-keyframes rotator {

	

	from { 

		-moz-transform: rotate(0deg); 

	}

	

	50%  { 

		-moz-transform: rotate(180deg);

	}

	

	to   { 

		-moz-transform: rotate(360deg);

	}

	

}



/* CSS3 Preloader */

@-ms-keyframes rotator {

	

	from { 

		-ms-transform: rotate(0deg); 

	}

	

	50%  { 

		-ms-transform: rotate(180deg);

	}

	

	to   { 

		-ms-transform: rotate(360deg);

	}

	

}



/* CSS3 Preloader */

@keyframes rotator {

	

	from { 

		transform: rotate(0deg); 

	}

	

	50%  { 

		transform: rotate(180deg);

	}

	

	to   { 

		transform: rotate(360deg);

	}

	

}



/* ----------------------------------------------------------- */

/*                         SMARTPHONE                          */

/* ----------------------------------------------------------- */



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

	

	.jackbox-panel,

	.jackbox-thumb-holder {

		

		display: none !important;

		

	}

	

	.jackbox-show-thumbs,

	.jackbox-hide-thumbs {

	

		width: 0;

		margin-left: 0;

		overflow: hidden;

		

	}

	

}



/* ----------------------------------------------------------- */

/*                        RETINA ICONS                         */

/* ----------------------------------------------------------- */



@media

only screen and (-webkit-min-device-pixel-ratio: 2),

only screen and (min--moz-device-pixel-ratio: 2),

only screen and (-o-min-device-pixel-ratio: 2/1),

only screen and (min-device-pixel-ratio: 2),

only screen and (min-resolution: 192dpi),

only screen and (min-resolution: 2dppx) { 

	

	/* previous button */

	.jackbox-arrow-left {

		

		background-image: url(../img/jackbox/retina/left_arrow@2x.png);

		

	}

	

	/* next button */

	.jackbox-arrow-right {

		

		background-image: url(../img/jackbox/retina/right_arrow@2x.png);

		

	}

	

	/* info button */

	.jackbox-info {

		

		background-image: url(../img/jackbox/retina/info@2x.png);

		

	}

	

	/* show thumbnails (+) */

	.jackbox-show-thumbs {

		

		background-image: url(../img/jackbox/retina/thumbs_show@2x.png);

		

	}

	

	/* hide thumbnails (-) */

	.jackbox-hide-thumbs {

		

		background-image: url(../img/jackbox/retina/thumbs_hide@2x.png);

		

	}

	

	/* close button */

	.jackbox-close {

		

		background-image: url(../img/jackbox/retina/exit@2x.png);

		

	}

	

	/* fullscreen button */

	.jackbox-fs {

	

		background-image: url(../img/jackbox/retina/fullscreen@2x.png);

		

	}

	

	.jackbox-ns {

	

		background-image: url(../img/jackbox/retina/normalscreen@2x.png);

		

	}

	

	/* the thumb panel's left arrow */

	.jackbox-thumb-left {

		

		background-image: url(../img/jackbox/retina/thumb_left@2x.png);

		

	}

	

	/* the thumb panel's right arrow */

	.jackbox-thumb-right {

		

		background-image: url(../img/jackbox/retina/thumb_right@2x.png);

		

	}

	

	/* large prev button */

	.jackbox-panel-left {

		

		background-image: url(../img/jackbox/retina/panel_left@2x.png);

		

	}

	

	/* large next button */

	.jackbox-panel-right {

		

		background-image: url(../img/jackbox/retina/panel_right@2x.png);	

		

	}

	

	/* large prev button on mouse over */

	.jackbox-panel-left:hover {



		background-image: url(../img/jackbox/retina/panel_left_over@2x.png);	

		

	}

	

	/* large right button on mouseover */

	.jackbox-panel-right:hover {

		

		background-image: url(../img/jackbox/retina/panel_right_over@2x.png);	

		

	}



}



