/** 
 * Owl Carousel v2.2.1
 * Copyright 2013-2017 David Deutsch
 * Licensed under  ()
 */
//.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}

/*********
VARIABLES
*********/

$baseFontSize: 16px; // Henceforth known as 1em

$black: #000000;
$accent: #717983;
$tan: #ebb47a;
$light-grey: #f7f7f7;
$grey: #eeeeee;
$dark-grey: #979797;
$very-dark-grey: #5b5b5b;

$extrasmall: 320px;
$small: 480px;
$medium: 768px;
$largeIncTablet: 1024px;
$largeUpToTablet: 1024px;
$large: 1025px;
$extralarge: 1200px;

/********
FUNCTIONS
********/


@function em($target, $context: $baseFontSize) {
  @if $target == 0 {
    @return 0;
  }
  @return $target / $context + 0em;
}

$min: min-width;
$max: max-width;
@mixin at-query ($constraint_, $viewport1_, $viewport2_:null) {
 $constraint: $constraint_; $viewport1: $viewport1_; $viewport2: $viewport2_;
  @if type-of($constraint_) == number {
    $viewport1 : $constraint_; $viewport2 : $viewport1_; $constraint : null;
  }
  @if $constraint == $min {
    @media screen and ($min: $viewport1) {
      @content;
    }
  } @else if $constraint == $max {
    @media screen and ($max: $viewport1) {
      @content;
    }
  } @else {
    @media screen and ($min: $viewport1) and ($max: $viewport2) {
      @content;
    }
  }
}

/*****
GLOBAL
******/

html{
	background-color: #fff;
}


body {
 &.non-us {
  .afterpay-paragraph {
   display: none !important; 
  }
 }
}

/* Storemapper */

.store-locator-wrapper{
  	padding: 20px 20px 40px;
  	@include at-query ($min, $large) {
		padding: 90px 0 150px;
    }
  	text-align: center;
  hr{
  	width: 100px;
    margin: 30px auto;
  }
}

#store-locator{
  .main-content{
  	background-color: $light-grey;
  }
  #storemapper{
      padding-bottom: 20px;
      margin-bottom: 0;
      @include at-query ($min, $large) {
      	padding-bottom: 150px;
      }
      .rte{
      	margin-bottom: 0;
      }
      .storemapper-loader-marker{
      	fill: #000000;
      }
      .storemapper-loader-shadow{
      	fill: #cccccc;
      }
      a{
      	color: #000000;
      }
      &.show_icons {
        .storemapper-popup-address svg,
    	.storemapper-popup-phone svg,
        .storemapper-popup-url svg{
       		fill: #000000;
        }
      }
      #storemapper-form{
        box-shadow: none;
        padding: 0 8px;
        #storemapper-zip{
            width: 60%;
            float: left;
            margin-right: 5%;
        }
		#storemapper-go{
            width: 35%;
            float: left;
			margin-top: 0;
            background-color: #000;
           	text-transform: none;
          	border-radius: 30px;
        }
      }
      #storemapper-list{
          clear: both;
    	  padding-left: 8px;
	      padding-right: 8px;
          background-color: transparent;
         li{
        	box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2);
           svg{
           	fill: #000000;
           }
           .storemapper_view a, .storemapper_directions a{
           	color: #000000;
             border-color: #000000;
           }
           p{
           	font-size: 14px;
           }
           &.storemapper-selected{
           	 background-color: #ffffff;
             box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2);
             .storemapper_view a, .storemapper_directions a{
             	background-color: #ffffff;
             }
             h4, p{
             	color: #000000;
               svg{
               	fill: #000000;
               }
             }
           }
        }
      }
  }
}


/* Owl */

.owl-carousel{
 	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.owl-prev, .owl-next{
  position: absolute;
  top: 50%;
  margin-top: -9px;
  z-index: 2;
  &.disabled {
    opacity: 0.2;
  }
}

.owl-prev{
	left: 3%;
}

.owl-next{
	right: 3%;
}

.owl-dots{
	position: absolute;
  	bottom: 5%;
  	left: 0;
	width: 100%;
	z-index: 2;
	text-align: center;
    .owl-dot {
      width: 8px;
      height: 8px;
      border-radius: 20px;
      background-color: #fff;
      display: inline-block;
      margin: 0 5px;
      opacity: 0.6;
      &.active{
      	opacity: 1;
      }
    }
}


/*********
SECTIONS
*********/


/* Hero Slideshow */

li.homepage-content-slider{
	margin-bottom: 0;
}


/* Rich Text */

.homepage-featured-rich-text{
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.light-text-theme{
	color: #fff;
  	> div{
      padding: 80px 30px;
      @include at-query ($min, $medium) {
	      padding: 50px;
      }
      @include at-query ($min, $large) {
      	padding: 100px;
      }
      @include at-query ($min, $extralarge) {
      	padding: 130px 300px;
      }
    }
  h2{
  	color: #fff;
  }
}

.shopify-section .homepage-sections-wrapper--dark{
	background-color: black;
}

.shopify-section .homepage-sections-wrapper--dark h2{
	color:white;
}

.shopify-section .homepage-sections-rich-text-wrapper{
	padding: 125px 0 135px 0;
	@include at-query ($min, $medium) {
		padding: 100px 0;
	}
  	@include at-query ($min, $large) {
		padding: 200px 0;
	}
}

.template-collection .shopify-section .homepage-sections-rich-text-wrapper,
.template-list-collections .shopify-section .homepage-sections-rich-text-wrapper{
	padding: 70px 0;
  	@include at-query ($min, $large) {
		padding: 100px 0;
	}
}

.homepage-featured-rich-text{
  	.rte{
    	margin: 0 auto;
      	max-width: 650px;
        @media only screen and (max-width: 767px) {
          padding: 0 20px;
        }
    }
  	.homepage-sections--title{
    	max-width: 650px;
      	margin-left: auto;
      	margin-right: auto;
    }
}


/* Video */

.homepage-hero-content--video{
	padding: 0;
}

.shopify-section .video-section.homepage-sections-wrapper--light{
	background-color: transparent;
}

/* Newsletter */

.shopify-section .newsletter--section{
  padding: 80px 0;
  @include at-query ($min, $large) {
    padding: 100px 0
  }
  p{
  	color: $black;
  }
  .grid__item{
	display: block;
  }
  .newsletter--section--grid_inner.newsletter_title{
    float: none;
  }
}


form#contact_form #newsletter-wrapper{
  #newsletter_submit{
	background-color: #fff;
    float: left;
    height: 50px;
    border-radius: 0;
    text-align: right;
    padding-right: 1em;
    width: 28%;
    @include at-query ($min, $large) {
    width: 20%;
    }
  }
  #newsletter_text{
	height: 50px;
    float: left;
  }
}


/* Media Review */

.shopify-section.homepage-section--media-reviews .homepage-sections-wrapper{
	text-align: center;
	padding: 70px 0;
	@include at-query ($min, $large) {
		padding: 100px 0;
	}
}

.owl-carousel.owl-carousel-media-reviews {
  margin-top: 40px;
  @include at-query ($min, $large) {
  	margin-top: 80px;
  }
  padding: 0 2em;
  .owl-item {
  	text-align: center;
	  img{
		width: auto;
        max-width: 230px;
        height: auto;
        margin: 0 auto 1em;
        @include at-query ($min, $large) {
	    	margin: 0 auto 2em;
        }
  	}
  }
	.owl-prev{
		left: -1%;
	}
	.owl-next{
		right: -1%;
	}
}

/* Two Column CTA */

