/*

 ::::::::  :::         ::::::::  :::::::::      :::     :::         ::::::::
:+:    :+: :+:        :+:    :+: :+:    :+:   :+: :+:   :+:        :+:    :+:
+:+        +:+        +:+    +:+ +:+    +:+  +:+   +:+  +:+        +:+
:#:        +#+        +#+    +:+ +#++:++#+  +#++:++#++: +#+        +#++:++#++
+#+   +#+# +#+        +#+    +#+ +#+    +#+ +#+     +#+ +#+               +#+
#+#    #+# #+#        #+#    #+# #+#    #+# #+#     #+# #+#        #+#    #+#
 ########  ##########  ########  #########  ###     ### ##########  ########

*/

/*

  Inline the reset-styles from bootstrap?

*/

/* I like this purple: 49247A */

html, body {
  box-sizing: border-box;
  font-size: 1em;

  /* The following 3 rules help prevent "slop" on mobile-devices. */
  width: auto;
  overflow-x: hidden;
  max-width: auto;
  /* overflow-x stops position:sticky from working unless we do this: */
  height: 100%;
  /*background: rgb(249, 248, 243);*/
  background: white;
  position: relative;
}

@media all and (max-width: 575px) {
  /* Simulate the default 30px buffer Bootstrap provides when using E2E design. */
  .mobuff {
    margin-left: 15px;
    margin-right: 15px;
  }

  .dsv-new-product-img-height {
    height: 290px;
    max-height: 290px;
  }

  .dsv-new-product-margins-and-flex {
    flex: 0 0 100%;
    margin-bottom: 1rem;
    margin-right: 0;
  }

}

.dsv-mobile-cart-flare {
  position: absolute;
  right: 0;
  top: 0;
  background: red;
  border-radius: 3px;
  padding: 0px 5px;
  margin: 0;
  opacity: 0.85;
  color: white;
  font-size: 0.75em;
  background: linear-gradient(to left, rgba(255, 0, 0, 1), rgba(255, 0, 0, 1), rgba(255, 0, 0, 0));
}

@media all and (min-width: 576px) {
  /* This provides margins to non-mobile-devices
     on search-results-pages.

     How is this different from .mobuff?
   */

  .search-result {
/*    margin-left: 15px;
    margin-right: 15px;*/
  }

  .dsv-new-product-margins-and-flex {
    /*flex: 1 1 290px;*/
    margin-bottom: 2rem;
    /*margin-right: 2rem;*/
  }

}

@media all and (max-width: 991px) {
  .mobile-header,
  .mobile-home {
    display: block;
  }

  .desktop-header,
  .desktop-home {
    display: none;
  }
}

@media all and (min-width: 992px) {
  .mobile-header,
  .mobile-home {
    display: none;
  }

  .desktop-header,
  .desktop-home {
    display: block;
  }
}

/* These have so far worked well as "globals". */
.currency {
  font-size: 1.2rem;
}

.dollars {
  font-size: 1.75rem;
  vertical-align: sub;
}

.cents {
  font-size: 1.2rem;
}

.orange {
  background: #ff7800;
}

.text-orange {
  color: #FF7800;
}

.highlight,
.error {
  background: #ffff24;
  color: black;
  font-weight: bold;
}

.flash-error {
  background: #ffff24;
  color: black;
  font-weight: bold;
  padding: 0.5rem;
}

/* .pale -- To get something loosely similar to pale, use .outline-dark. */

/* This is the singular place where I call Ruby's `yield` function
   to render output from a given action into that point in the overall
   layout. */
#yielded-content {
  /*background: #F3F3F3;*/
  border-top: 1px solid #CCC;
}

.lock-icon {
  background-image: url(/images/lock-icon.png);
  background-size: 24px 24px;
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 36px;
}
.paypal-icon {
  background-image: url(/images/paypal-icon.png);
  background-size: 105px 32px;
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 115px;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  color: white;
}

.btn {
  border-radius: 0;
}

.form-control {
  border-radius: 0;
}

a.back-to-top {
  display: none;
  position: fixed;
  z-index: 999;
  right: 20px;
  bottom: 20px;
  background: #CCC;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  /*height: 100px;*/
  /*display: block;*/
  width: 50px;
  color: black;
  text-align: center;
  line-height: 50px;
  opacity: 0.75;
}




.btn-orange {
  color: #FFFFFF;
  background-color: #FF7800;
  border-color: #FFFFFF;
}

.btn-orange:hover,
.btn-orange:focus,
.btn-orange:active,
.btn-orange.active,
.open .dropdown-toggle.btn-orange {
  color: #FFFFFF;
  background-color: #49247A;
  border-color: #FFFFFF;
}

.btn-orange:active,
.btn-orange.active,
.open .dropdown-toggle.btn-orange {
  background-image: none;
}

.btn-orange.disabled,
.btn-orange[disabled],
fieldset[disabled] .btn-orange,
.btn-orange.disabled:hover,
.btn-orange[disabled]:hover,
fieldset[disabled] .btn-orange:hover,
.btn-orange.disabled:focus,
.btn-orange[disabled]:focus,
fieldset[disabled] .btn-orange:focus,
.btn-orange.disabled:active,
.btn-orange[disabled]:active,
fieldset[disabled] .btn-orange:active,
.btn-orange.disabled.active,
.btn-orange[disabled].active,
fieldset[disabled] .btn-orange.active {
  background-color: #FF7800;
  border-color: #FFFFFF;
}

.btn-orange .badge {
  color: #FF7800;
  background-color: #FFFFFF;
}

.bg-orange {
  background-color: #FF7800;
}

