@charset "utf-8";
/*
    -------------------------------------------------------------------
        Theme Name: Alfresco Home (Remodel)
        Theme URI: https://alfrescohome.com
        Author: GCSolutions
        Author URI: https://gardencentersolutions.com
        Description: Custom Theme for Alfresco Home
        Tags: custom
        Version: 1.0
        Requires at least: 6.0
        Tested up to: 6.6
        Requires PHP: 7.4
    -------------------------------------------------------------------
*/

/* General Imports
-------------------------------------------------------------------*/
@import url('css/bootstrap.css');
@import url('fonts/stylesheet.css');
@import url('style-mobilemenu.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css');

/* Root
-------------------------------------------------------------------*/
:root {
    --white: #FFF;
    --black: #000;
    --brand-primary: #d2232a;
    --brand-secondary: #d9ab34;
    --grey-light: #f6f6f6;
    --grey-med: #666666;
    --grey-dark: #777;
    --dark-yellow: #805f00;
    --ff-default: "avenir_lt_std55_roman";
    --ff-bold: "avenir_lt_std85_heavy";
    --ff-bold-italic: "avenir_lt_std85_heavy_oblique";
    --ff-light: "avenir_lt_std35_light";
    --ff-light-italic: "avenir_lt_std35_light_oblique";
    --ff-accent: "requiemdisplay-htf-roman";
}

/* Backgrounds
-------------------------------------------------------------------*/
.bg-white {background-color: var(--white);}
.bg-black, .bg-brand-black, .bg-dark {background-color: var(--black) !important;}
.bg-primary {background-color: var(--brand-primary);}
.bg-secondary {background-color: var(--brand-secondary);}
.bg-light-grey {background-color: var(--grey-light);}
.bg-med-grey, .bg-medium-grey {background: var(--grey-med);}
.bg-dark-grey {background-color: var(--grey-dark);}
.bg-angular {
    background-color: #f6f6f6;
    padding: 100px 40px;
    clip-path: polygon(0 15%, 100% 0, 100% 85%, 0 100%);
}
        @media (max-width: 768px) {
            .bg-angular {
                padding: 80px 20px;
                clip-path: polygon(0 10%, 100% 0, 100% 90%, 0 100%);
            }
        }

/* Text Colors
-------------------------------------------------------------------*/
.text-white, .white {color: var(--white);}
.text-black {color: var(--black);}
.text-brand-primary, .text-red {color: var(--brand-primary);}
.text-brand-secondary, .text-secondary {color: var(--brand-secondary);}


/* HTML
-------------------------------------------------------------------*/
html {
    font-size: 62.5%;
}


/* Body
-------------------------------------------------------------------*/
body {
    background: var(--white);
    color: var(--black);
    font-family: var(--ff-default);
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.5;
    overflow-x: hidden;
}

    @media screen and (max-width: 991px) {
        body {
            padding-top: 70px;
        }
    }

    @media screen and (max-width: 620px) {
        body {
            padding-top: 70px;
        }
    }

/* Type Formatting
-------------------------------------------------------------------*/
p {
    margin: 1em 0;
}

h1, h2, h3 {
    font-family: var(--ff-accent);
    line-height: 1;
    padding: 0;
}

h1 {
    font-size: 5rem;
    line-height: 1;
}

    @media screen and (max-width: 1199px) {
        h1 {
            font-size: 4.6rem;
        }
    }

    @media screen and (max-width: 991px) {
        h1 {
            font-size: 4.0rem;
        }
    }

h2 {
    font-size: 4rem;
    margin: .5em 0 0 0;
}

    @media screen and (max-width: 1199px) {
        h2 {
            font-size: 2.8rem;
        }
    }

    @media screen and (max-width: 991px) {
        h2 {
            font-size: 2.4rem;
        }
    }

h3 {
    font-size: 2.6rem;
    font-weight: 700;
    margin: 1em 0 0 0;
}

a:link,
a:visited,
a:active,
a:hover {
    color: var(--black);
    text-decoration: none;
}

a:hover {
    color: var(--brand-primary);
}

a.dark:link,
a.dark:visited,
a.dark:active,
a.dark:hover {
    color: var(--black);
}

strong, b, .bold, .strong {
    font-family: var(--ff-bold);
}

.text-sm {
    font-size: 1.2rem;
    overflow-wrap: break-word;
}

.fs-reduced {
    font-size: 1.4rem;
    font-weight: 500;
}

.fs-sm {
    font-size: 1.3rem;
}

.smaller {
    font-size: 1.4rem;
}

