.about {
    height: 900px;
    position: relative;
    transition: all 1s;
}
    
.about div div {
    max-width: 70%;
    top: 13%;
    bottom: 13%;
    position: absolute;
    border-radius: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    background-color: var(--color-white);
    transition: all 1s;
    opacity: 90%;
}

.about div h2 {
    padding-top: 6%;
} 

.about div p {
    padding: 2% 6% 0 6%;
} 

.about img {
    width: 100%;
    height: 100%;
    opacity: 80%;
    object-fit: cover;
}

@media screen and (max-width: 1600px) {
    .about {
        height: 800px;
    }

    .about div div {
        max-width: 80%;
        top: 10%;
        bottom: 10%;
    }
}

@media screen and (max-width: 1200px) {
    .about {
        height: 700px;
    }

    .about div div {
        max-width: 90%;
        top: 7%;
        bottom: 7%;
    }
}

@media screen and (max-width: 750px) {
    .about {
        height: 600px;
    }
}