@import url(custom_fonts.css);

/*   COMMON STYLES   */

body {
  font-family: "HNC-Roman";
  font-size: 14px;
  color:  #2f2f2f;
  margin: 0;
  padding: 0;
}

div.container-fluid {
  padding: 0;
}

div.container {
  width: 100%;
  padding: 0 15px;
  margin: 0 auto;
}

div.row,
.spec > .area {
  max-width: 1140px;
  margin: 0 auto;
}

p {
  margin-bottom: 10px;
}

.module {
  position: relative;
}

.your-email p,
.subscr p {
  margin: 0;
}

#content .wrapper .upper {
  text-transform: uppercase;
}

#content .wrapper .align-left {
  text-align: left;
}
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "HNC-Medium";
}

p.h1 {
  font-size: 36px;
  color: #000;
  margin: 50px 0 30px;
}

.subscr p.h1 {
  color: #2d2d2d;
  margin: 0;
}

p.h3 {
  font-size: 24px;
  color: #000;
  margin-top: 30px;
  margin-bottom: 10px;
}

.btn {
  font-size: 14px;
  background: none;
  color: #333;
  background: #ff0;
  height: 36px;
  line-height: 34px;
  padding: 0 15px;
  border-radius: 23px;
  display: inline-block;
  text-align: center;
  border: 1px solid #ff0;
  transition: 0.25s;
}

.btn2 {
  color: #000;
  background: #97cf1f;
  font-family: "GothamProMed";
  font-size: 15px;
}

.rating-filter .btn {
  display: inline-block;
  margin-bottom: 5px;
}

.rating-filter .button-group {
  margin: 15px 0;
}

.btn:hover,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-secondary:not(:disabled):not(.disabled):active:focus,
.btn-primary:focus,
.btn:focus {
  border: 1px solid #000;
  background: #000;
  color: #ff0;
}

.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus, .btn-primary.focus, .btn-primary:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus {
  box-shadow: none !important;
}

.btn-primary:disabled {
  background: #3c362d !important;
  border-color: #3c362d !important;
  color: #fff !important;
}

body btn.focus, body .btn:focus {
  box-shadow: none;
}

.wrapper table th, .wrapper table td {
  text-align: center;
}

table.variation tr {
  background: #fff;
}

table.variation tr:first-of-type {
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}

.left-area {
  float: left;
  padding-right: 15px !important;
}

.right-area {
  float: right;
}

input[type="submit"]:hover {
  cursor: pointer;
}

ul.breadcrumbs {
  margin-top: 10px;
}

ul.breadcrumbs > li {
  font-family: "HNC-Medium";
  font-size: 16px;
  color: #000;
  display: inline-block;
  float: left;
  position: relative;
}

ul.breadcrumbs > li:not(:last-of-type) {
  margin-right: 20px;
}

ul.breadcrumbs > li:not(:last-of-type) > a::after {
  content: "/";
  display: block;
  position: absolute;
  top: 0;
  right: -13px;
}

ul.breadcrumbs > li > a {
  color: #17639f;
  font-weight: normal;
}

#callback p:not(:last-of-type) {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#callback p:not(:last-of-type) input {
  border: 2px solid #ebebeb;
  height: 32px;
  border-radius: 16px;
  text-indent: 1em;
}

#callback p:last-of-type input {
  display: block;
  width: fit-content;
  margin: 15px auto 0;
  height: 40px;
  line-height: 40px;
  font-size: 16px;
  padding: 0 20px;
  text-transform: uppercase;
  transition: 0.4s;
}

#callback label {
  margin: 0;
}

#callback .form-message {
  text-align: center;
}

#add-to-cart-name {
  color: #17639f;
}

#AddToCartModal a.checkout, #AddToCartModal button.more {
  display: block;
  width: fit-content;
  margin: 0 auto 15px;
  float: none;
}

#AddToCartModal button.more {
  font-size: 14px;
}

#AddToCartModal p.h3 {
  text-align: center;
}

#cart-button {
  display: block;
  width: 30%;
  height: 40px;
  float: right;
}

#cart-button:focus {
  box-shadow: none;
}

a.no-page, a.err500, p.err500 {
  display: block; 
  width: fit-content; 
  margin: 0px auto; 
  font-family: "Roboto Medium";
  font-size: 18px;
  text-decoration: none;
  color: #000;
}

p.err500 {
  text-align: center;
  margin: 0px auto 15px;
  color: #757575;
}

a.no-page:hover, a.err500:hover {
  text-decoration: underline;
  color: #a2a2a2;
}

s {
  color: #c5c5c5;
}

.char-name, .char h3 {
  color: #17639f;
  font-size: 18px;
}

.char h3 {
  text-transform: uppercase;
}

.delivery-box img {
  max-width: 100%;
}

.viewed {
  width: 100%;
  margin: 0 auto;
}

.viewed .owl-carousel.owl-loaded {
  margin: 0 auto;
}

.modal {
  color: #000;
}

/*   --------------------   */





/*   HEADER STYLES  */

header {
  color: #fff;
}

.header-row {
  background: #17639f;
}

.logo img {
  width: 100%;
  min-width: 88px;
}

#nav-top {
  margin: 0 auto;
}

nav.navbar {
  padding-left: 0;
  padding-right: 0;
}

.navbar-light .navbar-nav a.nav-link {
  color: #333;
}

body a:hover,
.navbar-light .navbar-nav .nav-item:hover a.nav-link,
.left-column .list-unstyled > li:hover > a,
.left-column .list-unstyled > li.active > a {
  color: #17639f;
  text-decoration: none;
}

.navbar-toggler {
  display: block;
  margin: 0 auto;
}

.email {
  text-align: center;
}

.email span {
  padding-left: 18px;
  background: url("/media/common/email.png") no-repeat left center;
}

.phones {
  font-size: 15px;
  text-align: center;
}

.phones > .textline {
  display: inline-block;
  padding-left: 20px;
  background: url("/media/common/phone.png") no-repeat left center;
}

.phones p {
  margin: 0;
}

.callback {
  font-size: 20.9px;
  font-family: "Roboto Condensed";
  border-radius: 5px;
  display: block;
  margin: 0 auto;
  text-transform: uppercase;
}

.call-me {
  text-align: center;
}

.cart-block {
  display: flex;
  justify-content: center;
  align-items: center;
}

div.cart {
  line-height: 1.1;
  display: flex;
}

div.cart:hover {
  cursor: pointer;
}

div.cart a {
  font-size: 12px;
}

div.cart > a {
  background: url(/media/common/cart-bg.png) no-repeat left center;
  padding-left: 30px;
  display: flex;
  align-items: flex-end;
  margin: 5px auto;
  max-width: 130px;
  height: 20px;
  position: relative;
}

div.cart a:hover {
  text-decoration: none;
}

.cart-text {
  color: #fff;
  text-transform: uppercase;
}

#small-cart-total-sum {
  color: #000;
  display: block;
}

#small-cart-total-items {
  font-size: 10px;
  position: absolute;
  color: #fff;
  top: -7px;
  left: 10px;
  display: inline-block;
  min-width: 16px;
  height: 14px;
  line-height: 13px;
  text-align: center;
  border-radius: 7px;
  padding: 1px 2px;
  background: #226aa5;
}

#cart-link {
  font-family: "Roboto Condensed";
  font-size: 13px;
  color: #90c916;
  text-align: center;
}

.delivery-box img {
  max-width: 100%;
}

/*   --------------------   */





/*   SEARCH-ROW   */

.searching p {
  margin: 0;
}

.searching .clearfix::after {
  display: none;
}

.searching form, 
.searching form > div {
  height: 100%;
}

.searching form {
  position: relative;
}

.searching input[type="text"], 
.your-email p input {
  width: 100%;
  background: none;
}

.searching input[type="text"] {
  height: 20px;
  text-indent: 0.5em;
  border: none;
  border-bottom: 1px solid #d1d1d1;
  padding-right: 25px;
  color: #fff;
}

.searching input[type="text"]:focus {
  outline: none;
}

.your-email p input {
  height: 40px;
  text-indent: 1em;
  border: 2px solid transparent;
  border-bottom-color: #5e5e5e;
  width: 70%;
}

.your-email p input:focus {
  outline: none;
}

.searching input[type="submit"] {
  background: url("/media/common/search.png") no-repeat center !important;
  width: 21px;
  height: 21px;
  padding: 0;
  border: none;
}

.searching input.btn-primary[type="submit"]:active {
  background: url("/media/common/search.png") no-repeat center !important;
  border: none !important;
}

