@charset "UTF-8";
/* 
.bg-img { 
    background-image: url($BASE_URL + 'images/Background-Texture-576px.jpg');
}
*/
/*
@media (min-width: 576px) {
    .bg-img {
        background-image: url($BASE_URL + 'images/Background-Texture-768px.jpg');
    }
}
*/
@media (max-width: 992px) {
  .navbar > .container {
    padding: 0;
    max-width: 100%;
  }
  .navbar-nav > li {
    margin: 15px 10px 15px 25px;
    padding: 0;
  }
  .navbar-nav li.show:after {
    content: "" !important;
  }
  .navbar-nav li:last-child {
    margin: 15px 10px 15px 25px;
    position: relative;
  }
  .navbar-nav .menuItem li:last-child {
    margin: 8px 10px 0 0;
  }
  .navbar-nav li a {
    color: #fff !important;
    width: 100%;
    text-align: left;
    margin-left: 0 !important;
    display: block;
  }
  .navbar-nav li a:before {
    padding-right: 20px;
  }
  .btn-nav {
    background-color: transparent;
    color: #ffffff !important;
    border: none;
    padding: 0;
    border-radius: 0;
    top: 0;
  }
  .btn-nav:hover {
    color: #fff;
    background-color: transparent;
    border: none;
  }
  li.dropdown ul.dropdown-menu {
    display: none !important;
  }
  li.dropdown ul.dropdown-menu.show {
    display: block !important;
  }
  .menuItem li {
    width: 100%;
  }
  ul.dropdown-menu .menuItem li a {
    padding: 5px 0 5px 15px;
    width: 100%;
    float: left;
    font-weight: normal;
    display: block;
  }
  .dropdown-menu {
    box-shadow: none;
    border: none;
    border-radius: 0;
    width: 100%;
    margin-top: 0;
    background-color: transparent;
  }
  .dropdown-menu:after {
    display: none;
  }
  .navbar-dark .navbar-toggler {
    border-color: transparent;
  }
  .prod-details-li-item {
    width: 100%;
    text-align: center;
  }
  .product-details-nav-inner {
    width: 100%;
  }
  #singleProduct .nav-link {
    padding: 10px 0px 10px 0;
  }
  .tab_drawer_heading.d_active {
    color: #ff9900 !important;
  }
  .tab_drawer_heading {
    padding: 10px 0px;
    background-color: #ffffff;
    color: #AEAFB0 !important;
    margin-bottom: 0px;
  }
  .slider {
    width: 100%;
    left: 0;
  }
  .slideContainer {
    left: -310px;
  }
  .slideHouse {
    right: -70% !important;
  }
}

@media (min-width: 1140px) {
  #singleProdTabContent {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0px 15px;
  }
}

@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
  /* IE10+ specific styles go here */
  .graphicContainer {
    left: -275px;
  }
  .graphicHose {
    height: 470px;
  }
  .graphicHouse {
    right: -500px;
    bottom: -100px;
  }
  #trustpoints .fas {
    margin-top: 10px;
  }
}

@media (min-width: 320px) {
  .faq-card-body {
    margin-left: 24%;
    margin-right: 40px;
    width: calc(100% - 24% - 37px);
  }
  footer {
    font-size: 18px;
  }
  .county-quote-btn {
    position: relative;
    top: 10px;
    margin: 20px 0px;
  }
}

@media (min-width: 440px) {
  #status-toggle-text {
    display: inline;
  }
}