.shopify-section .homepage-sections-wrapper--white.two-column-cta{
  padding: 70px 0 100px;
  @include at-query ($min, $large) {
    padding: 80px 0;
  }
  text-align: center;
  .two-column-cta-image{
    max-width: 240px;
    @include at-query ($max, $small) {
    	max-width: 220px;
    }
    height: auto;
	margin: 0 auto 1.5em;
  }
  .grid__item{
    .two-column-cta-inner{
      padding: 0 1em;
    }
    @include at-query ($max, $small) {
	    &:last-child{
    		.two-column-cta-inner{
		      margin-top: 6.5em;
    		}
    	}
    }
  }
  .btn{
  	margin-top: 1em;
  }
}

/* Awards Bar */

.shopify-section .homepage-sections-wrapper.awards-bar--section{
	text-align: center;
	@include at-query ($max, $small) {
      padding: 90px 0 50px;
  	}
  .wrapper.wrapper-small{
  	max-width: 720px;
  }
  .awards-bar-image{
  	max-width: 127px;
    height: auto;
    margin: 0 auto 1.5em;
    @include at-query ($max, $small) {
    	margin: 0 auto 0.75em;
      	width: 100%;
    }
  }
  p{
  	font-size: 0.75em;
    margin-bottom: 0;
    @include at-query ($max, $small) {
    	margin-bottom: 60px;
    }
  }
}

/* Collection List */

.shopify-section .homepage-sections-wrapper--collection-list{
	padding: 90px 0 100px;
  	width: 100%;
	@include at-query ($min, $medium) {
		padding: 100px 0;
    }
	@include at-query ($min, $large) {
		padding: 100px 0;
	}
  	.collection-item__title{
    	font-size: 1.125em;
      /*&:after{
      	content: "";
        width: 90px;
        height: 1px;
        background-color: $dark-grey;
        display: block;
    	text-align: center;
	    margin: 1em auto;
      }*/
    }
  	.collection-item__image{
      margin-bottom: 1em;
     @include at-query ($min, $large) {
		margin-bottom: 2em;
	 }
  	}
}

.owl-carousel.owl-carousel-collection-list{
	padding: 0 2em;
  	.owl-prev{
		left: -1%;
	}
	.owl-next{
		right: -1%;
	}
}

/* Image with text */

.template-index .homepage-featured-content-box{
	background-color: transparent;
  	@include at-query ($max, $medium) {
		width: 100%;
	    /*position: absolute;
    	top: 50%;
	    transform: translateY(-50%);*/
    	z-index: 1;
	    left: 0;
    	right: 0;
    }
}

.homepage-featured-content-box{
	background-color: transparent;
}

.homepage-featured-content-box-inner p, .homepage-map-content-box-inner p{
	@include at-query ($max, $small) {
    	font-size: 14px;
    }
}

.image-with-text-overlay-wrapper .homepage-featured-content-box{
	background-color: transparent;
}
.image-with-text-overlay-wrapper--white h2.homepage-sections--title, .image-with-text-overlay-wrapper--white .homepage-sections--title.h2, .image-with-text-overlay-wrapper--white .featured-row__subtext{
	color: #fff;
}
.homepage-featured-content-box {
  h2 {
    @include at-query($max, $medium) {
      font-size: 1.2em !important;
      padding-bottom: 0 !important;
    }
  }
}
.image-with-text-overlay-wrapper--white h2.homepage-sections--title, .image-with-text-overlay-wrapper--white .homepage-sections--title.h2, .image-with-text-overlay-wrapper--white .featured-row__subtext{
	color: #fff;
}
.image-with-text-overlay-wrapper--white .homepage-featured-box-btn{
	color: $black;
  	background-color: #fff;
  	border-color: #fff;
}

@include at-query ($max, $large) {
  .image-with-text-overlay-wrapper--white-mobile h2.homepage-sections--title, .image-with-text-overlay-wrapper--white-mobile .homepage-sections--title.h2, .image-with-text-overlay-wrapper--white-mobile .featured-row__subtext{
      color: #fff;
  }
  .image-with-text-overlay-wrapper--white-mobile .homepage-featured-box-btn{
      color: $black;
      background-color: #fff;
      border-color: #fff;
  }
}

@include at-query ($max, $large) {
  .image-with-text-overlay-wrapper--dark-mobile h2.homepage-sections--title, .image-with-text-overlay-wrapper--dark-mobile .homepage-sections--title.h2, .image-with-text-overlay-wrapper--dark-mobile .featured-row__subtext{
      color: $black;
  }
  .image-with-text-overlay-wrapper--dark-mobile .homepage-featured-box-btn{
      color: $black;
      background-color: transparent;
      border-color: $black;
  }
}

.image-with-text-content{
	padding: 60px 30px 90px;
  	@include at-query ($min, $medium) {
  		padding: 30px 100px;
    }
	text-align: left;
	h2.homepage-sections--title{
    	text-align: left;
    }
}

.image-with-text-image{
	max-height: 458px;
}

.homepage-video-play-button{
	left: 15px;
	margin: 0 auto 0 auto;
}

.template-page .video-section{
  margin-top: 70px;
}

.video-section.wrapper{
	@include at-query ($max, $small) {
      padding: 0;
	}
}

/* Team */

.clearfix.mobile-only{
  @include at-query ($min, $largeIncTablet) {
	display: none !important;
  }
}

.team-content{
	padding: 0 1em;
}

.shopify-section .homepage-sections-team-wrapper{
	padding: 50px 0 70px 0;
	@include at-query ($min, $medium) {
		padding: 100px 0;
	}
  	.wrapper.wrapper-medium{
      	padding: 0;
      	@include at-query ($min, $medium) {
    		padding: 0 120px;
        }
    }
  

}




.homepage-featured-team--members{
  	text-align: center;
	@include at-query ($max, $medium) {
   		padding: 0 15px !important;
    }
	.rte{
    	margin: 0 auto 30px;
      	max-width: 650px;
    }
}

.team-image{
  	background-size: cover;
  	background-position: center center;
	width: 140px;
  	height: 140px;
  	border-radius: 100%;
  	margin: 25px auto 25px;
	@include at-query ($max, $extrasmall) {
   		width: 125px;
  		height: 125px;
    }
  	@include at-query ($min, $medium) {
   		margin: 50px auto 25px;
		width: 150px;
	  	height: 150px;
    }
}

.team-member-title{
	font-weight: 700;
  	color: $black;
}

/* Career */

.homepage-featured-career{
  @extend .homepage-featured-team--members;
}

.career-image{
  @extend .team-image;
  	width: 50px;
  	height: 50px;
  	margin: 0 auto 20px;
}

.career-title{
  @extend .team-member-title;
}

.career-text{
	font-size: 12px;
  	@include at-query ($max, $small){
    	font-size: 14px;
    }
}

.career-block{
  	padding: 30px 20px;
  	@include at-query ($max, $small){
	    padding: 30px 30px;
    }
  	min-height: 300px;
  	//@include at-query ($min, $medium){
		background-color: $grey;
    //}
}

.career-items-wrap{
	padding-top: 30px;
  	padding-bottom: 15px;
    @include at-query ($max, $small){
        padding-top: 0;
      	padding-bottom: 0;
    }
}

.owl-carousel.owl-carousel-careers{
  @include at-query ($min, $medium){
	display: block;
  }
  .owl-next {
  	right: 2%;
  }
  .owl-prev {
  	left: calc(2% + 30px);
  }
}

.all-careers-btn{
	margin-top: 50px;
}

.career-blog-wrap{
  	margin: 60px auto;
	text-align: center;
    @include at-query ($max, $small){
        margin: 60px auto 30px;
    }
  	h3{
      font-weight: normal;
      margin-bottom: 30px;
    	&:before{
        	content: '';
          	width: 100px;
          	height: 1px;
          	background-color: $dark-grey;
          	display: block;
          	margin: 0 auto 30px;
            @include at-query ($max, $small){
            	margin: 0 auto 70px;
            }
        }
    }
}

/* Slideshow */

