@charset "UTF-8";
@import 'WebFonts/WebFont.css';
@import 'navigation.css';
@import 'responsive.css';

@keyframes blurEffect {
 0% {
  filter: blur(2px);
 }

 100% {
  filter: blur(0);
 }
}

@keyframes zoomEffect {
 0% {
  transform: scale(1.1);
 }

 100% {
  transform: scale(1);
 }
}

@keyframes blurZoomEffect {
 0% {
  filter: blur(2px);
  transform: scale(1.1);
 }

 100% {
  filter: blur(0);
  transform: scale(1);
 }
}

body {
 min-height: 100vh;
 margin: 0px;
 padding: 0px;
 background-color: #FCFCFC !important;
 font-family: MyriadPro-Light;
}


@media screen and (max-width: 550px) {
 .DeluxeSelectPricing {
  display: none;
 }

 .divTravelInformationTop {
  display: none;
 }

 .highlights {
  display: none;
 }
}

@media screen and (min-width: 551px) {
 .DeluxeSelectPricing_SmalMobile {
  display: none;
 }

 .divTravelInformationTop_SmalMobile {
  display: none;
 }

 .highlights_SmalMobile {
  display: none;
 }

 .DIVTravelRunning_SmalMobile {
  display: none;
 }
}

/* START TRAVEL TEASERIMAGE */
.travelTeaserImage {
 height: 350px;
 overflow: hidden;
 background-size: cover;
 background-repeat: no-repeat;
 background-position: top;
 filter: saturate(120%);
}

 .travelTeaserImage img {
  animation: blurEffect 2s;
 }


@media screen and (min-width: 551px) {
 .travelTeaserImage {
  height: 580px;
 }
}


.travelTeaserImageText {
 position: absolute;
 top: 140px;
 left: -30px;
 text-align: left;
 font-size: 10pt;
 margin-left: 1px;
 padding: 15px;
 width: 100px;
 overflow: hidden;
 border: solid 1px #8A8A8A;
 background-color: rgba(255,255,255,.75);
 transform: scale(.80);
}

 .travelTeaserImageText h1 {
  color: #363636;
  font-size: 14pt !important;
  white-space: nowrap;
  position: relative;
  top: -5px;
  left: 1px;
  margin: 0px;
  padding: 0px;
 }

 .travelTeaserImageText h3 {
  color: #363636;
  font-size: 12pt;
  font-weight: normal;
  margin: 0px;
  padding: 0px;
  white-space: nowrap;
 }

 .travelTeaserImageText input[type="button"], input[type="submit"] {
  max-height: 35px;
  min-height: 35px;
  height: 35px;
  width: 120px;
  border: solid 1px #8A8A8A;
  background-color: #8A8A8A;
  border-color: #fcfcfc;
  color: #ffffff;
  cursor: pointer;
  font-size: 11pt;
  font-family: MyriadPro-Light;
  font-weight:bold;
 }

 .travelTeaserImageText:hover input[type="button"], input[type="submit"] {
  border: none;
  font-weight: bold;
 }

.divFITPRICENoWrap {
 display: none;
}

.divFITPRICEWrapLine {
 display: block;
}


.divWindroseTravelDurationDays {
 margin: 0px;
 padding: 0px;
 font-weight: bold;
 white-space: normal;
 font-size: 10pt;
}


@media screen and (min-width: 500px) {
 .divFITPRICENoWrap {
  display: block;
 }

 .divFITPRICEWrapLine {
  display: none;
 }

 .divWindroseTravelDurationDays {
  white-space: nowrap;
 }

 .travelTeaserImageText h3 {
  line-height: 30px;
 }
}


@media screen and (max-width: 500px) {
 .travelTeaserImageText h1 {
  font-size: 14pt !important;
  line-height: 30px;
 }

 .travelTeaserImageText h3 {
  font-size: 12pt;
  white-space: normal;
 }

 .divWindroseTravelDurationDays {
  font-size: 10pt;
 }
}

@media screen and (min-width: 451px) and (max-width: 550px) {
 .travelTeaserImageText {
  transform: scale(.80);
  width: 100% !important;
  left: -30px;
  top: 140px;
 }
}

/* END TRAVEL TEASERIMAGE */