@media (min-width: 576px) {
  .smoke-base .dialog {
    height: auto;
  }
  .smoke-base .dialog-inner {
    overflow-y: hidden !important;
  }
  .p-sm-2 {
    padding: 1rem !important;
  }
  .faq-card-body {
    margin-left: 133px;
    margin-right: 60px;
    width: calc(100% - 193px);
  }
  footer {
    font-size: 12px;
  }
  .county-quote-btn {
    position: relative;
    top: 10px;
  }
  .cartWrap {
    padding: 40px;
  }
  .mobileCart.cartWrap {
    box-shadow: 0px 0px 10px -1px #7d7d7d;
    -ms-box-shadow: 0px 0px 10px -1px #7d7d7d;
    border-radius: 15px;
    padding: 20px;
  }
  img {
    width: 100%;
  }
  .btn-quote {
    display: inline-block;
  }
  ul.nav.socialmenu.mod-list > li {
    width: auto;
    margin: auto;
  }
  ul.nav.socialmenu.mod-list > li > a {
    width: auto;
    display: block;
    height: auto;
  }
  ul.nav.socialmenu.mod-list > li > a > i {
    float: none;
    margin-top: auto;
  }
  .nav-status-left {
    width: 20%;
  }
  .nav-status-right {
    width: 100%;
    margin-right: 30px;
  }
  .status-text {
    display: flex;
  }
  .nav-banner-logo {
    width: 457px;
  }
  .quoteForm .radioContainer {
    margin-left: 0;
  }
  .infoTip {
    left: 0;
  }
  .addtocart-bar input[type=text],
  .addtocart-bar input[type=submit] {
    width: 140px;
  }
}

/* Small devices (tablets, 768px and up) */
@media screen and (min-width: 768px) {
  .nav-tabs.nav-justified > li > a {
    padding: 10px 20px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .nav-tabs-dropdown li:hover,
  .nav-tabs-dropdown li.active {
    -webkit-box-shadow: 0px 0px 10px 0px #879c7d;
    -moz-box-shadow: 0px 0px 10px 0px #879c7d;
    box-shadow: 0px 0px 10px 0px #879c7d;
    border: 1px solid #58aa69;
  }
  .password-reset main {
    /* account/password-reset page min height */
    min-height: calc(100vh - 497px - 60px);
  }
  .login main {
    /* login page min height */
    min-height: calc(100vh - 497px - 60px);
  }
  .account main {
    /* login page min height */
    min-height: calc(100vh - 497px - 60px);
  }
  .front.home main .row #aboveContent {
    margin-top: 0px !important;
  }
  .image-med {
    width: 50%;
  }
  .faq-card-body {
    margin-left: 65px;
    margin-right: 40px;
    width: calc(100% - 105px);
  }
  .county-quote-btn {
    position: relative;
    top: -150px;
    margin: 0px 0px;
  }
  .category-view ul {
    padding: 50px 0;
  }
  div.col.text-center.testimonialTitle h1 {
    margin: 50px;
    padding: 25px 0;
  }
  .resultCont {
    padding: 25px 0;
  }
  .newsItem {
    margin-bottom: 0px;
  }
  #countyBlogBG {
    background-size: contain;
  }
  #countyBlogBG img {
    width: 60%;
  }
  a.logo {
    width: 265px;
  }
  form label {
    font-size: 1.1rem;
  }
  #contactDetails p,
  #addressDetails p,
  #deliveryDetails p,
  .accountPreferences p,
  #refillReminder p {
    font-size: 1.1rem;
  }
  #welcomeBack .nav-item {
    width: auto;
    margin: 5px;
    padding-right: 30px;
  }
  #com-form-login-password label {
    padding-top: 0;
  }
  div#com-form-login-submit input {
    margin-bottom: 0;
  }
  .accountPreferences select,
  input#jform_profile_tanksize {
    width: 20%;
  }
  div#com-form-login-username,
  div#com-form-login-password {
    margin-right: 20px;
    width: 40%;
  }
  .orderlistcontainer {
    width: 300px;
  }
  /* .navbar-nav li a {
        margin: 20px 0 0 20px;
    } */
  /* CONTACT CENTRE
    *********************************************/
  .contact-centre .tab-content {
    width: 100%;
    margin: 0;
  }
  ul.nav.nav-tabs.nav-justified.nav-tabs-dropdown.container {
    width: 100%;
  }
  h1 {
    margin-top: 0;
    font-size: 2rem;
  }
  h2 {
    font-size: 1.75rem;
  }
  h3,
  .carousel-item h1 {
    font-size: 1.75rem;
  }
  h4 {
    font-size: 1.5rem;
  }
  h5 {
    font-size: 1.25rem;
  }
  h6 {
    font-size: 1.25rem;
  }
  #welcomeBack .nav-item {
    margin: 5px;
    width: 100%;
  }
  #trustpoints .nav-link {
    width: 100%;
    max-width: 250px;
    margin: 10px auto;
  }
  .rewardLoginForm {
    width: 80%;
    min-height: 70%;
  }
  .borderLeftGreen {
    border-left: 1px solid #ECF6ED;
  }
  .loginContent img {
    width: 65%;
    min-width: 250px;
  }
  #foam-img {
    width: 300px;
  }
  .nav-status-left {
    width: 50%;
  }
  .nav-status-right {
    width: 70%;
  }
  .nav-banner-logo {
    width: 457px;
    height: auto;
  }
  .nav-banner-secondary {
    width: 230px;
    height: auto;
    margin: 0;
    display: block;
  }
  .quoteFormInput label {
    width: 100%;
  }
  .quoteForm .quoteFormInput,
  .quoteForm .btn-quote {
    width: 400px;
  }
  .infoTip {
    width: 100%;
    left: 0vw;
  }
  .addtocart-bar input[type=text] {
    width: 100px;
  }
  .addtocart-bar input[type=submit] {
    padding: 2.5px 0 !important;
  }
}