.ff-default {
    font-family: var(--ff-default);
    font-weight: 700;
}

.intro-copy p {
    font-size: 2.8rem;
    line-height: 1.5;
    font-family: var(--ff-accent) !important;
    font-weight: 400;
    font-style: italic;
}

@media screen and (max-width: 1199px) {
    .intro-copy p {
        font-size: 2.6rem;
    }
}

@media screen and (max-width: 991px) {
    .intro-copy p {
        font-size: 2.4rem;
    }
}

/* Custom Stuff*/
.py-8 {
    padding-top: 12rem !important;
    padding-bottom: 12rem !important;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.visually-hidden.focusable:focus {
  position: absolute;
  top: 0;
  left: 0;
  background: #fff;
  padding: 1.8rem;
  z-index: 1000;
  clip: auto;
  width: auto;
  height: auto;
  overflow: visible;
}
/* Forms & Buttons
-------------------------------------------------------------------*/
.form-control, .form-select {
    border: 1px solid var(--grey-dark);
    font-weight: 300;
    background-color: var(--white);
    color: var(--grey-dark);
    font-size: 1.8rem;
    border-radius: 0;
    padding: .5em;
}
.btn{
    font-size: 1.8rem;
    padding: 0.5em 1em;
    border-radius: 0;
    text-decoration: none;
    display: inline-block;
    transition: all 0.2s ease-in-out;
}
.btn-danger,
a.btn-danger:link,
a.btn-danger:visited,
a.btn-danger:hover,
a.btn-danger:focus,
a.btn-danger:focus-visible,
a.btn-danger:active,
a.btn-danger:disabled,
button.btn-danger:disabled {
  color: var(--white);
}

.btn-custom,
a.btn-custom:link,
a.btn-custom:visited,
a.btn-custom:focus,
a.btn-custom:active {
    background-color: var(--white);
    color: var(--grey-med);
    border: 1px solid var(--brand-secondary); /* Gold */
    font-size: 1.4rem;
    padding: 0.5em 1em;
    border-radius: 0;
    text-decoration: none;
    display: inline-block;
    transition: all 0.2s ease-in-out;
}

.btn-custom:hover,
a.btn-custom:hover {
    background-color: var(--brand-secondary); /* Gold */
    color: var(--white);
    border-color: var(--brand-secondary);
    text-decoration: none;
}

.btn-tabs, a.btn-tabs:link, a.btn-tabs:focus, a.btn-tabs:active, a.btn-tabs:visited {
    background: var(--brand-dark);
    border-color: var(--brand-dark);
    color: var(--white);
    font-size: 1.6rem;
    padding: .5em .75em;
    border-radius: 0;
    margin: 0 .15em;
}

.btn-tabs:hover, a.btn-tabs:hover, .btn-tabs.active {
    color: var(--white);
    background: var(--brand-primary);
    border-color: var(--brand-primary);
}

.btn-learnmore, a.btn-learnmore:link, a.btn-learnmore:focus, a.btn-learnmore:active, a.btn-learnmore:visited {
    background: var(--white);
    border-color: var(--brand-dark);
    color: var(--brand-dark);
    font-size: 1.3rem;
    text-transform: uppercase;
    padding: .5em 1em;
    border-radius: 0;
    font-weight: 700;
    margin: 0 auto;
}

.btn-learnmore:hover, a.btn-learnmore:hover {
    color: var(--white);
    background: var(--brand-primary);
    border-color: var(--brand-primary);
}

.btn-search, a.btn-search:link, a.btn-search:focus, a.btn-search:active, a.btn-search:visited {
    background: var(--brand-secondary);
    border-color: var(--brand-secondary);
    color: var(--white);
    font-size: 1.8rem;
    padding: .5em 1em;
    border-radius: 0;
}

.btn-search:hover, a.btn-search:hover {
    color: var(--white);
    background: var(--brand-primary);
    border-color: var(--brand-primary);
}

/* Images
-------------------------------------------------------------------*/
img.alignright {
    float: right;
    margin-left: 1em;
    margin-bottom: 1em;
}

img.alignleft {
    float: left;
    margin-right: 1em;
    margin-bottom: 1em;
}

.img-thegallery {
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 300px;
    object-fit: cover;
}

.img-cover {
    width: 100%;
    height: auto;
}

.featured-square {
    width: 415px;
    height: 415px;
    max-width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    margin: 0 0 1rem 0;
    position: relative;
}

.featured-square img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* Square 300 Figure Styling */
.square-300 {
    width: 300px;
    height: 300px;
    max-width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    margin: 0 0 0.5rem 0;
    position: relative;
    display: block;
}

.square-300 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

@keyframes effectShine {
    0% {
        left: -75%;
    }

    100% {
        left: 125%;
    }
}

.image-gallery,
.image-gallery-small,
.image-figure,
.blog-thumbnail,
.image-container,
.image-rounded,
.event-thumbnail,
.image-gallery-products {
    position: relative;
    overflow: hidden;
    margin: 0;
}

.image-gallery:hover::before,
.image-gallery-small:hover::before,
.image-figure:hover::before,
.blog-thumbnail:hover::before,
.image-container:hover::before,
.image-rounded:hover::before,
.event-thumbnail:hover::before,
.image-gallery-products:hover::before {
    content: "";
    pointer-events: none;
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
    transform: skew(-25deg);
    animation: effectShine 0.75s;
}

.image-gallery img,
.image-gallery-small img,
.image-gallery-products img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.image-gallery .zoom-icon,
.image-gallery-small .zoom-icon,
.image-container .zoom-icon,
.image-gallery-products .zoom-icon {
    position: absolute;
    bottom: 10px;
    right: 10px;
    color: var(--white);
    background: rgba(0, 0, 0, 0.6);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    opacity: 0;
    transform: scale(0.8);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.image-gallery:hover .zoom-icon,
.image-gallery-small:hover .zoom-icon,
.image-gallery-products:hover .zoom-icon {
    opacity: 1;
    transform: scale(1);
}

.image-gallery:hover img,
.image-gallery-small:hover img,
.image-gallery-products:hover img {
    transform: scale(1.1);
}

.image-figure {
    height: 400px;
}

.image-figure img {
    height: 100%;
    object-fit: cover;
}

.blog-thumbnail {
    width: 100%;
    height: 300px;
}

.blog-thumbnail img {
    width: 100% !important;
    height: 300px;
    object-fit: cover;
}

.event-thumbnail {
    width: 100%;
    height: 550px;
}

.event-thumbnail img {
    width: 100%;
    height: 550px;
    object-fit: cover;
}

.image-gallery {
    height: 250px;
}

.image-gallery-small {
    height: 150px;
}

.image-gallery-products {
    height: 400px;
}

/* Top Bar
-------------------------------------------------------------------*/

.top-social a {
  display: inline-block;
  padding: 8px; /* ensures clickable area ~32x32 */
  margin-left: 12px;
  color: #333;
  transition: color 0.3s ease, opacity 0.3s ease;
}

.top-social a:first-child {
  margin-left: 0;
}

.top-social a i {
  font-size: 1.6rem;
  vertical-align: middle;
}

.top-social a:hover {
  opacity: 0.7;
  color: #000;
}

.top-bar{
  padding: 4px 1%;
  border-bottom: 1px solid #eebc4c;
}

.top-bar a{
    font-size: 1.6rem;
    color: var(--grey-med);
    text-transform: uppercase;
    text-decoration: none;
    line-height: 22px;
}

.top-bar a:hover,
.top-bar a:focus {
  color: var(--grey-med);
}

.top-links ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.top-links li {
  display: inline-block;
  margin: 0 0.5rem;
  position: relative;
}

/* Main Menu
-------------------------------------------------------------------*/
#mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-megamenu:not(.mega-menu-tabbed) li.mega-menu-item-has-children:not(.mega-collapse-children) > a.mega-menu-link > span.mega-indicator, #mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-item-has-children.mega-hide-arrow > a.mega-menu-link > span.mega-indicator {
    display: inline-block !important;
}
#mega-menu-wrap-main-menu .mega-menu-panel {
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 1029px !important;
  box-sizing: border-box !important;
}
#mega-menu-wrap-main-menu {
  position: relative !important;
}
/* Hide arrows only in flyout (submenus) */
#mega-menu-wrap-main-menu #mega-menu-main-menu ul.mega-sub-menu li.mega-menu-item-has-children > a.mega-menu-link > span.mega-indicator:after {
  display: none !important;
}