.searching p.pull-right {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.subscr input[type="submit"] {
  position: absolute;
  right: 0px;
  top: 0px;
}

.found {
  padding: 14px !important;
  margin-bottom: 25px;
}

.found .prod-wrap a > img {
  max-width: 100%;
}

/*   --------------------   */





/*   MAIN PAGE   */

.main-page {
  padding: 0;
}



	/*   LEFT COLUMN   */

    .left-column #sidebar {
      background: none;
    }

	.left-column .list-unstyled > li {
      font-size: 15px;
      width: 100%;
	}

    .sub-menu {
      display: none;
      margin-top: 10px;
    }

    li.active .sub-menu {
      display: block;
    }

	.left-menu {
      margin-bottom: 0;
      padding: 30px;
      background: #ddd;
	}

    .left-column .left-menu > li {
      padding: 5px 0;
      margin-bottom: 5px;
      font-family: "HNC-Medium";
      font-size: 15px;
      color: #000;
    }

	.left-column .list-unstyled > li > a {
      color: #000;
      display: inline-block;
      line-height: 20px;
	}

	.left-column .list-unstyled > li.has_children > a {
      padding-right: 25px;
      position: relative;
	}

	.left-column .list-unstyled > li.has_children > a {
      background: url("/media/common/come-in.png") no-repeat 95% center;
	}

	.left-column .list-unstyled > li.active.has_children > a {
      background: url("/media/common/u-r-in.png") no-repeat 95% center;
	}

    .left-column .list-unstyled > li .sub-menu li > a {
      font-family: "HNC-Light";
      font-size: 14px;
      color: #4d4d4d;
    }

	.left-column .list-unstyled > li .sub-menu li:hover > a,
    .left-column .list-unstyled > li .sub-menu li.active > a {
      color: #17639f;
	}

	.left-column #left-area {
      padding-right: 20px;
	}

	.left-column > div:not(:last-of-type) {
      margin-bottom: 25px;
	}

    .cat-left-mobile {
      background: #ebebeb;
    }

    .cat-left-mobile .nav-item {
      text-align: center;
    }

    .cat-left-mobile.navbar-light .navbar-nav .nav-link {
      font-family: "Roboto Regular";
      font-size: 14px;
      color: #000 !important;
      text-transform: uppercase;
    }

    .cat-left-mobile.navbar-light .navbar-nav .nav-link:hover {
      color: #ff4500 !important;
    }

	.top-week {
      margin-top: -14px;
	}

    .week-top {
      position: absolute;
      top: -25px;
      left: 0;
      opacity: 0.5;
      display: none;
    }

    .top-1 #top-1 {
      display: block;
    }

    .top-2 #top-2 {
      display: block;
    }

	/*   --------------------   */



	/*   SLIDER   */

	.slide {
      margin: 0 auto 50px;
      max-height: 450px;
	}

	.slide, .slide .item.active {
      position: relative;
	}

    .slide .item.active {
      left: 0;
    }

    .slide .item {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 100%;
      top: 0;
    }

	.slide .item img {
      width: 100%;
	}

	div.carousel-caption {
      position: absolute;
      bottom: 110px;
      left: 0;
      text-align: left;
      padding: 0;
      width: fit-content;
	}

	.caption {
      font-family: "Roboto Condensed";
      font-weight: bold;
      font-size: 35.6px;
      line-height: 45px;
      text-transform: uppercase;
      padding: 0 25px;
      display: block;
      margin: 0;
	}

	.caption-2 {
      font-size: 30px;
      line-height: 40px;
	}

    .caption.wh {
      background: rgba(255,255,255,0.8);
      color: #ffa800;
    }

    .caption.gr {
      background: rgba(0,182,34,0.8);
      color: #fff;
    }

	.slide .carousel-indicators li {
      width: 10px;
      height: 10px;
      border: 1px solid #fff;
      border-radius: 100%;
      background: transparent;
	}

    .slide .carousel-indicators li:hover {
      cursor: pointer;
    }

	.slide .carousel-indicators li.active {
      border: 1px solid #fff;
      background: #fff;
	}

	.carousel-control-next, .carousel-control-prev {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      display: inline-block;
      width: 15px;
      height: 27px;
      background: url("/media/common/carousel-controls.png") no-repeat;
      background-size: 206%;
      opacity: 0.7;
	}

	.slide .carousel-control-prev {
      background-position: left;
      left: 10px;
	}

	.slide .carousel-control-next {
		background-position: right;
        right: 10px;
	}

	.autoservice .carousel-indicators,
	.autoservice .slide .carousel-control-prev,
	.autoservice .slide .carousel-control-next {
      display: none;
	}

    .carousel-control-prev-icon, .carousel-control-next-icon {
      display: none;
    }

	.sr-only {
		display: none;
	}

	/*   --------------------   */

.cat-wrapper {
  border-radius: 5px;
}

.cat-wrapper > a {
  display: inline-block;
  width: 100%;
  height: 100%;
  position: relative;
}

p.cat-title {
  padding: 0 3px;
  font-size: 18px;
  color: #1f1f1f;
  text-align: center;
  background: none;
  margin: 10px 0 0;
}

div.cat-wrapper > a:hover {
  text-decoration: none;
}

.categories {
  padding: 0;
}

div.categories div.container {
  padding: 0
}

.categories .category {
  margin-bottom: 40px;
}

.category img {
  width: 100%;
}

p.to-all {
  margin: 10px 0;
  display: none;
}

.proposals img {
  width: 100%;
}

.proposals .no-gutters {
  padding: 0;
}

.prop {
  width: 49.5%;
}

.prop p {
  margin: 0;
}

.prop img {
  margin-bottom: 12px;
}

.prop-block-1 {
  float: left;
}

.prop-block-2 {
  float: right;
}

.spec {
  background: #f7f7f7;
}

.prod-wrap {
  box-shadow: 0 0 20px 3px rgba(0,0,0,0.15);
  border: none;
  background: #fff;
  position: relative;
  border-radius: 5px;
  padding: 0 0 1px;
  margin: 0 auto;
}

.prod-wrap > h3 {
  position: absolute;
  width: 100%;
  top: -30px;
  left: 0;
  text-align: center;
  z-index: 100;
  text-transform: uppercase;
  margin: 0;
}

.edit {
  font-family: "Roboto Medium";
  font-size: 14px;
  margin: 10px 0;
}

.sale {
  height: 24px;
  line-height: 24px;
  text-align: center;
  font-weight: bold;
  font-size: 18px;
  color: #fff;
  background: #f00;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-left: -12px;
  z-index: 200;
}

.sale::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: -16px;
  border: 8px solid #b70016;
  border-bottom-color: transparent;
  border-left: 6px solid transparent;
  border-right-width: 6px;
  height: auto;
}

@keyframes scaling {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.15); }
  100% { transform: scale(1); }
}

.prod-wrap:hover .sale {
  /*animation: scaling 1.2s linear infinite;*/
}

.img-wrap .discount, 
.img-wrap .sale {
  min-height: 25px;
}

.stickers {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.stickers > div {
  z-index: 200;
}

.stickers > div:last-of-type {
  position: absolute;
  right: 0;
}

.stickers .new, 
.stickers .hit, 
.stickers .bestprice {
  float: right;
  font-size: 14px;
  color: #000;
  height: 24px;
  line-height: 24px;
  padding: 0 15px;
}

.stickers .icon {
  text-transform: uppercase;
}

.stickers .new {
  background: #0f0;
}

.stickers .hit {
  background: #ff0;
  margin-top: 5px;
}

.stickers .bestprice {
  background: #00b7f4;
  margin-top: 5px;
}

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

a.product-name {
  font-size: 15px;
  color: #2d2d2d;
}

.prod-wrap a.product-name {
  display: inline-block;
  width: 100%;
  height: 60px;
  line-height: 1.2;
  padding: 0 15px;
}

a.product-name:hover {
  color: #17639f;
  text-decoration: underline;
}

.quantity {
	font-family: "Roboto Regular";
	font-size: 14px;
	color: #000;
}

.quantity .quantity-area {
  padding: 0 25px;
  text-align: center;
}

.top-of-the-week .quantity .quantity-area {
  padding: 0 14px;
  text-align: center;
}

.cat-products .quantity .quantity-area {
  padding: 0 10px;
  text-align: center;
}

.product-detail .func .quantity .quantity-area {
  padding: 0 15px;
}

.cat-products input[name="quantity"] {
  width: 26px;
}

.cat-products input[type="submit"].into-cart {
  width: 95%;
}

.cat-products input[type="submit"].into-cart:hover {
  background-position: 10px center;
}

.quantity-button {
  display: inline-block;
  width: 16px;
  height: 16px;
  line-height: 13px;
  color: #000;
  background: #ff0;
  border: 1px solid #ff0;
  text-align: center;
  transition: 0.25s;
  cursor: pointer;
  box-sizing: border-box;
}

.quantity-button:hover {
  text-decoration: none;
  color: #ff0;
  background: #000;
  border: 1px solid #000;
}

.inc {
  float: right;
}

.dec {
  float: left;
}

input[name="quantity"] {
  width: 25px;
  height: 16px;
  border: none;
  text-align: center;
  font-size: 15px;
  font-weight: bold;
  color: #000;
  position: relative;
  padding: 0;
  background: none;
}

.product-detail input[name="quantity"] {
  top: -2px;
}

.attr-value input[name="quantity"] {
  top: -3px;
}

.quantity input:focus {
	outline: none;
}

p.new-price, p.price {
  font-family: "HNC-Medium";
  font-size: 18px;
  color: #f00;
  margin-bottom: 0;
  text-align: center;
}

p.old-price {
  font-size: 14px;
  color: #000;
  text-decoration: line-through;
  margin-bottom: 0;
  text-align: center;
  line-height: 30px;
}

#related-products p.new-price,
#related-products p.price,
#viewed-products p.new-price,
#viewed-products p.price,
.cat-products p.new-price,
.cat-products p.price {
  font-size: 18px;
}

#related-products p.old-price,
#viewed-products p.old-price,
.cat-products p.old-price {
  font-size: 14px;
  line-height: 30px;
}

.top-of-the-week p.new-price,
.top-of-the-week p.price {
	font-size: 18px;
}

.top-of-the-week p.old-price {
  font-size: 14px;
  line-height: 30px;
}

.all-prices {
  margin: 10px 0 5px;
}

.all-prices > div > p {
  line-height: 30px;
}

.additional-attributes > ul {
  list-style: none;
  width: 19%;
  padding: 0;
  display: inline-block;
  font-size: 16px;
  float: left;
}

.additional-attributes li {
  text-align: center;
}

.additional-attributes li:not(:last-of-type) {
  margin-bottom: 10px;
}

li.attr-name {
  height: 48px;
  text-align: center;
}

p.attr, p.attr-list-title, 
.additional-attributes {
  font-family: "Roboto Medium";
}

p.attr, p.attr-list-title {
  font-size: 20px;
}

p.attr span, p.attr-list-title {
  color: #00a229;
}

p.attr-list-title {
  text-transform: uppercase;
}

.product-detail .info hr {
  height: 0;
  border-top: 2px solid #a5a5a5;
}

input[type="submit"].into-cart {
  display: block;
  width: fit-content;
  height: 52px;
  line-height: 50px;
  font-weight: bold;
  font-size: 18.4px;
  text-transform: uppercase;
  float: right;
  color: #00a229;
  border: 1px solid #00a229;
  padding: 0 35px;
  border-radius: 5px;
  background: #fff;
  transition: 0.25s;
}

.found input[type="submit"].into-cart {
  width: 95%;
  background-position: 10px center;
  padding: 0 10px;
}

.found p.new-price,
.found p.price {
  font-size: 23px;
}

.found p.old-price {
  font-size: 15px;
  line-height: 30px;
}

.found .quantity .quantity-area {
  padding: 0 10px;
}

.found input[name="quantity"] {
  top: -1.5px;
}

.top-of-the-week input[type="submit"].into-cart {
  font-size: 16px;
  background-position: 10px center;
}
  
.top-of-the-week .quantity > div:first-of-type {
  font-size: 14px;
}

.cat-products input[type="submit"].into-cart {
  padding: 0 10px;
  background-position: 10px center; 
}

input[type="submit"].into-cart {
  margin-top: 10px;
}

input[type="submit"].into-cart:hover, a.to-spec:hover {
  color: #fff;
  background: #00a229;
  text-decoration: none;
}

#product-set1 input[type="submit"].into-cart:hover {
  background-position: 15px center
}

