@import "fellows2026constant.css";
@import "partials/layout.css";
@import "partials/default.css";
@import "partials/navbar.css";
@import "partials/social-footer.css";
@import "partials/home-faculty.css";
@import "partials/table.css";
@import "partials/program-at-a-glance.css";
@import "partials/new-menu.css";
@import url('https://use.typekit.net/oag6jeu.css');


.font-omnium-wide,
.font-omnium-wide *{
    font-family: 'omnium-wide', sans-serif !important;
}

h1.large{
    font-size: 48px;
}

a.inherit{
    color: inherit !important;
    font-weight: inherit !important;
}


/* Header Styles */
.logoWrapper{
    width: auto;
    max-width: 730px;
    flex-shrink: 1;
    margin: 12px 0;
}

.headerBanner{
    padding-right: 450px;
}

.headerBanner > div{
    justify-content: flex-start;
    max-width: none;
    gap: 0;
    width: 100%;
}

.headerBanner .headerContent{
    flex-grow: 1;
    padding-left: 80px;
    white-space: nowrap;
}

.headerBanner .headerContentTop__head{
    line-height: 50px;
}

.headerBanner .headerButtonLinks{
    font-size:1.25rem;
    line-height: normal;
    text-transform: uppercase;
    text-decoration: underline;
}

.headerBanner .headerButtonLinks svg{
    width: 1em;
    height: 1em;
    display: inline-block;
    line-height: 1em;
    flex-shrink: 0;
    color: currentcolor;
    vertical-align: middle;
    fill: rgb(255, 255, 255);
    font-size: 34px;
    margin-left: 20px;
}

