.fuelbook-search-header {
  /*margin-top: env(safe-area-inset-top, 20px) !important;*/
  padding-top: env(safe-area-inset-top) !important;
}

.nav-logo{background-size:28px 28px; height:45px;}
.header-logo{background-size:28px 28px; width:50px;}
.footer .footer-logo{background-size:80px 80px;	height:80px!important; margin-bottom:20px!important;}

.theme-light .header .header-logo{background-image:url(../images/preload-logo.png);}
.theme-light .menu .nav-logo{background-image:url(../images/preload-logo.png);}
.theme-light .footer .footer-logo{background-image:url(../images/preload-logo.png);}

.theme-dark .header .header-logo{background-image:url(../images/preload-logo.png);}
.theme-dark .menu .nav-logo{background-image:url(../images/preload-logo.png);}
.theme-dark .footer .footer-logo{background-image:url(../images/preload-logo.png);}

.badge {
    display: inline-block;
    padding: 0.25em 0.4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

@media (prefers-reduced-motion: reduce) {
    .badge {
        transition: none;
    }
}

a.badge:hover, a.badge:focus {
    text-decoration: none;
}

.badge:empty {
    display: none;
}

.btn .badge {
    position: relative;
    top: -1px;
}

.badge-pill {
    padding-right: 0.6em;
    padding-left: 0.6em;
    border-radius: 10rem;
}

.badge-primary {
    color: #fff;
    background-color: #007bff;
}

a.badge-primary:hover, a.badge-primary:focus {
    color: #fff;
    background-color: #0062cc;
}

a.badge-primary:focus, a.badge-primary.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

.badge-secondary {
    color: #fff;
    background-color: #6c757d;
}

a.badge-secondary:hover, a.badge-secondary:focus {
    color: #fff;
    background-color: #545b62;
}

a.badge-secondary:focus, a.badge-secondary.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
}

.badge-success {
    color: #fff;
    background-color: #28a745;
}

a.badge-success:hover, a.badge-success:focus {
    color: #fff;
    background-color: #1e7e34;
}

a.badge-success:focus, a.badge-success.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}

.badge-info {
    color: #fff;
    background-color: #17a2b8;
}

a.badge-info:hover, a.badge-info:focus {
    color: #fff;
    background-color: #117a8b;
}

a.badge-info:focus, a.badge-info.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
}

.badge-warning {
    color: #212529;
    background-color: #ffc107;
}

a.badge-warning:hover, a.badge-warning:focus {
    color: #212529;
    background-color: #d39e00;
}

a.badge-warning:focus, a.badge-warning.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
}

.badge-danger {
    color: #fff;
    background-color: #dc3545;
}

a.badge-danger:hover, a.badge-danger:focus {
    color: #fff;
    background-color: #bd2130;
}

a.badge-danger:focus, a.badge-danger.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
}

.badge-light {
    color: #212529;
    background-color: #f8f9fa;
}

a.badge-light:hover, a.badge-light:focus {
    color: #212529;
    background-color: #dae0e5;
}

a.badge-light:focus, a.badge-light.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
}

.badge-dark {
    color: #fff;
    background-color: #343a40;
}

a.badge-dark:hover, a.badge-dark:focus {
    color: #fff;
    background-color: #1d2124;
}

a.badge-dark:focus, a.badge-dark.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
}

.font-size-12 {
    font-size: 12px !important;
}

.font-size-14 {
    font-size: 14px !important;
}

.font-size-16 {
    font-size: 16px !important;
}

.font-size-18 {
    font-size: 18px !important;
}

.color-gray {
    color: gray !important;
}

.bg-light-gray{ background-color: rgba(234, 105, 176, 0.38)
}

.table-borders, td{
    border: 1px solid lightgray !important;
    border-collapse: collapse !important;
}

.td-left {
    text-align: left !important;
}

.td-right {
    text-align: right !important;
}

.px-pd-right-10 {
    padding-right: 10px !important;
}

.px-pd-left-10 {
    padding-left: 10px !important;
}

.td-width-half {
    width: 50% !important;
}