@media screen and (min-width: 992px) {
  .smoke-base .dialog {
    top: 25%;
    width: 40%;
    left: 50%;
    margin-left: -20%;
  }
  #welcomeBack .nav-item {
    margin: 5px;
  }
  /* Adjust Home Page - AWARD WINNING SERVICE SECTION / ANIMATION OVERLAP */
  .front.home main, .site.welcome-heating-oil-customers main {
    margin-top: 0;
  }
  .password-reset main {
    /* account/password-reset page min height */
    min-height: calc(100vh - 435px - 126px);
  }
  .login main {
    /* login page min height */
    min-height: calc(100vh - 435px - 126px);
  }
  .account main {
    /* login page min height */
    min-height: calc(100vh - 435px - 126px);
  }
  .faq-card-body {
    margin-left: 85px;
    margin-right: 40px;
    width: calc(100% - 125px);
  }
  .county-quote-btn {
    position: relative;
    top: -150px;
  }
  ul.navbar-nav {
    position: relative;
  }
  .navbar {
    height: 35px;
  }
  .navbar-expand-lg .navbar-nav .dropdown-menu {
    position: absolute;
    top: 60px;
    left: 155%;
    margin: 0 auto;
    transform: translateX(-50%);
  }
  .navbar-nav > li.dropdown::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 30px 30px;
    border-color: transparent transparent #fff transparent;
    z-index: 9998;
    opacity: 0;
    top: 30px;
    left: 50%;
    transform: translateX(-140%);
    margin: 0 50px;
  }
  .navbar-nav > li.dropdown:hover::after {
    opacity: 1;
  }
  .navbar-nav > li::after,
  .navbar-nav > li:hover::after,
  .navbar-nav > li.dropdown:hover::after {
    content: "" !important;
  }
  .navbar-nav .menuItem li {
    margin: 0;
  }
  .cartWrap,
  .shadowBox {
    margin: 0;
  }
  ul#loginOrRegister .nav-item:first-child {
    padding-right: 10px;
  }
  #loginOrRegister .nav-item a.btn {
  	    padding: 5px 30px;
  }
  #loginOrRegister .nav-item {
    margin-bottom: -1px;
    display: block;
    width: auto;
    margin:0;
    padding-right:10px;
  }
  #loginFormSection {
    padding: 50px;
  }
  div#buttonSwitchSection {
    padding: 50px;
  }
  h1 {
    margin-top: 0;
    font-size: 2.25rem;
  }
  h2 {
    font-size: 2rem;
  }
  h3,
  .carousel-item h1 {
    font-size: 2rem;
  }
  h4 {
    font-size: 1.5rem;
  }
  h5 {
    font-size: 1.25rem;
  }
  h6 {
    font-size: 1.25rem;
  }
  li.item-101 ul.dropdown-menu {
    transform: translateX(-24%) !important;
  }
  li.item-140 ul.dropdown-menu {
    transform: translateX(-40%) !important;
  }
  li.item-121 ul.dropdown-menu {
    transform: translateX(-55%) !important;
  }
  li.item-120 ul.dropdown-menu {
    transform: translateX(-71%) !important;
  }
  .dropdown-menu .menuItem li a {
    padding: 10px 0px;
  }
  .navbar-nav li.dropdown a.dropdown-toggle,
  .navbar-nav li.menu-330 a,
  .navbar-nav li.menu-331 a {
    padding: 0 20px;
  }
  .navbar-nav li.menu-330,
  .navbar-nav li.menu-331 {
    cursor: pointer;
  }
  .navbar-nav .menu-263 i.fa-home-heart {
    margin-right: 0px !important;
  }
  .nav-status-left span {
    display: block;
    position: relative;
    left: 0;
    top: 0;
    background-color: transparent;
    padding: 0 0 0 10px;
    width: 100%;
  }
  .nav-banner {
    box-shadow: none;
  }
  .borderLeftGreen {
    border-left: 1px solid #ECF6ED;
  }
  .stickyFooter {
    display: none;
  }
  .wrapper {
    transform: scale(1);
    margin-top: 0;
    margin-right: 0;
  }
  .quoteForm2 {
    height: 100%;
    width: 37%;
    position: absolute;
    left: 0;
    z-index: 10;
  }
  #quoteRightcarousel .carousel-inner {
    z-index: 9;
  }
  .quoteForm {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
  }
  #map-canvas {
    width: 100%;
    position: absolute;
    left: 0;
  }
  .slider {
    position: absolute;
    left: 37%;
    z-index: 9;
  }
  .quoteForm2 {
    height: 100%;
    width: 500px;
    position: absolute;
    left: 0;
  }
  .quoteForm {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
  }
  #map-canvas {
    width: 100%;
    position: absolute;
    left: 0;
  }
  .slider {
    position: absolute;
    left: 500px;
  }
  .nav-status-left {
    width: 60%;
  }
  .nav-status-right {
    width: 40%;
    margin-right: 0;
  }
  #navbarCollapse {
    background: transparent;
  }
  .infoTip {
    top: 0px;
  }
  #status-toggle {
    display: none;
  }
  .status-bar {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
  .status-data {
    width: auto;
    flex: 0 1 auto;
  }
  .voucher-data {
    display: flex;
    flex-direction: row;
    flex: 0 1 auto;
    width: auto;
  }
  .voucher-list {
    flex-direction: row;
  }
  .voucher-code {
    margin: 3px;
    padding: 1.5px 3px;
    font-size: 13px;
  }
  .nav-status-right .navbar-toggler {
    display: none;
  }
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  .password-reset main {
    /* account/password-reset page min height */
    min-height: calc(100vh - 399px - 126px);
  }
  .login main {
    /* login page min height */
    min-height: calc(100vh - 399px - 126px);
  }
  .account main {
    /* login page min height */
    min-height: calc(100vh - 399px - 126px);
  }
  .faq-card-body {
    margin-left: 100px;
    margin-right: 40px;
    width: calc(100% - 140px);
  }
  .county-quote-btn {
    position: relative;
    top: -100px;
  }
  .newsItem .newsIntro {
    margin-top: 0px;
  }
  nav .container {
    max-width: none;
    padding: 0 100px 0 10%;
  }
  div.orderLinks a {
    padding: 25px 40px;
  }
  .nav-banner > .container {
    background-image: url(../../../images/logos/Chevron.jpg);
  }
  .nav-banner-logo {
    width: 457px;
    height: auto;
    margin: 0;
  }
  .nav-banner-secondary {
    width: 273px;
    height: auto;
    margin: 0 100px 0 0;
  }
}

