@import url("https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500&display=swap");
@media (min-width: 256px) {
  body {
    font-family: "Barlow", sans-serif;
    font-size: 0.9rem;
    background-color: #fff;
    background-image: url("../img/skaaimobiel.webp");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  body .carousel-inner {
    display: none;
  }
  body #textlogo, body h1 {
    visibility: hidden;
  }
}
@media (min-width: 567px) {
  body {
    font-family: "Barlow", sans-serif;
    font-size: 0.9rem;
    background-color: #fff;
    background-image: url("../img/skaaimobiel.webp");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  body .carousel-inner {
    display: none;
  }
  body .container .row {
    display: flex;
  }
  body #textlogo, body h1 {
    visibility: hidden;
  }
}
@media (min-width: 811px) {
  body {
    background-image: none;
  }
  body .carousel-inner {
    display: inline;
  }
  body .carousel-item {
    transition: transform 4s ease-in-out;
  }
  body .carousel-fade .active.carousel-item-start,
body .carousel-fade .active.carousel-item-end {
    transition: opacity 0s 4s;
  }
  body #textlogo, body h1 {
    visibility: visible;
  }
  body #textlogo {
    position: absolute;
    z-index: 99;
    padding-left: 80px;
    top: 40%;
    left: 0;
    right: 0;
    width: 900px;
    height: 500px;
    background-image: url("../img/o.webp");
    /*background-position: 607px top; */
    background-position: 654px top;
    background-repeat: no-repeat;
  }
  body #textlogo .thefirst p {
    text-align: right;
    margin-left: 50px;
  }
  body #textlogo .thesecond {
    text-align: left;
  }
  body h2 {
    font-family: "Ubuntu", sans-serif;
    text-shadow: 1px 1px 1px #fff;
    font-size: 1.5rem;
    margin: 1.5rem 0;
    font-weight: 300;
  }
  body h1 {
    font-family: "Ubuntu", sans-serif;
    font-size: 160px;
    font-weight: 400;
    letter-spacing: 19px;
    text-shadow: 5px 1px 10px rgba(73, 31, 19, 0.57);
    margin: 1.5rem 0;
  }
  body h1 > * {
    display: inline-block;
    margin-top: 10px;
    position: relative;
  }
  body h1 .tilde {
    font-size: 200px !important;
    color: #fff;
    line-height: 1px;
    width: 85px;
  }
  body h1 .tilde .inner {
    position: absolute;
    display: block;
    left: 0;
    right: 0;
    top: 15px;
  }
  body h1 .sks {
    color: #636058;
  }
  body h1 .sks::before {
    /* content: url("../img/voorklein.png"); */
  }
  body h1 .skk {
    color: #99a9b2;
    margin-left: 7px;
  }
  body h1 .ska1 {
    color: #90a89b;
    margin-left: -3px;
  }
  body h1 .ska2 {
    color: #5c686e;
    margin-left: -2px;
  }
  body h1 .ski {
    color: #99a9b2;
    margin-left: 13px;
  }
}
@media (min-width: 2240px) {
  #textlogo {
    top: 50%;
    left: 45%;
  }
}