body,h1,h2,h3,h4,h5,p,input,select {font-family: var(--body-font); font-weight: 400;}
h1,h2,h3,h4,h5,h6 {font-weight: 700;}
h1 {font-size: calc(2rem + 1.5vw);}
h6,.detail-text,.icon-label,.navbar-toggler:before,.btn-close::before,.mfp-close::before,.offcanvas .dropdown-header,.emergency,.anchor-links li a,a.more-link,th,label,.btn,.newsletter-list li,.notice p,.footer-copyright p,cite,.media-controls {}

.icon-label {display: inline-block; font-size: 0.8rem; margin-right: 0.6rem;}
.btn-close::before,.mfp-close::before {content: 'Close'; display: inline-block; margin-right: 0.6rem; font-size: 0.8rem; position: absolute; right: 22px; top: 0px;}
.modal-header .btn-close::before {display: none;}
.section img {height: auto !important;}

.section:not(#popup_terms) ul {list-style-type: none; margin: 0; padding: 0;}
.section:not(#popup_terms) ul li {font-weight: bold; margin-bottom: 10px;}

a {color: var(--primary); text-decoration: none;}
a:hover {text-decoration: underline;}

.banner {position: relative; height: 100dvh; padding-top: 2rem; display: flex; flex-direction: column; justify-content: space-between; background-color: var(--primary); color: white; background-size: cover; border-bottom: 1rem solid var(--secondary);}
.banner::after {content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: linear-gradient(rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.6) 100%);}
.banner-content {text-align: center; color: white; display: flex; justify-content: space-between; align-items: center; flex-direction: column; flex: 1;}
.banner-main {width: 100%;}
.banner-top {display: grid; width: 100%; grid-template-columns: 1fr 1fr 1fr;}
.main-logo {grid-column: 1; text-align: left; transition: 500ms; display: none;}
.main-logo img {width: 200px;}
.banner>* {z-index: 1;}
.banner-video {overflow: hidden; background: black;}
.banner-video video {position: absolute; height: 100dvh; margin-top: -2rem; left: 50%; transform: translateX(-50%);}

.navbar {justify-content: flex-end; align-self: start; grid-column: 3;}
.navbar-toggler:before {content: 'Menu'; margin-right: 0.6rem; font-size: 0.8rem;}

.offcanvas {background: var(--primary); color: white; z-index: 1050;}
.offcanvas.offcanvas-end {width: 100%; padding-top: 2rem;}
.offcanvas-body {display: flex; justify-content: flex-end; text-align: right;}
.offcanvas-body ul {text-align: right; margin-top: 2rem;}
.offcanvas-body .dropdown-toggle::before,.offcanvas-body .dropdown-toggle::after {display: none;}
.offcanvas-body ul.dropdown-menu {background-color: color-mix(in srgb,var(--primary),#fff 20%); text-align: left; margin-bottom: 1rem;}
.offcanvas-body ul.dropdown-menu .dropdown-item:hover {text-decoration: none;}
.offcanvas .dropdown-header {margin: 0.5rem 0;}
.offcanvas .nav-link {display: inline-block;}
.offcanvas .nav-link:hover {text-decoration: none; color: var(--secondary);}
.offcanvas .nav-item.dropdown {display: flex; flex-direction: column; align-items: flex-end;}

.emergency {background: #d13438; color: white; text-align: center; margin: 2rem 0 1rem 0; padding: 10px 10px; position: relative; z-index: 1; border-radius: 10px;}
.emergency p {margin: 0;}
.emergency a {color: white; text-decoration: underline;}

.notices {background-color: var(--secondary); padding: 1.5rem; text-align: center; color: var(--primary);}
#notices_carousel .notice {max-width: calc(100% - 80px); margin: 0 auto;}
.notices p {margin: 0;}
.carousel-control-next, .carousel-control-prev {width: auto;}


.anchor-links {display: none; margin: 0 0 3rem 0; justify-content: space-around; gap: 5px; text-align: center; line-height: 1; list-style-type: none; padding: 0;}
.anchor-links li a {color: white; text-decoration: none; font-size: 0.8rem; text-transform: uppercase; padding-bottom: 2px;}
.anchor-links li a:hover {border-bottom: 1px solid var(--secondary);}

.section h2 {color: var(--secondary); margin-bottom: 2rem;}
.section p+h6 {margin-top: 3rem;}
.section-dark a {color: white;}
.section-green {background-color: var(--secondary); color: white;}
.section-green h2,.section-green a {color: white;}
.section-grey {background-color: var(--colour4);}

.section-overlay {background-color: var(--primary); background-size: cover; padding: 4rem 0;}
.section-overlay .container div {background: white; padding: 4rem; text-align: center;}  
.section-overlay .container div.overlay-brown {background: var(--colour5);}

a.more-link {color: var(--primary); font-weight: bold;}
a.more-link:hover {text-decoration: none; border-bottom: 1px solid var(--secondary);}
.section-dark a.more-link,.section-green a.more-link {color: white;}
.section-dark a.more-link,.section-green a.more-link:hover {border-bottom-color: white;}
.main-icon {width: 3rem; margin-bottom: 1rem;}


.document-list.formatted {margin: 2rem 0;}
.document-list.formatted ul {text-align: left;}
.document-list.formatted ul li {border-bottom: 1px solid var(--secondary); margin: 0 !important;}
.section-green .document-list.formatted ul li {border-bottom-color: white;}
.document-list.formatted ul li a {display: flex; justify-content: space-between; padding: 8px; transition: 0.2s;}
.document-list.formatted ul li a:hover {text-decoration: none; background-color: var(--primary); color: white;}
.document-list.formatted ul li a::after {font-family: 'bootstrap-icons'; content: '\f285';}

.footer {background-color: var(--primary); color: #ddd; text-align: center; font-size: 0.8rem;}
.footer2 {background-color: color-mix(in srgb, var(--primary), #fff 20%);}
.footer h6 {color: var(--secondary);}
.footer a {color: #ddd;}
.footer-main {padding: 4rem 0 2rem 0;}
.footer-main>*:not(:last-child) {margin-bottom: 2rem;}
.footer-main ul {list-style-type: none; margin: 0; padding: 0;}
.footer-main img {max-width: 100px;}
.footer-copyright {padding-top: 1rem;}
.footer-copyright>div {margin-bottom: 1rem;}
.footer-copyright p {margin: 0;}

.social-icons {display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 1rem;}
.social-icons a {display: block; background: color-mix(in srgb, var(--primary), #fff 20%);; border-radius: 50%; padding: 0.6rem; transition: 0.2s;}
.social-icons a:hover {transform: scale(1.2);}
.social-icons img {width: 1.5rem;}


.section h2.accordion-header {margin-bottom: 0;}
.accordion-body {text-align: left;}

.calendar-table {text-align: left;}
.calendar-table thead tr:first-child td {padding-bottom: 2rem;}
.calendar-table button {transition: 0.2s;}
.calendar-table button:hover {transform: scale(1.3);}

.form-control {border: 0; border-radius: 0; border-bottom: 1px solid var(--primary); background-color: transparent; color: inherit;}
.form-response-message img {margin-bottom: 2rem;}


.popup-container {background-color: white; text-align: center; padding: 4rem 1rem 1rem 1rem; max-width: 80%; margin: 2rem 0; display: inline-block; position: relative; border-radius: 4px; transition: 0.5s;}
.popup-container .table {text-align: left;}
#popup_terms,#popup_accessibility {text-align: left;}
.popup-profile .team-image {margin-bottom: 3rem;}
.popup-profile .team-image img {margin-bottom: 1rem;}
.popup-profile .team-image h4 {color: var(--secondary);}
.popup-profile .team-image p {text-transform: uppercase; font-size: 0.8rem;}


.button-menu {display: flex; flex-wrap: wrap; justify-content: center;}
.button-menu-item {width: 47%; margin: 1.5%; color: inherit; text-decoration: none;}
.button-menu-item:hover,a.button-menu-item:active,a.button-menu-item:focus {text-decoration: none; color: inherit;}
.button-menu-title {color: var(--secondary);}
.section-green .button-menu-title {color: white;}
.button-menu-image {width: 100%; transition: 0.2s; margin-bottom: 1rem;}
.button-menu-item p {text-transform: uppercase; font-size: 0.8rem;}
a .button-menu-image:hover {transform: scale(1.1);}

.values {margin: 2rem 0;}

@media (min-width: 768px) {
  .button-menu-item {width: 22%; margin: 1.5%;}

  .values {display: grid; grid-template-columns: 1fr 1fr 1fr;}
  .values>div {padding: 0 1rem;}
  .values>div:not(:last-child) {border-right: 1px solid var(--secondary);}

  .team-image-container {width: 20%; margin: 2.5%;}
  .popup-container {padding: 4rem;}

  .popup-profile {display: flex; gap: 3rem;}
  .popup-profile .lhs {width: 30%;}
  .popup-profile .lhs img {max-width: 100%;}
  .popup-profile .rhs {width: 70%; text-align: left;}

  .offcanvas {background: var(--primary) url('/img/svg/CBS_icon_watermark.svg') no-repeat 0% 50%; background-size: auto 90vh;}

  .section {display: flex;}
  .section-banner {height: 500px;}
  .section-full {display: block;}
  .section.image-right {flex-direction: row-reverse;}
  .section-image {flex: 2; background-color: grey;}
  .section-text {flex: 3; align-self: center; padding: 0;}
  .section-text>div {width: 60%; margin: 8rem auto;}
  .section-main {padding: 4rem;}
  .section-half .section {width: 50%;}

  .section-overlay .container {display: flex; justify-content: flex-end;}
  .section-overlay.overlay-left .container {justify-content: flex-start;}
  .section-overlay .container div {width: 50%;}  


  .calendar-table {table-layout: fixed;}
}


@media (min-width: 992px) {
  .anchor-links {display: flex;}
  .footer {text-align: left;}
  .footer-main {display: grid; grid-auto-columns: 1fr; grid-auto-flow: column; gap: 1rem;}
  .footer-main>* {margin-bottom: 0;}
  .footer-copyright {display: flex; justify-content: space-between;}
  .social-icons {margin: 0; justify-content: flex-end;}
}

@media (min-width: 1200px) {
  .main-logo {display: block;}
}

@media (prefers-reduced-motion) {
  .banner-arrow a img {animation: none;}
  .up-link {transform: scale(1);}
  .gallery-grid img {opacity: 1;}
  .fade-image {animation: none;}
}




#header {position: fixed; width: 100%; z-index: 1000; top: 0; box-shadow: 0 2px 8px rgba(85,85,85,0.7); border-bottom: 2px solid #C3C3C3;}
.translated-ltr #header,.translated-rtl #header {top: 40px;}

#header_badge {display: none;}
#header_text {margin: 5px 0 0 -10px; max-width: 200px; height: 50px;}

.search-link,.translate-link {cursor: pointer;}
.search-menu,.translate-menu {line-height: initial;}
.translate-menu {padding: 10px; position: fixed; top: 60px;}
.search-menu {padding: 5px; min-width: 300px;}
.translate-menu {background: white !important;}
.translated-ltr .translate-menu,.translated-rtl .translate-menu {top: 100px;}
.goog-logo-link {display: inline !important;}

.header_bar {background: var(--header_bg,var(--primary,#333)); height: 30px;}
#menu1,#menu2 {height: 0; min-height: 0; opacity: 0; overflow: hidden; transition: 200ms; position: absolute; top: 60px; box-shadow: 2px 2px 4px #555; z-index: 1000;}
#menu1.expanded,#menu2.expanded {height: var(--mobile_menu_height,300px); opacity: 1;}
#menu1 {left: var(--menu1_mobile_left,0); width: var(--menu1_mobile_width,45%); padding: 0; background: var(--menu1_bg,var(--primary,#333)); overflow-y: auto;}
#menu2 {left: calc(var(--menu1_mobile_left,0%) + var(--menu1_mobile_width,45%)); width: calc(100% - var(--menu1_mobile_width,45%)); background: var(--menu2_bg,#eee); overflow-y: auto;}

.header_bar ul {list-style-type: none; margin: 0; padding: 0; line-height: 30px;}
.header_bar ul li {display: block; margin-right: 0; position: relative;}
.header_bar ul li a {color: white; display: block; padding: 0 6px; transition: 0.2s; text-decoration: none;}
.header_bar2 ul li a {color: var(--menu1_fg,#eee);}
.header_bar3 ul li a {color: var(--menu2_fg,#333);}

.header_bar ul li.hasMenu>a:before {content: "\e259"; float: right; font-family: 'Glyphicons Halflings';}
.header_bar ul li.hasMenu.menu-opened > a:before {content: "\e260";}
.header_bar ul li.menu-opened .menu {display: block;}

.header-bar .dropdown-menu {display: block; position: static; float: none; background: var(--menu1_bg,var(--primary,#333)); margin-left: 2rem; box-shadow: none; border: none;}
.header-bar .dropdown-menu li a {padding: 2px 5px; display: block; font-weight: 300;}
.header-bar .dropdown-menu li a:hover {background: #bc955c; font-weight: bold;}

.header_bar2 ul li a:hover, .header_bar2 ul li.active>a {background: var(--menu1_hover_bg,var(--secondary,#aaa)); color: var(--menu1_hover_fg,#333);}
.header_bar3 ul li a:hover {background: var(--menu2_hover_bg,var(--secondary,#aaa)); color: var(--menu2_hover_fg,#333);}
.header_bar3 {height: 0;}

.header_bar .header_icons {float: right; line-height: 60px; margin-right: 0;}
.header_bar .header_icons li {margin-right: 0 !important; position: relative; float: left;}
.header_bar .header_icons li:hover > a, .header_bar .header_icons li.active > a {background: var(--icon_hover,var(--secondary,#aaa));}
.header_bar .header_icons .tooltip-inner {min-width: 100px;}

.menu-link {width: 44px; height: 60px; padding: 18px 12px !important; background: transparent; margin-right: -15px;}
.menu-link span,.menu-link:before,.menu-link:after {content: ''; background: white; border-radius: 2px; height: 3px; display: block; margin: 3px 0; transition: 0.2s ease-in-out;}
.menu-link.active span {transform: scale(0);}
.menu-link.active:before {transform: translateY(6px) rotate(135deg);}
.menu-link.active:after {transform: translateY(-6px) rotate(-135deg);}

.header_bar2 .tooltip-inner {min-width: 150px;}

.header_bar ul li .menu {margin-left: 10px; display: none;}
.header_bar ul li .menu ul {line-height: 26px; width: 100%;}
.header_bar ul li .menu li {display: block; margin-right: 0; float: none; font-size: 1.3rem;}
.header_bar ul li .menu li a i.pull-right {line-height: 26px;}
.header_bar2 ul li .menu li {border-left: 2px solid var(--menu1_fg,#eee);}
.header_bar3 ul li .menu li {border-left: 2px solid var(--menu2_fg,#333);}

.header_bar2 ul li .menu {display: block;}

/* Dropdowns from the top icon menu (incl MV16 text menu) */
.header_bar1 .dropdown-menu {left: auto; right: 0; background: var(--dropdown_bg,var(--primary,#333)); z-index: 10000;}
.header_bar1 .dropdown-menu li {float: none;}
.header_bar1 .dropdown-menu li a {color: var(--dropdown_fg,#eee); padding: 4px 5px;}
.header_bar1 .dropdown-menu li a:hover {background: var(--dropdown_hover_bg,#aaa); color: var(--dropdown_hover_fg,#eee);}

@media (min-width: 768px) {
  #menu1 {left: var(--menu1_tablet_left,40%); width: var(--menu1_tablet_width,30%);}
  #menu2 {left: calc(var(--menu1_tablet_left,40%) + var(--menu1_tablet_width,30%)); width: calc(60% - var(--menu1_tablet_width,30%));}
}

@media (min-width: 1200px) {
  #header {border: none; background: transparent; box-shadow: none; transition: 0.5s;}
  #header.opaque {background: var(--header_bg,var(--primary,#333)); padding-bottom: 10px; box-shadow: 0 5px 5px rgba(0,0,0,0.4);}

  .opaque #header_badge {display: block; float: left; text-decoration: none;}
  .opaque #header_badge img {height: 60px;}

  #header_text {display: none;}

  .header_bar {height: 26px; background: transparent; box-shadow: none; border: none;}
  .header_bar ul li a,.header_bar ul li a:focus {color: white; transition: none;}
  .header_bar ul li .menu li a {color: var(--dropdown_fg,#eee);}
  .header_bar1 {margin-top: 10px;}
  .header_bar ul {font-size: 1rem; line-height: 22px;}
  .header_bar .header_icons {margin: 0 0 4px 0; line-height: 22px;}

  .header_bar2 ul li .menu {display: none;}
  .header_bar ul li .dropdown-menu, .header_bar ul li .menu {position: absolute; line-height: 26px; margin: 0; z-index: 10; border: 1px solid rgba(0,0,0,0.15); box-shadow: 0 6px 12px rgba(0,0,0,0.175);}
  .header_bar ul li .menu {width: 180px;}
  .header_bar ul li .menu ul {float: left;}
  .header_bar ul li:hover .menu {display: block;}
  #menu1 li .menu li,#menu2 li .menu li {border: none;}
  .header_bar .dropdown-menu li a:hover,.header_bar .menu li a:hover {background: var(--dropdown_hover_bg,var(--secondary,#aaa)); color: var(--dropdown_hover_fg,#eee);}

  .translate-menu,.translated-ltr .translate-menu,.translated-rtl .translate-menu {position: absolute; top: 30px;}
  #menu1,#menu2 {display: block; position: static; width: auto; box-shadow: none; height: auto; opacity: 1; border-top: none; background: transparent; overflow: visible; float: right; clear: right;}
  #menu1 > li,#menu2 > li {float: left;}

  .header_bar ul li.hasMenu>a:before {display: none;}

  #menu1 > li > a,#menu2 > li > a {border-bottom: 4px solid transparent;}
  #menu1 > li.active > a, #menu1 > li:hover > a, #menu2 > li.active > a, #menu2 > li:hover > a {background: none; border-bottom-color: var(--link_hover,var(--secondary,#aaa)); color: white;}
  .opaque #menu1 > li.active > a, .opaque #menu1 > li:hover > a, .opaque #menu2 > li:hover > a {border-bottom-color: var(--opaque_link_hover,var(--secondary,#aaa));}

  .header_bar .dropdown-menu,.header_bar .menu {background: var(--dropdown_bg,var(--primary,#333)); padding: 5px;}
  .header_bar .dropdown-menu li,.header_bar .menu li {float: none; margin: 0;}
  .opaque .header_bar .dropdown-menu,.opaque .header_bar .menu {background: var(--opaque_dropdown_bg,var(--secondary,#888));}
  .opaque .header_bar .dropdown-menu li a,.opaque .header_bar .menu li a {color: var(--opaque_dropdown_fg,#eee);}
  .opaque .header_bar .dropdown-menu li a:hover,.opaque .header_bar .menu li a:hover {background: var(--opaque_dropdown_hover_bg,var(--primary,#333)); color: var(--opaque_dropdown_hover_fg,#eee);}
}