﻿@media all {
    /* overrides */
    .header_scroll { background-color:var(--color-white); }
    .color_bar_1 { display:none; }

    header #menu ul { padding:var(--spacing-1L) 0px; }
    header #menu ul li.icon a img { height:var(--font-size-2L); }

    /* hero */
    #welcome_hero .container_row_content { padding:var(--spacing-0) 0px 0px 0px;  }
    
    #welcome_hero #hero_title { width:90%; max-width:800px; margin-bottom:var(--spacing-5L); text-align:center; }
    #welcome_hero #hero_title h1 { color:var(--color-white); font-size:var(--font-size-3L); line-height:1.2; letter-spacing:2px; font-weight:var(--font-weight-bold); color:var(--color-white); }
    #welcome_hero #hero_title h1 span:nth-child(2) { display:block; }

    .ms-view { background:none; }
    .ms-slide-layers img { border-top-left-radius:50px; border-top-right-radius:50px; }

    /* search */
    #welcome_search .container_row_content { padding:var(--spacing-3L) 0px;  }

    #welcome_search .state_row { margin-bottom:var(--spacing-2L); text-align:center; }
    #welcome_search .state_row h2 { margin:0px 0px var(--spacing-2L) 0px; padding:0px; font-size:var(--font-size-1S); font-weight:var(--font-weight-normal); line-height:1; letter-spacing:2px; text-transform:uppercase; }
    
    #welcome_search .state_row ul.state_list { justify-content:center; gap:var(--spacing-1S); flex-wrap:wrap; }
    #welcome_search .state_row ul.state_list a { display: inline-flex; justify-content: center; align-items: center; width:30px; height:30px; padding:20px; font-size:var(--font-size-2S); font-weight:var(--font-weight-bold); color:var(--color-blue); background-color:var(--color-white); border-radius:50px; }
    #welcome_search .state_row ul.state_list a.selected,
    #welcome_search .state_row ul.state_list a:hover,
    #welcome_search .state_row ul.state_list a:focus { color:var(--color-white); background-color:var(--color-orange); }

    #welcome_search .project_row ul.project_list { grid-template-columns:repeat(4, 1fr); column-gap:var(--spacing-1S); row-gap:var(--spacing-1L); }
    #welcome_search .project_row ul.project_list li { position:relative; color:var(--color-white); background-size:cover; background-color:var(--color-cyan); background-size:80px; background-position:right var(--spacing-0) bottom var(--spacing-0); background-repeat:no-repeat; border-top-left-radius:20px; border-top-right-radius:20px; }
    #welcome_search .project_row ul.project_list li.has_photo .body:before { content:''; position:absolute; top:0px; right:0px; left:0px; height:50%; background: linear-gradient(to bottom, rgba(0, 48, 85, 1), rgba(255, 255, 255, 0)); z-index:3; border-top-left-radius:20px; border-top-right-radius:20px; z-index:1; }
    #welcome_search .project_row ul.project_list li .info { position:relative; z-index:2; }

    #welcome_search .project_row ul.project_list li a.link { position:absolute; top:0px; right:0px; bottom:0px; left:0px; z-index:10; border-top-left-radius:20px; border-top-right-radius:20px; }
    #welcome_search .project_row ul.project_list li a.link:hover,
    #welcome_search .project_row ul.project_list li a.link:focus { background-color:rgba(0, 0, 0, .3); }

    #welcome_search .project_row ul.project_list li .body { position:relative; height:40vh; padding:var(--spacing-1L) var(--spacing-0); z-index:2; background-size:cover; background-position:center center; border-top-left-radius:20px; border-top-right-radius:20px; }
    #welcome_search .project_row ul.project_list li h2 { margin:var(--spacing-1S) 0px 0px 0px; padding:0px; color:var(--color-white); font-size:var(--font-size-1L); line-height:1.4;  text-shadow:1px 1px rgba(0, 0, 0, 0.2); }
    #welcome_search .project_row ul.project_list li p { margin:0px; padding:0px; font-size:var(--font-size-2S); line-height:1; text-transform:uppercase; letter-spacing:1px;  text-shadow:1px 1px rgba(0, 0, 0, 0.2);}

    #welcome_search .sk_pending { position: absolute; top:0px; right:0px; padding:var(--spacing-2S) var(--spacing-1S); font-size:var(--font-size-2S); font-weight:var(--font-weight-bold); color:var(--color-white); line-height:1; text-transform:uppercase; background-color:var(--color-orange); z-index:2; border-top-right-radius:20px; }
    /* stats */
    #welcome_stats { background-color:var(--color-lighter-gray); text-align:center; }
    #welcome_stats h2 { font-weight:var(--font-weight-normal); line-height:1.4; }
    #welcome_stats h2 span { display:block; }

    #welcome_stats hr { margin:var(--spacing-0) auto var(--spacing-3L) auto; }

    #welcome_stats ul.stats_list { justify-content:space-around; column-gap:var(--spacing-2L); }
    #welcome_stats ul.stats_list li { flex: 1;}
    #welcome_stats ul.stats_list p.large_text { margin:0px 0px var(--spacing-1L); padding:0px; font-size:var(--font-size-5L); font-weight:var(--font-weight-bold); line-height:1; color:var(--color-cyan); }
    #welcome_stats ul.stats_list p { font-size:var(--font-size-2S); font-weight:var(--font-weight-bold); line-height:1.4; color:var(--color-blue); text-transform:uppercase; letter-spacing:2px; }
}