.breadcrumbs-link {
  color: #000;
}

.shadow {
    position: absolute;
    width: 100%;
    height: 100%;
    box-shadow: inset 3px 3px 10px 0 #000000;
    border-radius: 20px;
    top: 0;
    left: 0;
}


/*

:::::::::: :::        :::::::::: :::    :::
:+:        :+:        :+:        :+:    :+:
+:+        +:+        +:+         +:+  +:+
:#::+::#   +#+        +#++:++#     +#++:+
+#+        +#+        +#+         +#+  +#+
#+#        #+#        #+#        #+#    #+#
###        ########## ########## ###    ###
 ::::::::  :::         ::::::::  :::::::::      :::     :::         ::::::::
:+:    :+: :+:        :+:    :+: :+:    :+:   :+: :+:   :+:        :+:    :+:
+:+        +:+        +:+    +:+ +:+    +:+  +:+   +:+  +:+        +:+
:#:        +#+        +#+    +:+ +#++:++#+  +#++:++#++: +#+        +#++:++#++
+#+   +#+# +#+        +#+    +#+ +#+    +#+ +#+     +#+ +#+               +#+
#+#    #+# #+#        #+#    #+# #+#    #+# #+#     #+# #+#        #+#    #+#
 ########  ##########  ########  #########  ###     ### ##########  ########

*/

.cluster-product-image {
  height: 200px;
  align-items: center;
  border: 1px solid #CCC;
}


/* Defined elsewhere right now (2018-05-30). */
/*  .desktop-cluster-product-image {
    height: 400px;
    max-height: 400px;
  }*/


.cluster-wrapper {
  flex: 0 1 250px;
  margin-bottom: 2rem;
/*  width: 250px;
  max-width: 250px;*/
}

.cluster-wrapper-home {
  flex: 0 1 23%;
}

.cluster-wrapper-home-2 {
  flex: 0 1 48%;
}

.cluster-wrapper-standard-category {
  flex: 0 1 354px;
}

.cluster-wrapper p {
  margin: 0;
  padding: 0;
}

.cluster-product-image img {
  max-width: 100%;
  max-height: 100%;
  margin: auto;   /* Horiztonally-centers the image in FF, SF, CH, EG. */
  flex-shrink: 0; /* IE-11 hack to tell it to shrink images. */
}

/*@media all and (min-width: 996px) and (max-width: 1199px) {
  .cluster-wrapper-standard-category {
    flex: 0 1 48%;
  }
}*/

@media all and (max-width: 575px) {
  .cluster-wrapper {
    flex: 1 1 auto;
  }
}



/*

 ::::::::  ::::::::::     :::     :::::::::   ::::::::  :::    :::
:+:    :+: :+:          :+: :+:   :+:    :+: :+:    :+: :+:    :+:
+:+        +:+         +:+   +:+  +:+    +:+ +:+        +:+    +:+
+#++:++#++ +#++:++#   +#++:++#++: +#++:++#:  +#+        +#++:++#++
       +#+ +#+        +#+     +#+ +#+    +#+ +#+        +#+    +#+
#+#    #+# #+#        #+#     #+# #+#    #+# #+#    #+# #+#    #+#
 ########  ########## ###     ### ###    ###  ########  ###    ###
:::::::::  ::::::::::  ::::::::  :::    ::: :::        :::::::::::  ::::::::
:+:    :+: :+:        :+:    :+: :+:    :+: :+:            :+:     :+:    :+:
+:+    +:+ +:+        +:+        +:+    +:+ +:+            +:+     +:+
+#++:++#:  +#++:++#   +#++:++#++ +#+    +:+ +#+            +#+     +#++:++#++
+#+    +#+ +#+               +#+ +#+    +#+ +#+            +#+            +#+
#+#    #+# #+#        #+#    #+# #+#    #+# #+#            #+#     #+#    #+#
###    ### ##########  ########   ########  ##########     ###      ########

*/






/*

  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING

*/

.search-result {
  flex: 1 0 200px;

/*  margin-bottom: 1rem;
  padding-top: 1rem;*/
  /*border-top: 1px solid #CCC;*/

}

.image-container {
  flex: 0 1 auto;
  min-width: 145px;
  width: 145px;
  max-width: 145px;

  min-height: 145px;
  height: 145px;
  max-height: 145px;

  text-align: center;
}

.image-container img {
  max-width: 100%;
  max-height: 145px;
  margin: auto;
}

.search-result a {
  color: black;
}





/*
::::    ::::   ::::::::  :::::::::  ::::::::::: :::        ::::::::::
+:+:+: :+:+:+ :+:    :+: :+:    :+:     :+:     :+:        :+:
+:+ +:+:+ +:+ +:+    +:+ +:+    +:+     +:+     +:+        +:+
+#+  +:+  +#+ +#+    +:+ +#++:++#+      +#+     +#+        +#++:++#
+#+       +#+ +#+    +#+ +#+    +#+     +#+     +#+        +#+
#+#       #+# #+#    #+# #+#    #+#     #+#     #+#        #+#
###       ###  ########  #########  ########### ########## ##########
:::    ::: ::::::::::     :::     :::::::::  :::::::::: :::::::::
:+:    :+: :+:          :+: :+:   :+:    :+: :+:        :+:    :+:
+:+    +:+ +:+         +:+   +:+  +:+    +:+ +:+        +:+    +:+
+#++:++#++ +#++:++#   +#++:++#++: +#+    +:+ +#++:++#   +#++:++#:
+#+    +#+ +#+        +#+     +#+ +#+    +#+ +#+        +#+    +#+
#+#    #+# #+#        #+#     #+# #+#    #+# #+#        #+#    #+#
###    ### ########## ###     ### #########  ########## ###    ###
 ::::::::      :::     :::        :::                      :::    :::  ::::::::
:+:    :+:   :+: :+:   :+:        :+:                      :+:    :+: :+:    :+:
+:+         +:+   +:+  +:+        +:+                      +:+    +:+ +:+
+#+        +#++:++#++: +#+        +#+        +#++:++#++:++ +#+    +:+ +#++:++#++
+#+        +#+     +#+ +#+        +#+                      +#+    +#+        +#+
#+#    #+# #+#     #+# #+#        #+#                      #+#    #+# #+#    #+#
 ########  ###     ### ########## ##########                ########   ########
*/

