@media screen and (max-width: 1000px){
    .right-con, .left-con {
        height: unset;
        top: unset;
        bottom: 15px;
    }

    #meet {
        height: auto;
    }

    #meet img {
        display: block;
    }

    #meet .meet-bg-left {
        display: none;
    }

    #meet .meet-bg-right {
        display: none;
    }

  
}

@media screen and (max-width: 786px){
    .left-card, .right-card , .rights-card, .lefts-card {
        position: unset;
        left: unset;
        right: unset;
        width: 100%;
    }

    .left-card, .rights-card {
        height: auto;
    }

    .right-card, .lefts-card {
        height: 60%;
        padding-bottom: 30px;
    }

    .item {
        background-position: center -50px;

    }
}

@media screen and (max-width: 500px){
    .item {
        background-position: center -40px;
        display: none;
    }

    .right-card, .lefts-card {
        height: 200%;
    }

    .overlay {
        position: absolute;
        background-color: rgba(255, 255, 255, 0);
        width: 100%;
        height: 100%;
        z-index: 1;
    }
}


@media screen and (min-width: 320px) and (max-width: 1025px) {
    #meet-p1, 
    #meet-p2,
    #meet-p3,
    #meet-p4,
    #meet-p5,
    #meet-p6,
    #meet-p7,
    #meet-p8,
    #meet-p9{
        display: none !important;
    }

    .left-card, .rights-card {
        padding: 10px !important;
    }

    .title {
        font-size: 20px !important;
    }

    .context {
        font-size: 16px !important;
    }

    .section {
        background-color: initial !important;
        height: initial !important;
    }
}