.site{background:#023b7e;color:#fff;font-size:18px}
main{max-width:1200px;margin:56% auto 0 auto}
h1{text-align:center;font-size:24px}
.projects-flex{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:0 20px 60px}
.projects-flex .project{width:calc(50% - 10px);background-size:cover;position:relative;background-position:center center;margin:5px;border-radius:10px;overflow:hidden;box-shadow:0 15px 10px -10px rgb(0 0 0 / 50%);box-sizing:border-box;border:1px solid rgb(255 255 255 / 50%)}
.projects-flex .project::before{content:"";padding-bottom:90%;display:block}
.projects-flex .project span{position:absolute;bottom:0;right:0;left:0;background:rgba(0,0,0,.6);color:#fff;line-height:2em;padding:0 .8em}
.about-text a{color:inherit}
.all-projects{font-size:.5em;text-align:center}
.all-projects a{line-height:1;color:#fff}
article{padding:0 20px 20px;max-width:820px;margin:auto}
.map iframe{width:100%}
.map{width:100%}
@media(min-width:560px){
main{margin-top:calc(10% + 270px)}
}
@media(min-width:992px){
main{margin-top:calc(32vh + 60px)}
.site{font-size:24px}
h1{font-size:34px}
.projects-flex .project{width:calc(50% - 20px)}
}

#indexGal .item::before {
    content: "";
    display: block;
    padding-bottom: 80%;
}

#indexGal .item img {
    position: absolute;
    top: 0;
    bottom: 0;
    height: 100%;
    object-fit: cover;
    object-position: top;
}