/*============================================================================
Keap Custom CSS
Copyright 2016 Keap Co.
Author Stephen Tracy

==============================================================================*/
/*============================================================================
Table of Contents
#General Variables added
#Custom fonts
#Header detailing
#Mobile menu detailing
#SubMenus
#Hero Images & Sandwhiches
#Candle Facts
#Butter Bars
#Product Page detailing
#Fragrance details
#Gift details
#STH details
#Plan details
#Our story
#Our approach
#Our cause
#The lab
.faqs
#Blog
#Footer detailing
#Sign up form custom
#Bootstrap Tooltip & Popovers
#Timber
#FB Messenger & Reviews
#Refer a friend & map
#Art

==============================================================================*/

/*============================================================================
# General Variables added
==============================================================================*/

/*.left {
float:left;
}

.right {
float:right;
}

Nethaly says hello!
*/

h1, .h1 {
  font-size: 1.1em !important;
}

h2, .h2 {
  font-size: 1.1em !important;
  font-weight: 700;
}

h3, .h3 {
  font-size: 1.1em !important;
  font-weight: 700;
}

h4, .h4 {
  font-size: 0.9em !important;
    font-weight: normal;
}

h5, .h5 {
  font-size: 0.9em !important;
  font-weight: normal;
}

h6, .h6 {
  font-size: 0.9em !important;
}

p {  font-size: 0.9em !important;
}


.vertical {
  margin: auto;
  position: absolute;
  top: 80%;
  left: 0;
  bottom: 0;
  right: 0;
}

.link-active {
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 0.25s ease; /* Safari and Chrome */
  -moz-transition: all 0.25s ease; /* Firefox */
  -ms-transition: all 0.25s ease; /* IE 9 */
  -o-transition: all 0.25s ease; /* Opera */
  transition: all 0.25s ease;
  font-weight: bold;

}

.link-active img {
  -webkit-transform:scale(1.1); /* Safari and Chrome */
  -moz-transform:scale(1.1); /* Firefox */
  -ms-transform:scale(1.1); /* IE 9 */
  -o-transform:scale(1.1); /* Opera */
  transform:scale(1.1);
}

/* remove blue highlight*/
#clickme, select, input {
  outline: none;
}

/* padding rule*/
.padded {
  padding: 90px 5% 25px 5% !important;
}

.halfpadded {
  padding: 45px 5% 25px 5% !important;
}

.quarterpadded {
  padding: 23px 5% 25px 5% !important;
}

.nopadded {
  padding: 0px 5% 25px 5% !important;
}

/* Text hyperlinks START */
h5 a, .underline {
  text-decoration: underline;
  cursor: pointer;
}
.white {
  color: white;
}

.white:hover {
  color: white;
}

.white a {
  color: white;
}

.white a:hover {
  color: white;
}


/*a.menu-text-link,
#customer_login_link,
#customer_logout_link {
  padding-left: 12.5px;
  padding-right: 5px;
  text-transform: uppercase;
  letter-spacing: 0.75px;
}*/

#customer_logout_link {
      display: inline;
    position: fixed;
    top: 10px;
    right: 35px;
    font-size: 0.8em;
}

a.menu-text-link:hover,
#customer_logout_link:hover,
#customer_login_link:hover {
 /* color: #b0aeae;
  padding-bottom: 2px;
  border-bottom: 1px solid #b0aeae;*/
}
/* Text hyperlinks END */

.icons {
  display: inline-block;
  width: 25px;
  height: 25px;
}

/*get rid of outlines on buttoons*/
button:focus, .btn:focus , .input-full:focus {
  outline:none;
}

.btn, .btn--secondary {
  border-radius: 0px;
}

.btn--secondary {
  border: 1px solid #ebebeb;
}
/*============================================================================
# Custom fonts
==============================================================================*/


/* go on with normal style definitions */
body, input, textarea, select option, h1,h2,h3,h4,h5,h6 { 

}

h1 {
  font-size: 2.5em ;
  text-transform: uppercase;
}

.title {
  text-transform: uppercase;
}

.link {
  cursor: pointer;
  text-decoration: underline;
}

/*============================================================================
# Header detailing
==============================================================================*/
iframe[name='google_conversion_frame'] { 
  height: 0 !important;
  width: 0 !important; 
  line-height: 0 !important; 
  font-size: 0 !important;
  margin-top: -13px;
  float: left;
}

.free_shipping {
  position: fixed;
  top: 7.5px;
  left: 27.5px;
/*  right: 35px;*/
  font-size: 0.8em;
}

.site-nav, .site-nav--mobile {
  font-weight: 500;
}



.header-fixed {
  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
  background: #fff;
  z-index: 9;
  width: 100vw;
  position: fixed;
  color: black; 
  top: 0;
  height:65px;
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  -webkit-backface-visibility: hidden;
}

.header-fixed  .site-nav__link {
  color: black;
}

/*#keap-candles-made-better .header-fixed {
background: transparent;
 color: white; 
     -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  -webkit-backface-visibility: hidden;
}

#keap-candles-made-better .header-fixed .site-nav__link, 
#keap-candles-made-better .header-fixed  #customer_login_link {
color: white;
    -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  -webkit-backface-visibility: hidden;

}



#keap-candles-made-better .header-opaque {
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
color: black;
background: white;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  -webkit-backface-visibility: hidden;
}

.header-opaque  .site-nav__link,
.header-opaque   #customer_login_link {
color: black;
    -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  -webkit-backface-visibility: hidden;
}


#keap-candles-made-better .header-opaque  .site-nav__link,
#keap-candles-made-better .header-opaque   #customer_login_link {
color: black;
}

#keap-candles-made-better .header-opaque  .site-nav__link:hover,
#keap-candles-made-better .header-opaque   #customer_login_link:hover {
 color: #b0aeae;
}

#keap-candles-made-better .wrapper.main-content {
margin-top: 0px;
}
*/



.nav-bar {
  background: transparent;
}

/*Keeps content away from header*/
.wrapper.main-content {
  margin-top: 65px;
}



#AccessibleNav {
  padding-top: 22.5px;
  padding-left: 25px;
}

.site-nav__link {
  text-transform: uppercase;
  font-size: 1vw;
  letter-spacing: 0.75px;
  /*color: #000;*/
}

/* div containing logo, on left side of header */
.grid--full>.grid__item.header-left-div,
.grid__item.one-third.header-left-div {
  padding-left:0px;
}

/* div containing cart etc., on right side of header */
.grid--full>.grid__item.header-right-div,
.grid__item.one-third.text-right.header-right-div {
  padding-right:15px;
  padding-top: 17.5px;
}

/* actual img of logo that features in the header */
.header_logo {
  height:30px;
}

.site-header__logo img {
  left: 0;
  right: 0;
}

/* fixes vertical padding of logo on small/medium screens */
@media screen and (max-width: 768px) {
  a.site-header__logo-link {
    padding-top: 12.5px;
    padding-bottom: 7.5px;


  }


  .site-nav__link  {
        padding: 15px 7.5px 7.5px 15px;
    font-size: 18px;
    margin-top: 10px;
    text-transform: none;
  }

  .free_shipping {
    display: none;
  }

  .wrapper.main-content {
    margin-top: 65px;
  }

  .site-header__logo img {
    margin-left: auto !important;

  }

  .site-header__logo {
    padding-top: 6px;
  }

  .grid--full>.grid__item.header-right-div,
  .grid__item.one-third.text-right.header-right-div {
    padding-right:5px;
    padding-top: 0px;
  }


}

.site-nav__link .icon .icon-arrow-down  {
  padding-left:none !important;
}

/* helps compact menu on desktop when window isn't full screen 
NOTE: min-width hard-coded here. Should match $large in timber.scss.liquid */
@media screen and (max-width: 1100px) {
  .header-fully-extended {
    display:none;
  }
}

/* Add grey hover over link effect to cart icon and site links (without underline effect) */
.site-header__cart-toggle:hover,
.site-nav__link:hover {
  color: #b0aeae;
}

/*Increase Hamburger and cart button size on mobile */
span.icon.icon-hamburger,
div.site-nav--mobile span.icon.icon-cart,
div.drawer--left span.icon.icon-x,
div.drawer--right span.icon.icon-x  {
  font-size: 30px;
  color: #000;
  line-height:1;
}

span.icon.icon-hamburger,
div.site-nav--mobile span.icon.icon-cart {
  width: 35px;
  height: 35px;
  font-size: 0em;
  -webkit-filter: invert(0%);
  line-height:1;
}

site-nav__link {
  padding-top: 7.5px  !important;
}

.site-header__cart-toggle {
  width: 55px;
}

.site-header__cart-toggle span.icon.icon-cart {
  width: 45px;
  height: 45px;
  font-size: 0em;
  position: absolute;
  right: 34px;
  top: 27px;
  -webkit-filter: invert(0%);
} 

#CartCountWrapper {
  padding-right: 7.5px;
  background: #333333;
  color: white;
  /* border: 1px solid; */
  border-radius: 25px;
  position: absolute;
  right: 36px;
  top: 29.5px;
  height: 15px;
  width: 15px;
  padding-left: 1.5px;
  font-size: 0.8em;
}

#CartCount {
  padding-left: 3px;
}


@media screen and (max-width: 768px) {
  #keap-candles-made-better .wrapper.main-content {
    /*margin-top: 85px;*/
    margin-top: 65px;
  }




  span.icon.icon-hamburger,
  div.site-nav--mobile span.icon.icon-cart {
    width: 45px;
    height: 45px;
    font-size: 0em;
    -webkit-filter: invert(0%);
    line-height:1;
  }



  #CartCountWrapper {
       top: 20px;
    right: 13px;
    font-size: 8pt;

  }

  .icon-hamburger {
    padding-top: 5px;
  }
}

/*============================================================================
# Mobile menu detailing
==============================================================================*/
/*
ul.mobile-nav {
border-bottom: 1px solid #e9e9e9;
}*/

