﻿/**
 * @package		Mb2 Slider
 * @version		1.4.0
 * @author		Mariusz Boloz (http://mb2extensions.com)
 * @copyright	Copyright (C) 2016 Mariusz Boloz (http://mb2extensions.com). All rights reserved
 * @license		Commercial (http://codecanyon.net/licenses)
**/

@font-face {
  font-family: 'mb2slider_font';
  src: url('../font/mb2slider_font.eot?66378961');
  src: url('../font/mb2slider_font.eot?66378961#iefix') format('embedded-opentype'),
       url('../font/mb2slider_font.woff?66378961') format('woff'),
       url('../font/mb2slider_font.ttf?66378961') format('truetype'),
       url('../font/mb2slider_font.svg?66378961#mb2slider_font') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'mb2slider_font';
    src: url('../font/mb2slider_font.svg?66378961#mb2slider_font') format('svg');
  }
}
*/
 
 [class^="mb2slider_icon-"]:before, [class*=" mb2slider_icon-"]:before {
  font-family: "mb2slider_font";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
 
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
 
.mb2slider_icon-right-open:before { content: '\e800'; } /* '' */
.mb2slider_icon-left-open:before { content: '\e801'; } /* '' */
.mb2slider_icon-down-open:before { content: '\e802'; } /* '' */
.mb2slider_icon-up-open:before { content: '\e803'; } /* '' */




/* Style for slider container */

.mb2slider {
	position: relative;
	margin: 0 auto;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: cover;
}

.mb2slider *,
.mb2slider *:before,
.mb2slider *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    box-sizing: border-box;	
}


.mb2slider-caption-blackbox h2 {
	font-size: 25px !important;
}


/*.mb2slider-caption-blackbox::after {
    background: #333 none repeat scroll 0 0;
    content: "";
    display: inline-block;
    float: right;
    height: calc(123% + 3px);
    position: absolute;
    right: -58px;
    top: 0;
    transform: skew(-30deg, 0deg);
    width: 118px;
    z-index: 10;
}*/

.mb2slider-caption-blackbox {
    background: rgba(112, 112, 112, 0.77) none repeat scroll 0 0;
    color: #2e8def;
    font-size: 20px;
    padding: 10px 20px;
    position: relative;
    text-align: center;
    z-index: 22;
  -webkit-transform:skew(-200deg);
  -moz-transform:skew(-200deg);
  transform:skew(-200deg);
}
/*
.mb2slider-caption-yellowbox {
    background: #f0bc22 none repeat scroll 0 0;
    border-bottom: 85px solid #f0bc22;
    color: #2e8def;
    font-size: 20px;
    min-height: 76px;
    padding: 10px 20px;
    position: relative;
    text-align: center;
    top: -76px;
    width: 56%;
    z-index: 20;
    box-shadow: 5px 5px 5px -8px #000;
    opacity:0.8;
}

.mb2slider-caption-yellowbox::after {
    background: #f0bc22 none repeat scroll 0 0;
    content: "";
    display: inline-block;
    float: right;
    height: calc(760% + 3px);
    position: absolute;
    right: -49px;
    top: -50px;
    transform: skew(-30deg, 0deg);
    width: 85px;
    z-index: 10;
    box-shadow: 5px 5px 5px -8px #000;
    opacity:0.8;
} */



/* ============================== VISIBLE SLIDES MODE ============================== */

.mb2slider-slides-visible {
	overflow: hidden;	
}

.mb2slider-slides-visible .lSSlideOuter,
.mb2slider-slides-visible .lSSlideWrapper {
	overflow: visible!important;	
}

.mb2slider-slides-visible .lSSlideOuter {
	position: relative;	
	margin: 0 200px;
}

.mb2slider-slides-visible .lSSlideOuter:after,
.mb2slider-slides-visible .lSSlideOuter:before {
	display: block;
	content: '';
	position: absolute;
	top: 0;
	height: 100%;
	width: 200px;
	background-color: rgba(0,0,0,.4);	
	z-index: 10;
}

.mb2slider-slides-visible .lSSlideOuter:before {
	left: -200px;	
}

.mb2slider-slides-visible .lSSlideOuter:after {
	right: -200px;	
}




/* ============================== SLIDER LIST ============================== */

.mb2slider-slide-list {
	margin: 0;
	padding: 0;
}

.mb2slider-slide-list > li {
	margin: 0;
	padding: 0;
	position: relative;	
}

.mb2slider-slide-img {
	width: 100%;
	height: auto;
	position: static !important;
	left: 0!important;
	top: 0 !important;	
}




/* ============================== DIRECTION NAVIGATION ============================== */

.mb2slider .lSAction > a {
	background: 0;
	line-height: 32px;
	text-align: center;
	font-size: 22px;    
    opacity: 0;
	color: #fff;
	text-decoration: none;
	outline: none;
	-webkit-transition: all 0.15s linear 0s;
    transition: all 0.15s linear 0s;
}

.mb2slider:hover .lSAction > a {
	opacity: 1;	
}

.mb2slider .lSAction > a:hover,
.mb2slider .lSAction > a:focus {
	color: #fff;
	text-decoration: none;	
}

.mb2slider .lSAction > .lSPrev {
    left: 0;
}
.mb2slider .lSAction > .lSNext {
    right: 0;
}

.mb2slider .lSSlideOuter.vertical .lSAction > .lSNext {
	bottom: 0;	
}

.mb2slider .lSSlideOuter.vertical .lSAction > .lSPrev {
	top: 0;	
}



/* ============================== CONTROL NAVIGATION ============================== */

.mb2slider .lSPager.lSpg {
	position: relative;
	top: -40px;	
}

