/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

/* #happenings-main section.regular p{
    margin: 50px auto;
} */

/* #happenings-main .inner-con{
    padding-bottom: 0;
} */

/* #happenings-main .slider{
    margin: 0;
}

#happenings-main .slider .wrapper img{
    margin: auto;
}

#happenings-main .slider .video-cover{
    position: absolute;
    height: inherit;
    width: inherit;
    background: grey;
    opacity: .5;
}


#happenings-main .slider .img-con img{
    height: 100%;
} */


.slider {
    margin: 50px 0;
}

.slider .item img{
    width: 100%;
    height: 100%;
}

.slider .item{
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    opacity: .5;
    -webkit-transform: scale(.9);
        -ms-transform: scale(.9);
            transform: scale(.9);
}

.slider .item:hover{
    opacity: .8;
    -webkit-transform: scale(.95);
        -ms-transform: scale(.95);
            transform: scale(.95);
}

.slider .item.slick-active,
.slider .item.slick-active:hover{
    opacity: 1;
    -webkit-transform: scale( 1 );
        -ms-transform: scale( 1 );
            transform: scale( 1 );
}


.slider .item .video-cover{
    position: absolute;
    width: inherit;
    height: inherit;

     /* background: rgba(255,255,255,.5);  */

    cursor: pointer;


    display: -webkit-box;


    display: -ms-flexbox;


    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;


    pointer-events: auto;
}

.slider .item.slick-active .video-cover{
    pointer-events: none;
}

.slider .item .wrapper{
    z-index: 1;
}

.slider .item .wrapper > img{
    pointer-events: auto;
    cursor: pointer;
}

.video-cover .play-icon{
    user-drag: none;
    -webkit-user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.slider .item .video-cover .play-icon{
    height: 50px;
    width: 50px;
}

.slider .item .intro-div{
    position: relative;
    top:-16px;
    opacity: 0;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    z-index: 1;
}

.slider .item.slick-active .intro-div{
    opacity: 1;
}

.slider .item .intro-div .intro-title{
    font-family: Calibri;
    font-size:2em;
    font-weight: 400;
    color: #002849;
    letter-spacing: 6px;
    text-align: center;
    position: relative;
    z-index: 2;
}

.slider .item .intro-div .intro-desc{
    display: flex;
    justify-content: end;
    z-index: 2;
}

.slider .item .intro-div .intro-desc .desc-text{
    font-family: Calibri;
    font-size:14px;
    font-weight: 400;
    color: #444444;
    text-align: center;
    text-indent: 20px;
    line-height: 25px;
    /* margin-top:0px; */
    z-index:1;
    margin-top:20px;
}

.slider .item .intro-div-2{
    opacity: 0;
}

.slider .item.slick-active .intro-div-2{
    opacity: 1;
}

.slider .item .intro-div-2 .deco-square{
    aspect-ratio: 1.08/1;
    border: 1px solid #E0E0E0;
    position: absolute;
    width: 100%;
    right: -17%;
    bottom: 27px;
    z-index: 0;
}


/* .slider .slick-list{
    overflow: visible;
} */
/* .slick-track
{
    display: flex !important;
}

.slick-slide
{
    height: inherit !important;
} */


.slider .slick-dots {
    bottom: -40px;
}

.slider .slick-dots li{
    margin: 0;
    width: 15px;
    height: 15px;
}

.slider .slick-dots li button:before{
    content: url("../icon/square_bfb8af.svg");
    font-family: auto;
    font-size: 12px;
    color: #BFB8AF!important;
    -webkit-text-fill-color:#BFB8AF;
    -webkit-opacity: 1;
    opacity: .38;
}

.slider .slick-dots li.slick-active button:before {
    opacity: 1;
    -webkit-transform: scale(1.2);
        -ms-transform: scale(1.2);
            transform: scale(1.2);
}


#video-popup{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 20;

    display: none;
}

#video-popup .video-con{
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100vw;
    height: 100vh;

    z-index: 2;
    pointer-events: none;
}

#video-popup #video-inner{
    width: 90%;
    height: 90%;
    max-width: 600px;
    max-height: 450px;
}


#video-popup .video-con iframe{
    pointer-events: auto;
}


#video-popup .cover{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;

    background: black;
    opacity: .8;
    z-index: -1;
}



@media (min-width: 576px) {
    .slider .item .intro-div .intro-title{
        font-size: 2.4em;
    }
}

@media (min-width: 768px) {
    .slider .item{
        -webkit-transform: scale(.8);
            -ms-transform: scale(.8);
                transform: scale(.8);
    }

    .slider .item:hover{
        -webkit-transform: scale(.85);
            -ms-transform: scale(.85);
                transform: scale(.85);
    }

    #video-popup #video-inner{
        width: 90%;
        height: 90%;
        max-width: 800px;
        max-height: 600px;
    }
    .slider .item .intro-div .intro-title{
        font-size: 3em;
        text-align: left;
        position: relative;
        left:-42px;
    }
    .slider .item .intro-div .intro-desc {
        margin-top:20px;
    }
    .slider .item .intro-div .intro-desc .desc-text{
        max-width: 80%;
        text-align: right;
    }
    .slider .item .intro-div-2 .deco-square{
        width: 50%;
        right: -40px;
        /* top: -200px; */
        z-index: 0;
    }
}

@media (min-width: 992px) {
    
    
}

@media (min-width: 1200px) {
    
}