.circle-container,
.oval-container {
    display: grid;
    grid-template-columns: 15px 1fr 1fr 1fr 1fr 15px;
    justify-items: center;
    background: url(https://assets.crfconnect.com/meetings/fellows2026/homepage/dotted-bg.png) no-repeat center; 
    background-size: contain; 
}

.oval-container{
    grid-template-columns: 0 1fr 50px 1.5fr;
}

/* Circle Container Styles */
.circle-container.leaders{
    grid-template-columns: 15px 1fr 1fr 1fr 15px;   
    background-position: center 111px;
}

.circle-col{
    z-index: 1;
    border-radius: 100%;
    width: 260px;
    height: 260px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 12px;
}

.circle-col--purple{
    background-color: #681F81;
}

.circle-col--navy{
    background-color: #1D2E5A;
}

.circle-col--blue{
    background-color: #0066B8;
}

.circle-col--coral{
    background-color: #FF557C;
}

.circle-col:first-of-type{
    grid-column: 2 / 3;
}

.home .circle-col{
    flex-direction: column;
}

.circle-container .circle-col p{
    max-width: 170px;
    color: #fff;
}

.circle-container .circle-col p strong{
    text-transform: uppercase;
}

/* Oval Column Styles */
.oval-col{
    border: 4px solid #15A9B8;
    border-radius: 97px;
    background-color: #fff;
    text-align: center;
    padding: 25px;
}

.oval-col:first-of-type{
    grid-column: 2 / 3;
    justify-self: end;
    width: 65%;
}

.oval-col:last-of-type{
    grid-column: 4 / 5;
    justify-self: start;
    width: 80%;
}

.circle-container.leaders .circle-col{
    flex-flow: column nowrap;
    height: auto;
    justify-content: space-between;
    gap: 10px;
}

.circle-container.leaders .circle-col img.leader{
    width: 100%;
    max-width: 200px;
    min-height: 200px;
}

.circle-container.leaders .circle-col p{
    max-width: none;
    margin: 0;
}

.circle-container.leaders .circle-col .name{
    font-weight: 600;
    color: #272838;
}

.circle-container.leaders .circle-col .info{
    font-size: 14px;
    line-height: 16px;
    color: #333333;
}

.pink-blue-grad{
    background: #FF567C;
    background: linear-gradient(180deg,rgba(255, 86, 124, 1) 0%, rgba(0, 170, 255, 1) 100%);
}

/* About CRF */
.bg-dark {
    background-image: url("https://assets.crfconnect.com/meetings/fellows2026/page-content/FELLOWS2026_callout_bg.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 50px 0
}

.bg-dark a{
    color: #fff !important;
    text-decoration: underline !important;
    font-weight: 400;
}

.bg-grad-blue{
    background: #0066B8;
    background: linear-gradient(180deg,rgba(0, 102, 184, 1) 0%, rgba(43, 234, 252, 1) 100%);
}

.upcoming-title {
    font-family: omnium-wide, sans-serif;
}

.Upcoming .event-box{
    border-radius: 40px;
    border: none;
    background-color: #fff;
}

.btn,
button{
    border-radius: 40px;
}

.Upcoming .event-box .cal-icon{
    width: 54px;
    height: 54px;
    border-radius: 100%;
    background-color: var(--button-bgcolor) !important;
}

.Upcoming .event-box .cal-icon svg{
    fill: #fff;
}

/* About Fellows */
.bg-grad-darkblue{
    background: #0065B6;
    background: linear-gradient(180deg,rgba(0, 101, 182, 1) 0%, rgba(12, 34, 85, 1) 100%);
    position: relative;
}
.bg-grad-darkblue h1, 
.bg-grad-darkblue h3, 
.bg-grad-darkblue ul,
.bg-grad-darkblue p.white{
    position: relative;
    z-index: 1;
}

.bg-grad-darkblue .curved-path-bg{
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    z-index: 0;
}

.bg-grad-darkblue .pageWrapper__inner{
    position: relative;
}

.fellows-application > div > div{
    grid-template-columns: 10px 1fr 50px 1fr 10px;
    background-position: center 128px;
    display: grid;
    justify-items: center;
    background: url(https://assets.crfconnect.com/meetings/fellows2026/homepage/dotted-bg.png) no-repeat center; 
    background-size: contain; 
}

.page--application .fellows-application > div > div{
   background-position: center 94px;
}

.fellows-application .box-0{
    width: 90%;
    height: fit-content;
    padding: 40px 50px;
    grid-column: 2 / 3;
    justify-self: end;
    border: 4px solid #15A9B8;
    border-radius: 97px;
    background-color: #fff;
}

.fellows-application .box-1{
    grid-column: 4 / 5;
    justify-self: start;
    width: 90%;
    height: fit-content;
    padding: 40px 50px;
    border: 4px solid #15A9B8;
    border-radius: 97px;
    background-color: #fff;
}

.fellows-application .box-0 div,
.fellows-application .box-1 div{
    padding: 0;
}

.oval-container.who-should-attend{
    grid-template-columns: 10px 1fr 50px 1fr 10px;
    background-position: center 128px;
}

.oval-container.who-should-attend .oval-col{
    width: 90%;
    height: fit-content;
    padding: 40px 50px;
}

.oval-container.who-should-attend .oval-col li{
    margin-bottom: 5px;
}

.oval-container.who-should-attend .oval-col li:last-child{
    margin-bottom: 0;
}

/* Application */
.oval-container.application{
    background-position: center 97px;
}
.bg-blue-pink {
    background-image: url("https://assets.crfconnect.com/meetings/fellows2026/page-content/fellows2026_appplication_callout.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 50px 0
}

.circle-container.application{
    grid-template-columns: 15px 1fr 1fr 1fr 15px;
}

.circle-container.application p{
    font-weight: 500;
    font-size: 20px;
    line-height: 30px;
}

/* Contact Us */
.contact-border{
    border: 4px solid #F2F3F6;
    border-radius: 50px;
    padding: 40px 50px;
}

.contact .table--ScrollWrapper{
    border-radius: 50px;
    border: 2px solid var(--table-border-color);
}

@media screen and (min-width: 1921px) and (max-width: 2250px){
    .page--contact-us .fellows2026Hero{
        background-position: center -30px;
    }
}

@media screen and (min-width: 2250px){
    .page--contact-us .fellows2026Hero{
        background-position: center -80px;
    }
}

.contact-table {
    table.table {
        td:first-child, th:first-child {
            padding-left: 50px;
        }
    }
}

.twoColumnBorder {
    div.pageWrapper__inner {
        div.chakra-stack.twoColumnMatrixBlock {
            div {
                border: 3px solid var(--table-border-color) !important;
                border-radius: 50px !important;
                padding: 20px !important;
            }

        }
    }
}

@media screen and (max-width: 700px) {
    .contact-table {
        table.table {
            td:first-child, th:first-child {
                padding-left: 20px;
                width: auto !important;
            }
        }
    }

}

@media screen and (max-width: 600px) {
    .contact-table {
        table.table {
            td, th {
                display: block !important;
                padding-left: 30px !important;
                padding-right: 30px !important;
                border-top: 0 !important;
                border-left: 1px solid var(--table-border-color) !important;
                border-right: 1px solid var(--table-border-color) !important;
                border-bottom: 0 !important;

                p {
                    margin-top: 0;
                }

            }

            thead:first-child tr:first-of-type th:last-of-type {
                border-top-right-radius: 0 !important;
            }

            tr {
                th:first-child, td:first-child {
                    padding-top: 30px !important;
                }

                th:last-child, td:last-child {
                    padding-top: 0 !important;
                    padding-bottom: 30px !important;
                }
            }

            tr:last-of-type td:last-of-type {
                padding-bottom: 30px !important;
            }
        }

        table.table--borders-head-only {
            th:last-child {
                padding-bottom: 30px !important;
            }
        }
    }

}

/* Register */

#reg-table > div:nth-child(2) span:not(.extra-col-title span),
#reg-table > div:nth-child(3) span:not(.extra-col-title span),
#reg-table > div:nth-child(4) span:not(.extra-col-title span) {
  font-size: 12px;
}

#reg-table > div:nth-child(5){
    grid-row-end: 23;
}

#reg-table .priceRow > div > div:last-child > div{
    color: #0066B8;
}

.register-table ul li::marker{
    color: #333 !important;
}

.register-tabs ul{
    padding-left: 15px;
    margin-top: 15px;
}

.fellowsTabs a{
    color: #0066B8 !important;
}

.socialFooter p {
text-align: center !important;
}

@media (min-width: 1200px) {
    .headerBanner .headerContentTop__head{
        line-height: clamp(38px, calc(38px + 0.0167 * (100vw - 1201px)), 50px);
    }
    .headerBanner .headerContentTop__head .std {
        font-size: clamp(34px, calc(36px + 0.0334 * (100vw - 1201px)), 60px);
    }

    .headerBanner .headerContentTop__head .fellows {
        font-size: clamp(28px, calc(30px + 0.0334 * (100vw - 1201px)), 54px);
    }
}

@media (min-width: 1500px) and (max-width: 1750px) {
    .headerBanner .headerContent{
        padding-left: 40px;
    }
}

@media (min-width: 1200px) and (max-width: 1500px) {
    .headerBanner .headerContent{
        padding-left: 20px;
    }
}

@media screen and (max-width: 1199px) {
    .headerBanner{
        padding-right: 15px;
        background-position: center top;
    }

    .headerBanner .headerContentTop__head .std{
        font-size: 60px;
    }

    .headerBanner .headerContentTop__head .fellows{
        font-size: 54px;
    }
    
    .headerBanner .headerContent{
        text-align: center;
        padding-left: 0;
    }

    .circle-container,
    .oval-container,
    .oval-container.who-should-attend,
    .fellows-application > div > div
    {
        grid-template-columns: 1fr;
        background-image: url(https://assets.crfconnect.com/meetings/fellows2026/homepage/dotted-bg-mobile.png);
    }

    .circle-container.application{
        grid-template-columns: 1fr;
        grid-template-rows: 10px 1fr 1fr 1fr 10px;
        background-image: url(https://assets.crfconnect.com/meetings/fellows2026/homepage/dotted-bg-mobile.png);
    }

    .circle-container.application .circle-col--purple{
        grid-row: 2/3;
        grid-column: auto;
    }
    .circle-container.application .circle-col--navy{
        grid-row: 3/4;
        grid-column: auto;
    }
    .circle-container.application .circle-col--blue{
        grid-row: 4/5;
        grid-column: auto;
    }

    .oval-container.who-should-attend,
    .fellows-application > div > div,
    .page--application .fellows-application > div > div{
        background-position: center;
    }

    .oval-container.who-should-attend .oval-col{
        padding: 40px;
    }

    .oval-container
    {
        background-image: url(https://assets.crfconnect.com/meetings/fellows2026/homepage/dotted-bg-mobile-short.png);
    }

    .circle-container.leaders{
        background-image: none;
        grid-template-columns: 1fr;
    }

    .circle-col{
        margin: 10px auto;
        grid-column: auto;
    }

    .circle-col:first-of-type{
        grid-column: auto;
        margin-top: 25px;
    }

    .circle-col:last-of-type{
        margin-bottom: 25px;
    }

    .oval-col:first-of-type,
    .oval-col:last-of-type,
    .fellows-application .box-0,
    .fellows-application .box-1{
        grid-column: auto;
        justify-self: center;
        width: 100%;
        max-width: 640px;
    }

    .oval-col:first-of-type,
    .fellows-application .box-0{
        margin: 25px auto;
    }

    .oval-col:last-of-type,
    .fellows-application .box-1{
        margin: 0 auto 25px;
    }

    .contact-us-cicles{
        flex-flow: column nowrap;
    }

    .contact-us-cicles .contact-border{
        width: 100%;
    }
    .headerBanner > div{
        gap: 420px;
    }
}

@media (min-width: 600px) and (max-width: 1199px) {
    .headerBanner {
        background-position: center 42%;
    }
}

@media screen and (max-width: 768px){
    .headerBanner > div{
        gap: 260px;
    }

    .logo-lockup .row{
        gap: 40px;
    }

    .page--about-fellows .fellows2026Hero{
        background-image: url("https://assets.crfconnect.com/meetings/fellows2026/page-content/about-fellows-hero-mobile.jpg");
        background-position: top center !important;
    }

    .page--contact-us .fellows2026Hero{
        background-image: url("https://assets.crfconnect.com/meetings/fellows2026/page-content/contact-us-hero-mobile.jpg");
    }

    .page--register .fellows2026Hero{
        background-image: url("https://assets.crfconnect.com/meetings/fellows2026/page-content/register-hero-mobile.jpg");
    }
    .page--application .fellows2026Hero{
        background-image: url("https://assets.crfconnect.com/meetings/fellows2026/page-content/application-hero-mobile.jpg");
        background-position: bottom center !important;
    }
}

@media screen and (max-width: 600px){
    .bg-dark {
        background-image: url("https://assets.crfconnect.com/meetings/fellows2026/page-content/FELLOWS2026_callout_bg_mobile.jpg");
        background-position: top center;
    }
    .bg-blue-pink {
        background-image: url("https://assets.crfconnect.com/meetings/fellows2026/page-content/fellows2026_appplication_callout_mobile.jpg");
        background-position: top center;
    }
    .bg-grad-darkblue .pageWrapper__inner{
        position: unset;
    }
    .bg-grad-darkblue .curved-path-bg{
        width: 100%;
        height: auto;
        top: auto;
        bottom: 20px;
        right: 0;
    }
    .headerBanner .headerContentTop__head .std{
        font-size: 40px;
    }

    .headerBanner .headerContentTop__head .fellows{
        font-size: 34px;
    }

    .headerBanner .headerContentTop__head {
        line-height: 36px;
    }
}

@media screen and (max-width: 425px){
    .headerBanner > div{
        gap: 180px;
    }
}