html, body { border: 0; font-family: "Helvetica-Neue", "Helvetica", Arial, sans-serif; line-height: 1.5; margin: 0; padding: 0; } div, span, object, iframe, img, table, caption, thead, tbody, tfoot, tr, td, article, aside, canvas, details, figure, hgroup, menu, nav, footer, header, section, summary, mark, audio, video { border: 0; margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cit, code, del, dfn, em, ins, q, samp, small, strong, sub, sup, b, i, hr, dl, dt, dd, ol, ul, li, fieldset, legend, label { border: 0; font-size: 100%; vertical-align: baseline; margin: 0; padding: 0; } p { margin-bottom: 1em; } article, aside, canvas, figure, figure img, figcaption, hgroup, footer, header, nav, section, audio, video { display: block; } table { border-collapse: separate; border-spacing: 0; } table caption, table th, table td { text-align: left; vertical-align: middle; } a img { border: 0; } :focus { outline: 0; } @font-face { font-family: 'Abadi MT Std'; src: url('/fonts/ufonts.com_abadimtstd-opentype.woff') format("woff"), url('/fonts/AbadiMTStd-Regular.otf') format("opentype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Abadi MT Pro Bold'; src: url('/fonts/ufonts.com_abadimtstd-bold-opentype.woff') format("woff"), url('/fonts/AbadiMTPro-Bold.otf') format("opentype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Abadi MT Std ExtraLight'; src: url('/fonts/ufonts.com_abadimtstd-extralight-opentype.woff') format("woff"), url('/fonts/AbadiMTStd-ExtraLight.otf') format("opentype"); font-weight: lighter; font-style: normal; } @font-face { font-family: 'MuseoSans-700'; src: url('/content/fonts/275C8A_0_0.eot'); src: url('/content/fonts/275C8A_0_0.eot?#iefix') format('embedded-opentype'), url('/content/fonts/275C8A_0_0.woff') format('woff'), url('/content/fonts/275C8A_0_0.ttf') format('truetype'); } @font-face { font-family: 'MuseoSans-300'; src: url('/content/fonts/275C8A_1_0.eot'); src: url('/content/fonts/275C8A_1_0.eot?#iefix') format('embedded-opentype'), url('/content/fonts/275C8A_1_0.woff') format('woff'), url('/content/fonts/275C8A_1_0.ttf') format('truetype'); } @font-face { font-family: 'MuseoSans-900Italic'; src: url('/content/fonts/275C8A_2_0.eot'); src: url('/content/fonts/275C8A_2_0.eot?#iefix') format('embedded-opentype'), url('/content/fonts/275C8A_2_0.woff') format('woff'), url('/content/fonts/275C8A_2_0.ttf') format('truetype'); } @font-face { font-family: 'MuseoSans-500'; src: url('/content/fonts/275C8A_3_0.eot'); src: url('/content/fonts/275C8A_3_0.eot?#iefix') format('embedded-opentype'), url('/content/fonts/275C8A_3_0.woff') format('woff'), url('/content/fonts/275C8A_3_0.ttf') format('truetype'); } @font-face { font-family: 'MuseoSans-100'; src: url('/content/fonts/275C8A_4_0.eot'); src: url('/content/fonts/275C8A_4_0.eot?#iefix') format('embedded-opentype'), url('/content/fonts/275C8A_4_0.woff') format('woff'), url('/content/fonts/275C8A_4_0.ttf') format('truetype'); } @font-face { font-family: 'MuseoSans-700Italic'; src: url('/content/fonts/275C8A_5_0.eot'); src: url('/content/fonts/275C8A_5_0.eot?#iefix') format('embedded-opentype'), url('/content/fonts/275C8A_5_0.woff') format('woff'), url('/content/fonts/275C8A_5_0.ttf') format('truetype'); } @font-face { font-family: 'MuseoSans-300Italic'; src: url('/content/fonts/275C8A_6_0.eot'); src: url('/content/fonts/275C8A_6_0.eot?#iefix') format('embedded-opentype'), url('/content/fonts/275C8A_6_0.woff') format('woff'), url('/content/fonts/275C8A_6_0.ttf') format('truetype'); } @font-face { font-family: 'MuseoSans-100Italic'; src: url('/content/fonts/275C8A_7_0.eot'); src: url('/content/fonts/275C8A_7_0.eot?#iefix') format('embedded-opentype'), url('/content/fonts/275C8A_7_0.woff') format('woff'), url('/content/fonts/275C8A_7_0.ttf') format('truetype'); } @font-face { font-family: 'MuseoSans-500Italic'; src: url('/content/fonts/275C8A_8_0.eot'); src: url('/content/fonts/275C8A_8_0.eot?#iefix') format('embedded-opentype'), url('/content/fonts/275C8A_8_0.woff') format('woff'), url('/content/fonts/275C8A_8_0.ttf') format('truetype'); } @font-face { font-family: 'MuseoSans-900'; src: url('/content/fonts/275C8A_9_0.eot'); src: url('/content/fonts/275C8A_9_0.eot?#iefix') format('embedded-opentype'), url('/content/fonts/275C8A_9_0.woff') format('woff'), url('/content/fonts/275C8A_9_0.ttf') format('truetype'); } h1 { font-family: 'Abadi MT Pro Bold'; font-size: 56px; letter-spacing: -1.5px; } h2 { font-family: 'Abadi MT Pro Bold'; font-size: 30px; letter-spacing: 0.5px; } h3 { font-family: 'Abadi MT Pro Bold'; font-size: 20px; letter-spacing: 0.5px; } /* GENERAL */ /* HUGO */ /* KINCHBUS */ /* TRENT BARTON */ @media only screen and (max-width: 767px) { .view-tablet, .view-desktop, .view-tabletdesktop { display: none !important; } .row.flexFlipOrder { display: flex; flex-direction: column; margin: 0 !important; } .row.flexFlipOrder > div { margin: 1em 0 !important; width: 100%; flex: 1; } .row.flexFlipOrder > div:first-child { order: 2; } .row.flexFlipOrder > div:first-child h1 { padding: 0.25em; font-size: 32pt; line-height: 1em; } .row.flexFlipOrder > div:first-child .ticketImg { zoom: 0.5; } .row.flexFlipOrder > div:last-child { order: 1; } .row.flexFlipOrder > div:last-child select, .row.flexFlipOrder > div:last-child .button { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .view-desktop, .view-mobile { display: none !important; } } @media only screen and (min-width: 992px) { .view-mobile, .view-tablet, .view-mobiletablet { display: none !important; } } .main-nav ul.main > li > a { display: block; text-align: center; } .row.flexFlipOrder { margin: -1em; } .row.flexFlipOrder h1 { color: white !important; padding: 0 0.25em; } .row.flexFlipOrder > div { margin: 1em; } .ticketTypeCategory ul { margin: 0 1em; } .ticketTypeCategory .ticketType { margin-bottom: 1em; display: flex; } .ticketTypeCategory .ticketType img { max-width: 100%; } .ticketTypeCategory .ticketType > div { margin: 0.5em; } .ticketTypeCategory .ticketType .ticketImg { min-width: 150px; text-align: right; } .ticketTypeCategory .ticketType .content { flex-grow: 1; } .fourohfourholder { width: 100%; text-align: center; } .fourohfourholder img { margin: 0 auto; display: block; } .fourohfourholder .whoops { width: 60%; max-width: 600px; } .fourohfourholder .background { width: 80%; max-width: 800px; } .fourohfourholder p { margin: 0 auto; display: block; width: 100%; text-align: center; font-size: 8vw; } @media only screen and (min-width: 1100px) { .fourohfourholder p { font-size: 63pt; } } .fare-finder .ticketType { margin-top: 1em; } .fare-finder .ticketType > div, .fare-finder .ticketType2 > div { display: flex; width: 100%; align-items: center; } .fare-finder .ticketType > div .tt-image, .fare-finder .ticketType2 > div .tt-image { display: block; width: 27px; padding: 0.25em 1em 0.25em 0; min-width: 27px; max-width: 27px; text-align: center; height: 27px; } .fare-finder .ticketType > div .tt-name, .fare-finder .ticketType2 > div .tt-name { display: block; flex-grow: 1; } .fare-finder .ticketType > div .tt-price, .fare-finder .ticketType2 > div .tt-price { display: block; min-width: 55px; } .priceButtonHolder { justify-content: space-between; display: flex; } .priceButtonHolder > span { transition: border-color 0.25s; width: 14%; text-align: center; border-radius: 4px; border-width: 2px; border-style: solid; cursor: pointer; padding: 6px 0; } .userbutton { font-size: 0; color: transparent; background-position: center center; background-repeat: no-repeat; background-size: contain; height: 20px; width: 20px; filter: invert(1); } .userbutton.login { background-image: url(/images/redesign_2019/user-regular.svg); } .userbutton.logout { background-image: url(/images/redesign_2019/user-solid.svg); } body div.content { position: relative; } body div.content img { max-width: 100%; } body div.content .lightBorder, body div.content .superLightBorder { border-radius: 4px; border: 1px solid; } body div.content .grid { display: grid; } body div.content .grid.spacing30 { grid-gap: 30px; } body div.content .grid.twocol { grid-template-columns: 1fr 1fr; } @media only screen and (max-width: 767px) { body div.content .grid.twocol { grid-template-columns: 1fr; } } body div.content .expander { font-family: 'Abadi MT Pro Bold'; font-size: 30px; letter-spacing: 0.5px; padding: 30px; margin-bottom: 24px; position: relative; cursor: pointer; } body div.content .expander:before, body div.content .expander:after { content: ' '; position: absolute; display: block; width: 21px; height: 3px; background-color: black; right: 30px; top: 50%; transform: translateY(-50%) rotate(180deg); border-radius: 2px; transition: transform 0.5s ease-in-out; } body div.content .expander:not(.expanded):before { transform: translateY(-50%) rotate(90deg); } body div.content .expander:not(.expanded):after { transform: translateY(-50%) rotate(0deg); } body div.content .expander.arrows:before { display: none; } body div.content .expander.arrows:after { width: 19.5px; height: 30px; background-size: contain; background-repeat: no-repeat; background-color: transparent; transform: translateY(-50%) rotate(270deg); } body div.content .expander.arrows:not(.expanded):after { transform: translateY(-50%) rotate(90deg); } body div.content .faqs.grid.twocol { grid-template-columns: 260px auto; grid-column-gap: 160px; } body div.content .faqs.grid.twocol .sectionList { grid-column: 1; padding: 30px 0; border-bottom: 1px solid; font-size: 18px; cursor: pointer; line-height: 30px; } body div.content .faqs.grid.twocol .sectionList:first-child { padding-top: 0; } body div.content .faqs.grid.twocol .sectionList.selected { font-weight: bold; font-size: 20px; } body div.content .faqs.grid.twocol .sectionHolder { grid-column: 2; grid-row: 1 / span 10000; } body div.content .faqs.grid.twocol .sectionHolder .expander { padding: 15px 0; margin: 0; } body div.content .faqs.grid.twocol .sectionHolder .expander:first-child { padding-top: 0; } @media only screen and (max-width: 991px) { body div.content .faqs.grid.twocol { grid-template-columns: 220px auto; grid-column-gap: 30px; } } @media only screen and (max-width: 767px) { body div.content .faqs.grid.twocol { grid-template-columns: 1fr; grid-column-gap: 0px; } body div.content .faqs.grid.twocol .sectionList { padding: 20px; border: none; border: 1px solid; margin-bottom: 9px; font-size: 16px; position: relative; grid-column: 1; } body div.content .faqs.grid.twocol .sectionList:first-child { padding-top: 20px; } body div.content .faqs.grid.twocol .sectionList:after { content: ' '; position: absolute; display: block; width: 13px; height: 20px; right: 15px; top: 50%; transform: translateY(-50%); background-size: cover; } body div.content .faqs.grid.twocol .sectionHolder { margin: 0 5px; grid-column: 1; grid-row: auto; } body div.content .faqs.grid.twocol .sectionHolder .expander.arrows { font-size: 16px; padding: 16px 0; border-bottom: 1px solid; } body div.content .faqs.grid.twocol .sectionHolder .expander.arrows:after { width: 13px; height: 20px; right: 0; } body div.content .faqs.grid.twocol .sectionHolder .expander.arrows + div { margin-top: 14px; } body div.content .faqs.grid.twocol .sectionHolder .expander.arrows:nth-last-child(2) { border-bottom-width: 0; } body div.content .faqs.grid.twocol .sectionHolder .expander.arrows:nth-last-child(2).expanded { border-bottom-width: 1px; } } body div.content .aboutUs > div { margin: 30px 0; clear: both; } body div.content .aboutUs > div img { width: 45%; } @media only screen and (max-width: 991px) { body div.content .aboutUs > div img { width: 100%; } } body div.content .aboutUs > div:nth-child(odd) img { float: left; margin: 0 1em 1em 0; } @media only screen and (max-width: 991px) { body div.content .aboutUs > div:nth-child(odd) img { display: block; float: none; margin: 0 0 1em; } } body div.content .aboutUs > div:nth-child(even) img { float: right; margin: 0 0 1em 1em; } @media only screen and (max-width: 991px) { body div.content .aboutUs > div:nth-child(even) img { display: block; float: none; margin: 0 0 1em; } } body div.content .aboutUs .ourBusesOurPeople { margin: 30px -150px; padding: 30px 150px; background-color: antiquewhite; background-repeat: no-repeat; color: #fff; } @media only screen and (max-width: 991px) { body div.content .aboutUs .ourBusesOurPeople { margin: 30px -45px; padding: 30px 45px; } } body div.content .aboutUs .ourBusesOurPeople .button { margin-top: 30px; } body div.content .aboutUs .ourBusesOurPeople .ourBuses, body div.content .aboutUs .ourBusesOurPeople .ourPeople { display: none; } body div.content .aboutUs .ourBusesOurPeople .ourBuses { width: 50%; } body div.content .aboutUs .ourBusesOurPeople.ourBuses .ourBuses { display: block; } body div.content .aboutUs .ourBusesOurPeople.ourPeople .ourPeople { display: block; } body div.content .aboutUs .wantToTalk { background-repeat: no-repeat; padding: 30px; } body div.content .aboutUs .wantToTalk > .body { width: 50%; } @media only screen and (max-width: 767px) { body div.content .aboutUs .wantToTalk > .body { width: 100%; } } body div.content .aboutUs .wantToTalk > .button { margin-top: 30px; margin-right: 1em; } body div.content .grid.contactUsInfo { grid-row-gap: 96px; } @media only screen and (max-width: 767px) { body div.content .grid.contactUsInfo { grid-row-gap: 30px; } } body div.content .grid.contactUsInfo .talkToUs { grid-column: 1; } body div.content .grid.contactUsInfo .mapHolder { grid-column: 2; width: 100%; height: 700px; } @media only screen and (max-width: 767px) { body div.content .grid.contactUsInfo .mapHolder { height: 300px; grid-column: 1; } } body div.content .grid.contactUsInfo .visitShops { grid-column: 1 / span 2; } @media only screen and (max-width: 767px) { body div.content .grid.contactUsInfo .visitShops { grid-column: 1; } } body div.content .grid.contactUsInfo .haveAQuestion { background-repeat: no-repeat; grid-column: 1 / span 2; padding: 30px; } body div.content .grid.contactUsInfo .haveAQuestion > * { max-width: 50%; } @media only screen and (max-width: 767px) { body div.content .grid.contactUsInfo .haveAQuestion > * { max-width: none; } } @media only screen and (max-width: 767px) { body div.content .grid.contactUsInfo .haveAQuestion { grid-column: 1; } } body div.content .AreaMaps h2 { margin: 1em 0; } body div.content .pdfBox { position: relative; display: flex; flex-direction: row; align-items: center; min-height: 56px; flex-grow: 1; flex-basis: 0; padding: 20px; text-decoration: none; } body div.content .pdfBox:before { content: " "; position: relative; height: 56px; min-width: 56px; width: 56px; margin-right: 10px; display: flex; flex-direction: row; align-items: center; justify-content: center; background-position: initial; background-size: contain; background-repeat: no-repeat; } body div.content .pdfBox:after { content: " "; background-repeat: no-repeat; background-size: contain; width: 13px; height: 20px; } body div.content .pdfBox span { flex-grow: 1; } @media only screen and (min-width: 992px) { body div.content .thinContent { margin: 0 200px; } } body div.content .centreContent { text-align: center; } body div.content .leftContent { text-align: left; } body div.content .rightContent { text-align: right; } body div.content .smallTabButtons { display: flex; margin-bottom: 3em; } body div.content .smallTabButtons a { display: inline-block; padding: 3px 18px; border-bottom: 1px red solid; text-decoration: none; } body div.content .smallTabButtons a.active { border-bottom-width: 3px; margin-bottom: -1px; } body div.content .smallTabButtons.ticketVariantTabButtons { margin-top: 24px; margin-bottom: 1em; } body div.content main .hugo { margin: 0 -150px; } body div.content .hugo { display: flex; flex-wrap: wrap; min-height: 472px; } body div.content .hugo .button { margin-bottom: 20px; } body div.content .hugo .handheldButtons { display: none; } body div.content .hugo .txt { padding: 105px 103px 0 150px; box-sizing: border-box; width: 50%; background-color: #1B6D97 0%, #0B1C36 100%; background-image: -webkit-linear-gradient(left, #1B6D97 0%, #0B1C36 100%, #000000); background-image: -moz-linear-gradient(left, #1B6D97 0%, #0B1C36 100%, #000000); background-image: -o-linear-gradient(left, #1B6D97 0%, #0B1C36 100%, #000000); background-image: -ms-linear-gradient(left, #1B6D97 0%, #0B1C36 100%, #000000); background-image: linear-gradient(left, #1B6D97 0%, #0B1C36 100%, #000000); } body div.content .hugo .txt h2, body div.content .hugo .txt h3, body div.content .hugo .txt p { color: #fff !important; } body div.content .hugo .txt p { padding: 32px 0 39px; font-weight: normal; } body div.content .hugo .bg { box-sizing: border-box; width: 50%; background: url(/images/redesign_2019/hugo.png) no-repeat center; background-size: cover; } body div.content .shadowBoxes { display: flex; flex-direction: row; align-items: stretch; margin: 0 -15px; } body div.content .shadowBoxes > * { position: relative; display: block; flex-grow: 1; flex-basis: 0; border: 1px solid; border-radius: 4px; background-color: #FFFFFF; box-shadow: 0 2px 15px 0; padding: 20px; margin: 0 15px; text-decoration: none; } body div.content .shadowBoxes > div.tabletBreak { display: none; } body div.content .shadowBoxes.ticketVariantClassBoxes { margin-bottom: 24px; } body div.content .shadowBoxes.ticketVariantClassBoxes a { font-weight: bold; font-size: 20px; cursor: pointer; } @media only screen and (max-width: 767px) { body div.content .shadowBoxes.ticketVariantClassBoxes { flex-wrap: wrap; } body div.content .shadowBoxes.ticketVariantClassBoxes > a { flex-basis: 100%; margin-bottom: 1em; } } body div.content .shadowBoxes.homeButtons { margin: 50px -15px 100px; font-size: 20px; justify-content: center; flex-wrap: wrap; } body div.content .shadowBoxes.homeButtons > a { text-indent: 72px; padding: 40px 0px 40px 16px; white-space: nowrap; text-decoration: none; max-width: 190px; margin-bottom: 16px; padding-right: 15px; } body div.content .shadowBoxes.homeButtons > a::before { content: " "; background-image: url(/images/redesign_2019/homeSprites.png); background-size: 269px 122px; background-repeat: no-repeat; display: inline-block; width: 50px; height: 61px; position: absolute; left: 25px; top: 50%; transform: translateY(-50%) scale(0.75); image-rendering: pixelated; } body div.content .shadowBoxes.homeButtons a.account::before { background-position-x: -50px; width: 55px; left: 22.5px; } body div.content .shadowBoxes.homeButtons a.maps::before { background-position-x: -105px; width: 61px; left: 19.5px; } body div.content .shadowBoxes.homeButtons a.news::before { background-position-x: -166px; } body div.content .shadowBoxes.homeButtons a.events::before { background-position-x: -215px; width: 61px; left: 19.5px; } @media only screen and (max-width: 767px) { body div.content .shadowBoxes.homeButtons a.events::before { left: 5px; } } body div.content .shadowBoxes.travel-updates { margin: 30px -15px 32px; } @media only screen and (max-width: 767px) { body div.content .shadowBoxes.travel-updates { flex-wrap: wrap; } body div.content .shadowBoxes.travel-updates > div { flex-basis: 100%; margin-bottom: 1em; } } body div.content .shadowBoxes.travel-updates p.intro { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } body div.content .shadowBoxes.travel-updates p.service { margin: 7.5px 0; font-weight: bold; } body div.content .shadowBoxes.travel-updates p.service > span { position: relative; top: 2px; width: 16px; height: 16px; border-radius: 8px; margin-right: 0.75em; display: inline-block; } @media only screen and (max-width: 767px) { body div.content .shadowBoxes.travel-updates p.service { display: none; } } body div.content .ticketButtonHolder { float: right; margin-left: 20px; margin-bottom: 20px; background-repeat: no-repeat; } @media only screen and (max-width: 767px) { body div.content .ticketButtonHolder { float: none; margin: 0 0 20px; padding: 0; } body div.content .ticketButtonHolder a { width: 100%; } } body div.content section.newsList { display: grid; grid-auto-flow: row dense; grid-gap: 30px; grid-template-columns: 1fr 1fr; margin-bottom: 30px; margin-top: 0; width: 100%; } body div.content section.newsList > h2 { grid-column: 1 /span 2; margin: 2em 0 -10px; } @media only screen and (max-width: 767px) { body div.content section.newsList > h2 { grid-column: 1; } } @media only screen and (max-width: 767px) { body div.content section.newsList { grid-template-columns: 1fr; } } body div.content section.newsList > article { padding: 24px; } body div.content section.newsList > article h2 { text-transform: uppercase; font-size: 16px; } body div.content section.newsList > article > * { margin-bottom: 15px; } body div.content section.newsList > article div.thumb-div img { max-width: 263px; } body div.content section.newsList > article .button { margin-top: 4em; } body div.content section.newsList > article.article-Event .button { margin-top: 1em; } body div.content section.newsList .showMoreHolder { grid-column: 1 / span 2; } @media only screen and (max-width: 767px) { body div.content section.newsList .showMoreHolder { grid-column: 1; } } @media only screen and (max-width: 767px) { body div.content .newsItem.alert .serviceList { display: grid; } } body div.content .serviceList { display: grid; grid-auto-flow: row dense; grid-column-gap: 30px; grid-template-columns: 1fr 1fr; } @media only screen and (max-width: 767px) { body div.content .serviceList { display: none; } } body div.content .serviceList .service { position: relative; display: flex; flex-direction: row; align-items: center; min-height: 56px; flex-grow: 1; flex-basis: 0; border: 1px solid; border-radius: 4px; background-color: #FFFFFF; box-shadow: 0 2px 15px 0; padding: 20px; margin: 15px 0; text-decoration: none; } body div.content .serviceList .service:before { background-position: -317px -1px; content: " "; position: relative; height: 56px; min-width: 56px; width: 56px; margin-right: 10px; border-radius: 28px; display: flex; flex-direction: row; align-items: center; justify-content: center; } @media only screen and (max-width: 767px) { body div.content .serviceList { grid-template-columns: 1fr; margin-bottom: 1em; } body div.content .serviceList .service { min-height: 40px; height: 40px; padding: 12px; margin: 8px 0; } body div.content .serviceList .service:before { transform: scale(0.71); } } body div.content table.fareHolder { width: 100%; } body div.content table.fareHolder tr td { vertical-align: top; } body div.content table.fareHolder tr td:first-child { font-weight: bold; text-align: right; padding-right: 2em; width: 66%; } body div.content table.fareHolder tr td:last-child { min-width: 150px; width: 33%; } body div.content .findYourFareDrp { display: flex; } body div.content .findYourFareDrp > * { flex: 1; } body div.content section.travelUpdate .filter { text-align: right; font-family: 'Abadi MT Pro Bold'; font-size: 20px; margin-bottom: 5em; } @media only screen and (max-width: 767px) { body div.content section.travelUpdate .filter { font-size: 16px; margin-bottom: 2em; } } body div.content section.travelUpdate .filter select { display: inline-block; } body div.content section.travelUpdate .filter select option:first-child + option { display: none; } body div.content section.travelUpdate .filter select option:first-child:not(:checked) + option { display: initial; } body div.content section.travelUpdate article.list-news-item { padding-bottom: 1em; border-bottom: 1px solid; margin: 0 100px 4em; } @media only screen and (max-width: 991px) { body div.content section.travelUpdate article.list-news-item { margin: 0 0 4em; } } @media only screen and (max-width: 767px) { body div.content section.travelUpdate article.list-news-item .button { padding-left: 0; background-position: right center; background-repeat: no-repeat; background-size: 13px 20px; } } body div.content section.travelUpdate article.list-news-item header > * { padding-left: 0; } body div.content section.travelUpdate article.list-news-item time { text-transform: uppercase; display: block; font-family: 'Abadi MT Pro Bold'; font-size: 16px; letter-spacing: 0.5px; margin-bottom: 1.5em; } @media only screen and (max-width: 767px) { body div.content section.travelUpdate article.list-news-item time { font-size: 12px; } } body div.content section.travelUpdate article.list-news-item p { margin-bottom: 1em; padding: 0; } body div.content section.travelUpdate article.list-news-item h2 { margin-bottom: 1em; padding: 0; } @media only screen and (max-width: 767px) { body div.content section.travelUpdate article.list-news-item h2 { font-size: 24px; } } body div.content section.travelUpdate article.list-news-item h3 { margin-bottom: 0.5em; padding: 0; } body div.content .homeEventsHolder { display: flex; margin: 30px 0; padding: 30px; background-size: cover; background-repeat: none; } @media only screen and (max-width: 767px) { body div.content .homeEventsHolder { flex-direction: column; } } body div.content .homeEventsHolder > article { flex: 1 1 0px; padding: 1em; margin: 0 1em; background-color: rgba(255, 255, 255, 0.9); } body div.content .homeEventsHolder > article section { padding: 1em 0; } body div.content .homeEventsHolder > article:first-child { margin-left: 0; } body div.content .homeEventsHolder > article:last-child { margin-right: 0; } @media only screen and (max-width: 767px) { body div.content .homeEventsHolder > article { margin: 1em 0; } body div.content .homeEventsHolder > article:first-child { margin-top: 0; } body div.content .homeEventsHolder > article:last-child { margin-bottom: 0; } } body div.content .newsItem { margin: 0 200px; } @media only screen and (max-width: 991px) { body div.content .newsItem { margin: 0; } } body div.content .newsItem p.caption { font-style: italic; } body div.content .newsItem p.nav a { text-decoration: none; } body div.content .newsItem > * { margin-bottom: 1em; } body div.content .newsItem time { display: block; } body div.content .newsItem .newsitem-content:after { /* Clearfix for floated images in the content */ content: ""; display: table; clear: both; } body div.content .newsItem img { width: auto; height: auto; max-width: 555px; max-height: 370px; } @media only screen and (max-width: 767px) { body div.content .newsItem img { max-width: 100%; } } body div.content .newsItem.alert { margin: 0 100px; } @media only screen and (max-width: 991px) { body div.content .newsItem.alert { margin: 0; } } body div.content .newsItem.alert time { text-transform: uppercase; } body div.content .journeys-departures .form > ul { text-align: left; line-height: 1.5em; height: 0em; z-index: 100; position: relative; list-style: none; margin-top: -12px; margin-bottom: 12px; } body div.content .journeys-departures .form > ul > li { background-color: white; border-left: 1px solid; border-right: 1px solid; padding: 5px 15px; cursor: pointer; } body div.content .journeys-departures .form > ul > li:first-child { border-top: 1px solid; } body div.content .journeys-departures .form > ul > li:last-child { border-bottom: 1px solid; } body div.content .JourneyPlanner > * { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; grid-column-gap: 40px; grid-template-rows: max-content max-content; } body div.content .JourneyPlanner > * .journeys-departures-holder { order: 1; grid-row: 1/4 span; } body div.content .JourneyPlanner > * .journeys-departures-holder .journeys-departures { margin-bottom: 1em; border: 1px solid; } body div.content .JourneyPlanner > * .journeys-departures-holder .journeys-departures .tabBlocks > div { background-image: none !important; } body div.content .JourneyPlanner > * .journeys-departures-holder .tabSwitcher { margin: 0; } body div.content .JourneyPlanner > * .journeys-departures-holder .tabBlocks > div { padding: 30px; } @media only screen and (max-width: 767px) { body div.content .JourneyPlanner > * .journeys-departures-holder .tabBlocks > div { padding: 25px 21px; } } body div.content .JourneyPlanner > * .journeys-departures-holder .rtiInfo hr.dotted-line { margin: 10px 0 5px; } body div.content .JourneyPlanner > * .journeys-departures-holder .rtiInfo > div { position: relative; display: flex; flex-direction: row; align-items: center; min-height: 56px; } body div.content .JourneyPlanner > * .journeys-departures-holder .rtiInfo > div:before { background-position: -317px -1px; content: " "; position: relative; height: 56px; min-width: 56px; width: 56px; margin-right: 10px; border-radius: 28px; display: flex; flex-direction: row; align-items: center; justify-content: center; } body div.content .JourneyPlanner > * a.timetableButton { position: relative; display: flex; flex-direction: row; align-items: center; min-height: 56px; flex-grow: 1; flex-basis: 0; border: 1px solid; border-radius: 4px; background-color: #FFFFFF; box-shadow: 0 2px 15px 0; padding: 20px; margin: 15px 0; text-decoration: none; } body div.content .JourneyPlanner > * a.timetableButton:before { background-position: -317px -1px; content: " "; position: relative; height: 56px; min-width: 56px; width: 56px; margin-right: 10px; border-radius: 28px; display: flex; flex-direction: row; align-items: center; justify-content: center; } body div.content .JourneyPlanner > * .resultsShowOnMapButtons { order: 2; grid-column: 2; } body div.content .JourneyPlanner > * .resultsShowOnMapButtons h3 { margin-bottom: 1em; } body div.content .JourneyPlanner > * .learnMore { margin-top: 1.6em; order: 4; grid-column: 2; } body div.content .JourneyPlanner > * .learnMore h3 { font-size: 1.1em; } body div.content .JourneyPlanner > * .learnMore > a { position: relative; display: flex; flex-direction: row; align-items: center; min-height: 56px; flex-grow: 1; flex-basis: 0; border: 1px solid; border-radius: 4px; background-color: #FFFFFF; box-shadow: 0 2px 15px 0; padding: 20px; margin: 15px 0; text-decoration: none; } body div.content .JourneyPlanner > * .learnMore > a.mapLink { width: 75%; } body div.content .JourneyPlanner > * .learnMore > a.mapLink span { flex-grow: 1; } body div.content .JourneyPlanner > * .learnMore > a.mapLink:before { background-position: initial; background-size: contain; background-repeat: no-repeat; border-radius: 0; } body div.content .JourneyPlanner > * .learnMore > a.mapLink:after { content: " "; background-repeat: no-repeat; background-size: contain; width: 13px; height: 20px; } body div.content .JourneyPlanner > * .learnMore > a:before { background-position: -317px -1px; content: " "; position: relative; height: 56px; min-width: 56px; width: 56px; margin-right: 10px; border-radius: 28px; display: flex; flex-direction: row; align-items: center; justify-content: center; } body div.content .JourneyPlanner > * .map { order: 3; grid-column: 2; } body div.content .JourneyPlanner > * .map .mapPlaceholder { width: 100%; height: 600px; } body div.content .JourneyPlanner > * .bottomGap { order: 4; } body div.content .JourneyPlanner > * .button.searchAgain { display: none; } body div.content .JourneyPlanner .times { text-align: left; margin-top: 20px; } body div.content .JourneyPlanner .times > div { width: 100%; margin-top: 10px; } body div.content .JourneyPlanner .times .cbradWrapper { width: auto; margin-right: 20px; } body div.content .JourneyPlanner .times .cbradWrapper label { font-weight: bold; } body div.content .JourneyPlanner .times input[type=text] { width: 20%; max-width: 200px; min-width: 140px; display: inline-block; } body div.content .JourneyPlanner .times select { width: 20%; max-width: 90px; min-width: 75px; display: inline-block; font-weight: bold; } @media (min-width: 1500px) { body div.content .JourneyPlanner .times > div { width: auto; display: inline-block; margin-top: 10px; } body div.content .JourneyPlanner .times input[type=text] { width: 200px; } } @media only screen and (max-width: 991px) { body div.content .JourneyPlanner > * { grid-column-gap: 0; grid-auto-columns: unset; } body div.content .JourneyPlanner > * > .journeys-departures-holder { grid-column: 1; order: 3; grid-row: auto; } body div.content .JourneyPlanner > * > .journeys-departures-holder .tabSwitcher { max-width: unset; } body div.content .JourneyPlanner > * > .resultsShowOnMapButtons { grid-column: 1; order: 1; } body div.content .JourneyPlanner > * > .map { grid-column: 1; order: 2; margin-bottom: 3em; } body div.content .JourneyPlanner > * > .map .mapPlaceholder { height: 500px; } body div.content .JourneyPlanner > * > .learnMore { grid-column: 1; order: 4; } body div.content .JourneyPlanner > * > .bottomGap { grid-column: 1; display: none; } body div.content .JourneyPlanner > * .textResults p { margin-bottom: 2em; } } body div.content .JourneyPlanner .textResults p { font-size: 0.93em; } @media only screen and (max-width: 767px) { body div.content .JourneyPlanner .times .cbradWrapper { width: 49%; margin-right: 0; } body div.content .JourneyPlanner .tabBlocks { margin: 0; } body div.content .JourneyPlanner .journeys-departures-holder.SearchRun .journeys-departures { border: none; } body div.content .JourneyPlanner .journeys-departures-holder.SearchRun .tabSwitcher { display: none; } body div.content .JourneyPlanner .journeys-departures-holder.SearchRun .tabBlocks > * { padding: 0; } body div.content .JourneyPlanner .journeys-departures-holder.SearchRun .tabBlocks > * > h3 { display: none; } body div.content .JourneyPlanner .journeys-departures-holder.SearchRun .form { display: none; } body div.content .JourneyPlanner .journeys-departures-holder.SearchRun .results { margin-top: 0; } body div.content .JourneyPlanner .journeys-departures-holder.SearchRun .button.searchAgain { margin: 1em 0; display: block; } body div.content .JourneyPlanner .map .mapPlaceholder { height: 450px; } } body div.content .homepage-image-container { position: relative; margin: -75px -150px 0; line-height: 0; } @media only screen and (max-width: 991px) { body div.content .homepage-image-container { margin: -20px 0 0; } } @media only screen and (max-width: 767px) { body div.content .homepage-image-container { margin: -20px -15px 0; } } body div.content .homepage-image-container .journeys-departures { top: 50%; transform: translateY(-50%); left: 10.416666667%; position: absolute; } body div.content .homepage-image-container .journeys-departures > * { line-height: 1.5em; } body div.content .homepage-image-container .journeys-departures > .tabBlocks { margin-top: -1px; } body div.content .homepage-image-container .journeys-departures .tabBlocks > div { padding: 32px 36px 60px; margin-bottom: 40px; width: 484px; } body div.content .homepage-image-container .journeys-departures #tab_find-journey input[type=submit].button { margin-bottom: 0; } @media only screen and (max-width: 991px) { body div.content .homepage-image-container .journeys-departures { position: relative; top: 0; transform: none; left: 0; width: 100%; } } @media only screen and (max-width: 767px) { body div.content .homepage-image-container .journeys-departures .tabSwitcher { margin-top: 0; } } body div.content .homepage-image-container .homepage-landscape-image img, body div.content .homepage-image-container .homepage-portrait-image img { width: 100%; height: auto; } @media (orientation: landscape) { body div.content .homepage-image-container .homepage-portrait-image { display: none; } } @media (orientation: portrait) { body div.content .homepage-image-container .homepage-landscape-image { display: none; } } body div.content .journeys-departures { margin-bottom: 40px; } body div.content .journeys-departures.superLightBorder .tabSwitcher { margin-top: 0; } body div.content .journeys-departures hr.dotted-line { background-image: linear-gradient(to right, black 25%, rgba(255, 255, 255, 0) 0%); background-position: bottom; background-size: 8px 1px; background-repeat: repeat-x; height: 1px; margin-bottom: 25px; } body div.content .journeys-departures .results { text-align: left; margin-top: 37px; } body div.content .journeys-departures .results .button { margin-top: 20px; } body div.content .journeys-departures .tabBlocks > div { padding: 32px 36px 0; width: auto; background-repeat: no-repeat; background-size: contain; background-position-y: bottom; margin-bottom: 0; } body div.content .journeys-departures .tabBlocks > div .live-button { text-align: right; } body div.content .journeys-departures #tab_find-journey input[type=submit].button { margin-bottom: 40px; } @media only screen and (max-width: 767px) { body div.content .journeys-departures #tab_find-journey input[type=submit].button { margin-bottom: 80px; } } body div.content .journeys-departures #tab_departures .button { margin-bottom: 30px; } @media only screen and (max-width: 767px) { body div.content .journeys-departures #tab_departures .button { margin-bottom: 70px; } } body div.content .journeys-departures ul.journeyList { background: url(/images/redesign_2019/input/routeDots.png) repeat-y; background-position-x: 27px; list-style: none; margin-bottom: 30px; } body div.content .journeys-departures ul.journeyList li { position: relative; display: flex; flex-direction: row; align-items: center; margin: 64px 0; min-height: 56px; } body div.content .journeys-departures ul.journeyList li:first-of-type { margin-top: 0; } body div.content .journeys-departures ul.journeyList li:last-of-type { margin-bottom: 0; } body div.content .journeys-departures ul.journeyList li:last-of-type:before { background-image: url(/images/redesign_2019/input/flag.png); background-position: center center; background-repeat: no-repeat; background-size: 40%; } body div.content .journeys-departures ul.journeyList li:before { content: " "; position: relative; height: 56px; min-width: 56px; width: 56px; margin-right: 10px; border-radius: 28px; display: flex; flex-direction: row; align-items: center; justify-content: center; } body div.content .journeys-departures ul.journeyList li.knownBus:before { background-position: -317px -1px; } body div.content .journeys-departures ul.journeyList li:not(.knownBus):before { background-color: #f0f0ec; } @media only screen and (max-width: 767px) { body div.content .journeys-departures a.button, body div.content .journeys-departures input[type=submit] { width: 100%; } } body div.content .ticketsMainHolder { display: flex; flex-wrap: wrap; flex-direction: row; } body div.content .ticketsMainHolder .expander.your-journey { display: none; } body div.content .ticketsMainHolder .contents { flex-grow: 1; width: 0%; margin-right: 2em; } body div.content .ticketsMainHolder .journeyPlanner { width: 600px; } @media only screen and (max-width: 991px) { body div.content .ticketsMainHolder .journeyPlanner { min-width: 500px; } } @media only screen and (max-width: 767px) { body div.content .ticketsMainHolder .journeyPlanner { min-width: initial; width: 100%; } } body div.content .ticketsMainHolder .ticketTypes { width: 100%; } @media only screen and (max-width: 767px) { body div.content .ticketsMainHolder .ticketTypes { position: relative; display: flex; flex-direction: column-reverse; padding-top: 84px; } body div.content .ticketsMainHolder .ticketTypes h2 { position: absolute; top: 0; width: 100%; } } body div.content #tab_departures .select-container { display: flex; flex-wrap: wrap; margin: 0 -10px; margin-bottom: 23px; } body div.content #tab_departures .select-container > * { flex-basis: calc(50% - 20px); flex-grow: 1; margin: 10px; overflow: hidden; } body div.content #tab_departures .select-container .breaker { flex-basis: 100%; display: block; height: 0; margin: 0; } @media only screen and (max-width: 991px) { body div.content #tab_departures { width: 100%; max-width: none; } } body div.content #tab_departures select { width: 100%; margin-bottom: 12px; padding-top: 7px; height: 64px; } body div.content #tab_departures table { width: 100%; } body div.content #tab_departures h3 { margin-bottom: 37px; } @media only screen and (max-width: 991px) { body div.content #tab_find-journey { width: 100%; max-width: none; } } body div.content #tab_find-journey h3 { margin-bottom: 37px; } body div.content #tab_find-journey .findYourFareDrp .fareFilter { width: 291px; } @media (min-width: 1390px) { body div.content #tab_find-journey .findYourFareDrp h3 { display: inline-block; margin-right: 5px; } body div.content #tab_find-journey .findYourFareDrp .fareFilter { display: inline-block; float: right; } } body div.content #tab_find-journey div.form { text-align: right; position: relative; } body div.content #tab_find-journey div.form > input[type=text] { width: 100%; margin-bottom: 12px; padding-top: 7px; height: 64px; } body div.content #tab_find-journey div.form > input[type=submit] { margin-top: 20px; } body div.content #tab_find-journey div.form > a.swapButton { position: absolute; width: 55px; height: 55px; right: 25px; top: 41px; background-color: red; color: transparent; border-radius: 30px; background-image: url(/images/redesign_2019/swap.png); background-size: 28px 23px; background-repeat: no-repeat; background-position: center center; } @media only screen and (max-width: 991px) { body div.content .homepage-image-container .journeys-departures > * { max-width: none; } body div.content .ticketsMainHolder .expander.your-journey { display: block; } body div.content .ticketsMainHolder .expander.your-journey + .journeys-departures { display: none; } body div.content .ticketsMainHolder .contents { order: 1; flex-grow: 1; width: 100%; } body div.content .ticketsMainHolder .journeyPlanner { order: 3; width: 100%; } body div.content .ticketsMainHolder .ticketTypes { order: 2; width: 100%; } body div.content main .hugo { margin: 0 -45px; } body div.content .hugo { display: block; } body div.content .hugo .txt { background-color: #1B6D97 0%, #0B1C36 100%; background-image: -webkit-linear-gradient(top, #1B6D97 0%, #0B1C36 100%, #000000); background-image: -moz-linear-gradient(top, #1B6D97 0%, #0B1C36 100%, #000000); background-image: -o-linear-gradient(top, #1B6D97 0%, #0B1C36 100%, #000000); background-image: -ms-linear-gradient(top, #1B6D97 0%, #0B1C36 100%, #000000); background-image: linear-gradient(top, #1B6D97 0%, #0B1C36 100%, #000000); } body div.content .hugo .bg { background-position: bottom center; min-height: 258px; } body div.content .hugo .txt, body div.content .hugo .bg { width: 100%; padding: 21px 58px; } body div.content .hugo .handheldButtons { display: block; } body div.content .hugo .desktopButtons { display: none; } body div.content .shadowBoxes.homeButtons { flex-wrap: wrap; } body div.content .shadowBoxes.homeButtons > a { max-width: initial; } body div.content .shadowBoxes.homeButtons > div.tabletBreak { flex-basis: 100%; width: 0; border: none; box-shadow: none; display: block; } } @media only screen and (max-width: 767px) { body div.content .homeIntro { display: none; } body div.content main .hugo { margin: 0 -15px; } body div.content .hugo { display: block; } body div.content .hugo .txt, body div.content .hugo .bg { padding: 21px; } body div.content .hugo .txt { padding-top: 48px; } body div.content .hugo .button { width: 100%; } body div.content .shadowBoxes.homeButtons { flex-wrap: wrap; margin-bottom: 20px; margin-top: 30px; } body div.content .shadowBoxes.homeButtons > div.tabletBreak { display: none; } body div.content .shadowBoxes.homeButtons > a { flex: 0 100%; margin-bottom: 16px; padding: 20px; text-indent: 42px; max-width: initial; } body div.content .shadowBoxes.homeButtons > a::before { transform: translateY(-50%) scale(0.5); left: 10px; } body div.content .shadowBoxes.homeButtons > a.account::before { left: 7.5px; } body div.content .shadowBoxes.homeButtons > a.maps::before { left: 4.5px; } body div.content .homepage-image-container .journeys-departures { position: static; width: auto; left: auto; top: auto; margin: 0; } body div.content .homepage-image-container .journeys-departures > * { margin: 0; } } .flexInputContainer { display: flex; flex-flow: wrap; margin: -10px -30px; justify-content: space-between; } .flexInputContainer .flex50 { flex: 1 30%; flex-grow: 1; margin: 10px 30px; } .flexInputContainer .flex50 input:not([type]), .flexInputContainer .flex50 textarea:not([type]), .flexInputContainer .flex50 input[type="text"], .flexInputContainer .flex50 textarea[type="text"], .flexInputContainer .flex50 input[type="password"], .flexInputContainer .flex50 textarea[type="password"] { width: 100%; } .flexInputContainer .flex50 select { width: 100%; } .flexInputContainer .flex50 .button { margin-right: 15%; } .flexInputContainer .flex100 { flex: 1 100%; flex-grow: 1; margin: 10px 30px; } .flexInputContainer .flex100 textarea { height: 300px; } .flexInputContainer .flex100 input:not([type]), .flexInputContainer .flex100 textarea:not([type]), .flexInputContainer .flex100 input[type="text"], .flexInputContainer .flex100 textarea[type="text"], .flexInputContainer .flex100 input[type="password"], .flexInputContainer .flex100 textarea[type="password"] { width: 100%; } .flexInputContainer .flex100.limitInputWidth input[type="text"], .flexInputContainer .flex100.limitInputWidth input[type="password"] { min-width: 200px; width: auto; display: inline-block; } .flexInputContainer .flex100.limitInputWidth select { min-width: 200px; width: auto; display: inline-block; } .flexInputContainer .flex100 select { width: 100%; } .flexInputContainer .controls.sortCode { font-size: 0px; } .flexInputContainer .controls.sortCode > input { width: 27.666666667%; display: inline-block; } .flexInputContainer .controls.sortCode .invalidMessage { display: none; } .flexInputContainer .greedyFlex { flex: 1; min-width: 55%; } .flexInputContainer .flexButtonHolder { flex: none; flex-shrink: 0; padding-top: 36px; margin: 0 30px; } .loginRegister .tabSwitcher { max-width: 750px; } .loginRegister .tabBlocks > div { max-width: 750px; } .tabSwitcher { box-sizing: border-box; display: flex; /*max-width: 750px;*/ margin: 40px auto 0; } .tabSwitcher > a { box-sizing: border-box; cursor: pointer; flex: 0 1 50%; display: flex; justify-content: center; flex-direction: column; text-align: center; height: 56px; } .tabBlocks { box-sizing: border-box; } .tabBlocks > div { box-sizing: border-box; /*max-width: 750px;*/ margin: 0 auto 40px; padding: 60px 98px; display: none; } .tabBlocks > div.active { display: block; } .contentRight { text-align: right; } .hidden { display: none !important; } .showHideSectionButton { -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ -khtml-user-select: none; /* Konqueror HTML */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */ } .showHideSection { display: none; } .showHideSection.open { display: block; } .vAlignContent > * { vertical-align: middle; } .directDebitConfirm { display: flex; flex-flow: wrap; align-items: center; } .directDebitConfirm img { flex: 1 10%; flex-grow: 0; align-items: center; } .directDebitConfirm div { margin-left: 10px; flex: 0 10%; flex-grow: 1; align-items: center; } ul.indented { margin-left: 1em; } ul.indented li { list-style: disc; } ul.indented ul { margin-left: 1em; } body div.hero.busroutes { height: auto; padding-top: 25px; padding-bottom: 85px; } @media only screen and (min-width: 992px) { body div.hero.busroutes div.bus-routes { max-width: 500px; } } body div.hero.busroutes div.bus-routes select { border-radius: 4px; } body div.hero.busroutes div.bus-routes .button { margin-right: 0; } body div.hero.busroutes div.heroText { max-width: 100%; } body div.hero.busroutes div.heroText h1, body div.hero.busroutes div.heroText h3 { color: #fff; } @media only screen and (min-width: 768px) { body div.hero.busroutes div.heroText { padding: 70px 100px; } } body div.hero.busroutes .error-message { color: white; margin-top: 20px; display: block; } .bus-routes.flexInputContainer .select-container { flex: 1 100%; } @media only screen and (max-width: 991px) { .bus-routes.flexInputContainer .select-container { flex: 1 30%; } } .network-map { display: grid; grid-gap: 30px; grid-template-columns: 1fr 1fr; } @media only screen and (max-width: 767px) { .network-map { grid-template-columns: 1fr; } } .network-map .bottomGap { display: none; } .network-map .filterDropdownHolder { order: 1; grid-column: 1 / span 2; } @media only screen and (max-width: 767px) { .network-map .filterDropdownHolder { grid-column: 1; } } .network-map .filterDropdownHolder select { display: inline-block; } .network-map .JourneyPlanner { order: 2; } @media only screen and (max-width: 767px) { .network-map .JourneyPlanner { order: 4; } } .network-map .AreaMaps { order: 3; grid-column: 1 / span 2; } @media only screen and (min-width: 992px) { .network-map .AreaMaps { margin: 0 200px; } } @media only screen and (max-width: 767px) { .network-map .AreaMaps { grid-column: 1; } } .network-map .network-map-container { order: 3; font-size: 0px; display: flex; } @media only screen and (max-width: 767px) { .network-map .network-map-container { order: 2; } } .network-map .network-map-container .network-map-contents { width: 100%; } .network-map .network-map-container .network-map-contents > .view-mobile { font-size: 16px; } .network-map .network-map-container .network-map-contents .maps-container { width: 100%; } .network-map .network-map-container .network-map-contents .maps-container .map, .network-map .network-map-container .network-map-contents .maps-container .map-overlays, .network-map .network-map-container .network-map-contents .maps-container .hotspots { width: 100%; } .network-map .network-map-container .network-map-contents .maps-container .plus, .network-map .network-map-container .network-map-contents .maps-container .minus { font-size: 0; line-height: 0; width: 30px; height: 30px; position: absolute; bottom: 30px; right: 30px; border: 1px solid #EFEFEF; background-color: #FFFFFF; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); z-index: 201; } .network-map .network-map-container .network-map-contents .maps-container .plus:before, .network-map .network-map-container .network-map-contents .maps-container .minus:before { content: " "; display: block; margin: auto; top: 50%; left: 50%; position: absolute; transform: translateY(-50%) translateX(-50%); height: 3px; width: 21px; background-color: #000000; border-radius: 2px; } .network-map .network-map-container .network-map-contents .maps-container .plus { right: 70px; } .network-map .network-map-container .network-map-contents .maps-container .plus:after { content: " "; display: block; margin: auto; top: 50%; left: 50%; position: absolute; transform: translateY(-50%) translateX(-50%); height: 21px; width: 3px; background-color: #000000; border-radius: 2px; } .network-map .network-map-container img { vertical-align: middle; max-width: 100%; height: auto; } .network-map .network-map-container .our-network img { vertical-align: baseline; } .ticketVariantTabContents > div { display: none; } .ticketVariantTabContents > div.active { display: block; } .button:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } .button { font-family: 'Abadi MT Std'; font-size: 16px; letter-spacing: 2px; transition: background-color 0.25s, box-shadow 0.25s, border 0.25s, opacity 0.25s, color 0.25s, background-image 0.25s; text-decoration: none; /*height: 44px; button content was cutoff on destinations page */ min-height: 44px; /*added to replace height: 44px*/ min-width: 119px; text-transform: lowercase; display: inline-block; text-align: center; padding: 12px 30px 8px; border-radius: 4px; box-sizing: border-box; cursor: pointer; } .button.secondary { padding: 12px 10px 8px; } @media only screen and (max-width: 767px) { .button.full-width-mobile { width: 100%; } } .button[disabled] { opacity: 0.7; cursor: not-allowed; } .button.block { width: 361px; text-transform: none; text-align: left; display: flex; height: auto; padding: 36px 0 22px; } .button.block div.img { min-width: 87px; min-height: 100%; display: flex; align-items: center; justify-content: center; } .button.block div.text { margin-right: 45px; } .button.block div.text div.title { font-size: 20px; } .button.block div.text div.subtitle { font-size: 16px; line-height: 25px; } .button.ajaxProcessing { background-image: url(/images/tb/ajax-loader.gif); background-position-x: center; background-position-y: center; background-repeat: no-repeat; color: transparent !important; } label.kkLabel { transition: left 0.25s, top 0.25s, opacity 0.25s, line-height 0.25s; font-family: 'Abadi MT Std'; font-size: 16px; letter-spacing: 0.25px; position: relative; line-height: 25px; display: block; left: 0; top: 0; } label.kkLabel.inline { display: inline; } label.kkLabel.empty { left: 15px; top: 36px; pointer-events: none; } label.kkLabel.empty + input[type="text"], label.kkLabel.empty + input[type="password"] { color: transparent; } label.kkLabel.readonlyLabel { display: inline-block; margin-right: 5px; font-weight: bold; margin-bottom: 5px; } label.kkLabel.large { font-size: 20px; } span.cbradWrapper { display: inline-block; position: relative; } span.cbradWrapper label { line-height: 25px; vertical-align: text-bottom; } .button { -webkit-appearance: none; } .invalidMessage.blockDisplay { transition: max-height 0.25s, padding 0.25s, opacity 0.25s; font-size: 12px; letter-spacing: 0.25px; color: #D0021B; max-height: 0; padding: 0; display: block; } input, textarea { font-family: 'Abadi MT Std'; font-size: 16px; letter-spacing: 0.25px; } input + .invalidMessage, textarea + .invalidMessage { transition: max-height 0.25s, padding 0.25s, opacity 0.25s; font-size: 12px; letter-spacing: 0.25px; color: #D0021B; max-height: 0; padding: 0; opacity: 0; } input:disabled, textarea:disabled { opacity: 0.7; background-color: #fff; } input[type="radio"], textarea[type="radio"], input[type="checkbox"], textarea[type="checkbox"] { margin: 4px; width: 23px; height: 23px; display: inline-block; } input[type="radio"] + .replacement, textarea[type="radio"] + .replacement, input[type="checkbox"] + .replacement, textarea[type="checkbox"] + .replacement { position: absolute; content: ""; display: inline-block; background-repeat: no-repeat; pointer-events: none; } input:not([type]), textarea:not([type]), input[type="text"], textarea[type="text"], input[type="password"], textarea[type="password"] { transition: background-image 0.25s, border-color 0.25s, box-shadow 0.25s, padding 0.25s; display: block; border-width: 1px; border-style: solid; padding: 10px 14px 6px; line-height: 25px; height: 45px; width: 300px; box-sizing: border-box; background-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); background-size: 24px 24px; background-position: right 12px center; background-repeat: no-repeat; } input:not([type]).currency:focus, textarea:not([type]).currency:focus, input[type="text"].currency:focus, textarea[type="text"].currency:focus, input[type="password"].currency:focus, textarea[type="password"].currency:focus, input:not([type]).currency:not(.empty), textarea:not([type]).currency:not(.empty), input[type="text"].currency:not(.empty), textarea[type="text"].currency:not(.empty), input[type="password"].currency:not(.empty), textarea[type="password"].currency:not(.empty) { background-image: url("data:image/svg+xml;utf8,£"); background-position: 13px 8px; background-size: auto; padding-left: 26px; } input:not([type]):not(:focus).valid, textarea:not([type]):not(:focus).valid, input[type="text"]:not(:focus).valid, textarea[type="text"]:not(:focus).valid, input[type="password"]:not(:focus).valid, textarea[type="password"]:not(:focus).valid { padding-right: 50px; border-color: #7ED321; background-image: url('/images/redesign_2019/input/valid@2x.png'); } input:not([type]).invalid, textarea:not([type]).invalid, input[type="text"].invalid, textarea[type="text"].invalid, input[type="password"].invalid, textarea[type="password"].invalid { padding-right: 50px; background-image: url('/images/redesign_2019/input/invalid@2x.png'); border-color: #D0021B; } input:not([type]).invalid:focus, textarea:not([type]).invalid:focus, input[type="text"].invalid:focus, textarea[type="text"].invalid:focus, input[type="password"].invalid:focus, textarea[type="password"].invalid:focus { box-shadow: 0 0 5px 0 rgba(208, 2, 27, 0.9); } input:not([type]).invalid + .invalidMessage, textarea:not([type]).invalid + .invalidMessage, input[type="text"].invalid + .invalidMessage, textarea[type="text"].invalid + .invalidMessage, input[type="password"].invalid + .invalidMessage, textarea[type="password"].invalid + .invalidMessage { opacity: 1; max-height: 25px; padding: 2px 0; } .select2-drop { z-index: 9999999 !important; /* because the menu overlay has six 9s... */ } .select2-drop input.select2-input { width: 100%; } select, .select2-choice { -webkit-appearance: none; -moz-appearance: none; text-indent: 1px; text-overflow: ''; font-family: 'Abadi MT Std'; font-size: 16px; letter-spacing: 0.25px; height: 43px !important; padding: 10px 40px 6px 10px; box-sizing: border-box; border-width: 1px; border-style: solid; background-size: 20px 13px; background-color: #fff !important; background-position: right 12px center; background-repeat: no-repeat; background-image: url(/images/redesign_2019/input/dropdown_down@2x.png); width: 300px; display: block; border-radius: 0 !important; } select *:hover, .select2-choice *:hover { background-color: transparent !important; } select .select2-arrow, .select2-choice .select2-arrow { display: none !important; } select .select2-chosen, .select2-choice .select2-chosen { line-height: 43px; } select::-ms-expand, .select2-choice::-ms-expand { display: none; } select option, .select2-choice option { line-height: 43px; height: 43px; padding: 10px 10px 6px; } select option:first-child[value=""], .select2-choice option:first-child[value=""], select option:first-child:not([value]), .select2-choice option:first-child:not([value]) { display: none; } select[size], .select2-choice[size] { background-image: none; height: 200px; } select[size] option, .select2-choice[size] option { line-height: normal; height: auto; } select:not(:focus).valid, .select2-choice:not(:focus).valid { padding-right: 50px; border-color: #7ED321 !important; background-image: url('/images/redesign_2019/input/valid@2x.png'); background-size: 24px 24px; background-position: right 12px center; background-repeat: no-repeat; } select + .invalidMessage, .select2-choice + .invalidMessage { transition: max-height 0.25s, padding 0.25s, opacity 0.25s; font-size: 12px; letter-spacing: 0.25px; color: #D0021B; max-height: 0; padding: 0; opacity: 0; } select.invalid, .select2-choice.invalid { padding-right: 50px; background-image: url('/images/redesign_2019/input/invalid@2x.png'); border-color: #D0021B !important; background-size: 24px 24px; background-position: right 12px center; background-repeat: no-repeat; } select.invalid:focus, .select2-choice.invalid:focus { box-shadow: 0 0 5px 0 rgba(208, 2, 27, 0.9) !important; } select.invalid + .invalidMessage, .select2-choice.invalid + .invalidMessage { opacity: 1; max-height: 25px; padding: 2px 0; } .invalidMessageNotBound { transition: max-height 0.25s, padding 0.25s, opacity 0.25s; font-size: 12px; letter-spacing: 0.25px; color: #D0021B; max-height: 25px; padding: 2px 0; } .otherSpacer > * { visibility: hidden; } .otherSpacer.show > * { visibility: visible; } .readOnlyField { margin-bottom: 15px; } @media only screen and (max-width: 767px) { .otherSpacer { display: none; } .otherSpacer.show { display: block; } label.kkLabel { line-height: 25px; overflow: visible; } label.kkLabel.empty { line-height: 5px; top: 28px; } .flexInputContainer .flex50 { flex: 1 100%; flex-grow: 1; } .flexInputContainer .flex50 .button { margin-right: 0; } .flexInputContainer .flex100, .flexInputContainer .flex50 { margin: 5px 30px; } .flexInputContainer .flex100 .button, .flexInputContainer .flex50 .button { width: 100%; } .flexInputContainer .flex100 .button.linkstyle, .flexInputContainer .flex50 .button.linkstyle { width: auto; } .flexInputContainer .flexButtonHolder { padding-top: 5px; margin: 5px 30px; flex: 1 100%; flex-grow: 1; } .flexInputContainer .flexButtonHolder .button { width: 100%; margin-right: auto; } .flexInputContainer .flexButtonHolder .button.linkstyle { width: auto; } .tabSwitcher { margin: -20px -15px 0; } .tabBlocks { margin: 0 -15px 0; } .tabBlocks > div { padding: 25px 21px; } } body .homepage-landscape-image, body .homepage-portrait-image { overflow: hidden; max-height: 640px; } body .homePageAdvert { position: relative; margin: -50px -150px 50px; } @media only screen and (max-width: 991px) { body .homePageAdvert { margin: -50px -45px 50px; } } @media only screen and (max-width: 767px) { body .homePageAdvert { margin: -20px -15px 20px; } } body .homePageAdvert img { width: 100%; } body #homepage-actions { margin-top: 30px; } body #homepage-actions h2 { margin-bottom: 30px; font-size: 23px; } body #homepage-actions .things-to-do { display: flex; flex-flow: wrap; } body #homepage-actions .thing-to-do { border: 1px solid #DAE4F0; padding: 26px; margin: 10px; border-radius: 4px; display: inline-block; text-decoration: none; min-width: 230px; padding-right: 39px; padding-left: 82px; background-size: 13px 20px, 40px 40px; background-position: calc(100% - 15px) center, 22px center; background-repeat: no-repeat, no-repeat; } body #homepage-actions .thing-to-do .to-do-title { display: block; font-size: 20px; } body #homepage-actions .thing-to-do .description { max-width: 230px; display: inline-block; } @media only screen and (max-width: 767px) { body #homepage-actions .thing-to-do { width: 100%; min-width: initial; } body #homepage-actions .thing-to-do .description { display: none; } body #homepage-actions .thing-to-do .title { margin: 0px; padding: 0px; } } body #recurring-payments .recurring-payment-details { position: relative; border: 1px solid #DAE4F0; padding: 14px 210px 14px 67px; margin: 10px; border-radius: 4px; line-height: 1.7; } @media only screen and (max-width: 767px) { body #recurring-payments .recurring-payment-details { padding: 14px 14px 14px 67px; } } body #recurring-payments .recurring-payment-details .saver-recurring { position: absolute; left: 14px; top: 15px; width: 42px; vertical-align: middle; } body #recurring-payments .recurring-payment-details .change-card-btn { position: absolute; top: 16px; right: 16px; } @media only screen and (max-width: 767px) { body #recurring-payments .recurring-payment-details .change-card-btn { position: initial; } } body #recurring-payments .recurring-payment-details small { font-size: 14px; color: #a5a5a5; } body .form-vertical .control-group { margin-bottom: 10px; } body .row { display: flex; flex-direction: row; } body .column { display: flex; flex-direction: column; flex-basis: 100%; flex: 1; } body .buttons .button { margin-bottom: 10px; } @media only screen and (max-width: 767px) { body .row { display: block; flex: none; } body .buttons .button { flex: 1 100%; } } body .cardholderdetail { padding-top: 15px; } body .cardholderdetail .buttons { flex: 0 0 263px; margin-left: 1em; } @media only screen and (max-width: 767px) { body .cardholderdetail .buttons { margin-left: 0; } } body .intro-text { margin-bottom: 20px; } body .read-only-page .editable-form { display: none; } body div.content main .mango-main header { background-color: transparent; } body div.content main .mango-main .edit-header { padding: 0; font-size: 30px; } body div.content main .mango-main .edit-subheader { margin-top: 12px; font-size: 16px; } body div.content main .mango-main de .form-horizontal { display: flex; flex-wrap: wrap; margin-top: 36px; } body div.content main .mango-main de .form-horizontal .control-group { flex: 1 0 50%; margin-bottom: 25px; letter-spacing: 0.25px; } body div.content main .mango-main de .form-horizontal .action-group { margin-left: 50%; width: 360px; } body div.content main .mango-main de .form-horizontal .action-group input[type='submit'] { float: right; } @media only screen and (max-width: 767px) { body div.content main .mango-main de .form-horizontal .control-group { flex: 1 0 100%; } body div.content main .mango-main de .form-horizontal .control-group input[type='text'], body div.content main .mango-main de .form-horizontal .control-group .button { width: 100%; } body div.content main .mango-main de .form-horizontal .action-group { margin-left: 0; width: 100%; } body div.content main .mango-main de .form-horizontal .action-group input[type='submit'] { width: 100%; } } body div.content main .mango-main #mango-contactless-transactions #journey-dates { margin-top: 26px; margin-bottom: 26px; border: none; } @media only screen and (max-width: 767px) { body div.content main .mango-main #mango-contactless-transactions #journey-dates { width: 100%; } } body div.content main .mango-main #mango-contactless-transactions #journey-dates label { display: inline-block; margin-right: 10px; margin-bottom: 10px; font-weight: bold; } @media only screen and (max-width: 767px) { body div.content main .mango-main #mango-contactless-transactions #journey-dates label { display: block; } } body div.content main .mango-main #mango-contactless-transactions #journey-dates div { display: inline-block; } @media only screen and (max-width: 767px) { body div.content main .mango-main #mango-contactless-transactions #journey-dates div { display: flex; } } body div.content main .mango-main #mango-contactless-transactions #journey-dates input { border-width: 1px; border-style: solid; background-color: white; padding: 5px 15px; line-height: 24px; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); cursor: pointer; } @media only screen and (max-width: 767px) { body div.content main .mango-main #mango-contactless-transactions #journey-dates input { flex: 1; } } body div.content main .mango-main #mango-contactless-transactions #journey-dates input:first-of-type { border-top-left-radius: 4px; border-bottom-left-radius: 4px; border-right-width: 0; } body div.content main .mango-main #mango-contactless-transactions #journey-dates input:last-of-type { border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-left-width: 0; } body div.content main .mango-main #mango-contactless-transactions #journey-dates input.active { color: #fff; } body div.content main .mango-main #mango-contactless-transactions .transaction-box { min-width: 945px; margin: 16px auto; border-width: 1px; border-style: solid; border-radius: 4px; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body div.content main .mango-main #mango-contactless-transactions .transaction-box#top-details { height: 152px; padding-top: 18px; margin-top: 55px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box#top-details div { margin: 12px 0 0 36px; font-size: 20px; font-weight: bold; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box { margin-top: 20px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction-date, body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction { margin: 24px 0 0 36px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction-date { font-size: 20px; font-weight: bold; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction { position: relative; margin-bottom: 28px; font-size: 16px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step { display: inline-block; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step h3 { font-size: 16px; font-weight: normal; letter-spacing: 5px; margin-bottom: 5px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.tap-on { width: 227px; max-width: 227px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.tap-off { width: 190px; max-width: 190px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.service { width: 160px; max-width: 160px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.fare { width: 90px; max-width: 90px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.transaction-divider { height: 40px; margin: 0 30px 0 5px; border-left-width: 1px; border-left-style: solid; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.transaction-arrow { font-family: monospace; font-size: 35px; font-weight: bold; margin: 0 50px; position: relative; top: -12px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .refund-btn { position: absolute; right: 25px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box hr { width: calc(100% - 40px); margin-left: 20px; height: 1px; border: none; display: none; } @media only screen and (max-width: 1120px) { body div.content main .mango-main #mango-contactless-transactions .transaction-box { margin-left: -110px; } } @media only screen and (max-width: 1370px) { body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .refund-btn { top: -25px; } } @media only screen and (max-width: 991px) { body div.content main .mango-main #mango-contactless-transactions .transaction-box { margin-left: inherit; width: 100%; min-width: initial; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.transaction-divider { display: none; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.tap-on, body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.tap-off, body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.service, body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.fare { width: 44%; max-width: 44%; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.fare { margin-left: 44px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.transaction-arrow { margin: 0 20px 0 0; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step h3 { margin-top: 10px; font-weight: normal; font-family: 'Abadi MT Std ExtraLight'; letter-spacing: 3px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .refund-btn { top: 50%; margin-top: -0.5em; } } @media only screen and (max-width: 767px) { body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction-date, body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction { margin: 18px 0 10px 18px; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction { border-bottom-width: 1px; border-bottom-style: solid; padding: 10px 0; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction:last-child { border-bottom: none; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step { display: block; margin-top: 10px; width: auto; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.fare { margin-left: 0; } body div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.transaction-arrow { display: none; } body div.content main .mango-main #mango-contactless-transactions .transaction-box#top-details { margin-top: 20px; } } body div.content main .mango-main #modal-refund input[type='text'], body div.content main .mango-main #modal-refund-message input[type='text'] { width: 100%; } @media only screen and (max-width: 767px) { body div.content main .mango-main #modal-refund .modal__footer, body div.content main .mango-main #modal-refund-message .modal__footer { width: calc(100% - 80px); } } @media only screen and (max-width: 767px) and (max-height: 630px) { body div.content main .mango-main #modal-refund .modal__footer, body div.content main .mango-main #modal-refund-message .modal__footer { top: 525px; } } body div.content main .mango-main #modal-refund .modal__overlay, body div.content main .mango-main #modal-refund-message .modal__overlay { z-index: 10; } body div.content main .mango-main #modal-refund .invalidMessage, body div.content main .mango-main #modal-refund-message .invalidMessage { max-height: initial; } body div.content main .mango-main #kinchbus-journey-history #journey-dates { margin-top: 26px; margin-bottom: 26px; border: none; } @media only screen and (max-width: 767px) { body div.content main .mango-main #kinchbus-journey-history #journey-dates { width: 100%; } } body div.content main .mango-main #kinchbus-journey-history #journey-dates label { display: inline-block; margin-right: 10px; margin-bottom: 10px; font-weight: bold; } @media only screen and (max-width: 767px) { body div.content main .mango-main #kinchbus-journey-history #journey-dates label { display: block; } } body div.content main .mango-main #kinchbus-journey-history #journey-dates div { display: inline-block; } @media only screen and (max-width: 767px) { body div.content main .mango-main #kinchbus-journey-history #journey-dates div { display: flex; } } body div.content main .mango-main #kinchbus-journey-history #journey-dates input { -webkit-appearance: none; -webkit-border-radius: 0; border-width: 1px; border-style: solid; background-color: white; padding: 5px 15px; line-height: 24px; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); cursor: pointer; } @media only screen and (max-width: 767px) { body div.content main .mango-main #kinchbus-journey-history #journey-dates input { flex: 1; } } body div.content main .mango-main #kinchbus-journey-history #journey-dates input:first-of-type { border-top-left-radius: 4px; border-bottom-left-radius: 4px; } body div.content main .mango-main #kinchbus-journey-history #journey-dates input:last-of-type { border-top-right-radius: 4px; border-bottom-right-radius: 4px; } body div.content main .mango-main #kinchbus-journey-history #journey-dates input.active { color: #fff; } body div.content main .mango-main #kinchbus-journey-history .transaction-box { margin: 16px auto; border-width: 1px; border-style: solid; border-radius: 4px; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body div.content main .mango-main #kinchbus-journey-history .transaction-box#top-details { padding-top: 18px; padding-bottom: 28px; margin-top: 55px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box#top-details div { margin: 12px 0 0 36px; font-size: 20px; font-weight: normal; } body div.content main .mango-main #kinchbus-journey-history .transaction-box#top-details .field-heading { font-weight: bold; } body div.content main .mango-main #kinchbus-journey-history .transaction-box .transaction-fields { margin-top: 3px; line-height: 56px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box { margin-top: 20px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction-date, body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction { margin: 24px 0 0 36px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction-date { font-size: 20px; font-weight: bold; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction { margin-bottom: 28px; font-size: 16px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step:first-child { min-width: 165px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step:last-child { border-right: none !important; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step { display: inline-block; padding-right: 35px; margin-right: 35px; line-height: 1.5; border-right-width: 1px; border-right-style: solid; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step h3 { font-size: 16px; font-weight: normal; letter-spacing: 5px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step.transaction-arrow { font-family: monospace; font-size: 35px; font-weight: bold; margin: 0 50px; position: relative; top: -12px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step.tapoff-step { min-width: 165px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step.product-step-line-break { padding-left: 0; min-width: 103px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box hr { width: calc(100% - 40px); margin-left: 20px; height: 1px; border: none; display: none; } @media only screen and (max-width: 767px) { body div.content main .mango-main #kinchbus-journey-history .transaction-box { min-width: 10px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction-date, body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction { margin: 18px 0 10px 18px; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction { border-bottom-width: 1px; border-bottom-style: solid; padding: 10px 0; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction:last-child { border-bottom: none; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-divider { display: none; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step { display: block; margin-top: 10px; width: auto; padding-left: 0px; border-right: none !important; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step.fare { margin-left: 0; } body div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step.transaction-arrow { display: none; } body div.content main .mango-main #kinchbus-journey-history .transaction-box#top-details { margin-top: 20px; } } body div.content main .mango-main #mango-faq p, body div.content main .mango-main .mango-faq p { margin-top: 55px; } body div.content main .mango-main #mango-faq > div > p > a, body div.content main .mango-main .mango-faq > div > p > a, body div.content main .mango-main #mango-faq > p > a, body div.content main .mango-main .mango-faq > p > a { font-size: 20px; font-family: 'Abadi MT Pro Bold'; text-decoration: none; } body div.content main .mango-main #mango-faq > div > p > a:after, body div.content main .mango-main .mango-faq > div > p > a:after, body div.content main .mango-main #mango-faq > p > a:after, body div.content main .mango-main .mango-faq > p > a:after { content: '>'; float: right; font-family: monospace; font-weight: bold; font-size: 52px; transition: transform 0.25s; transform-origin: center center; margin-top: -28px; line-height: 74px; } @media only screen and (max-width: 767px) { body div.content main .mango-main #mango-faq > div > p > a:after, body div.content main .mango-main .mango-faq > div > p > a:after, body div.content main .mango-main #mango-faq > p > a:after, body div.content main .mango-main .mango-faq > p > a:after { font-size: 30px; margin-left: 5px; } } body div.content main .mango-main #mango-faq > div > p > a.closed:after, body div.content main .mango-main .mango-faq > div > p > a.closed:after, body div.content main .mango-main #mango-faq > p > a.closed:after, body div.content main .mango-main .mango-faq > p > a.closed:after { transform: rotate(90deg); } body div.content main .mango-main #mango-faq > div > p > a.open:after, body div.content main .mango-main .mango-faq > div > p > a.open:after, body div.content main .mango-main #mango-faq > p > a.open:after, body div.content main .mango-main .mango-faq > p > a.open:after { transform: rotate(-90deg); margin-right: 7px; } body div.content main .mango-main #mango-faq .answer, body div.content main .mango-main .mango-faq .answer { margin-top: 18px; } body div.content main .mango-main #mango-faq .answer p, body div.content main .mango-main .mango-faq .answer p { margin-top: 0; } body div.content main .mango-main #mango-faq .answer p:after, body div.content main .mango-main .mango-faq .answer p:after { content: ''; } body div.content main .mango-main #mango-faq .answer a:after, body div.content main .mango-main .mango-faq .answer a:after { content: ''; } @media only screen and (max-width: 767px) { body div.content main .mango-main #mango-faq p, body div.content main .mango-main .mango-faq p { border-bottom-style: solid; border-bottom-width: 1px; padding-bottom: 24px; } body div.content main .mango-main #mango-faq a:after, body div.content main .mango-main .mango-faq a:after { font-size: 32px; } body div.content main .mango-main #mango-faq a.open:after, body div.content main .mango-main .mango-faq a.open:after { margin-right: 2px; } body div.content main .mango-main #mango-faq .answer, body div.content main .mango-main .mango-faq .answer { margin-top: 30px; } body div.content main .mango-main #mango-faq .answer p, body div.content main .mango-main .mango-faq .answer p { border-bottom: none; padding-bottom: 0; } } body div.content main .mango-main #mango-terms, body div.content main .mango-main .mango-terms { margin-top: 15px; } body div.content main .mango-main #mango-terms p, body div.content main .mango-main .mango-terms p { margin: 15px 0; } body div.content main .mango-main #mango-homepage-columns { display: flex; flex-wrap: wrap; position: relative; } body div.content main .mango-main #mango-homepage-columns .add-contactless-btn { position: absolute; display: inline-flex; text-decoration: none; text-align: right; font-size: 16px; font-weight: bold; top: 16px; right: 68px; } body div.content main .mango-main #mango-homepage-columns .add-contactless-btn:hover span { text-decoration: underline; } body div.content main .mango-main #mango-homepage-columns .add-contactless-btn .plus-icon { position: relative; top: -3px; left: 9px; height: 27px; width: 27px; background-size: 27px; background-position: right center; background-repeat: no-repeat; } body div.content main .mango-main #mango-homepage-columns .add-contactless-btn .add-mobile { display: none; } body div.content main .mango-main #mango-homepage-columns .homepage-column { flex: 1 0 50%; position: relative; } body div.content main .mango-main #mango-homepage-columns .homepage-column .edit-subheader { font-size: 24px; margin-bottom: 35px; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details { display: inline-block; width: 98%; min-width: 368px; max-width: 510px; position: relative; color: #fff; margin: 0 30px 30px 0; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .inner-card { border-width: 1px; border-style: solid; border-radius: 4px; padding-left: 38px; padding-right: 38px; padding-bottom: 20px; min-height: 185px; overflow: hidden; position: relative; z-index: 1; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .inner-card .card-shine { position: absolute; top: 0; left: 40%; width: 290px; height: 415px; transform: rotate(-28deg); transform-origin: top left; background-color: rgba(218, 228, 240, 0.13); z-index: -1; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .drop-card, body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .mid-drop-card { background-color: white; padding-left: 38px; padding-right: 31px; padding-top: 13px; padding-bottom: 15px; border-width: 1px; border-style: solid; border-radius: 0px 0px 4px 4px; border-width: 0px 1px 1px 1px; margin-top: -3px; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .mid-drop-card { border-radius: 0px 0px 4px 4px; border-width: 1px 1px 1px 1px; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .products h3 { margin: 10px 0; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .products .product-title { font-weight: bold; margin-right: 4px; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .products .product-info { margin-left: 4px; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .products .product { border-bottom-width: 1px; border-bottom-style: solid; margin-bottom: 10px; padding: 10px 0; display: flex; flex-wrap: wrap; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .products .product:last-of-type { border-bottom: none; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .products .product > span { width: 50%; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .mid-drop-card { display: none; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details.open-mid-card .mid-drop-card, body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details.open-mid-card .inner-card, body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details.open-mid-card .drop-card { position: relative; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details.open-mid-card .inner-card { z-index: 2; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details.open-mid-card .mid-drop-card { z-index: 1; display: block; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details.open-mid-card .drop-card { z-index: 0; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details.open-mid-card .view-products-btn { background: url(/images/redesign_2019/homepage/dots-grey.png) no-repeat center right !important; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards { left: 50px; } @media only screen and (max-width: 1400px) { body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards { left: auto; left: initial; } } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .contactless-card-number { margin-top: 34px; font-family: 'Abadi MT Pro Bold'; font-size: 20px; letter-spacing: 1.5px; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .contactless-card-name-expiry { margin-top: 3px; font-family: 'Abadi MT Std Extralight'; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .card-icon { height: 36.56px; width: 49.36px; border: 2px solid #fff; border-radius: 4px; position: absolute; top: 60px; right: 34px; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .card-icon .card-line { height: 0; width: 49.36px; border: 1px solid #fff; position: absolute; top: 12px; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .contactless-card-links { position: absolute; bottom: 15px; left: 38px; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .contactless-card-links .button { padding-left: 0; width: auto; min-width: auto; text-align: left; letter-spacing: initial; margin-right: 20px; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .view-journey-btn { position: absolute; bottom: 20px; right: 31px; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .marketing-icon { position: absolute; top: 10px; right: 10px; height: 29px; width: 29px; background-size: 29px; background-position: right center; background-repeat: no-repeat; background-image: url('/images/redesign_2019/homepage/opt-in.png'); } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .marketing-tooltip { position: absolute; top: 5px; right: 45px; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .see-all-btn { margin-top: -11px; float: right; margin-right: 9px; text-align: right; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .topup-card-name { margin-top: 34px; font-family: 'Abadi MT Pro Bold'; font-size: 24px; max-width: calc(100% - 185px); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details c .topup-card-type { font-family: 'Abadi MT Pro Bold'; font-size: 20px; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .topup-card-number { margin-top: 9px; font-family: 'Abadi MT Std Extralight'; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .topup-card-links { position: absolute; bottom: 15px; left: 38px; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .topup-card-links .button { padding-left: 0; width: auto; min-width: auto; text-align: left; letter-spacing: initial; margin-right: 20px; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .topup-btn { position: absolute; top: 34px; right: 31px; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .journey-btn { position: absolute; top: 91px; right: 31px; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .view-products-btn { background: url(/images/redesign_2019/homepage/dots-white.png) no-repeat center right; position: absolute; right: 31px; bottom: 15px; color: transparent; width: 100px !important; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .button { width: 185px; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .card-bottom-options { display: flex; flex-flow: wrap; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .card-bottom-options .button { text-transform: none; width: 50%; height: 30px; padding: 0; text-align: left; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .see-all-btn { margin-top: -11px; float: right; margin-right: 59px; text-align: right; } body div.content main .mango-main #mango-homepage-columns #homepage-divider { position: absolute; left: calc(50% - 3px); top: 78px; height: calc(100% - 148px); } @media only screen and (max-width: 1400px) { body div.content main .mango-main #mango-homepage-columns #homepage-divider { display: none; } } body div.content main .mango-main #mango-homepage-columns .see-all-btn:hover span { text-decoration: underline; } body div.content main .mango-main #mango-homepage-columns .see-all-btn .all-mobile { display: none; } @media only screen and (max-width: 767px) { body div.content main .mango-main #mango-homepage-columns .homepage-column { flex: 1 0 100%; width: 100%; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details { width: 100%; margin-right: 0px; min-width: initial; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details.has-nickname .inner-card { min-height: 283px; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .inner-card { min-height: 253px; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .drop-card { padding-right: 38px; } body div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .products .product > span { width: 100%; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .button { width: 100%; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .topup-card-name { max-width: initial; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .card-bottom-options .button { width: 100%; display: block; text-align: center; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .topup-btn { margin-top: 5px; position: static; } body div.content main .mango-main #mango-homepage-columns #mango-topup-cards .topup-card-details .journey-btn.full { margin-top: 14px; position: static; display: block; } body div.content main .mango-main #mango-homepage-columns .card-icon { display: none; } body div.content main .mango-main #mango-homepage-columns .add-contactless-btn { right: 12px; left: auto; left: initial; } body div.content main .mango-main #mango-homepage-columns .add-contactless-btn .add-mobile { display: inline-block; } body div.content main .mango-main #mango-homepage-columns .add-contactless-btn .add-full { display: none; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .inner-card { min-height: 184px; } body div.content main .mango-main #mango-homepage-columns #mango-contactless-cards .contactless-card-details .button { width: 100%; margin-top: 5px; position: static; } body div.content main .mango-main #mango-homepage-columns .see-all-btn { float: right; margin-right: 4px !important; text-align: right; width: 100%; margin-bottom: 20px; } body div.content main .mango-main #mango-homepage-columns .see-all-btn .all-mobile { display: inline-block; } body div.content main .mango-main #mango-homepage-columns .see-all-btn .all-full { display: none; } } body .modal__container { padding: 60px 40px; max-width: 700px; font-family: 'Abadi MT Std'; } @media only screen and (max-width: 767px) { body .modal__container { height: 100vh; } } body .modal__container .modal__close { background-size: 25px; background-position: center center; background-repeat: no-repeat; padding: 10px; margin-top: -80px; margin-right: -10px; cursor: pointer; } body .modal__container .modal__close:before { content: ''; } body .modal__container main.modal__content { padding: 0; } body .modal__container main.modal__content a { text-transform: uppercase; text-decoration: none; } @media only screen and (max-width: 767px) { body .modal__container .modal__footer { position: absolute; bottom: 60px; left: 40px; } } body .modal__container .modal__btn.button { font-size: 1rem; text-transform: uppercase; border: none; } @media only screen and (max-width: 767px) { body .modal__container .modal__btn.button { width: 300px; max-width: 90%; } } body .modal__container h2.modal__title { padding: 0; font-size: 30px; } body div.modal__overlay { z-index: 3; } body .hamburger { transform: scale(0.5); margin-top: 4px; } body .hamburger .hamburger-inner, body .hamburger .hamburger-inner:after, body .hamburger .hamburger-inner:before { background-color: #fff; } body div.content header { transition: background-color 0.5s; } body div.content header nav.main-nav { transition: height 0.5s, padding 0.5s; width: 100%; box-sizing: border-box; float: none; } body div.content header nav.main-nav .logo { background-size: contain; background-repeat: no-repeat; background-position: 50% 50%; height: 29px; width: 141px; display: inline-block; } body div.content header nav.main-nav > ul { display: flex; flex-direction: row; align-items: center; height: 120px; max-width: 1440px; margin: 0 auto; } body div.content header nav.main-nav > ul > li.logo-outer { margin-top: -12px; margin-right: 20px; } body div.content header nav.main-nav > ul > li.logo-outer a, body div.content header nav.main-nav > ul > li.logo-outer a:hover, body div.content header nav.main-nav > ul > li.logo-outer a:focus { background-color: transparent !important; } body div.content header nav.main-nav > ul > li { float: none; position: relative; } body div.content header nav.main-nav > ul > li.loginout { margin-left: auto; } body div.content header nav.sub-nav { background: white; display: block; height: 50px; text-align: left; } body div.content header nav.sub-nav a { color: #005CA9; text-transform: uppercase; font-size: 14px; line-height: 50px; vertical-align: middle; display: inline-block; font-weight: bold; margin-right: 10px; } body div.content header nav.menu { font-size: 18px; line-height: 20px; position: absolute; left: 0; right: 0; z-index: 999999; /*Place higher than footer just in case*/ } body div.content header nav.menu > a { display: none; } @media only screen and (max-width: 767px) { body div.content header nav.menu > a.fares-and-tickets { display: none; } } body div.content header nav.menu ul { list-style: none; } body div.content header nav.menu ul div.col { float: none; width: auto; } body div.content header nav.menu li.navTitle { font-size: 20px; line-height: 24px; } body div.content header nav.menu li { margin-bottom: 34px; } body div.content header nav.menu > ul { display: flex; align-items: stretch; /* Default */ justify-content: space-between; width: 100%; max-width: 1440px; margin: 0 auto; flex-basis: 0; grid-template-columns: 1fr; column-gap: 10px; } body div.content header nav.menu > ul > li { flex: 1 1; display: block; /*flex: 0 1 auto;*/ } body div.content header nav.menu > ul > li > a { font-weight: bold; font-size: 20px; line-height: 24px; margin-bottom: 34px; display: block; } body div.content header nav.menu .select2.busDropdown { margin-top: -10px; width: 90%; box-sizing: border-box; } body div.content header nav.menu .select2.busDropdown .select2-choice { width: 100%; } body div.content header #routesTimetableOnlyDropdown { display: none; position: absolute; background-color: #fff; padding: 10px; border: 1px solid #373536; border-radius: 0 7px 7px 7px; z-index: 100; width: 416px; } body div.content header #routesTimetableOnlyDropdown #timetableServicesLeft, body div.content header #routesTimetableOnlyDropdown #timetableServicesRight { display: inline-block; width: 205px; vertical-align: top; } body div.content header #routesTimetableOnlyDropdown a { color: #373536; padding: 1px 6px; width: 190px; display: inline-block; } body div.content header #routesTimetableOnlyDropdown #routesTimetableOnlyDropdownHeader { position: absolute; background-color: #fff; color: #373536; padding: 7px 9px 10px 9px; border-bottom: none; border-radius: 7px 7px 0 0; z-index: 100; top: -40px; left: 0px; cursor: pointer; } @media only screen and (max-width: 767px) { body div.hero-nav-shaded { padding: 16px; } body div.hero-nav-shaded h1 { font-size: 24px; } body div.hero-nav-shaded .breadcrumb { font-size: 14px; margin-bottom: 5px; } } body div.hero { position: relative; } body div.hero.serviceHome div.heroInner { padding-bottom: 20px; } body div.hero.routefinder div.heroInner div.heroText h1 { font-size: 72px; } body div.hero div.heroInner { max-width: 1440px; margin: 0 auto; /*height: 343px; content varies so cannot be fixed height*/ min-height: 343px; display: flex; flex-direction: row; overflow: hidden; transition: height 0.5s, padding 0.5s; padding: 0 150px; padding-bottom: 50px; } body div.hero div.heroInner div.heroText { z-index: 2; max-width: 75%; } body div.hero div.heroInner div.heroText div.breadcrumb { padding-top: 50px; font-family: 'Abadi MT Std ExtraLight'; font-size: 16px; transition: padding 0.5s, font-size 0.5s; } body div.hero div.heroInner div.heroText div.breadcrumb a { color: white; text-decoration: none; } body div.hero div.heroInner div.heroText h1 { padding-top: 45px; line-height: 1em; font-size: 56px; transition: padding 0.5s, font-size 0.5s; color: white; } body div.hero div.heroInner div.heroText div.subtitle { color: #fff; line-height: 1em; padding-top: 20px; font-size: 30px; transition: padding 0.5s, font-size 0.5s, opacity 0.5s; letter-spacing: 0.25px; } body div.hero div.heroInner div.heroText div.subtitle.smaller { font-size: 24px; } body div.hero div.heroInner div.heroText .button { margin-top: 40px; } body div.hero div.heroInner div.heroText .button.call-to-action { display: none; } @media only screen and (min-width: 768px) { body div.hero div.heroInner div.heroText .button.call-to-action.non-mobile { display: inline-block; } } @media only screen and (max-width: 767px) { body div.hero div.heroInner div.heroText .button.call-to-action.mobile { display: inline-block; } } @media only screen and (max-width: 767px) { body div.hero div.heroInner div.heroText .button { margin-top: 0; } } body div.hero.simple { background-image: none !important; background-color: white !important; } body div.hero div.heroImage { display: flex; margin-left: auto; height: 100%; flex-grow: 1; position: relative; z-index: 1; } body div.hero div.heroImage img { height: 250px; position: absolute; right: 0; bottom: 50px; } body div.hero div.heroImage.heroImageFill { top: 0; left: 0; position: absolute; width: 100%; } body div.hero div.heroImage.heroImageFill img { min-width: 100%; min-height: 100% !important; margin-top: 0 !important; top: 0; right: auto; bottom: auto; height: auto; object-fit: cover; object-position: center center; position: static; } @media only screen and (max-width: 991px) { body div.content header ul.main > li:not(:last-child):not(:first-child):not(.loginout) { display: none; } body div.content header nav.main-nav { padding-left: 45px; } body div.content header nav.main-nav > ul > li { position: initial; } body div.content header nav.sub-nav { padding-left: 45px; } body div.content header nav.sub-nav a { font-size: 12px; margin-right: 5px; } body div.content header.mobile { display: none; } body div.hero.routefinder div.heroInner div.heroText h1 { font-size: 56px; } body div.hero div.heroInner { padding: 0 45px; /*height: 278px; content varies so cannot be fixed height*/ padding-bottom: 50px; min-height: 278px; } body div.hero div.heroInner div.heroText h1 { font-size: 45px; } body div.hero div.heroInner div.heroText div.subtitle { padding-top: 15px; font-size: 16px; } body div.hero div.heroInner div.heroImage img { height: 200px; right: 0; bottom: 50px; } } body div.content header nav.menu > a { display: block; text-align: center; margin: 54px 0 48px; } body div.content header nav.menu > ul { display: block; text-align: center; } body div.content header nav.menu > ul > li > a + div { display: none; } body div.content header nav.menu > ul > li > a::after { transition: transform 0.5s; background: url('/images/redesign_2019/nav/large_orange_arrow@2x.png'); background-size: contain; background-repeat: no-repeat; content: " "; width: 13px; height: 20px; display: inline-block; position: absolute; margin-top: 2px; right: 50px; } body div.content header nav.menu > ul > li > a.open::after { transform: rotate(90deg); } body div.content header.view-mobile { height: auto; padding: 53px 0 0; background-size: 86px 18px; background-position: 16px 15px; background-repeat: no-repeat; } body div.content header.view-mobile > a.logo-button { position: absolute; left: 10px; top: 10px; color: transparent; width: 100px; height: 48px; } body div.content header.view-mobile > * { padding: 0 !important; } body div.content header.view-mobile .hamburger { position: absolute; top: 14px; right: 14px; } body div.content header.view-mobile .mobile-menu-button { display: inline-block; width: 50%; background-color: #DAE4F0; margin: 0; padding: 0; color: #005CA9; text-transform: uppercase; vertical-align: middle; font-weight: bold; text-align: center; } body div.content header.view-mobile .mobile-menu-button.active { background-color: white; } body div.content header.view-mobile .mobile-menu-button span { font-size: 14px; line-height: 35px; vertical-align: middle; padding-top: 3px; display: inline-block; } body div.content header.view-mobile .mobile-menu-button img { height: 16px; line-height: 35px; vertical-align: middle; display: inline-block; margin-left: 8px; } body div.content header.view-mobile .nav-contents ul { list-style-type: none; } body div.content header.view-mobile .nav-contents ul li { width: 100%; height: 40px; line-height: 40px; vertical-align: middle; border-bottom: 1px solid #DAE4F0; padding: 0 16px; font-size: 14px; text-transform: uppercase; } @media only screen and (max-width: 767px) { body div.hero.routefinder div.heroInner div.heroText h1 { font-size: 36px; } body div.hero.routefinder div.heroInner div.heroText div.subtitle { display: none; } body div.hero div.heroInner { padding: 0 16px; /*height: 78px; content varies so cannot be fixed height*/ padding-bottom: 10px; min-height: 78px; } body div.hero div.heroInner div.heroText h1 { font-size: 24px; padding-top: 8px; margin-bottom: 6px; } body div.hero div.heroInner div.heroText div.subtitle { font-size: 16px !important; line-height: 18px !important; padding-top: 3px; padding-bottom: 5px; } body div.hero div.heroInner div.heroText div.breadcrumb { padding-top: 10px; } body div.hero div.heroInner div.heroImage img { display: none; } body form[action^="/destinations/"] div.hero div.heroInner div.heroImage img { display: initial; } body form[action^="/destinations/"] div.hero div.heroInner div.heroText h1 { padding-top: 45px; } body form[action^="/destinations/"] div.content main { padding: 145px 15px; } } body .cookie-banner { background-color: #DAE4F0; text-align: center; font-family: 'Abadi MT Std'; padding-top: 5px; padding-bottom: 5px; } body .cookie-banner .button.linkstyle { letter-spacing: normal; letter-spacing: initial; margin-left: 10px; color: #005CA9 !important; height: 20px; } @media only screen and (max-width: 767px) { body .cookie-banner .btn-closecookie { margin-top: -10px; } } /*What's on filters*/ .whats-on-filters label { margin-top: 18px; margin-left: 5px; margin-right: 5px; display: inline-block; } @media only screen and (max-width: 767px) { .whats-on-filters label:not(.label-to) { width: 100px !important; min-width: initial !important; margin-left: 0; margin-right: 0; } } .whats-on-filters input { margin-top: 5px; vertical-align: top; } .whats-on-filters input#from, .whats-on-filters input#to { height: 48px; margin-bottom: 8px; color: #E8480E; border: 1px solid #E8480E; border-radius: 4px; font-family: 'MuseoSans-500'; font-size: 14px; font-weight: normal; text-align: center; min-height: 44px; min-width: 153px; padding-right: 8px; background-color: #ffffff; } @media only screen and (max-width: 767px) { .whats-on-filters input#from, .whats-on-filters input#to { width: calc(50% - 79px); min-width: 0; } } .whats-on-filters .select2-container { width: 260px; margin-bottom: 8px; } @media only screen and (max-width: 767px) { .whats-on-filters .select2-container { width: calc(100% - 101px); margin-left: -4px; } } .whats-on-filters .select2-container .select2-input { display: none; } .whats-on-filters .select2-container .select2-choices { background-color: #fff; color: #E8480E; border: 1px solid #E8480E; padding: 10px 0px; border-radius: 4px; background-image: url(/images/redesign_2019/nav/arrow_down@2x.png); background-position-x: calc(100% - 10px); background-position-y: center; background-repeat: no-repeat; } .whats-on-filters .select2-container .select2-search-choice { color: #E8480E; border-color: #E8480E; background: none; } .whats-on-filters .whats-on-filter-group { break-inside: avoid; display: none; } .whats-on-filters .whats-on-filter-group label { min-width: 82px; } .whats-on-filters .whats-on-filter-group.show, .whats-on-filters .whats-on-filter-group.wof-location, .whats-on-filters .whats-on-filter-group.wof-type, .whats-on-filters .whats-on-filter-group.wof-busroutes { display: inline-block; } .whats-on-filters .whats-on-filter-group.show label, .whats-on-filters .whats-on-filter-group.wof-location label, .whats-on-filters .whats-on-filter-group.wof-type label, .whats-on-filters .whats-on-filter-group.wof-busroutes label { width: initial; min-width: initial; } @media only screen and (max-width: 767px) { .whats-on-filters .whats-on-filter-group { width: 100%; } } .whats-on-filters button { margin-top: 8px; } @media only screen and (min-width: 1755px) { .whats-on-filters button.search-btn { margin-left: 51px; } } .whats-on-filters button.secondary { background: none !important; color: #E8480E !important; border: none !important; box-shadow: none !important; } .whats-on-filters button.secondary img { width: 20px; position: relative; top: 5px; } @media only screen and (max-width: 767px) { .whats-on-filters button { min-width: 75px; } } html { height: 100%; } /* DESKTOP */ body { margin: 0; padding: 0; background-color: #f9f9fb; min-height: 100%; position: relative; font-family: 'Abadi MT Std'; font-size: 16px; overflow-x: hidden; } body main { display: block; position: relative; } body div.topbar { position: absolute; top: 0; left: 0; background-color: #F0F6FB; height: 56px; display: block; width: 100%; } body div.topbar p { vertical-align: middle; line-height: 56px; padding: 0 150px 0 185px; } body div.content { margin: 0 auto; /*max-width: 1440px;*/ } body div.content header a { color: #fff; text-decoration: none; } body div.content header > * { transition: padding 0.5s; padding: 0 150px; } body div.content main { transition: transform 0.5s, opacity 0.5s; background-color: #fff; min-height: 100px; padding: 75px 150px; margin: 0 auto; max-width: 1440px; } body div.content main.no-content { min-height: 0; padding: 0; } body div.content footer { font-family: 'Abadi MT Std ExtraLight'; } body div.content footer a { text-decoration: none; } body div.content footer div.mainfooter { transition: padding 0.5s; padding: 72px 150px 30px; } body div.content footer div.mainfooter > ul { list-style: none; width: 100%; display: flex; font-family: 'Abadi MT Pro Bold'; font-weight: bold; max-width: 1440px; margin: 0 auto; } body div.content footer div.mainfooter > ul > li.SocialLinks { text-align: center; } body div.content footer div.mainfooter > ul > li.SocialLinks a { width: 33px; height: 33px; background-image: url("/images/redesign_2019/SocialSprites.png") !important; background-repeat: no-repeat; background-size: 400% 300%; transform: scale(0.75); padding: 0; display: inline-block; margin: 0 10px; } body div.content footer div.mainfooter > ul > li.SocialLinks a.twitter { background-position: 0 0; } body div.content footer div.mainfooter > ul > li.SocialLinks a.facebook { background-position: -33px 0; } body div.content footer div.mainfooter > ul > li.SocialLinks a.youtube { background-position: -66px 0; } body div.content footer div.mainfooter > ul > li.SocialLinks a.insta { background-position: -99px 0; } body div.content footer div.mainfooter > ul > li { flex-grow: 1; text-transform: uppercase; } body div.content footer div.mainfooter > ul > li > ul { text-transform: none; list-style: none; font-family: 'Abadi MT Std ExtraLight'; font-weight: normal; } body div.content footer div.mainfooter > ul > li > ul a { display: block; padding-top: 20px; } body div.content footer div.subfooter { letter-spacing: 0.75px; height: 73px; display: flex; justify-content: center; align-items: center; } body div.content footer div.subfooter > a { margin: 0 8px; } body #ui-datepicker-div { display: none; } @media only screen and (max-width: 1280px) { body div.content footer div.mainfooter { padding: 72px 45px 30px; } } /*@media @tablet { body { div.topbar { position: absolute; top: 0; left: 0; background-color: @kb_topbar; height: auto; display: block; width: 100%; p { vertical-align: middle; line-height: 22px; padding: 10px 10px 5px 45px; } } div.content { header { nav { padding: 0 25px; } div.hero { padding: 0 45px; } } main { padding: 76px 45px; } footer { div.mainfooter { padding: 0 25px; > ul { margin: 0 auto; display: block; width: auto; a { transition: height 0.5s, background-image 0.5s; height: 62px; width: 300px; display: flex; justify-content: center; align-items: center; margin: 0 auto; padding: 0 10px; background-image: url('/images/redesign_2019/kinchbus/yellow-plus.png'); background-size: 14px; background-position: right center; background-repeat: no-repeat; } > li { text-align: center; &.selected a { background-image: url('/images/redesign_2019/kinchbus/yellow-cross.png'); background-size: 14px; } > ul { transition: max-height 1s; max-height: 0px; overflow: hidden; > li > a { padding-top: 0; height: 30px; background-image: url('/images/redesign_2019/nav/arrow@2x.png') !important; background-size: 8px 10px !important; } } &.selected { > ul { max-height: 300px; } } } > li.SocialLinks { a { margin: 20px 15px 10px; } } } } } } } }*/ @media only screen and (max-width: 991px) { body div.topbar { position: absolute; top: 0; left: 0; background-color: #F0F6FB; height: auto; display: block; width: 100%; } body div.topbar p { vertical-align: middle; line-height: 22px; padding: 10px 10px 5px 45px; } body div.content header nav { padding: 0 25px; } body div.content header div.hero { padding: 0 45px; } body div.content main { padding: 76px 45px; } body div.content footer div.mainfooter { padding: 0 25px; } body div.content footer div.mainfooter > ul { margin: 0 auto; display: block; width: auto; } body div.content footer div.mainfooter > ul a { transition: height 0.5s, background-image 0.5s; height: 62px; width: 300px; display: flex; justify-content: center; align-items: center; margin: 0 auto; padding: 0 10px; background-image: url('/images/redesign_2019/kinchbus/yellow-plus.png'); background-size: 14px; background-position: right center; background-repeat: no-repeat; } body div.content footer div.mainfooter > ul > li { text-align: center; } body div.content footer div.mainfooter > ul > li.selected a { background-image: url('/images/redesign_2019/kinchbus/yellow-cross.png'); background-size: 14px; } body div.content footer div.mainfooter > ul > li > ul { transition: max-height 1s; max-height: 0px; overflow: hidden; } body div.content footer div.mainfooter > ul > li > ul > li > a { padding-top: 0; height: 30px; background-image: url('/images/redesign_2019/nav/arrow@2x.png') !important; background-size: 8px 10px !important; } body div.content footer div.mainfooter > ul > li.selected > ul { max-height: 300px; } body div.content footer div.mainfooter > ul > li.SocialLinks a { margin: 20px 15px 10px; } } body div.content footer div.mainfooter { padding: 0 25px; } body div.content footer div.mainfooter > ul { margin: 0 auto; display: block; width: auto; } body div.content footer div.mainfooter > ul a { transition: height 0.5s, background-image 0.5s; height: 62px; width: 300px; display: flex; justify-content: center; align-items: center; margin: 0 auto; padding: 0 10px; background-image: url('/images/redesign_2019/kinchbus/yellow-plus.png'); background-size: 14px; background-position: right center; background-repeat: no-repeat; } body div.content footer div.mainfooter > ul > li { text-align: center; } body div.content footer div.mainfooter > ul > li.selected a { background-image: url('/images/redesign_2019/kinchbus/yellow-cross.png'); background-size: 14px; } body div.content footer div.mainfooter > ul > li > ul { transition: max-height 1s; max-height: 0px; overflow: hidden; } body div.content footer div.mainfooter > ul > li > ul > li > a { padding-top: 0; height: 30px; background-image: url('/images/redesign_2019/nav/arrow@2x.png') !important; background-size: 8px 10px !important; } body div.content footer div.mainfooter > ul > li.selected > ul { max-height: 300px; } body div.content footer div.mainfooter > ul > li.SocialLinks a { margin: 20px 15px 10px; } @media only screen and (max-width: 767px) { body * { -webkit-tap-highlight-color: transparent; } body div.content header div.hero { padding: 0 15px; height: 67px; } body div.content header div.hero div.heroText div.breadcrumb { padding-top: 0; font-size: 14px; display: none; } body div.content header div.hero div.heroText div.breadcrumb.mobile { display: block; } body div.content header div.hero div.heroText h1 { letter-spacing: 0.5px; font-family: 'Abadi MT Std'; font-weight: normal; padding-top: 10px; font-size: 24px; } body div.content header div.hero div.heroText div.subtitle { opacity: 0; font-size: 0.00000001px; } body div.content header div.hero div.heroImage { opacity: 0; } body div.content main { padding: 20px 15px; } body div.content main.has-topbar { padding-top: 90px; } body div.content footer div.mainfooter { padding: 0 15px; } body div.content footer div.mainfooter > ul { margin: 0 auto; display: block; width: auto; } body div.content footer div.mainfooter > ul a { height: 41px; width: auto; justify-content: left; padding: 0 10px 0 0; } body div.content footer div.mainfooter > ul > li { text-align: left; } body div.content footer div.mainfooter > ul > li.SocialLinks a { margin: 50px 15px 10px; } } body.Trent.Barton { font-family: 'MuseoSans-300'; /* Buttons */ /* inputs */ /* Login specific */ /* Topup specific */ /* Topup history specific */ /* Saver purchase result specific */ } body.Trent.Barton .lite { font-family: 'MuseoSans-100'; } body.Trent.Barton h1 { font-family: 'MuseoSans-900'; font-size: 56px; letter-spacing: -1.5px; font-weight: normal; } body.Trent.Barton h2 { font-family: 'MuseoSans-700'; font-size: 24px; letter-spacing: 0.5px; font-weight: normal; } body.Trent.Barton h3 { font-family: 'MuseoSans-700'; font-size: 20px; letter-spacing: 0.5px; font-weight: normal; } body.Trent.Barton .expander { color: #373536; } body.Trent.Barton .expander:before, body.Trent.Barton .expander:after { background-color: #E8480E; } body.Trent.Barton .expander.arrows:after { background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png); } body.Trent.Barton .tabSwitcher { font-size: 18px; font-family: 'MuseoSans-500'; } @media only screen and (max-width: 767px) { body.Trent.Barton .faqs.grid.twocol .sectionList { border-color: #EFEFEF; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); } body.Trent.Barton .faqs.grid.twocol .sectionList:after { background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png); } body.Trent.Barton .faqs.grid.twocol .sectionHolder .expander.arrows { border-color: #EFEFEF; } } body.Trent.Barton .pdfBox { color: #373536; } body.Trent.Barton .pdfBox:before { background-image: url(/images/redesign_2019/trentbarton/pdf.png); } body.Trent.Barton .pdfBox:after { background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png); } body.Trent.Barton .mainColour { color: #373536; } body.Trent.Barton .priceButtonHolder > span { border-color: #EFEFEF; } body.Trent.Barton .priceButtonHolder > span:hover { border-color: #373536; } body.Trent.Barton .priceButtonHolder > span:focus { border-color: #EFEFEF; box-shadow: 0 0 5px 0 #E8480E; } body.Trent.Barton .priceButtonHolder > span.selected { border-color: #E8480E; } body.Trent.Barton .contactUsInfo .haveAQuestion { background-image: url(/images/redesign_2019/trentbarton/support@2x.png); background-position: right center; background-size: 25% auto; background-origin: content-box; } @media only screen and (max-width: 767px) { body.Trent.Barton .contactUsInfo .haveAQuestion { background: none; } } body.Trent.Barton .contactUsInfo .haveAQuestion > * { margin-right: 200px; } @media only screen and (max-width: 767px) { body.Trent.Barton .contactUsInfo .haveAQuestion > * { max-width: none; margin-right: 0px; } } body.Trent.Barton .ticketButtonHolder { padding: 100px 40px 20px; background-color: #EFEFEF; border-radius: 5px; background-image: url("/images/redesign_2019/trentbarton/faresButton@2x.png"); background-position: center 20px; background-size: auto 80px; } body.Trent.Barton .ticketButtonHolder.alt { background-image: url("/images/redesign_2019/trentbarton/faresButton2@2x.png"); } body.Trent.Barton nav.menu { background-color: #fff; font-family: 'MuseoSans-300'; } body.Trent.Barton nav.menu > ul > li > a, body.Trent.Barton nav.menu li.navTitle { font-family: 'MuseoSans-700'; font-weight: normal; } body.Trent.Barton .main-nav { font-family: 'MuseoSans-500'; font-size: 18px; } body.Trent.Barton.menu-open header { background-color: #fff !important; } body.Trent.Barton.menu-open header .main-nav ul.main li:nth-child(2), body.Trent.Barton.menu-open header .main-nav ul.main li:nth-child(3), body.Trent.Barton.menu-open header .main-nav ul.main li:nth-child(4) { display: none; } body.Trent.Barton.menu-open header .main-nav a { color: #373536; } body.Trent.Barton.menu-open header .hamburger .hamburger-inner, body.Trent.Barton.menu-open header .hamburger .hamburger-inner:after, body.Trent.Barton.menu-open header .hamburger .hamburger-inner:before { background-color: #373536; } body.Trent.Barton.menu-open header .hamburger .hamburger.is-active .hamburger-inner, body.Trent.Barton.menu-open header .hamburger .hamburger.is-active .hamburger-inner:after, body.Trent.Barton.menu-open header .hamburger .hamburger.is-active .hamburger-inner:before { background-color: #373536; } body.Trent.Barton .shadowBoxes > * { text-decoration: none; border-color: #EFEFEF; color: #373536; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); } body.Trent.Barton .shadowBoxes > * a { color: #E8480E; text-decoration: none; } body.Trent.Barton .shadowBoxes.ticketVariantClassBoxes a.active { box-shadow: 0 2px 10px 0 #E8480E; border-color: #E8480E; } body.Trent.Barton .shadowBoxes.homeButtons { font-family: 'MuseoSans-700'; } body.Trent.Barton .shadowBoxes.homeButtons > a::before { background-position-y: -61px; } body.Trent.Barton .purchaseCardItems { margin: 10px -10px; } body.Trent.Barton .purchaseCardItems .name { margin: 10px; width: 40%; } body.Trent.Barton .purchaseCardItems .amount { width: 14%; text-align: center; border-radius: 4px; border-width: 2px; border-style: solid; padding: 6px 0; border-color: #E8480E; } body.Trent.Barton .purchaseCardItems .change { margin: 10px; } body.Trent.Barton div.topbar { background-color: #373536; } body.Trent.Barton div.topbar p { color: #fff; background: url(/images/redesign_2019/kinchbus/info.png) no-repeat 150px center; background-size: 24px; } @media only screen and (max-width: 991px) { body.Trent.Barton div.topbar p { background: url(/images/redesign_2019/kinchbus/info.png) no-repeat 10px center; background-size: 24px; } } body.Trent.Barton div.topbar p a { color: #fff; } body.Trent.Barton div.content h2, body.Trent.Barton div.content h3 { color: #373536; } body.Trent.Barton div.content .lightBorder { border-color: #939496; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); } body.Trent.Barton div.content .superLightBorder { border-color: #EFEFEF; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); } body.Trent.Barton div.content .journeys-departures .tabBlocks > div { background-image: url(/images/redesign_2019/trentbarton/tb_search.png); } body.Trent.Barton div.content .journeys-departures #tab_departures .button { color: #fff !important; } body.Trent.Barton div.content #tab_find-journey div.form > a.swapButton { background-color: #373536; } body.Trent.Barton div.content .JourneyPlanner > * { grid-auto-columns: 12fr 10fr; grid-column-gap: 132px; } body.Trent.Barton div.content .smallTabButtons a { font-family: 'MuseoSans-500'; color: #373536; border-bottom-color: #939496; } body.Trent.Barton div.content .smallTabButtons a.active { border-bottom-color: #E8480E; } body.Trent.Barton div.content #tab_departures .live-button { text-align: right; } body.Trent.Barton div.content .aboutUs .ourBusesOurPeople.ourBuses { background-image: url('/images/redesign_2019/trentbarton/trentbarton_bus1.png'), url('/images/redesign_2019/trentbarton/trentbarton_bus2.png'), linear-gradient(to bottom, #005CA9, #102A62 100%); background-size: auto 50%, auto 50%, cover; background-position: right bottom 20%, right 20% top; } @media only screen and (max-width: 991px) { body.Trent.Barton div.content .aboutUs .ourBusesOurPeople.ourBuses { background-position: right bottom 10%, left 20% bottom 10%; background-size: auto 50%, auto 35%, cover; padding-bottom: 300px; } body.Trent.Barton div.content .aboutUs .ourBusesOurPeople.ourBuses .ourBuses { width: 100%; } } @media only screen and (max-width: 767px) { body.Trent.Barton div.content .aboutUs .ourBusesOurPeople.ourBuses { background-image: url('/images/redesign_2019/trentbarton/trentbarton_bus1.png'), linear-gradient(to bottom, #005CA9, #102A62 100%); background-position: right bottom 10%; background-size: auto 50%, cover; } } body.Trent.Barton div.content .aboutUs .ourBusesOurPeople.ourPeople { background-image: linear-gradient(to bottom, #005CA9, #102A62 100%); } body.Trent.Barton div.content .aboutUs .ourBusesOurPeople .smallTabButtons a { color: #fff; } body.Trent.Barton div.content .aboutUs .ourBusesOurPeople .smallTabButtons a:not(.active) { border-bottom-color: white; } body.Trent.Barton div.content .JourneyPlanner { color: #373536; } body.Trent.Barton div.content .JourneyPlanner .journeys-departures { border-color: #939496; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); } body.Trent.Barton div.content .JourneyPlanner a.timetableButton, body.Trent.Barton div.content .JourneyPlanner .learnMore a { color: #373536; border-color: #EFEFEF; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); } body.Trent.Barton div.content .JourneyPlanner a.mapLink:before { background-image: url(/images/redesign_2019/trentbarton/pdf.png); } body.Trent.Barton div.content .JourneyPlanner a.mapLink:after { background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png); } body.Trent.Barton div.content section.travelUpdate article.list-news-item { border-bottom-color: #939496; } body.Trent.Barton div.content section.travelUpdate article.list-news-item time { color: #E8480E; } @media only screen and (max-width: 767px) { body.Trent.Barton div.content section.travelUpdate article.list-news-item .button { background-color: transparent; color: #E8480E; background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png); } } body.Trent.Barton div.content .serviceList .service { color: #373536; border-color: #EFEFEF; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); } body.Trent.Barton div.content section.newsList article h2 { color: #E8480E; } body.Trent.Barton div.content .newsItem { color: #373536; } body.Trent.Barton div.content .newsItem p.nav a { color: #373536; } body.Trent.Barton div.content .newsItem p.caption { color: #373536; } body.Trent.Barton div.content .newsItem time { display: block; } body.Trent.Barton div.content .newsItem.alert { margin: 0 100px; } @media only screen and (max-width: 991px) { body.Trent.Barton div.content .newsItem.alert { margin-left: 40px; margin-right: 40px; } } @media only screen and (max-width: 767px) { body.Trent.Barton div.content .newsItem.alert { margin-left: 0px; margin-right: 0px; } } body.Trent.Barton div.content .newsItem.alert time { color: #E8480E; } @media only screen and (max-width: 767px) { body.Trent.Barton div.content header.view-mobile { background-image: url(/images/redesign_2019/trentbarton/trentbarton_logo@2x.png); background-color: #373536; padding: 69px 0 0; background-size: 86px 40px; } } body.Trent.Barton div.content header nav .logo { margin-top: 17px; margin-left: 5px; background-image: url(/images/redesign_2019/trentbarton/trentbarton_logo@2x.png); width: 130px; height: 62px; } @media only screen and (max-width: 767px) { body.Trent.Barton div.content header nav .logo { background-image: none; } } body.Trent.Barton div.content header nav.sub-nav a { color: #373536; } body.Trent.Barton div.content header nav.menu { background-color: #fff; color: #373536; } body.Trent.Barton div.content header nav.menu a { color: #373536; } body.Trent.Barton div.content header.view-tabletdesktop { color: #fff; background-color: #373536; } body.Trent.Barton div.content div.hero-nav-shaded { background: #373536; } body.Trent.Barton div.content div.hero-nav-shaded a, body.Trent.Barton div.content div.hero-nav-shaded h1, body.Trent.Barton div.content div.hero-nav-shaded .subtitle { color: #fff; } body.Trent.Barton div.content div.hero { background-color: #373536; } body.Trent.Barton div.content div.hero.mango { background-color: #5db560, #ffd937 100%; background-image: -webkit-linear-gradient(left, #5db560, #ffd937 100%, #000000); background-image: -moz-linear-gradient(left, #5db560, #ffd937 100%, #000000); background-image: -o-linear-gradient(left, #5db560, #ffd937 100%, #000000); background-image: -ms-linear-gradient(left, #5db560, #ffd937 100%, #000000); background-image: linear-gradient(left, #5db560, #ffd937 100%, #000000); } body.Trent.Barton div.content div.hero.saver { background-color: #b60778, #34174a 100%; background-image: -webkit-linear-gradient(left, #b60778, #34174a 100%, #000000); background-image: -moz-linear-gradient(left, #b60778, #34174a 100%, #000000); background-image: -o-linear-gradient(left, #b60778, #34174a 100%, #000000); background-image: -ms-linear-gradient(left, #b60778, #34174a 100%, #000000); background-image: linear-gradient(left, #b60778, #34174a 100%, #000000); } body.Trent.Barton div.content div.hero.busroutes { background-color: #005CA9, #102A62 100%; background-image: -webkit-linear-gradient(top, #005CA9, #102A62 100%, #000000); background-image: -moz-linear-gradient(top, #005CA9, #102A62 100%, #000000); background-image: -o-linear-gradient(top, #005CA9, #102A62 100%, #000000); background-image: -ms-linear-gradient(top, #005CA9, #102A62 100%, #000000); background-image: linear-gradient(top, #005CA9, #102A62 100%, #000000); } body.Trent.Barton div.content div.hero div.heroText div.subtitle { font-family: 'MuseoSans-700'; font-size: 24px; letter-spacing: 0.21px; line-height: 29px; } body.Trent.Barton div.content div.hero div.heroImage img { transition: margin-top 0.25s, height 0.25s; top: 50%; margin-top: -150px; bottom: auto; height: 300px; } @media only screen and (max-width: 991px) { body.Trent.Barton div.content div.hero div.heroImage img { height: 200px; margin-top: -100px; } } body.Trent.Barton div.content div.hero.simple h1 { color: #373536 !important; } body.Trent.Barton div.content div.hero.simple div.subtitle { color: #373536 !important; } body.Trent.Barton div.content footer { color: #fff; } body.Trent.Barton div.content footer a { color: #fff; } body.Trent.Barton div.content footer .SocialLinks a.twitter, body.Trent.Barton div.content footer .SocialLinks a.facebook, body.Trent.Barton div.content footer .SocialLinks a.youtube, body.Trent.Barton div.content footer .SocialLinks a.insta { background-position-y: -66px; } body.Trent.Barton div.content footer div.mainfooter { background-color: #373536; } body.Trent.Barton div.content footer div.subfooter { transition: background-color 0.25s; background-color: #939496; } body.Trent.Barton .button { font-family: 'MuseoSans-500'; font-size: 14px; background-color: #E8480E; color: #fff; border: none; padding: 15px 12px; letter-spacing: 1.31px; } body.Trent.Barton .button:not([disabled]):hover { background-color: #BF3B0B; } body.Trent.Barton .button:not([disabled]):focus { background-color: #E8480E; box-shadow: 0 2px 15px 0 #E8480E; } body.Trent.Barton .button:not([disabled]):active { background-color: #E8480E; border: 1px solid #005CA9; } body.Trent.Barton .button.secondary { background-color: #fff; color: #E8480E; border: 1px solid #E8480E; } @media only screen and (max-width: 767px) { body.Trent.Barton .button.secondary.standard-on-mobile { background-color: #E8480E; color: #fff; } } body.Trent.Barton .button.secondary:not([disabled]):hover { background-color: #E8480E; color: #fff; } body.Trent.Barton .button.secondary:not([disabled]):focus { background-color: #fff; color: #E8480E; } body.Trent.Barton .button.secondary:not([disabled]):active { background-color: #BF3B0B; color: #fff; border: none; } body.Trent.Barton .button.witharrow { color: #373536; background-color: transparent; border: none; transition: color 0.25s, background-image 0.25s; background-image: url('/images/redesign_2019/nav/large_orange_arrow@2x.png'); background-size: 13px 20px; background-position: right center; background-repeat: no-repeat; } body.Trent.Barton .button.witharrow:not([disabled]):hover { background-color: transparent; text-decoration: underline; background-image: url('/images/redesign_2019/nav/large_dark_orange_arrow@2x.png'); } body.Trent.Barton .button.witharrow:not([disabled]):focus { background-color: transparent; box-shadow: none; } body.Trent.Barton .button.witharrow:not([disabled]):active { background-color: transparent; border: none; color: #373536; } body.Trent.Barton .button.withuparrow, body.Trent.Barton .button.withdownarrow { background-color: transparent; border: none; transition: color 0.25s, background-image 0.25s; background-size: 20px 13px; background-position: right center; background-repeat: no-repeat; } body.Trent.Barton .button.withuparrow:not([disabled]):hover, body.Trent.Barton .button.withdownarrow:not([disabled]):hover { background-color: transparent; text-decoration: underline; background-image: url('/images/redesign_2019/nav/large_dark_orange_arrow@2x.png'); } body.Trent.Barton .button.withuparrow:not([disabled]):focus, body.Trent.Barton .button.withdownarrow:not([disabled]):focus { background-color: transparent; box-shadow: none; } body.Trent.Barton .button.withuparrow:not([disabled]):active, body.Trent.Barton .button.withdownarrow:not([disabled]):active { background-color: transparent; border: none; color: #373536; } body.Trent.Barton .button.withuparrow { background-image: url('/images/redesign_2019/nav/arrow_up_orange.png'); } body.Trent.Barton .button.withuparrow:not([disabled]):hover { background-color: transparent; text-decoration: underline; background-image: url('/images/redesign_2019/nav/arrow_up_dark_orange.png'); } body.Trent.Barton .button.withdownarrow { background-image: url('/images/redesign_2019/nav/arrow_down_orange.png'); } body.Trent.Barton .button.withdownarrow:not([disabled]):hover { background-color: transparent; text-decoration: underline; background-image: url('/images/redesign_2019/nav/arrow_down_darkorange.png'); } body.Trent.Barton .button.withplus { color: #373536; background-color: transparent; border: none; transition: color 0.25s, background-image 0.25s; background-image: url('/images/redesign_2019/trentbarton/plus@2x.png'); background-size: 20px; background-position: right center; background-repeat: no-repeat; text-transform: none; letter-spacing: 1px; font-weight: bold; } body.Trent.Barton .button.withplus:not([disabled]):hover { background-color: transparent; text-decoration: underline; } body.Trent.Barton .button.withplus:not([disabled]):focus { background-color: transparent; box-shadow: none; } body.Trent.Barton .button.withplus:not([disabled]):active { background-color: transparent; border: none; color: #373536; } body.Trent.Barton .button.linkstyle { background-color: transparent; border: none; transition: color 0.25s; color: #00A6E6; text-transform: none; padding: 0; } body.Trent.Barton .button.linkstyle:not([disabled]):hover { background-color: transparent; text-decoration: underline; } body.Trent.Barton .button.linkstyle:not([disabled]):focus { background-color: transparent; box-shadow: none; } body.Trent.Barton .button.linkstyle:not([disabled]):active { background-color: transparent; border: none; color: #005CA9; } body.Trent.Barton .button.block { color: #373536; border: 1px solid #EFEFEF; background-color: #fff; background-image: url('/images/redesign_2019/nav/large_orange_arrow@2x.png'); background-size: 13px 20px; background-position: right 16px center; background-repeat: no-repeat; } body.Trent.Barton .button.block:not([disabled]):hover { background-color: #fff; border-color: #E8480E; } body.Trent.Barton .button.block:not([disabled]):focus { background-color: #fff; border-color: #E8480E; } body.Trent.Barton .button.block:not([disabled]):active { background-color: transparent; background-color: #FFD6C7; border-color: #E8480E; background-image: url('/images/redesign_2019/nav/large_dark_orange_arrow@2x.png'); } body.Trent.Barton .button.block.block-radio { background-image: none; cursor: default; align-items: center; } body.Trent.Barton .button.block.block-radio:active, body.Trent.Barton .button.block.block-radio:hover, body.Trent.Barton .button.block.block-radio:focus { background-image: none; background-color: #fff; border-color: #FFD6C7; } body.Trent.Barton .button.block.block-radio span.cbradWrapper { vertical-align: middle; margin-right: 20px; margin-left: 20px; } body.Trent.Barton .flex50[data-section="Promotions"] { position: relative; } body.Trent.Barton .flex50[data-section="Promotions"] span.cbradWrapper { position: static; width: auto; height: auto; overflow: hidden; width: 0; height: 0; display: inline; } body.Trent.Barton .flex50[data-section="Promotions"] input[type="checkbox"] { display: none; } body.Trent.Barton .flex50[data-section="Promotions"] input[type="checkbox"] + .replacement { transition: border-color 0.25s; width: auto; height: auto; top: 0; left: 0; right: 0; bottom: 0; position: absolute; pointer-events: none; background-image: none; border-radius: 3px; border-style: solid; border-width: 2px; border-color: #EFEFEF; } body.Trent.Barton .flex50[data-section="Promotions"] input[type="checkbox"]:checked + .replacement { border-color: #e8490e; } body.Trent.Barton .flex50[data-section="Promotions"] label { display: block; padding: 10px; cursor: pointer; } body.Trent.Barton label { color: #373536; } body.Trent.Barton label.kkLabel { font-family: 'MuseoSans-300'; font-weight: bold; } body.Trent.Barton label .req { color: red; margin-left: 3px; } body.Trent.Barton .primary-text, body.Trent.Barton h1, body.Trent.Barton h2, body.Trent.Barton h3, body.Trent.Barton h4, body.Trent.Barton h5, body.Trent.Barton h6 { color: #373536; } body.Trent.Barton .primary-text { font-family: 'MuseoSans-300'; font-weight: bold; } body.Trent.Barton .help-text { margin-left: 14px; margin-top: 4px; } body.Trent.Barton input, body.Trent.Barton textarea { font-family: 'MuseoSans-300'; font-weight: bold; } body.Trent.Barton input::placeholder, body.Trent.Barton textarea::placeholder { font-weight: normal; } body.Trent.Barton input.button, body.Trent.Barton textarea.button { font-weight: normal; } body.Trent.Barton input:not([type]), body.Trent.Barton textarea:not([type]), body.Trent.Barton input[type="text"], body.Trent.Barton textarea[type="text"], body.Trent.Barton input[type="password"], body.Trent.Barton textarea[type="password"] { border-color: #EFEFEF; color: #373536; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); } body.Trent.Barton input:not([type]):not(:disabled):not(.invalid):hover, body.Trent.Barton textarea:not([type]):not(:disabled):not(.invalid):hover, body.Trent.Barton input[type="text"]:not(:disabled):not(.invalid):hover, body.Trent.Barton textarea[type="text"]:not(:disabled):not(.invalid):hover, body.Trent.Barton input[type="password"]:not(:disabled):not(.invalid):hover, body.Trent.Barton textarea[type="password"]:not(:disabled):not(.invalid):hover { border-color: #373536; } body.Trent.Barton input:not([type]):not(:disabled):not(.invalid):focus, body.Trent.Barton textarea:not([type]):not(:disabled):not(.invalid):focus, body.Trent.Barton input[type="text"]:not(:disabled):not(.invalid):focus, body.Trent.Barton textarea[type="text"]:not(:disabled):not(.invalid):focus, body.Trent.Barton input[type="password"]:not(:disabled):not(.invalid):focus, body.Trent.Barton textarea[type="password"]:not(:disabled):not(.invalid):focus { box-shadow: 0 0 5px 0 #E8480E; } body.Trent.Barton input:not([type]):not(:disabled):not(.invalid):focus:not(.empty), body.Trent.Barton textarea:not([type]):not(:disabled):not(.invalid):focus:not(.empty), body.Trent.Barton input[type="text"]:not(:disabled):not(.invalid):focus:not(.empty), body.Trent.Barton textarea[type="text"]:not(:disabled):not(.invalid):focus:not(.empty), body.Trent.Barton input[type="password"]:not(:disabled):not(.invalid):focus:not(.empty), body.Trent.Barton textarea[type="password"]:not(:disabled):not(.invalid):focus:not(.empty) { border-color: #E8480E; } body.Trent.Barton input:not([type]).invalid, body.Trent.Barton textarea:not([type]).invalid, body.Trent.Barton input[type="text"].invalid, body.Trent.Barton textarea[type="text"].invalid, body.Trent.Barton input[type="password"].invalid, body.Trent.Barton textarea[type="password"].invalid { border-color: #D0021B; } body.Trent.Barton input[type="radio"] + .replacement, body.Trent.Barton textarea[type="radio"] + .replacement { left: 3px; top: 3px; width: 25px; height: 25px; background-size: 25px 25px; background-image: url(/images/redesign_2019/trentbarton/radio-orange@2x.png); } body.Trent.Barton input[type="radio"]:checked + .replacement, body.Trent.Barton textarea[type="radio"]:checked + .replacement { background-image: url(/images/redesign_2019/trentbarton/radio-orange_sel@2x.png); } body.Trent.Barton input[type="checkbox"] + .replacement, body.Trent.Barton textarea[type="checkbox"] + .replacement { left: 4px; top: 4px; width: 23px; height: 23px; background-size: 23px 23px; background-image: url(/images/redesign_2019/trentbarton/checkbox@2x.png); } body.Trent.Barton input[type="checkbox"]:checked + .replacement, body.Trent.Barton textarea[type="checkbox"]:checked + .replacement { top: -4px; left: 4px; width: 31px; height: 31px; background-size: 31px 31px; background-image: url(/images/redesign_2019/trentbarton/checkbox_checked@2x.png); } body.Trent.Barton select, body.Trent.Barton .select2-choice { font-family: 'MuseoSans-300'; color: #373536; border-color: #EFEFEF; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); background-image: url(/images/redesign_2019/input/dropdown_orange_down@2x.png); } body.Trent.Barton select:hover, body.Trent.Barton .select2-choice:hover { border-color: #373536 !important; } body.Trent.Barton select:focus, body.Trent.Barton .select2-choice:focus { border-color: #EFEFEF; box-shadow: 0 0 5px 0 #E8480E; } body.Trent.Barton select *:hover, body.Trent.Barton .select2-choice *:hover { background-color: #EFEFEF; } body.Trent.Barton select.invalid, body.Trent.Barton .select2-choice.invalid { background-image: url(/images/redesign_2019/input/invalid@2x.png); } body.Trent.Barton select[size], body.Trent.Barton .select2-choice[size] { background-image: none; } body.Trent.Barton .tabSwitcher > a { color: #373536; background-color: #d6d6d6; } body.Trent.Barton .tabSwitcher > a.active { color: #373536; background-color: #fff; } body.Trent.Barton .tabBlocks > div { background-color: #fff; } body.Trent.Barton h3.main-heading { display: none; } body.Trent.Barton.loginRegister main { background-color: #f9f9fb; } body.Trent.Barton .showHideSectionButton { background-size: 20px 13px; background-position: right 12px center; background-repeat: no-repeat; background-image: url(../../images/redesign_2019/input/dropdown_orange_down@2x.png); cursor: pointer; } body.Trent.Barton .showHideSectionButton.open { background-image: url(../../images/redesign_2019/input/dropdown_orange_up@2x.png); } body.Trent.Barton .failure-feedback { background: url(/images/redesign_2019/trentbarton/info.png) no-repeat 15px center; background-size: 24px; padding: 20px; padding-left: 70px; margin: 1em 0; color: #373536; display: block; } body.Trent.Barton .validationSummary, body.Trent.Barton .mango-feedback-success { color: #373536 !important; background: url(/images/redesign_2019/trentbarton/info.png) no-repeat 15px center; background-size: 24px; padding-left: 55px; padding-right: 15px; padding-top: 10px; padding-bottom: 10px; border-radius: 5px; margin-bottom: 10px; } body.Trent.Barton .mango-feedback-success, body.Trent.Barton .success-feedback { background: url(/images/redesign_2019/trentbarton/help.png) no-repeat 15px center; background-size: 24px; padding: 20px; padding-left: 70px; margin: 1em 0; color: #373536; display: block; } body.Trent.Barton .validationSummary ul, body.Trent.Barton .mango-feedback-success ul { margin-left: 25px; } body.Trent.Barton .readOnlyField .service { border-radius: 3px; border-style: solid; border-width: 2px; border-color: #e8490e; width: 200px; padding: 6px 8px; } body.Trent.Barton .flexInputContainer.noMargin { margin: 0; } body.Trent.Barton .mango-topup { margin-top: 30px; } body.Trent.Barton .mango-topup .mango-topupdetails { margin-top: 25px; } body.Trent.Barton .mango-topup .mango-billingdetails { margin-bottom: 25px; } body.Trent.Barton .mango-topup .mango-topup-payment-header { margin-top: 30px; margin-bottom: 15px; } body.Trent.Barton .mango-topup .button { margin: 20px 0; } body.Trent.Barton .mango-addnew { margin-top: 30px; } body.Trent.Barton .mango-addnew .flex50 { margin: 20px 30px; } body.Trent.Barton .mango-addnew .control-group { margin: 20px 0px; } body.Trent.Barton .topup-history-wrapper { margin-top: 30px; } body.Trent.Barton .topup-history-wrapper .topup-history td { width: 30%; } body.Trent.Barton .cookie-banner { font-family: 'MuseoSans-300'; } body.Trent.Barton .cms-content-block h2 p { margin: 18px 0; } body.Trent.Barton .cms-content-block h2 p:first-child { margin-top: 20px; } body.Trent.Barton .cms-content-block h2 p:last-child { margin-bottom: 20px; } /*@media @tablet {*/ body.Trent.Barton div.content footer div.mainfooter > ul > li { border-top: 1px #dfdfdf solid; } body.Trent.Barton div.content footer div.mainfooter > ul > li:first-child { border-top: none; } body.Trent.Barton div.content footer div.mainfooter > ul > li.selected a { background-image: url('/images/redesign_2019/trentbarton/orange-cross.png'); } body.Trent.Barton div.content footer div.mainfooter > ul > li > ul > li > a { background-image: url('/images/redesign_2019/trentbarton/arrow@2x.png') !important; } body.Trent.Barton div.content footer div.mainfooter > ul a { background-image: url('/images/redesign_2019/trentbarton/orange-plus.png'); } body.Trent.Barton div.content footer div.subfooter { background-color: #373536; } /*}*/ body.Trent.Barton.menu-open div.content header nav .logo, body.Trent.Barton.menu-open div.content header.view-mobile { background-image: url(/images/redesign_2019/trentbarton/trentbarton_logo_menu@2x.png); } form[action="/engineering"] main, form[action="/apprenticeships"] main { background-color: black !important; } form[action="/engineering"] main .mainColour, form[action="/apprenticeships"] main .mainColour { color: white !important; } form[action="/engineering"] main .mainColour h2, form[action="/apprenticeships"] main .mainColour h2 { color: #FFDA90 !important; } form[action="/engineering"] main .mainColour h3, form[action="/apprenticeships"] main .mainColour h3 { color: #82FEB9 !important; } form[action="/engineering"] main .mainColour a, form[action="/apprenticeships"] main .mainColour a { color: white !important; font-weight: bold; } body.Trent.Barton .homeIntro { margin-top: 96px; } body.Trent.Barton .homeButtons > a { box-shadow: 0 2px 10px 0 #E8480E; border-color: #E8480E; /* there is a div as the third item... */ } body.Trent.Barton .homeButtons > a:nth-child(1) { box-shadow: 0 2px 10px 0 #0E77BD; border-color: #0E77BD; } body.Trent.Barton .homeButtons > a:nth-child(2) { box-shadow: 0 2px 10px 0 #B34793; border-color: #B34793; } body.Trent.Barton .homeButtons > a:nth-child(4) { box-shadow: 0 2px 10px 0 #E73930; border-color: #E73930; } body.Trent.Barton .homeButtons > a:nth-child(5) { box-shadow: 0 2px 10px 0 #FCC716; border-color: #FCC716; } body.Trent.Barton .homeButtons > a:nth-child(6) { box-shadow: 0 2px 10px 0 #47AF5D; border-color: #47AF5D; } body.Trent.Barton div.travel-updates.shadowBoxes h3 { font-family: 'MuseoSans-500'; font-size: 18px; font-weight: normal; } body.Trent.Barton #homepage-actions .thing-to-do { border: 1px solid #EFEFEF; color: #373536; } body.Trent.Barton #homepage-actions .thing-to-do.buy-kinchkard { background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png), url(/images/redesign_2019/homepage/ticket-grey.png); } body.Trent.Barton #homepage-actions .thing-to-do.manage-my-details { background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png), url(/images/redesign_2019/homepage/contact-grey.png); } body.Trent.Barton #homepage-actions .thing-to-do.customer-support { background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png), url(/images/redesign_2019/homepage/phonegrey.png); } body.Trent.Barton #homepage-actions .thing-to-do.faq { background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png), url(/images/redesign_2019/homepage/help-grey.png); } body.Trent.Barton #homepage-actions .thing-to-do.direct-debit { background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png), url(/images/redesign_2019/homepage/direct-debit-grey.png); } body.Trent.Barton .readonly { color: #373536; } body.Trent.Barton .intro-text { color: #373536; } body.Trent.Barton .cardholder-half-size .flex50 { flex: 1 100%; } body.Trent.Barton .DisableInitMangoTopup .topup-card-details[data-is-itso="false"] div:not(.saver-card) input.topup-btn { background-color: #808080; color: #D0D0D0; } body.Trent.Barton .DisableInitMangoTopup .topup-card-details[data-is-itso="false"] div:not(.saver-card) input.topup-btn:focus { box-shadow: 0 2px 15px 0 #808080; border: #404040; } body.Trent.Barton div.content .mangoAppAdvert { position: relative; } body.Trent.Barton div.content .mangoAppAdvert .buttonHolder { position: absolute; left: 41.1%; top: 62%; height: 16%; right: 0; } body.Trent.Barton div.content .mangoAppAdvert .buttonHolder a { margin-right: 1%; } body.Trent.Barton div.content .mangoAppAdvert .buttonHolder a img { height: 100%; } @media only screen and (max-width: 767px) { body.Trent.Barton div.content .mangoAppAdvert .buttonHolder { top: 57%; height: 30%; } } body.Trent.Barton div.content main .mango-main .edit-header { color: #373536; } body.Trent.Barton div.content main .mango-main .edit-subheader { color: #373536; } body.Trent.Barton div.content main .mango-main #mango-contactless-transactions { color: #373536; } body.Trent.Barton div.content main .mango-main #mango-contactless-transactions #journey-dates input { border-color: #EFEFEF; color: #373536; } body.Trent.Barton div.content main .mango-main #mango-contactless-transactions #journey-dates input.active { background-color: #E8480E; color: #fff; } body.Trent.Barton div.content main .mango-main #mango-contactless-transactions .transaction-box { border-color: #EFEFEF; } body.Trent.Barton div.content main .mango-main #mango-contactless-transactions .transaction-box#top-details { border-color: #fff; } body.Trent.Barton div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step h3 { color: #E8480E; } body.Trent.Barton div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.transaction-divider { border-color: #EFEFEF; } body.Trent.Barton div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.transaction-arrow { color: #E8480E; } body.Trent.Barton div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box hr { background-color: #EFEFEF; } @media only screen and (max-width: 767px) { body.Trent.Barton div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction { border-bottom-color: #EFEFEF; } } body.Trent.Barton div.content main .mango-main #kinchbus-journey-history { color: #373536; } body.Trent.Barton div.content main .mango-main #kinchbus-journey-history #journey-dates input { border-color: #EFEFEF; color: #373536; } body.Trent.Barton div.content main .mango-main #kinchbus-journey-history #journey-dates input.active { background-color: #E8480E; color: #fff; } body.Trent.Barton div.content main .mango-main #kinchbus-journey-history .transaction-box { border-color: #EFEFEF; } body.Trent.Barton div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-divider { border-left: 1px solid #EFEFEF; } body.Trent.Barton div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step { border-right: 1px solid #EFEFEF; } body.Trent.Barton div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step h3 { color: #E8480E; } body.Trent.Barton div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box hr { background-color: #EFEFEF; } @media only screen and (max-width: 767px) { body.Trent.Barton div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction { border-bottom: 1px solid #EFEFEF; } } body.Trent.Barton div.content main .mango-main #mango-faq > div > p > a, body.Trent.Barton div.content main .mango-main .mango-faq > div > p > a, body.Trent.Barton div.content main .mango-main #mango-faq > p > a, body.Trent.Barton div.content main .mango-main .mango-faq > p > a { color: #373536; } body.Trent.Barton div.content main .mango-main #mango-faq > div > p > a:after, body.Trent.Barton div.content main .mango-main .mango-faq > div > p > a:after, body.Trent.Barton div.content main .mango-main #mango-faq > p > a:after, body.Trent.Barton div.content main .mango-main .mango-faq > p > a:after { color: #E8480E; } body.Trent.Barton div.content main .mango-main #mango-faq .answer, body.Trent.Barton div.content main .mango-main .mango-faq .answer { color: #373536; } @media only screen and (max-width: 767px) { body.Trent.Barton div.content main .mango-main #mango-faq p, body.Trent.Barton div.content main .mango-main .mango-faq p { border-color: #EFEFEF; } } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .add-contactless-btn { color: #373536; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .add-contactless-btn .plus-icon { background-image: url('/images/redesign_2019/trentbarton/plus@2x.png'); } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .see-all-btn { color: #373536; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .contactless-card-details .inner-card { background: linear-gradient(180deg, #332F31 0%, #2D2A2B 100%); border: 1px solid #EFEFEF; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .contactless-card-details .inner-card .card-shine { background-color: rgba(218, 228, 240, 0.13); } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .contactless-card-details .drop-card, body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .contactless-card-details .mid-drop-card { border: 1px solid #EFEFEF; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .contactless-card-details .mid-drop-card { color: #373536; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .contactless-card-details .products .product { border-color: #EFEFEF; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .contactless-card-details .card-icon { display: none; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .contactless-card-details .delete-card-btn { color: #fff; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .inner-card { background: linear-gradient(90deg, #5DB560 0%, #FEE05F 100%); border: 1px solid #EFEFEF; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .inner-card .card-shine { background-color: rgba(218, 228, 240, 0.13); } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .inner-card .topup-card-links input { color: #fff; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .inner-card.saver-card { background: linear-gradient(90deg, #B40778 0%, #4A325F 100%); } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .drop-card, body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .mid-drop-card { border: 1px solid #EFEFEF; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .mid-drop-card { color: #373536; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .products .product { border-color: #EFEFEF; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .products .auto-topup-checkbox input { -webkit-appearance: none; border: 1px solid #cacece; position: relative; top: 8px; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .products .auto-topup-checkbox input:checked:after { content: ''; position: absolute; top: -9px; left: -1px; width: 31px; height: 31px; background-size: 31px 31px; background-image: url(/images/redesign_2019/trentbarton/checkbox_checked@2x.png); } body.Trent.Barton div.content main .mango-main #mango-homepage-columns .homepage-column .topup-card-details .products .auto-topup-checkbox input:disabled { opacity: 1; } body.Trent.Barton div.content main .mango-main #mango-homepage-columns #homepage-divider { border-left-color: #EFEFEF; } body.Trent.Barton .modal__container { font-family: 'MuseoSans-300'; } body.Trent.Barton .modal__container .modal__close { background-image: url('/images/redesign_2019/trentbarton/orange-cross.png'); } body.Trent.Barton .modal__container h2.modal__title { color: #373536; } body.Trent.Barton .modal__container main.modal__content { color: #373536; } body.Trent.Barton .modal__container main.modal__content a { color: #00A6E6; } body.Trent.Barton .modal__container .modal__btn.button { color: #fff !important; } body.Trent.Barton .priceTable, body.Trent.Barton .kinchkardOrderItems { margin-top: 30px; width: 100%; } body.Trent.Barton .priceTable td, body.Trent.Barton .kinchkardOrderItems td, body.Trent.Barton .priceTable th, body.Trent.Barton .kinchkardOrderItems th { padding-top: 30px; padding-bottom: 30px; padding-right: 15px; color: #373536; border-bottom: 1px solid #EFEFEF; } body.Trent.Barton .priceTable td label *, body.Trent.Barton .kinchkardOrderItems td label * { vertical-align: middle; } body.Trent.Barton .priceTable td label span, body.Trent.Barton .kinchkardOrderItems td label span { height: 23px; line-height: 23px; } body.Trent.Barton .priceTable td label span.cbradWrapper, body.Trent.Barton .kinchkardOrderItems td label span.cbradWrapper { height: auto; } body.Trent.Barton input[type="text"].superCommuterVoucherInput { display: inline-block; margin-right: 15px; margin-bottom: 10px; min-width: 380px; } body.Trent.Barton .button.voucher-applied-remove { display: inline-block; margin-left: 15px; } body.Trent.Barton .supercommuter-back.button { display: inline-block; margin-left: 15px; } body.Trent.Barton .supercommutervalidation.validationSummary { margin-left: 0px; } body.Trent.Barton .super-commuter-intro { margin-bottom: 5px; } body.Trent.Barton .super-commuter-link input { white-space: normal; } @media only screen and (max-width: 767px) { body.Trent.Barton .supercommuter-apply.button, body.Trent.Barton .supercommuter-back.button, body.Trent.Barton .voucher-applied-remove.button { display: block; width: 100%; margin-top: 20px; margin-left: 0px; margin-right: 0px; } body.Trent.Barton input[type="text"].superCommuterVoucherInput { display: block; width: 100%; } } /*Shared services*/ body.Trent.Barton .service-page, body.Kinchbus .service-page { padding-top: 60px; } body.Trent.Barton .service-page a, body.Kinchbus .service-page a { color: #373536; } body.Trent.Barton .service-page a.event-tag, body.Kinchbus .service-page a.event-tag { color: white; } body.Trent.Barton .service-page .timetable-route-section-end, body.Kinchbus .service-page .timetable-route-section-end { height: 17px; } body.Trent.Barton .service-page .button, body.Kinchbus .service-page .button { font-family: 'MuseoSans-700'; font-size: 14px; } body.Trent.Barton .service-page .service-travel-alert, body.Kinchbus .service-page .service-travel-alert { display: flex; flex-direction: row; flex-wrap: wrap; } body.Trent.Barton .service-page .travel-alert, body.Kinchbus .service-page .travel-alert { flex-basis: calc(50% - 5px); box-sizing: border-box; margin-right: 0; } body.Trent.Barton .service-route-area .tabs, body.Kinchbus .service-route-area .tabs { display: flex; flex-direction: row; } body.Trent.Barton .service-route-area .tabs > div, body.Kinchbus .service-route-area .tabs > div { -webkit-tap-highlight-color: transparent; font-family: 'MuseoSans-700'; flex: 0 1 50%; display: flex; justify-content: center; flex-direction: column; text-align: center; height: 56px; box-sizing: border-box; } body.Trent.Barton .tab-content > div, body.Kinchbus .tab-content > div { display: none; } body.Trent.Barton .tab-content > div.active, body.Kinchbus .tab-content > div.active { display: flex; } body.Trent.Barton .service-route-area, body.Kinchbus .service-route-area { margin-bottom: 50px; } body.Trent.Barton .service-route-area .tabs, body.Kinchbus .service-route-area .tabs { cursor: pointer; border-top-left-radius: 4px; border-top-right-radius: 4px; } body.Trent.Barton #route-overview > .route-overview-map-image, body.Kinchbus #route-overview > .route-overview-map-image { flex-grow: 0; flex-shrink: 1; flex-basis: 65%; } body.Trent.Barton #route-overview > .route-timetable-pdfs-and-features, body.Kinchbus #route-overview > .route-timetable-pdfs-and-features { flex-grow: 0; flex-shrink: 1; flex-basis: 35%; } body.Trent.Barton .service-route-area .tab-content, body.Kinchbus .service-route-area .tab-content { padding: 30px 40px; } body.Trent.Barton .service-tab, body.Kinchbus .service-tab { font-weight: normal; font-size: 20px; } body.Trent.Barton .tab-content > div.active.service-tab-route-maps, body.Kinchbus .tab-content > div.active.service-tab-route-maps { display: block; } body.Trent.Barton .route-maps-intro, body.Kinchbus .route-maps-intro { display: flex; flex-direction: row; } body.Trent.Barton .route-maps-intro > div, body.Kinchbus .route-maps-intro > div { flex: 0 1 50%; display: block; } body.Trent.Barton .route-maps-intro .caption, body.Kinchbus .route-maps-intro .caption { margin-bottom: 15px; align-self: center; font-family: 'MuseoSans-700'; } body.Trent.Barton .map-step1-choose-route, body.Kinchbus .map-step1-choose-route, body.Trent.Barton .map-step2-choose-direction, body.Kinchbus .map-step2-choose-direction { display: flex; flex-direction: row; justify-content: flex-end; } body.Trent.Barton .map-step1-choose-route .routeSwitcher, body.Kinchbus .map-step1-choose-route .routeSwitcher, body.Trent.Barton .map-step2-choose-direction .routeSwitcher, body.Kinchbus .map-step2-choose-direction .routeSwitcher, body.Trent.Barton .map-step1-choose-route .directionSwitcher, body.Kinchbus .map-step1-choose-route .directionSwitcher, body.Trent.Barton .map-step2-choose-direction .directionSwitcher, body.Kinchbus .map-step2-choose-direction .directionSwitcher { font-size: 16px; text-decoration: none; padding: 7px 20px; margin-bottom: 15px; text-align: center; font-family: 'MuseoSans-500'; } body.Trent.Barton .map-step1-choose-route, body.Kinchbus .map-step1-choose-route { display: block; margin-bottom: 20px; text-align: center; } body.Trent.Barton .map-step1-choose-route .routeSwitcher, body.Kinchbus .map-step1-choose-route .routeSwitcher { padding: 7px 0px; margin-bottom: 27px; } body.Trent.Barton .map-step1-choose-route .routeSwitcher, body.Kinchbus .map-step1-choose-route .routeSwitcher { display: inline-block; } body.Trent.Barton .map-step1-choose-route .routeSwitcher > img, body.Kinchbus .map-step1-choose-route .routeSwitcher > img { display: block; margin-bottom: 7px; } body.Trent.Barton .map-step1-choose-route .routeSwitcher .route-title, body.Kinchbus .map-step1-choose-route .routeSwitcher .route-title { display: block; } body.Trent.Barton .map-step3-selected-map #routeMapUrl, body.Kinchbus .map-step3-selected-map #routeMapUrl { width: 100%; height: 600px; } body.Trent.Barton .map-step3-selected-map, body.Kinchbus .map-step3-selected-map { margin-top: 50px; } body.Trent.Barton .map-step3-selected-map .mapStops, body.Kinchbus .map-step3-selected-map .mapStops { font-family: 'MuseoSans-700'; text-align: center; font-size: 19px; font-weight: normal; margin-bottom: 15px; } body.Trent.Barton .route-timetable-pdfs, body.Kinchbus .route-timetable-pdfs { display: flex; flex-direction: column; margin-bottom: 15px; } body.Trent.Barton .route-timetable-pdfs h4, body.Kinchbus .route-timetable-pdfs h4 { font-family: 'MuseoSans-500'; font-size: 19px; text-align: center; margin-bottom: 6px; font-weight: normal; } body.Trent.Barton .route-timetable-pdfs .timetable-period, body.Kinchbus .route-timetable-pdfs .timetable-period { font-family: 'MuseoSans-500'; font-size: 18px; line-height: 21px; display: block; margin-bottom: 8px; } body.Trent.Barton .route-timetable-pdfs .timetable-route-direction, body.Kinchbus .route-timetable-pdfs .timetable-route-direction { font-size: 16px; line-height: 14px; display: block; line-height: 17px; font-family: 'MuseoSans-500'; } body.Trent.Barton .route-timetable-pdfs .timeTablePDF, body.Kinchbus .route-timetable-pdfs .timeTablePDF { min-width: 200px; flex: 0 0 100%; padding: 21px 20px; background-repeat: no-repeat, no-repeat; background-position: 20px center, 95% center; display: inline-block; background-size: 45px, 13px; padding-left: 80px; padding-right: 44px; text-decoration: none; font-size: 18px; margin-bottom: 14px; } body.Trent.Barton .route-timetable-pdfs .timeTablePDF .timetablePDFText, body.Kinchbus .route-timetable-pdfs .timeTablePDF .timetablePDFText { width: 100px; } body.Trent.Barton .route-timetable-pdfs .timeTablePDF .extra-arrow, body.Kinchbus .route-timetable-pdfs .timeTablePDF .extra-arrow { height: 20px; width: 14px; margin-left: 15px; display: inline-block; margin-top: -2px; } body.Trent.Barton .route-overview-map-image, body.Kinchbus .route-overview-map-image { margin-bottom: 5px; margin-right: 17px; } body.Trent.Barton .route-overview-map-image img, body.Kinchbus .route-overview-map-image img { max-width: 100%; max-height: 100%; } body.Trent.Barton .local-areas, body.Kinchbus .local-areas { display: flex; flex-direction: row; margin-top: 30px; margin-bottom: 30px; padding: 30px; } body.Trent.Barton .local-areas .more-info, body.Kinchbus .local-areas .more-info { display: flex; flex-direction: column; align-self: center; margin-bottom: 14px; } body.Trent.Barton .local-areas .more-info h3, body.Kinchbus .local-areas .more-info h3 { font-size: 23px; margin-bottom: 10px; } body.Trent.Barton .local-areas .destination-list, body.Kinchbus .local-areas .destination-list { padding-left: 25px; display: flex; flex-direction: column; align-self: center; } body.Trent.Barton .local-areas .destination-list .destination, body.Kinchbus .local-areas .destination-list .destination { font-family: 'MuseoSans-700'; text-decoration: none; font-size: 20px; padding: 15px 25px; margin-bottom: 15px; background-repeat: no-repeat; background-position: calc(97%) center; background-size: 14px 20px; } body.Trent.Barton .local-areas .destination-arrow, body.Kinchbus .local-areas .destination-arrow { height: 20px; width: 14px; margin-left: 15px; display: inline-block; margin-top: -2px; } body.Trent.Barton .local-areas > div, body.Kinchbus .local-areas > div { flex: 0 1 50%; display: block; } body.Trent.Barton .service-features, body.Kinchbus .service-features { margin-top: 30px; } body.Trent.Barton .service-features .feature, body.Kinchbus .service-features .feature { display: flex; align-items: center; margin-bottom: 10px; text-decoration: none; } body.Trent.Barton .service-features .feature > img, body.Kinchbus .service-features .feature > img { height: 40px; width: 40px; } body.Trent.Barton .service-features .feature-name, body.Kinchbus .service-features .feature-name { margin-left: 15px; text-decoration: none; font-family: 'MuseoSans-500'; font-size: 18px; } body.Trent.Barton .route-overview, body.Kinchbus .route-overview { display: flex; flex-direction: row; } body.Trent.Barton .route-overview .tab-content > div, body.Kinchbus .route-overview .tab-content > div { display: flex; justify-content: center; flex-direction: column; } body.Trent.Barton .service-travel-alerts, body.Kinchbus .service-travel-alerts { display: flex; flex-direction: row; flex-wrap: wrap; column-gap: 10px; } body.Trent.Barton .travel-alert, body.Kinchbus .travel-alert { flex-grow: 0; flex-shrink: 1; flex-basis: 316px; padding: 31px 25px; margin-bottom: 40px; margin-right: 10px; } body.Trent.Barton .travel-alert .last-updated, body.Kinchbus .travel-alert .last-updated { font-size: 16px; letter-spacing: 5px; margin-bottom: 15px; display: inline-block; font-family: 'MuseoSans-900'; } body.Trent.Barton .travel-alert h4, body.Kinchbus .travel-alert h4 { font-size: 24px; margin-top: 30px; margin-bottom: 30px; font-family: 'MuseoSans-700'; } body.Trent.Barton .travel-alert h5, body.Kinchbus .travel-alert h5 { font-size: 18px; margin-top: 10px; margin-bottom: 10px; font-family: 'MuseoSans-500'; } body.Trent.Barton .travel-alert .read-more, body.Kinchbus .travel-alert .read-more { margin-top: 20px; } body.Trent.Barton .select-route-message, body.Kinchbus .select-route-message { color: #808080; } body.Trent.Barton .route-maps-route-selector, body.Kinchbus .route-maps-route-selector { margin-bottom: 41px; } body.Trent.Barton .route-maps-route-selector .intro, body.Kinchbus .route-maps-route-selector .intro { line-height: 21px; margin-bottom: 4px; font-family: 'MuseoSans-700'; } body.Trent.Barton .service-route-area .route-maps-route-selector, body.Kinchbus .service-route-area .route-maps-route-selector { display: none; } body.Trent.Barton .service-route-area .route-maps-intro .caption.no-top-routes, body.Kinchbus .service-route-area .route-maps-intro .caption.no-top-routes { display: block; } body.Trent.Barton .service-route-area .route-maps-intro .caption.has-top-routes, body.Kinchbus .service-route-area .route-maps-intro .caption.has-top-routes { display: none; } body.Trent.Barton .service-route-area.showTopLevelRoutes .route-maps-route-selector, body.Kinchbus .service-route-area.showTopLevelRoutes .route-maps-route-selector { display: block; } body.Trent.Barton .service-route-area.showTopLevelRoutes .route-maps-intro .caption.no-top-routes, body.Kinchbus .service-route-area.showTopLevelRoutes .route-maps-intro .caption.no-top-routes { display: none; } body.Trent.Barton .service-route-area.showTopLevelRoutes .route-maps-intro .caption.has-top-routes, body.Kinchbus .service-route-area.showTopLevelRoutes .route-maps-intro .caption.has-top-routes { display: block; } body.Trent.Barton .service-route-area.showTopLevelRoutes .map-step3-selected-map, body.Kinchbus .service-route-area.showTopLevelRoutes .map-step3-selected-map { margin-top: 3px; } @media (max-width: 1000px) { body.Trent.Barton .service-travel-alerts, body.Kinchbus .service-travel-alerts { flex-wrap: wrap; } body.Trent.Barton .service-travel-alerts .travel-alert, body.Kinchbus .service-travel-alerts .travel-alert { width: 100%; flex-basis: 100%; margin-right: 0px; } } @media (max-width: 900px) { body.Trent.Barton .route-maps-intro, body.Kinchbus .route-maps-intro { display: block; } body.Trent.Barton .map-step1-choose-route, body.Kinchbus .map-step1-choose-route, body.Trent.Barton .map-step2-choose-direction, body.Kinchbus .map-step2-choose-direction { justify-content: center; } body.Trent.Barton .map-step1-choose-route .routeSwitcher img, body.Kinchbus .map-step1-choose-route .routeSwitcher img { width: 100%; } } @media (max-width: 1100px) { body.Trent.Barton .tab-content > div.active, body.Kinchbus .tab-content > div.active { display: block; } body.Trent.Barton .tab-content > div.active .route-overview-map-image, body.Kinchbus .tab-content > div.active .route-overview-map-image { text-align: center; } body.Trent.Barton .local-areas, body.Kinchbus .local-areas { display: block; } body.Trent.Barton .local-areas .destination-list, body.Kinchbus .local-areas .destination-list { padding-left: 0px; } } @media (max-width: 500px) { body.Trent.Barton .service-page, body.Kinchbus .service-page { padding-top: 20px; } body.Trent.Barton .route-timetable-pdfs .timetable-period, body.Kinchbus .route-timetable-pdfs .timetable-period { text-align: center; font-size: 16px; } body.Trent.Barton .route-timetable-pdfs .timetable-route-direction, body.Kinchbus .route-timetable-pdfs .timetable-route-direction { text-align: center; font-size: 15px; } body.Trent.Barton .route-timetable-pdfs .timeTablePDF, body.Kinchbus .route-timetable-pdfs .timeTablePDF { min-width: 50px; } body.Trent.Barton .local-areas .destination-list, body.Kinchbus .local-areas .destination-list { padding-left: 0px; text-align: center; } body.Trent.Barton .local-areas .destination-list .destination, body.Kinchbus .local-areas .destination-list .destination { font-size: 16px; } body.Trent.Barton .service-route-area .tab-content, body.Kinchbus .service-route-area .tab-content { padding: 30px 16px; } body.Trent.Barton .service-route-area .tabs > div, body.Kinchbus .service-route-area .tabs > div { font-size: 16px; font-family: 'MuseoSans-500'; } body.Trent.Barton .service-features .feature-name, body.Kinchbus .service-features .feature-name { font-size: 16px; } body.Trent.Barton .route-timetable-pdfs h4, body.Kinchbus .route-timetable-pdfs h4 { font-size: 17px; } body.Trent.Barton .local-areas .more-info h3, body.Kinchbus .local-areas .more-info h3 { font-size: 16px; } body.Trent.Barton .local-areas .more-info p, body.Kinchbus .local-areas .more-info p { font-size: 16px; } body.Trent.Barton .travel-alert h4, body.Kinchbus .travel-alert h4 { margin-top: 15px; margin-bottom: 15px; } body.Trent.Barton .travel-alert .last-updated, body.Kinchbus .travel-alert .last-updated { margin-bottom: 5px; } body.Trent.Barton .route-overview-map-image, body.Kinchbus .route-overview-map-image { margin-right: -12px; margin-left: -12px; } } body.Trent.Barton .tab-content .service-tab-times.active, body.Kinchbus .tab-content .service-tab-times.active { display: block; } body.Trent.Barton .travelPanelTimeTable .timetable-header-alt .tt-header-icon-img, body.Kinchbus .travelPanelTimeTable .timetable-header-alt .tt-header-icon-img, body.Trent.Barton .travelPanelTimeTable .timetable-header .tt-header-icon-img, body.Kinchbus .travelPanelTimeTable .timetable-header .tt-header-icon-img { display: inline-block; } body.Trent.Barton .travelPanelTimeTable .timetable-header-alt h2.timetable-name, body.Kinchbus .travelPanelTimeTable .timetable-header-alt h2.timetable-name, body.Trent.Barton .travelPanelTimeTable .timetable-header h2.timetable-name, body.Kinchbus .travelPanelTimeTable .timetable-header h2.timetable-name { display: inline-block; line-height: 40px; vertical-align: top; margin-left: 10px; } @media only screen and (max-width: 767px) { body.Trent.Barton .travelPanelTimeTable .timetable-header-alt h2.timetable-name, body.Kinchbus .travelPanelTimeTable .timetable-header-alt h2.timetable-name, body.Trent.Barton .travelPanelTimeTable .timetable-header h2.timetable-name, body.Kinchbus .travelPanelTimeTable .timetable-header h2.timetable-name { max-width: 75%; } } body.Trent.Barton .travelPanelTimeTable .smallTabButtons.times-tabs, body.Kinchbus .travelPanelTimeTable .smallTabButtons.times-tabs { margin-top: 10px; cursor: pointer; margin-bottom: 1.5em; -webkit-tap-highlight-color: transparent; } @media only screen and (max-width: 767px) { body.Trent.Barton .travelPanelTimeTable .smallTabButtons.times-tabs a, body.Kinchbus .travelPanelTimeTable .smallTabButtons.times-tabs a { padding-left: 8px; padding-right: 8px; text-align: center; } } @media only screen and (max-width: 767px) { body.Trent.Barton .travelPanelTimeTable .timetable-header, body.Kinchbus .travelPanelTimeTable .timetable-header, body.Trent.Barton .travelPanelTimeTable .timetable-header-alt, body.Kinchbus .travelPanelTimeTable .timetable-header-alt { margin-bottom: 1em; border-color: #EFEFEF; box-shadow: 0 2px 15px 0 rgba(51, 47, 49, 0.05); } body.Trent.Barton .travelPanelTimeTable .tab-content:not(.active), body.Kinchbus .travelPanelTimeTable .tab-content:not(.active), body.Trent.Barton .travelPanelTimeTable .smallTabButtons.times-tabs:not(.active), body.Kinchbus .travelPanelTimeTable .smallTabButtons.times-tabs:not(.active) { display: none; } } body.Trent.Barton .travelPanelTimeTable .tab-content, body.Kinchbus .travelPanelTimeTable .tab-content { width: 100%; padding: 0; } body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active { display: block; } body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .dataTableDiv, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .dataTableDiv { overflow-y: auto; } body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .dataTableDiv table, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .dataTableDiv table { table-layout: fixed; white-space: initial; } body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .dataTableDiv td, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .dataTableDiv td { font-weight: normal; height: auto; word-wrap: break-word; white-space: nowrap; } @media only screen and (max-width: 767px) { body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .dataTableDiv td, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .dataTableDiv td { height: 50px; } } body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .stopsTable td, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .stopsTable td { font-weight: normal; height: auto; } @media only screen and (max-width: 767px) { body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .stopsTable td, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .stopsTable td { width: 120px; height: 50px; font-size: 0.75em; white-space: initial; max-height: 50px; } body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .stopsTable td span, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .stopsTable td span { white-space: initial; max-height: 50px; } } @media only screen and (max-width: 767px) { body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .stopsTable, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .stopsTable { width: 120px; } } body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .route-timetable-pdfs, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .route-timetable-pdfs { margin-top: 1.8em; margin-bottom: 3em; } body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .route-timetable-pdfs .timeTablePDF, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .route-timetable-pdfs .timeTablePDF { max-width: 400px; } body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .timetableNotes, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .timetableNotes { margin-top: 10px; } @media only screen and (max-width: 767px) { body.Trent.Barton .travelPanelTimeTable .tab-content .tab-pane.active .timetableNotes, body.Kinchbus .travelPanelTimeTable .tab-content .tab-pane.active .timetableNotes { margin-top: 20px; } } /*trentbarton services*/ body.Trent.Barton .service-page a { color: #373536; } body.Trent.Barton .service-page a.button.routeSelector { color: #fff; } body.Trent.Barton .travel-alert .last-updated { color: #E8490E; } body.Trent.Barton .route-timetable-pdfs .timeTablePDF { color: #373536; background-image: url(/images/redesign_2019/trentbarton/pdf.png), url(/images/redesign_2019/nav/large_orange_arrow@2x.png); } body.Trent.Barton .route-timetable-pdfs .timeTablePDF .timetable-route-direction { color: #BF3B0B; } body.Trent.Barton .map-step1-choose-route .routeSwitcher, body.Trent.Barton .map-step2-choose-direction .routeSwitcher, body.Trent.Barton .map-step1-choose-route .directionSwitcher, body.Trent.Barton .map-step2-choose-direction .directionSwitcher { color: #373536; border-bottom: 1px solid #939496; } body.Trent.Barton .map-step1-choose-route .routeSwitcher.selected, body.Trent.Barton .map-step2-choose-direction .routeSwitcher.selected, body.Trent.Barton .map-step1-choose-route .directionSwitcher.selected, body.Trent.Barton .map-step2-choose-direction .directionSwitcher.selected { border-bottom: 4px solid #E8480E; } body.Trent.Barton .destination-list .destination { background-image: url(/images/redesign_2019/nav/large_orange_arrow@2x.png); color: #373536; } body.Trent.Barton .tabs > div.active { color: #373536; background-color: #fff; } body.Trent.Barton .tabs > div { color: #373536; background-color: #d6d6d6; } body.Kinchbus .lite { font-family: 'Abadi MT Std ExtraLight'; } body.Kinchbus div.hero.busroutes div.bus-routes { text-align: right; } body.Kinchbus.menu-open header nav.menu li.navTitle { font-weight: bold; } body.Kinchbus.menu-open header .main-nav ul.main li:nth-child(2), body.Kinchbus.menu-open header .main-nav ul.main li:nth-child(3), body.Kinchbus.menu-open header .main-nav ul.main li:nth-child(4) { display: none; } body.Kinchbus .pdfBox { color: #005CA9; } body.Kinchbus .pdfBox:before { background-image: url(/images/redesign_2019/kinchbus/pdf.png); } body.Kinchbus .pdfBox:after { background-image: url(/images/redesign_2019/nav/large_blue_arrow@2x.png); } body.Kinchbus .mainColour { color: #005CA9; } body.Kinchbus .contactUsInfo .haveAQuestion { position: relative; background-image: url(/images/redesign_2019/kinchbus/support@2x.png); background-image: url(/images/redesign_2019/kinchbus/support@2x.png), linear-gradient(180deg, #005CA9 0%, #102A62 100%); background-position: right center; background-size: contain; } @media only screen and (max-width: 767px) { body.Kinchbus .contactUsInfo .haveAQuestion { background-image: linear-gradient(180deg, #005CA9 0%, #102A62 100%); } } body.Kinchbus .contactUsInfo .haveAQuestion h2, body.Kinchbus .contactUsInfo .haveAQuestion div.body { color: white; } body.Kinchbus .contactUsInfo .haveAQuestion > * { margin-right: 200px; } @media only screen and (max-width: 767px) { body.Kinchbus .contactUsInfo .haveAQuestion > * { margin-right: 0; } } body.Kinchbus div.topbar { background-color: #F0F6FB; } body.Kinchbus div.topbar p { color: #005CA9; background: url(/images/redesign_2019/kinchbus/info.png) no-repeat 150px center; background-size: 24px; } @media only screen and (max-width: 991px) { body.Kinchbus div.topbar p { background: url(/images/redesign_2019/kinchbus/info.png) no-repeat 10px center; background-size: 24px; } } body.Kinchbus .hamburger.is-active .hamburger-inner, body.Kinchbus .hamburger.is-active .hamburger-inner:after, body.Kinchbus .hamburger.is-active .hamburger-inner:before { background-color: #fff; } body.Kinchbus div.content .ticketButtonHolder { position: relative; top: -75px; padding: 175px 40px 65px; background-color: transparent; border-radius: 5px; background-image: url("/images/redesign_2019/kinchbus/Kaptain_01.png"); background-position: center; background-size: contain; } @media only screen and (max-width: 767px) { body.Kinchbus div.content .ticketButtonHolder { top: -20px; padding: 100px 0 45px; } } body.Kinchbus div.content .expander { color: #005CA9; } body.Kinchbus div.content .expander:before, body.Kinchbus div.content .expander:after { background-color: #FAB900; } body.Kinchbus div.content .expander.arrows:after { background-image: url(/images/redesign_2019/nav/large_yellow_arrow@2x.png); background-color: transparent; } body.Kinchbus div.content #tab_departures .live-button { text-align: right; } @media only screen and (max-width: 767px) { body.Kinchbus div.content .faqs.grid.twocol .sectionList { border-color: #DAE4F0; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body.Kinchbus div.content .faqs.grid.twocol .sectionList:after { background-image: url(/images/redesign_2019/nav/large_yellow_arrow@2x.png); } body.Kinchbus div.content .faqs.grid.twocol .sectionHolder .expander.arrows { border-color: #DAE4F0; } } body.Kinchbus div.content .journeys-departures .tabBlocks > div { background-image: url(/images/redesign_2019/kinchbus/kaptainkinch.png); } @media only screen and (max-width: 767px) { body.Kinchbus div.content .journeys-departures .tabBlocks > div { padding-bottom: 110px; background-image: url(/images/redesign_2019/kinchbus/kaptainkinchm.png); background-position-x: center; background-size: auto 100px; } } body.Kinchbus div.content .journeys-departures #tab_find-journey input[type=submit].button { margin-bottom: 75px; } @media only screen and (max-width: 767px) { body.Kinchbus div.content .journeys-departures #tab_find-journey input[type=submit].button { margin-bottom: 25px; } } body.Kinchbus div.content .journeys-departures #tab_departures .button { margin-top: 20px; margin-bottom: 55px; color: #005CA9; } @media only screen and (max-width: 767px) { body.Kinchbus div.content .journeys-departures #tab_departures .button { margin-bottom: 25px; } } body.Kinchbus div.content h2, body.Kinchbus div.content h3 { color: #005CA9; } body.Kinchbus div.content .lightBorder { border-color: #00A6E6; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body.Kinchbus div.content .superLightBorder { border-color: #DAE4F0; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body.Kinchbus div.content header { color: #fff; background-color: #005CA9; } body.Kinchbus div.content header nav.menu { background-color: #005CA9; } body.Kinchbus div.content header nav.menu > ul > li div, body.Kinchbus div.content header nav.menu > ul > li div a { color: #FAB900; } body.Kinchbus div.content header nav.menu .select2-choice { background-color: #005CA9 !important; background-image: url(/images/redesign_2019/input/dropdown_down@2x.png) !important; border-color: #00A6E6; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } @media only screen and (max-width: 767px) { body.Kinchbus div.content header nav.menu > ul > li a::after { background-image: url(/images/redesign_2019/nav/large_yellow_arrow@2x.png); } } body.Kinchbus div.content header nav.main-nav > ul > li.loginout { text-transform: uppercase; letter-spacing: 0.3em; } @media only screen and (max-width: 767px) { body.Kinchbus div.content header.view-mobile { background-image: url(/images/redesign_2019/kinchbus/kinchbus_logo@2x.png); } } body.Kinchbus div.content header nav .logo { background-image: url(/images/redesign_2019/kinchbus/kinchbus_logo@2x.png); } @media only screen and (max-width: 767px) { body.Kinchbus div.content header nav .logo { background-image: none; } } body.Kinchbus div.content #tab_find-journey div.form > a.swapButton { background-color: #005CA9; } body.Kinchbus div.content .JourneyPlanner > * { grid-auto-columns: 12fr 10fr; grid-column-gap: 132px; } body.Kinchbus div.content .smallTabButtons a { color: #005CA9; border-bottom-color: #005CA9; } body.Kinchbus div.content .smallTabButtons a.active { border-bottom-color: #FAB900; } body.Kinchbus div.content .aboutUs .ourBusesOurPeople.ourBuses { background-image: url('/images/redesign_2019/kinchbus/kinchbus_bus.png'), linear-gradient(to bottom, #005CA9, #102A62 100%); background-size: auto 70%, cover; background-position: right center; } @media only screen and (max-width: 991px) { body.Kinchbus div.content .aboutUs .ourBusesOurPeople.ourBuses { background-position: right bottom 10%; background-size: auto 50%, cover; padding-bottom: 300px; } body.Kinchbus div.content .aboutUs .ourBusesOurPeople.ourBuses .ourBuses { width: 100%; } } @media only screen and (max-width: 767px) { body.Kinchbus div.content .aboutUs .ourBusesOurPeople.ourBuses { background-position: center bottom; background-size: auto 40%, cover; } } body.Kinchbus div.content .aboutUs .ourBusesOurPeople.ourPeople { background-image: linear-gradient(to bottom, #005CA9, #102A62 100%); } body.Kinchbus div.content .aboutUs .ourBusesOurPeople .smallTabButtons a { color: #fff; } body.Kinchbus div.content .aboutUs .ourBusesOurPeople .smallTabButtons a:not(.active) { border-bottom-color: white; } body.Kinchbus div.content .JourneyPlanner { color: #005CA9; } body.Kinchbus div.content .JourneyPlanner .journeys-departures { border-color: #00A6E6; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body.Kinchbus div.content .JourneyPlanner a.timetableButton, body.Kinchbus div.content .JourneyPlanner .learnMore a { color: #005CA9; border-color: #DAE4F0; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body.Kinchbus div.content .JourneyPlanner a.mapLink:before { background-image: url(/images/redesign_2019/kinchbus/pdf.png); } body.Kinchbus div.content .JourneyPlanner a.mapLink:after { background-image: url(/images/redesign_2019/nav/large_blue_arrow@2x.png); } body.Kinchbus div.content section.travelUpdate { color: #005CA9; } body.Kinchbus div.content section.travelUpdate article.list-news-item { border-bottom-color: #DAE4F0; } body.Kinchbus div.content section.travelUpdate article.list-news-item header { background-color: transparent; } body.Kinchbus div.content section.travelUpdate article.list-news-item time { color: #FAB900; } body.Kinchbus div.content section.travelUpdate article.list-news-item .button { background-color: #fff; color: #005CA9; border: 1px #005CA9 solid; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } @media only screen and (max-width: 767px) { body.Kinchbus div.content section.travelUpdate article.list-news-item .button { border: none; box-shadow: none; background-color: transparent; color: #FAB900; background-image: url(/images/redesign_2019/nav/large_yellow_arrow@2x.png); } } body.Kinchbus div.content .serviceList .service { color: #005CA9; border-color: #DAE4F0; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body.Kinchbus div.content section.newsList article h2 { color: #FAB900; } body.Kinchbus div.content .newsItem { color: #005CA9; } body.Kinchbus div.content .newsItem p.nav a { color: #005CA9; } body.Kinchbus div.content .newsItem p.caption { color: #005CA9; } body.Kinchbus div.content .newsItem time { display: block; } body.Kinchbus div.content .newsItem.alert time { color: #FAB900; } body.Kinchbus div.content .shadowBoxes > * { text-decoration: none; border-color: #DAE4F0; color: #005CA9; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body.Kinchbus div.content .shadowBoxes > * a { color: #FAB900; text-decoration: none; } body.Kinchbus div.content .shadowBoxes.ticketVariantClassBoxes a.active { box-shadow: 0 2px 15px 0 #00A6E6; border-color: #DAE4F0; } body.Kinchbus div.content .shadowBoxes.homeButtons { font-weight: bold; } body.Kinchbus div.content div.hero-nav-shaded { background-color: #005CA9 0%, #102A62 100%; background-image: -webkit-linear-gradient(top, #005CA9 0%, #102A62 100%, #000000); background-image: -moz-linear-gradient(top, #005CA9 0%, #102A62 100%, #000000); background-image: -o-linear-gradient(top, #005CA9 0%, #102A62 100%, #000000); background-image: -ms-linear-gradient(top, #005CA9 0%, #102A62 100%, #000000); background-image: linear-gradient(top, #005CA9 0%, #102A62 100%, #000000); } body.Kinchbus div.content div.hero-nav-shaded a, body.Kinchbus div.content div.hero-nav-shaded h1, body.Kinchbus div.content div.hero-nav-shaded .subtitle { color: #fff; } body.Kinchbus div.content div.hero { background-color: #005CA9 0%, #102A62 100%; background-image: -webkit-linear-gradient(top, #005CA9 0%, #102A62 100%, #000000); background-image: -moz-linear-gradient(top, #005CA9 0%, #102A62 100%, #000000); background-image: -o-linear-gradient(top, #005CA9 0%, #102A62 100%, #000000); background-image: -ms-linear-gradient(top, #005CA9 0%, #102A62 100%, #000000); background-image: linear-gradient(top, #005CA9 0%, #102A62 100%, #000000); } body.Kinchbus div.content div.hero.bg-image-kinch { background-repeat: no-repeat; background-position: bottom left; background-size: cover; } body.Kinchbus div.content div.hero.busroutes { background-image: url('/images/redesign_2019/kinchbus/kinch-5.jpg'); } body.Kinchbus div.content div.hero.simple h1 { color: #005CA9 !important; } body.Kinchbus div.content div.hero.simple div.subtitle { color: #005CA9 !important; } body.Kinchbus div.content footer { color: #fff; } body.Kinchbus div.content footer a { color: #fff; } body.Kinchbus div.content footer div.mainfooter { background-color: #102A62; } body.Kinchbus div.content footer div.subfooter { background-color: #005CA9; } body.Kinchbus .button { background-color: #FFDC00; color: #005CA9; border: none; } body.Kinchbus .button:not([disabled]):hover { background-color: #FAB900; } body.Kinchbus .button:not([disabled]):focus { background-color: #FFDC00; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.2); } body.Kinchbus .button:not([disabled]):active { background-color: #FFDC00; border: 1px solid #005CA9; } body.Kinchbus .button.secondary { background-color: #fff; color: #005CA9; border: 1px solid #005CA9; } @media only screen and (max-width: 767px) { body.Kinchbus .button.secondary.standard-on-mobile { background-color: #005CA9; color: #fff; } } body.Kinchbus .button.secondary:not([disabled]):hover { background-color: #005CA9; color: #fff; } body.Kinchbus .button.secondary:not([disabled]):focus { background-color: #fff; color: #005CA9; } body.Kinchbus .button.secondary:not([disabled]):active { background-color: #102A62; color: #fff; border: none; } body.Kinchbus .button.witharrow { background-color: transparent; border: none; transition: color 0.25s, background-image 0.25s; background-image: url('/images/redesign_2019/nav/large_yellow_arrow@2x.png'); background-size: 13px 20px; background-position: right center; background-repeat: no-repeat; } body.Kinchbus .button.witharrow:not([disabled]):hover { background-color: transparent; text-decoration: underline; background-image: url('/images/redesign_2019/nav/large_blue_arrow@2x.png'); } body.Kinchbus .button.witharrow:not([disabled]):focus { background-color: transparent; box-shadow: none; } body.Kinchbus .button.witharrow:not([disabled]):active { background-color: transparent; border: none; color: #102A62; } body.Kinchbus .button.withuparrow, body.Kinchbus .button.withdownarrow { background-color: transparent; border: none; transition: color 0.25s, background-image 0.25s; background-size: 20px 13px; background-position: right center; background-repeat: no-repeat; } body.Kinchbus .button.withuparrow:not([disabled]):hover, body.Kinchbus .button.withdownarrow:not([disabled]):hover { background-color: transparent; text-decoration: underline; background-image: url('/images/redesign_2019/nav/large_blue_arrow@2x.png'); } body.Kinchbus .button.withuparrow:not([disabled]):focus, body.Kinchbus .button.withdownarrow:not([disabled]):focus { background-color: transparent; box-shadow: none; } body.Kinchbus .button.withuparrow:not([disabled]):active, body.Kinchbus .button.withdownarrow:not([disabled]):active { background-color: transparent; border: none; color: #102A62; } body.Kinchbus .button.withuparrow { background-image: url('/images/redesign_2019/nav/arrow_up.png'); } body.Kinchbus .button.withuparrow:not([disabled]):hover { background-color: transparent; text-decoration: underline; background-image: url('/images/redesign_2019/nav/arrow_up_blue.png'); } body.Kinchbus .button.withdownarrow { background-image: url('/images/redesign_2019/nav/arrow_down.png'); } body.Kinchbus .button.withdownarrow:not([disabled]):hover { background-color: transparent; text-decoration: underline; background-image: url('/images/redesign_2019/nav/arrow_down_blue.png'); } body.Kinchbus .button.withplus { background-color: transparent; border: none; transition: color 0.25s, background-image 0.25s; background-image: url('/images/redesign_2019/kinchbus/plus@2x.png'); background-size: 20px; background-position: right center; background-repeat: no-repeat; text-transform: none; letter-spacing: 1px; font-weight: bold; } body.Kinchbus .button.withplus:not([disabled]):hover { background-color: transparent; text-decoration: underline; } body.Kinchbus .button.withplus:not([disabled]):focus { background-color: transparent; box-shadow: none; } body.Kinchbus .button.withplus:not([disabled]):active { background-color: transparent; border: none; color: #102A62; } body.Kinchbus .button.linkstyle { background-color: transparent; border: none; transition: color 0.25s; color: #00A6E6; text-transform: none; padding: 0; } body.Kinchbus .button.linkstyle:not([disabled]):hover { background-color: transparent; text-decoration: underline; } body.Kinchbus .button.linkstyle:not([disabled]):focus { background-color: transparent; box-shadow: none; } body.Kinchbus .button.linkstyle:not([disabled]):active { background-color: transparent; border: none; color: #005CA9; } body.Kinchbus .button.block { color: #005CA9; border: 1px solid #DAE4F0; background-color: #fff; background-image: url('/images/redesign_2019/nav/large_yellow_arrow@2x.png'); background-size: 13px 20px; background-position: right 16px center; background-repeat: no-repeat; } body.Kinchbus .button.block:not([disabled]):hover { background-color: #fff; border-color: #005CA9; } body.Kinchbus .button.block:not([disabled]):focus { background-color: #fff; border-color: #005CA9; } body.Kinchbus .button.block:not([disabled]):active { background-color: transparent; background-color: #DAE4F0; border-color: #005CA9; background-image: url('/images/redesign_2019/nav/large_blue_arrow@2x.png'); } body.Kinchbus .button.block.block-radio { background-image: none; cursor: default; align-items: center; } body.Kinchbus .button.block.block-radio:active, body.Kinchbus .button.block.block-radio:hover, body.Kinchbus .button.block.block-radio:focus { background-image: none; background-color: #fff; border-color: #DAE4F0; } body.Kinchbus .button.block.block-radio span.cbradWrapper { vertical-align: middle; margin-right: 20px; margin-left: 20px; } body.Kinchbus .flex50[data-section="Promotions"] { position: relative; } body.Kinchbus .flex50[data-section="Promotions"] span.cbradWrapper { position: static; width: auto; height: auto; overflow: hidden; width: 0; height: 0; display: inline; } body.Kinchbus .flex50[data-section="Promotions"] input[type="checkbox"] { display: none; } body.Kinchbus .flex50[data-section="Promotions"] input[type="checkbox"] + .replacement { transition: border-color 0.25s; width: auto; height: auto; top: 0; left: 0; right: 0; bottom: 0; position: absolute; pointer-events: none; background-image: none; border-radius: 3px; border-style: solid; border-width: 2px; border-color: #EFEFEF; } body.Kinchbus .flex50[data-section="Promotions"] input[type="checkbox"]:checked + .replacement { border-color: #FFDC00; } body.Kinchbus .flex50[data-section="Promotions"] label { display: block; padding: 10px; cursor: pointer; } body.Kinchbus .flex50[data-section="Promotions"] img { width: 25px; height: 24px; } body.Kinchbus label { color: #005CA9; } body.Kinchbus label .req { color: red; margin-left: 3px; } body.Kinchbus .primary-text, body.Kinchbus h1, body.Kinchbus h2, body.Kinchbus h3, body.Kinchbus h4, body.Kinchbus h5, body.Kinchbus h6 { color: #005CA9; } body.Kinchbus .help-text { margin-left: 14px; margin-top: 4px; } body.Kinchbus input::placeholder, body.Kinchbus textarea::placeholder { color: #005CA9; } body.Kinchbus input:not([type]), body.Kinchbus textarea:not([type]), body.Kinchbus input[type="text"], body.Kinchbus textarea[type="text"], body.Kinchbus input[type="password"], body.Kinchbus textarea[type="password"] { border-color: #DAE4F0; color: #005CA9; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body.Kinchbus input:not([type]):not(:disabled):not(.invalid):hover, body.Kinchbus textarea:not([type]):not(:disabled):not(.invalid):hover, body.Kinchbus input[type="text"]:not(:disabled):not(.invalid):hover, body.Kinchbus textarea[type="text"]:not(:disabled):not(.invalid):hover, body.Kinchbus input[type="password"]:not(:disabled):not(.invalid):hover, body.Kinchbus textarea[type="password"]:not(:disabled):not(.invalid):hover, body.Kinchbus input:not([type]):not(:disabled):not(.invalid):focus, body.Kinchbus textarea:not([type]):not(:disabled):not(.invalid):focus, body.Kinchbus input[type="text"]:not(:disabled):not(.invalid):focus, body.Kinchbus textarea[type="text"]:not(:disabled):not(.invalid):focus, body.Kinchbus input[type="password"]:not(:disabled):not(.invalid):focus, body.Kinchbus textarea[type="password"]:not(:disabled):not(.invalid):focus { border-color: #005CA9; } body.Kinchbus input:not([type]):not(:disabled):not(.invalid):focus, body.Kinchbus textarea:not([type]):not(:disabled):not(.invalid):focus, body.Kinchbus input[type="text"]:not(:disabled):not(.invalid):focus, body.Kinchbus textarea[type="text"]:not(:disabled):not(.invalid):focus, body.Kinchbus input[type="password"]:not(:disabled):not(.invalid):focus, body.Kinchbus textarea[type="password"]:not(:disabled):not(.invalid):focus { box-shadow: 0 0 5px 0 rgba(0, 92, 169, 0.9); } body.Kinchbus input:not([type]):not(:disabled):not(.invalid):focus:not(.empty), body.Kinchbus textarea:not([type]):not(:disabled):not(.invalid):focus:not(.empty), body.Kinchbus input[type="text"]:not(:disabled):not(.invalid):focus:not(.empty), body.Kinchbus textarea[type="text"]:not(:disabled):not(.invalid):focus:not(.empty), body.Kinchbus input[type="password"]:not(:disabled):not(.invalid):focus:not(.empty), body.Kinchbus textarea[type="password"]:not(:disabled):not(.invalid):focus:not(.empty) { border-color: #00A6E6; } body.Kinchbus input:not([type]).invalid, body.Kinchbus textarea:not([type]).invalid, body.Kinchbus input[type="text"].invalid, body.Kinchbus textarea[type="text"].invalid, body.Kinchbus input[type="password"].invalid, body.Kinchbus textarea[type="password"].invalid { border-color: #D0021B; } body.Kinchbus input[type="radio"] + .replacement, body.Kinchbus textarea[type="radio"] + .replacement { left: 3px; top: 3px; width: 25px; height: 25px; background-size: 25px 25px; background-image: url(/images/redesign_2019/kinchbus/radio@2x.png); } body.Kinchbus input[type="radio"]:checked + .replacement, body.Kinchbus textarea[type="radio"]:checked + .replacement { background-image: url(/images/redesign_2019/kinchbus/radio_sel@2x.png); } body.Kinchbus input[type="checkbox"] + .replacement, body.Kinchbus textarea[type="checkbox"] + .replacement { left: 4px; top: 4px; width: 23px; height: 23px; background-size: 23px 23px; background-image: url(/images/redesign_2019/kinchbus/checkbox@2x.png); } body.Kinchbus input[type="checkbox"]:checked + .replacement, body.Kinchbus textarea[type="checkbox"]:checked + .replacement { top: -4px; left: 4px; width: 31px; height: 31px; background-size: 31px 31px; background-image: url(/images/redesign_2019/kinchbus/checkbox_checked@2x.png); } body.Kinchbus select, body.Kinchbus .select2-choice { color: #005CA9; border-color: #DAE4F0; box-shadow: 0 2px 15px 0 rgba(0, 92, 169, 0.05); } body.Kinchbus select:hover, body.Kinchbus .select2-choice:hover { border-color: #005CA9 !important; } body.Kinchbus select:focus, body.Kinchbus .select2-choice:focus { border-color: #DAE4F0; box-shadow: 0 0 5px 0 rgba(0, 92, 169, 0.9); } body.Kinchbus select *:hover, body.Kinchbus .select2-choice *:hover { background-color: #DAE4F0; } body.Kinchbus .tabSwitcher > a { color: #005CA9; background-color: #DAE4F0; } body.Kinchbus .tabSwitcher > a.active { background-color: #fff; } body.Kinchbus .tabBlocks > div { background-color: #fff; } body.Kinchbus h3.main-heading { display: none; } body.Kinchbus.loginRegister main { background-color: #f9f9fb; } body.Kinchbus .showHideSectionButton { background-size: 20px 13px; background-position: right 12px center; background-repeat: no-repeat; background-image: url(../../images/redesign_2019/input/dropdown_down@2x.png); cursor: pointer; } body.Kinchbus .showHideSectionButton.open { background-image: url(../../images/redesign_2019/input/dropdown_up@2x.png); } body.Kinchbus .failure-feedback { background: url(/images/redesign_2019/kinchbus/info.png) no-repeat 15px center; background-size: 24px; background-color: #DAE4F0; padding: 20px; padding-left: 70px; margin: 1em 0; color: #005CA9; display: block; } body.Kinchbus .validationSummary, body.Kinchbus .mango-feedback-success { color: #005CA9 !important; background: url(/images/redesign_2019/kinchbus/info.png) no-repeat 15px center; background-size: 24px; background-color: #F0F6FB; padding-left: 55px; padding-right: 15px; padding-top: 10px; padding-bottom: 10px; border-radius: 5px; margin-bottom: 10px; } body.Kinchbus .mango-feedback-success, body.Kinchbus .success-feedback { background: url(/images/redesign_2019/kinchbus/help.png) no-repeat 15px center; background-size: 24px; background-color: #DAE4F0; padding: 20px; padding-left: 70px; margin: 1em 0; color: #005CA9; display: block; } body.Kinchbus .validationSummary ul, body.Kinchbus .mango-feedback-success ul { margin-left: 25px; } /*@media @tablet {*/ body.Kinchbus div.content footer .SocialLinks a.twitter, body.Kinchbus div.content footer .SocialLinks a.facebook, body.Kinchbus div.content footer .SocialLinks a.youtube, body.Kinchbus div.content footer .SocialLinks a.insta { background-position-y: -33px !important; } body.Kinchbus div.content footer div.mainfooter { background-color: #fff; } body.Kinchbus div.content footer div.mainfooter > ul > li { border-top: 1px #BBD6ED solid; } body.Kinchbus div.content footer div.mainfooter a { color: #005CA9; } /*}*/ @media only screen and (max-width: 767px) { body.Kinchbus { background-color: #005CA9; } body.Kinchbus div.content header.view-mobile > a.logo-button { height: 32px; } body.Kinchbus div.content header.view-mobile .hamburger { top: 9px; } } .priceTable, .kinchkardOrderItems { margin-top: 30px; width: 100%; } .priceTable td, .kinchkardOrderItems td, .priceTable th, .kinchkardOrderItems th { padding-top: 30px; padding-bottom: 30px; padding-right: 15px; color: #005CA9; border-bottom: 1px solid #BBD6ED; } .priceTable td label *, .kinchkardOrderItems td label * { vertical-align: middle; } .priceTable td label span, .kinchkardOrderItems td label span { height: 23px; line-height: 23px; } .priceTable td label span.cbradWrapper, .kinchkardOrderItems td label span.cbradWrapper { height: auto; } .kinchkardOrderItems { margin-top: 10px; } .proceed-to-checkout.actions { float: right; width: 100%; text-align: right; } .proceed-to-checkout.actions .add-another-card { margin-right: 20px; } @media only screen and (max-width: 767px) { .proceed-to-checkout.actions .add-another-card-proceed-checkout { width: 100%; margin-top: 20px; } .proceed-to-checkout.actions .add-another-card { margin-right: 0; } } .saved-payment-cards .payment-card { width: 555px; display: inline-block; } .saved-payment-cards .payment-card .button.block { width: auto; min-width: 361px; margin: 15px; } @media screen and (max-width: 400px) { .saved-payment-cards .payment-card .button.block { min-width: 100%; } } .saved-payment-cards .payment-card .button.block .card-number { font-weight: bold; margin-bottom: 8px; } .saved-payment-cards .payment-card .button.block .card-name { color: #FAB900; text-transform: uppercase; letter-spacing: 5px; font-weight: bold; margin-bottom: 8px; } .saved-payment-cards .payment-card .button.block .card-expiry { letter-spacing: 0; } .saved-payment-cards .payment-card .button.block .img img { width: 63px; margin-right: 20px; } .saved-payment-cards .payment-card .button.block .actions .button { display: inline-block; font-size: 0.9em; } .saved-payment-cards .payment-card .button.block .verificationNumber img { width: 24px; height: 24px; margin: 0 3px; vertical-align: middle; } .saved-payment-cards .payment-card .button.block .verificationNumber th { width: 150px; } .saved-payment-cards .payment-card .button.block .button.purchaseButton { margin-top: 15px; width: 100%; } .saved-payment-cards .payment-card .button.block .purchaseLoading { text-align: center; font-weight: bold; margin-top: 15px; } .saved-payment-cards .payment-card .button.block .purchaseLoading img { height: 16px; width: 16px; margin-right: 10px; } .saved-payment-cards .payment-card.payment-card-readonly .button.block .img { margin-left: 20px; margin-right: 20px; } .saved-payment-cards .payment-card.payment-card-readonly .button.block .text { width: 100%; } @media only screen and (max-width: 991px) { .saved-payment-cards .payment-card { width: 100%; display: block; } .saved-payment-cards .payment-card .text { flex: 1; } } @media only screen and (max-width: 767px) { .saved-payment-cards .payment-card .button.block { margin-left: 0; margin-right: 0; } .saved-payment-cards .payment-card .button.block .img { display: none; } .saved-payment-cards .payment-card .button.block .card-name { color: #005CA9; display: inline-block; letter-spacing: 0; text-transform: none; border-right: 1px solid #005CA9; padding-right: 5px; font-weight: normal; } .saved-payment-cards .payment-card .button.block .card-expiry { letter-spacing: 0; display: inline-block; } .saved-payment-cards .payment-card .button.block .text { margin-right: 5px; } .saved-payment-cards .payment-card .button.block .actions { display: none; } .saved-payment-cards .payment-card .button.block .button.purchaseButton { width: 95%; float: left; padding-left: 15px; padding-right: 15px; } .saved-payment-cards .payment-card.payment-card-readonly .button.block .text { margin-left: 20px; } .saved-payment-cards .payment-card.payment-card-readonly .button.block .actions { display: block; } } .student-info-message { background: #DAE4F0; padding: 20px; margin: 1em 0; color: #005CA9; display: block; } body.Kinchbus input[type="text"].superCommuterVoucherInput { display: inline-block; margin-right: 15px; margin-bottom: 10px; min-width: 380px; } body.Kinchbus .button.voucher-applied-remove { display: inline-block; margin-left: 15px; } body.Kinchbus .supercommuter-back.button { display: inline-block; margin-left: 15px; } body.Kinchbus .supercommutervalidation.validationSummary { margin-left: 0px; } body.Kinchbus .super-commuter-intro { margin-bottom: 5px; } body.Kinchbus .lblSuperCommuterVoucherCode { color: #005CA9; } body.Kinchbus .validateTicketVariantError { color: #005CA9; } body.Kinchbus .super-commuter-link input { white-space: normal; } @media only screen and (max-width: 767px) { body.Kinchbus .supercommuter-apply.button, body.Kinchbus .supercommuter-back.button, body.Kinchbus .voucher-applied-remove.button { display: block; width: 100%; margin-top: 20px; margin-left: 0px; margin-right: 0px; } body.Kinchbus input[type="text"].superCommuterVoucherInput { display: block; width: 100%; } } body.Kinchbus .readonly { color: #005CA9; } body.Kinchbus .intro-text { color: #005CA9; } body.Kinchbus .homeIntro { margin-top: 64.5px; } body.Kinchbus .homeButtons > a { box-shadow: 0 2px 10px 0 #FAB900 !important; border-color: #FAB900 !important; } body.Kinchbus #homepage-actions .thing-to-do { border: 1px solid #DAE4F0; color: #005CA9; } body.Kinchbus #homepage-actions .thing-to-do.buy-kinchkard { background-image: url(/images/redesign_2019/nav/large_yellow_arrow@2x.png), url(/images/redesign_2019/homepage/kinchkard.png); } body.Kinchbus #homepage-actions .thing-to-do.manage-my-details { background-image: url(/images/redesign_2019/nav/large_yellow_arrow@2x.png), url(/images/redesign_2019/homepage/contact.png); } body.Kinchbus #homepage-actions .thing-to-do.customer-support { background-image: url(/images/redesign_2019/nav/large_yellow_arrow@2x.png), url(/images/redesign_2019/homepage/phone.png); } body.Kinchbus #homepage-actions .thing-to-do.faq { background-image: url(/images/redesign_2019/nav/large_yellow_arrow@2x.png), url(/images/redesign_2019/homepage/help.png); } .journey-history { margin-top: 5px; width: 100%; border-collapse: separate; border-spacing: 0; } .journey-history th, .journey-history td { padding-top: 30px; padding-bottom: 30px; color: #005CA9; border-bottom: 1px solid #BBD6ED; text-align: left; vertical-align: middle; } .journey-history-panel dt { font-weight: bold; } .journey-history-panel dd { margin-bottom: 6px; } .login .flexInputContainer, .mango-signup .flexInputContainer { margin-top: 10px; } .login .forgot-username-btn { margin-right: 20px; } @media only screen and (max-width: 991px) { .login .forgot-username-btn { margin-right: 20px; display: inline-block; } } @media only screen and (max-width: 767px) { .login .forgot-username-btn { margin-right: 0px; display: block; text-align: right; } } .login .forgot-username-btn-panel, .login .login-btn-panel { margin-top: 20px; } .mango-signup .button.linkstyle .unlink, .mango-signup .button.linkstyle .unlink:hover, .mango-signup .button.linkstyle .unlink:focus, .mango-signup .button.linkstyle .unlink:active { text-decoration: none; font-weight: normal; color: #005CA9; } body.Kinchbus div.content main .mango-main .edit-header { color: #005CA9; } body.Kinchbus div.content main .mango-main .edit-subheader { color: #005CA9; } body.Kinchbus div.content main .mango-main #mango-contactless-transactions { color: #005CA9; } body.Kinchbus div.content main .mango-main #mango-contactless-transactions #journey-dates input { border-color: #BBD6ED; color: #005CA9; } body.Kinchbus div.content main .mango-main #mango-contactless-transactions #journey-dates input.active { background-color: #005CA9; color: #fff; } body.Kinchbus div.content main .mango-main #mango-contactless-transactions .transaction-box { border-color: #DAE4F0; } body.Kinchbus div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step h3 { color: #FAB900; } body.Kinchbus div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction .transaction-step.transaction-divider { border-color: #DAE4F0; } body.Kinchbus div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box hr { background-color: #DAE4F0; } @media only screen and (max-width: 767px) { body.Kinchbus div.content main .mango-main #mango-contactless-transactions .transaction-box.transaction-date-box .transaction { border-bottom-color: #BBD6ED; } } body.Kinchbus div.content main .mango-main #kinchbus-journey-history #journey-dates input { border-color: #BBD6ED; color: #005CA9; } body.Kinchbus div.content main .mango-main #kinchbus-journey-history #journey-dates input.active { background-color: #005CA9; color: #fff; } body.Kinchbus div.content main .mango-main #kinchbus-journey-history .transaction-box { border-color: #DAE4F0; } body.Kinchbus div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-divider { border-left: 1px solid #DAE4F0; } body.Kinchbus div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step { border-right: 1px solid #DAE4F0; } body.Kinchbus div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction .transaction-step h3 { color: #FAB900; } body.Kinchbus div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box hr { background-color: #DAE4F0; } @media only screen and (max-width: 767px) { body.Kinchbus div.content main .mango-main #kinchbus-journey-history .transaction-box.transaction-date-box .transaction { border-bottom: 1px solid #BBD6ED; } } body.Kinchbus div.content main .mango-main #mango-faq > div > p > a, body.Kinchbus div.content main .mango-main #mango-faq > p > a { color: #005CA9; } body.Kinchbus div.content main .mango-main #mango-faq > div > p > a:after, body.Kinchbus div.content main .mango-main #mango-faq > p > a:after { color: #FAB900; } body.Kinchbus div.content main .mango-main #mango-faq .answer { color: #005CA9; } @media only screen and (max-width: 767px) { body.Kinchbus div.content main .mango-main #mango-faq p { border-color: #DAE4F0; } } body.Kinchbus div.content main .mango-main #mango-homepage-columns .add-contactless-btn { color: #005CA9; } body.Kinchbus div.content main .mango-main #mango-homepage-columns .add-contactless-btn .plus-icon { background-image: url('/images/redesign_2019/kinchbus/plus@2x.png'); } body.Kinchbus div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .inner-card { background: linear-gradient(180deg, #005CA9 0%, #102A62 100%); border: 1px solid #DAE4F0; } body.Kinchbus div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .inner-card .card-shine { background-color: rgba(218, 228, 240, 0.13); } body.Kinchbus div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .drop-card, body.Kinchbus div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .mid-drop-card { border: 1px solid #DAE4F0; } body.Kinchbus div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .mid-drop-card { color: #005CA9; } body.Kinchbus div.content main .mango-main #mango-homepage-columns .homepage-column .card-details .products .product { border-color: #DAE4F0; } body.Kinchbus div.content main .mango-main #mango-homepage-columns #homepage-divider { border-left-color: #DAE4F0; } body.Kinchbus .modal__container .modal__close { background-image: url('/images/redesign_2019/kinchbus/yellow-cross.png'); } body.Kinchbus .modal__container main.modal__content { color: #005CA9; } body.Kinchbus .modal__container main.modal__content a { color: #00A6E6; } body.Kinchbus .modal__container .modal__btn.button { color: #005CA9 !important; } /*kinchbus services*/ body.Kinchbus .service-page a { color: #005CA9; } body.Kinchbus .service-page .route-timetable-pdfs .timetable-route-section-end:last-child { display: none; } body.Kinchbus .travel-alert .last-updated { color: #FAB900; } body.Kinchbus .travel-alert .description { color: #005CA9; } body.Kinchbus .route-timetable-pdfs .timeTablePDF { color: #005CA9; background-image: url(/images/redesign_2019/kinchbus/pdf.png), url(/images/redesign_2019/nav/large_blue_arrow@2x.png); } body.Kinchbus .route-timetable-pdfs .timeTablePDF .timetable-route-direction { color: #808080; } body.Kinchbus .map-step1-choose-route .routeSwitcher, body.Kinchbus .map-step2-choose-direction .routeSwitcher, body.Kinchbus .map-step1-choose-route .directionSwitcher, body.Kinchbus .map-step2-choose-direction .directionSwitcher { color: #005CA9; border-bottom: 1px solid #DAE4F0; } body.Kinchbus .map-step1-choose-route .routeSwitcher.selected, body.Kinchbus .map-step2-choose-direction .routeSwitcher.selected, body.Kinchbus .map-step1-choose-route .directionSwitcher.selected, body.Kinchbus .map-step2-choose-direction .directionSwitcher.selected { border-bottom: 4px solid #FAB900; } body.Kinchbus .service-page p, body.Kinchbus .local-areas .destination-list .destination { color: #005CA9; } body.Kinchbus .destination-list .destination { background-image: url(/images/redesign_2019/nav/large_blue_arrow@2x.png); } body.Kinchbus .tabs > div.active { color: #005CA9; background-color: #fff; } body.Kinchbus .tabs > div { color: #005CA9; background-color: #DAE4F0; }