*, :after, :before {
    box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-kerning: auto;
}

html {
  font-family: Poppins, Arial, Helvetica, sans-serif;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  min-width: 320px;
}

.displayNone {
  display: none;
}

.clear {
    clear: both;
}

.left {
    width: 49%;
    float: left;
}

.right {
    width: 49%;
    float: right;
}

:root{--brand-yellow:#ffcc0a;--brand-light-blue:#2e7ef3;--brand-mid-blue:#3469d2;--brand-dark-blue:#2f5ebd;--brand-black:#212121}
.content-outer{width: 1200px;margin: auto;padding: 20px 10px;display: flex;justify-content: space-evenly;}
.top-info__body, .logo-nav{justify-content:space-between;display:flex}
.top-info{width:100%;background:var(--brand-dark-blue);color:#fff}
.top-info-contact,.top-info-social,.top-info-nav{font-size:13px;font-weight:700}
.top-info-contact__el:first-child,.top-info-contact__el:nth-child(2){margin-right:25px}
.top-info-contact__el .prepend{font-size:18px;margin-right:10px;vertical-align:middle}
.top-info-social .body{font-size:18px;vertical-align:middle}
.top-info-social .body:first-child{margin-right:25px}
.top-info-nav__el:first-child,.top-info-nav__el:nth-child(2){margin-right:25px}
.top-info-nav__el .prepend{font-size:18px;margin-right:10px;vertical-align:middle}
section.logo-nav-outer{background:var(--brand-mid-blue)}
.logo-nav .logo-nav__resp-outer{display:flex;justify-content:space-between;align-items:center}
.logo-nav__logo a{color:#1c1816}
.logo-nav__logo,.logo-nav__navigation{list-style:none;text-transform:uppercase}
.logo-nav__logo a,.logo-nav__navigation a{text-decoration:none;font-size:14px;font-weight:700;text-align:center}
.logo-nav__navigation{display:flex}
.logo-nav__navigation a{display:block;padding:13px 15px;color:#fff}
.logo-nav__navigation a:hover{color:var(--brand-yellow);cursor:pointer;transition:.3s}
.logo-nav__navigation a.quote-nav-btn{background:var(--brand-light-blue);border-radius:6px}

label.logo-nav__burger{display:none;width:50px;height:50px;float:right;vertical-align:middle;content:url(../images/burger.svg);margin-right:20px}
label.logo-nav__burger:hover{opacity:0.6;cursor:pointer;transition:.3s;}
#navBurger:checked + .logo-nav__burger{content:url(../images/close.svg);}
#navBurger:checked ~ .logo-nav__navigation{display:block!important;padding: 20px}
#navBurger:checked ~ ..logo-nav{padding-bottom:0;}



@media all and (max-width: 1225px) {
.footer{justify-content: space-around;}
}
@media all and (max-width: 1190px) {
.content-outer {width: 1100px;}
}
@media all and (max-width: 1100px) {
    .content-outer{width:100%;}
    .logo-nav .logo-nav__resp-outer {flex-direction: column;margin: auto;}
    .top-info-nav{display:none;}
    .right-content>.blue-info-box {width: 100%;border-radius: 10px;}
    #arrow-left {display: none;}
    #slogan{display: none;}
    .left-banner,.right-banner {width: 49%;display: block;}
    .top-bar-contact {margin-left: 8px;}
    .nav-bar-background {background: #262626;padding: 40px 0;}
    .logo-banner {padding: 20px 40px;}
    .icon {width: 25px;float: right;line-height: 89px;}
    .skipTab,.industrialTab,.binsTab {width: 33%;font-size: 15px;margin-left: 0;padding: 6px 0;}
    .form-outer-skip,.form-outer-industrial,.form-outer-bins {width: 100%;}
    .contents-input {background-position: 10px center, right center !important;}
    .points-list {margin-bottom: 25px;}
}
@media all and (max-width: 1050px) {
.body-content .right-content{width:450px;}
}
@media all and (max-width: 850px) {
.logo-nav .logo-nav__resp-outer {flex-direction: unset;margin: unset;}
.logo-nav {padding: 20px 0 0 0;}
.logo-nav__logo{margin:0}
/* .logo-nav__navigation{width:100%;justify-content:space-around} */
.logo-nav__navigation{width:100%;flex-direction:column;background:#262626;margin-top:25px;display:none;}
.logo-nav__logo{margin:20px;align-self:left}
.logo-nav__logo img{margin-bottom:20px;}
.logo-nav__navigation a{padding:10px;display: block;text-align: center;background: #262626;border-bottom: 1px solid rgba(255, 255, 255, 0.1);color: #bbbbbb;}
.logo-nav__navigation li:last-of-type a{border-bottom:none}
.logo-nav__resp-outer{width:100%}
label.logo-nav__burger{display:block;}
.logo-nav__navigation a.quote-nav-btn {background: unset;}
.logo-nav .logo-nav__resp-outer {display: unset;justify-content: unset;align-items: unset;}
.footer{flex-direction: column;margin: auto;width: 600px;}
ul.footer__links{margin:25px 0 20px 0;}
.body-content{width:400px}
.body-content .left-content, .body-content .right-content, .form-outer-skip, .form-outer-industrial, .form-outer-bins{width:100% !important;}
.quarts {width: 48%;}
}
@media all and (max-width: 675px) {
.top-info-social{display:none;}
.footer{width:100%;}
}



section.page-title-big{background:var(--brand-black);padding:70px 0}
.page-title-big h1{font-family:'Barlow',sans-serif;font-weight:bolder;font-size:65px;margin:0;text-align:center;color:#fff}
footer{width:100%;background:var(--brand-black);color:#fff;padding:100px 0}
.footer{display:flex;justify-content:space-between}
ul.footer__links{list-style:none;padding:0;margin:50px 0 0}
ul.footer__links li a{text-decoration:none;color:#fff;font-weight:200}
ul.footer__links li a:hover{color: var(--brand-yellow);cursor: pointer;transition: .3s;}
ul.footer__links li{margin:15px 0;box-shadow:0 0 #000}
p.footer__address{text-align:right}
.footer__col img{display:block;float:right}
p.footer__copyright{color:#737272;font-size:14px}
.footer-copyright{color:#fff;background:#000;padding:15px 0}

.blue-info-box {
    padding: 30px;
    width: 86%;
    background: #4c98fc;
    color: white;
    display: inline-block;
    border-radius: 1px 10px 10px 2px;
    float: right;
}

h4.blue-box-title {
    font: 700 22px Poppins, Arial, Helvetica, sans-serif;
}

.blue-info-box p {
    font: 500 15px Poppins, Arial, Helvetica, sans-serif !important;
}

.footer-left h5,
.footer-center h5 {
    padding: 15px 15px 15px 0;
    font: 600 13px Poppins, Arial, Helvetica, sans-serif;
}

.footer-center h3,
.footer-left h3 {
    margin-bottom: 20px;
    font: 700 20px Poppins, Arial, Helvetica, sans-serif;
}

.footer-right p {
    text-align: right;
}

.footer-links {
    text-decoration: none;
}

.footer-links:hover {
    color: #ffcc0a !important;
}

#arrow-left {
    width: 0;
    height: 0;
    border-top: 103px solid transparent;
    border-bottom: 103px solid transparent;
    border-right: 88px solid #4c98fc;
    position: absolute;
}

.top-bar-contact {
    font: 800 13px Poppins, Arial, Helvetica, sans-serif;
}

#slogan {
    font: 20px Open Sans, Arial, Helvetica, sans-serif;
    color: #777777;
    margin-top: 26px;
    float: right;
    vertical-align: middle;
}

/*	Resetting the form to have no drop down arrow*/

.form-outer-skip,
.form-outer-industrial,
.form-outer-bins {
    width: 360px;
    border-radius: 0 0 15px 15px;
    padding: 11px;
}

.form-outer-skip {
    background: #bed81f;
}

.form-outer-industrial {
    background: #4c98fc;
}

.form-outer-bins {
    background: #c3a14c;
}

.skipTab {
    width: 26%;
    background: #bed81f;
    border-radius: 10px 10px 0px 0px;
    padding: 6px;
    text-align: center;
    font-weight: bold;
    color: white;
    float: left;
    font-size: 16px;
    margin: 0 1px;
}

.industrialTab {
    width: 140px;
    background: #4c98fc;
    border-radius: 10px 10px 0px 0px;
    padding: 6px;
    margin-left: 2px;
    text-align: center;
    font-weight: bold;
    color: white;
    float: left;
    font-size: 16px;

}

/* Tooltip */
.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 150px;
    background-color: black;
    color: white;
    text-align: center;
    border-radius: 6px;
    padding: 10px;
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
    margin-left: -60px;
    font-size: 15px;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

/* Tooltip */

.binsTab {
    width: 120px;
    background: #c3a14c;
    border-radius: 10px 10px 0px 0px;
    padding: 6px;
    margin-left: 2px;
    text-align: center;
    font-weight: bold;
    color: white;
    float: left;
    font-size: 16px;

}

.binsTab a,
.industrialTab a,
.skipTab a {
    color: white;
    text-decoration: none;
    cursor: pointer;
}

.form-title {
    font-size: 37px;
    color: white;
    text-shadow: 0 2px 2px rgba(0, 0, 0, .2);
}

.input-title {
    font-weight: 700;
    color: white;
}

.roadside-alert {
    font-weight: 700;
    color: white;
    display: inline-block;
    vertical-align: middle;
}

.roadside-alert svg {
    display: inline-block;
    vertical-align: middle;
}

.form-inputs {
    border: 3px solid #e74848;
    border-radius: 10px;
    padding-left: 80px;
    font-size: 145%;
    color: #cccccc;
    display: block;
    background: #fff;
    width: 100%;
    margin-bottom: 15px;
    font-weight: 700;
    height: 70px;
}

.form-inputs:hover {
    transition: .2s border;
    border: 3px solid #4c98fc;
    outline: 0;
}

.form-inputs:focus {
    transition: .2s border;
    border: 3px solid #4c98fc;
    outline: 0;
}

section.intercom-popup {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 20px;
    width: 325px;
    min-height: 250px;
    max-height: 704px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 5px 40px;
    border-radius: 8px;
    background: white;
    z-index: 9;
    padding: 20px;
}

.intercom-popup h2 {
    display: inline-block;
    vertical-align: middle;
    font-size: 20px;
}

.intercom-popup p {
    font-size: 14px;
}

.intercom-popup .close {
    display: inline-block;
    vertical-align: middle;
    float: right;
    cursor: pointer;
}

form#intercom-form {
    width: 100%;
    margin: 20px 0 0 0;
}

.intercom-inp {
    width: 100%;
    margin-bottom: 15px;
    box-sizing: border-box;
    border: solid 1px;
    border-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.6);
    border-radius: 4px;
    padding: 10px 13px;
    background: white;
}

.intercom-btn {
    display: inline-block;
    padding: 10px 20px;
    color: #fff;
    background: var(--brand-light-blue);
    border-radius: 6px;
}

.intercom-btn:hover {
    background: var(--brand-dark-blue);
    cursor: pointer;
    transition: .3s;
}


/*	Inital colour of postcode placeholder   */

input::-webkit-input-placeholder {
    color: #cccccc;
}


/*	Postcode placeholder on hover   */

input:hover::-webkit-input-placeholder,
input:focus::-webkit-input-placeholder {
    transition: .2s border;
    color: #4c98fc;
}

select {
    color: #cccccc;
}

select:hover {
    color: #4c98fc;
}

#createPdfIcon {
    float: right;
    display: inline-block;
}

#downloadPdfIcon {
    float: right;
    display: none;
}

#creditIcon {
    display: none;
}

/*	Input background images   */

input[type=checkbox] {
    transform: scale(1.5);
    margin-left: 10px;
    margin-right: 10px;
}

.postcode-input {
    background: url(../images/postcode-grey.png) no-repeat #fff;
    background-position: 10px center;
    background-size: 55px 55px;
}

.postcode-input:hover,
.postcode-input:focus {
    background: url(../images/postcode-blue.png) no-repeat #fff;
    background-position: 10px center;
    background-size: 55px 55px;
}

.contents-input {
    background: url(../images/skip-grey.png), url(../images/down-arrow.png);
    background-repeat: no-repeat;
    background-color: #fff;
    background-position: 10px center, 308px center;
    background-size: 55px 55px, 40px 40px;
}

.contents-input:hover,
.contents-input:focus {
    background: url(../images/skip-blue.png), url(../images/down-arrow-blue.png);
    background-repeat: no-repeat;
    background-color: #fff;
    background-position: 10px center, 308px center;
    background-size: 55px 55px, 40px 40px;
}


/*	INPUT BACKGROUND IMAGES   */


/*	Submit Button   */

.get-quote {
    border-radius: 15px;
    background: #43c2d2;
    background: -moz-linear-gradient(top, #43c2d2 0, #228bb2 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #43c2d2), color-stop(100%, #228bb2));
    background: -webkit-linear-gradient(top, #43c2d2 0, #228bb2 100%);
    background: -o-linear-gradient(top, #43c2d2 0, #228bb2 100%);
    background: -ms-linear-gradient(top, #43c2d2 0, #228bb2 100%);
    background: linear-gradient(to bottom, #43c2d2 0, #228bb2 100%);
    color: #fff;
    font-size: 30px;
    text-align: center;
    text-shadow: 0 3px 0 rgba(0, 0, 0, .2);
    font-weight: 700;
    padding: 15px;
    width: 100%;
    box-shadow: inset 0 2px 0 rgba(255, 255, 255, .4);
    cursor: pointer;
    transition: .2s all;
    margin: 15px 0px 0px -2px;
    border: 2px solid #3A5D73;
}

.get-quote:hover {
    box-shadow: inset 0 4px 0 rgba(255, 255, 255, .4), 0 5px 2px rgba(0, 0, 0, .2);
    text-shadow: 0 0 0 rgba(0, 0, 0, .2);
}


/*	SUBMIT BUTTON END   */

.error {
    display: none;
}

#postcode:invalid~.error {
    display: block;
}

.row {
    width: 100%;
}

.quarts {
    width: 24.2%;
    display: inline-block;
    padding: 5px;
    box-sizing: border-box;
    vertical-align: top;
}

hr.sm-hr {
    background: #ccc;
    border-color: #ccc;
    color: #ccc;
    border: 0;
    height: 0;
    border-top: 1px solid #ccc;
    margin: 10px 0 10px 0;
}

.smaller-text {
    line-height: 19px;
    font-size: 70%;
}

.skip-title {
    font-weight: 700;
    color: #5b5b5b;
}

.price {
    background: #f4a512;
    border: 2px solid #865100;
    position: relative;
    border-radius: 15px;
    text-align: center;
}

.price h2 {
    color: #fff;
    margin-top: 15px;
    text-shadow: 0 2px 0 rgba(0, 0, 0, .2);
}

b {
    font-weight: 700;
}

small {
    font-size: 75%;
}

.g-q-sm {
    font-size: 20px !important;
    padding: 10px;
}

.book-price {
    font-size: 29px;
}

#showHide {
    width: 300px;
    display: inline-block;
}

/* 	Page Copy  */

.contact-banner {
    background: #eeeeee;
    color: #868686;
    font-weight: bold;
    font-size: 13px;
    padding: 8px 0;
    text-align: left;
}

.icon-blue {
    color: #4c98fc;
}

.logo-banner {
    background: #4c98fc;
    padding: 20px 0;
}


/* NAVIGATION BAR */

.nav-bar-background {
    background: #454545;
    padding: 10px 0;
}

ul.topnav li a {
    text-align: center
}

ul.topnav {
    overflow: hidden
}

.topnav {
    margin: auto
}

ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 0
}

ul.topnav li {
    float: left
}

ul.topnav li a {
    display: inline-block;
    min-width: 75px;
    line-height: 20px;
    color: #fff;
    font: 700 14px Poppins, Arial, Helvetica, sans-serif;
    padding: 20px 30px 20PX 0;
    text-decoration: none;
    transition: color .3s ease
}

.alignmentTwo {
    margin: auto;
    width: 1073px;
}

ul.topnav li a:hover {
    color: #ffcc0a;
}

ul.topnav li.icon {
    display: none
}

/* NAVIGATION BAR END */

.left-banner {
    float: left;
    width: 32%;
}

.middle-banner {
    float: left;
    width: 32%;
    text-align: right;
}

.right-banner {
    float: right;
    width: 49%;
    text-align: right;
    display: none;
}

.left-content {
    /* float: left; */
    width: 360px;
}

.right-content {
    /* float: right; */
    width: 630px;
    text-align: left;
}

.right-content-main {
    float: right;
    width: 580px;
    text-align: left;
    margin-left: 20px;
}

.key-service {
    color: #888888;
    font-size: 22px;
    margin: 0;
}

.points-text {
    color: #3d3b3b;
    font-weight: 800;
    font-size: 28px;
    margin: 0;
}

.blue-hr {
    border-bottom-style: solid;
    border-color: #4c98fc;
    border-bottom-width: 4px;
    margin-top: 10px;
    margin-bottom: 0;
    width: 10%;
    float: left;
}

.right-content p {
    font-size: 16px;
}

ul.points-list {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 13px;
}

li.points-list {
    padding: 8px 0;
    border-bottom: 1px solid #efefef;
}

.skip-types-outer {
    width: 100%;
}

.skip-types-banner {
    background: #4c98fc;
    padding: 25px 30px;
    color: white;
    font-size: 30px;
    font-weight: 800;
}

.skip-types-section {
    background: #f4f4f4;
    padding: 10px;
    border-bottom-style: solid;
    border-color: #999999;
    border-bottom-width: 2px;
    margin-top: 0;
    margin-bottom: 0;

}

.skip-types-left img {
    width: 230px;
    margin-right: 10px;
}

.skip-types-left {
    float: left;
    padding-left: 10px;
}

.skip-types-right p {
    overflow: auto;
}

.skip-types-right h3 {
    margin-top: 0;
}

.mail-us {
    margin-bottom: 0;
    color: white;
}

.large-number {
    font-size: 20px;
    color: #fff;
    font-weight: bold;
    margin: 0;
}

.footer-bottom {
    background: #272727;
    color: white;
    padding: 15px 0 13px 0;
    font-size: 13px;
}

.footer-bottom-left,
.footer-bottom-right {
    width: 49%;
    float: left;
}

.footer-bottom-right ul {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: right;
}

.footer-bottom-right ul li {
    display: inline-block;
    margin: 0 0 0 20px;
    padding: 0;
}

/* Footer */

.footer-distributed {
    background-color: #454545;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
    box-sizing: border-box;
    width: 100%;
    text-align: left;
    padding: 60px 0 20px;
    margin-top: 80px;
    color: #fff;
    margin-top: -1px;
}

.footer-distributed .footer-left,
.footer-distributed .footer-center,
.footer-distributed .footer-right {
    display: inline-block;
    vertical-align: top;
}

.footer-distributed {
    font-weight: 700;
    font-size: 15px;
}


/* Footer left */
.footer-left,
.footer-center,
.footer-right {
    width: 33%;
}


/* Footer links */

.footer-distributed .footer-links {
    color: #ffffff;
    margin: 20px 0 12px;
    padding: 0;
}

.footer-distributed .footer-links a {
    display: inline-block;
    line-height: 1.8;
    text-decoration: none;
    color: inherit;
}


/* Footer Center */

.footer-distributed .footer-center i {
    background-color: #33383b;
    color: #ffffff;
    font-size: 25px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    text-align: center;
    line-height: 42px;
    margin: 10px 15px;
    vertical-align: middle;
}

/* .footer-distributed {
  display: inline-block;
  color: #ffffff;
  vertical-align: middle;
  /* margin: 0; */
}

.footer-distributed {
    display: block;
    font-weight: normal;
    font-size: 14px;
    line-height: 2;
}

*/ .footer-distributed .footer-center p a {
    color: #5383d3;
    text-decoration: none;
    ;
}


/* Footer Right */

.footer-distributed .footer-company-about {
    line-height: 20px;
    color: #92999f;
    font-size: 13px;
    font-weight: normal;
    margin: 0;
}

.footer-distributed .footer-company-about span {
    display: block;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 20px;
}

.footer-distributed .footer-icons {
    margin-top: 25px;
}

.footer-distributed .footer-icons a {
    display: inline-block;
    width: 35px;
    height: 35px;
    cursor: pointer;
    background-color: #33383b;
    border-radius: 2px;
    font-size: 20px;
    color: #ffffff;
    text-align: center;
    line-height: 35px;
    margin-right: 3px;
    margin-bottom: 5px;
}


/* If you don't want the footer to be responsive, remove these media queries */

@media (max-width: 880px) {
    .footer-distributed {
        font: bold 14px sans-serif;
    }

    .footer-distributed .footer-left,
    .footer-distributed .footer-center,
    .footer-distributed .footer-right {
        display: block;
        width: 100%;
        margin-bottom: 40px;
        text-align: center;
    }

    .footer-distributed .footer-center i {
        margin-left: 0;
    }
}







.footer-triangle {
    margin-bottom: -5px;
}

.show_hide {
    text-decoration: none;
    border-radius: 3px;
    padding: 11px 34px;
    text-align: center;
    font-weight: bold;
    color: #4c98fc;
    float: left;
    font-size: 16px;
    border: 2px solid #4c98fc;
    background: white;
}

.show_hide:hover {
    background: #1667d1;
    border-color: #1667d1;
    transition: .3s;
    cursor: pointer;
    color: white;
}

@media screen and (max-width:680px) {
    .quarts {
        width: 49% !important;
    }
}