/*

  Headers, mobile-links, mobile-search, etc.

*/

.mobile-header header {
  background: #FFF;
}

.mobile-header header.call-us a {
  background: #000;
  display: block;
  text-align: center;
  padding: 0.6rem 0;
  color: #FFF;
}

.mobile-header header.call-us a span {
  text-decoration: underline;
}





/*

::::    ::::   ::::::::  :::::::::  ::::::::::: :::        ::::::::::
+:+:+: :+:+:+ :+:    :+: :+:    :+:     :+:     :+:        :+:
+:+ +:+:+ +:+ +:+    +:+ +:+    +:+     +:+     +:+        +:+
+#+  +:+  +#+ +#+    +:+ +#++:++#+      +#+     +#+        +#++:++#
+#+       +#+ +#+    +#+ +#+    +#+     +#+     +#+        +#+
#+#       #+# #+#    #+# #+#    #+#     #+#     #+#        #+#
###       ###  ########  #########  ########### ########## ##########
:::    ::: ::::::::::     :::     :::::::::  :::::::::: :::::::::
:+:    :+: :+:          :+: :+:   :+:    :+: :+:        :+:    :+:
+:+    +:+ +:+         +:+   +:+  +:+    +:+ +:+        +:+    +:+
+#++:++#++ +#++:++#   +#++:++#++: +#+    +:+ +#++:++#   +#++:++#:
+#+    +#+ +#+        +#+     +#+ +#+    +#+ +#+        +#+    +#+
#+#    #+# #+#        #+#     #+# #+#    #+# #+#        #+#    #+#
###    ### ########## ###     ### #########  ########## ###    ###
:::    :::     :::     ::::    ::::  :::::::::  :::    :::  ::::::::  :::::::::: :::::::::
:+:    :+:   :+: :+:   +:+:+: :+:+:+ :+:    :+: :+:    :+: :+:    :+: :+:        :+:    :+:
+:+    +:+  +:+   +:+  +:+ +:+:+ +:+ +:+    +:+ +:+    +:+ +:+        +:+        +:+    +:+
+#++:++#++ +#++:++#++: +#+  +:+  +#+ +#++:++#+  +#+    +:+ :#:        +#++:++#   +#++:++#:
+#+    +#+ +#+     +#+ +#+       +#+ +#+    +#+ +#+    +#+ +#+   +#+# +#+        +#+    +#+
#+#    #+# #+#     #+# #+#       #+# #+#    #+# #+#    #+# #+#    #+# #+#        #+#    #+#
###    ### ###     ### ###       ### #########   ########   ########  ########## ###    ###
:::        ::::::::::: ::::    ::: :::    :::  ::::::::
:+:            :+:     :+:+:   :+: :+:   :+:  :+:    :+:
+:+            +:+     :+:+:+  +:+ +:+  +:+   +:+
+#+            +#+     +#+ +:+ +#+ +#++:++    +#++:++#++
+#+            +#+     +#+  +#+#+# +#+  +#+          +#+
#+#            #+#     #+#   #+#+# #+#   #+#  #+#    #+#
########## ########### ###    #### ###    ###  ########

*/

#mobile-menu-links {
  display: none;
  background: #333;
  /*height: 100%;*/
}

#mobile-menu-links ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

#mobile-menu-links ul li {
  padding: 10px;
  border-bottom: 1px solid #666;
}

#mobile-menu-links ul li a {
  display: block;
  color: #FFF;

}

#mobile-menu-links ul li.category-link {
  background: white;
  border-bottom: 1px solid #dbdbdb;
}

#mobile-menu-links ul li.category-link a {
  color: #000;
  background: white url("/images/menu-chevron-right.png") right center no-repeat;
  background-size: 24px 24px;
  right: -10;
  top: 0;
}




/*

::::    ::::   ::::::::  :::::::::  ::::::::::: :::        ::::::::::
+:+:+: :+:+:+ :+:    :+: :+:    :+:     :+:     :+:        :+:
+:+ +:+:+ +:+ +:+    +:+ +:+    +:+     +:+     +:+        +:+
+#+  +:+  +#+ +#+    +:+ +#++:++#+      +#+     +#+        +#++:++#
+#+       +#+ +#+    +#+ +#+    +#+     +#+     +#+        +#+
#+#       #+# #+#    #+# #+#    #+#     #+#     #+#        #+#
###       ###  ########  #########  ########### ########## ##########
:::    ::: ::::::::::     :::     :::::::::  :::::::::: :::::::::
:+:    :+: :+:          :+: :+:   :+:    :+: :+:        :+:    :+:
+:+    +:+ +:+         +:+   +:+  +:+    +:+ +:+        +:+    +:+
+#++:++#++ +#++:++#   +#++:++#++: +#+    +:+ +#++:++#   +#++:++#:
+#+    +#+ +#+        +#+     +#+ +#+    +#+ +#+        +#+    +#+
#+#    #+# #+#        #+#     #+# #+#    #+# #+#        #+#    #+#
###    ### ########## ###     ### #########  ########## ###    ###
 ::::::::  ::::::::::     :::     :::::::::   ::::::::  :::    :::               :::    ::: :::::::::::
:+:    :+: :+:          :+: :+:   :+:    :+: :+:    :+: :+:    :+:               :+:    :+:     :+:
+:+        +:+         +:+   +:+  +:+    +:+ +:+        +:+    +:+               +:+    +:+     +:+
+#++:++#++ +#++:++#   +#++:++#++: +#++:++#:  +#+        +#++:++#++ +#++:++#++:++ +#+    +:+     +#+
       +#+ +#+        +#+     +#+ +#+    +#+ +#+        +#+    +#+               +#+    +#+     +#+
#+#    #+# #+#        #+#     #+# #+#    #+# #+#    #+# #+#    #+#               #+#    #+#     #+#
 ########  ########## ###     ### ###    ###  ########  ###    ###                ########  ###########

*/








