/* Colors
Bold Coral:  #F26553
Darker Bold Coral: #D85849
Red: #D92D20
Blue: #2F80ED;
Text: #171415
Grey Text: #727272
Light grey: #E0E0E0
Lighter grey: #EAECF0
*/

/* terrible, terrible things */

.region-hero .views-exposed-form {
    margin-bottom: 0;
}

.views-exposed-form .form-control {
    width: auto;
    height: auto;
    margin-right: auto;
    padding: 11px 16px;
    font-size: 1.85rem;
    line-height: 1;
    color: #171415;
    border: 1px solid #667085;
    border-radius: 12px;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.views-exposed-form .btn-primary {
    border-radius: 10px;
}

@media (max-width: 767px) {
    .views-exposed-form .form--inline {
        width: auto;
        display: flex;
        margin-left: 0;
    }

    .views-exposed-form .btn-primary {
        border-radius: 10px;
        width: auto;
        display: inline-flex;
    }
}

.views-exposed-form + p {
    font-size: 1.85rem;
}

.views-element-container.form-group {
    margin-bottom: 0;
}

.exposed-form--grey-bg form.views-exposed-form {
    background-color: #EFEFEF;
    padding: 24px;
}

.more-link {
    display: flex;
    justify-content: center;
    margin-top: 3rem;
}

.more-link--arrow .more-link {
    justify-content: flex-end;
    margin-top: 1.5rem;
}

.more-link--card-red .more-link {
    background-color: #D85849;
    color: white;
    border-radius: 10px;
}

.more-link--card-red .more-link a {
    color: white;
}


/* component pages views margin */
body.page-node-type-component-page .page--content .block {
    margin-bottom: 6%;
}

/* Upcoming travel homepage block */
.travel--image-card--grid {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-right: -20px;
}

.travel--image-card {
    flex: 0 0 384px;
    margin-right: 20px;
    margin-bottom: 20px;
}

.travel--image-card--image {
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    min-height: 400px;
    min-width: 306px;
}

.travel--image-card--text {
    background-color: white;
    margin-top: auto;
    max-width: 80%;
    border-radius: 0 8px 0 0;
    padding: 2rem 2.5rem;
}

.travel--image-card--text h3 {
    margin-bottom: 0.6rem;
}

@media all and (min-width: 1100px) {
    .travel--image-card--text h3 {
        font-size: 3.6rem;
    }
}

.travel--image-card--date {
    font-size: 1.6rem;
    display: flex;
    align-items: center;
}

.travel--image-card--date svg {
    margin-right: 0.5rem;
}

/* Upcoming programs blocks */
.block-views-blockevents-homepage-block h2.block-title {
    margin-bottom: 0.28em;
}

.program-teasers .views-exposed-form {
    margin-bottom: 24px;
}

.program-teasers--line {
    border-top: 2px solid #171415;
}

.program-teasers--line .program-teaser {
    border-bottom: 2px solid #171415;
}

.program-teasers--border .program-teaser {
    border: 1px solid #D0D5DD;
    margin-bottom: 1.4rem;
}

@media all and (max-width: 800px) {
    .program-teasers .program-teaser {
        display: grid;
        grid-template-columns: max-content auto auto;
        grid-template-areas: "a b b" "c d e";
        grid-gap: 3rem;
        width: 100%;
        padding-top: 24px;
        padding-bottom: 24px;
    }

    .program-teasers--border .program-teaser {
        padding-right: 24px;
        padding-left: 24px;
    }

    .program-teasers .program-teaser--details {
        grid-column-start: 2;
        grid-column-end: 4;
    }

    .program-teasers .program-teaser--pinned {
        grid-area: a;
    }

    .program-teasers .event--pinned {
        display: flex;
        justify-content: center;
    }

    .program-teasers .program-teaser--details {
        grid-area: b;
    }

    .program-teasers .program-teaser--location {
        grid-area: d;
    }

    .program-teasers .program-teaser--register {
        grid-area: e;
    }
}

@media all and (min-width: 801px) {
    .program-teasers.program-teasers--line .program-teaser > * {
        padding: 24px 0 24px 0;
    }

    .program-teasers.program-teasers--line .program-teaser > *:not(:last-child):not(.pinned) {
        padding-right: 24px;
    }

    .program-teasers.program-teasers--line .program-teaser .event--pinned {
        padding: 0 42px 0 18px;
    }

    .program-teasers.program-teasers--border .program-teaser {
        display: grid;
        grid-template-columns: 80px 3fr minmax(180px, 1fr) minmax(140px, 1fr);
    }

    .program-teasers.program-teasers--border .program-teaser > * {
        padding: 24px 24px 24px 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
    }

    .program-teasers.program-teasers--border .program-teaser > .program-teaser--image {
        justify-content: flex-start;
    }

    .program-teasers.program-teasers--border .program-teaser > *:last-child {
        align-items: flex-end;
    }
    
    .program-teasers.program-teasers--border .program-teaser {
        padding-left: 24px;
    }
}

.program-teaser--date,
.program-teaser--date .date--month-year,
.event-teaser--date,
.event-teaser--date-time,
.event-teaser--date .date--month-year  {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.program-teaser--date .date--day,
.event-teaser--date .date--day {
    font-family: 'abril_textextrabold', 'Times', 'Times New Roman', serif;
    margin-top: -0.25em;
}

.program-teaser--date .date--day {
    font-size: 7.2rem;
}

.event-teaser--date .date--day {
    font-size: 6rem;
}

.event-teaser--date-time .date--time {
    border-top: 1px solid #a2a1a1;
    width: 100%;
    padding-top: 6px;
    font-weight: bold;
}

@media all and (min-width: 521px) {
    .program-teaser--date,
    .program-teaser--date .date--month-year,
    .event-teaser--date,
    .event-teaser--date .date--month-year {
        text-align: left;
    }

    .program-teaser--date,
    .event-teaser--date {
        flex-direction: row;
        justify-content: flex-start;
    }

    .program-teaser--date .date--month-year,
    .event-teaser--date .date--month-year {
        display: block;
    }

    .program-teaser--date .date--day {
        margin-right: 25px;
    }

    .event-teaser--date .date--day {
        margin-right: 10px;
    }
}

.programs-list .program-teaser h3 {
    margin-bottom: 1rem;
}

.programs-list h3 + p.program-teaser--subtitle {
    margin-top: -0.5rem;
}

.programs-list p.program-teaser--subtitle {
    margin-bottom: 0.2em;
}

.program-teaser--details--dates {
    color: #344054;
}

.program-teaser--details--dates .date--day {
    border-right: 1px solid #344054;
    padding-right: 1.4rem;
    margin-right: 1rem;
}

.program-teaser--location--label {
    display: block;
}

.program-teaser--location--content {
    font-weight: bold;
}

/* Upcoming programs page */
.upcoming-programs--header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: flex-end;
    position: relative;
}

.upcoming-programs--header header {
    display: flex;
    align-items: flex-end;
    margin-bottom: 24px;
}

.upcoming-programs--header .component--dropdown .dropdown--content {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}

/* Upcoming programs calendar page */
.upcoming-events--page .title--grouping {
    margin-top: 40px;
}

.upcoming-events--page .program-teaser {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    column-gap: 40px;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

/* Recent content blocks */
table.homepage--recent-content td.content-type {
    display: flex;
    flex-direction: column;
    align-items: center;
}

@media all and (max-width: 500px) {
    table.homepage--recent-content tr {
        display: grid;
        grid-template-areas: "a a" "b c";
    }

    table.homepage--recent-content td.title-author {
        grid-area: a;
    }

    table.homepage--recent-content td.content-type {
        grid-area: b;
    }

    table.homepage--recent-content td.created-date {
        grid-area: c;
    }

    table.homepage--recent-content td {
        padding: 1rem;
    }
}

@media all and (min-width: 501px) {
    table.homepage--recent-content td {
        padding: 2.5rem;
    }

    .homepage--recent-content--teaser > *:last-child {
        text-align: right;
    }
}

.homepage--recent-content--teaser,
.homepage--recent-content--teaser h3 {
    font-size: 1.85rem;
}

.homepage--recent-content--teaser .class--media {
    margin-top: 5px;
}

/* videos */
@media all and (min-width: 900px) {
    .videos--teasers {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-column-gap: 30px;
    }
}

.video-teaser {
    margin-bottom: 3rem;
}

/* Team members & speakers blocks */

/* Our team block */
.view--team-members--block {
    position: relative;
    z-index: 1;
}

.view--team-members--block:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    height: calc(100% - 118px);
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 22%, rgba(163,64,57,1) 22%, rgba(163,64,57,1) 100%);
}