/* for higher resolutions (android and retina) */
@media screen and (max-width: 1024px) {
  .currentPriceContent b {
    font-size: 22px;
  }
}

@media screen and (max-width: 850px) {
  table {
    width: 100%;
  }
}

@media screen and (max-width: 760px) {
  .currentPrice {
    margin: -100px 10px 0;
    width: calc(100% - 20px);
  }
  #countySpecific {
    background-size: 100vw;
  }
}

@media screen and (max-width: 499px) {
  .currentPriceFlag {
    display: none;
  }
  .currentPriceContent {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .nav-tabs.nav-justified > li {
    float: none;
    background-color: transparent;
    border: none;
    text-align: center;
    padding: 0;
    border-radius: 0;
    margin: 0;
  }
  .nav-tabs.nav-tabs-dropdown,
  .nav-tabs-dropdown {
    border: 1px solid #A7C09F !important;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    height: 36px;
    background-color: #fff;
    padding: 0;
  }
  .nav-tabs.nav-tabs-dropdown::after,
  .nav-tabs-dropdown::after {
    position: absolute;
    top: 5px;
    right: 15px;
    z-index: 2;
    pointer-events: none;
    content: "\f0dc";
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    color: #2C6B37;
  }
  .nav-tabs.nav-tabs-dropdown.open a,
  .nav-tabs-dropdown.open a {
    position: relative;
    display: block;
  }
  .nav-tabs.nav-tabs-dropdown.open > li.active > a,
  .nav-tabs-dropdown.open > li.active > a {
    /* Change this color? */
    background-color: #F5FCF7;
  }
  .nav-tabs.nav-tabs-dropdown li,
  .nav-tabs-dropdown li {
    display: block;
    width: 100%;
    height: 25px;
    margin: 6px;
  }
  .nav-tabs.nav-tabs-dropdown > li > a,
  .nav-tabs-dropdown > li > a {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    display: contents;
    border-color: transparent;
  }
  .nav-tabs.nav-tabs-dropdown > li > a:focus,
  .nav-tabs-dropdown > li > a:focus,
  .nav-tabs.nav-tabs-dropdown > li > a:hover,
  .nav-tabs-dropdown > li > a:hover,
  .nav-tabs.nav-tabs-dropdown > li > a:active,
  .nav-tabs-dropdown > li > a:active {
    border-color: transparent;
  }
  .nav-tabs.nav-tabs-dropdown > li.active > a,
  .nav-tabs-dropdown > li.active > a {
    display: block;
    border-color: transparent;
    position: relative;
    z-index: 1;
    background: #fff;
  }
  .nav-tabs.nav-tabs-dropdown > li.active > a:focus,
  .nav-tabs-dropdown > li.active > a:focus,
  .nav-tabs.nav-tabs-dropdown > li.active > a:hover,
  .nav-tabs-dropdown > li.active > a:hover,
  .nav-tabs.nav-tabs-dropdown > li.active > a:active,
  .nav-tabs-dropdown > li.active > a:active {
    border-color: transparent;
  }
  .faqRight {
    border-radius: 15px;
  }
}

/* MEDIA QUERY OVERRIDES */
@media only screen and (min-width: 1200px) {
  .oil-arrow:before {
    left: 187px;
  }
  .qty-margin {
    margin-top: 0;
  }
}

@media only screen and (min-width: 576px) {
  .btn-mob {
    padding: 10px 40px;
  }
}

/* IE10+ specific styles go here */
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
  .graphicContainer {
    left: -275px;
  }
  .graphicHose {
    height: 470px;
  }
  .graphicHouse {
    right: -37%;
    bottom: -100px;
  }
}