@media (max-width:1500px) {
    #welcome_search .container_row_content { padding:var(--spacing-4L) var(--spacing-2L);}
    #welcome_search .project_row ul.project_list li .body { height:35vh; }

    #welcome_hero { width:calc(100% - calc(var(--spacing-2L) * 2)); margin:0px auto; }
}

@media (max-width:1200px) {
    .ms-slide-layers img { border-top-left-radius:40px; }
    .ms-slide-layers img { border-top-right-radius:40px; }
}

@media (max-width:1100px) {
    /* overrides */
    header #rd_menu_button { display:none; }
    header #menu { display:block; top:initial; background-image:none; }
    
    header #menu ul,
    header.header_scroll #menu ul { position:initial; top:initial; left:initial; transform:initial; padding:var(--spacing-1L) var(--spacing-2L); gap:normal; justify-content:center;}
    header #menu:after { display:none; }
    
    header #menu ul li { margin:0px; }
    header #menu ul li:not(.icon):not(.divider) { margin-left:0px; }
    header #menu ul li.accessibility {text-align:right; }
    header #menu ul li.icon a img { height:var(--font-size-3L); }

    footer { margin-bottom:var(--spacing-4L); }

    .search_control { width:70vw; }

    /* welcome */
    #welcome_search .project_row ul.project_list { grid-template-columns:repeat(3, 1fr); }
    #welcome_search .state_row ul.state_list { gap:0px; }

    .ms-slide-layers img { border-top-left-radius:30px; }
    .ms-slide-layers img { border-top-right-radius:30px; }

    #welcome_hero #hero_title h1 { font-size:var(--font-size-2L); }
    .brand_title_row hr, .brand_hr { height:6px; }

    #welcome_search .project_row ul.project_list li { background-size:60px; }

    #welcome_search .project_row ul.project_list li,
    #welcome_search .project_row ul.project_list li .body,
    #welcome_search .project_row ul.project_list li a.link, 
    #welcome_search .project_row ul.project_list li.has_photo .body:before { border-top-left-radius:15px; border-top-right-radius:15px; }
}

@media (max-width:900px) {
    #welcome_search .project_row ul.project_list li .body { height:26vh; }
}

@media (max-width:700px) {
    /* overrides */
    header #menu ul li.icon a img { height:var(--font-size-4L); }

    /* welcome */
    .ms-slide-layers img { border-top-left-radius:20px; }
    .ms-slide-layers img { border-top-right-radius:20px; }

    #welcome_search .container_row_content { padding:var(--spacing-3L) var(--spacing-2L);}
    #welcome_search .project_row ul.project_list { grid-template-columns:repeat(2, 1fr); }
    
    #welcome_hero #hero_title { margin-bottom:calc(var(--spacing-5L) * 2); }
    #welcome_hero #hero_title h1 { font-size:var(--font-size-0); }

    #welcome_search .project_row ul.project_list li { background-size:40px; }

    #welcome_search .project_row ul.project_list li,
    #welcome_search .project_row ul.project_list li .body,
    #welcome_search .project_row ul.project_list li a.link,
    #welcome_search .project_row ul.project_list li.has_photo .body:before { border-top-left-radius:10px; border-top-right-radius:10px; }

    #welcome_stats h2 span { display:initial; }

    #welcome_stats ul.stats_list { flex-wrap:wrap; }
    #welcome_stats ul.stats_list li { flex:initial; width:100%; }
    #welcome_stats ul.stats_list p { font-size:var(--font-size-0); }

    .brand_title_row hr, .brand_hr { height:8px; }
}

@media (max-width:500px) {

}