@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
            @import url("https://fonts.googleapis.com/css2?family=Oswald:wght@100;200;300;400;500;600;700;800;900&display=swap");
          
            :root {

                --heading: #eae8e0;  
                --body: #000;  
                --primary: #eae8e0;          
                --primary-dark: #cccac2;
                --primary-light: #fffffe;
                --accent: #f8af41;
                --accent-dark: #da9123;
                --accent-light: #ffcd5f;
                --success: #44ad23;
                --success-dark: #268f05;
                --success-light: #62cb41;
                --secondary: #a40d14;
                --secondary-dark: #860000;
                --secondary-light: #c22b32;
                --info: #0f2de3;
                --info-dark: #000fc5;
                --info-light: #2d4bff;
                --caution: #F8AE40;
                --caution-dark: #da9022;
                --caution-light: #ffcc5e;
                --error: #f30b0b;
                --error-dark: #d50000;
                --error-light: #ff2929;
                --black: #000000;
                --white: #fff;
                --dark-1: #1e1e1e;
                --dark-2: #3c3c3c;
                --dark-3: #5a5a5a;
                --gray-1: #787878;
                --gray-2: #969696;
                --gray-3: #b4b4b4;
                --gray-4: #d2d2d2;
                --light-1: #dcdcdc;
                --light-2: #e6e6e6;
                --light-3:  #f0f0f0;               

                --body-font-family:    Inter;
                --heading-font-family:    Oswald;

                --bs-blue: #eae8e0;          
                --bs-indigo: #0f2de3;
                --bs-purple: #0f2de3;
                --bs-pink: #0f2de3;
                --bs-red: #f30b0b;
                --bs-orange: #F8AE40;
                --bs-yellow: #F8AE40;
                --bs-green: #44ad23;
                --bs-teal: #eae8e0;          
                --bs-cyan: #eae8e0;          
                --bs-white: #fff;
                --bs-gray: #1e1e1e;
                --bs-gray-dark: #1e1e1e;
                --bs-primary: #eae8e0;          
                --bs-secondary: #a40d14;
                --bs-success: #44ad23;
                --bs-info: #eae8e0;          
                --bs-warning: #F8AE40;
                --bs-danger: #f30b0b;
                --bs-light: #a40d14;
                --bs-dark: #1e1e1e;
                --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto,
                "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif,
                "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
                --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas,
                "Liberation Mono", "Courier New", monospace;
                --bs-gradient: linear-gradient(
                180deg,
                rgba(255, 255, 255, 0.15),
                rgba(255, 255, 255, 0)
                );


            }

            body {
                font-family: var(--body-font-family);
                font-size: 18px;
                color:  #000;
            }

            a {
                color: #513c24;
            }

            a:hover {
                color: #331e06;
            }            

              .footer-copyright {
                background-color: white !important;
              }

              .footer-copyright * {
                color: var(--heading) !important;
              }

            img {
              max-width: 100%;
            }

            a {
              display: inline-block;
            }

            a,
            button,
            a:hover,
            a:focus,
            input:focus,
            textarea:focus,
            button:focus {
              text-decoration: none;
              outline: none;
            }

            ul,
            ol {
              margin: 0px;
              padding: 0px;
              list-style-type: none;
            }

            h1,
            h2,
            h3,
            h4,
            h5,
            h6 {
              font-weight: 600;
              color: var(--heading);
              font-family: var(--heading-font-family);
            }

            h1,
            .h1 {
              font-size: 32px;
              line-height: 1.25;
            }

            h2,
            .h2 {
              font-size: 26px;
              line-height: 1.25;
            }

            h3,
            .h3 {
              font-size: 22px;
              line-height: 1.25;
            }

            h4,
            .h4 {
              font-size: 20px;
              line-height: 1.25;
            }

            h5,
            .h5 {
              font-size: 19px;
              line-height: 1.25;
            }

            h6,
            .h6 {
              font-size: 19px;
              line-height: 1.25;
            }

            .display-1 {
              font-size: 5.5em;
              line-height: 1.25;
            }

            .display-2 {
              font-size: 4.75em;
              line-height: 1.25;
            }

            .display-3 {
              font-size: 4em;
              line-height: 1.25;
            }

            .display-4 {
              font-size: 3.25em;
              line-height: 1.25;
            }

            p {
              line-height: 1.5;
              color: var(--body);
            }

            .text-small {
              font-size: 0.875em;
              line-height: 1.5;
            }

            .text-lg {
              font-size: 1.15em;
              line-height: 1.5;
            }

            .bg_cover {
              background-repeat: no-repeat;
              background-size: cover;
              background-position: center;
            }

            @media (max-width: 767px) {
              .container {
                padding-left: 20px;
                padding-right: 20px;
              }
            }

            .btn {
              font-weight: bold;
              font-size: 16px;
              line-height: 20px;
              text-align: center;
              letter-spacing: 0.08em;
              text-transform: uppercase;
              padding: 12px 24px;
              border-radius: 4px;
              border: 1px solid transparent;
            }
            .btn:hover {
              background-color: #860000;
              border-color: #860000;
            }

            .btn-primary:hover {
              background-color: #860000;
              border-color: #860000;
            }

            .btn:focus {
              box-shadow: none;
              outline: none;
            }
            .btn.btn-lg {
              font-size: 1.15em;
              padding: 16px 24px;
            }
            .btn.btn-sm {
              padding: 8px 16px;
            }
            .btn.square {
              border-radius: 0px;
            }
            .btn.semi-rounded {
              border-radius: 12px;
            }
            .btn.rounded-full {
              border-radius: 50px;
            }
            .btn.icon-left span,
            .btn.icon-left i {
              margin-right: 8px;
            }
            .btn.icon-right span,
            .btn.icon-right i {
              margin-left: 8px;
            }
            .btn.icon-btn {
              width: 48px;
              height: 48px;
              padding: 0;
              line-height: 48px;
            }
            .btn.icon-btn.btn-lg {
              width: 56px;
              height: 56px;
              line-height: 56px;
            }
            .btn.icon-btn.btn-sm {
              width: 40px;
              height: 40px;
              line-height: 40px;
            }  

            .btn:active {
                background-color: var(--primary) !important;
                border-color: var(--primary) !important;
            }

            .btn-primary:active {
                background-color: var(--primary) !important;
                border-color: var(--primary) !important;
            }            

            .btn:focus {
                background-color: var(--primary) !important;
                border-color: var(--primary) !important;
            }

            .btn-primary:focus {
                background-color: var(--primary) !important;
                border-color: var(--primary) !important;
            }                          

            nav.navbar img, .footer-logo img, .footer-area .logo img {
              // height: 60px !important;
              // width:  auto !important;

            max-width: 200px;
            max-height: 60px;

            }    

            .footer-area.footer-four .footer-logo img, .footer-area.footer-nine .footer-logo img {
                height: auto !important;
                width: auto !important;
            }  

            div.days, div.hours, div.minutes, div.seconds {
              text-align: center;
              color:  black;
            }

            p.day-count, p.hour-count, p.minute-count, p.second-count {
              font-size: 32px;
              margin:  0;
              font-weight: bold;
            }

            p.day-text, p.hour-text, p.minute-text, p.second-text {
              font-size: 16px;
              font-weight: bold;
            }

            div.days, div.hours, div.minutes, div.seconds {

            }

            #countdown {

            padding: 0 10%;
                
            }   

            .navbar .navbar-toggler .toggler-icon {
                width: 20px !important;
            }          

            .file_download img {
                border: 1px solid var(--primary);
            }       

            button, button:active, button:focus, button:hover, .btn, .btn:hover, .btn:focus, .btn:active {
                border: none;
            }

            .rte ul {
                margin: 20px;
            }

            .rte ul li {
                list-style: disc;
            }         

            blockquote {
                border-left: 3px solid #ccc;
                padding: 20px;
                margin-bottom: 20px;
                background: #f2f2f2;
            }   

            blockquote p:last-of-type {
                margin-bottom: 0;
            }

            form #website{ display:none; }

                        

                        

            #site-message h4 {
