/* Starts at 40% and grows responsively */
.responsive-div-40 {
    width: 50%;
    margin: 0 auto;
    padding: 0 10px;
    transition: width 0.3s ease;
}

@media (max-width: 1200px) {
    .responsive-div-40 {
        width: 55%;
    }
}

@media (max-width: 992px) {
    .responsive-div-40 {
        width: 65%;
    }
}

@media (max-width: 768px) {
    .responsive-div-40 {
        width: 85%;
    }
}

@media (max-width: 576px) {
    .responsive-div-40 {
        width: 95%;
    }
}

/* Starts at 50% and grows responsively */
.responsive-div-50 {
    width: 65%;
    margin: 0 auto;
    padding: 0 10px;
    transition: width 0.3s ease;
}

@media (max-width: 1200px) {
    .responsive-div-50 {
        width: 60%;
    }
}

@media (max-width: 992px) {
    .responsive-div-50 {
        width: 75%;
    }
}

@media (max-width: 768px) {
    .responsive-div-50 {
        width: 90%;
    }
}

@media (max-width: 576px) {
    .responsive-div-50 {
        width: 100%;
    }
}