.into-spec {
  background: #fff;
  padding: 0 30px;
  width: fit-content;
  transition: 0.25s;
  font-weight: normal;
  height: 40px;
  line-height: 40px;
}

.into-spec:hover {
  background: #ff4500;
}

body div.philosophy,
body div.spec {
  max-width: 100%;
}

.philosophy p {
  color: #fff;
}

.philosophy p.h1 {
  padding: 0 15px;
  margin-top: 0;
  width: 100%;
}

.philosophy img {
  width: 100%
}

.philosophy div.row {
  max-width: 100%;
  height: 100%;
}

.philosophy-bg {
  position: relative;
}

.philosophy-bg .info-block {
  padding-top: 30px;
  padding-bottom: 30px;
  background: url("/media/common/philosophy-bg.jpg") no-repeat;
  background-size: cover;
}

.philosophy-bg .info-block div.row {
  max-width: 1140px;
}

.subscr {
  min-height: 150px;
}

.subscr .socials, .subscr .socials .module {
  display: flex;
  align-items: center;
  justify-content: center;
}

.socials {
  text-align: center;
}

.soc-btn {
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 15px;
  background: url("/media/common/socials.png") no-repeat;
}

.socials a:last-of-type {
  margin: 0;
}

.ok {
  background-position: -20px 0;
}

.inst {
  background-position: -40px 0;
}

.subscr div:nth-of-type(2) p {
  color: #2d2d2d;
  margin-bottom: 0;
}

.your-email {
  position: relative;
  line-height: 40px;
}

.your-email .form-message {
  position: absolute;
  bottom: -28px;
  width: 100%;
  color: #000;
}

/*   --------------------   */





/*   PRODUCT CARDS   */

img.empty-img {
  max-width: 100%;
}

.product-img img {
  box-shadow: none;
  margin-bottom: 10px;
}

.product-detail .xzoom-thumbs img {
  float: none;
  margin-left: 0;
}

.prod-img-wrap {
  display: inline-block;
  position: relative;
}

.prod-img-wrap img.xzoom {
  max-width: 100%;
}

.product-detail h1 {
  font-size: 39.2px;
  margin-bottom: 15px;
  text-align: left;
}

#func div.all-prices {
  font-size: 29.7px;
}

#func div.all-prices {
  font-size: 18.7px;
}

#func {
  border: 1px solid #a2a2a2;
  padding: 10px 20px;
}

.product-detail input[type="submit"].into-cart {
  margin-top: 3px;
  background-position: 10px center;
}

#related-products input[type="submit"].into-cart,
#viewed-products input[type="submit"].into-cart {
  width: 90%;
  background-position: 10px center;
  font-size: 16px;
}

#related-products input[type="submit"].into-cart:hover,
#viewed-products input[type="submit"].into-cart:hover {
  background-position: 10px center;
}

#related-products .quantity .quantity-area,
#viewed-products .quantity .quantity-area {
  padding: 0 10px;
}

.product-detail #func .quantity .quantity-area {
  padding: 0 15px;
}

.product-list .prod-wrap > img {
  display: none;
}

.product-list .top-week .prod-wrap > img {
  display: none;
  position: absolute;
  top: 25%;
  left: 0;
  opacity: 0.7;
  width: 70%;
}

.product-list .top-week .prod-wrap:hover > img {
  animation: scaling 1.2s linear infinite;
}

.top-week .prod-wrap:hover {
  cursor: pointer;
}

.char .nav-tabs, .char .tab-content {
  border-bottom: 2px solid #a2a2a2;
}

.char .nav-tabs {
  margin-top: 15px;
}

.nav-tabs a {
  pointer-events: none;
  font-family: "Roboto Medium";
  font-size: 20px;
  color: #00b622;
  text-transform: uppercase;
}

#product-attributes > ul > li {
  font-size: 18px;
  color: #000;
  margin-bottom: 10px;
}

#product-attributes > ul > li > span.char-value {
  font-family: "Roboto Light";
  font-size: 18px;
}

.free-del {
  padding-left: 45px;
  display: block;
  width: fit-content;
  margin: 0 auto;
  height: 18px;
  line-height: 18px;
  font-size: 12px;
  font-family: "Roboto Light";
  color: #000;
  background: url("/media/common/free-del.png") no-repeat left;
  margin-top: 7px;
}

#product-description {
  font-family: "Roboto Light";
  font-size: 16px;
  color: #000;
  text-align: left;
}

#right-area #related-products.owl-carousel .owl-nav > div,
#right-area #viewed-products.owl-carousel .owl-nav > div {
  color: transparent;
  padding: 0;
  width: 15px;
  height: 27px;
  background: url(/media/common/carousel-controls.png);
}

#right-area #related-products.owl-carousel div.owl-nav div.owl-next,
#right-area #viewed-products.owl-carousel div.owl-nav div.owl-next {
  background-position: right;
}

ul.pagination {
  width: 100%;
  display: flex;
  justify-content: center;
}

ul.pagination li.previous {
  margin-right: 12px;
}

ul.pagination li.next {
  margin-left: 12px;
}

ul.pagination li,
ul.pagination li {
  font-size: 18px;
  height: 38px;
  line-height: 38px;
}

ul.pagination li.page-item > a,
ul.pagination li.pg > a,
ul.pagination span.pag-prev,
ul.pagination span.pag-next {  
  display: inline-block;  
  width: 38px;
  text-align: center;
  border: 1px solid #17639f;
  border-radius: 100%;
  color: #000;
  margin: 0 5px;
}

ul.pagination li.pg.active a {
  color: #ff0;
  background: #17639f;
  border-color: #17639f;
  pointer-events: none;
}

ul.pagination li.pg a {
	transition: 0.25s;
}

ul.pagination li.pg a:hover {
  color: #17639f;
  background: rgba(255,255,0,0.6);
  text-decoration: none;
}

ul.pagination span.pag-prev,
ul.pagination span.pag-next {
  width: 26px;
  height: 26px;
  line-height: 22px;
  font-size: 21px;
}

ul.pagination span.pag-prev:hover,
ul.pagination span.pag-next:hover {
  color: #17639f;
  background: rgba(255,255,0,0.6);
  cursor: pointer;
}

ul.pagination li.disabled {
  pointer-events: none;
}

.xzoom-thumbs {
  width: 100%;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  margin-top: 10px;
}

.xzoom-thumbs > a:hover {
  text-decoration: none;
}

.product-list {
  padding: 0 1px !important;
}

/*   --------------------   */





/*   FOOTER STYLES   */

.footer {
  position: relative;
  bottom: 0;
  width: 100%;
  background: #082740;
  color: #fff;
}

.footer-top {
  background: #fff;
}

footer .tagline {
  color: #d1d1d1;
  margin-top: 10px;
  max-width: 100%;
  font-size: 10px;
}

footer .logo img {
  width: 90px;
}

footer .email {
  margin-top: 10px;
  position: relative;
}

footer .email span {
  background: url("/media/common/email0.png") no-repeat left center;
}

footer .phones > div:nth-of-type(2) {
  background: url("/media/common/phone0.png") no-repeat left center;
}

.logo-malibu {
  text-align: center;
}

.footer-row {
  height: 158px;
  margin: 0 auto;
  max-width: 1140px;
  padding: 10px 15px 0;
}

.add-to-cart {
  display: flex;
  align-items: center;
}

/*   --------------------   */





/*   CART   */

h1.cart-title {
  font-size: 30px;
}

.prod-info .product-name {
  margin: 12px 0 0;
  font-family: "Roboto Medium";
  font-size: 16px;
  color: #000;
}

table.cart th, table.cart td {
  padding: 5px;
}

table.cart tr:not(.total) {
  border-bottom: 1px solid #000;
}

