@media only screen and (max-width: 1408px) {
    section#activites {
        div.headline {
            max-width: 50% !important;
        }

        .sub-section {
            &.slide {
                &:not(.animation-inversed) {
                    transform: translateX(40%);
                }

                &.animation-inversed {
                    transform: translateX(-40%);
                }
            }

            &:not(.animation-inversed) {
                div.content {
                    left: -40%;
                }
            }

            &.animation-inversed {
                div.content {
                    right: -40%;
                }
            }
        }
    }
}

@media only screen and (max-width: 1024px) {
    header.logo-container {
        img {
            width: 75%;
        }
    }

    section#splashscreen {
        .splashscreen-text-container {
            top: 40%;
            font-size: 3.5rem;

            .border-seperator {
                border-top-width: 4px;
                max-width: 680px;
                border-radius: 20px;
            }
        }
    }

    section#competitions, section#partenaires {
        .border-seperator {
            border-top-width: 4px;
        }
    }

    section {
        h2 {
            font-size: 2.5rem;
            font-weight: bold;
        }

        h3 {
            font-size: 1.75rem;
            font-weight: bold;
        }
    }

    section#activites {
        .sub-section {
            &.slide {
                &:not(.animation-inversed) {
                    transform: translateX(50%);
                }

                &.animation-inversed {
                    transform: translateX(-50%);
                }
            }

            &:not(.animation-inversed) {
                div.content {
                    left: -50%;
                }
            }

            &.animation-inversed {
                div.content {
                    right: -50%;
                }
            }
        }
    }
}

@media only screen and (max-width: 768px) {
    header.logo-container {
        img {
            width: 50%;
            padding-top: 0.75rem;
        }
    }

    section#splashscreen {
        .splashscreen-text-container {
            top: 40%;
            font-size: 2.5rem;

            .border-seperator {
                border-top: 2px solid white;
                max-width: 380px;
                border-radius: 20px;
            }
        }
    }

    section#competitions, section#partenaires {
        padding: 2rem 0.5rem;

        .slider.column {
            margin-left: 10%;
        }

        .border-seperator {
            border-top-width: 2px;
        }

        .grid {
            img {
                float: left;
            }
        }
    }

    section {
        h2 {
            font-size: 2rem;
            font-weight: bold;
        }

        h3 {
            font-size: 1.5rem;
            font-weight: bold;
        }
    }

    section#activites {
        height: auto;

        .sub-section {
            min-height: 100vh;
            height: auto;

            div.headline {
                max-width: 90% !important;
                background-color: rgba(0, 0, 0, 0.75);

                &:not(.is-headline-inversed) {
                    left: 25px !important;
                }

                &.is-headline-inversed {
                    right: 25px !important;
                }
            }


            &.slide {
                &:not(.animation-inversed) {
                    transform: translateX(0%);
                }

                &.animation-inversed {
                    transform: translateX(0%);
                }
            }

            &:not(.animation-inversed) {
                div.content {
                    left: 0;
                }
            }

            &.animation-inversed {
                div.content {
                    right: 0;
                }
            }

            div.content {
                height: auto;
                width: 100vw;
                padding-right: 2rem;
                padding-left: 2rem;
            }
        }
    }

    footer {
        clear: both;
    }
}
