:root {
            --primary-colour: #B44D12;
                --primary-colour-dark: #8D2B0B;
                --light-tint-colour: #FFEFe6;
                --cta-colour: #A61B1B;
    }

    footer, span.active-tab-line { background-color: var(--primary-colour) !important; }

    .e-ticket-benefits svg path, .tod-disadvantages svg path {
        fill: #fff;
    }

    .e-ticket-benefits .benefit-icon {
        background: var(--primary-colour) !important;
    }

    #saving {
        background: radial-gradient(ellipse 60% 70% at center, #B44D12 0%, #B44D1200 100%)
    }

    #headline.no-app-banners .container {
        border-top-color: #B44D12;
    }

    a, .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link, .btn-link {
        color: #B44D12;
    }

    div.dropdown, .ui-datepicker, .time-selections > :not(.spacer) {
        border-color: #B44D12 !important;
    }

    .switch > .dot {
        box-shadow: 0 0 0 2px #daa689aa !important;
        border-color: #daa689aa !important;
    }

    .time-selections > :not(.spacer) {
        color: #8D2B0B !important;
    }

    .btn-cancel, .letmechoose-warning .btn-link, .text-blue-normal, .remove .btn, .btn-create, .tw-navbar.navbar-dark .basket-items, .basket-items-row .basket-items {
        color: #B44D12 !important;
    }

    .bg-blue-normal {
         background-color: #B44D12 !important;
     }

    .input-button .div:hover {
        background-color: #B44D12 !important;
    }

    .dropdown-select, .station-input, .outline, .lists select.list, #moreOptionsModal .input, #moreOptionsModal .operator {
        border: 1px solid #CFCFCF !important;
    }

    .checkbox:checked ~ .runner {
        background-color: #B44D12 !important;
    }

    .journey-card.selected .top:not(.railsale-top) .curve-top, .journey-card.selected .bottom:not(.railsale-bottom) .bottom-item {
        background-color: #B44D12 !important;
    }

    .journey-card.selected .middle:not(.railsale-middle) {
        border-color: #B44D12 !important;
    }

    ._mdc-stepper ._mdc-stepper__step._mdc-stepper__step--active::before, ._mdc-stepper ._mdc-stepper__step._mdc-stepper__step--done::before {
        background-color: #B44D12;
    }


    .price-cell:focus {
        box-shadow: #fff 0 0 0 2px, #B44D1250 0 0 0 4px, #0000000d 0 1px 2px 0 !important;
    }

    .price-cell.selected {
        box-shadow: #fff 0 0 0 2px, #B44D12 0 0 0 4px, #0000000d 0 1px 2px 0 !important;
    }

    main.login-container {
        border-top-color: #ce672c;
    }

    .ui-datepicker-calendar td:not(.disruption) .ui-state-active {
        background: #B44D12 !important;
        color: #fff !important;
    }

    html {
        background: #B44D12 !important;
    }

    html.basebare-bg {
        background: unset !important;
    }

    .letmechoose-info .vertical-line {
        background-color: #B44D12 !important;
    }

    .switch-stations {
        background-color: #B44D12 !important;
        border: #B44D12 !important;
        color: #fff !important;
        path {
            fill: #fff !important;
        }
    }

    @media (max-width: 768px) {
        .switch-stations {
            background-color: #CFCFCF !important;
            color: #B44D12 !important;
            path {
                fill: #B44D12 !important;
            }
        }
    }


    .btn-primary, .btn-primary:disabled, .btn.primary {
        background-color: #A61B1B;
        border-color: #A61B1B;
    }

    .btn-primary:not(:disabled):hover {
        background-color: #920707;
        border-color: #920707;
    }

    .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem #bd323280;
    }

    .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle {
        background-color: #870000;
        border-color: #870000;
        box-shadow: 0 0 0 0.2rem #bd323280;
    }
    .btn-primary:not(:disabled):not(.disabled):focus, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle {
        background-color: #870000;
        border-color: #870000;
        box-shadow: 0 0 0 0.2rem #bd323280;
    }

    .text-blue-dark, .dropdown-select, .button, .section-one, .section-two, .title, #signInModal .signin-info, #moreOptionsModal .input {
        color: #8D2B0B !important;
    }

    .input-button .div:hover .button {
        border-color: transparent !important;
        color: rgb(255, 255, 255) !important;
    }

    .section-one {
        border-right-color: #8D2B0B !important;
    }

    .btn-outer[data-target="#moreOptionsModal"] .button, .js-summary-bar, #journeySummary a, .journey-card.selected .summary {
        color: #8D2B0B !important;
    }

    .journey-card:not(.selected) .top:not(.railsale-top) .shape, .icon.info {
        fill: #8D2B0B !important;
    }

    .journey-card:not(.selected) .top:not(.railsale-top) .curve-top, .journey-card:not(.selected) .bottom:not(.railsale-bottom) .bottom-item {
        background-color: #d39f82aa;
        color: #8D2B0B !important;
    }

    .journey-card .icon.info {
        fill: #ff9a5f;
    }

    #price-summary svg.icon.info.fill-white {
        fill: #fff !important;
    }

    #header > div, .tw-navbar.navbar-light .basket-items {
        background-color: #8D2B0Baa !important;
    }

    .letmechoose-price-container, .letmechoose-info.bottom, #price-summary .container, body.login, .bg-blue-dark, .ui-tooltip {
        background-color: #8D2B0B !important;
    }

    .selected .middle:not(.railsale-middle) .journey-line line, .selected .middle:not(.railsale-middle)  .journey-line circle, .js-modal line {
        stroke: #8D2B0B !important;
    }

    .selected .journey-line svg text, .journey-card.selected .icon.info {
        fill: #8D2B0B !important;
    }

    .navbar-light .navbar-nav .nav-link:hover, .bg-covid, .navbar-light .navbar-nav .nav-link:focus, mark,
    .navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active,
    .basket-empty-onaverage, .dropdown-header, .ui-datepicker-header, .ui-datepicker, .ui-datepicker-calendar th, .ui-datepicker-calendar .ui-state-default, a:hover {
        color: #8D2B0B;
    }

    .dropdown-header, select.list, .dropdown-select, .station-input, .label, .js-modal .modal-title, .letmechoose-warning-title {
        color: #8D2B0B !important;
    }

    .station-input::placeholder {
        color: #8D2B0Baa !important;
    }

    .switch-stations:hover {
        background-color: #8D2B0B !important;
        color: #fff !important;
        path {
            fill: #fff !important;
        }
    }

    .switch-stations:focus {
        background-color: #8D2B0B !important;
        color: #fff !important;
        path {
            fill: #fff !important;
        }
    }



    .letmechoose-info, #details, .hint, #datetime-summary, #share, mark, .breadcrumb {
        background-color: #FFEFe6 !important;
    }

    .ui-datepicker-calendar .ui-state-highlight {
        background-color: #FFEFe6;
    }

    .autosuggest__results-item-tabtarget:hover {
        background-color: #FFEFe6 !important;
    }

    .supplementary-notice {
        background-color: #FFEFe6;
        border-color: #d9c9c0;
        color: #8D2B0B;
    }