.slideshow-item{
  	height: 700px;
	height: 90vh;
	max-height: 700px;
  	background-size: cover;
  	background-position: center center;
   	@include at-query ($max, $small){
    	height: 80vw;
      	max-height: 210px;
    }
}

/* Contact Page */

.contact-page--image{
	padding: 70px 30px;
  	text-align: center;
  	background-size: cover;
  	background-position: center center;
  	color: #fff;
  	h2{
	    color: #fff;
    }
  	.rte{
  		margin-bottom: 0;
  	}
}

.grey-bar-container{
	text-align: center;
}
.grey-bar{
    text-align: center;
  	border-radius: 50px;
    color: #fff;
    padding: 12px 32px;
    background-color: $very-dark-grey;
  	margin: 0 auto 100px;
  	font-size: 0.875em;
	display: inline-block;
  	@include at-query ($max, $small){
    	padding: 20px 25px;
      	margin: 0 auto 65px;
    }
  	a{
    	color: #fff;
	    text-decoration: underline;
    }
}

.contact-page--item-inside{
	margin-top: 2.5em;
}

.contact-page--item{
/* 	text-align: center; */
  	margin-bottom: 85px;
  	padding-left: 0;
  	@include at-query ($max, $small){
    	margin-bottom: 45px;
  	}
  	strong{
    	color: $black;
    }
}

.contact-page--icon{
	background-color: $very-dark-grey;
  	color: #fff;
  	border-radius: 10px;
  	padding: 25px 30px;
  	margin-bottom: 30px;
    img{
    	float: left;
      	margin-right: 20px;
    }
  	span{
    	line-height: 30px;
/*       	float: left; */
      	display: inline-block;
      	font-size: 18px;
      	font-weight: 700;
      	position: relative;
      	padding-left: 30px;
      	&:before{
        	content: '';
          	width: 30px;
          	height: 30px;
          	position: absolute;
          	display: block;
          	top: -2px;
          	left: -10px;
          	background-size: cover;
        }
    }
}

.contact-page--form{
	border-bottom: 1px solid $dark-grey;
  	padding-bottom: 60px;
  	margin-bottom: 60px;
  	padding-left: 0;
  	@include at-query ($max, $small){
    	padding: 0 0 30px !important;
      	margin-bottom: 50px;
      	margin-top: 0 !important;
  	}
}

.contact-form--submit-button{
	text-align: left;
}

.newsletter-footer input.footer-email-submit, form#contact_form .btn, form#contact_form .btn--secondary, .btn--secondary, .cart--button-checkout, .cart--button-update, .btn--full, .article-comment--btn, .account-section--btn{
	color: $black;
  	&:focus{
    	color: $black;
        &:hover{
    		color: #fff;
    	}
    }
}

/* Customer */

.customer-page{
	padding: 70px 0;
  	@include at-query ($max, $medium){
	    padding: 30px 30px 80px;
    }
}

/* BLOG */

.blog-main--wrapper{
  padding-bottom: 60px;
  @include at-query ($max, $medium){
  	padding-bottom: 30px;
  }
  hr{
    margin: 60px 0;
    @include at-query ($max, $medium){
	    margin: 30px 0 40px;
    }
  }
}

.blog-template--secondary-text-wrap{
  	@include at-query ($max, $medium){
		margin-bottom: 30px;
    }
}

.blog-template--main{
	h2{
    	margin-bottom: 0.5em;
    }
  	.rte{
		color: $very-dark-grey;
      	margin-bottom: 25px;
    }
  	.author{
      	color: $dark-grey;
      	font-size: em(14px);
  	}
  	.article__featured-image{
      	display: block;
    	img{
          display: block;
      	  margin: 0;
        }
    }

}

.blog-template--hero{
	padding: 70px 0 0;
  	@include at-query ($max, $medium){
    	padding: 30px 0 0;
    }
  .blog-template--hero-text{
  	padding-left: 20px;
  	@include at-query ($max, $medium){
    	padding: 0;
    }
  }
}
.blog-sidebar--meta{
	text-transform: uppercase;
  	li {
      margin: 10px 0 20px;
      @include at-query ($max, $medium){
          margin: 15px 0 5px;
      }
      a{
	    color: $dark-grey;
        font-size: em(14px);
        font-weight: 700;
        letter-spacing: 1px;
      }
    }
}

.blog-template--title{
	padding-top: 40px;
}

.blog-template--secondary{
	background-color: #fff;
  	padding: 30px;
  	text-align: center;
}

.blog-template--tertiary{
	margin-bottom: 60px;
  	@include at-query ($max, $medium){
    	margin-bottom: 30px;
  	}
}

.blog-filter{
	text-align: center;
  	margin: 30px 0 60px 0;
  	font-size: em(25px);
  	@include at-query ($max, $medium){
    	font-size: em(16px);
      	margin: 30px 0 30px 0;
  	}
  	select{
    	border: 0;
      	font-size: 25px;
      	border-bottom: 1px solid $dark-grey;
        @include at-query ($max, $medium){
            font-size: em(16px);
        }
    }
}

/* Article */

.article-header{
	text-align: center;
  	padding: 70px 0 300px;
  	@include at-query ($max, $medium){
	    padding: 30px 0 150px;
    }
  	.blog-sidebar--meta li{
    	margin-bottom: 10px;
    }
  	span.author{
    	color: #979797;
	    font-size: em(14px);
    }
}

.related-posts{
  	padding: 70px 0;
	text-align: center;
  	@include at-query ($max, $medium){
    	padding: 30px 0;
  	}
	.grid__item{
      @include at-query ($max, $medium){
          margin-bottom: 45px;
      }
    }
	.h4{
    	color: $black;
      	font-weight: 700;
    }
  	.related-posts-header{
      	margin-bottom: 40px;
    }
  	.article--image-wrapper{
      padding-bottom: 0;
  	}
  	.blog-sidebar--meta li{
    	margin-bottom: 10px;
    }
  	span.author{
    	color: #979797;
	    font-size: em(14px);
    }
}

#shopify-section-article-template{
  .blog-main--wrapper{
      padding-top: 0;
      position: relative;
      margin-top: -250px;
      @include at-query ($max, $medium){
      	margin-top: -100px;
      }
  }
}
/* SLICK */

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.slick-list {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
    padding: 0;

    &:focus {
        outline: none;
    }

    &.dragging {
        cursor: pointer;
        cursor: hand;
    }
}
.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;

    &:before,
    &:after {
        content: "";
        display: table;
    }

    &:after {
        clear: both;
    }

    .slick-loading & {
        visibility: hidden;
    }
}
.slick-slide {
    float: left;
    height: 100%;
    min-height: 1px;
    [dir="rtl"] & {
        float: right;
    }
    img {
        display: block;
    }
    &.slick-loading img {
        display: none;
    }

    display: none;

    &.dragging img {
        pointer-events: none;
    }

    .slick-initialized & {
        display: block;
    }

    .slick-loading & {
        visibility: hidden;
    }

    .slick-vertical & {
        display: block;
        height: auto;
        border: 1px solid transparent;
    }
}
.slick-arrow.slick-hidden {
    display: none;
}

/* Pop up */

#orbitkey-popup{
  max-width: 480px;
  border-radius: 50px;
  padding: 60px 35px 50px 110px;
  @include at-query ($max, $medium) {
	padding: 60px 35px 50px 35px;
  }
  h1{
  	font-size: 30px;
    margin-bottom: 30px;
    span{
    	color: #acacac;
    }
  }
  p{
  	font-size: 14px;
    color: $black;
    margin-bottom: 10px;
/*     display: flex; */
    line-height: 1.5;
    strong{
    	margin-right: 15px;
    }
  }
  img.orbitkey-popup-icon{
  	position: absolute;
    left: 35px;
    top: 60px;
    max-width: 52px;
    @include at-query ($max, $medium) {
      display: none;
  	}
  }
  button.mfp-close{
    color: black;
    opacity: 1;
    font-size: 40px;
    right: 20px;
    top: 20px;
  }
}

