@media screen and (max-width:1200px){

    nav{
        right: 30px;
    }

    header{
        font-size:14px;
        height: auto;
        margin-bottom: 20px;
    }

    .screenContainer{
        width:100%;
        box-sizing: border-box;
    }

    .screenContainer,
    footer .footer-content{
        padding-left:30px;
        padding-right:30px;
    }

    .screenContainer .screenContainer{
        padding-left:0;
        padding-right:0;
    }

    .page-title-wrapper{
        margin-bottom: 20px;
    }   

    .section-search-wrapper{
        right: 30px;
    }

    .colored-band .content{
        width:100%;
    }

    #our-impact-chart{
        flex-direction: column;
    }

    .custom-dropdown-wrapper{
        width:200px;
    }

    .headshot-wrapper .headshot{
        width:200px;
        height: 200px;
    }

    .call-to-action-boxes > *{
        /*font-size:45px;*/
    }

    .slider-outer-wrapper .slider{
        height:auto;
    }

    .slider .slide img{
        width:100%;
    }

    .four-column-wrapper.staff-listing-wrapper{
        grid-template-columns: repeat(3,1fr);
    }

    .series-listing-pinned-wrapper .ceAvailable {
        bottom: 55px;
        left: 15px;
    }

    .page-title-wrapper .favorites-icon-wrapper{
        right: 10px;
    }
}

@media screen and (max-width:1100px){
    .page-title-wrapper h1,
    .page-title-wrapper .favorites-icon-wrapper + h1{
        font-size: 50px;
    }

    .footer-content{
        grid-template-columns: 300px minmax(150px, max-content) 400px;
    }
}

@media screen and (max-width:1000px){

    header #logo {
        max-width: 340px;
        top: 15px;
    }

    header nav{
        top: 105px;
        display: none;
    }

    .navActive header nav{
        display: block;
    }

    .navActive main, .navActive footer {
        display: none;
    }

    nav{
        background-color:white;
        z-index: 1000;
        width: 100%;
        padding: 20px;
        box-sizing: border-box;
        right: 0;
    }

    header nav ul.flex-columns{
        flex-direction: column;
        text-align: left;
    }

    header nav li{
        margin-left: 15px;
        width: 100%;
        font-size: 20px;
        margin-bottom: 5px;
        order: 2;
    }

    #navToggle{
        display: block !important;
        right:30px;
    }

    nav ul.inline .dropdown{
        position: relative;
        opacity: 1;
        visibility: visible;
        box-shadow:none;
        padding-top: 0;
        padding-left: 20px;
    }

    nav ul.inline .dropdown ul{
        background-color:transparent;
        padding: 0;
    }

    nav ul.inline .dropdown li{
        font-size: 20px;
        margin-bottom: 2px;
    }

    nav li.site-search{
        order: 1;
        margin-bottom: 20px;
    }

    nav ul.inline .dropdown ul::before {
        border:none;
    }

    nav ul.inline .dropdown li a{
        color: var(--main-text-color);
    }

    nav .nav-icon{
        width:100%;
        text-align: left;
    }

    .nav-wrapper{
        height: 110px;
    }

    .slider-outer-wrapper{
        margin-bottom: 30px;
    }

    .site-search {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 10px;
        align-content: center;
    }

    .site-search .site-search-field-wrapper{
        border:1px solid var(--dark-border-color);
        grid-template-columns: 1fr auto;
        display: grid;
    }

    .site-search-field-wrapper button{
        width: 30px;
    }

    .show-search-field li:not(.site-search),
    .site-search input{
        display: inline-block;
        font-size: 18px;
        color: #666;
        border: none;
    }

    #site-search-btn{
        align-self: center;
    }

    .tools-listing{
        flex-direction: column;
        align-items: top; 

    }
    
    .tools-listing article{
        margin-bottom:30px;
        max-width:500px;
    }

    .additional-tools .tools-listing article{
        text-align: center;
    }

    .article-listing.flex-columns.three-columns article{
        max-width: 45%;
    }

    .article-listing.grid-columns.three-columns{
        grid-template-columns: repeat(2,1fr);
    }


    .training-details{
        flex-direction: column;
    }

    .training-details aside{
        flex-basis: auto;
    }

    .call-to-action-boxes > *{
        padding:35px;
        /*font-size:35px;*/
    }

    .text-content .content h1.purple-head, 
    .text-content .content h1.orange-head{
        /*font-size:40px;*/
    }

    .call-to-action-boxes{
        padding-top:30px;
        padding-bottom:30px;
    }

    .footer-content{
        grid-template-columns: 300px 1fr;
        grid-template-areas: 
        "footer-logo email-signup"
        "footer-nav email-signup";
    }

    .copyright{
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .four-column-wrapper.staff-listing-wrapper{
        grid-template-columns: repeat(3,1fr);
    }

    .staff-listing-wrapper .headshot{
        width:150px;
    }

    .center-highlight-wrapper .two-column-wrapper{
        gap: 25px;
    }

    .center-highlight-wrapper:nth-child(even) .two-column-wrapper{
        grid-template-columns: auto 30%;
    }

    .center-highlight-wrapper:nth-child(even) .description{
        padding-left: 20px;
    }

    .center-highlight-wrapper:nth-child(odd) .two-column-wrapper{
        grid-template-columns: 30% auto;
    }

    .center-highlight-wrapper:nth-child(odd) .description{
        padding-right: 20px;
    }

    .series-listing-pinned-wrapper.grid-columns.four-columns {
        grid-template-columns: repeat(2,1fr);
    }

    .series-listing-pinned-wrapper .ceAvailable {
        bottom: 10px;
        right: 15px;
        left: auto;
    }

    .event-date-wrapper .event-date{
        width: 130px;   
    }

    .event-date-wrapper .event-date .day{
        font-size: 60px;
    }

    .dashboard-center .dashboard-center-item h3{
        font-size: 20px;
        bottom: 60px;
    }
    
}

