/* =========================================
   1. Variables
   ========================================= */
:root {
    --primary-color: #0A416A; 
    --secondary-color: #00A390;
    --benco-green: #00a48f;
    --barlow: Barlow,sans-serif;
    --lota: LotaGrotesqueAlt2-Regular,sans-serif;
}

/* =========================================
   2. Typography & Links
   ========================================= */
@font-face {
    font-display: swap;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-family: var(--barlow);
    font-weight: 600;
    color: #97daf7;
}

body:not(.home, .benco-branding) h1,
body:not(.home, .benco-branding) h2,
body:not(.home, .benco-branding) h3,
body:not(.home, .benco-branding) h4,
body:not(.home, .benco-branding) h5,
body:not(.home, .benco-branding) h6 {
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 600;
    color: #007041;
}

body a, body a:visited, body a:focus, body a:hover {
    text-decoration: none;
}

/* =========================================
   3. Base Defaults & WordPress Overrides
   ========================================= */
body {
    font-family: var(--lota);
    padding-top: 60px;
    min-width: 360px;
}

/* body.customize-support {
    padding-top: 75px;
} */

#wpadminbar {
    position: absolute !important;
    /* display: none; */
}

#crumbs,
#crumbs a {
    color: #fff;
    position: relative;
}

#crumbs {
    z-index: 2;
    font-size: 12px;
    list-style: outside none none;
    margin: 1px 0 10px;
    overflow: hidden;
    padding: 40px 15px 10px;
    width: 100%
}

img {
    height: auto;
}

.imgwrap {
    background-size: cover;
    display: block;
    width: 100%;
}

.nocomments {
    display: none
}

/* =========================================
   4. Layout & Grid System
   ========================================= */
.page-template > .container-fluid > .row {
    padding-top: 40px;
    padding-bottom: 40px;
}

.row {
    position: relative
}

.row > * {
    position: relative;
}

/* =========================================
   5. Utility Classes
   ========================================= */
/* Padding/Margin Utils */
.nopadding {padding: 0 !important;}

/* Display & Visibility Utils */
.hide {
    display: none !important;
    visibility: hidden
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

/* Positioning Utils */
.relative {
    position: relative
}

.absolute {
    position: absolute
}

.fixed {
    position: fixed
}

.clear {
    clear: both
}

.nonfloat {
    float: none !important
}

.flexalign {
    justify-content: center;
    display: flex;
    align-items: center
}

.overhidden {
    overflow: hidden
}

.overvisible {
    overflow: visible !important
}

/* Appearance Utils */
.default {
    cursor: default;
    text-decoration: none
}

.pointer {
    cursor: pointer
}

.full {
    width: 100%
}

.nobg {
    background: 0 0 !important
}

.noborder {
    border: none !important
}

.bgwhite {
    background-color: #fff
}

/* =========================================
   6. Buttons & Interactions
   ========================================= */
.half-width-btn {
    width: 50%
}

.wide-btn {
    width: 90%
}

.clear-white {
    position: relative;
    color: #fff;
    border: 1px solid;
    transition: .25s
}

.clear-white:before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 0;
    top: 0;
    left: 0;
    background-color: #fff;
    transition: .25s
}

.clear-white:hover {
    color: #333
}

.clear-white:hover:before {
    height: 100%
}

.btnGroup {
    padding-top: 30px;
}

.btnGroup .btn {
    margin-right: 15px;
    margin-bottom: 15px;
}

.btn-benco {
    border-radius: 6px;
    position: relative;
    font-size: 16px;
    background-color: transparent;
    border: 1px solid #002f6c;
    line-height: normal;
    transition: all .25s;
    font-family: LotaGrotesqueAlt2-black, sans-serif
}

.btn-benco.btn {
    padding: .375rem 1.75rem
}

.btn-benco.icon {
    padding: 9px 22px 7px 55px;
    height: 43px
}

