@CHARSET "UTF-8";
:root {
    --wp--style--global--content-size: 100% !important;
}
body {
    font-family: var(--font-family--default);
    font-size: var(--wp--preset--font-size--medium);
    line-height: var(--wp--custom--typography--line-height);
}
::selection {
    background-color: var(--wp--custom--color--selection);
    color: #FFF;
}
a {
    color: var(--wp--preset--color--link);
    text-decoration: none;
}
a:hover {
    color: var(--wp--preset--color--link);
    text-decoration: underline;
}

/* Header */
header {
    align-items: center;
    background-color: var(--navbar--background-colour);
    display: flex;
    height: var(--navbar--height);
    border-bottom: 2px solid var(--wp--preset--color--red);
}
header.fixed-top,
header.sticky {
    position: absolute;
    width: 100vw;
    z-index: 9999;
}
header.fixed-top + main,
header.sticky + main {
    margin-top: var(--navbar--height);
}
header.stuck {
    background-color: var(--navbar--background-colour);
    left: 0;
    position: fixed;
    right: 0;
    top: 0 !important;
    transition: top 0.5s ease;
    z-index: 1030;
}
header>.navbar {
    flex: 1;
}
.offcanvas {
    background-color: var(--navbar--background-colour);
}
.navbar-brand img {
    height: 39px;
    width: 160px;
}
.navbar-nav {
    align-items: center;
}
.nav-item:not(:last-child) {
    margin-right: 20px;
}
.nav-item:not(.nav-item--social) img {
    height: 49px;
    width: 250px;
}
.nav-item--social {
    align-items: center;
    border: 1px solid var(--navbar--item--colour);
    border-radius: 20px;
    color: var(--navbar--item--colour) !important;
    display: inline-flex;
    justify-content: center;
    font-family: var(--navbar--item--font-family);
    font-size: 20px;
    height: 40px;
    width: 40px;
}
.nav-item--social a {
    padding-top: 1px !important;
}
.nav-item--social a img {
    height: 20px;
    width: 20px;
}

/* Footer */
.footer {
    background: var(--footer--background-colour);
}
.footer > .container-fluid > .row:first-child {
    border-top: 2px solid var(--wp--preset--color--red);
    padding-bottom: 2rem;
    padding-top: 2rem;
}
.footer > .container-fluid >  .row:last-child {
    background-color: #38495A;
    color: var(--footer--colour) !important;
    margin-top: 2rem;
    padding-bottom: 2rem;
    padding-top: 2rem;
}
.footer a {
    color: var(--footer--link--colour) !important;
}
.footer--outlink img {
    height: 58px;
    width: 296px;
}
.footer .navbar-nav {
    display: flex;
    flex-direction: row;
}

/* WordPress and PB */
.fe-hidden {
    display: none;
}

/* Site specific styles */
.home--cover--first-p {
    font-size: var(--heading--font-size--h1) !important;
}
.home--cover--content-p {
    font-size: var(--heading--font-size--h5) !important;
}
.home--cover .wp-block-columns {
    gap: 0 !important;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    /* START: Change if changing expand point */
    .navbar, .navbar > .container {
        padding: 0;
    }
    #navbar-main {
        height: 100% !important;
    }
    .offcanvas-body {
        height: 100%;
    }
    .navbar-nav {
        justify-content: flex-start;
        height: 100%;
    }
    .navbar-nav > li {
        align-items: center;
        display: flex;
    }
    .navbar-expand-md .navbar-nav .dropdown-menu {
        border: none;
        border-radius: 0;
        border-top: var(--navbar--dropdown--menu--border--width) solid var(--navbar--dropdown--menu--border--colour);
        top: calc(((var(--navbar--height) + var(--navbar--dropdown--menu--border--width)) / 2) + var(--wp--preset--font-size--medium));
    }
    /* END: Change if changing expand point */

    .wp-block-separator.is-style-wide:not(.is-style-dots) {
        width: 55% !important;
    }
    .home--cover {
        height: calc(100vw / 3) !important;
        max-height: 550px !important;
    }
    .home--cover .wp-block-columns {
        gap: 24px !important;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .navbar-brand img {
        height: 68px;
        width: 278px;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    
}

/* Extra xl large devices (large desktops, 1400px and up) */
@media (min-width: 1400px) {

}

/* Publishing Bureau xxl large devices (large desktops, 1600px and up) */
@media (min-width: 1600px) {

}