.borderss {
    border-right: 1px solid #DDDDDD!important;
    border-left: 1px solid #DDDDDD!important;
}
.video-borderss {
    border-right: 1px solid #DDDDDD!important;
    border-left: 1px solid #DDDDDD!important;
}

.custom-video-container {
    height: 220px!important;
}

.video-container {
    position: relative!important;
    width: auto !important;
    margin: 0 auto!important;
}

.custom-video {
    width: 100%!important;
    height: 100% !important;
}

.video-row {
    height: 150px!important;
}

.first-video-row {
    height: 190px !important;
}

.video-image-section {
    font-weight: bolder!important;
    /* font-size: 1.3rem!important; */
    font-size: 25px!important;
    
    border-right: 1px solid #DEE2E6;
}

.main-video-section {
    background-color: #262626!important;
    color: white!important;
}

.main-first-video-description,
.second-video-description-main {
    margin: 18px 10px!important;
}

.first-video-description {
    text-transform: uppercase!important;
    font-size: 19px!important;
}

.second-video-description-main {
    font-style: normal!important;
    line-height: normal!important;
    font-size: 15px!important;
    margin-bottom: 30px!important;
}

.secon-main-video-section {
    background-color: #262626!important;
    margin-left: 10px!important;
}

/* .second-main-video-description {
    color: white!important;
    margin: 13px 5px 0px 5px!important;
    padding: 5px 0px 19px 0px!important;
} */

.second-main-video-description {
    color: white!important;
    font-size: 15px!important;
    /* padding: 3px!important; */
    padding: 8px !important;
}

.bordered {
    border-top: 2px solid #DEE2E6!important;
    border-left: 2px solid #DEE2E6!important;
    padding: 0px 0px 0px 5px!important;
    font-size: 12px!important;
}

.rounded-button {
    border-radius: 50px!important;
    padding: 5px 10px!important;
    border: none!important;
    background-color: black!important;
    color: white!important;
    cursor: pointer!important;
    font-size: 13px!important;
}

.parent-container {
    display: flex!important;
    flex-direction: column!important;
    height: 100%!important;
    align-items: end!important;
}

.description-video-section-main {
    /* width: 230px!important;
    margin-top: auto!important;
    margin-bottom: 5px!important; */
    width: 209px!important;
    margin-top: 180px!important;
    margin-bottom: 5px!important;
}

.video-border-rights {
    border-right: 1px solid #DEE2E6!important;
    padding: 0px 30px!important;
}

.custom-width-video-section {
    width: 97%!important;
}

.third-video-section-description {
    font-size: 16px!important;
}

@media (min-width: 1141px) {
    .des_hide {
        display: none!important;
    }
}

@media (max-width: 1140px) {
    .mob_hide {
        display: none!important;
    }

    /* .secon-main-video-section {
        display: block!important;
    } */

    .content-video {
        width: 150%!important;
    }

    .content-bot-video {
        width: 150% !important;
        flex: unset !important;
        max-width: unset !important;
    }

    .borderss {
        padding: 17px!important;
    }

    .col-md-1 {
        flex: 0 0 auto !important;
        width: 33.333333% !important;
        /* width: 0% !important; */
        text-align: end!important;
    }

    .col-md-1 {
        /* -webkit-box-flex: 0!important;
        -ms-flex: 0 0 8.33333%!important;
        flex: 0 0 8.33333%!important; */
        max-width: 35% !important;
    }

}

/* Tablet screens (max-width: 768px) */
@media (max-width: 820px) {
    /* .video-image-section {
        display: none!important;
    } */

    .bordered,
    .video-border-rights {
        display: none!important;
    }

    .main-video-section,
    .secon-main-video-section {
        padding: 10px!important;
    }

    .main-first-video-description,
    .second-video-description-main {
        margin: 8px!important;
    }

    .first-video-description {
        font-size: medium!important;
    }

    /* .secon-main-video-section {
        display: none!important;
    } */

    .second-main-video-description {
        margin: 10px 5px 0px 5px!important;
        padding: 5px!important;
        font-size: 12px!important;
    }

    .bordered {
        font-size: 10px!important;
        padding: 3px!important;
    }

    .rounded-button {
        font-size: 12px!important;
        padding: 4px 8px!important;
    }

    .parent-container {
        flex-direction: column!important;
        display: none!important;
    }

    .description-video-section-main {
        margin-top: 5px!important;
    }
}

@media (min-width: 766px) {
    .min_766_hide {
        display: none!important;
    }

    .hide_btn_766_show {
        display: block!important;
    }
}

@media (max-width: 766px) {

    .container-sm,
    .container {
        max-width: 100% !important;
        /* Using 100% instead of auto for better responsiveness */
        display: block !important;
        /* Removing flex properties if Bootstrap applies any */
    }

    .borderss {
        border-left: none !important;
        border-right: none !important;

    }

    .video-border-top {
        border-top: 1px solid #DDDDDD !important;
    }

    .video-container {
        position: relative!important;
        width: 640px!important;
        margin: 0 auto!important;
        height: 367px !important;
    }

    .content-video {
        width: 100% !important;
    }

    .mob-v-margin-top {
        margin-top: 10px!important;
    }

    .min_766_hide {
        display: block!important;
    }

    .hide_btn_766_show {
        display: none!important;
    }
}


/* @media (max-width: 1140px) {
    .col-md-1 {
        flex: 0 0 auto !important;
        width: 33.333333% !important;
        text-align: end!important;
    }
} */
/* Mobile screens (max-width: 576px) */
@media (max-width: 576px) {

    .video-image-section {
        font-size: 1rem!important;
    }

    .main-video-section,
    .secon-main-video-section {
        padding: 8px!important;
    }

    .main-first-video-description,
    .second-video-description-main {
        margin: 6px!important;
    }

    .first-video-description {
        font-size: small!important;
    }

    .second-main-video-description {
        margin: 8px 5px 0px 5px!important;
        padding: 4px!important;
        font-size: 10px!important;
    }

    .bordered {
        font-size: 9px!important;
        padding: 2px!important;
    }

    .rounded-button {
        font-size: 11px!important;
        padding: 3px 6px!important;
    }

    .parent-container {
        flex-direction: column!important;
    }

    .description-video-section-main {
        margin-top: 4px!important;
    }
}