table.cart thead th {
  font-family: "Roboto Light";
  font-size: 12px;
}

table.cart thead tr,
table.cart thead th,
table.cart tbody tr {
  background: none;
}

table.cart thead th,
table.cart tbody td {
  color: #000;
  border-color: #000;
}

table.cart thead th:first-of-type {
  width: 55%;
}

table.cart thead th:first-of-type,
table.cart tbody td:first-of-type {
  text-align: left;
}

table.cart th, table.cart td {
  width: 15%;
  text-align: center;
}

table.cart input[type="submit"] {
  padding: 0 10px;
  display: inline-block;
  height: 29px;
  line-height: 30px;
  font-family: "Roboto Medium";
  font-size: 12px;
  text-transform: uppercase;
  margin-top: 5px;
}

table.cart .quantity-button {
  margin-top: 2px;
}

table.cart tr img {
  max-width: 180px;
}

.prod-info a {
  display: inline-block;
  float: left;
  margin: 0 15px 15px 0;
}

.total a.button {
  display: inline-block;
  width: fit-content;
  margin: 0 auto;
}

.total a.checkout, a.checkout {
  font-size: 18px;
  height: 40px;
  line-height: 40px;
  text-transform: uppercase;
  transition: 0.4s;
}

.total a.more, .text-left a.more, .back > a, button.more {
  font-family: "Roboto Regular";
  font-size: 12px;
  color: #000;
  line-height: 1.1;
  border: none;
  background: none;
  font-weight: normal;
}

.total a.more {
  margin: 10px 0;
}

.back > a {
  font-size: 14px;
  color: #000;
}

.back {
  margin-top: 10px;
}

.total td:last-of-type {
  font-family: "Roboto Medium";
  font-size: 16px;
}

.total td:last-of-type > p {
  text-align: right;
}

p.cart-weight, 
p.cart-delivery {
  font-size: 11px;
  font-weight: normal;
}

.total p.free-del {
  font-family: "Roboto Light"; 
  font-size: 19px;
}

a.delete {
  float: right;
  width: 16px;
  height: 20px;
  background: url("/media/common/delete.png") no-repeat center;
}

a.clear-cart {
  height: 40px;
  line-height: 40px;
  font-size: 18px;
  margin: 0 auto;
  text-transform: uppercase;
}

div.message, div.discount-message {
  text-align: center;
  font-size: 21px;
  font-family: "GothamProMed";
}

div.message {
  color: #f00;
}

div.discount-message {
  color: #0f0;
}

/*   --------------------   */





/*   CHECKOUT   */

.order-form input, .order-form textarea,
.common-forms input:not([type="submit"]), .common-forms textarea,
#review-form > p > input, #review-form > p > textarea {
  width: 100%;
  border: 2px solid #ebebeb;
  border-radius: 15px;
  text-indent: 1em;
}

.order-form input.place-order {
  display: inline-block;
  width: auto;
  border: none;
  font-size: 16px;
  text-indent: 0;
  height: 40px;
  line-height: 40px;
  border-radius: 20px;
  text-transform: uppercase;
  transition: 0.4s;
}

div.order-info > p.small-message {
  font-weight: normal;
  font-size: 13px;
  margin-top: 5px;
  margin-bottom: 5px;
}

.main-page .common-forms {
	width: 60%;
	margin: 0 auto;
}

.main-page .common-forms > p:last-of-type {
	display: block;
	width: fit-content;
	margin: 0 auto;
}

.main-page .common-forms > p:last-of-type input {
  text-indent: 0;
  border: 1px solid #000;
}

.main-page .common-forms > p:last-of-type input:hover {
  border-color: #ef4287;
}

div.order-info {
  width: 100%;
}

.order-info table tr {
  border-bottom: 1px solid #000;
  background: none;
}

.order-info table tr td {
  padding: 0;
}

/*   --------------------   */



/* CUSTOMER FORM */

.customer label {
  position: absolute;
}

/*   --------------------   */



/* DELIVERY */

.order-info-block {
  padding: 15px;
  background: #ebebeb;
  border: 2px solid #000;
  border-radius: 10px;
  margin-bottom: 50px;
}

.delivery-method,
.payment-method {
  margin-bottom: 15px;
}

.delivery-method > div,
.payment-method > div {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  border: 2px solid #fff;
  border-radius: 10px;
  background: #fff;
  height: 100%;
  padding: 5px 0;
}

.delivery-method > div:hover,
.payment-method > div:hover {
  cursor: pointer;
}

.delivery-method > div > p, 
.delivery-method > div > a {
  width: 100%;
  text-align: center;
}

.payment-method > div > p {
  margin: 5px 0;
}

.delivery-method.active > div, 
.payment-method.active > div {
  border-color: #000;
}

.modal-body iframe {
  display: block;
  margin: 0 auto;
}

.delivery-method > div > a.calculator {
  height: 30px;
  line-height: 30px;
  border: none;
  width: auto;
  color: #fff;
}

.delivery-method > div > a.calculator:hover {
  color: #fff;
}

.order-info table tr td, 
.order-info table tr th {
  padding: 0;
  font-size: 12px;
}

/*   --------------------   */





/*   SERVICE   */

.service {
  margin: 0 -15px !important;
}

.service-item {
  margin-bottom: 25px;
}

.service-name {
  margin-bottom: 0;
}

div.carousel-caption {
  width: 61.5%;
  height: 100%;
  left: 0;
  top: 0;
}

p.sign-up {
  display: inline-block;
  margin: 0;
  position: absolute;
  left: 50%;
  top: 65%;
  transform: translate(-50%, -65%);
}

/*   --------------------   */





/*   SERVICE   */

#contact input[type="submit"] {
  font-size: 21px;
}

#contact > p {
  display: inline-block;
}

#contact > p:not(:last-of-type) {
  width: 20%;
}

#contact input:not([type="submit"]) {
  border: none;
  border-bottom: 1px solid #000;
  border-radius: 0;
  height: 100%;
}

.contacts {
  width: 250px;
  height: 250px;
  position: absolute;
  top: 50%;
  left: 50px;
  transform: translateY(-50%);
  z-index: 170;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  padding: 50px 0;
}

p.tel,
p.address {
  font-weight: bold;
  text-align: center;
}

p.tel {
  background: url("/media/common/tel.png") no-repeat 30px center;
}

p.address {
  background: url("/media/common/address.png") no-repeat 30px center;
}

p.info-protect {
  text-align: center;
}

p.info-protect > span {
  display: inline-block;
  height: 100%;
  padding: 0 25px;
  background: url("/media/common/locked.png") no-repeat left center;
}

/*   --------------------   */





/* PRODUCT FILTER */

#price-filter {
  text-align: center;
}

#price-filter > input {
  width: 48%;
}

#price-filter > input:first-of-type {
  float: left;
}

#price-filter > input:last-of-type {
  float: right;
}

#filter-form .form-group > span {
  display: block;
}

#filter-form .form-group > span {
  border-bottom: 1px solid #aaa;
  margin-bottom: 20px;
  font-weight: bold;
  position: relative;
}

#filter-form .form-group > span > label:hover,
#filter-form .form-group > span::after {
  cursor: pointer;
}

#filter-form .form-group > span::after {
  display: block;
  content: "\203A";
  width: 15px;
  height: 15px;
  line-height: 12px;
  font-size: 21px;
  position: absolute;
  top: 12%;
  right: 5%;
  transition: 0.4s;
}

#filter-form .form-group.filter-price > span::after {
  display: none;
}

#filter-form .form-group > span.entered::after {
  transform: rotate(90deg);
}
  
.filter-block {
  position: relative;
}

.filter-block > .found {
  background: #fff;
  border-radius: 4px;
  border: 1px solid #ddd;
  position: absolute;
  top: 50%;
  left: 98%;
  transform: translateY(-50%);
  z-index: 400;
  opacity: 0;
}

.filter-block > div.row.checked,
.filter-block > div.row.found {
  display: block;
}

.filter-block > div.visible {
  display: block !important;
}

.filter-block > div.found.visible {
  opacity: 1;
}

.filter-block > div.row {
  display: none;
}

.filter-block > span {
  padding: 0;
}

.filter-block > span > label {
  width: 100%;
}

.checkbox-inline {
  display: block;
}

#filter-form .form-group.filter-size {
  margin-top: 15px;
}

.filter-size > .row {
  margin: 0;
}

.material {
  position: relative;
}

.filter-lookup-message {
  width: 100%;
  height: 38px;
  line-height: 38px;
  font-weight: bold;
  text-align: center;
}

button[type="reset"] {
  background: #f00;
  border-color: #f00;
}

.category-filters {
  margin: 20px 0;
}

div.card .float-left {
  height: 70px;
}

.category-quantity,
.shop-sortings {
  margin-right: 30px;
}

.category-quantity,
.shop-sortings,
.products-per-page {
  height: 70px; 
  line-height: 70px;
}

/*   --------------------   */





/* QUICKVIEW */

#modalQuickView > .modal-dialog {
  min-width: 915px !important;
}

#modalQuickView .modal-body {
  min-height: 150px !important;
}

.xzoom-preview {
  z-index: 2000 !important;
}

.xzoom-source {
  z-index: 2000 !important;
}

span.quickview-wrapper {
  position: absolute;
  left: 0;
  top: 40%;
  width: 100%;
  padding: 0 15px;
}

a.quickview {
  line-height: 38px;
  opacity: 0;
  transition: 0.4s;
  border: 1px solid #000;
}

.prod-wrap:hover a.quickview {
  opacity: 0.75;
}

