/* 1600-fullscreen width */
#red-wine-text > a, #rose-wine-text > a, #white-wine-text > a {
    color: black;
    text-underline-offset: 5px;
    text-decoration-thickness: 3px;
}
@media (min-width: 1601px) {
    /* wine sections */
    #wine-sections {
        margin-top: 100px;
        height: 1200px;
    }
    #red-wine-section > img, #rose-wine-section > img, #rose-wine-text, #red-wine-text, #white-wine-section > img, #white-wine-text {
        position: absolute;
    }
    #red-wine-text > h2, #rose-wine-text > h2, #white-wine-text > h2 {
        margin: 0;
    }

    /* red wine section */
    .red-wine-banner {
        transform: translateX(10vw);
        width: 810px;
        height: 450px;
        object-fit: cover;
    }
    .red-wine-image {
        transform: translateX(14vw) translateY(15vh);
    }
    #red-wine-text {
        transform: translateX(55vw) translateY(10vh);
    }

    /* white wine section */
    .white-wine-banner {
        transform: translateX(30vw) translateY(60vh);
        width: 550px;
        height: 450px;
        object-fit: cover;
    }
    .white-wine-image {
        transform: translateX(25vw) translateY(70vh);
    }
    #white-wine-text {
        transform: translateX(10vw) translateY(80vh);
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

    /* rose wine section */
    .rose-wine-banner {
        transform: translateX(65vw) translateY(30vh);
        width: 450px;
        height: 450px;
        object-fit: cover;
    }
    .rose-wine-image {
        transform: translateX(73vw) translateY(44vh);
    }
    #rose-wine-text {
        transform: translateX(65vw) translateY(85vh);
    }
}
/* 1100-1600 width */
@media (min-width: 1100px) and (max-width: 1600px) {
    /* wine sections */
    #wine-sections {
        margin-top: 100px;
        height: 1600px;
    }
    #red-wine-section, #white-wine-section, #rose-wine-section {
        margin: 50px;
        display: flex;
    }
    #red-wine-section > .red-wine-image, #rose-wine-section > .rose-wine-image, #white-wine-section > .white-wine-image{
        position: absolute;
    }
    #red-wine-text > h2, #rose-wine-text > h2, #white-wine-text > h2 {
        margin: 0;
    }

    /* red wine section */
    .red-wine-banner {
        width: 810px;
        height: 450px;
        object-fit: cover;
        margin: 20px;
    }
    .red-wine-image {
        transform: translateX(80vw) translateY(7vh);
    }
    #red-wine-text {
        transform: translatey(1vh);
    }

    /* white wine section */
    .white-wine-banner {
        width: 550px;
        height: 450px;
        object-fit: cover;
        margin: 20px;
        transform: translateX(55vw);
    }
    .white-wine-image {
        transform: translateX(30vw) translateY(2vh);

    }
    #white-wine-text {
        transform: translateX(-40vw) translateY(1vh);
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

    /* rose wine section */
    .rose-wine-banner {
        width: 450px;
        height: 450px;
        object-fit: cover;
        margin: 20px;
    }
    .rose-wine-image {
        transform: translateX(60vw) translateY(9vh);
    }
    #rose-wine-text {
        transform: translateX(1vw) translateY(1vh);
    }
}
@media (min-width:1100px) {
    #wine-sections > h2 {
        display: none;
    }
}
@media (max-width:1100px) {
    .red-wine-banner, .white-wine-banner, .rose-wine-banner {
        display: none;
    }
    #red-wine-section, #white-wine-section, #rose-wine-section {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
    }
    .red-wine-image, .white-wine-image, .rose-wine-image {
        margin-top: 20px;
    }
    #wine-sections {
        text-align: center;
    }
    #wine-sections > h2 {
        text-align: center;
    }
}