/***************************BOILING WATER TAPS PAGE***************************/
.header.BWT{background-color: rgba(0, 0, 0, 0.2);}
H1, h2{text-transform: capitalize; color: #fff;font-family: 'Roboto Serif', }
.page.category-page.bwt .page-hero{margin-top: -41px; position: absolute; top: 0; height: 600px;width: 100%;}
.master-column-wrapper {margin: 0;}
.link {color: #ff6600;}
.link:hover {text-decoration: underline;cursor: pointer;}

/* HERO */
div#hero {
    width: 100%;
    height: 400px;
    margin-top: -41px;
    display: flex;
    flex-direction: column;
    position: relative;
}

.bwt div#hero {height: 600px;}

video#vid {
    width: 100%;
    min-height: 100%;
    object-fit: cover;
    display: flex;
    align-self: end;
}

video#vid.mob-vid {display: none;}


.overlay {
    position: absolute;
    justify-content: flex-start;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: 500px;
    padding: 30px;
    background: rgba(0,0,0,0.1);
    left: 50px;
}

.overlay {
    background: rgba(0,0,0,0.10);
    display: flex;
}

/* SPRAY CHANGES */
.bwt #hero .overlay {
    background: none;
    max-width: 450px;
}



.overlay h1 {font-size: 38px;}

.overlay {max-width: 500px;}
.overlay a {
    border: none;
    padding: 8px 40px;
    display: inline-block;
    background-color: #000;
    opacity: 0.5;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 2px;
    color: #fff;
}

.overlay p {font-weight: 400;color: #fff;}

.overlay svg.svg-inline--fa.fa-arrow-right {margin-left: 10px;}


@media all and (max-width: 826px) {
    video#vid.mob-vid  {display: unset; align-self: center;}
    video#vid.desktop-vid, img.desktop  {display: none;}
    div#hero {align-content: center;margin-bottom: 240px}
    .overlay {
        max-width: unset; 
        left: unset; 
        height: 270px; 
        top:0px;
        display: flex;
        justify-content: center; 
        align-items: center;
        text-align: center; 
        padding:0;
    }
    .overlay p {margin: 5px 0;}
    .overlay a {margin-top: 10px}

    /* Black Friday changes */
    div#hero {height: auto;}
    div#hero video.fullsize {display: none;}
    div#hero video.mobilesize {display: flex;}
    div#hero {margin-bottom: revert;}
    /*B F ENDS */

}

/* navigation */
#nav-frame,#nav {height: 50px;line-height: 50px;}
#nav {
    background: #636F7B;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
#nav a {
    text-transform: uppercase;
    color: #fff;
    margin: 0 6px;
    padding: 0 15px;
    height: 100%;
    font-size: 17px;
    font-weight: 100;
}
#nav a:hover { color: #ddd;}
#nav.scroll { position: fixed;top: 0;left: 0;right: 0;z-index: 100;}
@media all and (max-width: 850px) {#nav a {font-size: 14px;padding: 0 10px;}}
@media all and (max-width: 700px) {
    #nav a {font-size: 12px;padding: 0;}#nav-frame,#nav {height: 40px; line-height: 40px;}
    div#hero img.desktop {display: none;}
}
@media all and (max-width: 480px) {#nav-frame {display: none;}}
/***********************************/
#products.section{margin: 20px auto 30px;}
/***********************************/
/****** BWT - FIND YOUR TAP ********/
/***********************************/
#find-qettle {margin-bottom: 0px;}
#find-qettle .inner-width {min-height:500px;padding: 100px 0px 150px 0px;max-width: unset;width: 100%;
  background: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.2) ), url(../images/BWT/find-tap.jpg); 
  /*background: url(../images/BWT/SignatureModern-Brass-Chilled3.jpg); */
  background-position: center;background-repeat: no-repeat;
  background-size: cover;}
