/* testing */

@charset "UTF-8";

:root {

    /** 2024 generic **/
    --2024_generic_primary: #001d76;
    --2024_generic_primary_hover: #333f48;
    --2024_generic_secondary: #00DDF4;
    --2024_generic_secondary_hover: #00DDF4;
    --2024_generic_medium_gray: #8F8E91;
    --2024_generic_light_gray: #EDEAEF;
    --2024_generic_light_gray_hover: #e3e0e5;
    --2024_generic_dark_gray: #333333;
    --2024_generic_dark_gray_faded: #33333342;
    --2024_generic_accent: #E424FF;
    --2024_generic_accent_hover: #be1dd5;


    /** 2024 psab **/
    --2024_psab_primary: #7B27FF;
    --2024_psab_primary_hover: #551dae;
    --2024_psab_secondary: #25006D;
    --2024_psab_secondary_hover: #25006D;
    --2024_psab_accent_one: #E424FF;
    --2024_psab_accent_two: #00DDF4;


    /** 2024 csab **/
    --2024_csab_primary: #590011;
    --2024_csab_primary_hover: #590011;
     --2024_csab_darker_primary: #45000d;
    --2024_csab_secondary: #FF2E4E;
    --2024_csab_secondary_hover: #a92035;
    --2024_csab_accent_one: #E424FF;
    --2024_csab_accent_two: #FFBD29;
}

/* CSS Document */

/* FONTS */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;700&display=swap');

@font-face {
    font-family: 'interregular';
    src: url('../fonts/inter-variablefont_slntwght-webfont.woff2') format('woff2'),
         url('../fonts/inter-variablefont_slntwght-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'f37_judgeregular';
    src: url('../fonts/f37judge-regular-webfont.woff2') format('woff2'),
         url('../fonts/f37judge-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'f37_judgemedium';
    src: url('../fonts/f37judge-medium-webfont.woff2') format('woff2'),
         url('../fonts/f37judge-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'f37_judgebold';
    src: url('../fonts/f37judge-bold-webfont.woff2') format('woff2'),
         url('../fonts/f37judge-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'f37_judgethin';
    src: url('../fonts/f37judge-thin-webfont.woff2') format('woff2'),
         url('../fonts/f37judge-thin-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


html {
    height: 100%;
    scroll-behavior: smooth;
}

body {
    height: 100%;
    flex-direction: column;
}

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/**accessibility!!!**/

a:focus {}

/** color variables **/



/**flickety**/

.gallery {
    background: transparent;
}

.gallery-cell {
    width: 100%;
    height: auto;
    margin-right: 10px;
    counter-increment: gallery-cell;
}

.flickity-button {
    background:none !important;
}

.flickity-prev-next-button .flickity-button-icon {
    position: absolute;
    left: 20%;
    top: 20%;
    width: 100% !important;
    height: 100% !important;
}

/* big buttons, no circle */
.flickity-prev-next-button {
    width: 100px;
    height: 100px;
    background: transparent;
}

/* arrow color */

.flickity-prev-next-button .arrow {
    fill: white;
}

.flickity-prev-next-button.no-svg {
    color: white;
}

.flickity-prev-next-button:hover {
    background: transparent;
}

/* hide disabled button */
.flickity-prev-next-button:disabled {
    display: none;
}

.flickity-page-dots {
    display:  none;
}

/**flickety**/

.desktop {
    display: flex;
}

.mobile {
    display: none !important;
}

/**** SLIDESHOW HEADER **/

#slideshow {
    margin: auto;
    position: relative;
    z-index: 0;
    width: 100%;
    min-height: 300px;
}

#slideshow > div {
    position: absolute;
    width: 100%;
}

/**** SLIDESHOW HEADER **/

p {
    line-height: 1.4em;
    display: block;
    margin-block-start: .5em;
    margin-block-end: .5em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

body {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    margin: 0;
    padding: 0;
    background-color: #f4f7f8;
}

.content-container {
    width: 80%;
    max-width: 1200px;
    display: flex;
    flex-direction: column;
    align-content: center;
    margin:auto;
}

#resources-container .row {
    margin-bottom: 0;
}

#resources-container h2, #contact-container h2 {
    font-family: 'Inter', sans-serif;
    font-size: 30px;
    font-weight: 600;
}

.content iframe {
    height: 850px;
    width: 100%;
}

.content-container-csab-bar {
    width: 80%;
    max-width: 1200px;
    display: flex;
    flex-direction: column;
    align-content: center;
    margin:auto;
    height: 80px;
    justify-content: center;
}

.content-container-main {
    width: 80%;
    max-width: 1200px;
    display: flex;
    flex-direction: column;
    align-content: center;
    margin: auto;
    flex: 1 0 auto;
}


#blk-bar {
    height: 50px;
    background-color: #000;
    display: flex;
    align-content: center;
    width: 100%;
}

#nav-container-generic {
    background-color: #ffffff;
}

#nav-container-csab {
    background-color: #fff;
}

#nav-container-psab{
    background-color: #fff;
}

#blue-bar, #psab-bar {
    height: 100px;
    background-color: var(--2024_generic_primary);
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    width: 100%;
}

#psab-bar {
    background-color: var(--2024_psab_secondary);
}

#real-csab-bar {
    height: 80px;
    background-color: #001e77;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    width: 100%;
}

.logout {
    border: 1px solid #fff;
    color: #fff;
    text-decoration: none;
    padding: 5px;
    margin-left: auto;
}

.logo img {
    width: 150px;
}

/**** MOBILE NAV ***/

#mobile-nav {
    display: none;
}

#dt-nav {
    display: flex;
}

.mobile-nav-items {
    display: flex;
    flex-direction: column;
    padding: 30px 0px 30px 0px;
    width: 80%;
    margin: auto;
    text-align: right;
    opacity: 0;
    height: 0;
    padding: 0;
}

.mobile-nav-items .navlink {
    font-size: 20px;
    margin-bottom:20px;
}


.container {
    display: inline-block;
    cursor: pointer;
}

.bar1, .bar2, .bar3 {
    width: 35px;
    height: 5px;
    background-color: #333f48;
    margin: 6px 0;
    transition: 0.2s;
}

.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px);
    transform: rotate(-45deg) translate(-9px, 6px);
}

.change .bar2 {
    opacity: 0;
}

.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px);
    transform: rotate(45deg) translate(-8px, -8px);
}

/***MOVBILE NAV END */

#nav {
    width:80%;
    max-width: 1200px;
    height: 100px;
    margin: auto;
    display: flex;
    flex-direction: row;
    align-content: center;
}

.logo {
    width:30%;
    display: flex;
    align-content: center;
    align-items: center;
}

.nav-items {
    width: 70%;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
}

.navlink {
    color: #000;
    font-size: 16px;
    text-decoration: none;
    text-transform: capitalize;
    margin-left: 25px;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
}

.navlink:hover {
    color: var(--2024_generic_medium_gray);
}

.navlink:active {
    font-weight: 800;
}

.current {
    color:#a2aaad;
}

h1 {
    color: #fff;
    font-size: 40px;
    margin: auto;
    padding: 10px 20px 10px 20px;
}

h2 {
    color: #fff;
    font-size: 36px;
    line-height: 0em;
    text-align: center;
}

h2.dark {
    color: #000;
    font-size: 36px;
    line-height: 0em;
    text-align: center;
    padding-top: 20px;
}

h3 {
    font-size: 24px;
    font-weight: normal;
    color: #000000;
}

hr {
    width: 100%;
    margin-top: 40px;
    margin-bottom: 40px;
    background-color: var(--2024_generic_medium_gray);
    height: 1px;
    border: 0;
}

.bold {
    font-weight: 600;
}

.italics {
    font-style: italic;
}

.regular-weight {
    font-weight: 400;
}

strong {
    font-weight: 600 !important;
}

#login-button-container, #login-button-container-2 {
    position: relative;
    width: 212px;
}

/*
#login-container-button-arrow, #login-container-button-arrow-2, .block-link-outline-grey #login-container-button-arrow-2 {
    width: 19px;
    position: absolute;
    top: 54%;
    right: 6px;
}
*/

#login-container-button-arrow, #login-container-button-arrow-2, .block-link-outline-grey #login-container-button-arrow-2 {
    width: 19px;
    position: absolute;
    top: 31%;
    right: 26px;
}

#login-button-container #login-container-button-arrow {
    right: 45px;
}

#login-container-button-arrow-2, .block-link-outline-grey #login-container-button-arrow-2 {
    right: 39px !important;
    top: 29%;
}

.sidebar-nav #login-container-button-arrow-2 {
    right: 47px !important;
}

.block-link-outline-grey #login-container-button-arrow-2 {
    right: 22px !important;
}

#login-button-container-2 #login-container-button-arrow {
    top: 45%;
    right: 58px;
}

.update-link #login-container-button-arrow-2 {
    right: 15px !important;
}

.sidebar-nav .update-link #login-container-button-arrow-2 {
    right: -7px !important;
}


.advisory-board-button {
    margin-right: auto;
    margin-left: auto;
    left: 0;
    right: 0;
}

.sidebar-nav .advisory-board-button {
    margin-left: 0;
}

.advisory-board-button #login-container-button-arrow {
    top: 30%;
}

.advisory-board-button .header-reg {
    padding: 10px 40px 11px 0px;
}

@-moz-document url-prefix() {
    .advisory-board-button .header-reg {
        padding: 14px 40px 11px 0px;
    }
    .advisory-board-button #login-container-button-arrow {
        top: 33%;
    }
    #login-container-button-arrow-2 {
        top: 33%;
    }
}

.login-page-button {
    width: 195px !important;
    background-color: #7a18bb !important;
    color: #fff;
    padding: 11px 200px 11px 0px;
    font-size: 15px;
    margin-top: 20px;
    margin-bottom: 10px;
    cursor: pointer;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    cursor: pointer;
    border: 1px solid #ffffff !important;
    background: #7a18bb;
    padding-right: 25px;
    background-size: 44px !important;
    font-size: 16px;
    height: 50px;
    transition: 0.35s ease;
    text-indent: -15px;
}

#login-button-container-2 .login-page-button {
    width: 180px !important;
    text-indent: -15px;
}

.block-link-black:hover .button-arrow,
.block-link-black:hover #login-container-button-arrow {
    transform: translate(5px);
    transition: 0.35s ease;
}

.error-button {
    position: relative;
    width: 190px !important;
    padding-right: 50px !important;
}

.error-button #login-container-button-arrow {
    top: -52% !important;
}

#login-button-container:hover #login-container-button-arrow {
    right: 38px;
    transition: 0.35s ease;
}

#login-button-container-2:hover #login-container-button-arrow {
    right: 52px;
    transition: 0.35s ease;
}

#login-button-container:hover #login-container-button-arrow-2 {
    right: 30px !important;
    transition: 0.35s ease;
}

#login-button-container.update-link:hover #login-container-button-arrow-2 {
    right: 0 !important;
    transition: 0.35s ease;
}

.sidebar-nav #login-button-container:hover #login-container-button-arrow-2 {
    right: 40px !important;
    transition: 0.35s ease;
}

.sidebar-nav #login-button-container.update-link:hover #login-container-button-arrow-2 {
    right: -20px !important;
    transition: 0.35s ease;
}

.block-link-outline-grey:hover #login-container-button-arrow-2 {
    right: 14px !important;
    transition: 0.35s ease;
}

#main-login-page {
    background-color: var(--2024_generic_primary);
}

#main-login-page .login-page-button {
    margin-top: 35px;
}

#main-login-page #blue-bar {
    background-color: #001658;
}

#main-login-page .dt-copyright {
    position: absolute;
    bottom: 0;
    margin-bottom: 0;
}

#main-login-page .content-container {
    width: 80%;
    max-width: initial;
    flex-direction: row;
    justify-content: space-between;
}

.login-page-button:hover {
    background-color: #b486ff !important;
    color: #fff;
}

.center-black-text {
    color:#000;
    text-align: center;
    padding-top:40px;
}

.blue-button {
    padding: 10px 20px 10px 20px;
    width: auto;
    background-color: #333f48;
    color: #000000;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 8px;
    cursor: pointer;
    align-self: center;
    border: none;
    margin: auto;
}

.block-link {
    padding: 10px 20px 10px 20px;
    width: auto;
    background-color: #333f48;
    color: #fff;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 8px;
    cursor: pointer;
    align-self: center;
}

.block-link-blk {
    padding: 11px 20px;
    width: auto;
    background-color: #333f48;
    color: #000;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 8px;
    cursor: pointer;
    align-self: center;
    border: 2px solid #000;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    cursor: pointer;
}