.drawer.drawer--left, .drawer.drawer--right  {
  max-width: 100%;
}

@media screen and (max-width:768px) {
  .drawer.drawer--right{
    width: 100% !important; 
  }
}

.mobile-nav__link {
  font-weight: normal;
}

.mobile-nav__has-sublist.mobile-nav--expanded .mobile-nav__link,
.mobile-nav__has-sublist.mobile-nav--expanded span.icon.icon-plus,
.mobile-nav__has-sublist.mobile-nav--expanded span.icon.icon-minus {
  font-weight: bold;  
}

ul.mobile-nav,
ul.mobile-nav span.icon.icon-plus,
ul.mobile-nav span.icon.icon-minus {
  font-size: 18px;
}

ul.mobile-nav span.icon.icon-plus,
ul.mobile-nav span.icon.icon-minus {
  color: #7d7d7d;
}

#customer_register_link {
  color: #7d7d7d;
}

.mobile-nav__item #customer_login_link, 
.mobile-nav__item #customer_logout_link,
.mobile-nav__item #customer_register_link {
  padding-bottom: 7.5px;
  /*border-bottom: 1px solid #e9e9e9;*/
}

li.mobile-nav__item,
.drawer__title {
  padding-left: 15px;
}

/*============================================================================
# SubMenus
==============================================================================*/

.menu ul {
  margin: 0px;
}

.menu ul li {
  position: relative;
  display: inline-block;
  /*color: white;*/
  min-width: 150px; 
  padding: 10px 15px 10px 15px;

}


.menu  a {
  cursor: pointer;

}


.submenu {
  top: 60px;
  width: 100%;
  max-height: 250px;
  background: #000000;
  opacity: 0.85;
  justify-content: center;
  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
  z-index: -1;
  display: none;
  position: fixed;
  left: 0;
}


.productmenu {
  width: 100%;
  justify-content: center;
  left: 0;
  z-index:11;
  margin-bottom: 7.5%;
  margin-top: 2.5%;
}


.iconmenu{
  width: 100%;
  /*max-height: 250px;*/
  justify-content: center;
  z-index: -1;
  left: 0;
  padding-bottom:25px;
}

.menu ul li img, #ProductThumbs img {
  -webkit-transition: all 0.25s ease; /* Safari and Chrome */
  -moz-transition: all 0.25s ease; /* Firefox */
  -ms-transition: all 0.25s ease; /* IE 9 */
  -o-transition: all 0.25s ease; /* Opera */
  transition: all 0.25s ease;
  -webkit-transform:scale(1.0); /* Safari and Chrome */
  -moz-transform:scale(1.0); /* Firefox */
  -ms-transform:scale(1.0); /* IE 9 */
  -o-transform:scale(1.0); /* Opera */
  transform:scale(1.0);
}


.menu ul li img:hover, #ProductThumbs img:hover {

  -webkit-transform:scale(1.1); /* Safari and Chrome */
  -moz-transform:scale(1.1); /* Firefox */
  -ms-transform:scale(1.1); /* IE 9 */
  -o-transform:scale(1.1); /* Opera */
  transform:scale(1.1);
}

.menu_icon_white {
  /*margin-top: 25px;*/
  -webkit-filter: invert(100%); /* Safari and Chrome */
  filter: invert(100%); /* Firefox */
  opacity: 1;
}

.menu_icon {
  max-width: 50px;
  max-height: 50px;
}

#lifestylecontainer {
  height: 300px ;
}

#lifestyle {
  height: 300px ;

}


#lifestyle img {
  height: 300px ;
  object-fit: cover;
  top: 0px;
  left: 0;
  width: 100%;
  height: 100%;
  bottom: 0;
/*  -webkit-filter: brightness(0.7);
filter: brightness(0.7);*/
}


/*============================================================================
# Ham Sandwhiches & Hero Images
==============================================================================*/

@-webkit-keyframes pulseeffect_bluestart {
  0% {background-color: #008CA8;}
  33% {background-color: #99CDDB;}     
  66% {background-color: #00AB5B;}
  100% {background-color: #EDE944;}
}

.tupperware {
  text-align: center; 
}

.sandwhichname{
  position: absolute;
  top: 40px;
  font-weight: bold;
  z-index: 2;
  left:0;
}

.bigbread {
  min-height:400px !important;
}


.smallbread {
  min-height:100px !important;
}

.filling {

  /* font-weight: bold;*/
}

.sandwich__hero {
  position: relative;
  height: 85vh;
  min-height: 375px;
  text-align: center;
}

#homepagehead h1.hero__title {
  margin: 0;
}



#video-hero {
  /*padding: 2% 2% 2% 2%;*/
}

#video-hero .hero__title {
  font-size: 2.25em !important;

}

.hero__subtitle {
  font-size: 1.3em !important;
}
.hero__header h4 {
  font-size: 1.1em !important;
}


.hero__image {
  position: absolute;
  top: 0px;
  left: 0;
  bottom: 0;
  width: 100%;
  /*-webkit-filter: brightness(0.9);
  filter: brightness(0.9);*/
}

.hero__header {
  height: 30%;
  padding: 0 0.5em;
  position: relative;
  max-width: 900px;
  color: #ffffff;
  top: 14vh;
  margin: auto;
}

#keap-candles-made-better #video-hero .hero__header {
  height: 70%;
  max-width: 90%;
  letter-spacing: 1px;
   color: #fff;
   position:absolute; 
   left: 45%; 
/*  left: 55%;*/
   right: 0; 
   top: 0; 
   bottom:0; 
   margin:auto;

}



.hero__button {
  position: absolute;
  left: 50%;
  bottom: 2.5em;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 1;
  min-width: 125px;
}



.hero__button:before, .hero__button:after {
  display: block;
}


.hero__button::hover::before {
  -webkit-transform: translate(-50%, 60%);
  -ms-transform: translate(-50%, 60%);
  transform: translate(-50%, 60%)
}

.hero__button:hover::after {
  -webkit-transform: translate(-50%, 80%) rotate(45deg);
  -ms-transform: translate(-50%, 80%) rotate(45deg);
  transform: translate(-50%, 80%) rotate(45deg)
}

.btn-circle {
  position: absolute;
  left: 49%;
  border-radius: 25px;
  bottom: -0.525em;
}

.homepage_btn {
  /*background: rgba(255, 255, 255, 0.2);
  border: rgba(255, 255, 255, 0.5) 1px solid;*/
  
}

.homepage_btn:hover {
  color: black;
}

@media screen and (max-width:768px) {
  .sandwich__hero {
    height: 400px;
  }

  #homepagehead .hero__title {
    font-size: 12vw !important;
  }

  #homepagehead  .link {
    font-size: 3.25vw !important;
  }

    #video-hero .hero__title {
    font-size: 6vw !important;
        margin-bottom: 25px;
  }

  #video-hero  .hero__subtitle {
    font-size: 3.5vw !important;
  }

  #keap-candles-made-better #video-hero .hero__header {
  height: 80%;
      left: 0%;
/*    right: 35%;
  text-align: left !important;*/
  left: 35%; 


}
 

.homepage_btn {
    /* background: rgba(255, 255, 255, 0.2);*/
  border: white 1px solid;
  padding: 12.5px;
  min-width: 125px;
}

}

/*============================================================================
# Candle & Keap Facts
==============================================================================*/
#candlefacts {
  position: relative;
  justify-content: center;
  background-color: #F6F6F6;
}

#keapfacts {
  position: relative;
  justify-content: center;
  background-color: #F6F6F6;
}

#candleicons {
  justify-content: center;
  background-color: #F6F6F6;
}


#candlefacts img {
  max-height: 325px;
}

#cf0 {
  display: block;
  height: 125px;
}

#cf1 {
  display: none;
  height: 325px;
}

#cf2{
  display: none;
  height: 325px;
}

#cf3{
  display: none;
  height: 325px;
}

#keapfacts img {
  max-height: 100px;
}

#kf0 {
  display: block;
  height: 100px;
}

#kf1 {
  display: none;
  height: 100px;
}

#kf2{
  display: none;
  height: 100px;
}

#kf3{
  display: none;
  height: 100px;
}
/*============================================================================
# Features
==============================================================================*/
#features {
  position: relative;

}


#feature1 {
  position: relative;
  max-height: 600px;
  /*padding-top: 100px;*/
}

#feature1.better {
  position: relative;
  max-height: 400px;
  /*padding-top: 100px;*/
}

.feature2 {
  position: relative;
  padding: 50px 25px 25px 25px !important;
  /*padding-top: 100px;*/
}

#threefeatures {
  margin-bottom: 2.5%;
}

#threefeatures .btn--secondary {
  border: 1px solid #c1c1c1;
}


.bigbread#feature1 {
/* padding-left: 2.5%;
padding-right: 0.75%;
padding-bottom: 1%;*/
}

.bigbread.feature2  {
  /*padding-right: 0.75%;*/
/* padding-right: 2.5%;
padding-left: 0.75%;*/
}


.feature2:hover #num1,
.feature2:hover #num2,
.feature2:hover #num3 {

         -webkit-filter: brightness(0.85);
         filter: brightness(0.85);

       
}

#feature1 img {
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;

  width: 100%;
  -webkit-filter: brightness(0.9);
  filter: brightness(0.9);
}

.feature2  img {
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;

  width: 100%;
/*  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
  -webkit-filter: brightness(0.75);
  filter: brightness(0.75);*/
}

/*.feature2:hover  img {

  -webkit-filter: brightness(0.85);
  filter: brightness(0.85);
}*/


#feature1 img {
  height:600px;
}

#feature1.better img {
  height:400px;
}

.feature2 img {
  height:250px;
}

.feature_content {
/*  font-size: 1.25em;*/
  position: absolute;


}