span.quickview-wrapper:hover a.quickview {
  opacity: 1;
}

.next-prev-buttons > a.btn {
  width: 25%;
}

.next-prev-buttons {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

/*   --------------------   */





/* REVIEWS */

#product-review {
  margin: 30px 0;
  font-family: "Roboto Medium";
  position: relative;
}

.review {
  border: 2px solid #ababab;
  padding: 5px 10px;
  margin-bottom: 25px;
  width: 100%;
}

p.info,
p.rating {
  float: left;
  margin-right: 20px;
}

.review-answer {
  border: 3px dashed #17639f;
  padding: 5px 10px;
}

#review-form {
  max-width: 400px;
  margin: 0 auto;
  text-align: center;
}

#review-form input[type="submit"] {
  display: inline-block;
  width: auto;
  border: none;
  text-indent: 0;
}

#review-form input[type="submit"]:hover {
  border-color: #ef4287;
}

#review-form label {
  display: none;
}

.review-answer {
  margin-bottom: 15px;
}

.product-review-header {
  position: relative;
}

.send-review {
  position: absolute;
  right: 0;
  top: 10%;
}

button.button.is-checked {
  background: #3c362d;
  border: 1px solid #3c362d;
  color: #fff;
}

button.button.is-checked:hover {
  border-color: #000;
}

/*   --------------------   */





/*   MEDIA   */

@media (max-width: 1199.9px) {
  .stickers .bestprice {
    font-size: 13px;
  }
  
  a.clear-cart {
    font-size: 16px;
  }
  
  div.left-menu-title > span {
    padding-left: 7px;
  }
  
  #cart-button {
    width: 40%;
  }
  
  div.row.header-row, div.row.searching, #nav-top {
    max-width: 960px;
  }
  
  .line {
    top: -100px;
  }
  
  input[type="submit"].into-cart {
    padding: 0 10px;
    background-position: 10px center;
    font-size: 14px;
  }
  
  .top-of-the-week .quantity .quantity-area {
    padding: 0 4px;
  }
  
  .top-of-the-week input[type="submit"].into-cart {
    background: #fff;
  }
  
  .product-detail #func .quantity .quantity-area {
    padding: 0 45px;
  }
  
  #related-products .quantity > div:first-of-type,
  #viewed-products .quantity > div:first-of-type {
    text-align: center;
    font-size: 11px;
  }
  
  #related-products .quantity .quantity-area,
  #viewed-products .quantity .quantity-area {
    padding: 0 2px;
  }
  
  #related-products input[type="submit"].into-cart,
  #viewed-products input[type="submit"].into-cart {
    background: #fff;
    text-align: center;
    padding: 0 5px;
  }
  
  #related-products input[type="submit"].into-cart:hover,
  #viewed-products input[type="submit"].into-cart:hover {
    background: #ff4500;
  }
  
  #related-products p.new-price, 
  #related-products p.price,
  #viewed-products p.new-price,
  #viewed-products p.price {
    font-size: 16px;
  }
  
  #related-products p.old-price,
  #viewed-products p.old-price {
    font-size: 12px;
  }
  
  .cat-products input[type="submit"].into-cart {
    padding: 0 20px;
    background-position: 20px center;
    font-size: 16px;
  }
  
  .cat-products input[type="submit"].into-cart:hover {
    background-position: 20px center;
  }
  
  .total a.checkout {
    font-size: 14px;
    line-height: 44px;
  }
  
  #func p.new-price, #func p.price {
    font-size: 20px;
  }
  
  #func p.old-price {
    font-size: 14px;
  }
  
  .top-of-the-week p.new-price, 
  .top-of-the-week p.price {
    font-size: 15px;
  }
  
  .top-of-the-week p.old-price {
    font-size: 11px;
  }
  
  .cat-products p.new-price,
  .cat-products p.price {
    font-size: 17px;
  }
  
  .cat-products p.old-price {
    font-size: 12px;
  }
  
  .spec p.new-price, .spec p.price {
    font-size: 17px;
  }
  
  .spec p.old-price {
    font-size: 12px;
  }
  
  a.product-name {
    font-size: 13.5px;
  }

  .found input[type="submit"].into-cart {
    width: 90%;
    font-size: 18px;
  }
  
  .prod-wrap a.product-name {
    height: 65px;
  }
  
  a.delete {
    width: 100%;
  }
  
  table td.num {
    font-size: 13px;
  }
  
  p.to-all > a, p.into-product > a {
    font-size: 16px;
  }
  
  .tagline p {
    font-size: 21px;
  }
  
  p.new-price, p.price {
    font-size: 15px;
  }
  
  p.old-price {
    font-size: 11px;
  }
  
  .caption {
    font-size: 28px;
  }
  
  .found p.new-price, .found p.price {
    font-size: 17px;
  }
  
  .found p.old-price {
    font-size: 12px;
  }
}



@media (max-width: 991.9px) {
  .subscr > div:not(:last-of-type) {
    text-align: center;
  }
  
  .nav-link {
    text-align: center;
  }
  
  .cart-block {
    margin: 15px 0 10px;
  }
  
  .socials .module {
    max-width: 120px;
    margin: 0 auto;
  }
  
  .tagline {
    font-size: 12px;
    margin-top: 5px;
  }
  
  .callback {
    font-size: 16px;
  }
  
  .phones {
    font-size: 16px;
  }
  
  .email {
    margin: 5px 0 0;
  }
  
  .send-review {
    position: relative;
    margin: 0 auto;
  }
  
  header .row,
  footer .row {
    height: auto;
  }

  .header-row > div,
  .footer-row > div {
    padding: 10px 0;
    text-align: center;
  }

  .footer-row > div:nth-last-of-type(1),
  .footer-row > div:nth-last-of-type(2) {
    margin-bottom: 0;
  }

	.left-menu-title {
		font-size: 16px;
		padding-left: 0;
	}

	.carousel-control .glyphicon {
		width: 40px;
		height: 40px;
	}

	.caption {
		font-size: 28px;
		line-height: 38px;
	}

	.caption-2 {
		font-size: 24px;
	}

	p.cat-title {
		font-size: 16px;
	}

	p.h1 {
		font-size: 31px;
	}

	.quantity > div:nth-of-type(2) {
		text-align: center;
	}
  
  .top-menu .navbar {
    padding: 10px;
  }
  
  .top-menu .nav-link::after {
    display: none;
  }
  
  div.row.header-row {
    padding-top: 10px;
  }
  
  div.row.header-row, div.row.searching, #nav-top {
    max-width: 720px;
  }
  
  .left-column .left-menu > li {
    padding-left: 30px;
  }
  
  .prop img {
    display: block;
    margin: 0 auto 12px;
  }
  
  .prop a {
    display: inline-block;
    width: 100%;
  }
  
  .top-of-the-week .quantity .quantity-area {
    padding: 0 35px;
  }
  
  .top-of-the-week input[type="submit"].into-cart {
    background: url(/media/common/cart-btn.png) no-repeat 15px center, #fff;
    width: 60%;
  }
  
  .top-of-the-week input[type="submit"].into-cart:hover {
    background: url(/media/common/cart-btn-hover.png) no-repeat 15px center, #ff4500;
    width: 60%;
  }
  
  .cat-left {
    display: none;
  }
  
  .product-detail {
    text-align: center;
  }
  
  .product-detail .review {
    text-align: left;
  }
  
  .product-detail img {
    float: none;
  }
  
  .cat-products input[type="submit"].into-cart {
    padding: 0 15px;
    background-position: 15px center;
    width: 60%;
    font-size: 18px;
  }
  
  .cat-products input[type="submit"].into-cart:hover {
    background-position: 15px center;
  }
  
  .cat-products .quantity > div:first-of-type {
    text-align: center;
  }
  
  .cat-products .quantity .quantity-area {
    padding: 0 35px;
  }
  
  .top-of-the-week p.new-price, 
  .top-of-the-week p.price {
    font-size: 28px;
  }
  
  .top-of-the-week p.old-price {
    font-size: 18px;
  }
  
  #related-products .quantity .quantity-area,
  #viewed-products .quantity .quantity-area {
    padding: 0 2px;
  }

  .found input[type="submit"].into-cart {
    width: 55%;
  }

  .found .quantity .quantity-area {
    padding: 0 40px;
  }
  
  .found .quantity > div:first-of-type {
    text-align: center;
  }
  
  .left-column {
    padding: 0 !important;
  }
  
  .left-column #sidebar {
    background: none;
    border: none;
  }
  
  .product-detail h1 {
    text-align: center;
  }
  
  a#back-to-top {
    right: 15px;
    bottom: 15px;
  }
}







@media (min-width: 992px) {
  .header-row {
    padding: 20px 0;
  }
  
  .tagline {
    max-width: 55%;
  }
  
  .searching {
    left: 1px;
  }

  .top-menu {
    border: 1px solid #e8e8e8;
  }
  
  .order-form {
    padding-right: 20px;
  }
  
  .cat-left-mobile {
    display: none;
  }

  div.row.searching {
  	padding: 0;
  }
}



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

@media (min-width: 576px) {
  .quantity > div.w-100, .stickers > div.w-100 {
    display: none;
  }
  
  .owl-prev, .owl-next {
    position: absolute;
    top: 35%;
  }
  
  .owl-prev {
    left: 3%;
  }
  
  .owl-next {
    right: 3%;
  }
}

@media (min-width: 576px) and (max-width: 767.9px) {
  #small-cart-total-sum {
    margin-left: 5px;
  }
}