.block-link-black {
    padding: 13px 20px;
    width: auto;
    color: #fff;
    text-decoration: none;
    align-self: flex-start;
    cursor: pointer;
    margin-top: 25px;
    margin-bottom: 25px;
    border-style: none;
    font-family: 'interregular';
    font-size: 16px !important;
    border: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    cursor: pointer;
    height: 50px;
    background-color: #101820;
    transition: 0.35s ease;
}

.block-link-black:hover {
    background-color: #000;
}

.block-link-blk:hover {
    padding: 10px 20px 10px 20px;
    width: auto;
    background-color: #000;
    color: #fff;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 8px;
    cursor: pointer;
    align-self: center;
}

.block-link-outline {
    padding: 10px 20px 10px 20px;
    width: auto;
    background-color: #fff;
    border: 1px solid #000000;
    color: #000000;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 8px;
    cursor: pointer;
}

.block-link-outline-grey {
    padding: 10px 50px 10px 20px;
    width: auto;
    background-color: #fff;
    border: 1px solid #ffffff;
    color: #000000;
    text-decoration: none;
    cursor: pointer;
    position: relative;
    font-size: 16px;
}


.block-link-filled-grey {
    padding: 10px 20px 10px 20px;
    width: auto;
    background-color: #000000;
    border: 1px solid #000000;
    color: #fff;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 8px;
    cursor: pointer;
}

.block-link-outline:hover {
    background-color: #333f48;
    border: 1px solid #333f48;
    color: #fff
}

.block-link-news {
    padding: 10px 20px 10px 20px;
    width: auto;
    background-color: #333f48;
    color: #fff;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 8px;
    cursor: pointer;
    align-self: center;
    margin-right: auto;
    margin-top: 20px;
}

.register-button {
    margin-top: 20px;
    margin-bottom: 20px;
}

#blue-text {
    width: 100%;
    background-color: #EDEDED;
    color: #000000;
    display: flex;
    padding-bottom: 40px;
    z-index: 1;
    position: relative;
}

.introduction {
    width: 90%;
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.intro-text {
    width: 60%;
}

.intro-text p {
    margin-block-start: 0em;
}

.intro b {
    font-family: 'Inter', sans-serif;
}

.headshot-home {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 40%;
    margin-left: 5%;
}

.headshot {
    display: flex;
    flex-direction: row;
    width: 60%;
}

.headshot-home img {
    align-self: flex-start;
    width: 100px;
    margin-right: 30px;
}

.headshot-home p {
    font-size: 14px;
    margin-block-start: 0em;
    margin-block-end: 0em;
}

.headshot img {
    align-self: flex-start;
    width: 135px;
    margin-right: 20px;
}

.headshot p {
    font-size: 14px;
    margin-block-start: 0em;
    margin-block-end: 0em;
}

.blk-footer {
    width: 100%;
    background-color: #111;
    display: flex;
    flex-direction: column;
    min-height: 375px;
    margin-top: auto;
    flex-shrink: 0;
}

.blk-footer .content-container {
    padding-top: 45px;
}

.sub-footer {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
}

.sub-footer-contact {
    display: flex;
    flex-direction: column;
}

.sub-footer-alias {
    display: flex;
    flex-direction: row;
}

.sub-footer-contact a:nth-child(1) {
    margin-right:20px;
}

.sub-footer-nav {
    display: flex;
    margin-left:60px;
    flex-direction: column;
    align-content: center;
}

.ft-nav-title {
    color: #fff;
    line-height: 0em;
    line-height: 1.0em;
    margin-block-start: 0em;
    margin-bottom: 10px;
    font-size: 20px;
}

.ft-nav-link {
    color: #fff;
    text-decoration: none;
    line-height: 0em;
    line-height: 1.0em;
    margin-block-start: 0em;
    margin-bottom: 10px;
    font-size: 16px;
    cursor: pointer;
}

.ft-nav-link:hover {
    color: var(--2024_generic_medium_gray);
}

.ft-contact-link {
    color: #a2aaad;
    text-decoration: none;
    margin-bottom: 30px;
    font-size: 18px;
}

.ft-contact-link:hover {
    color: #333f48;
    text-decoration: none;
}

.contact-link {
    color: #000;
    text-decoration: none;
    font-size: 18px;
}

.contact-link:hover {
    color: #333f48;
    text-decoration: none;
}

.contact-link-sm {
    color: #000;
    text-decoration: none;
    font-size: 12px;
}

.contact-link-sm:hover {
    color: #000;
    text-decoration: underline;
    font-size: 12px;
}

.event-super-menu {
    width: 100%;
    border-bottom: 1px solid #000;
    margin-bottom: 30px;
    padding-bottom: 15px;
}

.e-super-menu {
    text-decoration: none;
    color: #777777;
    margin-right: 20px;
}

.active {
    color: #000;
    font-weight: bold;
}

.sort-mobile {
    display: none;
}

.event-shuffle-menu {
    display: flex;
    flex-wrap: wrap;
    height: auto;
    align-items: center;
}

.event-shuffle-menu input {
    flex: 1;
    margin-right: 20px;
}

.shuffle-outline-grey {
    padding: 7px 10px 7px 10px;
    width: auto;
    background-color: #fff;
    border: 1px solid #5a5a5a;
    color: #5a5a5a;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 2px;
    cursor: pointer;
    font-size: 14px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.shuffle-filled-grey {
    padding: 7px 10px 7px 10px;
    width: auto;
    background-color: #5a5a5a;
    border: 1px solid #5a5a5a;
    color: #fff;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 2px;
    cursor: pointer;
    font-size: 14px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.shuffle-outline-grey:hover {
    padding: 7px 10px 7px 10px;
    width: auto;
    background-color: #5a5a5a;
    border: 1px solid #5a5a5a;
    color: #fff;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 2px;
    cursor: pointer;
}

input[type="text"] {
    background-color: #5A5A5A10;
    color: #000;
    padding-left: 10px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #807C7B40;
}

input[type="email"] {
    background-color: #5A5A5A10;
    color: #000;
    padding-left: 10px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #807C7B40;
}

input[type="password"] {
    background-color: #5A5A5A10;
    color: #000;
    padding-left: 10px;
    padding-right: 2px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #807C7B40;
}

select {
    -webkit-appearance: none;
    background-color: #5A5A5A10;
    color: #5a5a5a;
    padding-left: 10px;
    padding-right: 30px;
    height: 40px;
    line-height: 40px;
    width: 150px;
    border: 1px solid #807C7B40;
    background-image: url('images/arrow.svg');
    background-repeat: no-repeat, repeat;
    background-position: right .7em top 50%, 0 0;
    background-size: .85em auto, 100%;
}

select.formselect {
    -webkit-appearance: none;
    background-color: #5A5A5A10;
    color: #5a5a5a;
    padding-left: 10px;
    padding-right: 30px;
    height: 40px;
    line-height: 40px;
    width: 100%;
    border: 1px solid #807C7B40;
}

option {
    color: #777;
}

.event-view {
    width: 100%;
    margin: auto;
    padding-top: 40px;
    padding-bottom: 40px;
}

#resources-container .event-view {
    padding-bottom: 0;
}

.row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.event {
    flex: 0 1 calc(33% - 40px);
    border: 1px solid #000;
    padding-bottom: 40px;
    text-align: center;
    background-color: #5A5A5A05;
    display: flex;
    flex-direction: column;
    margin-bottom: 4%;
}

.event:nth-child(3n - 1) {
    margin-right: 64px;
    margin-left: 64px;
}

.resource-card.draft{
    border: 1px solid red;
}

.resource-card {
    flex: 0 1 calc(33% - 40px);
    border: 1px solid #000;
    padding-bottom: 0px;
    text-align: center;
    background-color: #1e1e1e05;
    margin-bottom: 5%;
}

.resource-card:nth-child(3n - 1) {
    margin-right: 64px;
    margin-left: 64px;
}

.event-img {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.event-img-icons {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 90%;
    margin: auto;
    color: #fff;
    position: absolute;
    top: -1px;
    left: -1px;
}

.heart {
    width: 18px;
    background: url("images/heart-icon-white.svg") no-repeat;
    cursor: pointer;
    margin-top: 4px;
}

.heart-grey {
    width: 18px;
    background: url("images/heart-icon.svg") no-repeat;
    cursor: pointer;
    margin-top: 5px;
}


.selected {
    width: 18px;
    background: url("images/red-heart.svg") no-repeat;
}

.event-category {
    width: 100%;
    background-color: #000;
    color: #fff;
    padding: 10px 0px 10px 20px;
    margin-top: -5px;
    text-align: left;
}

.event-details {
    width: 80%;
    margin: auto;
    text-align: left;
    margin-top: 15px;
}

h4 {
    font-size: 20px;
    color: #000000;
    padding-top: 20px;
    font-style: bold;
    font-weight: bold;
    margin-block-start: 0em;
    margin-block-end: 0em;
}

.title {
    font-size: 16px;
    color: #ffffff;
    padding-top: 10px;
    font-style: bold;
    font-weight: bold;
}

.resource-title {
    font-size: 16px;
    color: #000000;
    padding-top: 10px;
    margin-block-end: 0em;
    font-style: bold;
    font-weight: bold;
}

.date {
    display: flex;
    flex-direction: row;
    font-size: 14px;
    text-align: left;
}

.date-resource {
    display: flex;
    flex-direction: row;
    font-size: 14px;
    text-align: left;
    margin-block-start:0em;
}

.resource-description-small {
    margin-block-start: 0em;
    color: #1a1a1a;
    font-size: 14px;
    cursor: pointer;
}

.description-dropdown {
    font-size: 14px;
    display: none;
}

.show {
    display: block;
}

.plus::after {
    content: "+";
    margin-left: 5px;
    position: absolute;
    margin-top: 0px;
}

.minus::after {
    content: "\2014";
    margin-left: 5px;
    position: absolute;
    margin-top: -2px;
}

.date p {
    margin-left: 15px;
}

.button-arrow {
    width: 30px;
    height: 17px;
    margin-top: 1px !important;
    margin-left: 10px;
}

.description {
    color: #5A5A5A;
    line-height: 1.4em;
    font-size: 12px;
    padding-bottom: 30px;
}

.registered {
    display: flex;
    flex-direction: row;
    align-items: center;
    background-color: #333f48;
    padding: 10px 20px 10px 20px;
}

.registered p {
    padding-left: 10px;
}

#news {
    background-color: #5A5A5A10;
    padding-bottom: 50px;
}

.news-carousel {
    width: 100%;
    border-top: 1px solid #000;
    margin-top: 30px;
    padding-top: 50px;
    display: flex;
    flex-direction: row;
}

.news-item {
    width: 80%;
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.news-item img {
    width: 48%;
    align-self: flex-start;
}

.news-details {
    display: flex;
    flex-direction: column;
    width: 48%;
}

h3 {
    font-size: 21px;
    margin-block-start: 0em;
    margin-block-end: 0.5em;
}

.news-details p {
    font-size: 16px;
    color: #5A5A5A;
}

/* Resource Buttons */

.resource-links {
    display: flex;
    flex-direction: column;
    height: auto;
    overflow: hidden;
    margin-top: 10px;
    margin-bottom: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.rs-link {
    color: #5a5a5a;
    text-decoration: none;
    margin-bottom: 15px;
}

.rs-link-wrapper.draft{
    border: 1px solid red;
}

.rs-link-wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    border: 1px solid #8F8E91;
    background-color: #fff;
    padding: 3%;
}

.rs-link-wrapper:hover {
    background-color: #333333;
    border: 1px solid #333333;
    color: #fff;
    cursor: pointer;
}

.icon-swap {
    width: 20px;
    height: 20px;
}

.rs-image {
    height: 20px;
    margin-left: 4%;
}

.rs-image-white {
    height: 20px;
    margin-left: 4%;
    display: none;
}

.rs-label {
    font-size: 14px;
    margin-left:9%;
    padding-top:2px;
}

.rs-arrow {
    width: 10px;
    margin-left: auto;
    margin-right: 4%;
    transition: 0.35s ease;
}

.rs-link-wrapper:hover .rs-arrow {
    transform: translate(5px);
    transition: 0.35s ease;
}

.rs-link-wrapper:hover .rs-image {
    display:none;
}

.rs-link-wrapper:hover .rs-image-white {
    display:block;
}

/* Resource Buttons */

/* Resource Video */

#fade, #fade2, #fade3, #fade4, #fade5, #fade6, #fade7, #fade8, #fade9, #fade10, #fade11, #fade12, #fade13, #fade14, #fade15, #fade16, #fade17, #fade18, #fade19, #fade20, #fade21, #fade22, #fade23, #fade24, #fade25, #fade26, #fade27, #fade28, #fade29, #fade30, #fade31, #fade32, #fade33, #fade34, #fade35, #fade36, #fade37, #fade38, #fade39, #fade40, #fade41, #fade42, #fade43, #fade44, #fade45, #fade46, #fade47, #fade48, #fade49, #fade50 {
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index: 1001;
    -moz-opacity: 0.8;
    opacity: .80;
    filter: alpha(opacity=80);
}

#light, #light2, #light3, #light4, #light5, #light6, #light7, #light8, #light9, #light10, #light11, #light12, #light13, #light14, #light15, #light16, #light17, #light18, #light19, #light20, #light21, #light22, #light23, #light24, #light25, #light26, #light27, #light28, #light29, #light30, #light31, #light32, #light33, #light34, #light35, #light36, #light37, #light38, #light39, #light40, #light41, #light42, #light43, #light44, #light45, #light46, #light47, #light48, #light49, #light50 {
    display: none;
    position: absolute;
    width:60%;
    max-width: 1000px;
    top:25%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border: 0px solid #FFF;
    background: #FFF;
    z-index: 1002;
    overflow: visible;
}

#boxclose, #boxclose2, #boxclose3, #boxclose4, #boxclose5, #boxclose6, #boxclose7, #boxclose8, #boxclose9, #boxclose10, #boxclose11, #boxclose12, #boxclose13, #boxclose14, #boxclose15, #boxclose16, #boxclose17, #boxclose18, #boxclose19, #boxclose20, #boxclose21, #boxclose22, #boxclose23, #boxclose24, #boxclose25, #boxclose26, #boxclose27, #boxclose28, #boxclose29, #boxclose30, #boxclose31, #boxclose32, #boxclose33, #boxclose34, #boxclose35, #boxclose36, #boxclose37, #boxclose38, #boxclose39, #boxclose40, #boxclose41, #boxclose42, #boxclose43, #boxclose44, #boxclose45, #boxclose47, #boxclose48, #boxclose49, #boxclose50 {
    float: right;
    cursor: pointer;
    color: #fff;
    border: 1px solid #AEAEAE;
    border-radius: 3px;
    background: #222222;
    font-size: 31px;
    font-weight: bold;
    display: inline-block;
    line-height: 0px;
    padding: 11px 3px;
    position: absolute;
    right: 2px;
    top: 2px;
    z-index: 1002;
    opacity: 0.9;
}