#feature1 .feature_content {
  top: 135px;
  width: 22.5%;
  text-align: right;
      left: 7.5%;
}

#feature1 .feature_content#fc2 {
  top: 100px;
     
      left: 75%;
}


.feature2 .feature_content {

  top: 75px;
  width: 75%;
}

@media screen and (max-width:768px) {
  .feature_content {
    width: 95%;
    }
    #feature1 .feature_content {
  width: 75%;
}

#feature1 .feature_content#fc2 {
     
      left: 15%;
}


  }


   

    .feature2 .feature_text {
      text-align: center;
      padding-top: 7.5%;
      padding-bottom: 7.5%;
    }

      .feature2 .btn--secondary {
      width: 65%;
    }


    #feature1 {
      color: white;
    }


    #quotes {
      position: relative;
      z-index: 1;
/*-webkit-box-shadow: 0px 0px 8px 2px  rgba(0,0,0,0.2);
-moz-box-shadow:0px 0px 8px 2px  rgba(0,0,0,0.2);
box-shadow: 0px 0px 8px 2px rgba(0,0,0,0.2);*/
}

.bigbread#quote1, .bigbread#quote2 {
  position: relative;
}


#quote1 img, #quote2 img {
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;
  width: 100%;
}



/*============================================================================
# Butter Bars
==============================================================================*/

.butters {
  z-index: 2;
  position: relative;
/*
-webkit-box-shadow: 0px 0px 8px 2px  rgba(0,0,0,0.2);
-moz-box-shadow:0px 0px 8px 2px  rgba(0,0,0,0.2);
box-shadow: 0px 0px 8px 2px rgba(0,0,0,0.2);*/
}


#shipping #name {
  padding: 20px 0px 10px 0px;
}

#thecollection {
  padding-bottom: 25px;
}

#buycandles {

}

#buycandles #name {
  padding: 20px 0px 10px 0px;
}
#buycollection #name {
  padding: 20px 0px 10px 0px;

}

#buycollection  {
  z-index: 5;
}

#blogquote #name {
  padding: 20px 0px 10px 0px;
}

#blogquote  {
}

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

  #thecollection {
    padding-top: 35px;
    padding-bottom: 25px;
  }
}
/*============================================================================
# Customer Login & Account pages
==============================================================================*/

/* Adds vertical padding to grid section to create airiness + allow content to be long enough so that
footer does not have shit sticking out underneath it */
.customer-login-page-padding {
  padding-top: 60px;
  padding-bottom: 60px; 
}

/* Adds side padding so that form does that touch edge of screen on mobile devices */
.customer-login-form-padding {
  padding-left: 30px;
  padding-right: 30px; 
}

/* Need to replace with appropriate grey colors */
.customer_login_link {
  padding-left: 15px;

  text-transform: uppercase;
  letter-spacing: 0.75px;
}

/* Need to replace with appropriate grey colors */


button.customer_login_links {
  line-height:1;
}

/* Need to replace with appropriate grey colors */
.customer-login-form-padding input:focus {
  outline:none;
  border: 2px solid #616161;
}

.customer-login-page-padding .form-success {
  margin-left: 30px;
  margin-right: 30px;
  margin-bottom: 30px;
}

div#customer_account_title {
  align:center;
  padding-top:30px;
}

.user_account_circular_image_links{
  display:block;
}

.circular-account_page {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  /* box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2);*/
}

.circular-account_page:hover {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
}

#orderaccount{
  padding-bottom: 2.5%;
}

#myorders, #myaddresses {
  display: none;
  padding-bottom: 5%;
}

#ordertable th, #ordertable td {
  border-left: 0px;
  border-right: 0px;
  text-align: center;
}

#ordertable a {
  color: white;
}

#orderdetails {
  padding-top: 5%;
  padding-bottom: 5%;
}

#orderdetails th, #orderdetails td {
  border-left: 0px;
  border-right: 0px;

}

#orderdetails .btn a {
  color: white;
  padding-left: 5%;
  padding-right: 5%;
}

#address {
  padding-bottom: 5%
}

#myaccount {
  margin-top: 25px;
  margin-bottom: 25px;
}

#customr {
  text-align: center;
}

#customr h1 {
  color: white;
}

#customr a {
  display: inline-block;
  padding: 15px;
  width: auto;
  margin-bottom: 5px;
  line-height: 1.42;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  cursor: pointer;
  border: 1px solid transparent;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border-radius: 25px;
  background-color: #000;
  color: #fff;
}

/*============================================================================
# Product Page detailing
==============================================================================*/
.breadcrumb {
  position: absolute;
  top: 65px;
  z-index: 5;
  padding: 1%;
      padding-left: 2%;

}


#productarea {
  /*padding-top: 90px;*/
}


.circular {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  /*box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2);*/
}

.circular_big {
  /*40% bigger */
  width: 71px;
  height: 71px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  /*box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2);*/
}

.circular_xbig {
  /*40% bigger */
  width: 90px;
  height: 90px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  /*box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2);*/
}

.circular_small {
  /*40% bigger */
  width: 40px;
  height: 40px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  /*box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2);*/
}

.circular_xsmall {
  /*40% bigger */
  width: 25px;
  height: 25px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  /*box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2);*/
}

.circular:hover {
  /*box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2);*/
}

#ProductPrice {
  margin-bottom: 0px;
}

#ProductPhoto {
  height: 80vh;
  min-height: 520px;
}

#candle-gift-card #ProductPhoto img {
  /*-webkit-filter: brightness(0.8);
  filter: brightness(0.8);*/
}

#ProductPhotoMobile {
  /*height: 200px;*/
  min-height: 250px;
}

#ProductThumbs {
  margin: auto;
  position: absolute;
  top: 80%;
  left: 20%;
  bottom: 0;
  right: 50%;
}

#ProductPhotoImg {
  position: absolute;
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
}

#two-candles #ProductPhotoMobile {
    object-fit: cover;
    top: 0px;
    left: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
}

#ProductArea {
  position: absolute;
  right: 0;
  padding-top: 50px !important;
  /*color:white;*/

}

#scent-to-home #ProductArea, 
#scent-to-home-gift-set #ProductArea, 
#two-candles #ProductArea {

  color: black;

}


#keap-candle-subscription-keap #ProductArea {
  /*color: white;*/
  padding-left: 3% !important;
  padding-right: 7.5% !important;

}

#keap-candle-subscription-keap  select {
      border: 1px solid #333;
}

#keap-candle-subscription-keap  option,
#keap-candle-subscription-keap .frequency {
  /*color: white;*/
}

#keap-candle-subscription-keap #ProductArea .single-option-selector {
  color: black;
}

#keap-candle-subscription-keap  #AddToCartForm  label {
  padding-right: 10px;
}

#keap-candle-subscription-keap .single-option-selector {
  display: inline-block;
  padding-left: 5px;
}

#candle-gift-card #ProductArea {

}

#ProductPrice {
  display:inline-block;
  padding-right:5%;
}

.product-description {
 /* font-size: 0.9em;*/
}

#the-keap-candle-collection-superior-scents-sustainably-made-in-brooklyn #ProductArea {
/*  padding-left: 8% !important;
  padding-right: 2% !important;*/

}

#ProductArea h1 {
/*  font-size: 2.6em !important;
  text-transform: uppercase;*/
}

#ProductArea #comparison {
  color: white;
  text-decoration: underline;
  cursor: pointer;
}

#ProductArea select {
   border: 1px solid #333;
}

#ProductArea .single-option-selector {
  /*color: white;*/
  /*margin: auto;*/
  margin-bottom: 1%;
}

#candle-gift-card .single-option-selector {
color: black;
/*    background-color: #fff;
    color: #000;
display: inline-block;
    padding: 10px;
    width: auto;
    margin: 0;
    line-height: 1.42;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    border: 1px solid #f3f3f3;
*/
}

#ProductArea  input, #ProductArea  span {
  /*color: white;*/

}

#scent-to-home #ProductArea  input, 
#scent-to-home #ProductArea  span,
#scent-to-home-gift-set #ProductArea  input, 
#scent-to-home-gift-set #ProductArea  span,
#two-candles #ProductArea  input, 
#two-candles #ProductArea  span,
#two-candles #ProductArea  a,
 #two-candles #ProductArea .single-option-selector {
  color: black;

}


#two-candles select {

  border: 1px #a8a8a8 solid;

}

#ProductArea button.btn--secondary span {
  color: black;
}



#scent-to-home #ProductArea button.btn span,
#scent-to-home-gift-set #ProductArea button.btn span,
#two-candles #ProductArea button.btn span {

  color: white;
}

#candledeets {
  margin-top: 2.5%;
  padding-bottom: 2.5%;
}

#madebetter {
  padding-right: 5%;
  padding-bottom: 25px;
  /*border-right: #dfdfdf dotted 1px;*/
  /*padding-left: 10% !important;*/
}

/*#fragborder {
  border-left:#dfdfdf dotted 1px
}*/

#bettercandles {
  padding: 3.33% 0% 0% 3.33% !important;
}

.betterelements {
  padding-left: 5%;
}

#bottombuy #productSelect {
  display:none;

}

#shippin {

  font-size: 0.9em;
  line-height: 140%;
}

#quantity {
  position: relative;
}

.quantity-selector{
  margin-bottom: 10px;
}

#quantity .js-qty {
/*position: absolute;
  margin: auto;
  top: 0px;
  left: 0px;
  right: 0px;*/
}

#shipping {
  font-size: 0.85em;
}

#ProductArea h3 a {
  color: white;
}

@media screen and (max-width:768px) {
  #productarea {
    padding-top: 0px !important;
  }

  #ProductArea {
    position: relative;
    padding: 45px 5% 25px 10% !important;
    color: black !important;
  }