/* START TRAVEL CARD*/
.travelImageCard {
 content: '';
 position: absolute;
 right: 40px;
 top: 700px;
 box-sizing: border-box;
 background-repeat: repeat-x;
 z-index: 998;
}

.travelImageCard-hover-zoom img {
 transition: transform .5s ease;
 transform-origin: right bottom;
 border-color: #262626;
 border: solid 1px #8A8A8A;
 width: 400px;
 max-height: 220px;
 height: 220px;
 z-index: 999;
 filter: saturate(120%);
}

.travelImageCard-hover-zoom:hover img {
 /*transform: scale(1.95);*/
 z-index: 999;
}

@media screen and (min-width: 1300px) {
 .travelImageCard {
  top: 600px;
 }

 .travelImageCard-hover-zoom img {
  width: 500px;
  max-height: 320px;
  height: 320px;
 }
}


@media screen and (max-width: 1100px) {
 .travelImageCard {
  display: none;
 }
}

/* END TRAVEL CARD*/

/* START TRAVEL TEASERTEXT*/
.travelTeaserText {
 width: 100%;
 font-family: MyriadPro-Light;
 font-size: 12pt;
 text-align: justify;
}

 .travelTeaserText p {
  text-align: justify;
  margin-top: 10px;
  font-size: 12pt !important;
 }

 .travelTeaserText div {
  text-align: justify;
  margin-top: 10px;
  font-size: 12pt !important;
 }


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

 .travelTeaserText .travelTeaserTextSpacer {
  display: none;
 }
 .travelTeaserText .travelTeaserTextRight {
  display: none;
 }

}


/* END TRAVEL TEASERTEXT*/


.highlights {
 width: 100%;
 padding-bottom: 40px;
}

.highlightsContainer {
 content: "";
 clear: both;
 width: 60%;
}

.highlightsImageContainer {
 display: inline-block;
 width: 100%;
 box-sizing: border-box;
}

.highlightsContainer_left {
 width: 20%;
 max-width: 20%;
}

