/*

@teal                : #18E0B9;



.city {

  &.headline {

    text-decoration: underline;

    text-decoration-color: @teal;

    text-decoration-style: 3px solid;

  }

}



.teal.colored.icon {

  color: @teal !important;

}



.content {

  .slide {

    display: none;





    &.active {

      display: block;

    }

  }

}





.slide-menu {

  a {

    z-index: 10;

    color: @teal;

  }

  a.goto {

    color: black;

    margin: 0 0.5em;

    font-weight: bold;

    font-size: 150%;

  }

  a.goto.active {

    color: @teal;

  }

}



.slider-controls {

  position: absolute;

  padding: 0 5em;

  top: -10em;

  left: 0;

  z-index: 12;

}





@media only screen and (max-width: 1199px) {

  .slider-controls {

    top: -4em;

  }

}



.mobile-friendly {

  display: none;



  .background {

    position: static;

    left: 0;

    right: 0;

    top: 0;

    bottom: 0;

    z-index: -5;

  }



  .box {

    padding: 2em;

    background-color: white;

    position: relative;

    margin: 3em 2em 3em -1em;

  }



  

  .city-box {

    position: relative;

    width: 100%;



    &:before {

      content: "";

      display: block;

      padding-top: 75%;

    }



    .city.image {

      position: absolute;

      background-size: cover;

      top: 0;

      left: 0;

      right: 0;

      bottom: 0;

    }

  }



}



@media only screen and (min-width: 450px) {

  .mobile-friendly .box {

    margin-right: 20vw;

  }

}



@media only screen and (min-width: 666px) {

  .mobile-friendly {



    .city-box {

      &:before {

        display: none;

      }

    }

    .city.image {

      position: relative !important;

      height: 500px !important;

      width: 100% !important;

    }

  }

}





@media only screen and (max-width: 991px) {

  .desktop-friendly {

    display: none;

  }



  .mobile-friendly {

    display: block;



    .background {

      position: absolute;

    }

  }  

}

*/