/* Show arrows on top-level menu */
#mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item-has-children > a.mega-menu-link > span.mega-indicator:after {
  display: inline-block !important;
}
#mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row .mega-menu-column > ul.mega-sub-menu > li.mega-menu-item{
   padding: 5px 15px !important; 
}
#mega-menu-wrap-main-menu #mega-menu-main-menu[data-effect="fade_up"] li.mega-menu-item.mega-menu-megamenu > ul.mega-sub-menu, #mega-menu-wrap-main-menu #mega-menu-main-menu[data-effect="fade_up"] li.mega-menu-item.mega-menu-flyout ul.mega-sub-menu{
    padding: 15px; 
}
.image-text a{
    text-align: center !important;
}

/* Mobile Menu
-------------------------------------------------------------------*/
img.mobile-logo {
    max-height: 50px;
}

.offcanvas {
    position: fixed;
    bottom: 0;
    z-index: 1050;
    display: flex;
    flex-direction: column;
    max-width: 100%;
    color: var(--black);
    visibility: hidden;
    background-color: var(--white);
    background-clip: padding-box;
    outline: 0;
    transition: transform 0.3s ease-in-out;
}

.navbar-content a {
    color: var(--white);
    text-decoration: none;
}
.navbar {
    background: white;
}
.navbar-content {
    padding: 0 1em;
    font-size: 1.5rem;
    text-transform: none;
}

