.ProfilePage .header {
    min-height:420px;
}
.ProfilePage .profile-title {
    margin-top:-200px;
}
.ProfilePage .profile-page-container {
    padding-top:100px;
    position:relative;
}

/* global */
@media (min-width: 576px) and (max-width: 767.98px) {
    .container {
        max-width:640px;
    }
}
body p {
    font-size:18px;
    line-height:1.8rem
}
body.w-fixed-member-navigation {
    padding-top:56px;
}
/* overwrite user agent autocomplete styles */
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    background-color: rgba(250, 255, 189, 0.5) !important;
}
.badge-border {
    border: 0.25rem solid currentColor
}
a.badge, a.badge:hover {
    text-decoration:none;
    transition:all 0.2s
}
a.badge:hover {
    background-color: currentColor;
}
a.badge:hover * {
    color:#fff;
}
/* images */
img.alignleft {
    float:left;
    margin:0 16px 16px 0;
}
img.alignright {
    float:right;
    margin: 0 0 16px 16px;
}

.header {
    background-size:cover;
    background-position:50% 50%;
    min-height:150px;
    position:relative;
}
.header > .banner-plus-nav {
    z-index:1001;
}
.BonoboHomePage .header {
    min-height:80vh;
}

/* header gradient overlay */
.header::before {
    content: '';
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
}

/* header navigation gradient */
.header::after {
    content:'';
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:220px;
}
.header > .header-bg-overlay-image {
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
    background-size:contain;
    background-repeat:no-repeat;
    opacity:0.6;
}
.header > * {
    position:relative;
    z-index:1;
}
.header.inverse {
    color:#fff;
}
.tagline-heading {
    font-size:2.4rem;
    font-weight:900;
    text-shadow: 0 0 24px rgba(0,0,0,0.55)
}
.inverse .site-logo {
    color:#fff;
}
.site-logo:hover {
    text-decoration:none;
}
.logo-holder.w-bg {
    box-shadow:0 3px 18px 12px currentColor;
    background-color:currentColor
}

/* .site-title {

} */
.site-tagline {
    font-style:italic;
    border-top:0.15rem solid #fff;
}
.header-social-holder {
    display:flex;
    justify-content:left;
    width:50%;
    order:0;
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .header-social-holder {
        order:1;
    }
}
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .header-social-holder {
        order:0;
        width:auto;
        justify-content:center;
    }
}

.header-social {
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:24px;
    width:56px;
    height:56px;
}
.header-social:hover {
    color:var(--brandColor);
}
.header-social.fb {
    background-color:#3B5998;
}
.header-social.tw {
    background-color:#1DA1F2
}
.header-social.gp {
    background-color:#DB4437
}
.site-access-menu {
    height:56px;
    display:flex;
    align-items:center;
    justify-content:center;
}

#mainMenu.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,.95);
}
#mainMenu.navbar-dark .nav-item > a {
    text-shadow: 0 2px 12px rgba(0,0,0,0.8);
    font-size:18px;
}

@media (max-width: 991.98px) {
    #mainMenu.navbar-dark .navbar-toggler {
        background:rgba(255,255,255,0.95);
        color:#333;
        border-color:#333
    }
    #navbarText {
        position:absolute;
        top:40px;
        width:220px;;
    }
    #mainMenu .navbar-nav {
        background:rgba(255,255,255,0.95);
        padding:12px;
    }
    #mainMenu.navbar-dark .navbar-nav .nav-link {
        color:#000;
        text-shadow:none
    }
}


.site-access-menu .btn {
    color:#fff;
}

.site-access-menu .btn:hover {
    color:#fff;
}

.breadcrumbs-plus-title .current-page {
    background:#fff;
    color:#333;
    padding:0 15px;
    margin-left:-15px;
}
.level-two-link {
    padding:1rem;
    background-color:#fff;
    opacity:0.75;
    transition:all 0.2s
}
.level-two-link:hover {
    opacity:0.95
}
/* .inverse .logo-holder.w-bg {
    box-shadow:0 3px 28px -3px rgba(255,255,255,0.6)
} */


/* BELOW IS TESTING HEADING ICON CHANGES. DEPRECATED */
/* .header .home-icon {
    display:none;
}
.header.toggleheader .home-icon {
    display:block;
}
.header.toggleheader img {
    display:none;
} */
@media (min-width:800px) and (min-height:600px) {
    .BonoboHomePage .header {
        min-height:80vh;
    }
}
/* elemental */
.jumbotron.banner-element {
    position:relative;
    min-height:200px;
    width:100%;
    background-size:cover;
    background-position:center center;
}
.banner-element__overlay {
    position:absolute;
    width:100%;
    top:0;
    left:0;
    height:100%;
}
.banner__content {
    position:relative
}