/*

::::    ::::   ::::::::  :::::::::  ::::::::::: :::        ::::::::::
+:+:+: :+:+:+ :+:    :+: :+:    :+:     :+:     :+:        :+:
+:+ +:+:+ +:+ +:+    +:+ +:+    +:+     +:+     +:+        +:+
+#+  +:+  +#+ +#+    +:+ +#++:++#+      +#+     +#+        +#++:++#
+#+       +#+ +#+    +#+ +#+    +#+     +#+     +#+        +#+
#+#       #+# #+#    #+# #+#    #+#     #+#     #+#        #+#
###       ###  ########  #########  ########### ########## ##########
:::    :::  ::::::::  ::::    ::::  ::::::::::               :::::::::      :::      ::::::::  ::::::::::
:+:    :+: :+:    :+: +:+:+: :+:+:+ :+:                      :+:    :+:   :+: :+:   :+:    :+: :+:
+:+    +:+ +:+    +:+ +:+ +:+:+ +:+ +:+                      +:+    +:+  +:+   +:+  +:+        +:+
+#++:++#++ +#+    +:+ +#+  +:+  +#+ +#++:++#   +#++:++#++:++ +#++:++#+  +#++:++#++: :#:        +#++:++#
+#+    +#+ +#+    +#+ +#+       +#+ +#+                      +#+        +#+     +#+ +#+   +#+# +#+
#+#    #+# #+#    #+# #+#       #+# #+#                      #+#        #+#     #+# #+#    #+# #+#
###    ###  ########  ###       ### ##########               ###        ###     ###  ########  ##########
 ::::::::   ::::::::  ::::    ::: ::::::::::: :::::::::: ::::    ::: :::::::::::
:+:    :+: :+:    :+: :+:+:   :+:     :+:     :+:        :+:+:   :+:     :+:
+:+        +:+    +:+ :+:+:+  +:+     +:+     +:+        :+:+:+  +:+     +:+
+#+        +#+    +:+ +#+ +:+ +#+     +#+     +#++:++#   +#+ +:+ +#+     +#+
+#+        +#+    +#+ +#+  +#+#+#     +#+     +#+        +#+  +#+#+#     +#+
#+#    #+# #+#    #+# #+#   #+#+#     #+#     #+#        #+#   #+#+#     #+#
 ########   ########  ###    ####     ###     ########## ###    ####     ###

*/

.all-categories ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.all-categories ul li a {
  padding: 10px;
  display: block;

  text-decoration: underline;

  border-bottom: 1px solid #dbdbdb;
  text-decoration: underline;
  color: #000;

  background-size: 24px 24px;
  right: -10;
  top: 0;
}

.new-products {
  font-weight: bold;
  color: #000;
}

@media all and (max-width: 991px) {
  .all-categories ul li a {
    /*background: url("/images/menu-chevron-right.png") right center no-repeat;*/
  }
}




/*

:::::::::  :::::::::   ::::::::  :::::::::  :::    :::  ::::::::  :::::::::::
:+:    :+: :+:    :+: :+:    :+: :+:    :+: :+:    :+: :+:    :+:     :+:
+:+    +:+ +:+    +:+ +:+    +:+ +:+    +:+ +:+    +:+ +:+            +:+
+#++:++#+  +#++:++#:  +#+    +:+ +#+    +:+ +#+    +:+ +#+            +#+
+#+        +#+    +#+ +#+    +#+ +#+    +#+ +#+    +#+ +#+            +#+
#+#        #+#    #+# #+#    #+# #+#    #+# #+#    #+# #+#    #+#     #+#
###        ###    ###  ########  #########   ########   ########      ###
:::::::::      :::      ::::::::  ::::::::::
:+:    :+:   :+: :+:   :+:    :+: :+:
+:+    +:+  +:+   +:+  +:+        +:+
+#++:++#+  +#++:++#++: :#:        +#++:++#
+#+        +#+     +#+ +#+   +#+# +#+
#+#        #+#     #+# #+#    #+# #+#
###        ###     ###  ########  ##########
 ::::::::  :::::::::: ::::    ::: :::::::::: :::::::::      :::     :::
:+:    :+: :+:        :+:+:   :+: :+:        :+:    :+:   :+: :+:   :+:
+:+        +:+        :+:+:+  +:+ +:+        +:+    +:+  +:+   +:+  +:+
:#:        +#++:++#   +#+ +:+ +#+ +#++:++#   +#++:++#:  +#++:++#++: +#+
+#+   +#+# +#+        +#+  +#+#+# +#+        +#+    +#+ +#+     +#+ +#+
#+#    #+# #+#        #+#   #+#+# #+#        #+#    #+# #+#     #+# #+#
 ########  ########## ###    #### ########## ###    ### ###     ### ##########

*/