.mobile-nav-container .menu .hidden-mobile {
    display: none;
    visibility: none;
}
.navbar-toggler-icon {
    background-image: url(images/hamburger.png);
}
.page-item-756, .page-item-177, .page-item-759{
    display:none;
}

/* Default Pages
-------------------------------------------------------------------*/
.bg-page-carousel {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: relative;
    padding: 0;
    z-index: 1;
    text-align: center;
}

.carousel-background-adjustment {
    position: relative;
}

.bg-page-carousel .container {
    z-index: 999999;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    width: 100%;
    transform: translateY(-50%);
}

.bg-page-banner {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: relative;
    padding: 3em 0;
    z-index: 1;
    text-align: center;
}

.bg-page-banner .container {
    z-index: 15 !important;
}

.bg-page-banner .py-10,
.bg-blog-no-banner .py-10 {
    padding-top: 9em;
    padding-bottom: 9em;
}

.bg-blog-no-banner .py-title {
    padding-top: 3em;
    padding-bottom: 3em;
}

.bg-page-banner h1,
.bg-page-carousel h1 {
    z-index: 10;
    color: var(--black);
    font-size: 6rem;
    padding: .25em .65em;
    font-family: var(--ff-default);
    background: rgba(255, 255, 255, .8);
    display: inline;
    margin: 0;
    font-weight: 600;
}

.bg-page-no-banner {
    text-align: center;
    padding: 0 0 20px 0;
}

.bg-page-no-banner h1 {
    text-transform: uppercase;
    display: inline-block;
    font-weight: normal;
    padding-bottom: 20px;
    margin: 0 auto 30px;
    border-bottom: 1px solid #ddb308;
    color: var(--grey-med);
    font-size: 4rem;
    font-weight: bold;
}

    @media screen and (max-width: 991px) {
        .bg-page-banner .py-10 {
            padding-top: 3em;
            padding-bottom: 3em;
        }

        .bg-page-carousel h1,
        .bg-page-banner h1 {
            font-size: 3rem;
            display: block;
            width: 100%;
            text-align: center;
        }
    }

/* Map Embed
-------------------------------------------------------------------*/
.map-embed p {
    padding: 0;
    margin: 0;
}
.map-embed iframe {
    width: 100%;
    height: 350px;
    margin: 0;
    padding: 0;
}

/* Video
-------------------------------------------------------------------*/
.video-wrap {
    z-index: -100;
}