margin: 0;
font-size: 14px;
font-weight: bold;
font-family: var(--body-font-family);
color: black;
}

.bg-mandatory {
background-color: #015294 !important;
}

.text-mandatory {
color: #015294 !important;
}

.bg-warning {
background-color: #f8c223 !important;
}

.text-warning {
color: #f8c223 !important;
}

.bg-emergency {
background-color: #00814f !important;
}

.text-emergency {
color: #00814f !important;
}

.bg-customised {
background: linear-gradient(
        90deg,
        rgba(255, 0, 0, 1) 0%,
        rgba(255, 154, 0, 1) 10%,
        rgba(208, 222, 33, 1) 20%,
        rgba(79, 220, 74, 1) 30%,
        rgba(63, 218, 216, 1) 40%,
        rgba(47, 201, 226, 1) 50%,
        rgba(28, 127, 238, 1) 60%,
        rgba(95, 21, 242, 1) 70%,
        rgba(186, 12, 248, 1) 80%,
        rgba(251, 7, 217, 1) 90%,
        rgba(255, 0, 0, 1) 100%
    );
}

.ss-link.bg-customised p.ss-text {
font-family: var(--heading-font-family);
text-transform: uppercase;
}

h1, h2, h3, h4, h5, h6,.h1,.h2,.h3,.h4,.h5,.h6 {
font-weight: bold;
font-weight: 600;
text-transform: uppercase;
}