.boxclose:before {
    content: "Ã—";
}

#fade:hover ~ #boxclose {
    display:none;
}

.test:hover ~ .test2 {
    display: none;
}


@media screen and (max-width: 450px) {
    #light, #light2, #light3, #light4, #light5, #light6, #light7, #light8, #light9, #light10, #light11, #light12, #light13, #light14, #light15, #light16, #light17, #light18, #light19,#light20, #light21, #light22, #light23,#light24, #light25, #light26, #light27,#light28, #light29, #light30, #light31, #light32, #light33, #light34, #light35, #light36,  #light37, #light41, #light42, #light43, #light44, #light45, #light46, #light47, #light48, #light49, #light50  {
        width:80%;
    }
}

/* LINUX TWEAKS  ***************************/

.login-instructions {
    margin-bottom: 20px;
    font-weight: 800;
/*    width: 300px;*/
}

#password-spacing {
    margin-top: 14px;
    font-size: 14px !important;
}

.forgot-password-message {
    color: #fff;
    margin-bottom: 20px;
}

.auth-button, .auth-button-2, .auth-button-3 {
    width: 200px !important;
    background-color: var(--2024_generic_accent) !important;
    color: #000;
    padding-right: 20px !important;
    font-size: 15px;
    margin-top: 20px;
    margin-bottom: 10px;
    cursor: pointer;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    cursor: pointer;
    border: 0 !important;
    background: #7a18bb;
    padding-right: 0;
    background-size: 45px !important;
    font-size: 16px;
    height: 50px;
    transition: 0.35s ease;
    text-indent: -15px;
    display: block;
    position: relative;
    font-family: 'interregular';
}

.auth-button-2 {
    width: 280px !important;
    padding-right: 20px !important;
}

.auth-button-3 {
    width: 135px !important;
}

.expired-button {
    background-color: #101820 !important;
    margin-right: auto;
    margin-left: auto;
    display: block;
    color: #fff;
}

.expired-button:hover {
    color: #fff !important;
}

.expired-button #login-container-button-arrow {
    top: 16px;
}

#expired-button-link {
    text-decoration: none;
}

#login-screen label {
    color: #fff;
    font-size: 16px;
    display: block;
}

#new-password {
    margin-top: 20px;
}

.login-links {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    margin-top: 5px;
    font-size: 14px;
}

#login-questions-link {
    margin-top: 0;
}

.login-links a {
    color: var(--2024_generic_accent) !important;
}

.login-links a:hover {
    color: var(--2024_generic_accent_hover) !important;
}

.reject, .error-message {
    width: 650px;
    background-color: #f76252 !important;
    text-align: center;
    position: relative;
    padding: 10px 15px 15px 0px;
    margin-top: 0;
    margin-bottom: 30px !important;
}

.reject li, .error-message li {
    list-style-type: none !important;
}

.error-message {
    margin-top: 15px;
    margin-bottom: 15px;
    padding: 7px 20px 10px 20px;
}

.error-message ul {
    padding-inline-start: initial;
}

.error-message ul li {
    list-style-type: none !important;
    color: #fff;
    font-size: 14px;
    line-height: 15px;
}

.auth-button:hover .button-arrow, .auth-button-3:hover #login-container-button-arrow {
    transform: translate(5px);
    transition: 0.35s ease;
}

.auth-button:hover #login-container-button-arrow, .auth-button-2:hover #login-container-button-arrow  {
    right: 17px;
    transition: 0.35s ease;
}

.auth-button:hover #login-container-button-arrow-2 {
    right: 30px !important;
    transition: 0.35s ease;
}

.auth-button:hover {
    background-color: #fff !important;
    color: #000;
}

#logout-button {
    background-color: transparent !important;
    border: initial;
    color: #000;
    font-size: 16px;
    cursor: pointer;
    text-decoration: none;
    margin-left: 25px;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
}

#logout-button:hover {
    color: var(--2024_generic_medium_gray);
}

.expired-button:hover {
    background-color: #000000 !important;
}

#footer-logout-button {
    background-color: transparent !important;
    border: initial;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    text-decoration: none;
    margin-left: 50px;
    font-family: 'interregular';
    text-align: left;
    margin-left: -5px;
    margin-right: auto;
}

#footer-logout-button:hover {
    color: var(--2024_generic_medium_gray);
}



/* LOGIN SCREEN STYLES HERE ***************************/

#login-screen {
    width: 100%;
    height: 84vh;
    display: flex;
    flex-direction: row;
}

#login-screen p {
    color: #ffffff !important;
}

.login-left {
    width: 60%;
    padding: 5% 10% 5% 10%;
    display: flex;
    background-color: var(--2024_generic_primary);
    color: #000000;
    flex-direction: column;
    justify-content: center;
}

#login-screen-overlay {
    position: absolute;
    height: auto;
    width: 60%;
    right: 0;
    left: 0;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
}

.flex-top {
    display: flex;
    flex-direction: column;
    margin-top: auto;
}

.flex-top-login {
    display: flex;
    flex-direction: column;
}

.login-left img {
    align-self: flex-start;
}

.login-left input {
    align-self: flex-start;
    width: 650px;
    background-color: #fff;
    border-style: none;
    margin-bottom: 15px;
}

.login-right img {
    float: right;
    z-index: 10;
}

.login-right-error img {
    float: right;
}

img#error-vc-connect {
    opacity: 0;
}

h1.login {
    font-size: 150px;
    padding: 0px !important;
    margin-left: 0px;
    color: #ffffff;
    font-family: 'f37_judgebold', sans-serif;
    letter-spacing: 3px;
    line-height: 175px;
    margin-bottom: 10px !important;
}

h1.login-pw {
    font-size: 42px;
    padding-bottom: 0px;
    margin-left: 0px;
    padding-left: 0px;
    color: #ffffff;
    margin-bottom: 20px;
}

h1#password-reset-title {
    font-size: 60px;
    line-height: 70px;
}

.blue {
    color: #0067C5;
}

.lt-blue {
    color: #333f48;
}

.blacktext {
    color: #000000;
}

.electric-blue {
    color: #0054d7;
}

.blue-link {
    color: #0054d7;
    text-decoration: none;
}

.gray-link {
    color: #fff;
    text-decoration: none;
    font-weight: bold;
}

.email {
    margin-top: 10px;
}

.vc-lightblue {
    padding-bottom: 30px;
    padding-top: 10px;
}

.fine-print {
    font-size: 10px;
    color: #5a5a5a;
    line-height: 1.0em;
}

.grey-link {
    color: #b486ff;
}

/* LOGIN SCREEN STYLES HERE ***************************/

#exclamation-error-container p {
    color: #fff !important;
}

#exclamation-password {
    height: 20px;
    padding: 1px 8px;
    border-radius: 50px;
    background-color: #fff;
    margin-right: 5px;
    color: #f76252 !important;
    position: absolute;
    top: -10px;
    width: 20px;
    left: 0;
    right: 0;
    margin-right: auto;
    margin-left: auto;
}

#exclamation-error-container {
    width: 300px;
    background-color: #f76252 !important;
    text-align: center;
    position: relative;
    padding: 15px 0 12px 0;
    margin-top: 20px;
}

#error-screen {
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: row;
}

.error-left {
    width: 50%;
    padding: 5% 10% 5% 10%;
    background-color: #EDEAEF;
    color: #000000;
    display: flex;
    flex-direction: column;
}

#error-left {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.error-left img {
    align-self: flex-start;
    margin-top:40px;
}

.error-left input {
    align-self: flex-start;
    width: 300px;
    background-color: #fff;
}

.login-right {
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width: 40%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    background-color: var(--2024_generic_primary);
}

/*#password-reset-page .login-right {*/
/*    !*background-image: url(https://reg1.lightspeed.events/NetApp/VirtualConnect_devReskin/images/login-screen-2.jpg);*!*/
/*}*/

.login-right-error {
    background: url('../images/error/error-page.jpg') no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width: 60%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.login-right img {
    align-self: flex-start;
    margin-left:auto;
}

.login-right-error img {
    align-self: flex-start;
    margin-left:auto;
}

h1.error {
    font-size: 85px;
    color: #fff;
    padding: 0px !important;
    text-align: center;
}

.dt-logo {
    display: block;
    width: 150px;
}

#vc-top-nav-logo {
    width: 230px;
    margin-right: -66px;
}

.login-left .vc-connect {
    width: 85%;
}

.mob-logo {
    display: none;
}

.vc-connect {
    margin-top: 0;
    margin-right: 2%;
    margin-bottom: 5%;
}

.dt-copyright {
    color: #ffffff;
    font-size: 10px;
    margin-right: 60px;
    margin-bottom: 5%;
    text-align: right;
    z-index: 10;
    background-color: #001658;
    height: 4.5vh;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: -2px;
    z-index: 50;
    position: relative;
}

.main-copyright {
    display: block;
    color: #fff;
    font-size: 10px;
    margin-right: 3%;
    margin-bottom: 0;
    text-align: center;
    margin-top: 1%;
    background-color: #000;
    width: 100%;
    padding: 1%;
}

.mob-copyright {
    display: none;
}

/* EVENT SCREEN STYLES HERE ***************************/

li {
    font-size: 16px;
    margin-bottom:10px;
    line-height: 1.4em;
}

li.agendalist {
    font-size: 16px;
    margin-bottom:5px;
    line-height: 1.2em;
}

ul {
    padding-inline-start: 25px;
    margin-block-end: 0em;
    color: #000000;
}

ul.agenda {
    margin-top: 10px;
}

#event-information {
    display: flex;
    flex-direction: row;
    width: 100%;
    padding-top: 60px;
    padding-bottom: 60px;
}

.e-info-left {
    width: 65%;
    margin-right: 5%;
    padding: 0% 2% 2% 2%;
}

.e-info-left .title:nth-child(1) {
    line-height: 0em;
    margin-block-start: 0em;
    padding-bottom: 12px;
}

.body {
    color: #1a1a1a;
}

.registered-block {
    background-color: #333f48;
    color: #fff;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 20px;
}

.registered-block img {
    margin-right: 15px;
}

.e-info-right {
    width: 30%;
    background-color: #EDEDED;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: flex-start;
}

.e-info-grey {
    width: 100%;
    padding: 10%;
    background-color: #EDEDED;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: flex-start;
}

