.butterfly {
    position:absolute;
	top: 35%;
	right: 10%;
	width:80%;
	transform:rotate(-20deg);
}
.butterfly > div {position:absolute;}
.butterfly img {width:100%;}
.leftwing {
  animation:flap-l 4s cubic-bezier(.08,1.47,.65,-0.68) infinite;
}
.rightwing {
  animation:flap-r 4s cubic-bezier(.08,1.47,.65,-0.68) infinite;
}
.leftwing, .rightwing {z-index:1;}

@keyframes flap-l {
			0% {transform:rotateY(0);}
			50% {transform:rotateY(80deg);}
			100% {transform:rotateY(0);}
}
@keyframes flap-r {
			0% {transform:rotateY(0); }
			50% {transform:rotateY(-80deg);}
			100% {transform:rotateY(0);}
}




.bunny-head {position: absolute; top: 15%; right: 10%;
animation: swing 4.5s cubic-bezier(.4,0,.2,1) infinite;
width: 40%;
}
.bunny-head img {width: 100%;}

.bunny-nose {
width: 27%;	
position: absolute; top: 66%; left: 40%;
overflow: hidden;
animation: breath 2s cubic-bezier(0.4, 0, 1, 1) infinite;
}
.bunny-nose img {width: 100%;}


@keyframes swing {
	0%, 50%, 90%, 100% {
		transform: rotateZ(-12deg);
	}
	
	10%, 20%, 40% {
    transform: rotateZ(0);
  }
}


@keyframes breath {
	0%, 15%, 25%, 35%,  85% {
		transform: translateY(3px);
	}
  10%, 20%, 30%, 40%, 80% {
		transform: translateY(0);
	}
}





.ripplebox {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  /*background: url(img/tatra-tavak-bb.jpg) top center no-repeat fixed;*/
  overflow: hidden;
  z-index: 5;
}

div[class^=ripple-] {
  width: 100%;
  position: relative;
  left: 0px;
  background-image: url(img/tatra-tavak-bb.jpg) ;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: bottom center;
  animation-name: water;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  opacity: 0.5;
}
.ripple-1 {
  height: 1px;
  top: 70%;
  animation-delay: -1.2s;
  animation-duration: 0.66s;
}

.ripple-2 {
  height: 3px;
  top: 71%;
  animation-delay: -1.2s;
  animation-duration: 0.57s;
}

.ripple-3 {
  height: 6px;
  top: 72%;
  animation-delay: -1.8s;
  animation-duration: 0.98s;
}


.ripple-4 {
  height: 9px;
  top: 73%;
  animation-delay: -1.8s;
  animation-duration: 1.14s;
}

.ripple-5 {
  height: 12px;
  top: 74%;
  animation-delay: -1.8s;
  animation-duration: 1.05s;
}

.ripple-6 {
  height: 15px;
  top: 75%;
  animation-delay: -1.2s;
  animation-duration: 1.21s;
}

.ripple-7 {
  height: 18px;
  top: 76%;
  animation-delay: -2s;
  animation-duration: 1.62s;
}

.ripple-8 {
  height: 21px;
  top: 77%;
  animation-delay: -2s;
  animation-duration: 1.53s;
}

.ripple-9 {
  height: 24px;
  top: 78%;
  animation-delay: -2s;
  animation-duration: 1.94s;
}

.ripple-10 {
  height: 27px;
  top: 79%;
  animation-delay: -1.2s;
  animation-duration: 1.85s;
}

.ripple-11 {
  height: 30px;
  top: 80%;
  animation-delay: -0.4s;
  animation-duration: 2.26s;
}

.ripple-12 {
  height: 33px;
  top: 82%;
  animation-delay: -0.8s;
  animation-duration: 2.42s;
}

.ripple-13 {
  height: 35px;
  top: 84%;
  animation-delay: -0.2s;
  animation-duration: 2.58s;
}

.ripple-14 {
  height: 37px;
  top: 86%;
  animation-delay: -0.4s;
  animation-duration: 2.49s;
}

.ripple-15 {
  height: 39px;
  top: 88%;
  animation-delay: -0.4s;
  animation-duration: 2.9s;
}

.ripple-16 {
  height: 41px;
  top: 90%;
  animation-delay: -0.6s;
  animation-duration: 3.06s;
}

.ripple-17 {
  height: 51px;
  top: 92%;
  animation-delay: -0.4s;
  animation-duration: 3.22s;
}

.ripple-18 {
  height: 54px;
  top: 94%;
  animation-delay: -1s;
  animation-duration: 3.38s;
}

.ripple-19 {
  height: 57px;
  top: 96%;
  animation-delay: -0.4s;
  animation-duration: 3.54s;
}

.ripple-20 {
  height: 60px;
  top: 98%;
  animation-delay: -1s;
  animation-duration: 3.7s;
}

@keyframes water {
  from {
    transform: rotateX(0deg);
  }
  to {
    transform: rotateX(180deg);
  }
}

@media (max-width: 1300px) {
.imgmenu-title {font-size: 20px; line-height: 22px;}
}
@media (max-width: 1024px) {
.imgmenu-item {width: 33.33%;}
.imgmenu-title {
line-height: 38px;
font-size: 35px;
}
}
@media (max-width: 800px) {
.imgmenu-item {width: 50%; max-height: 120px;}
}
@media (max-width: 600px) {
.imgmenu-item {width: 100%;}
}



