/*
* === BOUNCE ===
*/


.bounce {
  -moz-animation: bounce 2s infinite;
  -webkit-animation: bounce 2s infinite;
  animation: bounce 2s infinite;
}


@-moz-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -moz-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -moz-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}






/*
* === CITY/COUNTRY ===
*/


.animated-city span {
    position: absolute;
    top: 0;
    left: 233px;
    width: 300px;
    opacity: 0;
    overflow: visible;
    -webkit-animation: animateCity 28s linear infinite 0s;
    -ms-animation: animateCity 28s linear infinite 0s;
    -moz-animation: animateCity 28s linear infinite 0s;
    animation: animateCity 28s linear infinite 0s;
}

.animated-country span {
    position: absolute;
    right: 233px;
    width: 300px;
    top: 0;
    opacity: 0;
    overflow: visible;
    -webkit-animation: animateCountry 20s linear infinite 0s;
    -ms-animation: animateCountry 20s linear infinite 0s;
    -moz-animation: animateCountry 20s linear infinite 0s;
    animation: animateCountry 20s linear infinite 0s;
}

@media only screen and (max-width: 850px) {
	.animated-city span { top: 90px; left: 0; right: 0; text-align: center; width: 100%; }
	.animated-country span { top: 0; left: 0; right: 0; text-align: center; width: 100%; }
}

.animated-city span:nth-child(1) { 
    -webkit-animation-delay: 1s; 
    	-ms-animation-delay: 1s; 
    	-moz-animation-delay: 1s; 
			animation-delay: 1s; 
}
.animated-city span:nth-child(2) { 
    -webkit-animation-delay: 3s; 
    	-ms-animation-delay: 3s; 
    	-moz-animation-delay: 3s; 
			animation-delay: 3s; 
}
.animated-city span:nth-child(3) { 
    -webkit-animation-delay: 5s; 
    	-ms-animation-delay: 5s; 
    	-moz-animation-delay: 5s; 
			animation-delay: 5s; 
}
.animated-city span:nth-child(4) { 
    -webkit-animation-delay: 7s; 
    	-ms-animation-delay: 7s; 
    	-moz-animation-delay: 7s; 
			animation-delay: 7s; 
}
.animated-city span:nth-child(5) { 
    -webkit-animation-delay: 9s; 
    	-ms-animation-delay: 9s; 
    	-moz-animation-delay: 9s; 
			animation-delay: 9s; 
}
.animated-city span:nth-child(6) { 
    -webkit-animation-delay: 11s; 
    	-ms-animation-delay: 11s; 
    	-moz-animation-delay: 11s; 
			animation-delay: 11s; 
}
.animated-city span:nth-child(7) { 
    -webkit-animation-delay: 13s; 
    	-ms-animation-delay: 13s; 
    	-moz-animation-delay: 13s; 
			animation-delay: 13s; 
}
.animated-city span:nth-child(8) { 
    -webkit-animation-delay: 15s; 
    	-ms-animation-delay: 15s; 
    	-moz-animation-delay: 15s; 
			animation-delay: 15s; 
}
.animated-city span:nth-child(9) { 
    -webkit-animation-delay: 17s; 
    	-ms-animation-delay: 17s; 
    	-moz-animation-delay: 17s; 
			animation-delay: 17s; 
}
.animated-city span:nth-child(10) { 
    -webkit-animation-delay: 19s; 
    	-ms-animation-delay: 19s; 
    	-moz-animation-delay: 19s; 
			animation-delay: 19s; 
}
.animated-city span:nth-child(11) { 
    -webkit-animation-delay: 21s; 
    	-ms-animation-delay: 21s; 
    	-moz-animation-delay: 21s; 
			animation-delay: 21s; 
}
.animated-city span:nth-child(12) { 
    -webkit-animation-delay: 23s; 
    	-ms-animation-delay: 23s; 
    	-moz-animation-delay: 23s; 
			animation-delay: 23s; 
}
.animated-city span:nth-child(13) { 
    -webkit-animation-delay: 25s; 
    	-ms-animation-delay: 25s; 
    	-moz-animation-delay: 25s; 
			animation-delay: 25s; 
}
.animated-city span:nth-child(14) { 
    -webkit-animation-delay: 27s; 
    	-ms-animation-delay: 27s; 
    	-moz-animation-delay: 27s; 
			animation-delay: 27s; 
}
.animated-city span:nth-child(15) { 
    -webkit-animation-delay: 29s; 
    	-ms-animation-delay: 29s; 
    	-moz-animation-delay: 29s; 
			animation-delay: 29s; 
}