.custom-video {
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

 .videos-container {
        display: table;
        width: 100%;
    }

    .videos-right {
        width: 290px;
        float: right;
        height: 32vw;
        overflow: auto;
    }

    .videos-left {
        width: 100%;
        float: left;
    }

    .iframe-container {
        position: relative;
        padding-bottom: 56.26%;
    }

    .videos-left iframe {
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .videos-left p {
        font-size: 20px;
        font-family: var(--ff-default);
    }

    .video-item {
        position: relative;
        cursor: pointer;
    }

    .playbtn {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        right: 0;
        margin: 0 auto;
        text-align: center;
        display: none;
    }

    .playbtn img {
        top: 50%;
        transform: translateY(68%);
        width: 70px;
    }

/* Popular Collections
-------------------------------------------------------------------*/

.popular-collections h2 {
    margin-top: 30px;
    font-family: var(--ff-accent);
    line-height: 30px;
    font-weight: normal;
    display: inline-block;
    padding: 0 20px;
    font-size: 2rem;
    color: var(--grey-med);
    border-left: 1px solid var(--brand-secondary);
    border-right: 1px solid var(--brand-secondary);
    margin-bottom: 40px;
    text-transform: uppercase;
    text-align: center;
}

.popular-collections h2 span {
    display: block;
    font-family: var(--ff-accent);
    font-weight: bold;
    font-size: 4rem;
}

/* Tradeshow
-------------------------------------------------------------------*/
/*home page tradeshow*/
.tradeshow .video-wrapper {
  position: relative;
}

.tradeshow .video-wrapper .video-link {
  display: block;
  position: relative;
}

.tradeshow .video-wrapper .video-link::after {
  background: url('images/play_button.png') center no-repeat;
  background-size: 21.7%;
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: block;
  pointer-events: none;
}

/* Upcoming Tradeshows (Right Column Only) */

.upcoming-trade {
  width: 100%;
}
.section-title > h2{
    margin-top:0 !important;
}
.upcoming-trade .section-title {
  text-align: center;
  margin-bottom: 1.5rem;
}

.upcoming-trade .tradeshows-header a {
  display: inline-block;
  font-family: var(--ff-accent);
  font-size: 24px;
  color: var(--grey-med);
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid #eebc4c;
  padding-bottom: 10px;
}

.tradeshows-list {
  max-height: 330px;
  overflow-y: scroll;
  padding-right: 8px;
}

.tradeshows-list::-webkit-scrollbar {
  width: 9px;
  background: #fafafa;
}

.tradeshows-list::-webkit-scrollbar-thumb {
  background: #c6c6c6;
  border-radius: 20px;
}

/* Tradeshow Items */
.hp-eventsevents-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.hp-eventsevents-list li.item {
  display: table;
  width: 100%;
  clear: both;
  margin-bottom: 10px;
}

.hp-eventsevents-list .img-wrapper {
  display: table-cell;
  vertical-align: top;
  width: 30%;
  padding-right: 10px;
}

.hp-eventsevents-list .img-wrapper img {
  max-width: 100px;
  width: 100%;
  height: auto;
}

.hp-eventsevents-list .content {
  display: table-cell;
  vertical-align: top;
  width: 70%;
}

.hp-eventsevents-list .event-start-date h3,
.hp-eventsevents-list .event-start-date span {
  font-family: var(--ff-default);
  font-size: 13px;
  color: var(--grey-med);
  line-height: 20px;
  margin: 0 0 6px;
  font-weight: normal;
}

.hp-eventsevents-list .event-calendar-img {
  display: inline-block;
  width: 14px;
  height: 20px;
  background: url('images/timestamp.png') no-repeat left center;
  margin-right: 5px;
  vertical-align: middle;
}

.hp-eventsevents-list .hp-events-title h3 {
  margin: 0;
  font-family: var(--ff-default);
  font-size: 14px;
  line-height: 18px;
  height: 36px;
  overflow: hidden;
  text-transform: uppercase;
}

.hp-eventsevents-list .hp-events-title h3 a {
  color: var(--grey-med);
  text-decoration: none;
  font-weight: normal;
}

/* Hover Styling */
.hp-eventsevents-list li.item:hover .event-start-date h3 {
  background: #eebc4c;
}

.hp-eventsevents-list li.item:hover .event-start-date h3 span,
.hp-eventsevents-list li.item:hover .event-start-date h3 .event-calendar-img {
  color: var(--white);
  background: #eebc4c url('images/timestamp-white.png') no-repeat left center;
}

.hp-eventsevents-list li.item:hover .hp-events-title h3 a {
  color: var(--black) !important;
}
 
/* Tradeshow Page Styles
-------------------------------------------------------------------*/

/* Info Section */
.ts-info {
    padding: 20px;
}

.ts-info p {
    padding-left: 30px;
    font-size: 1.4rem;
}

/* Container */
.tradeshows-container {
    width: 100%;
}

/* Tradeshow Details */
.tradeshow-details {
    padding: 0 7px;
}

.tradeshow-details:nth-child(4n+1) {
    clear: both;
}

/* Date Block */
.tradeshow-details p.ts-date {
    background: var(--grey-med);
    color: #fff;
    font-size: 1.8rem;
    font-weight: bold;
    font-family: var(--ff-default);
    padding: 6px 20px;
    margin: 0;
}

/* Logo */
.tradeshow-logo {
    width: 100%;
    height: 180px;
    margin-bottom: 4px;
}

/* Calendar Icon */
.cal-icon {
    vertical-align: text-bottom;
    margin-right: 10px;
}

/* Paragraph Blocks */
p.ts-name,
p.ts-address,
p.ts-booths,
p.ts-link {
    margin-bottom: 4px;
}

p.ts-name {
    font-size: 16px;
    background: url('/wp-content/themes/alfresco/images/locate.png') no-repeat 5px 5px;
}

p.ts-link {
    background: url('/wp-content/themes/alfresco/images/location-events.png') no-repeat 0 0;
}

p.ts-link a,
p.ts-link a:visited {
    text-decoration: underline;
    color: inherit;
}

/* Orange Variants */
.orangebg {
    background: var(--dark-yellow) !important;
}

.orangetack {
    background: url('images/locate-hover.png') no-repeat 5px 5px !important;
}

.orangeglobe {
    background: url('images/location-events-hover.png') no-repeat 0 0 !important;
}

.orangelink {
    color: var(--dark-yellow) !important;
}

/* Best Sellers
-------------------------------------------------------------------*/

.bestsellers-title {
    font-family: var(--ff-accent);
    font-size: 4rem;
    color: var(--grey-med);
    text-transform: uppercase;
    padding-bottom: 30px;
    display: block;
    text-align: center;
    margin: 0;
    margin-top: 60px;
    margin-bottom: 60px;
    font-weight: bold;
}

.bestsellers {
    width: 100%;
    margin: 0 auto;
    display: table;
}
.bestsellers-title::after {
  content: "";
  position: absolute;
  width: 190px;
  height: 1px;
  background-color: var(--brand-secondary);
  left: 50%;
  transform: translateX(-50%);
  bottom: -10px;
}

.bestseller-text {
  color: var(--grey-med);
  font-size: 1.4rem;
  line-height: 1.4;
  font-family: var(--ff-default);
}

/* Bottom Blocks
-------------------------------------------------------------------*/
.bottom-blocks {
  margin: 40px auto 20px;
}

.bottom-block-inner {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  text-align: center;
  z-index: 2;
}

.dealer-heading {
  color: var(--white);
  font-size: 3.2rem;
  font-family: var(--ff-accent);
  margin-bottom: 2rem;
  text-transform: uppercase;
  font-weight: bold;
}

.dealer-btn {
    display: inline-block;
    font-family: var(--ff-default);
    color: var(--white) !important;
    padding:0 20px;
    margin: 0 auto;
    border: 1px solid var(--white);
    text-align: center;
    line-height: 50px;
    font-size: 14px;
    text-transform: uppercase;
    text-decoration: none;
}

.dealer-btn:hover {
   color: var(--white) !important;
}

/* About Us 
-------------------------------------------------------------------*/
.our-story-header {
  text-align: center;
}

.our-story-header h1 {
  margin-top: 30px;
  font-family: var(--ff-accent);
  line-height: 30px;
  font-weight: normal;
  display: inline-block;
  padding: 0 50px;
  font-size: 2rem;
  color: var(--grey-med);
  border-left: 1px solid #eebc4c;
  border-right: 1px solid #eebc4c;
  margin-bottom: 40px;
  text-transform: uppercase;
  text-align: center;
}

.our-story-header h1 span {
  display: block;
  font-family: var(--ff-accent);
  font-weight: bold;
  font-size: 4rem;
}

.our-story-text {
  font-family: var(--ff-accent);
  color: #707070;
  line-height: 1.25em;
  font-size: 2.2rem;
  width: 90%;
  max-width: 1000px;
  margin: 0 auto;
}

.story-blocks {
  width: 100%;
  margin: 0 auto;
  display: table;
}

.story-block {
  width: 30%;
  float: left;
}

.story-block-center {
  margin: 0 5%;
}

.story-block h2 {
  font-family: var(--ff-default);
  font-style: italic;
  font-weight: 700;
  font-size: 1.8rem;
  color: #707070;
  margin-bottom: 5px;
}

.story-text {
  transition: all 0s linear;
  position: relative;
  font-family: var(--ff-default);
  font-size: 1.6rem;
  color: #595959;
  margin-bottom: 0;
  line-height: 1.25;
  height: 140px;
  overflow: hidden;
  border-bottom: 1px solid #e3e3e3;
}

.story-text p {
  margin-bottom: 10px;
}

.story-text-grad {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.8);
  height: 23px;
}

.story-text-read-more {
  color: #a06800;
  cursor: pointer;
  text-align: center;
  display: block;
  text-decoration: underline;
  text-transform: uppercase;
  font-family: var(--ff-default);
  font-size: 14px;
  padding-top: 20px;
  margin-top: 9px;
  background: transparent;
  border:0;
}

.fullheight {
  height: auto !important;
  padding-bottom: 10px;
}

.mission-block {
  background: url('/wp-content/themes/alfresco/images/tradeshows-wrapper.png') no-repeat;
  background-size: cover;
  background-position: center;
}

.mission-image {
  width: 100%;
  padding: 3rem;
  box-shadow: none !important;
}

.mission-title {
  color: var(--grey-med);
  font-family: var(--ff-accent);
  font-size: 2.5rem;
  font-weight: bold;
  margin-bottom: 30px;
}

.mission-text p {
  color: #333;
  font-family: var(--ff-default);
  font-size: 1.6rem;
  line-height: 1.25;
  margin-bottom: 10px;
}


/* Customer Service 
-------------------------------------------------------------------*/
.header-image {
  width: 100%;
  display: block;
  box-shadow: none !important;
}

.header-contact-info {
  padding: 20px 0;
  text-align: center;
  color: #707070;
}

.header-contact-info h1 {
  margin: 0 auto 30px;
  padding-bottom: 20px;
  font-size: 4rem;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  font-family: var(--ff-accent);
  color: var(--grey-med);
  border-bottom: 1px solid #ddb308;
  display: inline-block;
}
 .faq-block h3 {
    color: #fff;
    font-family: var(--ff-accent);
    background: var(--dark-yellow);
    padding: 10px;
    width: 100%;
    font-weight: bold;
    text-align: center;
    font-size: 30px;
    margin-top: 0;
}

.faq-section {
    border-bottom: 1px solid #aaa;
    margin-bottom: 20px;
    padding-bottom: 20px;
}

.faq-section h4 {
    cursor: pointer;
    font-family: var(--ff-accent);
    color: var(--grey-med);
    font-style: italic;
    font-weight: normal;
    font-size: 22px;
    margin: 0;
}

.faq-section-q-a {
    display: none;
    padding-top: 10px;
    margin-left: 1.8rem;
}

.faq-question {
    cursor: pointer;
    margin-bottom: 5px;
    font-weight: bold;
}

.faq-answer {
    display: none;
    margin: 10px 0 10px 2rem;
}

.q-a-triangle,
.q-a-sub {
    vertical-align: middle;
    margin-right: 10px;
    transition: all .2s linear;
}

.rotate90 {
    transform: rotate(90deg);
}

/* Form Overrides */
.cs-form {
    display: none;
    text-align: left;
    padding: 20px;
    background: #fafafa;
    border: 1px solid #c0c0c0;
    margin-top: 10px;
}

#wpforms-form-243 .wpforms-field {
    margin-bottom: 1.8rem;
}