@media screen and (max-width:900px){
    .dashboard-center .dashboard-center-item{
        aspect-ratio: 1 / 1.2;
    }
}

@media screen and (max-width:800px){
    .text-content {
        padding: 30px 0;
    }

    .text-content .has-image{
        flex-direction: column;
        gap:10px;
    }

    .text-content .overlap-image.right .image{
        margin:0;
    }

    .text-content.gray .has-image .content > div, 
    .text-content.purple .has-image .content > div, 
    .text-content.orange .has-image .content > div, 
    .text-content.light-gray .has-image .content > div{
        position: relative;
    }

    .text-content .has-image.overlap-image .image img{
        margin-bottom: 0;
    }

    .self-learning-laptop > div{
        transform: none !important;
    }

    .who-we-are-section div.image img{
        position: relative ;
        transform: none ;
        top: auto;
        left: auto;
    }

    .article-listing.flex-columns.three-columns{
        justify-content:center;
    }

    .article-listing.flex-columns.three-columns article{
        max-width: 65%;
    }

    .page-training-bundles .article-listing:not(.trainings-list) .image{
        min-height:200px;
    }

    .page-training-bundles .article-listing:not(.trainings-list) img{
        height:200px;
    }

    .article-listing.two-columns article,
    .article-listing.two-columns .article{
        flex-direction: column;
        gap: 20px;
    }

    .article-listing.two-columns .content{
        padding-left:0;
    }

    .article-listing.two-columns aside{
        flex: 0 0 auto;
        border-left:0;
        padding-right:0;
        padding-top:12px;
        border-right: none;
        border-bottom: 1px solid var(--light-border-color);
    }

    .article-listing.grid-columns.three-columns{
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .article-listing.grid-columns.three-columns article{
        max-width: 350px;
    }

    .article-listing .article{
        padding:20px;
    }

    .with-sidebar{
        flex-direction: column;
    }

    .with-sidebar > aside{
        flex-basis: auto;
    }

    .trainings-list.article-listing aside dd {
        flex: 1 1 calc(100% - 150px);
    }

    .staff-listing-wrapper{
        justify-content: center;
    }

    .staff-listing-wrapper figure{
        margin: auto;
        margin-bottom: 30px;
    }

    .resources-tabs{
        flex-direction: column;
        gap:30px;
    }

    .page-resources .tabs-links{
        flex-basis: 50%;
    }

    .page-resources .tabs-links li{
        grid-template-columns: auto;
        margin-bottom: 15px;
    }

    .page-resources .tabs-links li.active:after{
        border:none;
    }

    .page-resources .icon{
        width:60px;
        height:60px;
    }

    .provider-spotlight-wrapper{
        flex-direction: column;
    }

    .provider-spotlight-wrapper img{
        max-height:200px;
    }

    footer .footer-content {
        flex-direction: column;
    }

    footer .email-signup p{
        margin-bottom: 20px;
    }

    footer .email-signup{
        flex-basis: auto;;
    }

    footer .footer-nav{
        text-align: center;
        margin-bottom: 30px;
    }

    .copyrightWrap .screenContainer{
        flex-direction: column;
        align-items: center;
        gap: 5px;
    }

    .training-filters{
        flex-direction: column;
    }

    .training-filters .custom-dropdown-wrapper{
        width: 100%;
        margin-bottom: 15px;
    }

    .training-icons.bottom{
        position: relative;
    }

    .call-to-action-boxes{
        flex-direction: column;
    }

    .call-to-action-boxes > *{
        /*font-size:45px;*/
    }

    #loginContainer section{
        width: 100% !important;
        box-sizing: border-box;
        padding: 20px !important;
    }

    .three-column-wrapper{
        grid-template-columns: repeat(2,1fr);
    }

    .copyright{
        text-align:center;
        margin-bottom: 10px;
    }

    .footer-content{
        grid-template-columns: 80%;
        grid-template-areas: 
        "footer-logo"
        "footer-nav" 
        "email-signup";
        text-align: center;
        justify-content: center;
    }

    
    
}