body#home h1,body#home .h1 {
font-size: 64px;
}

h1,.h1 {
font-size: 40px;
}

h2,.h2 {
font-size: 32px;
}

h3,.h3 {
font-size: 24px;
}

h4,.h4 {
font-size: 20px;
font-family: var(--body-font-family) !important;
text-transform: none !important;
}

h5,.h5 {
font-size: 18px;
font-family: var(--body-font-family) !important;
text-transform: none !important;
}

h6,.h6 {
font-size: 16px;
font-family: var(--body-font-family) !important;
text-transform: none !important;
}

.ss-link p.ss-text {
font-weight: bold;
font-family: var(--body-font-family);
font-size: 24px;
}

#accordian .ss-link p.ss-text {
font-size: 18px;
}

h1, h2, h3, h4, h5, h6, .display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
font-family: var(--heading-font-family);
color: var(--body);
}

.product-features th, .product-features td {
border: none !important;
padding: 0px 4px !important;
display: block !important;
line-height: 1.2;
}

.product-features th {
font-weight: normal;
font-size: 12px;
font-style: italic;
padding: 0;
}

.product-features td {
font-weight: bold;
padding-top: 0;
}

.add-to-basket {
background: var(--primary);
color: white;
border: 0;
text-center;
display: block;
padding: 5px 8px;
}

table tr td, table tr th, table tr td button, table tr td input {
padding: 4px 8px !important;
}

.selected {
border: 1px solid red;
}

.text-danger {
color: red !important;
}

.navbar-area.navbar-five {
padding: 20px 0;
border-top: 1px solid rgba(255,255,255,0.1);
}

.btn {
text-transform: uppercase !important;
font-family: var(--heading-font-family) !important;
font-weight: bold !important;
font-style: italic !important;
}

.list-group-item-action:focus, .list-group-item-action:hover {
background: #f2f2f2;
}

body#home .navbar-area {
display: none;
}

.hero-container h1 {
font-size: 88px !important;
}

.hero-container h2 {
font-size: 76px !important;
font-weight: 300;
}

.catalogue-request {
margin-top: -60px;
position: relative;
z-index: 999999;
}

.catalogue {
margin-top: -140px;
}

.hero-container #search-form {
min-width: 200px !important;
max-width: 400px !important;
}

.message-text {
font-family: var(--heading-font-family);
font-size: 32px;
text-transform: uppercase;
}