.e-info-green {
    width: 100%;
    padding: 10% 10% 5% 10%;
    background-color: #00794b;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: flex-start;
}

.e-info-green p {
    font-size: 16px;
}

.e-info-green .green-reg-text {
    font-size: 16px;
    padding-bottom: 25px;
}

.e-info-green .green-reg-title {
    font-size: 20px;
    font-weight: bold;
    padding-bottom: 10px;
}

.e-info-right-reg {
    width: 30%;
    background-color: #EDEDED;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: flex-start;
}

.e-info-block {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin: 25px;
}

.e-info-right hr {
    margin-top: 10px;
    margin-bottom: 25px;
    opacity: 0.5;
}

.e-info-right-reg hr {
    margin-top: 10px;
    margin-bottom: 25px;
    opacity: 0.5;
}

.event-title {
    margin: 0px 0px 15px 0px;
    font-size: 20px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.event-section-subtitle {
    margin-bottom: 5px;
    margin-top: -2px;
    font-weight: 600;
    color: #8F8E91;
}

.event-title p:nth-child(1) {
    width: 70%;
    line-height: 1.2em;
}

.event-info p:nth-child(1){
    font-size: 20px;
    font-weight: bold;
}

.event-info p:nth-child(2){
    font-size: 20px;
    font-weight: bold;
}

.e-info-grey p:nth-child(1) {
    font-size: 20px;
    font-weight: bold;
}

.e-info-grey p:nth-child(2) {
    font-size: 18px;
}

.times {
    width: 90%;
}

.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 130px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    font-size: 14px !important;
    position: absolute;
    z-index: 1;
    top: 100%;
    left: 50%;
    margin-left: -60px;
    margin-top: 5px;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

.timezone {
    display: flex;
    flex-direction: row;
}

.addeventatc {
    display: flex;
}

.timezone p:nth-child(1) {
    font-weight: bold;
}

.timezone p:nth-child(1) {
    width: 30%;
}

a.timezones-reg {
    margin: 5px 0px 10px 0px;
    padding: 10px;
    text-decoration: none;
    color: #000;
    background-color: rgba(255,255,255);
    border-radius: 10px;
    text-decoration: none;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    align-items: center;
}

a.timezones-noreg {
    margin: 5px 0px 10px 0px;
    padding: 10px;
    text-decoration: none;
    color: #000;
    background-color: rgba(255,255,255,.65);
    border-radius: 10px;
    text-decoration: none;
    cursor: pointer;
}

a.timezones-reg-change {
    margin: 5px 0px 10px 0px;
    padding: 10px;
    text-decoration: none;
    color: #000;
    background-color: rgba(255,255,255,.65);
    border-radius: 10px;
    text-decoration: none;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.change-check img {
    opacity: 0;
}

a.timezones-noreg:hover {
    text-decoration: none;
    background-color: #fff;
    border-radius: 10px;
    cursor: pointer;
}

a.timezones-reg-change:hover {
    text-decoration: none;
    background-color: #fff;
    border-radius: 10px;
    cursor: pointer;
}

a.timezones-reg-change:hover .change-check img {
    opacity: 1;
}

.e-info-right p {
    margin-block-start: 0em;
    margin-block-end: 0em;
}

.e-info-right-reg p {
    margin-block-start: 0em;
    margin-block-end: 0em;
}

.e-info-right .registered p {
    font-size: 12px;
    color: #1a1a1a;
}

.e-info-right .registered {
    margin-bottom: 10px;
}

.session-reg-yes {
    width: 100%;
    color: #000;
    border-top: 1px solid #fff;
    padding-top: 25px;
    padding-bottom: 25px;
}

.session-number {
    font-size: 20px !important;
    font-weight: bold;
    padding-bottom: 7px;
}

.event-button-div {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.event-reg-button {
    padding: 10px 20px 10px 20px;
    width: auto;
    background-color: #fff;
    color: #000;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 8px;
    cursor: pointer;
}

.event-cal-button {
    padding: 10px 20px 10px 20px;
    width: 180px;
    text-align: center;
    background-color: #fff;
    color: #000;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 8px;
    cursor: pointer;
}

.event-cancel-button {
    padding: 10px 20px 10px 20px;
    width: 180px;
    text-align: center;
    background-color: rgba(255,255,255,.4);
    border: 1px solid #fff;
    color: #000;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 8px;
    cursor: pointer;
    transition: 0.35s ease;
}

.event-cancel-button:hover {
    background-color: rgba(255,255,255,.7);
    transition: 0.25s ease;
}

.event-cal-button:nth-child(1) {
    margin-bottom: 10px;
}

.timezones {
    margin-bottom: 20px;
}

.cropped {
    width: 135px;
    height: 150px;
    object-fit: cover;
}

.speaker {
    padding-top: 10px;
    padding-bottom: 30px;
}

.speaker .headshot img {
    margin-bottom: 15px;
}

.speaker .headshot p {
    font-size: 16px;
}

.linkedin {
    width: 20px !important;
    margin-top: 5px;
}

.headshot-row {
    display: flex;
    padding-top: 20px;
}

.headshot-row .headshot {
    display: flex;
    flex-direction: column;
    align-content: center;
    margin-right: 5%;
}

.bullet {
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 13px solid #1a1a1a80;
    margin-right: 20px;
    margin-top: 2px;
    margin-left: 25px;
}

.resource {
    display: flex;
    flex-direction: row;
    margin-top: 25px;
    justify-content: flex-start;
}

.resource-description {
    margin-block-start:0em;
    color:#1a1a1a;
}

.hide {
    display: none;
}

.show {
    display: block;
}

/** CONTACT SCREEN STYLES **/

.contact-row {
    width: 90%;
    min-width: 700px;
    max-width: 1100px;
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 60px;
    margin-bottom: 60px;
}

.contact-row .cc-link {
    color: var(--2024_generic_medium_gray) !important;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    cursor: pointer;
}

.contact-row .cc-link:hover {
    color: var(--2024_generic_dark_gray) !important;
}

.contact-card {
    width: 22%;
    display: flex;
    flex-direction: column;
}

.contact-card-info {
    display: flex;
    flex-direction: column;
    width: 100%;
    -webkit-appearance: none;
}

.contact-card-info p {
    margin-block-start: .25em;
    margin-block-end: .25em;
    font-size: 14px;
    -webkit-appearance: none;
}

.contact-card-info p:nth-child(2) {
    margin-block-start: 0.25em;
    margin-block-end: 0.25em;
    font-size: 16px;
    line-height: 22px;
    margin-top: 5px;
    margin-bottom: 15px;
}

a[href^="tel"] {
    color: inherit;
    text-decoration: none;
}

.cc-name {
    font-size: 18px !important;
    font-weight: bold;
    line-height: 18px;
}

.cc-headshot {
    width: 100%;
    margin-bottom: 10px;
}

.cc-info {
    background-color:#D0F0DF;
    font-size: 14px;
    width: 100%;
}

.cc-info-left p {
    margin-block-start: .25em;
    margin-block-end: .25em;
}

.cc-info-left p:nth-child(1) {
    font-weight: bold;
}

.cc-info-left p:nth-child(2) {
    font-size: 16px !important;
}

.cc-info-right {
    background-color:#00794b;
    width: 20%;
    display: flex;
    justify-content: center;
}

.cc-info-right img {
    width: 50%;
}

.cc-link {
    text-decoration: none;
    color: #000;
    font-size: 14px;
    margin-bottom: 10px;
}

.cc-icons {
    width: 100%;
    clear: left;
    display: flex;
}

.cc-icons img {
    height: 22px;
    margin-right: 10px;
}

.cc-link:hover {
    color: #333f48;
    text-decoration: none;
}

/**Yearbook**/

.yearbook-container {
    padding-top: 60px;
    padding-bottom: 60px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.yearbook-card {
    flex: 0 1 calc(25% - 20px);
    margin-right: 20px;
    display: flex;
    flex-direction: column;
    border: 1px solid #a2aaad;
    margin-bottom: 2%;
}

.yearbook-card-images {
    display: flex;
    flex-direction: row;
}

.yearbook-headshot {
    height: 125px;
    object-fit: cover;
}

.yearbook-logo {
    margin: auto;
    width: 60%;
    display: flex;
}

.yearbook-logo img {
    margin: auto;
    width: 100%;
    max-height: 100%;
}

.yearbook-info {
    background-color: #EDEDED;
    display: flex;
    flex: 1;
    flex-direction: row;
    font-size: 12px;
    color: #1A1A1A;
    padding: 5%;
}

.yearbook-info p {
    margin-block-start: 0.1em;
    margin-block-end: 0.1em;
}

.yearbook-name {
    font-size: 16px !important;
}

.yearbook-right {
    margin-left: auto;
}

.alpha-shuffle {
    width: 98%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    border-top: 1px solid #a2aaad;
    border-bottom: 1px solid #a2aaad;
    margin-top: 20px;
}

.alpha-shuffle a {
    display: block;
    padding: 7px 7px 7px 7px;
    color: #5A5A5A;
    text-decoration: none;
}

.alpha-shuffle a:hover {
    display: block;
    background-color: #5A5A5A;
    color: #fff;
    text-decoration: none;
}

/** VIDEO MODAL **/

.video-modal h1 {
    font-size: 20px;
}
.video-modal button {
    margin: 0px auto;
    margin-top: 20px;
}
.video-modal {
    position: fixed;
    top: 0px;
    pointer-events: none;
    left: 0px;
    background: rgba(51, 51, 51, 0.9);
    width: 100vw;
    height: 100vh;
    z-index: 100;
    opacity: 0;
    transition: 0.3s;
}
.video-modal.active {
    opacity: 1;
    pointer-events: auto;
}
.video-modal.active .box {
    top: 50%;
}
.video-modal#success h1 {
    font-size: 1.5em;
}
.video-modal .close {
    position: absolute;
    top: -20px;
    right: -20px;
    cursor: pointer;
    color: #ddd;
}
.video-modal .box {
    background: #fff;
    display: block;
    box-sizing: border-box;
    border-radius: 5px;
    text-align: center;
    padding: 20px;
    position: absolute;
    top: 70%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: 0.3s;
}


/****FORM MODAL ***/

.modal {
    display: flex;
    background-image: url('images/login-screen-rt-2x.png');
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
}

.headshotmodal {
    display: flex;
    background-image: url('images/headshot-background-v2.png');
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
}

.bg-ty {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    background-image: url('images/login-screen-rt-2x.png');
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
}

.form {
    width: 70%;
    max-width: 900px;
    margin: auto;
    background-color: #f4f4f4;
    min-height: 900px;
    margin-top: 50px;
    margin-bottom: 50px;
}

.form-ty {
    width: 60%;
    max-width: 900px;
    margin: auto;
    background-color: #BEEAD3;
}

.form-header {
    background-color: #BEEAD3;
    padding: 5%;
    color: #000000;
}

.form-upload-header {
    padding: 8%;
    background-color: transparent;
    color: #000000;
}

.form-callout-card {
    width: 100%;
    border-left: 4px solid #333f48;
    padding-left: 20px;
}

.form-welcome {
    font-size: 30px;
    font-weight: bold;
}

.form-intro {
    font-size: 16px;
}

.form-subhead {
    font-size: 18px;
    font-weight: bold;
}

.form-fields {
    width: 90%;
    margin:auto;
}

.form-title {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    width: 100%;
    border-bottom: 2px solid #000;
    padding-bottom: 10px;
    margin-bottom: 20px;
    padding-top: 20px;
}


.form-title p:nth-child(1){
    font-size: 21px;
    font-weight: bold;
    margin-block-end: 0em;
}

.form-subtitle {
    font-style: italic;
    font-size: 14px;
    margin-block-end: 0em;
}

.section-title {
    font-size: 14px;
    font-weight: bold;
    color: #000000;
    padding-bottom: 15px;
    border-bottom: 2px solid #1a1a1a20;
    padding-top: 15px;
}

.form-row {
    width: 100%;
    display: flex;
    flex-direction: row;
    margin-top: 20px;
}

label {
    margin-bottom: 10px;
}

.form-input {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.form-input:nth-child(2) {
    display: flex;
    flex-direction: column;
    flex: 1;
    margin-left: 25px;
}

.form-input:nth-child(3) {
    display: flex;
    flex-direction: column;
    flex: 1;
    margin-left: 25px;
}


form {
    font-size: 14px;
    display: flex;
    flex-direction: column;
}

/* RESKIN EDITS */

.reskin .psab-bar-info  {
    background-color: var(--2024_psab_secondary) !important;
    color: #ffffff;
}

.reskin #real-csab-bar, .reskin .csab-box {
    background-color: var(--2024_csab_primary) !important;
}

.reskin .separator p {
    border-bottom: 2px solid var(--2024_psab_primary);
}

.reskin .separator p.blueline {
    border-bottom: 2px solid var(--2024_csab_primary);
}

.reskin a.csab-link {
    color: var(--2024_csab_secondary);
}

.reskin a.csab-link:hover {
    color: var(--2024_csab_secondary_hover);
}

.reskin a.psab-link {
    color: var(--2024_psab_primary);
}

.reskin a.psab-link:hover {
    color: var(--2024_psab_primary_hover);
}

.psab-event .breadcrumbs a {
    color: var(--2024_psab_primary);
}

.psab-event .breadcrumbs a:hover {
    color: var(--2024_psab_primary_hover);
}

.csab-event .breadcrumbs a {
    color: var(--2024_csab_primary);
}

.csab-event .breadcrumbs a:hover {
    color: var(--2024_csab_primary_hover);
}

.reskin .temp p:nth-child(1) {
    color: var(--2024_psab_secondary);
    line-height: 50px;
    margin-right: -15px;
}

.cannes-temp {
    margin-right: 5px !important;
}

.sidebar-nav-csab a {
    color: #0054d7;
}

#login-pw-spacing {
    margin-top: 15px;
    margin-bottom: 15px;
}

.reskin .temp:nth-child(1) {
    border: 2px solid var(--2024_psab_primary);
}

.reskin .temp:nth-child(2) {
    border-top: 2px solid var(--2024_psab_primary);
    border-right: 2px solid var(--2024_psab_primary);
    border-bottom: 2px solid var(--2024_psab_primary);
}

.reskin .temp-csab p:nth-child(1) {
    font-size: 45px;
    color: var(--2024_csab_secondary);
    line-height: 50px;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    margin-right: -15px;
}

.reskin .temp-csab:nth-child(1) {
    border: 2px solid var(--2024_csab_primary);
}

.reskin .temp-csab:nth-child(2) {
    border-top: 2px solid #001e77;
    border-right: 2px solid #001e77;
    border-bottom: 2px solid #001e77;
}

.reskin .event-date {
    background-color: var(--2024_psab_secondary);
    border-right: 2px solid var(--2024_psab_secondary);
    color: #fff;
}

.reskin .event-date-csab {
    background-color: var(--2024_csab_primary);
    border-right: 2px solid var(--2024_csab_primary);
    color: #fff;
}

.reskin .time {
    border-right: 2px solid var(--2024_generic_dark_gray_faded);
}

.reskin .time-csab {
    border-right: 2px solid var(--2024_csab_primary);
}

.special-cloud-row-inner {
    background-color: #e424ff08;
}

.special-cloud-row-inner .time {
    background-color: #ffffff;
    border-right: 2px solid #0054D7 !important;
}

.time strong {
    line-height: 21px;
}

.time-csab {
    display: flex;
    align-items: center;
}

.reskin .event-contact-card-csab {
    border-left: 4px solid var(--2024_csab_primary);
}

.reskin .separator img {
    width: 45px;
}


.upper-alpha-list {
    list-style-type: upper-alpha;
}

.event-header-text h1 span {
    display: block;
}


@media screen and (max-width: 1300px) {
    .agenda-line-break {
        display: inline-block !important; 
    }
    #login-screen-overlay {
        width: 70%;
    }
    .navlink, #logout-button {
        font-size: 14px;
        margin-left: 15px;
    }
    .login-right, .login-left {
        width: 50%;
    }
    h1.login {
        font-size: 80px;
        line-height: 130px;
    }
    .login-left input, .error-message, .reject {
        width: 450px;
    }
}

