.js .home header { opacity: 0;}
.js .home .hero .intro { opacity: 0;}
.js .home .topBar { opacity: 0; top: -100px;}
.js .hangingLine img.question { opacity: 0;}
.js .hangingLine img.pin { opacity: 0;}
.js .hangingLine .line { height: 0;}
/* .js.cssanimations .procedures ul.tabs li { opacity: 0; } */
/* .js.cssanimations .procedures .tab_content { opacity: 0; } */
.js .home .textareaLeft .left,
.js .home .textareaLeft .overlay { left: -100%;}
.js .home .textareaRight .right { right: -100%;}
.js .home .map .wrapper > .left { left: -100%;}

/* .procedures .tab_content { animation: fadeIn 0.3s forwards; -webkit-animation: fadeIn 0.3s forwards; } */
/*
.procedures.animate ul.tabs li { animation: fadeIn 0.3s forwards; -webkit-animation: fadeIn 0.3s forwards; }
.procedures.animate ul.tabs li:nth-child(2) { animation-delay: 0.3s; -webkit-animation-delay: 0.3s; }
.procedures.animate ul.tabs li:nth-child(3) { animation-delay: 0.6s; -webkit-animation-delay: 0.6s; }
.procedures.animate ul.tabs li:nth-child(4) { animation-delay: 0.9s; -webkit-animation-delay: 0.9s; }
*/


/* ANIMATIONS
------------------------------------------------------------------------------------ */

.swingimage {
-webkit-transform-origin: 50% 0; /* for Safari and older Chrome */
    transform-origin: 50% 0;
    -webkit-animation: swinging 2s ease-in-out forwards infinite;
    animation: swinging 2s ease-in-out forwards infinite;
}

.hangingLine .circle:before { -webkit-animation: ripple 2s linear infinite; animation: ripple 2s linear infinite;}
.hangingLine .circle:after { -webkit-animation: ripple 2s linear 1s infinite; animation: ripple 2s linear 1s infinite;}
.whatswrong .animalInfo .left .zones li a:hover:before { -webkit-animation: ripple 2s linear infinite; animation: ripple 2s linear infinite;}
.whatswrong .animalInfo .left .zones li a:hover:after { -webkit-animation: ripple 2s linear 1s infinite; animation: ripple 2s linear 1s infinite;}

@-webkit-keyframes swinging{
    0%{-webkit-transform: rotate(5deg);}
    50%{-webkit-transform: rotate(-5deg)}
    100%{-webkit-transform: rotate(5deg);}
}
 
@keyframes swinging{
    0%{transform: rotate(5deg);}
    50%{transform: rotate(-5deg)}
    100%{transform: rotate(5deg);}
}

@-webkit-keyframes fadeIn {
	0% { opacity: 0;}
	100% { opacity: 1;}
}

@keyframes fadeIn {
	0% { opacity: 0;}
	100% { opacity: 1;}
}

@-webkit-keyframes fadeInUp {
	0% { opacity: 0; -webkit-transform: translateY(20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); }
}

@keyframes fadeInUp {
	0% { opacity: 0; transform: translateY(20px); }
	100% { opacity: 1; transform: translateY(0); }
}

@-webkit-keyframes ripple{
  0% {-webkit-transform:scale(1); }
  75% {-webkit-transform:scale(1.75); opacity:1;}
  100% {-webkit-transform:scale(2); opacity:0;}
}

@keyframes ripple{
  0% {transform:scale(1); }
  75% {transform:scale(1.75); opacity:1;}
  100% {transform:scale(2); opacity:0;}
}