.silverstripe__elementalblocks__block__bannerblock {
    max-height:initial;
}

/* micro gallery element */
.micro-gallery__holder {
    color:#fff;
    display:flex;
    flex-wrap:wrap;
    /* flex-direction:column; */
    justify-content:center;
    align-content:center;
    width:auto;
    min-height:260px;
    margin:auto;
}
.micro-gallery__row {
    display:flex;
    flex-wrap: nowrap;
    width:100%;
    height:auto;
    align-items:center;
    margin-bottom:-16px;
    /* justify-content:center; */
}
.micro-gallery__image {
    width:260px;
    height:180px;
    /* margin:8px; */
    color:inherit;
    border:8px solid currentColor;
    background-position:center;
    transition:all 0.2s;
}
.micro-gallery__image:hover {
    color:inherit;
}
/* .micro-gallery__image.first {
    border-top:16px;
    border-left-width:12px;
}
.micro-gallery__image.last {
    border-bottom:24px;
    border-right-width:12px;
} */
.micro-gallery__image:hover {
    border-width: 0;
    transition:all 0.2s;
}
/* .micro-gallery__image:nth-of-type(3), .micro-gallery__image:nth-of-type(4),
.micro-gallery__image:nth-of-type(7), .micro-gallery__image:nth-of-type(8) {
    width:280px;
    height:210px;
} */
.micro-gallery__row:nth-of-type(odd) .micro-gallery__image:nth-of-type(even) {
    /* width:280px; */
    height:210px;
}
.micro-gallery__row:nth-of-type(even) .micro-gallery__image:nth-of-type(odd) {
    /* width:280px; */
    height:210px;
}


@media (min-width:800px) and (min-height:600px) {
    .header {
        min-height:400px;
    }
}


/* .home-content {
    margin-top:-120px;
} */
.home-content > .element:first-of-type {
    min-height:280px;
}




/* latest news elemental */
.latest-news-holder {
    /* box-shadow:0 3px 32px rgba(0,0,0,0.3) */
    min-height:280px;
}
/* position the element in the header of home page */
.BonoboHomePage .latest-news-container.Pos-1 {
    margin-top:-140px;
}
.news-element {
    flex-grow:1;
}
.card.news-element {
    background-size:cover;
    background-position:50% 50%;
        transform:scale(0.99);
        transition:all 0.2s;
}
.card.news-element:hover {
    transform:scale(1)
}
.news-column {
    position:relative;
    z-index:1;
}
.news-column.First {
    /* height:calc(200px + .25rem);
    max-height:220px; */
    margin-right:60px;
    transform:translateY(-20px);
}
    .news-element-item {
        width:100%;
        height:100%;
        /*text-shadow:0 2px 8px rgba(0,0,0,0.5);*/
        transition:all 0.2s
    }
    .news-element-item:hover {
        text-decoration:none;
        color:currentColor;
    }





    .el-holder:not(#El-1) .element .container {
        opacity:0;
        -webkit-transform:translateY(50px);
                transform:translateY(50px);
        -webkit-transition: all 0.2s;
        transition: all 0.2s
    }
    .el-holder:not(#El-1) .element.translate-element-reset .container {
        -webkit-transform:translateY(0px);
                transform:translateY(0px);
        opacity:1;
    }




    /* userforms */

    button.step-button-jump.js-align {
        border-radius: 50%;
        border: 0;
        width: 40px;
        height: 40px;
        background: #c4c4c4;
        color: #646464;
    }
    .viewed button.step-button-jump.js-align {
        background:#98cc87;
    }
    .current button.step-button-jump.js-align {
        color: #fff;
        background: #4454aa;
    }
    /* .step-button-wrapper.viewed.current button.step-button-jump.js-align {
        background:#229a43;
    } */


    .step-button-prev,
    .step-button-next {
        display: inline-block;
        font-weight: 400;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        border: 1px solid transparent;
        padding: .375rem .75rem;
        font-size: 1rem;
        line-height: 1.5;
        border-radius: .25rem;
        cursor:pointer;
        transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    }
    .step-button-prev {
        color: #fff;
        background-color: #6c757d;
        border-color: #6c757d;
    }