@media screen and (max-width:767px){

    header nav{
        top: 90px;
    }

    header #logo {
        max-width: 250px;
        top: 10px;
        left: 10px;
    }

    .nav-wrapper{
        height: 80px;
    }

    .page-title-wrapper h1,
    .page-title-wrapper .favorites-icon-wrapper + h1,
    .centers-single .page-title-wrapper h1{
        font-size: 40px;
        margin-top: 0;
    }

    .staff-listing-wrapper a{
        max-width: 100%;
    }

    .four-column-wrapper.staff-listing-wrapper{
        grid-template-columns: repeat(2,1fr);
    }

    .headshot-wrapper .headshot{
        width:150px;
        height: 150px;
    }

    .training-details .tabs-links ul{
        display: grid;
    }

    .training-details .tabs-links .tab-link{
        margin-bottom: 10px;
    }

    .flex-columns.staff-detail-wrapper{
        flex-direction: column;
        gap:25px;
    }

    .staff-detail-wrapper .headshot-wrapper{
        flex-basis: auto;
    }

    .center-highlight-wrapper:nth-child(odd) .two-column-wrapper,
    .center-highlight-wrapper:nth-child(even) .two-column-wrapper{
        grid-template-columns: 1fr;
        grid-template-areas:
        "logo"
        "description" !important;
    }

    .center-highlight-wrapper:nth-child(odd) .description,
    .center-highlight-wrapper:nth-child(even) .description{
        border-left: none;
        border-right: none;
        border-bottom: 10px solid var(--centers-highlight-color);
        padding: 0 0 10px;
    }

    .center-highlight-wrapper{
        margin-bottom: 50px;
    }

    .section-search-wrapper{
        position: relative;
        top: auto;
        right: auto;
        margin-top: 0;
        margin-bottom: 30px;
    }

    .series-listing-pinned-wrapper.grid-columns.four-columns{
        grid-template-columns: 1fr;
    }

    .email-signup h1{
        font-size: 30px;
    }

    #page-contact .text-content .content{
        columns: 1 !important;
    }

    .masonary-columns.three-columns{
        column-count: 2;
    }

    .three-column-wrapper{
        grid-template-columns: 1fr;
        gap:25px;
    }

    .section{
        margin-bottom: 40px;
    }

    .section + .favorites-floating-icon-wrapper{
        margin-top: -40px;
        margin-bottom: auto;
    }

    .event-list-wrapper .event-item{
        gap: 30px;
    }

    .event-date-wrapper .event-date .day{
        font-size: 45px;
    }

    .training-details .tabs-wrapper .two-column-wrapper.active{
        grid-template-columns: 1fr;
        gap: 10px;

    }

    .training-details .tabs-wrapper .two-column-wrapper .right{
        border-left: none;
        padding: 0;
    }

    .training-details .content .right dt{
        margin-top: 0px;
    }

    .training-details .tabs-wrapper{
        padding-bottom: 0;
    }

    section .grid-columns.two-columns{
        grid-template-columns: 1fr !important;
    }

    .dashboard-center .dashboard-center-item h3{
        font-size: 16px;
        bottom: 55px;
    }

}

