/* 20251230223846 - v2 */
.gui,
.gui-block-linklist li a {
  color: #666666;
}

.gui-page-title,
.gui a.gui-bold,
.gui-block-subtitle,
.gui-table thead tr th,
.gui ul.gui-products li .gui-products-title a,
.gui-form label,
.gui-block-title.gui-dark strong,
.gui-block-title.gui-dark strong a,
.gui-content-subtitle {
  color: #000000;
}

.gui-block-inner strong {
  color: #848484;
}

.gui a {
  color: #0a8de9;
}

.gui-input.gui-focus,
.gui-text.gui-focus,
.gui-select.gui-focus {
  border-color: #0a8de9;
  box-shadow: 0 0 2px #0a8de9;
}

.gui-select.gui-focus .gui-handle {
  border-color: #0a8de9;
}

.gui-block,
.gui-block-title,
.gui-buttons.gui-border,
.gui-block-inner,
.gui-image {
  border-color: #e6e6e6;
}

.gui-block-title {
  color: #333333;
  background-color: #e6e6e6;
}

.gui-content-title {
  color: #333333;
}

.gui-form .gui-field .gui-description span {
  color: #666666;
}

.gui-block-inner {
  background-color: #dcdcdc;
}

.gui-block-option {
  border-color: #fbfbfb;
  background-color: #fdfdfd;
}

.gui-block-option-block {
  border-color: #fbfbfb;
}

.gui-block-title strong {
  color: #333333;
}

.gui-line,
.gui-cart-sum .gui-line {
  background-color: #f3f3f3;
}

.gui ul.gui-products li {
  border-color: #f7f7f7;
}

.gui-block-subcontent,
.gui-content-subtitle {
  border-color: #f7f7f7;
}

.gui-faq,
.gui-login,
.gui-password,
.gui-register,
.gui-review,
.gui-sitemap,
.gui-block-linklist li,
.gui-table {
  border-color: #f7f7f7;
}

.gui-block-content .gui-table {
  border-color: #fbfbfb;
}

.gui-table thead tr th {
  border-color: #f3f3f3;
  background-color: #fdfdfd;
}

.gui-table tbody tr td {
  border-color: #fbfbfb;
}

.gui a.gui-button-large,
.gui a.gui-button-small {
  border-color: #494949;
  color: #ffffff;
  background-color: #494949;
}

.gui a.gui-button-large.gui-button-action,
.gui a.gui-button-small.gui-button-action {
  border-color: #000000;
  color: #ffffff;
  background-color: #000000;
}

.gui a.gui-button-large:active,
.gui a.gui-button-small:active {
  background-color: #3a3a3a;
  border-color: #3a3a3a;
}

.gui a.gui-button-large.gui-button-action:active,
.gui a.gui-button-small.gui-button-action:active {
  background-color: #000000;
  border-color: #000000;
}

.gui-input,
.gui-text,
.gui-select,
.gui-number {
  border-color: #8d8d8d;
  background-color: #f5f5f5;
}

.gui-select .gui-handle,
.gui-number .gui-handle {
  border-color: #8d8d8d;
}

.gui-number .gui-handle a {
  background-color: #f5f5f5;
}

.gui-input input,
.gui-number input,
.gui-text textarea,
.gui-select .gui-value {
  color: #000000;
}

.gui-progressbar {
  background-color: #76c61b;
}

/* custom */
/* Custom Fonts */