@media screen and (max-width: 1300px) {
    .navlink, #logout-button {
        font-size: 13px;
        margin-left: 15px;
    }
    #networking-double-image-2 {
        margin-top: 0;
    }
    .networking .section-details {
        display: block;
    }
    .networking .section-details img, #location .section-details img {
        margin-bottom: 15px;
    }
}

@media screen and (max-width: 1200px) {
    .event-row-first {
        width: 35.6% !important;
    }
    .time {
        width: 32% !important;
    }
    .event-header-text {
        width: 60% !important;
    }
    h1.login {
        font-size: 75px;
    }
    .login-left input, .error-message, .reject {
        width: 400px;
    }
}

@media screen and (max-width: 1100px) {
    #contact-container {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .contact-row {
        width: 90%;
        min-width: 700px;
        max-width: 1100px;
        margin: auto;
        display: block;
        flex-direction: row;
        justify-content: space-between;
        margin-top: 60px;
        margin-bottom: 60px;
        text-align: center;
    }
    .contact-card {
        width: 33%;
        display: inline-block;
        margin-left: 2%;
        margin-right: 2%;
    }
    .contact-card-info {
        text-align: left;
    }
    .top-row-mobile {
        margin-bottom: 5%;
    }
    .content-container-main {
        width: 90%;
    }
    .navlink, #logout-button {
        font-size: 12px;
        margin-left: 10px;
    }
    .headshot3 {
        width: 44% !important;
        margin-right: 5px;
        margin-top: 5px;
        margin-bottom: 5px;
    }
    .e-info-grey {
        padding: 5%;
    }

    .e-info-green {
        padding: 5%;
    }

    .event-header-text {
        width: 82% !important;
    }
}


@media screen and (max-width: 1000px) {

    #vc-top-nav-logo {
        margin-right: 0;
    }

    #main-login-page .content-container {
        width: 90%;
    }

    #resources-container .row {
        margin-right: auto;
        margin-left: auto;
        display: block;
    }

    .resource-card {
        flex: initial;
        width: 48%;
        margin-right: 20px;
        display: inline-block;
        vertical-align: top;
    }

    .resource-card:nth-child(3n - 1) {
        margin-right: 0;
        margin-left: 0;
    }

    .mobile-nav-items {
        opacity: 1;
        height: auto;
        padding: 30px 0 30px 0;
    }

    #logout-button {
        font-size: 20px;
        text-align: right;
    }

    .form {
        width: 90%;
    }

    #dt-nav {
        display: none;
    }

    #mobile-nav {
        display: block;
        margin-left: auto;
        align-self: center;
    }

    h1.login {
        font-size: 60px;
        padding-bottom: 0px;
        margin-left: 0px;
        color: #fff;
        line-height: 120px;
    }

    h1.login-pw {
        font-size: 38px;
        padding-bottom:40px;
        margin-left:0px;
        color:#000;
    }

    .login-left {
        padding: 5% 5% 5% 5%;
    }

    .login-left input, .error-message, .reject {
        width: 350px;
    }

}


@media screen and (max-width:820px) {

    .title {
        padding-top: 0;
    }

    #main-login-page .content-container {
        width: 80%;
    }

    .flex-top-login {
        display: flex;
        flex-direction: column;
        margin-top: auto;
        margin-bottom: auto;
    }

    .flex-bottom {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-color: #000;
    color: #999;
    text-align: center;
    font-size: 10px;
    padding: 7% 7% 2% 7%;
    margin-top: auto;
}

    .dt-copyright {
        display: none;
    }

    .expired-button #login-container-button-arrow {
        top: 16px;
    }

    .temp {
        padding: 3% 5% 5% 5% !important;
    }

    .temp p:nth-child(1) {
        font-size: 40px !important;
    }

    .headshot div, .headshot3 div {
        align-self: center !important;
        margin-left: 15px;
    }

    #budapest-banner, #palosverdes-banner {
        min-height: 400px;
        margin-top: 20px;
    }

    .yearbook-card {
        flex: 0 1 calc(50% - 15px);
        margin-right: 15px;
        display: flex;
        flex-direction: column;
        border:1px solid #a2aaad;
        margin-bottom: 2.5%;
    }

    .footer-logo {
        margin: auto;
        padding-bottom: 40px;
        width: 200px;
        margin: auto;
    }

    .desktop {
        display: none !important;
    }

    .mobile {
        display: flex !important;
    }

    .contact-row:nth-child(1) {
        width: 100%;
        min-width: 0px;
    }

    .contact-row {
        width: 100%;
        min-width: 0px;
    }

    .form {
        width: 90%;
    }

    .form-title {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-between;
        width: 100%;
        border-bottom: 2px solid #000;
        padding-bottom: 10px;
        margin-bottom: 40px;
        padding-top: 40px;
    }


    #blue-bar {
        padding-top:100px;
        height: 180px;
    }

    #main-login-page #blue-bar {
        padding-top: 0;
        height: 100px;
    }

    #nav {
        position: fixed;
        background-color:#fff;
        width:100%;
        z-index: 10;
    }

    .mobile-nav-items {
        position: fixed;
        background-color: #fff;
        width: 100%;
        margin-top: 80px;
        z-index: 10;
    }

    .mobile-nav-items {
        padding-right: 30px;
    }

    #logout-button {
        margin-right: -10px;
    }

    .logo {
        margin-left: 10%;
    }

    #mobile-nav {
        margin-right: 10%;
    }

    #login-screen {
        width: 100%;
        height: 100vh;
        display: flex;
        flex-direction: column;
    }

    .login-left {
        width: 100%;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        padding: 0;
        height: 100vh;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    #error-screen {
        width: 100%;
        height: 100vh;
        display: flex;
        flex-direction: column;
    }

    .error-left {
        width: 100%;
        padding: 0;
        height: 100vh;
        background-color: #a2aaad;
        color: #000;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .login-left img {
        margin-top: 0px;
    }

    .error-left img {
        margin-top: 0px;
    }

    .login-right {
        display: none;
    }

    .login-right-error {
        display: none;
    }

    .dt-logo {
        display: none;
    }

    .mob-logo {
        display: block;
        width: 45%;
        padding-bottom:40px;
        margin: auto;
    }

    .mob-copyright {
        display: block;
    }

    .main-copyright {
        text-align: center;
        margin-right: 0%;
    }


    .flex-top {
        padding:7.5%;
    }

    .flex-top-login {
        padding: 10.5%;
    }

    .flex-bottom {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        background-color: #001658;
        color: #999;
        text-align: center;
        font-size: 10px;
        padding: 7% 7% 2% 7%;
        margin-top: 0;
    }

    h1.login {
        font-size: 130px;
        line-height: 160px;
    }

    .hero-text {
        width: 90%;
    }

    .hero-text-index {
        width: 90%;
    }

    .event-view {
        width: 100%;
        margin: auto;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .row {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        margin-bottom: 0px;
    }

    .event {
        width: 100%;
        border: 1px solid #000;
        padding-bottom: 40px;
        text-align: center;
        margin-bottom:40px;
    }


    .event:nth-child(3n - 1) {
        margin-right: 0px;
        margin-left: 0px;
    }

    .resource-card {
        width: 100%;
        border:1px solid #000;
        text-align: center;
        margin-bottom:40px;
    }

    .resource-card:nth-child(3n - 1) {
        margin-right: 0px;
        margin-left: 0px;
    }

    .introduction {
        width: 100%;
        margin: auto;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .intro-text {
        width: 100%;
    }

    .headshot-home {
        display: flex;
        flex-direction: row;
        width: 100%;
        margin-top:30px;
    }

    .headshot, .headshot3 {
        display: flex;
        flex-direction: row;
        width: 100% !important;
        margin-top: 10px;
    }

    .news-item {
        width: 100%;
        margin: auto;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .news-item img {width:100%;
        align-self: flex-start;
        margin-bottom: 30px;}

    .news-details {display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 100%;}

    .arrow {display: none;}

    .blk-footer {padding-top:0px;
        min-height: 0px;}

    .sub-footer {display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;}


    .sub-footer-contact {display: flex;
        flex-direction: column;
        width: 100%;
        text-align: center;}

    .sub-footer-nav {text-align: center;
        width: 100%;
        margin-left: 0px;
        margin-bottom: 10px;}

    .ft-nav-link {margin-bottom: 20px;}

    .sub-footer img {margin:auto;
        padding-bottom: 40px;}

    .footer-logo {margin:auto;
        padding-bottom: 40px;}

    .footer-hr {display: none;}

    #event-information {display: flex;
        flex-direction: column-reverse;
        width: 100%;
        padding-top:40px;
        padding-bottom:40px;}

    .e-info-left {width: 100%;
        padding: 0%;
        padding-top: 30px;}

    .body {color:#1a1a1a;}

    .e-info-right {width: 100%;
        padding:20px; }


    .e-info-right-reg {width: 100%;
        padding:20px; }


    .form {width:90%;
        margin:auto;
        background-color:#fff;
        min-height: 900px;
        margin-top:140px;}


    .form-row {width: 100%;
        display: flex;
        flex-direction: column;
        margin-top:20px;
    }

    .form-input {display: flex;
        flex-direction: column;
        flex:1;
        margin-bottom: 15px;}

    .form-input:nth-child(2) {display: flex;
        flex-direction: column;
        flex:1;
        margin-left:0px;}

    .form-input:nth-child(3) {display: flex;
        flex-direction: column;
        flex:1;
        margin-left:0px;}

    .sub-footer-contact a:nth-child(1) {
        margin-right: 0px;
        margin-bottom: 10px;
    }

    .login-left input, .error-message, .reject {
        width: 100%;
    }

}

@media screen and (max-width: 700px) {
    .content-container-main {
        width: 100%;
    }
    .contact-card {
        width: 55%;
    }
    #contact-card-3 {
        margin-bottom: 5%;
    }
}

@media screen and (max-width: 600px) {
    h1.login {
        font-size: 90px;
        line-height: 140px;
    }
}

@media screen and (max-width: 500px) {
    h1.login {
        font-size: 60px;
        line-height: 90px;
    }
    h1#password-reset-title {
        font-size: 45px;
        line-height: 55px;
    }
}

