/* Custom CSS theme */
/*****HIDE TRANSIT TIME AT DELIVERY SELECTION STEP IN CHECKOUT******
div.ec-cart-step--delivery div.ec-radiogroup__item-wrap>div>div.ec-radiogroup__container>div.ec-radiogroup__text.ec-text-muted>div:nth-child(1) {
    visibility: hidden;
}
div.ec-cart-step--delivery div.ec-radiogroup__item-wrap>div>div.ec-radiogroup__container>div.ec-radiogroup__text.ec-text-muted>div:nth-child(1):before {
    content: 'Manufacturing/fulfillment time depends on order items and qty' !important;
    visibility: visible;
}*/
/*******AFTER CONTENT FOR SMS TEXT MESSEAGE CONSENT BUTTON CHECKOUT*******/
[for="form-control__checkbox-accept-marketing"]:after {
  content: "Message frequency varies. Message and data rates may apply. Reply STOP to opt out or HELP for assistance. SMS consent is optional and is not required to purchase. See our SMS/Text Messaging Terms and Conditions.";
  display: block;
  font-size: 11px;
  line-height: 1.4;
}

/****** GUTTER SCREEN FREE SAMPLE LEAD TIME AND LENGTH UPDATE *******/
/****Gutter Cover Sample****/
div.ec-store__product-page--838836572 div.product-details__product-sku:after {
  content: " Current lead time: ~1 week" !important;
}

div.ec-store__product-page--838836572 [class="details-product-price__value ec-price-item notranslate"]:after {
  content: "Per 1' Length";
}

/****Under Roof Gutter Screen Sample****/
div.ec-store__product-page--839044612 div.product-details__product-sku:after {
  content: " Current lead time: ~1 week" !important;
}

div.ec-store__product-page--839044612 [class="details-product-price__value ec-price-item notranslate"]:after {
  content: "Per 1' Length";
}

/****Under Roof Gutter Screen Sample****/
div.ec-store__product-page--839044528 div.product-details__product-sku:after {
  content: " Current lead time: ~1 week" !important;
}

div.ec-store__product-page--839044528 [class="details-product-price__value ec-price-item notranslate"]:after {
  content: "Per 1' Length";
}

/**********END***********/
span.ec-lightspeed-branding {
  display: none !important;
}

/*html#ecwid_html body#ecwid_body .ec-size.ec-size--l .ec-store .product-details-module__content .form-control--checkbox-button {
    min-width: 81px;
}*/
/* this is the code for widening the buttons to have all the same size when there are options like 20' - added per category on wordpress*/
/***Test Photo Gallery & Lightbox***/
/***Show Images as same size grid***/
/*
.gallery {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr))!important;
    gap: 10px !important;
    padding: 10px !important;
}

.gallery img {
    width: 100% !important;
    height: auto !important;
    border-radius: 5px !important;
    transition: transform 0.3s ease !important;
}
*/
/****END****/
/***Show Images as Flex***/
.gallery {
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px;
}

.gallery img {
  width: 100% !important;
  max-height: 122px !important;
  border-radius: 5px !important;
  transition: transform 0.3s ease !important;
}

/*****END****/
.gallery img:hover {
  transform: scale(1.05) !important;
}

.lightbox {
  display: none !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: rgba(0, 0, 0, 0.8) !important;
  justify-content: center !important;
  align-items: center !important;
  z-index: 999999 !important;
}

.lightbox:target {
  display: flex !important;
}

.lightbox-content {
  position: relative !important;
  max-width: 50%;
  max-height: 80%;
  background: #fff !important;
  padding: 20px !important;
  border-radius: 10px !important;
  text-align: center !important;
}

.lightbox-content img {
  max-width: 100% !important;
  max-height: 650px !important;
  border-radius: 5px !important;
}

.close {
  position: absolute !important;
  top: -22px !important;
  right: -55px !important;
  color: white !important;
  font-size: 56px !important;
  text-decoration: none !important;
}

.close:hover {
  color: red !important;
}

.next, .prev {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(0%) !important;
  color: white !important;
  font-size: 60px !important;
  text-decoration: none !important;
  margin: -69px !important;
}

.next:hover, .prev:hover {
  color: #cdd1d3 !important;
}

.next {
  right: 10px !important;
}

.prev {
  left: 10px !important;
}

/* Hide the next arrow on the last image */
#img12 .next {
  display: none;
}

/* Hide the previous arrow on the first image */
#img1 .prev {
  display: none;
}

.thumbnails {
  display: flex !important;
  justify-content: center !important;
  margin-top: 10px !important;
}

.thumbnails img {
  width: 50px !important;
  height: 50px !important;
  margin: 0 5px !important;
  border-radius: 5px !important;
  cursor: pointer !important;
}

.active-icon {
  outline: solid 2px red !important;
  border-radius: 10px;
  outline-offset: -5px;
}