.fuel-days,
.fuel-services,
.fuel-truck-stop-chains,
.fuel-interstates-highways,
.fuel-states-provinces{
    position: fixed;
    top:0px;
    left: 0px;
    width: 100%;
    background-color: #f0f0f0;
    height: 100%;
    display: none;
}
.listing-items{
    list-style: none;
    list-style-type: none;
    padding : 0px;
    margin : 0px;
}
.listing-items li{
    list-style: none;
    list-style-type: none;
    border-bottom: solid 1px rgba(0,0,0,0.05);
    padding : 10px 10px;
}
.listing-items li label{
    display: inline-block;
    vertical-align: middle;
    width: 90%;
}
.listing-items li input{
    float: right;
    vertical-align: middle;
    margin-top: 8px;
    width: 10%;
}
.fuel-days .back-to-lists,
.fuel-services .back-to-lists,
.fuel-truck-stop-chains .back-to-lists,
.fuel-interstates-highways .back-to-lists,
.fuel-states-provinces .back-to-lists{
    display: inline-block;
    margin-right: 10px;
}
.days-fields-lists{
    padding: 20px;
}
.days-fields-lists .input-style span{
    background: #FFFFFF;
    margin-top: -6px;
}

.fuel-nearby-search-btn{
    width: 92%;
    background-color: #1f2d3e;
    padding: 20px;
    font-size: 18px;
    color: #19B383;
    text-align: center;
    /*bottom: 80px;*/
    position: fixed;
    z-index: 1;
}
.fuel-listing-contaier{
    margin: 10px 5px;
}
.fuel-list-item{
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b4e391+0,61c419+50,b4e391+100;Green+3D */
    background: #b4e391; /* Old browsers */
    background: -moz-linear-gradient(top,  #b4e391 0%, #61c419 50%, #b4e391 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4e391', endColorstr='#b4e391',GradientType=0 ); /* IE6-9 */
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 10px;
}
.fuel-list-item > .fiel-list-item-detail > a{
    color : #000000;
}

.service-and-amenities-content-wrapper{
    height: 290px;
    overflow: auto;
}
.service-and-amenities-new-content-wrapper{
    height: 145;
    overflow: auto;
}

.fuel-list-item .fuel-list-header{
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b4e391+0,61c419+50,b4e391+100;Green+3D */
    background: #b4e391; /* Old browsers */
    background: -moz-linear-gradient(top,  #b4e391 0%, #61c419 50%, #b4e391 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4e391', endColorstr='#b4e391',GradientType=0 ); /* IE6-9 */
    color : #FFFFFF;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    padding: 4px 0px;
    border : 1px solid #299A0B;
}
.fuel-list-item .fuel-list-header .fuel-list-title{
    width: 79%;
    display: inline-block;
    vertical-align: top;
    padding-left : 10px;
}
.fuel-list-item .fuel-list-header .fuel-list-price{
    width: 20%;
    display: inline-block;
    vertical-align: top;
    border-left : 1px solid #299A0B;
    text-align: center;
}
.fuel-list-item .fuel-list-content{
    background-color: #E7E7E7;
    padding: 10px 5px;
    height: 109px;
    border-bottom-right-radius: 8px;
}
.fuel-list-item .fuel-list-content .fuel-content-detail{
    background-color: #FFFFFF;
    padding : 10px;
    line-height: 16px;
    width: 58%;
    display: inline-block;
    vertical-align: top;
}
.fuel-list-item .fuel-list-content .fuel-content-buttons{
    width: 40%;
    display: inline-block;
    vertical-align: top;
}
.fuel-list-item .fuel-list-content .fuel-content-buttons button{
    width: 100%;
    display: block;
    background: #FFFFFF;
    color: green;
    text-align: center;
    margin-bottom: 3px;
    padding: 4.5px;
    height: 32.5px;
}
.fuel-list-item .fuel-list-content .fuel-content-footer .fuel-footer-subject{
    font-size: 12px;
    width: 58%;
    display: inline-block;
    vertical-align: top;
}
.fuel-list-item .fuel-list-content .fuel-content-footer .fuel-footer-date{
    font-size: 12px;
    width: 40%;
    display: inline-block;
    vertical-align: top;
    text-align: center;
}

.fuelbook-detail-content .fuelbook-detail .fuelbook-detail-header{
    background-color: #191919;
    color : #FFFFFF;
    padding : 20px 15px;
    border-bottom : 1px solid #505050;
}
.fuelbook-detail-content .fuelbook-detail .fuelbook-detail-title{
    font-size : 16px;
}
.fuelbook-detail-content .fuelbook-detail .fuelbook-detail-address{
    line-height: 15px;
}
.fuelbook-detail-content .fuelbook-detail .fuelbook-diesel-price{
    font-weight: bold;
}
.fuelbook-detail-content .fuelbook-detail .fuelbook-diesel-price{
    font-weight: bold;
    overflow: hidden;
}
.fuelbook-detail-content .fuelbook-detail .fuelbook-diesel-price .fuelbook-diesel-detail{
    float: left;
    margin-top: 15px;
}
.fuelbook-detail-content .fuelbook-detail .fuelbook-diesel-price .fuelbook-diesel-detail-price{
    float: right;
    font-size: 16px;
    margin-top: 15px;
}

.fuelbook-detail-content .fuelbook-detail .fuelbook-detail-contact{
    color : #FFFFFF;
    padding: 5px;
    right: 0;
    top: 0;
    position: absolute;
}
.fuelbook-detail-content .fuelbook-detail .fuelbook-detail-contact .fuelbook-detail-contact-map{
    display: inline-block;
    vertical-align: top;
    text-align: center;
    padding-right: 5px;
}
.fuelbook-detail-content .fuelbook-detail .fuelbook-detail-contact .fuelbook-detail-contact-call{
    display: inline-block;
    vertical-align: top;
    text-align: center;
}
.fuelbook-detail-content .fuelbook-detail .fuelbook-detail-contact .fuelbook-detail-contact-call .contact-call-icon,
.fuelbook-detail-content .fuelbook-detail .fuelbook-detail-contact .fuelbook-detail-contact-map .contact-call-icon{
    font-size: 15px;
    display: block;
    margin-bottom: 10px;
    color : #FD4904;
}
.fuelbook-detail-content .fuelbook-detail .fuelbook-detail-contact .fuelbook-detail-contact-call .contact-call-text,
.fuelbook-detail-content .fuelbook-detail .fuelbook-detail-contact .fuelbook-detail-contact-map .contact-call-text{
    font-size: 15px;
    color : #FD4904;
}

.fuel-map-parking-list .fuel-parking-list .fuel-parking-list-item{
    background-color: #FFFFFF;
    color : #000000;
    padding : 10px;
    margin: 10px 0;
}
.fuel-map-parking-list .fuel-parking-list .fuel-parking-list-item .parking-list-item-image{
    width: 20%;
    display: inline-block;
    vertical-align: top;
}
.fuel-map-parking-list .fuel-parking-list .fuel-parking-list-item .parking-list-item-image img{
    display: block;
    height: 50%;
    width: 50%;
    max-width: 100%;
}
.fuel-map-parking-list .fuel-parking-list .fuel-parking-list-item .parking-list-item-detail{
    width: 55%;
    display: inline-block;
    vertical-align: top;
    line-height: 20px;
    padding-top: 15px;
    padding-left: 15px;
}
.fuel-map-parking-list .fuel-parking-list .fuel-parking-list-item .parking-list-item-link{
    width: 23%;
    display: inline-block;
    vertical-align: top;
    text-align: right;
    padding-top: 23px;
}
.fuel-map-parking-list.fuel-parking-list .fuel-parking-list-item .parking-list-item-link a{
    color : #000000;
}

.services-and-amenities-table tr th,
.services-and-amenities-table tr td{
    padding : 0px 10px;
}
.services-and-amenities-table tr td,
.services-and-amenities-table tr th,
.services-and-amenities-table tr{
    border : 0px !important;
    text-align: left;
}
.services-and-amenities-table tr td span.make-circle,
.services-and-amenities-table tr th span.make-circle{
    background-color: #AAAAAA;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}
.services-and-amenities-table tr td span.make-circle.active,
.services-and-amenities-table tr th span.make-circle.active{
    background-color: #12AE17;
}
.services-and-amenities-table tr th{
    position: sticky;
    top: 0;
}
#load-map-container{
    float: right;
    color : #FFFFFF;
}
#load-fuel-list-container{
    color : #FFFFFF;
}
.fuel-search-map-result{
    position: fixed;
    top: 0px;
    bottom: 0px;
    left:0px;
    width : 100%;
    height: 100%;
    padding: 0px !important;
    display: none;
}
.fuel-map-marker-tabs a{
    float: left;
    vertical-align: top;
    width: 50%;
    background-color: #656D78;
    color : #FFFFFF;
    padding: 10px 20px;
    text-align: center;
    border-bottom : 3px solid #656D78;
}
.fuel-map-marker-tabs a.active{
    background-color : #19B383;
    border-bottom : 3px solid #656D78;
    font-weight: bold;
}
.fuel-search-map-result #fuel-load-map{
    width: 100vw;
    height: 100vh;
}