@media screen and (max-width: 450px) {

    .auth-button, .auth-button-2, .auth-button-3 {
        width: 230px !important;
    }

    .hero-text {    width: 100%;
        height: 100%;
        justify-content: center;}

    .hero-text-index {    width: 100%;
        height: 100%;
        justify-content: center;}

    #news {padding-bottom: 0px;}


    .yearbook-card {flex: 0 1 calc(100%);
        margin-right: 0px;
        display: flex;
        flex-direction: column;
        border:1px solid #a2aaad;
        margin-bottom: 5%;}

    .ft-contact-link {
        margin-bottom: 15px;
    }

    .sub-footer-contact a:nth-child(1) {
        margin-right: 0px;
    }

    #blue-bar img {
        width: 100% !important;
    }

    .content-container {
        width: 80%;}

    .content-container-csab-bar {
        width: 80%;}

    .content-container-main {
        width: 80%;}


    .contact-row:nth-child(1) {flex-direction: column;}

    .contact-row {flex-direction: column;
        margin-top:60px;}

    .contact-card {width: 80%;
        margin: auto;
        margin-bottom:30px;}

    .speaker {
        padding-top:10px;
        padding-bottom:0px;}

    .login-left input {
        align-self: flex-start;
        width: 100%;
        -webkit-appearance:none;}

    .error-message, .reject {
        width: 100%;
    }

    .sub-footer img {margin:auto;
        padding-bottom: 30px;
        width: 60%;}

    .headshot-row {flex-direction: row;
        padding-top: 20px;}

    .headshot-row .headshot {
        display: flex;
        flex-direction: column;
        /* align-content: center; */
        text-align: center;
        align-items: center;
        margin: auto;
        padding-bottom: 30px;
        /* margin-right: 5%; */
    }

    .headshot img, .headshot3 img  {
        align-self: center;
        margin-right: 10px !important;
        margin-bottom: 0px !important;
    }
    .headshot-details {flex-direction: row;
        width: 100%;
        margin: auto;}

    .form-ty {width:90%;
        max-width: 900px;
        margin:auto;
        background-color:#BEEAD3;}

    #hero {width:100%;
        display: flex;
        flex-direction: column;
        background: url(images/banner@2x.jpg) no-repeat 75% 50%;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        min-height: 300px;
        overflow: hidden;
        padding-bottom: 0px;
    }

    #hero-1 {width:100%;
        display: flex;
        flex-direction: column;
        background: url(images/hero-alt@2x.jpg) no-repeat 75% 50%;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        min-height: 300px;
        overflow: hidden;
        padding-bottom: 0px;
    }


    #event-hero {min-height: 250px;
        padding-top:0px;
        padding-bottom:0px;}


    #event-hero1 {
        min-height: 0px;

    }

    #event-hero2 {
        min-height: 0px;

    }

    #event-hero3 {
        min-height: 0px;

    }


    #event-hero4 {
        min-height: 0px;

    }

    #event-hero5 {
        min-height: 0px;

    }

    #event-hero6 {
        min-height: 0px;

    }

    #event-hero7 {
        min-height: 0px;

    }




    h1 {padding: 0px 25px 0px 25px;
        line-height: 1.0em;
        font-size: 34px;
        margin: 10px;}

    .logo img {width: 150px;
        margin-top:10px;}

    select {width: 100%;}

    .sort-mobile {width: 100%;
        display: block;}

    .event-super-menu {padding-top:20px;}

    .event-shuffle-menu a {display: none;}

    #blue-bar img {width: 100% !important;}

    .form {margin-top:60px;
        margin-bottom:60px;}

    .form-intro {font-size: 14px;}

}


/********** EVENT STYLES **************/


@font-face {
    font-family: beatrice-medium;
    src: url("../fonts/Beatrice-Medium.otf");
}

@font-face {
    font-family: helvetica-neue;
    src: url("../fonts/HelveticaNeue.ttc");
}

#event-container {
    width: 80%;
    margin: auto;
    display: flex;
    justify-content: space-between;
    max-width: 1200px;
    margin-top: 50px;
    position: relative;
}

p, div {
    margin-block-start: 0em;
    margin-block-end: 0em;}

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

a {
    color: var(--2024_generic_medium_gray);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
}

a.psab-link {color:#333f48;}
a.bluelink {color:#0054d7;}
a.purplelink {color:#B486FF;}
a.peachlink {color:#FFBCA3;}

#chicago-banner {width:100%;
    display: flex;
    flex-direction: column;
    background: url("images/Chicago-hero-v1.jpg") no-repeat 100% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-height: 300px;
    overflow: hidden;
    padding-bottom: 0px;
}

#nola-banner {width:100%;
    display: flex;
    flex-direction: column;
    background: url("images/NOLA-hero-v1.jpg") no-repeat 100% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-height: 300px;
    overflow: hidden;
    padding-bottom: 0px;
}

#budapest-banner, #palosverdes-banner {
    width:100%;
    display: flex;
    flex-direction: column;
    background: url("images/budapest-hero-v2.jpg") no-repeat 100% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-height: 300px;
    overflow: hidden;
    padding-bottom: 0px;
}

#palosverdes-banner {
    background: url(images/palosverdes-hero-v2.jpg);
    background-size: cover !important;
}

#budapest-banner, #palosverdes-banner {
    min-height: 400px;
}

#event-banner {width:100%;
    display: flex;
    flex-direction: column;
    background: url("images/scottsdale-hero.jpg") no-repeat 100% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-height: 300px;
    overflow: hidden;
    padding-bottom: 0px;
}

.event-header-text {
    padding: 55px 50px;
    margin: auto;
    display: flex;
    background-color: rgba(26,26,26,.9);
    justify-content: center;
}

.event-header-text h1 {
    font-size: 30px;
    padding: 0px;
    font-family: 'Inter', sans-serif;
    line-height: 35px;
    margin-bottom: 20px;
    font-weight: 600;
}

.event-header-text h2 {
    font-size: 20px;
    font-weight: 400;
    margin-bottom: 50px;
    display: block;
    font-family: 'interregular';
    text-align: center;
    margin-top: 15px;
}

.sidebar-nav {
    width: 375px;
    margin-right: 5%;
    position: sticky;
    /* height: auto; */
    align-self: flex-start;
    position: -webkit-sticky;
    position: sticky;
    top: 50px;
    align-self: flex-start;
}

.sidebar-nav-blu3 .header-reg:hover {
    color: #001e77 !important;
}

.main-content {width: 65%;}

.body-text-pad {padding-bottom: 15px;}

.body-list-pad {padding-top: 15px;}

a.body-text-pad {padding-bottom: 15px;
    display: block;}

.main-content p {
    line-height: 1.4em;
    font-family: 'Inter', sans-serif !important;
}

.psab-bar-info {width: 100%;
    padding: 7%;
    background-color: #333f48;
    display: flex;
    flex-direction: column;}

.psab-bar-info p:nth-child(1) {
    font-size: 20px;
    margin-bottom: 7px;
    font-family: 'Inter', sans-serif;
    width: 80%;
    line-height: 24px;
    font-weight: 600;
}

.psab-bar-info p:nth-child(2) {
    margin-bottom: 15px;
    margin-top: 5px;
    font-family: 'interregular';
}

.csab-bar-info {
    width: 100%;
    padding: 7%;
    background-color: var(--2024_csab_primary);
    display: flex;
    flex-direction: column;
    color: #fff;
}

.csab-bar-info p:nth-child(1) {
    font-size: 22px;
    margin-bottom: 0;
    font-family: 'Inter', sans-serif;
    width: 90%;
    line-height: 24px;
    font-weight: 600;
}

.csab-bar-info p:nth-child(2) {
    margin-bottom: 15px;
    margin-top: 5px;
    font-family: 'interregular';
}

/*-------EVENT COLORS (green is default)-------*/
.csab-box {
    background-color: #001a77;
    color: #fff;
}

.purplebox {background-color: #B486FF}
.peachbox {background-color: #FFBCA3;}

.header-reg {
    width: 190px !important;
    color: #fff;
    font-family: 'interregular';
    text-decoration: none;
    padding: 11px 20px;
    background-color: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    height: 50px !important;
    /* width: auto !important; */
    margin: auto;
    border: 1px solid #fff;
    -webkit-appearance: none;
    cursor: pointer;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    background-color: var(--2024_generic_dark_gray);
}

.header-reg:hover {
    background-color: #000;
    color: #fff;
}

.update-link .header-reg, .closed-link .header-reg {
    width: 215px !important;
    padding: 10px !important;
}

.update-link .header-reg {
    width: 245px !important;
    padding: 10px 40px 11px 0px !important;
}

.event-header-text .update-link .header-reg {
    margin-left: -20px;
}

.psab-bar-info .header-reg {
    margin-left: 0;
    border: 1.5px solid #fff;
    color: #fff;
    background-color: var(--2024_psab_primary);
}

.psab-bar-info .header-reg:hover {
    background-color: var(--2024_psab_primary_hover);
    color: #fff;
}

.csab-bar-info .header-reg {
    margin-left: 0;
    border: 1.5px solid #fff;
    color: #fff;
    background-color: var(--2024_csab_secondary);
}

.csab-bar-info .header-reg:hover {
    background-color: var(--2024_csab_secondary_hover);
    color: #fff;
}

.transparent-reg {width: auto;
    color:#1a1a1a;
    font-family: beatrice-medium;
    text-decoration: none;
    padding: 0px 25px 0px 25px;
    background-color:rgba(208,240,223,.75);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    align-self: flex-start;
    height: 50px;
    width: 185px;
    border: none;
    -webkit-appearance:none;}

.transparent-reg:hover {background-color: #fff;}

.back-to-top {
    width: auto;
    color: var(--2024_generic_dark_gray);
    font-family: beatrice-medium;
    text-decoration: none;
    padding: 0px 10px 0px 5px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    height: 50px;
    width: 195px;
    border: 2px solid var(--2024_generic_dark_gray);
    -webkit-appearance: none;
    margin-left: auto;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    cursor: pointer;
}

.back-to-top:hover {
    background-color: var(--2024_generic_dark_gray) !important;
    color: #fff;
}

.back-to-top img {
    width: 15px;
    margin-top: -7px;
}

.grey-menu-level {
    width: 100%;
    background-color: var(--2024_generic_light_gray);
    font-family: beatrice-medium;
    border-bottom: 1px solid var(--2024_generic_dark_gray_faded);
    display: flex;
    align-items: center;
    text-decoration: none;
    padding: 10px 0px 10px 25px;
}

.grey-menu-level:nth-last-child(1) {
    border-bottom:0px solid #a2aaad;}

.grey-menu-level:hover {
    background-color: #e3e0e5;
}

a.grey-menu-level p {
    color: #000;
    text-decoration: none;
    font-family: 'Inter', sans-serif !important;
    font-weight: 500;
}

.grey-menu-level .icon {
    width: 40px;
    display: flex;}

#contact-icon {
    width: 60%;
}

section {margin-bottom:55px;}

.intro p:nth-child(1) {
    font-size: 24px;
    font-family: 'interregular' !important;
}

.headshots {display: flex;
    justify-content: space-between;}

.headshot {display: flex;}

.headshot p {font-size: 14px !important;
    padding-bottom: 0px;}

.headshot div, .headshot3 div  {align-self: flex-end;}

.headshot img {width: 80px;
    align-self: flex-start;
    margin-right: 10px;}

.headshot b {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
}

.headshot p {
    font-family: 'Inter', sans-serif;
}


/*------THREE COLUMN HEADSHOTS START-------*/

.headshot-row3 {width: 100%; display: flex; flex-wrap: wrap; flex-direction: row; margin-bottom: 10px;}

.headshot3 {width: 30%; margin-right: 5px;}

.headshot3 p {
    font-size: 14px !important;
    /*line-height: 15px;*/
    line-height: 1.4em;
    margin-bottom: 7px;
}

.headshot3 img {width: 100px; margin-bottom: 10px}

/*------THREE COLUMN HEADSHOTS END-------*/

.separator {display: flex;
    margin-bottom: 25px;}

.separator img {margin-right: 15px;}

.separator p {font-size:20px;
    font-family: beatrice-medium;
    border-bottom:2px solid #333f48;
    padding-bottom:10px;
    width:100%;
    align-self: flex-start;}



.separator p {
    font-size: 20px;
    border-bottom: 2px solid #333f48;
    padding-bottom: 10px;
    width: 100%;
    align-self: flex-start;
    font-size: 20px;
    font-family: 'Inter', sans-serif;
    border-bottom: 2px solid #0054d7;
    padding-bottom: 2px;
    width: 100%;
    align-self: flex-start;
    color: #000;
    margin-top: 5px;
    font-weight: 600;
}

/*------CHANGE EVENT COLOR (green is default)-------*/


.separator p.blueline {
    font-size: 20px;
    font-family: 'Inter', sans-serif;
    border-bottom: 2px solid #0054d7;
    padding-bottom: 2px;
    width: 100%;
    align-self: flex-start;
    color: #000;
    margin-top: 5px;
    font-weight: 600;
}

.separator p.purpleline {font-size:20px;
    font-family: beatrice-medium;
    border-bottom:2px solid #B486FF;
    padding-bottom:10px;
    width:100%;
    align-self: flex-start;}

.separator p.peachline {font-size:20px;
    font-family: beatrice-medium;
    border-bottom:2px solid #FFBCA3;
    padding-bottom:10px;
    width:100%;
    align-self: flex-start;}

.section-details {display: flex;
    /*justify-content: space-between;*/}

.column {flex-direction: column;}

.section-details img {margin-right: 30px;
    align-self: flex-start;
    height: 300px;
    object-fit: fill;}

#networking-double-image img {
    margin-right: initial;
    align-self: initial;
}

#networking-double-image {
    margin-right: 30px;
    align-self: flex-start;
}

#networking-double-image-2 {
    margin-top: 30px;
}