#keap-candle-subscription-keap #ProductArea {
  /*color: white;*/
  padding-left: 5% !important;
  padding-right: 5% !important;

}

  #ProductArea .h2,#ProductArea  .h1, #ProductArea  .h4, 
  #ProductArea h3 a, #ProductArea .icon, 
  #ProductArea  h5 a,
  #ProductArea input {
    color: black !important;
  }

  #ProductArea #AddToCart {
    color: white !important;
  }

  #shippin {

  }

  /*#keap-candle-subscription-keap  option,
#keap-candle-subscription-keap .frequency {
  color: black;
}*/



  #ProductArea button.btn--secondary {
    background: black;
  }


  #ProductArea button.btn--secondary span {
    color: white;
  }


  #ProductArea #comparison {
    color: black;
  }

  #quantity {
  }


  #ProductArea .single-option-selector {
    color: black;
    /*margin: auto;*/
    margin-bottom: 1%;
  }

#ProductArea .white {
  color: black
}

}

@media screen and (min-width:480px) {

#ProductPhotoMobile {
  /*height: 200px;*/
  min-height: 450px;
}
}

.loader{
  position: fixed;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 10;
  margin: auto;
  background: url('https://cdn.shopify.com/s/files/1/0911/8940/files/loading.gif?10389042097186826846') 
  50% 50% no-repeat rgb(249,249,249);
  background-size: 50px 50px;
}

.cartloader {
  position: absolute;
  left: 38%;
  right: 0px;
  bottom: 0px;
  top: 40%;
  z-index: 11;
  margin: auto;
}


#shopify-product-reviews {
  border: 1px solid white;

}

#shopify-product-reviews .spr-container {
  border: 1px solid white;
}

.spr-header-title {
  padding: 0 0 5% 0;
  font-size: 1em !important;
}


#solarguarantee {
  position: relative;
  padding-top: 25px;
  padding-bottom: 25px;
}

#solarguarantee #solartext {
  position: absolute;
  padding: 45% 15% 5% 60%;
  color: white;
}

#solarguarantee #solarimage {
/*-webkit-filter: brightness(0.7);
filter: brightness(0.7);*/

}

#guarantee1 {
  min-height: 200px;
}

#guaranteebox {
  height: 650px;
}

#guaranteeimage {
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 650px;

}

#collectionbox {
  height: 375px;
}

#collectionimage {
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 375px;

}



/*PLAN PRODUCT AREA */
#PlanProductArea {
/* position: absolute;
height: 475px;*/

/*rgba(251, 251, 251, 0.96);*/
}






.addprice {
  display: none;
}


.menubutton .addprice {
  display: inline;
}

.menubutton {
  position: fixed;
  top: 7.5px;
  left: 50%;
  -ms-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  /*http://stackoverflow.com/questions/2005954/center-a-positionfixed-element*/
  z-index: 110;

}

#candle-subscription #collection #clickme {
  display: none;
  cursor: pointer;
}

#candle-subscription #collection #scenttext {
  padding-top: 6% !important;
}
/*============================================================================
# Fragrance Details
==============================================================================*/


#poem {
  /*min-height: 400px;*/
  position: relative;

}

#poem img {
  position: absolute;
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  -webkit-filter: brightness(0.8);
  filter: brightness(0.8);
}


#poem .rawaan {
  position: relative;
  padding: 0% 25% 10% 12.5%;
 
  
}


#poem .rawaan img {
  position: relative;
  -webkit-filter: invert(100%); /* Safari and Chrome */
  filter: invert(100%); /* Firefox */
}

#poem .btn {
  position: absolute;
  top: 200px;
}

#scenttitle {
  color: white;
  z-index: 5;
  text-shadow: 2px 2px 5px rgba(0,0,0,0.5);
}

.scentnames {
  padding-top: 50px !important;
  padding-left: 12.5%;
}

#WoodCabin, #GreenMarket, #HotSprings, #Waves {
  padding-top: 50px;
}

#scentsintro {
  margin-top: 0%;
  margin-bottom: 0%;
}

#toptitle {
  color: white;
  z-index: 5;
}

#topbot1 {
  position: relative;
  padding-left: 5%;
  padding-bottom: 50px;
  /*border-left:#dfdfdf dotted 1px*/
}

#toptitle {
  color: #000000;
}

#topbot2 {
}

#ingredient {
  padding: 10px 15px 10px 15px;
}

@media screen and (max-width:768px) {
  #topbot1 {
    padding-left: 0%;
    border-left:0px;
  }

  #fragborder {
  border-left:0px;

  }

  #ingredient {
    padding: 10px 5px 10px 5px;
  }
  #poem .rawaan {
    position: relative;
    padding: 5% 5% 5% 5%;
    font-size: 1.1em;
  }

  #WoodCabin, #GreenMarket, #HotSprings, #Waves {
  padding-left: 0% !important;
  padding-top: 50px;
}

}

#collection, #gift-subscriptions #shopifycollections {
  padding: 0px 2.5% 0px 2.5% !important;

}
#collection #clickme {
  cursor: pointer;
}

#collection #scenttitle {
  top:25px;

}

#collection .btn--secondary {
      position: absolute;
       bottom: 40px;
    left: 3.5%;
    right: 3.5%;
    width: 93%;
    }

/* Specific styling for collection */
#poem #collection #clickme {

}

#poem #collection #scenttext {
  padding-top: 6% !important;
}

#poem #collection .menu_icon_white {
  -webkit-filter: invert(100%) !important; /* Safari and Chrome */
  filter: invert(100%); /* Firefox */ 
}
/* Specific styling for collection */

#woodcabin, #waves, #greenmarket, #hotsprings {
  position: relative;
  min-height: 350px;
  height:  50vh;

}

#collection #scenttext {
  position: absolute;
  min-height: 350px;
  height:  50vh;
  top: 50px;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  color: white;
  padding-top: 25px;
  padding: 2.5% 2.5% 2.5% 2.5%;
/*background: #EFEFEF;
  padding-left: 10% !important;
  padding-right: 10% !important;*/

}

#collection .scents {
  min-height: 350px;
  height:  50vh;
  object-fit: cover;
  top: 0px;
  left: 0;
  width: 100%;
  bottom: 0;
  -webkit-filter: brightness(0.95);
  filter: brightness(0.95);
  padding: 2.5% 2.5% 2.5% 2.5%;
}

#collection .scentsfront {
  /*cursor: pointer;*/
  position: absolute;
  min-height: 350px;
  height:  50vh;
  object-fit: cover;
  top: 0px;
  left: 0;
  width: 100%;
  bottom: 0;
  z-index: 5;
  padding: 2.5% 2.5% 2.5% 2.5%;
}

#notsure2 .grid__item img {
  max-height: 500px;
}

#notsurimg {
  padding-top: 5%;
  padding-bottom: 5%;
}

.details {
  margin: 4% 0% 1% 0%;
  padding: 1% 0% 1% 0% !important;
}

.details img {
  object-fit: cover;
  width: 100%;
  height: 350px;
}

.details img#high {
  height: 600px;
}

.eachcollection {
  padding: 15px 25px 0px 25px;
}

@media screen and (max-width:480px) {
  /* NEED TO ACCOUNT FOR MOBILE HEIGHTS AFTER LUNCH*/

  #collection #scenttext {
    min-height: 350px;
    height: 350px;
  }

  #collection .scents {
    min-height: 350px;
    height: 350px;
  }

  #collection .scentsfront {
    min-height: 350px;
    height: 350px;
  }

  #woodcabin, #waves, #greenmarket, #hotsprings {
    min-height: 350px;
    height: 350px;
  }

  #collection, #shopifycollections {
    padding: 23px 4% 25px 4% !important;

  }

  .eachcollection {
  padding: 15px 0px 0px 0px;
}

}

#collection h4 {
  position: absolute;
    text-align: left;
    top: 0px;
    left: 25px;
  z-index: 7;
}


#collection #name {
  position: absolute;
    text-align: left;
    top: 25px;
    left: 25px;
  z-index: 7;
}

#collection #waves:hover #name,
#collection  #waves:hover h4,
#collection  #woodcabin:hover #name,
#collection  #woodcabin:hover h4,
#collection  #greenmarket:hover #name,
#collection  #greenmarket:hover h4,
#collection  #hotsprings:hover #name,
#collection  #HotSprings:hover h4 {
  color: black;
}

#collection #chooseme {
  position: absolute;
  left: 0px;
  right: 0px;
  top: 0px;
  bottom: 0px;
  margin: auto;
  color: white;

}

/*============================================================================
# Gift area
==============================================================================*/
.gift {

}




#gift1, #gift2, #gift3 {
  position: relative;
  margin-bottom: 35px;
  -webkit-backface-visibility: hidden;

}

.giftbtn {

    width: 100%;
}


.gift .scents {
  height: 275px;
  object-fit: cover;
  top: 0px;
  left: 0;
  width: 100%;
  bottom: 0;
  padding: 2.5% 2.5% 2.5% 2.5%;
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
  -webkit-backface-visibility: hidden;
}

#gift1:hover .scents, #gift2:hover .scents, #gift3:hover .scents{

      /* -webkit-transform: translate(0, -5px);
       -moz-transform: translate(0, -5px);
        -ms-transform: translate(0, -5px);
         -o-transform: translate(0, -5px);
         transform: translate(0, -5px);*/
         -webkit-filter: brightness(0.85);
         filter: brightness(0.85);

       }

       .gifttext {


        padding: 5%;
        padding-left: 5%;
      
      }


      .grid__image {
        padding: 2.5% 2.5% 2.5% 2.5%;
      }

      #collection_image {

      }

      .hover_boy .boyfriend {
        opacity: 0;
                      -webkit-transform: translateZ(0);
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
        -webkit-backface-visibility: hidden;
      }

        .hover_boy:hover .boyfriend  {
        opacity: 1;
      }