/*

  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING

*/

.product-preview img {
  max-height: 320px;
}

.breadcrumbs-separator {
  margin: auto 0.5rem;
}



/*

:::::::::::  ::::::::  :::::::::                :::        :::::::::: :::     ::: :::::::::: :::
    :+:     :+:    :+: :+:    :+:               :+:        :+:        :+:     :+: :+:        :+:
    +:+     +:+    +:+ +:+    +:+               +:+        +:+        +:+     +:+ +:+        +:+
    +#+     +#+    +:+ +#++:++#+  +#++:++#++:++ +#+        +#++:++#   +#+     +:+ +#++:++#   +#+
    +#+     +#+    +#+ +#+                      +#+        +#+         +#+   +#+  +#+        +#+
    #+#     #+#    #+# #+#                      #+#        #+#          #+#+#+#   #+#        #+#
    ###      ########  ###                      ########## ##########     ###     ########## ##########
 ::::::::      :::     ::::::::::: ::::::::::  ::::::::   ::::::::  :::::::::  :::   :::
:+:    :+:   :+: :+:       :+:     :+:        :+:    :+: :+:    :+: :+:    :+: :+:   :+:
+:+         +:+   +:+      +:+     +:+        +:+        +:+    +:+ +:+    +:+  +:+ +:+
+#+        +#++:++#++:     +#+     +#++:++#   :#:        +#+    +:+ +#++:++#:    +#++:
+#+        +#+     +#+     +#+     +#+        +#+   +#+# +#+    +#+ +#+    +#+    +#+
#+#    #+# #+#     #+#     #+#     #+#        #+#    #+# #+#    #+# #+#    #+#    #+#
 ########  ###     ###     ###     ##########  ########   ########  ###    ###    ###

*/

.tlc h1 {
  font-size: 1.5rem;
  margin-top: 1rem;
}

.tlc-banner {
  border-bottom: 1px solid #CCC;
  text-align: center;
}

.tlc-banner img {
  margin: 0 auto;
}

#head-copy {
  margin: 1rem;
}


.category-lineage {
  padding: 0.75rem 0;
  margin: 0;
}

.category-name {
  margin: 0;
  padding: 0;
  font-size: 1.6rem;
}

.category-metadata {
  margin: 0;
  padding: 0;
}

.tlc-result {
  flex: 200px;

  margin-bottom: 1rem;
  padding-top: 1rem;
  /*border-top: 1px solid #CCC;*/

}

.tlc-image-container {
  min-width: 145px;
  width: 145px;
  max-width: 145px;

  min-height: 145px;
  height: 145px;
  max-height: 145px;

  text-align: center;
}

.tlc-container img {
  max-width: 100%;
  max-height: 145px;
  margin: 0 auto;
}

.tlc-result a {
  color: black;
}

#tlc-body ul ul {
  margin-left: 1rem;
}

.tlc-with-children span {
  float: right;
}

.tlc-nav {
  margin: 0;
  padding: 0;
  list-style: none;
}

.tlc-nav a {
  color: #000;
  text-decoration: none;
  padding: 0.5rem 0;
  display: block;
}

.tlc-nav ul {
  margin: 0 0 0 1rem;
  padding: 0;
  list-style: none;
}

.tlc-nav a:hover {
  background: #333;
  color: #F2F2F2;
}



/*

 ::::::::  :::::::::: ::::    ::: :::::::::: :::::::::  :::::::::::  ::::::::
:+:    :+: :+:        :+:+:   :+: :+:        :+:    :+:     :+:     :+:    :+:
+:+        +:+        :+:+:+  +:+ +:+        +:+    +:+     +:+     +:+
:#:        +#++:++#   +#+ +:+ +#+ +#++:++#   +#++:++#:      +#+     +#+
+#+   +#+# +#+        +#+  +#+#+# +#+        +#+    +#+     +#+     +#+
#+#    #+# #+#        #+#   #+#+# #+#        #+#    #+#     #+#     #+#    #+#
 ########  ########## ###    #### ########## ###    ### ###########  ########
 ::::::::      :::     ::::::::::: ::::::::::  ::::::::   ::::::::  :::::::::  :::   :::
:+:    :+:   :+: :+:       :+:     :+:        :+:    :+: :+:    :+: :+:    :+: :+:   :+:
+:+         +:+   +:+      +:+     +:+        +:+        +:+    +:+ +:+    +:+  +:+ +:+
+#+        +#++:++#++:     +#+     +#++:++#   :#:        +#+    +:+ +#++:++#:    +#++:
+#+        +#+     +#+     +#+     +#+        +#+   +#+# +#+    +#+ +#+    +#+    +#+
#+#    #+# #+#     #+#     #+#     #+#        #+#    #+# #+#    #+# #+#    #+#    #+#
 ########  ###     ###     ###     ##########  ########   ########  ###    ###    ###

*/

/*

  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING

  Category-page-images use `product2`, 450x300px.

  I reduced 450 to 320 and the 300 came down to 213.

  That's where these numbers come from.

*/

.cluster {
  margin-bottom: 1rem;
  /*border: 1px solid #CCC;*/
}

.cluster .category-cluster-image {
  max-width: 100%;
  max-height: 100%;


  /*border: 1px solid #CCC;*/
}

.cluster .category-cluster-image-2 {
  /*max-width: 100%;*/
  /*height: 213px;*/ /*FUCK YOU GOD*/
  /*width: 100%;*/
  border: 1px solid #CCC;
}