a[href="#orbitkey-popup"]:not(.mobile-popup-btn):before{
  	content: 'i';
	background-color: black;
    border-radius: 20px;
    width: 18px;
    height: 18px;
    display: inline-block;
    color: white;
    text-align: center;
    font-size: 12px;
    line-height: 18px;
  	position: absolute;
    left: -8px;
    top: 13px;
  	@media (min-width: 768px) {
     left: -24px;
    }
  	@include at-query ($max, $medium) {
      display: none;
  	}
}
.mobile-popup-btn{
  	position: absolute;
    top: 22px;
    right: 52px;
    color: #000;
    z-index: 99999 !important;
    font-size: 12px;
	@include at-query ($min, $largeIncTablet) {
      display: none;
  	}
}

a[href="#orbitkey-popup"].mobile-popup-btn:before{
  	content: 'i';
	background-color: black;
    border-radius: 20px;
    width: 15px;
    height: 15px;
    display: inline-block;
    color: white;
    text-align: center;
    font-size: 10px;
    line-height: 15px;
  	position: absolute;
    left: -18px;
    top:2px;
  	@include at-query ($max, 320px) {
      display: none;
  	}
  	@include at-query ($min, $largeIncTablet) {
      display: none;
  	}
}


// Start of 4.2.1
.redirect-popup  {
  display: none;
  height: 100vh;
  width: 100%;
  z-index: 99999;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0,0,0,0.7);
  // display: flex;
  justify-content: center;
  align-items: center;
  // &__top {

  // }

  .grid {
    // fix.
    margin-left: 0 !important;
  }

  .wrapper-custom {
    @include at-query($min, $small) {
      max-width: 650px;
    }
    margin: 0 auto;
    padding: 0;

  }

  .grid__item {
    margin-top: 0;
  }
  .redirect-popup__top, .redirect-popup__bottom {
    padding: 40px 30px;
    @include at-query($min, $small) {
      padding: 60px 60px 40px 60px;
    }
  }


  .redirect-popup__top {
    position: relative;
    background-color: #262626;
    @include at-query($min, $small) {
      padding-bottom:60px;
    }
    h2, p {
      color: white;
    }
    h2 {
      margin-top: 0px;
      margin-bottom: 20px;
      font-size: 25px;
      line-height: 1.4;
      @include at-query($min,$small) {
        line-height: 37.2px;
        font-size: 31px;
      }
    }
    p {
      margin-bottom: 0;
      font-size: 16px;
      line-height: 1.4;
      @include at-query($min,$small) {
 		line-height: 19px;
        max-width: 75%;
      }
    }
    .close-btn {
      position: absolute;
      cursor: pointer;
      height: 23px;
      width: 23px;
      top: 20px;
      right: 20px;
      span {
        position: absolute;
        width: 23px;
        height: 2px;
        top: 50%;
        left: 50%;
        background-color: white;
      }

      span:first-child {
        transform: translate(-50%, -50%) rotate(45deg);
      }

      span:last-child {
        transform: translate(-50%, -50%) rotate(-45deg);
      }
    }
  }

  .redirect-popup__bottom {
    background-color: white;

  }
  .country {
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;

    &:first-child {
      align-items: flex-start;
      padding-left: 10px;
      @media screen and (min-width: 380px) {
        align-items: center;
      }
    }

    &:last-child {
      align-items: flex-end;
      padding-right: 10px;
      @media screen and (min-width: 380px) {
        align-items: center;
      }
    }
    a {
      cursor: pointer;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;

      img {
        height: 100%;
        margin: 20px 0;
        max-height:70px;
        @include at-query($min,$small) {
          max-height: 80px;
        }
        @include at-query($min, $medium) {
          max-height: 80px;
        }

      }

/*       .country__flag {
        padding: 10px 0;
      } */
      h3 {
        font-size: 18px;
        margin-bottom: 3px;
        @include at-query($min,$small) {
          line-height: 25px;
          margin-bottom: 10px;
        }
      }
      p {

        font-size: 16px;
        margin-bottom: 0;
        line-height: 1.4;
        @include at-query($min,$small) {
          line-height: 19px;
        }
      }
    }
  }
}

.flex {
  display: flex !important;
}
// End of 4.2.1

.slideshow-parent.homepage-sections-wrapper--dark {
  padding: 30.30303px 0;
}


/* Start of 4.2.2 */
.slideshow-parent.homepage-sections-wrapper--dark {
  padding: 30.30303px 0;
}

.product-details-wrapper {
  @media (min-width: 1200px) {
    padding: 80px 20px 20px;
  }
}




.homepage-sections-wrapper,.video-parent {
  .wrapper {
    @media (max-width: 769px) {
      padding: 0;
    }
  }
}

body.template-product {
  font-size: 14px;
  @media (min-width: 769px) {
    font-size: 16px;
  }

  h1.product-details-product-title {
    font-size: 1.675em;
    margin-bottom: 10px;
    @media (min-width: 769px) {
      font-size: 1.575em;
      margin-bottom: 10px;
    }
  }

  .money {
    font-size: 22px;
    color: black;
  }
  .wrapper-reviews {
    padding: 30px 20px 0;
  }

  .okeReviews-review-side,.okeReviews-review-primary,.okeReviews-reviewsAggregate-side {
   @media (max-width: 768px) {
   	padding: 0 !important;
   }
  }

  .okeReviews .okeReviews-starRating--small .okeReviews-starRating-indicator-layer {
    
  }

  .okeReviews-reviewsSummary-ratingCount {
    font-size: 12px;
    @media (min-width: 769px) {
      font-size: 14px;
    }
  }
  .product-single__photo-wrapper {
    margin-bottom: 20px !important;
  }

  .slick-slider {
    margin-bottom: 0;
  }

  .product-details-wrapper {
    @media (max-width: 769px) {
      padding-top: 0;
    }
  }

  .product-description {
      color: #666;
  }


  &.dark {
    .main-content {
      .header-section--wrapper .wrapper {
        background-color: white;
      }
      .total-product-wrapper,
      .total-product-wrapper .wrapper, .product-details-wrapper {
        background-color: #2d2d2d;

      }

      .ar_block {
        background-color: #1d1d1d;

        h2,p,button {
          color: white;
        }

        button {
         background-color: #2d2d2d !important;
        }
      }

      input:not(.js-qty__num,.ajaxcart__qty-num) {
        background-color: #1d1d1d;
        border: none;
      }

      .bold_option_total {
        div {
          background: #1d1d1d;
        }
      }

      .money:not(.ajaxcart-item__price .money,.ajaxcart__subtotal .money) {
        color: #a6a6a6 !important;
      }

      .wrapper,.product-benefits,[id^="shopify-section-product-template"], [id^="shopify-section-template--"] ,.video-parent,.homepage-sections-wrapper--dark, .three-column-block {
        background-color: rgb(29,29,29);
        &:not(.wrapper-reviews) {
          h1,h2,h3,h4,h5,h6, p, span, input,.color-switch-header {
            color: white;
          }
        }
      }

      .accordion-content li, .accordion-content p, .accordion-content span, .accordion-content a {
        color: white !important;
      }

      .accordion-toggle span {
        color:  rgb(187,129,87) !important;
      }
      .product-single #AddToCart {
        background-color: rgb(187,129,87);
      }

      .key-highlights_block p {
        
      }
      .wrapper-reviews {
        background-color: white;
      }

      .okeReviews-reviewsSummary-ratingCount {
        color: #a6a6a6;
        @media (max-width: 769px) {
          margin-top: 7px;
        }
      }

    }
  }

  .site-footer {
    background-color: #1d1d1d;
  }
}

