.app-custom-header {
    width: 100%;
    height: auto;
    transition: background-color 0.3s ease;
    background-color: var(--app-primary-color);
    margin: 0 auto;
    border:none !important;
}

.app-header-flex { display:flex; justify-content:space-between; align-items:flex-start; }
.app-header-flex > * {flex:1;}

.app-custom-header .navbar-brand { float:none; height:auto;}
.app-custom-header .navbar-brand img {
    max-width: 60vw;
    display:inline-block;
}

.app-nav-container { height: 380px; }
.app-custom-header a {color:#fff; font-weight:600; font-size:20px; }
.app-custom-header a:hover { color:#fff; text-decoration:underline}

.app-custom-header .bottom-pattern { 
    background-image: url('/fileserver/sites/305/images/banner-bg-pattern.png');
    background-repeat: repeat-x;
    height:110px; 
    background-size:contain;
}

@media (max-width:767px) {
    .app-header-flex { display:flex; flex-direction:column; justify-content:center; align-items:center; }
    .app-custom-header .navbar-menus { text-align:center;}

    .app-nav-container > div:first-of-type { display:none;}

    .app-custom-header .navbar-brand { padding:0; max-height: 120px;}

    .app-custom-header .navbar-brand img {
        max-height: 120px;
    }
    .app-nav-container { height: 240px; }

    .app-custom-header .bottom-pattern { 
    height:70px; 
}
    .app-custom-header a {color:#fff; font-weight:600; font-size:16px; }
}