.cluster .category-cluster-title {
  color: #000;
  font-size: 1.2rem;
  margin: 0.5rem 0;
}

.cluster .category-product-cluster-sku {
  font-size: 0.9rem;
  color: #666;
}





/*

 ::::::::      :::     :::::::::  :::::::::::           :::     ::::    ::: :::::::::
:+:    :+:   :+: :+:   :+:    :+:     :+:             :+: :+:   :+:+:   :+: :+:    :+:
+:+         +:+   +:+  +:+    +:+     +:+            +:+   +:+  :+:+:+  +:+ +:+    +:+
+#+        +#++:++#++: +#++:++#:      +#+           +#++:++#++: +#+ +:+ +#+ +#+    +:+
+#+        +#+     +#+ +#+    +#+     +#+           +#+     +#+ +#+  +#+#+# +#+    +#+
#+#    #+# #+#     #+# #+#    #+#     #+#           #+#     #+# #+#   #+#+# #+#    #+#
 ########  ###     ### ###    ###     ###           ###     ### ###    #### #########
 ::::::::  :::    ::: ::::::::::  ::::::::  :::    :::  ::::::::  :::    ::: :::::::::::
:+:    :+: :+:    :+: :+:        :+:    :+: :+:   :+:  :+:    :+: :+:    :+:     :+:
+:+        +:+    +:+ +:+        +:+        +:+  +:+   +:+    +:+ +:+    +:+     +:+
+#+        +#++:++#++ +#++:++#   +#+        +#++:++    +#+    +:+ +#+    +:+     +#+
+#+        +#+    +#+ +#+        +#+        +#+  +#+   +#+    +#+ +#+    +#+     +#+
#+#    #+# #+#    #+# #+#        #+#    #+# #+#   #+#  #+#    #+# #+#    #+#     #+#
 ########  ###    ### ##########  ########  ###    ###  ########   ########      ###

*/

/*

  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING

*/
.cart-product-image-wrapper {
  width: 100%;
  max-width: 48px;
  max-height: 48px;
}

.cart-h2 {
  font-size: 1.1rem;
  margin: 0.5rem 0;
  padding: 0;
  text-align: center;
}

.cart-h1 {
  font-size: 1.3rem;
  margin: 0.5rem 0;
  padding: 0;
  text-align: center;
}

@media all and (min-width: 1200px) {
  .checkout-label {
    text-align: right;
    display: block;
    margin: 0;
    padding: 0;
    margin-right: 0.5rem;

  }

  .col-form-label {
    text-align: right;
  }
}




/*

::::    ::::   ::::::::  :::::::::      :::     :::         ::::::::
+:+:+: :+:+:+ :+:    :+: :+:    :+:   :+: :+:   :+:        :+:    :+:
+:+ +:+:+ +:+ +:+    +:+ +:+    +:+  +:+   +:+  +:+        +:+
+#+  +:+  +#+ +#+    +:+ +#+    +:+ +#++:++#++: +#+        +#++:++#++
+#+       +#+ +#+    +#+ +#+    +#+ +#+     +#+ +#+               +#+
#+#       #+# #+#    #+# #+#    #+# #+#     #+# #+#        #+#    #+#
###       ###  ########  #########  ###     ### ##########  ########

*/

/*

  Vue.js modal rules.

*/

.modal-container table {
  width: 100%;
}

.modal-container table tr td {
  border-bottom: 1px solid #CCC;
  padding: 0.5rem 0;
}

.modal-add-to-cart {
  display: flex;
  justify-content: space-between;
  align-content: start;

}

.modal-add-to-cart button {
  flex: 0 0 4rem;
  text-align: center;
  font-size: 1.2rem;
}

.modal-add-to-cart input {
  flex: 0 0 70px;
  border: 1px solid #CCC;
  text-align: center;
  /*align-self: center;*/
  padding: 0.5rem;
  margin: 0.5rem 0;
}

.modal-mask {
  position: fixed;
  z-index: 9998;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .5);
  display: table;
  transition: opacity 0s ease;
}

.modal-wrapper {
  display: table-cell;
  vertical-align: middle;
}

/*

  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING
  DEVICE-SPECIFIC WARNING

*/
.modal-container {
  width: 300px;
  margin: 0px auto;
  padding: 10px 20px;
  background-color: #fff;
  border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .33);
  transition: all 0s ease;
  font-family: Helvetica, Arial, sans-serif;
}

.modal-header h3 {
  margin-top: 0;
  color: #42b983;
}

.modal-body {
  margin: 10px 0;
}

.modal-footer {
  text-align: center;
}





/*

::::::::::  ::::::::   ::::::::  ::::::::::: :::::::::: :::::::::
:+:        :+:    :+: :+:    :+:     :+:     :+:        :+:    :+:
+:+        +:+    +:+ +:+    +:+     +:+     +:+        +:+    +:+
:#::+::#   +#+    +:+ +#+    +:+     +#+     +#++:++#   +#++:++#:
+#+        +#+    +#+ +#+    +#+     +#+     +#+        +#+    +#+
#+#        #+#    #+# #+#    #+#     #+#     #+#        #+#    #+#
###         ########   ########      ###     ########## ###    ###

*/

footer {
  padding-bottom: 2rem;
  border-top: 1px solid #CCC;
  background: #F2F2F2;
}

footer h5 {
  font-size: 1.5rem;
}

footer p.quiet {
  font-size: 1rem;
  color: #666666;
}

footer ul {
  list-style: none;
  margin: 0;
  padding: 0;
}