@media (max-width: 1199.9px) and (min-width: 992px) {
  .order-info table tr td {
    font-size: 10px;
  }
  
  .top-of-the-week .quantity > div:first-of-type {
    font-size: 12px;
  }
  
  .top-of-the-week input[type="submit"].into-cart {
    font-size: 14px;
    text-align: center;
  }
  
  .top-of-the-week input[type="submit"].into-cart:hover {
    background: #ff4500;
  }
  
  /*.subscr input[type="submit"] {
    top: 6px;
  }*/
}



@media (max-width: 1199.9px) and (min-width: 768px) {
  .callback {
    width: 100%;
  }
  
  .quantity .quantity-area {
    padding: 0 15px;
  }
  
  li.attr-name {
    font-size: 12px;
  }
}



@media (max-width: 991.9px) and (min-width: 768px) {
  .price-and-size {
    margin: 0 auto;
  }
  
  .top-of-the-week input[type="submit"].into-cart {
    padding: 0 15px;
    background-position: 15px center;
  }
}

/*   --------------------   */





/*   HACKS   */

input[type='number'] {
    -moz-appearance:textfield;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

/*   --------------------   */





/*   PLACEHOLDERS   */

::-webkit-input-placeholder { color: #ddd !important; font-family: "HNC-Light"; font-size: 14px !important; }
::-moz-placeholder { color: #ddd !important; font-family: "HNC-Light"; font-size: 14px !important; } /* firefox 19+ */
:-ms-input-placeholder { color: #ddd !important; font-family: "HNC-Light"; font-size: 14px !important; } /* ie */
input:-moz-placeholder { color: #ddd !important; font-family: "HNC-Light"; font-size: 14px !important; }

header ::-webkit-input-placeholder { color: #fff !important; font-size: 11px !important; }
header ::-moz-placeholder { color: #fff !important; font-size: 11px !important; } /* firefox 19+ */
header :-ms-input-placeholder { color: #fff !important; font-size: 11px !important; } /* ie */
header input:-moz-placeholder { color: #fff !important; font-size: 11px !important; }

/*   --------------------   */





.logo p {
    margin: 0;
}

@media (max-width: 767.9px) {
  div.cart > a {
    padding-left: 22px;
    max-width: 140px;
  }
  
  .prop {
    width: 100%;
  }
  
  .prop-block-1, .prop-block-2 {
    float: none;
  }
  
  .searching form {
    max-width: 60%;
    margin: 0 auto;
  }
  
  .next-prev-buttons > a.btn {
    font-size: 12px;
  }
  
  #small-cart-total-sum {
    font-size: 14px;
  }
  
  a.clear-cart {
    font-size: 11px;
    height: 30px;
    line-height: 30px;
  }
  
  div.row.header-row, div.row.searching, #nav-top {
    max-width: 540px;
  }

  .cart img {
    width: 70%;
  }
  
  .logo-malibu img {
    max-width: 150px;
  }

  .callback {
    padding: 0 0.5em !important;
    font-size: 16px;
    height: 35px;
    line-height: 35px;
  }
  
  .searching,
  .email,
  .phones {
    font-size: 18px;
  }
  
  footer .email {
    font-size: 16px;
  }

  .slide .carousel-indicators li {
    width: 5px;
    height: 5px;
  }

  .left.carousel-control {
    left: 2%;
  }

  .right.carousel-control {
    right: 2%;
  }

  .carousel-control .glyphicon {
    width: 18px;
    height: 18px;
  }

  .caption {
    font-size: 14px;
    line-height: 20px;
  }

  .caption-2 {
    font-size: 10px;
  }

  p.h1 {
    font-size: 15px;
  }

  span.discount {
    margin-left: -30px;
  }

  input[type="submit"].into-cart {
    font-size: 12px;
    background: #fff;
    text-align: center;
  }
  
  .cat-products input[type="submit"].into-cart {
    padding: 0 5px;
    font-size: 16px;
    text-align: center;
    background: #fff;
  }
  
  .cat-products input[type="submit"].into-cart:hover {
    color: #fff;
    background: #ff4500;
  }

  input[type="submit"].into-cart:hover {
    background: #ff4500;
  }
  
  p.price {
    font-size: 24px;
  }

  .spec-prod-content {
    padding: 5px;
  }

  .quantity {
    font-size: 11.5px;
  }

  a.to-spec {
    font-size: 14px;
  }
  
  #small-cart-total-items {
    left: 10px;
  }
  
  #sidebar {
    float: none;
  }
  
  .left-column {
    padding: 0 !important;
  }

  .left-column .list-unstyled > li {
    text-align: center;
    padding: 0 10px;
  }

  .logo-top,
  .phones {
    margin-bottom: 15px;
  }

  .slide .carousel-indicators {
    bottom: 3%;
    display: none;
  }

  .left.carousel-control {
    left: 3%;
  }

  .right.carousel-control {
    right: 3%;
  }

  .carousel-control .glyphicon {
    width: 30px;
    height: 30px;
  }

  .caption {
    font-size: 21px;
    line-height: 28px;
  }

  .caption-2 {
    font-size: 14px;
  }

  p.h1 {
    font-size: 22px;
  }

  .line {
    top: -140px;
  }

  .searching .col-3 {
    display: none;
  }
  
  .top-of-the-week .quantity .quantity-area,
  .quantity .quantity-area {
    padding: 0 15px;
  }
  
  table.cart .quantity .quantity-area {
    padding: 0;
  }
  
  p.new-price, p.price {
    font-size: 18px;
  }
  
  .top-of-the-week input[type="submit"].into-cart {
    background: #fff;
    width: 75%;
  }
  
  .top-of-the-week input[type="submit"].into-cart:hover {
    background: #ff4500;
    width: 75%;
  }
  
  .product-detail #func .quantity .quantity-area {
    padding: 0 15px;
  }
  
  #related-products .quantity .quantity-area,
  #viewed-products .quantity .quantity-area {
    padding: 0 25px;
  }
  
  #related-products input[type="submit"].into-cart,
  #viewed-products input[type="submit"].into-cart {
    padding: 0 3px;
    font-size: 12px;
    width: 100%;
  }
   
  #related-products p.new-price,
  #related-products p.price,
  #viewed-products p.new-price,
  #viewed-products p.price {
    font-size: 18px;
  }
  
  .top-of-the-week p.price, 
  .top-of-the-week p.new-price {
    font-size: 21px;
  }
  
  #related-products p.old-price,
  #viewed-products p.old-price {
    font-size: 12px;
  }
  
  .top-of-the-week p.old-price {
    font-size: 16px;
  }
  
  #related-products .lbl .new {
    margin-top: 5px;
  }
  
  #related-products .lbl .new, 
  #related-products .lbl .hit {
    height: 20px;
    line-height: 20px;
    padding: 0 5px;
    border-radius: 10px;
    font-size: 12px;
    float: left;
  }
  
  #related-products .discount,
  #related-products .sale {
    font-size: 16px;
  }
  
  .cat-products .quantity .quantity-area {
    padding: 0 20px;
  }
  
  .total a.checkout {
    font-size: 11px;
    line-height: 42px;
    padding: 0 5px;
  }
  
  table.cart td.num {
    padding: 3px;
  }

  .found .quantity .quantity-area {
    padding: 0 20px;
  }
  
  .found input[name="quantity"] {
    top: 0;
  }
  
  .cat-products p.new-price, .cat-products p.price {
    font-size: 18px;
  }
  
  table td.num {
    font-size: 10px;
  }
  
  .order-info table tr td {
    font-size: 10.5px;
  }
}



