@media screen and (min-width: 768px) {
    :root {
        --videoContainerGap: 50px;
    }

    html {
        font-size: 18px;
    }

    main .orange-background {
        margin-bottom: 100px;
    }

    main .video-container {
        flex-direction: row;
    }

    main .video-player-container .video-elements {
        margin-left: 15px;
    }

    main .video-playlist-container {
        flex-direction: column;
    }

    main .video-player-container video {
        margin: 0px;
    }

    main .video-playlist-container h2 {
        display: block;
    }

    main .video-playlist-item {
        margin-bottom: 30px;
    }

    main .video-playlist-item:nth-child(2) {
        margin-left: 0;
    }

    main .video-playlist-item:nth-child(4) {
        margin-right: 0;
    }

    main .illustrations-container .illustration {
        flex-wrap: nowrap;
    }

    main .illustrations-container .illustration img {
        order: 0;
    }

    main .support-and-help-container {
        text-align: center;
    }

    main .support-and-help-container p {
        padding: 0 150px;
        margin-top: 20px;
    }

    main .logo-container {
        flex-wrap: nowrap;
    }
}

@media screen and (min-width: 1024px) {
    :root {
        --leftRightMargin: 100px;
        --footerLeftRightMargin: 100px;
    }

    html {
        font-size: 18px;
    }

    h1 {
        font-size: 2.5em;
    }

    .video-description {
        padding-right: 300px;
    }
}

@media screen and (min-width: 1440px) {
    :root {
        --leftRightMargin: 250px;
        --footerLeftRightMargin: 250px;
    }
}