[id^="shopify-section-product-template"], [id^="shopify-section-template--"] {
  .product-details-wrapper {
    text-align: left;
    

    #location-redirect-message {
      margin-bottom: 20px;
    }
  }
}

.swatch .swatch-element label {
  width: 30px !important;
  height: 30px !important;
}



.highlight-heading {
  text-align: center;
  margin: 30px 0 25px 0;

  font-size: 0.975em;
}
.key-highlights {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
  @media (min-width: 768px) {
    justify-content: center;
  }
  @media (min-width: 960px) {
    justify-content: space-between;
  }
  .key-highlights_block {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    flex-basis: calc(100% / 3);
    @media (min-width: 768px) {
      flex-basis: calc(100% / 2 - 10px);
    }
    @media (min-width: 960px) {
      flex-basis: calc(100% / 3 - 20px);
    }


	img {
     max-width: 80px;
     width: 100%;
    }
    p {
      margin-top: 15px;
      font-size: 14px;
      line-height: 1.6;
      max-width: 80%;
      text-align: center;
    }
  }
}
.color-switch-header {
  @media (max-width: 769px) {
    font-size: 0.65em;
  }
}
.btn.disabled {
  background-color: transparent !important;
}
.warranty {
  display: block;
  text-align: center;
  font-size: 0.75em;
  margin: 15px 0 15px 0;
}
.accordion-toggle {

  &:first-child {
    @media (min-width: 768px) {
      margin-top: 40px;
    }
  }
  text-align: left;
  .eta {
    display: inline-block;
  }

  img {
    max-width: 30px;
  }

  border-top: none;
  padding-top: 0;
  margin-bottom: 0;
  margin-top: 0.75em;
  &:not(:last-child) {
    padding-bottom: 0.55em;
    border-bottom: 1px solid #eee;
    @media (min-width: 768px) {
		padding-bottom: 0.75em;
    }
  }
}

.accordion-toggle.shipping, .accordion-toggle.returns {
  img {
    float: left;
    margin-right: 10px;
    @media (min-width: 768px) {
      margin-top: 2px;
    }
  }
}
h5 {
  @media (max-width: 769px) {
    font-size: 0.925em;
  }
}

.homepage-collections-background .collection-grid,.media-reviews--section--grid {
  overflow: unset;
}

.homepage-sections-wrapper,.video-parent {
  .wrapper {
    @media (min-width: 480px) and (max-width: 769px) {
      padding: 0;
    }
  }
}
.template-product .swatch-element.soldout:before {
  background-size: 20px 20px;
  @media (min-width: 480px) and (max-width: 1025px) {
    top: 5px;
    left: 7px;
  }
  @media (min-width: 1025px) {
    width: 33px;
    height: 30px;
  }

}

.homepage-sections--subheading {
    margin-bottom: 0.5em;
    font-size: 1.1em;
    color: #636363 !important;
}
.thumbnail-images {
  display: none;
  @media (min-width: 769px) {
    display: block;
  }
}



.single-image_slider {
  .slick-slide {
    outline: none;
  }
  
  .pull-right {
    right: 0;
    z-index: 2;
  }

  .pull-left {
    left: 0;
    z-index: 2;
  }
  .slick-arrow {
    &::before {
      content: unset;
    }

    .fa-angle-right,.fa-angle-left {
      &::before {
        color: #000;
        opacity: 0.6;
        font-size: 50px;
      }
    }
  }

  .slick-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    position: unset;
    bottom: unset;
    margin-top: 10px;
    li {
      height: unset;
      margin-bottom: 0;
      margin: 0px 3px;
        button {
          background-color:  #636363;
          width: 6px;
          height: 6px;
          border-radius: 100%;
          padding: 4px;
          &::before {
            content: unset;
          }
      }
      &.slick-active {
          button {
            width: 12px;
            height: 12px;
          }
      }
    }
  }
}


.thumbnail-nav {
  img {
    cursor: pointer;
  }
}
.okeReviews--theme {
  margin-top: 10px;
  @media (min-width: 769px) {
    margin-top: 20px;
  }
}
// .3d-model,.yt-iframe {
//   display: flex;
//   width: 100%;
//   height: 100%;
//   flex-direction: column;

// }




.video_preview {
  position: relative;
  width: 100%;
  height: 470px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  @media (min-width: 768px) {
    height: 520px;
  }
  @media (min-width: 1024px) {
    height: 669px;
  }

  .play-btn {
    position: absolute;
    background-image: url('https://cdn.shopify.com/s/files/1/0932/4482/files/product-video-play-btn.png?v=1605830248');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100px;
    height: 100px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
  }


}

.media-video {

  video {
  	outline: none;
    width: 100%;
  }
}

// .yt-iframe {
//   position: relative;

//   .slider_video  {
//     position: absolute;
//     width: 100%;
//     height: 100%;
//     top: 0;
//     left: 0;
//     &.hide {
//       visibility: hidden;
//     }

//   }
// }

.slider_video, .slider_model {
  height: 470px;
  @media (min-width: 768px) {
    height: 520px;
  }
  @media (min-width: 1024px) {
    height: 669px;
  }


}

.specs {
 .specs__list {
  ul {
    padding: 0;
    margin: 5px 0 15px;
   li {
    margin-left: 20px;
    &:first-child {
     list-style: none;
     margin-left: 0;
    }
   }
  }

 }
}

.slick__slider {
  div {
   text-align: unset;

   a {
    display: inline-block;
   }
  }
}

.slick-slide, .slick-slide a {
 outline: none;
}


.nav__slider_wrap {
 position: relative;
 margin: 0 auto;


  @media (min-width: 1024px) {
   max-width: 850px;
  }

  @media (min-width: 1025px) {
   max-width: 1140px;
  }


 .nav__slider_arrow_left,.nav__slider_arrow_right {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  max-width: 19px;
  z-index: 5;
  cursor: pointer;
 }

 .nav__slider_arrow_left {
  left: 0;

 }

 .nav__slider_arrow_right {
  right: 0;
 }
}

.carousel-mega-menu-image {
 max-width: 200px;
 width: 100%;
}

.homepage-sections-wrapper--collection-list {
 overflow-x: hidden;
}


/*  override flex  */
.hero-slider {
 display: block !important;
}

.collection-grid,.media-reviews--section--grid {
 overflow: hidden;
}

.mobile-grid--table .grid__item:first-child .site-nav--mobile {
  @media (max-width: 520px) {
   display: flex;
   align-items: center;
  }
  
}

.site-nav--mobile {
  padding: 10px 0 10px;
  @media (min-width: 768px) {
  	padding: 10px 15px 10px 0;    
  }

 .site-nav__link {
  padding: 0;  
 }

}



.burger {
 position: relative;
 width: 26px;
 height: 20px;
 cursor: pointer;
 z-index: 10;

 span {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
   height: 2px;
   width: 100%;
   background-color: $black;
   transition: all 0.3s ease;
   &:first-child {
     top: 0;

   }

   &:nth-child(2) {
     top: 50%;
     transform: translate(-50%,-50%);
   }

   &:last-child {
   	top: 100%;

   }



 }

 &.active {
	span {
	   left: 50%;
       &:first-child {
		  top: 50%;
          transform: translate(-50%, -50%) rotate(45deg);
       }

       &:nth-child(2) {
             opacity: 0;
       }

       &:last-child {
          top: 50%;
          transform: translate(-50%, -50%) rotate(-45deg);

       }

   }

 }

}

.wrapper-reviews {
   margin: -25px auto 0;
   @media (min-width: 768px) {
	 margin: -10px auto 0;
   }

   @media (min-width: 1024px) {
     margin: -45px auto 0
   }

}