@media (max-width: 575.9px) {
  .btn.btn2 {
    font-size: 12px;
  }
  
  .contacts {
    display: none;
  }
  
  .philosophy-bg .info-block {
    font-size: 12px;
  }
  
  .next-prev-buttons > a.btn {
    width: 33%;
  }
  
  .category-quantity,
  .shop-sortings,
  .products-per-page {
    height: 30px; 
    line-height: 30px;
  }
  
  .delivery-box img {
    display: block;
    margin: 0 auto 35px;
    max-width: 250px;
  }
  
  .found p.new-price, .found p.price {
    font-size: 14px;
  }
  
  .found p.old-price {
    font-size: 10.5px;
  }
  
  .searching form {
    max-width: 80%;
  }
  
  .your-email p input {
    text-indent: 1.5em;
  }
  
  .logo-top img {
    width: 100%;
    max-width: 180px;
  }
  
  .logo img {
    min-width: 88px;
  }
  
  div.cart img {
    width: 70%;
  }
  
  .logo-malibu img {
    width: 50%;
  }
  
  .callback {
    padding: 0 0.5em !important;
    font-size: 13.5px;
    height: 35px;
    line-height: 35px;
  }

	.phones .textarea-content > p:last-of-type, 
    footer .phones .textarea-content > p:last-of-type {
		font-size: 10px;
	}

	.slide .carousel-indicators li {
		width: 5px;
		height: 5px;
	}

	.left.carousel-control {
		left: 2%;
	}

	.right.carousel-control {
		right: 2%;
	}

	.carousel-control .glyphicon {
		width: 18px;
		height: 18px;
	}

	.caption {
		font-size: 16px;
		line-height: 21px;
	}

	.caption-2 {
		font-size: 10px;
	}

	p.to-all > a, p.into-product > a {
      font-size: 14px;
	}

	p.cat-title {
      font-size: 12px;
      height: 35px;
	}

	span.discount {
      margin-left: -30px;
	}

	.cat-products input[type="submit"].into-cart,
    input[type="submit"].into-cart {
      font-size: 12px;
      background: #fff;
      text-align: center;
	}

	input[type="submit"].into-cart:hover {
      background: #ff4500;
	}

	p.price {
      font-size: 24px;
	}

	.spec-prod-content {
      padding: 5px;
	}

	.quantity {
      font-size: 11.5px;
	}

	a.to-spec {
      font-size: 14px;
	}
  
    .quantity > div {
      text-align: center;
      margin-bottom: 5px;
    }
  
    .quantity .quantity-area {
      margin: 0 auto;
      padding: 0 25px;
    }
  
  p.new-price, p.price {
    font-size: 14px;
  }
  
  p.old-price {
    font-size: 10px;
  }
  
  .subscr div:nth-of-type(2) p {
    font-size: 11px;
  }
  
  .subscr div:nth-of-type(2) p.h1 {
    font-size: 14px;
  }
  
  .discount, .sale {
    background-size: 100%;
  }
  
  #related-products .sale {
    font-size: 14px;
    min-height: 25px;
    line-height: 1.05;
  }
  
  .stickers .new,
  .stickers .hit,
  .stickers .bestprice {
    font-size: 11px;
    height: 25px;
    line-height: 25px;
    padding: 0 5px;
    margin: 5px 0 0;
  }
  
  .spec .sale {
    font-size: 14px;
  }
  
  #related-products .stickers .new,
  #related-products .stickers .hit {
    margin-left: 0;
  }
  
  .product-detail #func .quantity .quantity-area {
    padding: 0 15px;
  }
  
  #related-products input[type="submit"].into-cart,
  #viewed-products input[type="submit"].into-cart {
    height: 30px;
    line-height: 30px;
    font-size: 9px;
  }
  
  #related-products .quantity > div:first-of-type,
  #viewed-products .quantity > div:first-of-type {
    font-size: 10px;
  }
  
  .cat-products .quantity .quantity-area {
    padding: 0 15px;
  }
  
  .product-detail .xzoom-thumbs img {
    margin-left: 0;
  }
  
  table.cart thead tr > th:first-of-type,
  table.cart tbody tr > td:first-of-type {
    width: 25%;
  }
  
  table.cart thead tr > th:nth-of-type(2),
  table.cart tbody tr > td:nth-of-type(2) {
    width: 15%;
  }
  
  table.cart thead tr > th:nth-of-type(3),
  table.cart tbody tr > td:nth-of-type(3),
  table.cart thead tr > th:nth-of-type(4),
  table.cart tbody tr > td:nth-of-type(4) {
    width: 30%;
  }
  
  table.cart input[type="submit"] {
    font-size: 8.5px;
    line-height: 29px;
  }
  
  .prod-info a {
    margin: 0 !important;
  }
  
  .total a.checkout {
    font-size: 9px;
    line-height: 30px;
    height: 30px;
    padding: 0 3px;
  }
  
  .total p.free-del {
    font-size: 12px;
  }
  
  #related-products p.new-price, 
  #related-products p.price,
  #viewed-products p.new-price,
  #viewed-products p.price {
    font-size: 16px;
  }
  
  #related-products p.old-price,
  #viewed-products p.old-price {
    font-size: 12px;
  }
  
  #related-products .quantity .quantity-area,
  #viewed-products .quantity .quantity-area {
    padding: 0 45px;
  }
  
  .top-of-the-week p.new-price,
  .top-of-the-week p.price {
    font-size: 16px;
  }
  
  .top-of-the-week p.old-price {
    font-size: 11px;
  }
  
  .top-of-the-week .quantity .quantity-area {
    padding: 0 30px;
  }
  
  #related-products .lbl .new, 
  #related-products .lbl .hit {
    height: 10px;
    line-height: 10px;
    padding: 0 3px;
    border-radius: 10px;
    font-size: 9px;
    float: right;
  }
  
  .cat-products p.new-price,
  .cat-products p.price {
    font-size: 14px;
  }
  
  .cat-products p.old-price {
    font-size: 10px;
  }
  
  .spec p.new-price, .spec p.price {
    font-size: 16px;
  }
  
  .spec p.old-price {
    font-size: 10px;
  }
  
  .cat-products .icon .sale {
    font-size: 18px;
  }
  
  .total td:last-of-type {
    font-size: 12px;
  }
  
  table.cart td.num {
    padding: 10px;
  }
  
  a.delete {
    width: 16px;
  }
  
  .found input[type="submit"].into-cart {
    font-size: 12px;
    width: 100%;
  }

  span.total-text {
    display: block;
  }

  div.container.main-page {
    padding: 0 15px;
  }
  
  .week-top {
    top: -15px;
  }
  
  .stickers {
    padding-top: 0 !important;
  }
  
  div.order-info {
    width: 80%;
  }
  
  .order-info table tr td {
    font-size: 12px;
  }
  
  .searching input[type="submit"] {
    padding: 0 10px;
  }
  
  .subscr input[type="submit"] {
    padding: 0 10px;
    font-size: 16px;
  }
  
  li.attr-name {
    font-size: 14px;
  }
  
  .attr-value input[name="quantity"] {
    top: -4px;
  }
}

@media (max-width: 495px) {
  a.delete {
    width: 100%;
  }
}

@media (max-width: 449.9px) {
  .stickers .new,
  .stickers .hit,
  .stickers .bestprice {
    font-size: 8px;
  }
  
  body .h2, body h2 {
    font-size: 1.5rem;
  }
  
  p.sign-up {
    top: 85%;
    transform: translate(-50%, -85%);
  }
  
  .btn.btn2 {
    font-size: 10px;
  }
  
  #contact > p {
    width: 100% !important;
    display: block;
  }
  
  .logo-malibu img {
    width: 70%;
  }
  
  .spec .stickers .new {
    margin: 0;
  }
  
  .spec .stickers .new,
  .spec .stickers .hit,
  .spec .stickers .bestprice {
    font-size: 9px;
    padding: 0 2px;
  }
  
  .btn {
    font-size: 12px;
    padding: 0 12px;
  }
  
  .your-email p input {
    width: 50%;
  }
  
  .module .email {
    font-size: 14px;
  }
  
  .philosophy-bg .info-block {
    font-size: 10px;
  }
  
  .searching form {
    max-width: 100%;
  }
  
  div.message, 
  div.discount-message {
    font-size: 18px;
  }
  
  .all-prices > div {
    min-width: 100%;
  }
  
  .all-prices > div > p {
    line-height: 1.2;
  }
  
  .rating-filter .btn {
    font-size: 14px;
  }
  
  .next-prev-buttons > a.btn {
    width: 45%;
    line-height: 30px;
    font-size: 10px;
    height: 30px;
  }
  
  .card, .card button {
    font-size: 13px;
  }
  
  .shop-sortings,
  .products-per-page {
    margin: 10px 0 0;
  }
  
  .shop-sortings {
    height: auto;
    max-height: 50px;
    line-height: 20px;
  }
  
  .product-detail input[name="quantity"] {
    top: 0;
  }
  
  table.variation th, 
  table.variation td {
    padding: 7px;
    font-size: 12px;
  }
  
  header .cart {
    background-size: 40%;
  }
  
  #cart-button {
    width: 50%;
  }
  
  .top-of-the-week input[type="submit"].into-cart,
  .cat-products input[type="submit"].into-cart,
  input[type="submit"].into-cart{
    padding: 0 5px;
    width: 95%;
    font-size: 11px;
  }
  
  .cat-products .quantity .quantity-area {
    padding: 0 10px;
  }
  
  #func p.new-price, #func p.price {
    font-size: 18px;
  }
  
  .product-detail #func .quantity .quantity-area {
    padding: 0;
  }
  
  .product-detail p.old-price {
    font-size: 14px;
  }
  
  .product-detail p.price,
  .product-detail p.new-price {
    font-size: 24px;
  }
  
  .total p.free-del {
    padding: 0;
    background: none;
  }
  
  #related-products p.new-price, 
  #related-products p.price,
  #viewed-products p.new-price,
  #viewed-products p.price {
    font-size: 18px;
  }
  
  #related-products p.old-price,
  #viewed-products p.old-price {
    font-size: 12px;
  }
  
  #related-products .quantity .quantity-area,
  #viewed-products .quantity .quantity-area {
    padding: 0 23px;
  }
  
  .cat-products p.new-price,
  .cat-products p.price {
    font-size: 18px;
  }
  
  .cat-products p.old-price {
    font-size: 12px;
  }
  
  .stickers .sale,
  .sale::before {
    height: 25px;
  }
  
  .sale > div {
    width: 100%;
    height: 100%;
    line-height: 25px;
    font-size: 14px;
  }
  
  .cat-products .stickers .sale {
    font-size: 10px;
  }
  
  .prod-img-wrap .stickers .sale {
    font-size: 14px;
  }
  
  .spec p.new-price, 
  .spec p.price {
    font-size: 18px;
  }
  
  .spec p.old-price {
    font-size: 12px;
  }
  
  #related-products .sale {
    font-size: 12px;
  }
  
  .cat-products .sale {
    background-position: left 8px;
  }
  
  .total td:last-of-type {
    font-size: 10px;
    padding: 5px;
  }
  
  table.cart td.num {
    padding: 3px;
    font-size: 7.5px;
  }

  .found p.new-price,
  .found p.price {
    font-size: 18px;
  }

  .found p.old-price {
    font-size: 12px;
  }
  
  p.to-all > a, 
  p.into-product > a {
    font-size: 9px;
    height: 25px;
    line-height: 26px;
  }
  
  .tagline p {
    font-size: 17px;
  }
  
  .searching, 
  .email, 
  .phones {
    font-size: 12px;
  }
  
  .additional-attributes > ul {
    font-size: 12px;
  }
  
  li.attr-name {
    font-size: 9px;
    height: 26px;
  }
  
  p.old-price {
    font-size: 12px;
  }
  
  p.new-price, 
  p.price {
    font-size: 18px;
  }
  
  .attr-value input[name="quantity"] {
    top: -2px;
    font-size: 10px;
    width: 20px;
  }
  
  .total a.more {
    font-size: 10px;
  }
  
  table.cart tr.total td.num {
    font-size: 12px;
  }
  
  .caption {
    font-size: 10px;
    line-height: 16px;
  }
}

