@media all {
    /* override */
    header { color:var(--color-white); background-color:var(--color-green); }

    header #menu ul li a,
    header #menu ul li.accessibility a { color:var(--color-white); }

    /* intro */
    #intro { background: linear-gradient(to bottom, var(--color-green) 80%, var(--color-white) 80% ); }
    #intro .container_row_content { padding-bottom:0px; }

    #intro .intro_group { grid-template-columns:4fr 6fr; gap:var(--spacing-4L); }

    #intro .intro_group > div:nth-child(1) h1 { font-size:var(--font-size-0); font-weight:var(--font-weight-normal); text-transform:uppercase; }
    #intro .intro_group > div:nth-child(1) p.sub_title { width:70%; font-size:var(--font-size-2L); font-weight:var(--font-weight-bold); }
    #intro .intro_group > div:nth-child(1) p { width:80%; line-height:1.5; }

    #intro .intro_group > div:nth-child(2) img { width:100%;  }

    /* directions */
    #directions { text-align:center; }
    #directions h2 { font-size:var(--font-size-0); font-weight:var(--font-weight-normal); text-transform:uppercase; }
    #directions p.sub_header { margin:var(--spacing-0) auto var(--spacing-1L) auto; width:70%; font-size:var(--font-size-2L); font-weight:var(--font-weight-bold);  }

    /* map */
    #map img { display:block; margin:0px; width:100%; }
}

@media (max-width:1400px) {

}

@media (max-width:1200px) {
    #intro { background: linear-gradient(to bottom, var(--color-green) 90%, var(--color-white) 90% ); }

    #intro .intro_group { grid-template-columns:4fr 5fr; gap:var(--spacing-2L); }
    #intro .intro_group > div:nth-child(1) p.sub_title,
    #intro .intro_group > div:nth-child(1) p { width:100%; }
}

@media (max-width:1000px) {
    
}

@media (max-width:800px) {
    #intro { background: var(--color-green); }
    #intro .intro_group { gap:var(--spacing-0); }
    #intro .container_row_content { padding-bottom:var(--spacing-3L); }
}

@media (max-width:700px) {
    #intro .intro_group { grid-template-columns:1fr; gap:var(--spacing-4L); }
}