@charset "UTF-8";
html {height: 101%; margin: 0; padding: 0; min-height: 101%;}

@import url("https://fonts.googleapis.com/css2?family=Hind+Guntur:wght@300;400;500;600;700&display=swap");
/* font-family: 'Hind Guntur', sans-serif; */

body {font-family: "Hind Guntur", sans-serif; font-weight: 400; font-size: 100%; font-style: normal; margin: 0; padding: 0; height: 100%; position: relative; overflow-x: hidden; background: #00365a; min-height: 101%;}
img {display: block; margin: 0; outline: none; padding: 0; vertical-align: bottom; max-width: 100%;}
hr {width: 100%; height: 1px; background: #cdcdcd; border: none; margin: 10px auto;}

img.seecmsimagedefault {display: inline-block; margin: 0 20px 20px 20px!important;}
img.seecmsimageleft {float: left; margin: 0 20px 20px 0!important;}
img.seecmsimageright {float: right; margin: 0 0 20px 20px!important;}
img.seecmsimagecentre {display: block; margin: 0 auto;}

h1, .header p, nav li a, h2, .thumbs a span, .content article aside p, nav .button a, nav.snav .sectiontitle p, header p {font-style: normal; font-weight: 300;}
p, h1, h2, h3, h4, li {margin: 0; padding: 0; line-height: 1.4em; color: #2f2f2f;}
p {color: #2f2f2f; padding: 0 0 20px 0; line-height: 130%;}
ul {margin: 0; padding: 0;}
strong {font-weight: 700;}

.col1, .col2, .col3, .col4 {display: block; float: left;}
div:after, form:after, ul:after, input:after, section:after, article:after, header:after, footer:after, nav:after, aside:after, hgroup:after {clear: both; content: ""; display: block; height: 0; visibility: hidden;}
section, article, header, footer, nav, aside, hgroup {display: block;}

input[type="text"], input[type="tel"], input[type="email"], input[type="password"], textarea, select, button {width: 100%; padding: 0 2%; box-sizing: border-box; height: 40px; background: #ffffff; border: 1px solid #cccccc; margin: 5px 0 15px 0; outline: none; resize: none; font-family: "Hind Guntur", sans-serif; font-weight: 300; font-size: 90%;}
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px white inset;}
label {color: #2f2f2f; font-size: 100%; font-weight: 700;}
textarea {height: 130px; padding: 10px 2%;}
input[type="checkbox"] {width: 20px; height: 20px; float: left; margin: 0 10px 0 0;}
input[type="text"], input[type="email"], input[type="submit"], textarea, button, input[type="password"] {-webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0;}
input[type="submit"] {width: auto; height: 30px; cursor: pointer; border: none; padding: 0 20px; color: #ffffff; text-transform: uppercase; font-weight: 600; background: #005389; outline: none;}

form table input[type] {margin: 0;}
form table input[type="checkbox"] {margin: 0 10px 0 0;}
.content form table th {vertical-align: middle; line-height: 1;}
form table .smalltext {display: block; font-size: 90%; margin: 5px 0 0;}

.clear {clear: both;}
p.smalltext {font-size: 90%!important;}

.urgentmessage-wrap {width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 99999;}
.urgentmessage {width: 80%; max-width: 1180px; position: absolute; z-index: 40; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; border-radius: 12px; max-height: 100vh; overflow-y: scroll;}
.urgentmessage .inner {padding: 20px 40px;}
.urgentmessage .inner p.closepopup {display: inline-block;}
.urgentmessage .inner p.closepopup a {display: block; background: #005389; color: #ffffff; padding: 8px 16px; cursor: pointer; text-decoration: none;}
.urgentmessage-wrap .blackoverlay {background: black; opacity: 0.8; width: 100%; height: 100%; position: fixed;}

.inputfile * {box-sizing: border-box;}
.inputfile {width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1; min-width: initial!important;}
.inputfile + label {font-weight: 700; color: #000000; background: #ffffff; display: inline-block; padding: 10px 20px 5px 20px; width: 100%; text-align: center; box-sizing: border-box; line-height: 1;}
.inputfile:focus + label, .inputfile + label:hover {background: #5d1e9c; color: #ffffff;}
.inputfile + label {cursor: pointer; /* "hand" cursor */}
.inputfile:focus + label {outline: -webkit-focus-ring-color auto 5px;}
.inputfile + label * {pointer-events: none;}

.formmessage {background: #d1e7d1; margin: 0 0 20px 0; padding: 20px 30px 16px 30px;}
.formmessage p {margin: 0; padding: 0; font-weight: 700;}

.updatechamber.form {padding: 30px; background: #f2f2f2;}
.updatechamber.form .row {display: grid; column-gap: 20px; margin: 0 0 15px 0;}
.updatechamber.form .row.halves {grid-template-columns: repeat(2, 1fr);}
.updatechamber.form .row.thirds {grid-template-columns: repeat(3, 1fr);}
.updatechamber.form .row input, .updatechamber.form .row select, .updatechamber.form .row textarea {margin: 0;}
.updatechamber .inner {grid-template-columns: 1fr 250px; column-gap: 30px; margin: 0 0 20px 0; display: grid;}
.updatechamber .inner .profileimage {width: 100%;}
.updatechamber .seecrmphotoupload {min-height: 100%; display: flex;}
.updatechamber img {margin: 0 0 20px 0;}
.updatechamber .savebutton {display: flex; align-items: center; align-content: center; justify-content: center;}
.updatechamber input[type="submit"] {height: 40px; font-size: 0.9rem;}

.confirm p.inputnote {font-size: 0.8rem; margin: 10px 0 0 0;}

.top-wrap {border-top: 6px solid #005389; background: #f3f3f3; padding: 0 20px;}
.top {max-width: 1180px; width: 100%; margin: 0 auto;}
.top .left {float: left; width: 65%;}
.top .left .col1 {float: left; width: 33%;}
.top .left .col2 {float: right; width: auto;}
.top .left .col3 {float: right; width: auto; margin: 0 10px 0 0;}
.top .left p {line-height: 45px; font-size: 90%; font-weight: 600; color: #666666; padding: 0;}
.top .left p a {color: #666666; text-decoration: none;}
.top .left p span {color: #5d1e9c;}
.top .left a:hover {color: #5d1e9c;}
.top .right {float: right; width: 35%;}
.top .right a {height: 45px; line-height: 45px; text-decoration: none; color: #ffffff; font-size: 90%; font-weight: 600; background: #005389; display: inline-block; padding: 0 20px; float: right; position: relative;}
.top .right a:before {content: ""; display: block; width: 100%; height: 6px; background: inherit; position: absolute; left: 0; top: -6px;}
.top .right a:hover {background: #00365a;}
.top .right a.joinnow {background: #007ed0; display: none;}
.top .search {float: right;}
.top .search input {width: 200px; height: 45px; line-height: 45px; background: none; border: none; outline: none; padding: 0; margin: 0; text-align: left; font-weight: 600; float: left; color: #666666;}
.top .search input.submitbutton {width: 40px; padding: 0; margin: 0; background: url(../images/search-icon.png) no-repeat center center; cursor: pointer;}
.top .search input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px #f3f3f3 inset;}

.header-wrap {padding: 0 20px; background: #ffffff;}
.header {max-width: 1180px; width: 100%; margin: 0 auto; padding: 20px 0; border-bottom: 1px solid #cdcdcd;}
.header a.logo {display: block; width: 100%; height: 42px; background: url(../images/logo.png) no-repeat 0 0; background-size: 100%;}
.header .left {float: left; width: 268px;}
.header .right {float: right; width: 850px; padding-top: 16px;} /* Changed 700px to 750px to accomodate new "Publications" page - ticket #8385604 MH */
.header .nav ul {width: 105%; display: table; margin-left: -2%;}
.header .nav li {list-style: none; display: table-cell; padding: 0 10px; text-align: center;}
.header .nav li a {text-decoration: none; font-weight: 600; color: #005389; font-size: 90%;}
.header .nav li.selected a, .header .nav li:hover a {color: #5d1e9c;}

.title-wrap {padding: 0 20px; background: #ffffff;}
.title#members-home {border: none; padding: 30px 0 0;}
.title {max-width: 1180px; width: 100%; margin: 0 auto; padding: 30px 0; border-bottom: 1px solid #cdcdcd;}
.title h1 {color: #005389; font-weight: 300; margin: 0; padding: 0; line-height: 110%; font-size: 350%;}
.title .left {float: left; width: 780px; min-height: 5px;}
.title .right {float: right; width: 380px;}

.banners .banner {outline: none;}
.banners .banner img {width: 100%;}

.snav ul {width: 100%; margin: 0!important; padding: 0!important;}
.snav li {padding: 5px 0 5px 40px; list-style: none; background: url(../images/li-back.png) no-repeat left 0; margin: 0 0 10px 0;}
.snav li a {text-decoration: none; font-weight: 700; color: #2f2f2f; font-size: 120%;}
.snav li:hover a, .snav li.selected a {color: #005389;}
.snav li.selected ul {margin: 15px 0 10px 0!important;}
.snav li.selected li {padding: 0; margin: 0 0 5px 0; background: none;}
.snav li.selected li a {color: #2f2f2f; font-size: 100%;}
.snav li.selected li:hover a, .snav li.selected li.selected a {color: #005389;}

.snav #messdates a, .snav #training a, .snav #other a {display: block;}
.snav #messdates a:before, .snav #training a:before, .snav #other a:before {content: "\f02b"; display: inline-block; color: #007ed0; font: normal normal normal 14px/1 FontAwesome; margin: 0 5px 0 0;}

.content-wrap {padding: 0 20px; background: #ffffff;}
.content {max-width: 1180px; width: 100%; margin: 0 auto; padding: 30px 0;}
.content .col1 {float: left; min-height: 5px; width: 217px; margin-right: 24px;}
.content .col2 {float: left; min-height: 5px; width: 619px; margin-right: 20px;}
.content .col3 {float: left; min-height: 5px; width: 300px;}
.content .col1 img, .content .col3 img {margin: 0 0 20px 0!important;}
.content.wide .col2 {width: 939px; margin-right: 0;}
.content.home .col1 {float: left; width: 780px; margin-right: 20px; min-height: 5px;}
.content.home .col2 {float: left; width: 380px; margin-right: 0;}
.content.home .top {margin: 0 0 20px 0;}
.content.home .bottom .col1, .content.home .bottom .col2 {border-top: 1px solid #cdcdcd;}
.content.home {padding: 60px 0 30px;}

/* CW - homepage changes */
.bg-light {background: #f3f3f3; padding: 0 20px;}
.bg-light .content {padding: 60px 0 40px;}
.content.home .top {display: flex; align-items: center; justify-content: space-between;}
.content.home .top:after, .content.home .top *:after {display: none;}
.content.home .top .col1, .content.home .top .col2 {float: none;}
.content.home .top .col1 {width: auto; max-width: 720px;}

.content.home .top .col2 {text-align: center;}
.content.home .top .col2 .loggedin {border: 1px solid #cdcdcd; padding: 40px; box-sizing: border-box;}
.content.home .top .col2 .blockbutton {display: flex; gap: 10px; align-items: center; justify-content: center; padding: 0;}
.content.home .top .col2 .blockbutton a {padding: 10px 20px 7px; background: #5d1e9c; color: #ffffff; text-align: center;}
.content.home .top .col2 .blockbutton a:hover {background: #005389;}

.content h1 {font-size: 180%; font-weight: 400; margin: 0 0 10px 0; line-height: 110%; color: #005389;}
.content h2 {font-size: 100%; text-transform: uppercase; font-weight: 600; margin: 0 0 10px 0; line-height: 110%; color: #5d1e9c;}
.content h3 {font-size: 100%; text-transform: uppercase; font-weight: 600; margin: 0 0 10px 0; line-height: 110%; color: #666666;}
.content h4 {font-size: 100%; text-transform: none; font-weight: 600; margin: 0 0 10px 0; line-height: 110%; color: #005389;}
.content p {font-size: 100%;}
.content li {font-size: 100%;}
.content li li {font-size: 100%;}
.content li p {font-size: 100%; padding: 0;}
.content ol, .content ul {margin: 0 0 20px 17px; padding: 0;}
.content a {text-decoration: none; color: #5d1e9c; font-weight: 700; word-break: break-word;}
.content table {width: 100%; margin: 0 0 20px 0; border: none!important;}
.content table th {padding: 5px; color: #ffffff; font-size: 100%; background: #005389; vertical-align: top; border: none!important;}
.content table td {padding: 5px; color: #666666; font-size: 100%; background: #f1f1f1; vertical-align: top; border: none!important;}
.content table p {font-size: 100%;}
.content.chamber .topsection .left {width: 70%; min-height: 5px; float: left;}
.content.chamber .topsection .right {width: 25%; min-height: 5px; float: right;}

.breadcrumb {padding: 10px 0 0 0;}
.breadcrumb p {font-size: 90%; padding: 0;}
.breadcrumb p a {text-decoration: none; color: #333333;}
.breadcrumb p span {color: #005389;}

.chambers h2 {text-transform: uppercase; color: #005389; font-weight: 700; padding: 15px 0; border-bottom: 1px solid #cdcdcd; font-size: 175%; margin: 0 0 20px 0;}
.chambers ul {width: 102%; margin: 0 0 0 -2%; padding: 0!important;}
.chambers li {float: left; width: 31%; margin: 0 0 2% 2%; list-style: none; font-size: 110%; box-sizing: border-box; height: 200px; display: flex; align-items: center; justify-content: center;}
.chambers li a {text-decoration: none; font-weight: 700; color: #ffffff; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: #005389; text-align: center; padding: 10px; box-sizing: border-box;}
.chambers li:hover a, .chambers li.selected a {background: #00365a;}

.chambersgrid {margin-left: -20px;}
.chambersgrid .chamber {float: left; width: 299px; margin: 0 0 20px 20px;}
.chambersgrid .chamber img {width: 100%;}
.chambersgrid .chamber .image {margin: 0 0 10px 0;}

/* CW - homepage nav */
.chambers ul {width: 100%; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;}
.chambers li {float: none; width: 100%; margin: 0;}

#quicklinks {display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 1fr; gap: 20px; margin: 0 0 30px;}
#quicklinks a {display: flex; flex-direction: column; gap: 10px; padding: 40px 20px; background: #007ed0; color: #ffffff; align-items: center; justify-content: center;}
#quicklinks a p {padding: 0; text-align: center; color: #ffffff;}
#quicklinks a p.title {border: none;}
#quicklinks a p.desc {font-weight: 400;}
#quicklinks:after, #quicklinks *:after {display: none;}

.officers {margin-left: -20px;}
.officers .officer {width: 205px; float: left; margin: 0 0 20px 20px; min-height: 265px;}
.officers .officer h3 {margin: 0!important;}
.officers .officer p {padding: 0!important;}
.officers .officer img {width: 100%;}
.officers .officer .image {margin: 0 0 20px 0;}

.newsandevents .newsstory {margin: 0 0 20px 0;}
.newsandevents .newsstory .image {width: 30%; float: left;}
.newsandevents .newsstory .image img {width: 100%; max-width: 100%; object-fit: contain;}
.newsandevents .newsstory .text {width: 65%; float: right;}
.newsandevents .newsstory p {padding: 0 0 10px 0;}
.newsandevents .newsstory p a {color: #5d1e9c; text-decoration: none; font-weight: 600;}
.newsandevents .newsstory p a i {transition: all 0.4s ease;}
.newsandevents .newsstory p a:hover {color: #007ed0;}
.newsandevents .newsstory p a:hover i {transform: translateX(10px);}
.newsandevents .newsstory p.date-text {color: #666666; font-style: italic;}
.newsandevents .newsstory p.name {color: #5d1e9c; font-weight: 700; font-size: 120%; padding: 0;}
.newsandevents.inner .newsstory {padding: 0 0 20px 0; margin: 0 0 20px 0; border-bottom: 1px solid #cdcdcd; display: flex; flex-direction: row; gap: 20px; box-sizing: border-box; height: 100%; width: 100%;}
.newsandevents.inner .newsstory * {box-sizing: border-box;}
.newsandevents.inner .newsstory:after, .newsandevents.inner .newsstory *:after {display: none;}
.newsandevents.inner .newsstory .date {aspect-ratio: 1; display: flex; flex-direction: column; border: 1px solid #00365a; flex-grow: 1;}
.newsandevents.members.inner .newsstory .date {display: flex; flex-direction: column; aspect-ratio: none; border: none;}
.newsandevents.inner .newsstory .date:after, .newsandevents.inner .newsstory .date *:after {display: none;}
.newsandevents.inner .newsstory .date p {width: 100%; text-align: center; text-transform: uppercase; font-weight: 700;}
.newsandevents.inner .newsstory .month {background: #00365a; color: #ffffff; padding: 10px 5px 5px;}
.newsandevents.inner .newsstory .day {background: #ffffff; color: #00365a; padding: 20px 5px 10px; font-size: 220%; flex-grow: 1; display: flex; align-items: center; justify-content: center;}
.newsandevents.inner .newsstory .year {color: #666666; font-weight: 400; padding: 0 5px 5px;}
.newsandevents.inner .newsstory .text {align-self: center;}
.newsandevents.inner .newsstory .buttons > * {display: inline-block;}
.newsandevents.inner .newsstory .buttons > *:first-child {margin: 0 15px 0 0;}

/* CW homepage newsfeed */
.home .newsandevents {display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;}
.home .newsandevents-header {grid-column: 1 / -1;}
.home .newsandevents-header * {margin: 0; padding: 0;}
.home .newsandevents-header:after, .home .newsandevents-header *:after {display: none;}
.newsandevents-header {display: flex; justify-content: space-between; align-items: center; padding: 20px 0; border-bottom: 1px solid #cdcdcd; width: 100%;}
.newsandevents-header h2 {text-transform: uppercase; color: #5d1e9c; font-weight: 700; font-size: 175%;}

.home .newsandevents .newsstory {display: flex; flex-direction: column; height: 100%; width: 100%;}
.home .newsandevents .newsstory .image {width: 100%; margin: 0 0 10px;}
.home .newsandevents .newsstory .readmore {margin-top: auto; padding: 0;}
.home .newsandevents .newsstory .text {display: flex; flex-direction: column; width: 100%; float: none; flex-grow: 1;}

#events .newsandevents-header {border-top: 1px solid #cdcdcd; padding: 30px 0 20px;}

.home #events {grid-template-columns: repeat(3, 1fr);}
.home #events > * {min-width: 0;}
.home #events .newsstory {gap: 20px; display: grid; grid-template-columns: 100px auto; align-items: start;}
.home #events .newsstory:after {display: none;}
.home #events .newsstory, .home #events .newsstory * {box-sizing: border-box;}
.home #events .newsstory .date {aspect-ratio: 1; display: flex; flex-direction: column; border: 1px solid #00365a;}
.home #events .newsstory .date:after, .home #events .newsstory .date *:after {display: none;}
.home #events .newsstory .date p {width: 100%; text-align: center; text-transform: uppercase; font-weight: 700;}
.home #events .newsstory .month {background: #00365a; color: #ffffff; padding: 10px 5px 5px;}
.home #events .newsstory .day {background: #ffffff; color: #00365a; padding: 5px; font-size: 220%; flex-grow: 1; display: flex; align-items: center; justify-content: center;}
.home #events .newsstory .year {color: #666666; font-weight: 400; padding: 0 5px 5px;}
.home #events .newsstory .text .blockbutton {padding: 0 0 5px;}
.home #events .newsstory .text p:last-child {padding: 0;}
.home #events .newsstory .name {font-size: 110%; padding: 0;}
.home #events .newsstory .text .standfirst {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; text-overflow: ellipsis; padding: 0; margin-bottom: 10px;}
.newsstory .tags {color: #666666;}
.newsstory .tags i {display: inline-block; margin: 0 5px 0 0; color: #007ed0;}

/* CW homepage cta */
#cta .content {text-align: center;}
#cta .blockbutton {display: flex; gap: 10px; align-items: center; justify-content: center; padding: 0;}
#cta .blockbutton a {padding: 10px 20px 7px; background: #5d1e9c; color: #ffffff; text-align: center;}
#cta .blockbutton a:hover {background: #005389;}

.form p.seeformerrors {color: red;}

.googlemap {width: 100%; height: 300px; margin: 0 0 20px 0;}

.searchresult h3 img {float: left; margin: 0 10px 0 0;}

.top-footer-wrap {padding: 0 20px; background: #005389;}
.top-footer {max-width: 1180px; width: 100%; margin: 0 auto; padding: 40px 0;}
.top-footer .col1, .footer .col1 {float: left; width: 350px;}
.top-footer .col2, .footer .col2 {float: right; width: 700px;}
.top-footer .col2 .left, .top-footer .col2 .right, .footer .col2 .left, .footer .col2 .right {width: 50%; float: left;}
.top-footer p, .footer p {font-size: 90%; color: #ffffff; font-weight: 400;}
.top-footer p strong {font-weight: 700;}
.top-footer a, .footer a {text-decoration: none; color: #ffffff;}
.top-footer ul {margin: 0; padding: 0; width: 100%;}
.top-footer li {list-style: none; font-size: 90%; font-weight: 700; padding: 5px 0 0 15px; border-top: 1px solid #4677a1; margin: 5px 0 0 0; background: url(../images/footer-li-arrow.png) no-repeat left 9px;}
.top-footer li:hover a, .top-footer .nav li.selected a {color: #91b5d5;}
.top-footer li:first-child {border-top: 0; margin: 0; padding: 0 0 0 15px; background: url(../images/footer-li-arrow.png) no-repeat left center;}

.footer-wrap {padding: 0 20px;}
.footer {max-width: 1180px; width: 100%; margin: 0 auto; padding: 20px 0;}
.footer-wrap p {padding: 0;}

.mobile-header-wrap, .mobile-nav {display: none;}

.links-container {width: 100%; height: auto; float: left; margin-bottom: 12px;}
.links-container .heading{ }
.links-container .description{ }
.links-container .logo-link-container {width: 100%; height: auto; float: left; margin-bottom: 2px; margin-left: -10px;}
.links-container .logo-link-container .single-logo {width: 25%; height: auto; float: left; margin-left: 10px; border: 1px solid #aaaaaa; overflow: hidden; border-radius: 5px; border-bottom-left-radius: 25px;}
.links-container .logo-link-container .single-logo img {width: 100%; height: auto;}

.seecmsformbuilder p {padding: 0;}
.seecmsformbuilder input[type="submit"] {margin: 0 0 20px 0;}

/* CW - Members area 18/03/22 */
.judge-list {table-layout: fixed; width: 100%;}
.judge-list tr td:first-of-type {background: #00365a; color: #ffffff; padding: 7px 10px 3px 15px; font-weight: 500; width: 45%;}

ul.seecmsdownloadarea {margin: 0; list-style-type: none; display: flex; flex-wrap: wrap; gap: 15px;}
.seecmsdownloadarea li {display: block; width: calc(33.333% - 15px); background: #00365a; border-radius: 10px;}
.seecmsdownloadarea li a {color: #ffffff; display: flex; padding: 20px; justify-content: center; align-items: center;}
.seecmsdownloadarea li:hover {opacity: 0.8;}
.seecmsdownloadarea i {margin: 0 10px 0 0;}

ul.eulogies {margin: 0; list-style-type: none; display: flex; flex-wrap: wrap; gap: 15px;}
.eulogies li {width: calc(25% - 15px); background: #00365a; display: flex; flex-direction: column; justify-content: center; padding: 20px; border-radius: 10px; aspect-ratio: 1; box-sizing: border-box; position: relative; overflow: hidden;}
.eulogies li a {width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center;}
/* .eulogies li::before {content: ''; position: absolute; bottom: 12px; left: 20px; width: 30px; height: 30px; display: block; z-index: 3; background: url(../images/li-back.png) no-repeat center; background-size: 100%;} */
.eulogies li:after {content: "Eulogy"; display: block; width: 100%; height: auto; z-index: 2; position: absolute; left: 0; bottom: 0; padding: 8px 20px; text-align: right; box-sizing: border-box; color: #ffffff; background: rgba(0, 0, 0, 0.4); line-height: 1;}
.eulogies.valedictions li {background: #005389;}
.eulogies.valedictions li:after {content: "Valediction";}
.eulogies.obituaries li:after {content: "Obituary";}
.eulogies .name {font-weight: 600; font-size: 110%;}
.eulogies p {color: #ffffff;}

/* Event booking styling */
.memberevents .title {font-weight: bold; color: #5d1e9c;}
.memberevents .desc {font-weight: 400; padding: 0;}
.memberevents td {width: auto;}
.memberevents .date {width: 130px;}
.confirm-container {width: 100%;}
.confirm-container .section {padding: 20px; margin: 0 0 20px 0; background: #f2f2f2;}
.confirm-container .row {display: grid; grid-template-columns: repeat(1, 1fr); gap: 20px; margin: 0 0 20px 0;}
.confirm-container .row.halves {grid-template-columns: repeat(2, 1fr);}
.confirm-container .row.thirds {grid-template-columns: repeat(3, 1fr);}
.confirm label {font-weight: bold;}
.confirm p {padding: 0; margin: 0;}
.confirm select, .confirm input, .confirm textarea {margin: 0;}
.confirm-container .row.lanyardrow {grid-template-columns: 1fr 1fr 150px; align-items: start;}
.confirm-container .row.lanyardrow.nonmember {grid-template-columns: 1fr 1fr 1fr 150px;}
.confirm-container .deletelanyard {text-align: center; display: block; padding: 5px 10px; background: #00365a; color: #ffffff; font-weight: 700; text-transform: uppercase; text-decoration: none;}
.confirm-container .checkboxes {display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 10px; row-gap: 5px;}
.confirm-container .checkboxes p label {font-weight: 400; font-size: 0.95rem; display: flex; gap: 5px; align-items: center; line-height: 1;}
.confirm-container .checkboxes p input {width: 15px; height: 15px;}
.confirm-container .row.lanyardrow.nonmember .checkboxes {grid-template-columns: repeat(1, 1fr);}

/* member events filter */
.memberevents-filter {display: flex; align-items: center; gap: 10px;}
.memberevents-filter:after, .memberevents-filter *:after {display: none;}
.memberevents-filter p {padding: 0;}
.memberevents-filter a {display: block; color: #666666;}
.memberevents-filter a:hover {color: #00365a;}
.memberevents-filter a.selected {color: #5d1e9c; text-decoration: underline;}

/* Video styling */
.video-container {margin-top: 15px; float: left; width: 25%;}
.video-container div {height: 100%;}
.details-container {width: calc(75% - 35px); margin-top: 15px; float: right;}
.video-title {font-size: 105%; padding-bottom: 10px;}
.videopopup {padding: 120px;}
.fancybox-slide > * {overflow: hidden!important; background-color: unset!important; text-align: unset!important;}
.videopopup .video-layout {width: 50%;}
.boxvideo {border: 1px solid #cccccc; padding: 0; text-align: center;}
.webinar-content img.play {margin: 0 auto!important;}
.play:hover {opacity: 0.8; cursor: pointer;}
.webinar-message {background-color: rgb(75, 24, 126); color: #ffffff; padding: 10px; border-radius: 10px; margin-top: 10px; margin-bottom: 10px; display: none;}
.fancybox-close-small {position: absolute!important; right: unset!important; width: unset!important; margin-top: 2%!important;}
.webinar-link {color: #ffffff!important;}
.button-container {display: block; text-align: right; margin: 0 0 20px 0;}
.archive-button {display: block; background: #005389!important; border-radius: 10px; color: #ffffff; padding: 10px; width: max-content; float: right;}
.archive-button.event-button {background: #5d1e9c!important;}
a.archive-button {color: #ffffff;}
.archive-button:hover {opacity: 0.8;}
.loginform input[type="submit"] {float: right;}
.loginform i {margin: 0 5px 0 0;}
.loginform .buttons {display: flex; gap: 10px;}
.loginform .buttons:after, .loginform .buttons *:after {display: none;}
.loginform .buttons .loginbutton {margin-left: auto;}
.loginpopup {background: #ffffff!important; text-align: left!important; padding: 0!important; border-radius: 10px;}
.loginpopup form {padding: 0 20px;}
.webinarpopup {background: #ffffff!important; text-align: left!important; padding: 45px!important; border-radius: 10px; width: 60%;}
.webinarpopup h2 {font-size: 150%!important; padding-bottom: 15px;}
.webinarpopup p {font-size: 100%!important; font-weight: bold;}
.webinar-content h2, .webinar-content h3 {color: #005389;}
.webinar-content .webinar-info p {padding: 0 0 5px 0;}
.webinar-content .webinar-info p strong {color: #005389;}
.webinar-archive .webinar-info {margin: 0 0 20px 0;}
.webinar-archive .webinar-confirmation p {padding: 0 0 5px 0;}
.webinar-archive .webinar-confirmation div {margin: 10px 0;}
.webinar-archive .webinar-confirmation .tick-video {float: left; width: calc(100% - 30px); line-height: 110%;}
.webinar-archive .video-title {margin: 0 0 5px 0; padding: 0;}
.webinar-archive .upload-date {font-size: 95%; color: #666666;}
/* END */

/* CW - new homepage banner with officers */
.banner-officers {width: 100%;}
/* .banner-officers .banner {display: grid!important; grid-template-columns: repeat(2, 1fr); gap: 20px;} */
.banner-officers .banner {display: grid!important; grid-template-columns: repeat(4, 1fr); gap: 5px;}
.banner-officers .banner .officer {position: relative;}
.banner-officers .banner .officer img {width: 100%; margin: 0!important;}
.banner-officers .banner .officer .text {position: absolute; bottom: 0; left: 0; width: 100%; box-sizing: border-box; padding: 10px 10px 5px; background: rgba(0, 0, 0, 0.5);}
.banner-officers .banner .officer .text * {color: #ffffff;}
.banner-officers .banner .officer .text h3 {margin: 0; font-size: 100%;}
.banner-officers .banner .officer .text p {padding: 0; font-size: 90%;}

.banner-officers:after, .banner-officers .banner:after, .banner-officers .banner *:after {display: none;}

@media (max-width: 1240px){
  .top .left {width: 62%;}
  .top .right {width: 36%;}
  .top .right a {width: 60%; box-sizing: border-box;}
  .top .search {width: 40%; position: relative;}
  .top .search input {width: 100%; padding-right: 50px; box-sizing: border-box;}
  .top .search input.submitbutton {position: absolute; top: 0; right: 0;}

  .header .left {width: 24%;}
  .header .right {width: 74%;}
  .header a.logo {height: 0; padding-bottom: 16%;}

  .content.home .top {flex-direction: column;}

  .content .col1 {width: 20%; margin-right: 2%;}
  .content .col2 {width: 52%; margin-right: 2%;}
  .content .col3 {width: 24%;}
  .content.wide .col2 {width: 78%; margin-right: 0;}
  .content.home .col1 {width: 66%; margin-right: 2%;}
  .content.home .col2 {width: 32%; margin-right: 0;}
  .content img {max-width: 100%; width: auto;}

  .title .left {width: 66%;}
  .title .right {width: 32%;}

  .chambersgrid {margin-left: -2%; width: 102%;}
  .chambersgrid .chamber {width: 31%; margin: 0 0 20px 2%;}

  .top-footer .col1, .footer .col1 {width: 30%;}
  .top-footer .col2, .footer .col2 {width: 60%;}

  .officers {margin-left: -2%; width: 102%;}
  .officers .officer {width: 31%; margin: 0 0 20px 2%;}

  .home #events {grid-template-columns: repeat(2, 1fr);}
}

@media (max-width: 1024px){
  .header .left {display: block; float: none;}
  .header .right {width: 100%; display: block; float: none;}
}

@media (max-width: 900px){
  .header .nav li {padding: 0 5px;}
  .eulogies li {width: calc(25% - 15px); padding: 10px;}
}

@media (max-width: 800px){
  .urgentmessage-wrap {position: fixed;}
  .urgentmessage {width: 95%; max-width: 1180px; margin: 0 auto;}
  .urgentmessage .inner {padding: 20px;}

  .top-wrap, .header-wrap {display: none;}

  .title h1 {font-size: 250%;}

  .mobile-header-wrap {display: block; width: 100%; position: fixed; top: 0; left: 0; z-index: 9999; border-bottom: 1px solid #cdcdcd;}

  .top-header {background: #f3f3f3; border-top: 5px solid #005389;}
  .top-header .left, .top-header .right {width: 50%; float: left;}
  .top-header .search {position: relative;}
  .top-header .search input {width: 100%; height: 45px; line-height: 45px; background: none; border: none; outline: none; padding: 0 50px 0 20px; margin: 0; text-align: left; font-weight: 600; color: #666666; font-size: 80%;}
  .top-header .search input.submitbutton {width: 40px; padding: 0; margin: 0; background: url(../images/search-icon.png) no-repeat center center; cursor: pointer; position: absolute; top: 0; right: 0;}
  .top-header .search input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px #f3f3f3 inset;}
  .top-header .right a {height: 45px; line-height: 45px; text-decoration: none; color: #ffffff; font-size: 80%; font-weight: 600; background: #005389; display: inline-block; padding: 0 20px; float: left; text-align: center; width: 100%; box-sizing: border-box;}
  .top-header .loggedin {}
  .top-header .loggedin a {width: 50%; float: left; text-align: center; display: block; padding: 20px; box-sizing: border-box; font-weight: 600; text-decoration: none; font-size: 80%; color: #666666;}
 
  .mobile-header {background: #ffffff; padding: 20px;}
  .mobile-header .left {float: left; width: 185px;}
  .mobile-header .right {float: right;}
  .mobile-header a.logo {display: block; width: 100%; height: 30px; background: url(../images/logo.png) no-repeat 0 0; background-size: 100%;}

  .title-wrap {margin-top: 121px;}
  .title-wrap.mobileloggedin {margin-top: 177px;}
  .title .left {width: 100%;}
  .title .right {width: 100%;}

  .content .col1 {width: 100%; margin-right: 0%; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #cdcdcd;}
  .content .col2 {width: 100%; margin-right: 0%;}
  .content .col3 {width: 100%;}
  .content.wide .col2 {width: 100%; margin-right: 0;}
  .content.home .col1 {width: 100%; margin-right: 0%;}
  .content.home .col2 {width: 100%; margin-right: 0;}
  .content img {width: 100%; margin: 0 0 20px 0!important;}

  .searchresult h3 img {float: left; width: auto!important; margin: 0 10px 0 0!important;}

  /* .chambers {margin: 0 0 20px 0;} */
  /* .chambers li {font-size: 90%; padding-top: 5px;} */

  .officers .officer {width: 48%; margin: 0 0 20px 2%;}
  .officers .officer img {margin: 0!important;}

  .content.chamber .topsection .left {width: 100%;}
  .content.chamber .topsection .right {width: 100%;}

  .top-footer .col1, .footer .col1 {width: 100%;}
  .top-footer .col2, .footer .col2 {width: 100%;}
  .top-footer p, .footer p, .top-footer li {font-size: 80%;}
  .top-footer .col2 .left, .top-footer .col2 .right, .footer .col2 .left, .footer .col2 .right {width: 100%;}
  .top-footer .nav {display: none;}

  #quicklinks {grid-template-columns: repeat(3, 1fr);}

  .home .newsandevents {grid-template-columns: repeat(1, 1fr); gap: 10px;}
  .home .newsandevents .newsstory {flex-direction: row; column-gap: 20px; align-items: center; margin: 0;}
  .home .newsandevents .newsstory .image {width: 30%; margin: 0;}

  .home #events .newsstory .date p {padding-inline: 45px;}
  .home #events {grid-template-columns: 1fr;}
  .home #events .newsstory {padding: 20px 0; border-bottom: 1px solid #005389;}
  .home #events .newsstory:last-child {border-bottom: none;}
}

@media (max-width: 667px){
  .seecmsdownloadarea li {width: calc(50% - 15px);}
  .eulogies li {width: calc(33.333% - 15px);}
  .memberevents {table-layout: fixed;}
  .memberevents td {display: block; width: 100%;}
  .memberevents td .blockbutton {padding: 0; display: block; text-align: center;}
  .video-container, .details-container {width: 100%; float: none; padding: 0; margin: 0;}
  .video-container {margin: 0 0 20px 0;}

  .chambers ul {width: 100%; margin: 0;}
  .chambers li {width: 100%; margin: 0 0 5px 0; height: auto;}
  .chambers li a {padding: 20px;}
}

@media (max-width: 600px){
  .banner-officers .banner {grid-template-columns: repeat(3, 1fr);}
  .content.home .top .col2 {order: -1; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #cdcdcd;}
  .content.home .top .col1 {padding-bottom: 0; border-bottom: none;}
}

@media (max-width: 500px){
  .eulogies li {width: calc(50% - 15px);}
  #quicklinks {grid-template-columns: repeat(2, 1fr);}
}

@media (max-width: 450px){
  .newsandevents.inner .newsstory {padding: 0;}
  .newsandevents .newsstory .image, .newsandevents .newsstory .text {width: 100%; float: none;}

  .banner-officers .banner {grid-template-columns: repeat(2, 1fr);}
}

@media (max-width: 400px){
  input[type="submit"] {width: 100%;}

  .chambersgrid .chamber {width: 98%; margin: 0 0 30px 2%;}

  .officers .officer {width: 98%; margin: 0 0 20px 2%;}

  .seecmsdownloadarea li {width: 100%;}
  .eulogies li {width: 100%; padding: 0; aspect-ratio: auto;}
  .eulogies li a {padding: 30px 20px; box-sizing: border-box;}
  .eulogies li:after {position: relative;}

  .judge-list tr td:first-of-type, .judge-list td {width: 100%; display: block; box-sizing: border-box;}
  .judge-list tr {margin: 0 0 10px 0; display: block;}

  #quicklinks {grid-template-columns: repeat(1, 1fr); gap: 10px;}
}