/*#collection_image:hover img {
 -webkit-filter: brightness(0.95);
 filter: brightness(0.95);
}*/

      #collection_image img {

        object-fit: cover;
        top: 0px;
        left: 0;
        width: 100%;
        height: 350px;
        -webkit-transform: translateZ(0);
       -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
        -webkit-backface-visibility: hidden;
      }

#collection_image .under_image {
        position: absolute;
            padding: 0% 2.5% 0% 2.5%;
            top: 2%;
             -webkit-filter: brightness(1);
            filter: brightness(1);
              -webkit-transform: translateZ(0);
     -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
        -webkit-backface-visibility: hidden;
      }


      #giftcollection_image img {

        object-fit: cover;
        top: 0px;
        left: 0;
        width: 100%;
        height: 200px;
        -webkit-transform: translateZ(0);
        -webkit-transition: all 0.25s ease-in-out;
        -moz-transition: all 0.25s ease-in-out;
        -ms-transition: all 0.25s ease-in-out;
        -o-transition: all 0.25s ease-in-out;
        transition: all 0.25s ease-in-out;
        -webkit-backface-visibility: hidden;
 /*  -webkit-filter: brightness(0.99);
 filter: brightness(0.95);*/
}



/*#giftcollection_image:hover img {
   -webkit-filter: brightness(0.85);
filter: brightness(0.85);
     -webkit-transform: translateZ(0);
     -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
  -webkit-backface-visibility: hidden;

  }*/

  #gift-sets #shopifycollections {
    margin-bottom: 10%;
  }

  #collection_image {
   -webkit-transform: translateZ(0);
     -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.3s ease-in-out;
   -webkit-backface-visibility: hidden;
 }

 #collection_image, #giftcollection_image {
  position: relative;
}




.collection_text  {
  position: absolute;
  top: 30px;
  bottom: 130px;
  left: 0;
  right: 0;
  margin: auto;
  color: white;
  padding-left: 10%;
}

#gift-sets .collection_text {
  color: #333;
}

.giftcollection_text {
 /* position: absolute;
      top: 175px;
height: 400px;
  bottom: 130px;
  left: 0;
  right: 0;
  margin: auto;
  color: white;*/
  /*padding-left: 10%;*/
}


.collection_text h2 {
  color: white;
}



#collectionshome .collection_text h2 {
  color: #333;
}

#collectionshome .collection_text .h4 {
  color: #333;
}

.collection_text:hover h2, .collection_text:hover .h4 {
  color: #333;
}


#gift-sets .collection_text h2 {
  color: #333;
}

.gift_btn .btn--secondary {
    /* bottom: 15px;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 5;*/
    width: 85%;
}

.gift_btn .btn {
      width: 92.5%;
    /*border-radius: 3px;*/
}

.collection_btn {
  bottom: 15px;
  width: 100%;
  /*left: 0;
  right: 0;
  margin: auto;*/
  position: absolute;
}

.collection_btn .btn--secondary {
  width: 92.5%;
  /*border-radius: 3px;*/

}

.gift_btn .btn--secondary {
  min-width: 100px;
}

#thecollection  #woodcabin, 
#thecollection  #waves, 
#thecollection #greenmarket, 
#thecollection #hotsprings {
  min-height: 225px;
  height:  32.5vh;

}

#thecollection  #woodcabin h2, 
#thecollection  #waves h2, 
#thecollection #greenmarket h2, 
#thecollection #hotsprings h2 {
margin-bottom: 0;
}

#thescents  #woodcabin, 
#thescents  #waves, 
#thescents #greenmarket, 
#thescents #hotsprings {
  min-height: 325px;
  height:  75vh;
}



.scent_icon {
  position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
      -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 0.5s ease; /* Safari and Chrome */
  -moz-transition: all 0.5s ease; /* Firefox */
  -ms-transition: all 0.5s ease; /* IE 9 */
  -o-transition: all 0.5s ease; /* Opera */
  transition: all 0.5s ease;
}

#waves:hover .scent_icon, 
#woodcabin:hover .scent_icon, 
#hotsprings:hover .scent_icon, 
#greenmarket:hover .scent_icon {
  opacity: 0;
}

#thescents .scent_icon {
   opacity: 1 !important;
}

.fragtitle {
      position: absolute;
    top: 15px;
    left: 25px;
    color: white;
}

#thecollection .scenttext{
  position: absolute;
  min-height: 225px;
  height:  32.5vh;
  top: 27.5%;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  color: white;
  padding-top: 25px;
  padding: 2.5% 2.5% 2.5% 2.5%;
  opacity: 0;
/*background: #EFEFEF;
  padding-left: 10% !important;
  padding-right: 10% !important;*/

}

#thescents .scenttext {
  position: absolute;
  min-height: 325px;
  height:  75vh;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  margin: auto;
  color: white;
    /* padding-top: 25px; */
    padding: 2.5% 0% 2.5% 0%;

/*background: #EFEFEF;
  padding-left: 10% !important;
  padding-right: 10% !important;*/

}

#thecollection .scenttext .name {
  opacity: 1;
}
#thescents .scenttext .btn--secondary {
  opacity: 0;
  position: absolute;
    bottom: 7.5%;
    left: 0;
    width: 100%;
}

#thecollection  .scents {
  min-height: 225px;
  height:  32.5vh;
  object-fit: cover;
  top: 0px;
  left: 0;
  width: 100%;
  bottom: 0;
  padding: 1% 2.5% 2.5% 2.5%;
}

#thescents  .scents  {
  min-height: 325px;
  height:  75vh;
  object-fit: cover;
  top: 0px;
  left: 0;
  width: 100%;
  bottom: 0;
  padding: 2.5% 2.5% 2.5% 2.5%;
}

#thescents  #woodcabin:hover .scents, 
#thescents  #waves:hover .scents,  
#thescents #greenmarket:hover .scents, 
#thescents #hotsprings:hover .scents {
         -webkit-filter: brightness(0.85);
         filter: brightness(0.85);

       }

.darker {
  -webkit-filter: brightness(0.7);
  filter: brightness(0.7);

}

#norenew {
  padding: 5% 0% 5% 0%;
}

#scentdetitle {
      position: absolute;
    left: 5%;
    color: white;
    font-size: 5vw;
    bottom: 40.5vh;
        z-index: 10;
}

#scentcover {
    object-fit: cover;
  top: 0px;
  left: 0;
  width: 100%;
   height:  75vh;
     -webkit-filter: brightness(0.9);
  filter: brightness(0.9);
}

#scentimg1  {
    object-fit: cover;
  top: 0px;
  left: 0;
  width: 100%;
   height:  50vh;
}

#scentdetailingre #ingredient img {
      position: absolute;
    left: -9pc;
    width: 71px;
    height: 71px;
}

#scentdetailingre h4,#scentdetailingre #ingredient p {
      height: 45px;
    padding-top: 10px;
    padding-right: 5px;
}

#detailpoem {
      position: absolute;
    top: 15.5vh;
    right: 25px;
    color: white;
}

#trio {
  margin-top: 5%;
}

#trio1 {
  margin-top: 10%;
}

#trio2 {
  margin-top: 15%;
}

@media screen and (max-width:768px) {
  #collection_image img, .gift .scents {


    height: 325px;
  }

#thescents .scenttext .btn--secondary {
  opacity: 0;
  position: absolute;
    bottom: 40%;
    left: 0;
    right: 0;
    margin: auto;
    width: 50%;
}

#scentdetitle {
    font-size: 8vw;
    bottom: 60vh;
}
#scentdetailingre #ingredient img {
left: -5pc;
}
#scentcover {

   height:  45vh;
}
.scent_icon {
  display: none;
}
  .hover_boy .boyfriend {
    opacity: 1;
  }

    .hover_boy .collection_btn.boyfriend {
    opacity: 0;
  }

    .under_image {
    display: none;
  }

  .collection_text, .collection_text h2 {
    
    color: black;
  }

  .collection_btn {
/*  bottom: 0;
  top:0;
  left: 0;
  position: relative;*/
}

#trio,
#trio1,
#trio2 {
  margin-top: 0%;
}

.collection_text .btn--secondary {
  bottom: 30px;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  width: 50%;
  font-size: 0.9em;
}

.collection_text {
  top: 20px;
}


#thecollection .scenttext {

  padding: 2.5% 5% 2.5% 5%;


}

#giftcollection_image .collection_text {
  top: 0px;
  height: auto;
}


.collection_quick_buy .btn {
  font-size: 0.9em;
}
}
/*============================================================================
# STH details
==============================================================================*/
#sthhero {
  height: 75vh;
  position: relative;
  text-align: center;
  background-color: #333333;

}

#sthheroheader {
  top: 25vh;
  color: #fff !important;
}

#STHProductArea {


}

#STHimage {
  height: 300px;
  margin-bottom: 25px;
  margin-top: 25px;
}

.sthimg {
  width: 50%;

}

#sth1 {
  padding: 7.5% 1% 0% 1%;
  height: 250px;
  background: #fafafa;
}

#sth2, #planguide {

  margin-top: 2%;
  margin-bottom: 7.5%;

}

#advice1 {

}

#advice2 {
  height: 100px;
}

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


  #sthhero  {
    height: 450px !important;
  }

  #sthheroheader {
    top: 10vh;
    padding-right: 25%;

  }
}

/*============================================================================
# Plan details
==============================================================================*/
#planhero {
  height: 85vh;
  position: relative;
  text-align: center;
  background-color: #333333;

}


#planheroheader {
      /*font-size: 2.25em !important;*/
  top: 25vh;
  color: #fff !important;

}



#planheroheader .btn--secondary {
  width: 200px;
    background: transparent;
    color: #fff !important;
    margin-bottom: 5%;
}

#planheroheader .btn--secondary:hover {
  width: 200px;
    background: white;
    color: #000 !important;
}

#planhero p {
  font-size: 0.8em !important;
}

#planhero .hero__title {
font-size: 2.25em !important;
}

.plan_button {

  z-index: 1;
  min-width: 150px;
}


