.kl-slideshow-css3panels {/*overflow: hidden;*/ position: relative;}

.css3panels-container {overflow:hidden; position:relative; z-index:0; min-height:150px; margin-left: -62px; margin-right: -62px;
    display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
}

/* Panels */
.css3panel {float:left;  position: relative; z-index: 0; min-height:150px;
            flex: 1;
    /* Chrome Hacks */
}
.css3panel:hover {z-index: 1;}
.css3panel:hover .css3panel-inner {box-shadow: 0 0 0 3px #FFF, 0 0 50px 20px rgba(0, 0, 0, 0.5);}

.css3panels--resize .css3panel {
}
.css3panels--resize .css3panel-inner {
            transition: box-shadow .2s ease-out;
}
.css3panels--resize .css3panel:hover {
            flex-grow:1.3;
}

/* Panel width sizes */
.no-flexbox .css3panels-container[data-panels="1"] .css3panel {width: 100%; float: none;}
.no-flexbox .css3panels-container[data-panels="2"] .css3panel {width: 50%;}
.no-flexbox .css3panels-container[data-panels="3"] .css3panel {width: 33.3333%;}
.no-flexbox .css3panels-container[data-panels="4"] .css3panel {width: 25%;}
.no-flexbox .css3panels-container[data-panels="5"] .css3panel {width: 20%;}
.no-flexbox .css3panels-container[data-panels="6"] .css3panel {width: 16.6666%;}
/* Hover resize */
.no-flexbox .css3panels-container.css3panels--resize[data-panels="2"]:hover .css3panel {width: 40%; }
.no-flexbox .css3panels-container.css3panels--resize[data-panels="2"]:hover .css3panel:hover {width: 60%;}
.no-flexbox .css3panels-container.css3panels--resize[data-panels="3"]:hover .css3panel {width: 30%;}
.no-flexbox .css3panels-container.css3panels--resize[data-panels="3"]:hover .css3panel:hover {width: 40%;}
.no-flexbox .css3panels-container.css3panels--resize[data-panels="4"]:hover .css3panel {width: 22%; }
.no-flexbox .css3panels-container.css3panels--resize[data-panels="4"]:hover .css3panel:hover {width: 34%;}
.no-flexbox .css3panels-container.css3panels--resize[data-panels="5"]:hover .css3panel {width: 16%;}
.no-flexbox .css3panels-container.css3panels--resize[data-panels="5"]:hover .css3panel:hover {width: 36%;}
.no-flexbox .css3panels-container.css3panels--resize[data-panels="6"]:hover .css3panel {width: 15%;}
.no-flexbox .css3panels-container.css3panels--resize[data-panels="6"]:hover .css3panel:hover {width: 25%;}

/* Inner panel */
.css3panel-inner { position:relative; transform: skewX(-10deg); backface-visibility:hidden; overflow: hidden; transition: box-shadow .2s ease-out; box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.7);}

/* Image */
 .css3panel-mainimage-wrapper {position: relative; margin-left: -60px; margin-right: -60px; transform-style: preserve-3d; transform: skewX(10deg); backface-visibility: hidden; }
.css3panel-mainimage {position:absolute; top:-2px; left:-2px; right:-2px; bottom:-2px; background-position: 50% 50%; background-repeat: no-repeat;  backface-visibility:hidden;  transition: .2s ease-out; }
 /* Image overlay */
