:root{
    --nm-purple: #7e1946;
    --nm-blue: #0c6291;
    --nm-darkblue: #012131;
}

.nm22-header{
    min-height:300px;
    background: url(/CMSTemplates/EROWebsite/Templates/images/nm/NM22-BG-v3.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    overflow:hidden;
    position: relative;
    padding: 30px;
}

.ero-website .nm22 a{
    text-decoration: underline ;
    color:var(--nm-blue);
}

.ero-website .nm22 a:hover, .ero-website .nm22 a:focus{
    text-decoration: underline ;
    color:var(--nm-darkblue);
}

.ero-website a:hover, .ero-website a:focus {
    color:var(--nm-blue);
}

.title-overlay-container{
    max-width:500px;
    position: absolute;
    bottom:30px;
   
}

main div .title-overlay{
    color:white;
    font-size:50px;
    line-height: 60px;
    text-align: left;
}

main div .subtitle-overlay{
    font-style: italic;
    color:white;
    font-weight: 300;
    font-size:26px;
    line-height: 32px;
}

.leaf{
    width:500px;
    height: auto;
    position:absolute;
    top:20px;
    right:-40px;
}

.discover-container{
    padding: 100px 30px;
    align-items: center;
    gap:50px;
    display: flex;
}

.discover-container h2{
    color: var(--nm-purple);
    font-size: 30px;
    margin-bottom:18px;
}

.discover-container p {
    font-size:18px;
    line-height: 26px;
}

.stories{
    padding-top: 75px;
    padding-bottom: 75px;
}

.line-title{
    border-bottom: 1px solid var(--nm-purple);
    padding-bottom: 26px;
    color:var(--nm-purple);
    font-size: 30px;
}

h3.sm-line-title, .sm-line-title a, .sm-line-title{
    border-bottom: 1px solid var(--nm-purple);
    padding-bottom: 16px;
    color:var(--nm-purple);
    font-size: 20px;
    font-weight: bold;
}


.m-t-50{
    margin-top:50px;
}

.m-t-25{
    margin-top: 25px;
}

.m-b-25{
    margin-bottom:25px;
}

.logo-grid{
    display: flex;
    gap: 20px;
}

/* carousel */
.circle-headshot{
    width:150px;
    height: 150px;
    margin-right: auto;
    margin-left: auto;
}

.testimonial-caption{
    text-align: center;
    color:black;
}

.testimonial-caption h3{
    text-transform: uppercase;
    color: var(--nm-purple);
    font-weight: bold;
    margin-bottom: 4px;
}

.story:hover > a > div > h3{
    color: #0c6291;
}

.video-caption{
    color:black;
}

.video-caption h3{
    color: var(--nm-purple);
}

.pager-middle{
    position: absolute;
    cursor: pointer;
    bottom: 50%;
    width: 30px;
    height: 30px;
}

.pager-middle.next{
    right:-30px;
}

.pager-middle.prev{
    left:-30px;
}

.carousel-video .thumbnail {
    max-width: 100%;
    height: 160px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 12px;
}

.vid-overlay{
    width: 100%;
    height:100%;
    background:
    linear-gradient(
    rgba(126, 25, 70, 0.25), 
    rgba(126, 25, 70, 0.25)
    );
    border-radius: 12px;
    z-index: 100;
}

.carousel-video:hover .vid-overlay{
    background: 
    linear-gradient(
    rgba(126, 25, 70, 0.1), 
    rgba(126, 25, 70, 0.1)
    );
}

.carousel-video:hover h3{
    color: var(--nm-blue);
}

.fa-m{
    margin-left: 4px;
}

.play_icon{
    width: 84px;
    position:absolute;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
}

.doc_icon{
    width:16px;
    margin-right: 10px;
    margin-bottom: -3px;
}

.doc-list li{
    margin-bottom: 12px;
    color:black;
}

.doc-list li:hover{
    margin-bottom: 12px;
    color:var(--nm-blue);
}

/* cta-containers */

.cta-grid{
    display: grid;
    max-width: 1170px;
    grid-template-columns: 1fr 1fr;
    margin: 0px auto 120px auto;
}

h2.cta-title{
    color: white;
    padding: 30px;
    font-size: 40px;
    position: absolute;
    bottom:0px;
    line-height: 48px;
}

.cta-container{
    margin:15px;
    height:350px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.bg-overlay{
    width: 100%;
    height: 100%;
    background:
    linear-gradient(
    rgba(126, 25, 70, 0.6), 
    rgba(126, 25, 70, 0.6)
    );
    z-index: 100;
}

.cta-container:hover .bg-overlay{
    background:
    linear-gradient(
    rgba(126, 25, 70, 0.1), 
    rgba(126, 25, 70, 0.1)
    );
}

/* Responsive Styles */

@media (max-width:992px){
    .cta-grid{
        max-width: 970px;       
    }

    .carousel-video .thumbnail {
        height: 240px;
    }

    .nm22-header{
        height:500px;
        flex-direction: column;
    }
       
    main div .title-overlay, main div .subtitle-overlay{
        text-align: center;
    }

    .title-overlay-container{
       margin: 50px auto 0;
       position: relative;
    }

    .leaf{
        width:500px;
        height: auto;
        position:relative;
        top:auto;
        right:auto;
        bottom:10px;
        margin: 0 auto;
    }
}

@media (max-width:768px){
    .cta-grid{
        display: flex;
        flex-direction: column;
        max-width: 750px;
        margin: 0px auto 60px auto;
    }

    .discover-container{
        flex-direction: column;
        padding: 50px 30px;
    }
   
}