/********* All CUSTOM STYLES BELOW HERE *************/
/* Fixes fancybox console error on mobile */
.fancybox-container,
.fancybox-image,
.fancybox-spaceball {
  touch-action: manipulation;
}
.product-image-slider.slick-initialized {
  visibility: visible;
  opacity: 1;
}
.product-image-slider {
  opacity: 0;
  visibility: hidden;
  transition: opacity 1s ease;
  -webkit-transition: opacity 1s ease;
}
/**Added homepage text**/
.home-text-row {
  margin-top: 30px;
  display: flex;
  align-items: center;
}
#homepage-content {
  font-size: 18px;
}
@media only screen and (max-width: 992px) {
  .home-text-row {
    display: block;
  }
  #homepage-content {
    font-size: 16px;
    margin-top: 15px;
  }
}
/**Blog Page Edits ***/
.content-type-content-wrapper .single-review {
  margin-top: 45px;
  margin-left: 0;
  margin-right: 0;
  padding: 40px 60px 25px;
}
@media only screen and (max-width: 767px) {
  .content-type-content-wrapper .single-review {
    margin-top: 30px;
    padding: 20px 20px 15px;
  }
}
/*** Fixed very tall images ***/
.main-image .slick-slide {
  max-height: 500px;
}
.main-image .slick-slide img {
  max-height: 500px;
  width: auto;
  margin: 0 auto;
  max-width: 100%;
}
/*****Fix kitted products thumnails *****/
.wrapper-components-thumbnail {
  padding-bottom: 30px;
}
/***Fix alt images overflowing on hover **/
@media (min-width: 992px) {
  .thumbnail .product-image {
    object-fit: contain;
    width: 360px;
    height: 360px;
  }
}
/********Fix specifics*********/
.listopt-wrapper._itmspec_listopt {
  margin-top: 0px;
  display: flex;
}
.listopt-wrapper._itmspec_listopt ._itmspec_selected {
  font-weight: 600;
}
.listopt-wrapper._itmspec_listopt .specific {
  padding-top: 0px;
  padding-bottom: 0px;
}
.product-wishlist {
  margin-bottom: 20px;
}
.w-600 {
  font-weight: 600;
}
.row.btn-stack {
  margin-top: 15px;
}
/*******Fix adverts***********/
.carousel-inner-wrapper > .carousel-inner {
  margin-bottom: 45px;
}
.carousel-caption h2 {
  color: #ffffff;
}
.shipbox-cart {
  margin-bottom: 30px;
}
/****Fix afterpay****/
.wrapper-thumbnail {
  margin-bottom: 20px; /* was 140px */
}
.product-name { /*product name might no longer be available as I've replaced the old thumbnail template design with the NW one - BF*/
  margin-bottom: 20px;
  position: relative;
  height: 80px; /*lh not fully supported yet, px backup*/
  height: 3lh;
  overflow: hidden;
  line-height: initial;
  font-size: medium;
  font-weight: 600;
  color: rgba(4, 105, 171, 1);
}
.buying-options-wrapper {
  align-self: unset;
}
.modal-dialog {
  margin-top: 15% !important;
}
#left-sidebar .dropdown-menu-horizontal {
  top: 0;
  left: 100%;
}
#left-sidebar .dropdown {
  position: relative;
}

/*Product Page Zoomed Image Fix*/
.zoomImg {
     background-color: white;
}

/*Fix to prevent horizontal scrolling of the whole webpage on safari - BF*/