/* Library page */
body.page-library main .page--layout-content-main > .block {
    margin-bottom: 60px;
}

body.page-library h2.block-title {
    margin-bottom: 0.8em;
}

/* Most viewed speakers block - library page */
.speaker-cards--small > * {
    margin-bottom: 12px;
}

@media all and (min-width: 640px) {
    .speaker-cards--small {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 12px;
    }

    .speaker-cards--small > * {
        margin-bottom: 0;
    }
}

@media all and (min-width: 1100px) {
    .speaker-cards--small {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
}

.speaker-card--small {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.speaker-card--small > a {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
}

.speaker-card--small .speaker-card--small--image {
    flex: 0 0 80px;
    min-height: 80px;
    align-self: stretch;
    margin-right: 1.5rem;
    border-radius: 10px 0 0 10px;
}

/* Speaker resources block */
.speaker-resources--header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-radius: 8px;
    padding: 15px 25px;
    
}

.speaker-resources--header h2 {
    font-family: "proxima-nova", Arial, Helvetica, sans-serif;
    font-weight: bold;
    margin-bottom: 0;
}

.speaker-resources--header .views-exposed-form {
    margin-bottom: 0;
}

.speaker-resources--header + div:has(.view--empty) {
    margin-top: 30px;
}

.speaker-resource {
    display: grid;
    border-bottom: 2px solid #BBBBBB;
    padding: 36px 16px 25px 16px;
}

.speaker-resource h3 {
    margin-bottom: 0.2em;
}

@media all and (max-width: 859px) {
    .speaker-resource {
        grid-template-areas:
            "a a a"
            "b c c"
    }

    .speaker-resource--title {
        grid-area: a;
        margin-bottom: 1rem;
    }

    .speaker-resource--type {
        grid-area: b;
    }

    .speaker-resource--date {
        grid-area: c;
    }
}

@media all and (min-width: 860px) {
    .speaker-resource {
        grid-template-columns: 2fr 1fr 1fr;
    }

    .speaker-resource > * {
        display: flex;
    }

    .speaker-resource--title {
        justify-content: center;
        flex-direction: column;
    }

    .speaker-resource--type {
        align-items: center;
        justify-content: center;
        padding: 0 20px;
    }
    
    .speaker-resource--date {
        align-items: center;
    }
}

/* All speakers page */
.views-header--speakers > * {
    margin-bottom: 20px;
}

@media all and (min-width: 900px) {
    .views-header--speakers {
        display: flex;
    }
}

/* Content teaser table views e.g. Topics taxonomy content listing
.content-teaser--row
.content-teaser--row--teaser */

.content-teaser--row--teaser {
    display: grid;
    padding: 25px 0 25px 0;
    border-bottom: 1px solid #767676;
}

@media all and (max-width: 499px) {
    .content-teaser--row--teaser .image {
        display: none;
    }

    .content-teaser--row--teaser.content-teaser--topics-taxonomy {
        grid-template-columns: 1fr;
        grid-template-areas: "a a" "c d";
    }

    .content-teaser--row--teaser.content-teaser--topics-taxonomy .text {
        grid-area: a;
    }

    .content-teaser--row--teaser.content-teaser--topics-taxonomy > *:nth-last-child(1) {
        grid-area: c;
    }

    .content-teaser--row--teaser.content-teaser--topics-taxonomy > *:last-child {
        grid-area: d;
    }
}


.content-teaser--row--teaser {
    grid-template-columns: 1fr;
    column-gap: 30px;
    row-gap: 15px;
}

@media all and (max-width: 999px) {
    .content-teaser--row--teaser.content-teaser--topics-taxonomy {
        grid-template-areas: "a a" "c d";
        row-gap: 20px;
    }

    .content-teaser--row--teaser.content-teaser--topics-taxonomy .text {
        grid-area: a;
    }

    .content-teaser--row--teaser.content-teaser--topics-taxonomy > *:nth-last-child(1) {
        grid-area: c;
    }

    .content-teaser--row--teaser.content-teaser--topics-taxonomy > *:last-child {
        grid-area: d;
        margin-right: 30px;
    }

    .content-teaser--row--teaser.content-teaser--audio .download-link {
        text-align: center;
    }
}

@media all and (min-width: 1000px) {
    .content-teaser--row--teaser {
        grid-template-columns: 1fr max-content max-content;
    }

    .content-teaser--row--teaser > *:not(.text) {
        display: flex;
        align-items: center;
    }

    .content-teaser--row--teaser .content-type {
        padding: 0 40px 0 40px;
    }

    .content-teaser--row--teaser > *:last-child {
        text-align: right;
    }
}

.content-teaser--row--teaser h2 {
    font-size: 2.8rem;
}

/* Related articles block */
.related-articles-block {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.related-articles-block:before {
    content: '';
    display: block;
    width: 100%;
    max-width: 540px;
    height: 1px;
    background-color: #D0D5DD;
    margin-bottom: 30px;
}

@media all and (max-width: 839px) {
    .related-articles-block .grid {
        grid-template-columns: 380px;
    }
}

/* Classes on programs */
/* Upcoming classes block */
.program-classes--upcoming {
    display: grid;
    grid-template-columns: repeat( auto-fill, minmax(350px, 1fr) );
    column-gap: 30px;
    row-gap: 12px;
    border: 1px solid #D0D5DD;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 50px;
}

.program-class--upcoming {
    display: flex;
    align-items: center;
    gap: 20px;
    border-bottom: 1px solid #D0D5DD;
    padding-bottom: 10px;
}

.program-class--upcoming h3 {
    font-size: 2.2rem;
    margin-bottom: 0.1em;
}

.program-class--upcoming p.upcoming-class--speaker {
    font-size: 1.85rem;
    margin-bottom: 0;
}

/* Past classes block */
.program-class--past {
    border-bottom: 2px solid #171415;
    padding-bottom: 24px;
    padding-top: 24px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.program-class--past .past-class--details {
    flex: 2;
}

.program-class--past .past-class--details h3 {
    font-size: 2rem;
}

.program-class--past .past-class--details p {
    font-size: 1.6rem;
    margin-bottom: 0;
}

.program-class--past .past-class--video {
    flex: 1 0 325px;
}

.program-class--past .video-wrapper {
    border-radius: 20px;
}

@media all and (min-width: 1200px) {
    .program-class--past .media--video-link {
        max-width: 450px;
    }
}

.program-class--past .jp-jplayer--container {
    width: 38rem;
}

.program-class--past .past-class--audio {
    flex: 2;
    display: flex;
    justify-content: center;
}

.program-class--past .past-class--video + .past-class--audio {
    flex: 1;
}

/* Featured speakers */
.featured-speakers--menu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
}

.featured-speakers--menu a:link,
.featured-speakers--menu a:visited {
    color: #a33d36;
}

/* Speakers menu */
div.speakers-menu--panel div.views-field-name,
div.speakers-menu--panel div.views-field-nid {
    display: inline-block;
}
div.speakers-menu--panel div.views-field-nid {
    padding-left: 4px;
}
