/* === Red Barn Media Group - Global Styles - X-Press Energy === */

body, html {
    width: 100%;
    height: 100%;
}

body {
    font-family: "inter-variable", sans-serif;
    font-variation-settings: "slnt" 0, "wght" 400;
    color: #000;
    background-color: #fff;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-family: "poppins", sans-serif;
    font-weight: 700;
    font-style: normal;
    text-transform: uppercase;
}

.poppins {
    font-family: "poppins", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.inter-400, .inter-500, .inter-700 {
    font-family: "inter-variable", sans-serif;
}

.inter-400 { font-variation-settings: "slnt" 0, "wght" 400; }
.inter-500 { font-variation-settings: "slnt" 0, "wght" 500; }
.inter-700 { font-variation-settings: "slnt" 0, "wght" 700; }

.fs-7 { font-size: 0.85rem; }
.fs-8 { font-size: 0.75rem; }

/* === Shared Transition Styles === */
.transition-0-25s {
    transition-duration: 0.25s;
}

/* === Menu Styles === */
.menu-container {
    background: transparent;
    margin-top: 0 !important;
    top: 0;
}
.menu-container.shrink-menu {
    background: #fff;
}

.menu-container,
.menu-container.shrink-menu,
.xe-banner-menu-topper,
.shrink-menu .xe-banner-menu-topper,
.xe-banner-menu-topper .xe-banner-menu-topper-col,
.shrink-menu .xe-banner-menu-topper .xe-banner-menu-topper-col,
.navbar-light .navbar-nav,
.menu-container .container-fluid.xe-logo-row,
.menu-container.shrink-menu .container-fluid.xe-logo-row {
    transition-duration: 0.25s;
}

.xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-auto, .xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-md-auto, .xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-4 {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

.shrink-menu .xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-auto, .shrink-menu .xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-md-auto, .shrink-menu .xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-4 {
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
}

.xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-auto h6, .xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-md-auto h6, .xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-4 h6 {
    font-size: 0.85rem;
}

.navbar-light .navbar-nav {
    height: 120px;
}

.shrink-menu .navbar-light .navbar-nav {
    height: 100px;
}

.navbar-light .navbar-nav .nav-link {
    color: #000 !important;
    font-size: 1rem;
    font-family: "inter-variable", sans-serif;
    font-variation-settings: "slnt" 0, "wght" 500;
}
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:active {
    color: #fff !important;
}
.shrink-menu .navbar-light .navbar-nav .nav-link:hover,
.shrink-menu .navbar-light .navbar-nav .nav-link:active {
    color: #e37c3a !important;
}
.navbar-light .navbar-nav .nav-link.white-menu {
    color: #ffffff !important;
    font-size: 1rem;
    font-family: "inter-variable", sans-serif;
    font-variation-settings: "slnt" 0, "wght" 500;
}

.navbar-light .navbar-nav .nav-link.white-menu:hover,
.navbar-light .navbar-nav .nav-link.white-menu:active {
    color: #e37c3a !important;
}

.shrink-menu .navbar-light .navbar-nav .nav-link.white-menu {
    color: #000 !important;
    font-size: 1rem;
    font-family: "inter-variable", sans-serif;
    font-variation-settings: "slnt" 0, "wght" 500;
}

.shrink-menu .navbar-light .navbar-nav .nav-link.white-menu:hover,
.shrink-menu .navbar-light .navbar-nav .nav-link.white-menu:active {
    color: #e37c3a !important;
}

li.nav-item.dropdown ul.dropdown-menu li.nav-item a {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.dropdown-item {
    color: #000 !important;
    font-size: 0.85rem;
}

.dropdown-item:focus,
.dropdown-item:hover {
    background-color: #eee !important;
}

.dropdown-item:active {
    color: #e37c3a !important;
    background-color: #ccc !important;
}

.dropdown-toggle::after,
.dropend .dropdown-item::after {
    display: none;
}

.dropdown-menu li {
    position: relative;
}

.navbar-expand-xxl .navbar-nav .dropdown-menu.main-dropdown {
    top: 2rem;
    background: #fff;
    padding-top:1rem;
    padding-left:0.5rem;
    padding-right: 0.5rem;
    padding-bottom: 0.5rem;
    border: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
    box-shadow: 0 3rem 3rem rgba(0, 0, 0, 0.175);
    transition-duration: 0.25s;
}
.shrink-menu .navbar-expand-xxl .navbar-nav .dropdown-menu.main-dropdown {
    top: 2rem;
    transition-duration: 0.25s;
}
.navbar-expand-xxl .navbar-nav .dropdown-menu.sub-dropdown {
    background: #fff;
    padding:0.5rem;
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 3rem 3rem rgba(0, 0, 0, 0.175);
}

.menu-container .container-fluid .row .xe-logo-place a.xe-logo {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    top: 3.5rem;
    z-index: 2;
    transition-duration: 0.25s;
}

.menu-container .container-fluid .row .xe-logo-place a.xe-logo {
    background: url(../img/xe-logo.svg);
    width: 244px;
    height: 110px;
    transition-duration: 0.25s;
}

.menu-container.shrink-menu .container-fluid .row .xe-logo-place a.xe-logo {
    width: 189px;
    height: 85px;
    transition-duration: 0.25s;
}

/* === Button Styles === */
.btn {
    padding: 0.75rem 1.25rem !important;
    font-family: "inter-variable", sans-serif;
    font-variation-settings: "slnt" 0, "wght" 700;
    font-size: 1rem;
    text-transform: uppercase;
    border-radius: 0rem;
    transition-duration: 0.25s;
}

.btn.menu-btn {
    padding: 0.75rem 1.5rem !important;
    font-size: 1rem !important;
}

.btn.btn-sm { padding: 0.5rem .75rem !important; font-size: 0.85rem !important; }
.btn.btn-md { padding: 0.85rem 1.25rem !important; font-size: 1rem !important; }
.btn.btn-lg { padding: 1rem 1.5rem !important; font-size: 1.25rem !important; }
.btn.btn-xl { padding: 1.25rem 1.75rem !important; font-size: 1.75rem !important; }

.btn-orange {
    color: #000000;
    background: #e37c3a;
    border-color: #e37c3a;
}
.btn-orange:hover,.btn-orange:active,.btn-orange:focus  {
    background: #f89252;
    border-color: #e37c3a;
}

.btn-outline-orange {
    color: #e37c3a;
    background: transparent;
    border-color: #e37c3a;
}
.btn-outline-orange:hover,.btn-outline-orange:active,.btn-outline-orange:focus {
    color: #f89252;
    background: transparent;
    border-color: #f89252;
}

.btn-black {
    color: #fff;
    background: #000000;
    border-color: #000000;
}
.btn-black:hover,.btn-black:active,.btn-black:focus {
    color: #fff;
    background: #333333;
    border-color: #000000;
}

.btn-outline-black {
    color: #000000;
    background: transparent;
    border-color: #000000;
}
.btn-outline-black:hover,.btn-outline-black:active,.btn-outline-black:focus {
    color: #333333;
    background: transparent;
    border-color: #333333;
}

/* === Color Styles === */
.text-orange { color: #e37c3a !important; }
.bg-orange { background: #e37c3a !important; }
.border-orange { border-color: #e37c3a !important; }

.text-orange.shade { color: #9b5027 !important; }
.bg-orange-shade-1 {background:#9b5027;}
.bg-orange-shade-2 {background:#563422;}

.bg-orange-pattern {
    background: radial-gradient(circle, transparent 20%, #e37c3a 20%, #e37c3a 80%, transparent 80%, transparent) 0% 0% / 64px 64px, radial-gradient(circle, transparent 20%, #e37c3a 20%, #e37c3a 80%, transparent 80%, transparent) 32px 32px / 64px 64px, linear-gradient(rgba(0, 0, 0, 0.15) 1px, transparent 1px) 0px -0.5px / 32px 32px, linear-gradient(90deg, rgba(0, 0, 0, 0.15) 1px, #e37c3a 1px) -0.5px 0px / 32px 32px #e37c3a;
    background-size: 64px 64px, 64px 64px, 32px 32px, 32px 32px;
    background-color: #e37c3a;
}

.bg-split-orange-black {
    background: #000000;
    background: linear-gradient(90deg, rgba(0, 0, 0, 1) 50%, rgba(227, 124, 58, 1) 50%);
}

.bg-black { background: #000000 !important; }
.bg-black-2 { background: #1a1a1a !important; }
.border-black { border-color: #000000 !important; }

.text-666 { color: #666 !important; }
/* === Logo/Image Scroll Styles :: BEGIN === */
.slider {
    height: fit-content;
    position: relative;
    width: 100%;
    display: grid;
    place-items: center;
    overflow: hidden;
}

.slide-track {
    display: flex;
    animation: scroll 30s linear infinite; /* Adjust the duration as needed */
}

.slide {
    width: auto;
    height: 50px;
    display: grid;
    place-items: center;
    transition: 0.5s;
    cursor: pointer;
}
.slide.image {
    width: auto;
    height: 300px;
    display: grid;
    place-items: center;
    transition: 0.5s;
    cursor: pointer;
}

.slide:hover {
    transform: scale(1.025);
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* === Logo/Image Scroll Styles :: END === */
/* === Footer Styles === */
footer {}
/* === Utility Styles === */
.form-control {
    background-color:#eeeeee;
    border: none;
}
em, u {
    text-decoration: none;
    font-style: normal;
    font-weight: 700;
}

.accordion-header .accordion-button {
    font-size: 0.85rem;
    font-variation-settings: "slnt" 0, "wght" 500;
}

.accordion-item {
  border: none;
  border-bottom: 1px solid #ccc;
  border-radius: 0;
}

.accordion-item:last-of-type,
.accordion-button {
  border-radius: 0 !important;
}
.accordion-button {
  background-color: transparent;
  box-shadow: none;
  font-family: inter-variable, sans-serif;
  font-weight: 400;
  color: black;
}

.accordion-button:not(.collapsed) {
  color: black;
}

.accordion-button:focus {
  box-shadow: none;
}

.accordion-button::after {
  display: none !important;
}

.accordion-button:focus {
  box-shadow: none; /* Removes default Bootstrap focus glow */
}

.accordion-button:not(.collapsed) {
  background: #fff6e6 !important;
}

.accordion-body {
    font-size: 0.85rem;
}

/* Custom CSS to make the nested dropdowns work on hover */
.dropdown-menu li {
    position: relative;
}
.dropdown-menu .dropdown-submenu {
    display: none;
    position: absolute;
    left: 100%;
    top: -7px;
}
.dropdown-menu .dropdown-submenu-left {
    right: 100%;
    left: auto;
}
.dropdown-menu > li:hover > .dropdown-submenu {
    display: block;
}
/* === Media Queries === */
@media (max-width:1700px) {
    .xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-auto h6, .xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-md-auto h6, .xe-banner-menu-topper .xe-banner-menu-topper-col .row .col-4 h6 {font-size: 0.75rem;}
}

@media (max-width:1600px) {
    .navbar-light .navbar-nav .nav-link,.shrink-menu .navbar-light .navbar-nav .nav-link,.navbar-light .navbar-nav .nav-link.white-menu,.shrink-menu .navbar-light .navbar-nav .nav-link.white-menu { font-size: 0.9rem; }
}

@media (max-width:1450px) {
    .navbar-light .navbar-nav .nav-link,.shrink-menu .navbar-light .navbar-nav .nav-link,.navbar-light .navbar-nav .nav-link.white-menu,.shrink-menu .navbar-light .navbar-nav .nav-link.white-menu { font-size: 0.85rem; }
}

@media (max-width:1400px) {
    nav.navbar {
        height: fit-content;
        margin: 1rem 0;
    }

    .shrink-menu nav.navbar {
        margin: 0.5rem 0;
    }

    .navbar-light .navbar-nav .nav-link {
        font-size: 1.35rem;
        color: #e37c3a !important;
    }

    .btn.menu-btn { font-size: 1rem !important; }
}

@media (max-width:1200px) {
    .bg-split-orange-black {
        background: #000000;
    }

    .navbar-light .navbar-nav .nav-link, .shrink-menu .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link.white-menu, .shrink-menu .navbar-light .navbar-nav .nav-link.white-menu {
        font-size: 1rem;
        color: #e37c3a !important;
        padding: 0.5rem 0;
    }
    .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:active, .navbar-light .navbar-nav .nav-link.white-menu:hover, .navbar-light .navbar-nav .nav-link.white-menu:active {
        color: #9b5027 !important;
    }

    .navbar-expand-xxl .navbar-nav .dropdown-menu.main-dropdown {
        top: 1rem;
        box-shadow: 0 0.5rem 0.5rem rgba(0, 0, 0, 0.05);
        transition-duration: 0.25s;
    }
}

@media (max-width:991px) {
    .menu-container {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        z-index: 1030;
    }

    .navbar-collapse {
        background-color: #fff !important;
        border-radius: 0.25rem;
    }

    .navbar-light .navbar-nav .nav-link {
        padding: 1rem 0;
    }

    .xe-row-card.left {
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    border-bottom-left-radius: 0rem;
  }
  .xe-row-card.right {
    border-top-right-radius: 0rem;
    border-bottom-right-radius: 1rem;
    border-bottom-left-radius: 1rem;
  }
}

@media (max-width:767px) {
    .xe-banner-menu-topper .xe-banner-menu-topper-col h6 { font-size: 0.75rem; }
}

@media (max-width:700px) {
    nav.navbar { height: 60px; }
    .shrink-menu nav.navbar { height: 50px; }

    .menu-container .container-fluid .row .xe-logo-place a.xe-logo {
        background: url(../img/xe-logo.svg);
        width: 244px;
        height: 110px;
        top: 2.65rem;
    }

    .menu-container.shrink-menu .container-fluid .row .xe-logo-place a.xe-logo {
        width: 211px;
        height: 95px;
        top: 2.5rem;
    }
}

@media (max-width:576px) {
    
}

@media (max-width:500px) {
    .menu-container .container-fluid .row .xe-logo-place a.xe-logo {
        background: url(../img/xe-logo.svg);
        width: 211px;
        height: 95px;
        top: 2.65rem;
    }

    .menu-container.shrink-menu .container-fluid .row .xe-logo-place a.xe-logo {
        width: 167px;
        height: 75px;
        top: 2.5rem;
    }
}

@media (max-width:450px) {
        .menu-container .container-fluid .row .xe-logo-place a.xe-logo {
        background: url(../img/xe-logo.svg);
        width: 150px;
        height: 67.5px;
        top: 3.5rem;
    }

    .menu-container.shrink-menu .container-fluid .row .xe-logo-place a.xe-logo {
        width: 115px;
        height: 52px;
        top: 2.5rem;
    }
}