.swatch.size .swatch-element.soldout {
  &::after {
    content: '';
    position: absolute;
    width: 80%;
    height: 1px;
    background-color: white;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
  }
}
/* End of 4.2.2 */


.afterpay-paragraph,.afterpay-link-inner{
	margin-top: 0 !important;
  	margin-bottom: 0 !important;
  	color: #666;
  	font-size: 13px !important;
  	@media (min-width: 520px) {
      font-size: 14px !important;
    }
}

.afterpay-paragraph {
/*     display: flex; */
/*   	align-items: center; */
}
.afterpay-logo{
	margin: 0 2px;
   height: auto;
   width: 85px !important;
}

.afterpay-text1, .afterpay-text2{
  color: #666;
}
.afterpay-instalments{
  color: black;
  margin-left: 3px;
}

#AddToCartForm #ProductPrice{
  @media (max-width: 767px) {
	font-size: 25px;
  }
}

/* 4.3.0 swatch filter intergration */
.alt-available {
	text-decoration: none !important;
    opacity: 1 !important;

     &::after {
      content: none;
     }
}

/* store location update */


/* Location page and AR module */

.ar_block {

/*   padding: 0 20px 30px 20px; */

  &.dark {
   background-color: black;

   h2,p,button {
  	color: white;
   }

   button {
    background-color: #2d2d2d !important;
   }

   .wrapper {
     background-color: transparent;
   }
  }


  .wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column-reverse;
	padding: 60px 0;
    margin: 0;

    @media (min-width: 860px) {
     background-color: #f7f7f7;
	 border-radius: 35px;
	 margin: 0 auto;
     padding: 0;
/*      padding-bottom: 60px; */
     flex-direction: row-reverse;
     justify-content: space-between;


    }

    .content {
      display: flex;
      align-items: center;
      flex-direction: column;
      flex-basis: 50%;
      padding: 40px 20px 0;
      @media (min-width: 768px) {
	    padding: 30px 100px;
      }
      h2 {
        margin-bottom: 10px;
      }

      p {
          margin-bottom: 35px;
      }
      @media (min-width: 768px) {
        align-items: flex-start;
      }

      .ar_btn {
        background-color: black;
        padding: 7px 20px;
        letter-spacing: 1px;
        font-size: 16px;
        border-radius: 1.875rem;
        font-weight: 700;
        display: flex;
        color: white;
        justify-content: space-between;

        img {
         max-width: 30px;
         margin-left: 8px;
        }
      }
    }
    .image_block {
      padding-top: 10px;
      width: 100%;
	  max-width: 420px;
      margin-bottom: 30px;
	  margin-top: 0;
      @media (max-width: 438px) {
      	background-color: #f7f7f7;
      }

      @media (min-width: 768px) {
      	margin-bottom: 0;
        margin-top: 45px;
      }


      .image {
        background-size: contain;
        background-position: bottom;
        background-repeat: no-repeat;
        width: 100%;
        padding-top: 100%;
      }
    }


  }
}

.location {
 h2 {
   text-align: center;
   margin-bottom: 10px;
   @media (min-width: 768px) {
   	margin: 70px 0 50px;
   }
 }
 .location__banner {
   padding: 90px 0;
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
   margin-bottom:90px;
   padding-left: 30px;
   padding-right: 30px;
   margin-right: 30px;
   margin-left: 30px;


   @media (max-width: 768px) {
    padding-left: 30px;
    padding-right: 30px;
    margin-right: 30px;
    margin-left: 30px;
    margin-bottom: 30px;
   }

   @media (max-width: 480px) {
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 20px;
    margin-right:20px;
    margin-left:20px;
   }

   h1 {
   	text-align: center;
   }


 }

  .location__map {
	margin: 80px 0;
    &.no-m-top {
     margin-top: 0 !important;
    }

    #stockist-widget {
     margin: 0;
    }


  }

  .location__slider {
    .wrapper {
     @media (max-width: 1310px) {
       padding: 0;
     }
    }
    .slider {
	  .slider__block {
        .slider__image {
         width: 100%;
          padding-top: 56.25%;
          background-size: cover;
          background-position: center;
          background-repeat: no-repeat;
        }
      }

    }
  }

  .location__logos {
    margin: 75px 0;

    h2 {
     margin-top: 0;
    }



    .wrapper {
      position: relative;

      .arrow_left,.arrow_right {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
		width: 13px;
        cursor: pointer;
        display: block !important;
        z-index: 10;
      }

      .arrow_left {
        left: 20px;
       @media (min-width: 480px) {
       	left: 30px;
       }

      }

      .arrow_right {
        right: 20px;
       @media (min-width: 480px) {
       	right: 30px;
       }

      }
    }



    .logos_slider  {
      padding: 0 20px;
      .logos__block {
        min-height: 90px;
        display: flex;
        justify-content: center;
        align-items: center;

        img {
          margin: 0 auto;
          max-height: 65px;
          max-width: 80%;

          @media (min-width: 768px) {
            width: auto;
            height: auto;
          }
        }
      }
    }
  }

  .location__banner_link {
    position: relative;
	display: block;

    @media (max-width: 768px) {
     padding-top: 20px !important;
     padding-left: 30px;
     padding-right: 30px;
    }

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

    h2 {
     margin-top: 0;
     margin-bottom: 1em;
    }

  }
}




