@charset "utf-8"; /* CSS Document */ @font-face { font-family: 'Poppins'; src: url('fonts/poppins-medium-webfont.woff2') format('woff2'), url('fonts/poppins-medium-webfont.woff') format('woff'); font-weight: 500; font-style: normal; } @font-face { font-family: 'Poppins'; src: url('fonts/poppins-semibold-webfont.woff2') format('woff2'), url('fonts/poppins-semibold-webfont.woff') format('woff'); font-weight: 600; font-style: normal; } :root { --grid-width: 1366px; /* Base Width is Set Here */ --grid-half-width: 630px; /* Half Base Width */ --grid-gutter: 12px; /* Gutter Width is set here. Just put half the gutter width here. */ --header-height: 100px; --footer-height: 93px; --primary-color: #004cab; --secondary-color: #fdbb30; --tertiary-color: #008c99; --quaternary-color: #9cd1e3; --gray-color: rgba(0,0,0,.9); --font-color: #414042; --primary-font: 'Poppins', sans-serif; --secondary-font: "anivers", serif; --font-awesome:'Font Awesome 5 Brands'; --standard-font-size: 15px; --line-height: 1.6667; } /* Base Template Settings */ html { margin-top: 0px!important; margin: 0px!important; } body { font-family: var(--primary-font); } #page-head hgroup, #page-foot section, main section, div section { max-width: var(--grid-width); } .halves > .half > section { max-width: var(--grid-half-width); } .halves > .half > section, .listed li, [class^="box-"], [class*=" box-"] { padding: var(--grid-gutter); } *:hover { transition: all .25s; } /* article styles */ article > * { color: var(--font-color); margin-bottom: var(--standard-font-size); } article a { font-family: var(--primary-font); color: var(--primary-color); text-decoration: underline; } article a:hover { color: var(--secondary-color); } article ul, article ol, article p, .p { font-family: var(--secondary-font); font-size: var(--standard-font-size); margin-bottom: var(--standard-font-size); line-height: var(--line-height); letter-spacing: 0.003ex } article #map { height: 400px; } * * { font-weight: inherit; } article h1, .h1 { font-family: var(--primary-font); color: var(--primary-color); letter-spacing: -0.01ex; font-weight: 600; line-height: 1; margin-bottom: var(--standard-font-size); padding-bottom: 2px; font-size: 18px; } article h2, .h2 { font-family: var(--primary-font); color: var(--primary-color); font-size: 18px; font-weight: 600; line-height: var(--line-height); margin-bottom: var(--standard-font-size); } article h3, .h3 { font-family: var(--secondary-font); line-height: var(--line-height); margin-bottom: var(--standard-font-size); } article h4, .h4 { font-family: var(--secondary-font); line-height: var(--line-height); margin-bottom: var(--standard-font-size); } article h5, .h5 { font-family: var(--secondary-font); line-height: var(--line-height); margin-bottom: var(--standard-font-size); } article h6, .h6 { font-family: var(--secondary-font); line-height: var(--line-height); margin-bottom: var(--standard-font-size); } article blockquote p, .blockquote p { font-family: var(--secondary-font); line-height: var(--line-height); margin-bottom: var(--standard-font-size); } article blockquote cite, .blockquote cite { font-family: var(--primary-font); line-height: var(--line-height) } details { font-family: var(--primary-font); font-size: var(--standard-font-size); margin-bottom: var(--standard-font-size); line-height: var(--line-height); } article .alignfull { max-width: 100vw; width: 100vw; margin-left: calc( var(--grid-half-width) - 50vw ); } article .alignfull img { max-width: 100vw!important; width: 100%; } article .alignleft { float: left; margin-right: 15px; } article .alignright { float: right; margin-left: 15px; } #center-copy section article .align-left, #center-copy section article .alignleft, article .align-left { float: left; margin-right: 15px; margin-bottom: 20px; } #center-copy section article .align-right, #center-copy section article .alignright, article .align-right { float: right; margin-left: 15px; margin-bottom: 20px; } #center-copy section article input[type=submit].cta { border: none; padding-top: 8px; } article .wp-block-button { margin-bottom: var(--standard-font-size); } article figure figcaption { } article .hover-primary-background-color a:hover, article .has-primary-background-color { background: var(--primary-color); } article .hover-primary-color a:hover, article .has-primary-color { color: var(--primary-color); } article .hover-secondary-background-color a:hover, article .has-secondary-background-color { background: var(--secondary-color); } article .hover-secondary-color:hover, article .has-secondary-color { color: var(--secondary-color); } article .hover-tertiary-background-color a:hover, article .has-tertiary-background-color { background: var(--tertiary-color); } article .hover-tertiary-color a:hover, article .has-tertiary-color { color: var(--tertiary-color); } article .hover-quaternary-background-color a:hover, article .has-quaternary-background-color { background: var(--quaternary-color); } article .hover-quaternary-color a:hover, article .has-quaternary-color { color: var(--quaternary-color); } .primaryfill { fill: var(--primary-color); } .secondaryfill { fill: var(--secondary-color); } .whitefill { fill: #FFF; } .cta, article .cta, article .wp-block-button .wp-block-button__link { font-size: 18px; font-family: var(--primary-font); max-width: 200px; height: 40px; display: -ms-inline-flexbox; display: -webkit-inline-flex; display: inline-flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: #FFF; background: var(--primary-color); } .cta:hover, article .cta:hover, article .wp-block-button .wp-block-button__link:hover { background: var(--secondary-color); opacity: 1; } h3 a.cta { max-width: 275px; color: } h3 a.cta:hover { color: var(--primary-color); } article ul { list-style-type: none; padding-left: 0px; } article ul li { padding-left: 15px; position: relative; } article ul li:before { content: "•"; position: absolute; top: 1px; left: 0px; color: var(--tertiary-color); } article ul ul li:before { content: ' '; width: 8px; height: 8px; border: 1px solid var(--tertiary-color); border-radius: 50%; display: inline-block; top: 8px; } /* Header Settings */ .admin-bar #page-head { top: 32px; } #page-head { background: #FFF; height: var(--header-height); position: fixed; left: 0px; top: 0px; z-index: 3; width: 100%; } #page-head hgroup { width: 100%; max-width: 100%; height: 100%; padding-left: 30px; padding-right: 30px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #page-head hgroup:after { display: none; } #page-head hgroup .logo { width: 215px; height: 35px; order: 1; -webkit-order: 1; margin-top: 6px; } #page-head hgroup .logo svg .logost0 { fill: var(--primary-color); } #page-head hgroup .logo svg .logost1 { fill: var(--tertiary-color); } #page-head hgroup #nav { margin-top: 1px; order: 2; -webkit-order: 2; max-width: 660px; width: calc( 100% - 205px - 235px ); margin-left: 10px; margin-right: 10px; } #page-head hgroup #nav #main { width: 100%; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #page-head hgroup #nav #main a { color: var(--primary-color); text-decoration: none; margin: 0px; font-family: var(--primary-font); font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.15ex; transition: all .25s; } #page-head hgroup #nav #main > li > ul { background-color: var(--tertiary-color); margin-top: -5px; white-space: nowrap; overflow-x: visible; width: auto; min-width: 100%; transition: all .25s; border-top: 0px solid #99d1d8; left: 50%; transform: translateX(-50%) } #page-head hgroup #nav #main > li > a { padding-left: 15px; padding-right: 15px; padding-top: 20px; padding-bottom: 20px; white-space: nowrap; } #page-head hgroup #nav #main > li:hover > ul, #page-head hgroup #nav #main > li > ul.expand { padding-top: 11px; padding-bottom: 11px; border-top: 20px solid #99d1d8; } #page-head hgroup #nav #main > li > ul li { white-space: nowrap; overflow-x: visible; } #page-head hgroup #nav #main > li > ul li a { padding: 11px 20px; color: #FFF; white-space: nowrap; overflow-x: visible; text-align: center; width: 100%; font-size: 12px; font-weight: 500; text-transform: none; } #page-head hgroup #nav #main > li > ul li.current-menu-item a, #page-head hgroup #nav #main > li > ul li a:hover{ color: var(--secondary-color); } #page-head hgroup #nav #main > li:hover > ul { transition-delay: 0.25s; transition: all .5s; max-height: 100vh; } #page-head hgroup #nav #main .current-menu-item > a, #page-head hgroup #nav #main .active > a, #page-head hgroup #nav #main li:hover > a, #page-head hgroup #nav #main a:hover { color: var(--tertiary-color); opacity: 1; } /* This is the Hover/Active state for the menu item */ #page-head hgroup .translate-search { order: 3; -webkit-order: 3; width: 145px; position: relative; } #page-head hgroup #nav #main > li.action a { background: var(--secondary-color); } #page-head hgroup #nav #main > li.action a:hover{ background: var(--primary-color); color: #FFF; } #page-head hgroup .translate-search select { width: 96px; height: 45px; background: none; border: 2px solid var(--secondary-color); border-radius: 0px; padding-right: 22px; font-size: 12px; font-family: var(--secondary-font); color: #333; margin: 0px; padding-left: 18px; letter-spacing: 0.18ex; -moz-appearance: none; appearance: none; } #page-head hgroup .translate-search select::-ms-expand { display: none; } #page-head hgroup .translate-search select option.mobile { display: none; } #page-head hgroup .translate-search:after { position: absolute; top: 10px; right: 25px; content: ">"; transform: rotate(90deg); color: var(--gray-color); z-index: -1; } #page-head hgroup .translate-search a.search { font-family: 'Font Awesome 5 Free'; color: var(--primary-color); font-weight: bold; text-decoration: none; font-size: 21px; padding-right: 12px; position: relative; top: 5px; } #page-head hgroup .translate-search a.search:after { content: "" } #page-head hgroup .translate-search a.search:hover { color: var(--secondary-color); } #page-head hgroup .translate-search form#searchform { position: absolute; bottom: -15px; right: 100%; width: 0px; padding: 0px; overflow: hidden; transition: all .5s; } #page-head hgroup .translate-search form#searchform input { border: none; border-bottom: 2px solid var(--primary-color); padding-left: 0px; font-size: 12px; font-family: var(--secondary-font); color: var(--gray-color); height: 45px; background: #FFF; } #page-head hgroup .translate-search form#searchform.active { width: 150px; } .hide { display: none; } /* Alerts Bar */ #alertbar { background: var(--secondary-color); margin-bottom: 20px; position: relative; overflow: hidden; top: var(--header-height); } #alertbar section { padding: 0px 56px; } #alertbar section .alert { width: 77.38%; float: left; } #alertbar section .alert div { float: left; width: auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 52px; color: var(--primary-color); font-size: 16px; font-family: var(--secondary-font) } #alertbar section svg { width: 25px; height: 25px; margin-right: 10px; } #alertbar section strong { font-weight: 500; font-family: var(--primary-font) } #alertbar section p { height: 20px; overflow: hidden; } #alertbar section p:after { content: "..."; display: none; } #alertbar section a.cta { float: right; color: var(--primary-color);; background: none; border: 1px solid var(--primary-color); font-size: 14px; text-transform: none; font-weight: 500; margin-top: 9px; padding: 5px 18px; height: 35px; position: relative; z-index: 1; } #alertbar section a.cta:hover { background: var(--primary-color); color: #FFF; } #alertbar:after { background: repeating-linear-gradient( 110.6deg, var(--secondary-color), var(--secondary-color) 15px, #fdc828 15px, #fdc828 30px ); background-position: 0px 0px; position: absolute; right: 0px; top: 0px; width: calc( 50vw - var(--grid-half-width) + ( var(--grid-half-width) * .3316 ) + 60px ); content: ""; height: 100%; } #alertbar:before { background: var(--secondary-color); position: absolute; content: ""; width: 55px; height: 120%; top: -12px; right: calc( 50vw - var(--grid-half-width) + ( var(--grid-half-width) * .3316 ) + 35px ); z-index: 1; transform: rotate(20deg); display: inline-block; } /* Homepage Settings */ main { } .home-top { overflow: hidden; } .box-slideshow { width: 77.38%; max-height: 733px; overflow: hidden; } .box-slideshow figure.bg { width: 66.84%; float: left; height: 646px; overflow: hidden; } .box-slideshow figcaption { width: 33.16%; float: left; background: var(--primary-color); color: #FFF; height: 646px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } .box-slideshow figcaption h2 { background: var(--quaternary-color); width: 100%; padding: 34px 25px 28px 0px; text-align: right; font-size: 26px; font-weight: 500; position: relative; top: -70px; margin-bottom: -70px; letter-spacing: 0.04ex; transition: all .25s; color: var(--primary-color); } .box-slideshow figcaption h2:hover { font-size: 30px; padding: 31px 0px 25px 0px; } .box-slideshow figcaption h2:before { position: absolute; top: 0px; right: 100%; background: var(--quaternary-color); opacity: .75; height: 100%; width: 22px; content: ""; } .box-slideshow figcaption p { max-width: 235px; text-align: right; font-family: var(--secondary-font); padding: 20px 35px 0px 0px; width: 100%; display: block; font-size: 14px; line-height: 1.75; letter-spacing: 0.07ex; } .box-slideshow .bx-pager { right: 51px; bottom: 50px; text-align: right; } .box-slideshow .bx-pager a.bx-pager-link { width: 7px; height: 7px; border: 1px solid var(--secondary-color); background: rgba(0,0,0,.0); margin-left: 9px } .box-slideshow .bx-pager a.bx-pager-link.active { background: var(--secondary-color); } .box-slideshow #trip-planner { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-top: 21px; } .box-slideshow #trip-planner legend { font-weight: bold; font-size: 15.31px; color: var(--primary-color); line-height: 1; position: relative; top: 0px; padding-left: 45px; letter-spacing: 0.05ex; white-space: nowrap; } .box-slideshow #trip-planner input[type=text] { max-width: 260px; width: 100%; min-width: 100px; height: 42px; border: 2px solid var(--quaternary-color); color: var(--primary-color); font-size: 12px; font-family: var(--secondary-font); margin: 0px 10px; } .box-slideshow #trip-planner input[type=text]::-webkit-input-placeholder { color: var(--gray-color); font-style: italic; } .box-slideshow #trip-planner input[type=text]:-moz-placeholder { color: var(--gray-color); font-style: italic; } .box-slideshow #trip-planner input[type=text]::-moz-placeholder { color: var(--gray-color); font-style: italic; } .box-slideshow #trip-planner input[type=text]:-ms-input-placeholder { color: var(--gray-color); font-style: italic; } .box-slideshow #trip-planner input[type=text]:focus::-webkit-input-placeholder { color:transparent; } .box-slideshow #trip-planner input[type=text]:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */ .box-slideshow #trip-planner input[type=text]:focus::-moz-placeholder { color:transparent; } /* FF 19+ */ .box-slideshow #trip-planner input[type=text]:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */ .box-slideshow #trip-planner button, .box-slideshow #trip-planner input[type=submit] { border: none; font-family: var(--primary-font); font-weight: bold; height: 42px; font-size: 14px; text-transform: none; letter-spacing: 0.09ex; background: var(--secondary-color); cursor: pointer; padding: 0px; width: 93px; min-width: 93px; } .box-slideshow #trip-planner button:hover, .box-slideshow #trip-planner input[type=submit]:hover { background: var(--primary-color); } .box-slideshow #trip-planner input[type=text]:focus { border-color: var(--primary-color); } #trip-planner { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-top: 21px; } #trip-planner legend { font-weight: bold; font-size: 15.31px; color: var(--primary-color); line-height: 1; position: relative; top: 0px; padding-left: 45px; letter-spacing: 0.05ex; white-space: nowrap; } #trip-planner input[type=text] { max-width: 260px; width: 100%; min-width: 100px; height: 42px; border: 2px solid var(--quaternary-color); color: var(--primary-color); font-size: 12px; font-family: var(--secondary-font); margin: 0px 10px; } #trip-planner input[type=text]::-webkit-input-placeholder { color: var(--gray-color); font-style: italic; } #trip-planner input[type=text]:-moz-placeholder { color: var(--gray-color); font-style: italic; } #trip-planner input[type=text]::-moz-placeholder { color: var(--gray-color); font-style: italic; } #trip-planner input[type=text]:-ms-input-placeholder { color: var(--gray-color); font-style: italic; } #trip-planner input[type=text]:focus::-webkit-input-placeholder { color:transparent; } #trip-planner input[type=text]:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */ #trip-planner input[type=text]:focus::-moz-placeholder { color:transparent; } /* FF 19+ */ #trip-planner input[type=text]:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */ #trip-planner button, #trip-planner input[type=submit] { border: none; font-family: var(--primary-font); font-weight: bold; height: 42px; font-size: 14px; text-transform: none; letter-spacing: 0.09ex; background: var(--secondary-color); cursor: pointer; padding: 0px; width: 93px; min-width: 93px; color: var(--primary-color); } #trip-planner button:hover, #trip-planner input[type=submit]:hover { background: var(--primary-color); color: #FFF; } #trip-planner input[type=text]:focus { border-color: var(--primary-color); } .box-sidebar { width: 22.61%; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .box-sidebar .button { height: calc( 100% / 3 - 22px ); width: 100%; max-height: 215px; } .box-sidebar .button .button-inner { width: 100%; height: 100%; position: relative; border: 2px solid var(--quaternary-color); display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .box-sidebar .button .button-inner a { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } .box-sidebar .button .button-inner figure { width: 100%; height: 95px; text-align: center; } .box-sidebar .button .button-inner figure svg { max-width: 100%; height: 85px; margin: 0px auto 10px; } .box-sidebar .button .button-inner figcaption { font-weight: 500; color: rgba(0,0,0,.9); font-size: 14px; } .box-sidebar .button .button-inner figcaption:first-letter { text-transform: uppercase; } .box-sidebar .button .button-inner:hover { background: var(--primary-color); } .box-sidebar .button .button-inner:hover figure svg .secondaryfill { fill: var(--primary-color)!important; } .box-sidebar .button .button-inner:hover figure svg .secondaryfill.toprimary, .box-sidebar .button .button-inner:hover figure svg .primaryfill { fill: #FFF!important; } .box-sidebar .button .button-inner:hover figcaption { color: #FFF; } .home-bottom { margin-top: 9px; } .home-bottom .box-bottom-slider { width: 54.78%; height: 270px; overflow: hidden; } .home-bottom .box-bottom-slider .bxslider { height: 247px; } .home-bottom .box-bottom-slider li { height: 247px; position: relative; } .home-bottom .box-bottom-slider li div.slider-container { width: 100%; height: 100%; position: relative; } .home-bottom .box-bottom-slider li div.slider-container > a { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: block; z-index: 2; } .home-bottom .box-bottom-slider li.new div.slider-container { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; } .home-bottom .box-bottom-slider li.new figure.bg { position: relative; order: 2; -webkit-order: 2; width: 54%; overflow: hidden; } .home-bottom .box-bottom-slider li.new figcaption { position: static; order: 1; -webkit-order: 1; width: 46%; } .home-bottom .box-bottom-slider li.new figcaption * { color: inherit; } .home-bottom .box-bottom-slider li.new figcaption figure.icon { width: 55px; height: 55px; border-radius: 50%; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin: 20px 0px 19px 17px; background: #FFF; } .home-bottom .box-bottom-slider li.new figcaption figure.icon img { max-width: 100%; } .home-bottom .box-bottom-slider li.new figcaption article { margin-left: 70px; max-width: 195px; } /* TEST */ .home-bottom .box-bottom-slider li.new figcaption article h2 { font-size: 24px; font-weight: 600; margin-bottom: 0px; } .home-bottom .box-bottom-slider li.new figcaption h4, .home-bottom .box-bottom-slider li.new figcaption p { font-size: 15px; margin-top: 0px; padding-top: 0px; font-family: var(--primary-font); } .home-bottom .box-bottom-slider li.new figure.bg .shade { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 1; opacity: 0; transition: all .25s; } .home-bottom .box-bottom-slider li.new:hover figure.bg .shade { opacity: .4; } .home-bottom .box-bottom-slider figure.bg { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } .home-bottom .box-bottom-slider figure.bg a { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } .home-bottom .box-bottom-slider figcaption { position: absolute; bottom: 45px; left: 25px; width: 245px; } .home-bottom .box-bottom-slider figcaption h3 { font-weight: 600; color: var(--primary-color); font-size: 24.28px; line-height: 1.123; margin-bottom: 16px; letter-spacing: 0.06ex; } .home-bottom .box-bottom-slider figcaption h2 { font-weight: 600; color: var(--primary-color); font-size: 18px; line-height: 1.123; margin-bottom: 16px; letter-spacing: 0.06ex; } .home-bottom .box-bottom-slider figcaption h2 a { color: var(--primary-color); text-decoration: none; } .home-bottom .box-bottom-slider figcaption h4, .home-bottom .box-bottom-slider figcaption p { font-family: var(--secondary-font); font-size: 14.87px; color: var(--primary-color); padding-top: 10px; letter-spacing: 0.06ex; } .home-bottom .box-bottom-slider figcaption p a { color: var(--primary-color); text-decoration: none; } .home-bottom .box-bottom-slider figcaption p a:hover { color: var(--secondary-color); } .home-bottom .box-bottom-slider figcaption .align-left { margin-right: 5px; } .home-bottom .box-bottom-slider .bx-pager { left: 45px; bottom: 30px; text-align: left; } .home-bottom .box-bottom-slider .bx-pager a.bx-pager-link { width: 7px; height: 7px; border: 1px solid var(--secondary-color); background: transparent; } .home-bottom .box-bottom-slider .bx-pager a.bx-pager-link.active { background: var(--secondary-color); } .home-bottom .bottom_button_container { width: 45.22%; height: 270px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: space-between; -ms-flex-line-pack: justify; align-content: space-between; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .home-bottom .bottom_button_container .box-bottombutton:nth-child(2), .home-bottom .bottom_button_container .box-bottombutton:nth-child(3) { height: 135px; } .home-bottom .bottom_button_container .box-bottombutton:nth-child(2) .button-inner, .home-bottom .bottom_button_container .box-bottombutton:nth-child(3) .button-inner { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .home-bottom .bottom_button_container .box-bottombutton:nth-child(2) .button-inner figure, .home-bottom .bottom_button_container .box-bottombutton:nth-child(3) .button-inner figure { width: 65px; } .home-bottom .bottom_button_container .box-bottombutton:nth-child(2) .button-inner figcaption, .home-bottom .bottom_button_container .box-bottombutton:nth-child(3) .button-inner figcaption { text-align: left; margin: 0px; } .home-bottom .box-bottombutton { width: 50%; height: 270px; } .home-bottom .box-bottombutton .button-inner { width: 100%; height: 100%; position: relative; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .home-bottom .box-bottombutton .button-inner .hover-bg { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: -1; opacity: 0; transition: all .25s; } .home-bottom .box-bottombutton .button-inner a { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 0; } .home-bottom .box-bottombutton .button-inner figure { width: 100%; height: 65px; text-align: center; margin-bottom: 15px; } .home-bottom .box-bottombutton .button-inner figure svg { height: 65px; max-width: 100%; margin: auto; } .home-bottom .box-bottombutton .button-inner figcaption { color: #FFF; font-size: 15.58px; font-weight: 500; max-width: 110px; margin: 0px auto; text-align: center; width: 100%; letter-spacing: 0.07ex; } .home-bottom .box-bottombutton .button-inner figcaption:first-letter { text-transform: uppercase; } .home-bottom .box-bottombutton .button-inner:hover { background: transparent; } .home-bottom .box-bottombutton .button-inner:hover .hover-bg { opacity: 1; } /* Page Header2 Template */ #header-image .page-title.page-title2 { width: 333px; } #header-image .page-title.page-title2:after { position: absolute; top: 0px; left: 100%; width: 81px; height: 100%; background: #008C99; content: ""; z-index: 2; opacity: 1; } #header-image .page-title.page-title2-colors { margin-left: 144px; width: 40px; background-color: #95A9D6; } #header-image .page-title2-colors:before { position: absolute; top: 0px; left: -63px; width: 63px; height: 100%; background: #87C5CD; content: ""; z-index: 2; opacity: 1; } #header-image .page-title.page-title2-colors:after { position: absolute; top: 0px; left: 100%; width: 26px; height: 100%; background: #C8C7DF; content: ""; z-index: 2; opacity: 1; } #header-image figure.header2 { width: calc( 100% - 517px ); height: 180px; float: left; } /* Page Template */ main { min-height: calc( 100vh - var(--footer-height) ); height: auto; padding-bottom: 42px; padding-top: 30px; } main:before { width:100%; content: ""; display: block; height: var(--header-height) } .home main section { padding-left: 56px; padding-right: 56px; } .admin-bar main { min-height: calc( 100vh - var(--footer-height) - 32px ); } #header-image { height: 180px; margin-bottom: 35px; background: transparent; } #header-image section { padding-left: 63px; padding-right: 63px; } #header-image .page-title { width: 418px; background: var(--primary-color); position: relative; height: 180px; float: left; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #header-image .page-title.teal { background: var(--tertiary-color); } #header-image .page-title:after { position: absolute; top: 0px; left: 100%; width: 40px; height: 100%; background: var(--primary-color); content: ""; z-index: 2; opacity: .75; } #header-image .page-title.teal:after { background: var(--tertiary-color); } #header-image .page-title h1 { color: #FFF; font-size: 27px; letter-spacing: .06ex; font-weight: 400; line-height: 1.15; margin-top: 2px; } #header-image .page-title.all h1, #header-image .page-title h1 strong { color: #FFF; display: block; letter-spacing: 0ex; font-size: 40px; font-weight: 600; } #header-image figure { width: calc( 100% - 418px ); height: 180px; float: left; } #header-image .page-title.all.half { width: 50%; } #header-image.teal .page-title { width: 50%; background: var(--tertiary-color); } #header-image.teal .page-title:after { background: var(--tertiary-color); } #header-image .page-title.all.half + figure, #header-image.teal figure { width: 50%; } .blog #header-image.teal .page-title { width: 100%; max-width: 350px; } .blog #header-image.teal figure { width: 100%; max-width: calc( 100% - 350px ); } #subscribe-modal { display: none; } #subscribe-modal input[type=text], #subscribe-modal input[type=email] { width: 100%; height: 80px; border: 1px solid #92cbd7; font-size: 18px; padding-left: 36px; margin-bottom: 25px; background: none; border-radius: 0px; font-family: var(--secondary-font); color: #414042; } #subscribe-modal input[type=checkbox] { display: none; } #subscribe-modal input::-webkit-input-placeholder { color: #414042; } #subscribe-modal input:-moz-placeholder { color: #414042; } #subscribe-modal input::-moz-placeholder { color: #414042; } #subscribe-modal input:-ms-input-placeholder { color: #414042; } #subscribe-modal input[type=submit] { width: 165px; height: 85px; background: var(--primary-color); color: #FFF; border: none; font-family: var(--primary-font); font-size: 18px; font-weight: 500; cursor: pointer; } #subscribe-modal input[type=submit]:hover { background: var(--secondary-color); } #new-subscribe-modal { display: none; } #new-subscribe-modal input[type=text], #new-subscribe-modal input[type=email] { width: 100%; height: 80px; border: 1px solid #92cbd7; font-size: 18px; padding-left: 36px; margin-bottom: 25px; background: none; border-radius: 0px; font-family: var(--secondary-font); color: #414042; } #new-subscribe-modal input[type=checkbox] { display: none; } #new-subscribe-modal input::-webkit-input-placeholder { color: #414042; } #new-subscribe-modal input:-moz-placeholder { color: #414042; } #new-subscribe-modal input::-moz-placeholder { color: #414042; } #new-subscribe-modal input:-ms-input-placeholder { color: #414042; } #snew-ubscribe-modal input[type=submit] { width: 165px; height: 85px; background: var(--primary-color); color: #FFF; border: none; font-family: var(--primary-font); font-size: 18px; font-weight: 500; cursor: pointer; } #new-subscribe-modal input[type=submit]:hover { background: var(--secondary-color); } .instructions { position: relative; max-width: 335px; height: 195px; border: 2px solid #d8f0f4; margin: 95px; } .instructions div { max-width: 250px; margin: 55px auto; font-weight: 600; color: #414042; text-align: center; } .instructions:before { position: absolute; bottom: 100%; right: 100%; content: url(../images/arrowover.svg); width: 50px; height: 50px; } /* Teal header */ #header-teal { padding: 14px 63px; margin-bottom: 40px; } body:is(.page-template-careers) #header-teal { margin-bottom: 20px; } #header-teal section { height: 118px; background: var(--tertiary-color); color: #FFF; position: relative; } #header-teal section h1 { color: #FFF; display: block; letter-spacing: 0ex; font-size: 40px; font-weight: 600; padding-left: 53px; } #header-teal section:after { content: ""; position: absolute; top: 0px; right: 0px; width: 28px; height: 100%; background: #FFF; opacity: .4 } #header-teal-short { padding: 14px 63px; margin-bottom: 100px; } #header-teal-short section .teal { height: 140px; background: var(--tertiary-color); color: #FFF; position: relative; width: calc( 100% - 190px ); float: left; } #header-teal-short section h1 { color: #FFF; display: block; letter-spacing: 0ex; font-size: 40px; font-weight: 600; padding-left: 53px; } #header-teal-short section .teal:after { content: ""; position: absolute; top: 0px; right: 0px; width: 28px; height: 100%; background: #FFF; opacity: .4 } #header-teal-short section .buttonbox { width: 150px; float: right; display: inline-block; text-align: center; color: #FFF; background: var(--primary-color); } #header-teal-short section .buttonbox .buttonbox-inner { position: relative; width: 100%; padding-bottom: 92%; } #header-teal-short section .buttonbox .buttonbox-inner > div { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-size: 15px; font-weight: 500; font-family: var(--primary-font); padding-left: 20px; padding-right: 20px; } #header-teal-short section .buttonbox .buttonbox-inner > div svg { width: 40px; margin-bottom: 10px; margin-top: 10px; } #header-teal-short section .buttonbox .buttonbox-inner > div svg * { fill: #FFF; } #header-teal-short section .buttonbox:hover { background: var(--tertiary-color); } /* Center Copy */ #center-copy section { max-width: 1150px; padding: 90px 25px; } #center-copy section article h1 { font-size: 27px; font-weight: 600; color: var(--primary-color); margin-bottom: 0px; } #center-copy section article h1:after { content: ""; width: 55px; height: 12px; display: block; margin: 20px auto; background: var(--secondary-color); } #center-copy section article h2 { font-size: 22px; font-weight: 600; } #center-copy section article p strong { font-family: var(--primary-font); font-weight: 500; } #center-copy section article p a { color: var(--font-color); } #center-copy section article p a:hover { color: var(--primary-color); } #center-copy section article hr { border: none; border-top: 1px solid var(--tertiary-color); margin: 50px auto; width: 100%; max-width: 100%; } #center-copy section article * { max-width: 900px; margin-left: auto; margin-right: auto; } #center-copy section article li { margin-bottom: 15px; } #center-copy section article ol { counter-reset: numberz; list-style-type: none; } #center-copy section article ol li { margin-bottom: 0px; } #center-copy section article ol li:before { counter-increment: numberz; content: counter(numberz)". "; font-family: var(--primary-font); font-weight: 500; } #center-copy section article a.cta { font-family: var(--primary-font); font-weight: 500; width: 100%; max-width: 225px; height: 75px; background: none; border: 2px solid var(--tertiary-color); font-size: 15px; } #center-copy section article a.cta:hover { color: #FFF; background: var(--tertiary-color); } /* Blue Side Box */ #blue-side-box section { max-width: 1250px; padding: 60px 25px; } #blue-side-box section .equal-heights { border: 1px solid var(--tertiary-color); } #blue-side-box section .blue-box { position: relative; background: var(--primary-color); color: #FFF; width: 100%; max-width: 395px; } #blue-side-box section .blue-box article { padding: 65px 40px; color: #FFF; } #blue-side-box section .blue-box article * { color: #FFF; } #blue-side-box section .blue-box article h2 { font-size: 27px; font-weight: 500; } #blue-side-box section .blue-box article h2:after{ content: ""; width: 55px; height: 12px; display: block; margin: 20px 0px; background: var(--secondary-color); } #blue-side-box section .blue-box:after { position: absolute; top: 0px; left: 100%; width: 20px; height: 100%; background: var(--primary-color); opacity: .4; } #blue-side-box section .copy-box { max-width: calc( 100% - 395px ); } #blue-side-box section .copy-box article { max-width: 680px; padding: 15px 10px; } #blue-side-box section .copy-box article p a { color: var(--font-color); } #blue-side-box section .copy-box article p a:hover { color: var(--primary-color); } /* Facts Sheet */ #facts-sheets section { max-width: 1112px; padding: 0px 15px; margin-bottom: 75px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } #facts-sheets section .list { width: 300px; text-align: center; align-self: auto; } #facts-sheets section .list h2 { font-family: var(--primary-font); color: var(--primary-color); font-size: 20px; font-weight: 500; position: relative; margin-bottom: 100px; padding-bottom: 45px; } #facts-sheets section .list h2:after { bottom: 0px; left: 50%; content: ""; position: absolute; transform: translateX(-50%); width: 50px; height: 12px; background: var(--secondary-color); } #facts-sheets section .list a { max-width: 225px; width: 100%; margin: auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: 35px; height: 75px; border: 1px solid var(--primary-color); color: var(--primary-color); padding: 0px 15px; font-family: var(--primary-font); font-size: 15px; font-weight: 500; text-decoration: none; } #facts-sheets section .list a:hover { background: var(--tertiary-color); color: #FFF; } /* Alerts Header */ #header-yellow { padding: 0px 63px;} #header-yellow section { background: var(--secondary-color); height: 114px; display: flex; color: #FFF; position: relative; overflow: hidden; } #header-yellow section:after { background: repeating-linear-gradient( 110.6deg, var(--secondary-color), var(--secondary-color) 26px, #fdc828 26px, #fdc828 52px ); background-position: 0px 0px; position: absolute; right: 0px; top: 0px; content: ""; width: calc( 100% - 372px ); height: 100%; } #header-yellow section:before { background: var(--secondary-color); position: absolute; content: ""; width: 55px; height: 110%; top: -12px; right: calc( 100% - 412px ); z-index: 1; transform: rotate(20deg); display: inline-block; } #header-yellow section h1 { color: var(--primary-color);; font-size: 40px; font-weight: 500; padding-left: 53px; position: relative; z-index: 1; } /* Alerts Page */ #alert-intro section { max-width: 1172px; padding-top: 53px; padding-bottom: 74px; } #alert-intro section article { padding-left: 20px; max-width: 365px; float: left; } #alert-intro section article h2 { text-transform: none; letter-spacing: 0.1ex; margin-bottom: 8px; } #alert-intro section .socialside { float: right; font-family: var(--secondary-font); color: var(--primary-color); padding-top: 18px; letter-spacing: 0.04ex; } #alert-intro section .socialside a { text-decoration: none; color: var(--primary-color); font-weight: 500; font-family: var(--primary-font); letter-spacing: 0.1ex; position: relative; right: -5px; } #alert-intro section .socialside a:before { font-family: var(--font-awesome); content: "\f099"; color: var(--tertiary-color); font-size: 40px; position: relative; top: 10px; margin-left: 10px; margin-right: 10px; } #alert-intro section .socialside a:hover { color: var(--secondary-color); } #alert-intro section .socialside a:hover:before { color: var(--primary-color); } #alert-intro hr { width: 100%; max-width: 1244px; margin: auto; border: none; border-top: 1px solid var(--quaternary-color); clear: both; } a.tweeetbird { text-decoration: none; color: var(--primary-color)!important; font-weight: 500; font-family: var(--primary-font); letter-spacing: 0.1ex; position: relative; right: -5px; } a.tweeetbird:before { font-family: var(--font-awesome); content: "\f099"; color: var(--tertiary-color); font-size: 40px; position: relative; top: 10px; margin-left: 10px; margin-right: 10px; } /* Alerts Tabs */ #alerts-tabs section { max-width: 1172px; } #alerts-tabs section .tabs { margin-bottom: 65px; } #alerts-tabs .tabber-button { display: none; } #alerts-tabs section .tabs > ul { list-style-type: none; padding: 0px; display: block; border-bottom: 17px solid var(--primary-color); border-left: 1px solid var(--primary-color); border-right: 1px solid var(--primary-color); } #alerts-tabs section .tabs > ul:after { clear: both; display: block; content: ""; } #alerts-tabs section .tabs > ul li { float: left; width: calc( 20% - 10px ); } #alerts-tabs section .tabs > ul li a { border: 1px solid var(--primary-color); display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 74px; text-decoration: none; color: var(--primary-color); text-transform: uppercase; font-size: 19px; letter-spacing: 0.2ex; border-bottom: 0px; } #alerts-tabs section .tabs > ul li a:hover { font-weight: 600; } #alerts-tabs section .tabs > ul li.ui-state-active a{ color: #FFF; font-weight: 600; background: var(--primary-color); } #alerts-tabs section .tabs > ul li:nth-child(5) { float: right; } #alerts-tabs section .tabs .tab-outer { border: 1px solid var(--primary-color); padding: 64px 15px 40px; } #alerts-tabs section .tabs .tab-outer .tab-inner { max-width: 1060px; margin: auto; color: #414042; } #alerts-tabs section .tabs .tab-outer .tab-inner:after { content: ""; clear: both; display: block; } #alerts-tabs section .tabs .tab-outer .tab-inner h3.no-alert { color: var(--primary-color); font-weight: 500; padding-left: 20px; font-size: 18px; letter-spacing: 0.01ex; } #alerts-tabs section .tabs .tab-outer .tab-inner h3.no-alert + hr { border: none; border-top: 1px solid var(--tertiary-color); margin: 36px auto 27px; } #alerts-tabs section .tabs .tab-outer .tab-inner .teal-box { background: var(--tertiary-color); color: #FFF; width: 310px; margin-right: 40px; text-align: center; padding: 40px 15px 30px;; font-size: 15px; font-family: var(--secondary-font); line-height: 1.4; display: inline-block; } #alerts-tabs section .tabs .tab-outer .tab-inner .teal-box a.cta { margin-top: 28px; border: 1px solid #FFF; text-transform: none; margin-left: auto; margin-right: auto; width: 130px; background: none; height: 45px; font-family: var(--primary-font); font-size: 13px; margin-bottom: 0px; } #alerts-tabs section .tabs .tab-outer .tab-inner .teal-box a.cta:hover { background: var(--primary-color); } #alerts-tabs section .tabs .tab-outer .tab-inner details { width: 100%; max-width: calc( 100% - 435px ); display: inline-block;} #alerts-tabs section .tabs .tab-outer .tab-inner details summary { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 75px; background: var(--tertiary-color); color: #FFF; padding-left: 30px; padding-right: 20px; font-size: 18px; font-weight: 500; background: var(--primary-color); margin-top: 60px; position: relative; } #alerts-tabs section .tabs .tab-outer .tab-inner details summary strong { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); display: block; font-weight: 500; width: 100%; } #alerts-tabs section .tabs .tab-outer .tab-inner summary::-webkit-details-marker { display: none } #alerts-tabs section .tabs .tab-outer .tab-inner summary:before { content: "+"; color: var(--secondary-color); font-size: 30px; font-weight: 500; margin-left: 10px; position: absolute; top: 50%; right: 20px; transform: translateY(-50%)!important; } #alerts-tabs section .tabs .tab-outer .tab-inner details[open] summary:before { content: "-" } #alerts-tabs section .tabs .tab-outer .tab-inner details article { padding: 30px 0px 30px 30px; } #alerts-tabs section .tabs .tab-outer .tab-inner details article ul { list-style-type: none; padding-left: 0px; max-width: 300px; margin-top: 34px; margin-bottom: 45px; } #alerts-tabs section .tabs .tab-outer .tab-inner details article ul li { color: var(--tertiary-color); font-weight: 500; font-size: 16px; font-family: var(--primary-font); line-height: 2; } #alerts-tabs section .tabs .tab-outer .tab-inner details article h2 { text-transform: none; margin-bottom: 22px; } #alerts-tabs section .tabs .tab-outer .tab-inner .alert { border-bottom: 1px solid var(--tertiary-color); padding: 0px 37px 30px 45px; margin-top: -9px; margin-bottom: 34px; } #alerts-tabs section .tabs .tab-outer .tab-inner .alert:last-child { border-bottom: none; } #alerts-tabs section .tabs .tab-outer .tab-inner .alert input { display: none; } #alerts-tabs section .tabs .tab-outer .tab-inner .alert label { cursor: pointer; } #alerts-tabs section .tabs .tab-outer .tab-inner .alert label.button { float: right; color: #FFF; background: var(--tertiary-color); display: block; width: 137px; height: 45px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: center; font-size: 13px; line-height: 1.15; font-weight: 500; letter-spacing: 0.06ex; transition: none; border: 1px solid var(--tertiary-color); } #alerts-tabs section .tabs .tab-outer .tab-inner .alert label.button:hover { background: #FFF; color: var(--tertiary-color); } #alerts-tabs section .tabs .tab-outer .tab-inner .alert time, #alerts-tabs section .tabs .tab-outer .tab-inner .alert h4 { font-weight: 500; letter-spacing: 0.13ex; max-width :calc( 100% - 150px )} #alerts-tabs section .tabs .tab-outer .tab-inner .alert h4:hover label { color: var(--primary-color); } #alerts-tabs section .tabs .tab-outer .tab-inner .alert time { display: block; } #alerts-tabs section .tabs .tab-outer .tab-inner .alert .alert-details { max-height: 0px; overflow: hidden; transition: all .25s; } #alerts-tabs section .tabs .tab-outer .tab-inner .alert .alert-details article { padding-top: 15px; } #alerts-tabs section .tabs .tab-outer .tab-inner .alert .alert-details * { font-family: var(--secondary-font); letter-spacing: 0.07ex; line-height: 1.5; margin-bottom: 25px;} #alerts-tabs section .tabs .tab-outer .tab-inner .alert input:checked ~ .alert-details { max-height: 1000%; } #alerts-tabs section .tabs .tab-outer .tab-inner .alert input:checked ~ h4, #alerts-tabs section .tabs .tab-outer .tab-inner .alert input:checked ~ time { color: var(--primary-color); } #alerts-tabs section .tabs .tab-outer .tab-inner .alert input:checked ~ label.button { font-size: 0px; width: 26px; height: 26px; cursor: pointer;} #alerts-tabs section .tabs .tab-outer .tab-inner .alert input:checked ~ label.button:after { content: "X"; font-size: 16px; } #alerts-tabs section .tabs .tab-outer article.twocol { max-width: 1094px; margin: auto; width: 100%; padding: 0px 15px; column-rule: 1px solid var(--tertiary-color); column-gap: 130px;} #alerts-tabs section .tabs .tab-outer article.twocol h3 { color: var(--tertiary-color); font-weight: 500; font-family: var(--primary-font); letter-spacing: -0.02ex; margin-bottom: 5px; } #alerts-tabs section .tabs .tab-outer article.twocol * { color: var(--font-color); } #alerts-tabs section .tabs .tab-outer article.twocol ul li { font-family: var(--primary-font); font-weight: 500; text-transform: uppercase; font-size: 16px; margin-bottom: 10px; } #alerts-tabs section .tabs .tab-outer article.twocol ul li ul { list-style-type: none; } #alerts-tabs section .tabs .tab-outer article.twocol ul li li { text-transform: none; font-weight: 400; font-family: var(--secondary-font); line-height: 1.6667; padding-left: 20px; position: relative; } #alerts-tabs section .tabs .tab-outer article.twocol ul li li:before { content: "—"; position: absolute; left: 0px; } /* Alerts Bottom */ #alerts-bottom section { max-width: 1068px; } #alerts-bottom section article { padding-left: 24px; max-width: 560px; float: left; } #alerts-bottom section article h2 { font-size: 24px; text-transform: none; margin-bottom: 11px; } #alerts-bottom section article p { letter-spacing: -0.002ex; } #alerts-bottom section .blue-box { background: var(--primary-color); width: 390px; float: right; margin-top: 40px; color: #FFF; padding: 35px 30px 35px 41px; } #alerts-bottom section .blue-box p { font-family: var(--secondary-font); font-size: 15px; width: 170px; float: left; line-height: 1.34 } #alerts-bottom section .blue-box a.cta { background: none; border: 2px solid #FFF; font-size: 12px; text-transform: none; font-weight: 500; float: right; width: 132px; height: 45px; margin-top: 5px; } #alerts-bottom section .blue-box a.cta:hover { color: var(--primary-color); background: #FFF; } /* Fares Intro */ #fares-intro section { max-width: 1270px; padding: 56px 15px 90px; } #fares-intro section article { padding-left: 53px; width: calc( 100% - 380px ); float: left; } #fares-intro section article h2 { text-transform: none; letter-spacing: 0.03ex; margin-bottom: 10px; } #fares-intro section article p { font-size: 18px; margin-bottom: 10px; } #fares-intro section article p + h2 { margin-top: 50px; } #fares-intro ul { padding-left: 57px; margin-bottom: 45px; } #fares-intro ul li { font-size: 18px; margin-bottom: 8px; } #fares-intro aside { width: 380px; float: right; border: 2px solid var(--primary-color); text-align: center; margin-top: 75px; position: relative; } #fares-intro aside img { position: relative; top: -60px; margin-bottom: -60px; } #fares-intro aside .aside-inner { max-width: 310px; margin: auto; padding: 25px; color: var(--primary-color); } #fares-intro aside .aside-inner h2 { font-size: 24px; margin-bottom: 5px; } #fares-intro aside .aside-inner h3 { font-size: 15px; font-weight: 500; margin-bottom: 14px; } #fares-intro aside .aside-inner p { margin-top: 52px; color: var(--font-color); font-size: 15px; font-family: var(--secondary-font); margin-bottom: 30px; } /* Blue Bar */ #blue-bar { background: var(--primary-color); text-align: center; color: #FFF; padding: 49px 0px; } #blue-bar h2 { font-size: 24px; font-weight: 500; font-family: var(--primary-font); } /* Steps */ #steps section { max-width: 1210px; padding: 0px; } #steps section .step { border-bottom: 1px solid var(--tertiary-color); display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } #steps section .step .step-title { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; width: 470px; padding-left: 70px; color: var(--primary-color); font-size: 24px; line-height: 1; } #steps section .step .step-title h2 { color: var(--primary-color); font-family: var(--secondary-font); text-transform: uppercase; font-size: 35px; font-weight: 600; margin-bottom: 0px; font-variant-numeric: proportional-nums; } #steps section .step .step-copy { padding: 75px 7px 75px 0px; width: calc( 100% - 470px ); } #steps section .step .step-copy article { } #steps section .step .step-copy article * { font-size: 18px; font-family: var(--secondary-font); margin-bottom: 10px; } #steps section .step .step-copy article ul { padding-left: 15px; } #steps section .step .step-copy article ul li:before { left: -1px; } #steps section .step .step-copy article a.cta { background: none; color: var(--primary-color); border: 2px solid var(--primary-color); width: 195px; height: 70px; margin: 0px; text-align: center; font-size: 15px; text-transform: none; font-family: var(--primary-font); font-weight: 500; letter-spacing: 0.03ex; margin-left: 37px; } #steps section .step .step-copy article a.cta:hover { background: var(--primary-color); color: #FFF; } #steps section .step .step-copy article a.cta + a.cta { margin-left: 13px; } #steps section .step .step-copy article li a { color: var(--font-color); text-decoration: none; font-weight: 500; font-family: var(--secondary-font); font-size: 16px; margin-left: 5px; } #steps section .step .step-copy article li a:hover { color: var(--primary-color); } #steps section .step .step-copy article li time { color: var(--font-color); text-decoration: none; font-weight: 500; font-family: var(--secondary-font); font-size: 16px; } #steps section .step .step-copy article address { padding-left: 38px; line-height: 1.5; margin-bottom: 18px; display:block; font-size: 15px; margin-top: 18px; font-family: var(--primary-font); } #steps section .step .step-copy article address strong { font-family: var(--primary-font); font-size: 15px; } #steps section .step .step-copy article address a { text-decoration: none; font-weight: 500; color: var(--font-color); font-family: var(--primary-font); font-size: 16px; } #steps section .step .step-copy article address a:hover { color: var(--primary-color); } #steps section .step:last-child { border-bottom: 0px; } /* Schedules */ #schedules-tabs section { max-width: 1172px; max-height: 666px; overflow: hidden; } #schedules-tabs section .tabs { margin-bottom: 65px; } #schedules-tabs .tabber-button { display: none; } #schedules-tabs section .tabs > ul { list-style-type: none; padding: 0px; display: block; border-bottom: 17px solid var(--primary-color); border-left: 1px solid var(--primary-color); } #schedules-tabs section .tabs > ul:before { } #schedules-tabs section .tabs > ul:after { clear: both; display: block; content: ""; } #schedules-tabs section .tabs > ul li { float: left; width: 19%; } #schedules-tabs section .tabs > ul li a { border: 1px solid var(--primary-color); display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 74px; text-decoration: none; color: var(--primary-color); text-transform: uppercase; font-size: 19px; letter-spacing: 0.2ex; border-bottom: 0px; } #schedules-tabs section .tabs > ul li a:hover { font-weight: 500; } #schedules-tabs section .tabs > ul li.ui-state-active a{ color: #FFF; font-weight: 600; background: var(--primary-color); } #schedules-tabs section .tabs > ul li:last-child { float: right; } #schedules-tabs section .tabs > ul em { font-family: var(--secondary-font); font-style: italic; font-size: 12px; font-weight: 500; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 74px; width: 23%; } #schedules-tabs section .tabs > ul em a { color: var(--primary-color); font-weight: 500; text-decoration: none; font-family: var(--primary-font); margin-left: 5px; } #schedules-tabs section .tabs > ul em a:hover { color: var(--secondary-color); } #schedules-tabs section .tabs .schedules { border: 1px solid var(--primary-color); min-height: 575px; } #schedules-tabs section .tabs .schedules:after { clear: both; display: block; content: ""; } #schedules-tabs section .tabs .schedules .sorter { width: 512px; float: left; padding: 60px 50px; min-height: 573px; } #schedules-tabs section .tabs .schedules .sorter input, #schedules-tabs section .tabs .schedules .sorter select { border-radius: 0px; border: 1px solid var(--primary-color); color: var(--primary-color); padding-left: 35px; padding-right: 35px; font-family: var(--primary-font); color: var(--font-color); font-size: 14px; text-transform: uppercase; font-weight: 500; background-color: #FFF; } #schedules-tabs section .tabs .schedules .sorter select[disabled] { opacity: .5; } #schedules-tabs section .tabs .schedules .sorter input { background: url(../images/calendar-date.svg) right no-repeat #FFF; } #schedules-tabs section .tabs .schedules .sorter input::-webkit-input-placeholder { color: var(--font-color); } #schedules-tabs section .tabs .schedules .sorter input:-moz-placeholder { color: var(--font-color); } #schedules-tabs section .tabs .schedules .sorter input::-moz-placeholder { color: var(--font-color); } #schedules-tabs section .tabs .schedules .sorter input:-ms-input-placeholder { color: var(--font-color); } #schedules-tabs section .tabs .schedules .sorter select { background: url(../images/dropdown.svg) right no-repeat #FFF; } #schedules-tabs section .tabs .schedules .sorter button { float: right; background: var(--primary-color); border: 1px solid var(--primary-color); color: #FFF; width: 150px; height: 60px; font-size: 14px; font-family: var(--primary-font); font-weight: 500; cursor: pointer; pointer-events: auto; } #schedules-tabs section .tabs .schedules .sorter button[disabled]{ opacity: .5; pointer-events: none; } #schedules-tabs section .tabs .schedules .sorter button:hover { background: var(--tertiary-color); } #schedules-tabs section .tabs .schedules .results { width: calc( 100% - 512px); float: left; border-left: 2px solid var(--tertiary-color); padding: 20px 30px 0px 50px; } #schedules-tabs section .tabs .schedules .results .route-result { width: 100%; display: none; position: relative; } #schedules-tabs section .tabs .schedules .results .route-result.activeroute { display: block; } #schedules-tabs section .tabs .schedules .results .route-result .route-header { border-bottom: 2px solid var(--tertiary-color); } #schedules-tabs section .tabs .schedules .results .route-result .route-header h4 { color: var(--primary-color); font-size: 14px; text-transform: uppercase; display: inline-block; font-weight: 500; margin-bottom: 15px; } #schedules-tabs section .tabs .schedules .results .route-result .route-header h4:before { content: ""; background: url(../images/pin-3.svg) left no-repeat; width: 35px; height: 35px; display: inline-block; position: relative; top: 12px; width: 25px; } #schedules-tabs section .tabs .schedules .results .route-result .route-header a { font-family: var(--secondary-font); font-style: italic; margin-left: 35px; font-size: 12px; } #schedules-tabs section .tabs .schedules .results .route-result .route-header:after { content: ""; clear: both; display: block; } #schedules-tabs section .tabs .schedules .results .route-result .route-header div { display: inline; float: right; } #schedules-tabs section .tabs .schedules .results .route-result .route-header div button { width: 90px; height: 40px; border: none; background: var(--primary-color); color: #FFF; font-size: 12px; font-family: var(--primary-color); text-transform: uppercase; position: relative; top: 8px; cursor: pointer; } #schedules-tabs section .tabs .schedules .results .route-result .route-header div button:hover { background: var(--tertiary-color); } #schedules-tabs section .tabs .schedules .results .route-result.activeroute .route { position: relative; height: 437px; overflow: hidden; } #schedules-tabs section .tabs .schedules .results .route-result.activeroute .route dl { position: absolute; top: 0px; padding-right: 55px; } #schedules-tabs section .tabs .schedules .results .route-result.activeroute .route dl.pasttrip { margin-left: -100%; } #schedules-tabs section .tabs .schedules .results .route-result.activeroute .route dl.futuretrip { margin-left: 100%; } #schedules-tabs section .tabs .schedules .results .route-result.activeroute .route dl.currentrip { margin-left: 0px; } #schedules-tabs section .tabs .schedules .results .route-result dl { max-height: 437px; overflow-y: scroll; display: none; transition: all .25s; } #schedules-tabs section .tabs .schedules .results .route-result dl::-webkit-scrollbar { width: 5px; height: calc( 100% - 50px ); margin-top: 25px; } #schedules-tabs section .tabs .schedules .results .route-result dl::-webkit-scrollbar-track { background: #e1e1e1; border-radius: 3px; } #schedules-tabs section .tabs .schedules .results .route-result dl::-webkit-scrollbar-thumb { background: #e1e1e1; border-radius: 3px; background: var(--primary-color); } #schedules-tabs section .tabs .schedules .results .route-result dl::-webkit-scrollbar-thumb:hover { } #schedules-tabs section .tabs .schedules .results .route-result dl.activedow.activedir{ display: block; width: 100%; } #schedules-tabs section .tabs .schedules .results .route-result dl dt { padding: 30px 0px 0px 100px; color: var(--primary-color); font-size: 14px; font-weight: 500; position: relative; } #schedules-tabs section .tabs .schedules .results .route-result dl dt:before { position: absolute; top: 0px; left: 0px; width: 100%; height: 200%; opacity: 0; content: ""; background: #d8f0f4; z-index: -1; } #schedules-tabs section .tabs .schedules .results .route-result dl dt.rightnow:before, #schedules-tabs section .tabs .schedules .results .route-result dl dt:hover:before { opacity: 1; } #schedules-tabs section .tabs .schedules .results .route-result dl dt:after { position: absolute; left: 45px; top: 40px; width: 13px; height: 13px; border-radius: 50%; background: var(--tertiary-color); display: block; content: ""; } #schedules-tabs section .tabs .schedules .results .route-result dl dd { padding: 0px 0px 30px 100px; border-bottom: 1px solid var(--tertiary-color); color: var(--font-color); font-size: 14px; font-weight: 500; position: relative; content: ""; display: block; } #schedules-tabs section .tabs .schedules .results .route-result dl dd:last-child { border-bottom: 0px; } #schedules-tabs section .tabs .schedules .results .route-result dl dd:before { position: absolute; bottom: 0px; left: 0px; width: 100%; height: 200%; opacity: 0; content: ""; background: #d8f0f4; z-index: -1; } #schedules-tabs section .tabs .schedules .results .route-result dl dd:hover:before { opacity: 1; } #schedules-tabs section .tabs .schedules .results .route-result dl dd:after { position: absolute; left: 50px; top: 0px; width: 3px; height: 100px; content: ""; display: block; background: var(--tertiary-color); } #schedules-tabs section .tabs .schedules .results .route-result dl dd:last-child:after { display: none; } #schedules-tabs section .tabs .schedules .results .route-result.activeroute.hidelist { display: none; } #schedules-tabs section .tabs .schedules .results .overflow { width: 100%; height: 495px; transition: all .25s; overflow: hidden; display: none; } #schedules-tabs section .tabs .schedules .results .overflow img { max-width: 575px; } #schedules-tabs section .tabs .schedules .results .route-result.activeroute.hidelist ~ .overflow { display :block; } #schedules-tabs section .tabs .schedules .results .viewtoggle { margin-bottom: 20px; display: none; } #schedules-tabs section .tabs .schedules .results.on .viewtoggle { display: block; } #schedules-tabs section .tabs .schedules .results .viewtoggle:after { content: ""; clear: both; display: block; } #schedules-tabs section .tabs .schedules .results .viewtoggle label { width: 84px; height: 36px; border: 3px solid #dadada; float: right; position: relative; cursor: pointer; } #schedules-tabs section .tabs .schedules .results .viewtoggle label input { opacity: 0; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; padding-bottom: 0px; } #schedules-tabs section .tabs .schedules .results .viewtoggle label .slider { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #schedules-tabs section .tabs .schedules .results .viewtoggle label .slider:before { content: ""; position: absolute; top: 0px; left: 0px; background: #dadada; width: 50%; height: 100%; z-index: -1; transform: all .25s ease-in; } #schedules-tabs section .tabs .schedules .results .viewtoggle label .slider svg { margin-left: 6px; } #schedules-tabs section .tabs .schedules .results .viewtoggle label input:checked + .slider:before { transform: translateX(100%) } #schedules-tabs section .tabs .schedules .results .viewtoggle label .slider svg:first-child { width: 15px; height: 15px; } #schedules-tabs section .tabs .schedules .results .viewtoggle label input:checked + .slider svg:first-child * { fill: var(--primary-color); } #schedules-tabs section .tabs .schedules .results .viewtoggle label .slider svg:last-child { width: 30px; height: 30px; } #schedules-tabs section .tabs .schedules .results .viewtoggle label input:checked + .slider svg:last-child * { fill: #37414d; } #schedules-tabs section .tabs .schedules .results .viewtoggle label .slider svg:first-child * { fill: #37414d; } #schedules-tabs section .tabs .schedules .results .viewtoggle label .slider svg:last-child * { fill: var(--primary-color); } #ui-datepicker-div { display: none; margin-top: -100px; background: #f7f7f7; width: 280px; } .ui-datepicker-header { color: #FFF; background: var(--primary-color); padding: 5px; text-align: center; } .ui-datepicker-header a.ui-datepicker-prev { font-size: 8px; float: left; position: relative; top: 6px; } .ui-datepicker-header a.ui-datepicker-next { font-size: 8px; float: right; position: relative; top: 6px; } #ui-datepicker-div .ui-datepicker-calendar { border-right: 1px solid var(--gray-color); border-top: 1px solid var(--gray-color); } #ui-datepicker-div .ui-datepicker-calendar th { font-size: 10px; font-weight: 500; background: var(--tertiary-color); } #ui-datepicker-div .ui-datepicker-calendar td { text-align: center; font-size: 10px; vertical-align: middle; width: 40px; height: 40px; border-left: 1px solid var(--gray-color); border-bottom: 1px solid var(--gray-color) } .ui-datepicker-unselectable { background: #777!important; } .ui-datepicker-unselectable .ui-state-default { opacity: .5; } #ui-datepicker-div .ui-datepicker-calendar td a { color: var(--font-color); text-decoration: none; } #ui-datepicker-div .ui-datepicker-calendar td:nth-child(even) { background: #FFF; } #ui-datepicker-div .ui-datepicker-calendar td.ui-datepicker-current-day { background: var(--secondary-color); } #ui-datepicker-div .ui-datepicker-calendar td.ui-datepicker-today { background: var(--tertiary-color); } #tribe-events-content table.tribe-events-calendar { table-layout: initial; } /* Page Settings */ /* Intro section */ #intro section { padding-left: 63px; padding-right: 63px; padding-bottom: 82px; } .page-template-contact-page #intro section { padding-bottom: 15px; } #intro section > div { padding: 30px 0px 0px 52px } #intro section > div p { letter-spacing: 0.0ex } #intro section aside { text-align: right; padding: 0px; padding-right: 4px; } #intro hr { width: 100%; max-width: 1244px; margin: auto; border: none; border-top: 1px solid var(--quaternary-color); clear: both; } #intro section aside .buttonbox { min-width: 163px; display: inline-block; text-align: center; color: #FFF; width: 26.29%; margin-left: 2.5%; background: var(--primary-color); } #intro section aside .buttonbox .buttonbox-inner { position: relative; width: 100%; padding-bottom: 92%; } #intro section aside .buttonbox .buttonbox-inner > div { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-size: 15px; font-weight: 500; font-family: var(--primary-font); padding-left: 20px; padding-right: 20px; } #intro section aside .buttonbox .buttonbox-inner > div svg { width: 40px; margin-bottom: 10px; margin-top: 10px; } #intro section aside .buttonbox .buttonbox-inner > div svg * { fill: #FFF; } #intro section aside .buttonbox:hover { background: var(--tertiary-color); } #intro section aside .buttonbox-slim { min-width: 163px; display: inline-flex; text-align: center; color: #FFF; width: 26.29%; margin-left: 2.5%; background: var(--primary-color); margin-top: 30px; } #intro section aside .buttonbox-slim .buttonbox-inner { position: relative; width: 100%; padding-bottom: 50%; } #intro section aside .buttonbox-slim .buttonbox-inner > div { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-size: 15px; font-weight: 500; font-family: var(--primary-font); padding-left: 10px; padding-right: 10px; } #intro section aside .buttonbox-slim:hover { background: var(--tertiary-color); } #intro section aside strong { color: var(--primary-color); font-size: 15px; position: relative; top: -35px; } /* Center Text */ #centertext article { max-width: 980px; padding: 50px 15px; margin: auto; text-align: center; } #centertext article h3 { color: var(--primary-color); font-size: 15px; font-family: var(--primary-font); font-weight: 500; margin-bottom: 10px; } /* Quick Links Section */ #quick-links { text-align: center; color: #FFF; margin-bottom: 75px; } #quick-links:before { content: ""; background: var(--tertiary-color); position: absolute; top: 0px; left: 0px; width: 100%; background-blend-mode: multiply; height: 100%; opacity: .8 } #quick-links section { padding: 58px 0px 53px; } #quick-links section h2 { font-weight: 500; font-size: 30px; letter-spacing: 0.03ex; margin-bottom: 5px; } #quick-links section p { font-family: var(--secondary-font); font-size: 15px; } #quick-links section .quick-links { margin-top: 78px; max-width: 806px; margin-left: auto; margin-right: auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #quick-links section .quick-links a { width: 205px; max-width: 205px; height: 76px; background: none; border: 1px solid #FFF; font-weight: 500; font-size: 15px; letter-spacing: 0.05ex; text-transform: none; padding: 0px; } #quick-links section .quick-links a:hover { background: #FFF; color: var(--primary-color); } /* Quick Links Side by Side Section */ #quick-links-side { } #quick-links-side:before { content: ""; background: var(--tertiary-color); position: absolute; top: 0px; left: 0px; width: 100%; background-blend-mode: multiply; height: 100%; opacity: .8 } #quick-links-side section { padding: 90px 25px 90px; max-width: 1020px; } #quick-links-side section article { color: #FFF; float: left; max-width: 330px; } #quick-links-side section article h2 { font-weight: 500; font-size: 30px; letter-spacing: 0.03ex; margin-bottom: 5px; color: #FFF; text-transform: none; } #quick-links-side section article p { font-family: var(--secondary-font); font-size: 15px; color: #FFF; } #quick-links-side section .quick-links { max-width: 530px; width: calc( 100% - 330px ); margin-top: 20px; float: right; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #quick-links-side section .quick-links a { width: 205px; max-width: 205px; height: 76px; background: none; border: 1px solid #FFF; font-weight: 500; font-size: 15px; letter-spacing: 0.05ex; text-transform: none; padding: 0px; } #quick-links-side section .quick-links a:hover { background: #FFF; color: var(--primary-color); } /* Quick Links Too */ #quick-links-too { text-align: center; color: #FFF; } #quick-links-too:before { content: ""; background: var(--tertiary-color); position: absolute; top: 0px; left: 0px; width: 100%; background-blend-mode: multiply; height: 100%; opacity: .8 } #quick-links-too section { padding: 58px 0px 53px; max-width: 1248px; color: #FFF; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #quick-links-too section .box-1-2:first-child article{ text-align: left; max-width: 330px; width: 100%; margin-left: 45px; } #quick-links-too section h2 { font-weight: 500; font-size: 30px; letter-spacing: 0.03ex; margin-bottom: 5px; color: #FFF; } #quick-links-too section p { font-family: var(--secondary-font); font-size: 15px; color: #FFF; } #quick-links-too section .quick-links { margin-top: 48px; max-width: 530px; margin-left: auto; margin-right: auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #quick-links-too section .quick-links a { width: 165px; max-width: 215px; height: 76px; background: none; border: 1px solid #FFF; font-weight: 500; font-size: 15px; letter-spacing: 0.05ex; text-transform: none; padding: 0px 0px; margin-bottom: 10px; } #quick-links-too section .quick-links a:hover { background: #FFF; color: var(--primary-color); } #quick-links-too section .inner-box { border: 1px solid #FFF; max-width: 445px; margin: auto; padding: 45px 0px; } #quick-links-too section .inner-box article { max-width: 245px; margin: auto; margin-bottom: 25px; } #quick-links-too section .inner-box a.cta { width: 180px; height: 75px; font-size: 15px; font-family: var(--primary-font); font-weight: 500; text-transform: none; } /* Copy Halves */ .copy-halves section { max-width: 1240px; padding: 60px 0px; } .copy-halves section hr { clear: both; display: block; border: none; border-top: 1px solid var(--tertiary-color); } .copy-halves section article { padding-left: 30px; margin-bottom: 50px; } .copy-halves section article h2 { font-size: 24px; text-transform: none; } .copy-halves section article h2.bar:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; display: block; margin: 5px 0px 15px; } .copy-halves h3 { font-family: var(--primary-font); font-size: 18px; color: var(--primary-color); margin-bottom: 0px; } .copy-halves section article h5 { font-family: var(--primary-font); font-size: 15px; } .page-id-5670 .copy-halves section .box-1-2:first-child article { max-width: 515px; } .page-id-5670 .copy-halves section > hr { display: none; } .page-id-5670 .copy-halves section article hr { display: block; margin: 60px auto; } .copy-halves section article .greenbox { display:block; margin-top: 70px; border: 2px solid var(--tertiary-color); padding: 50px 15px; } .copy-halves section article .greenbox h2 { color: var(--tertiary-color); } .copy-halves section article .greenbox strong { font-family: var(--primary-font); font-size: 15px; } /* Icon List */ #icon-list section { max-width: 1240px; padding-left: 58px; padding-right: 58px; padding-top: 50px; padding-bottom: 50px; } #icon-list ul { list-style-type: none; padding: 0px; } #icon-list ul li { margin: 20px auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #icon-list ul li figure { position: relative; width: 106px; height: 106px; border: 2px solid var(--tertiary-color); overflow: hidden; float: left; margin-right: 60px; margin-bottom: 20px; } #icon-list ul li figure img { max-width: 100%; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%) } #icon-list ul li article { width: calc( 100% - 166px ); float: right; padding-right: } #icon-list ul li article h3 { font-family: var(--primary-font); font-size: 24px; font-weight: 500; color: var(--primary-color); margin-bottom: 0px; line-height: 1; } #icon-list ul li article h4 { font-family: var(--primary-font); font-size: 18px; font-weight: 500; color: var(--primary-color); } #icon-list ul li article p { margin-top: 18px; } /* Teal Box */ #teal-box section { max-width: 1240px; background: var(--tertiary-color); color: #FFF; display: flex; display: -moz-flex; margin-bottom: 60px; } #teal-box section .teal-box { width: calc( 100% - 517px ); float: left; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #teal-box section figure { width: 517px; float: right; display: block; position: relative; font-size: 0px; } #teal-box section figure:before { width: 28px; height: 100%; position: absolute; top: 0px; left: 0px; background: var(--tertiary-color); opacity: .8; z-index: 2; content: ""; } #teal-box section figure img { width: 100%; } #teal-box section .teal-box article { color: #FFF; text-align: center; max-width: 565px; position: relative; top: 5px; } #teal-box section .teal-box article * { color: #FFF; } #teal-box section .teal-box article p { margin-bottom: 25px } #teal-box section .teal-box article *:last-child { margin-bottom: 0px; } #teal-box section .teal-box article h3 { font-size: 18px; font-weight: 500; letter-spacing: 0.01ex; font-family: var(--primary-font); margin-bottom: 8px;} #teal-box section .teal-box article a.cta { width: 100%; max-width: 199px; height: 65px; background: none; border: 1px solid #FFF; font-weight: 500; font-size: 15px; letter-spacing: 0.0ex; text-transform: none; padding: 0px; margin-bottom: 25px } #teal-box section .teal-box article a.cta:hover { background: #FFF; color: var(--primary-color); } /* Blue Box */ #blue-box section { max-width: 1194px; background: var(--primary-color); } #blue-box section figure { width: 55.94%; float: left; font-size: 0px; position: relative; } #blue-box section figure:after { position: absolute; top: 0px; right: -2px; width: 30px; height: 100%; background: var(--primary-color); opacity: .5; content: ""; } #blue-box section figure img { width: 100%; } #blue-box section .blue-box-text { width: 44.06%; float: left; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #blue-box section .blue-box-text article * { color: #FFF; } #blue-box section .blue-box-text article { padding: 0px 50px; } #blue-box section .blue-box-text article h1 { font-size: 18px; font-family: var(--primary-font); font-weight: 500; } #blue-box section .blue-box-text article ul { font-family: var(--primary-font); font-weight: 500; } #blue-box section .blue-box-text article ul strong { font-weight: 500; } /* Small Teal Box */ #small-teal-box section { max-width: 930px; margin-bottom: 63px; } #small-teal-box section .small-box { } #small-teal-box section .small-box article { max-width: 525px; float: left; padding: 60px 0px; text-align: center; color: #FFF; width: 100%; } #small-teal-box section .small-box article h2 { color: #FFF; text-transform: none; font-size: 24px; font-weight: 500; letter-spacing: 0.015ex; margin-bottom: 33px; } #small-teal-box section .small-box article a.cta { background: transparent; text-transform: none; font-size: 15px; font-weight: 500; border: 2px solid #FFF; width: 180px; height: 70px; margin: 0px 15px; } #small-teal-box section .small-box article a.cta:hover { background: #FFF; color: var(--tertiary-color); } /* Small Telephone Box */ #small-tel-box { margin: 10px 0px 40px; } #small-tel-box section { max-width: 602px; border: 1px solid var(--primary-color); text-align: center; padding: 48px; } #small-tel-box section article { max-width: 430px; width: 100%; margin: auto; } #small-tel-box section article h3 { font-weight: bold; font-family: var(--primary-font); color: var(--primary-color); margin-bottom: 20px } #small-tel-box section article p { color: var(--primary-color); margin-bottom: 30px; } #small-tel-box section article a { font-size: 29px; font-weight: 500; letter-spacing: 0.03ex; word-spacing: 0.03ex; text-decoration: none; position: relative; left: 5px; } #small-tel-box section article a:before { width: 54px; height: 54px; background: url(../images/phone.svg) center no-repeat; background-size: contain; content: ""; position: absolute; left: -70px; top: -10px; } #small-tel-box section article a:hover { color: var(--secondary-color); } /* FAQs */ #faqs section { max-width: 1132px; padding: 60px 0px; } #faqs section h2 { font-family: var(--primary-font); font-size: 30px; font-weight: 500; color: var(--tertiary-color); margin-bottom: 20px; } #faqs.blue section { max-width: 1162px; } #faqs.blue section h2 { color: var(--primary-color); padding-left: 10px; } #faqs.blue section .twocol { padding: 15px 0px; column-gap: 30px; -webkit-column-gap: 30px; -moz-column-gap: 30px; } #faqs.blue section details { max-width: 100%; margin: 0px 0px 30px; } #faqs.blue section details summary { background: var(--primary-color); height: 115px; } #faqs section details { width: 100%; max-width: 478px; margin: 0px auto 24px; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; } #faqs section details summary { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 90px; background: var(--tertiary-color); color: #FFF; padding-left: 40px; padding-right: 20px; font-size: 18px; font-weight: 500; position: relative; } #faqs section details summary::-webkit-details-marker { display: none } #faqs section details summary span { margin-right: 30px; top: 50%;transform: translateY(-50%);position: absolute;left: 30px; } #faqs section details summary:before { content: "+"; color: var(--secondary-color); font-size: 30px; font-weight: 500; margin-left: 40px; position: absolute; top: 50%; right: 30px; margin-top: -20px; } #faqs section details[open] summary:before { content: "-" } #faqs section details article { border: 1px solid var(--tertiary-color); padding: 25px 35px; } #faqs section details article a { font-weight: 500; text-decoration: none; color: var(--primary-color); font-weight: 500; } #faqs section details article a:hover { color: var(--tertiary-color); } #faqs section details article a.cta { border: 2px solid var(--primary-color); background: none; color: var(--primary-color); font-size: 15px; text-transform: none; width: 185px; height: 45px; font-weight: 500; margin-left: 10px; margin-right: 10px; } #faqs section details article a.cta:hover { color: #FFF; background: var(--primary-color); } .page-id-5670 #faqs.blue section { padding-top: 0px; } .page-id-5670 #faqs.blue section > h2 { font-weight: 600; text-align: center; } .page-id-5670 #faqs.blue section > h2:after { width: 50px; height: 12px; background: var(--secondary-color); content: "";display: inline-block; display: block; margin: 35px auto; } details summary { cursor: pointer; } details summary:hover:before { transform: rotate(90deg); } details summary:before { transition: all .25s; } details summary span { font-weight: inherit; display: block; } /* Fares */ #fares section { max-width: 1100px; padding: 0px 30px; margin-bottom: 90px; } #fares section details { width: 100%; margin: 0px auto 24px; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; } #fares section details summary { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 84px; background: var(--primary-color); color: #FFF; padding-left: 40px; padding-right: 40px; font-size: 24px; font-weight: 500; position: relative; } #fares section details summary::-webkit-details-marker { display: none } #fares section details summary:before { content: "+"; color: var(--secondary-color); font-size: 30px; font-weight: 500; margin-left: 40px; position: absolute; right: 30px; } #fares section details[open] summary:before { content: "-" } #fares section details[open] { margin-bottom: 90px; } #fares section details > div { border: 1px solid var(--primary-color); } #fares section details > div article { padding: 40px 15px 27px; text-align: center; } #fares section details > div article div { margin-top: 25px; } #fares section details > div article div p { max-width: 405px; margin-left: auto; margin-right: auto; } #fares section details > div article div h2 { text-transform: none; } .table table, #fares section details > div table { width: 100%; border-spacing: 0px; } .table table thead th, .table table tbody td, #fares section details > div table thead th, #fares section details > div table tbody td { width: 232px; text-align: center; border-right: 1px solid var(--primary-color); border-top: 1px solid var(--primary-color); height: 90px; padding: 0px 10px; color: var(--primary-color); font-size: 19px; font-weight: 200; } #fares section details > div table tbody tr td:first-child span { font-size: 16px; letter-spacing: 0.0ex; } #fares section details > div table thead th span { font-size: 16px; display: block; letter-spacing: 0.0ex; margin-bottom: 5px; } .table section { max-width: 1180px; } .table table thead th:first-child, .table table tbody td:first-child { border-left: 1px solid var(--primary-color); } .table table thead th { border-bottom: 8px solid var(--primary-color); } .table table tbody td { font-size: 15px; font-weight: 400; } .table table tbody tr:last-child td { border-bottom: 1px solid var(--primary-color); } #fares section details > div table tbody td { height: 100px; } #fares section details > div table thead th { border-bottom: 20px solid var(--primary-color); } #fares section details > div table tbody tr td:first-child, #fares section details > div table thead th { font-family: var(--primary-font); font-size: 19px; font-weight: 500; letter-spacing: 0.2ex; line-height: 1; } #fares section details > div table thead tr th:last-child, #fares section details > div table tbody tr td:last-child { border-right: 0px; } #fares section details > div table thead th:first-child { border-top: 0px; width: 353px; } #fares section details > div .footnote { text-align: center; padding: 15px; color: #FFF; background: var(--tertiary-color); font-size: 15px; font-family: var(--secondary-font); font-weight: 400; } #fares section details > div .footnote * { } /* Fares Alternative */ #fares-alt section { max-width: 1100px; padding: 0px 30px; margin-bottom: 90px; } #fares-alt section h2 { font-size: 24px; font-weight: 500; text-align: center; color: var(--primary-color); margin-top: 30px; } #fares-alt section > div { } #fares-alt section > div article { padding: 40px 15px 27px; text-align: center; } #fares-alt section > div article div { margin-top: 25px; } #fares-alt section > div article div p { max-width: 405px; margin-left: auto; margin-right: auto; } #fares-alt section > div article div h2 { text-transform: none; } #fares-alt section > div table { width: 100%; border-spacing: 0px; border: 1px solid var(--primary-color); } #fares-alt section > div table thead th, #fares-alt section > div table tbody td { width: 232px; text-align: center; border-right: 1px solid var(--primary-color); border-top: 1px solid var(--primary-color); height: 90px; padding: 0px 10px; color: var(--primary-color); font-size: 19px; font-weight: 200; } #fares-alt section > div table tbody tr td:first-child span { font-size: 16px; letter-spacing: 0.0ex; } #fares-alt section > div table thead th span { font-size: 16px; display: block; letter-spacing: 0.0ex; margin-bottom: 5px; } #fares-alt section > div table tbody td { height: 100px; } #fares-alt section > div table thead th { border-bottom: 20px solid var(--primary-color); } #fares-alt section > div table tbody tr td:first-child, #fares-alt section > div table thead th { font-family: var(--primary-font); font-size: 19px; font-weight: 500; letter-spacing: 0.2ex; line-height: 1; } #fares-alt section > div table thead tr th:last-child, #fares-alt section > div table tbody tr td:last-child { border-right: 0px; } #fares-alt section > div table thead th:first-child { border-top: 0px; width: 353px; } #fares-alt section > div .footnote { text-align: center; padding: 15px; color: #FFF; background: var(--tertiary-color); font-size: 15px; font-family: var(--secondary-font); font-weight: 400; } #fares-alt section > div .footnote * { } #zones-title { background: url(../images/fares-title.png) right no-repeat var(--tertiary-color); background-size: auto 220px; } #zones-title section { max-width: 1076px; padding: 67px 15px; } #zones-title section h2 { color: #FFF; font-size: 35px; font-weight: 500; } #zones section { max-width: 900px; padding: 50px 15px; } #zones section h3 { text-align: center; font-weight: 500; color: var(--primary-color); font-size: 18px; margin-bottom: 30px; } #zones section ol { list-style: none;counter-reset: counter1; } #zones section ol li { counter-increment: counter1; padding-left: 172px; position: relative; border-bottom: 1px solid var(--tertiary-color); padding: 35px 0px 35px 172px; color: var(--primary-color); line-height: 2; font-size: 15px; font-family: var(--secondary-font); } #zones section ol li:last-child { border-bottom: none; } #zones section ol li strong { font-family: var(--primary-font); font-weight: 500; } #zones section ol li::before { content: counter(counter1); width: 172px; height: 100%; position: absolute; left: 0px; top: 0px; background: url(../images/pin.png) center no-repeat; color: #FFF; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-size: 23px; font-family: var(--primary-font); } .bx-wrapper img.aligncenter { margin-left: auto; margin-right: auto; margin-bottom: 10px; } #fare-types { margin: 50px 0px; } #fare-types section { max-width: 1154px; background: var(--tertiary-color); padding: 60px 20px; color: #FFF; } #fare-types section .types { line-height: 2.5 } #fare-types section .types h2 { font-size: 30px; font-weight: 500; letter-spacing: 0.03ex; margin-bottom: 10px;} #fare-types section .types p { font-family: var(--secondary-font); margin-bottom: 10px; } #fare-types section .types ul { padding-left: 50px; } #fare-types section .types ul li { font-size: 15px; font-weight: 300; } #fare-types section .types ul li a { color: var(--secondary-color); font-weight: 500; } #fare-types section .types ul li a:hover { color: #FFF; } #fare-types section .compass img { padding-top: 35px; padding-right: 35px; margin-bottom: 120px; } #fare-types section .compass p { font-size: 18px; font-weight: 500; line-height: 1.75; margin-bottom: 20px } #fare-types section .compass p strong { font-weight: 500; } #fare-types section .compass p a { color: var(--secondary-color); font-weight: 500; } #fare-types section .compass p a:hover { color: #FFF; } #fare-types section .compass a.cta { width: 165px; height: 55px; border: 2px solid #FFF; background: none; text-transform: none; font-size: 15px; font-family: var(--primary-font); margin-right: 25px; color: #FFF; } #fare-types section .compass a.cta:hover { background: #FFF; color: var(--tertiary-color); } /* Policies */ #policy-accordions section { max-width: 1070px; padding: 30px 15px; } #policy-accordions section details summary { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 90px; background: var(--primary-color); color: #FFF; padding-left: 40px; padding-right: 20px; font-size: 18px; font-weight: 500; text-align: center; position: relative; } #policy-accordions section details summary::-webkit-details-marker { display: none } #policy-accordions section details summary:before { content: "+"; color: var(--secondary-color); font-size: 30px; font-weight: 500; margin-left: 40px; position: absolute; right: 30px; } #policy-accordions section details[open] summary:before { content: "-" } #policy-accordions section details article { border: 1px solid var(--tertiary-color); padding: 25px 35px; } #policy-accordions section details article a { font-weight: 500; text-decoration: none; color: var(--primary-color); font-weight: 500; } #policy-accordions section details article a:hover { color: var(--primary-color); text-decoration: none; } #policy-accordions section details article ul li { margin-bottom: 15px; } #policy-accordions section details article h2 { font-weight: 500; } #policy-accordions section details article strong { font-family: var(--primary-font); } /* About Page */ #icon-buttons section { max-width: 1200px; text-align: center; padding: 55px 0px 35px; } #icon-buttons section h3 { color: var(--primary-color); font-size: 18px; font-weight: 500; margin-bottom: 90px; } #icon-buttons section ul { list-style-type: none; font-size: 0px; text-align: center; padding: 0px; } #icon-buttons section ul:after { content: ""; clear: both; display: block; } #icon-buttons section ul li { display: inline-block; padding: 0px 15px; min-width: 205px; width: 20%; margin-bottom: 40px; } #icon-buttons section ul li a { width: 100%; border: 2px solid var(--primary-color); display: block; height: 100px; padding-bottom: 35px; font-size: 14px; text-decoration: none; color: var(--primary-color); font-family: var(--primary-font); } #icon-buttons section ul li a:hover { background: var(--primary-color); color: #FFF; } #icon-buttons section ul li a img { display: block; margin-left: auto; margin-right: auto; position: relative; top: -35px; margin-bottom: -30px; } #icon-buttons section ul li a strong { display: block; font-size: 18px; font-weight: 500; } #icon-buttons section ul li a:hover strong { transition: none; } #slim-blue section { max-width: 964px; margin: 45px auto; background: var(--primary-color); padding: 0px; } #slim-blue section figure { width: 380px; position: relative; font-size: 0px; } #slim-blue section figure:after { position: absolute; top: 0px; right: 0px; width: 27px; height: 100%; background: var(--primary-color); opacity: .8; content: ""; } #slim-blue section figure img { width: 100%; } #slim-blue section div { width: calc( 100% - 380px ); color: #FFF; } #slim-blue section div article { max-width: 420px; margin: auto; } #slim-blue section div article * { color: #FFF; } #slim-blue section div article h1 { font-size: 30px; position: relative; } #slim-blue section div article h1:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; display: block; margin: 25px 0px; } #slim-blue section div article h2 { font-family: var(--primary-font); font-size: 25px; font-weight: 500; text-transform: none; line-height: 1.25; } .page-template-business #slim-blue section { max-width: 970px; } .page-template-business #slim-blue section div article { max-width: 470px; } .page-template-business #slim-blue section div article h1 { font-size: 27px; margin-bottom: 0px; } #biz-quick-links section { margin: 75px auto; } #biz-quick-links h3 { font-family: var(--primary-font); font-size: 18px; color: var(--primary-color); font-weight: 600; text-align: center; margin-bottom: 10px; } #biz-quick-links ul { list-style-type: none; text-align: center; font-size: 0px; padding: 0px; } #biz-quick-links ul li { display: inline-block; margin: 15px; } #biz-quick-links ul li a { border: 1px solid var(--tertiary-color); font-family: var(--primary-font); font-size: 15px; color: var(--primary-color); font-weight: 500; width: 100%; max-width: 175px; min-width: 175px; height: 85px; text-decoration: none; display: -ms-inline-flexbox; display: -webkit-inline-flex; display: inline-flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #biz-quick-links ul li a:hover { background: var(--primary-color); color: #FFF; } #bottom-big section { max-width: 1180px; padding: 50px 0px 80px; } #bottom-big section article li, #bottom-big section article p { font-family: var(--primary-font); font-size: 15px; line-height: 2; font-family: var(--secondary-font); } #bottom-big section article *:last-child { margin-bottom: 0px; } #bottom-big section article p { margin-bottom: 30px; } #bottom-big section article ul li { margin-bottom: 10px; } #bottom-big section article ol li { margin-bottom: 10px; } #bottom-big section article ol { counter-reset: item; } #bottom-big section article ol > li { padding: 0 0 0 10px; text-indent: -16px;list-style-type: none;counter-increment: item; } #bottom-big section article ol > li:before { display: inline-block; width: 1em; padding-right: 0.5em; font-weight: bold; text-align: right; content: counter(item) "."; } #bottom-big section article ol li strong { font-family: var(--primary-font); font-weight: 500; } #bottom-big section article h2 { font-size: 30px; position: relative; font-weight: 600; text-transform: none; font-family: var(--primary-font); line-height: 1.25; } #bottom-big section article h2:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; display: block; margin: 15px 0px; } #bottom-big section article h2[style*=center] { line-height: 1.5; padding-bottom: 35px} #bottom-big section article h2[style*=center]:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; position: absolute;bottom: 0px; left: 50%; display: inline-block; transform: translateX(-50%); top: auto; } #bottom-big section article h3 { color: var(--primary-color); font-size: 15px; font-family: var(--primary-font); font-weight: 500; margin-bottom: 10px; } #bottom-big section article:first-child { padding-right: 80px; } #bottom-big section article:last-child { padding-left: 80px; border-left: 1px solid var(--tertiary-color); } #bottom-big section article a.cta { width: 165px; height: 55px; border: 2px solid var(--primary-color); background: none; text-transform: none; font-size: 15px; font-family: var(--primary-font); margin-right: 25px; color: var(--primary-color); font-weight: 500; position: relative; z-index: 2; margin-left: 50px; } #bottom-big section article a.cta:hover { background: var(--primary-color); color: #FFF; } #bottom-big section article .bluebox { background: var(--primary-color); color: #FFF; text-align: center; padding: 50px 15px 40px; margin-bottom: 50px; } #bottom-big section article .bluebox h3 { color: #FFF; font-size: 18px; } #bottom-big section article .bluebox a { color: #FFF; text-decoration: underline; } #bottom-big section article .bluebox a:hover{ color: var(--tertiary-color); } #bottom-big section article .bluebox a.cta { border: 1px solid var(--secondary-color); color: #FFF; background: var(--primary-color);; margin-left: auto; margin-right: auto; text-decoration: none; } #bottom-big section article .bluebox a.cta:hover { background: var(--secondary-color); color: var(--primary-color); } #bottom-big section article .bluebox p { } #double-big section > h1 { font-size: 25px; position: relative; margin-bottom: 40px; font-weight: 500; text-transform: none; text-align: center; margin-bottom: 100px; color: var(--primary-color); } #double-big section > h1:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; position: absolute; top: 60px; left: 50%; transform: translateX(-50%) } #double-big section { max-width: 1130px; padding: 50px 15px 80px; } #double-big section article { column-gap: 85px; -webkit-column-gap: 85px; column-rule: 1px solid var(--tertiary-color); } #double-big section article * { font-family: var(--primary-font); font-size: 15px; line-height: 2; font-family: var(--secondary-font); } #double-big section article h2 { font-family: var(--primary-font); } #double-big section article *:last-child { margin-bottom: 0px; } #double-big section article p { margin-bottom: 30px; } #double-big section article ul li { margin-bottom: 10px; } #double-big section article h2 { font-size: 30px; position: relative; margin-bottom: 40px; font-weight: 500; text-transform: none; } #double-big section article h2:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; position: absolute; top: 60px; left: 0px; } #double-big section article h3 { color: var(--primary-color); font-size: 15px; font-family: var(--primary-font); font-weight: 500; margin-bottom: 10px; } #double-big section article a.cta { width: 165px; height: 55px; border: 2px solid var(--primary-color); background: none; text-transform: none; font-size: 15px; font-family: var(--primary-font); margin-right: 25px; color: var(--primary-color); font-weight: 500; position: relative; z-index: 2; margin-left: 50px; } #double-big section article a.cta:hover { background: var(--primary-color); color: #FFF; } #double-big section article a.twitter { text-decoration: none; color: var(--primary-color); font-weight: 500; font-family: var(--primary-font); letter-spacing: 0.1ex; position: relative; right: -5px; } #double-big section article a.twitter:before { font-family: var(--font-awesome); content: "\f099"; color: var(--tertiary-color); font-size: 40px; position: relative; top: 10px; margin-left: 10px; margin-right: 10px; } #double-big section article a.twitter:hover { color: var(--secondary-color); } #double-big section article a.twitter:hover:before { color: var(--primary-color); } #double-big section .teal-box { color: var(--tertiary-color); border: 1px solid var(--tertiary-color); padding: 30px 115px; text-align: center; } #double-big section .teal-box * { font-size: 15px; } #double-big section .teal-box a { color: var(--tertiary-color); } #double-big section .blue-text { color: var(--primary-color); text-align: center; } #double-big section .blue-text strong { position: relative; top: 10px; margin-right: 35px; } #double-big section .blue-text a.cta { width: 165px; height: 85px; background: var(--primary-color); color: #FFF; border: 1px solid var(--primary-color); font-family: var(--primary-font); text-align: center; margin: 0px; line-height: 1.5; } #double-big section .blue-text a.cta:hover { background: var(--tertiary-color); } /* Accordion */ main > hr { width: 100%; max-width: 1244px; margin: auto; border: none; border-top: 1px solid var(--quaternary-color); clear: both; } #accordions section { max-width: 1044px; } #accordions section > h2 { font-size: 30px; position: relative; font-weight: 600; text-transform: none; text-align: center; color: var(--primary-color); margin-top: 50px; } #accordions section > h2:after { width: 50px; height: 12px; background: var(--secondary-color); content: "";display: inline-block; display: block; margin: 35px auto; } #accordions section > h2 + article { max-width: 790px; margin: 0px auto 50px; } #accordions details { max-width: 100%; margin: 0px 0px 30px; } #accordions details summary { background: var(--primary-color); height: 115px; text-align: center; } #accordions details { width: 100%; margin: 0px auto 24px; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; } #accordions details summary { position: relative; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 90px; color: #FFF; padding-left: 40px; padding-right: 60px; font-size: 18px; font-weight: 500; } #accordions details summary::-webkit-details-marker { display: none } #accordions details summary:before { content: "+"; color: var(--secondary-color); font-size: 30px; font-weight: 500; margin-left: 40px; position: absolute; right: 40px; } #accordions.teal details summary { background: var(--tertiary-color); } #accordions details[open] summary:before { content: "-" } #accordions.teal details[open] { border: 2px solid var(--tertiary-color); } #accordions details[open] { border: 2px solid var(--primary-color); } #accordions details article { max-width: 940px; margin: auto; padding: 50px 15px; font-size: 15px; color: #414042; } #accordions details article dl dt { width: 227px; height: 85px; border-right: 1px solid var(--tertiary-color); border-bottom: 1px solid var(--tertiary-color); font-family: var(--primary-font); font-weight: 500; padding-left: 50px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; float: left; } #accordions details article dl dd { width: calc( 100% - 227px ); padding-left: 50px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; float: left;height: 85px; border-bottom: 1px solid var(--tertiary-color); } #accordions details article dl:after { content: ""; clear: both; display: block; } #accordions details article ul { padding: 0px; list-style-type: none; line-height: 2.5; max-width: 780px; margin: auto; } .page-id-20287 #accordions details article ul { max-width: 100%; } #accordions details article ul ul { padding-left: 50px; } #accordions details article ul li { position: relative; } .page-id-17604 #accordions details article ul li:before, #accordions details article ul.bullets li:before { position: absolute; content: "•"; top: -2px; left: -20px; } #accordions details article ul ul li:before { position: absolute; content: "•"; top: -2px; left: -20px; } #accordions details article ul.bullets ul li:before { content: ''; width: 5px; height: 5px; display: inline-block; border: 1px solid #000; border-radius: 50%; top: 16px; } #accordions details article ul li a { color: #414042; font-weight: 500; font-size: 15px; font-family: var(--primary-font); } #accordions details article strong { font-weight: 500; font-family: var(--primary-font); } #accordions details article ol { counter-reset: item; } #accordions details article ol > li { padding: 0 0 0 10px; text-indent: -16px;list-style-type: none;counter-increment: item; } #accordions details article ol > li:before { display: inline-block; width: 1em; padding-right: 0.5em; font-weight: bold; text-align: right; content: counter(item) "."; } #accordions details article a.cta { background: var(--primary-color); width: 122px; font-size: 15px; height: 50px; text-transform: none; font-weight: 500; margin: 30px; } #accordions details article a.cta:hover { background: var(--tertiary-color); } #accordions details article table { width: 100%; border-spacing: 0px; border: 1px solid var(--primary-color); } #accordions details article table thead th, #accordions details article table tbody td { width: calc( 100% / 3 ); text-align: center; border-right: 1px solid var(--primary-color); border-top: 1px solid var(--primary-color); height: 60px; padding: 0px 10px; color: var(--primary-color); font-size: 16px; font-weight: 200; } #accordions details article table tbody tr td:first-child span { font-size: 16px; letter-spacing: 0.0ex; } #accordions details article table thead th span { font-size: 16px; display: block; letter-spacing: 0.0ex; margin-bottom: 5px; } #accordions details article table thead th { border-bottom: 20px solid var(--primary-color); } #accordions details article table tbody tr td:first-child, #accordions details article table thead th { font-family: var(--primary-font); font-size: 16px; font-weight: 500; letter-spacing: 0.2ex; line-height: 1; } #accordions details article table thead tr th:last-child, #accordions details article table tbody tr td:last-child { border-right: 0px; } #accordions details article table thead th:first-child { border-top: 0px; width: 353px; } .page-id-450 #accordions details article a.cta { font-family: var(--primary-font); font-weight: 500; width: 100%; max-width: 225px; height: 75px; background: none; border: 2px solid var(--tertiary-color); font-size: 15px; color: var(--tertiary-color); } .page-id-450 #accordions details article a.cta:hover { color: #FFF; background: var(--tertiary-color); } .page-id-450 #accordions details article ul { list-style-type: disc; } .page-id-450 #accordions details article ul li a { font-family: var(--secondary-font); color: var(--primary-color); font-size: 15px; text-decoration: none; } .page-template-business #accordions details article h4 { font-family: var(--primary-font); font-weight: 500; text-decoration: underline; } .page-template-business #accordions details .sliderz { max-width: 960px; margin: auto; margin-bottom: 60px; padding: 0px 40px; min-height: 220px; } .page-template-business #accordions details .sliderz .bx-viewport { min-height: 240px; } .page-template-business #accordions details .sliderz ul { padding: 0px; } .page-template-business #accordions details .event-slider li { list-style-type: none; margin: 0px; padding: 0px 0px; width: 440px!important; } .page-template-business #accordions details .event-slider li div.event { min-height: 230px; width: 420px; padding: 30px; border: 1px solid var(--tertiary-color); font-size: 15px; font-family: var(--secondary-font); color: #414042; } .page-template-business #accordions details .event-slider li div.event .meta { display: block; clear: both; margin-bottom: 45px; } .page-template-business #accordions details .event-slider li div.event strong { display: block; font-family: var(--primary-font); margin-bottom: 15px; } .page-template-business #accordions details .event-slider li div.event address { display: block; padding-left: 35px; position: relative; } .page-template-business #accordions details .event-slider li div.event address:before { content: url(../images/pin-3.svg); width: 25px; height: 25px; top: 15px; left: 0px; position: absolute; } .page-template-business #accordions details .bx-wrapper .bx-controls-direction a.bx-prev { left: -20px; text-indent: 0px; opacity: 1; font-size: 0px; text-decoration: none; background: none; } .page-template-business #accordions details .bx-wrapper .bx-controls-direction a.bx-prev:before { content: ""; color: var(--secondary-color); font-size: 20px; font-family: 'Font Awesome 5 Free';; font-weight: bold; } .page-template-business #accordions details .bx-wrapper .bx-controls-direction a.bx-next { right: -20px; text-indent: 0px; opacity: 1; font-size: 0px; text-decoration: none; background: none; text-align: right; } .page-template-business #accordions details .bx-wrapper .bx-controls-direction a.bx-next:before { content: ""; color: var(--secondary-color); font-size: 20px; font-family: 'Font Awesome 5 Free';; font-weight: bold; text-align: right; } /* Accessibility Page */ #button-bar section { max-width: 1270px; padding: 30px 15px; text-align: center; } #button-bar section h2 { color: var(--primary-color); font-size: 24px; font-weight: 500; margin-bottom: 38px; } #button-bar .button-bar { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } #button-bar .button-bar a.cta { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 80px; width: calc( 20% - 24px ); background: var(--tertiary-color); color: #FFF; font-size: 15px; font-weight: 500; font-family: var(--primary-font); max-width: 100%; min-width: 170px; margin: 0px 12px 24px; } #button-bar .button-bar a.cta:hover { background: var(--primary-color); } #button-bar hr { margin: 65px 0px; border: none; border-top: 1px solid var(--tertiary-color); } #message section { max-width: 1270px; padding: 60px 15px 95px; } #message section h2 { text-align: center; color: var(--primary-color); font-size: 24px; font-weight: 500; margin-bottom: 38px; } #message section .letter { max-width: 1010px; padding: 90px; text-align: left; border: 1px solid var(--tertiary-color); margin: auto; font-family: var(--secondary-font); color: #414042; font-size: 15px; line-height: 1.6666667 } #message section .letter * { font-family: var(--secondary-font); color: #414042; font-size: 15px; line-height: 1.6666667; margin-bottom: 15px; letter-spacing: 0.05ex; } #message section .letter strong { font-family: var(--primary-font); font-weight: 500; } #message section .letter ul { padding-left: 50px; } .titlebar { background-color: var(--tertiary-color); background-position: right; background-repeat: no-repeat; margin-bottom: 90px; } .titlebar section { max-width: 1076px; padding: 67px 15px; } .titlebar section h2 { color: #FFF; font-size: 35px; font-weight: 600; } .page-id-5670 .titlebar { background-color: var(--primary-color); margin-bottom: 0px; } .page-id-5670 .titlebar section { position: relative; z-index: 1; max-width: 1166px; } .page-id-5670 .titlebar section h2 { position: relative; z-index: 2; } .page-id-5670 .titlebar section:before { content: ""; position: absolute; top: 0px; left: 0%; width: 100%; height: 100%; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#034eac+49,034eac+100&1+64,0+100 */ background: -moz-linear-gradient(left, rgba(3,78,172,1) 49%, rgba(3,78,172,1) 64%, rgba(3,78,172,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(3,78,172,1) 49%,rgba(3,78,172,1) 64%,rgba(3,78,172,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(3,78,172,1) 49%,rgba(3,78,172,1) 64%,rgba(3,78,172,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#034eac', endColorstr='#00034eac',GradientType=1 ); /* IE6-9 */ } #wide-text section { max-width: 1240px; } #wide-text section article > * { max-width: 950px; margin-left: auto; margin-right: auto; font-family: var(--secondary-font); color: #414042; font-size: 15px; line-height: 1.6666667; margin-bottom: 15px; letter-spacing: 0.05ex; } #wide-text section article li { margin-bottom: 15px; } #wide-text section article strong { font-family: var(--primary-font); font-weight: 500; } #wide-text section article ol { counter-reset: item; } #wide-text section article ol > li { padding: 0 0 0 2em; text-indent: -2em;list-style-type: none;counter-increment: item; } #wide-text section article ol > li:before { display: inline-block; width: 1em; padding-right: 0.5em; font-weight: bold; text-align: right; content: counter(item) "."; } #wide-text section article .equal-heights { width: 100%; max-width: 1020px; position: relative; margin-left: auto; margin-right: auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; margin-bottom: 130px; } #wide-text section article .equal-heights .blue-box { color: #FFF; width: calc( 50% - 30px ); max-width: 480px; background: var(--primary-color); margin-right: 30px; text-align: center; padding: 35px 15px; } #wide-text section article .equal-heights .blue-box:last-child { float: right; margin-left: 30px; margin-right: 0px; } #wide-text section article .equal-heights .blue-box * { font-size: 15px; line-height: 1.6667; text-align: center; } #wide-text section article .equal-heights .blue-box a { color: #FFF; text-decoration: underline; } #wide-text section article .equal-heights .blue-box a:hover { color: var(--tertiary-color); } #wide-text section article .equal-heights .blue-box a[href*=tel] { text-decoration: none; } #wide-text section article .equal-heights .blue-box strong { font-family: var(--primary-font); color: #FFF; } #wide-text section article .equal-heights .blue-box h2 { color: #FFF; text-transform: none; margin-bottom: 30px; } #wide-text section article hr { margin: 50px 0px; border: none; border-top: 1px solid var(--tertiary-color); margin-bottom: 50px; max-width: 100%; } #accessibility-faqs section { max-width: 1044px; } #accessibility-faqs section details { max-width: 100%; margin: 0px 0px 50px; } #accessibility-faqs section details summary { background: var(--tertiary-color); height: 115px; text-align: center; } #accessibility-faqs section details { width: 100%; margin: 0px auto 50px; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; } #accessibility-faqs section details summary { position: relative; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 90px; color: #FFF; padding-left: 40px; padding-right: 20px; font-size: 18px; font-weight: 500; } #accessibility-faqs section details summary::-webkit-details-marker { display: none } #accessibility-faqs section details summary:before { content: "+"; color: var(--secondary-color); font-size: 30px; font-weight: 500; margin-left: 40px; position: absolute; right: 40px; } #accessibility-faqs section details[open] summary:before { content: "-" } #accessibility-faqs section details[open] { border: 2px solid var(--tertiary-color); } #accessibility-faqs section details article { max-width: 775px; margin: auto; padding: 50px 15px; font-size: 15px; color: #414042; text-align: center; } #accessibility-faqs section details article strong { font-family: var(--primary-font); font-weight: 500; } #accessibility-faqs section details article p a.cta { font-size: 15px; text-transform: none; font-weight: 500; display: -ms-inline-flexbox; display: -webkit-inline-flex; display: inline-flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 80px; margin: 0px 15px; } #accessibility-faqs section details article p a.cta:hover { color: var(--primary-font); } /* 404 */ #fourohfour { //* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c9e7ee+0,ffffff+56 */ background: rgb(201,231,238); /* Old browsers */ background: -moz-linear-gradient(top, rgba(201,231,238,1) 0%, rgba(255,255,255,1) 56%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(201,231,238,1) 0%,rgba(255,255,255,1) 56%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(201,231,238,1) 0%,rgba(255,255,255,1) 56%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9e7ee', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ text-align: center; padding-top: 85px; } #fourohfour h1 { color: var(--primary-color); font-size: 28px; font-weight: 500; font-family: var(--primary-font); margin-top: 20px; } #fourohfour h2 { font-family: var(--secondary-font); font-size: 20px; color: #414042; } #fourohfour a.cta { max-width: 199px; width: 100%; height: 65px; background: none; border: 1px solid #FFF; font-weight: 500; font-size: 15px; letter-spacing: 0.0ex; text-transform: none; padding: 0px; margin-bottom: 25px; color: #FFF; background: var(--primary-color); } #fourohfour a.cta:hover { background: var(--secondary-color); color:#FFF; } #fourohfour img { max-width: 100%; } /* Reports */ #reports section { max-width: 1074px; padding: 50px 15px; } #reports section h2 { font-size: 30px; position: relative; margin-bottom: 80px; font-weight: 600; text-transform: none; color: var(--primary-color); text-align: center; } #reports section h2:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; position: absolute; top: 60px; left: 50%; transform: translateX(-50%); } .covid-faq section details, #reports section details { max-width: 100%; margin: 0px 0px 30px; } .covid-faq section details summary, #reports section details summary { background: var(--primary-color); height: 115px; text-align: center; } .covid-faq section details, #reports section details { width: 100%; margin: 0px auto 24px; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; } #reports section details h3 { text-align: center; color: var(--primary-color); font-size: 18px; font-weight: 600; } .covid-faq section details summary, #reports section details summary { position: relative; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 90px; color: #FFF; padding-left: 40px; padding-right: 20px; font-size: 18px; font-weight: 500; } .covid-faq section details summary::-webkit-details-marker, #reports section details summary::-webkit-details-marker { display: none } .covid-faq section details summary:before, #reports section details summary:before { content: "+"; color: var(--secondary-color); font-size: 30px; font-weight: 500; margin-left: 40px; position: absolute; right: 40px; } .covid-faq section details[open] summary:before, #reports section details[open] summary:before { content: "-" } #reports section details[open] { border: 1px solid var(--tertiary-color); } .covid-faq section details[open], #reports section details ul { padding: 35px 0px; list-style-type: none; } #reports section details h3 + ul { padding-top: 5px; } #reports section details ul li { font-size: 15px; text-align: center; line-height: 2.5; } #reports section details ul li a { color: #414042; font-weight: 500; } #reports section details ul li a:hover { color: var(--primary-color); } #reports section details ul { max-width: 540px; margin-left: auto; margin-right: auto; } #reports section details p { max-width: 960px; padding-left: 30px; padding-right: 30px; margin-bottom: 15px; font-size: 15px; text-align: center; margin-left: auto; margin-right: auto; color: var(--font-color); font-family: var(--secondary-font); } #reports section details summary + p { padding-top: 30px; } /* Routes */ #schedules section { padding-left: 75px; padding-right: 75px; } #schedules .filter, #schedules .subtype, #schedules .routes, .routes .route, .routes .route dl { display: none; } #schedules .subtype.active, #schedules .filter.active, #schedules .routes.active, .routes .route.active, .routes .route dl.active { display: block; } #schedules section #schedule-display nav { display: none; } #schedules section #schedule-display nav #next { float: right; } #schedules section #schedule-display nav.active { display: block; } .routes .route { position: relative; overflow: hidden; height: 1200px; } .routes .route dl { position: absolute; transition: all .5s ease-in; width: 100%; } .routes .route dl.past { top: 0px; left: -100%; } .routes .route dl.present { top: 0px; left: 0px; } .routes .route dl.future { top: 0px; left: 100%; } .routes .route { width: 100%; } .routes .route dl { border: 5px solid var(--primary-color); margin-bottom: 50px; } .routes .route dl dt { color: #FFF; background: var(--primary-color); } .routes .route dl dt, .routes .route dl dd { padding: 10px; font-size: 18px; text-align: center; } .routes .route dl dd { color: var(--font-color); background: #FFF; } /* Transit Centers */ #transit-centers section { max-width: 1172px; } #transit-centers section .tabs { margin-bottom: 65px; } #transit-centers .tabs > ul { list-style-type: none; padding: 0px; display: block; border-bottom: 17px solid var(--primary-color); border-left: 1px solid var(--primary-color); } #transit-centers section .tabs > ul:after { clear: both; display: block; content: ""; } #transit-centers section .tabs > ul li { float: left; width: 19%; } #transit-centers section .tabs > ul li a { border: 1px solid var(--primary-color); display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 74px; text-decoration: none; color: var(--primary-color); text-transform: uppercase; font-size: 19px; letter-spacing: 0.2ex; border-bottom: 0px; } #transit-centers section .tabs > ul li a:hover { font-weight: 500; } #transit-centers section .tabs > ul li.ui-state-active a{ color: #FFF; font-weight: 600; background: var(--primary-color); } #transit-centers section .tabs .transit-tab { border: 1px solid var(--primary-color); padding: 30px; } #transit-centers section .tabs .transit-tab .tab-inner { max-width: 1056px; margin: auto; padding: 65px 0px; } #transit-centers section .tabs .transit-tab .tab-inner:after { content: ""; clear: both; display: block; } #transit-centers section .tabs .transit-tab .tab-inner aside { width: 100%; max-width: 390px; float: right; text-align: right; } #transit-centers section .tabs .transit-tab .tab-inner aside .tealbox { background: var(--tertiary-color); color: #FFF; text-align: center; max-width: 300px; width: 100%; display: inline-block; padding: 30px 50px; font-family: var(--secondary-font); } #transit-centers section .tabs .transit-tab .tab-inner aside .tealbox p { font-size: 15px; margin-bottom: 15px; line-height: 1.5; } #transit-centers section .tabs .transit-tab .tab-inner aside .tealbox a.cta { background: var(--tertiary-color); color: #FFF; border: 2px solid #FFF; font-size: 12.32px; font-weight: 500; width: 160px; height: 45px; margin-top: 15px; } #transit-centers section .tabs .transit-tab .tab-inner aside .tealbox a.cta:hover { background: #FFF; color: var(--tertiary-color); } #transit-centers section .tabs .transit-tab .tab-inner article { width: calc( 100% - 390px ); float: left; } #transit-centers section .tabs .transit-tab .tab-inner details { padding: 20px 40px; border-bottom: 1px solid #d8f0f4; } #transit-centers section .tabs .transit-tab .tab-inner details:after { clear: both; display: block; content: ""; } #transit-centers section .tabs .transit-tab .tab-inner details summary { color: var(--primary-color); font-size: 16px; font-family: var(--primary-font); position: relative; font-weight: 500; } #transit-centers section .tabs .transit-tab .tab-inner details > summary:before { content: "+"; position: absolute; left: -25px; } #transit-centers section .tabs .transit-tab .tab-inner details[open] > summary { color: var(--tertiary-color); } #transit-centers section .tabs .transit-tab .tab-inner details[open] > summary:before { content: "-"; } #transit-centers section .tabs .transit-tab .tab-inner details > summary::-webkit-details-marker { display: none; } #transit-centers section .tabs .transit-tab .tab-inner details > address { float: right; display: inline-block; font-family: var(--secondary-font); font-size: 15px; color: #414042; position: relative; top: -25px; } #transit-centers section .tabs .transit-tab .tab-inner details > article { display: block; width: 100%!important; } #transit-centers section .tabs .transit-tab .tab-inner details:last-child { border-bottom: 0px; } #transit-centers section .tabs .transit-tab .tab-inner details.large-bar { padding: 0px; max-width: 665px; border-bottom: 0px; } #transit-centers section .tabs .transit-tab .tab-inner details.large-bar > summary { width: 100%; height: 75px; text-align: left; padding-left: 35px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background: var(--primary-color); color: #FFF; font-size: 18px; } #transit-centers section .tabs .transit-tab .tab-inner details.large-bar > summary:before { left: auto!important; color: var(--secondary-color); right: 28px; font-size: 28px; } #transit-centers section .tabs .transit-tab .tab-inner details details { margin: 30px 15px; } #parking section { padding: 20px 15px; max-width: 1070px; } #parking section h2 { text-align: center; color: var(--primary-color); font-size: 24px; font-weight: 600; line-height: 1.6667; padding: 50px 0px 70px;; letter-spacing: 0.03ex; display: block; } #parking section details { padding: 0px; border-bottom: 0px; border: 1px solid var(--tertiary-color); margin-bottom: 30px; } #parking section details > summary { width: 100%; height: 85px; text-align: left; padding-left: 35px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background: var(--tertiary-color); color: #FFF; font-size: 18px; position: relative; font-weight: 500; letter-spacing: 0.03ex; } #parking section details > summary:before { content: "+"; position: absolute; color: var(--secondary-color); right: 28px; font-size: 28px; } #parking section details > summary::-webkit-details-marker { display: none; } #parking section details[open] > summary:before { content: "-" } #parking section details article { padding: 40px; } #parking section details article p, #parking section details article li { margin-bottom: 15px; line-height: 1.6667 } #vehicle-notice section { max-width: 775px; margin: 50px auto; border: 2px solid var(--primary-color); padding: 60px 45px; position: relative; font-size: 15px; font-family: var(--secondary-font); color: #414042; line-height: 1.6667; } #vehicle-notice section figure { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 85px; height: 85px; border-radius: 50%; background: var(--primary-color); border: 8px solid #99b7dd; position: absolute; top: 0px; left: 0px; transform: translateX(-50%) translateY(-50%); } #vehicle-notice section figure img { width: 70px; height: 70px; margin-top: -3px; } #vehicle-notice section h3 { color: var(--primary-color); font-size: 24px; font-weight: 500; margin-bottom: 15px; font-family: var(--primary-font); } #vehicle-notice section ul { padding: 0px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; padding: 40px 0px 0px; list-style-type: none; font-size: 18px; color: var(--primary-color); font-size: 18px; font-family: var(--primary-font); } #vehicle-notice section ul li { font-weight: 500; } /* Bottom Halves */ #bottom-halves section { max-width: 1164px; padding-top: 60px; padding-bottom: 60px; } #bottom-halves section article { max-width: 500px; width: 60%; float: left } #bottom-halves section article h1, #bottom-halves section article h2 { font-size: 24px; text-transform: none; } #bottom-halves section article ul li { line-height: 2; } #bottom-halves section article ul li strong { color: #414042; font-weight: 500; font-family: var(--primary-font); } #bottom-halves section article ul li strong:after { content : " - "; font-weight: 300; } #bottom-halves section aside { width: 40%; max-width: calc( 100% - 500px ); float: right; text-align: center; background-position: center; background-size: contain; background-repeat: no-repeat; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #bottom-halves section aside h1 { font-size: 24px; font-weight: 500; color: var(--primary-color); margin-bottom: 24px; } #bottom-halves section aside a.cta { border: 2px solid var(--primary-color); background: none; color: var(--primary-color); font-size: 15px; text-transform: none; width: 225px; height: 67px; font-weight: 500; margin-left: 10px; margin-right: 10px; } #bottom-halves section aside a.cta:hover { color: #FFF; background: var(--primary-color); } #bottom-halves section aside a:hover img { opacity: .5 } #bottom-halves section aside > div { width: 100%; color: var(--primary-color); margin-top: 50px; margin-bottom: 50px; } #bottom-halves section aside > div img { margin-top: 20px; max-width: 100px; margin-right: 15px; } #bottom-halves section aside > div h2 { font-size: 30px; font-weight: 300; } #bottom-halves section aside > div h2 a { color: var(--primary-color); text-decoration: none; font-weight: 500; } #bottom-halves section aside > div h2 a:hover { color: var(--secondary-color); } #bottom-halves section aside > div hr { border: none; border-bottom: 3px solid var(--primary-color); } /* Form Settings */ ::-webkit-input-placeholder { color: var(--secondary-color); } :-moz-placeholder { color: var(--secondary-color); } ::-moz-placeholder { color: var(--secondary-color); } :-ms-input-placeholder { color: var(--secondary-color); } input:focus::-webkit-input-placeholder { color:transparent; } input:focus:-moz-placeholder { color:transparent; } input:focus::-moz-placeholder { color:transparent; } input:focus:-ms-input-placeholder { color:transparent; } input[type=radio] { width: 20px; padding-bottom: 100%; display: inline-block; border-width: 2px; border-style: solid; border-color: var(--primary-color); position: relative; border-radius: 50%; } input[type=radio]:checked:after { content: ""; position: absolute; top: 3px; left: 3px; width: 10px; display: block; padding-bottom: 10px; background-color: var(--primary-color); border-radius: 50%; } input[type=checkbox] { width: 20px; padding-bottom: 100%; display: inline-block; border-width: 2px; border-style: solid; border-color: var(--primary-color); position: absolute; } input[type=checkbox]:checked:after { content: "✔"; position: absolute; top: 5px; left: 5px; color: var(--primary-color); } textarea, input[type=search], input[type=number], input[type=email], select, input[type=date], input[type=text] { font-family: var(--primary-font); width: 100%; height: 50px; padding-left: 15px; border-width: 1px; border-style: solid; border-color: var(--primary-color); font-size: var(--standard-font-size); margin-bottom: var(--standard-font-size) } .select-wrapper { position: relative; } .select-wrapper:after { position: absolute; top: 0px; right: 0px; width: 50px; height: 50px; display: -webkit-flexbox; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; content: "\f0d7"; font-family: 'Font Awesome 5 Free'; font-weight: 900; } select { padding-right: 50px; } textarea { height: 100px; padding-top: 15px; } input[type=submit], button, input[type=button] { font-family: var(--primary-font); } /* Board of Directors */ #board-of-directors section { max-width: 1240px; } #board-of-directors section ul { padding: 0px; list-style-type: none; } #board-of-directors section ul li.board-member { width: 50%; padding-top: 10px; padding-right: 50px; min-height: 350px; float: left; } #board-of-directors section ul li.board-member:nth-child(even) { border-left: 1px solid var(--tertiary-color); } #board-of-directors section ul li.board-member figure { width: 260px; float: left; text-align: center; font-size: 15px; color: var(--primary-color); } #board-of-directors section ul li.board-member figure img { display: block; margin: auto; max-width: 165px; margin-bottom: 10px; } #board-of-directors section ul li.board-member figure h4 { font-size: 12px; } #board-of-directors section ul li.board-member .details { float: left; width: calc( 100% - 260px ); font-size: 15px; line-height: 1.25; padding-bottom: 65px; } #board-of-directors section ul li.board-member .details p { margin-bottom: 15px; font-family: var( --secondary-font ); color: #414042; } #board-of-directors section ul li.board-member .details h5 { font-weight: bold; margin-bottom: 15px; color: #414042; } #board-of-directors section ul li.board-member .details a { color: #414042; text-decoration: none; } #board-of-directors section ul li.board-member .details a[href^="mailto:"]:before { font-family: 'Font Awesome 5 Free'; content: "\f0e0"; color: var(--primary-color); margin-right: 5px; font-weight: 400; } #board-of-directors section ul li.board-member .details a[href^="mailto:"]:hover { color: var(--secondary-color); } #board-of-directors section ul li.board-member .details a[href^="tel:"]:before { font-family: 'Font Awesome 5 Free'; content: "\f095"; color: var(--primary-color); margin-right: 5px; font-weight: 900; transform: rotate(90deg); position: relative; display: inline-block; } a[href^="tel:"] { color: inherit; text-decoration: none; } #alternates { background: var(--tertiary-color); color: #FFF; margin-top: 70px; } #alternates section { padding: 60px 0px; color: #FFF; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #alternates section h2 { font-size: 30px; position: relative; margin-bottom: 20px; font-weight: 600; text-transform: none; width: 275px; letter-spacing: 0.2ex } #alternates section h2:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; left: 0px; margin-top: 20px; display: block; } #alternates section ul { padding: 0px; list-style-type: none; font-family: var(--secondary-font); font-weight: 300; line-height: 2.5; font-size: 15px; } #calendar-dates section { max-width: 1076px; padding: 80px 15px; } #calendar-dates details { max-width: 100%; margin: 0px 0px 30px; } #calendar-dates section details summary { background: var(--primary-color); height: 115px; text-align: center; } #calendar-dates section details { width: 100%; margin: 0px auto 24px; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; border: 2px solid var(--primary-color); } #calendar-dates section details summary { position: relative; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 90px; color: #FFF; padding-left: 40px; padding-right: 20px; font-size: 18px; font-weight: 500; } #calendar-dates section details summary::-webkit-details-marker { display: none } #calendar-dates section details summary:before { content: "+"; color: var(--secondary-color); font-size: 30px; font-weight: 500; margin-left: 40px; position: absolute; right: 40px; } #calendar-dates section details[open] summary:before { content: "-" } #calendar-dates section details article { text-align: center; padding: 35px; color: #414042; } #calendar-dates section details article a { color: #414042; text-decoration: underline; } table { width: 100%; border-spacing: 0px; } #calendar-dates section details table thead th, #calendar-dates section details table tbody td { width: 232px; text-align: center; border-right: 1px solid var(--primary-color); border-top: 1px solid var(--primary-color); height: 90px; padding: 0px; color: var(--primary-color); font-size: 15px; font-weight: 200; }afagaqff2 #calendar-dates section details table thead th span { font-size: 16px; display: block; letter-spacing: 0.0ex; } #calendar-dates section details table tbody td { height: 100px; } #calendar-dates section details table thead th { border-bottom: 20px solid var(--primary-color); } #calendar-dates section details table tbody tr td:first-child, #calendar-dates section details table thead th { font-family: var(--secondary-font); font-size: 19px; font-weight: 500; letter-spacing: 0.2ex; line-height: 1; } #calendar-dates section details table thead tr th:last-child, #calendar-dates section details table tbody tr td:last-child { border-right: 0px; } #ordinances { margin-bottom: 150px; } #ordinances section { max-width: 1046px; background: var(--primary-color); color: #FFF; padding: 60px 0px; color: #FFF; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 70px 50px; } #ordinances section h2 { font-size: 30px; position: relative; margin-bottom: 20px; font-weight: 600; text-transform: none; width: 300px; letter-spacing: 0.2ex; min-width: 300px; } #ordinances section h2:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; display: block; margin-top: 20px; } #ordinances section ul { padding: 0px; list-style-type: none; font-family: var(--secondary-font); font-weight: 300; line-height: 1.75; font-size: 15px; } #ordinances section ul strong { color: #FFF; font-family: var(--primary-font); font-weight: 500; } #ordinances section ul li { break-inside: avoid-column; margin-bottom: 15px; } #ordinances section ul a { color: #FFF; } #ordinances section ul a:hover { color: var(--tertiary-color); } /* Teal centered text */ #centered-content section { max-width: 1170px; padding: 0px 30px; margin-top: -30px; } #centered-content section article { text-align: center; max-width: 925px; margin: auto; color: #414042; } #centered-content section article strong { font-family: var(--primary-font); font-weight: 500; } #centered-content section article * { line-height: 1.6667; margin-bottom: 15px; } #centered-content section article h2 { font-weight: 500; text-transform: none; } #centered-content section article hr { border: none; border-top: 1px solid var(--tertiary-color); width: calc( 100% + 185px ); margin-left: -92.5px; margin-top: 35px; margin-bottom: 35px; } #centered-content section article ol[type*=A] { list-style: none; counter-reset: list; text-align: left; margin: 45px 25px; } #centered-content section article ol[type*=A] li { padding-left: 0px; text-indent: -20px; } #centered-content section article ol[type*=A] li:before { counter-increment:list; content:counter(list, upper-alpha) ". "; font-weight: 500; font-family: var(--primary-font); position: relative; left: -10px; } #centered-content section article h3 { color: var(--tertiary-color); font-family: var(--primary-font); font-size: 24px; font-weight: 500; padding-bottom: 45px; margin-bottom: 30px; position: relative; } #centered-content section article h3:after { content: ""; position: absolute; bottom: 0px; left: 50%; width: 80px; height: 12px; background: var(--secondary-color); display: inline-block; transform: translateX(-50%) } #centered-content.big-titles { margin-bottom: 150px; } #centered-content.big-titles h1 { font-size: 24px; position: relative; margin-bottom: 30px; font-weight: 500; text-transform: none; text-align: center; color: var(--primary-color); margin-top: 50px; padding-bottom: 25px } #centered-content.big-titles h1:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; position: absolute; bottom: 0px; left: 50%; display: inline-block; transform: translateX(-50%); } #centered-content.big-titles ol { counter-reset: item; } #centered-content.big-titles ol > li { padding: 0 0 0 10px; text-indent: -16px;list-style-type: none;counter-increment: item; } #centered-content.big-titles ol > li:before { display: inline-block; width: 1em; padding-right: 0.5em; font-weight: bold; text-align: right; content: counter(item) "."; } #centered-content.big-titles article p a.cta { color: var(--font-color); border: 2px solid var(--tertiary-color); font-size: 15px; font-weight: 500; font-family: var(--primary-font); width: 230px; height: 75px; background: none; margin: 20px auto; text-transform: none; } #centered-content.big-titles article p a.cta:hover { background: var(--tertiary-color); color: #FFF; } /* Contact Boxes */ #contact-boxes section { max-width: 1200px; padding: 30px 30px; color: #414042; } #contact-boxes section ul { padding: 0px; list-style-type: none; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } #contact-boxes section ul li { width: 320px; text-align: center; font-family: var(--secondary-font); font-size: 15px; line-height: 1.6667; } #contact-boxes section ul li svg { width: 75px; height: 75px; margin-bottom: 10px; } #contact-boxes section ul li svg .st0 { fill: var(--primary-color); } #contact-boxes section ul li h4 { font-size: 24px; font-family: var(--primary-font); font-weight: 500; color: var(--primary-color); margin-bottom: 20px; position: relative; padding-bottom: 15px; } #contact-boxes section ul li p { margin-bottom: 15px; } #contact-boxes section ul li strong { font-weight: 500; font-family: var(--primary-font); } #contact-boxes section ul li a { color: var(--primary-color); text-decoration: none; } #contact-boxes section ul li a:hover { color: var(--secondary-color); } #contact-boxes section ul li a[href*=tel] { color: var(--font-color); } #contact-boxes.big-titles h4 { margin-bottom: 45px; } #contact-boxes.big-titles h4:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; position: absolute; bottom: 0px; left: 50%; display: inline-block; transform: translateX(-50%); } #contact-boxes.big-titles ul { -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: flex-end; -ms-flex-line-pack: end; align-content: flex-end; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #contact-boxes.big-titles .bluebox { border: 2px solid var(--primary-color); padding: 20px 0px; } #contact-boxes.big-titles .bluebox h5 { color: var(--primary-color); font-family: var(--primary-font); font-weight: 500; font-size: 15px; margin-bottom: 15px; } details[open] summary:after { transform: none!important; } .page-template-sitemap-page #header-title h1 { color: var(--primary-color); font-family: var(--primary-font); text-align: center; font-size: 40px; font-weight: 500; padding: 50px 0px; } .sitemap section { max-width: 1014px; } .sitemap section article ul { list-style-type: none; } .sitemap section article > .menu-sitemap-container > ul { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; padding: 0px; line-height: 1.6667; } .sitemap section article > .menu-sitemap-container > ul > li { padding: 0px; max-width: 33%; width: 100%; margin-bottom: 85px; } .sitemap section article > .menu-sitemap-container > ul > li > a { pointer-events: none; font-family: var(--primary-font); color: var(--primary-color); font-size: 18px; font-weight: 500; text-decoration: none; display: block; letter-spacing: 0.03ex; margin-bottom: 10px; } .sitemap section article > .menu-sitemap-container > ul > li > ul { display: block; padding: 0px; } .sitemap section article > .menu-sitemap-container > ul > li > ul > li { margin-bottom: 10px; } .sitemap section article > .menu-sitemap-container > ul > li > ul > li a { color: var(--font-color); font-family: var(--secondary-font); font-size: 15px; text-decoration: none; letter-spacing: 0.03ex; } .sitemap section article > .menu-sitemap-container > ul > li > ul > li > a:hover { font-weight: 500; color: var(--tertiary-color); } .bg picture { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } .bg picture source { position: absolute; z-index: -1; bottom: 50%; right: 50%; transform: translateX(50%) translateY(50%); -webkit-transform: translateX(50%) translateY(50%); min-width: 100%; min-height: 100%; width: auto; height: auto; display: block; max-width: initial; } .page-template-contact-page main input[type=text], .page-template-contact-page main input[type=date], .page-template-contact-page main input[type=tel], .page-template-contact-page main input[type=email], .page-template-contact-page main textarea, .page-template-contact-page main select { width: 100%; height: 80px; border: 1px solid #92cbd7; font-size: 18px; padding-left: 36px; margin-bottom: 25px; background: none; border-radius: 0px; font-family: var(--secondary-font); color: #414042; } .page-template-contact-page main form { max-width: 920px; margin: 50px auto 90px; } .page-template-contact-page main form:after { content: ""; clear: both; display: block; } .page-template-contact-page main form .box-1-2 { padding: 0px 38px 0px 0px; } .page-template-contact-page main form .box-1-2 + .box-1-2 { padding: 0px 0px 0px 38px; } .page-template-contact-page main .half { width: calc( 50% - 12px ); margin-right: 24px; float: left; } .page-template-contact-page main .half + .half { margin-right: 0px; } .page-template-contact-page main div.comments { width: calc( 100% - 220px ); float: left; height: 465px; } .page-template-contact-page main div.comments textarea { height: 465px; } .page-template-contact-page main div.comments + .send { height: 465px; float: left; width: 220px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } .page-template-contact-page main form input[type=submit] { width: 165px; height: 85px; background: var(--primary-color); color: #FFF; border: none; font-family: var(--primary-font); font-size: 18px; font-weight: 500; cursor: pointer; } .page-template-contact-page main form input[type=submit]:hover { background: var(--secondary-color); } .page-template-contact-page main input::-webkit-input-placeholder { color: #414042; } .page-template-contact-page main input:-moz-placeholder { color: #414042; } .page-template-contact-page main input::-moz-placeholder { color: #414042; } .page-template-contact-page main input:-ms-input-placeholder { color: #414042; } .page-template-contact-page main textarea::-webkit-input-placeholder { color: #414042; } .page-template-contact-page main textarea:-moz-placeholder { color: #414042; } .page-template-contact-page main textarea::-moz-placeholder { color: #414042; } .page-template-contact-page main textarea:-ms-input-placeholder { color: #414042; } #contact-tabs h2, #contact-form h2 { font-family: var(--primary-font); font-size: 27px; color: var(--primary-color); font-weight: 600; text-align: center; margin: 50px auto 0px auto; } #contact-tabs h2:after, #contact-form h2:after { content: ""; display: block; margin: 25px auto; width: 50px; height: 12px; background: var(--secondary-color); } #contact-tabs h2 + p, #contact-form h2 + p { max-width: 575px; margin: 0px auto; font-family: var(--secondary-font); color: #414042; /*font-size: 18px;*/ } #contact-form + hr + .accordions section { max-width: 1074px; padding: 85px 15px; } #contact-form + hr + .accordions details { margin-bottom: 55px; } #contact-form + hr + .accordions details summary { position: relative; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 90px; color: #FFF; padding-left: 40px; padding-right: 40px; font-size: 18px; font-weight: 500; background: var(--tertiary-color); } #contact-form + hr + .accordions details summary::-webkit-details-marker { display: none } #contact-form + hr + .accordions details summary:before { content: "+"; color: var(--secondary-color); font-size: 30px; font-weight: 500; margin-left: 40px; position: absolute; right: 40px; } #contact-form + hr + .accordions details[open] summary:before { content: "-" } #contact-form + hr + .accordions details[open] { border: 1px solid var(--tertiary-color); } #contact-form + hr + .accordions details article { padding: 50px 30px; } #contact-form + hr + .accordions details article h2 { font-weight: 500; } div.wpcf7-mail-sent-ok { margin: -15px; } #contact-tabs section { max-width: 1074px; padding: 85px 15px; } #contact-tabs section > ul { list-style-type: none; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; padding: 0px; } #contact-tabs section > ul li { padding-left: 25px; padding-right: 25px; } #contact-tabs section > ul li a { text-decoration: none; text-align: center; font-size: 12px; } #contact-tabs section > ul li a .button-tab { width: 165px; height: 85px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; margin-left: 15px; margin-right: 15px; } #contact-tabs section > ul li a .button-tab:before { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: var(--primary-color); opacity: .85; content: ""; } #contact-tabs section > ul li.ui-state-active a .button-tab:before, #contact-tabs section > ul li a:hover .button-tab:before { background-color: var(--tertiary-color); } #contact-tabs section > ul li a .button-tab strong { display: block; color: #FFF; text-align: center; position: relative; z-index: 1; font-size: 16px; } #contact-tabs section > ul li a p { font-family: var(--secondary-font); font-size: var(--standard-font-size); margin-bottom: var(--standard-font-size); line-height: var(--line-height); color: var(--font-color); margin-top: 15px; } #contact-tabs section iframe { width: 100%; border: none; height: 1480px; } .iframer { width: 100%; max-width: 1130px; height: 100vh; border: none; display: block; margin: 0px auto 40px; } .page-template-contact-page #key-contacts table { border: 1px solid var(--primary-color); border-right: 0px; border-bottom: 0px; } .page-template-contact-page #key-contacts table th, .page-template-contact-page #key-contacts table td { border-right: 1px solid var(--primary-color); border-bottom: 1px solid var(--primary-color); height: 72px; text-align: center; width: 25%; color: var(--primary-color); padding-left: 15px; padding-right: 15px; } .page-template-contact-page #key-contacts table td a { color: var(--primary-color); text-decoration: none; } .page-template-contact-page #key-contacts table td a:hover { color: var(--secondary-color); } .page-template-contact-page #key-contacts table th { font-family: var(--primary-font); font-size: 19px; text-transform: uppercase; font-weight: 500; letter-spacing: 0.3ex; border-bottom: 10px solid var(--primary-color); } .page-template-contact-page #key-contacts table tr td:nth-child(1) { text-transform: uppercase; } .page-template-contact-page #key-contacts table tr td:nth-child(2) { font-weight: 500; } .page-template-contact-page #key-contacts table tr td:nth-child(3), .page-template-contact-page #key-contacts table tr td:nth-child(4) { font-family: var(--secondary-font); font-size: 15px; } .page-template-contact-page #public-records-request form { max-width: 490px; float: right; margin-top: 0px; margin-bottom: 0px; } .page-template-contact-page #public-records-request form legend { display: block; text-align: center; margin: 30px auto; } .page-template-contact-page #public-records-request form label { max-width: 260px; width: 100%; float: left; padding: 0px 25px; } .page-template-contact-page #public-records-request form label + br { display: none; } .page-template-contact-page #public-records-request form input[type=radio] { width: 18px; height: 18px; border: 1px solid var(--tertiary-color); padding-bottom: 0px; } .page-template-contact-page #public-records-request form textarea { height: 295px; } .page-template-contact-page main #public-records-request form input[type=submit] { width: 215px; margin: 50px 0px 0px 25px; } .wpcf7-form-control-wrap.typerequest, .wpcf7-form-control-wrap.litigation { width: calc( 100% - 260px ); float: left; margin-bottom: 20px; } .wpcf7-form-control.wpcf7-radio { display: block; width: 100%; } .wpcf7-list-item { display: block; width: 100%; margin-bottom: 15px; } .wpcf7-list-item-label { padding-left: 15px; position: relative; top: -3px; } /* Newsroom */ #newsbox section { max-width: 1275px; padding: 50px 15px; } #newsbox section .latest-news { float: left; width: 100%; max-width: 715px; border: 1px solid var(--tertiary-color); } #newsbox section .latest-news .title { background: var(--primary-color); color: #FFF; height: 60px; padding-left: 45px; padding-right: 15px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #newsbox section .latest-news .title h2 { font-size: 25px; font-weight: 500; } #newsbox section .latest-news .news-results { height: 745px; overflow-y: scroll; } #newsbox section .latest-news #searchform input { margin-bottom: 0px; height: 18px; background: none; border-bottom: 1px solid #FFF; padding-left: 0px; font-size: 15px; font-family: var(--secondary-font); width: 155px; color: #FFF; } #newsbox section .latest-news #searchform:after { content: ""; font-family: 'Font Awesome 5 Free'; color: var(--secondary-color); font-weight: bold; display: inline-block; } #newsbox section .latest-news #searchform input::-webkit-input-placeholder { color: #FFF } #newsbox section .latest-news #searchform input:-moz-placeholder { color: #FFF } #newsbox section .latest-news #searchform input::-moz-placeholder { color: #FFF } #newsbox section .latest-news #searchform input:-ms-input-placeholder { color: #FFF } #newsbox section .latest-news .news-results::-webkit-scrollbar { width: 8px; } #newsbox section .latest-news .news-results::-webkit-scrollbar-track { background: #92cbd7; border-radius: 0px; } #newsbox section .latest-news .news-results::-webkit-scrollbar-thumb { background: #54a2b5; border-radius: 3px; } #newsbox section .latest-news .news-results::-webkit-scrollbar-thumb:hover { } #newsbox section .latest-news .news-results ul { padding: 0px 35px; } #newsbox section .latest-news .news-results li { height: 165px; padding: 40px 15px 0px; list-style-type: none; border-bottom: 1px solid var(--tertiary-color); padding-bottom: 40px; transition: all .25s; position: relative; } #newsbox section .latest-news .news-results li a.overbutton { opacity: 0; top: 0px; left: 0px; position: absolute; width: 100%; height: 100%; } #newsbox section .latest-news .news-results li figure { width: 90px; height: 90px; float: left; z-index: 1; } #newsbox section .latest-news .news-results li * { transition: all .25s; } #newsbox section .latest-news .news-results li figure.bg img.desktopbg { max-height: 90px; } #newsbox section .latest-news .news-results li figure.bg:before { background: #FFF; position: absolute; z-index: -2; width: 100%; height: 100%; top: 0px; left: 0px; content: ""; } #newsbox section .latest-news .news-results li figcaption { width: calc( 100% - 90px ); padding: 15px 40px; float: left; } #newsbox section .latest-news .news-results li figcaption time { font-family: var(--secondary-font); font-size: 15px; display: block; margin-bottom: 15px; } #newsbox section .latest-news .news-results li figcaption h3 { font-size: 15px; } #newsbox section .latest-news .news-results li figcaption h3 a { color: var(--font-color); font-weight: 500; text-decoration: none; } #newsbox section .latest-news .news-results li:after{ display: block; content: ""; clear: both; } #newsbox section .latest-news .news-results li:hover { padding: 0px; background: var(--tertiary-color); } #newsbox section .latest-news .news-results li:hover figure { width: 165px; height: 165px; } #newsbox section .latest-news .news-results li:hover figcaption { width: calc( 100% - 165px ); padding: 40px 20px 0px 50px; } #newsbox section .latest-news .news-results li:hover figcaption time { font-family: var(--secondary-font); color: #FFF; font-weight: 500; } #newsbox section .latest-news .news-results li:hover figcaption h3 a { font-size: 20px; color: #FFF; } #newsbox section .latest-news .news-results .alm-load-more-btn.more { color: var(--font-color); border: 2px solid var(--tertiary-color); font-size: 15px; font-weight: 500; font-family: var(--primary-font); width: 230px; height: 75px; background: none; margin: 20px auto; text-transform: none; } #newsbox section .latest-news .news-results .alm-load-more-btn.more:hover { background: var(--tertiary-color); color: #FFF; } #newsbox section .latest-news .news-results .alm-btn-wrap { text-align: center; } #newsbox section .media-relations { max-width: 425px; width: calc( 100% - 715px ); float: right; } #newsbox section .media-relations article { padding: 15px; } #newsbox section .media-relations article h2 { font-size: 25px; } #newsbox section .media-relations article h2:after { content: ""; width: 50px; height: 10px; background: var(--secondary-color); margin: 10px 0px; display: block;} #newsbox section .media-relations article strong a { font-family: var(--primary-font); font-weight: 500; font-size: 14px; color: var(--font-color); text-decoration: none; } #newsbox section .media-relations article strong a[href^="mailto:"]:before { content: ""; position: relative; color: var(--primary-color); font-family: 'Font Awesome 5 Free'; font-weight: bold; display: inline-block; font-size: 19px; margin-right: 10px; } #newsbox section .media-relations article div.phone:before { content: ""; position: relative; color: var(--primary-color); font-family: 'Font Awesome 5 Free'; font-weight: bold; display: inline-block; font-size: 19px; margin-right: 10px; transform: rotate(90deg); float: left; margin-top: 14px; } #newsbox section .media-relations article a.cta { float: right; width: 155px; height: 60px; border: 2px solid var(--primary-color); color: var(--primary-color); font-size: 15px; font-weight: 600; background: none; text-align: center; position: relative; top: -70px; margin-bottom: 0px; } #newsbox section .media-relations article a.cta:hover { background: var(--primary-color); color: #FFF; } #newsbox section .media-relations article:after { content: ""; clear: both; display: block; } #newsbox section .media-relations .media-safety { margin-top: 40px; max-width: 375px; width: 100%; float: right; border: 1px solid var(--primary-color); text-align: center; position: relative; } #newsbox section .media-relations .media-safety figure { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 85px; height: 85px; border-radius: 50%; background: var(--primary-color); position: absolute; top: 0px; left: 0px; transform: translateX(-50%) translateY(-50%); } #newsbox section .media-relations .media-safety figure svg { width: 40px; height: 40px; } #newsbox section .media-relations .media-safety article { width: 230px; margin: auto; padding: 40px 15px; font-family: var(--primary-font); } #newsbox section .media-relations .media-safety article h3 { font-size: 25px; font-weight: 500; color: var(--primary-color); font-family: var(--primary-font); } #newsbox section .media-relations .media-safety article P { font-family: var(--primary-font); margin-bottom: 0px; font-weight: 500; } #news-post section { max-width: 1245px; border-top: 1px solid var(--tertiary-color); padding: 80px 50px 0px; } #news-post section h1.page-title { font-size: 40px; color: var(--primary-color); line-height: 1.25; margin-bottom: 20px; } #news-post section time { font-family: var(--secondary-font); font-size: 18px; display: block; margin-bottom: 40px; } #news-post section figure.bg { width: 100%; padding-bottom: 35.8%; margin-bottom: 40px; } #news-post section article { max-width: 970px; padding: 30px 15px; margin: auto; } #news-post section nav.pagination { border-top: 1px solid var(--tertiary-color); padding: 40px 0px 0px; } #news-post section nav.pagination a { font-family: var(--secondary-font); font-size: 15px; color: var(--font-color); } #news-post section nav.pagination a strong { color: var(--primary-color); font-family: var(--primary-font); font-weight: 500; margin: 0px 10px; display: inline-block; } #news-post section nav.pagination a:first-child { float: left; } #news-post section nav.pagination a:last-child { float: right; } /* Careers Page */ #job-blue-box section { max-width: 1132px; padding: 0px; background: var(--primary-color); } #job-blue-box section figure { position: relative; } #job-blue-box section figure img { display: block; } #job-blue-box section figure:after { position: absolute; content: ""; top: 0px; right: 0px; width: 40px; height: 100%; background: var(--primary-color); opacity: .4; } #job-blue-box section .equal-heights:after { display: none; } #job-blue-box section figcaption { color: #FFF; background: var(--primary-color); width: 100%; } #job-blue-box section figcaption h1 { max-width: 280px; font-size: 30px; text-align: left; line-height: 1.5; font-weight: 500; } #job-blue-box section figcaption h1 a { color: #FFF; text-decoration: none; } #job-blue-box section figcaption h1 a:hover { color: var(--secondary-color); } #blue-links-bar section { max-width: 1270px; padding: 40px 15px 0px; } #blue-links-bar .blue-box { background: var(--primary-color); display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: center; padding: 30px 15px; } #blue-links-bar .blue-box p { font-size: 15px; font-family: var(--secondary-font); max-width: 230px; width: 100%; color: #FFF; } #blue-links-bar .blue-box a.cta { max-width: 230px; width: 100%; height: 70px; border: 2px solid #FFF; font-family: var(--primary-font); font-size: 15px; } #job-listings section { max-width: 900px; padding: 90px 15px; } #job-listings section ul { padding: 0px; list-style-type: none; } #job-listings section ul li { margin-bottom: 40px; } #job-listings section ul li h4 { font-size: 18px; color: var(--primary-color); font-weight: 500; text-align :center; margin-bottom: 10px; } #job-listings section ul li p { font-family: var(--secondary-font); } #career-bottom section { max-width: 1275px; padding: 30px 15px 0px; } #career-bottom section .blue-box { background: var(--primary-color); } #career-bottom section article { width: calc( 100% - 215px ); float: left; color: #FFF; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #career-bottom section article * { max-width: 880px; color: #FFF; } #career-bottom section article h3 { font-size: 18px; font-family: var(--primary-font); font-weight: 500; } #career-bottom section figure { width: 343px; height: 205px; float: right; z-index: 1; position: relative; } #career-bottom section figure:after { position: absolute; content: ""; top: 0px; left: 0px; width: 20px; height: 100%; background: var(--primary-color); opacity: .4; z-index: 2 } /* More sections */ #intro + #right-blue { margin-top: 75px; } #right-blue section { max-width: 1172px; padding: 15px; } #right-blue section figure { position: relative; max-width: calc( 100% - 500px ); overflow: hidden; } #right-blue section figure img { display: block; } #right-blue section figure:after { content: ""; width: 40px; height: 100%; display: block; background: var(--primary-color); position: absolute; top: 0px; right: 0px; opacity: .4; } #right-blue section .equal-heights { background: var(--primary-color); } #right-blue section .blue-box article { color: #FFF; max-width: 360px; padding: 30px 15px; } #right-blue section .blue-box article * { color: #FFF; } #right-blue section .blue-box article h2 { font-size: 30px; } #right-blue section .blue-box article strong { font-family: var(--primary-font); font-weight: 500; } #small-halves section { max-width: 1140px; padding: 60px 15px; } #small-halves section .box-1-2:first-child article { margin: auto; max-width: 420px; padding: 0px 15px; } #small-halves section .box-1-2:first-child article strong { font-family: var(--primary-font); font-weight: 500; } #small-halves section .box-1-2:first-child article h2 { font-size: 27px; } #small-halves section .box-1-2:last-child { padding: 0px; margin: 15px 0px; border: 1px solid var(--tertiary-color); } #small-halves section .box-1-2:last-child .newsbox { max-width: 450px; padding: 50px 0px; margin: auto; } #small-halves section .box-1-2:last-child .newsbox:after { content: ""; clear: both; display: block; } #small-halves section .box-1-2:last-child .newsbox article { width: 50%; float: left; } #small-halves section .box-1-2:last-child .newsbox article p { color: var(--tertiary-color); font-family: var(--primary-font); font-size: 17px; font-weight: 500; } #small-halves section .box-1-2:last-child .newsbox div p { color: #004cab; font-family: var(--secondary-font); font-size: 15px; margin-bottom: 20px; } #small-halves section .box-1-2:last-child .newsbox div a.cta { width: 190px; height: 70px; font-size: 15px; font-family: var(--primary-font); color: #FFF; background: var(--tertiary-color); border: 1px solid var(--tertiary-color); } #small-halves section .box-1-2:last-child .newsbox div a.cta:hover { background: var(--primary-color); border: 1px solid var(--primary-color); } /* Safety Page */ .page-template-safety-security-page #intro section > div:first-child { max-width: 650px; padding-right: 50px; float: left; width: calc( 100% - 485px ); } #intro section aside .sidebox { max-width: 455px; float: right; padding: 30px 30px; position: relative; border: 2px solid var(--primary-color); width: 100%; } #intro section aside .sidebox figure { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 58px; height: 58px; border-radius: 50%; background: var(--primary-color); position: absolute; top: 50%; left: 0%; transform: translateX(-50%) translateY(-50%); border: 5px solid #99b7dd; } #intro section aside .sidebox figure svg { width: 38px; height: 38px; } #intro section aside .sidebox article { text-align: center; max-width: 380px; margin: auto; } #intro section aside .sidebox article p { font-family: var(--secondary-font); font-size: 15px; margin-bottom: 0px; } #intro section aside .sidebox article h2 { font-size: 24px; } #blue-left section { max-width: 1124px; padding: 35px 15px; } #blue-left section .blue-box { background: var(--primary-color) } #blue-left section .blue-box .text-box { max-width: calc( 100% - 545px ); width: 100%; float: left; } #blue-left section .blue-box .text-box article { max-width: 460px; padding: 15px; } #blue-left section .blue-box .text-box article *{ color: #FFF; } #blue-left section .blue-box .text-box article h2 { font-size: 25px; } #blue-left section .blue-box .text-box article h2:after { content: ""; width: 55px; height: 9px; background: var(--secondary-color); display: block; margin-top: 10px;} #blue-left section figure { width: 100%; max-width: 545px; position: relative; float: right; overflow: hidden; } #blue-left section figure:after { content: ""; position: absolute; top: 0px; left: 0px; width: 20px; height: 100%; display: block; background: var(--primary-color); opacity: .4; } #blue-left section figure img { display: block; } #blue-left section .blue-box article a.cta { background-color: var(--secondary-color); color: var(--primary-color); height: 60px; padding-left: 25px; padding-right: 25px; } .twocol-text section { max-width: 1160px; padding: 30px 15px; } .twocol-text section article { column-rule: 1px solid var(--tertiary-color); column-gap: 150px; } .twocol-text section article h3 { font-family: var(--primary-font); font-size: 18px; font-weight: 500; color: var(--primary-color); break-before: ; } .twocol-text section article hr { margin: 0px; } .twocol-text section article strong { font-family: var(--primary-font); font-weight: 500; } .twocol-text section article .twitter-button { text-align: center; font-family: var(--secondary-font); font-size: 15px; color: var(--primary-color); } .twocol-text section article .twitter-button a.cta { width: 160px; height: 85px; background: var(--primary-color); font-size: 15px; font-family: var(--primary-font); } .twocol-text section article ol { counter-reset: item; list-style-type: none; } .twocol-text section article ol > li { list-style-type: none; counter-increment: item; position: relative; } .twocol-text section article ol > li:before { content: counter(item) "."; position: absolute; top: 0px; left: -15px; font-weight: 500; font-family: var(--primary-font); } .twocol-text section article blockquote { border: 2px solid var(--primary-color); width: 100%; padding: 50px 15px; text-align: center; position: relative; margin-top: 50px; text-align: center; } .twocol-text section article blockquote h2 { font-family: var(--primary-font); font-size: 24px; font-weight: 500; } .twocol-text section article blockquote * { max-width: 420px; display: inline-block; } .twocol-text section article blockquote:before { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 58px; height: 58px; border-radius: 50%; background-color: var(--primary-color); position: absolute; top: 0%; left: 0%; transform: translateX(-50%) translateY(-50%); border: 5px solid #99b7dd; content: ""; background-size: 50px 50px; background-image: url(../images/warning.svg); background-repeat: no-repeat; background-position: center; } #safety-header { background: var(--tertiary-color); position: relative; } #safety-header section { height: 188px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #safety-header section .title { display: -ms-inline-flexbox; display: -webkit-inline-flex; display: inline-flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; position: relative; z-index: 2; } #safety-header section .title h2 { color: #FFF; font-size: 35px; font-weight: 500; margin-left: 25px; } #safety-header .bgimg { position: absolute; right: 0px; top: 0px; height: 100%; max-width: 100%; z-index: 0; overflow: hidden; display: inline-block; } #safety-header .bgimg img { } #safety-header .bgimg:before { position: absolute; display: block; content: ""; top: 0px; left: 0px; height: 100%; width: 250px; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#038d9a+0,038d9a+100&1+0,0+100 */ background: -moz-linear-gradient(left, rgba(3,141,154,1) 0%, rgba(3,141,154,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(3,141,154,1) 0%,rgba(3,141,154,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(3,141,154,1) 0%,rgba(3,141,154,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#038d9a', endColorstr='#00038d9a',GradientType=1 ); /* IE6-9 */ } #intro .teal-box { max-width: 505px; width: 100%; margin-top: 40px; text-align: center; background: var(--tertiary-color); } #intro .teal-box article { max-width: 330px; padding: 60px 15px 30px; margin: auto; } #intro .teal-box article h2 { font-family: var(--primary-font); font-size: 30px; font-weight: 500; } #intro .teal-box article * { color: #FFF; } #intro .teal-box article a.cta { font-family: var(--primary-font); font-size: 24px; font-weight: 500; width: 220px; height: 70px; pointer-events: initial; } #intro .lift-box { margin-top: 160px; max-width: 480px; width: 100%; text-align: center; border: 2px solid var(--primary-color); float: right; } #intro .lift-box img { position: relative; top: -70px; margin-bottom: -70px; } #intro .lift-box article { max-width: 290px; margin: auto; padding: 40px 15px; } #intro .lift-box article h3 { font-size: 33.57px; font-family: var(--primary-font); font-weight: 500; line-height: 1.5; color: var(--primary-color); } #intro section aside .lift-box strong { top: -5px; font-weight: 400; } #intro .lift-box article h3 strong:last-child { top: -25px; } #vehicle-info section { max-width: 1060px; padding: 50px 15px; } #vehicle-info section article { max-width: 430px; } #vehicle-info section div:last-child article{ float: right; } #vehicle-info section article h1 { font-size: 27px; font-weight: 600; } #vehicle-info section article h1:after { content: ""; width: 55px; height: 8px; background: var(--secondary-color); margin: 15px 0px 15px; display: block; } #vehicle-info section article h3 { font-size: 18px; font-weight: 500; color: var(--primary-color); font-family: var(--primary-font); } .page-template-lift-paratransit-page #accordions details article ul { list-style-type: disc; margin-bottom: 15px; } .page-template-lift-paratransit-page #accordions details article ul li { margin-bottom: 5px; line-height: 1.5; } .page-template-lift-paratransit-page #accordions .button-container { text-align: center; } .page-template-lift-paratransit-page #accordions .button-container a.cta { max-width: 225px; width: 100%; height: 75px; font-size: 15px; font-family: var(--primary-font); font-weight: 500; } .page-template-lift-paratransit-page #accordions ol[type=a] li:before { content: counter(item, lower-alpha) ") ";} .page-template-lift-paratransit-page #accordions ol[type=i] li:before { content: counter(item, lower-roman) ") ";} #lift-bottom section { max-width: 1090px; padding: 45px 15px; } #lift-bottom section div { max-width: calc( 100% - 295px ); float: left; width: 100%; border-right: 1px solid var(--tertiary-color); } #lift-bottom section article { max-width: 565px; padding-top: 30px; } #lift-bottom section article h1 { font-size: 22px; font-weight: 500; color: var(--primary-color); } #lift-bottom section article h1:after { content: ""; width: 55px; height: 8px; background: var(--secondary-color); margin: 15px 0px 15px; display: block; } #lift-bottom section article a.cta { width: 190px; height: 70px; border: 2px solid var(--tertiary-color); font-size: 15px; font-family: var(--primary-font); font-size: 15px; font-weight: 500; color: var(--font-color); background: none; } #lift-bottom section article a.cta:hover { color: #FFF; background: var(--tertiary-color); } #lift-bottom section aside { width: 295px; float: right; padding-left: 35px; padding-top: 70px; font-size: 16px; color: var(--font-color); font-family: var(--secondary-font); } #lift-bottom section aside p { font-size: 15px; font-family: var(--secondary-font); line-height: 1.75; } #lift-bottom section aside h2 { font-size: 22px; font-weight: 500; color: var(--primary-color); font-family: var(--primary-font); } #lift-bottom section aside figure img { width: 60px; height: 60px; margin-top: 40px; margin-bottom: 20px; } #lift-bottom section aside figure.align-left{ margin-right: 10px; } #modal.modal { width: auto; max-width: 90%; } #modal.modal .modal-inner img { max-width: 100%; } .blocker { z-index: 3; } .page-id-20108 #modal.modal { padding: 0px; } .page-id-5220 #accordions details article ul { list-style-type: disc; padding-left: 20px; line-height: 1.75; max-width: 100%; } .page-id-5220 #accordions details article ul li { margin-bottom: 10px; list-style-type: none; } .page-id-5220 #accordions details article ul ul { list-style-type: none; } .page-id-5220 #accordions details article ul ul li { padding-left: 20px; position: relative; } .page-id-5220 #accordions details article ul li::marker { display: none!important; } .page-id-5220 #accordions details article ul ul li:before { content: "-"; position: absolute; left: 0px; top: 0px; border: none; } .page-id-5220 #accordions details article h2 a { color: var(--primary-color); } #bottom-slider section { padding-top: 50px; max-width: 1244px; } #bottom-slider .trip-planner { width: 41%; float: left; } #bottom-slider .trip-slider { float: left; width: 59%; } #bottom-slider .trip-planner article { max-width: 365px; padding: 20px; text-align: center; margin: auto; } #bottom-slider .trip-planner article h2 { font-size: 22px; font-weight: 600; } #bottom-slider .trip-planner article #trip-planner { display: block; } #bottom-slider .trip-planner article #trip-planner legend { display: none; } #bottom-slider .trip-planner article #trip-planner input[type=text] { width: 100%; margin: 10px 0px; max-width: 100%; height: 66px; } #bottom-slider .trip-planner article #trip-planner button { float: right; } #bottom-slider .trip-slider .tripslider-container { max-width: 670px; padding: 0px 20px; margin: auto; } #bottom-slider .trip-slider .tripslider-container ul { padding-left: 0px; } #bottom-slider .trip-slider .tripslider-container figure { text-align: center; max-height: 360px; overflow: hidden; } #bottom-slider .trip-slider .tripslider-container figure img { max-width: 100%; max-height: 320px; } #bottom-slider .trip-slider .tripslider-container figcaption { color: var(--primary-color); text-align: center; margin-bottom: 20px; display: block; } #bottom-slider .trip-slider .tripslider-container .bx-pager { bottom: auto; right: -30px; width: 20px; top: 50%; padding-top: 0px; transform: translateY(-50%) } #bottom-slider .trip-slider .tripslider-container .bx-pager a { width: 11px; height: 11px; border: 1px solid var(--secondary-color); background: none; margin: 9px 0px; } #bottom-slider .trip-slider .tripslider-container .bx-pager a.active { background: var(--secondary-color) } .toggler { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 99; cursor: pointer; display: none; opacity: 0; } /* SITE */ .covid.bottom_button_container { max-width: 920px; margin: 20px auto; text-align: center; } .covid.bottom_button_container section { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .covid .box-bottombutton { width: 270px; height: 270px; display: inline-block; float: none; } .covid .box-bottombutton .button-inner { width: 100%; height: 100%; position: relative; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .covid .box-bottombutton .button-inner .hover-bg { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: -1; opacity: 0; transition: all .25s; } .covid .box-bottombutton .button-inner a { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 0; } .covid .box-bottombutton .button-inner figure { width: 100%; height: 65px; text-align: center; margin-bottom: 15px; } .covid .box-bottombutton .button-inner figure svg { height: 65px; max-width: 100%; margin: auto; } .covid .box-bottombutton .button-inner figcaption { color: #FFF; font-size: 15.58px; font-weight: 500; max-width: 180px; margin: 0px auto; text-align: center; width: 100%; letter-spacing: 0.07ex; } .covid .box-bottombutton .button-inner figcaption:first-letter { text-transform: uppercase; } .covid .box-bottombutton .button-inner:hover { background: transparent; } .covid .box-bottombutton .button-inner:hover .hover-bg { opacity: 1; } .covid-form { border: 2px solid #014CAB; max-width: 473px; position: relative; float: right; text-align: left; padding: 30px 20px 30px 50px } .covid-form:before { width: 70px; height: 70px; content: ""; position: absolute; left: 0px; top: 50%; transform: translateY(-50%) translateX(-50%); background: url(../images/mailer.svg) center no-repeat; } .covid-form form { position: relative; } .covid-form h2 { font-family: var(--primary-font); color: #014CAB; font-size: 22px; font-weight: 800; } .covid-form label { font-family: var(--secondary-font); font-size: 15px; } .covid-form form input[type=email] { margin-top: 20px; border: none; background: rgba(1,76,171,.15); padding-right: 150px; height: 52px; font-family: var(--secondary-font); font-size: 15px; color: var(--primary-color); margin-bottom: 0px; } .covid-form form input[type=email]::-webkit-input-placeholder { color: var(--primary-color); } .covid-form form input[type=email]:-moz-placeholder { color: var(--primary-color); } /* FF 4-18 */ .covid-form form input[type=email]::-moz-placeholder { color: var(--primary-color); } /* FF 19+ */ .covid-form form input[type=email]:-ms-input-placeholder { color: var(--primary-color); } /* IE 10+ */ .covid-form form input[type=submit] { width: 130px; height: 40px; position: absolute; bottom: 5px; right: 5px; background: var(--primary-color); border: none; font-size: 15px; cursor: pointer; } h2.specialh { font-size: 30px; position: relative; font-weight: 600; text-transform: none; font-family: var(--primary-font); line-height: 1.25; } h2.specialh:after { width: 50px; height: 12px; background: var(--secondary-color); content: ""; display: block; margin: 15px 0px; } *[style="background: #014cab"] h2.specialh { color: #FFF; } .listed-icons section { max-width: 1180px; } .listed-icons section ul { list-style-type: none; padding: 0px; margin: 30px 0px; } .listed-icons section ul li { padding: 0px; border-bottom: 1px solid var(--tertiary-color); padding: 30px 0px; } .listed-icons section ul li:last-child { border: none; } .listed-icons section ul li:before { display: none; } .listed-icons section ul li:after { content: ""; clear: both; display: block; } .listed-icons section ul li figure { width: 145px; float: left; } .listed-icons section article ul li article { width: calc( 100% - 145px )!important; padding-left: 40px; float: left; } .listed-icons section article ul li article h2 { font-size: 20px; margin-bottom: 5px; } #center-copy section article a.cta.cta-too { max-width: 100%; min-width: 200px; height: 60px; background: var(--secondary-color); color: var(--primary-color); border: none; font-weight: 800; font-size: 18px; } #center-copy section article a.cta.cta-too:hover { background: var(--primary-color); color: var(--secondary-color); } .child-pages section { max-width: 1100px; } .child-pages ul { list-style-type: none; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .child-pages ul li a { height: 40px; min-width: 200px; margin: 20px 15px; font-size: 15px; font-weight: 800; max-width: 360px; } .covid-faq section { max-width: 1180px; } .covid-faq section details article { margin: 40px auto; max-width: 1032px; column-gap: 50px; -webkit-column-gap: 30px; } .covid-faq section details article h3 { font-size: 18px; font-family: var(--primary-font); color: var(--primary-color); } .covid-faq section details article hr { margin: 0px!important; } .covid-faq section .table { max-width: 980px; margin: auto; } .embed-block section { max-width: 1180px; padding: 40px; } font[size="1"] { display: none;} .page-template-projects-page #header-teal section { } .page-template-projects-page #intro section { max-width: 980px } .projects .tabs > ul { list-style-type: none; padding: 0px; display: block; border-bottom: 17px solid var(--primary-color); max-width: 835px; margin: 0px auto 35px; } .projects .tabs > ul:after { clear: both; display: block; content: ""; } .projects .tabs > ul li { float: left; width: 50%; } .projects .tabs > ul li a { border: 1px solid var(--primary-color); display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; height: 74px; text-decoration: none; color: var(--primary-color); text-transform: uppercase; font-size: 19px; letter-spacing: 0.2ex; border-bottom: 0px; } .projects .tabs > ul li a:hover { font-weight: 600; } .projects .tabs > ul li.ui-state-active a{ color: #FFF; font-weight: 600; background: var(--primary-color); } .projects .tabs div ul { list-style-type: none; padding: 0px; } .projects .tabs div ul li > a { display: block; text-align: center; text-decoration: none; } .projects .tabs div ul li a figure { width: 250px; height: 250px; position: relative; overflow: hidden; margin: auto; display: block; } .projects .tabs div ul li a figure img { position: absolute; top: 50%; left: 50%; min-width: 100%; height: auto; transform: translateX(-50%) translateY(-50%); min-height: 100%; } .projects .tabs div ul li a figcaption { color: var(--primary-color); text-transform: uppercase; font-size: 18px; display: block; margin-top: 15px; min-height: 100px; } .project-modal.modal { width: 90vw; max-width: 930px; padding: 0px; } .project-modal.modal figure { width: 300px; float: left; font-size: 0px;} .project-modal.modal figure img { width: 100%; height: auto; } .project-modal.modal article { width: calc( 100% - 300px ); padding: 30px 40px; float: left; } .project-modal.modal article h2 { text-transform: uppercase; } /* Footer Settings */ #page-foot { background: var(--primary-color); color: #FFF; height: var(--footer-height); } #page-foot section { height: 100%; padding-left: 80px; padding-right: 80px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #page-foot section .foot-container { width: 100%; text-align: center; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #page-foot section .foot-container > * { position: relative; } #page-foot section:after { display: none; } #page-foot section label { cursor: pointer; } #page-foot section label:hover { color: var(--secondary-color); } #page-foot section #partner-list { width: 0px; float: left; overflow: hidden; transition: all .25s; height: 65px; top: 0px; } #page-foot section #partner-list svg path { fill: #FFF; } #page-foot section #partner-list svg polygon { fill: #FFF; } #page-foot section #partner-list svg rect { fill: #FFF; } #page-foot section #partner-list svg:hover path { fill: var(--secondary-color); } #page-foot section #partner-list svg:hover polygon { fill: var(--secondary-color); } #page-foot section #partner-list svg:hover rect { fill: var(--secondary-color); } #page-foot section .bx-next { opacity: 1; text-indent: 0; font-size: 0px; text-decoration: none; margin-top: -10px; right: 0px; text-align: right; } #page-foot section .bx-next:after { font-family: 'Font Awesome 5 Free'; content: "\f0da"; font-weight: 900; font-size: 18px; } #page-foot section .bx-prev { opacity: 1; text-indent: 0; font-size: 0px; text-decoration: none; margin-top: -10px; left: 0px; text-align: left; } #page-foot section .bx-prev:after { font-family: 'Font Awesome 5 Free'; content: "\f0d9"; font-weight: 900; font-size: 18px; } #page-foot section .bx-next:hover, #page-foot section .bx-prev:hover { color: var(--secondary-color); } #page-foot section #partner-list .bx-wrapper { width: 330px; } #page-foot section #partner-list li { width: 110px; text-align: center; } #page-foot section #partner-list li a { display: block; } #page-foot section #partner-list img, #page-foot section #partner-list svg { max-height: 65px; min-height: 55px; width: auto; max-width: 90px; margin: auto; } #page-foot section #partner-list svg * { fill: #FFF; } #page-foot section input[type=checkbox] { display: none } #page-foot section input[type=checkbox]:checked + #partner-list { width: 330px; } #page-foot section input[type=checkbox]:checked ~ h5 { max-width: 9px; transition: all .25s; } #page-foot section input[type=checkbox]:checked ~ h5 span{ max-width: 0px; } #page-foot section input[type=checkbox]:checked ~ h5 em { max-width: 0px; } #page-foot h5, #page-foot nav, #page-foot .social { display: inline-block; } #page-foot nav li a, #page-foot section a, #page-foot .social li a { color: #FFF; } #page-foot h5 span { font-weight: 500; display: inline-block; overflow: hidden; float: left; } #page-foot h5, #page-foot h5 span { max-width: 100%; transition: all .25s; overflow: hidden; } #page-foot h5, #page-foot h5 a { font-weight: 500; font-size: 15.15px; text-decoration: none; letter-spacing: 0.08ex; } #page-foot h5 em { color: #FFF; font-weight: 500; font-style: normal; display: inline-block; } #page-foot .social li a { margin: 0px 0px 0px 18px; } #page-foot nav li a { font-size: 12px; letter-spacing: 0.1ex; text-decoration: none; margin: 0px 20px; text-transform: capitalize; } #page-foot nav li a:hover, #page-foot .social li a:hover, #page-foot h5 a:hover { color: var(--secondary-color); } #page-foot cite { } a[href^="tel:"] { pointer-events: none; } .home main { position: relative; padding-top: 0px; } #cookies { position: fixed; bottom: 0px; left: 50%; transform: translateX(-50%); background: #FFF; box-shadow: 0px 0px 19px 0px rgba(0,0,0,0.31); max-width: 960px; width: 100%; display: none; z-index: 9999; } #cookies.visible { display: block; } #cookies.footerstick { position: absolute; } #cookies .cookies-inner { max-width: 870px; padding: 35px 0px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch;-webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; width: 100%; margin: auto; } #cookies .cookies-inner h5 { font-family: var(--primary-font); color: var(--primary-color); font-weight: 500; font-size: 25px; width: 100%; max-width: 235px; text-align: center; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background: url(../images/cookie.png) center no-repeat; background-size: contain; } #cookies .cookies-inner p { width: 100%; max-width: 400px; text-align: center; font-family: var(--secondary-font); font-size: 13px; line-height: 1.66667; color: var(--font-color); } #cookies .cookies-inner p a { color: var(--font-color); } #cookies .cookies-inner p a:hover { color: var(--primary-color); } #cookies .cookies-inner #cookie-close { position: absolute; top: 18px; right: 18px; width: 33px; height: 33px; border-radius: 50%; background: var(--quaternary-color); color: var(--primary-color); display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-weight: 600; text-decoration: none; font-size: 12px; } #cookies .cookies-inner .button-container { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 200px; } #cookies .cookies-inner .button-container a.cta { text-transform: none; font-weight: 500; font-size: 14px; background: var(--tertiary-color); width: 145px; height: 45px; margin-bottom: 15px; font-family: var(--primary-font); color: #FFF; } #cookies .cookies-inner .button-container a.cta:hover { background: var(--primary-color); color: #FFF; } #cookies .cookies-inner .button-container a { font-size: 13px; font-family: var(--secondary-font); color: var(--primary-color); } #cookies .cookies-inner .button-container a:hover { color: var(--secondary-color); } section details[open] summary:before { transform: none!important; } .overflow h3, .holidaymsg { width: 100%; height: 100%; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } div.wpcf7-validation-errors, div.wpcf7-acceptance-missing { clear: both; margin-top: 20px; } .cta font font { width: 100%; height: 100%; overflow: hidden; text-overflow: ellipsis; text-transform: capitalize; } #news-post .bg img.desktopbg { max-width: 100%; object-fit: cover; } div#cookie-law-info-bar { max-width: 960px; width: 100%; left: 50%; transform: translateX(-50%); } div#cookie-law-info-bar .cookies-inner { max-width: 870px; padding: 35px 0px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch;-webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; width: 100%; margin: auto; } div#cookie-law-info-bar .cookies-inner .cookies-inner { padding: 0px; margin: 0px; display: block; } div#cookie-law-info-bar .cookies-inner h5 { font-family: var(--primary-font); color: var(--primary-color); font-weight: 500; font-size: 25px; width: 100%; max-width: 235px; text-align: center; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background: url(../images/cookie.png) center no-repeat; background-size: contain; } div#cookie-law-info-bar .cookies-inner p { width: 100%; max-width: 400px; text-align: center; font-family: var(--secondary-font); font-size: 13px; line-height: 1.66667; color: var(--font-color); } div#cookie-law-info-bar .cookies-inner p a { color: var(--font-color); } div#cookie-law-info-bar .cookies-inner p a:hover { color: var(--primary-color); } div#cookie-law-info-bar .cookies-inner .button-container { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 200px; } div#cookie-law-info-bar .cookies-inner .button-container a { text-transform: none; font-weight: 500; font-size: 14px; background: var(--tertiary-color); width: 145px; height: 45px; margin-bottom: 15px; font-family: var(--primary-font); color: #FFF; padding-top: 17px; } div#cookie-law-info-bar .cookies-inner .button-container a:hover { background: var(--primary-color); color: #FFF; } @media handheld, only screen and (max-width: 1179px) and (min-width: 1024px) { main section { padding-left: 35px; padding-right: 35px; } #page-foot section { padding-left: 50px; padding-right: 50px; } #alertbar section .alert { width: 100%; position: relative; z-index: 1; } #alertbar:after { width: 30%; } #bottom-big section article { padding: 0px 50px 0px 50px!important; } #newsbox section .latest-news { max-width: 550px; } #newsbox section .media-relations { max-width: 500px; width: calc( 100% - 575px ) } #blue-links-bar .blue-box p { max-width: 100%; margin-bottom:20px; } #intro .teal-box { margin: 40px auto 0px; } #intro .lift-box { float: none; margin-left: auto; margin-right: auto; } #intro section aside .sidebox { max-width: 350px; } .page-template-safety-security-page #intro section > div:first-child { max-width: calc( 100% - 440px ) } } @media handheld, only screen and (max-width: 1211px) { #intro section > div, #intro section > aside { width: 100%; float: none; padding: 30px; } #intro section aside { display: block; text-align: center; } #intro section aside .buttonbox { max-width: 165px; } } @media handheld, only screen and (max-width: 1365px) and (min-width: 1024px) { /* Under the grid width to iPad Landscape */ :root { --grid-gutter: 10px; /* Gutter Width is set here. Just put half the gutter width here. */ } article .alignfull { margin-left: calc( var(--grid-gutter) * -1 ); } #page-head hgroup { padding-left: 15px; padding-right: 15px; } .box-slideshow #trip-planner legend { padding-left: 0px; } .box-slideshow #trip-planner input[type=text] { margin-left: 10px; margin-right: 10px; } .box-slideshow figcaption h2 { padding-right: 25px; font-size: 21px; } .box-slideshow figcaption p { padding-right: 10px; } #board-of-directors section ul li.board-member { min-height: 440px; } #alternates section { padding: 15px 30px; } #page-head hgroup #nav #main > li > a { padding-left: 0px; padding-right: 0px; } #page-foot nav li a { margin: 0px 5px; } #page-foot .social li a { margin: 0px 0px 0px 8px; } } @media handheld, only screen and (max-width: 1215px) and (min-width: 1024px) { #bottom-halves section aside > div { width: 355px; margin-left: auto; margin-right: auto; } #bottom-halves section aside > div h2 { font-size: 21px; font-weight: 300; position: relative; margin-bottom: 10px; } #bottom-halves section aside > div hr { width: 355px; margin: auto; } } @media handheld, only screen and (width: 1024px) { details summary span { position: absolute; top: 50%; transform: translateY(-50%) translateX(-50%); left: 50%; width: 100%; padding-left: 15px; } details summary:before { top: 50%!important; transform: translateY(-50%)!important } details:hover summary:before { transform: translateY(-50%) } #steps section .step .step-copy article a.cta { display: flex; margin: 15px 0px!important; } #accordions section details[open] summary:before { transform: translateY(-50%)!important; } } @media handheld, only screen and (max-width: 1023px) and (min-width: 767px) { /* Smaller tablets to iPad portrait */ :root { --grid-gutter: 8px; /* Gutter Width is set here. Just put half the gutter width here. */ } a[href^="tel:"] { pointer-events: auto;; } article .alignfull { margin-left: calc( var(--grid-gutter) * -1 ); } #page-head hgroup .toggle { width: 50px; height: 34px; margin: 0px; } #page-head hgroup .toggle:before, #page-head hgroup .toggle:after, #page-head hgroup .toggle span:before, #page-head hgroup .toggle span:after { background: var(--primary-color); height: 4px; border-radius: 0px; } #page-head hgroup #nav { width: 100%; margin: 0px; max-width: 100%; background: var(--primary-color); margin-top: 0px; border-left: 13px solid #FFF; border-right: 13px solid #FFF; } .resizing #page-head hgroup #nav { transition: none; } #page-head hgroup #toggle:checked ~ #nav { border-bottom: 13px solid #FFF; max-height: calc( 100vh - var(--header-height) ); } #page-head hgroup #nav #main { } #page-head hgroup #nav #main li { } #page-head hgroup #nav #main > li > a { padding: 22px 35px; color: #FFF; font-size: 18.5px; text-align: left; } #page-head hgroup #nav #main li.menu-item-has-children > a { position: relative; } #page-head hgroup #nav #main li.menu-item-has-children > a:hover { color: #FFF; } #page-head hgroup #nav #main li.menu-item-has-children > a:before { content: ""; position: absolute; bottom: 0px; left: 24px; width: calc( 100% - 48px ); height: 1px; background: #FFF; transition: all .25s; } #page-head hgroup #nav #main li.menu-item-has-children > a:after { font-family: var(--primary-font); content: "+"; color: var(--secondary-color); font-size: 18.5px; position: absolute; top: 50%; right: 35px; transform: translateY(-50%); } #page-head hgroup #nav #main li.menu-item-has-children > a.minus:after{ content: "-" } #page-head hgroup #nav #main li.menu-item-has-children > a:hover { color: #FFF; } #page-head hgroup #nav #main li.menu-item-has-children > a.plus { color: var(--secondary-color); } #page-head hgroup #nav #main li.menu-item-has-children:hover > ul { padding: 0px; border: 0px; } #page-head hgroup #nav #main li.menu-item-has-children > ul { background: #FFF; padding: 0px; left: 0px; transform: none; } #page-head hgroup #nav #main li.menu-item-has-children > ul.expand { background: #FFF; border-top: 10px solid #99b7dd; } #page-head hgroup #nav #main li.menu-item-has-children > a.plus:before { height: 0px; } #page-head hgroup #nav #main li.menu-item-has-children > a.plus:after { content: "-" } #page-head hgroup #nav #main li.menu-item-has-children > ul > li > a { font-size: 12.5px; text-align: left; display: block; color: var(--primary-color); padding-left: 55px; } #page-head hgroup #nav #main li.current-page-item > a, #page-head hgroup #nav #main li:hover > a, #page-head hgroup #nav #main li a:hover { color: var(--secondary-color); } #page-head hgroup #nav #main > li > ul { margin-top: 0px; } #page-head hgroup #nav #main > li > ul.expand { padding-top: 20px; padding-bottom: 20px; } #page-head hgroup #nav #main li ul li a { } #page-head hgroup #nav #main .menu-item-has-children ul li a { padding-right: 30px; font-size: 14px; } #page-head hgroup #nav #main > li.action a { color: var(--primary-color) } #page-head hgroup #nav #main li.menu-item-has-children > a { position: relative; } #page-head hgroup .translate-search { order: 0; -webkit-order: 0; } #page-head hgroup .logo { order: 0; -webkit-order: 0; margin-left: 75px; width: 185px; height: 35px; } #page-head hgroup .toggle { order: 0; -webkit-order: 0; position: absolute; left: 15px; } #alertbar section { padding-left: 20px; padding-right: 20px; } #alertbar section .alert { width: 100%; position: relative; z-index: 1; font-size: 12px; } #alertbar section .alert div { font-size: 14px; max-width: calc( 100% - 90px ) } #alertbar section p { max-width: 480px; } #alertbar:after { width: 30%; } .page-template-default #trip-planner { display: block; } .page-template-default #trip-planner legend { padding-bottom: 20px; padding-left: 15px; } .page-template-default #trip-planner button { margin: 15px; } .box-slideshow, .box-sidebar, .home-bottom .box-bottom-slider { width: 100%; } .box-slideshow figcaption h2 { padding-right: 25px; font-size: 20px; } .box-slideshow figcaption p { padding-right: 25px; } .box-slideshow #trip-planner legend { padding-left: 0px; } .box-sidebar { -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; padding-left: 0px; padding-right: 0px; } .box-sidebar .button { max-width: 255px; height: 255px; float: left; padding: 0px 10px; } #slim-blue section div article { padding: 0px 30px; } #bottom-big section article { padding: 0px 30px 0px 30px!important; } #bottom-halves section { display: block } #bottom-halves section aside { width: 100%; float: none; max-width: 100%; } #bottom-halves section aside > div hr, #bottom-halves section aside > div { max-width: 460px; } #button-bar .button-bar a.cta { height: 65px; font-size: 12px; min-width: 135px; margin: 0px 0px 24px; } .titlebar { background-image: none!important } .home-top { display: block; } .home-bottom .box-bottombutton { width: 50%;} main section { padding-left: 15px; padding-right: 15px; } #contact-boxes section ul li { font-size: 12px; } hr { width: calc( 100vw - 50px )!important; margin-left: auto!important; margin-right: auto!important; } .home-bottom .box-bottom-slider li.new figcaption article { margin-left: 40px; } #transit-centers section .tabs .transit-tab .tab-inner article { width: calc( 100% - 260px ); } #transit-centers section .tabs .transit-tab .tab-inner aside { max-width: 260px; } #transit-centers section .tabs .transit-tab .tab-inner aside .tealbox { max-width: 240px; padding: 30px 20px; } #transit-centers section .tabs .transit-tab .tab-inner details > address { position: static; display: block; float: none; margin-bottom: 15px; } #steps section .step .step-copy article a.cta { display: flex; margin: 15px 0px!important; } .page-template-contact-page main form .box-1-2 { padding-right: 15px; } .page-template-contact-page main form .box-1-2 + .box-1-2 { padding-left: 15px; } #newsbox section .latest-news { width: 100%; max-width: 100%; float: none; } #newsbox section .media-relations { width: 100%; max-width: 100%; float: none; } #news-post section nav.pagination a { display: block; float: none!important; text-align: center; } #news-post section nav.pagination a:first-child { margin-bottom: 20px; } #news-post section h1.page-title { font-size: 28px; } #job-blue-box section figure img { max-width: 300px; } #blue-links-bar .blue-box p { max-width: 100%; margin-bottom: 20px; } #career-bottom section figure { height: auto; } #career-bottom section article { padding: 15px; } #alternates section { padding: 15px ; } #alternates section ul { padding-left: 30px; } #right-blue section .equal-heights { display: block; } #right-blue section figure { width: 100%; max-width: 100%; } #right-blue section figure:after { bottom: 0px; left: 0px; top: auto; right: auto; width: 100%; height: 40px; } #right-blue section figure img { width: 100%; } #small-halves section .box-1-2:last-child .newsbox article { width: 100%; padding: 15px; text-align: center; } #intro section aside, .page-template-safety-security-page #intro section > div:first-child { width: 100%; max-width: 100%; } #blue-left section .blue-box { display: block; } #blue-left section figure, #blue-left section .blue-box .text-box { max-width: 100%; } #blue-left section figure img { width: 100%; } #blue-left section figure:after { top: 0px; left: 0px; width: 100%; height: 30px; } #intro .teal-box { margin: 40px auto 0px; } #intro .lift-box { float: none; margin-left: auto; margin-right: auto; } #lift-bottom section article { padding-right: 30px; } details summary span { position: absolute; top: 50%; transform: translateY(-50%) translateX(-50%); left: 50%; width: 100%; padding-right: 48px; padding-left: 15px; } details summary:before { top: 50%!important; transform: translateY(-50%)!important } details:hover summary:before { transform: translateY(-50%) } #alerts-tabs section .tabs .tab-outer .tab-inner details article ul { column-count: 1; } #fare-types section .types { } #teal-box section figure:before { width: 100%; height: 40px; } #fare-types section .types, #fare-types section .compass { width: 100%; float: none; } #safety-header .bgimg { display: none; } #teal-box section { display: block; padding: 0px; } #teal-box section figure, #teal-box section .teal-box { width: 100%; float: none; } #teal-box section .teal-box { padding: 40px 15px; } #quick-links-too section { display: block; } #quick-links-too section div { width: 100%; float: none; margin: 20px auto; } #bottom-halves section { padding-top: 0px; padding: 0px 25px; } #quick-links section .quick-links { padding: 0px 25px; } #quick-links-side section .quick-links a { max-width: 185px; } #quick-links-side { margin-bottom: 50px; } #accordions section details[open] summary:before { transform: translateY(-50%)!important; } #vehicle-notice { padding: 55px;} #header-teal-short section h1 { font-size: 25px; } #board-of-directors section ul li.board-member { width: 100%; padding: 0px 25px; border: none!important; } #contact-tabs section > ul li { padding-left: 5px; padding-right: 5px; } #contact-tabs section > ul li a .button-tab { margin-left: 5px; margin-right: 5px;} #contact-tabs section iframe { height: 2170px; } #page-foot section input[type=checkbox]:checked + #partner-list { width: 220px; } #page-foot section { padding-left: 15px; padding-right: 15px; } #page-foot nav li a { font-size: 9px; margin: 0px 5px; } #page-foot .social li a { margin: 0px 0px 0px 5px; } } @media handheld, only screen and (max-width: 766px) { /* Mobile */ :root { --header-height: 60px; --footer-height: auto; } /* Mobile Menu styles */ a[href^="tel:"] { pointer-events: auto; color: inherit; text-decoration: none; } #page-head hgroup { padding-left: 10px; padding-right: 10px; } #page-head hgroup .logo { height: 22px; margin-top: 0px; width: 135px; text-align: right; order: 0; -webkit-order: 0; margin-left: 55px; } #page-head hgroup .logo svg { height: 22px; max-width: 135px; } #page-head hgroup .toggle { width: 35px; height: 25px; margin: 0px; margin-left: 3px; order: 0; -webkit-order: 0; position: absolute; left: 1-px; } #page-head hgroup .toggle:before, #page-head hgroup .toggle:after, #page-head hgroup .toggle span:before, #page-head hgroup .toggle span:after { background: var(--primary-color); height: 2px; border-radius: 0px; } .resizing #page-head hgroup #nav { transition: none; } #page-head hgroup #nav { width: 100%; margin: 0px; max-width: 100%; background: var(--primary-color); margin-top: 0px; border-left: 13px solid #FFF; border-right: 13px solid #FFF; height: auto; max-height: 0%; transition: all .25s; } #page-head hgroup #toggle:checked ~ #nav { border-bottom: 13px solid #FFF; max-height: calc( 100vh - var(--header-height) ); } #page-head hgroup #toggle:checked ~ #nav { height: auto; } #page-head hgroup #nav #main { } #page-head hgroup #nav #main li { } #page-head hgroup #nav #main > li > a { padding: 22px 35px; color: #FFF; font-size: 18.5px; text-align: left; } #page-head hgroup #nav #main li.menu-item-has-children > a { position: relative; } #page-head hgroup #nav #main li.menu-item-has-children > a:before { content: ""; position: absolute; bottom: 0px; left: 24px; width: calc( 100% - 48px ); height: 1px; background: #FFF; transition: all .25s; } #page-head hgroup #nav #main li.menu-item-has-children > a:after { font-family: var(--primary-font); content: "+"; color: var(--secondary-color); font-size: 18.5px; position: absolute; top: 50%; right: 35px; transform: translateY(-50%); } #page-head hgroup #nav #main li.menu-item-has-children > a.minus:after{ content: "-" } #page-head hgroup #nav #main li.menu-item-has-children > a:hover { color: #FFF; } #page-head hgroup #nav #main > li.menu-item-has-children.hover > ul { } #page-head hgroup #nav #main li.menu-item-has-children > a.plus { color: var(--secondary-color); } #page-head hgroup #nav #main li.menu-item-has-children:hover > ul { padding: 0px; border: 0px; } #page-head hgroup #nav #main li.menu-item-has-children > ul { background: #FFF; padding: 0px; left: 0px; transform: none; } #page-head hgroup #nav #main li.menu-item-has-children > ul.expand { background: #FFF; border-top: 10px solid #99b7dd; } #page-head hgroup #nav #main li.menu-item-has-children > a.plus:before { height: 0px; } #page-head hgroup #nav #main li.menu-item-has-children > a.plus:after { content: "-" } #page-head hgroup #nav #main li.menu-item-has-children > ul > li > a { font-size: 15px; text-align: left; display: block; color: var(--primary-color); padding-left: 55px; } #page-head hgroup #nav #main > li.action a { color: var(--primary-color) } #page-head hgroup #nav #main li.current-page-item > a, #page-head hgroup #nav #main li:hover > a, #page-head hgroup #nav #main li.menu-item-has-children > a:hover { color: var(--secondary-color); } #page-head hgroup #nav #main > li.current_page_parent > a { color: var(--secondary-color)!important; } #page-head hgroup #nav #main > li.current_page_parent ul li.current-menu-item a { color: var(--tertiary-color); } #page-head hgroup #nav #main > li > ul { margin-top: 0px; } #page-head hgroup #nav #main > li > ul.expand { padding-top: 20px!important; padding-bottom: 20px!important; } #page-head hgroup #nav #main li ul li a { } #page-head hgroup #nav #main .menu-item-has-children ul li a { padding-right: 30px; font-size: 14px; } #page-head hgroup #nav #main li.menu-item-has-children > ul > li > a { white-space: normal; } #page-head hgroup #nav #main li.menu-item-has-children > a { position: relative; } #page-head hgroup #nav.smartmobile #main .menu-item-has-children ul.expand { margin-top: -1px; position: relative; } #page-head hgroup #nav #main li.menu-item-has-children > ul.expand ~ a:after { content: "" } #page-head hgroup .translate-search { width: 80px; } #page-head hgroup .translate-search select { height: 22px; width: 50px; text-transform: uppercase; padding-left: 8px; font-size: 16px; padding-right: 18px; } #page-head hgroup .translate-search:after { left: auto; right: 12px; font-size: 10px; top: 6px } #page-head hgroup .translate-search a.search { padding-left: 0px; padding-right: 0px; } #page-head hgroup .translate-search form#searchform.active { width: 110px; } .bx-wrapper .bg img.mobilebg { max-height: 100%; max-width: 200%; } #alertbar section { padding-left: 10px; padding-right: 10px; } #alertbar section svg { width: 40px; height: 40px; } #alertbar section strong { display: none; } #alertbar section .alert { width: 100%; position: relative; z-index: 1; font-size: 12px; } #alertbar section .alert div { font-size: 14px; width: calc( 100% - 100px ) } #alertbar:after { width: 30%; } #alertbar section .alert div p { max-width: 400px; overflow: hidden; height: 50px; position: relative; top: 20px; } article .alignfull { margin-left: calc( var(--grid-gutter) * -1 ); } #schedules-tabs section .tabs .schedules .results .overflow img { min-height: 495px; } main { padding-bottom: 25px; } .home main section { padding-left: 0px; padding-right: 0px; } /* Service Alerts */ main { padding-top: 10px; } #header-yellow { padding-left: 10px; padding-right: 10px; } #header-yellow section { height: 64px; } .page-template-sitemap-page #header-title h1, #header-yellow section h1 { font-size: 24px; padding-left: 8px; letter-spacing: 0.04ex } #header-yellow section:after { width: 160px; } #header-image.teal .page-title, #header-image.teal figure { width: 100%; } #header-teal-short section h1, #header-teal section h1 { padding-left: 0px; } #header-teal-short section .teal:after, #header-teal section:after { content: ""; position: absolute; top: 100%; right: 0px; width: 100%; height: 28px; background: var(--tertiary-color); opacity: .6 } #intro section aside strong { display: block; width: 100%; position: static; margin-top: 35px; } #double-big section > h1:after { top: auto; bottom: -35px; } #double-big section .blue-text strong { text-align: center; width: 100%; display: block; margin-bottom: 35px; } #header-teal-short { margin-bottom: 25px; } #header-teal-short section .buttonbox { margin-top: 55px; } #alert-intro { border-bottom: 1px solid var(--tertiary-color); } #alert-intro section { padding-top: 20px; padding-bottom: 15px } #alert-intro section article { text-align: center; padding: 3px 20px; } #alert-intro section article * { font-size: 14px; letter-spacing: 0.03ex; } #alert-intro section article h2 { font-size: 18px; letter-spacing: 0px; margin-bottom: 3px; } #alert-intro section .socialside { text-align: center; margin: 0px; padding: 13px 0px; font-size: 12px; letter-spacing: 0.08ex; width: 100%; } #alert-intro section .socialside a { display: block; margin-top: 10px; margin-right: 30px; } #alert-intro section .socialside a:before { font-size: 18px; top: 1px; margin-left: 20px; } #alerts-tabs section { padding: 48px 12px 30px; } #alerts-tabs section .tabs { position: relative; margin-bottom: 0px; } #alerts-tabs .tabber-button { display: block; width: 145px; height: 49px; top: 10px; right: 0px; } #alerts-tabs section .tabs > ul { width: 145px; max-height: 49px; overflow: hidden; float: right; border: none; display: block; position: relative; z-index: 2; border-bottom: 1px solid var(--primary-color); padding-top: 49px; } #alerts-tabs section .tabs > ul:after { position: absolute; top: 0px; right: 0px; width: 20%; height: 100%; content: "\f107"; font-family: 'Font Awesome 5 Free'; font-weight: 600; color: #FFF; z-index: 2; text-align: right; padding-top: 20px; padding-right: 10px; } #alerts-tabs section .tabs > ul:before { content: ""; display: block; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 3; cursor: pointer; } #alerts-tabs section .tabs:before { content: "Select your mode from the menu:"; position: absolute; left: 0px; font-family: var(--secondary-font); font-size: 14px; white-space: nowrap; top: -24px; width: 100%; text-align: center; letter-spacing: 0.04ex; } #alerts-tabs section .tabs > ul li { width: 100%; border-bottom: 1px solid var(--primary-color); } #alerts-tabs section .tabs > ul li a { width: 100%; height: 50px; font-size: 15px; font-weight: 500; letter-spacing: 0.0ex; float: right; background: #FFF; border-top: 0px;} #alerts-tabs section .tabs > ul li.ui-state-active { z-index: 1; position: absolute; top: 0px; right: 0px; } #alerts-tabs section .tabs > ul.open { overflow: visible; } #alerts-tabs section .tabs > ul.open:after { content: "\f106" } #alerts-tabs section .tabs > ul li.ui-state-active a { font-weight: 500; letter-spacing: 0.1ex; } #alerts-tabs section .tabs .tab-outer { border-top: 8px solid var(--primary-color); clear: both; display: block; padding-top: 24px; padding-bottom: 24px; } #alerts-tabs section .tabs .tab-outer { padding: 20px 25px; } #alerts-tabs section .tabs .tab-outer .tab-inner { display: flex; flex-direction: column; } #alerts-tabs section .tabs .tab-outer .tab-inner h3.no-alert{ font-size: 12px; padding: 0px; padding-top: 10px; text-align: center; font-weight: 500; } #alerts-tabs section .tabs .tab-outer .tab-inner h3.no-alert + hr { margin-top: 26px; margin-bottom: 30px } #alerts-tabs section .tabs .tab-outer .tab-inner .teal-box { order: 3; max-width: 220px; margin: auto; font-size: 12px; font-weight: 200; padding: 15px 30px 25px; margin-top: 20px; line-height: 1.75 } #alerts-tabs section .tabs .tab-outer .tab-inner .teal-box a.cta { width: 90px; height: 35px; font-size: 10px; margin-top: 20px; } #alerts-tabs section .tabs .tab-outer .tab-inner details { width: 100%; max-width: 100%; min-width: 100%; margin: 0px; } #alerts-tabs section .tabs .tab-outer .tab-inner details summary { margin-top: 0px; height: 60px; font-size: 15px; position: relative; text-align: center; padding-left: 20px; padding-right: 30px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #alerts-tabs section .tabs .tab-outer .tab-inner details summary:before { position: absolute; top: 5px; right: 10px; } #alerts-tabs section .tabs .tab-outer .tab-inner details article { text-align: center; margin: 0px; padding: 29px 24px; } #alerts-tabs section .tabs .tab-outer .tab-inner details article * { font-size: 15px; margin-bottom: 10px; } #alerts-tabs section .tabs .tab-outer .tab-inner details article ul.twocol { margin-top: 0px; margin-bottom: 20px; border-bottom: 1px solid var(--tertiary-color); } #alerts-tabs section .tabs .tab-outer .tab-inner details article h2 { font-size: 18px; } #alerts-tabs section .tabs .tab-outer .tab-inner details article ul.twocol li { font-size: 13px; margin-bottom: 15px; line-height: 1; } #alerts-bottom section .blue-box p #alerts-bottom section { padding: 0px; } #alerts-bottom section article { text-align: center; padding: 0px 30px; } #alerts-bottom section article h2 { font-size: 18px!important; margin-bottom: 5px;; } #alerts-bottom section article p { font-size: 14px; } #alerts-bottom section .blue-box { width: calc( 100% - 20px ); float: none; margin: 40px auto; padding-bottom: 20px; margin-bottom: 23px; } #alerts-bottom section .blue-box p { width: 100%; text-align: center; margin-bottom: 20px; } #alerts-bottom section .blue-box a.cta { width: 114px; margin-left: auto; margin-right: auto; display: flex; float: none!important; margin-top: 20px; } #alerts-bottom section .blue-box:after { content: ""; clear: both; display: block;} #fares section details summary { font-size: 16px; padding-left: 20px; } /* Page */ #header-image { margin-bottom: 7px; } #header-image section { padding-left: 10px; padding-right: 10px; } #header-image .page-title { width: 100%; float: none; height: 65px; } #header-image .page-title.page-title2 { width: 100%; float: none; height: 65px; } #header-image .page-title.page-title2-colors { width: 100%; float: none; height: 25px; margin-left: 0px; margin-top: 50px; } #header-image .page-title.page-title2:after { top: 100%; left: 0px; width: 100%; height: 25px; } #header-image .page-title.page-title2-colors:before { top: 100%; left: 0px; width: 100%; height: 25px; top: -25px; } #header-image .page-title.page-title2-colors:after { top: 100%; left: 0px; width: 100%; height: 25px; opacity: .75; } #header-image .page-title:after { top: 100%; left: 0px; width: 100%; height: 25px; } #header-image .page-title h1 { font-size: 17.5px; } #header-image .page-title.all h1, #header-teal-short section h1, #header-teal section h1, #header-image .page-title h1 strong { font-size: 25px; display: inline; } #header-image figure { width: 100%; height: 90px; } #header-image figure.header2 { width: 100%; height: 90px; } #header-teal-short, #header-teal { padding-left: 10px; padding-right: 10px; } #header-teal-short .teal, #header-teal section { height: 65px; } #header-teal-short .teal, #header-teal section { padding-left: 0px; padding-right: 0px; text-align: center; } #header-teal section { padding-left: 4px; } #header-teal section h1 { display: block; width: 100%; } #fares-intro section { padding-right: 15px; padding-top: 30px; } #fares-intro section article { padding-left: 15px; padding-right: 15px; } #fares-intro section article p, #fares-intro section article * { font-size: 15px; } #fares-intro aside { width: calc( 100% - 30px ); margin: 80px auto 0px; float: none; } #fares-intro aside .aside-inner h2 { font-size: 18px; } #fares-intro aside .aside-inner h3 { font-size: 14px; } #blue-bar { padding: 0px; } #blue-bar h2 { font-size: 16px; padding: 35px 0px; } #steps section .step .step-title { width: 100%; float: none; padding-top: 50px; padding-left: 15px; } #steps section .step .step-copy { width: 100%; float: none; padding: 25px 25px; } #steps section .step .step-copy article * { font-size: 13px; } #steps section .step .step-copy article a.cta { width: 150px; height: 50px; margin: 10px auto; font-size: 10px; display: flex; float: none; } #steps section .step .step-copy article a.cta + a.cta { margin-left: auto; } #steps section .step .step-copy article address strong, #steps section .step .step-copy article address { font-size: 13px; } #icon-list ul li { display: block; font-size: 13px; margin-bottom: 45px; } #icon-list ul li figure { display: block; float: none; margin: auto; margin-bottom: 25px; } #icon-list ul li * { font-size: 13px; } #icon-list ul li article h3 { font-size: 16px; text-align: center; } #icon-list ul li article h4 { font-size: 14px; text-align: center; } #intro section { padding: 0px; } #intro section > div { padding: 0px 35px; } #intro section article h1, #intro section article .h1 { font-size: 18px; letter-spacing: -0.009ex; margin-bottom: 9px; text-align: center; line-height: 1.5; } #intro section article h2, #intro section article .h2 { } #intro section article h3, #intro section article .h3 { } #intro section article h4, #intro section article .h4 { } #intro section article h5, #intro section article .h5 { } #intro section article p, #intro section article .p { font-size: 15px; letter-spacing: 0.0ex; text-align: center; } #intro section aside { padding-left: 30px; padding-right: 30px; width: 100%; padding-top: 18px; display: block; text-align: center; margin-bottom: 43px; font-size: 0px; background: none; } #intro section aside .buttonbox { width: 94px; max-width: 94px; min-width: 94px; margin: 0px 5px 10px; } #intro section aside .buttonbox svg { height: 20px; margin-top: 0px; } #intro section aside .buttonbox .buttonbox-inner > div { font-size: 10px; padding-left: 10px; padding-right: 10px; } #intro section aside .buttonbox .buttonbox-inner > div br { display: none; } #intro section aside .buttonbox:only-child { width: 160px; max-width: 160px; min-width: 160px; margin-top: -10px; } #intro section aside .buttonbox:only-child .buttonbox-inner { padding-bottom: 34%; } #intro section aside .buttonbox:only-child .buttonbox-inner > div { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding-right: 20px; } #intro section aside .buttonbox-slim { margin: 0px 3px; margin-bottom: 12px; } #intro section aside .buttonbox-slim:last-child { margin-bottom: 25px; margin-top: 10px; } #faqs section { padding: 10px 10px; } #faqs section h2 { text-align: center; font-size: 18px; margin-bottom: 30px; margin-top: 10px; } #faqs section details summary { position: relative; text-align: center; font-size: 12px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 55px; padding-left: 30px; padding-right: 30px; } #faqs section details summary:before { position: absolute; right: 10px; right: 10px; } #faqs section details article { text-align: center; font-size: 14px; } #faqs section details article * { font-size: 13px; } #faqs section details article a.cta { font-size: 10px; width: 100px; display: block; margin: auto; height: 35px; padding-top: 8px; } #quick-links { padding: 40px 0px 30px; } #quick-links section { display: block; } #quick-links section, #quick-links section .box-1-2:first-child { padding: 0px; } #quick-links section .box-1-2:first-child article { width: 100%; max-width: 100%; margin: 0px; padding: 0px 40px; text-align: center; } #quick-links section h2 { font-size: 16px; font-weight: 500; letter-spacing: 0.1ex; text-transform: none; } #quick-links section p { font-size: 15px; padding-left: 25px; padding-right: 25px; line-height: 1.75; } #quick-links section .quick-links { margin-top: 25px; padding-left: 95px; padding-right: 95px; display: block; height: auto; } #quick-links section .quick-links a.cta { width: 100%; max-width: 100%; height: 52px; margin-bottom: 18px; font-size: 10px; } #quick-links section .box-1-2:last-child{ margin-top: 0px; } #quick-links section .box-1-2:last-child .inner-box { width: 250px; padding: 25px; } #quick-links section .box-1-2:last-child .inner-box a.cta { margin-top: 0px; width: 110px; font-size: 10px; height: 40px; } #quick-links section .box-1-2:last-child .inner-box p { margin-bottom: 0px; } #quick-links section .inner-box article { margin-bottom: 18px; } #quick-links-too { padding: 40px 0px 30px; } #quick-links-too section { display: block; } #quick-links-too section, #quick-links-too section .box-1-2:first-child { padding: 0px; } #quick-links-too section .box-1-2:first-child article { width: 100%; max-width: 100%; margin: 0px; padding: 0px 40px; text-align: center; } #quick-links-too section h2 { font-size: 16px; font-weight: 500; letter-spacing: 0.1ex; text-transform: none; } #quick-links-too section p { font-size: 15px; } #quick-links-too section .quick-links { margin-top: 25px; padding-left: 95px; padding-right: 95px; display: block; height: auto; } #quick-links-too section .quick-links a.cta { width: 100%; max-width: 100%; height: 52px; margin-bottom: 18px; font-size: 10px; } #quick-links-too section .box-1-2:last-child{ margin-top: 0px; } #quick-links-too section .box-1-2:last-child .inner-box { width: 250px; padding: 25px; } #quick-links-too section .box-1-2:last-child .inner-box a.cta { margin-top: 0px; width: 110px; font-size: 10px; height: 40px; } #quick-links-too section .box-1-2:last-child .inner-box p { margin-bottom: 0px; } #quick-links-too section .inner-box article { margin-bottom: 18px; } #quick-links-side { padding: 40px 0px 30px; margin-bottom: 30px; } #quick-links-side section { display: block; } #quick-links-side section, #quick-links-side section .box-1-2:first-child { padding: 0px; } #quick-links-side section article { width: 100%; max-width: 100%; margin: 0px; padding: 0px 40px; text-align: center; } #quick-links-side section h2 { font-size: 16px; font-weight: 500; letter-spacing: 0.1ex; text-transform: none; } #quick-links-side section p { font-size: 15px; } #quick-links-side section .quick-links { width: 100%; float: none; margin-top: 25px; padding-left: 95px; padding-right: 95px; display: block; height: auto; margin-left: auto; margin-right: auto; } #quick-links-side section .quick-links a.cta { width: 100%; max-width: 100%; height: 52px; margin-bottom: 18px; font-size: 10px; } #quick-links-side section .box-1-2:last-child{ margin-top: 0px; } #quick-links-side section .box-1-2:last-child .inner-box { width: 250px; padding: 25px; } #quick-links-side section .box-1-2:last-child .inner-box a.cta { margin-top: 0px; width: 110px; font-size: 10px; height: 40px; } #quick-links-side section .box-1-2:last-child .inner-box p { margin-bottom: 0px; } #quick-links-side section .inner-box article { margin-bottom: 18px; } #teal-box section { display: block; padding: 30px 0px; } #teal-box section .teal-box { width: 100%; float: none; display: block; padding: 30px; } #teal-box section .teal-box article h3 { font-size: 16px; } #teal-box section .teal-box article * { font-size: 13px; } #teal-box section figure { width: 100%; float: none; display: block; } #teal-box section .teal-box article a.cta { width: 200px; max-width: 100%; height: 52px; margin-bottom: 18px; font-size: 10px; } #small-teal-box { background: var(--tertiary-color); } #small-teal-box .small-box img { display: none; } #small-teal-box section .small-box article { margin-left: auto; margin-right: auto; } #small-teal-box section .small-box article h2 { font-size: 18px; } #small-teal-box section .small-box article a.cta { width: 200px; max-width: 100%; height: 52px; margin-bottom: 18px; font-size: 10px; } #small-tel-box { margin-left: 30px; margin-right: 30px; } #small-tel-box h3 { font-size: 15px; } #small-tel-box section article p { font-size: 13px; } #small-tel-box section article a:before { width: 24px; height: 24px; top: 0px; left: -30px; } #small-tel-box section article a { font-size: 18px; } #intro .lift-box img { max-width: 100%; } #blue-box { margin-left: 10px; margin-right: 10px; } #blue-box section { padding: 0px; display: block; } #blue-box section figure { width: 100%; } #blue-box section figure:after { bottom: 0px; left: 0px; top: auto; right: auto; width: 100%; height: 25px; } #blue-box section .blue-box-text { width: 100%; float: none; padding-top: 50px; padding-bottom: 50px; } #blue-box section .blue-box-text article h1 { font-size: 16px; } #blue-box section .blue-box-text article * { font-size: 13px; } .copy-halves section { padding-top: 30px; } .copy-halves section article { padding: 0px 40px; } .copy-halves section article h1, .copy-halves section article .h1 { font-size: 14px; letter-spacing: -0.009ex; margin-bottom: 9px; text-align: center; } .copy-halves section article h2, .copy-halves section article .h2 { font-size: 14px; letter-spacing: -0.009ex; margin-bottom: 9px; text-align: center; } .copy-halves section article h3, .copy-halves section article .h3 { } .copy-halves section article h4, .copy-halves section article .h4 { } .copy-halves section article h5, .copy-halves section article .h5 { } .copy-halves section article p, .copy-halves section article .p { font-size: 15px; letter-spacing: 0.0ex; text-align: center; } .copy-halves section article p strong { color: var(--primary-color); } .copy-halves section div + div article p { width: 150px; margin-left: auto; margin-right: auto; max-width: 150px; } .copy-halves section div + div article p strong { color: var(--font-color); display: block; } #bottom-halves section { padding-top: 0px; display: flex; padding-bottom: 0px; display: block } #bottom-halves section article { padding: 0px 20px; order: 2; -webkit-order: 2; max-width: 100%; } #bottom-halves section article h1, .bottom-halves section article .h1 { font-size: 18px; letter-spacing: -0.009ex; margin-bottom: 9px; text-align: center; } .copy-halves section article h2, .copy-halves section article .h2, #bottom-halves section article h2, .bottom-halves section article .h2 { font-size: 18px; letter-spacing: -0.009ex; margin-bottom: 9px; text-align: center; } #bottom-halves section article h3, .bottom-halves section article .h3 { } #bottom-halves section article h4, .bottom-halves section article .h4 { } #bottom-halves section article h5, .bottom-halves section article .h5 { } #bottom-halves section article p, .bottom-halves section article .p, #bottom-halves section article * { font-size: 15px; letter-spacing: 0.0ex; text-align: center; } #bottom-halves section article.text-left p { text-align: left; } #bottom-halves section article p strong { color: var(--primary-color); } #bottom-halves section article ul { list-style-type: none; } #bottom-halves section article ul strong { display: block; } #bottom-halves section aside { order: 1; -webkit-order: 1; width: 100%; max-width: 100%; float: none; padding-bottom: 0px; } #bottom-halves section aside img { width: 100%; } #bottom-halves section aside > div { display: inline; width: auto; margin-left: auto; margin-right: auto; margin-bottom: 25px; } #bottom-halves section aside > div img.left { max-width: 70px; width: auto; float: left!important; position: relative; top: 5px; margin-right: 5px; } #bottom-halves section aside > div hr { max-width: 285px; margin: auto; } #bottom-halves section aside > div h2 { font-size: 17px; position: relative; top: 15px; margin-bottom: 15px; } #bottom-halves section article ul li strong:after { display: none; } #button-bar .button-bar { justify-content: center; } #blue-box + #bottom-halves section aside { order: 2; -webkit-order: 2; margin-bottom: 20px; padding-top: 60px; background-size: 300px; background-position: top; } #blue-box + #bottom-halves section aside h1 { font-size: 18px; font-weight: 500; margin-bottom: 20px; margin-top: 23px; } #blue-box + #bottom-halves section aside a.cta { font-size: 10px; width: 130px; height: 45px; border: 1px solid var(--primary-color); margin-bottom: 0px; } #blue-box + #bottom-halves section article { padding-top: 50px; border-bottom: 1px solid var(--tertiary-color); margin-bottom: 28px; padding-bottom: 30px; } .home-top { display: block } .box-slideshow { padding-top: 0px; } .box-slideshow figure.bg { width: 100%; height: 420px; } .box-slideshow figcaption { width: 100%; height: 185px; display: block; text-align: right; padding: 0px 20px; } .box-slideshow figcaption h2, .box-slideshow figcaption h2:hover { display: inline-block; width: auto; padding-top: 10px; top: 0px; margin-bottom: 0px; padding-left: 20px; font-size: 20px; margin-bottom: 10px; padding-bottom: 10px; } .box-slideshow figcaption h2:hover:before, .box-slideshow figcaption h2:before { bottom: 100%; left: 0px; width: 100%; height: 15px; top: auto; } .box-slideshow figcaption p { width: 100%; display: block; float: right; padding-top: 0px; padding-right: 20px; } .box-slideshow .bx-pager { bottom: 18px; right: 38px; } .box-slideshow { max-height: 870px; } .box-slideshow #trip-planner { display: block; } .box-slideshow #trip-planner legend { display: none; } .box-slideshow #trip-planner input[type=text]{ max-width: 100%; height: 55px; margin: 16px 0px; font-size: 16px; } .box-slideshow #trip-planner button, .box-slideshow #trip-planner input[type=submit] { width: 100%; margin-top: 16px; } #trip-planner { display: block; } #trip-planner legend { padding-left: 0px; } #trip-planner input[type=text] { margin: 5px 0px; } section details[open] summary:before { transform: translateY(-50%)!important; } details details span { position: static!important; transform: none!important; } .box-sidebar { padding-bottom: 3px; } .box-sidebar .button { margin-bottom: 15px; } .box-sidebar .button .button-inner { border: none; display: block; padding: 10px; } .box-sidebar .button .button-inner:after { content: "" ; clear: both; display: block; } .box-sidebar .button .button-inner figure { float: left; max-width: 100px; padding: 10px; height: 75px; padding: 0px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .box-sidebar .button .button-inner figure svg { max-width: 100%; width: 65px; margin-top: 10px; } .box-sidebar .button .button-inner figcaption { width: calc( 100% - 120px ); height: 70px; float: left; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; border: 1px solid var(--quaternary-color); } .box-sidebar .button .button-inner:hover { background: none } .box-sidebar .button .button-inner:hover figure svg .primaryfill { fill: var(--primary-color)!important; } .box-sidebar .button .button-inner:hover figure svg .secondaryfill { fill: var(--secondary-color)!important; } .box-sidebar .button .button-inner:hover figcaption { color: #FFF; background: var(--quaternary-color); } .home-bottom { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .home-bottom .box-bottom-slider { order: 3; -webkit-order: 3; height: 235px; } .home-bottom .box-bottom-slider { } .home-bottom .box-bottom-slider li { height: 235px; } .home-bottom .box-bottom-slider figcaption { bottom: auto; top: 5px; left: -8px; width: 190px; } .home-bottom .box-bottom-slider li.new figcaption article { margin-left: 10px; max-width: 120px; } .home-bottom .box-bottom-slider li.new figcaption article h2 { font-size: 20px; } .home-bottom .box-bottom-slider figcaption h3 { font-size: 20px; letter-spacing: 0ex; } .home-bottom .box-bottom-slider figcaption h4, .home-bottom .box-bottom-slider figcaption p { font-size: 13px; padding-top: 5px; letter-spacing: 0.1ex; line-height: 1.5; } .home-bottom .box-bottombutton { width: 100%!important; height: 180px; } .home-bottom .box-bottombutton .button-inner figure, .home-bottom .box-bottombutton .button-inner figure svg { height: 50px; } .home-bottom .box-bottombutton .button-inner figcaption { font-size: 15px; } .home-bottom .box-bottom-slider .bx-pager { left: 25px; } .table table tbody tr td, #fares-alt section table tbody tr td, #fares section details > div table tbody tr td { background: #FFF; color: var(--primary-color); } .table table tbody tr td:first-child, #fares-alt section table tbody tr td:first-child, #fares section details > div table tbody tr td:first-child { background: var(--primary-color); font-family: var(--primary-font); text-transform: uppercase; width: 100%; color: #FFF; display: block!important; border:none!important; } .twocol hr, .threecol hr, .fourcol hr { column-break-before: initial; -webkit-column-break-before: initial; } #fares-alt section > div table thead { display: none; } #zones-title { background-image: none; background-color: var(--tertiary-color); } details table tr { margin: 0px; } .table table { border-left: 1px solid var(--primary-color); } .table table thead, #fares-alt section table tbody td:first-child:before { display: none; } .table table tbody tr td:before, #fares-alt section table tbody td:before { content: attr(data-head) } .table table thead th, .table table tbody tr td, #accordions details article table thead th, #accordions details article table tbody td, #fares-alt section table thead th, #fares-alt section table tbody td, #fares-alt section > div table tbody td, #fares section details > div table thead th, #fares section details > div table tbody td, details table tr td, #calendar-dates section details table tbody td { width: 100%; height: auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-size: 14px; } #fares-alt section table tr td:before, details table tr td:before { padding: 15px 5px; font-size: 14px; width: 50%; float: left } #fares-alt section table tr td:after, details table tr td:after { content: ""; clear: both; display: block; } #accordions details article table tbody td:first-child, #fares-alt section table tbody td:first-child, #fares section details > div table tbody td:first-child { padding: 10px; } #zones section ol li::before { width: 50px; position: static; height: 100px; margin: auto; } #zones section ol li { padding-left: 0px; } #fare-types section .compass img { margin: 0px auto!important; display: block; padding: 0px; } #fare-types section .types { padding-left: 15px; } #fare-types section .compass p { font-size: 14px; } #fare-types section .compass p br { display: none; text-align: center; } #fare-types section .compass a.cta { margin-left: auto; margin-right: auto; display: block; margin-bottom: 15px; text-align: center; } #slim-blue section { padding: 0px 0px; margin: 0px 30px; width: calc( 100% - 60px ); } #slim-blue section figure { width: 100%; float: none; } #slim-blue section figure:after { bottom: -1px; left: 0px; width: 100%; height: 30px; top: auto; } #slim-blue section div { width: 100%; float: none; padding: 30px; } #slim-blue section figure article { } #bottom-big article { padding: 30px!important; border: none!important; } #header-teal-short section .teal { width: 100%; float: none; margin-bottom: 25px; text-align: center; justify-content: center; } #header-teal-short section .buttonbox { float: none; margin-left: auto; margin-right: auto; display: block; } #facts-sheets section { flex-direction: column; } #facts-sheets section .list { width: 100%; } main section { padding-left: 35px; padding-right: 35px; } #board-of-directors section ul li.board-member { border: none!important; width: 100%!important; } #accordions details article dl dt { border-right: 0px; width: 100%; float: none; } #accordions details article dl dd { width: 100%; float: none; height: auto; padding-top: 15px; padding-bottom: 15px; } #board-of-directors section ul li.board-member figure { width: 100%; float: none; margin-bottom: 0px; text-align: left; } #board-of-directors section ul li.board-member figure img { float: left; margin-right: 15px; max-width: 125px; } #board-of-directors section ul li.board-member figure:after { clear: both; display: block; content: ""; margin-bottom: 15px; } #board-of-directors section ul li.board-member .details { width: 100%; float: none; clear: both; margin-top: 15px; } #alternates { margin-top: 0px; } #ordinances section, #alternates section { display: block; padding: 30px 30px; } #ordinances section *, #alternates section h2, #alternates section ul { width: 100%; float: none; } #facts-sheets section .list h2 { margin-bottom :40px; } #reports section details summary { padding-right: 40px; } #calendar-dates section details summary { padding-left: 30px; padding-right: 30px; } #calendar-dates section details table tbody tr td:first-child, #calendar-dates section details table thead th { vertical-align: middle; padding-top: 15px; height: 50px; display: block; } #calendar-dates section details table thead th { display: block; } #calendar-dates section details table thead th, #calendar-dates section details table tbody td { width: 100%; } #calendar-dates section details table tr { margin-bottom: 35px; } #button-bar .button-bar { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #button-bar .button-bar a.cta { min-width: 150px; height: 65px; margin-left: 5px; margin-right: 5px; font-size: 12px; } #message section .letter { padding: 45px; } #message section .letter img { max-width: 100%; } .titlebar { background-image: none!important } #wide-text section article .equal-heights { display: block; margin-bottom: 25px; } #wide-text section article .equal-heights .blue-box { width: 100%!important; min-width: 100%!important; float: none; margin-bottom: 50px; } #accessibility-faqs section details summary { padding-right: 45px; } #accessibility-faqs section details article p a.cta { display: flex; margin: 0px auto 25px; } #accordions section > h2:after { top: auto; bottom: -30px; } #accordions details summary { padding-left: 60px; padding-right: 60px; font-size: 14px; } #accordions section > h2 { font-size: 22px; } #contact-boxes section ul { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } #contact-boxes section ul li { width: 100%; margin-bottom: 25px; } hr { width: calc( 100vw - 50px )!important; margin-left: auto!important; margin-right: auto!important; } .page-template-lift-paratransit-page #accordions details article ul { padding-left: 15px; } .page-template-lift-paratransit-page #accordions .button-container a.cta { margin: 10px 0px; } #transit-centers section { padding: 0px 15px; } #transit-centers section .tabs .transit-tab { padding: 0px 15px; } #transit-centers section .tabs .transit-tab .tab-inner { padding: 15px 0px; } #transit-centers section .tabs > ul { width: 145px; max-height: 49px; overflow: hidden; float: right; border: none; display: block; position: relative; z-index: 2; border-bottom: 1px solid var(--primary-color); padding-top: 49px; top: -50px; } #transit-centers section .tabs > ul:after { position: absolute; top: 0px; right: 0px; width: 20%; height: 100%; content: "\f107"; font-family: 'Font Awesome 5 Free'; font-weight: 500; color: #FFF; z-index: 2; text-align: right; padding-top: 20px; padding-right: 10px; } #transit-centers section .tabs:before { content: "Select your mode from the menu:"; position: absolute; left: 0px; font-family: var(--secondary-font); font-size: 14px; white-space: nowrap; top: -24px; width: 100%; text-align: center; letter-spacing: 0.04ex; } #transit-centers section .tabs > ul li { width: 100%; border-bottom: 1px solid var(--primary-color); } #transit-centers section .tabs > ul li a { width: 100%; height: 50px; font-size: 15px; font-weight: 500; letter-spacing: 0.0ex; float: right; background: #FFF; border-top: 0px;} #transit-centers section .tabs > ul li.ui-state-active { z-index: 1; position: absolute; top: 0px; right: 0px; } #transit-centers section .tabs > ul.open { overflow: visible; } #transit-centers section .tabs > ul.open:after { content: "\f106" } #transit-centers section .tabs > ul li.ui-state-active a { font-weight: 500; letter-spacing: 0.1ex; } #transit-centers section .tabs .transit-tab .tab-inner details summary { padding-left: 0px!important; padding-right: 0px!important; text-align: left!important; } #transit-centers section .tabs .transit-tab .tab-inner details.large-bar > summary { padding-left: 15px!important; } #transit-centers section .tabs .transit-tab .tab-inner details details { margin: 0px; } #transit-centers section .tabs .transit-tab .tab-inner details > address { position: static; display: block; margin-bottom: 15px; } #schedules-tabs section .tabs .schedules .results .route-result .route-header a { float: right; margin-top: 25px; } #schedules-tabs section { padding-left: 15px; padding-right: 15px } #schedules-tabs section .tabs { position: relative; padding-top: 56px; } #schedules-tabs section .tabs > ul { width: 145px; max-height: 49px; overflow: hidden; float: right; border: none; display: block; position: relative; z-index: 2; border-bottom: 1px solid var(--primary-color); padding-top: 49px; top: -50px; margin-bottom: -1px; } .tabs > ul:before { display: block; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 2; cursor: pointer; } #schedules-tabs section .tabs > ul:before { display: block; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 2; cursor: pointer; } #schedules-tabs section .tabs > ul em { display: none; } #schedules-tabs section .tabs > ul:after { position: absolute; top: 0px; right: 0px; width: 20%; height: 100%; content: "\f107"; font-family: 'Font Awesome 5 Free'; font-weight: 600; color: #FFF; z-index: 2; text-align: right; padding-top: 20px; padding-right: 10px; } /* #schedules-tabs section .tabs:before { content: "Select your mode from the menu:"; position: absolute; left: 0px; font-family: var(--secondary-font); font-size: 14px; white-space: nowrap; top: -24px; width: 100%; text-align: center; letter-spacing: 0.04ex; } */ #schedules-tabs section .tabs > ul li { width: 100%; border-bottom: 1px solid var(--primary-color); } #schedules-tabs section .tabs > ul li a { width: 100%; height: 50px; font-size: 15px; font-weight: 500; letter-spacing: 0.0ex; float: right; background: #FFF; border-top: 0px;} #schedules-tabs section .tabs > ul li.ui-state-active { z-index: 1; position: absolute; top: 0px; right: 0px; } #schedules-tabs section .tabs > ul.open { overflow: visible; } #schedules-tabs section .tabs > ul.open:after { content: "\f106" } #schedules-tabs section .tabs > ul li.ui-state-active a { font-weight: 500; letter-spacing: 0.1ex; } #schedules-tabs section .tabs .schedules { min-height: 0px; } #schedules-tabs section .tabs .schedules .equal-heights { display: block!important; } #schedules-tabs section .tabs .schedules .sorter { width: 100%; float: none; min-height: 0px; padding: 0px 15px; } textarea, input[type=search], input[type=number], input[type=email], select, input[type=date], input[type=text] { height: 52px; } #schedules-tabs section .tabs .schedules .results { width: 100%; float: none; clear: both; display: block; padding: 20px 15px; border-left: 0px; } #schedules-tabs section .tabs .schedules .results .route-result .route-header div { display: block; width: 100%; text-align: right; margin-bottom: 20px; } #schedules-tabs section .tabs .schedules .results .route-result.activeroute .route dl { padding-right: 10px; } #schedules-tabs section .tabs .schedules .results .route-result dl dt { padding: 30px 0px 0px 30px; height: 50px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } #schedules-tabs section .tabs .schedules .results .route-result dl dd { padding: 0px 0px 30px 30px; } #schedules-tabs section .tabs .schedules .results .route-result dl dt:after { left: 8px; } #schedules-tabs section .tabs .schedules .results .route-result dl dd:after { left: 13px; } #schedules-tabs section { max-height: 100%; } #parking section h2 { font-size: 22px; } #parking section details > summary { font-size: 14px; } #vehicle-notice section { margin: 0px 15px; width: calc( 100% - 30px ); padding: 40px 25px; } #vehicle-notice section figure { left: 50%; } #vehicle-notice section ul { display: block; text-align: center; } .page-template-contact-page main form .box-1-2 { padding-right: 0px; } .page-template-contact-page main form .box-1-2 + .box-1-2 { padding-left: 0px; } .page-template-contact-page main div.comments textarea { height: 200px; } .page-template-contact-page main div.comments { width: 100%; margin-bottom: 20px; height: auto; } .page-template-contact-page main div.comments + .send { height: auto!important; width: 100%; } #key-contacts table th, #key-contacts table td { width: 100%; } #key-contacts table tr td:nth-child(1) { display: block; padding-top: 15px; } .page-template-contact-page main input[type=text], .page-template-contact-page main input[type=date], .page-template-contact-page main input[type=tel], .page-template-contact-page main input[type=email], .page-template-contact-page main textarea, .page-template-contact-page main select { height: 40px; padding-left: 10px; font-size: 16px; } .wpcf7-form-control-wrap.typerequest, .wpcf7-form-control-wrap.litigation { width: 100%; float: none; display: block; clear: both; padding-left: 30px; padding-top: 30px; } .page-template-business #accordions details .sliderz { padding-left: 20px; padding-right: 20px; } .page-template-business #accordions details .bx-wrapper .bx-prev { left: -20px; } .page-template-business #accordions details .bx-wrapper .bx-next { right: -40px; } .page-template-business #accordions details .event-slider li div.event .event-slider li div.event { width: 280px; } .page-template-business #accordions details .event-slider li div.event .event-slider li div.event div.meta .left { } #alerts-tabs section .tabs .tab-outer .tab-inner .alert label.button { width: 100%; } #alerts-tabs section .tabs .tab-outer .tab-inner .alert time, #alerts-tabs section .tabs .tab-outer .tab-inner .alert h4 { max-width: 100%; } #blue-side-box section .blue-box article { padding: 35px 20px; } #blue-side-box section .copy-box { width: 100%; max-width: 100% } #blue-side-box section .equal-heights { display: block!important; } #newsbox section .latest-news { width: 100%; max-width: 100%; float: none; } #newsbox section .media-relations { width: 100%; max-width: 100%; float: none; } #newsbox section .media-relations article a.cta { float: none; position: static; } #newsbox section .media-relations .media-safety { float: none; margin-left: auto; margin-right: auto; } #newsbox section .media-relations .media-safety figure { left: 50%; } #newsbox section .latest-news .title { height: auto; display: block; padding: 10px; } #newsbox section .latest-news .news-results li:hover, #newsbox section .latest-news .news-results li { height: auto; padding: 0px 15px; } #newsbox section .latest-news .news-results li figure { margin: 0px; float: none; } #newsbox section .latest-news .news-results li figcaption { margin: auto; float: none; width: 100%; padding: 15px 0px; } #newsbox section .latest-news .news-results li:hover figure { width: 90px; height: 90px; } #newsbox section .latest-news .news-results li:hover figcaption { margin: auto; float: none; width: 100%; padding: 15px 0px; } #news-post section nav.pagination a { display: block; float: none!important; text-align: center; } #job-blue-box section .equal-heights { display: block!important; } #job-blue-box section figure:after { width: 100%; height: 40px; bottom: 0px; left: 0px; top: auto; right: auto; } #job-blue-box section figcaption h1 { padding-top: 20px; padding-bottom: 20px; } #blue-links-bar .blue-box a.cta { margin: 20px auto; } #career-bottom section .blue-box { display: block!important; } #career-bottom section figure { display: none!important; } #career-bottom section article { padding: 15px; } #header-image .page-title.all.half, #header-image .page-title.all.half + figure { width: 100%; } #right-blue section .equal-heights { display: block; } #right-blue section figure { max-width: 100%; } #right-blue section figure:after { top: auto; bottom: 0px; width: 100%; height: 40px; } #right-blue section figure img { max-width: 100%; } #small-halves section .box-1-2:last-child .newsbox article { padding: 0px 15px; } .instructions { margin: 45px 25px; padding-left: 10px; padding-right: 10px; } .instructions:before { transform: rotate(90deg) translateY(-30px); right: 0px; } #intro section aside, .page-template-safety-security-page #intro section > div:first-child { width: 100%; max-width: 100%; } #blue-left section .blue-box { display: block; } #blue-left section figure, #blue-left section .blue-box .text-box { max-width: 100%; } #blue-left section figure img { width: 100%; } #blue-left section figure:after { top: 0px; left: 0px; width: 100%; height: 30px; } #safety-header img { display: none } #intro section aside .lift-box strong { margin-top: 10px; } #lift-bottom section aside, #lift-bottom section div { width: 100%; max-width: 100%; border: none; padding: 0px; } #accordions details article ul { padding-left: 15px; } .page-id-450 #accordions details article a.cta { margin: 10px 0px!important; } #slim-blue section div article h1:after { position: static; display: block; margin-top: 20px; margin-bottom: 0px; } #slim-blue section { display: block; } .twocol-text section article blockquote:before { left: 50%; } details summary span { position: absolute; top: 50%; transform: translateY(-50%) translateX(-50%); left: 50%; width: 100%; text-align: left; padding-left: 15px; padding-right: 35px; font-size: 14px;} details summary:before { top: 50%!important; transform: translateY(-50%)!important } #reports section details ul { padding: 0px 15px; } #reports section details ul li { font-size: 13px; } details:hover summary:before { transform: translateY(-50%) } #teal-box section figure:before { left: 0px; top: 0px; width :100%; height: 40px; } #safety-header section { height: auto; padding: 15px 0px; } #safety-header section .title h2 { font-size: 24px; } #center-copy section { padding: 25px; } #bottom-big section article a.cta { margin: 20px auto!important; display: flex; } #bottom-big section article h3 br { display: none; } #header-yellow section:before { display: none; } #header-teal-short section { padding-left: 0px; padding-right: 0px; } #transit-centers section .tabs .transit-tab .tab-inner aside .tealbox { max-width: 100%; } #page-foot section { padding-left: 15px; padding-right: 15px; } #page-foot { height: var(--footer-height); } #page-foot section input[type=checkbox]:checked ~ h5 { max-width: 0px; float: right; padding: 0px; } #page-foot section #partner-list .bx-wrapper { margin: auto; background: var(--primary-color); } #page-foot section .foot-container { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; position: relative; } #page-foot section { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 0px; } #page-foot section .bx-prev, #page-foot section .bx-next { margin-top: -17px; } #page-foot section #partner-list { position: absolute; bottom: 0px; left: 0px; background: #FFF; height: 50px; top: auto; } #page-foot section #partner-list img, #page-foot section #partner-list svg { max-height: 40px; min-height: 40px; } #page-foot section .bx-prev:after, #page-foot section .bx-next:after { color: var(--primary-color); } #page-foot section input[type=checkbox]:checked + #partner-list { width: 100vw; background: var(--primary-color) } #page-foot section .footernav { order: 1; -webkit-order: 1; width: 100%; top: 0px; } #page-foot section .footernav ul { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding-left: 15px; padding-right: 15px; padding-top: 20px; top: 0px; } #page-foot section .footernav ul li { margin: 0px; width: calc( 100% / 2 ); margin-bottom: 30px; } #page-foot section .footernav ul li:nth-child(1){ order: 5; -webkit-order: 5; text-align: right; } #page-foot section .footernav ul li:nth-child(2){ order: 4; -webkit-order: 4; text-align: left; } #page-foot section .footernav ul li:nth-child(3){ order: 1; -webkit-order: 1; text-align: left; } #page-foot section .footernav ul li:nth-child(4){ order: 2; -webkit-order: 2; text-align: right; } #page-foot section .footernav ul li:nth-child(5){ order: 3; -webkit-order: 3; text-align: right; } #page-foot section .footernav ul li a { font-size: 12px; margin: 0px; position: relative; z-index: 2; } #page-foot section .social { order: 2; -webkit-order: 2; position: relative; top: -50px; margin-bottom: -33px; } #page-foot section .social li a { font-size: 16px; width: 10px; height: 10px; margin: 0px 8px; } #page-foot section h5 { order: 3; -webkit-order: 3; width: 100%; display: block; background: #FFF; text-align: center; font-size: 12px; padding: 10px; text-align: center; } #page-foot section h5 em { position: relative; top: 0px; } #page-foot section h5 span, #page-foot section h5 a { color: var(--primary-color); font-weight: 500; font-size: 12px; float: none; } #cookies { bottom: 0px; } #cookies .cookies-inner { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } #cookies .cookies-inner h5 { width: 100%; height: 80px; margin: 0px auto 15px; } #cookies .cookies-inner p { width: 100%; max-width: 100%; height: auto; font-size: 15px; padding-left: 15px; padding-right: 15px; } #cookies .cookies-inner .button-container { max-width: 100%; width: 100%; } #contact-form + hr + .accordions details { margin-bottom: 20px; } article p br { display: none; } .blog #header-image.teal figure { max-width: 100%; } input, button { border-radius: 0px!important; } .bg img.mobilebg { max-width: 100%; object-fit: cover; } details summary { text-align: center!important; padding-left: 40px!important; padding-right: 40px!important; } .titlebar section, #zones-title section { padding: 15px 30px; } .titlebar { margin-bottom: 25px; } #bottom-big section article h3, .titlebar section h2, #quick-links-side section article h2, #alternates section h2, #fare-types section .types h2, #ordinances section h2, #zones-title section h2 { font-size: 18px; } details summary:before { right: 15px!important; } #centered-content.big-titles h1, #bottom-big section article h2 { font-size: 26px; } #contact-boxes.big-titles .bluebox { padding-left: 10px; padding-right: 10px; } #slim-blue section div article h2 { font-size: 18px } #bottom-big section article h2:after { top: auto; bottom: -10px; left: 0px; } #ordinances { margin-bottom: 35px; } #board-of-directors section ul li.board-member { padding-right: 0px; } #accordions section details summary:hover:before, #accordions section details[open] summary:before { transform: translateY(-50%)!important; } #accordions section details summary span { padding-right: 35px; } .sitemap section article > .menu-sitemap-container > ul { display: block; } .sitemap section article > .menu-sitemap-container > ul > li { max-width: 100%; width: 100%; } #bottom-slider .trip-slider { margin-top: 20px; } .toggler { display: block } .page-template-business #accordions details .event-slider li { width: auto!important; } .page-template-business #accordions details .sliderz .bx-viewport { min-height: 230px; border-right: 1px solid var(--tertiary-color); border-bottom: 1px solid var(--tertiary-color); } .page-template-business #accordions details .event-slider li div.event { width: calc( 100vw - 110px ) } .page-template-business #accordions details .event-slider li div.event .meta { margin-bottom: 5px; } .page-template-contact-page #key-contacts table th, .page-template-contact-page #key-contacts table td { width: 100%!important; } .page-template-contact-page #key-contacts table td:first-child span { font-size: 14px!important; } .page-template-contact-page #key-contacts table td span { font-size: 10px!important; } .home-bottom .bottom_button_container { width: 100%; height: auto; } .home-bottom .bottom_button_container .box-bottombutton:nth-child(2) .button-inner figure, .home-bottom .bottom_button_container .box-bottombutton:nth-child(3) .button-inner figure { width: 100%; } .home-bottom .bottom_button_container .box-bottombutton:nth-child(2) .button-inner figcaption, .home-bottom .bottom_button_container .box-bottombutton:nth-child(3) .button-inner figcaption { text-align: center; line-height: 1; } .home-bottom .bottom_button_container .box-bottombutton:nth-child(2) .button-inner, .home-bottom .bottom_button_container .box-bottombutton:nth-child(3) .button-inner { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .box-slideshow { position: relative; } #schedules-tabs section .tabs .schedules .sorter input, #schedules-tabs section .tabs .schedules .sorter select, #bottom-slider .trip-planner article #trip-planner input[type=text] { font-size: 16px; } #contact-tabs section > ul { display: block; } #contact-tabs section > ul li a .button-tab { margin-left: auto; margin-right: auto; } #contact-tabs section iframe { height: 2400px; } .listed-icons section ul li figure { float: none; margin: auto; } .listed-icons section article ul li article { float: none!important; padding: 20px 0px; width: 100%!important; } #header-teal + .copy-halves * { text-align: left!important;} .table + .copy-halves section div + div article p, #header-teal + .copy-halves section div + div article p { max-width: 100%!important; width: 100%!important; } #page-foot .footer-logo { margin-bottom: -50px; padding-top: 20px; } #page-foot .footer-logo a img { width: 90px!important; height: 90px!important; } .project-modal.modal figure { width: 100%; float: left; font-size: 0px;} .projects .tabs > ul li a { font-size: 14px; } .project-modal.modal article { width: 100%; padding: 30px 40px; float: left; } article .alignleft, article .align-left { float: none!important; margin-right: 0px!important; margin-left: 0px!important; } article .alignright, article .align-right { float: none!important; margin-left: 0px!important; margin-left: 0px!important; } .child-pages ul li a { height: 60px; } .covid-faq section details summary, #reports section details summary { font-size: 15px; } } #goog-gt-tt {display:none !important;} .goog-te-banner-frame {display:none !important;} .goog-te-menu-value:hover {text-decoration:none !important;} .goog-text-highlight {background-color:transparent !important;box-shadow:none !important;} body {top:0 !important;} #google_translate_element2 {display:none!important;} .grecaptcha-badge { display: none !important; } .wcag { display: none; } #center-copy section article #modal { display: none; }