@media screen and (max-width:600px){
    .dashboard-center.two-column-wrapper{
        grid-template-columns: 1fr;
    }

    .dashboard-center .dashboard-center-item{
        aspect-ratio: 1 / 1;
    }

    .dashboard-center .dashboard-center-item h3 {
        font-size: 22px;
        bottom: 70px;
    }
}

@media screen and (max-width:500px){

    header #logo {
        max-width: 250px;
        top: 10px;
        left: 10px;
    }

    .four-column-wrapper{
        grid-template-columns: 1fr;
    }

    footer .email-signup-form input{
        flex-basis: 100% !important;
        margin-bottom: 10px;
    }

    footer .footer-content{
        padding:0;
    }

    .trainings-list.article-listing .content dt{
        flex-basis: 100%;
    }

    .trainings-list.article-listing .content dd{
        padding-left:0;
    }

    .four-column-wrapper.staff-listing-wrapper{
        grid-template-columns: 1fr;
    }

    footer#footer{
        padding-top: 20px;
    }

    .page-title-wrapper h1, 
    .page-title-wrapper .favorites-icon-wrapper + h1,
    .centers-single .page-title-wrapper h1{
        font-size: 22px;
    }

    .tools-listing{
        grid-template-columns: 1fr;
    }
    .masonary-columns.three-columns{
        column-count: 1;
    }

    .dashboard-subnav-wrapper ul{
        flex-direction: column;
    }

    .event-list-wrapper .event-item{
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .event-date-wrapper .event-date{
       width: 130px;
    }

    .event-date-wrapper .event-date .month{
        font-size: 14px;
        padding: 5px 0;
    }

    .event-date-wrapper .event-date .day{
        font-size: 35px;
    }

    .dashboard-center .dashboard-center-item h3 {
        font-size: 16px;
        bottom: 50px;
    }

    .page-title-with-image-wrapper{
        grid-template-columns: 1fr 0;
    }

    .page-title-with-image-wrapper h1{
        font-size: 28px;;
    }

    article.content img{
        max-width: 100%;
        height: auto;
    }

    .center-showcase-wrapper .two-column-wrapper{
        grid-template-columns: 1fr;
        padding: 20px;
        gap: 20px;
    }

    .center-showcase-wrapper .two-column-wrapper .description{
        padding: 0;
    }

    .view-more-link{
        width: 100%;
    }

    .main-content img {
        max-width: 100%;
        height: auto;
    }
}