.btn-group{
    display: inline-block;
    float: right;
    background-color: #505050;
    border-radius: 8px;
}
.btn-group button {
    background-color: transparent;
    color: white; /* White text */
    padding: 10px 24px; /* Some padding */
    cursor: pointer; /* Pointer/hand icon */
    float: left; /* Float the buttons side by side */
}
.btn-group button.load-fuel-list-container.active{
    background-color: #19B383;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}
.btn-group button.load-map-container.active{
    background-color: #19B383;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}
.btn-group button:not(:last-child) {
  border-right: none; /* Prevent double borders */
}

/* Clear floats (clearfix hack) */
.btn-group:after {
  content: "";
  clear: both;
  display: table;
}

.margin-lf-0{
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.price-em{
    font-size:9px;
    font-weight:700;
    border-radius:4px;
    position:absolute;
    top:10px;
    right:10px;
    line-height:18px;
    text-align:center;
    font-style:normal;
    z-index:2;
    color:#FFF;
    padding:0px 8px 0px 8px;
}

.page-bg{
    /*background-color: #34455D !important;*/
    z-index: -1 !important;
}

.bg-fuelbook-home-efs{
    background-image:url(../images/pictures/efs-plain-card.png)  !important;
}

.bg-fuelbook-detail-ta{
    background-image:url(../images/pictures/TAFuelStop.jpg)  !important;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.bg-fuelbook-detail-love{
    background-image: url(../images/pictures/love.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.bg-fuelbook-detail-pilot{
    background-image: url(../images/pictures/pilot.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#price-listing tr:hover td{
    cursor: pointer;
    background-color: lightgray;
}

.header{
    background-color: #34455D !important;
    /*margin-top: 10px;*/
}
.header-title{
    color: #19B383 !important;
    font-weight: bold !important;
    font-size: 15px !important;
}

#footer-bar {
    background-color: #34455D !important;
}
#footer-bar a{
    color: #FFFFFF  !important;
}

#footer-bar a span{
    font-size: 12px !important;
}

.bg-header {
    background-color: #34455D !important;
    color: #19B383  !important;
    font-weight: bold !important;
    font-size: 14px!important;
}
#footer-menu {
    background-color: #34455D !important;
}
#footer-menu a{
    color: #FFFFFF  !important;
}

#footer-menu a span{
    font-size: 12px !important;
}
.button-done{
    position: fixed;
    top: 5px;
    right: 0;
    z-index: 999;
    background-color: #19B383;
    font-weight: bold;
}

.button-done:hover{
    background-color: #118866;
}

.theme-bg {
    background-color: #34455D;
}

.theme-tab-light{
    background-color: #34455D;
    color: #1ee3a0 !important;
}

.theme-color {
  color: #19B383 !important;
}

.sub-header {
    color: #19B383 !important;
    background-color: #51688c;
}
.card-status {
    background-color:transparent;
    border:solid 1px rgba(0,0,0,0.1);
    border-radius:10px!important;
    display:block;
    width:100%;
    height:50px;
    /*line-height:50px;*/
    padding:11px 14px;
    font-size:13px;
    -webkit-appearance: none;
}

.back-button > i {
    display: inline-block;
    margin: 0;
    padding: 9px;
    background: #DA4453;
    color: white;
    border: 1px solid #DA4453;
    border-radius: 8px;
}
#footer-bar{
    background: #34455D !important;
    position: fixed;
    border: 0;
    bottom: 0;
    padding: 10px;
    z-index: 9999;
    }
    #footer-bar a{color:#fff;}
    #page{min-height:100vh!important;}