/*===========================================================================
    MultiScroll Css
===========================================================================*/
.bdt-mltiscroll-slider {
    height: 100vh;
    text-align: center;
    position: relative;
    overflow: hidden;
    
    .ms-tableCell {
        z-index: 1;
        overflow: hidden;
        position: relative;
    }
    .bdt-content-text-left, 
    .bdt-content-text-right {
        .bdt-mltiscroll-slider-content {
            max-width: 148px;
        }
        .bdt-mltiscroll-slider-title {
            font-size: 28px;
            padding-bottom: 5px;
        }
        .bdt-mltiscroll-slider-description {
            font-size: 12px;
        }
        .bdt-mltiscroll-slider-button {
            a {
                font-size: 12px;
            }
        }
    }
    .bdt-mltiscroll-slider-content {
        max-width: 248px;
        z-index: 1;
    }
    .bdt-mltiscroll-slider-subtitle {
        padding-bottom: 15px;
        color: #fafafa;
        font-size: 18px;
    }
    .bdt-mltiscroll-slider-title {
        font-size: 48px;
        font-weight: 700;
        margin: 0;
        padding-bottom: 10px;
        color: #fff;
    }
    .bdt-mltiscroll-slider-description {
        color: #fafafa;
        font-size: 16px;
    }
    .bdt-mltiscroll-slider-button {
        position: absolute;
        bottom: 40px;
        &.bdt-btn-position-right {
            right: 40px;
        }
        &.bdt-btn-position-left {
            left: 40px;
        }
        a {
            color: #fff;
            font-size: 14px;
            &:before {
                content: '';
                position: absolute;
                width: 0;
                height: 2px;
                background: #fff;
                bottom: 1px;
                border-radius: 10px;
                transform: rotate(-5deg);
                transition: all .3s ease;
            }
            &:hover {
                &:before {
                    width: 100%;
                }
            }
        }
    }
    .bdt-content-center {
        .bdt-ms-section .intro{
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
        }
        #bdt-ms-section-left .intro{
            left: 50%;
        }
        #bdt-ms-section-right .intro{
            right: 50%
        }
    }
    .ms-section{
        background: #EC6367;
        position: relative;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        &.ms-table{
            display: table;
            width: 100%;
        }
        .ms-tableCell {
            display: table-cell;
            vertical-align: middle;
            width: 100%;
            height: 100%;
        }
        &.bdt-ms-section-left, 
        &.bdt-ms-section-right {
            background-repeat: no-repeat;
            background-size: cover;
            
        }
        &.bdt-ms-section-right {
            background-color: #8c8c8c;
            overflow: hidden;
            background-position: left;
        }
        &.bdt-ms-section-left {
            background-position: right;
            background-color: #9E9E9E;
        }
        
        &.shadow-title {
            &.bdt-ms-section-right {
                &:before {
                    right: 50%;
                }
            }
            &.bdt-ms-section-left {
                &:before {
                    left: 50%;
                }
            }
            &.bdt-ms-section-right, 
            &.bdt-ms-section-left {
                &:before {
                    content: attr(data-label);
                    position: absolute;
                    font-size: 36px;
                    font-weight: 900;
                    top: 50%;
                    color: rgba(0, 0, 0, 0.05);
                    transform: translateY(-50%);
                    width: 100%;
                }
            }
        }
    }
    .bdt-ms-section {
        .intro {
            width: 100%;
            text-align: center;
        }
    }
    .ms-easing {
        -webkit-transition: all 0.7s ease-out;
        -moz-transition: all 0.7s ease-out;
        -o-transition: all 0.7s ease-out;
        transition: all 0.7s ease-out;
    }
}

#bdt-ms-section-right.hideOverflow{
    overflow: hidden;
}

#multiscroll-nav {
    position: absolute;
    z-index: 100;
    margin-top: -32px;
    top: 50%;
    opacity: 1;
    &.right {
        right: 17px;
    }
    &.left {
        left: 17px;
    }
    ul {
        margin: 0;
        padding: 0;
        li {
            display: block;
            width: 10px;
            height: 10px;
            margin: 10px 0;
            position:relative;
            a {
                display: block;
                position: relative;
                z-index: 1;
                width: 100%;
                height: 100%;
                cursor: pointer;
                text-decoration: none;
            }
            .active span {
                background: transparent;
                transform: scale(1.8);
                border-color: #fff;
            }
        }
    }
    span {
        top: 0;
        left: 0;
        width: 6px;
        height: 6px;
        -webkit-border-radius: 60px;
        -moz-border-radius: 60px;
        border-radius: 60px;
        position: absolute;
        z-index: 1;
        background: #fff;
        transition: all .3s ease;
        border: 1px solid transparent;
    }
}