.event-section-title {
    margin-bottom: 7px;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600;
}

.additional-event-section-title {
    margin-top: -5px;
    margin-bottom: 15px;
}

.event-climate {width: 100%;
    display: flex;
    justify-content: space-between;}

.event-climate p.climate-detail {width: 45%;
    margin-right: 5%;}

.event-climate p.climate-detail-wide {width: 100%;
    margin-right: 0%;}

.weather {display: flex;
    width: 50%;}

/*-------DEFAULT GREEN TEMPERATURE COLOR START-------*/

.temp:nth-child(1) {border: 2px solid #333f48;
    width:50%;
    justify-content: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;}

.temp:nth-child(2) {
    border-top: 2px solid #333f48;
    border-right: 2px solid #333f48;
    border-bottom: 2px solid #333f48;
    width:50%;
    justify-content: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;}

.temp p:nth-child(1){font-size: 45px;
    color:#333f48;
    font-family: beatrice-medium;}

/*-------DEFAULT GREEN TEMPERATURE COLOR END-------*/

/*-------BLUE TEMPERATURE COLOR START-------*/

.temp-csab:nth-child(1) {border: 2px solid #0054d7;
    width:50%;
    justify-content: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;}

.temp-csab:nth-child(2) {
    border-top: 2px solid #0054d7;
    border-right: 2px solid #0054d7;
    border-bottom: 2px solid #0054d7;
    width:50%;
    justify-content: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;}

.temp-csab p:nth-child(1){font-size: 45px;
    color:#0054d7;
    font-family: beatrice-medium;}

/*-------BLUE TEMPERATURE COLOR END-------*/

.calendar {
    width: 100%;
    margin-bottom: 30px;
    font-family: 'Inter', sans-serif !important;
}

.event-row {width:100%;
    display: flex;
    border-bottom:1px solid #a2aaad;
    line-height: 1.3em;}

.event-row:nth-last-child(1) {border-bottom:0px solid #a2aaad;}

.event-row-thirds-header {
    background-color: var(--2024_generic_light_gray);
}

.event-row-second {
    background-color: #e424ff08;
}

.event-row-third {
    background-color: #25006d08;
}

.event-row-thirds-header .event-row-second {
    background-color: initial;
    font-weight: 800;
}

.event-row-thirds-header .event-row-third {
    background-color: initial;
    font-weight: 800;
}

.event-row-thirds div {
    width: 38%;
    text-align: left;
    line-height: 16px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.event-row-first {
    width: 25.3% !important;
}

.event-row-fourths .event-row-first {
    width: 38% !important;
}

.event-row-second {
    border-right: 2px solid #000;
}

.line-break {
    display: block;
}

.event-row-full {
    background-color: var(--2024_psab_secondary);
}

.csab-event .event-row-full {
    background-color: var(--2024_csab_primary);
}

.event-row-thirds .event-row-first {
    border-right: 2px solid var(--2024_psab_accent_one) !important;
}

.event-row-thirds .event-row-first-special {
    border-right: 2px solid var(--2024_psab_accent_two) !important;
}

.event-row-thirds .event-row-second {
    border-right: 2px solid var(--2024_psab_accent_two) !important;
}

.event-row-thirds .event-row-cloud {
    border-right: 2px solid #0054D7 !important;
}

/* agenda changes */ 

table, table * {
    border: 0;
    border-collapse: collapse;
    
}

.agenda-day {
    border-collapse: collapse;
    border: 0; 
    width: 100%;
}

.agenda-day .bold {
    font-weight: 600 !important;
}

.agenda-day table {
    width: 100%; 
}

.agenda-day td, .agenda-day th {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
    border: 0;
/*    border-bottom: 1px solid #a2aaad;*/
    border: 1px solid #dddddd;
    font-size: 14px;
}

.three-columns td {
    border-bottom: 0;
}

tr.three-columns th, tr.three-columns td, .last-column td {
    border-top: initial;
}

.three-columns th, .two-columns th {
    background-color: var(--2024_generic_light_gray);
    font-weight: 600;
}

.three-columns td {
    background-color: #e424ff08;
}

.three-columns td:first-child {
    background-color: initial;
}

.agenda-line-break {
    display: block; 
}
    
.bold {
    font-weight: 800; 
}
 
.agenda-day th:first-child, .agenda-day td:first-child {
    width: 25% !important;
    min-width: 25% !important;
    max-width: 25% !important;
/*    word-break: break-all !important;*/
    border-right: 2px solid var(--2024_generic_dark_gray_faded);
}
    
#day-1, #day-2 {
    margin-bottom: 30px;
}
    
.two-columns-content {
    width: 37.5%;
}
    
.three-columns-content {
    width: 25%;
}

.gtm-border {
    border-left: 2px solid var(--2024_psab_accent_one) !important;
}

.cto-border {
    border-left: 2px solid var(--2024_psab_accent_two) !important;
}

.cloud-border {
    border-left: 2px solid #0054D7 !important;
}

.no-gray-border-right {
    border-right: initial !important; 
}

.no-border-left {
    border-left: 0 !important;
}

.no-border-bottom {
    border-bottom: 0 !important;
}

.no-border-right {
    border-right: 0 !important;
}

.border-bottom {
    border-bottom: 1px solid #dddddd !important;
}

.slightly-darker-bg {
    background-color: #e424ff08 !important;
}

/*------CHANGE EVENT COLOR (default is green)-------*/
.event-date {width: 100%;
    background-color:#D1F1E0;
    border-right:2px solid #333f48;
    padding: 10px;
    font-weight: bold;
}

.event-date-pipe {
    margin-right: 10px;
    margin-left: 10px;
}

.time {
    width: 25%;
    border-right: 2px solid #333f48;
    padding: 10px;
}

.event-date-csab {width: 35%;
    background-color:#CEEDFF;
    border-right:2px solid #0054d7;
    padding: 10px;
    font-weight: bold;
}

.time-csab {width: 35%;
    border-right:2px solid #0054d7;
    padding: 10px;
}

.time .mobile {
    display: none;
}

.vc-event {
    width: 65%;
    padding: 10px;
    font-size: .9em;
}

#agenda .vc-event span {
/*    display: block;*/
    font-weight: 400;
}

#agenda .vc-event .display-inline {
    display: inline-block;
}

.event-blue {
    width: 65%;
    padding: 10px !important;
}

.body-bold {
    font-weight: 600;

}

.dual-event {width: 65%;
    display: flex;}

.sub-event-title {display: block;
    background-color:#EDEDED;
    padding: 10px;}

.sub-event:nth-child(1) {width: 50%;
    border-right:2px solid #333f48;
}

.sub-event:nth-child(2) {width: 50%;
}

.sub-event p {padding:10px;}


.sub-event-blue:nth-child(1) {width: 50%;
    border-right:2px solid #0054d7;
}

.sub-event-blue:nth-child(2) {width: 50%;
}

.sub-event-blue p {padding:10px;}

.contact-info {display: flex;
    justify-content: space-between;
    margin-top: 20px;}

.event-contact-card {
    width: 50%;
    border-left: 4px solid var(--2024_psab_primary);
    padding-left: 30px;
}

.event-contact-card-csab {
    width: 50%;
    border-left:4px solid #0054d7;
    padding-left: 30px;
}

#back-top {text-align: right;
    margin-top: 50px;
    margin-bottom: 80px;
    margin-left: auto;}

.sub-footer {
    font-family: 'interregular';
}

/*DualEvents change 7/26/22*/
#gray-bar{
    height: 80px;
    background-color: #E3E5E7;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    width: 100%;
}
#advisory-board-wrapper h2{
    font-size: 30px;
    line-height: 45px;
    margin-bottom: 10px;
    text-align: left;
}
#advisory-board-wrapper h3 {
    font-size: 22px;
    font-family: 'interregular';
}
.advisory-board-view {
    width: 100%;
    margin:auto;
    margin-top:40px;
}
.advisory-board-view .row{
    gap: 2%;
}
#dual-events-instruction {
    text-align: center;
    margin-bottom: 0;
    margin-top: -20px;
}
#dual-events-title {
    margin-top: 40px;
    line-height: 35px;
    font-family: 'Inter', sans-serif;
    font-size: 30px;
    font-weight: 600;
}
.advisory-board {
    flex: 0 1 calc(49%);
    display: flex;
    flex-direction: column;
    margin-bottom: 2%;
}
.advisory-board .advisory-board-details {
    padding: 20px 35px 25px 35px;
    font-family: beatrice-medium;
}
.advisory-board .advisory-board-details p.title {
    font-size: 25px;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
}
.csab.advisory-board .title {
    color: #fff;
}
.csab.advisory-board .title span {
    color: #fff;
}
.psab.advisory-board .title {
    color: #fff;
}
.psab.advisory-board .title span {
    color: #fff;
}
.advisory-board	.advisory-board-details p.sub-title{
    font-family: 'interregular';
    color: #fff;
}
.advisory-board	.advisory-board-details p.sub-title span{
    padding: 0 10px;
}
.advisory-board	.advisory-board-details p.sub-title span:first-of-type{
    padding: 0 10px 0 0;
}
.advisory-board	.advisory-board-details p.sub-title span + span{
    border-left: solid #fff 1px;
}
.advisory-board	.advisory-board-register{
    padding: 42px 35px 42px 35px;
    margin-top: -5px;
}
.advisory-board	.advisory-board-img img {
    width: 100%;
    height: auto;
}

/* Start new dual-event stylings */
.csab .advisory-board-details{
    background-color: var(--2024_csab_primary);
}
.csab .advisory-board-register{
    background-color: var(--2024_csab_primary);
    color: #1A1A1A;
}
.csab .block-link-outline-grey {
    background-color: var(--2024_csab_secondary);
    color: #ffffff;
}
.csab .block-link-outline-grey:hover{
    background-color: var(--2024_csab_secondary_hover);
    color: #ffffff;
}

.psab .advisory-board-details{
    background-color: var(--2024_psab_secondary);
    color: #fff;
}
.psab .advisory-board-register{
    background-color: var(--2024_psab_secondary);
}
.psab .block-link-outline-grey {
    background-color: var(--2024_psab_primary);
    color: #fff;
}
.psab .block-link-outline-grey:hover{
    background-color: var(--2024_psab_primary_hover);
}