.feature_bullets {
  font-size: 0.85em;
}

#planimg img{
  height: 425px;
}

#planguide {
  position: relative;
  /*background: #fafafa;*/

}


#plan1 h5, #plan2 h5, #plan3 h5 {
  padding-top: 25px;

}

#plan1 img, #plan2 img, #plan3 img {
  height: 75px;
  width: 75px;
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;
}

#planchoose {
  padding: 0px 15% 0% 15%;
}

#planbread{
  height: 700px;
}

#planheads {
  padding: 0px 50px 0px 50px;
}

#planheads2 {
  margin-right: 3.33%;
  margin-left: 3.33%;
  padding: 0px 50px 0px 50px;
}

#plandeets {
  position: relative;
  padding-top: 90px;
  padding-left: 15%;
  padding-right: 15%;
}

#plandeets1, #plandeets3 {
  min-height: 454px;
  margin-bottom: 75px;
  padding-top: 30px;
  /*border: 1px solid white;*/
  border-radius: 5px; 
  background: white;
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 0.25s ease; /* Safari and Chrome */
  -moz-transition: all 0.25s ease; /* Firefox */
  -ms-transition: all 0.25s ease; /* IE 9 */
  -o-transition: all 0.25s ease; /* Opera */
  transition: all 0.25s ease;
  -webkit-transform:scale(1.0); /* Safari and Chrome */
  -moz-transform:scale(1.0); /* Firefox */
  -ms-transform:scale(1.0); /* IE 9 */
  -o-transform:scale(1.0); /* Opera */
  transform:scale(1.0);
}

#plandeets1 .details, #plandeets3 .details {
  display: none;
} 

#plandeets1:hover .details,
#plandeets3:hover .details {
  display: block;
} 

#plandeets2 {
  margin-right: 3.33%;
  margin-left: 3.33%;
  margin-bottom: 75px;
  border: 2px solid #EFEFEF ;
  background: #EFEFEF;
  border-radius: 5px; 
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 0.25s ease; /* Safari and Chrome */
  -moz-transition: all 0.25s ease; /* Firefox */
  -ms-transition: all 0.25s ease; /* IE 9 */
  -o-transition: all 0.25s ease; /* Opera */
  transition: all 0.25s ease;
  -webkit-transform:scale(1.0); /* Safari and Chrome */
  -moz-transform:scale(1.0); /* Firefox */
  -ms-transform:scale(1.0); /* IE 9 */
  -o-transform:scale(1.0); /* Opera */
  transform:scale(1.0);

}

#plandeets1:hover, #plandeets2:hover ,#plandeets3:hover {

   /* -webkit-box-shadow: 0px 1px 2px 2px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 1px 2px 2px rgba(0,0,0,0.3);
box-shadow: 0px 1px 2px 2px rgba(0,0,0,0.3);*/
background: #EFEFEF;
}



input[name="hide-info"] {
  display: none;
}

#planbenefits {
   background: #f3f3f3;
 /*-webkit-box-shadow:  0px 2px 15px 3px rgba(0,0,0,0.4);
  -moz-box-shadow: 0px 2px 15px 3px rgba(0,0,0,0.4);
  box-shadow: 0px 2px 15px 3px rgba(0,0,0,0.4);*/
}

#customerlove {
  /*background: #fafafa;*/
  letter-spacing: 2px;
  padding-bottom: 7.5%;
  padding-top: 2.5%;
}

#customerlove p {
  font-size: 1.2em;
    font-weight: 300;
}

#customerlove .grid__item {
}

#customerlove .grid__item img {
  padding: 0px % 0px 0%;
}


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

  #plandeets1 .details, #plandeets3 .details {
    display: block;
  }

  #planhero  {
    height: 450px !important;
  }

  #planheroheader {
   top: 10vh;

 }

 #plandeets2 {
  margin-right: 0%;
  margin-left: 0%;
  background: #f6f6f6;
}

#planchoose {
  padding: 0% 0% 0% 0%;
}


#customerlove .grid__item img {
  padding: 0px 20% 0px 0%;
}

}

/*============================================================================
# Our story
==============================================================================*/
#ourstoryfull{
  text-align: center;
}
#ourstory1 {
  position: relative;
}

#storytime {
}

#teamfacts {
  position: relative;
  justify-content: center;
}

#teamfacts ul li, #teamfacts  .menu_icon {
  cursor:   auto;
}

#teamfacts img {
  max-height: 325px;
}

#team1 {
  display: block;
  height: 325px;
}

#team2,#team4,#team5,#team3{
  display: none;
  height: 325px;
}

#team1 img, #team2 img,#team4 img,#team5 img,#team3 img {
  height: 100%;
}

.story_background {
  background-image: url(https://cdn.shopify.com/s/files/1/0911/8940/files/KEAP_Hero_notes_dark_r01.png?18364498140880706787);
  background-position: 50% 50%;
  background-repeat: no-repeat;
}


.k_background {
  background: #f6f6f6;
  /*background-image: url(https://cdn.shopify.com/s/files/1/0911/8940/files/160920_KEMP_0178.jpg?16576601411015665713);*/
  background-position: 50% 50%;


  /*background-repeat: no-repeat;*/
}

.blog_background {
  background: #f6f6f6;
  background-image: url(https://cdn.shopify.com/s/files/1/0911/8940/files/160920_KEMP_0367.jpg?3630341080021015326);
  background-position: 50% 65%;
    -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#manifesto {
  color: white;

/* -webkit-box-shadow:  0px 2px 15px 3px rgba(0,0,0,0.4);
  -moz-box-shadow: 0px 2px 15px 3px rgba(0,0,0,0.4);
  box-shadow: 0px 2px 15px 3px rgba(0,0,0,0.4);*/
}

#manifestowhite ul li {
  color: black;
}

#manifestowhite .menu_icon_white {
 -webkit-filter: invert(0%);
 filter: invert(100%);
 opacity: 1;
}

.menu_icon.team_icon {
  max-width: 115px;
  max-height: 115px;
}

.team_member {

  position: relative;
  max-width: 115px;
  max-height: 115px;
  /*box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2);*/
}

.team_member:hover {

  /*box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2);*/
}

.team_member .team_circular {

  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  max-width: 115px;
  max-height: 115px;
}



.team_member:hover .team_icon {
  display: none;
}

.team_icon {
  position: absolute;
  margin:auto;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}

#teamfacts h3,
#teamfacts h5 {
  color: black;
}

#teamfacts h5 {
  font-weight: 400;
}

/*============================================================================
# Our approach
==============================================================================*/
.approachhero__header {
  top: 200px;
  color: black;
}

.approach_background {
  background-image: url(https://cdn.shopify.com/s/files/1/0911/8940/files/Screen_Shot_2016-03-29_at_15.43.41.png?8421378872378739381); 
  background-size: cover; 
  background-position: 50% 50%; 
  background-repeat: no-repeat;
}

#approachhero {
  height: 75vh;
  position: relative;
  text-align: center;
  width: 100%;
}

#approach img {
  margin-bottom: 5%;
  margin-top: 5%;
}

#approach #convenience img {
  margin-bottom: 0%;
  margin-top: 0%;
}



@media screen and (max-width:768px) {
  #approachhero {
    height:  375px;

  }

  .approachhero__header {
    top: 90px;
  }
}

#ourapproach{
}

.ourapproach2 {
  position: relative;
  cursor: pointer;
}

.bettercandle{
  background: #F6F6F6;
}

.waximage {
  position: relative;
}
.waximage .back {

  -webkit-filter: brightness(0.55);
  filter: brightness(0.55);
  /* position: absolute;*/
  object-fit: cover;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 250px;

}

.waxtext{
  position: relative;
  height: 250px;
  z-index: 2;

}

.waximage #supscent img, .waximage #lasdes img  {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  z-index: 3;
  color: white;

}

.waxtext h4, .waxtext h3 {
  text-transform: none;
}

#convenience {
  background: #F6F6F6;
/*  padding-bottom: 5%;*/
  position: relative;


}

#betterprices {
  background: #fff;
}


#conv1 img, #conv3 img {
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;
}

#convenience .bigbread {
}

.hero__header-inner .btn {
  padding: 10px 18px;
}

.hero__header-inner .play-button {
  width: 12px;
  margin-bottom: -3px;
}

#once-upon-a-candle-keap #videodiv {
  display: none;
}

#once-upon-a-candle-keap #videodiv.show {
  display: block;
}

#buy-a-candle-light-a-home-keap #buycandles {
  display: none;
}

#buy-a-candle-light-a-home-keap #buycandles.show {
  display: block;
}

/*============================================================================
# Our cause
==============================================================================*/

#causehero {
  height: 300px;
  position: relative;
  text-align: center;
  background: white;
  color:#333333;

}




#causeheroheader {
  top: 120px;
}

.causehero__button {
  background-color: white !important;
  color: #333333 !important;
}

@media screen and (max-width:768px) {
  #causehero {
    height:  275px;
  }

  #causeheroheader {
    top: 90px;
  }
}

.tupperware#causeguide {
  position: relative;
}

#causeguide .bigbread {
}

#cause1, #cause2, #cause3, #cause4 {
  padding: 25px;


}


#causeguide h5 {
  padding-top: 25px;


}

#causeguide img {
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;
}

#causeguide .bigbread {
}

#causebread{
  height: 700px;
}

#causestory1 {
  position: relative;
/*background:  #f6f6f6;
color: white;
*/
}

.bcorp {
  height: 75px;

}

.cert {
  height: 50px;

}


/*============================================================================
# Labs
==============================================================================*/

#labsbutton {
  position: relative;
}

#labhero {
  min-height: 100vh;
}


.labhero__header {
  color: white;
  height: 40%;
  padding: 0 0.5em;
  position: relative;
  max-width: 900px;
  top: 125px;
  margin: auto;
}