.css3p-overlay {position:absolute; left:0; top:0; right:0; bottom:0; transition:opacity .15s ease-out;}
.css3panel:hover .css3p-overlay {opacity:0; }
.css3p-overlay--gradient { opacity: 0.5; top: 50%;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); }
/* Image animations */
.css3panel-mainimage.anim--grayscale {
    filter:grayscale(100%);
    transition: opacity .15s ease-out;
}
.css3panel:hover .css3panel-mainimage.anim--grayscale {
    opacity:0;
}
.css3panel-mainimage.anim--blur {
    filter:blur(9px);
    transition: opacity .15s ease-out;
}
.css3panel:hover .css3panel-mainimage.anim--blur {
    opacity:0;
}
.css3panel-mainimage.anim--grayscale.anim--blur {
    filter:grayscale(100%) blur(9px);
    transition: opacity .15s ease-out;
}
.css3panel:hover .css3panel-mainimage.anim--grayscale.anim--blur {
    opacity:0;
}
.css3panel-text {padding: 0 20px 0 20px;}
.css3panel-caption {  position: absolute; bottom: 90px; color: #FFFFFF; z-index: 1; width: 100%;   padding: 0 50px 0 50px; box-sizing:border-box; text-align: left;}
.css3panel:first-child .css3panel-caption {padding-left: 80px;}
.css3panel:last-child .css3panel-caption {padding-right:80px;}
.css3panel-caption.css3caption--middle {bottom:auto; top:50%; transform:translateY(-50%); }
.css3panel-title { font-family: "Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif; }
/* Fading in Caption */
.cssp-capt-fadein .css3panel-title,
.cssp-capt-fadein .css3panel-text,
.cssp-capt-fadein .css3panel-btn-area {opacity:0; visibility: hidden; transition:opacity .15s ease-out, visibility .15s ease-out;}
.cssp-capt-fadein .css3panel:hover .css3panel-title,
.cssp-capt-fadein .css3panel:hover .css3panel-text,
.cssp-capt-fadein .css3panel:hover .css3panel-btn-area {opacity:1; visibility: visible;}
.css3panel-title,
.css3panel-text {background:rgba(80,80,80,0.75);}
/* Fading Out Caption */
.cssp-capt-fadeout .css3panel-title,
.cssp-capt-fadeout .css3panel-text,
.cssp-capt-fadeout .css3panel-btn-area {opacity:1; visibility: visible;  transition:opacity .15s ease-out, visibility .15s ease-out;}
.cssp-capt-fadeout .css3panel .css3panel-text {background-color: rgba(80,80,80,0.75)!important;}
.cssp-capt-fadeout .css3panel:hover .css3panel-title,
.cssp-capt-fadeout .css3panel:hover .css3panel-text {background-color:rgba(80,80,80,0.75)!important;}
.cssp-capt-fadeout .css3panel:hover .css3panel-btn-area {}
/* Slide in Caption */
.cssp-capt-slidein .css3panel-title,
.cssp-capt-slidein .css3panel-text,
.cssp-capt-slidein .css3panel-btn-area {opacity:0; visibility: hidden;  transform:translateX(200px); transition:opacity .15s ease-out, visibility .15s ease-out, transform .15s ease-out;}
.cssp-capt-slidein .css3panel:hover .css3panel-title,
.cssp-capt-slidein .css3panel:hover .css3panel-text,
.cssp-capt-slidein .css3panel:hover .css3panel-btn-area {opacity:1; visibility: visible;  transform:translateX(0); }
/* Slide Out Caption */
.cssp-capt-slideout .css3panel-title,
.cssp-capt-slideout .css3panel-text,
.cssp-capt-slideout .css3panel-btn-area {opacity:1; visibility: visible;  transform:translateX(0); transition:opacity .15s ease-out, visibility .15s ease-out, transform .15s ease-out;}
.cssp-capt-slideout .css3panel:hover .css3panel-title,
.cssp-capt-slideout .css3panel:hover .css3panel-text {opacity:0; visibility: hidden; transform:translateX(200px); }
.cssp-capt-slideout .css3panel:hover .css3panel-btn-area {transform:translateY(40px) translateX(-10px);
transition-duration:.3s !important;
transition-delay:.1s !important;}
.cssp-capt-slideout .css3panel:hover .css3p-overlay {opacity:0; }
/* Delay individually */
.cssp-capt-animated .css3panel-title {transition-delay:.1s;}
.cssp-capt-animated .css3panel-text {transition-delay:.2s;}
.cssp-capt-animated .css3panel-btn-area {transition-delay:0s;}
.cssp-capt-animated .css3panel:hover .css3panel-btn-area {transition-delay:.3s;}
.cssp-capt-animated .css3p-overlay {transition-delay:.1s;}

/* Css Title */
.css3panel-title { position: relative; font-size: 28px; line-height: 1.3; font-weight: 600; color: #FFF; float: right; margin:0;}
.css3panel-title.title-size-bigger {font-size: 70px; line-height: 1.1; text-shadow: 1px 1px 50px rgba(0, 0, 0, 0.4); letter-spacing: -2px;}
.css3panel:last-child .css3panel-title {margin-right: 10px;}
/* Panel text*/
.css3panel-text { font-size: 16px; color:#fff; font-weight: 300; margin-top:20px; max-width: 380px; margin-right: 20px; line-height: 1.6; clear: both; float: right;}
/* Dark colors */
.cp-theme--dark .css3panel-title:not(.captiontitle--wbg):not(.captiontitle--dbg),
.cp-theme--dark .css3panel-text {color:#252525;}
/* Title presets */
.captiontitle--wbg {/* color:#181818; */}
.captiontitle--wbg,
.captiontitle--dbg {padding: 13px 0px 13px 45px;}
.captiontitle--wbg:before,
.captiontitle--dbg:before {content: ""; position: absolute; height: 100%; border-radius: 4px; padding-right: 35px; display: block; right: -35px; bottom: 0; left: 0; top: 0; z-index: -1;
 transform-style: preserve-3d;
transform: skew(-12deg) translate3d(0,0,0);
background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.45) 80%);
}
.captiontitle--wbg:before {background: rgba(255,255,255,0.9);
background: linear-gradient(to right,  rgba(255,255,255,0.25) 40%,rgba(255,255,255,0) 100%);}

/* Btn area */
.css3panel-btn-area {clear:both; float:right; margin-top:30px; margin-right: 20px;}
.css3panel-btn-area .btn {margin-left:20px;margin-bottom: 10px;}

@media (max-width: 1440px) {
    .css3panel-caption {padding-left:50px;}

    .css3panel:first-child,
    .css3panel:last-child {
                flex-grow:1.1;
    }

    .css3panel .css3panel-title {font-size: 18px; margin-right: 30px;}
    .css3panel .css3panel-text {font-size: 13px; margin-right: 10px;}
    .css3panel .css3panel-btn-area {margin-right:10px;}
    .css3panel .css3panel-btn-area .btn {margin-bottom: 10px; display: block}

    .css3panel .css3panel-title.title-size-bigger {font-size: 30px;}
}

/* Fixes CSS3 Panels */
@media (min-width: 992px) and (max-width: 1200px) {
    .css3panel .css3panel-caption {padding-right:30px;}
    .css3panels-container.css3panels--resize:hover .css3panel .css3panel-caption {width: 130%; margin-left: -30%;}
    .css3panels-container.css3panels--resize:hover .css3panel:hover .css3panel-caption {/*width: 100%; margin-left: 0%;*/}
    .css3panel .css3panel-title ,
    .css3panel .css3panel-title.title-size-bigger {font-size: 18px; margin-right: 30px;}
    .css3panel .css3panel-text {font-size: 13px; margin-right: 30px;}
    .css3panel .css3panel-btn-area {margin-right:35px;}
    .css3panel .css3panel-btn-area .btn {margin-bottom: 10px;}
    .css3panel:first-child {
                flex-grow:1.3;
    }
    .css3panels--resize .css3panel:hover {
                flex-grow:2;
    }
    .css3panel:first-child .css3panel-caption {padding-left:70px;}
    .css3panel:last-child .css3panel-caption {padding-right:60px;}

    .css3panel-btn-area .btn {font-size:12px; margin-left: 0;}
    .css3panel-btn-area .btn:last-child {margin-left: 10px; }


}
@media (min-width: 768px) and (max-width: 991px) {
    .css3panel .css3panel-caption {padding-right: 25px;}
    .css3panels-container.css3panels--resize:hover .css3panel .css3panel-caption {/*width: 130%; margin-left: -30%;*/}
    .css3panels-container.css3panels--resize:hover .css3panel:hover .css3panel-caption {/*width: 100%; margin-left: 0%;*/}
    .css3panel .css3panel-title,
    .css3panel .css3panel-title.title-size-bigger {font-size: 16px; margin-right:20px;}
    .css3panel .css3panel-text {font-size: 13px; margin-right: 30px; display: none;}
    .css3panel .css3panel-btn-area {margin-right:35px; margin-top:50px;}
    .css3panel .css3panel-btn-area .btn {margin-bottom: 10px;}
    .css3panel:first-child {flex-grow:1.3;}
    .css3panels--resize .css3panel:hover {
                flex-grow:2.2;
    }
    .css3panel:first-child .css3panel-caption {padding-left:50px;}
    .css3panel:last-child .css3panel-caption {padding-right:50px;}
    .css3panel:last-child .css3panel-title { margin-right:30px;}

    .css3panel-btn-area .btn {font-size:12px; margin-left: 0; }
    .css3panel-btn-area .btn:last-child {margin-left: 10px; }
}

@media (max-width: 767px) {

    .css3panels-container {
        margin-left: 0; margin-right: 0;
                flex-direction: column;
                flex-wrap: wrap;
    }

    .css3panel {
        float:left; overflow:hidden; position: relative; z-index: 0; box-shadow: 0 0 0 3px #fff;
                flex: 1;

    }
   .zn_pb_wrapper .kl-slideshow-css3panels:first-child .css3panel:first-child {padding-top:150px;padding-bottom: 0;box-sizing: content-box;width: 100%;}
   .zn_pb_wrapper .kl-slideshow-css3panels:first-child .css3panel:first-child .css3panel-inner {top: 0;}
   .zn_pb_wrapper .kl-slideshow-css3panels:first-child .css3panel:first-child .css3panel-caption {margin-top:150px;}

   .css3panel:first-child,
   .css3panel:last-child {
        flex-grow: 1;
    }
   .css3panels--resize .css3panel:first-child:hover,
   .css3panels--resize .css3panel:last-child:hover,
   .css3panels--resize .css3panel:hover {
                flex-grow: 1.5;
    }
   .css3panel-inner {
        position:absolute; margin-left: 0; margin-right: 0; min-height:150px;
        transform:  skewX(0);
        width: 100%; height: 100% !important;
}
    .css3panel-mainimage-wrapper {transform:  skewX(0);height: 100% !important;}
    .css3panel-caption {padding-left: 20px; padding-right: 20px; bottom: auto; top: 20px; }
    .css3panel-title,
    .css3panel .css3panel-title.title-size-bigger {font-size: 18px; max-width: 70%;}
    .captiontitle--wbg,
    .captiontitle--dbg {padding: 10px 0 10px 25px; }
    .css3panel-text {font-size: 14px; max-width: 70%; margin-right: 0;}
    .css3panel-btn-area {clear: none; float: left; max-width: 30%; position: absolute; top: 0; left: 0; text-align: left; margin-top: 5px; margin-right: 0; }
    .css3panel-btn-area .btn:first-child { margin-bottom:15px; }
}

@media (max-width: 480px) {
    .css3panel:first-child {padding-top:0;padding-bottom: 0;box-sizing: border-box;width: 100%;}
    .css3panel:first-child .css3panel-inner {top: auto;}
    .css3panel:first-child .css3panel-caption {margin-top:0;}
    .css3panel-text {display: none;}
    .css3panel-btn-area {clear: right; float: right; max-width: 100%; position: relative; top: 0; left: 0; text-align: left; margin-right: 0; margin-top:20px;}
    .css3panel-btn-area .btn:first-child { /* margin-bottom:0; */ }
}