/*---imglinks---*/

.billboard-imglinks {width: 100%; float: left; padding-top: 80px; background: #2e3373;}

.billboard-imglinks .billboard-slide {width: 20%;}
.billboard-imglinks .billboard-slide a,
.billboard-imglinks .billboard-slide img {width: 100%;}


/*---owl slider---*/

.billboard {position: relative; float: left; width: 100% !important; display: inline-block; margin-top: 80px; margin-bottom: 0; max-height: 515px; background-color: #2e3373; overflow: hidden;}
.billboard-slider {width: 100%; display: inline-block;}

.billboard-imagelink img {width: 100%; height: auto; float: left;}
.billboard .owl-dots {position: absolute; bottom: 0; padding: 20px; left: 50%; transform: translateX(-50%);}
.billboard .owl-dots button {width: 18px; height: 18px; margin: 10px 5px; outline: 0 !important; border: 0 !important; border-radius: 50%;transform: translate(0,2px); box-shadow: 0 0 0 2px rgba(0,0,0,0.1); transition: var(--tr-all-02s);}
.billboard .owl-dots button.active {background-color: #0099ff;border: 0;}
.billboard .owl-dots button:hover {box-shadow: 0 0 0 5px rgba(255,255,255,0.3);border: 0;}


.owl-nav {outline: none;}
.billboard .owl-nav {position: absolute; top: 0; left: 0; height: 100%; width: 100%; pointer-events: none;}
.billboard .owl-nav button {width: 60px; height: 100%; top: 0; border-radius: 0; outline: 0 !important; border: 0 !important; position: absolute; background-color: transparent;line-height: 60px; text-align:center; transition: var(--tr-all-02s);
pointer-events: all;
}
.billboard .owl-nav button:hover {background-color: rgba(255,255,255,0.5) !important;}
.billboard .owl-nav button span {text-indent: -300px; overflow: hidden; height: 100%; width: 60px;background-repeat: no-repeat; background-position:center; background-size: 30px auto;filter: invert(1);transition: var(--tr-all-02s);}
.billboard .owl-nav button.owl-prev {left: 0;}
.billboard .owl-nav button.owl-next {right: 0;}
.billboard .owl-nav button.owl-prev span {background-image: url('../img/arrow-prev.svg'); }
.billboard .owl-nav button.owl-next span {background-image: url('../img/arrow-next.svg'); }
.billboard .owl-nav button:hover span {filter: invert(0);}
.owl-nav button.disabled {opacity: 0;}

.billboard-imagelink {position: relative; display:inline-block; overflow: hidden;}
.billboard-imagelink:before{width:100%;height:100%;position:absolute;top:0;left:0;content:'';box-shadow:inset 0 0 0 0 #2e3373;z-index: 6;}
.billboard-imagelink:hover:before{box-shadow:inset 0 0 0 8px #ffcc00;transition:all .3s ease}
.billboard-imagelink:after{content:'MEGLESEM';padding:10px;background-color:#e9292a;color:#fff;bottom:-100px;left:50%;margin-left:-70px;z-index:19;padding:15px 0;width:140px;line-height:20px;font-size:18px;font-weight:500;text-transform:uppercase;text-decoration:none;letter-spacing:1px;opacity:0;border-radius:3px;position:absolute}
.billboard-imagelink:hover:after{opacity:1;bottom:15%;transition:all .3s ease;box-shadow:0 5px 15px rgba(0,0,0,0.5)}

@media (max-width: 1920px) {
.billboard-imglinks .billboard-slide {width: 25%;}
.billboard-imglinks .billboard-slide:nth-child(9) {display: none;}
.billboard-imglinks .billboard-slide:last-child {display: none;}
}

@media (max-width: 1600px) {
.billboard-imglinks .billboard-slide {width: 33.333%;}
.billboard-imglinks .billboard-slide:nth-child(9) {display: inline-block;}
.billboard-imglinks .billboard-slide:last-child {display: none;}
}


@media (max-width: 1200px) {
.billboard {margin-top: 60px; margin-bottom: 0;}
.billboard .owl-dots button {width: 12px; height: 12px; margin: 5px 5px; outline: 0 !important; border: 0 !important; border-radius: 50%;transform: translate(0,2px); box-shadow: 0 0 0 2px rgba(0,0,0,0.1); transition: var(--tr-all-02s);}

.opening {margin-top: 60px !important;}
.billboard-imglinks {padding-top: 60px;}
}

@media (max-width: 1024px) {
.billboard .owl-dots {position: absolute; bottom: 0; padding: 20px; left: 50%; transform: translateX(-50%); width: 80%; text-align: center}
}


@media (max-width: 900px) {
.billboard-imglinks .billboard-slide {width: 50%;}
.billboard-imglinks .billboard-slide:last-child {display: inline-block;}
}

@media (max-width: 700px) {
.billboard-imglinks .billboard-slide {width: 100%;}
}



.eagle {position: absolute; top: 65%; left: -120px;
animation: fly 8s linear infinite;
}
.eagle img {
	filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.7));
}


@keyframes fly {
	0% {
		transform: translate(0px, 0px) rotate(0deg);
	}
	30% {
		transform: translate(0px, 0px) rotate(0deg);
	}
	100% {
		transform: translate(800px, -600px) rotate(-30deg);
	}
	
}