.labhero__button {
  position: absolute;
  left: 50%;
  bottom: 6em;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 1;
}



/*============================================================================
# CART
==============================================================================*/
.ajaxcart__product-image img {
  border-radius: 3px;
  width: 75px;
  height: 75px;
  object-fit: cover;
  top: 0px;
  left: 0;
  bottom: 0;
}

.cart__image img {
 /* border-radius: 100%;*/

}

#your-shopping-cart h1 {
  text-align: center !important;
  padding-top: 2.5%;
}

.cart__image img {
   /*   width: 100px !important;
    height: 100px;*/
}

/*============================================================================
# FAQS
==============================================================================*/

#labsbutton {
  position: relative;
}

.tips {
  padding-right: 50px;
  margin-bottom: 15px;

}

.faqs {
  background: #f6f6f6;
  padding: 5% 0% 1% 0%;
}

#faqs2, #faqs3 {
  padding: 5% 0% 1% 0%;
  position: relative;
}


#helplab {
  width:100%; 
  object-fit: cover; 
  height:400px;
  margin-bottom: 2.5%;
  margin-bottom: 5%;
}

#faqpad {

}

.faq {
  
}
.faq li {
  list-style-type: none;
  cursor: pointer;
}

.faq p  {
  display: none;
}

.faq .active p {
  display: block;

}

.faq .question {
  padding-bottom: 5px;
  
}
.question a {
  text-decoration: underline;

}

.faq  h4 {

}


.faq h5 {
  text-transform: none;
  font-weight: 700;
}

/*============================================================================
# BLOG
==============================================================================*/
#MainBlog {
  padding-left: 2.5%;
  padding-right: 2.5%;
  padding-bottom: 50px;
}

#CoreBlog {
  padding-top: 75px;
  padding-left: 2.5%;
  padding-right: 2.5%;
  padding-bottom: 50px;
}


#BlogHeader {
  /*background: #f6f6f6*/
  /*color: white;*/
      text-shadow: 2px 2px 2px white;

}


#BlogHeader a {

  /*color: white;*/
}

.blogcategory {
  font-size: 1.25em;
}

.blogcategory:hover {

}

.blogcategory:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: -2px;
  left: 0;
  background-color: #fff;
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

.blogcategory:hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

.catcon {
  position: relative;
}
.catdiv {
  padding-left: 15px;
  padding-right: 15px;
}

#CoreArticleGrid {
  padding: 25px;
}

#ArticleGrid {
  padding-top: 25px;
  padding-bottom: 25px;
}

#EachArticle {
  position: relative;
  padding: 10px;
  margin-bottom: 25px;
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;

}

#ArticleInfo {
  position: relative;
  padding: 10% 4% 5% 4%;
  background: white;
  height: 250px;
}

#ArticleSection > div.rte {
      padding-left: 10%;
    padding-right: 35%;
}

#ArticleSection > div.rte p {
    margin: 0 0 15px 0;
    font-family: helvetica;
    font-weight: 400;
}

#BlogArticleImage {
  object-fit: cover;
  top: 0px;
  left: 0;
  width: 100%;
  height: 283px;
  bottom: 0;
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}

#EachArticle:hover #BlogArticleImage{
  opacity: 0.7;


}

#BlogArticle {
  padding-left: 5px;
}

#SidebarArticleImage {
/*  object-fit: cover;
  top: 0px;
  left: 0;*/
  width: 75px;
  height: 75px;
  /*
  bottom: 0;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border: 1.5pt #333333 solid*/

}

#BlogArticle {
  /*padding-top: 15px;*/
/*padding-left: 3.5%;
padding-right: 5%;*/
}

#BlogIconImage {
  z-index: 5;
  position: absolute;
  top: 270px;
  left: 0px;
  right: 0;
  margin: auto;
  background: white;
}

#ArticleSection p {

  font-size: 1.125em;
  line-height: 1.8;
}

#ArticleSection h3,#ArticleSection h4,#ArticleSection h5,#ArticleSection h6 {
  line-height: 1.8;
}

#ReadMore {
  position: absolute;
  left: 0px;
  right: 0;
  margin: auto;
  top: 180px;
}

#EachArticle:hover{
  -webkit-box-shadow: 0px 0px 2px 2px  rgba(0,0,0,0.1);
  -moz-box-shadow:0px 0px 2px 2px  rgba(0,0,0,0.1);
  box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.1);
}

#EachArticle:hover #ArticleInfo {

  -webkit-transform: translate(0, -15px);
  -moz-transform: translate(0, -15px);
  -ms-transform: translate(0, -15px);
  -o-transform: translate(0, -15px);
  transform: translate(0, -15px);
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}

#EachArticle:hover #BlogIconImage {

  -webkit-transform: translate(0, -7px);
  -moz-transform: translate(0, -7px);
  -ms-transform: translate(0, -7px);
  -o-transform: translate(0, -7px);
  transform: translate(0, -7px);
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}


#ArticlePage {
  padding-top: 25px;
/*padding-left: 15px;
padding-right: 15px;*/

}

#ArticlePage h1,#ArticlePage h2,#ArticlePage h3,#ArticlePage h4,
#ArticlePage h5,#ArticlePage p,#ArticlePage li {
  padding-left: 25px;
  padding-right: 25px;
}

#ArticlePage p img {
  padding-left:  0px;
  padding-right: 0px;
}

#ArticleSection {
/*padding-left: 10px;
padding-right: 35px;*/
padding-top: 25px;

}
.share {
  font-size: 2em;
}

article img {
  width: 100%;
  height: 100%;
}


@media screen and (max-width:768px) {
  #ArticlePage {
    padding: 0px;

  }

  #ArticleSection > div.rte {
      padding-left: 0%;
    padding-right: 0%;
}

  #ArticleSection {
    padding: 0px;

  }
}

/*============================================================================
# Footer detailing
==============================================================================*/
.logo_footer {

  max-height: 120px;
}

.certs_footer {
    height: 100px;
}

.footer-nav-group {
  padding-right: 1rem;
  display: inline-block;
  vertical-align: top;

}

.footer-nav-group--top {
  display: block;
  margin-top: 15px;
}

.footer-nav-group--links {
  float: left;
  text-align: left;

}



.footer-nav-title,  .footer-nav-group a {
  color: white;
  margin-bottom:0.25em;
}

.footer-social-title {
  padding-top: 10px;
  color: white;
}


.footer-link {
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
  display: block;
  color: #ffffff;
  margin: 0.1rem 0;
  letter-spacing: 0.04em;
  font-size: 12px;
}
.footer-link:hover {
  color: #ffffff;
  opacity: 0.3;
}

.lower-footer {
  font-size: 11px;
}

.lower-footer  {
  background-color: #000000;
  color: white;
}

.lower-footer .link  {
  color: white;
}

.lower-footer .link:hover  {
  opacity: 0.7;
}

.lower-footer {
  padding: 10px;
}

.footer-nav-group--top {
  margin-top: 0;
}

.copyright img {
  float:left;
  margin: 0px;
}

#pagefooter .copyright {
  margin-top: 0px;
}

.site-footer {
  color: white;
  padding-bottom: 0px;
      position: relative;
   bottom: 0px;
}



.site-footer  .wrapper {
  padding: 0px;
}

footer .link {
  color: white;
}
/*============================================================================
# Sign up form custom
==============================================================================*/
#emails {
  height: 225px;
}
.signup-form-cont {
  text-align: center;
  clear: both;
  white-space: nowrap;
}

.signup-form {
  display:inline-block;
  zoom:1;
  vertical-align: middle;
}

.signup-form {
  margin-top: 5px;
  border: 1px solid #d3d3d3;

}

footer .signup-form {
  width: 100%;
}
footer .signup-form input {
  background-color: rgba(0,0,0,0); ;
  padding: 12px 10px 8px 0px;
  color: white;
  border: 0px solid #d3d3d3;
  border-left: 1px solid #d3d3d3;
}



input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  transition: background-color 5000s ease-in-out 0s;
  color: white !important;

}




.signup-form label {
  font-size: 12px;
  line-height: 12px;
  padding: 0 25px;
  border-right: 1px solid #e7e7e1;
  vertical-align: middle;

  text-transform: uppercase;

}

.social-icons li {
  margin: 0px;
}

.signup-form input[type="email"] {
  border: none;
  font-size: 12px;
}

.signup-form h4 {
  margin: 0.6em 2em;
}

#signup {

}


.button.compact,
button.compact,
input[type="submit"].compact,
input[type="reset"].compact,
input[type="button"].compact {
  width: 51px;
  min-width: 0;
  border-radius: 0px;
}


/*============================================================================
# Bootstrap Tooltip & Popovers & alerts
==============================================================================*/


.tooltip {
  position: absolute;
  z-index: 5;
  display: block;
  font-style: normal;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-transform: none;
  letter-spacing: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  white-space: normal;
  filter: alpha(opacity=0);
  opacity: 0;
  line-break: auto
}

.tooltip.in {
  filter: alpha(opacity=90);
  opacity: .9
}

.tooltip.top {
  padding: 5px 0;
  margin-top: -3px
}

.tooltip.right {
  padding: 0 5px;
  margin-left: 3px
}

.tooltip.bottom {
  padding: 5px 0;
  margin-top: 3px
}

.tooltip.left {
  padding: 0 5px;
  margin-left: -3px
}

.tooltip-inner {
  max-width: 200px;
  padding: 3px 8px;
  color: #fff;
  text-align: center;
  background-color: #000;
  border-radius: 4px
}

.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid
}

.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000
}

.tooltip.top-left .tooltip-arrow {
  right: 5px;
  bottom: 0;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000
}

.tooltip.top-right .tooltip-arrow {
  bottom: 0;
  left: 5px;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000
}

.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #000
}

.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #000
}

.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000
}

.tooltip.bottom-left .tooltip-arrow {
  top: 0;
  right: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000
}

