#intro.wrapper-slideshow{
    display:block;
    padding:0;
    margin:0 0 6vw 0;
    height:var(--intro-height);
    box-sizing:border-box;
    }

.slideshow{
  display:block;
  position:relative;
  width:100vw;
  height:var(--intro-height);
  padding:0;
  margin:0 auto;
  background-size:cover;
  box-sizing:border-box;
  }

  .slideshow .slide{
    display:block;
    position:relative;
    padding:0;
    margin:0;
    width:100vw;
    height:var(--intro-height);
    margin:0 auto;
    box-sizing:border-box;
    }

    .slide .slide-content{
      position:relative;
      padding:0 10vw;
      box-sizing:border-box;
    }

    .slide .wrapper-image{
      display:block;
      position:relative;
      width:100%;
      height:var(--intro-height);
      background-position:50% 50%;
      background-size:auto 100%;
      background-repeat:no-repeat;
      }

    .wrapper-slideshow .arrow{
      display:block;
      position:absolute;
      z-index:9500;
      top:0;
      padding:1vw;
      width:10vw;
      height:100%;
      color:#FFFFFF;
      background:no-repeat 50% 50%;;
      background-size:auto 5vw;
      box-sizing:border-box;
      cursor:pointer;
      outline: 0;
      }

      .wrapper-slideshow .arrow.left{
        left:0;
        background-image:url('/img/icon-left.png');
        }

      .wrapper-slideshow .arrow.right{
        right:0;
        background-image:url('/img/icon-right.png');
        }

#intro .slide{
  background-repeat:no-repeat;
  background-position:50% 50%;
  background-size:cover;
}

/*--BEGIN: Dots-----------------------*/

/* Dots */
.slide-dotted.slide-slider
{
    margin-bottom:0 !important;
}

.slide-dots
{
    position: absolute;
    bottom: 0.5em;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    list-style-type:none;
}
.slide-dots li
{
    position: relative;
    display: inline-block;
    width: 1vw;
    height: 1vw;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
    box-sizing:border-box;
}
.slide-dots li button
{
    line-height: 0;
    display: block;
    width: 1vw;
    height: 1vw;
    padding: 0;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
    box-sizing:border-box;
}
.slide-dots li button:hover,
.slide-dots li button:focus
{
    outline: none;
}
.slide-dots li button:hover:before,
.slide-dots li button:focus:before
{
    opacity: 1;
}
.slide-dots li button:before
{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 1vw;
    height: 1vw;
    text-align: center;
    background:#FFFFFF;
    border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%;}
.slide-dots li.slick-active button:before
{
    border:0.var(--intro-height) solid rgba(255,255,255,0.7);
    margin:-0.var(--intro-height) 0 0 -0.var(--intro-height);
    background: rgba(255,255,255,0.4);
    color:#FFFFFF;
}

/*--END: Dots--------------------------*/

@media screen and (max-width:640px) and (orientation: portrait){

  :root{
    --intro-height:70vh;
  }

  #intro.wrapper-slideshow{
      display:block;
      padding:0;
      margin:0 0 0 0;
      height:var(--intro-height);
      box-sizing:border-box;
      }

  .slide .wrapper-image{
    display:block;
    position:relative;
    width:100%;
    height:var(--intro-height);
    background-position:50% 50%;
    background-size:100% auto;
    background-repeat:no-repeat;
    }

    .slick-dotted.slick-slider {
      margin-bottom: 1vh;
      }

    .slide-dots {
      position: absolute;
      bottom: -0.5em;
      display: block;
      width: 100%;
      padding: 0;
      margin: 0;
      list-style: none;
      text-align: center;
      list-style-type: none;
      }

}