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

Ethercycle Zion Theme | Built with Slate

Some styles are also in their respective section files. Mostly colors.

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

html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}

html{color:#222;font-size:1em;line-height:1.4;}::-moz-selection{background:#b3d4fc;text-shadow:none;}::selection{background:#b3d4fc;text-shadow:none;}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;}audio,canvas,iframe,img,svg,video{vertical-align:middle;}fieldset{border:0;margin:0;padding:0;}textarea{resize:vertical;}.clear{clear:both;}img{max-width:100%;max-height:100%;}a:active{border:0;outline:0;}.hidden {display: none !important;}.visuallyhidden,.visually-hidden {border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus {clip: auto;height: auto;margin: 0;overflow: visible;position: static;width: auto;}.invisible{visibility: hidden;}

.no-js {display: none !important;}
.hide {visibility: hidden !important;}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type="number"] {-moz-appearance: textfield;}

a {color: #ee6203; text-decoration: none;}
a, a *, a:hover, a:hover *, a:before, a:hover:before, button, button:hover, input[type=submit] {transition: all .2s;}
a .fa {transition: none;}

body {
  font-family: Titillium Web;
  color: #111111;
  letter-spacing: .01em;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
}

#MainContent {min-height: 60vh;}

.container {max-width: 1200px; padding: 8px 3%; margin: auto;}
.narrow {max-width: 700px;}
.flex {display: flex; align-items: center;}
.headpad {padding-right: 2%; padding-left: 2%;}

h1,h2,h3,h4 {
  font-family: Squada One;
  
  text-transform: uppercase !important;
}
h1 {text-align: center;}

.button {
  font-size: 1.2rem;
  line-height: 1rem;
  border: 1px solid #ee6203;
  background-color: #ee6203;
  color: #fefefe;
  padding: 10px 1.25rem;
  vertical-align: middle;
  font-weight: bold;  
  
  border-radius: 1.5em;
}
.button:hover {background-color: #fc8432; border-color: #fc8432;}

.newsletter input[type='email'] {
  height: 35px;
  padding: 0 5px;
  vertical-align: middle;
  border: 2px solid #ccc;
  color: #000;
  max-width: 180px;
  border-radius:0;
}

.rte p:first-of-type {margin-top: 0;}

button[disabled] {background-color: #ccc; border-color: #ccc;}

/*=== Main Promo Bar ===*/
#top_promo {width: 66%;}
#phone {width: 34%; text-align: right;}
#phone .fa-phone {font-size: .93em; margin-right: 4px; position: relative; top: 1px;}
#promo_header a {margin-left: 4%;}


/*=== Main Header ===*/
header div.container {padding-top: 14px; padding-bottom: 14px;}
#logo_holder {width: 225px;}
#desk_nav {width: calc(98% - 505px); padding: 0 1%;}
#cart_cruft {width: 280px; text-align: right;}

.accounts_on #desk_nav {width: calc(98% - 585px);}
.accounts_on #cart_cruft {width: 360px;}

#logo_holder img {max-height: 100px; display: block; margin: auto;}

.main-nav {list-style-type: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center;}
.main-nav li {margin: 0 2%; position: relative;}
.main-nav li:first-of-type {margin-left: 0;}
.main-nav li:last-of-type {margin-right: 0;}

.has-dropdown .fa-chevron-down {margin-left: 5px; opacity: .7; font-size: .8em;}

.dropdown {
  position: absolute;
  top: 42px;
  right: 99999px;
  z-index: 10;
  width: 300px;
  opacity: 0;
  transition: opacity .4s;
  box-shadow: 0px 2px 5px 1px rgba(0,0,0,0.4);
  border-radius: 10px;
}
.has-dropdown:hover .dropdown, .dropdown:hover {opacity: 1; right: -132px; transition: opacity .4s;}

.dropdown ul {list-style-type: none; margin: 0; padding: 0; border-radius: 6px;}
.dropdown li {margin: 0; padding: 0 20px;}
.dropdown li a {display: block; padding: 8px 0;}
.dropdown li:last-of-type a {border: none;}

.dropdown .fa-sort-asc {position: absolute; top: -20px; right: 36.5%; font-size: 48px; padding: 1px 5% 0 30%;}

a.account {margin: 0 12px;}
a.account .fa {font-size: 18px;}
a.account:after {
  content: "|";
  padding-left: 15px;
}

#cart_cruft form {display: inline-block; position: relative; margin-right: 15px;}
#cart_cruft input[type=search] {
  padding: 9px 35px 8px 10px;
  border-radius: 8px;
  display: inline-block;
  border: 1px solid #999999;
  width: 125px;
  font-size: .88em;
  color: #000;
}
#cart_cruft input[type=search]::placeholder {font-style: italic; color: #333333;}
#cart_cruft button {border: none; position: absolute; top: 16%; right: 3px; background-color: transparent; color: #000;}

.ui-autocomplete {max-width: 360px; border: 1px solid #999999; border-radius: 8px; font-family: Titillium Web;}
.ui-autocomplete .ui-menu-item-wrapper {display: block; transition: none !important;}
.ui-autocomplete .ui-menu-item-wrapper img {display: inline-block; width: 55px; padding-right: 5px; vertical-align: middle;}
.ui-autocomplete .ui-menu-item-wrapper span {display: inline-block; width: calc(100% - 60px); vertical-align: middle; white-space:nowrap; overflow: hidden; text-overflow: ellipsis;}

.cart_icon span {font-size: 1.1em;}

#subnav {font-size: .875em;}
#subnav a {margin: 0 .9%;}
#subnav a:first-of-type {margin-left: 0;}

/*=== Footer ===*/
footer {margin-top: 40px; padding-bottom: 15px;}
footer .container {padding: 18px 2% 8px;}
footer .flex {justify-content: space-between; align-items: stretch;}
footer .logo_social {max-width: 225px;}
footer .social_links {margin-top: 1em;}
footer .social_links a {font-size: 2em; margin: 0 1.5%;}
footer h3 {margin-top: 0;}
footer nav a {display: block; margin: 8px 0;}


footer .newsletter .button {border-radius: 0 1.5em 1.5em 0;}


#subfooter {font-size: .8em;}

/*=== Hero Image ===*/
.hero {
  background-size: cover;
  height: 45vw;
  position: relative;
  width: 100%;
}

.hero img {display: none;}

.hero div {
  position: absolute;
  top: 15%; left: 6%;
  max-width: 410px;
  padding: 25px 25px 35px;
  color: #fefefe;
  background-color: rgba(0,0,0,.6);
}

.hero div h1 {
  margin: 0;
  font-size: 3em;
  text-align: left;
  line-height: 1em;
}

.hero div h2 {margin: .5em 0; font-size: 1.25em;}

.hero .button {display: inline-block; padding: 15px 1.5rem; margin-top: 12px;}

.hero_right div {left: auto; right: 6%;}

.hero_banner div {left: auto; top: 25%; max-width: none; width: 100%; padding: 25px 0 35px; text-align: center;}
.hero_banner div h1 {text-align: center;}

/*=== Misc Promo Bar ===*/
.promo_bar div {text-align: center; padding: 10px 3%; font-size: 1.33em;}

/*=== Featured Promos ===*/
.featured_promos {max-width: 1140px; margin: 40px auto; justify-content: center;}
.featured_promos a {margin: 0 1.5%; border: 1px solid #e6e8ea; padding: 0 1.5% 10px;}
.featured_promos img {max-width: 100%;}
.featured_promos a span {font-weight: bold; color: #222222; display: block; padding: 15px 0 10px 0;}
.featured_promos a:hover img {opacity: .75;}
.featured_promos a:hover span {color: #ee6203;}

/*=== Featured Homepage Collections ===*/
.featured_collections {position: relative; max-width: 1140px; margin: 40px auto;}
.featured_collections img {max-width: 100%; margin: 20px 0;}
.featured_collections a {display: inline-block; width: 22.5%; margin: 0 5%; text-align: center;}
.featured_collections a h3 {font-size: 1.33rem; text-transform: uppercase; color: #222222; margin: 30px 0 0;}
.featured_collections a span {display: block;}

/*=== Hero Video ===*/
.video_hero iframe, .video_hero video {width: 100%; height: 56vw; display: block;}

/*=== Press Logos ===*/
#press_logos {margin: 40px auto;}
#press_logos div {display: flex; justify-content: center;}
#press_logos div img {max-width: 230px; max-height: 100px; margin: 8px 1.5%; align-self: center;}


/*=== Featured Text ===*/
.feature_item {flex-direction: column; margin-bottom: 20px;}
.feature_item img {order: 1; display: block; max-width: 1024px; width: 100%; align-self: flex-start; margin: auto;}
.feature_item div {order: 2; text-align: center; max-width: 1024px; margin: 30px auto;}
.feature_item h2 {font-size: 3em; line-height: 1em; margin: 0 0 .5em;}

.img_right {flex-direction: row;}
.img_right img {order: 2; display: inline-block; max-width: 100%; width: 100%; align-self: flex-start;}
.img_right div {order: 1; display: inline-block; width: 44%; margin: 0 6% 0 0; padding: 0; text-align: left; align-self: center;}
.img_right a {margin: 15px 0;}

.img_left {flex-direction: row;}
.img_left img {order: 1; display: inline-block; max-width: 100%; width: 100%; align-self: flex-start;}
.img_left div {order: 2; display: inline-block; width: 44%; margin: 0 0 0 6%; padding: 0; text-align: left; align-self: center;}
.img_left a {margin: 15px 0;}

.no_image img {display: none;}
.no_image div {margin: 40px auto;}
.no_image a {margin: auto;}


/*=== Email Capture ===*/
.capture_container {padding: 20px 0;}
#email_capture {max-width: 890px; margin: auto; font-size: 1.14em; text-align: center; line-height: 1.5em;}
#email_capture .newsletter {max-width: 500px; margin: 30px auto;}


#email_capture .button {border-radius: 0 1.5em 1.5em 0;}



/*=== Instagram Feed ===*/
#instagram {margin: 40px auto;}

#instafeed {display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
#instafeed a {width: 24%; margin: 8px 0;}

/*=== Collection Page ===*/
.collection_description { margin: 30px auto; max-width: 700px;}

#collection_listing {display: flex; flex-wrap: wrap; justify-content: space-between;}
#collection_listing a {text-align: center; margin-bottom: 30px; color: #111111;}
#collection_listing a .imgholder {display: flex;}
#collection_listing a img {display: block; margin: auto;}
#collection_listing a p {margin: 5px 0 0 0; color: #ee6203;}
#collection_listing a span {display: block; color: #111111;}
#collection_listing a s {font-size: .9em; opacity: .7;}
#collection_listing span.soldout {color: #d60000;}

#collection_listing.two a {width: 48%; margin: 0 1% 30px;}
#collection_listing.two a .imgholder {height: 44.1vw; max-height: 600px;}
#collection_listing.two:after {content: ""; flex-basis: 48%;}

#collection_listing.three a {width: 31%;}
#collection_listing.three a .imgholder {height: 28.5vw; max-height: 403px;}
#collection_listing.three:after {content: ""; flex-basis: 31%;}

#collection_listing.four a {width: 23%;}
#collection_listing.four a .imgholder {height: 21.1vw; max-height: 299px;}
#collection_listing.four:after {content: ""; flex-basis: 23%;}

#collection_listing.five a {width: 18%;}
#collection_listing.five a .imgholder {height: 16.4vw; max-height: 234px;}
#collection_listing.five:after {content: ""; flex-basis: 18%;}

.secondimage {position: relative;}
.secondimage img, .secondimage:hover img {transition: none;}
.secondimage img:nth-of-type(2) {position: absolute; opacity: 0;}
.secondimage:hover img:first-of-type {opacity: 0; position: absolute;}
.secondimage:hover img:nth-of-type(2) {opacity: 1; position: static;}


/*=== Product Page ===*/
#product_page {margin-top: 40px; flex-wrap: wrap; justify-content: space-between; align-items: flex-start;}
#product_images {width: 49%;}
#product_info {width: 48%;}

.main_image {width: auto; max-height: 576px; margin: auto; display: block; cursor: pointer;}
#product_thumbs {display: flex; flex-wrap: wrap;}
#product_thumbs a {width: 18%; margin: 20px 1% 10px; max-height: 112px; overflow: hidden}
#product_thumbs a img {width: 100%; height: auto; max-height: 999px;}

#product_info h1 {text-align: left; margin: 0; font-size: 1.68em;}
#product_info .vendor {margin-top: 5px; color: #666; width: 45%; display: inline-block; vertical-align: top; font-size: .8em;}
#product_info .spr-badge {width: 50%; display: inline-block; text-align: right;}

div.price {margin-top: .5em;}
#current_price {display: block; font-size: 1.5em; font-weight: bold; color: #ee6203;}
#old_price {display: block; font-size: .81em; opacity: .7; text-decoration: none !important;}
#savings {display: block; font-size: .81em; }
#savings span {color: #ee6203;}

#purchase_area {border: 1px solid #e8e9ec; padding: 0 3% 0; max-width: 400px; margin: 20px 0;}

.selector-wrapper {margin: 15px 0 20px;}

#qtybox {display: inline-block; width: 85px; margin-top: 12px;}
#qtybox select {font-weight: bold; font-size: 1.06em; width: 55px; height: 40px;}
#qtybox select:focus {outline: none;}

#purchase_area button {margin: 1em 0; padding: 16px 2rem; vertical-align: baseline;}
#purchase_area button:disabled {border: 1px solid grey; background-color: grey; opacity: .8;}

#shopify-product-reviews {width: 100%;}

#product_sharing {text-align: center; font-size: 32px; margin: 8px 0;}
#product_sharing a {margin: 0 10px;}

.rte * {max-width: 100%;}
.split {max-width: 768px; width: 100%; margin: 1em auto;}

.homepage_product {margin: 20px auto;}

/*=== Swatches ===*/

.swatch-wrapper p {display: none;}
.color-swatch p {display: block !important; margin-bottom: .33em;}

.swatch-wrapper input {display: none;}
.swatch-wrapper label {
  display: inline-block;
  margin: 3px 5px 3px 0;
  padding: 0 10px;
  width: auto;
  min-width: 42px;
  height: 40px;
  line-height: 40px;
  border-radius: 0;
  background-color: #111;
  color: #fefefe;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  font-weight: bold;
}
.swatch-wrapper label:first-of-type {margin-left: 0;}

.swatch-wrapper label:hover {background-color: #ee6203;}

.swatch-wrapper input:checked + label {background-color: #ee6203}

.color-swatch label {
  border: 2px solid transparent;
  padding: 0;
  background-color: transparent;
  background-size: cover;
  position: relative;
  box-shadow: 0px 0px 3px 1px rgba(51,51,51,0.33);
  height: 42px;
  line-height: 42px;
}

.color-swatch input:checked + label {border: 2px solid #ee6203; background-color: transparent;}

.color-swatch label span {
  position: absolute;
  width: 80px;
  bottom: 47px; 
  left: calc(50% - 48px);
  font-size: 13px;
  background-color: #ee6203;
  color: #fefefe;
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
  line-height: 1.4em;
  padding: 3px 8px;
  opacity: 0;
  transition: all .3s ease-out;
  border-radius: 5px;
  white-space: normal;
  z-index: 2;
}
.color-swatch label:hover span {opacity: 1; bottom: 57px; transition: all .3s ease-out;}

.color-swatch label span:after {
  content: " ";
  width: 0; height: 0;
  border-left: solid transparent 10px;
  border-right: solid transparent 10px;
  border-top: solid #ee6203 10px;
  bottom: -10px;
  left: calc(50% - 10px);
  position: absolute;
}

#collection_listing .selector-wrapper {margin: .5em 0 0 0;}
#collection_listing .selector-wrapper label {min-width: 0; width: 40px; height: 40px;}


/*=== Special Product Page ===*/
#product_special {max-width: 1180px;}
#product_special .vendor {text-align: center; color: #666; margin-bottom: .5em;}
#product_special h1 {margin: 0 0 .5em;}
#product_special #product_images {width: auto;}
#product_special .main_image {display: block; width: auto; margin: auto; max-height: 524px;}

#product_special #special_info {display: flex; margin-top: 20px;}
#product_special #product_thumbs {width: 240px; align-content: flex-start;}
#product_special #product_thumbs a {width: 47%; margin: 0 3% 7px 0;}
#product_special .rte {width: calc(96% - 540px); padding: 0 2%;}

#product_special #special_buy {width: 300px;}
#product_special .swatch-wrapper {margin: 1em 0 0;}
#product_special .swatch-wrapper label {margin: 0 5px 7px 0;}
#product_special #selection {display: inline-block; width: 65%; margin: 1em 0; vertical-align:top;}
#product_special #qtybox {display: inline-block; width: 30%; margin: 1em 0;}
#product_special .button {width: 100%;}


/*=== Cart Page ===*/
#cart_page {max-width: 1000px;}
#cart_page table {width: 100%;}
#cart_page table tr {border-bottom: 1px solid #dddddd; height: 181px;}
#cart_page table tr:first-of-type {border-top: 1px solid #dddddd;}
#cart_page table td {padding: 15px 0; text-align: center;}
#cart_page table td:first-of-type {width: 15%;}
#cart_page table td:nth-of-type(2) {width: 50%; padding-left: 2%; text-align: left;}
#cart_page a.remove {color: #cc0000; font-size: .87em;}
#cart_page table td:nth-of-type(3) {width: 23%;}
#cart_page .quantity {
  font-size: 1em;
  width: 45px;
  padding: 6px;
  text-align: center;
  border: 2px solid #e5e5e5;
}
#cart_page table td:nth-of-type(4) {text-align: left;}
#cart_page table td:nth-of-type(4) b {color: #ee6203; font-size: 1.18em;}
#cart_notes {display: inline-block; width: 50%; margin-top: 12px;}
#cart_notes label {display: block; margin-bottom: 8px;}
#cart_notes textarea {width: 100%; max-width: 320px;}
#subtotal {display: inline-block; width: 50%; vertical-align: top; text-align: right; margin-bottom: 10px;}
.cart_total {font-size: 1.2em; color: #111; font-weight: bold;}
.cart_total span {color: #ee6203;}
#cart_buttons {margin-top: 8px; text-align: right;}
.update {border-color: gray; color: gray; background-color: white; padding: 10px 12px; margin-right: 9px;}
.update:hover {color: white; background-color: gray;}
.checkout {padding: 10px 2rem;}
.additional-checkout-buttons {margin-top: 12px;}
p.freeship {margin-bottom: 0;}
p.freeship span {color: #cc0000; font-weight: bold;}
#subtotal meter {
  -moz-appearance: none;
  appearance: none;
  margin-bottom: 1em;
  width: 300px;
  height: 30px;
  background: #eee;
  box-shadow: 0 2px 3px rgba(0,0,0,0.2) inset;
  border-radius: 3px;
}
#subtotal meter:-moz-meter-optimum::-moz-meter-bar {background: green;}
#subtotal meter:-moz-meter-sub-optimum::-moz-meter-bar {background: yellow;}
#subtotal meter:-moz-meter-sub-sub-optimum::-moz-meter-bar {background: red;}

/* WebKit Meter */
#subtotal meter::-webkit-meter-bar {
  background: #eee;
  box-shadow: 0 2px 3px rgba(0,0,0,0.2) inset;
  border-radius: 3px;
}
#subtotal meter::-webkit-meter-optimum-value {background: green;}
#subtotal meter::-webkit-meter-suboptimum-value {background: yellow;}
#subtotal meter::-webkit-meter-even-less-good-value  {background: red;}


/*=== Blog Home ===*/
.post_listing {display: flex; padding: 24px 0; border-bottom: 1px solid #ccc; }
.post_image {margin-right: 4%; width: 33%;}
.post_image img {display: block; margin: auto;}
.post_excerpt {width: 63%;}
.post_excerpt h2 {font-size: 1.37em; margin-top: 0;}

/*=== Blog Article ===*/
#article_banner {max-width: 900px; margin: auto;}
#article_banner h1 {font-size: 3em; line-height: 1.1em; text-align: left; text-transform: uppercase;}
#article_image {display: block; margin: 0 auto 1.5em;}
#article_content {max-width: 1070px; margin: auto;}
#article_content .rte {max-width: 700px; margin: auto;}

/*=== Contact Page ===*/
.contact_page #contact_form  {max-width: 375px; margin: auto;}
.contact_page #contact_form label {display: none;}
.contact_page #contact_form input, #contact_form textarea {display: block; width: 100%; padding: 4px; margin: 12px 0;}
.contact_page #contact_form .button {padding: 10px 1.25rem; display: inline; width: auto;}


/*=== Customer Account Pages ===*/
#create_customer, #customer_login, #RecoverPasswordForm, .form-reset-password {max-width: 375px; margin: auto;}
.label-hidden {display: none;}
.textfield {margin: 0 0 14px; padding: 5px; border: 1px solid #ccc; color: #000; width: 95%;}

/* ====== Password Page ====== */
#password_page {padding: 40px 2%; min-height: 95vh; background-size: cover;}
#passbox {
  max-width: 500px;
  margin: auto;
  padding: 1.5%;
  vertical-align: top;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
  background-color: rgba(255,255,255,.8);
}

#passbox img {display: block; margin: auto; max-width: 100%;}
#passbox h3, #passbox p {text-align: center; color: #111;}
#passbox form {text-align: center;}

/* ====== Mobile Navigation ====== */
#mobile_nav {display: none; position: relative;}
nav.open {width: 100% !important;}

.menu-link {border: none;}
.menu {display: none; width: 95vw;}
.menu ul {list-style-type: none;}
.menu, .menu > ul ul {clear: both;}

.menu.active, .js .menu > ul ul.active {max-height: 55em;}
.menu > ul {list-style-type: none; padding: 0;}
.menu li {  border-bottom: 1px solid #909090;}
.menu li a {
  text-transform: uppercase;
  color: #212121;
  font-weight: bold;
  font-size: .875rem; 
  display: block;
  padding: 0.8em 3%;
  position: relative;
}

.menu li.has-subnav a:first-of-type {width: 76%; display: inline-block;}
.menu li.has-subnav a.plus {width: 12%; display: inline-block; text-align: center;}
.menu li.has-subnav a.plus:before {font-size: 1.5em; display: block;}
.menu li.has-subnav a.active:before {transform: rotate(180deg);}

.has-subnav > ul {display: none;}
.level-2 {padding-left: 7%;}
.level-2 a {font-weight: normal !important;}
.level-2 li:last-of-type {border-bottom: none;}

.lines-button {
  display: inline-block;
  height: 2rem;
  padding: 0;
  transition: .3s;
  cursor: pointer;
  user-select: none;
  border-radius: 0;
  background-color: transparent;
  margin-top: -6px;
}

.hamburger .lines {
    display: inline-block;
    width: 32px;
    height: 3px;
    background: #212121;
    border-radius: 0;
    transition: .3s;
    position: relative;
}

.hamburger .lines::before, .hamburger .lines::after {
    display: inline-block;
    width: 32px;
    height: 3px;
    background: #212121;
    border-radius: 0;
    transition: .3s;
    position: absolute;
    left: 0;
    content: '';
    transform-origin: .17857rem center;
}

.hamburger .lines:before {top: .5rem;}
.hamburger .lines:after {top: -.5rem;}

.checked .lines {background: transparent !important;}
.checked .lines:before, .checked .lines:after {
    transform-origin: 50% 50%;
    top: 0;
    width: 2rem;
}

.checked .lines:before {transform: rotate3d(0, 0, 1, 45deg);}
.checked .lines:after {transform: rotate3d(0, 0, 1, -45deg);}


@media only screen and (max-width: 1060px) {
  header .flex {flex-wrap: wrap;}
  #logo_holder {order: 1;}
  #cart_cruft {order: 2; width: calc(100% - 225px) !important;}
  #desk_nav {order: 3; width: 100% !important; margin-top: 1.33em;}
  
  .hero div {top: 9%; left: 3%;}
}

@media only screen and (max-width: 1000px) {
  .hero div {padding: 1em 1em 22px; left: 2%;}
  .hero div h1 {font-size: 2.5em;}
  
  .img_right img, .img_left img {width: 33%;}
  .img_right div, .img_left div {width: 61%;}
  .feature_item h2 {font-size: 2.25em;}
  
  #collection_listing a .imgholder {height: auto !important; max-height: none !important; display: block !important;}
  #collection_listing a {width: 47% !important;}
  
  .secondimage img:nth-of-type(2) {display: none !important;}
  .secondimage:hover img:first-of-type {opacity: 1; position: static;}
  .secondimage:hover img:nth-of-type(2) {display: none !important;}
  
  .featured_collections a {width: 28.5%; margin: 0 2%;}
  
  #product_special .main_image {max-height: 320px;}
  #product_special #special_info {flex-wrap: wrap; margin-top: 0;}
  #product_special #product_thumbs {width: 100%; margin: 10px 0; align-items: center; justify-content: space-between;}
  #product_special #product_thumbs:after {content: ""; flex: auto;}
  #product_special #product_thumbs a {width: 20%; margin: 0;}
  #product_special .rte {width: calc(98% - 300px); padding: 0 2% 0 0;}
  
  footer .flex {flex-wrap: wrap;}
  footer .logo_social {order: 4; margin: 22px auto 0;}
}


@media only screen and (max-width: 700px) {
  body {font-size: calc(16px - 1px);}
  #cart_cruft form {display: none;}
  
  .hero {height: auto; background-image: none !important;}
  .hero img {display: block;}
  .hero div {position: static; padding: 3% 3% 30px; width: 94%; max-width: none; background-color: #000; text-align: center;}
  .hero div h1 {font-size: 1.8em; text-align: center;}
  
  footer .newsletter {width: 100%; max-width: 320px; margin: 22px 0 0;}
  footer .logo_social {width: 100%; text-align: center;}
  
  .featured_promos {flex-wrap: wrap;}
  .featured_promos a {padding: 0 5px 10px; width: 43%; margin: 5px 1.5%;}
  
  .featured_collections a {margin: 0 1.9%;}
  .featured_collections a h3 {margin-top: 15px;}
  
  .img_right, .img_left {flex-direction: column;}
  .img_right img, .img_left img {width: 100%; max-width: 400px; order: 1;}
  .img_right div, .img_left div {width: 100%; margin: 1em 0 0 0; order: 2;}
  
  #product_page {display: block; margin-top: 0;}
  #product_images {width: 100%;}
  #product_info {width: 100%; margin-top: 16px;}
  #purchase_area {border: none; padding: 0;}
  
  #press_logos div {flex-wrap: wrap;}
  
  #instafeed {flex-wrap: wrap;}
  #instafeed a {width: 48%; margin: 5px 0;}
  
  .featured_collections a {width: 45%;}
  .featured_collections a:nth-of-type(3) {display: none;}
  
  #product_info .spr-badge {display: block; width: 100%; text-align: left;}
  
  .post_listing {flex-wrap: wrap;}
  .post_image {margin: auto; width: 100%; max-height: none;}
  .post_excerpt {width: 100%; padding-top: 16px;}
  
  #product_special h1 {line-height: 1.2em;}
  #product_special .rte {order: 3; width: 100%; padding: 16px 0 0;}
  #product_special #special_buy {order: 2; width: 100%; max-width: 420px; margin: auto;}
}


@media only screen and (max-width: 599px) {
  #top_promo {width: 100%; text-align: center;}
  #phone {display: none;}
  #desk_nav {display: none;}
  #mobile_nav {display: block; order: 1; width: 70px;}
  #logo_holder {order: 2; width: 250px;}
  #logo_holder img {margin: auto;}
  #cart_cruft {order: 3; width: calc(100% - 320px) !important; font-size: 18px;}
  #cart_cruft form, #cart_cruft .account, .itemcount {display: none;}
  
  #press_logos div {flex-wrap: wrap;}
  #press_logos div img {max-width: 30%;}
  
  #collection_listing a {width: 100% !important; margin-bottom: 16px;}
  
  #cart_page table td:first-of-type {width: 25%; display: inline-block; padding: 10px 0;}
  #cart_page table td:nth-of-type(2) {width: 71%; display: inline-block; padding: 10px 0 10px 3%;}
  #cart_page table td:nth-of-type(3) {width: 25%; display: inline-block; padding: 0 0 10px; text-align: left;}
  #cart_page table td:nth-of-type(4) {width: 71%; display: inline-block; padding: 0 0 16px 3%; text-align: left;}
  #cart_page table td:nth-of-type(4) b {font-size: 1.5em;}
  #cart_notes {display: none;}
  #subtotal {display: block; width: 100%;}
  #cart_buttons .button {font-size: 1.1em; margin: 10px 0;}
  .update {padding: 10px; margin-right: 9px !important;}
  .checkout {padding: 10px 1rem;}
}

@media only screen and (max-width: 370px) {
  #mobile_nav {width: 65px;}
  #logo_holder {width: 200px;}
  #cart_cruft {width: calc(100% - 275px) !important;}
}


/* The Modal (background) */
.modal-cart-backorder {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-cart-backorder-content {
    background-color: #fefefe;
    margin: auto;
    padding: 10px 20px;
    border: 1px solid #888;
    width: 300px;
    position: absolute;
    left: calc(50% - 170px);
    top: 25vh;
}

#btnBackorderConfirm {
  font-size: 1.2rem;
  line-height: 1rem;
  border: 1px solid #ee6203;
  background-color: #ee6203;
  color: #fefefe;
  padding: 10px 1.25rem;
  vertical-align: middle;
  text-transform: uppercase;
  font-weight: bold;  
  border-radius: 1.5em;
}

/* The Close Button */
.close-cart-backorder {
    color: #aaaaaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close-cart-backorder:hover,
.close-cart-backorder:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}