.tooltip.bottom-right .tooltip-arrow {
  top: 0;
  left: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000
}

.popover {
  position: absolute;
  color: #ECECEC;
  top: 0;
  left: 0;
  z-index: 5;
  display: none;
  min-width: 125px;
  max-width: 276px;
  padding: 1px;
  line-height: 1.42857143;
  text-align: left;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  letter-spacing: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  white-space: normal;
  background-color: #000000;
  opacity: 0.9;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border-radius: 0px;
  line-break: auto
  -webkit-box-shadow: 0px 0px 8px 2px  rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 0px 8px 2px  rgba(0,0,0,0.2);
  box-shadow: 0px 0px 8px 2px rgba(0,0,0,0.2);
}

.popover.top {
  margin-top: -10px
}

.popover.right {
  margin-left: 10px
}

.popover.bottom {
  margin-top: 10px
}

.popover.left {
  margin-left: -10px
}

.popover-title {
  padding: 8px 14px;
  margin: 0;
  font-size: 14px;
  background-color: #000000;
  border-bottom: 1px solid #ebebeb;
  border-radius: 5px 5px 0 0
}

.popover-content {
  padding: 9px 14px;
  font-size: 0.9em;
}

.popover>.arrow,
.popover>.arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid
}

.popover>.arrow {
  border-width: 11px
}

.popover>.arrow:after {
  content: "";
  border-width: 10px
}

.popover.top>.arrow {
  bottom: -11px;
  left: 50%;
  margin-left: -11px;
  border-top-color: #999;
  border-top-color: rgba(0, 0, 0, .25);
  border-bottom-width: 0
}

.popover.top>.arrow:after {
  bottom: 0px;
  margin-left: -10px;
  content: " ";
  border-top-color: #fff;
  border-bottom-width: 0
}

.popover.right>.arrow {
  top: 50%;
  left: -10px;
  margin-top: -11px;
  border-right-color: #999;
  border-right-color: rgba(0, 0, 0, .25);
  border-left-width: 0
}

.popover.right>.arrow:after {
  bottom: -10px;
  left: 1px;
  content: " ";
  border-right-color: #000;
  border-left-width: 0
}

.popover.bottom>.arrow {
  top: -10px;
  left: 50%;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: #999;
  border-bottom-color: rgba(0, 0, 0, .25)
}

.popover.bottom>.arrow:after {
  top: 1px;
  margin-left: -10px;
  content: " ";
  border-top-width: 0;
  border-bottom-color: #000;
}

.popover.left>.arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-right-width: 0;
  border-left-color: #999;
  border-left-color: rgba(0, 0, 0, .25)
}

.popover.left>.arrow:after {
  right: 1px;
  bottom: -10px;
  content: " ";
  border-right-width: 0;
  border-left-color: #fff
}

.popover-data {
  text-decoration: underline;
  cursor: pointer;
  /*color: white;*/
}

.popover-data:hover {
  /*color: white;*/
}
.alert {
  padding: 8px 14px 8px 14px;
  color: #ffffff;
  background-color: #ffffff;
  /*border: 1px solid #333333;*/
  z-index: 5000;
  position: fixed;
  text-align: center;
  width: 100%;
  display:none;
  /*border-radius: 25pc;*/
  width: 350px;
  right: 0;

}

#mothers {
  top:65px;
  width: 100%;
  z-index: 5;
  background: #000;
  color: #fff;
}

#mothers .icon-x {
  padding-right: 15px;
}

#workshopalert {
  top:65px;
  width: 100%;
  z-index: 5;
  background: #000;
  color: #fff;
}

#workshops .icon-x {
  padding-right: 15px;
}

#emailsignup {
  bottom:0px;
  width: 100%;
  z-index: 5;
  background: #fff;
  color: #000;
}

#emailsignup .icon-x {

  font-size: 2.1em;
}

#emailsignup button {
  right: 10px !important;
  top: 10px !important;
  position: absolute;
}

#emailsignup2 {
   position: fixed;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
  top: 65px;
/*    top: 0;
   
    left: 0%;
    right: 0%;*/
    margin: auto;
    height: 22.5%;
    width: 100%;
  z-index: 11;
  background: #fff;
  color: #000;
}



#emailsignup2 .icon-x {

  font-size: 2.1em;
}

#emailsignup2 button {
  right: 10px !important;
  top: 10px !important;
  position: absolute;
}



.alert h4 {
  margin-top: 0;
  color: inherit
}

.alert .alert-link {
  font-weight: 700
}

.alert>p,
.alert>ul {
  margin-bottom: 0
}

.alert>p+p {
  margin-top: 5px
}

.alert-dismissable,
.alert-dismissible {
  background: #333333;
  color: #fff;

}

.alert-dismissable .close,
.alert-dismissible .close {
  position: relative;
  top: 11px;
  right: -21px;
  color: inherit;
  float: right;
}

#shippingalert {
  display: none;

}


.notice {
  opacity: 0.3;

}

.additional-alert { 
  font-size: 14px;}

  @media screen and (max-width: 768px) {
    #alerts {
      bottom: 0%;
      width: 100vw;
      text-align: center;
    }

    #emailsignup2 {
      height: 30%;
    }

.popover-data {
  color: black;
}

.popover-data:hover {
  color: black;
}



  }

/*============================================================================
# Timber
==============================================================================*/

.js-qty__adjust {
  padding: 8px; 
}

.mobile-nav__has-sublist {
  display: block;
}

.mobile-nav__toggle {
  display: table;
  width: 100%;
}

label[for] {
  cursor: auto;
}

/*============================================================================
# FB Messenger
==============================================================================*/
.fbmes {
  cursor: pointer;
  width: 35px;
  height: 35px;
  position: fixed;
  bottom: 25px;
  right: 25px;
  z-index: 25;
}

.fbmes:hover {
  -webkit-transition: all 0.25s ease; /* Safari and Chrome */
  -moz-transition: all 0.25s ease; /* Firefox */
  -ms-transition: all 0.25s ease; /* IE 9 */
  -o-transition: all 0.25s ease; /* Opera */
  transition: all 0.25s ease;
  -webkit-transform:scale(1.1); /* Safari and Chrome */
  -moz-transform:scale(1.1); /* Firefox */
  -ms-transform:scale(1.1); /* IE 9 */
  -o-transform:scale(1.1); /* Opera */
  transform:scale(1.1);
}

.fbpop {
  cursor: pointer;
  width: 25px;
  height: 25px;
  position: fixed;
  bottom: 25px;
  right: 25px;

}

.notification {
  background: red;
  color: white;
  font-size: 0.65em;
  padding-left: 4px;
  padding-bottom: 2px;
  width: 13px;
  height: 13px;
  position: fixed;
  bottom: 45px;
  right: 20px;
  z-index: 16;
  border-radius: 100%;
}

#judgeme_summary {
  text-align: center;
}

#judgeme_product_reviews .judgeme-review, #judgeme_product_reviews .footer-summary, #judgeme_form {
  border: 0px !important; 
  text-align: left;
  padding-left: 10%;
  padding-right: 10%;

}

.judgeme-review-header {
  padding: 10px 0px 10px 0px;
}

.judgeme-preview-badge {

}

.judgeme-review-title {
  font-weight: bold;
}

.judgeme-review-body {
  padding-top: 10px;
}

#judgeme_newreview {
  border-radius: 25px;
  color: #fff;
  background: #000;
  padding: 12px;
}

#judgeme_header {
  padding-bottom: 10px;
}
.avg_reviews {
  color: white;
  padding-top: 5px;
}

.avg_reviews_section {
  padding-bottom: 35px;
  padding-top: 1px;
}

#judgeme_newreview {
  float: none !important;
}

.judgeme-badge {
  float: none !important;
}

@media screen and (max-width: 768px) {
  .avg_reviews {
    color: black !important;
  }
  .judgeme-star {
    -webkit-filter: brightness(0) !important;
    filter: brightness(0) !important;
  }

}


/*============================================================================
# Refer friend & Map
==============================================================================*/

.hide_refer {
  display: none;
  position: absolute;
  z-index: -1;
  height: 1px;
}


.mapplace {
  padding: 0% 5% 0% 5%;
}

.mapimage {
  height: 200px ;
  object-fit: cover;
  top: 0px;
  left: 0;
  width: 100%;

  bottom: 0;
}

/*============================================================================
# Art
==============================================================================*/
.artwords {
  position: fixed;
      font-size: 3vw;
      font-weight: 700;
}

#aboutart {
        position: fixed;
    font-size: 1.5em;
      bottom: 0px;
    left: 0px;
    right: 0px;
    /*z-index: 15;*/

}

#return {
      position: fixed;
    font-size: 2.5em;


      top: 0px;
    left: 0px;
    right: 0px;
    z-index: 15;


}

#keep {
  

    top: 0px;
    left: 2.5%;

}

#the {

    top: 0px;
    right: 0px;   
     transform-origin: 30% 60%;
        -webkit-transform: rotate(-270deg);

/* Firefox */
-moz-transform: rotate(-270deg);

/* IE */
-ms-transform: rotate(-270deg);

/* Opera */
-o-transform: rotate(-270deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
#fire {

    bottom: 0px;
    right: 0px;
        transform-origin: 40% 40%;
        -webkit-transform: rotate(-180deg);

/* Firefox */
-moz-transform: rotate(-180deg);

/* IE */
-ms-transform: rotate(-180deg);

/* Opera */
-o-transform: rotate(-180deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
#burning {

  bottom: 0px;
    left: 0px;
    /* transform: rotate(45deg); */
        transform-origin: 15% 20%;
    -webkit-transform: rotate(-90deg);

/* Firefox */
-moz-transform: rotate(-90deg);

/* IE */
-ms-transform: rotate(-90deg);

/* Opera */
-o-transform: rotate(-90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

#dbg {
  margin-top: 5%;
}