html, body {
  overflow-x: hidden;
  width: 100%;
}
.fancybox-slide--iframe .fancybox-content {
    width  : 700px;
    height : 440px;
    max-width  : 90%;
    max-height : 90%;
    margin: 0;
}
.fancybox-slide--iframe .fancybox-content {
    width  : 700px;
    height : 440px;
    max-width  : 90%;
    max-height : 90%;
    margin: 0;
}
.round-corner {
    border-radius: 10px;
}
/*Filter Colour Swatches*/
.filter-colour {
    display: inline-block;
    padding: 10px 1px 0 8px;
}
.list-group > li + .filter.filter-colour > a:before {
    content: '';
}
.list-group > li + .filter.filter-colour > a {
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    box-shadow: 1px 1px 2px #D6D6D6;
    border: rgb(221, 221, 221) solid 1px;
}
.filter-remove > a {
    border: 2px solid #AFAFAF;
}
.panel > .panel-heading {
    background-image: none;
    background-color: rgba(4, 105, 171, 1);
    color: white;
    border-radius: 0;
}
/*Change the style of the file upload boxes to drag and drop-ish - BF*/
input[type="file"] {
	position: relative;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
	width: 100%;
    padding: 30px;
	outline: none!important;
    text-align: center;
    transition: background 0.3s ease-in-out;
	transition: border-color 0.6s ease-in-out;
    border: 1px solid #ccc;
	}
input[type="file"]:hover {
	background: rgba(255,255,255,0.06);
}

.btn-primary {
    background-color: red;
    border: none;
    
}

.form-inline.buying-options {
    display:flex;
    justify-items: center;
    align-items: center;
    flex-direction: column;
}
/*Installation Included Badge - BF*/
.savings-container {
    width: 100%;
    top: auto;
    bottom: 0;
    z-index: 1;
}
.installation-badge {
    display: flex;
    align-items: center;
    border-radius: 0px;
    white-space: normal;
    font-size: 14px;
    font-weight: 500;
    background-color: rgba(20, 92, 172, 1);
    margin: 0 -1px;
    padding: 6px;
}
.thumbnail-image {
    overflow: visible;
}
.thumbnail .btn {
    font-size: 14pt;
    font-weight: 600;
}
.btn {
    outline: none!important;
}
.thumbnail {
    transition: box-shadow 0.2s ease-out;
    box-shadow: 0px 0px 2px transparent;
    border: 1px solid #ccc;
    background-color: #fcfcfc;
    padding: 0px;

}
.thumbnail:hover {

    box-shadow: 1px 2px 4px #aaa;
    border: 1px solid transparent;
}
.thumbnail .caption {
    padding: 15px 10px;
    border-top: 1px solid #eee;
    overflow: hidden;
}
.thumbnail .caption h3 {
    font-size: 16px;
    font-weight: 600;
    text-align: left;
    min-height: 60px;
    max-height: 60px;
    margin-bottom: 3rem;;
    min-height: 3lh;
    max-height: 3lh;
    /*margin-bottom:2lh;*/
    overflow: hidden;
    color: rgba(4, 105, 171, 1)!important;
}
.thumbnail .caption h3 a {
    color: rgba(4, 105, 171, 1);
}
.thumbnail .product-image {
    background-color: #fff;
    object-fit: contain;
    aspect-ratio: 1 / 1.15;
    border-radius: 6px;
}
.thumbnail > .caption > .price {
    font-size: 16pt;
}
.thumbnail .btn {
    margin: 20px 0;
}
.thumbnail:hover .kw-badge-container {
    border-top: 46px solid rgba(4, 105, 171, 1);
}
.thumbnail:hover .installation-badge {
    margin-top: 2px;
    padding: 6px;
}
.wrapper-thumbnail {
    padding: 4px 8px!important;
}
.price a:visited {
    text-decoration: none;
}
.price a:focus {
    text-decoration: none;
}
.from {
    display: block;
    height: 21px;
}