/* Responsive fix for recaptcha in form 243 */
#wpforms-form-243 .wpforms-recaptcha-container {
    margin-top: 1.8rem;
    text-align: right;
}
 .ecat-access {
  padding: 0px;
  text-align: center;
  width: 100%;
  margin-bottom: 20px;
}

.ecat-access p {
  margin: 0px;
}

.cs-form {
  display: none;
  text-align: left;
  padding: 20px;
  background: #fafafa;
  border: 1px solid #c0c0c0;
  position: relative;
  top: -11px;
}

.contact-button-dealer,
.contact-button-dealer:visited,
.contact-button-dealer:focus,
.contact-button-dealer:hover,
.contact-button-dealer:active,
.contact-button-dealer[type="button"] {
  text-decoration: none;
  color: #fff !important;
  display: block;
  padding: 10px;
  background: #de1b23;
  border: 1px solid #de1b23;
  cursor: pointer;
  margin-bottom: 10px;
  font: inherit;
  text-align: left;
  border-radius: 0;
}

.contact-button-dealer:hover {
  color: #de1b23 !important;
  background: #fff;
  border: 1px solid #de1b23;
}

.contact-button-wholesale-request,
.contact-button-wholesale-request:visited,
.contact-button-wholesale-request:focus,
.contact-button-wholesale-request:hover,
.contact-button-wholesale-request:active,
.contact-button-wholesale-request[type="button"],
.contact-button-consumer,
.contact-button-consumer:visited,
.contact-button-consumer:focus,
.contact-button-consumer:hover,
.contact-button-consumer:active,
.contact-button-consumer[type="button"] {
  text-decoration: none;
  display: block;
  padding: 10px;
  cursor: pointer;
  font: inherit;
  text-align: left;
  border-radius: 0;
  margin-bottom: 10px;
  width: 100%;
}