#hero-image {
  background-image: url("https://directus.trainsplit.com/assets/06be8434-bf0b-4478-a670-72380dbb430b") !important;
  background-position: middle;
}

@media 
(-webkit-min-device-pixel-ratio: 1.5), 
(min-resolution: 144dpi), (min-width: 1921px) { 
    #hero-image {
          background-image: url("https://directus.trainsplit.com/assets/84f7c688-c39e-495d-9210-cca5aac8dca0") !important;
          background-position: middle;
    }
}

#resultsTabLoading #spinner, #top-image {
  filter:saturate(1.5) hue-rotate(177deg);
}

.outer.image img {
  filter:saturate(1.5) hue-rotate(177deg);
}

#switch-to-old-banner {
  display: none !important;
}

@media (max-width:767.98px) {
 .tw-navbar.navbar-dark a.navbar-brand h1,
 .tw-navbar.navbar-light a.navbar-brand h1 {
  height:30px;
 }
}

@media (min-width: 767.98px) {
    #saving {
        height: 109px;
        font-size: 2rem;
        margin-bottom: 250px;
        margin-left: -1rem !important;
        margin-right: -1rem !important;
        max-width: calc(100% + 2rem) !important;
    }
}

#saving {
    background: #3332;
    backdrop-filter: blur(6px);
}

#journey-planner-container {
  margin-top: 0;
}

#apps {
  background-color: #E1E1E1;
}

body {
  background-color: #F7F7F7;
}

html {
  background: transparent !important;
}
