@media screen and (max-width: 600px) {
  h1 {
    font-size: 2em;
  }

  .loader {
    width: 116px;
    height: 116px;
  }

  .slideRight {
    animation: none;
  }

  .wrapper {
    overflow: hidden;
  }

  .content-wrapper {
    width: 100%;
    height: 100%;
  }

  .logo-svg {
    width: 32px;
    height: 36px;
  }

  .button {
    font-size: 11px;
    height: 34px;
    left: 80px;
  }

  .navBtn {
    font-size: 11px;
    left: 80px;
  } .navBtn:hover {
      left: 84px;
    }


  .projects-wrapper {
    width: 100%;
  }

  .projects {
    margin: 12px;
  }

  .project {
    padding-right: 0;
  }

  .hide-project {
    display: block;
  }

  .next, .previous {
    top: 50px;
    bottom: 0;
    margin: auto;
    z-index: 2;
    width: 30px;
    height: 68px;
    padding: 30px 12px;
  }

  .next {
    right: 0;
    border-radius: 100% 0 0 100%;
  }
  .next:hover {
    padding-left: 14px;
  }

  .previous {
    left: 0;
    border-radius: 0 100% 100% 0;
  }
  .previous:hover {
    padding-left: 7px;
  }

  .block-s {
    width: 49%;
  }
}

@media screen and (max-width: 340px) {
  .button {
    left: 75px;
  }

  .navBtn {
    left: 75px;
  } .navBtn:hover {
      left: 79px;
    }
  
  .slideshow {
    height: 388px;
  }

  .block-s {
    height: 191px;
  }

  .block-m {
    height: 191px;
  }
}

@media screen and (max-height: 425px) {
  body {
    background: #333;
    color: #ffffff;
  }

  .content-wrapper {
    display: none;
  }

  .turn-device {
    display: block;
  }
}