/*

::::    ::: :::::::::: :::       :::  ::::::::  :::        :::::::::: ::::::::::: ::::::::::: :::::::::: :::::::::
:+:+:   :+: :+:        :+:       :+: :+:    :+: :+:        :+:            :+:         :+:     :+:        :+:    :+:
:+:+:+  +:+ +:+        +:+       +:+ +:+        +:+        +:+            +:+         +:+     +:+        +:+    +:+
+#+ +:+ +#+ +#++:++#   +#+  +:+  +#+ +#++:++#++ +#+        +#++:++#       +#+         +#+     +#++:++#   +#++:++#:
+#+  +#+#+# +#+        +#+ +#+#+ +#+        +#+ +#+        +#+            +#+         +#+     +#+        +#+    +#+
#+#   #+#+# #+#         #+#+# #+#+#  #+#    #+# #+#        #+#            #+#         #+#     #+#        #+#    #+#
###    #### ##########   ###   ###    ########  ########## ##########     ###         ###     ########## ###    ###

*/

.newsletter {
  padding: 3rem 0;
  color: white;
  background: url("/images/footer-bg-tile.png") top left repeat;
}

.newsletter p {
  font-size: 1.1rem;
}

.newsletter a,
.newsletter text-muted a {
  color: #FFF;
}















/*

:::::::::  ::::::::::  ::::::::  :::    ::: :::::::::::  ::::::::  :::::::::
:+:    :+: :+:        :+:    :+: :+:   :+:      :+:     :+:    :+: :+:    :+:
+:+    +:+ +:+        +:+        +:+  +:+       +:+     +:+    +:+ +:+    +:+
+#+    +:+ +#++:++#   +#++:++#++ +#++:++        +#+     +#+    +:+ +#++:++#+
+#+    +#+ +#+               +#+ +#+  +#+       +#+     +#+    +#+ +#+
#+#    #+# #+#        #+#    #+# #+#   #+#      #+#     #+#    #+# #+#
#########  ##########  ########  ###    ###     ###      ########  ###
:::    ::: ::::::::::     :::     :::::::::  :::::::::: :::::::::
:+:    :+: :+:          :+: :+:   :+:    :+: :+:        :+:    :+:
+:+    +:+ +:+         +:+   +:+  +:+    +:+ +:+        +:+    +:+
+#++:++#++ +#++:++#   +#++:++#++: +#+    +:+ +#++:++#   +#++:++#:
+#+    +#+ +#+        +#+     +#+ +#+    +#+ +#+        +#+    +#+
#+#    #+# #+#        #+#     #+# #+#    #+# #+#        #+#    #+#
###    ### ########## ###     ### #########  ########## ###    ###

*/


.desktop-header {
/*  -webkit-box-shadow: 0px -4px 3px rgba(50, 50, 50, 0.75);
  -moz-box-shadow: 0px -4px 3px rgba(50, 50, 50, 0.75);
  box-shadow: 0px -4px 3px rgba(50, 50, 50, 0.75);*/
}

.desktop-header .call-us {
  background: black;
  color: #FFF;
}

.desktop-header .call-us a {
  color: #FFF;
  line-height: 50px;
}

.desktop-header .telly {
  font-size: 1.25rem;
  margin: 0.5rem 0;
}

@media all and (min-width: 1200px) {
  .desktop-search-input {
    min-width: 400px;
  }
}

.all-desktop-top-level-categories {
  display: none;
  padding: 1rem 0;
  border-top: 1px solid #999;
  background: linear-gradient(to bottom, rgba(220, 220, 220, 0.25), rgba(242, 242, 242, 0));;
}

.all-desktop-top-level-categories a {
  color: #000;
  padding: 0.25rem 0;
}




/*

:::::::::  ::::::::::  ::::::::  :::    ::: :::::::::::  ::::::::  :::::::::
:+:    :+: :+:        :+:    :+: :+:   :+:      :+:     :+:    :+: :+:    :+:
+:+    +:+ +:+        +:+        +:+  +:+       +:+     +:+    +:+ +:+    +:+
+#+    +:+ +#++:++#   +#++:++#++ +#++:++        +#+     +#+    +:+ +#++:++#+
+#+    +#+ +#+               +#+ +#+  +#+       +#+     +#+    +#+ +#+
#+#    #+# #+#        #+#    #+# #+#   #+#      #+#     #+#    #+# #+#
#########  ##########  ########  ###    ###     ###      ########  ###
:::    :::  ::::::::  ::::    ::::  ::::::::::
:+:    :+: :+:    :+: +:+:+: :+:+:+ :+:
+:+    +:+ +:+    +:+ +:+ +:+:+ +:+ +:+
+#++:++#++ +#+    +:+ +#+  +:+  +#+ +#++:++#
+#+    +#+ +#+    +#+ +#+       +#+ +#+
#+#    #+# #+#    #+# #+#       #+# #+#
###    ###  ########  ###       ### ##########

*/

.desktop-home {
  margin-top: 1rem;
}

.desktop-home ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.desktop-quick-links a {
  color: #000;
  text-decoration: none;
  line-height: 1.5rem;
  font-weight: bold;
  padding: 0.5rem 0;
}

.desktop-quick-links a:hover {
  text-decoration: underline;
}

.desktop-home ul li a {
  color: #000;
  line-height: 1.5rem;
  display: block;
  padding: 0.25rem 0;
}