@media (max-width: 414.9px) {
  .top-of-the-week .quantity .quantity-area,
  .cat-products .quantity .quantity-area,
  .found .quantity .quantity-area,
  .quantity .quantity-area {
    padding: 0;
  }
}

@media (max-width: 399.9px) {
  #cart-link {
    font-size: 9px;
  }
}

@media (max-width: 360px) {
  div.owl-theme .owl-nav > div {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }
    
  div.owl-theme .owl-nav > div.owl-prev {
    left: 5%;
  }
  
  div.owl-theme .owl-nav > div.owl-next {
    right: 5%;
  }
  
  div..owl-theme .owl-dots {
    display: none;
  }
}



@media (min-width: 450px) {
  #contact {
    display: flex;
    justify-content: space-between;
  }
}


/*   Scroll-to-top button   */
#back-to-top {
  position: fixed;
  bottom: 150px;
  right: 40px;
  z-index: 9999;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 30px;
  background: #17639f;
  border: 1px solid #ff0;
  color: #ff0;
  cursor: pointer;
  border-radius: 100%;
  text-decoration: none;
  transition: 0.25s;
  opacity: 0;
  box-shadow: 0 0 20px 3px rgba(0,0,0,0.3);
}
#back-to-top:hover {
  border-color: transparent;
  color: #000;
  background: #fff;
}
#back-to-top.show {
    opacity: 1;
}



/* The spinner */

@keyframes spinner {
  to {transform: rotate(360deg);}
}

.spinner,
.spinner:before {
  width: 40px;
  height: 40px;
  box-sizing: border-box;
}

.spinner:before {
  content: '';
  display: block;
  border-radius: 50%;
  border: 8px solid #ccc;
  border-top-color: #333;
  animation: spinner .6s linear infinite;
}

.spinner-absolute {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -10px;
  margin-left: -10px;
  z-index: 9999;
}

/*   --------------------   */





/* Animations */

.spinner-add,
.spinner-remove {
  animation-fill-mode: both;
  animation-duration: .4s;
}

.spinner-add {
  animation-name: spinner-add;
}

@keyframes spinner-add {
  from {transform: scale(0);}
  to {transform: scale(1);}
}

.spinner-remove {
  animation-name: spinner-remove;
}

@keyframes spinner-remove {
  to {transform: scale(0);}
}

/*   --------------------   */





/* Second star rating */

i.star-rating {
  display: inline-block;
  width: 15px;
  height: 15px;
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cG9seWdvbiBmaWxsPSIjRkZERjg4IiBwb2ludHM9IjEwLDAgMTMuMDksNi41ODMgMjAsNy42MzkgMTUsMTIuNzY0IDE2LjE4LDIwIDEwLDE2LjU4MyAzLjgyLDIwIDUsMTIuNzY0IDAsNy42MzkgNi45MSw2LjU4MyAiLz48L3N2Zz4=');
  background-size: contain;
}
  

div.star-rating {
  font-size: 0;
  white-space: nowrap;
  display: inline-block;
  /* width: 250px; remove this */
  height: 50px;
  overflow: hidden;
  position: relative;
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cG9seWdvbiBmaWxsPSIjREREREREIiBwb2ludHM9IjEwLDAgMTMuMDksNi41ODMgMjAsNy42MzkgMTUsMTIuNzY0IDE2LjE4LDIwIDEwLDE2LjU4MyAzLjgyLDIwIDUsMTIuNzY0IDAsNy42MzkgNi45MSw2LjU4MyAiLz48L3N2Zz4=');
  background-size: contain;
}

div.star-rating i {
  opacity: 0;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  /* width: 20%; remove this */
  z-index: 1;
  background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cG9seWdvbiBmaWxsPSIjRkZERjg4IiBwb2ludHM9IjEwLDAgMTMuMDksNi41ODMgMjAsNy42MzkgMTUsMTIuNzY0IDE2LjE4LDIwIDEwLDE2LjU4MyAzLjgyLDIwIDUsMTIuNzY0IDAsNy42MzkgNi45MSw2LjU4MyAiLz48L3N2Zz4=');
  background-size: contain;
}

div.star-rating input {
  -moz-appearance: none;
  -webkit-appearance: none;
  opacity: 0;
  display: inline-block;
  /* width: 20%; remove this */
  height: 100%;
  margin: 0;
  padding: 0;
  z-index: 2;
  position: relative;
}

div.star-rating input:hover + i,
div.star-rating input:checked + i {
  opacity: 1;
}

div.star-rating i ~ i {
  width: 40%;
}

div.star-rating i ~ i ~ i {
  width: 60%;
}

div.star-rating i ~ i ~ i ~ i {
  width: 80%;
}

div.star-rating i ~ i ~ i ~ i ~ i {
  width: 100%;
}

::after,
::before {
  height: 100%;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  text-align: center;
  vertical-align: middle;
}

div.star-rating.star-5 {width: 250px;}
div.star-rating.star-5 input,
div.star-rating.star-5 i {width: 20%;}
div.star-rating.star-5 i ~ i {width: 40%;}
div.star-rating.star-5 i ~ i ~ i {width: 60%;}
div.star-rating.star-5 i ~ i ~ i ~ i {width: 80%;}
div.star-rating.star-5 i ~ i ~ i ~ i ~i {width: 100%;}

/*   --------------------   */

/* FEATURES */
div.color-editor {
  width: 300px;
  height: 100%;
  position: fixed;
  background: #fff;
  left: 0;
  top: 0;
  transition: 0.3s all ease-in-out;
  z-index: 1000;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

div.color-editor.close {
  left: -300px;
  transition:0.3s all ease-in-out;
}

div.color-editor > div {
  max-height: 100%;
  overflow-y: auto;
}

div.color-editor .clr-btn {
  display: inline-block;
  height: 30px;
  line-height: 30px;
  padding: 0 5px;
  border: none;
  color: #fff;
}

div.color-editor .clr-btn.color-editor-save {
  margin-left: 5px;
  background: #0f0 !important;
}

div.color-editor .clr-btn.color-editor-save:hover {
  background: #008200 !important;
}

div.color-editor .clr-btn.color-editor-generator {
  margin-left: 5px;
  background: #00b7f4 !important;
}

div.color-editor .clr-btn.color-editor-generator:hover {
  background: #0080ab !important;
}

div.color-editor-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 5px;
}

div.color-editor-item .clr-btn {
  background: #f00 !important;
  font-size: 12px;
}

div.color-editor-item .clr-btn:hover {
  background: #ffa0a0 !important;
}

div.color-editor hr {
  margin: 10px 0;
}

.button-wrapper {
  position: absolute;
  left: 105%;
  top: 10px;
}

.button-wrapper > a {
  background: #777 !important;
}

.button-wrapper > a:hover {
  background: #d1d1d1 !important;
}

div.input-group {
  display: inline-block;
  width: 40%;
  float: left;
}

.input-group-addon {
  font-size: 14px;
  font-weight: 400;
  color: #555;
  text-align: center;
  background-color: #eee;
  border-radius: 5px;
  line-height: 18px;
  display: inline-block;
  width: 30px;
  height: 30px;
  position: absolute;
  top: -1px;
  right: 0;
}

.color-editor-item p {
  display: inline-block;
  width: 28%;
  font-size: 12px;
  float: left;
  line-height: 1.1;
  margin: 0;
  text-align: center;
  color: #000 !important;
}

.color-editor-item .colorpicker-element .input-group-addon i {
  position: relative;
  width: 100%;
  height: 100%;
}

.color-editor-item .colorpicker-element .input-group-addon i::after {
  content: "...";
  font-weight: bold;
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid #ccc;
  border-radius: 5px;
}

div.color-editor input[type="text"] {

}


.colorpicker .colorpicker-saturation {
  width: 100px;
  height: 100px;
}

.colorpicker .colorpicker-hue,
.colorpicker .colorpicker-alpha {
  width: 15px;
  height: 100px;
}

.colorpicker .colorpicker-color,
.colorpicker .colorpicker-color div {
  height: 15px;
}

.colorpicker:after, .colorpicker:before {
  display: none !important;
}

.input-group > input.form-control {
  margin: 0;
  width: 79.5px;
  height: 30px;
  padding: 2px 5px;
  font-size: 14px;
  border-radius: 5px !important;
  text-align: center;
}
/************/


/* ADMIN EDIT LINKS */
.edit-admin-block {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  height: 100%;
  z-index: 999;
  pointer-events: none;
}

.edit-admin-block a {
  font-size: 12px;
  font-family: helvetica, sans-serif;
  text-transform: uppercase;
  color: blue;
  pointer-events: auto;
  background: #fff;
  display: block;
  position: absolute;
  top: 3px;
  padding: 0px 3px 0px 3px;
  border-radius: 0px 0px 5px 5px;
  opacity: 0.1;
}

.edit-admin-block a:hover {
  opacity: 1;
}

.edit-admin-block hr {
  border-bottom: 2px dashed blue;
  width: 100%;
  margin: 0;
  background-color: #fff;
}

div.prop {
  position: relative;
}

/************/