html, body, div, span, object, iframe, figure, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, code, em, img, small, strike, strong, sub, sup, tt, b, u, i, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, main, canvas, embed, footer, header, nav, section, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  text-size-adjust: none;
}

footer, header, nav, section, main {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

a:visited {
  color: black;
}

@font-face {
  font-family: "Riforma";
  src: url("/font/RiformaLL-Regular.woff") format("woff"), url("/font/RiformaLL-Regular.woff2") format("woff2"), url("/font/RiformaLL-Regular.ttf") format("truetype"), url("/font/RiformaLL-Regular.svg#RiformaLL-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Riforma-Medium";
  src: url("/font/RiformaLL-Medium.woff") format("woff"), url("/font/RiformaLL-Medium.woff2") format("woff2"), url("/font/RiformaLL-Medium.ttf") format("truetype"), url("/font/RiformaLL-Medium.svg#RiformaLL-Medium") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Riforma";
  src: url("/font/RiformaLL-Bold.woff") format("woff"), url("/font/RiformaLL-Bold.ttf") format("truetype"), url("/font/RiformaLL-Bold.svg#RiformaLL-Bold") format("svg");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "Riforma";
  src: url("/font/RiformaLL-Italic.woff") format("woff"), url("/font/RiformaLL-Italic.ttf") format("truetype"), url("/font/RiformaLL-Italic.svg#RiformaLL-Bold") format("svg");
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: "Riforma-Thin";
  src: url("/font/RiformaLL-Light.woff") format("woff"), url("/font/RiformaLL-Light.ttf") format("truetype"), url("/font/RiformaLL-Light.svg#RiformaLL-Bold") format("svg");
  font-weight: normal;
  font-style: normal;
}
body b {
  font-family: "Riforma", sans-serif;
  font-weight: bold;
}
body i {
  font-family: "Riforma", sans-serif;
  font-style: italic;
}

:root {
  --margin-left: 140px;
  --margin-bottom: 140px;
  --cell-width: calc((100vw - var(--margin-left)) / 2);
  --cell-height: calc((100vh - var(--margin-bottom)) / 2);
  --max-width-ratio: 1;
  --max-width-offset: 20px;
  --max-height-ratio: 0.3;
  --secondary-max-width-ratio: 0.75;
  --secondary-max-height-ratio: 0.5;
}

div.container {
  display: grid;
  width: 100vw;
  height: 100vh;
  grid-template-columns: 1fr 1fr var(--margin-left);
  grid-template-rows: 1fr 1fr var(--margin-bottom);
  grid-template-areas: "logo     building ." "persons  coords   ." ".        .        .";
  /* Exact */
  /* Min/max */
  /* Syntaxe range moderne (Level 4) */
}
div.container section {
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
  box-sizing: border-box;
  border-bottom: 1px solid black;
  border-right: 1px solid black;
}
div.container section.logo {
  grid-area: logo;
  display: flex;
  align-items: flex-start;
}
div.container section.building {
  grid-area: building;
  vertical-align: bottom;
  position: relative;
}
div.container section.building svg {
  position: absolute;
  bottom: 20px;
  left: 20px;
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  max-width: calc(100% - 40px);
  max-height: calc(100% - 40px);
}
div.container section.persons {
  grid-area: persons;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  --ideal-lh: calc((var(--cell-height) * var(--secondary-max-height-ratio) - 2 * var(--max-width-offset)) / 5);
  --ideal-fs-width: calc((var(--cell-width) * var(--secondary-max-width-ratio) - var(--max-width-offset)) / 15);
  font-size: min(var(--ideal-lh), var(--ideal-fs-width), 30px);
  line-height: 1.2;
}
div.container section.persons p {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
}
div.container section.persons span.title {
  font-weight: bold;
}
div.container section.coords {
  grid-area: coords;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  --ideal-lh: calc((var(--cell-height) * var(--secondary-max-height-ratio) - 2 * var(--max-width-offset)) / 4.5);
  --ideal-fs-width: calc((var(--cell-width) * var(--secondary-max-width-ratio) - var(--max-width-offset)) / 15);
  font-size: min(var(--ideal-lh), var(--ideal-fs-width), 30px);
  line-height: 1.2;
}
@media screen and (max-width: 779px) {
  div.container {
    display: block;
  }
  div.container section.nil {
    display: none;
  }
  div.container section.logo {
    font-size: 26px;
  }
  div.container section.persons, div.container section.coords {
    font-size: 20px;
  }
  div.container section.building {
    position: relative;
  }
  div.container section.building svg {
    position: relative;
    margin-top: 40px;
    height: auto;
    width: calc(100% - 40px);
    max-width: none;
    max-height: none;
  }
  div.container section.building svg #windows-b rect {
    display: none;
  }
}

section.logo {
  --available-height: calc(var(--cell-height) - 40px);
  --available-width: calc(var(--cell-width) - 40px);
  --ideal-lh: calc(var(--available-height) / (2 * 1.1));
  --ideal-fs-width: calc(var(--available-width) / (13 * 0.6));
  font-size: min(var(--ideal-lh), var(--ideal-fs-width));
  line-height: 1;
}
section.logo h1 {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
}

body {
  margin: 0;
  font-family: "Riforma", sans-serif;
  font-size: 20px;
  line-height: 22px;
}
body a {
  color: black;
  text-decoration: none;
}

/*# sourceMappingURL=screen.css.map */