.overallcarousel{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.carousel{
  /* height: 400px; */
  width: 80%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  padding: 5px;
  overflow: hidden;
}

.carouselitem{
  height: 100%;
  min-width: calc(100% / 4 - 2 * 18px);
  margin: 0 18px;
}

.overallcarousel .carouselbutton{
  border-radius: 3px;
  height: 40px;
  width: 40px;
  font-size: 2em;
  text-align: center;
  background-color: #f1f1f166;
  font-weight: bold;
}
.overallcarousel:hover .carouselbutton:hover{
  background-color: #f1f1f1;
  cursor: pointer;
}

.overallcarousel .carouselbutton:first-child::after{
  content: "\00AB";
}
.overallcarousel .carouselbutton:last-child:after{
  content: "\00BB";
}



/* Carousel Item Content */
#tourpreview-container-div{
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  flex-wrap: nowrap;
  width: 80vw;
  margin-bottom: 30px;
}

.tourpreview-container {
  width: calc((100vw - 15vw - 10vw) / 4);
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  overflow: hidden;

  background-color: #f1f1f1;

  -webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.19);
  -moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.19);
  box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.19);
}

.tourpreview-image-box{
  width: 100%;
  height: calc((100vw - 15vw - 10vw) * 3 / 4  / 4);
  overflow:hidden;
}

.tourpreview-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: all 1.0s;
}

.tourpreview-image:hover {
  transform: scale(1.3);
}

.tourpreview-text {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  margin: 6% 10%;
}

.tourpreview-text p {
  max-height: calc((100vw - 15vw - 10vw) * 3 / 4  / 4);
  text-overflow: ellipsis;
}

.tourpreview-text h2 {
  text-align: center;
}

.erfahremehr-text {
  text-align: right;
  letter-spacing: 0.1em;
}

.erfahremehr-text a {
  text-decoration: none;
}

.erfahremehr-text a::after{
  content: " \21E2";
}

a.standalonelink{
  display: inline-block;
  letter-spacing: 0.1em;
  text-decoration: none;
  padding: 10px 20px;
  margin: 10px;

  border-radius: 4px;
  background-color: white;
  border: 1px solid #00b8ff;

  text-transform: uppercase;

  -webkit-box-shadow: 2px 2px 5px -1px rgba(0,0,0,0.23);
  -moz-box-shadow: 2px 2px 5px -1px rgba(0,0,0,0.23);
  box-shadow: 2px 2px 5px -1px rgba(0,0,0,0.23);
}

a.standalonelink:hover, a.standalonelink:active {
  background-color: #00b8ff;
  padding: 10px 20px;
  margin: 10px;
}

.readyforatourimg {
   width: 100vw;
   margin-top: calc(-1754 / 6016 * 100vw + 3em);
   overflow: hidden;
   z-index: -1;
}







/* Some responseiveness */
@media only screen and (max-width : 1400px) {
  .carouselitem{
      min-width: calc(100% / 3 - 2 * 18px);
  }
  .tourpreview-image-box{
    height: calc((100vw - 15vw - 10vw) * 3 / 4  / 3);
  }
  .tourpreview-text p {
    max-height: calc((100vw - 15vw - 10vw) * 3 / 4  / 3);
  }
}

@media only screen and (max-width : 1200px) {
  .carousel{
    width: 100%;
  }
  
  .carouselitem{
      min-width: calc(100% / 2 - 2 * 18px);
  }

  .tourpreview-image-box{
    height: calc((100vw - 15vw - 10vw) * 3 / 4  / 2);
  }
  .tourpreview-text p {
    max-height: calc((100vw - 15vw - 10vw) * 3 / 4  / 2);
  }
}

@media only screen and (max-width : 800px) {
  .carousel{
    width: 80%;
  }
  
  .carouselitem{
      min-width: calc(100% / 1 - 2 * 18px);
  }
  .tourpreview-image-box{
    height: calc((100vw - 15vw - 10vw) * 3 / 4  / 1);
  }
  .tourpreview-text p {
    max-height: calc((100vw - 15vw - 10vw) * 3 / 4  / 1);
  }

  .readyforatourimg {
     width: 300vw;
     margin-top: calc(-1754 / 6016 * 300vw + 3em);
  }
}