/* Colour palette
Primary - Blue
    - Subject colour does not pass AA (#4573f6), so use #416ee8;
    - Darker blue (AAA) for link text #1641B6; 

Secondary - pink
    - Sam's initial colour (#ff4884) doesnt meet AA, so darkened to #d43b6e; AA for small text
*/


/*----------------- Global styles -----------------*/
section > h2 {
    background-color: #416ee8; /* primary color */
}

section > h3,
h3,
h4 {
    color: #721836;
}

/* buttons */
.cta a.primary, .cta a.primary:visited {
    border: 1px solid #416ee8; /* AA */
    background-color: #416ee8;  /* AAA */
    color: #fff;
    border-radius: 4px;
}
.cta a.secondary, 
.cta a.secondary:visited {
    color: #416ee8; /* AAA */
    border-radius: 4px;
}

/*-------------------- Nav --------------------*/

#navigation,
#headerContent-container > div.menu-search-icons,
.landing #breadcrumb-share-container {
    display: none;
}
@media only screen and (min-width: 700px) {
    .showAtDesktop {
        display: none;
    }
}

.sticky-nav-wrapper a {color: #1641B6;} /* blue */
.sticky-nav.wide a:visited {color: #1641B6;} /* blue */
.sticky-nav.wide a:hover, 
.sticky-nav.wide a:focus {color: #d43b6e;}
.sticky-nav.wide a:active {color: #416ee8;} /*primary */

.sticky-nav.wide a.cta-primary {color: #fff; background: #d43b6e;}
.sticky-nav.wide a.cta-primary:hover,
.sticky-nav.wide a.cta-primary:focus {color: #fff; background: #B5335E;}
.sticky-nav.wide a.cta-primary:active {color: #fff; background: #d43b6e;}

/*-------------------- Section - Banner --------------------*/
#d\.en\.990515.banner-bg {
    background: #416ee8; /* primary */
}

#d\.en\.990515 > div > div > h1 {
    font-family: 'Acumin Pro Wide', Helvetica, 'Open Sans';
    font-weight: 900;
    font-style: normal;
    text-transform: uppercase;
    font-size: 3.7em;
}
@media (min-width: 450px) {
#d\.en\.990515 > div > div > h1 {
    font-size: 4.7em;
}}
@media (min-width: 800px) {
#d\.en\.990515 > div > div > h1 {
    font-size: 5.7em;
}}
@media (min-width: 1100px) {
#d\.en\.990515 > div > div > h1 {
    font-size: 6.7em;
}}

/*-------------------- Section - intro --------------------*/
#d\.en\.990534 > h2 {
display: none;
}
#d\.en\.990532 h2 {
    color: #721836;
}


#d\.en\.990534 .card.copy-video h2 {
    font-weight: 400;
    color: #6a2383;
    font-size: 2.15em;
}

@media (min-width: 800px) {
    .grid-cell:only-child .card {
        align-items: center;
    }
}
/* swap video position */
@media (min-width: 800px) {
    #d\.en\.990534 .grid-cell:only-child:not(.youtube-short) .card > * {
        order: 2;
    }
}
/* video's width */
@media (min-width: 1000px) {
    #d\.en\.990534 .intro.video-bottom .video, .grid-cell:only-child .card.copy-video > .video {
        flex: none;
        width: calc((2*(100% - 40px) / 4) + 30px);
        max-width: calc((2*(100% - 40px)* 2 / 4) + 30px);
    }
}

/*-------------------- Section - Get the facts --------------------*/

@media (hover: hover) and (pointer: fine) {
    .accordion-item-button:not([disabled]):hover .icon {
        background-color: #d43b6e;
    }
}
span.title {
color: #003366;
} 

/*-------------------- Section - Explore ...  --------------------*/

#d\.en\.990536 > h2 {
display: none;
}

#d\.en\.990536 .card.copy-only {
box-shadow: none;
}

/* remove space above paragraph */
#d\.en\.990552 > div > div > div > h4 {
    display: none;
}

/* cards */
@media (min-width: 600px) {
#d\.en\.990536 .flex-grid {
justify-content: space-evenly;
}
}
#d\.en\.990536 .grid-cell.width-quarter {
flex: 0;
}
#d\.en\.990536 .card.copy-image h4 {
text-align: center;
font-weight: 500;
}
#d\.en\.990536 p.cta {
align-items:center;
}

/*-------------------- Section - apply now --------------------*/

#d\.en\.990536 .card.copy-image h3 {
font-weight: 400;
}

/*-------------------- Section - Sign-up  --------------------*/

#d\.en\.990517 .card.copy-image h3 {
font-weight: 400;
}