@media only screen and (max-width: 1400px) {
.catalogue {
margin-top: -100px;
}

}

@media only screen and (max-width: 1200px) {

.catalogue {
margin-top: -40px;
}

.hero-container h1 {
font-size: 72px !important;
}

.hero-container h2 {
font-size: 62px !important;
}

.message-text {
font-size: 24px;
}

}

@media only screen and (max-width: 992px) {

.hero-container h1 {
font-size: 88px !important;
}

.hero-container h2 {
font-size: 76px !important;
}

.message {
text-align: left !important;
}

}

@media only screen and (max-width: 768px) {

.catalogue {
margin-top: 0px;
}

.hero-container h1 {
font-size: 64px !important;
}

.hero-container h2 {
font-size: 55px !important;
}

}

@media only screen and (max-width: 576px) {

.hero-container h1 {
font-size: 48px !important;
}

.hero-container h2 {
font-size: 41px !important;
}

.hero-parrot {
display: none;
}

}

.overlay-black {
linear-gradient(to left, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.85));
position: absolute;
height: 100%;
width: 100%;
background: rgba(0,0,0,0);
}

.overlay-white {
linear-gradient(to left, rgba(255,255,255,0.1), rgba(255,255,255,0.5));
position: absolute;
z-index: -1;
height: 100%;
width: 100%;
background: rgba(255,255,255);
}

.navbar-area.navbar-five .navbar .navbar-nav .nav-item .sub-menu li {
width: 100% !important;
}

.navbar-area.navbar-five .navbar .navbar-nav .nav-item .sub-menu,
.navbar-area.navbar-five .navbar .navbar-nav .nav-item .sub-menu li a::after {
border-radius: 0 !important;
}

.first-article {
background: #f2f2f2;
}

#product #search-form {
margin-bottom: 0 !important;
}

.navbar-area.navbar-five .navbar .navbar-nav .nav-item a.active::before {
display: none;
}

.blog-author-one {
border-radius: 0 !important;
background: #f2f2f2;
padding: 20px !important;
}

.blog-style-eight .blog-image img {
border-radius: 0;
}

.product-image-heading, .product-image-name {
font-family: var(--heading-font-family);
font-size: 16px;
font-weight: bold;
text-transform: uppercase;
}

#fixedParrotImage {
width: 120px;
position: fixed;
bottom: 20px;
right: 20px;
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
z-index: 999999;
}

.messages {
position: relative;
/*    width: 400px;*/
margin-top: 20px; /* Adds spacing between messages and other content */
}

.message {
position: relative;
opacity: 0;
transform: translateY(50px); /* Start slightly below */
transition: opacity 0.5s ease, transform 0.5s ease; /* Smooth transition */
}

.message.visible {
opacity: 1;
transform: translateY(0); /* Move into place */
}

.single-blog ul, .single-blog ol {
margin: 20px 0;
}

.custom-bullets, .single-blog ul, .single-blog ol {
    list-style: none;
    padding-left: 20px; /* Adjust based on image width */
}

.custom-bullets li, .single-blog li {
    position: relative;
    padding-left: 24px; /* Adjust to give space for the bullet */
}

.custom-bullets li::before, .single-blog li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 12px;
    width: 12px; /* Adjust based on your image */
    height: 12px; /* Adjust based on your image */
    background-image: url('/images/wold-top-bullet.png'); /* Update with actual image path */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: translateY(-50%);
}

#p-hp-form {
display: none !important;
}

img.diagonal {
transform: rotate(45deg);
padding: 10px 0;
}

.wold-top-blockquote {
border: 0;
border-top: 8px solid black;
background: white;
}

.wold-top-blockquote span {
font-family: var(--heading-font-family);
font-size: 32px;
text-transform: uppercase;
font-weight: bold;
}

blockquote {
background: var(--primary);
border-color: var(--primary-dark);
}

.navbar-area.navbar-five .navbar .navbar-nav .nav-item a::before {
display: none !important;
}

.footer-area.footer-twelve {
background: var(--primary-dark);
}

