.laptop-slider__slideshow {overflow: hidden;}
.laptop-slider__slideshow.ls--fullscreen {height:100vh;}

/* Static content */
.laptop-slider__wrapper { width: 100%; overflow: hidden; }

/* Source Styles */
.ls--fullscreen .laptop-slider__inner { position: absolute; left: 50%; bottom: 4%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }

.ls__container {position: relative;}

/* Main Big Title */
.ls__main-title {font-size: 30px; margin-bottom: 60px; color:#fff; text-align:center; line-height: 1.2; font-weight: 300;}

/* Laptop IosSlider */
.zn_laptop_slider_wrapper {width: 100%; height: 100%; position: absolute; overflow: hidden; }
.zn_laptop_slider {width: 100%; height: 100%; -webkit-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden;}
.zn_laptop_slider_container {width: 100%; height: 100%;}
.ls__slider-item {float: left; position: relative; top: 0; left: 0; width: 100%; height: 100%; margin: 0 0 0 0; }
.ls-slider-item__img {position: absolute; top:0; left:0; right:0; bottom: 0; background-position: center top; background-size: cover; background-repeat: no-repeat;}

/* Caption - Just Laptop View */
.ls--laptop .ls__item-caption {position: absolute; bottom: 30px; z-index:1; color: #fff; background-color: #000; border-left: 3px solid #cd2122; padding: 3px 20px; font-size: 18px; opacity: 0; left: 100px; -webkit-transition:opacity .3s ease-out .4s, left .3s ease-out .4s; transition:opacity .3s ease-out .4s, left .3s ease-out .4s; }
.ls--laptop .ls__item-caption a {color:#fff;}
.ls--laptop .item--active .ls__item-caption {left: 30px; opacity: 1; }

/* Laptop Mask */
.ls__laptop-mask { width: 80%; max-width: 100%; padding-bottom: 41%; padding-top: 0; height: 0; margin-left: auto; margin-right: auto; position: relative;}
.ls--laptop .ls__laptop-mask { margin-bottom: 20px;}
.ls__laptop-mask::after {background: url(images/macbook-air.svg) no-repeat center top; content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-size: 100%; background-position: 50% 0 }
.ls__laptop-mask .ls__screen { position: absolute; bottom: 0; overflow: hidden; width: 65.7%; height: 0; top: 0; left: 0; margin-left: 17.2%; margin-top: 3.5%; padding-bottom: 41.4%; background-color: rgba(0,0,0,0.5);}
/* Laptop with Slider descirption */
.ls--lapt_slider_desc .ls__laptop-mask,
.ls--lapt_desc .ls__laptop-mask { width: 70%; padding-bottom: 39%; float: right; margin-right: -50px;}
/* Left side description */
.ls__left-desc {float: left; width: -webkit-calc(30% + 110px); width: calc(30% + 110px); margin-right: -60px; color:#fff; position: absolute; left: 0; bottom: 180px;}
.ls__sl-main-title {font-size: 36px; font-weight: 700; margin-bottom: 25px; line-height: 1.3;}
.ls__sl-main-desc {font-size: 16px; line-height: 1.5; margin-bottom: 40px;}
.ls__secbtn {margin-left: 20px;}
/* Slide item details */
.ls_slide_item-details {position: absolute; bottom: 0; left: 10px; opacity:0; visibility: hidden; -webkit-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); -webkit-transition:-webkit-transform .2s ease-out, opacity .2s ease-out, visibility .2s ease-out; transition:transform .2s ease-out, opacity .2s ease-out, visibility .2s ease-out;}
.ls_slide_item-details.selected {opacity: 1; visibility: visible; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);}
/* Slider bullets */
.ls__nav {position: absolute; bottom: -10px; width: 100%; text-align: center; z-index: 1; }
.ls--laptop .ls__nav {bottom: -30px;}
.ls--lapt_slider_desc .ls__laptop-mask,
.ls--lapt_desc .ls__laptop-mask {bottom:0;}
.ls__nav-item {display: inline-block; width: 15px; height: 4px; margin: 0; background: #444; opacity: .4; margin-left: 5px; cursor: pointer; position:relative; border-radius: 2px; -webkit-transition: opacity .3s ease-in-out, width .3s ease-in-out; transition: opacity .3s ease-in-out, width .3s ease-in-out; }
.ls__nav-item:first-child {margin-left: 0;}
.ls__nav-item:hover { opacity:1; }
.ls__nav-item.selected { opacity:1; width: 27px; background-color: #cd2122;}

/* Slider Arrows */
.ls__arrows {position: absolute; top: 0; width: 100%; text-align: center; z-index: 1; }
.ls__arrow {position: absolute; display: block; cursor: pointer; width: 65px; height: 140px; overflow: hidden; opacity: 0; -webkit-transition:opacity .2s ease-out, left .2s ease-out, right .2s ease-out; transition:opacity .2s ease-out, left .2s ease-out, right .2s ease-out;   -webkit-backface-visibility: hidden;}
.ls__arrow:before,
.ls__arrow:after {width: 90px; height: 20px; display:block; content:''; background-color: rgba(255, 255, 255, 0.17); -webkit-transform: rotate(-45deg)  skew(45deg); -ms-transform: rotate(-45deg)  skew(45deg); transform: rotate(-45deg)  skew(45deg); top: 50px; left:auto; right:0; position:absolute; -webkit-transform-origin: 100% 100%; -ms-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transition: background-color .2s ease-out; transition: background-color .2s ease-out;   -webkit-backface-visibility: hidden;
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.17) 100%); background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.17) 100%);}
.ls__arrow:before {top: 70px; -webkit-transform: rotate(45deg) skew(-45deg);-ms-transform: rotate(45deg) skew(-45deg);transform: rotate(45deg) skew(-45deg); -webkit-transform-origin: 100% 0;-ms-transform-origin: 100% 0;transform-origin: 100% 0;}
.ls__arrow-left {left: 10.6%; -webkit-transform: scale(-1); -ms-transform: scale(-1); transform: scale(-1); top: 190px;}
.ls__arrow-right {right: 10.6%; top:90px; }
.ls__laptop-mask:hover .ls__arrow-left {left: 6.6%; opacity: 1;}
.ls__laptop-mask:hover .ls__arrow-right {right: 6.6%; opacity: 1;}
.ls--lapt_slider_desc .ls__laptop-mask:hover .ls__arrow-left ,
.ls--lapt_desc .ls__laptop-mask:hover .ls__arrow-left {left:5.6%;}
.ls--lapt_slider_desc .ls__laptop-mask:hover .ls__arrow-right ,
.ls--lapt_desc .ls__laptop-mask:hover .ls__arrow-right {right:5.6%;}
.ls__arrow:hover:before,
.ls__arrow:hover:after { background-color: rgba(255, 255, 255, 0.3); }

