@-webkit-keyframes poke-right {
    0%   {margin-left:0px;}
    50%  {margin-left:16px;}
    100% {margin-left:0px;}
}
@keyframes poke-right {
    0%   {margin-left:0px;}
    50%  {margin-left:16px;}
    100% {margin-left:0px;}
}

#ibeheaderSection .travel-type-link.active,
#ibeheaderSection .travel-type-link.active + .travel-type-link{ border: none; }
#ibeheaderSection .travel-type-link.active .travel-type-link-item,
#ibeheaderSection .travel-type-link:not(.active):hover .travel-type-link-item{ opacity: 1; }
#ibeheaderSection #ibe-tipp::before{
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 11px 8px 0;
  border-color: transparent #ffffff transparent transparent;
  left:-10px;
  top:16px;
  position: absolute;
}

#benefits .col.is-2 i{
  -webkit-animation-name: poke-right;
	        animation-name: poke-right;
	-webkit-animation-iteration-count: infinite;
	        animation-iteration-count: infinite;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
}
#benefits .animate *{opacity:0;}
#benefits .animate:nth-child(1) *{-webkit-transform: translate(-200%,0%); transform: translate(-200%,0%);}
#benefits .animate:nth-child(2) *{-webkit-transform: translate(0%,400%); transform: translate(0%,400%);}
#benefits .animate:nth-child(2).reverse *{-webkit-transform: translate(0%,-400%); transform: translate(0%,-400%);}
#benefits .animate:nth-child(3) *{-webkit-transform: translate(200%,0%); transform: translate(200%,0%);}
#benefits .animate.visible *,
#benefits .animate.visible.reverse *{
  opacity:1;
  -webkit-transform: translate(0%,0%); transform: translate(0%,0%);
  -webkit-transition: all .7s ease-in-out; transition: all .7s ease-in-out .1s;
}

#reisearten .slider .slick-slide .image {
  border-radius:.8rem;
  overflow: hidden;
}
#reisearten .slider .slick-slide .has-ratio:before {
  content: "";
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+40,0.5+100 */
  background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,0.5) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,0.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#80000000',GradientType=0 ); /* IE6-9 */
  width: 100%;
  height: 50%;
  position: absolute;
  bottom: 0px;
  left: 0px;
  z-index: 0;
}

#reisearten .slider .slick-slide h3,
#topregionen .slider .slick-slide .image h3,
#topcities .slider .slick-slide .image h3{text-shadow: 0 1px 2px rgba(0,0,0,0.3); min-width:80%;}
#topregionen .slider .slick-slide .image,
#topcities .slider .slick-slide .image{border-radius:.8rem;}
#topregionen .slider .slick-slide .image .mapButton{text-shadow: 0 1px 2px rgba(0,0,0,0.5);}

/*CONSULTING*/
#consulting .hero-body{position: relative;overflow: hidden;}
#consulting .hero-body::before{
  content: "";
  position: absolute;
  width: 10000px;
  height: 10000px;
  top: 50%;
  left: 50%;
  -webkit-transform: rotate(-30deg) translate(-50%,-50%);
  transform: rotate(-30deg) translate(-50%,-50%);
  z-index: 0;
  background: url(../../img/bg/consulting_bg.png) 0 0 repeat;
  opacity: 0.3;
}
#consulting .animate .box,
#consulting .animate .button{opacity:0;}
#consulting .animate .box:nth-child(1){-webkit-transform: translate(400%,0%); transform: translate(400%,0%);}
#consulting .animate .box:nth-child(2){-webkit-transform: translate(300%,0%); transform: translate(300%,0%);}
#consulting .animate .box:nth-child(3){-webkit-transform: translate(200%,0%); transform: translate(200%,0%);}
#consulting .animate.reverse .box{-webkit-transform: translate(0%,-200%); transform: translate(0%,-200%);}
#consulting .animate .button{-webkit-transform: translate(0%,200%); transform: translate(0%,200%);}
#consulting .animate.reverse .button{-webkit-transform: translate(0%,-200%); transform: translate(0%,-200%);}
#consulting .animate.visible .box,
#consulting .animate.visible .button{
  opacity:1;
  -webkit-transform: translate(0%,0%); transform: translate(0%,0%);
  transition-duration: .7s;
  transition-property: all;
  transition-timing-function: ease-in-out;
}

/*FAQ*/
#faq .animate .box:not(:hover),
#faq .animate .button{opacity:0;}
#faq .animate .box:not(:hover){-webkit-transform: translate(0%,400%); transform: translate(0%,400%);}
#faq .animate .button{-webkit-transform: translate(0%,300%); transform: translate(0%,300%);}
#faq .animate.reverse .box:not(:hover){-webkit-transform: translate(0%,-400%); transform: translate(0%,-400%);}
#faq .animate.reverse .button{-webkit-transform: translate(0%,-300%); transform: translate(0%,-300%);}
#faq .animate.visible .box:not(:hover),
#faq .animate.visible .button{
  opacity:1;
  -webkit-transform: translate(0%,0%); transform: translate(0%,0%);
  transition-duration: .6s;
  transition-property: all;
  transition-timing-function: ease-in-out;
}
#faq .box .faq-quote{
  padding-left: .75em;
  display:inline-block;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
#faq .box .faq-quote::before,
#faq .box .faq-quote::after{
  font-size: 1.5em;
  line-height: 0.3em;
  color: rgba(0,0,0,0.25);
  font-family: 'Times New Roman';
  font-weight: bold;
}
#faq .box .faq-quote::before{
  content: '\201C';
  margin-right: .1em;
  margin-left: -.6em;
}
#faq .box .faq-quote::after{
  content: '\201E';
  margin-left: .1em;
}

@media (min-width:1025px){
  #reisearten .slider .slick-slide a:hover{-webkit-transform: scale(1.025); transform: scale(1.025);}
  #topregionen .slider .slick-slide div[class*="trans-"]:hover,
  #topcities .slider .slick-slide div[class*="trans-"]:hover{-webkit-transform: scale(1.025); transform: scale(1.025);}
  #topregionen .slider .slick-slide div[class*="trans-"]:hover .image .bg-transparent-black-40,
  #topcities .slider .slick-slide div[class*="trans-"]:hover .image .bg-transparent-black-40{opacity: 0;}
  #topregionen .slider .slick-slide div[class*="trans-"]:hover .image h3,
  #topcities .slider .slick-slide div[class*="trans-"]:hover .image h3{top:80%;opacity: 0;}
  #faq .box:hover{-webkit-transform: scale(1.025); transform: scale(1.025);}
  #faq .box:hover a{color:#233184;}
}
