.modal-overlay{position:fixed; inset:0; background:rgba(0,0,0,0.5); display:flex; align-items:center; justify-content:center; z-index:1000; opacity:0; visibility:hidden; transition:opacity 0.25s ease,visibility 0s linear 0.25s; }
.modal-overlay.active{opacity:1; visibility:visible; transition:opacity 0.25s ease; }
.modal-box{background:#fff; border-radius:0px; padding:2rem; max-width:600px; width:80%; margin:auto; position:relative; box-shadow:0 10px 30px rgba(0,0,0,0.2); transform:scale(0.95); transition:transform 0.25s ease; }
.modal-overlay.active .modal-box{transform:scale(1); }
.modal-close{position:absolute; z-index:1002; top:0.5rem; right:0.5rem; background:none; border:none; font-size:2rem; cursor:pointer; }



.contact .photo {position:relative; z-index:1001;}
.contact .photo img {height:auto !important;  width:auto !important;  max-width:100%; }
.contact .photo:before {
    pointer-events: none;
    content: "";
    position: absolute;
    z-index: 3;
    right: 0px;
    bottom: 0px;
    width: 100%;
    height: 8px;
    background:#88BABC;
}
.contact h2,
.contact p {margin:0 0 1rem !important;}

@media (min-width:780px) {
	.contact{display:grid;grid-template-columns:225px auto;grid-template-rows:1fr;grid-column-gap:2rem;grid-row-gap:0px;align-items:center;}
}
@media (max-width:780px) {
	.modal-box{padding:1.5rem; max-width:300px;}
	.contact .photo {margin-bottom:1.5rem;}
	.modal-close{top:0rem; right:0rem;}
}