.btn-benco.icon img {
    background-color: #fff;
    border-radius: 50%;
    padding: 3px;
    position: absolute;
    left: 5px;
    top: 4px
}

.btn-benco.active,
.btn-benco:focus,
.btn-benco:hover {
    text-decoration: none;
    color: #002f6c;
    opacity: .8;
    transition: all .25s
}

.btn-benco.btn-sm {
    font-size: .75rem
}

.btn-benco.btn-lg {
    font-size: 1.25rem
}

/* Button Colors */
.btn-benco.blue {
    border-color: #002f6c;
    background-color: #002f6c;
    color: #fff !important
}

.btn-benco.blue.active,
.btn-benco.blue:focus,
.btn-benco.blue:hover {
    border-color: var(--primary-color);
    background-color: var(--primary-color);
    color: #fff !important
}

.btn-benco.green {
    border-color: #6cc24a;
    background-color: #6cc24a;
    color: #fff !important;
    text-shadow: 1px 1px 1px #35761b
}

.btn-benco.green.active,
.btn-benco.green:focus,
.btn-benco.green:hover {
    background-color: #79d554;
    border-color: #79d554;
    color: #fff !important
}

.btn-benco.gray {
    border-color: #c4c4c4;
    background-color: #c4c4c4;
    text-shadow: 1px 1px 1px #2d2d2d;
    color: #fff !important
}

.btn-benco.gray.active,
.btn-benco.gray:focus,
.btn-benco.gray:hover {
    background-color: #aaa;
    border-color: #aaa
}

.btn-benco.aqua {
    border-color: var(--secondary-color);
    background-color: var(--secondary-color);
    color: #fff !important;
    text-shadow: 1px 1px 1px #002137
}

.btn-benco.aqua.active,
.btn-benco.aqua:focus,
.btn-benco.aqua:hover {
    border-color: var(--secondary-color);
    background-color: var(--secondary-color);
    opacity: 0.3s;
    color: #fff !important
}

.btn-benco.orange {
    color: #fff;
    border-color: #fe5000;
    background-color: #fe5000;
    color: #fff !important;
    text-shadow: 1px 1px 1px #3a0000
}

.btn-benco.orange.active,
.btn-benco.orange:focus,
.btn-benco.orange:hover {
    background-color: #fe5000;
    border-color: #fe5000;
    color: #fff !important
}

/* .btn-benco.Transparent {
    color: #6cc24a;
    border-color: #6cc24a
} */
.btn-benco.Transparent {
    color: #00a390;
    border-color: #00a390;
}

/* =========================================
   7. Third-Party Plugins
   ========================================= */
/* flexslider */
.flex-direction-nav a {
    z-index: 1;
}

/* bxslider */
.bx-wrapper {
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
}

/* =========================================
   8. Media Queries
   ========================================= */
/* Container Sizes */
@media (min-width:576px) {
    .container,
    .container-sm {
        max-width: 540px
    }
}

@media (min-width:768px) {
    .container,
    .container-md,
    .container-sm {
        max-width: 720px
    }
}

@media (min-width:992px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm {
        max-width: 960px
    }
}

@media (min-width:1200px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
        max-width: 1140px
    }
}

@media (min-width:1400px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1320px
    }
}

@media (min-width: 1601px){
    .container-fluid {
        max-width: 100%;
    }
    .container {
        /* width: 1600px; */
        max-width: 1600px;
    }
}

/* Visibility Utilities */
@media only screen and (min-width: 992px) {
    .mobile-hide {display:none}
}

@media only screen and (min-width: 768px) {
    .mobile-hide-sm {display:none}
}

@media only screen and (max-width: 991px) {
    .desktop-hide {display:none;}
}

@media only screen and (max-width: 767px) {
    .desktop-hide-sm {display:none;}
}

/* Modal Adjustments */
@media (min-width:991px) {
    .modal-md {
        max-width: 900px
    }
}