/*----------------------------------------------------------------------------------
  --- B R E A D C R U M B  ---
---------------------------------------------------------------------------------*/

.page-bg-breadcrumb-overlap {
    padding-bottom: 6.375rem;
}
.page-bg-breadcrumb-overlap + * {
  margin-top: -4.555rem;
}

.breadcrumb-wrap {
  position: relative;
}
.breadcrumb-wrap > .breadcrumb {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0;
  margin-bottom: 0;
  font-size: 0.8rem;
  list-style: none;
}
.breadcrumb-wrap > .breadcrumb > li > a {
	display: inline-block;
	position: relative;
	color: #777;
}
.breadcrumb-wrap > .breadcrumb > li > a:hover {
  color: #000;
  font-weight: 400;
  text-decoration: underline;
}
.breadcrumb-wrap > .breadcrumb li + li:before {
	XXXcontent: " / ";

  font-family: 'Font Awesome 5 Pro';
	font-size: 15px;
  content: "\f105";

	padding: 0 12px;
	vertical-align: middle;
	color: #888;
  font-weight: 300;
}
.breadcrumb-wrap > .breadcrumb .active{
  color: #000;
}
.breadcrumb-wrap > .breadcrumb li > a > i {
  Xmargin-top: -0.175rem;
  Xmargin-right: 0px;
  position: relative;
  top:-1px;
  font-size: 0.7rem;
  color:#666;
  padding-right: 3px;
  vertical-align: middle;
}
/*
.breadcrumb-wrap > .breadcrumb li > a > i:after {
  position: relative;
  top: 1px;
  content: "|";
  padding: 0px 2px 0 5px;
  font-family: 'Font Awesome 5 Pro';
  font-size: 1rem;
  font-weight: 100;
  color: #777;
}
*/

.product-title-breadcrumb h1 {
  font-size: calc(18px + (35 - 18) * ((100vw - 400px) / (2500 - 400)));
  font-weight: 600;
  color: #555;
  margin-bottom: 0rem;
  line-height: normal;
}
.product-title-breadcrumb span{
  color: #777;
  font-weight: 500;
  letter-spacing: 3px;
}




.product-content-main-wrap {
  padding: 20px 40px;
  padding-bottom: 40px;
}
@media (max-width: 767px) {
  .product-content-main-wrap {
    padding: 10px 10px;
    border-radius: 10px!important;
  }
}


.info-content-col .flex-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  height: 100%;
}
.info-content-col .flex-container .item-col {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
  padding-left: 15px;
  padding-right: 15px;
}
.info-content-col .flex-container .item-col.color1 {
    background: #FFF;
  }
.info-content-col .flex-container .item-col.color2 {
    background: #FFF;
  }
@media (max-width: 1300px) {
  .info-content-col .flex-container .item-col {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}


.product-information {
  position: relative;
  Xpadding:0 20px;
}
@media only screen and (max-width: 767px) {
  .product-information {
    position: relative;
    padding:0 5px;
  }
}

.product-title {
  position: relative;
}
.product-title h1{
  font-size: calc(18px + (24 - 18) * ((100vw - 400px) / (2500 - 400)));
  font-weight: normal;
  margin-bottom: 0rem;
  line-height: normal;
}
.product-title h1.item-id{
  color:#777;
  font-weight: 700;
  letter-spacing: 5px;
}
.product-title h1.item-name{
  color:#333;
  font-weight: 400;
  letter-spacing: 1px;
  padding-left: 10px;
}
/*
.product-title h1.item-id span{
  line-height: 1.4;
  background-color: #eee;
  padding: 0 5px 2px 10px;
  border-radius: 6px;
  position: relative;
  left:-7px;
}
*/
.product-title h2{
  font-size: calc(17px + (24 - 17) * ((100vw - 400px) / (2500 - 400)));
  font-weight: normal;
  color:#222;
  letter-spacing: 2px;
  xpadding: 5px 15px;
  xposition: relative;
  xtop:5px;
  xmargin-left: 10px;
}
.product-title h3{
  font-size: calc(16px + (20 - 16) * ((100vw - 400px) / (2500 - 400)));
  font-weight: normal;
  color:#222;
  letter-spacing: 2px;
}
.product-title h4{
  font-size: calc(15px + (18 - 15) * ((100vw - 400px) / (2500 - 400)));
  font-weight: normal;
  color:#222;
  margin-bottom: 0rem;
}
.product-title h5 span{
  font-size: 90%;
  font-weight: 500;
  color:#fff;
  letter-spacing: 2px;
  line-height: 1.4;
  background-color: #ffcc00;
  padding: 0px 7px 1px 7px;
  border-radius: 6px;
  position: relative;
}
.product-title p{
  font-size: calc(14px + (16 - 14) * ((100vw - 400px) / (2500 - 400)));
  color:#222;
}
.product-title p span{
  font-weight: 500;
  color:#000;
}




.product-dimensions {
  margin:10px 0;
}
.product-dimensions p::before {
  font-family: "Font Awesome 5 Pro";
  content: "\f548";
  font-weight: 300;
  font-size: 16px;
  color: #666;
  margin-right: 5px;
}
.product-dimensions p span{
  font-weight: 500;
  margin-left: 10px;
}




.product-icons-and-inventory-button{
  display: flex;
  justify-content: space-between;
}
.product-desc-icons {
  margin-left:-6px;
}
.product-desc-icons ul{
}
.product-desc-icons ul > li {
	display: inline-block;
  list-style: none;
  text-align: center;
  width: 25px;
  height: 100%;
  margin-right: 10px;
}

.product-description {
  margin: 15px 0;
}
.product-description p{
  line-height: 1.5;
}


.default-branding {
  position: relative;
	margin-top:20px;
}
.default-branding .desc-box {
  position: relative;
  border: 1px solid #ddd;
	border-radius: 4px;
  padding: 10px;
  xpadding-bottom: 30px;
	margin-top:20px;
  color:#666;
  font-weight: 300;
}
.default-branding .desc-box .desc-box-title h2 {
  position: absolute;
  padding: 0 10px;
  top: 0;
  background-color: #fff;
  border-bottom: none !important;
  transform: translateY(-50%);
	font-size: 16px;
	font-weight: 600;
  color: #333;
	letter-spacing: 2px;
}
.default-branding .desc-box .desc-box-content{
  padding: 20px 10px 0 10px;
}
.default-branding .desc-box .desc-box-content h3{
  font-size: calc(14px + (16 - 14) * ((100vw - 400px) / (2500 - 400)));
  font-weight: 600;
  color:#555;
  letter-spacing: 2px;
  line-height: 1;
}
.default-branding .desc-box .desc-box-content h4{
  font-size: 15px;
  font-weight: 300;
  line-height: 1;
}
.default-branding .desc-box .desc-box-content h4 span{
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  color:#333;
}
.default-branding .desc-box .desc-box-content ul h5 {
  font-size: 16px;
  margin-bottom: 0rem;
}
.default-branding .desc-box .desc-box-content h5::after {
  content: "";
  position: relative;
  display: inline-flex;
  height: 3px;
  width: 50px;
  bottom: 5px;
  left: 1%;
  border-bottom: 1px solid #ccc;
}
.default-branding .desc-box .desc-box-content .list-check li{
  font-size: 15px;
  margin-bottom: 0px!important;
}


.xdefault-branding .desc-box h5 {
	font-size: 16px;
	font-weight: 600;
	color: #777;
	margin-left: 0.7em;
	margin-bottom: 0;
}


.product-extra-buttons {
  display: block;
  display: flex;
  XXXjustify-content: space-between;
  margin-top: 20px;
  margin-bottom: 5px;
}








.product_sku h1 {
  color: #ffcc00;
	font-size: 2.2rem !important;
  font-size: inherit;
	font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 2px;
}
.product_sku  h1 span {
  color: #bbb;
  font-weight: 600;
  padding-left: 10px;
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0px;
}
.product_sku h2 {
  color: #444;
	font-size: 1.1rem;
	font-weight: 500;
  line-height: 1.2;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin: 0;
}
.product_sku h4 {
	color: #222;
	font-size: 40px;
	font-weight: 400;
}
.product_sku p {
	color: #111;
  line-height: 1.5 !important;
  margin-bottom: 5px !important;
}
.product_sku .see_more a{
  padding: 1px 7px;
  background: #ccc;
  color: #ffffff !important;
  font-size: 10px;
}
.product_sku .see_more a:after{
  font: normal normal normal 14px/1 FontAwesome;
  content: '\f067 ';
  font-size: 9px;
  padding-left: 3px;
}
.product_sku .see_more a:hover{
  padding: 1px 7px;
  background: #444;
  color: #ffffff !important;
}
.product_name {
    color: #333;
    display: inline-block;
    font-size: .5em;
    font-weight: 100;
}

.amenities li:last-child{
  border-right:none;margin-right:0;padding-right:0
}
.amenities {
  width:100%;
  list-style:none;
  padding:6px 10px;
  margin:0;
  background-color:#ffF;
  border-color:#E4E4E4;
  border-width:0 1px 1px;
  border-style:solid;
  text-align:LEFT;
  -webkit-border-radius:0 0 4px 4px;
  -moz-border-radius:0 0 4px 4px;
  border-radius:0 0 4px 4px
}
.amenities li {
  display:inline-block;
  height:38px;
  margin-right:10px;
  padding-right:10px;
  padding-top:10px;
  border-right:1px solid #E4E4E4;
  color:#74777c;
  text-align:LEFT;
}








/*
-- 5 column Responsive Product Card Item
-- 20%
***********************************************/
.with-md-20 {
  -webkit-box-flex: 0;
  -ms-flex: 1 0 18%;
  flex: 1 0 18%;
  max-width: 18%;
  margin: 10px;
}
@media (max-width: 767px) {
  .with-md-20 {
    -webkit-box-flex: 0;
    -ms-flex: 1 0 45%;
    flex: 1 0 45%;
    max-width: 45%;
    margin: 5px;
  }
}
@media (min-width: 768px) and (max-width: 991px){
  .with-md-20 {
    -webkit-box-flex: 0;
    -ms-flex: 1 0 31%;
    flex: 1 0 31%;
    max-width: 31%;
    margin: 5px;
  }
}
@media (min-width: 992px) and (max-width: 1200px){
  .with-md-20 {
    -webkit-box-flex: 0;
    -ms-flex: 1 0 23%;
    flex: 1 0 23%;
    max-width: 23%;
    margin: 5px;
  }
}


/*
-- 5 column Responsive Product Card Item
-- 25%
***********************************************/
.with-md-25 {
  -webkit-box-flex: 0;
  -ms-flex: 1 0 23%;
  flex: 1 0 23%;
  max-width: 23%;
  margin: 10px;
}
@media (max-width: 767px) {
  .with-md-25 {
    -webkit-box-flex: 0;
    -ms-flex: 1 0 45%;
    flex: 1 0 45%;
    max-width: 45%;
    margin: 5px;
  }
}
@media (min-width: 768px) and (max-width: 1200px){
  .with-md-25 {
    -webkit-box-flex: 0;
    -ms-flex: 1 0 31%;
    flex: 1 0 31%;
    max-width: 31%;
    margin: 5px;
  }
}
@media (min-width: 1201px) and (max-width: 1600px){
  .with-md-25 {
    -webkit-box-flex: 0;
    -ms-flex: 1 0 23%;
    flex: 1 0 23%;
    max-width: 23%;
    margin: 5px;
  }
}


/*
-- 5 column Responsive Product Card Item
-- 33%
***********************************************/
/*
.with-md-33 {
  -webkit-box-flex: 0;
  -ms-flex: 1 0 31%;
  flex: 1 0 31%;
  max-width: 31%;
  margin-right: 20px;
}

.XXXwith-md-33:nth-last-child(-n+2) {
  margin-right: 0px !important;
}


@media (max-width: 767px) {
  .with-md-33 {
    -webkit-box-flex: 0;
    -ms-flex: 1 0 47%;
    flex: 1 0 47%;
    max-width: 47%;
    margin: 5px;
  }
}
@media (min-width: 768px) and (max-width: 1200px){
  .with-md-33 {
    -webkit-box-flex: 0;
    -ms-flex: 1 0 31%;
    flex: 1 0 31%;
    max-width: 31%;
    margin: 5px;
  }
}
@media (min-width: 1201px) and (max-width: 1600px){
  .with-md-33 {
    -webkit-box-flex: 0;
    -ms-flex: 1 0 32%;
    flex: 1 0 32%;
    max-width: 32%;
    margin-right: 10px;
  }
}
*/






/* OPTIONAL BRANDING - MODAL CONTENT
*******************************************************************************/
.section-optional-branding {
  position: relative;
  min-height:750px !important;
}
.optional-branding-tabs {
  position: relative;
  margin-top:25px;
  xpadding:10px;
  xbackground: #f7f7f7;
  xheight: 100% !important;
}
.optional-branding-tabs .nav-item{
  margin: 2px 0;
}
.optional-branding-tabs .nav-pills .nav-link {
  color: #555;
  border-radius: 5px !important;
  background: #f2f2f2;
  margin:0 2px;
}
.optional-branding-tabs .nav-item .nav-link:hover {
  background: #ddd!important;
}
.optional-branding-tabs .nav-pills .nav-link.active {
  color: #fff;
  font-weight: 700;
  font-size: 110%;
  letter-spacing: 1px;
  background-color: #333;
  border-radius: 5px !important;
}
.optional-branding-tabs .nav-pills .nav-link.active:hover {
  background-color: #333!important;
}

.section-optional-branding .table-price thead th {
    font-size: calc(12px + (15 - 12) * ((100vw - 400px) / (2500 - 400)));
    font-weight: 300;
    color: #181C32;
    text-align: center;
    padding: 0.5rem;
    border:1px solid #ddd;
}





/* PRODUCT PAGE - IMAGE SECTION
--
---
----
-----
------
-------
*******************************************************************************/

.single-product-area {
  position: relative;
  margin-top: 2rem;
}
@media only screen and (max-width: 767px){
  .single-product-area {
    margin-top: 0;
  }
}

.single-product-area .product-details-img-tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0 1rem 0;
}
.single-product-area .product-menu {
  flex: 0 0 60px;
		-ms-flex: 0 0 60px;
		-webkit-box-flex: 0;
	margin-right: 0px;
	padding: 30px 0;
}
.single-product-area .product-details-img {
  border: 1px solid #ddd;
  margin: 2px 0;
  border-radius: 4px;
  padding: 4px;
}
.single-product-area .product-details-img:hover  {
	border:1px solid #ffaf2e;
}