/*

::::    ::: ::::::::::: ::::::::::
:+:+:   :+:     :+:     :+:
:+:+:+  +:+     +:+     +:+
+#+ +:+ +#+     +#+     +#++:++#
+#+  +#+#+#     +#+     +#+
#+#   #+#+#     #+#     #+#
###    ####     ###     ##########
 ::::::::  :::::::::   ::::::::   ::::::::   ::::::::
:+:    :+: :+:    :+: :+:    :+: :+:    :+: :+:    :+:
+:+        +:+    +:+ +:+    +:+ +:+        +:+
+#+        +#++:++#:  +#+    +:+ +#++:++#++ +#++:++#++ +#++:++#++:++
+#+        +#+    +#+ +#+    +#+        +#+        +#+
#+#    #+# #+#    #+# #+#    #+# #+#    #+# #+#    #+#
 ########  ###    ###  ########   ########   ########
:::::::::  :::::::::: :::::::::: :::::::::: :::::::::  :::::::::: ::::    :::  ::::::::  ::::::::::
:+:    :+: :+:        :+:        :+:        :+:    :+: :+:        :+:+:   :+: :+:    :+: :+:
+:+    +:+ +:+        +:+        +:+        +:+    +:+ +:+        :+:+:+  +:+ +:+        +:+
+#++:++#:  +#++:++#   :#::+::#   +#++:++#   +#++:++#:  +#++:++#   +#+ +:+ +#+ +#+        +#++:++#
+#+    +#+ +#+        +#+        +#+        +#+    +#+ +#+        +#+  +#+#+# +#+        +#+
#+#    #+# #+#        #+#        #+#        #+#    #+# #+#        #+#   #+#+# #+#    #+# #+#
###    ### ########## ###        ########## ###    ### ########## ###    ####  ########  ##########

*/



.nte-ccr {
  flex: 1 250px;
}

.nte-ccr > a:first-child {
  /*border: 1px solid #CCC;*/
  width: 100%;
  text-align: center;
}

.nte-ccr > a:first-child > img {
  margin: 0 auto;
}

.nte-ccr a {
  color: #000;
}

.nte-ccr {
  margin-right: 1rem;
  margin-bottom: 1rem;
}





/*

:::::::::  ::::::::::  ::::::::  :::    ::: :::::::::::  ::::::::  :::::::::
:+:    :+: :+:        :+:    :+: :+:   :+:      :+:     :+:    :+: :+:    :+:
+:+    +:+ +:+        +:+        +:+  +:+       +:+     +:+    +:+ +:+    +:+
+#+    +:+ +#++:++#   +#++:++#++ +#++:++        +#+     +#+    +:+ +#++:++#+
+#+    +#+ +#+               +#+ +#+  +#+       +#+     +#+    +#+ +#+
#+#    #+# #+#        #+#    #+# #+#   #+#      #+#     #+#    #+# #+#
#########  ##########  ########  ###    ###     ###      ########  ###
 ::::::::      :::     :::::::::  :::::::::::
:+:    :+:   :+: :+:   :+:    :+:     :+:
+:+         +:+   +:+  +:+    +:+     +:+
+#+        +#++:++#++: +#++:++#:      +#+
+#+        +#+     +#+ +#+    +#+     +#+
#+#    #+# #+#     #+# #+#    #+#     #+#
 ########  ###     ### ###    ###     ###

*/

  #master-cart table {
    width: 100%;
  }

  #master-cart table tr {
    border-bottom: 1px solid #CCC;
  }

  #master-cart table td,
  #master-cart table th {
    padding: 5px;
  }

  #master-cart table td:last-child,
  #master-cart table th:last-child {
    text-align: right;
  }

  #master-cart table tr:last-child {
    border: none;
/*    font-weight: bold;*/
  }



label:before {
  margin-bottom: 0;
  color: white;
}


.funkradio div label {
  margin-bottom: 0;
}

.funkyradio div {
  clear: both;
  overflow: hidden;
  display: inline-block;
}

.funkyradio label {
  width: 100%;
  /*border-radius: 3px;*/
  border: 1px solid #D1D3D4;
  font-weight: normal;
  padding: 0;
  width: 150px;
  font-size: 0.9rem;
}

.funkyradio input[type="radio"]:empty,
.funkyradio input[type="checkbox"]:empty {
  display: none;
}

.funkyradio input[type="radio"]:empty ~ label,
.funkyradio input[type="checkbox"]:empty ~ label {
  position: relative;
  line-height: 2.0rem;
  text-indent: 2.5rem;
  /*margin-top: 2rem;*/
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.funkyradio input[type="radio"]:empty ~ label:before,
.funkyradio input[type="checkbox"]:empty ~ label:before {
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  left: 0;
  content: '';
  width: 2.0em;
  background: #D1D3D4;
  /*border-radius: 3px 0 0 3px;*/
}

.funkyradio input[type="radio"]:hover:not(:checked) ~ label,
.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label {
  /*color: #888;*/
  padding-right: 1rem;
}

.funkyradio input[type="radio"]:hover:not(:checked) ~ label:before,
.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label:before {
  content: '\2714'; /* Check-mark */
  /*content: '\2297';*/
  text-indent: 0.5em;
  /*color: #C2C2C2;*/
  color: #FFF;
}

.funkyradio input[type="radio"]:checked ~ label,
.funkyradio input[type="checkbox"]:checked ~ label {
  /*color: #777;*/
}

.funkyradio input[type="radio"]:checked ~ label:before,
.funkyradio input[type="checkbox"]:checked ~ label:before {
  content: '\2714';
  text-indent: 0.25em;

  background-color: #ccc;
  color: #FFF;
}



.funkyradio-primary {
  padding-right: 0.5rem;
}

.funkyradio-primary input[type="radio"]:checked ~ label:before,
.funkyradio-primary input[type="checkbox"]:checked ~ label:before {
  color: #fff;
  background-color: #337ab7;
}

.xxx:before {
  color: red;
}
