@font-face {
  font-family: AudiType;
  src: url(AudiTypeScreen-Normal.woff2);
  font-weight: normal;
}
@font-face {
  font-family: AudiType;
  src: url(AudiTypeScreen-Bold.woff2);
  font-weight: bold;
}
@font-face {
  font-family: AudiTypeExt;
  src: url(AudiType-ExtendedBold.woff);
}
body {font-family: AudiTypeExt, sans;}
.serviceinfo {font-family: AudiType, sans;}

.gallery {
    grid-template-areas:
        "a1 a1 a3 a4"
        "a5 a6 a7 a7"
        "a5 a6 a7 a7";
}
.gallery > div.tile#s8 {
    display: none;
}
@media (min-width: 641px) and (max-aspect-ratio: 1/1){
  body {font-size: 2.84vw}
  .gallery {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 0.5fr 1fr 1fr 1fr;
    grid-template-areas:
        "a1 a1"
        "a3 a4"
        "a5 a6"
        "a7 a7";
      max-height: 177.8vw;
      padding: 2vh;
      grid-gap: 2vh;
    }
    div.tile > div > div.info {font-size:0.85em;}
  }
div.tile > div.hasimage > video, div.tile > div.hasimage > img, div.tile > div.hasimage > iframe {
      max-width:100% !important;
      width: 100% !important;
      max-height:100% !important;
      height: 100% !important;
      position: absolute;
      top: 0;
      left: 0;
      object-fit:cover;
      object-position: center;
}
div.tile > div{background-color: #010101 !important}

div.tile > div.hasimage.image, div.tile > div.hasimage.image_link, div.tile > div.iframe {
    background: #010101;
}

div.tile#s1, div.tile#s1 > div {background: transparent !important};