.lightbox:target .lightbox-content {
  max-width: 50%;
  max-height: 100%;
}

/****Light Box Cell Phones****/
@media (max-width: 720px) {
  .lightbox:target .lightbox-content {
    max-width: 94%;
    max-height: 100%;
    margin-right: 2%;
  }
  .close {
    position: absolute !important;
    top: -12px !important;
    right: 3px !important;
    color: red !important;
    font-size: 30px !important;
    text-decoration: none !important;
  }
  .close:hover {
    color: red !important;
  }
  .next, .prev {
    top: inherit !important;
    transform: translateY(0%) !important;
    font-size: 30px !important;
    margin: 5px !important;
    bottom: 65%;
    color: white !important;
    background-color: #33333361 !important;
    padding: 5px !important;
  }
  .lightbox-content {
    padding: 14px !important;
    margin-top: -60px !important;
  }
  .lightbox-content img {
    max-height: 310px !important;
  }
  .thumbnails {
    display: flex !important;
    flex-wrap: wrap;
  }
  .thumbnails img {
    margin: 5px 5px !important;
  }
}

/*****Photo Flex Cell Phone******/
@media (max-width: 720px) {
  .gallery {
    display: inline-flex !important;
    gap: 10px !important;
    padding: 5px !important;
    flex-wrap: wrap;
    justify-content: center;
  }
  .gallery img {
    max-width: 100% !important;
    width: auto !important;
    border-radius: 5px !important;
    max-height: 60px !important;
  }
}

/***Cupola Category Page Description***
.ec-store__category-page--49577183 .ec-grid {
    display: flex !important;
    flex-direction: column !important;
}
.ec-store__category-page--49577183 div.grid__wrap {
    order: 1 !important;
}
.ec-store__category-page--49577183 div.grid__description {
    order: 2 !important;
}
html#ecwid_html body#ecwid_body .ec-size .ec-store p {
    margin-bottom: 20px !important;
}*/
/*** Brian hidden material type ecwid option for tags hidden ***/
div.product-details-module.details-product-option.details-product-option--select.details-product-option--Material-Type,
div.product-details-module.details-product-option.details-product-option--checkbox.details-product-option--Material-Type {
  display: none !important;
}

/*** Brian hidden material type ecwid option for tags hidden
2024.11.07 - disabled the 2 last lines with [], which were breaking this and displaying the checkbox on opera - Gui
 ***/
/**************Hide Leadtime Attribute from product page***************/
.details-product-attribute:nth-child(2) .details-product-attribute__title,
.details-product-attribute:nth-child(2) .details-product-attribute__value {
  display: none;
}

html#ecwid_html body#ecwid_body .ec-size.ec-size--l .ec-store .details-product-attribute {
  display: none;
}

/********************Share Cart Button*****************************/
#InApp_cart_share_btn button.InApp_cart-share-primary--icon svg {
  width: 40px;
  height: 40px;
}

#InApp_cart_share_btn {
  bottom: 2.3rem !important;
}

#InApp_cart_share_btn .InApp_cart-share-primary svg {
  fill: #ffffff !important;
  transform: scaleX(-1);
}

.InApp_cart_share .InApp_cart-share-popup-content-cart input {
  color: blue;
}

/************Removes White Border on Secondary Product Image*****************/
html#ecwid_html body#ecwid_body .ec-size .ec-store .grid-product__picture-additional {
  background-color: #efefef !important;
}

/*************Remove White Background on Product Gallery Items*****************/
html#ecwid_html body#ecwid_body .ecwid-pswp .pswp__item {
  background-color: #efefef;
}

/*** Credit Card Lock Icon & Card Background ***/
div.ec-creditcard__logo.ec-creditcard__logo--unknown.ec-creditcard__logo--empty {
  background-color: lightgreen !important;
}

html#ecwid_html body#ecwid_body .ec-size.ec-size--m .ec-store .ec-creditcard {
  background-color: whitesmoke;
}

