#noResults {

    display:none;

    text-align:center;

    margin:40px;

    font-size:18px;

    color:#666;

}

/* HDBR Atlas style */

* {
    margin:0;
    padding:0;
    box-sizing:border-box;
}


body {

    font-family: Arial, Helvetica, sans-serif;
    background:#ececf8;
    color:#333333;

}


/* HEADER */

header {

    background:#FFFFFF;
    color:#333333;
    text-align:center;
    padding:55px 30px;
    border-bottom:5px solid #3c5abe;

}

/* SITE TITLE */

.site-title {

    margin: 20px 0 8px 0;

    text-align: center;

    font-family: Arial, Helvetica, sans-serif;

    font-weight: normal;

    line-height: 1;

}


.site-title .hdbr {

    color: #fa9a4d;

    font-size: 64px;

    font-weight: 700;

    letter-spacing: -2px;

}


.site-title .atlas {

    color: #8A8A8A;

    font-size: 46px;

    font-weight: 400;

    margin-left: 6px;

    vertical-align: baseline;

}


.tagline {

    font-size: 18px;

    color: #666666;

    margin: 0 0 30px 0;

    text-align: center;

}

/*
header p {

    max-width:750px;
    margin:0 auto 30px auto;
    font-size:18px;
    color:#555555;

}
*/


header input {

    width:90%;
    max-width:650px;
    padding:16px 25px;
    border:2px solid #ececf8;
    border-radius:30px;
    font-size:17px;
    background:#FFFFFF;

}


/* GRID */

.gallery {

    width:94%;
    max-width:1500px;
    margin:10px auto 50px auto;

    display:grid;

    grid-template-columns:
    19% 19% 19% 19% 19%;

    gap:1.25%;

}


/* CARDS */

.card {

    position:relative;
    overflow:hidden;

    background:white;

    height:260px;

    border-radius:12px;

    box-shadow:
    0 5px 20px rgba(0,0,0,0.08);

    border:1px solid #E1E8EC;

}


.card img {

    width:100%;
    height:100%;

    object-fit:cover;

    transition:0.4s;

}


.card:hover img {

    transform:scale(1.08);

}


/* HOVER PANEL */



.overlay {

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:100%;

    background:
    #3c5abe;

    color:white;

    padding:25px;

    display:flex;

    flex-direction:column;

    justify-content:flex-end;

    opacity:0;

    transition:0.35s;

}


.card:hover .overlay {

    opacity:1;

}


.overlay h2 {

    font-size:22px;
    margin-bottom:15px;

}


.overlay ul {

    list-style:none;

}


.overlay li {

    margin-bottom:8px;

}


.overlay a {

    color:white;

    text-decoration:none;

    font-size:15px;

    border-bottom:1px solid rgba(255,255,255,0.25);

    padding-bottom:5px;

}


.overlay a:hover {

    color:#ececf8;

}


/* ACCENT LINE */

.card:after {

    content:"";

    position:absolute;

    bottom:0;
    left:0;

    height:6px;
    width:100%;

    background:#3c5abe;

}

/*scroll card*/
.scroll-card {

    position:relative;
    overflow:hidden;

    background:white;

    height:260px;

    border-radius:12px;

    box-shadow:
    0 5px 20px rgba(0,0,0,0.08);

    border:1px solid #E1E8EC;

}


.scroll-card img {

    width:100%;
    height:100%;

    object-fit:cover;

    transition:0.4s;

}


.scroll-card:hover img {

    transform:scale(1.08);

}


/* HOVER PANEL */



.scroll-card .overlay {

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:100%;

    background:
    #3c5abe;

    color:white;

    padding:25px;

    display:flex;

    flex-direction:column;

    justify-content:flex-end;

    opacity:0;

    transition:0.35s;

}


.scroll-card:hover .overlay {

    opacity:1;

}


.scroll-card .overlay h2 {

    font-size:22px;
    margin-bottom:15px;

}


.scroll-card .overlay ul {

    list-style:none;

}


.scroll-card .overlay li {

    margin-bottom:8px;

}


.scroll-card .overlay a {

    color:white;

    text-decoration:none;

    font-size:15px;

    border-bottom:1px solid rgba(255,255,255,0.25);

    padding-bottom:5px;

}


.scroll-card .overlay {
    overflow-y:auto;


}


/* ACCENT LINE */

/*
.scroll-card:after {

    content:"";

    position:absolute;

    bottom:0;
    left:0;

    height:6px;
    width:100%;

    background:#3c5abe;

}
*/



/* TABLET */

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

.gallery {

grid-template-columns:
32% 32% 32%;

}

}


/* MOBILE */

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

.gallery {

grid-template-columns:
49% 49%;

}

header h1 {

font-size:30px;

}

}


/* SMALL PHONE */

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

.gallery {

grid-template-columns:
100%;

}

}
/* NAVIGATION */

.navbar {

    background:#FFFFFF;

/*    border-bottom:1px solid #ececf8;*/

    position:sticky;

    top:0;

    z-index:1000;

}


.nav-container {

    width:94%;

    max-width:1500px;

    margin:auto;

    display:flex;

    align-items:center;

    justify-content:space-between;

    min-height:35px;

}


.logo {

    font-size:26px;

    font-weight:bold;

    color:#3C5ABE;

    white-space:nowrap;

}


.nav-links {

    list-style:none;

    display:flex;

    align-items:center;

    gap:5px;

}


.nav-links li a {

    text-decoration:none;

    color:#444;

    padding:14px 12px 8px 12px;

    font-size:15px;

    border-radius:4px;

    transition:.25s;

}


.nav-links li a:hover {

    background:#ececf8;

    color:#3c5abe;

}


.nav-links li a.active {

    background:#3c5abe;

    color:white;

}



/* MOBILE NAV */

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


    .nav-container {

        flex-direction:column;

        padding:15px 0;

    }


    .nav-links {

        flex-wrap:wrap;

        justify-content:center;

        margin-top:15px;

    }

}