/* ABC Diatype – Regular */
@font-face{
  font-family: "ABC Diatype";
  src: url("https://cdn.webshopapp.com/shops/214805/files/481637839/abcdiatype-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ABC Diatype – Medium (use as 500) */
@font-face{
  font-family: "ABC Diatype";
  src: url("https://cdn.webshopapp.com/shops/214805/files/481637840/abcdiatype-medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* End Custom Fonts */

/* Name: Kevin Delahunt | Date: May 3, 2017 Time: 12:34 PM | Reason: remove tax incl | Ticket:   #221050| Begin. */
#productcontent > div > div > div.col-md-4.mr15.ml15 > div.row.pt30.pb30 > div > span {
  display: none;
}

/* Name: Kevin Delahunt | Date: May 3, 2017 Time: 12:34 PM | End. */

/* Rina | Sept 18, 2018 | Hide Newsletter sign up and shop now button on homepage 
.col-lg-8.col-md-12.col-sm-12.col-xs-12 {
  display:none;
}
.col-lg-6.col-md-6.col-sm-12.col-xs-12.col-lg-offset-3.col-md-offset-3 {
  display:none;
}
.col-lg-6.col-md-6.col-sm-12.col-xs-12.col-lg-offset-5.col-md-offset-3 {
  display:none;
}
 End of Rina's CSS */
/* Disabled Rina's code above as per customer's request: Marc - removed newsletter adjusted the height of the image section */
#Newsletter > div{
height: 200px !important;
}
#Newsletter > div > div{
display: none !important;
}

/* Marc  End*/

/*Kalla Ag Oumar | March 20th, 2020 | Ticket #1186509 | Modified demo bar | BEGIN*/
.wsa-demobar a {
  display: none !important;
}
div a.close {
  display: none !important;
}
div.wsa-demobar {
  /*Modify background color */
  background: black !important;
  /*Modify text color*/
  color: white !important;
}
/* END */
/* Name: Clayton | Date: March 24, 2020  | Reason: Fix the Logo location on desktop (caused by Mary's space for demo bar CSS below ) | Begin. */
.navbar-brand {
  padding: 0px 0px!important;
}
/* Name: Clayton | Date: March 24, 2020  | End. */

/* Name: Mary | Date: march20th, 2020  | Reason: space for demo bar | Begin. */
	.navbar-header {
    	margin-top: 40px !important;
	}
/* Name: Mary | End. */


/* Name: Lezlea | Date: Jan 2023   */

/* Reason: update color of promo bar at top */
div.wsa-demobar {
background:#A09F9F !important;
}

/* Reason: putting cookie bar on top */
.wsa-cookielaw {
z-index:9999999 !important;
}

/* Reason: adding space between promo bar and navbar - adding onto Mary update */
.container>.navbar-header, .container-fluid>.navbar-header, .container>.navbar-collapse, .container-fluid>.navbar-collapse {
  margin-top: 40px !important;
}

/* Reason: adjusting logo position on main navbar */
.navbar-brand>img {
  margin-top:16px;
}
/* Reason: adjusting logo position on shrink navbar */
nav.shrink .navbar-brand img {
  margin-top:0px !important;
}


nav .navbar-brand img {
  max-height:60px;
-webkit-transition: all 0.0s;
-moz-transition: all 0.0s;
-ms-transition: all 0.0s;
-o-transition: all 0.0s;
transition: all 0.0s;
}

@media (max-width: 992px) {
  .navbar-brand img {
    margin-top:0px !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    .navbar-brand>img {
        margin-top: 22px;
    }
    nav .navbar-brand img {
        max-height: 45px;
    }
}


/* Name: Lezlea | END  */

/* ############################## */
/* Css to Fix Cookie Banner Starts */
/* ############################## */
div.wsa-cookielaw:not(body):not(html),
div.wsa-cookielaw {
  display: flex !important;
}

.wsa-cookielaw {
  display: flex !important;
  z-index: 999999999999999 !important;
  height: fit-content !important;
  max-height: fit-content !important;
  position: fixed !important;
  left: 0 !important;
  bottom: 0 !important;
  right: 0 !important;
  width: 100% !important;
  margin-top: auto !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 10px 30px !important;
  font-weight: 400;
  text-align: left;
  line-height: 1.5em;
}

.wsa-cookielaw-button,
.wsa-cookielaw-link {
  border: 0 !important;
  border-radius: 0 !important;
  line-height: 0 !important;
  width: 130px !important;
  padding: 17px 30px !important;
  background: #353535 !important;
  color: #fff !important;
  font-weight: 400 !important;
  margin-left: 1%;
  min-width: fit-content !important;
  text-align: center !important;
}
.wsa-cookielaw-button.wsa-cookielaw-button-green {
  margin-left: 50px;
}
.wsa-cookielaw-link {
  color: #353535 !important;
  border: 1px solid #353535 !important;
  background: transparent !important;
}

/* Generic Mobile and Tablet */
@media (max-width: 767px) {
  .wsa-cookielaw {
    bottom: 0 !important;
    top: 0 !important;
    margin: auto !important;
    flex-direction: column !important;
    padding: 30px 15px !important;
    width: 90% !important;
    box-shadow: 0px 0px 5px -2px #000000 !important;
    border-radius: 8px;
    font-size: 15px;
    text-align: center;
  }
  .wsa-cookielaw-button,
  .wsa-cookielaw-link {
    width: 100% !important;
    margin: 0 !important;
    margin-bottom: 5px !important;
    padding: 30px !important;
  }
  .wsa-cookielaw-button.wsa-cookielaw-button-green {
    margin-top: 40px !important;
  }
  .wsa-cookielaw-link {
    color: #353535 !important;
    border: unset !important;
    background: transparent !important;
  }
}

/*** Mobile Landscape ***/
@media (min-width: 481px) and (max-width: 767px) {
  .wsa-cookielaw {
    font-size: 20px !important;
  }
  .wsa-cookielaw-button,
  .wsa-cookielaw-link {
    padding: 30px 30px !important;
  }
}

/*** Mobile Portrait ***/
@media (max-width: 480px) {
  .wsa-cookielaw-button,
  .wsa-cookielaw-link {
    padding: 20px !important;
  }
}

/* ############################## */
/* Css to Fix Cookie Banner Ends */
/* ############################## */

/* 
/*****************************************************
  Newsletter Section
*****************************************************/
.newsletter-section {
  background-color: #ffffff;
  font-family: "Questrial", Helvetica, sans-serif;
  color: #2a2a29;
}

.newsletter-wrapper {
  margin: 2rem; /* white space around the entire section */
  display: flex;
  flex-wrap: wrap; 
  box-sizing: border-box;
}

/* For larger screens (above 768px), each column is 50%. */
.newsletter-image,
.newsletter-content {
  flex: 0 0 50%;
  max-width: 50%;
}

/* Below 991px, force each column to 100% width (stacking) */
@media (max-width: 991px) {
  .newsletter-image,
  .newsletter-content {
    flex: 0 0 100%;
    max-width: 100%;
  }
}


/*****************************************************
  Left Column: Background Image
  (No <img> in the HTML, pure CSS background)
*****************************************************/
.newsletter-image {
  flex: 0 0 50%;
  max-width: 50%;
  min-height: 500px; /* adjust as desired */
  background: url("../newsletter-subscribe-section-image.html")
    center center / cover no-repeat;
}

@media (max-width: 991px) {
.newsletter-image {
    min-height: 300px !important;
    flex: 0 0 100%;
    max-width: 100%;/* or a smaller min-height if you prefer */
  }
}

/*****************************************************
  Right Column: Beige Background with Content
*****************************************************/
.newsletter-content {
  flex: 0 0 50%;
  max-width: 50%;
  background-color: #e6e3db;
  padding: 2rem;
  box-sizing: border-box;
 display: flex;
  flex-direction: column;
  align-items: center;   /* horizontal centring of child elements */
  justify-content: center; /* vertical centring if there's extra space */
  text-align: center;   /* centre the text, if desired */
}

@media (max-width: 991px) {
  .newsletter-content {
    flex: 0 0 100%;
    max-width: 100%;
      }
}

.newsletter-form-inner {
  width: 100%;
  max-width: 400px; 
  margin: 0 auto;
}

@media (min-width: 820px) {
  .newsletter-form-inner {
    width: auto;      /* no fixed or max constraint, 
                         it can grow beyond 100% if parent is wide enough */
    min-width: 400px; /* or 400px, or any desktop-friendly size you prefer */
  }
}

/* Heading: bigger & bolder */
.newsletter-content h2 {
  font-family: 'Questrial', Helvetica, sans-serif;
  font-size: 30px;
  font-weight: 500;
  margin-bottom: 1.3rem;
  color: #2a2a29;
}

/* Body text */
.newsletter-content p {
  font-family: 'Questrial', Helvetica, sans-serif;
  /* Sets a minimum of 14px, “ideal” at 2vw, and a max of 16px. */
  font-size: clamp(12px, 1.5vw, 15px);
  font-weight: 300;
  letter-spacing: 1px;
  margin-bottom: 2.8rem;
  line-height: 1.4; /* Relative line-height scales more gracefully */
  color: #2a2a29;
  max-width: 420px !important;
}

/* T&C text: smaller */
.newsletter-terms {
  font-family: "Questrial", Helvetica, sans-serif;
  font-size: 12px !important;
  color: #2a2a29;
}

/*****************************************************
  Mailchimp Form Fields 
*****************************************************/
#mc_embed_signup input[type="email"] {
  width: 100%;
  box-sizing: border-box;
  padding: 0.7rem;
  margin-bottom: 0.7rem;
  background-color: transparent;
  border: #909090 solid 1px
}

/* The SIGN ME UP button */
#mc_embed_signup .clear .button,
#mc_embed_signup #mc-embedded-subscribe {
  background-color: #a69e8c; 
  color: #fff;
  padding: 0.75rem 1rem;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  letter-spacing: 1px;
  font-weight: 400;
  width: 100%;
  margin-bottom: 1rem;
}