/* FACEBOOK ecwid colors and materials */
div.ecwid_facebook_app div.ecwid div.fusion-fullwidth.fullwidth-box.km-colors-and-downloads-content-boxes {
  background-color: #efefef;
  background-position: center;
  padding-top: 0px;
  padding-right: 30px;
  padding-left: 30px;
  padding-bottom: 0px;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes div.tab-pane {
  border-left: 1px solid #e2e2e2 !important;
  border-right: 1px solid #e2e2e2 !important;
  border-bottom: 1px solid #e2e2e2 !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes h4 {
  font-weight: 300 !important;
  font-size: 24px !important;
  padding-top: 10px !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes p.km-most-popular {
  text-align: left;
  clear: left;
  font-weight: 300;
  line-height: 1.7 !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes p.km-other-colors {
  text-align: left;
  clear: left;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes div.fusion-column-wrapper li.active {
  padding-top: 15px !important;
  padding-bottom: 10px !important;
  border-top: 3px solid red !important;
  background-color: #ffffff !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes div.fusion-column-wrapper li.active:hover {
  border-top: 3px solid red !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes div.fusion-column-wrapper li {
  padding-top: 15px !important;
  padding-bottom: 10px !important;
  border-top: 3px solid #f1f2f2 !important;
  background-color: #f1f2f2 !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes div.fusion-column-wrapper li:hover {
  background-color: #ffffff !important;
  border-top: #ffffff !important;
  transition: all 0.2s !important;
  transition-property: all !important;
  transition-duration: 0.2s !important;
  transition-timing-function: ease !important;
  transition-delay: 0s !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes ul.nav-tabs.nav-justified {
  padding-left: 0px !important;
  margin-bottom: 0px !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes h4 i {
  padding-right: 10px !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes h5 {
  padding-top: 35px !important;
  margin-bottom: 28px !important;
  margin-left: 0px !important;
  font-weight: 400 !important;
  font-size: 22px !important;
  line-height: 1.7 !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes div.tab-pane {
  padding: 15px !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes a {
  color: #991707 !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes a:hover {
  color: #ee1d23 !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes p {
  font-size: 19px !important;
  line-height: 1.7;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes {
  padding-left: 0px !important;
  padding-right: 0px !important;
  padding-top: 0px !important;
}

div.ecwid_facebook_app div.ecwid div.km-colors-and-downloads-content-boxes p#km-downloads-tab {
  padding-bottom: 20px !important;
  padding-top: 15px !important;
}

div.ecwid_facebook_app div.wp-caption {
  text-align: center !important;
  font-size: 18px !important;
  color: #747474 !important;
  display: inline-block !important;
  font-weight: 300 !important;
}

div.ecwid_facebook_app div.wp-caption.alignleft {
  min-height: 210px !important;
}

/* FACEBOOK end ecwid colors and materials */
/* FACEBOOK details */
div.ecwid_facebook_app details.km-ecwid-details {
  background-color: white !important;
  /*max-width:1300px!important;*/
  padding: 20px 20px 20px 30px !important;
  border: 1px solid #cccccc !important;
  font-size: 22px !important;
  margin-bottom: 5px !important;
}

div.ecwid_facebook_app details.km-ecwid-details:hover {
  background-color: #fdfdfd !important;
}

div.ecwid_facebook_app details.km-ecwid-details summary {
  cursor: pointer !important;
  /*list-style:none!important;*/
}

/*div.ecwid_facebook_app details.km-ecwid-details summary::-webkit-details-marker {
  display: none;
}*/
div.ecwid_facebook_app details.km-ecwid-details[open] summary {
  padding-bottom: 30px !important;
}

div.ecwid_facebook_app details.km-ecwid-details[open] {
  padding-bottom: 20px !important;
}

/*div.ecwid_facebook_app details.km-ecwid-details span.km-ecwid-details-icon,
div.ecwid_facebook_app details.km-ecwid-details span.km-ecwid-color-and-materials-icon,
div.ecwid_facebook_app details.km-ecwid-details span.km-ecwid-submittals-icon {
	/*position:abs!important;*/
/*left:0!important;
	float:left!important;*/
/*color:#fff!important;*/
/*margin-right:150px!important;
	margin-left:150px!important;*/
/*display:inline-block!important;*/
/*}*/
/*div.ecwid_facebook_app details.km-ecwid-details span.km-ecwid-details-icon::before,
div.ecwid_facebook_app details.km-ecwid-details span.km-ecwid-color-and-materials-icon::before,
div.ecwid_facebook_app details.km-ecwid-details span.km-ecwid-submittals-icon::before {
	content:"\e61d";
	font-family:IcoMoon;
	font-size:26px;
	background-color:#ce0000;
}
div.ecwid_facebook_app details.km-ecwid-details span.km-ecwid-details-icon::after,
div.ecwid_facebook_app details.km-ecwid-details span.km-ecwid-color-and-materials-icon::after,
div.ecwid_facebook_app details.km-ecwid-details span.km-ecwid-submittals-icon::after {
	content:"\e61d";
	font-family:IcoMoon;
	font-size:22px;
	visibility:hidden!important;
}
div.ecwid_facebook_app details.km-ecwid-details[open] span.km-ecwid-details-icon::before,
div.ecwid_facebook_app details.km-ecwid-details[open] span.km-ecwid-color-and-materials-icon::before,
div.ecwid_facebook_app details.km-ecwid-details[open] span.km-ecwid-submittals-icon::before {
	content:"\e61c";
	font-family:IcoMoon;
	font-size:26px;
	background-color:#ce0000;
}*/
/* FACEBOOK end details */