.dir-fv {
    width: 100%;
    height: 80%;
    text-align: center;
    background: rgba(0, 0, 0, 0.7) url('../../images/dealinrbg2.png');
    background-size: cover;
    background-blend-mode: darken;
}

.dirf-image {

    padding: 15vw 0vw 0vw 0vw;

}

    .dirf-image h1 {
        font-size: 7vw;
        font-family: "Lexend Deca", sans-serif;
        font-weight: 400;
        color: #fff;
    }

.dirf-image h1 span {
    color: #e9870e;
    font-size: 7.5vw;
}

    .dirf-image h4 {
        font-size: 3vw;
        color: #fff;
        font-family: "Lexend Deca", sans-serif;
        font-weight: 400;
    }

@media(max-width:1024px) {
    .dir-fv {
        height: 44vw;
    }
}

@media (max-width: 820px) {
    .dir-fv {
        height: 42vw;
    }
}

@media (max-width: 600px) {
    .dir-fv {
        height: 48vw;
    }
}

@media(max-width:430px) {
    .dir-fv {
        height: 65vw;
    }

    .dirf-image {
        padding: 25vw 0vw 0vw 0vw;
    }

    .dirf-image h1 {
        font-size: 10vw;
    }

    .dirf-image h1 span {

        font-size: 10.5vw;
    }

    .dirf-image h4 {
        font-size: 4vw;
    }
}

/* end of front section*/

.dir-data {

    border: none;

    margin: 2vw 3vw 2vw 3vw;
}

.dirdata-1 {
    justify-content: space-around;
    border-radius: 10px;
    padding: 2vw;

    display: flex;
    box-shadow: 1px 1px 18px 1px #284b70;
}

.data1-text {
    text-align: justify;
    width: 50%;
    background: url('../../images/arthbg.png');
    background-repeat: no-repeat;
    background-size: 22vw;
    background-position-x: center;
}

    .data1-text p {
        font-family: "Hind", sans-serif;
        font-weight: 400;
        text-transform: capitalize;
        font-size: 1.5vw;
        margin: 0vw 13vw 0vw 0vw;
        padding: 1vw 0vw 0vw 2vw;
    }

.data1-text p span {
    color: #e9870e;
    font-size: 1.8vw;
}

.data1-image {
    width: 30%;
}

.data1-image video {
    border-radius: 10px;
    box-shadow: 1px 1px 20px 3px #284b70;
    width: 30vw;
    float: right;
}

.dirdata-2 {
    margin: 2vw 0vw 0vw 0vw;
    justify-content: space-around;
    border-radius: 10px;
    padding: 2vw;

    display: flex;
    box-shadow: 1px 1px 18px 1px #284b70;
}

.data2-text {
    text-align: justify;
    width: 50%;
    background: url('../../images/arthbg.png');
    background-repeat: no-repeat;
    background-size: 22vw;
    background-position-x: center;
}

    .data2-text p {
        font-family: "Hind", sans-serif;
        font-weight: 400;
        text-transform: capitalize;
        font-size: 1.5vw;
        margin: 0vw 13vw 0vw 0vw;
        padding: 1vw 0vw 0vw 2vw;
    }

.data2-image {
    width: 30%;
}

.data2-image video {
    border-radius: 10px;
    box-shadow: 1px 1px 20px 3px #284b70;
    width: 30vw;
    float: right;
}


@media (max-width:820px) {

    .dirdata-2 {
        margin: 2vw 0vw 0vw 0vw;


        display: flow-root;

    }

    .dirdata-1 {
        margin: 2vw 0vw 0vw 0vw;

        padding: 2vw;

        display: flow-root;

    }

    .data1-text {
        margin: 0vw 0vw 3vw 0vw;

        width: 100%;
    }

    .data1-text p {
        font-size: 4.2vw;
        margin: 0vw 0vw 0vw 0vw;
        padding: 1vw 0vw 0vw 2vw;
    }

    .data1-text p span {

        font-size: 4.3vw;
    }

    .data1-image {
        width: 79%;
    }

    .data1-image video {
        margin: 0vw -10vw 0vw 0vw;

        width: 66vw;

    }

    .data2-image {
        width: 79%;
        margin: 0vw 0vw 0vw 10vw;
    }

    .data2-image video {
        margin: 0vw 0vw 3vw 6vw;

        width: 66vw;
        float: right;
    }

    .data2-text {
        text-align: justify;
        width: 100%;
    }

    .data2-text p {
        font-size: 4.2vw;
        margin: 0vw 1vw 0vw 0vw;
        padding: 1vw 0vw 0vw 2vw;
    }
}