/*********** Whipbird, reset styles ***********/

html{background-color:  #F6ECE4;}
body {
    max-width: 1200px;
    text-align: center;
    margin: auto !important;
    }

div.mq{display:none !important;}

.btn, .btn:focus, .btn.focus, 
.btn:first-child:active, .btn.first-child.active, .btn:active, .btn.active, 
.btn.visited, .btn:visited, .btn.hover, .btn:hover,
.btn:disabled, .btn.disabled
{
    background-color: #d96f39 !important; 
    border: 0px solid #d96f39 !important;
    }

input:disabled, input.disabled, select:disabled, select.disabled, textarea:disabled, textarea.disabled  {background-color: #CEC3BB;}

input::placeholder {
  font-weight: normal !important;
  opacity: 0.2 !important;
  color: #333333 !important;
}

.btn:active, .btn:hover {
    box-shadow: outset 0 2px 2px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 0, 0, 0.6);
    }

.offcanvas{z-index:1000000 !important;
}

.offcanvas-header .btn-close.left {
    margin-top: -2px !important;
    margin-left: 7px !important;
    }

.offcanvas-header.right {
    justify-content: right;
    }

.offcanvas-header.right .btn-close {
    margin-right:0px;
    margin-top:-2px;
    }


.alert-success{
    background-color: #DA6F39 !important;
    border: none !important;
    }

.hamburgernav{
    z-index:1000000;
    height: 50px;
    padding: 0;
    text-align: left;
    background-color: #F6ECE4 !important;
    }

.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
    border:none;
    outline: none;
    box-shadow: none;
}

.navbar-toggler-icon{width:2.5em !important;}

.navbar-toggler-right{
    position: absolute !important;
    right:10px !important;
    top: 8px !important;
    font-size:2em;
    border:0px solid transparent;
    }

.navbar-toggler-right.carty{
    right:0px !important;
    top: 0px !important;
    }

.navbar-toggler-left{
    position: absolute !important;
    left: 10px !important;
    top: 8px !important;
    font-size:2em;
    border:0px solid transparent;
    }


.labelReq:after {
    content: " *";
    color: red;
}

.field_postcode, .field_state {width:100px; margin-right:10px;}
.field_suburb{width:80%; }

.imageBox {
    width: 84px;
    height: 100px;
    background-color: white;
}

img.bshot {
    margin: 10px auto;
    vertical-align: middle;
    text-align: center;
}

img.cartTHM {
    height: 80px;
}

img.cart.small {
    height: 30px;
    }


input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  cursor: pointer;
  width: 25rem;
  opacity:1 !important;
}

/* Removes default focus */
input[type="range"]:focus {
  outline: none;
}

/**** Payway ******/


.nopay, .vcpwarning{color:red; list-style: none; padding-left:0;}
.payway-creditcard-form label, .payway-creditcard-form input, .payway-creditcard-form select, .payway-card label, .payway-card legend {font-family: "Courier new" !important;}

a.cartBottleA{text-decoration: none !important; color:white;}

.cartBottles {
    font-family: inherit;
    position: relative;
    top: -11px;
    right: 10px;
    /* background-color: #ee0606; */
    background-color: #DA6F39;
    border-radius: 19px;
    padding: 5px 8px ! important;
    font-size: 12px;
    line-height: 20px;
    color: white;
    z-index:20000;
}


/******** Chrome, Safari, Opera and Edge Chromium styles ********/
/* slider track */
input[type="range"]::-webkit-slider-runnable-track {
  background-color: #605142 !important;
  border-radius: 0.5rem;
  height: 0.5px;
}

/* slider thumb */
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  margin-top: -7.75px; /* Centers thumb on the track */
  background-color: #d96f39;
  border-radius: 0.5rem;
  height: 1rem;
  width: 1rem;
}

input[type="range"]:focus::-webkit-slider-thumb {
  outline: 3px solid #d96f39;
  outline-offset: 0.125rem;
}

input[type="range"]:disabled::-webkit-slider-thumb{
    background-color: #d96f39 !important;
    opacity:1 !important;
    }

