/* Import Skins */

/* Slider Skins */
@import url('../slider_skins/windows8/style.css');
@import url('../slider_skins/modern/style.css');
@import url('../slider_skins/fullscreen/style.css');

/* Carousel Skins */
@import url('../carousel_skins/simple/style.css');
@import url('../carousel_skins/modern/style.css');
@import url('../carousel_skins/coverflow/style.css');

/* Tabs Skins */
@import url('../tabs_skins/white/style.css');
@import url('../tabs_skins/crystal/style.css');
@import url('../tabs_skins/silver/style.css');
@import url('../tabs_skins/blue/style.css');
@import url('../tabs_skins/black/style.css');
@import url('../tabs_skins/black_glass/style.css');
@import url('../tabs_skins/green/style.css');
@import url('../tabs_skins/green_glass/style.css');

/* Global Styles */
.isInFullScreen {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	height: 100% !important;
	margin: auto !important;
	z-index: 10000 !important;
}

.mSCaption {
	-webkit-transform: translateZ(0);
	   -moz-transform: translateZ(0);
	    -ms-transform: translateZ(0);
			transform: translateZ(0);
}

#example {
			position: relative;
			background: #000;
		}
		#example .mightyslider_modern_skin {
			margin-right: 299px;
		}
		#example .frame {
			width: 100%;
			height: 500px;
		}
		#example .frame .slide_element {
			height: 100%;
		}
		#example .frame .slide_element > div {
			float: left;
			height: 100%;
		}
		#example .frame .mSCover img {
			max-width: none;
		}
		#example .tabs {
			position: absolute;
			width: 299px;
			height: 100%;
			right: 0;
			background: #000;
		}
		#example .tabs ul {
			width: 100%;
			margin: 0;
			padding: 0;
		}
		#example .tabs ul li {
			background: #000;
			width: 100%;
			cursor: pointer;
			padding: 15px 10px;
			border-bottom: #333 1px solid;
			color: #5a5a5a;
			font-weight: 300;
			font-size: 12px;
			
			-webkit-box-sizing: border-box;
			   -moz-box-sizing: border-box;
			        box-sizing: border-box;

			-webkit-transition: background 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
			   -moz-transition: background 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
				-ms-transition: background 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
				 -o-transition: background 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
					transition: background 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
		}
		#example .tabs ul li:last-of-type {
			border-bottom: 0;
		}
		#example .tabs ul li h3 {
			font-size: 18px;
			line-height: 18px;
			font-weight: 400;
			margin: 0;
			margin-bottom: 10px;
		}
		#example .tabs ul li:hover {
			background: #000;
			color: #999;
		}
		#example .tabs ul li:hover h3 {
			color: #FFF;
		}
		#example .tabs ul li.active {
			background: #001;
			color: #FFF;
		}
		#example .caption {
			font-size: 26px;
			line-height: normal;
			font-weight: 300;
			text-shadow:0px 0px 0 rgb(208,208,208), 1px 1px 0 rgb(170,170,170),2px 2px 1px rgba(0,0,0,0.05),2px 2px 1px rgba(0,0,0,0.5),0px 0px 1px rgba(0,0,0,.2);
			color: #FFF;
			opacity: 0;
			letter-spacing: -1px;
			white-space: nowrap;
			text-align: center;
			z-index: 1002;
			text-transform: uppercase;
			text-align: center;
		}
		#example .caption1 {
			font-size: 20px;
			top: 390px;
			left: 80px;
			text-shadow: rgba(0,0,0,0.7) 0 1px 0px;
			text-align: left;
			word-spacing: 4px;
			line-height: 100%;
		}
		#example .caption2 {
			top: 390px;
			left: 180px;
			background: rgba(0,0,0,0.4);
			padding: 10px 20px;
			border-radius: 100px;
		}
		#example .caption3 {
			width: 166px;
			height: 166px;
			line-height: normal;
			font-size: 166px;
			font-family: Times;
			top: 300px;
			left: 300px;
		}
		
		/* Responsive */
		@media (min-width: 980px) and (max-width: 1000px) {
			#example .mightyslider_modern_skin {
				margin-right: 239px;
			}
			#example .tabs {
				width: 239px;
			}
			#example .tabs ul li h3 {
				font-size: 14px;
				line-height: 14px;
			}
		}
		
		@media (max-width: 979px) {
			#example .mightyslider_modern_skin {
				margin-right: 182px;
			}
			#example .tabs {
				width: 182px;
			}
			#example .tabs ul li h3 {
				font-size: 11px;
				line-height: 11px;
			}
		}
		
		@media (max-width: 767px) {
			.marketing2  {
				margin-left: -20px;
				margin-right: -20px;
			}
		}
		
		@media (max-width: 480px) {
			#example .mightyslider_modern_skin {
				margin-right: 0;
			}
			#example .tabs {
				display: none;
			}
		}