/* Brand Colours */

:root {
  --tt-colour-red: #EC1652;
  --tt-colour-blue: #006EB6;
  --tt-colour-green: #29B17B;
  --tt-colour-rose: #E45C96;
  --tt-colour-orange: #FF7548;
  --tt-colour-yellow: #FFE15E;
  --tt-colour-pink: #FFC4DC;
  --tt-colour-lightblue: #00B4E4;
}


/* Home Page */
.home-image-link-text {
  text-align: center;
}

.home-image-link-title, .home-image-link-desc {
  color: var(--tt-colour-blue);
  font-family: kg_happy_solidregular;
}

/* Newsletter  */

.tiger-img {
  width: 100%;
  display: flex;
  align-items: flex-end;
  margin-right: 2em;
}

.tiger-img img {
  width: 100%;
}

.newsletter-column-wrapper {
  display: flex;
}

.newsletter-section {
  margin-bottom: -55px;
}

@media only screen and (max-width: 768px) {
  .newsletter-column-wrapper {
    flex-direction: column-reverse;
  }

  .newsletter-section {
    margin-bottom: -35px;
  }
}

.newsletter-btn {
  background-color: var(--tt-colour-blue) !important;
}

.newsletter-content, .newsletter-content p, .newsletter-content span, .newsletter-content a {
  color: white;
}

.newsletter-content input {
  background-color: white;
}

.newsletter-background {
  background-color: var(--tt-colour-green);
}

#mc_embed_signup {
  max-height: 0;
  overflow: hidden;
  transition: 0.2s all;
}

.open_newsletter_signup {
  max-height: 1000px !important;
  padding-bottom: 20px;
}

/* Newsletter End */

/* Footer */

.titlelinklist {
  width: 100%;
  display: grid;
  grid-auto-flow: column;
  text-align: left;
  grid-row-gap: 10px;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, auto);
}

.titlelinklist a {
  text-align: left;
}

.titlelink {
  font-weight: bold;
}

.footerPanel {
  display: block; 
  transition: all 0.2s ease;
}

.foot-page-width {
  padding-left: 55px;
  padding-right: 55px;
}

.foot-site-footer__content {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    -ms-align-items: flex-start;
    -o-align-items: flex-start;
    align-items: flex-start;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.titlelink {
  font-family: "kg_happy_solidregular";
}

.titlelink > strong {
  font-weight: 400;
}


@media only screen and (min-width: 768px) {
    .foot-site-footer__content {
      -webkit-flex-wrap:nowrap;
      -moz-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
    }

    .site-footer {
      padding: 45px 0 55px 0 !important;
    }
}

@media only screen and (max-width: 768px) {
  .titlelink {
    cursor: pointer;
    width: 100%;
    border: none;
    outline: none;
    transition: 0.4s;
    pointer-events: all;
    border-bottom: 1.5px solid white;
    padding: 15px 15px !important;
  }

  .titlelink::after {
    content: '\f067';
    float: right;
    font-family: "fontawesome";
    font-size: 15px;
  }
  
  .titlelink-active {
    background-color: white; 
    color: var(--tt-colour-blue);
  }

  .titlelink.titlelink-active::after {
    content: '\f068';
  }

  .site-footer__content {
    padding: 0;
  }

  .titlelinklist {
    cursor: pointer;
    display: block;
  } 

  .footerPanel {
    padding: 0 18px;
    max-height: 0;
    transition: all 0.2s ease;
    overflow: hidden; 
    color: #444547;
  }

  .sublink > a {
    color: #444547 !important;
  }

  .footerPanel-active {
    background-color: #f2fbfd;
    max-height: 400px;
  }

  .foot-page-width {
    padding-left: 0;
    padding-right: 0;
  }

  .foot-site-footer__content {
    -webkit-flex-wrap:nowrap;
    -moz-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
  }
}

/* Footer */

/* collection */

.custom-collection-text {
    padding: 1em;
    background: #fff;
    color: var(--tt-colour-blue);
}

.image_badge_wrapper {
    position: relative;
}

.badge-wrapper {
  position: absolute;
  width: 100%;
  z-index: 1;
  display: flex;
  height: 30%;
  justify-content: flex-end;
  padding: 5%;
}

.badge-wrapper svg {
  width: 30%;
}

.load_more_products {
  margin: 30px;
  display:flex;
  justify-content: center;
}

.load_more_spinner {
  display: none;
}

.grid-view-item__image_second {
  opacity: 0 !important;
  transition: all 0.2s;
}

li:hover .grid-view-item__image_second {
  opacity: 1 !important;
}


/* end collection */

/* product page */
 
.product-single__description ul {
    list-style: none !important;
}

.product-single__description li {

  position: relative;
  padding-left: 28px;
  letter-spacing: .04em;

}

.product-single__description li:before {
    content: '';
    position: absolute;
    top: 6px;
    left: 0;
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--tt-colour-red); 
}