.mb2slider .lSSlideOuter .lSPager.lSpg > li a {
	border: solid 1px rgba(255,255,255,0);
	background-color: #fff;
	-webkit-transition: all 0.15s linear 0s;
    transition: all 0.15s linear 0s;
	outline: none;
}

.mb2slider .lSSlideOuter .lSPager.lSpg > li a:hover {
	background-color: #fff;	
}

.mb2slider .lSSlideOuter .lSPager.lSpg > li.active a  {
	height: 12px;
	width: 12px;
	border-color: #fff;
	background-color: rgba(255,255,255,0);
}



/* ============================== CAPTION ============================== */

.mb2slider-caption {
	position: absolute;
	top: 0;
	bottom: 0;
	left: -45px;
	/*right: 0;*/
	font-size: 12px;
	line-height: 1.4;
	color: #fff;
	margin: 0 auto;
	max-width: 100%;
	z-index: 2;

}


/* Caption animation */

.mb2slider-slide-list > li .mb2slider-caption.anim1 {
	top: 15px;
	bottom: -15px;
	opacity: 0;
}

/*.mb2slider-slide-list > li.active .mb2slider-caption.anim1 {
	top: 0;
	bottom: 0;
	opacity: 1;	
}*/


.mb2slider-caption.hor-center .mb2slider-caption-content {
	text-align: center;	
	margin-left: auto;
	margin-right: auto;	
}

.mb2slider-caption.hor-right .mb2slider-caption-content {
	float: right;	
}

.mb2slider-caption.hor-left {}

.mb2slider-caption-content {
	padding: 30px 0;
	
}

.mb2slider-title {
	color: #fff;
	font-size: 2em;	
	line-height: 1.2;
	margin: 0 30px .3em 30px;
 	padding-left: 150px;
    	text-align: left;
	transform: skew(20deg);
}

.mb2slider-description {
	margin: 0 30px;	
}


.mb2slider-caption1 {
	max-width: 100%;
	height: 100%;	
}

.mb2slider-caption2 {
	display: table;
	height: 100%;
	width: 100%;
}

.mb2slider-caption3 {
	display: table-cell;
}

.ver-center .mb2slider-caption3 {	
	vertical-align: middle;
}

.ver-top .mb2slider-caption3 {	
	vertical-align: top;
}

.ver-bottom .mb2slider-caption3 {	
	vertical-align: bottom;
}



/* ============================== VIDEO ============================== */

.mb2slider-video {
    height: 0;
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
}

.mb2slider-video iframe,
.mb2slider-video object,
.mb2slider-video embed {
    height: 100%;
    left: 0;
    width: 100%;
    position: absolute;
    top: 0;
}







/* ============================== VIDEO BACKGROUND ============================== */


.mb2slider-video-wrap {
	position: relative;
	top: 0 !important;
	left: 0 !important;	
}


.mbYTP_wrapper {
	z-index: 1!important;	
}


.YTPOverlay {
		
}






@media only screen and (max-width:1200px){
	
	
	.mb2slider-slides-visible .lSSlideOuter {
		margin-left: 100px !important;
		margin-right: 100px !important;	
	}	
	
	.mb2slider-slides-visible .lSSlideOuter:after,
	.mb2slider-slides-visible .lSSlideOuter:before {
		width: 100px !important;
	}
	
	.mb2slider-slides-visible .lSSlideOuter:before {
		left: -100px !important;	
	}
	
	.mb2slider-slides-visible .lSSlideOuter:after {
		right: -100px !important;	
	}
	
}

@media only screen and (max-width:991px){
	.mb2slider-caption-blackbox h2{
		font-size: 14px !Important;
	}


	.mb2slider-title {
		padding-left:80px;
	}
}





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

		
	.mb2slider .lSAction > .lSPrev {
		left: 0!important;
	}
	.mb2slider .lSAction > .lSNext {
		right: 0!important;	
	}
	
	
	.mb2slider-caption1,
	.mb2slider-caption-content {
		width: 100% !important;	
	}
	
	
	.mb2slider-slides-visible .lSSlideOuter {
		margin-left: 50px !important;
		margin-right: 50px !important;	
	}	
	
	.mb2slider-slides-visible .lSSlideOuter:after,
	.mb2slider-slides-visible .lSSlideOuter:before {
		width: 50px !important;
	}
	
	.mb2slider-slides-visible .lSSlideOuter:before {
		left: -50px !important;	
	}
	
	.mb2slider-slides-visible .lSSlideOuter:after {
		right: -50px !important;	
	}
	
	.mb2slider-caption-blackbox {

		width: 55% !important;
	}
	

}






@media only screen and (max-width:768px){
	
	
	
	.mb2slider-slides-visible .lSSlideOuter {
		margin-left: 30px !important;
		margin-right: 30px !important;	
	}	
	
	.mb2slider-slides-visible .lSSlideOuter:after,
	.mb2slider-slides-visible .lSSlideOuter:before {
		width: 30px !important;
	}
	
	.mb2slider-slides-visible .lSSlideOuter:before {
		left: -30px !important;	
	}
	
	.mb2slider-slides-visible .lSSlideOuter:after {
		right: -30px !important;	
	}			
}



@media screen and (max-width: 767px){
	.mb2slider-caption-yellowbox {
		display:none;
	
	}

	.mb2slider-caption-blackbox::after {
		display:none;
	}

	.mb2slider-caption-blackbox {
		width:100% !important;
	}

	.mb2slider-caption-blackbox {
    		opacity:0.8;
    		
    		bottom: 0;
    		min-height: 95px;
    		
	}

}


@media screen and (max-width:580px){
	.mb2slider-caption-blackbox{
		font-size: 15px;
	}
}

