#menu ul.sub-menu {
    display: none;
}

#sub-menu {
    width: calc(100% + calc((20 / 1920) * var(--max-content-width)));
    height: calc((44 / 1920) * var(--max-content-width));
    display: flex;
    align-items: center;
    margin-left: calc((-20 / 1920) * var(--max-content-width));
    background-color: #3D88BA;
    transition: transform 0.3s ease-in-out;
    z-index: -1;
    position: absolute;
    bottom: 0px;
    left: 0px;
    bottom: 0px;
    width: calc(100% + calc((20 / 1920) * var(--max-content-width)));
    font-size: calc((20 / 1920) * var(--max-content-width));
    line-height: calc((32 / 1920) * var(--max-content-width));

}

.sub-menu--visible #sub-menu {
    transform: translate(0px, 100%);
}

.sub-menu--active #sub-menu {
    transform: translate(0px, 100%) !important;
}

.sub-menu--active .invisible #sub-menu {
    transform: translate(0px, 0%) !important;
}

main {
    transition: transform 0.3s ease-in-out;
}

.sub-menu--active main {
    transform: translate(0, calc((44 / 1920) * var(--max-content-width)));
}

#sub-menu a {
    color: #fff;
    text-decoration: none;
    margin: 0px calc((20 / 1920) * var(--max-content-width));
}

#sub-menu ul {
    display: flex;
}

#sub-menu ul li {
    position: relative;
}

#sub-menu .current_page_item::after,
#sub-menu .current-page-ancestor::after,
#sub-menu li:hover::after,
#menu-mobile .current_page_item::after,
#menu-mobile .current-page-ancestor::after {
    content: '';
    display: block;
    width: calc((20 / 1920) * var(--max-content-width));
    height: calc((3 / 1920) * var(--max-content-width));
    background-color: #fff;
    position: absolute;
    bottom: calc((-0.5 / 1920) * var(--max-content-width));
    left: 50%;
    transform: translate(-50%, 0px);
    border-radius: calc((3 / 1920) * var(--max-content-width));
}

.text-column.text-column--large {
    max-width: calc((1250 / 1920) * var(--max-content-width));
}

.read__more {
    margin-top: 12px;
    display: flex;
    color: #3D88BA;
    cursor: pointer;
    right: calc((41 / 1920) * var(--max-content-width));
    bottom: calc((41 / 1920) * var(--max-content-width));
    position: absolute;
}

.content-columns--page .text-column h3 {
    font-size: calc((40 / 1920) * var(--max-content-width));
    line-height: calc((48 / 1920) * var(--max-content-width));
}

.content-columns--page .text-column h4 {
    font-size: calc((28 / 1920) * var(--max-content-width));
    line-height: calc((32 / 1920) * var(--max-content-width));
    margin-bottom: -12px;
}

.content-columns--page .text-column h4 strong {
    font-weight: 500;
}

.button--small {
    background-color: transparent !important;
    width: auto !important;
    right: calc((28 / 1920) * var(--max-content-width));
    bottom: calc((41 / 1920) * var(--max-content-width)) !important;
    position: absolute !important;
}

.button.button--small span {
    background-color: #3D88BA !important;
}

.button.button--white.button--small.hover {
    box-shadow:none !important;
}

.button.button--small.hover span {
    background-color: #16385E !important
}



/* Small Devices (Mobile) */
@media (max-width: 1023.99px) {
    #sub-menu {
        display: none;
    }

    .menu-opening #menu-mobile {
        width: 100vw;
        text-align: left;
        padding: 0px 24px;
    }

    #menu-mobile ul {
        text-align: left;
    }

    #menu-mobile .current_page_item::after,
    #menu-mobile .current-page-ancestor::after {
        display: none !important;
    }

    #menu-mobile .current_page_item,
    #menu-mobile .current-page-ancestor,
    #menu-mobile .current-page-ancestor li.current_page_item {
        font-weight: 500
    }

    #menu-mobile .current-page-ancestor li {
        font-weight: 400;
    }


    #menu-mobile .current_page_item .sub-menu {
        font-weight: 400;
    }

    #menu-mobile ul.sub-menu {
        max-height: 0px;
        overflow: hidden;
        transition: 0.3s ease-in-out;
        padding-left: 24px;
    }

    #menu-mobile ul.sub-menu.open {
        max-height: 500px;
    }

    #menu-mobile ul.sub-menu li {
        margin: 8px 0px;
    }

    .text-column.text-column--large {
        max-width: 100%;
    }

    .hero__content {
        padding-left: 0px;
        padding-right: 0px;
    }

    .content-columns--page .text-column h3,
    .content-columns--page .text-column h4 {
        font-size: 24px;
        line-height: 30px;
        max-width: none;
        margin-bottom: -12px;
    }

    .read__more {
        position: relative;
        right: auto;
        bottom: auto;
    }

    .button--small {
        right: auto;
        bottom: auto !important;
        padding: 0px !important;
        position:relative !important;
        display: block !important;
    }

    .button.button--small span {
        transform:none;
        top:auto;
        right:auto;
        left:auto;
        bottom:auto;
        position: relative;
        float: right;
    }

    .service {
        min-height: auto !important;
    }

    .hero__image {
        min-height: 47vw;
    }

}