.product-single__description li:nth-child(1):before {
  background: var(--tt-colour-red);
}                                        
                                         
.product-single__description li:nth-child(2):before {
  background: var(--tt-colour-blue);
}                                        
                                         
.product-single__description li:nth-child(3):before {
  background: var(--tt-colour-orange);
}                                        
                                         
.product-single__description li:nth-child(4):before {
  background: var(--tt-colour-green);
}                                        
                                         
.product-single__description li:nth-child(5):before {
  background: var(--tt-colour-rose);
}                                        
                                         
.product-single__description li:nth-child(6):before {
  background: var(--tt-colour-lightblue);
}                                        
                                         
.product-single__description li:nth-child(7):before {
  background: var(--tt-colour-yellow);
}                                        
                                         
.product-single__description li:nth-child(8):before {
  background: var(--tt-colour-pink);
}

.addtobagbtn {
    background-color: #fff !important;
    color: var(--tt-colour-blue) !important;
    border: 1px solid var(--tt-colour-blue) !important;
    transition: all 0.3s;
}

.addtobagbtn:hover {
    background-color: var(--tt-colour-lightblue) !important;
    color: #fff !important;
}

.shopify-payment-button__button--unbranded {
    background-color: var(--tt-colour-blue) !important;
    color: #fff !important;
}

.multibuy {
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 1em;
  display: grid;
  grid-template-columns: auto auto auto auto;
  grid-gap: 10px;
}

.multibuy > span {
  margin-right: 10px;
}

/* you may also like */

.product-card {
  text-align: center;
}

/* end product page */

/* how to order */

.blue-hr {
  margin: 55px 0;
  border: 0;
  border-bottom: 2px solid #006fbb;
  width: 80%;
  transform: translateX(10%);
}

.how-to-red {
  color: var(--tt-colour-blue);
  text-align: center;
  font-family: kg_happy_solidregular;
}

.collapsible {
  font-family: kg_happy_solidregular;
  background: none !important;
  padding: 5px 10px;
  margin: 10px;
  cursor: pointer;
  color: var(--tt-colour-blue);
  text-align: center;
  border: 1px solid var(--tt-colour-blue);
}

.collapsible-wrapper, .collapsible-wrapper2{
  display: flex;
  justify-content: center;
}

.active, .collapsible:hover {
}

.how-to-content-wrapper {
  padding: 0;
  overflow:hidden;
  max-height: 0;
  transition: max-height 0.2s ease-out;
}

.how-to-content {
  font-size: 12px;
  display: grid;
  grid-template-columns: 15% 60% 20%;
  grid-auto-rows: auto;
  color: var(--tt-colour-blue);
  font-family: kg_happy_solidregular;
  grid-gap: 20px 10px;
}

@media only screen and (max-width: 425px) {
  .how-to-bee {
   display:none; 
  }
  .how-to-content {
    grid-template-columns: 15% 85%;
  }

}

.how-to-num {
  font-size: xx-large;
  display: flex;
  justify-content: flex-end;
  padding-right: 10px;
}

.how-to-important {
  color: var(--tt-colour-red);
}

.how-to-bee {
  grid-row: 1 / 6;
  grid-column: 3;
}

.how-to-one {
  color: var(--tt-colour-green);
}
.how-to-two {
  color: var(--tt-colour-orange);
}
.how-to-three {
  color: var(--tt-colour-yellow);
}
.how-to-four {
  color: var(--tt-colour-green);
}
.how-to-five {
  color: var(--tt-colour-lightblue);
}

.how-to-content-one,
.how-to-content-two, 
.how-to-content-three,
.how-to-content-four,
.how-to-content-five {
  padding-right: 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.seasons-content-wrapper {
  padding: 0;
  overflow:hidden;
  max-height: 0;
  transition: max-height 0.2s ease-out;
}

.seasons-content {
  font-size: 12px;
  display: grid;
  grid-template-columns: 20% 80%;
  grid-auto-rows: auto;
  color: var(--tt-colour-blue);
  font-family: kg_happy_solidregular;
  grid-gap: 20px;
  margin: 20px;
}

.seasons-content li {
  list-style: inside;
}

.seasons-image-container {
  display:flex;
  justify-content: flex-end;
  align-items: baseline;
}

.seasons-image-container img {
    object-fit: contain;
}