@font-face {
  font-family: Kievit;
  font-weight: 100;
  src: url("fonts/KievitWebPro-Light.woff") format("woff");
}
@font-face {
  font-family: Kievit;
  src: url("fonts/KievitWebPro.woff") format("woff");
}
@font-face {
  font-family: Kievit;
  font-weight: bold;
  src: url("fonts/KievitWebPro-Bold.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: "Open Sans";
  font-style: normal;
  font-weight: normal;
  src: url("fonts/OpenSans-Regular.woff2") format("woff2"), url("fonts/OpenSans-Regular.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  src: url("fonts/OpenSans-SemiBold.woff2") format("woff2"), url("fonts/OpenSans-SemiBold.woff") format("woff");
}
body {
  font-family: KievitWebPro, sans-serif;
  font-size: 13px;
  line-height: 1.5em;
  margin: 0;
  overflow: hidden;
  padding: 0;
}

#content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
}

#icon {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA3MCA3MCI+PHBhdGggZmlsbD0iI2NjYyIgZD0iTTQgMGg2MmMyLjIgMCA0IDEuOCA0IDR2NjJjMCAyLjItMS44IDQtNCA0SDRjLTIuMiAwLTQtMS44LTQtNFY0YzAtMi4yIDEuOC00IDQtNHoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNNTUuNSA0MC4xbC0uMS0uMS0zLjkgMy43YzEgMS4xIDEgMi44LS4xIDMuOHMtMi44IDEtMy44LS4xYy0uMS0uMS0uMi0uMi0uMy0uNCAwIDAtNi4zLTYuNy0xMC40LTExTDUxIDIyLjVjLTguOC04LjQtMjIuNy04LjgtMzEuNC0uM0MxMSAzMC42IDEwIDQ0LjMgMTguMSA1NEwzMyAzOS44bDEwLjkgMTEuNmMxLjUgMS41IDMuNiAyLjIgNS44IDIuMiAyLS4xIDMuOC0uOSA1LjItMi4yIDEuNi0xLjUgMi42LTMuNyAyLjYtNS45LS4xLTIuNC0uOS00LjItMi01LjR6TTQyLjIgMjMuOEwxOS45IDQ1LjFjLTcuNS0xMy4zIDguMi0yOS40IDIyLjMtMjEuM3oiLz48L3N2Zz4=);
  background-size: 100% auto;
  border-radius: 4px;
  display: none;
  height: 40px;
  margin: 15px auto 0;
  width: 40px;
}

p {
  color: #888;
  display: none;
  margin: 15px 20px 20px;
  text-align: center;
}

@media (min-width: 115px) and (min-height: 150px), (min-width: 240px) and (min-height: 120px), (min-width: 320px) and (min-height: 100px), (min-width: 600px) and (min-height: 90px) {
  #icon {
    display: block;
  }
}
@media (min-width: 140px) and (min-height: 80px), (min-width: 120px) and (min-height: 128px) {
  p {
    display: block;
  }
}
@media (min-width: 420px) {
  p {
    font-size: 15px;
  }
}