.contact-button-wholesale-request {
  color: #fff !important;
  background: var(--dark-yellow); /* New background */
  border: 1px solid var(--dark-yellow);
}

.contact-button-wholesale-request:hover {
  color: var(--dark-yellow) !important;
  background: #fff;
  border: 1px solid var(--dark-yellow);
}

.contact-button-consumer {
  color: #222 !important;
  background: #fafafa;
  border: 1px solid #222;
}

.contact-button-consumer:hover {
  color: #fff !important;
  background: #222;
  border: 1px solid #222;
}


.tri-col-container h2 {
    font-family: var(--ff-default);
    color: var(--grey-dark);
    font-style: italic;
    font-size: 21px;
    font-weight: bold;
}
.tri-col-container p{
    font-size: 14px;
}

/* Modal
-------------------------------------------------------------------*/
p.lightbox-caption {
    background: rgba(17, 17, 17, 0.75);
    width:100%;
    font-size: 2rem;
    position:absolute;
    bottom: 0;
    text-align: center;
    z-index: 99;
}

p.lightbox-caption em {
    font-style: normal;
    font-weight: bold;
}

.modal-header {
    background: var(--brand-bright);
    color: var(--black);
    border-radius: 0;
    border-bottom: 0;
}

.modal-header h5 {
    font-size: 1.5rem;
    font-weight: bold;
}

