.mw-900 {
    max-width:900px;
}

/* ------------------------HEADER------------------------ */


#digitalHome
{
    margin-bottom:0;
}

#digitalHome .firstLevelBanner {
    background-image: url(/digital/_assets-index/images/_dsc5789.jpg);
    position:relative;
}

#digitalHome .firstLevelBanner .overlay {
    background: #0912239e;
    height: max-content;
    bottom: 0px;
    position: absolute;
    width: 100%;
}

#digitalHome .firstLevelBanner h1 span > span {
    display: inline;
    color: var(--gfColors-gold);
}



#digitalHome #overlay {
    position: absolute;
    width: 100%;
    bottom: 0;
    height: max-content;
    background: #09122399;
}


#digitalHome .firstLevelBanner h1 {
    color: white;
    display: block;
    max-width: 540px;
    margin: 2.75rem auto 3rem;
    text-align: left;   
    padding: 0 1rem;
    line-height: 1.3;
    letter-spacing: 0.2em;
}

@media (max-width: 767.98px) {
    
    #digitalHome h1 span, #digitalHome h1 span > span {
        font-size: clamp(2.2rem, 8.2vw, 4rem)!important;
    }
}


@media (min-width: 576px) {
    #digitalHome .firstLevelBanner h1 {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    #digitalHome .firstLevelBanner h1 {
        max-width: 720px;
    }
}

@media (min-width: 1200px) {
    #digitalHome .firstLevelBanner h1 {
        max-width: 960px;
    }
}

@media (min-width: 992px) {
    #digitalHome .firstLevelBanner h1 {
        max-width: 1140px;
    }
}



#digitalHome .firstLevelBanner::before {
    display:none;
}

#digitalHome .firstLevelBanner h1 span {
    font-family: var(--gfVars-headerFont);
    text-transform: uppercase;
    letter-spacing: .075em;
    margin-left: 0;
    font-size: 4rem;
    line-height: 1;
}




/* ------------------------DIGITAL INTRO------------------------ */

 #digitalIntro span.h4 {
     color: var(--gfColors-gold);
 }

/* ------------------------OUR VISION------------------------ */


#introSection {
    background-color: var(--gfColors-slate15);
    display: grid;
    padding: 0;
    padding-right: 0px;
    padding-left: 0px;
    grid-template: auto auto / 1fr 2fr;
    z-index: 200;
    position: relative;
}

#introSection #goldBar {
    height: 13px;
    background: var(--gfColors-gold);
    grid-area: 2 / 2 / 2 / 3;
}

#introSection #visionImage {
     background-image:url(/digital/_assets-index/images/_dsc1386.jpg);
     background-size: cover;
    background-repeat: no-repeat;
    grid-area: 1 / 1 / 3 / 2;
    background-position-x: center;
}

#introSection #visionText {
    padding: 7rem 4rem;
    max-width: 900px;
    grid-area: 2 / 2 / 3 / 3;
}

#introSection #visionText p {
    font-size: 1.2em;
    margin-bottom: 0;
}

@media(max-width:991.98px){
    
     #introSection {
        grid-template: auto auto / 3fr 4fr;
    }  
    #introSection #visionImage  {
        background-position-x: -12em;
    }
    
    
}
@media (min-width:567px) and (max-width:767.98px){
    
    #introSection #visionImage {
        background-position-y: clamp(-20em, -60px, 10px);
    }
    
}
@media(max-width:767.98px){
    
    #introSection {
        grid-template: 13px 2fr 3fr / 1fr;
    }
    
    #introSection #goldBar {
        height: unset;
        grid-area: 1 / 1 / 2 / 1;
    }
    
    #introSection #visionImage {
        grid-area: 2 / 1 / 3 / 2;
        background-position-y: clamp(-20em, -60px, 10px);
        background-position-x: center;
    }
    
    #introSection #visionText {
        padding: 4rem 2rem;
        max-width: 100%;
        grid-area: 3 / 1 / 4 / 2;
    }    
}

@media (max-width:566.98px){
    #introSection #visionImage {
        background-position-y: center;
        background-position-x: center;
    }
}


/* ------------------------OUR PROGRAMS / OUR TEAM------------------------ */

#about-programs_component, #our-team_component {
    position: relative;
}
@media (min-width: 992px) {
    #about-programs_component {
    margin-top: 8rem;
}
}

#ourPrograms, #ourTeam {
    font-size: 4em;
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 1.7rem;
    align-items: center;
}

@media (max-width:767.98px){
    
    #ourPrograms, #ourTeam {
        font-size: 3em;
    }
    
}

#ourPrograms::after, #ourTeam::after {
    height: 2px;
    width: 100%;
    content: "";
    position: absolute;
    bottom: 0.5em;
    grid-column-start: 2;
    background: var(--gfColors-gold);
}

#ourPrograms span, #ourTeam span {
    font-size: 0.45em;
    font-weight: bold;
    letter-spacing: 0.1em;
    position: absolute;
    color: var(--gfColors-slate100);
}

#ourPrograms span {
    top: -0.8em;
    left: 2.5em;
}

#ourTeam span {
    top: -0.6em;
    left: 2.7em;
}

/* ------------------------TAKE A LOOK (VIDEO SECTION)------------------------ */

#takeALook {
    text-align: center;
}
#takeALook h2 {
    font-size: 4em;
    margin-bottom: 0;
    margin-top: 0;
}

#takeALook h3 {
    font-size: 1.2em;
    line-height: 1.5;
    margin: 0 0 3.5rem;
    
}


/* ------------------------MEET YOUR PROFESSORS------------------------ */

#meet-professors h3, #meet-professors h4 {
    text-align:center;
}

#meet-professors h3 {
    margin-bottom: .6rem;
}

#meet-professors h4 {
    margin-top: 1.2rem;
    margin-bottom: 2.5rem;
    font-family: var(--gfColors-bodyText);
    font-size: 1.2em;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width:767.98px) {
    
    #meet-professors h4 {
        max-width:80%;
    }
}

#meet-professors #videos-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1rem;
    max-width: 950px;
    margin: auto;
}

#meet-professors #videos-container .videoItem {
    background: var(--gfColors-slate15);
    padding: 1.5rem;
}
@media (max-width: 767.89px) {
   #meet-professors #videos-container .videoItem {
    padding: 1.25rem 1rem 1rem 1rem;
} 
}

#meet-professors #videos-container .videoItem h5 {
    font-family: var(--gfVars-bodyFont);
    color: var(--gfColors-slateText);
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-size: 0.9em;
    margin-bottom: 0.3rem;
    text-align: left;
}

#meet-professors #videos-container .videoItem h4 {
    margin-bottom: .6rem;
    font-weight: bold;
    font-size: 1.2rem;
    line-height: 1.5;
    text-align: left;
}

#meet-professors #videos-container h5, #meet-professors #videos-container h4 {
    margin: 0;
    font-family: var(--gfVars-bodyFont);
}

@media (max-width:767.98px) {
    #meet-professors #videos-container {
        grid-template-rows: auto auto;
        grid-template-columns: 1fr;
        grid-row-gap: 1rem;
    }
}

@media (min-width:992px) {
    #meet-professors #videos-container .videoItem h4 {
        font-size: 1.5rem;
    }
    #meet-professors #videos-container .videoItem h5 {
        font-size: 0.9em;
        margin-bottom: 0.3rem;
        
    }
    

}