@keyframes page-load {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.header {
    position: relative;
    width: 100%;
    max-width: 138.4rem;
    padding-left: 3.2rem;
    padding-right: 3.2rem;
    margin: auto;
}

@media only screen and (max-width: 1447px) {
    .header {
        box-sizing: border-box;
        max-width: 100%;
    }
}

@media only screen and (max-width: 959px) {
    .header {
        padding-left: 1.6rem;
        padding-right: 1.6rem;
    }
}

.header .header-content {
    display: flex;
    margin: 0 -1.6rem;
}

    .header .header-content > * {
        padding: 0 1.6rem;
        flex-grow: 1;
        box-sizing: border-box;
    }

    .header .header-content .languages ul li a {
        color: #256fb8;
    }

    .header .header-content .languages ul li.language-current a {
        text-decoration: underline;
    }

        .header .header-content .languages ul li.language-current a:hover, .header .header-content .languages ul li.language-current a:focus, .header .header-content .languages ul li.language-current a:active {
            text-decoration: none;
        }

    .header .header-content .search form {
        box-shadow: 0 0.8rem 0.5rem -0.5rem rgba(0, 0, 0, 0.2);
    }

        .header .header-content .search form:hover, .header .header-content .search form:focus, .header .header-content .search form:active {
            box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2);
        }

/* ==========================================================================
  Helper classes
  ========================================================================== */
.header {
    padding-top: 2em;
    padding-bottom: 2em;
    background-color: #FFFFFF;
}

    .header .header-content {
        align-items: flex-end;
        position: relative;
    }

        .header .header-content .logo {
            flex-grow: 0;
        }

        .header .header-content .languages {
            position: absolute;
            top: -1em;
            right: 0;
            color: #256fb8;
            display: flex;
        }

            .header .header-content .languages ul {
                display: flex;
            }

                .header .header-content .languages ul li {
                    margin-left: .875em;
                }

        .header .header-content .useful-links ul {
            display: flex;
            justify-content: flex-end;
            margin: -1.6rem;
            padding: 1.6rem 0;
        }

            .header .header-content .useful-links ul li {
                flex-grow: 0;
                padding: 0.75em 1.6rem;
            }

                .header .header-content .useful-links ul li a {
                    display: inline-block;
                }

        .header .header-content .search {
            max-width: 33.3333333333%;
        }

            .header .header-content .search form {
                display: flex;
                position: relative;
                transition: 0.2s;
            }

                .header .header-content .search form label[for="search"] {
                    position: absolute;
                    left: 1em;
                    top: 50%;
                    transform: translateY(-50%);
                    z-index: 20;
                }

                .header .header-content .search form #search {
                    position: relative;
                    z-index: 10;
                    flex-grow: 1;
                    margin-right: -.2rem;
                    padding-left: 3em;
                }

        .header .header-content .menu-toggle {
            display: none;
        }

@media only screen and (min-width: 960px) {
    .header {
        width: auto !important;
        position: static !important;
    }
}

@media only screen and (max-width: 1447px) {
    .header .header-content .search {
        max-width: none;
    }
}

@media only screen and (max-width: 959px) {
    .header {
        border-bottom: solid 1px transparent;
        transition: padding border-color 0.2s;
        padding-top: 2.4rem;
        padding-bottom: 2.4rem;
        box-sizing: border-box;
    }

        .header .header-content .logo a {
            display: block;
        }

            .header .header-content .logo a img,
            .header .header-content .logo a svg {
                height: 5.6rem;
                width: auto;
                transition: 0.2s;
            }

        .header .header-content .search {
            display: none;
        }

        .header .header-content .useful-links {
            display: none;
        }

        .header .header-content .languages {
            display: none;
        }

        .header .header-content .menu-toggle {
            display: block;
            margin-left: auto;
            flex-grow: 0;
            align-self: center;
        }

            .header .header-content .menu-toggle .hamburger {
                display: block;
                height: 2.4rem;
                width: 3.6rem;
                border-radius: 0;
                border: none;
                background-color: transparent;
                background-image: none;
                border-top: solid 0.4rem #1c2858;
                border-bottom: solid 0.4rem #1c2858;
                position: relative;
                top: -.4rem;
                transition: 0.2s;
            }

                .header .header-content .menu-toggle .hamburger::before, .header .header-content .menu-toggle .hamburger::after {
                    content: '';
                    display: block;
                    position: absolute;
                    top: .6rem;
                    left: 0;
                    right: 0;
                    height: .4rem;
                    background-color: #1c2858;
                    transition: 0.2s;
                }

                .header .header-content .menu-toggle .hamburger span {
                    visibility: hidden;
                }

    .sticky-wrapper.is-sticky .header {
        border-bottom-color: #D1D3D4;
        padding-top: 1.6rem;
        padding-bottom: 1.6rem;
    }

        .sticky-wrapper.is-sticky .header .header-content .logo a img,
        .sticky-wrapper.is-sticky .header .header-content .logo a svg {
            height: 3.2rem;
        }

        .sticky-wrapper.is-sticky .header .header-content .menu-toggle .hamburger {
            top: 0;
        }

    .nav-active .header {
        border-bottom-color: #D1D3D4;
    }

        .nav-active .header .header-content .menu-toggle .hamburger {
            border-color: transparent;
        }

            .nav-active .header .header-content .menu-toggle .hamburger::before {
                transform: rotate(-45deg);
            }

            .nav-active .header .header-content .menu-toggle .hamburger::after {
                transform: rotate(45deg);
            }

    .skip-to-content + .sticky-wrapper {
        height: 0 !important;
    }
}