.modal-content {
    border-radius: 0;
    padding-bottom: 1em;
}

.modal-body {
    font-size: 1.8rem;

}
    
/* Footer
-------------------------------------------------------------------*/
footer {
    color: var(--black);
    font-size: 1.6rem;
    line-height: 1.5;
}
.top-footer-container{
    margin:0 auto;
}

.footer p {
    padding: 0;
    margin: 0;
}

footer .company-info h3,
footer .company-info h2 {
    font-size: 2.8rem;
    margin: 0;
    padding: 0;
    font-family: var(--ff-accent);
}

footer .company-info p {
    font-size: 1.8rem;
}

    @media screen and (max-width: 991px) {
        footer .company-info p {
            font-size: 1.4rem;
        }
    }

footer a, footer a:link, footer a:active, footer a:visited {
    color: var(--black);
    text-decoration: none;
}

footer.copyright {
    font-size: 1.4rem;
    line-height: 1.5;
    font-family: var(--ff-default);
    color: var(--black);
}

footer.copyright a {
    text-decoration: underline;
    color: var(--black) !important;
}

.footer-links ul {
  padding-left: 0;
  margin: 0;
  list-style: none;
}

.footer-links li {
  display: inline-block;
  margin: 0 1.8rem 0 0; /* adjust spacing as needed */
}

.footer-links a {
  color: var(--black);
  text-decoration: none;
    font-size: 14px;
    line-height: 3em;
    display: inline-block;
    text-align: center;
    width: 170px;
    text-transform: uppercase;
}

.footer-links a:hover {
  text-decoration: underline;
}

/* Footer Layout Fixes */
.footer-links ul {
  padding: 0;
  margin: 0;
}

.footer-links ul li {
  display: inline-block;
  margin-right: 2rem;
}

.footer-links ul li:last-child {
  margin-right: 0;
}

.footer-socials a i {
  font-size: 20px;
  color: #333;
  transition: opacity 0.3s ease, color 0.3s ease;
}

.footer-socials a:hover i {
  opacity: 0.7;
  color: #000;
}

.footer-legal {
    color:var(--grey-dark);
    font-size: 13px;
    text-decoration: none;
    text-transform: uppercase;
}

#copyright{
    font-size:1.4rem;
}

@media (max-width: 767.98px) {
  .footer-links {
    display: none !important;
  }
}

/* Back to Top
-------------------------------------------------------------------*/
.scrolltop {
    display: none;
    width: 100%;
    margin: 0 auto;
    position: fixed;
    right: 1%;
    bottom: 0%;
    z-index: 1070;
}

@media screen and (max-width: 768px) {
    .scrolltop {
        right: 3%;
    }
}

@media screen and (max-width: 575px) {
    .scrolltop {
        display: none !important;
    }
}

.scroll {
    position: absolute;
    right: 1px;
    bottom: 0px;
    background: var(--black);
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    text-align: center;
    margin: 0 0 0 0;
    cursor: pointer;
    transition: 0.5s;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    width: 60px;
    height: 30px;
    color: var(--white);
    padding-top: 5px;
}

.scroll:hover {
    background: var(--brand-primary);
}

.scroll .fas {
    font-size: 20px;
    margin-top: 25px;
    margin-left: 1px;
    transition: 0.5s;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
}