.ms-scrollable {
    overflow: hidden;
    position: relative;
}
.ms-scroller {
    overflow: hidden;
}
.iScrollIndicator{
    border: 0 !important;
}


/*===========================================================================
    Responsive Css ( Slider )
===========================================================================*/
@media (min-width: 376px) {
    .bdt-mltiscroll-slider {
        .bdt-mltiscroll-slider-content {
            max-width: 340px;
        }
        .bdt-mltiscroll-slider-title {
            font-size: 60px;
        }
        .ms-section{
            &.shadow-title {
                &.bdt-ms-section-right, 
                &.bdt-ms-section-left {
                    &:before {
                        font-size: 40px;
                    }
                }
            }
        }
        .bdt-content-text-left, 
        .bdt-content-text-right {
            .bdt-mltiscroll-slider-content {
                max-width: 165px;
            }
            .bdt-mltiscroll-slider-title {
                font-size: 32px;
            }
            .bdt-mltiscroll-slider-description {
                font-size: 14px;
            }
            .bdt-mltiscroll-slider-button {
                a {
                    font-size: 14px;
                }
            }
        }
    }
}

@media (min-width: 640px) {
    .bdt-mltiscroll-slider {
        .bdt-mltiscroll-slider-content {
            max-width: 600px;
        }
        .bdt-mltiscroll-slider-title {
            font-size: 90px;
            padding-bottom: 20px;
        }
        .bdt-mltiscroll-slider-description {
            color: #fafafa;
            font-size: 20px;
        }
        .bdt-mltiscroll-slider-button {
            a {
                font-size: 18px;
            }
        }
        .bdt-content-text-left, 
        .bdt-content-text-right {
            .bdt-mltiscroll-slider-content {
                max-width: 250px;
            }
            .bdt-mltiscroll-slider-title {
                font-size: 48px;
                padding-bottom: 10px;
            }
            .bdt-mltiscroll-slider-description {
                font-size: 18px;
            }
            .bdt-mltiscroll-slider-button {
                a {
                    font-size: 18px;
                }
            }
        }
    }
}

@media (min-width: 768px) {
    .bdt-mltiscroll-slider {
        .bdt-mltiscroll-slider-title {
            font-size: 110px;
        }
        .ms-section{
            &.shadow-title {
                &.bdt-ms-section-right, 
                &.bdt-ms-section-left {
                    &:before {
                        font-size: 70px;
                    }
                }
            }
        }
        .bdt-content-text-left, 
        .bdt-content-text-right {
            .bdt-mltiscroll-slider-content {
                max-width: 320px;
            }
            .bdt-mltiscroll-slider-title {
                font-size: 60px;
            }
        }
    }
}

@media (min-width: 1024px) {
    .bdt-mltiscroll-slider {
        .bdt-mltiscroll-slider-content {
            max-width: 760px;
        }
        .bdt-mltiscroll-slider-title {
            font-size: 148px;
        }
        .ms-section{
            &.shadow-title {
                &.bdt-ms-section-right, 
                &.bdt-ms-section-left {
                    &:before {
                        font-size: 95px;
                    }
                }
            }
        }
        .bdt-content-text-left, 
        .bdt-content-text-right {
            .bdt-mltiscroll-slider-content {
                max-width: 460px;
            }
            .bdt-mltiscroll-slider-title {
                font-size: 85px;
            }
        }
    }
}
@media (min-width: 1440px) {
    .bdt-mltiscroll-slider {
        .bdt-mltiscroll-slider-content {
            max-width: 850px;
        }
        .ms-section{
            &.shadow-title {
                &.bdt-ms-section-right, 
                &.bdt-ms-section-left {
                    &:before {
                        font-size: 130px;
                    }
                }
            }
        }
        .bdt-content-text-left, 
        .bdt-content-text-right {
            .bdt-mltiscroll-slider-content {
                max-width: 670px;
            }
            .bdt-mltiscroll-slider-title {
                font-size: 130px;
            }
        }
    }
}
@media (min-width: 1600px) {
    .bdt-mltiscroll-slider {
        .ms-section{
            &.shadow-title {
                &.bdt-ms-section-right, 
                &.bdt-ms-section-left {
                    &:before {
                        font-size: 175px;
                    }
                }
            }
        }
    }
}