/* Newsroom */


  .newsroom__title {
   margin-bottom: 20px;
   @media (min-width: 768px) {
     height: 1em;
     margin-bottom: 34px;
   }
  }

  .newsroom__bar {
    background-color: white;
    padding: 10px 0 0;
    @media (min-width: 1024px) {
    	padding: 18px 0;
    }

    .wrapper {
     display: flex;
     flex-direction: column;
     max-width: 1280px !important;

     &::after {
      content: unset;
     }

     @media (min-width: 768px) {
       flex-direction: row !important;
	   justify-content: space-between;
       align-items: center;
     }

    }
  }

  .newsroom__heading {
    margin-bottom: 10px;
    line-height: 1;

    @media (min-width: 768px) {
      margin-bottom: 0;
    }
    
    a {
      font-size: inherit;
      line-height: inherit;
    }
  }

  .newsroom__tools {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .newsroom__search {

  }

  .newsroom__topic {
    color: #000;
    min-width: 130px;
    @media (min-width: 768px) {
      min-width: 170px;
    }


    .newsroom__label {
     position: relative;
     margin-bottom: 0;
     padding: 8px 10px;
     cursor: pointer;

      &:hover {
        .newsroom__topics {
          opacity: 1;
          transition: all 0.3s ease;
          z-index: 9;
        }
      }

    }

    .newsroom__topics {
      position: absolute;
      top: 100%;
      left: 0;
      display: flex;
      flex-direction: column;
      background-color: white;
      opacity: 0;
      z-index: -1;
      transition: all 0.15s ease;

      span {
        cursor: pointer;
        padding: 0 10px;

        &.selected {
         background-color: #2d2d2d;
         color: white;
        }

        &:hover {
         background-color: #2d2d2d;
         color: white;
        }
      }
    }

    select {
     display: none;
    }
  }


/* Duplicate styling around here be aware .. */
#shopify-section-newsroom-template, #shopify-section-newsroom-archive {
  background-color: #f7f6f7;
}
  .wrapper {
     &::after {
    content: none;
    }
  }
  .newsroom.archives {

    .newsroom__feed {
      display: block;



     }

     .newsroom__menu {
       display: flex;
       justify-content: space-between;
       align-items: center;
       margin-bottom: 20px;

       @media (min-width: 768px) {
         margin-top: 40px;
         margin-bottom: 34px;
       }
       h1 {
        margin: 0;
       }
     }


    .page--title.no-result {
      margin: 20px 0 40px;
    }



     .newsroom__year {
       margin-bottom: 15px;

       @media (min-width: 768px) {
          margin-bottom: 25px;
       }

     }

     .article {
       display: inline-flex;
       flex-wrap: unset;
       justify-content: flex-start;
       flex-direction: column;
       margin-bottom: 20px;
	   width: 100%;

       @media (min-width: 768px) {
         margin-bottom: 30px;
       }
       @media (min-width: 768px) {
        flex-direction: row;
       }

     }

     .article__content {
       min-height: unset;
       flex-basis: unset;
       background-color: unset;
       max-width: 550px;
       padding: 22px 28px;
       background-color: #fff;
       width: 100%;

       @media (min-width: 768px) {
        padding: 15px 0 15px 30px;
        background-color: transparent;
       }

       p {
        margin-bottom: 0;
       }

       .article__excerpt > * {
        font-style: normal;
       }
     }

     .article__image {
       flex-basis: unset;
       width: 100%;
       padding-top: 56.25%;


       @media (min-width: 768px) {
         max-width: 184px;
         padding-top: unset;
         height: 116px;
       }
     }


     .newsroom__pagination {
       width: 100%;
       display: flex;
       justify-content: center;
       align-items: center;
       padding: 40px 0;
       @media (min-width: 768px) {
         padding: 50px 0;
       }


       a {
     		font-style: normal;
       }

       span {
         margin: 0 4px;
         font-size: 15px;
         font-style: normal;
         &:not(:last-child) {
           margin-right: 18px;
         }

         &:not(span .current) {
           a {
            padding: 1px 5px;
           }
         }

         &.current {
           cursor: default;
           padding: 1px 5px;
       	   font-size: 15px;
           border: 1px solid black;
           color: black;

         }
       }
     }


    .pagination {

      li {

        &.active {
          border: 1px solid #000;
        }

        &:not(:last-child) {
       	  margin-right: 18px;
        }

      }

      a {
       font-weight: 400;
       padding: 1px 5px;
       font-size: 15px;
       background-color: transparent !important;

        &:hover {
         background-color: transparent !important;
        }
      }
    }

    .sitewide--title-wrapper {
      @media (min-width: 768px) {
     	padding: 40px 0;
      }

    }


  }



  .newsroom__feed {
    padding-top: 40px;
    padding-bottom: 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;

    &::after {
      content: '';
      flex-basis: calc((100% / 3) - 32px);
    }
  }

  a.article {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    flex-basis: 100%;
    height: 100%;
    margin-bottom: 30px;
    @media (min-width: 768px) {
      flex-basis: calc((100% / 2) - 20px);
      margin-bottom: 43px;
    }

    @media (min-width: 1024px) {
     flex-basis: calc((100% / 3) - 32px);
    }

    &.latest {
      flex-basis: 100%;
      .article__image {
       padding-top: 56.25%;

       @media (min-width: 768px) {
        flex-basis: 65%;
        padding-top: 40%;
       }

       @media (min-width: 1024px) {

       }
      }

      .article__content {
        display: flex;
        justify-content: center;
        flex-direction: column;


        @media (min-width: 768px) {
          flex-basis: 35%;
        }

        @media (min-width: 1024px) {
        }
      }
    }

    &.medium {
      flex-basis: 100%;
      @media (min-width: 768px) {
       flex-basis: calc((100% / 2) - 17px);
      }

      @media (min-width: 1024px) {
      }
    }
  }

  .article__image {
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding-top: 56.25%;
    flex-basis: 100%;
    @media (min-width: 768px) {
     max-height: 450px;
    }

    @media (min-width: 1024px) {

    }

  }

  .article__content {
    background-color: white;
    padding: 22px 28px;
    flex-basis: 100%;
    @media (min-width: 768px) {
     padding: 30px;
     min-height: 210px;
    }

  }

  .article__label {
    text-transform: uppercase;
	font-size: 11px;
    line-height: 13px;
    margin-bottom: 11px;

  }

  .article__heading {
  }

  .article__date {
	margin-top: 14px;
    font-size: 11px;
    line-height: 13px;
  }

  .newsroom__archives {
      .article {
      	flex-wrap: unset;
        justify-content: flex-start;
        flex-direction: column;
        margin-bottom: 20px;
        @media (min-width: 768px) {
          margin-bottom: 30px;
        }
        @media (min-width: 768px) {
         flex-direction: row;
        }

      }

      .article__content {
        min-height: unset;
        flex-basis: unset;
        background-color: unset;
        padding: 15px;
        width: 100%;
        @media (min-width: 768px) {
         padding: 15px 0 15px 30px;
        }

        p {
         margin-bottom: 0;
        }

        .article__excerpt > * {
         font-style: normal;
        }
      }

      .article__image {
        flex-basis: unset;
        width: 100%;
        padding-top: 56.25%;

        @media (min-width: 768px) {
          padding-top: unset;
          height: 116px;
          width: 184px;
        }
      }
  }

  /*  Archive  */

  .newsroom__archive {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
	padding: 30px 0 30px;
/*     margin-top: 40px; */

    @media (min-width: 768px) {
     padding: 20px 0 30px;
     margin-top: 0;
    }

    .newsroom__title {
     margin-top: 0;
    }

    &::before {
      content: '';
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      top: 0;
      height: 3px;
      background-color: #ccc;
      width: 100%;
      @media (min-width: 1024px) {
      	width: 808px;
      }
    }

    .archive__feed {
     width: 100%;

    }

    .article {
      max-width: 700px;
      margin: 0 auto;
      margin-bottom: 10px;

      @media (min-width: 768px) {
         margin-bottom: 20px;
      }

      .article__content {
        min-height: unset;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0;
        background-color: transparent;
        border-bottom: 1px solid #cccccc;
        flex-basis: unset;
        width: 100%;


        .article__heading {
         margin: 0;
         margin-bottom: 2px;
         @media (min-width: 1024px) {
          font-size: 14px;
          line-height: 16px;
         }
        }
        .article__date {
          color: #d6d6d6;
          margin: 0;
        }
      }
    }

    .archive__link {
     font-size: 1.25em;
     color: #85a8ff;
     margin-top: 30px;
    }
  }


/* Newsroom Article */
#shopify-section-newsroom-article-template {
 .article-header {
   text-align: left;
   padding: 0;
   background-color: transparent;
   margin-top: 45px;
   .wrapper {
    max-width: 800px;
   }

   .article__tag {
    text-transform: uppercase;
    font-size: 11px;
   }

   .article__date {
    font-size: 11px;
    margin-top: 0;
   }

   .page--title {
     text-align: left;
     font-size: 2.43em;
   }
 }

 .article-header .wrapper {
  display: flex;
  flex-direction: column;
  padding: 0 40px;
 }

 .blog-main--wrapper {
   margin-top: 20px;
   padding: 0;


   &.wrapper {
    max-width: 800px;
   }

   article {
    margin-bottom: 40px;
   }

   h1,h2,h3,h4,h5,p,span:not(.social-sharing span) {
/*     @media(min-width: 768px) { */
      padding: 0 40px;
/*     } */
   }
   .rte>div {
    margin-bottom: 0;
   }

   hr {
     margin: 20px 0 0 40px;
     border-bottom: 1px solid #ccc;
     max-width: 180px;
   }


   p {
    margin-bottom: 0;
   }

   a {
    span {
      font-size: 10px;
      line-height: 1;
      color: #1d99ff;
    }
   }

   span:not(.social-sharing span) {
    display: inline-block;
    font-size: 11px;
    line-height: 1.05;
    margin-bottom: 12px;
   }

   img {
     margin: 24px 0 18px;
     padding: 0 20px;

     @media (min-width: 768px) {
       padding: 0;
     }
   }

   a {
     span {
        display: flex !important;
        align-items: center;
     }

      img {
      margin: 0;
      }
    }
 }

  .social-sharing {
    display: flex;
    flex-wrap: wrap;
   	padding: 0 40px;
    margin-bottom: 45px;

    a {
     border: none;
      margin: 0 8px;
      &:hover {
       background-color: transparent;
      }

      span {
       padding: 0;
       display: flex;
       align-items: center;
      }


      &.share-email {
        img {
		  margin-bottom: 2px;
        }

      }
    }

    h3 {
     padding: 0;
     flex-basis: 100%;
    }

    img {
     max-width: 12px;
     margin: 0;
    }

  	.icon {
     color: rgb(110,110,114);

    }
  }

  .related-posts {
  display: none !important;
  }
}