/*Capacity badge on top of the product thumbs, we're using the triangle div trick to make it look like a ribbon (see the border-radius) - BF*/
.kw-badge-container {
    top: 0;
    margin-top: -4px;
    left: 20px;
    position: absolute;
    z-index: 1;
    width: 50px;
    height: 50px;
    border-left: 31px solid rgba(4, 105, 171, 1);
    border-right: 31px solid rgba(4, 105, 171, 1);
    border-bottom: 15px solid transparent;
    border-top: 37px solid rgba(4, 105, 171, 1);
    transition: border-top 0.6s;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
.kw-badge {
    position: absolute;
    background-color: transparent;
    font-weight: 600;
    font-size: 14pt;
    z-index: 2;
}
.kw-badge::after {
    content: "kW";
    font-size: 8pt;
}
/*Repositioned the Sales Badge Temporarily to the right, it also looks -mid- here, you might want to move it - play around with it below - BF*/
.sale {
    right: 10px;
    left: auto;
}

@media (max-width: 1199px) {
    .caption > .form-inline.buying-options {
        margin: 0 -10px;
    }
}
/*Added the +gst text to products that are without gst on the fron end - this is enabled / disabled with the includes gst toggle on the product page - BF*/
.price-gst {
    display:block;
}
.price-gst::after {
	content:"+gst";
	font-size: 8pt;
	vertical-align: super;
	margin-right: -23px;
}
/*ducted product specifics selectors*/
._itmspec_listopt {
    padding-top: 15px;
}
._itmspec_listopt .specific {
  display: flex;
  flex-wrap: wrap;
  margin: -10px;
}
._itmspec_selected {
    padding: 0;
}
._itmspec_listitm {
  font-weight: bold;
  color: rgba(4, 105, 171, 1);
  background: #fcfcfc;
  border: 1px solid #eee;
  border-radius: 3px;
  margin: 10px;
  text-align: center;
  width: 100%;
  box-shadow: 0px 0px 2px transparent;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
._itmspec_listitm:has(._itmspec_selected) {
  box-shadow: none!important;
  border-color: rgb(20, 92, 172)!important;
  background-color: white!important;
}

@media (min-width: 425px) {
  ._itmspec_listitm {
    width: calc(33.333% - 20px);
  }
}

._itmspec_listitm:hover {
  box-shadow: 1px 2px 4px #aaa;
  border-color: rgb(20, 92, 172);
}

/* Inside anchor */
._itmspec_lnk {
  display: block;
  color: inherit;
  text-decoration: none!important;
  padding-bottom: 10px;
}

._itmspec_lnk img {
  max-width: 100%;
  height: auto;
  margin-bottom: 8px;
}
.ducted-archive-badge {
    display: inline-flex;
    flex-direction: row;
    justify-content: flex-start;
    padding: 0px 6px;
    border: 1px #aaa solid;
    border-radius: 10px;
    width: fit-content;
    background-color: #fff;
    text-align: left;
    margin-top: -24px;
}
.ducted-archive-badge-wrapper {
    position: absolute;
    margin-top: -25px;
    justify-self: anchor-center;
}

.list-group ul, #side-filtervar-1 ul:not(:has(li:nth-child(7))) {
  column-count: 1;
}

.list-group ul, #side-filtervar-1 ul:has(li:nth-child(7)) {
  column-count: 2;
  column-gap: 1rem;
}

.list-group ul:has(.filter-colour) {
  column-count:1;
  column-gap: 1rem;
}

.price.price-gst, .text-muted.from {
    text-align: center;
}

.form-inline.buying-options .btn-primary {
    width: 50%;
    padding: 3px;   
}
@media (max-width: 540px) {
.form-inline.buying-options .btn-primary {
    width: 80%;
    padding: 3px;   
}
}
/*Make Product Carousel Arrows more visible*/
.slick-arrow {
    mix-blend-mode: difference;
    bottom: 45%!important;
}
.slick-arrow.slick-next {
    right: 20px!important;
}
.slick-arrow.slick-prev {
    left: 20px!important;
}
.slick-prev:before, .slick-next:before {
    font-size: 35px;
}
[aria-label="Control System variation selection"] {
    padding-top: 0px;
}
.variation-name {
    font-size: 24px;
}