.animated-country span:nth-child(2) { 
    -webkit-animation-delay: 2s; 
    	-ms-animation-delay: 2s; 
    	-moz-animation-delay: 2s; 
			animation-delay: 2s; 
}
.animated-country span:nth-child(3) { 
    -webkit-animation-delay: 4s; 
    	-ms-animation-delay: 4s; 
    	-moz-animation-delay: 4s; 
			animation-delay: 4s; 
}
.animated-country span:nth-child(4) { 
    -webkit-animation-delay: 6s; 
    	-ms-animation-delay: 6s; 
    	-moz-animation-delay: 6s; 
			animation-delay: 6s; 
}
.animated-country span:nth-child(5) { 
    -webkit-animation-delay: 8s; 
    	-ms-animation-delay: 8s; 
    	-moz-animation-delay: 8s; 
			animation-delay: 8s; 
}
.animated-country span:nth-child(6) { 
    -webkit-animation-delay: 10s; 
    	-ms-animation-delay: 10s; 
    	-moz-animation-delay: 10s; 
			animation-delay: 10s; 
}
.animated-country span:nth-child(7) { 
    -webkit-animation-delay: 12s; 
    	-ms-animation-delay: 12s; 
    	-moz-animation-delay: 12s; 
			animation-delay: 12s; 
}
.animated-country span:nth-child(8) { 
    -webkit-animation-delay: 14s; 
    	-ms-animation-delay: 14s; 
    	-moz-animation-delay: 14s; 
			animation-delay: 14s; 
}
.animated-country span:nth-child(9) { 
    -webkit-animation-delay: 16s; 
    	-ms-animation-delay: 16s; 
    	-moz-animation-delay: 16s; 
			animation-delay: 16s; 
}
.animated-country span:nth-child(10) { 
    -webkit-animation-delay: 18s; 
    	-ms-animation-delay: 18s; 
    	-moz-animation-delay: 18s; 
			animation-delay: 18s; 
}




/*
* - MOZ-KEYFRAMES -
*/

@-moz-keyframes animateCity {
    0% { opacity: 0; }
    1% { opacity: 0; -moz-transform: translateY(-30px); transform: translateY(-30px); }
    3% { opacity: 1; -moz-transform: translateY(0); transform: translateY(0px); }
    8% { opacity: 1; -moz-transform: translateY(0); transform: translateY(0px); }
    10% { opacity: 0; -moz-transform: translateY(30px); transform: translateY(30px); }
    80% { opacity: 0; }
    100% { opacity: 0; }
}			

@-moz-keyframes animateCountry {
    0% { opacity: 0; }
    1.4% { opacity: 0; -moz-transform: translateY(30px); transform: translateY(30px); }
    4.2% { opacity: 1; -moz-transform: translateY(0); transform: translateY(0px); }
    11.2% { opacity: 1; -moz-transform: translateY(0); transform: translateY(0px); }
    14% { opacity: 0; -moz-transform: translateY(-30px); transform: translateY(-30px); }
    80% { opacity: 0; }
    100% { opacity: 0; }
}



/*
* - WEBKIT-KEYFRAMES -
*/

@-webkit-keyframes animateCity {
    0% { opacity: 0; }
    1% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
    3% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0px); }
    8% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0px); }
    10% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
    80% { opacity: 0; }
    100% { opacity: 0; }
}			

@-webkit-keyframes animateCountry {
    0% { opacity: 0; }
    1.4% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
    4.2% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0px); }
    11.2% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0px); }
    14% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
    80% { opacity: 0; }
    100% { opacity: 0; }
}

/*
* - KEYFRAMES -
*/


@keyframes animateCity {
    0% { opacity: 0; }
    1% { opacity: 0; -ms-transform: translateY(-30px); -moz-transform: translateY(-30px); -webkit-transform: translateY(-30px); transform: translateY(-30px); }
    3% { opacity: 1; -ms-transform: translateY(0); -moz-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0px); }
    8% { opacity: 1; -ms-transform: translateY(0); -moz-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0px); }
    10% { opacity: 0; -ms-transform: translateY(30px); -moz-transform: translateY(30px); -webkit-transform: translateY(30px); transform: translateY(30px); }
    80% { opacity: 0; }
    100% { opacity: 0; }
}

@keyframes animateCountry {
    0% { opacity: 0; }
    1.4% { opacity: 0; -ms-transform: translateY(30px); -moz-transform: translateY(30px); -webkit-transform: translateY(30px); transform: translateY(30px); }
    4.2% { opacity: 1; -ms-transform: translateY(0); -moz-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0px); }
    11.2% { opacity: 1; -ms-transform: translateY(0); -moz-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0px); }
    14% { opacity: 0; -ms-transform: translateY(-30px); -moz-transform: translateY(-30px); -webkit-transform: translateY(-30px); transform: translateY(-30px); }
    80% { opacity: 0; }
    100% { opacity: 0; }
}