/* Source Mask */
.ls-source__mask {position: absolute; bottom:0; left:0; height: 20vh; background:#fff; width: 100%; -webkit-transform-origin: 100% 0; -ms-transform-origin: 100% 0; transform-origin: 100% 0; -webkit-transform: skewY(-2deg); -ms-transform: skewY(-2deg); transform: skewY(-2deg); -webkit-backface-visibility:hidden;}
.ls-source__mask.ls-source__mask-front {background: -moz-linear-gradient(top,  rgba(245,245,245,0.6) 0%, rgba(245,245,245,1) 60%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(245,245,245,0.6)), color-stop(60%,rgba(245,245,245,1))); background: -webkit-linear-gradient(top,  rgba(245,245,245,0.6) 0%,rgba(245,245,245,1) 60%); background: -o-linear-gradient(top,  rgba(245,245,245,0.6) 0%,rgba(245,245,245,1) 60%); background: -ms-linear-gradient(top,  rgba(245,245,245,0.6) 0%,rgba(245,245,245,1) 60%); background: linear-gradient(to bottom,  rgba(245,245,245,0.6) 0%,rgba(245,245,245,1) 60%);}
.ls-source__mask.ls-source__mask-back {background:rgba(255,255,255,.4);    -webkit-transform: skewY(-3.1deg); -ms-transform: skewY(-3.1deg); transform: skewY(-3.1deg); -webkit-backface-visibility:hidden;bottom: 40px;}


/* Dark color theme */
.ls--theme-dark .ls__main-title ,
.ls--theme-dark .ls__left-desc {color:#343434;}

/* MQ's */
@media only screen and (max-height : 680px) {
	.laptop-slider__slideshow.ls--fullscreen,
	.laptop-slider__slideshow {height: auto; }
	.laptop-slider__source + .laptop-slider__inner {position: relative;}
}

@media only screen and (min-width : 1280px) and (max-width : 1440px) {

}

@media only screen and (max-width : 1279px) {
	.ls__laptop-mask {width: 90%; padding-bottom: 47%;}
}

@media only screen and (min-width : 992px) and (max-width : 1279px) {

}

@media only screen and (max-width : 991px) {
	.laptop-slider__slideshow {height: auto; }
	.laptop-slider__source + .laptop-slider__inner {position: relative}
	.ls-source__mask {height: 120px;}

	.ls__laptop-mask { width: 100%; padding-bottom: 51%;}
	.ls__main-title {font-size: 27px; }

	/* Laptop with description */
	.ls--lapt_slider_desc.laptop-slider__slideshow,
	.ls--lapt_desc.laptop-slider__slideshow {height:auto;}
	.ls--lapt_slider_desc .ls__laptop-mask,
	.ls--lapt_desc .ls__laptop-mask { width: 100%; padding-bottom: 52%; float: none; margin-right: 0;}
	.ls--lapt_slider_desc .ls__left-desc,
	.ls--lapt_desc .ls__left-desc {float: none; width: 100%; position: static; text-align: center; margin-right: 0; margin-top: 50px; }
	.ls--lapt_slider_desc .ls-source__mask,
	.ls--lapt_desc .ls-source__mask {display: none;}
	.ls_slide_item-details {position: static; display: none; }
	.ls_slide_item-details.selected {display: block; }

}

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

}

@media only screen and (max-width : 767px) {
	.ls__main-title { margin-bottom: 40px; margin-top: 30px; }
	.ls__laptop-mask,
	.ls--lapt_slider_desc .ls__laptop-mask,
	.ls--lapt_desc .ls__laptop-mask  {width: 120%; padding-bottom: 62%; max-width: 120%; margin-left: -10%; }
	.ls__arrows {display: none;}
	.ls--laptop .ls__item-caption {bottom: 10px; padding: 5px 10px; font-size: 12px; line-height: 1.4;}
	.ls--laptop .item--active .ls__item-caption {left: 10px; }

}

@media only screen and (max-width : 480px) {
	.ls__laptop-mask,
	.ls--lapt_slider_desc .ls__laptop-mask,
	.ls--lapt_desc .ls__laptop-mask {width: 140%; padding-bottom: 72%; max-width: 140%; margin-left: -20%; }
}