/* End new dual-event stylings */
#ab-csab-chic-2022 .advisory-board-details{
    background-color: #0054d7;
}
#ab-csab-chic-2022 .advisory-board-register{
    background-color: #CEEDFF;
    color: #1A1A1A;
}
#ab-csab-chic-2022 .block-link-outline-grey{
    background-color: #CEEDFF;
    color: #1A1A1A;
}
#ab-csab-chic-2022 .block-link-outline-grey:hover{
    background-color: #0054d7;
    color: #1A1A1A;
}
#ab-psab-ema-2022 .advisory-board-details{
    background-color: #333f48;
}
#ab-psab-ema-2022 .advisory-board-register{
    background-color: #D1F1E0;
}
#ab-psab-ema-2022 .block-link-outline-grey{
    background-color: #D1F1E0;
    color: #1A1A1A;
}
#ab-psab-ema-2022 .block-link-outline-grey:hover{
    background-color: #333f48;
    color: #1A1A1A;
}
ul#event-submenu{
    display: none;
    position: absolute;
    z-index: 999;
    list-style: none;
    padding: 0 10px;
    margin: auto;
}
ul#event-submenu li a{
    display: block;
    padding: 17px 27px;
    color: #333;
    text-decoration: none;
}

.submenu-anchor{
    padding-right: 10px;
}
.submenu-anchor:hover ul#event-submenu{
    display: block;
}
.submenu-anchor:hover ul#event-submenu li{
    display: block;
    border-top: 1px solid #E3E5E7;
    border-left: 1px solid #E3E5E7;
    border-right: 1px solid #E3E5E7;
    text-align: center;
    font-size: 14px;
    background-color: #fff;
    margin: 0;
    font-family: 'interregular';
}
.submenu-anchor:hover ul#event-submenu li:last-child{
    border-bottom: 1px solid #E3E5E7;
}
.submenu-anchor:hover ul#event-submenu li#ab-csab-chic-2022-nav:hover{
    background-color: #CEEDFF;
}
.submenu-anchor:hover ul#event-submenu li#ab-psab-ema-2022-nav:hover{
    background-color: #D1F1E0;
}
.drop-down-arrow{
    cursor: pointer;
    position: absolute;
}

/* Added as part of conversion to Laravel   */
#event-hero-banner {
    position: relative;
}
.event-header-text {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    width: 45%;
}
.event-header-text .desktop span {
    display: inline-block;
    padding-left: 5px;
    padding-right: 5px;
}
/*
#event-hero-banner-img-wrapper, #event-hero-banner-img-wrapper img {
    width: 100%;
    height: 400px;
}
*/

#event-hero-banner-img-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    height: 400px;
/*    height: 700px;*/
}

#event-hero-banner-img-wrapper img {
    min-height: 100%;
    min-width: 100%;
    object-fit: cover;
}

/*
#hero-banner-grid-overlay {
    position: absolute;
    top: 0;
    width: 100%;
    min-height: auto !important;
    min-width: auto !important;
    object-fit: initial !important;
    right: 0;
    height: 700px;
}

#event-container {
    margin-top: -20px;
}
*/

/* End added as part of conversion to Laravel */


/* fallback */
@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v60/kJF1BvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oDMzByHX9rA6RzaxHMPdY43zj-jCxv3fzvRNU22ZXGJpEpjC_1n-q_4MrImHCIJIZrDCvHOejbd5zrDAt.woff2) format('woff2');
}

.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

@media screen and (max-width: 1200px) {
    .event-row-first {
        width: 35.6% !important;
    }
    .event-row-fourths .event-row-first {
        width: 55% !important;
    }
}

@media screen and (max-width: 1000px){
    .event-row-fourths .event-row-first {
        width: 54.5% !important;
    }
}

@media screen and (max-width: 900px) {
    .event-row-fourths .event-row-first {
        width: 37.8% !important;
    }
}

@media screen and (max-width: 820px){
    .temp-csab:nth-child(1), .temp-psab:nth-child(1) {
        padding: 10%;
    }

    .error-button #login-container-button-arrow {
        top: 30% !important;
    }
    #dual-events-title {
        margin-top: 10px;
    }
    .sidebar-nav {
        position: initial;
    }
    .advisory-board{
        margin-bottom: 20px;
    }
    #advisory-board-wrapper h2, #advisory-board-wrapper h3, .advisory-board .advisory-board-details p.title,
    .advisory-board .advisory-board-details p.sub-title, .advisory-board .advisory-board-register {
        text-align: center;
    }
    .advisory-board	.advisory-board-img img{
        /*Kinda a hack to fix weird gap on mobile*/
        margin-bottom: -5px;
    }
    .mobile-nav-items a.advisory-board-mobile-nav{
        font-size: 20px;
        line-height: 24px;
        font-family: beatrice-medium;
    }
    a#ab-csab-chic-2022-mobile-nav:hover{
        color: #333f48;
    }
    a#ab-psab-ema-2022-mobile-nav:hover{
        color: #333f48;
    }
    .advisory-board	.advisory-board-details p.sub-title{
        display: flex;
        flex-direction: column;
    }
    .advisory-board	.advisory-board-details p.sub-title span + span{
        border-left: none;
    }
}
/* END DualEvents change 7/26/22*/

@media screen and (max-width: 1000px) {
    .section-details img {
        height: 300px;
        object-fit: fill;
        width: 100%;
        object-fit: cover;
    }
    .update-link .header-reg {
        width: 225px !important;
        font-size: 14px;
    }
    .update-link #login-container-button-arrow-2 {
        right: 35px !important;
    }

    .sidebar-nav .update-link #login-container-button-arrow-2 {
        right: 15px !important;
    }
    #login-button-container.update-link:hover #login-container-button-arrow-2 {
        right: 25px !important;
        transition: 0.35s ease;
    }

    .sidebar-nav #login-button-container.update-link:hover #login-container-button-arrow-2 {
        right: 5px !important;
        transition: 0.35s ease;
    }
    .sidebar-nav {
        width: 100%;
        margin-right: 0%;
        margin-bottom: 40px;
    }

    .main-content {
        width: 100%;
    }

    #event-container {
        display: block;
    }

    .sidebar-nav {
        position: initial;
    }

}

@media screen and (max-width: 900px) {

        .time {
        width: 32.1% !important;
    }

    .special-cloud-row-inner .time {
        border-right: initial !important;
    }

    .remove-border-left-mobile {
        border-left: 2px solid #0054D7 !important;
    }

    .event-row-first {
        width: 25.2% !important;
    }

    .reskin .time-csab, .reskin .time {
        border-left: 0;
        border-right: 0;
    }

    #event-container {	flex-direction: column;
        width: 85%;}

    .event-header-text h2 {
        font-size: 22px;}

    .sidebar-nav {width: 100%;
        margin-right: 0%;
        margin-bottom: 40px;}

    .main-content {width: 100%;}

    .section-details {flex-direction: column;}

    .event-climate {flex-direction: column;}

    .event-climate p.climate-detail {width: 100%;
        margin-bottom: 30px;}

    .temp {padding-bottom: 3%;}

    .weather {width: 100%;}

/*
    .section-details img {
        width: 100%;
        margin-right: 0px;
        margin-bottom: 20px;
    }
*/

    /*    .event-row {flex-direction: column;}*/

    .time {
        width: 100%;
        border-left: 2px solid #333f48;
        border-right: 0px solid #333f48;
        padding-bottom: 5px;
    }

    .vc-event {
        width: 100%;
        border-left: 2px solid #333f48;
        padding: 10px !important;
    }

    .vc-event {
        width: 100%;
        border-left: 2px solid var(--2024_generic_dark_gray_faded);
    }

    .event-row-thirds .event-row-second, .event-row-thirds-header .event-row-third, .event-row-thirds div {
        border-left: initial;
    }

    .event-row-second {
        border-right: initial;
    }

    .event-date {
        width: 100%;
        border-left: 2px solid #333f48;
        border-right: 0px solid #333f48;
    }

    .time-csab {
        width: 100%;
        border-left: 2px solid #333f48;
        border-right: 0px solid #333f48;
        padding-bottom: 5px;
    }

    .event-blue {
        width: 100%;
        border-left: 2px solid #333f48;
        padding-top: 0px;
    }

    .event-date-csab {
        width: 100%;
        border-left: 2px solid var(--2024_csab_primary);
        border-right: 0px solid var(--2024_csab_primary);
    }

    .dual-event {flex-direction: column;
        width: 100%;}

    .sub-event:nth-child(1) {width: 100%;
        border-left: 2px solid #333f48;
        border-right: 0px solid #333f48;}
    .sub-event:nth-child(2) {width: 100%;
        border-left: 2px solid #333f48;
        border-right: 0px solid #333f48;}

    .sub-event p {padding-top: 0px;}

    .sub-event-blue:nth-child(1) {width: 100%;
        border-left: 2px solid #0054d7;
        border-right: 0px solid #0054d7;}
    .sub-event-blue:nth-child(2) {width: 100%;
        border-left: 2px solid #0054d7;
        border-right: 0px solid #0054d7;}

    .sub-event-blue p {padding-top: 0px;}

    .time .desktop {display: none;}

    .time.mobile {display: block;
        padding-bottom: 5px;
        border-left: 0px;}

    .contact-info {flex-direction: column;}

    .event-header-text h1 {
        font-size: 30px;
        text-align: center;}

    .event-header-text h2.mobile {
        font-size: 20px;
        text-align: center;
        line-height: 1.2em;
        display: block !important;}

    .psab-bar-info.mobile {
        width: 100%;
        padding: 2%;}

    .psab-bar-info p:nth-child(1) {
        padding-bottom: 0;
        margin-bottom: 0;
    }

    .csab-bar-info.mobile, .psab-bar-info.mobile {
        width: 100%;
        padding: 3% 6%;
    }

    .csab-bar-info p:nth-child(1) {padding-bottom: 0px;}

    .event-contact-card {width: 100%;
        margin-bottom: 20px;}

    .breadcrumbs {display: block !important;
        margin-bottom: 30px;
        line-height: 1.4em;
        width: 80%;}



}

@media screen and (max-width: 840px) {
    .event-header-text {
        padding: 35px 50px;
        margin-top: 10px;
        width: 100% !important;
    }
    .event-header-text h2 {
        margin-bottom: 35px;
    }
    .event-header-text h1 {
        line-height: 35px;
    }
    .event-row-fourths .time {
        width: 37.7% !important;
    }
}

@media screen and (max-width: 800px) {
    .event-row-fourths .time {
        width: 37.9% !important;
    }
}

@media screen and (max-width: 700px) {
    .time {
        width: 55.1% !important;
    }
    .event-row-thirds .time.event-row-first {
        width: 43.2% !important;
    }
    .event-row-fourths .time.event-row-first {
        width: 67% !important;
    }
    .calendar p, .vc-event, .agenda-day th, .agenda-day td {
        font-size: 10px;
    }
    .time {
        font-size: 12px;
    }
}

@media screen and (max-width: 600px) {
    .headshots {
        display: block;
    }
    .time {
        width: 54.4% !important;
    }
    .event-row-thirds .time.event-row-first {
        width: 42.9% !important;
    }
    .event-row-fourths .time.event-row-first {
        width: 67% !important;
    }
}

@media screen and (max-width: 500px) {
    .event-row-thirds .time.event-row-first {
        width: 55.3% !important;
    }
    .event-row-fourths .time.event-row-first {
        width: 89% !important;
    }
    .section-details img {
        height: 200px;
    }

    .time {
        width: 69.5% !important;
    }

    .event-header-text {
        padding: 35px 10px !important;
        width: 100% !important;
    }

    .event-header-text h2.mobile {
        font-size: 20px;
        text-align: center;
        line-height: 1.2em;
        display: block !important;}

    .event-header-text h1 {
        font-size: 25px;
        line-height: 28px;
    }

    #event-banner {min-height: 400px;}

    #logout-button {
        text-align: center;
        margin-right: 0;
    }
    .mobile-nav-items {
        padding-right: 0px;
        text-align: center;
    }
    .event-header-text h1 span {
        display: initial;
    }
}

@media screen and (max-width: 450px) {
    .calendar p, .vc-event {
        font-size: 8px;
    }
    .event-row-fourths .time.event-row-first {
        width: 94% !important;
    }
    .time {
        width: 46.5% !important;
        font-size: 9px;
    }
    .event-row-thirds .time.event-row-first {
        width: 37.5% !important;
    }
    .event-row-fourths .time.event-row-first {
        width: 59.5% !important;
    }
}



@media screen and (min-height: 900px) {
    .content-container-main {
        min-height: 55vh;
    }
}