/*********** Firefox styles ***********/
/* slider track */
input[type="range"]::-moz-range-track {
  background-color: #605142;
  border-radius: 0.5rem;
  height: 0.5px;
}

/* slider thumb */
input[type="range"]::-moz-range-thumb {
  background-color: #d96f39;
  border: none; /*Removes extra border that FF applies*/
  border-radius: 0.5rem;
  height: 1rem;
  width: 1rem;
}

input[type="range"]:focus::-moz-range-thumb{
  outline: 3px solid #d96f39;
  outline-offset: 0.125rem;
}




.bottle-container {
  position: relative;
}

.bottle-container .hover-image {
  position: absolute;
  top: 0;
  left: 0;
  transition: opacity 1s;
  opacity: 0;
}

.bottle-container .hover-image:hover {
  opacity: 1;
}




/*********** All styles ***********/

            .text-primary{color:#DA6F39 !important;}

            body{background-color:#F6ECE4;}
            body,p,td,span,div,input,select,label{font-family: henderson-sans-basic; color:#1D1D1B; font-size:10px; letter-spacing 0.1em; margin:0;}
            hr.whipbird {height: 1.4px;color: #1D1D1B;background: #1D1D1B;font-size: 0;border: 0;}
            .row{border-top:1.4px solid #343434;border-left:1.4px solid #343434;}
            .row .col{border-right:1.4px solid #343434;border-bottom:0px solid #343434;}
            .row .col.lastCol{border-right:0px solid #343434;}
            .row:last-of-type .col{border-bottom:1.4px solid #343434;}
            .row .col{border-bottom:1.4px solid #343434;}
            
            .color-whipbird-lightgray{color:#CEC3BB !important;}
            .color-whipbird-black{color:#1D1D1B !important;}
            .color-whipbird-taupe{color:#7D6A58 !important;}
            .color-whipbird-light{color:#F8EEE6 !important;}

            .hover-orange:hover{background-color:#DA6F39; color:#1D1D1B !important;}
            .hover-orange:hover a *{color:#1D1D1B !important;}
            
            a.a-inherit{text-decoration: none !important; color:inherit !important;}
            
            a, .hover-orange{transition: background-color 0.5s ease-in-out, color 0.5s ease-in-out;}

            .text-upper{text-transform: uppercase;}
            .vertical-center{align-content: center;}
            
            .bt0{border-top:0px solid #343434 !important;}
            .bt1{border-top:1.4px solid #343434 !important;}
            .bt2{border-top:1.4px solid #343434 !important;}
            
            .bl0{border-left:0px solid #343434 !important;}
            .bl1{border-left:1.4px solid #343434 !important;}
            .bl2{border-left:1.4px solid #343434 !important;}
            
            .bb0{border-bottom:0px solid #343434 !important;}
            .bb1{border-bottom:1.4px solid #343434 !important;}
            .bb2{border-bottom:1.4px solid #343434 !important;}
            
            .br0{border-right:0px solid #343434 !important;}
            .br1{border-right:1.4px solid #343434 !important;}
            .br2{border-right:1.4px solid #343434 !important;}
            
            .b0{border-right:0px solid #343434 !important;border-bottom:0px solid #343434 !important;border-top:0px solid #343434 !important;border-left:0px solid #343434 !important;}

            .wA{width:20%; font-size:0.8em; text-align:center;}
            
            .row .col:last-of-type{border-bottom:0px solid #343434;}
            .row:last-of-type .col:last-of-type{border-bottom:1.4px solid #343434;}
            .row .col p{width:auto;}
            
            nav{border-top:1.4px solid #343434;border-right:1.4px solid #343434;border-left:1.4px solid #343434;}
            
            nav .nav-item {color: #1D1D1B;
                margin:auto;
                
                font-family: henderson-sans-basic;
                font-weight: 400 !important;
                text-transform: uppercase;
                letter-spacing: 0.60px;
                word-wrap: break-word;}

            nav .nav-item.hover, nav .nav-item:hover, a.hover, a:hover{color:#DA6F39 !important; transition: 300ms ease-in;}
            .bg-orange a:hover{color:#A3420D !important;}
            .nav-link{padding:0.2em;}
            
            .col.text div.text-left-center{
              display: flexx;
              justify-content: center;
              align-items: left;
              flex-direction: column;}

            .bg-taupe {background-color: #7D6A58;}
            .bg-beige {background-color: #F6ECE4;}
            .bg-lightgrey{background-color:#CEC3BB;}
            .bg-orange{background-color:#DA6F39;}
            .bg-brown{background-color:#9B8F87;}

            .bg-inherit{background-color: inherit !important;}

            nav{height:4em;}
            nav > img {height:100%;}
            img.nav-logo{height:48px !important;}
            
            .w-30{width:30%;}
            .Xproduct-page-bottle{height:164px;}
            .product-page-bottle{width:100%; height:100%;}
            .h-85pc{height:85%;}
            
            .f1{font-size:1em;}
            .f2{font-size:1.25em;}
            .f3{font-size:1.5em;}
            .f4{font-size:3em;}
                        
            .gall4 img{width:100%;}
            
            .alternate-image img{width:100%;}

            .bg-transparent-image{background-image: url('/whipbird/blank-926-1030.png')}
            
            .logo-fw {
                height: 33%;
                max-height: 100px;
                max-width: 50%;
                margin-top: 84px !important;
                margin-bottom: 74px !important;
            }

            .fwb{font-weight:700 !important;}
            .dib{display: inline-block !important;}
            .mt-m24{margin-top: -24px;}

            /* Small devices (landscape phones, 576px and up) */
            @media (min-width: 576px) { 
                nav{height:3.5em;}
                .w-sm-A{width:92px; font-size:1em;}
                .Xproduct-page-bottle{height:194px;}
                div.mq:before{content: 'min-width:576px';}
                .row .col{border-bottom:0px solid #343434;}
                
                
                div.mq{display:block;}
                
                .br-sm-0{border-right:0px !important;}
                .bl-sm-0{border-left:0px !important;}
                .br-sm-1{border-right:1px !important;}
                .bl-sm-1{border-left:1px !important;}
                .br-sm-2{border-right:1.4px solid #1D1D1B !important;}
                .bl-sm-2{border-left:1.4px solid #1D1D1B !important;}
                .bb-sm-0{border-bottom:0px !important;}
                .bt-sm-0{border-top:0px !important;}
                .bb-sm-1{border-bottom:1px !important;}
                .bt-sm-1{border-top:1px !important;}
                .bb-sm-2{border-bottom:1.4px solid #1D1D1B !important;}
                .bt-sm-2{border-top:1.4px solid #1D1D1B !important;}
                
                
                .text-sm-left{text-align: left !important;}
                
                .f-sm-2{font-size:1.25em;}
                .f-sm-3{font-size:2.25em;}
                .f-sm-4{font-size:3em;}
                
            }
            
            /* Medium devices (tablets, 768px and up) */
            @media (min-width: 768px) {
                .w-sm-A{width:auto;}
                .Xproduct-page-bottle{height:248px;}
                div.mq:before{content: 'min-width:768px';}
                
                .br-md-0{border-right:0px !important;}
                .bl-md-0{border-left:0px !important;}
                .br-md-1{border-right:1px !important;}
                .bl-md-1{border-left:1px !important;}
                .br-md-2{border-right:1.4px solid #1D1D1B !important;}
                .bl-md-2{border-left:1.4px solid #1D1D1B !important;}
                .bb-md-0{border-bottom:0px !important;}
                .bt-md-0{border-top:0px !important;}
                .bb-md-1{border-bottom:1px !important;}
                .bt-md-1{border-top:1px !important;}
                .bb-md-2{border-bottom:1.4px solid #1D1D1B !important;}
                .bt-md-2{border-top:1.4px solid #1D1D1B !important;}
                
                .f-md-2{font-size:2.25em;}
                .f-md-3{font-size:2.75em;}
                .f-md-4{font-size:3.25em;}
                }           
            
            /* Large devices (desktops, 992px and up) */
            @media screen and (min-width: 992px) {
                div.mq:before{content: 'min-width:992px';}
                
                }           
            
            /* Extra large devices (large desktops, 1200px and up) */
            @media (min-width: 1200px) {
                div.mq:before{content: 'min-width:1200px';}
                
                }