.search-bar {
	display: flex !important;
	align-items: center;

	.input-group-btn {
		visibility: hidden;
		width: 0;
		height: 0;
	}

    .hidden {
	 display: none;
    }

	img {
	 width: 12px;
	 height: 12px;
	}

	input {
	 background-color: transparent;
	 border: none;
	 outline: none;
	 color: black;

	 &::placeholder {
		 color: black;
	 }
	}
}



// !! Hide popup in newsroom
// #newsroom, body[class~="article.newsroom"] {
//   .redirect-popup {
//     display: none !important;
//   }
// }

.ajaxcart__product-image {
  margin-right: 10px; 
}



.location__banner_link.grid--full, .shopify-section .homepage-sections-team-wrapper .grid--full, #careers .grid--full,.blog-main--wrapper,.grid--full {
  &:after {
    content: "";
    display: table;
    clear: both;
  }
}

.product-disabled {
 .btn--active {
   display: none !important;
 }
  
 .btn--disabled {
   pointer-events: none;
   display: inline-block !important; 
 }
}

.discount_label_pills_25 {
    color: #fff;
    text-align: center;
    background-color: #e45c45;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 16px;
    padding: 3px 15px;
    border-radius: 13px;
}
.discount_label_pills_20 {
    color: #fff;
    text-align: center;
    background-color: #e07125;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 16px;
    padding: 3px 15px;
    border-radius: 13px;
}

.discount_label_pills_15 {
	color: #fff;
    text-align: center;
    background-color: #83cc1c;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 16px;
    padding: 3px 15px;
    border-radius: 13px;
}

.collection--tab-inside-product-wrapper {
  .star-wars-custom-swatch {
    padding: 0 2px;
    margin: 0;
    display: inline-block;
    float: none;
    a {      
      width: 30px!important;
      border: 2px solid #f7f7f7;
      height: 30px!important;
      padding: 0;
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
    }
    
    a.active {
      box-shadow: 0 0 0 2px #979797;
    }
  }
}


.image-with-text-overlay-wrapper h2.homepage-sections--title, .image-with-text-overlay-wrapper .homepage-sections--title.h2 {
	font-size: 25px;
}

.image-with-text-overlay-wrapper .featured-row__subtext {
	font-size: 15px;
}

.template-product .grid__item.large--eight-twelfths.text-center.context.mobile--no-top-margin{
  @media (min-width: 1023px) {
    padding-left: 1px;
  }
}

p#product_stock_notification {
  margin: revert;
  display: flex;
  align-content: center;
  justify-content: center;
  align-items: center;

  &:before{
  content: '';
  background-color: #fdb40b;
  border-radius: 20px;
  width: 18px;
  height: 18px;
  display: inline-block;
  }
  span {
    margin-left: 15px;
    color:#000;
  }
  @media (max-width: 767px) {
    justify-content: flex-start;
  }
}

.desk-mat-compare-buttons, .desk-mat-buttons-landing, .desk-mat-compare-buttons-landing {

    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
  
    user-select: none; /* supported by Chrome and Opera */
   -webkit-user-select: none; /* Safari */
   -khtml-user-select: none; /* Konqueror HTML */
   -moz-user-select: none; /* Firefox */
   -ms-user-select: none; /* Internet Explorer/Edge */
  
  .swatch-element {
    float: left;
    -webkit-transform: translateZ(0);
    -webkit-font-smoothing: antialiased;
    margin: 0 10px 10px 0;
    position: relative;
  }
  input[type=radio] {
    display: none;
    transition: all 0.2s ease-in-out;
  }

  div[data-value="70cm-desk-depth"] {
    margin-right: 0;
  }

  a.landing-anchor {
    text-decoration:none;
  }
  
  label {
    border-radius: 25px;
    color: #000;
    border: 1px solid black;
    padding: 7px 24px;
    font-size: 16px;
  }

  input:hover+label {
    background-color: #000;
    color: #fff;
    transition: all 0.2s ease-in-out;
  }
  
  input:checked+label {
    background-color: #000;
    color: #fff;
  }
}

.desk-mat-buttons-landing .swatch-element{
  @media only screen and (max-width: 767px) {
    padding: 5px;
  }
}

.desk-mat-buttons-landing-pdp {
  justify-content: flex-start;
  padding: 10px 0;
  a {
    border-radius: 25px;
    color: #000;
    border: 1px solid black;
    padding: 7px 24px;
    font-size: 16px;  
    font-weight: 700;
  }

  .slim-active {
    background-color: #000;
    color: #fff;
  }
  
  @media only screen and (max-width: 767px) {
    justify-content: center;
  }
}

body#orbitkey-desk-mat {
  .swatch.size {
    a {
    border-radius: 25px;
    color: #000;
    border: 1px solid black;
    padding: 7px 24px;
    font-size: 16px;
    font-weight: 700;
    }
  }
}
  
.owl-carousel-desk-mat-compare.owl-carousel.owl-hidden {
  opacity: 1 !important;
}
  
.owl-carousel-desk-mat-compare  {
  p {
    color: #000;
  }
  span.recommended {
    color:#417505;
  }

  span.not-recommended {
    color: #9B9B9B;
  }

  .owl-nav .owl-prev {
    left: 1%;
  }
  .owl-nav .owl-next {
    right: 1%;
  }
  
}

body#compare-desk-mat-model, body#desk-mat-sizing  {
  .desk-mat-compare-landing {
    h3 {
      font-size: 1.6em;
      span {
        font-weight: normal;
        font-size: 16px;
      }
    }

    .swatch-element {
      margin-bottom: 0;
    }
    
    .wrapper.wrapper-medium {
      background-color: #f7f7f7;
      border-radius: 15px;
      padding: 30px;
    }
    text-align: center;
    .container-header-buttons {
      display: flex;
      align-content: center;
      justify-content: space-between;
      align-items: center;
      padding: 10px 0;
      flex-wrap: wrap;
      @media (max-width: 767px) {
        display:block;
        .media-reviews--section--grid_inner {
          margin-bottom:20px;
        }
      }
    }
    

    .desk-mat-compare-buttons {
      display:block;
    }

    .owl-carousel.owl-hidden {
      opacity: 1 !important;
    }

    .carousel-button-shop {
      display: flex;
      flex-wrap: wrap;
      align-content: center;
      justify-content: center;
      align-items: center;
    }
    
    .desk-shop-now {
      background: #000;
      color: #fff;
      padding: 5px 20px;
      border-radius: 5px;
      font-size: 14px;
    }

    .bottom-shop-now-container {
      display: flex;
      flex-wrap: wrap;
      align-content: center;
      justify-content: space-between;
      align-items: center;
      padding: 0 15px;
      label {
        color:#000;
        font-weight:bold;
      }
    }

    .shop-now-title {
      margin-bottom: 30px;
    }
    
  }

  .grid__item_small {
    img {
      border-top-left-radius: 30px;
      border-top-right-radius: 30px;
    }
    .grid__item {
      background-color: #f7f7f7;
      border: 10px solid white;
      padding-left: 0;
      border-top-left-radius: 50px;
      border-top-right-radius: 50px;
    }
  }
}

.tiktok_footer {
  width: 27px;
/*   height: 32px; */
  fill: white;
  vertical-align: -3px;
}