.single-product-area .slick-arrow {
  position: absolute;
	top: -23px;
	left: 24px;
	cursor: pointer;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	text-align: center;
	z-index: 99;
  font-size: 25px;
  font-weight: 400;
  color:#999;
}
.single-product-area .slick-next-btn.slick-arrow {
	bottom: -25px;
	top: auto;
}
.single-product-area .slick-arrow:hover{
  Xcolor: #000;
  color: #eeb013;
}
.single-product-area .product-large-thumb {
  position: relative;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.single-product-area .product-large-thumb img{
  width: 98%;
}
.single-product-area .product-large-thumb a.popup-img {
  position: absolute;
  bottom: 0;
	right: 0;
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	background: #777;
	color: #fff;
	border-radius: 4px;
	z-index: 100;
}
.single-product-area .product-large-thumb a.popup-img:hover{
  background-color: #FFCC00;
  color: #fff;
}
.single-product-area .large-product-img {
  display: inline-block;
  vertical-align: middle;
  border:0px solid #ffcc00;
  width:100%;
  text-align: center;
  margin: auto auto;
}




.ribbon {
  position: relative;
  display: block;
  position: absolute;
  top: -25px;
  right: 0;
  font-family: 'Titillium Web',sans-serif;
}
.ribbon .new-label {
  background-color: #c00;
  color: #FFFFFF;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  padding: 0 15px;
  border-radius: 5px;
}
.ribbon .eco-label {
  background-color: #8bba00;
  color: #FFFFFF;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  padding: 0 15px;
  border-radius: 5px;
}
  .ribbon .eco-label::before {
    border-left: 3px solid #8bba00;
    border-top: 3px solid #8bba00;
  }
  .ribbon .eco-label::after {
    display: inline-block;
    content: "\f06c";
    font-family: "Font Awesome 5 Pro";
    font-size: 12px;
    font-weight: 300;
    position: relative;
    top: 0;
    padding-right:0px;
}
.ribbon .best-seller-label {
  background-color: #ff0000;
  color: #FFFFFF;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  padding: 0 15px;
  border-radius: 5px;
}

.ribbon .new-label::before,
.ribbon .eco-label::before,
.ribbon .best-seller::before {
  position: absolute;
  content: "";
  bottom: -4px;
  left: 8px;
  height: 5px;
  width: 5px;
  background-color: transparent;
  border-right: 3px solid transparent;
  Xborder-left: 3px solid #c00;
  Xborder-top: 3px solid #c00;
  border-bottom: 3px solid transparent;
}



/* COLOR SWATCH -NEW- *****************/
.color-swatch {
  position: relative;
}
.color-swatch h2 {
  font-size: 15px;
  font-weight:400;
  margin-bottom: 10px;
}
.color-swatch h2 span{
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  background: #eee;
  border-radius: 100px;
  padding: 2px 10px;
}
.color-swatch .color-badge {
  display: block;
  position: absolute;
  top: -15px;
  right: -12px;
  background-color: #333;
  background-image: linear-gradient(145deg,hsla(0,0%,100%,.55),transparent);
  font-family: 'Titillium Web',sans-serif;
  color: #FFFFFF;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  padding: 0 6px;
  border-radius: 8px;
  z-index: 1;
}
.color-swatch .color-badge::before {
  position: absolute;
  content: "";
  bottom: -5px;
  left: 8px;
  height: 5px;
  width: 5px;
  background-color: transparent;
  border-right: 3px solid transparent;
  border-left: 3px solid #666;
  border-top: 3px solid #666;
  border-bottom: 3px solid transparent;
}
.checkbox-btn{
  position:relative;
  margin-right:6px;
  margin-bottom: 5px;
  cursor: pointer;
}
.checkbox-btn input{
  position:absolute;
  z-index:-1;
  opacity:0;
}
.btn-color-hover{
  position: relative;
  display: inline-block;
  width: 30px;
  height: 30px;
  margin-bottom: 0;
  border-radius: 50%;
  background-image: linear-gradient(145deg,hsla(0,0%,100%,.55),transparent);
  box-shadow: inset 0 0 0 3px #f9f9f9, 0 0 0 1px #ccc;
  transform: scale(1);
  transition: all 0.1s linear;
  xxxtransition: all .2s ease-in-out;
}
.btn-color-hover:hover{
  box-shadow: inset 0 0 0 6px #f9f9f9, 0 0 0 2px #ffcc00;
}
.checkbox-btn input:checked~.btn-color-hover{
  Xborder-color:#0d6efd;
  Xbackground-color:#e9ecef;
  box-shadow: inset 0 0 0 1px #fff, 0 0 0 3px #666;
  transform: scale(1.1);
}

/* COLOR LIST *****************/
.colours-wrapper {
  position: relative
}
.input-invisible {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0
}
.list-inline-item {
  display: inline-block
}
.list-inline-item:not(:last-child) {
  margin-right: .5rem
}
.btn-colour {
  position: relative;
  display: inline-block;
  width: 35px;
  height: 35px;
  margin-bottom: 0;
  border-radius: 50%;
  box-shadow: inset 0 0 0 3px #fff, 0 0 0 1px #ced4da;
  background-position: center;
  background-size: cover;
  cursor: pointer;
  transition: border-color .1s;
}
.btn-colour:hover {
  box-shadow: inset 0 0 0 5px #fff, 0 0 0 1px #868e96;
}
.btn-colour.active {
  box-shadow: inset 0 0 0 3px #fff, 0 0 0 2px #000; /* #495057 */
}






/*********************>>>>>>>>>>>>> 3D - 360 PRODUCT PAGE IMAGE  LABEL */
.sticker-3d-wrapper {
  display: block;
  padding:0;
}
.sticker-3d {
  position: relative;
}
.sticker-3d:after {
  position: absolute;
  top: 0;
  right: 0;
  xdisplay: inline-block;
  width: 30px !important;
  background-repeat: no-repeat;
  transition: .6s ease;
  cursor: pointer;
  content: url(https://www.spectorandco.ca/images/icons/360-view-icon.svg);
}
.sticker-3d:hover:after {
  xdisplay: inline-block;
  transition: .6s ease;
  content: url(https://www.spectorandco.ca/images/icons/360-view-icon2.svg);
}

/*********************>>>>>>>>>>>>> AR CODE  */

.ar-wrapper {
  display: block;
  padding:0;
}
.sticker-ar {
  position: relative;
}
.sticker-ar:after {
  position: absolute;
  top: 2rem;
  right: 0;
  xdisplay: inline-block;
  width: 30px !important;
  background-repeat: no-repeat;
  transition: .6s ease;
  cursor: pointer;
  content: url(https://www.spectorandco.ca/images/icons/ar-icon.svg);
}
.sticker-ar:hover:after {
  xdisplay: inline-block;
  transition: .6s ease;
  content: url(https://www.spectorandco.ca/images/icons/ar-icon2.svg);
}

.spector-vision-icon-image {
	width: 70px;
  margin-right: 20px;
  /* padding-right: 20px; */
  /* border-right: 1px solid #ddd; */
}







/* PRODUCT SKU DESCRIPTION --------------------
***********************************************/

.icons_product_page ul{
    display: inline-block;
}
.icons_product_page ul > li {
	display: inline-block;
  position: relative;
  list-style: none;
	margin-bottom: 25px;
	margin-LEFT: 25px;
}
.icons_product_page img {
  width: 40px;
}

.icons_product_page li a span {
  position: absolute;
  display: block;
  width: 100%;
  left: 50%;
  transform: translateX(-50%);
  bottom: -17px;
  font-size: 7px;
  font-weight: 500;
  line-height: 1;
  color: #000;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media only screen and (max-width: 767px) {
	.icons_product_page li a span {
    position: absolute;
    display: block;
    bottom: -1.2rem;
    font-size: 7px;
    font-weight: 500;
    line-height: 1.2;
    color: #000;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
	}
}

.icons_product_page_nfc img {
  width: 30px;
  height: 0 auto;
}
.icons_product_page_currency img {
  width: 12px;
  height: 0 auto;
}


.icons_product_page2 ul > li {
	display: inline-block;
  position: relative;
  list-style: none;
  text-align: center;
  xborder: 1px solid #ccc;
  width: 30px;
  height: 30px;
	margin-LEFT: 15px;
}
.icons_product_page2 ul{
  margin: 0px 0px !important;
  padding: 0px !important;
  text-align: right;
  position: relative;
  top: -10px;
}
@media only screen
and (min-width: 320px)
and (max-width: 1024px){
  .icons_product_page2 ul{
    text-align: left;
    position: relative;
    top: 0px;
  }
}










/* TABS / PRODUCT TABS --------------------
******************************************/

.product-page-tabs-wrapper {
  display: block;
  background-color: #f8f9fa;
  padding:0 25px;
  margin-top: 60px;
  margin-bottom: 60px;
  min-height: 500px;
}
@media only screen and (max-width: 767px){
  .product-page-tabs-wrapper .container {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
}

.product-page-tabs {
  position: relative;
  padding-top: 5%;
}
@media only screen and (max-width: 767px){
  .product-page-tabs {
    position: relative;
    border: 0px solid #e9ecef;
    border-radius: 10px;
  }
}
/*
.product-page-tabs .nav-tabs {
  padding-top: 20px;
  padding-bottom: 10px;
  padding-left: 10px;
  padding-right: 10px;
}
@media only screen and (max-width: 767px){
  .product-page-tabs .nav-tabs {
    padding:0;
  }
}
*/

.product-page-tabs .tab-content{
  position: relative;
  xtop: -3px;

  XXXborder-top: 1px solid #e9ecef;
  /*
  border-left: 1px solid #e9ecef;
  border-right: 1px solid #e9ecef;
  border-bottom: 1px solid #e9ecef;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  */
}

.product-page-tabs .tab-content .tabs-text p{
  font-size: 16px;
}


.product-page-tabs .rounded-nav {
  border-radius: 5px;
  background-color: transparent;
}
.product-page-tabs .nav-pills .nav-link {
  color: #666;
  xbackground-color: #f3f3f3;
  background-color: #ddd;
  border-radius: 5px;
  padding: 15px 0;
  margin:0 3px ;
  top:10px;
}
.product-page-tabs .nav-pills .nav-link:hover {
  color: #fff;
  background-color: #ccc;
  border-radius: 5px;
}
.product-page-tabs .nav-pills .nav-link.active {
  color: #fff;
  font-weight: 500;
  letter-spacing: 5px;
  background-color: #555;
}
.product-page-tabs .nav-pills .nav-link.active::after {
    background: url(https://pngimg.com/uploads/red_arrow/red_arrow_PNG37.png) no-repeat;
    bottom: -7px;
    clear: both;
    content: "";
    display: block;
    height: 7px;
    margin: 0 auto 0 auto;
    position: absolute;
    width: 27px;
    left: 0;
    right: 0;
    text-align: center;
}
.product-page-tabs .nav-pills .nav-link.active:hover {
  border-radius: 5px;
}

.product-page-tabs .nav-item i{
  margin-right:5px;
}


@media only screen and (max-width: 767px){
  .product-page-tabs .nav-tabs li{
    XXXwidth:50%;
  }
  .product-page-tabs .nav-pills .nav-link {
    color: #777;
    border: 1px solid #ececec!important;
    background: #fff;
    border-radius: 30px !important;
    margin: 3px;
    top: 0;
    padding: 10px 20px;
    font-size: .9rem;
    font-weight: 400;
  }
  .product-page-tabs .nav-pills .nav-link.active {
    color: #fff;
    font-weight: 500;
    letter-spacing: 0;
    background-color: #ffcc00;
  }
  .product-page-tabs .nav-pills .nav-link.active:hover {
    border-radius: 50px;
  }

  .product-page-tabs .tab-content .px-4 {
    padding-right:0!important;
    padding-left: 0!important;
  }
}


.new-tabs-list li{
  display: flex;
  position: relative;
  margin-bottom:10px;
}
.new-tabs-list li span{
  margin-right:10px;
}






/** ICONS **/
.title-icon {
  width: 30px;
  margin-right: 10px;
  position: relative;
  top: -3px;
}


.related-product-area {
  display: block;
}




/* RELATED PRODUCTS --------------------
***************************************/
.section-related-product-wrapper {
  padding: 1.2rem 1.2rem 4.2rem;
  xpadding: 1.2rem;
  border: 0.0625rem solid #ebebeb;
  xmin-height: 370px;
  Xmargin: 10px;
  border-radius: 8px;
  box-shadow: 0 0 24px rgb(0 0 0 / 10%);
  background-color: #fff;
}


.product-card-wrapper {
  margin-bottom: 2rem;
}
.product-card-grid {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  xborder: 2px solid rgba(17,17,17,.125);
  border: 1px solid #e7e7e7;
  border-radius: 8px;
  padding:20px;
  transition: all 0.5s ease-in-out;
  color: #4d4d4d;
  height: 100%;
}
.product-card-grid:hover {
  Xtransform: scale(1.01);
  transform: translateY(-3px);
  cursor: pointer;
  transition: all 0.1s ease-in;
}
.product-card-grid:hover img {
  XXXtransform: scale(1.06);
  transition: all 0.8s ease-in;
}
.product-card-grid:hover {
  border: 1px solid #ffcc00;
  transition: transform .2s ease-in;
  xtransition: all 0.5s ease-in-out;
}

.grid-shadow {
  box-shadow: 0 0.25rem 0.5625rem -0.0625rem rgb(0 0 0 / 3%), 0 0.275rem 1.25rem -0.0625rem rgb(0 0 0 / 5%);
}
.grid-shadow:hover {
  box-shadow: 0 0.25rem 0.5625rem -0.0625rem rgb(0 0 0 / 2%), 0 0.275rem 1.25rem -0.0625rem rgb(0 0 0 / 20%);
}


/* ---------- PRODUCT BADGE */
.product-badge {
	position: absolute;
	z-index: 5;
	top: 10px;
	left: 10px;
  font-size: 12px;
  font-weight: 700;
	text-align: center;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #fff;
}
.product-badge span {
	display: block;
	margin-bottom: 10px;
	padding: 3px 12px;
	border-radius: 20px;
}
.product-badge span:last-child {
	margin-bottom: 0;
}
.product-badge span.onsale {
	background-color: #d92523;
}
.product-badge span.new {
	background-color: #d92523;
}
.product-badge span.wql{
	background-color: #8b008b;
}
.product-badge span.overseas-direct{
	background-color: #1e90ff;
}
.product-badge span.eco {
	background-color: #648c11;
}
.product-badge span.eco::before {
    display: inline-block;
    content: "\f06c";
    font-family: "Font Awesome 5 Pro";
    font-size: 12px;
    font-weight: 300;
    position: relative;
    top: 0;
    padding-right:2px;
}

/* ---------- PRODUCT IMAGE */
.product-item-img {
  position: relative;
  display: block;
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
}
.product-item-img img{
  xwidth: 60%;
  xtransition: transform .2s ease-in;
  transition: all 0.2s ease-in-out;
  padding:10%;
}

/* ---------- PRODUCT CONTENT */
.product-content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.product-content-top {
  display: block;
  padding-bottom:10px;
}
.product-content .product-content-top {
  cursor: pointer;
}
.product-content .product-content-top h1 {
  color: #222;
  font-size:1.2rem;
  line-height: normal;
  font-weight: 600;
  text-transform: uppercase;
  margin: 0;
  margin-bottom: 5px;
  xtransition: all 0.5s ease-in-out;
}
.product-content .product-content-top:hover h1,
.product-content .product-content-top:hover h5 {
  color: #ffcc00;
}
.product-content .product-content-top h5 {
  font-size: 0.9rem;
  color:#444;
  margin: 0;
}
.product-content .product-content-top p {
  color: #222;
  font-size: 0.9em;
  font-weight: 300;
  position:relative;
  top: -1px;
  text-transform: uppercase;
  line-height: normal !important;
  display: block;
  margin: 0;
  font-style: italic;
}
.product-content .product-content-top span {
  color: #333;
  font-size: 0.6rem;
  font-weight:400;
  line-height: normal;
  display: block;
  margin:5px 0;
}
.product-content .product-content-top span>font {
  color:#ff0000;
  background-color: #eee;
  padding:2px 10px;
  border-radius: 7px;
  letter-spacing: -.0008rem;
  font-size: 0.8rem;
  font-weight: 600;
}




.product-quickview {
  position: relative;
}
.product-card-grid .product-quickview {
  /*
  position: absolute;
  z-index: 5;
  top: 10px;
  right: 10px;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #fff;
  opacity: 0;
  */
  position: absolute;
  top: 10px;
  right: 10px;
  xleft: 50%;
  xtop: 50%;
    x-webkit-transform: translateX(-50%) translateY(-50%);
  xtransform: translateX(-50%) translateY(-50%);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all .3s ease 0s;
  transition: all .3s ease 0s;
  z-index: 999999999999999999;
}
.product-card-grid:hover .product-quickview {
  opacity: 1;
	visibility: visible;
  transition-delay: 0.3s;
	x-webkit-transform: translateX(-50%) translateY(0px);
	x-ms-transform: translateX(-50%) translateY(0px);
	Xtransform: translateX(-5%) translateY(0px);
}
.product-quickview a{
  font-size: 10px;
  font-weight: 600;
  text-decoration: none;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  background-color: #555;
  letter-spacing: 0px;
  display: inline-block;
  line-height: 2.5em;
  position: relative;
  padding: 0 6px;
  margin-bottom: 2px;
  border-radius: 20px;
  cursor: pointer;
}
.product-quickview a:hover{
  color: #fff;
  background-color: #ffcc00;
}


.product-colors-list span{
  font-size: 0.8rem;
  color: #ffaf2e;
  display:inline-block;
  line-height:1;
}

.product-price {
  text-align: left;
}
.product-price span{
  font-size: 0.6rem;
  font-weight: 500;
}
.product-price p{
  color:#333;
  xbackground-color: #eee;
  xpadding:2px 10px;
  xborder-radius: 5px;
  letter-spacing: 1px;
  font-size: 1rem;
  font-weight: 500;
  margin:0;
}

.product-buttons {
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid rgba(0,0,0,.1);
  text-align: center;
}
.product-buttons .btn-quickview {
  font-size: 10px;
  font-weight: 400;
  text-decoration: none;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 1px;
  display: inline-block;
  line-height: 2.5em;
  position: relative;
  background-color: #555;
  padding: 0 10px;
  margin-bottom: 2px;
  border-radius: 4px;
  cursor: pointer;
}
.product-buttons .btn-quickview:hover {
  background-color: #ffcc00;
  color: #fff;
}
.product-buttons .btn-quickview::before {
  display: inline-block;
  position: relative;
  top: 1px;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  margin-right: 5px;
  font-family: "Font Awesome 5 Pro";
  content: "\f00e";
  font-weight: 900;
  transition: margin-left 0.2s linear 0s;
  transition: all 0.3s ease 0s;
}
.product-buttons .btn-compare {
  font-size: 10px;
  font-weight: 400;
  text-decoration: none;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  display: inline-block;
  line-height: 2.5em;
  position: relative;
  background-color: #999;
  padding: 0 10px;
  margin-bottom: 2px;
  border-radius: 4px;
  cursor: pointer;
}
.product-buttons .btn-compare:hover {
  background-color: #ffcc00;
  color: #fff;
}
.product-buttons .btn-compare::before {
  display: inline-block;
  position: relative;
  top: 1px;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  margin-right: 5px;
  font-family: "Font Awesome 5 Pro";
  content: "\f067";
  font-weight: 900;
  transition: margin-left 0.2s linear 0s;
  transition: all 0.3s ease 0s;
}


.product-content-wql-color-list {
  margin-top: 20px;
  margin-bottom: 10px;
}
.product-content-wql-color-list p{
  font-weight: 400;
  text-transform: none;
  line-height: normal;
  color: #ff0000;
  font-size: 0.6rem;
}
.product-content-wql-color-list .wql-color {
  display: inline-flex;
}
ul.wql-color{
  padding: 0;
}
.product-content-wql-color-list .wql-color li {
  margin-right: 5px;
}
.product-content-wql-color-list .wql-color li .wql-color-swatch {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-bottom: 0;
  border-radius: 50%;
  background-image: linear-gradient(145deg,hsla(0,0%,100%,.55),transparent);
  transition: all .2s ease-in-out;
  box-shadow: inset 0 0 0 2px #f9f9f9, 0 0 0 1px #ccc;
  transform: scale(1);
}




/*----------------------------------------------------------------------------------
  --- SINGLE PRODUCT  ---
---------------------------------------------------------------------------------*/

.single-product-container {
    width: 100%;
}
.single-product-container2 {
    width: 95%;
    background-color: #fff;
    border-top:3px solid #ffcc00;
    padding:10px;
}

.single-product {
  /*min-height: 420px;*/
  min-height: 100%;
  border: 1px solid #ddd;
  border-radius: 8px;
  text-align: center;
  cursor: pointer;
  /*padding-bottom: 20px;*/
  transition: all 0.3s ease-in-out;
  background-color: #fff;
}
.single-product:hover {
  overflow: hidden;
  transform: translateY(-5px);
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

@media only screen and (max-width: 767px){
  .single-product {
    padding: 8px !important;
  }
  .single-product img {
    padding: 0.5rem !important;
    margin-bottom: 20px;
  }
}



.bg-white-no-border {
  background-color: #fff;
  border: 0px solid #ddd !important;
}

.single-product img {
  padding: 1rem;
  transition: all 0.5s ease-in-out;
}
.single-product:hover img {
  transform: scale(1.03);
  transition: all 0.3s ease-in-out;
}
.single-product:hover {
  border: 1px solid #ffcc00;
}

.single-product .product-img {
	position: relative;
	overflow: hidden;
  height: 100%;
}

.single-product:hover .product-img > a:before {
  border: 200px solid #333;
  opacity: .2;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
  background: #555;
  cursor: pointer !important;
}

.single-product-wrapper {
  width: 100%;
  text-align: center;
  border: 0px solid #DDD;
  transition: all 0.3s ease-in-out;
  margin-bottom: 20px;
}
.single-product-wrapper:hover {
  overflow: hidden;
  transform: translateY(-5px);
}

.product-search-display-colors {
  width: 100%;
  text-align: center;
}
.product-display-searchPage-row-padding {
  margin-top: 45px;
}
@media only screen and (max-width: 767px){
	.product-display-searchPage-row-padding {
	  margin-top: 62px;
	}
}
@media only screen and (max-width: 576px){
	.product-display-searchPage-row-padding {
	  margin-top: 50px;
	}
}



.product-page-related-products-title {
  color: #222;
  display: block;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  padding-left: 4px;
  padding-right: 4px;
}
.product-page-related-products-title h1 {
    color: #222;
    font-size: 0.9rem;
    line-height: normal;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 0 10px;
    transition: all 0.5s ease-in-out;
}
.single-product:hover .product-page-related-products-title h1 {
  color: #000;
  transform: scale(1.03);
  transition: all 0.5s ease-in-out;
}
.product-page-related-products-title h5 {
    font-size: 12px;
    color:#999;
    margin: 0 0 5px;
}
.product-page-related-products-title p {
    color: #222;
    font-size: 0.9em;
    font-weight: 300;
    position:relative;
    top: -1px;
    text-transform: uppercase;
    line-height: normal !important;
    display: block;
    margin-bottom: 0px !important;
    font-style: italic;
}
.product-page-related-products-title span {
    color: #333;
    font-size: 0.8rem;
    font-weight: 300;
    line-height: normal;
    display: block;
}
@media only screen and (max-width: 767px){
  .product-page-related-products-title h1 {
      font-size: 90%;
  }
  .product-page-related-products-title p {
      font-size: 70%;
      font-weight: 400;
      margin-bottom: 0px !important;
  }
  .product-page-related-products-title span {
      font-size: 70%;
      margin-bottom: 0px !important;
      padding: 0px !important;
      margin: 0px !important;
      line-height: normal !important;
      display: inline-block;
  }
}


.product-search-display-colors{
  margin-bottom: 10px;
}
@media only screen and (max-width: 767px){
  .product-search-display-colors{
    margin: 0px 0;
  }
}
.product-search-display-colors span {
  font-size: 0.8rem;
  font-weight: 300;
  line-height: normal;
  color: #A8893B;
  font-size: 0.6rem;
  margin-top: 5px;
  padding: 0 10px;
  display: block;
}

.product-search-button-wrapper {
  width:100%;
  display: flex;
  justify-content: center;
}
.quickview-compare-btn {
  position: absolute;
  bottom: 10px;
}


.quick_inventory {
  background: #ff0000;
  color:#fff;
  border:1px solid #fff;
  text-transform: uppercase;
  padding: 7px 12px;
  transition: all .25s;
}
.quick_inventory:hover{
  background: #ccc;
  color: #000;
  font-weight: 500;
  box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.25);
}
.quick_inventory::before {
  content: "\f1ec";
  font: normal normal normal 14px/1;
  font-family: 'Font Awesome 5 Pro';
  font-weight: 900;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 12px;
  padding-right: 3px;
}
.product_page_dimensions p{
  font-size: 12px;
}
.quick_inventory2 {
  background: #333;
  color:#fff;
  font-size: 10px;
  text-transform: uppercase;
  padding: 7px 15px;
  transition: all .25s;
  margin-right:5px;
  letter-spacing: 1px;
}
.quick_inventory2:hover{
  background: #ccc;
  color: #000;
}
.product_page_dimensions p{
  font-size: 12px;
}
@media only screen and (max-width: 767px) {
  .quick_inventory2 {
    width: 160px;
    min-width: 160px;
  }
}



.bag_features {
  width: 100%;
  background: #222;
  color:#fff;
  font-size: 10px;
  border:1px solid #fff;
  text-transform: uppercase;
  padding: 5px 7px;
  transition: all .25s;
}
.bag_features:hover{
  background: #ccc;
  color: #000;
  font-weight: 500;
  box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.25);
}
.bag_features::before {
  content: "\f290";
  font: normal normal normal 14px/1;
  font-family: 'Font Awesome 5 Pro';
  font-weight: 900;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 12px;
  padding-right: 3px;
}
@media only screen and (max-width: 380px) {
  .bag_features {
    width: 50%;
    background: #ff0000;
    color:#fff;
    border:1px solid #fff;
    text-transform: uppercase;
    padding: 5px 7px;
    transition: all .25s;
    font-size: 50% !important;
  }
}



.factory_direct {
  background: #00A9E0;
  color:#fff;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: center;
  padding: 2px 8px;
  transition: all .25s;
  display: flex;
  flex-wrap: wrap;
}
.factory_direct::before {
  content: "\f57e";
  font: normal normal normal 14px/1;
  font-family: 'Font Awesome 5 Pro';
  font-weight: 900;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 14px;
  padding-right:8px;
}

.factory_direct_timeline{
  width: 100%;
  background: #eee;
  color:#000;
  font-weight: 400;
  padding:5px;
  padding-left: 10px;
  line-height: 1.5 !important;
  font-size: 10px;
  margin-bottom: 10px;
  display: inline-block;
}
.factory_direct_timeline::before {
  content: "\f071";
  color:#ffcc00;
  font: normal normal normal 14px/1;
  font-family: 'Font Awesome 5 Pro';
  font-weight: 900;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 14px;
  padding-right:2px;
}

@media only screen and (max-width: 380px) {
  .factory_direct {
    width: 100%;
  }
}





/*
.single-product-container {
  position: relative;
}
.single-product-container .single-product {
  border: 1px solid #DDD;
  border-radius: 8px;
  text-align: center;
  margin:10px;
  cursor: pointer;
  transition: .5s;
}
.single-product-container .single-product:hover {
  xtransform: scale(1.01);
  border: 1px solid #ffcc00;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.single-product .search-height {
  min-height: 375px !important;
}


.product-action {
	position: absolute;
	top: 32%;
	left: 50%;
  transform: translateX(-50%);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
  opacity: 0;
  z-index: 5;
}
.single-product:hover .product-action{
  opacity: 1;
  position: absolute;
	top: 30%;
	left: 50%;
  transform: translateX(-50%);
}
.product-action-quickview {
	position: absolute;
	top: 32%;
	left: 50%;
  transform: translateX(-50%);
	transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
  opacity: 0;
  z-index: 5;
}
.single-product:hover .product-action-quickview{
  opacity: 1;
  position: absolute;
	top: 30%;
	left: 50%;
  transform: translateX(-50%);
}
.product-action-quickview .quick-view-btn,
.product-action-fullview .quick-view-btn,
.product-action-addtocompare .quick-view-btn {
  min-width: 130px;
  -webkit-transition: .3s ease;
  transition: .3s ease;
  cursor: pointer;
}
.product-action-quickview .quick-view-btn,
.product-action-fullview .quick-view-btn,
.product-action-addtocompare .quick-view-btn {
  background: #222;
  border-radius: 6px;
  color: #fff;
  font-size: 12px;
  line-height: 2;
  font-weight:300;
  letter-spacing: .03em;
  text-align: left;
  display: block;
  width: 100%;
  padding: 5px 10px;
  -webkit-transition: all .3s ease;
  transition: all .5s ease;
  cursor: pointer;
}

.product-action-quickview .quick-view-btn:hover,
.product-action-fullview .quick-view-btn:hover,
.product-action-addtocompare .quick-view-btn:hover {
  background-color: #fff;
  color: #000;
  box-shadow: 0 0px 10px 0 rgba(0,0,0,.7);
}
.product-action-quickview .quick-view-btn i,
.product-action-fullview .quick-view-btn i,
.product-action-addtocompare .quick-view-btn i {
  position: relative;
  top: 2px;
  font-size: 12px;
  font-weight: 300;
  margin-right: 5px;
}
.product-action-fullview {
	position: absolute;
	top: 42%;
	left: 50%;
  transform: translateX(-50%);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
  opacity: 0;
  z-index: 5;
}
.single-product:hover .product-action-fullview {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  position: absolute;
	top: 40%;
	left: 50%;
  transform: translateX(-50%);
  transition-delay:0.2s;
}

.product-action-addtocompare {
	position: absolute;
	top: 52%;
	left: 50%;
  transform: translateX(-50%);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
  opacity: 0;
  z-index: 5;
}
.single-product:hover .product-action-addtocompare {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  position: absolute;
	top: 50%;
	left: 50%;
  transform: translateX(-50%);
  transition-delay:0.3s;
}
*/




/* QUICKVIEW SLIDE BUTTON */
.product-action {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	        transform: translate(-50%,-50%);
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	z-index: 5;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	margin-right: -50px;
}
.single-product:hover .product-action{
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.product-action > ul {
    clear: none;
    margin: 0 0 10px 0;
    padding: 0;
    position: relative;
    top: -30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-transition: .3s ease;
    transition: .3s ease;
}


.single-product:hover .product-action > ul{
    top: 0;
}
.product-action > ul > li {
	list-style: none;
	display: inline-block;
    margin: 0 5px;
}
.product-action > ul > li:first-child{
    margin-left: 0px;
}
.product-action > ul > li{
    margin-right: 0px;
}
.product-action > ul > li > a {
    background: transparent;
    border: 1px solid #fff;
    color: #fff;
    display: block;
    font-size: 16px;
    height: 46px;
    letter-spacing: 0;
    line-height: 44px;
    text-align: center;
    text-transform: none;
    width: 48px;
    border-radius: 0;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
}
.product-action > ul > li > a:hover{
    background: #fff;
    color: #FFCC00;
}



.quickviewbtn-org {
  bottom: -60px;
  position: relative;
  -webkit-transition: .3s ease;
  transition: .3s ease;
}

.quickviewbtn-org > a  {
  background: #000;
  border: 1px solid #000;
  border-radius: 4px;
  color: #fff;
  text-transform: uppercase;
  font-size: 0.6rem;
  font-weight: bold;
  letter-spacing: 0;
  line-height: normal;
  text-align: center;
  display: block;
  width: 100%;
  padding: 10px 10px;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  cursor: pointer;
}
.quickviewbtn-org > a:hover{
  background-color: #fff;
  color: #000;
}
.quickviewbtn-org > a > i{
  font-size: 12px;
  font-weight: 300;
  margin-right: 5px;
  display: none;
}




/*  COMPARE BUTTON   ************************************/
a.action-btn-compare {
  border: none;
  width: 44px;
  height: 44px;
  line-height: 44px;
  border-radius: 5px;
  background-color: #f1f1f1;
  text-align: center;
  position: relative;
  display: inline-block;
}
a.action-btn-compare:hover {
  background-color: #ffcc00;
  color:#fff;
  transform: translateY(-5px);
  cursor: pointer;
}




/* PRICE GRID BANNER - PRODUCT PAGE **********************************************************************
**********************************************************************************************************/
.Price_Grid_Table {
  width: 80%;
  table-layout: fixed;
  display: table;
  font-size: 80%;
  background-color:#ffF;
  border-color:#E6E6E6;
  border-left: 1px dotted #e6e6e6 !important;
}
@media only screen and (max-width: 767px){
  .Price_Grid_Table {
    width: 100%;
  }
}
.table_grid_qty {
  display: table-header-group;
  Xfont-weight: bold;
  Xborder: 1px solid #F2F2F2;
}
.table_grid_price {
  display: table-row;
  border: 1px solid #F2F2F2;
}
.table-cell {
  display: table-cell;
  text-align: center;
  background-color:#fff;
  border-width: 1px 1px 1px 0;
  border-style: solid dotted inset double;
  border-color: #e6e6e6 #e6e6e6 #e6e6e6 #e6e6e6;
}
.table_qty_price {
  color: #333;
  font-weight: 500;
  text-transform: uppercase;
  padding: 5px;
}
@media only screen and (max-width: 767px){
  .table-cell {
    display: table-cell;
    border: 1px solid #ccc;
    padding: 1px 5px 1px 5px;
    text-align: center;
    font-size: 107% !important;
  }
}

/* END PRICE GRID BANNER - PRODUCT PAGE ****************/











/*----------------------------------------------------------------
    PRODUCT PAGE - NEW TABS (DROPDOWN IN MOBILE)
----------------------------------------------------------------*/

.new-tab-style-pruduct-page {
  margin: 25px 0;
}

/*
.new-tab-style-pruduct-page .tab-content .tab-pane {
  display: none;
}
.new-tab-style-pruduct-page .tab-content .tab-pane.active {
  display: block;
}
*/

.new-tab-style-pruduct-page .nav > li > a {
  position: relative;
  display: block;
  padding: 10px 15px;
}
.new-tab-style-pruduct-page .nav-tabs > li > a {
  margin-right: 2px;
  line-height: 1.428571429;
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
}
.new-tab-style-pruduct-page .nav-tabs > li .active {
    color: #fff;
    font-weight: 500;
    letter-spacing: 5px;
    background-color: #ffcc00;
}


@media (min-width: 768px) {
  .new-tab-style-pruduct-page .panel-heading {
    display: none;
  }
  .new-tab-style-pruduct-page .panel {
    border: none;
    box-shadow: none;
  }
  .new-tab-style-pruduct-page .panel-collapse {
    height: auto;
  }
  .new-tab-style-pruduct-page .panel-collapse.collapse {
    display: block;
  }
}
@media (max-width: 767px) {
  .new-tab-style-pruduct-page .tab-content .tab-pane {
    display: block;
  }
  .new-tab-style-pruduct-page .nav-tabs {
    display: none;
  }
  .new-tab-style-pruduct-page .panel-title a {
    display: block;
  }
  .new-tab-style-pruduct-page .panel {
    margin: 0;
    box-shadow: none;
    border-radius: 10px;
    margin-top: -2px;
  }
  .new-tab-style-pruduct-page .tab-pane:first-child .panel {
    border-radius: 5px 5px 0 0;
  }
  .new-tab-style-pruduct-page .tab-pane:last-child .panel {
    border-radius: 0 0 5px 5px;
  }
}




.new-tab-style-pruduct-page .panel {
  border: 2px solid #fff;
}
.new-tab-style-pruduct-page .panel-default > .panel-heading {
  color: #333;
  background-color: #f5f5f5;
  xborder-color: #ddd;
}

.new-tab-style-pruduct-page .panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

.new-tab-style-pruduct-page .panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  color: inherit;
}

.new-tab-style-pruduct-page .panel-title a::after {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  margin-left: auto !important;
  content: "";
  background-repeat: no-repeat;
  background-size: 1.25rem;
  transition: transform .2s ease-in-out;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000000'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}




/*----------------------------------------------------------------
    COLOR SWATCH
----------------------------------------------------------------*/
.colorList,
.colorList ul,
.colorList li {
  list-style: none outside none;
  list-style: none;
  display: inline-block;
  margin: 0 auto;
  padding:0;
  font-size: 13px;
  font-style: normal;
}
.double-circle {
  color: white;
  border-radius: 5%;
  MARGIN: 2PX;
  width: 35PX;
  height: 18PX;
  display: block;
  display: inline-block;
  position: relative;
	vertical-align: middle;
}

.double-circle:hover {
  box-shadow: 0 1px 10px #333;
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}

.ribbon-wql.rib-dark{
  color: #000 ;
}
.ribbon-disco.rib-dark{
  color: #000 ;
}
.ribbon-soldout.rib-dark{
  color: #000 ;
}

.ribbon-wql {
  display: block;
  position: relative;
	color: #fff;
	font-size: 10px !important;
  font-weight: 700;
  letter-spacing: 0px;
	text-transform: uppercase;
  padding: 5 auto;
  margin: 0 auto;
  top: -5%;
  height: 17px;
  line-height: 17px;
  left: 15%;
  transform: rotate(-10deg) !important;
}
.ribbon-disco {
  display: block;
  position: relative;
	color: #fff;
	font-size: 10px !important;
  font-weight: 700;
  letter-spacing: 0px;
	text-transform: uppercase;
  padding: 5 auto;
  margin: 0 auto;
  top: -5%;
  height: 17px;
  line-height: 17px;
  left: 1%;
  transform: rotate(-10deg) !important;
}
.ribbon-soldout {
  display: block;
  position: relative;
  xbackground: #ff0000;
	color: #fff;
	font-size: 8px !important;
  font-weight: 500;
  letter-spacing: -1px;
	text-transform: uppercase;
  padding: 0;
  margin: 0 auto;
  top: 0%;
  height: 17px;
  line-height: 17px;
  transform: rotate(-10deg) !important;
}
.black{
  background-color: #000;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 2px #000;
}
.white{
  background-color: #fff;
  box-shadow:
    0px 0px 0px 1px #fff,
    0 0 0 2px #999;
}
.red{
  background-color: #DC143C;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 2px #DC143C;
}
.blue{
  background-color: #0000ff;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 2px #0000ff;
}
.green{
  background-color: #00cc00;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 2px #00cc00;
}
.orange{
  background-color: #ff6600;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 2px #ff6600;
}
.yellow{
  background-color: #ffcc00;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 2px #ffcc00;
}
.chrome{
  background-color: #e3e3e3;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 2px #e3e3e3;
}
.charcoal-cool {
  background-color: #53565A;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #53565A;
}
.charcoal-416 {
  background-color: #96978C;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #96978C;
}
.charcoal-cool-gray {
  background-color: #63666A;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #63666A;
}
.gold-7535 {
  background-color: #c4bda3;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #c4bda3;
}
.gold-2310 {
  background-color: #D9C0A9;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #D9C0A9;
}
.rose-gold-7513 {
  background-color: #EBBFA6;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #EBBFA6;
}
.pink-5025 {
  background-color: #e0bdba;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #e0bdba;
}
.pink-219 {
  background-color: #de1f82;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #de1f82;
}
.pink-211 {
  background-color: #fc7ab0;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #fc7ab0;
}
.silver-877 {
  background-color: #8A8D8F;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #8A8D8F;
}
.silver-cool-gray {
  background-color: #A7A8AA;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #A7A8AA;
}
.purple-2593 {
  background-color: #85248f;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #85248f;
}
.purple-269 {
  background-color: #4a245e;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #4a245e;
}
.purple-violet {
  background-color: #6600a1;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #6600a1;
}
.brown-168 {
  background-color: #6b300d;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #6b300d;
}
.brown-4695 {
  background-color: #52291c;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #52291c;
}
.brown-7610 {
  background-color: #6B3432;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #6B3432;
}
.grey-cool-11 {
  background-color: #7A7D81;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #7A7D81;
}
.grey-426 {
  background-color: #25282a;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #25282a;
}
.gun-metal {
  background-color: #4a3826;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #4a3826;
}
.burgundy {
  background-color: #b01c2e;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #b01c2e;
}
.copper {
  background-color: #CA723C;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #CA723C;
}
.natural {
  background-color: #dbad6b;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #dbad6b;
}
.cork {
  background-color: #c48f5e;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #c48f5e;
}
.wood {
  background-color: #f0deba;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #f0deba;
}
.blue_655 {
  background-color: #002554;
  box-shadow:
    0px 0px 0px 1px white,
    0 0 0 4px #002554;
}









/*----------------------------------------------------------------
  -  INSTANT QUOTE
  -
  -
  -
  -
  -
  -
----------------------------------------------------------------*/
.cost-estimator-wrapper {
  white-space: nowrap;
  font-size: 11px;
  padding: 2px 0;
}
.cost-estimator-col1 {
  display: inline-block;
  width: 22%;
  white-space: normal;
  xpadding: 5px;
  vertical-align: top;
}
.cost-estimator-col2 {
  display: inline-block;
  width: 40%;
  white-space: normal;
  vertical-align: top;
}
.cost-estimator-col2B {
  display: inline-block;
  width: 75%;
  white-space: normal;
  vertical-align: top;
}
.cost-estimator-col3 {
  display: inline-block;
  width: 20%;
  white-space: normal;
  vertical-align: top;
  text-align: right;
}
.cost-estimator-col4 {
  display: inline-block;
  width: 15%;
  white-space: normal;
  vertical-align: top;
  text-align: right;
}

.unit__span{
  font-size: 10px;
  color:#888;
}


.container__2__col {
  display: table;
  width: 100%;
}
.col__1 {
  display: table-cell;
  width: 50%;
}
.col__bg__grey {
  Xbackground: #f7f7f7;
  Xbackground-color: #f9fbfd;
  xbackground-color: #fbf9f6;

  background-color: rgba(241,185,128,.1);
  padding: 20px 20px;
  border-radius: 12px;
}
.col__1__PaddingRight {
  padding-right:2%;
  min-height: 350px;
}
.pp__2buttons__pad{
  margin-top: 10px;
  margin-bottom: 10px;
  min-height: 70px;
  height:100%;
}

@media only screen and (max-width: 1200px) {
  .col__1 {
    display: block;
    width: 100%;
    margin-top: 2rem;
  }
}

.col__1 p{
  font-size: 15px;
  margin: 0;
}

ul.product-page-featured-icons {
  padding: 0;
}
@media only screen and (max-width: 767px){
  ul.product-page-featured-icons {
    padding: 5px 0 15px 0;
  }
}

.product-page-featured-icons li {
  position: relative;
	display: inline-block;
  list-style: none;
  text-align: center;
  width: 25px;
  margin-right: 10px;
}


.product-description-title {
  display: block;
}

.quick-inventory-request-sample-wrapper {
  display: block;
  padding: 10px 0;
}




.product-pricing {
    position: relative;
    vertical-align: top;
}
.cost-estimator-line {
    clear: both;
    display: block;
    padding: 4px 0;
    border: 1px solid #ccc;
}
.cost-estimator-line .line-label {
    text-align: left;
    margin-right: 10px;
    margin-top: 2px;
    width: 75px;
    font-size: 11px;
}
.cost-estimator-line .line-item {
    width: 20%;
}
.cost-estimator-line .line-detail {
    width: 20%;
    text-align: right;
    font-size: 12px;
    padding-top: 4px;
    color: #999;
}
.line-detail {
    float: left;
}
.cost-estimator-line .line-subtotal {
    width: 15%;
    text-align: right;
    font-size: 12px;
    color: #777;
    padding-top: 4px;
}

.wrapper__cost__estimator__background {
  background:#f7f7f7;
}

.pp__quick__cost__estimator {
  color: #333;
	font-size: 11px;
  font-weight:400;
}
.pp__quick__cost__estimator input{
  color: #111;
	font-size: 11px;
}
.pp__quick__cost__estimator input:focus{
  color: #000;
	font-size: 11px;
}
.pp__quick__cost__estimator label{
  color: #000;
	font-size: 11px;
  font-weight:400;
  margin-bottom: 0rem !important;
}
.pp__quick__cost__estimator .sub__total_x span{
	font-size: 11px;
  font-weight:600;
  color: #666;
}
.pp__quick__cost__estimator .title_label {
  text-align: left;
  justify-content: left !important;
  width: 70px;
  font-size: 11px;
}

.pp__estimator__input_field_run {
    font-size: 11px;
    height: 0 auto;
    padding: 4px 5px;
    line-height: 0.5em;
    min-width: 50px;
    width: 75px;
    border: 1px solid #e6e6e6;
    text-align:right;
    pointer-events: none;
}
.pp__estimator__input_field {
    font-size: 11px;
    height: 0 auto;
    padding: 4px 5px;
    line-height: 0.5em;
    min-width: 50px;
    width: 75px;
    border: 1px solid #e6e6e6;
    text-align:right;
}
.estimator__detail {
    width: 22%;
    text-align: right;
    font-size: 12px;
    padding-top: 4px;
    color: #999;
    xborder: 1px solid #ff0000;
}
.estimator-padding {
    clear: both;
    display: block;
    padding: 4px 0;
}
.your_price{
	position: relative;
  top:5px;
  text-align: right;
}
.your_price_border {
	xborder: 1px solid #aaa;
  xpadding:5px;
}
.your_price h4{
  font-size: 14px;
  letter-spacing: -0.7px;
  font-weight: 600 !important;
  color: #000 !important;
}

.section__pp__branding {
  margin-top: 0.2%;
  padding:2% 15px;
}
.section__pp__branding:before {
  content : "";
  position: relative;
  left    : 14px;
  bottom  : 10px;
  height  : 1px;
  width   : 98.6%;
  text-align: center;
  border-top: 1px solid #e6e6e6;
}
.all__prices {
	font-size:10px;
}
.cost__estimator__title h4{
  font-size: 12px;
  font-weight:700 !important;
  color: #000 !important;
  text-transform: uppercase;
}


.quantity_slider {
	position: relative;
}
.quantity_slider p{
  font-size: 12px;
    font-weight: 500;
}
@media only screen and (max-width: 767px){
  .quantity_slider p{
  	font-size: 12px;
  }
}


.quote__disclaimer h3{
  font-size: 12px;
  font-weight: 500;
  color:#000;
}
.quote__disclaimer p{
  font-size: 11px;
  color:#111;
  line-height: 1.3!important;
}
.quote__disclaimer p i{
  color:#ff0000;
  font-size:15px;
}

.sec-hover:hover{
  background-color: #eee;
  color:#ff0000;
}




/*==============================================================================
  - IMAGE GALLERY BUTTON
  - DOWNLOAD PRODUCT IMAGES
==============================================================================*/

.dpi {
  display: inline-block;
  border: 1px solid #ddd;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 20px;
  padding:20px;
  border-radius: 5px;
}
.XXXdpi-item-wrapper {
  border: 1px solid #ddd;
  margin-bottom: 15px;
  padding:20px;
  border-radius: 5px;
}

.dpi img{
  position: relative;
  top:7px;
}
.prodImgCheckbox-101 {
  position: relative;
}

/* The check */
.check-dpi {
    display: block;
    position: relative;
    padding-left: 25px;
    margin-bottom: 12px;
    padding-right: 15px;
    cursor: pointer;
    font-size: 18px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.check-dpi input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
/* Create a custom checkbox */
.checkmark-dpi {
    position: absolute;
    left:0px;
    bottom:-5px;
    height: 16px;
    width: 16px;
    background-color: #fff;
    border-color:#bbb;
    border-style:solid;
    border-width:2px;
}
/* When the checkbox is checked, add a blue background */
.check-dpi input:checked ~ .checkmark-dpi {
    background-color: #fff  ;
}
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark-dpi:after {
    content: "";
    position: absolute;
    display: none;
}
/* Show the checkmark when checked */
.check-dpi input:checked ~ .checkmark-dpi:after {
    display: block;
}
/* Style the checkmark/indicator */
.check-dpi .checkmark-dpi:after {
    left: 4px;
    top: 1px;
    width: 5px;
    height: 10px;
    border: solid ;
    border-color:#000;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}





/*==============================================================================
  - LABELS AND RIBBONS
==============================================================================*/

/* PRODUCT PAGE -IMAGE NEW LABEL -NEW-
.product-badge-wrapper {
	font-size: 10px;
	position: absolute;
	z-index: 5;
	top: 10px;
	left: 10px;
	text-align: center;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #fff;
}
.product-badge-wrapper span {
	display: block;
	margin-bottom: 10px;
	padding: 0 15px;
	border-radius: 10px;
}
.product-badge-wrapper span:last-child {
	margin-bottom: 0;
}
.product-badge-wrapper span.onsale {
	background-color: #d92523;
}
.product-badge-wrapper span.new {
	background-color: #d92523;
}
.product-badge-wrapper span.wql{
	background-color: #8b008b;
}
.product-badge-wrapper span.factory-direct{
	background-color: #1e90ff;
}
.product-badge-wrapper span.eco {
	background-color: #648c11;
}
.product-badge-wrapper span.eco::before {
    display: inline-block;
    content: "\f06c";
    font-family: "Font Awesome 5 Pro";
    font-size: 12px;
    font-weight: 300;
    position: relative;
    top: 0;
    padding-right:2px;
}




.overseas-direct-ribbon {
  position: relative;
  top: 0;
  left: -12PX;
  z-index:1;
}
.overseas-direct-ribbon {
  padding: 7px 22px;
  color: #fff;
	background: #009ee2;
  font-weight: 400;
  text-align: center;
  display: inline-block;
  letter-spacing: 0.2em;
}
.overseas-direct-ribbon::before {
  border-top: 14px solid #1460a0;
}
.overseas-direct-ribbon::before {
  content: '';
  border-left: 12px solid transparent;
  border-right: 0 solid transparent;
  position: absolute;
  bottom: -14px;
  left: 0;
}
.overseas-direct-ribbon-disclaimer {
  width: 100%;
  background: #eee;
  color:#000;
  font-size: 14px;
  font-weight: 400;
  padding: 10px 0;
  padding-left: 10px;
  padding-top:25px;
  line-height: 1.5 !important;
  display: inline-block;
  position: relative;
  top:-20px;
  border-bottom: 2px solid #e2e2e2;
}
.overseas-direct-ribbon-disclaimer h2{
  color:#006699;
  font-size: 14px;
  font-weight: 500;
}
.overseas-direct-ribbon-disclaimer h2::before {
  content: "\f071";
  color:#ffcc00;
  font: normal normal normal 14px/1;
  font-family: 'Font Awesome 5 Pro';
  font-weight: 900;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 14px;
  padding-right:8px;
}
.overseas-direct-ribbon-disclaimer h2::after {
  content: "";
  position: relative;
  display: inline-flex;
  height: 3px;
  width:50%;
  bottom:5px;
  left: 2%;
  border-bottom: 1px solid #009ee2;
  }
.ac-brdr {
  width: 20px;
  margin: 0 auto;
  border-bottom: 1px solid #222;
  }
.overseas-direct-ribbon-disclaimer p{
  font-size: 13px;
  font-weight:300;
  line-height: 1.6 !important;
  margin-bottom: 0px !important;
}
.overseas-direct-ribbon-disclaimer .dis-style{
  border-bottom: 1px solid #e2e2e2;
  padding-bottom: 15px;
}


*/





















/* **************************************************************************
  - PRODUCT SEARCH PAGE
*****************************************************************************
*****************************************************************************
*****************************************************************************
*****************************************************************************
*****************************************************************************
*****************************************************************************
*****************************************************************************
*****************************************************************************
*****************************************************************************
*****************************************************************************
*****************************************************************************
*****************************************************************************
*/

.search-page {
  position: relative;
  padding-bottom: 100px;
}
@media (max-width: 767px){
	.search-page {
		padding-bottom: 10px;
	}
}

.searchpage-sidebar-section {
  position: relative;
  padding-right: 2rem;
  background-color: #fff;
    padding: 20px;
    border-radius: 0.7rem;
}
.searchpage-mainbar-section {
  position: relative;
  XXXpadding:0 2rem;
}
@media only screen and (max-width: 767px){
  .searchpage-mainbar-section {
    padding:0;
  }
}

.show-results-searchpage-title {
  font-size: 1em;
  font-weight: 500;
  color: #222;
  vertical-align: middle;
}

.searchpage-productlist-result{
  margin-top: 50px;
  margin-bottom: 50px;
}


.search-page .sb_widget:not(:last-child) {
  margin-bottom: 15px;
  border-bottom: 1px solid #e1e1e1;
  padding-bottom: 25px;
}
.search-page .sb_widget_title {
 line-height: 1;
 margin-bottom: 20px;
}
.sb_widget h5 {
  font-weight: 500;
 line-height: 1.3;
 margin-bottom: 20px;
}



.search-page-checkbox-wrapper {
  position: relative;
}
.xxxsearch-page-checkbox-wrapper .checkbox_item {
  margin: 0px;
  padding: 0px;
  display: block;
}
.search-page-checkbox-wrapper .checkbox_item input {
  xfloat: left;
  width: 25px;
  height: 25px;
  outline: none;
  cursor: pointer;
  appearance: none;
  margin-right: 10px;
  position: relative;
  border: 2px solid #e6e6e6;
  transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}
.search-page-checkbox-wrapper .checkbox_item input:before {
  top: 50%;
  left: 50%;
  opacity: 0;
  color: #fff;
  font-size: 14px;
  content: '\f00c';
  font-weight: 400;
  position: absolute;
  transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1);
  transform: translate(-50%, -50%);
  font-family: 'Font Awesome 5 Pro';
}
.search-page-checkbox-wrapper .checkbox_item input:checked {
	 border-color: #ffcc00;
	 background-color: #ffcc00;
}
.search-page-checkbox-wrapper .checkbox_item input:checked:before {
	 opacity: 1;
}
.search-page-checkbox-wrapper .checkbox_item label {
  position: relative;
  top: 0px;
  margin: 0px;
  xcursor: pointer;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 77%;
}
.search-page-checkbox-wrapper li:not(:last-child) {
	 margin-bottom: 10px;
}
.search-page-checkbox-wrapper label {
	 color: #7b7d7f;
	 font-size: 17px;
	 font-weight: 400;
}
.search-page-checkbox-wrapper input:checked + label {
	 color: #1c1f23;
   font-weight: 700;
}


.product-page-related-products-title2 h1 {
  font-size: 15px;
  font-weight: 600;
  color:#333;
  line-height: 1.1;
}
.product-page-related-products-title2 p {
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 0px !important;
}

.sb_pricing_range{
	margin-top: 20px;
}
.filter_price{
	width: 25%;
}
.checkbox_item{
	display: flex;
}
.price-text{
	justify-content: center;
}
@media (max-width: 992px) {
	.responsive_trigger{

	}
	.searchpage-sidebar-section{
		padding: 20px;
		margin-bottom: 20px;
	}
	.show-product {
		padding: 5px 10px;
	}
}
@media (max-width: 575px) {
	.page-number-display{
		margin-top: 5px;
	}
	.sortby{
		font-size: 14px;
	}
}
/* ------------------------------------
  PRICE SLIDER NEW
------------------------------------ */
.price-range-area {
	 padding-top: 7px;
}
 .price-range-area .slider-range {
	 height: 6px;
	 border: none;
	 border-radius: 45px;
	 background-color: #e7e7ee;
}
 .price-range-area .ui-slider-range {
	 border: none;
	 border-radius: 45px;
	 background-color: #ffcc00;
}
 .price-range-area .ui-state-default {
	 top: -7px;
	 width: 20px;
	 height: 20px;
	 border: none;
	 outline: none;
	 border-radius: 100%;
	 border: 6px solid #fff;
	 background-color: #ffcc00;
	 box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.2);
}
 .price-range-area .price-text {
	 font-size: 17px;
	 font-weight: 600;
	 margin-top: 20px;
	 color: #666;
}
 .price-range-area .price-text span {
	 float: left;
	 margin-right: 15px;
}
 .price-range-area .price-text input {
	 border: none;
	 font-weight: 600;
	 color: #000;
	 display: inline-block;
	 background-color: transparent;
}
 .price-range-area .price_filter_btn {
	 height: 40px;
	 color: #fff;
	 font-weight: 600;
	 padding: 10px 20px;
	 border-radius: 4px;
	 align-items: center;
	 display: inline-flex;
	 justify-content: center;
	 box-shadow: 0px 10px 30px 0px rgba(135, 153, 163, 0.5);
}



/* ------------------------------------
  START PRICE SLIDER VERSION 2
------------------------------------ */
  #price_slider2 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(100% - 40px);
    flex-direction: column;
	margin: 20px auto;
  }

.range-value{
    position: absolute;
    top: -26px;
    padding: 0px 15px;
    background-color: #999;
    border-radius: 3px;
    margin:0;
    color: #fff;
    font-size: 0.7rem;
  }
  .range-value.min{
    left: -20px;
  }

  .range-value.max{
    right: -20px;
  }
  .track-container{
    width: 100%;
    position: relative;
    cursor: pointer;
    height: 0.7rem;
  }

  .track,
  .track-highlight {
    display: block;
    position: absolute;
    width: 100%;
    height: 0.5rem;
  }

  .track{
    background-color: #ccc;
  }

  .track-highlight{
    background-color: #ffcc00;
    z-index: 2;
  }

  .track-btn{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    cursor: pointer;
    display: block;
    position: absolute;
    z-index: 2;
    width: 1rem;
    height: 1rem;
    top: calc(-50% - -1px);
    XXXmargin-left: -1rem;
    border: 3px solid #fff;
    box-shadow: 1px 1px 5px rgba(0,0,0,.5);
    border-radius: 50px;
    background-color: #ffcc00;
    -ms-touch-action: pan-x;
    touch-action: pan-x;
    transition: box-shadow .3s ease-out,background-color .3s ease,-webkit-transform .3s ease-out;
    transition: transform .3s ease-out,box-shadow .3s ease-out,background-color .3s ease;
    transition: transform .3s ease-out,box-shadow .3s ease-out,background-color .3s ease,-webkit-transform .3s ease-out;
  }








.form_field_row2 input {
    width: 40px;
    border: 1px solid #e6e6e6;
    padding: 6px;
    margin: 0 auto;
    font: 16px Arial, Helvetica, sans-serif;
    background: transparent;
    COLOR: #000;
    text-align: left;
}

.form_field_row2 textarea {
    width: 40px;
    border: 1px solid #e6e6e6;
    padding: 10px;
    margin: 0 auto;
    font: 20px Arial, Helvetica, sans-serif;
    background: transparent;
    border-radius: 6px;
    COLOR: #ff0000;
    text-align: center;
}



.toolbar-shorter {
	width: 280px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin-right: 35px;
}
.toolbar-shorter label {
	width: 120px;
	font-weight: 700;
	margin-bottom: 0;
	font-size: 14px;
	padding: 5px 15px;
	color: #222;
	text-transform: capitalize;
}



.page-number-display > ul > li {
	list-style: none;
	display: inline-block;
  line-height: 14px;
}
.page-number-display > ul > li > a {
	font-size: 16px;
  font-weight: 300;
	display: inline-block;
	position: relative;
	line-height: 14px;
	color: #000;
  xbackground: #fff;
  padding: 7px;
  xborder-radius: 0.2rem;
}
/*
.page-number-display > ul > li.active > a,
.page-number-display > ul > li > a:hover {
	color: #000;
}
*/

.page-number-display ul li a:hover {
  color: #ffcc00;
  background: #fff;
  border-radius: 0.2rem;
}
.page-number-display > ul > li.active > a {
  /*
	color: #ffcc00;
  border:1px solid #f2f2f2;
  padding:7px;
  font-weight: 700;
  */
  background: #fff;
	color: #ffcc00;
  padding: 7px;
  border-radius: 0.2rem;
}
.page-number-display li + li:before {
	content: " | ";
	padding: 0 8px;
	vertical-align: middle;
  font-size: 16px;
	color: #888;
  position: relative;
  bottom: 2px;
}






/** BADGES - NEW, WQL
------------------------------------------------------------------------
************************************************************************/

.badge {
  display: inline-block;
  position: absolute;
  top: 0px;
  margin-left:5px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  line-height: 1.2;
  letter-spacing: 1px;
  padding: 0.1em 0.6em;
  border-radius: 4px;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.badge-primary {
  color: #fff;
  background-color: #333;
}
.badge-secondary {
  color: #fff;
  background-color: #ff6f61;
}
.badge-new {
  color: #fff;
  background-color: #ffc107;
}
.badge-primary {
  color: #fff;
  background-color: #333;
}

.eta-badge {
  display: flex;
  position: relative;
  transition: 0.3s all ease-in-out;
  font-size: 0.9rem;
  margin: 5px 0;
}
.eta-badge .eta-text1{
  font-weight: 700;
  letter-spacing: 1px;
  color:#fff;
  background-color: #ffcc00;
  padding:1px 10px;
  border-radius: 50px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-right: 1px solid #fff;
}
.eta-badge .eta-text2{
  color:#666;
  font-weight: 500;
  text-transform: uppercase;
  padding:1px 15px 0 10px;
  background-color: #ddd;
  border-top-right-radius: 50px;
  border-bottom-right-radius: 50px;
}














/* START PRODUCT PAGE TABS
---------------------------------------------------------------*/
.container_CSS_TAB {
  width: 100%;
  height: 100%;
  margin: auto 0;
  padding: auto 0;
}

.list-unstyled {
  padding-left: 0;
  list-style: none;
}

@media only screen and (min-width: 768px) {
  .tabs--sm {
    border: 1px solid #d4d4d4;
  }
  .tabs--sm .tabs__content {
    border-width: 0;
    border-top-width: 1px;
  }
  .tabs--sm .tabs__list {
    background-color: white;
    margin: 0;
    margin-bottom: -1px;
    display: inline-block;
    width: 100%;
  }
  .tabs--sm .tabs__list .tabs__item {
    overflow: hidden;
    position: absolute;
    height: 0;
  }
  .tabs--sm .tabs__list .tabs__item--active {
    height: auto;
    position: relative;
  }
  .tabs--sm .tabs__list--open .tabs__item {
    position: relative;
    height: auto;
  }
  .tabs--sm .tabs__list--open .tabs__item--active > .tabs__link:after {
    content: none;
  }
  .tabs--sm .tabs__item {
    width: 100%;
    max-width: 100%;
    border-right: 0;
    text-align: left;
  }
  .tabs--sm .tabs__item--active > .tabs__link {
    background-color: #333333;
    color: white;
    border: 0;
  }
  .tabs--sm .tabs__item--active > .tabs__link:hover {
    color: white;
  }
  .tabs--sm .tabs__item--active > .tabs__link:after {
    content: "";
    width: 0;
    height: 0;
    border: .5em solid transparent;
    border-top-color: #ffffff;
    float: right;
    margin-top: .75em;
  }
}

@media (max-width: 760px) {
  .tabs--md {
    border: 1px solid #d4d4d4;
  }
  .tabs--md .tabs__content {
    border-width: 0;
    border-top-width: 1px;
  }
  .tabs--md .tabs__list {
    background-color: white;
    margin: 0;
    margin-bottom: -1px;
    display: inline-block;
    width: 100%;
  }
  .tabs--md .tabs__list .tabs__item {
    overflow: hidden;
    position: absolute;
    height: 0;
  }
  .tabs--md .tabs__list .tabs__item--active {
    height: auto;
    position: relative;
  }
  .tabs--md .tabs__list--open .tabs__item {
    position: relative;
    height: auto;
  }
  .tabs--md .tabs__list--open .tabs__item--active > .tabs__link:after {
    content: none;
  }
  .tabs--md .tabs__item {
    width: 100%;
    max-width: 100%;
    border-right: 0;
    text-align: left;
  }
  .tabs--md .tabs__item--active > .tabs__link {
    background-color: #333333;
    color: white;
    border: 0;
  }
  .tabs--md .tabs__item--active > .tabs__link:hover {
    color: white;
  }
  .tabs--md .tabs__item--active > .tabs__link:after {
    content: "";
    width: 0;
    height: 0;
    border: .5em solid transparent;
    border-top-color: #ffffff;
    float: right;
    margin-top: .75em;
  }
}



.tabs__list {
  margin: 0;
  margin-bottom: -1px;
}

.tabs__item {
  margin-bottom: 0;
  display: inline-block;
  width: auto;
  vertical-align: top;
  text-transform: uppercase;
  text-align: center;
}

.tabs__item--active > .tabs__link {
  background: #FFF;
  color: #111;
  border-bottom: 0;
  position: relative;
  z-index: 3;
  text-align: center;
}

.tabs__item--active > .tabs__link:hover {
  text-decoration: none;
  cursor: auto;
}

.tabs__link {
  font-size: 13px;
  font-weight: 500;
  color: #333333;
  padding: .5em 2em;
  line-height: 2.02;
  display: block;
  text-decoration: none;
  border: 1px solid #e6e6e6;
}
.tabs__link:hover {
  text-decoration: none;
}

.tabs__area {
  opacity: 0;
  display:none;
  -webkit-transition: opacity .5s linear;
  transition: opacity .5s linear;
  height: 0;
}

.tabs__area--active {
  opacity: 1;
  Display:block;
  -webkit-transition: opacity .5s linear;
  transition: opacity .5s linear;
  height: auto;
}

.tabs__content {
  margin-bottom: 0;
  border: 1px solid #dadacb;
  overflow: hidden;
  position: relative;
  top: 0px;
  clear: both;
  padding: 2.2rem;
}

.tabs__freight {
  background-color: #fbfbfb; padding:20px;
}

.tabs__get-rate-button {
  font-size: 12px;
	font-weight: 100;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	display: inline-block;
	padding: 0px 50px;
  line-height: 2em;
  height:3em;
	position: relative;
  color: #fff;
	background-color: #222 !important;
  cursor: pointer;
  border: 0px solid #fff;
}

.tabs__get-rate-button:hover{
	color: #222;
  background-color: #bbb !important;
  transition: all .2s ease-in-out;
  border: 0px solid #fff;
}

.tabs__image-download-button {
  font-size: 14px;
	text-align: center;
	text-transform: uppercase;
	color: #FFF;
	display: inline-block;
	padding: 10px 30px;
	background-color: #404040;
  border-radius: 50px;
  xwidth:60%;
  align-items: center;
}
.tabs__image-download-button:hover{
	color: #000;
  background-color: #CCC;
  border-color: #FFF;
  transition: all .2s ease-in-out;
  border-radius: 5px;
  margin-left:10px;
}
@media only screen and (min-width: 768px) {
  .tabs__image-download-button {
    width:100%;
    font-size: 14px;
  	font-weight: 100;
  	text-decoration: none;
  	text-align: center;
  	text-transform: uppercase;
  	color: #FFF;
  	display: inline-block;
  	padding: 10px 30px;
  	position: relative;
  	background-color: #404040;
    border-radius: 5px;
    position:relative;
    display: flex;
    align-items: center;
  }
}

/* END PRODUCT PAGE TABS */







/* OPTIONAL BRANDING /// BRANDING OPTION POP UP ICON
---------------------------------------------------------------*/
.optional-branding-wrapper {
	position: relative;
	margin:20px 0;
}
.optional-branding-title h2{
	font-size: 16px;
	font-weight: 700;
	color: #666;
	letter-spacing: 2px;
	line-height: normal;
	margin-top:30px;
	margin-bottom:5px;
	text-transform: uppercase;
	display: flex;
}
.optional-branding-title h2::after {
  content: '';
  width: 200px;
  height: 1px;
	background: rgb(102,102,102);
	background: linear-gradient(80deg, rgba(102,102,102,1) 0%, rgba(255,255,255,1) 100%);
  margin: 0 10px;
	position: relative;
	top:7px;
}
.optional-branding-list ul {
  padding: 0;
  margin: 0;
  list-style: none;
  width: 100%;
  max-width:80%;
}
.optional-branding-list ul ul li {
  font-size: 15px;
  font-weight: normal;
  line-height: normal;
  letter-spacing: normal;
  position: relative;
  margin-bottom:5px;
	margin-left:15px;
  padding-left: 20px;
}
.optional-branding-list ul ul li:before {
  content: "";
  width: 7px;
  height: 7px;
  background-color: #777;
  position: absolute;
  left: 0px;
  top: 7px;
  border-radius: 50%;
}
.optional-branding-list-101{
	position: relative;
	margin-top: 30px;
}

.optional-branding-list-101 ul li:nth-child(1) {
  font-weight: 700;
  margin-bottom:10px;
}
.optional-branding-list-101 ul li:nth-child(n+2) {
	font-size: 15px;
  color: #333;
	margin-left:15px;
	border-left:2px solid #ddd;
	padding-left: 10px;
}
.optional-branding-list-101.margin-indented{
	margin-left: 20px;
}
.optional-branding-list-101 h4{
  font-weight: 400;
  font-size: 1.2rem;
}







/* START BRANDING OPTION TABS
---------------------------------------------------------------*/
.container_CSS_TAB2 {
  width: 100%;
  margin: auto;
}
.list-unstyled2 {
  list-style: none;
}
.tabs__list2 {
  margin: 0;
  margin-bottom: -1px;
}

.tabs__item2 {
  margin-bottom: 0;
  display: inline-block;
  width: auto;
  vertical-align: top;
  text-transform: uppercase;
  text-align: center;
}

.tabs__item--active2 > .tabs__link2 {
  border: 1px solid #1a1a1a;
  background: #1a1a1a;
  border-bottom: 0;
  position: relative;
  z-index: 3;
  color: #fff;
  text-align: center;
  Xmargin-bottom:4px;
  margin: 2px;
  border-radius: 4px;
  padding: 0 10px;
}

.tabs__item--active2 > .tabs__link2:hover {
  color: #FFF;
  text-decoration: none;
}

.tabs__link2 {
  font-weight: 500;
  color: #333333;
  line-height: 2;
  display: block;
  text-decoration: none;
  border: 1px solid #e6e6e6;
  background: #e6e6e6;
  margin: 2px;
  border-radius: 4px;
  padding: 0 10px;
}
.tabs__link2:hover {
  text-decoration: none;
  color: #333333;
  background: #FFCC00;
  border: 1px solid #e6e6e6;
}

.tabs__area2 {
  opacity: 0;
  display:none;
  -webkit-transition: opacity .5s linear;
  transition: opacity .5s linear;
  height: 0;
}

.tabs__area--active2 {
  opacity: 1;
  Display:block;
  -webkit-transition: opacity .5s linear;
  transition: opacity .5s linear;
  height: auto;
}

.tabs__content2 {
  margin-bottom: 0;
  background: #fff;
  border: 0px solid #dadacb;
  overflow: hidden;
  position: relative;
  clear: both;
  padding: 2.2rem;
}

@media only screen and (min-width: 768px) {
  .tabs--optional-branding2 {
    border: 0px solid #d4d4d4 !important;
  }
}
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
  .tabs--optional-branding2 {
    border: 0px solid #d4d4d4 !important;
  }
}

@media (max-width: 1224px) {
  .tabs--optional-branding2 {
    border: 1px solid #d4d4d4;
  }
  .tabs--optional-branding2 .tabs__content2 {
    border-width: 0;
    border-top-width: 1px;
  }
  .tabs--optional-branding2 .tabs__list2 {
    background-color: white;
    margin: 0;
    margin-bottom: -1px;
    display: inline-block;
    width: 100%;
  }
  .tabs--optional-branding2 .tabs__list2 .tabs__item2 {
    overflow: hidden;
    position: absolute;
    height: 0;
  }
  .tabs--optional-branding2 .tabs__list2 .tabs__item--active2 {
    height: auto;
    position: relative;
  }
  .tabs--optional-branding2 .tabs__list--open2 .tabs__item2 {
    position: relative;
    height: auto;
  }
  .tabs--optional-branding2 .tabs__list--open2 .tabs__item--active2 > .tabs__link2:after {
    content: none;
  }
  .tabs--optional-branding2 .tabs__item2 {
    width: 100%;
    max-width: 100%;
    border-right: 0;
    text-align: left;
  }
  .tabs--optional-branding2 .tabs__item--active2 > .tabs__link2 {
    background-color: #333333;
    color: white;
    border: 0;
  }
  .tabs--optional-branding2 .tabs__item--active2 > .tabs__link2:hover {
    color: white;
  }
  .tabs--optional-branding2 .tabs__item--active2 > .tabs__link2:after {
    content: "";
    width: 0;
    height: 0;
    border: .5em solid transparent;
    border-top-color: #ffffff;
    float: right;
    margin-top: .75em;
  }
}
/* END BRANDING OPTION TABS
---------------------------------------------------------------*/






.color-options-dw400-wrapper {
  margin-top: 25px;
  margin-bottom: 50px;
}
.color-options-dw400-card {
  background-color: #ffffff;
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0,0,0,.125);
  border-radius: 0.25rem;
  padding:20px 30px;
}