.footer-area.footer-twelve * {
color: black !important;
}

.footer-area.footer-twelve h3 {
font-size: 32px;
text-transform: uppercase;
padding: 0;
border: 0;
}

.footer-twelve .socials a {
font-size: 32px;
}

.footer-twelve .socials a:hover {
background: none !important;
}

.footer-twelve .f-link a:hover {
letter-spacing: 0;
}

.footer-twelve .f-link a:hover::before {
display: none;
}

.footer-area.footer-twelve .options *, div.options * {
color: #908e8a !important;
}

.blog-content h1 {
line-height: 1;
margin-bottom: 40px;
}

.article-date {
margin-bottom: 20px !important;
}

.separator {
white-space: nowrap;
}

.separator::before {
content: " · ";
}

.bg-light {
background-color: #f5f3e9 !important;
}

.btn, btn-primary, .btn:active, .btn:focus, .btn:hover {
background: var(--primary-dark) !important;
color: black;
font-style: normal !important;
font-family: var(--body-font-family) !important;
letter-spacing: 0;
text-transform: none !important;
}

.product-description ul {
margin: 20px;
list-style: disc;
}

body {
background: var(--primary);
}

.navbar-five.photo-nav {
display: block !important;
background: transparent !important;
}

#photo-nav .navbar-area.navbar-five .navbar .navbar-nav .nav-item a {
color: white !important;
}

ul.product-thumbs, ul.product-thumbs li {
margin: 0 !important;
padding: 0 !important;
}

#basket-chars, #basket-total {
display: none !important;
}

.support-content h2, .support-content h3, .support-content h4, .support-content p, .support-content li, .support-content th, .support-content td {
color: #908e8a !important;
color: #6f6d6a !important;
}

img.sticky-top {
z-index: 1 !important;
}

.hero-text-container p {
font-family: var(--body-font-family) !important;
}

.footer-bottom {
margin-top: 10px;
font-size: 14px !important;
}

.basket-summary p {
font-size: 14px !important;
}

.video-container {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
}

.video-container video {
width: 100%;
height: auto;
display: block;
}

.overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to right, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8));
}

.overlay-left {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.7));
}

.overlay-right {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to right, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.7));
}

.text-container {
z-index: 10;
position: absolute;
width: 40%;
right: 60px;
bottom: 60px;
}

@media (max-width: 991.98px) {
  .video-container {
    height: clamp(420px, 62vh, 620px);
    overflow: hidden;
  }

  .video-container video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .text-container {
    width: 100%;
    left: 0;
    right: 0;
    bottom: 30px;
    padding: 0 1rem;
  }

  .text-container > div {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .text-container .hero-logo {
    display: none;
  }
}

@media (max-width: 767.98px) {
  .video-container {
/*    height: clamp(360px, 58vh, 520px);*/
/*    height: clamp(420px, 68vh, 640px);*/
    height: clamp(480px, 78vh, 640px);
  }

  .text-container p {
    font-size: 18px !important;
/*    text-align: justify !important;*/
  }

  .options a {
    display: block;
    margin: 0.35rem 0;
  }

  .options .separator::before {
    content: none !important;
  }
}

.navbar-area.navbar-five .navbar .navbar-toggler .toggler-icon {
background-color: var(--body);
}

.navbar-area.navbar-five .navbar .navbar-nav .nav-item a,
.navbar-area.navbar-five .navbar .navbar-nav .nav-item .sub-menu li a:hover {
color: var(--body) !important;
}

.ecommerce-page h1,
.ecommerce-page h2 {
font-size: var(--body-font-size);
font-family: var(--body-font-family);
text-transform: none;
}

.ecommerce-page.checkout h1,
.ecommerce-page.checkout-payment h1,
.ecommerce-page.checkout-basket h1 {
display: none;
}

/* BEGIN: nav colour patch (easy rollback - remove this block) */
#photo-nav .navbar-area.navbar-five .navbar .navbar-collapse > .navbar-nav > .nav-item > a,
#photo-nav .navbar-area.navbar-five .navbar .navbar-collapse > .navbar-nav > .nav-item > a span,
#photo-nav .navbar-area.navbar-five .navbar .navbar-collapse > .navbar-nav > .nav-item > a i {
color: white !important;
}