#find-qettle .content .title {
  color: #fff;
  font-size: 24px;
  font-weight: 100;
  text-transform: none;
  line-height: normal;
  font-family: 'Roboto';
}
#find-qettle .content a{
  color: #666;
  background: #fff;
  padding: 8px 18px;
  font-size: 14px;
  font-weight: 600;
  font-family: sans-serif;
  letter-spacing: 1px;
}
#find-qettle .content p, #find-qettle .content span{color: #fff;}
#find-qettle .content{max-width: 475px;color: #fff;padding: 30px;margin-left: 88px;font-size: 14px;background: rgba(0,0,0,0.2)}
@media all and (max-width: 1000px) {#find-qettle .content{max-width: 405px;margin-top: 16%;} }
@media all and (max-width: 900px) {#find-qettle .content{max-width: 360px;margin-top: 13%;} }
@media all and (max-width: 480px) { #find-qettle {min-height: 490px;}  #find-qettle .content {margin: 13% auto;}}
@media all and (max-width: 680px) {#find-qettle .content{text-align: center; margin: 0 auto; max-width: 80%;}}
/***********************************/
/*********** BWT - SPEC ************/
/***********************************/
#bwt-specifications video {width: 100%;}
#bwt-specifications {background-color: #636F7B;padding: 80px 0px}
#bwt-specifications .inner-width .spec .text {width: 40%;padding: 50px;}
#bwt-specifications .inner-width .spec .text p{color: #fff;}
#bwt-specifications .inner-width .spec .text p.title{font-size: 18px;}
#bwt-specifications .inner-width .spec {margin: 50px 0px;display: flex; justify-content: center; align-items: center;}
#bwt-specifications .inner-width .spec .img {display: flex; justify-content: center;max-width: 40%;position: relative;}
#bwt-specifications .inner-width .spec img {max-width: 100%;margin: 0 auto;}
#bwt-specifications .inner-width  .lightbox {display: inline-block;position: absolute;z-index: 10; width: 178px; height: 100px;top: calc(90% - 16px); left: calc(20% - 70px);}
#bwt-specifications button.WatchQETTLEvideo {background: #fff; border: unset; padding: 8px 18px; color: #636F7B; display: flex; align-items: center;}
#bwt-specifications svg {width: 13px;  margin-right: 10px;}
@media all and (max-width: 1100px) { #bwt-specifications .inner-width  .lightbox{ top: 84%;left: 6%;}}
@media all and (max-width: 900px) {#bwt-specifications .inner-width {width: 100%;}#bwt-specifications .inner-width .spec .text { width: 45%;} #bwt-specifications .inner-width  .lightbox{ top: 80%;}}
@media all and (max-width: 799px) {#bwt-specifications .inner-width .spec{justify-content: space-between;}
#bwt-specifications .inner-width .spec .text{padding-left: 50px;}#bwt-specifications .inner-width .spec .text{width: 50%;}
#bwt-specifications .inner-width .spec .img{max-width: 50%;padding-left: 50px;}#bwt-specifications .inner-width .spec .img.right{max-width: 50%;padding: 0px 50px 0px 0px;}}
@media all and (max-width: 680px) { #bwt-specifications .inner-width .spec.reverse{flex-direction: column-reverse;} #bwt-specifications .inner-width .spec{flex-direction: column;}#bwt-specifications .inner-width .spec .text { width: 100%;}
#bwt-specifications .inner-width .spec .img,#bwt-specifications .inner-width .spec .img.right {max-width: 90%;padding: 0px;}
#bwt-specifications .inner-width .spec {text-align: center;}}
/***********************************/
/*********** Advanced Tech *********/
/***********************************/
.advancedTech{max-width: 1400px;width: 90%;margin: 100px auto;display: flex; justify-content: center;flex-direction: column; align-items: center;}
.advancedTech-content {display: flex;justify-content: center;align-items: center;}
.advancedTech-text h2{color: #505050;margin-bottom: 30px;}
.advancedTech video {width: 60%;}
.advancedTech-content img {max-width: 100%;width: 500px;padding: 2%;}
@media all and (max-width: 799px){
    .advancedTech-text {text-align: center;} 
    .advancedTech-content {flex-direction: column-reverse;}
    .advancedTech video {margin: 50px auto 0px;width: 100%;}}


/* E A S T E R    2 0 2 4 */

div#hero img {height: 100%;object-fit:cover;min-width:100%;}

.overlay h1.qettle {
    margin-top: -15px;
    margin-bottom: 10px;
}

div#hero .overlay h1.qettle img {
    width: 200px;
    margin: 0 auto;
    padding-right: 34px;
    object-fit: unset;
    min-width: unset;
}

div#hero .overlay h1.qettle.mobile {display: none;}


.overlay h2.sub {
    font-size: 80px;
    font-family: "Bebas Neue", sans-serif;
    letter-spacing: 8px;
}

.overlay p.offer {color: #fff;font-size: 18px;}

.overlay a {background: #fff;color: #000}

@media all and (max-width: 1200px) {
    .overlay {
        max-width: 100%;
        width: 100%;
        /*height: 100%;*/
        left: 0;
        padding-left: 50px;
    }
}
@media all and (max-width: 1200px) {
    div#hero .overlay h1.qettle img {width:185px;}

    .overlay h2.sub {font-size: 70px;}
}
@media all and (max-width: 820px) {
    div#hero .overlay {top:30px;padding-left: 0;margin-bottom:30px;}
    .overlay h2.sub, .overlay p.offer {color: #666}
    .overlay a {border:thin solid #666;}
    div#hero .overlay h1.qettle.mobile {display: inline;}
    div#hero .overlay h1.qettle.desktop {display: none;}


}
/* E A S T E R    2 0 2 4   E N D S */

/********************/
/*** PRODUCT GRID ***/
/********************/

#product-grid a:nth-child(2) {
  position: relative;
}

#product-grid a:nth-child(2)::after {
    content: "";
    position: absolute;
    background-image: url(../images/sprayspout/SprayHoseAvailable2.png);
    background-repeat: no-repeat;
    background-size: 110px;
    z-index: 9999;
    pointer-events: none;
    background-position: calc(100% - 29px) calc(100% - 30px);
    width: 100%;
    height: 100%;
}