.highlightsContainer_right {
 width: 20%;
 max-width: 20%;
}

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

 .highlightsImageContainer {
  width: 100%;
 }

 .highlightsContainer_left {
  width: 0%;
  max-width: 0%;
  display:none;
 }

 .highlightsContainer_right {
  width: 0%;
  max-width: 0%;
  display: none;
 }
}


 .highlightsHeadlineLeft {
  color: #121212;
  text-align: left;
  white-space: nowrap;
 }

 .highlightsHeadlineRight {
  color: #121212;
  text-align: left;
  white-space: nowrap;
 }


 .highlights_container {
  position: relative;
 }

 .highlights_mySlides {
  display: none;
  width: 100%;
  height: 400px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  transition: transform .5s ease;
  animation: blurEffect 1s;
  filter: blur(0);
  filter: saturate(120%);
  cursor: pointer;
 }


 .highlights_prev,
 .highlights_next {
  cursor: pointer;
  position: absolute;
  top: 45%;
  width: auto;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  user-select: none;
  -webkit-user-select: none;
 }

 .highlights_next {
  right: 0;
 }

  .highlights_prev:hover,
  .highlights_next:hover {
   background-color: rgba(0, 0, 0, 0.8);
  }

 .highlights_row {
  overflow: hidden;
  display: block;
 }

 .highlights_column {
  float: left;
  width: 100%;
  height: 400px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
 }

 .highlights_demo {
  opacity: 0.6;
  cursor: pointer;
 }

  .highlights_active,
  .highlights_demo:hover {
   opacity: 1;
   display: block;
  }


 .hightLightText {
  text-align: left;
  color: #242424;
  font-size: 14pt;
  overflow: hidden;
  background-color: #F5F5F5 !important;
  height: 340px;
  max-height: 340px;
 }

  .hightLightText p {
   margin: 0px;
   padding: 0px;
  }

 .inspiration {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 80px;
  height: 200px;
  width: 100%;
  padding-top: 0px;
  background-color: #F5F5F5 !important;
 }

 /* END HIGHLIGHTs */


 /* START DELUXE SELECT PRICING*/
 .DeluxeSelectPricing {
  height: 500px;
  min-width: 400px;
  margin-top: 80px;
  padding-right: 50px;
  font-family: MyriadPro-Light;
  font-size: 12pt;
 }

  .DeluxeSelectPricing h1 {
   font-size: 16pt;
  }

 .DeluxeSelectPricingMargin {
  margin-left: 20px !important;
  margin-top: 20px;
 }

 .DeluxeSelectPricing_SmalMobile {
  margin-top: 60px;
  padding-right: 20px;
  font-family: MyriadPro-Light;
  font-size: 12pt;
 }

  .DeluxeSelectPricing_SmalMobile h1 {
   font-size: 16pt;
  }

 @media screen and (min-width: 551px) {
  .DeluxeSelectPricingMargin {
   margin-left: 50px !important;
   margin-top: 40px;
  }
 }


 .DeluxeSelectTravelInformation {
  height: 500px;
  width: 100%;
  margin-top: 80px;
  font-family: MyriadPro-Light;
  font-size: 12pt;
 }

 .DeluxeSelectPricingTravelRunning {
  height: 500px;
  width: 100%;
  margin-top: 80px;
  font-family: MyriadPro-Light;
  font-size: 12pt;
  display: none;
 }

 .ImageDeluxeSelectIcon {
  width: 80px;
  height: 80px;
  margin-top: -40px;
  margin-left: 20px;
 }

 .DIVTravelPeriod {
  border: solid 1px #CECECE;
  background-color: #FCFCFC;
  float: left;
  padding: 0px;
  width: 100%;
  overflow: hidden;
 }


 .travelRunningVisible {
  display: none;
 }

 @media screen and (min-width: 650px) {
  .travelRunningVisible {
   display: block;
  }
 }

 .DIVTravelRunning {
  width: 100%;
  overflow-y: auto;
  transition: transform .8s;
  cursor: pointer;
  margin: 40px 20px 0px 0px;
  border: solid 1px #CECECE;
  background-color: #FCFCFC;
  float: left;
  padding: 20px 0px 20px 0px !important;
 }

  .DIVTravelRunning img {
   display: none;
  }

 .DIVTravelRunning_SmalMobile {
  margin-top: 60px;
  width: 100%;
  background-color: #ECECEC;
  padding: 20px 0px 20px 0px !important;
  float: left;
 }


 .DIVDeluxe {
  width: 100%;
  transition: transform .8s;
  margin-top: 40px;
  border: solid 1px #CECECE;
  background-color: #FCFCFC;
  float: left;
 }

 .DIVDeluxeTravelRunning {
  margin-left: 20px;
 }


 .DIVDeluxeTravelInformation {
  width: 100%;
 }

 .DIVSelect {
  width: 100%;
  transition: transform .8s;
  margin-top: 80px;
  margin-left: 0px;
  border: solid 1px #CECECE;
  background-color: #FCFCFC;
  float: left;
 }

 .DIVSelectTravelRunning {
  margin-left: 20px;
 }

 .DIVSelectTravelInformation {
  width: 100%;
 }

 .DIVReisezeitraum {
  height: 20px;
  transition: height 0.5s ease-in-out;
  overflow: hidden;
 }

  .DIVReisezeitraum:hover {
   height: 120px;
  }

 .DIVReisezeitraumSelect {
  border: 1px solid #FCFCFC;
  display: block;
  line-height: 40px;
  color: #000000;
  height: 40px;
  max-height: 40px;
  cursor: text;
  font-weight: bold;
  margin-left: -5px;
 }
 /* END DELUXE SELECT PRICING */


 /* START END BOOKING REQUEST */

 .BookingRequest {
  font-family: MyriadPro-Light;
  font-size: 12pt;
  float: left;
  padding-top: 60px !important;
  background-color: #ECECEC;
  width: 100%;
  overflow: hidden;
  position: relative;
 }

 @media screen and (min-width: 551px) {
  .BookingRequest {
   margin-top: 80px !important;
  }
 }

 .BookingRequestBorder {
  display: none;
 }

 .BookingRequestMargin {
  margin-left: 50px !important;
  margin-right: 50px !important;
 }

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

  .BookingRequestMargin {
   margin-left: 30px !important;
   margin-right: 30px !important;
  }
 }

 .DIVTravelManagerContact {
  float: left;
  margin-left: 0px;
  margin-right: 60px;
  text-align: left;
  padding-top: 0px;
  margin-top: -15px;
  width: 100%;
 }

 .DIVBookingRequestContactSpacer {
  display: none;
 }

 .DIVBookingRequestContact {
  width: 100%;
  float: left;
  display: none;
 }

 .DIVTravelManagerCallBack {
  text-align: left;
  font-size: 11pt;
 }

  .DIVTravelManagerCallBack h2 {
   padding: 0px 0px 10px 0px !important;
   margin: 20px 0px 0px 0px !important;
  }

 .DIVTravelManagerCallBackInputWidth {
  width: 100%;
 }


 @media screen and (min-width: 551px) {
  .DIVTravelManagerCallBackInputWidth {
   width: 200px;
  }

  .DIVBookingRequestContact {
   display: block;
  }
 }

 .DIVTravelManagerCallBack input[type="text"], input[type="number"], input[type="date"], input[type="time"], textarea {
  background-color: #FFFFFF;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  display: block;
  line-height: 28px;
  color: #000000;
  max-height: 41px;
  min-height: 41px;
  height: 41px;
  cursor: text;
  margin-bottom: 24px;
  width: 100%;
  min-width: 200px;
  font-family: MyriadPro-Light;
 }

 .DIVTravelManagerCallBack select {
  background-color: #FFFFFF;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  display: block;
  line-height: 40px;
  color: #000000;
  width: 100%;
  min-width: 200px;
  max-height: 41px;
  min-height: 41px;
  height: 41px;
  cursor: text;
  margin-bottom: 24px;
  font-family: MyriadPro-Light;
 }


 .DIVBookingRequestContact input[type="text"], input[type="number"], input[type="date"], input[type="time"], textarea {
  background-color: #FFFFFF;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  display: block;
  line-height: 28px;
  color: #000000;
  max-height: 41px;
  min-height: 41px;
  height: 41px;
  cursor: text;
  margin-bottom: 24px;
  width: 100%;
  min-width: 200px;
  font-family: MyriadPro-Light;
 }

 .DIVBookingRequestContact select {
  background-color: #FFFFFF;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  display: block;
  line-height: 40px;
  color: #000000;
  width: 100%;
  min-width: 200px;
  max-height: 41px;
  min-height: 41px;
  height: 41px;
  cursor: text;
  margin-bottom: 24px;
  font-family: MyriadPro-Light;
 }


 .DIVBookingRequestContact input[type="button"], input[type="submit"] {
  max-height: 41px;
  min-height: 41px;
  height: 41px;
  background-color: #8A8A8A;
  border-color: #fcfcfc;
  color: #ffffff;
  font-size: 11pt;
  cursor: pointer;
  margin: 0px !important;
  font-family: MyriadPro-Light;
 }

 .DIVBookingRequestContact img {
  width: 400px;
  max-width: 400px;
  height: 275px;
  max-height: 275px;
  border: solid 1px #CECECE;
 }

 .DIVBookingRequestContact ul li img {
  width: 20px;
  max-width: 20px;
  height: 20px;
  max-height: 20px;
  border: none;
  line-height: 35px !important;
 }

 .DIVBookingRequestContact ul li {
  font-size: 12pt;
  line-height: 35px !important;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
 }

  .DIVBookingRequestContact ul li:nth-child(1) {
   font-size: 16pt;
   line-height: 25px !important;
  }

  .DIVBookingRequestContact ul li:nth-child(2) {
   font-size: 14pt;
   line-height: 25px !important;
  }


 @media screen and (min-width: 720px) and (max-width: 870px) {
  .DIVBookingRequestContact img {
   width: 300px;
   max-width: 300px;
   height: 200px;
   max-height: 200px;
  }
 }

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

  .DIVTravelManagerContact {
   margin-right: 30px;
  }

  .DIVBookingRequestContact img {
   display: none;
  }

  .DIVBookingRequestContact ul li img {
   display: block;
  }

  .DIVBookingRequestContact ul li {
   font-size: 11pt;
   line-height: 15px !important;
  }

   .DIVBookingRequestContact ul li:nth-child(1) {
    font-size: 14pt;
    line-height: 20px !important;
   }

   .DIVBookingRequestContact ul li:nth-child(2) {
    font-size: 13pt;
    line-height: 20px !important;
   }

   .DIVBookingRequestContact ul li:nth-child(4) {
    display: none;
   }

   .DIVBookingRequestContact ul li:nth-child(5) {
    display: none;
   }
 }


 .TravelManagerCallBackText {
  padding: 0px 0px 25px 0px;
  font-size: 11pt !important;
  width: 100%;
  font-weight: bold;
  text-align: justify;
  margin-bottom: 40px;
 }

 .DIVBookingRequestFormular {
  width: 100%;
  float: left;
  margin-bottom: 60px;
  font-size: 11pt;
  overflow: hidden;
 }

 .DIVBookingRequestFormularButton {
  width: 48%;
 }

 @media screen and (max-width: 720px) {
  .DIVBookingRequestFormularButton {
   width: 100%;
  }
 }

 .DIVBookingRequestFormular input[type="text"], input[type="number"], input[type="date"], input[type="time"], textarea {
  background-color: #FFFFFF;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  display: block;
  line-height: 28px;
  color: #000000;
  max-height: 41px;
  min-height: 41px;
  height: 41px;
  cursor: text;
  margin-bottom: 24px;
  font-family: MyriadPro-Light;
  width: 100%;
  min-width: 200px;
 }

 .DIVBookingRequestFormular select {
  background-color: #FFFFFF;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  display: block;
  line-height: 40px;
  color: #000000;
  width: 100%;
  min-width: 200px;
  max-height: 41px;
  min-height: 41px;
  height: 41px;
  cursor: text;
  margin-bottom: 24px;
  font-family: MyriadPro-Light;
 }


 .DIVBookingRequestFormular table {
  border-collapse: collapse;
  margin-top: -15px;
 }

 .DIVBookingRequestFormular input[type="text"], select {
  width: 100%;
  max-height: 41px;
  min-height: 41px;
  height: 41px;
 }

 .DIVBookingRequestFormular textarea {
  max-width: 94%;
 }


 .DIVBookingRequestFormular input[type="button"], input[type="submit"] {
  max-height: 41px;
  min-height: 41px;
  height: 41px;
  width: 275px;
  background-color: #8A8A8A;
  border-color: #fcfcfc;
  color: #ffffff;
  font-size: 11pt;
  cursor: pointer;
  margin: 0px !important;
  font-family: MyriadPro-Light;
 }

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

  .DIVBookingRequestFormular {
   margin-top: -45px;
  }
 }

 .DIVBookingRequestFormular #divTravelPerson {
  display: none;
  position: relative;
  top: -360px;
  left: 275px;
  background-color: #FFFFFF;
  width: 200px;
  height: 300px;
  overflow: auto;
  border: solid 1px #8A8A8A;
  padding: 5px;
  z-index: 999;
 }

 /* END BOOKING REQUEST */

 /* START TRAVELINFOMATION */
 .divTravelInformation {
  border: solid 1px #CECECE;
  background-color: #FCFCFC;
 }

 .divTravelInformationTop {
  width: 100%;
  float: left;
 }

 .divTravelInformationTop_SmalMobile {
  width: 100%;
  float: left;
  margin-top: 40px;
  margin-bottom: 60px;
 }

 .divTravelInformationMargin {
  margin: 40px 20px 0px 20px !important;
 }

 @media screen and (min-width: 551px) {
  .divTravelInformationMargin {
   margin: 40px 50px 0px 50px !important;
  }
 }

 .divTravelInformationTop_SmalMobile select {
  border: 1px solid #FCFCFC;
  display: block;
  line-height: 40px;
  color: #000000;
  height: 40px;
  max-height: 40px;
  cursor: text;
  font-weight: bold;
 }

 .tabControl {
  overflow: hidden;
  border-top: 1px solid #ccc;
  background-color: #f1f1f1;
 }

  .tabControl button {
   background-color: inherit;
   float: left;
   border: none;
   outline: none;
   cursor: pointer;
   padding: 14px 16px;
   transition: 0.3s;
   font-size: 17px;
  }

   .tabControl button:hover {
    background-color: #ddd;
   }

   .tabControl button.active {
    background-color: #ccc;
   }

 .tabContent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
  animation: fadeEffect 1.5s;
  height: 600px;
  min-height: 600px;
  max-height: 600px;
  overflow: auto;
 }

 /* END TRAVELINFOMATION */

 /* START CONCIERGE*/

 .conciergeImage {
  width: 100px;
 }


 /* END CONCIERGE*/