.hidden {
    display: none !important;
    opacity: 0;
}

.invisible {
    opacity: 0;
}

main article #introduction .options {
    margin: 2.4rem 0 0 0;
}

main article section#prospects {
    margin: 0 0 4rem 0;
}

main article section#prospects .answered-question {
    margin: 2.5rem 0 0 0;
}

main article section#prospects .webinar {
    border-radius: .4rem;
    box-shadow: 0 2px 20px 0 rgba(66, 66, 66, .2);
    display: grid;
    grid-template-rows: 24px 180px auto;
    margin: 2.5rem 0 0 0;
}

main article section#prospects .webinar img {
    grid-area: 1/1/3/2;
    width: 100%;
    height: 204px;
    -o-object-fit: cover;
    object-fit: cover;
    z-index: 0;
    border-radius: .4rem .4rem 0 0;
}

main article section#prospects .webinar .details {
    grid-area: 3/1/4/2;
    padding: 1em;
}

main article section#prospects .webinar .details h4 {
    margin-top: 0;
}

@media screen and (min-width:53.75em) {
    main header {
        display: none !important;
    }

    main .page-alert {
        display: none !important;
    }

    main article section {
        display: grid;
        grid-template-columns: 2fr 1fr;
        grid-column-gap: 8rem;
    }

    main article section .prospects-form,
    main article section .topic,
    main article section .further-questions,
    main article section .applicants-form,
    main article section .current-students-form,
    main article section .prospect-options,
    main article section .intakes-and-topics,
    main article section .answered-question {
        grid-column: 1;
    }

    main article section .prospects-webinar {
        grid-column: 2;
        grid-row: 2/span 2;
    }

    main article section .select-request-type .title {
        margin-bottom: 4rem;
    }
}

.filter-buttons {
    list-style: none;
    margin: 0;
    padding: 0;
    grid-gap: .6em;
}

.filter-buttons li {
    margin: .6rem 0;
}

.filter-buttons li a {
    border: 2px solid var(--black);
    border-radius: 4px;
    padding: .8rem 1.6rem;
    transition: background-color 250ms ease-in-out, border-color 250ms ease-in-out;
    cursor: pointer;
    margin: 0;
    font-weight: 600;
    text-decoration: none;
    color: var(--black);
    display: block;
    text-align: center;
    text-decoration: none !important;
}

.filter-buttons li a:hover {
    background-color: var(--red);
    border-color: var(--red);
    color: #fff;
}

.filter-buttons li a.active {
    background-color: var(--red);
    border-color: var(--red);
    color: #fff;
}

.filter-buttons li a.disabled {
    color: var(--light_grey);
    border-color: var(--light_grey);
    cursor: not-allowed;
}

.filter-buttons li a.disabled:hover {
    background-color: #fff !important;
    color: var(--light_grey);
}

.filter-buttons li span {
    font-weight: 400;
}

@media screen and (min-width:53.75em) {
    .filter-buttons {
        display: flex;
        flex-wrap: wrap;
    }

    .filter-buttons li a {
        display: initial;
    }
}

article h2 {
    font-weight: 400;
    margin: 4rem 0 0 0;
}

article h2 span {
    font-weight: 600;
}

.topic-response {
    padding: 2.4rem 0 0 0;
}

.topic-response p {
    max-width: unset;
}

.topic-response p:last-of-type {
    margin-bottom: 0;
}

.field label {
    margin: 2.4rem 0 .8rem 0 !important;
}

.field.checkbox label {
    margin: 0 0 .8rem 0 !important;
}

.answered-question {
    padding: 2.4rem 0 0 0;
}

#form h4 {
    margin-top: 2rem;
}

.topic select {
    max-width: unset;
}

.answered-current-students-question {
    margin: 2.5rem 0 0 0;
    grid-column: 1;
}

@media screen and (min-width:71.25em) {
    section {
        margin: 0 0 4rem 0 !important;
    }
}

.rqfadein {
    animation: rqfade 250ms ease-in-out 1 forwards normal;
}

@keyframes rqfade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.program-event-list .event {
    padding: 2.4rem;
    border-radius: .4rem;
    box-shadow: 0 5px 10px 0 rgba(66, 66, 66, .1);
    background-color: var(--ffffff);
    margin-bottom: 2.4rem;
}

.ask-a-question,
.question-answered {
    margin: 3.2rem 0 0 0;
}

.grid .item {
    padding: 2.4rem;
    border-radius: .4rem;
    box-shadow: 0 5px 10px 0 rgba(66, 66, 66, .1);
    background-color: var(--ffffff);
    margin-bottom: 2.4rem;
}

@media screen and (min-width: 53.75em) {
    .grid {
        display: grid;
        grid-gap: 2.4rem;
        grid-template-columns: repeat(3, 1fr);
    }

}

.email-guide .error,
.email-guide .success {
    margin: 1.2rem 0;
}

.email-guide .error {
    color: var(--rouge);
}
.email-guide .error::before {
    content: "\f071";
    font-family: "Font Awesome 5 Free";
    color: #ae2830;
    font-weight: 600;
    margin-right: .9rem;
}

.email-guide button {
    border-color: var(--purple) !important;
    background-color: var(--purple) !important;
    margin: 2rem 0 1rem 0 !important;
    box-shadow: none !important;
    font-weight: bold;
}
.email-guide button:hover {
    color: white;
}

.load {
    width: 56px;
    height: 56px;
    animation: rotate 2500ms infinite linear;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}