@media screen and (min-width: 801px) {
  .uk-map-container > img {
    width: 50px;
  }
}

@media screen and (max-width: 499px) {
  .uk-map {
    margin-top: 25px;
    padding-top: 15px;
  }
   .graphicHose {
  	right: 0px;
    bottom: 0px;
  }
  _::-webkit-full-page-media, _:future, :root .graphicHose {
		right:-3px;
	}
}

@media screen and (max-width: 1024px) {
  #uk-map .map-region g:last-child {
    fill-opacity: 1;
  }
}

@media screen and (max-width: 499px) {
  .\31\/2--thumb,
  .\32\/4--thumb {
    width: 50%;
  }
  .\31\/3--thumb {
    width: 33.3333333333%;
  }
  .\32\/3--thumb {
    width: 66.6666666667%;
  }
  .\31\/4--thumb {
    width: 25%;
  }
  .\33\/4--thumb {
    width: 75%;
  }
}

@media screen and (min-width: 500px) and (max-width: 800px) {
  .\31\/2--handheld,
  .\32\/4--handheld {
    width: 50%;
  }
  .\31\/3--handheld {
    width: 33.3333333333%;
  }
  .\32\/3--handheld {
    width: 66.6666666667%;
  }
  .\31\/4--handheld {
    width: 25%;
  }
  .\33\/4--handheld {
    width: 75%;
  }
}