.navbar-area.navbar-five.home-hero-nav .navbar .navbar-nav .nav-item .sub-menu li a,
.navbar-area.navbar-five.home-hero-nav .navbar .navbar-nav .nav-item .sub-menu li a span,
.navbar-area.navbar-five.home-hero-nav .navbar .navbar-nav .nav-item .sub-menu li a i,
.navbar-area.navbar-five.photo-nav .navbar .navbar-nav .nav-item .sub-menu li a,
.navbar-area.navbar-five.photo-nav .navbar .navbar-nav .nav-item .sub-menu li a span,
.navbar-area.navbar-five.photo-nav .navbar .navbar-nav .nav-item .sub-menu li a i {
color: var(--body) !important;
}
/* END: nav colour patch */

/* BEGIN: mobile nav colour patch (easy rollback - remove this block) */
@media (max-width: 991.98px) {
  /* All menu + submenu items use body colour on mobile (all pages) */
  .navbar-area.navbar-five .navbar .navbar-nav .nav-item > a,
  .navbar-area.navbar-five .navbar .navbar-nav .nav-item > a span,
  .navbar-area.navbar-five .navbar .navbar-nav .nav-item > a i,
  .navbar-area.navbar-five .navbar .navbar-nav .nav-item .sub-menu li a,
  .navbar-area.navbar-five .navbar .navbar-nav .nav-item .sub-menu li a span,
  .navbar-area.navbar-five .navbar .navbar-nav .nav-item .sub-menu li a i {
    color: var(--body) !important;
  }

  /* Force override for homepage hero nav mobile rule */
  body.home-has-overlay-summary .navbar-area.navbar-five.home-hero-nav .navbar .navbar-collapse > .navbar-nav > .nav-item > a,
  body.home-has-overlay-summary .navbar-area.navbar-five.home-hero-nav .navbar .navbar-collapse > .navbar-nav > .nav-item > a span,
  body.home-has-overlay-summary .navbar-area.navbar-five.home-hero-nav .navbar .navbar-collapse > .navbar-nav > .nav-item > a i,
  body.home-has-overlay-summary .navbar-area.navbar-five.home-hero-nav .navbar .navbar-nav .nav-item .sub-menu li a,
  body.home-has-overlay-summary .navbar-area.navbar-five.home-hero-nav .navbar .navbar-nav .nav-item .sub-menu li a span,
  body.home-has-overlay-summary .navbar-area.navbar-five.home-hero-nav .navbar .navbar-nav .nav-item .sub-menu li a i {
    color: var(--body) !important;
  }

  /* Force override for events photo-nav mobile rule */
  #photo-nav .navbar-area.navbar-five.photo-nav .navbar .navbar-collapse > .navbar-nav > .nav-item > a,
  #photo-nav .navbar-area.navbar-five.photo-nav .navbar .navbar-collapse > .navbar-nav > .nav-item > a span,
  #photo-nav .navbar-area.navbar-five.photo-nav .navbar .navbar-collapse > .navbar-nav > .nav-item > a i,
  #photo-nav .navbar-area.navbar-five.photo-nav .navbar .navbar-nav .nav-item .sub-menu li a,
  #photo-nav .navbar-area.navbar-five.photo-nav .navbar .navbar-nav .nav-item .sub-menu li a span,
  #photo-nav .navbar-area.navbar-five.photo-nav .navbar .navbar-nav .nav-item .sub-menu li a i {
    color: var(--body) !important;
  }
}
/* END: mobile nav colour patch */

#photo-nav .navbar-area.navbar-five.photo-nav .navbar .navbar-toggler .toggler-icon {
  background-color: #fff !important;
}

#home-page .sustainability-title {
  font-size: clamp(1.9rem, 11vw, 4.5rem) !important;
  line-height: 0.95;
}