#water-quality-report{margin:18px auto 0;max-width:1600px}
#water-quality-report .btn-radius{background-color:#00caaf;border:0;border-radius:15px;color:#000;font-size:14px;height:40px}
#water-quality-report .check-water-btn{display:block;font-family:'DinMedium';background:#FFF;color:#00384a !important;text-decoration:none !important;border:0;border-radius:10px;padding:10px 25px;margin-left:15px;text-align:center;&:hover{background-color:#00caaf !important;color:#00384a !important;text-decoration:none !important;cursor:pointer}
}
.water-btn-div{display:flex;justify-content:center}
#water-quality-report .postcodeIndent{text-indent:35px}
#water-quality-report .hero input[type=radio]~span{color:#fff}
#water-quality-report .searchIcon{height:27px;width:27px;background-size:contain;background-image:url(img/icons/search-white.svg);background-repeat:no-repeat;background-color:transparent;border:0;position:absolute;top:-20px}
#water-quality-report .check-my-water-bg{position:absolute;width:100vw;left:0}
#water-quality-report .close-btn{display:inline-block;top:10px;right:20px;width:23px;height:23px;position:absolute}
#water-quality-report .empty~.close-btn{display:none}
#water-quality-report .info{color:#000;margin-bottom:20px}
#water-quality-report .info p{margin:0}
#water-quality-report .info-title{font-size:24px}
#water-quality-report .info-title+p{font-size:14px}
#water-quality-report .download-pdf-info{font-size:30px;color:#000;margin-top:73px;margin-bottom:30px}
#water-quality-report .download-button{clear:both}
#water-quality-report .key-for-units{background:#f4f4f4;color:#000;margin-top:30px;margin-bottom:100px;padding:74px 0 65px}
#water-quality-report .key-for-units .section-title{font-size:24px}
#water-quality-report .key-for-units .section-title img{float:right;margin-top:12px}
#water-quality-report .key-for-units .unit,#water-quality-report .key-for-units .description{font-size:18px}
#water-quality-report .key-for-units .unit{color:#00caaf;text-align:center}
#water-quality-report .invalid-hint{display:block}
.key-for-units .key-header{font-size:24px;text-align:center}
.key-for-units .key-header{margin-bottom:15px}
@media(max-width:991px){#water-quality-report .close-btn{width:15px;height:15px}
#water-quality-report .info{text-align:center}
#water-quality-report .download-pdf-info{font-size:18px}
#water-quality-report .key-for-units{text-align:center}
}
input[data-validate]{display:block;height:42px;background:0;border:0;border-bottom:1px solid #fff;color:#fff;font-size:30px;line-height:30px}
input[data-validate]:focus{outline:0}
.input-container{top:20%}
.input-container label{color:#fff;font-size:30px;line-height:30px;font-weight:normal;position:absolute;pointer-events:none;left:5px;margin-left:12px;top:10px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}
input[data-validate]:focus~label,input[data-validate]:not(.empty)~label{top:-20px;font-size:14px;color:#fff}
.input-container .bar{position:relative;display:block;width:100%}
.input-container .bar:before,.input-container .bar:after{content:'';height:2px;width:0;bottom:1px;position:absolute;background:#4a90e2;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}
.input-container .bar:before{left:50%}
.input-container .bar:after{right:50%}
input[data-validate]:focus~.bar:before,input[data-validate]:focus~.bar:after{width:50%}
.input-container .highlight{position:absolute;height:60%;width:100px;top:25%;left:0;pointer-events:none;opacity:.5}
input[data-validate]:focus~.highlight{-webkit-animation:inputHighlighter .3s ease;-moz-animation:inputHighlighter .3s ease;animation:inputHighlighter .3s ease}
@-webkit-keyframes inputHighlighter{from{background:#4a90e2}
to{width:0;background:transparent}
}
@-moz-keyframes inputHighlighter{from{background:#4a90e2}
to{width:0;background:transparent}
}
@keyframes inputHighlighter{from{background:#4a90e2}
to{width:0;background:transparent}
}
@media(max-width:500px){.hidden-xs{display:none}
}
.mobile-table{margin-bottom:30px}
.mobile-table>thead>tr>th{border-bottom:0;padding:15px 10px}
@media screen and (max-width:767px){.mobile-table>thead>tr>th{white-space:nowrap}
}
.desktop-table th{padding:10px;font-size:21px;overflow:hidden}
.desktop-table.metals{margin-top:75px;margin:auto}
.desktop-table.metals th,.desktop-table.metals td{text-align:center;width:25%}
.desktop-date.metals th,.desktop-date.metals td{text-align:center;width:25%}
.desktop-date th{padding:10px;font-size:21px;overflow:hidden}
.table-header>thead>tr>th{text-align:center;width:25%;font-size:21px;border-bottom:0}
.table-extend th{font-size:18px}
.table-extend td{width:50%}
.check-my-water .input-container{width:auto}
.keys-content{clear:both}
span.invalid-hint{display:block;visibility:hidden}
span.invalid-hint.invalid{display:block;visibility:visible}
@media(max-width:992px){.check-my-water .input-container{width:84%}
.key-header span{cursor:pointer;padding-right:30px;background:url(img/water-quality/arrow-down.png) 100% 50% no-repeat}
.key-header span.reveal{background:url(img/water-quality/up-arrow.png) 100% 50% no-repeat}
.keys-content{padding:0 30px}
}
@media(max-width:768px){#water-quality-report h2{padding:0 15px}
}
#water-quality-report .hero{max-height:640px}
#water-quality-report .hero-content h2{color:#fff;margin:30px auto !important}
#water-quality-report .hero-content .input-container{float:none;width:auto;margin-bottom:30px}
#water-quality-report .hero .hero-content{padding:0 15px}
@media(min-width:768px){#water-quality-report .hero-content .input-container{width:35%}
}
#water-quality-report .radio-group label{color:#fff}
#water-quality-report .radio-group{margin-bottom:26px}
#water-quality-report .hero.micro:after{display:none}
#water-quality-report .hero.micro-inner{height:100%;min-height:300px}
@media(max-width:767px){#water-quality-report .hero.micro-inner .hero-banner.banner .background-image{height:100%}
}
#water-quality-report #postcode{text-transform:uppercase}
.desktop-table tr.table-header th{font-size:24px;font-weight:normal;border-bottom:0}
.desktop-table>thead>tr>th{border-bottom:0}
.desktop-table>thead>tr:nth-child(2)>th{border-top:0}
.desktop-date>thead>tr>th{border-bottom:0}
.desktop-date>thead>tr:nth-child(2)>th{border-top:0}
.mobile-table tr.table-header th{font-size:20px;font-weight:normal;border-bottom:0}
.mobile-table>tbody>tr td:last-of-type{border-bottom:1px solid #ddd}
.mobile-table>tbody>tr:last-of-type>td:first-child{border-bottom:1px solid #ddd}
.mobile-table>thead:nth-child(2)>tr>th{border-top:0}
.quality-table.row{max-width:1170px;display:block;margin:auto}
.quality-table .mobile-table thead tr th{width:100%;white-space:normal}
.quality-table .mobile-table tbody tr td:last-of-type{min-width:100px;text-align:right}
@media(max-width:991px) and (min-width:768px){.quality-table.row{max-width:768px}
table.visible-sm{display:table !important;margin-top:75px;margin:auto}
}
@media(max-width:767px){table.visible-xs{display:table !important;margin-top:75px;margin:auto}
}
#quality-table .table-title{margin:25px auto}
#quality-table table.table{margin:10px auto 25px auto}
#waterQualityModal .modal-inner-content select.address-selector{margin:20px auto;width:100%}
p.updated-date{color:#fff;margin:20px auto}