@media screen and (min-width: 500px) {
  .\31\/2--handheld-and-up,
  .\32\/4--handheld-and-up {
    width: 50%;
  }
  .\31\/3--handheld-and-up {
    width: 33.3333333333%;
  }
  .\32\/3--handheld-and-up {
    width: 66.6666666667%;
  }
  .\31\/4--handheld-and-up {
    width: 25%;
  }
  .\33\/4--handheld-and-up {
    width: 75%;
  }
}

@media screen and (max-width: 800px) {
  .\31\/2--pocket,
  .\32\/4--pocket {
    width: 50%;
  }
  .\31\/3--pocket {
    width: 33.3333333333%;
  }
  .\32\/3--pocket {
    width: 66.6666666667%;
  }
  .\31\/4--pocket {
    width: 25%;
  }
  .\33\/4--pocket {
    width: 75%;
  }
}

@media screen and (min-width: 801px) and (max-width: 1024px) {
  .\31\/2--lap,
  .\32\/4--lap {
    width: 50%;
  }
  .\31\/3--lap {
    width: 33.3333333333%;
  }
  .\32\/3--lap {
    width: 66.6666666667%;
  }
  .\31\/4--lap {
    width: 25%;
  }
  .\33\/4--lap {
    width: 75%;
  }
}

@media screen and (min-width: 801px) {
  .\31\/2--lap-and-up,
  .\32\/4--lap-and-up {
    width: 50%;
  }
  .\31\/3--lap-and-up {
    width: 33.3333333333%;
  }
  .\32\/3--lap-and-up {
    width: 66.6666666667%;
  }
  .\31\/4--lap-and-up {
    width: 25%;
  }
  .\33\/4--lap-and-up {
    width: 75%;
  }
}

@media screen and (max-width: 1024px) {
  .\31\/2--portable,
  .\32\/4--portable {
    width: 50%;
  }
  .\31\/3--portable {
    width: 33.3333333333%;
  }
  .\32\/3--portable {
    width: 66.6666666667%;
  }
  .\31\/4--portable {
    width: 25%;
  }
  .\33\/4--portable {
    width: 75%;
  }
}

@media screen and (min-width: 1025px) {
  .\31\/2--desk,
  .\32\/4--desk {
    width: 50%;
  }
  .\31\/3--desk {
    width: 33.3333333333%;
  }
  .\32\/3--desk {
    width: 66.6666666667%;
  }
  .\31\/4--desk {
    width: 25%;
  }
  .\33\/4--desk {
    width: 75%;
  }
}

@media screen and (min-width: 1160px) {
  .\31\/2--widescreen,
  .\32\/4--widescreen {
    width: 50%;
  }
  .\31\/3--widescreen {
    width: 33.3333333333%;
  }
  .\32\/3--widescreen {
    width: 66.6666666667%;
  }
  .\31\/4--widescreen {
    width: 25%;
  }
  .\33\/4--widescreen {
    width: 75%;
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
  .\31\/2--retina,
  .\32\/4--retina {
    width: 50%;
  }
  .\31\/3--retina {
    width: 33.3333333333%;
  }
  .\32\/3--retina {
    width: 66.6666666667%;
  }
  .\31\/4--retina {
    width: 25%;
  }
  .\33\/4--retina {
    width: 75%;
  }
}

#ccc #cc-panel h1 {
  color: #1b5d29 !important;
}

#ccc i.checkbox-checked {
  border: none!important;
}