#mc_embed_signup .clear .button:hover,
#mc_embed_signup #mc-embedded-subscribe:hover {
  background-color: #948b7c; /* Slightly darker hover */
}

#mc_embed_signup .response {
  font-size: 13px;
  margin-bottom: 0.8rem;
}

/* Digital Pine | Date: 18/08/25 | Styling Changes */

/* Disable Logo on Hover */
/* Apply link to parent container  on catalogue pages */
#Categories .element-image.aligncenter {
  position: relative;
}

#Categories .element-image.aligncenter a.crosslink {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
}

/* Hide the hover logo image */
.element-image.aligncenter a.crosslink img {
  display: none;
}

/*Add to Cart Button Styling*/
a.product-buy.incart {
    background-color: #000000;
    color: #fff;
    border-radius: .5rem;
    padding: 0 40px;
    font-family: "ABC Diatype", Arial, sans-serif !important;
    font-weight: 500;
    font-size: 15px;
}

/* Sale Badge Styling */
.product-badge {
    color: #ffffff;
    background-color: #9D392F;
    border: none;
    font-size: 15px;
}

/* Change Pricing Format */
.product-price::before {
    content: "£";
    margin-right: -5px;
}

/* Product Quantity Styling */
.quantity .plus, .quantity .minus {
    color: #ffffff;
    background-color: #000000;
}

.quantity .qty {
    background-color: #eeeeeead;
}

.quantity {
    float: left;
    border: 1px solid #0000000d;
    margin-right: 20px;
}

.product-socialshare a {
    color: #020202;
}
