/*  Navegadores Firefox e Internet Explorer. */
@keyframes rotate1 {from {transform: rotate(0deg);}
    to {transform: rotate(-360deg);}}

@keyframes rotate2 {from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}}

/* Google Chrome, Safari   */
@-webkit-keyframes rotate1 {from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(-360deg);}}

@-webkit-keyframes rotate2 {from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);}}


.carr1 {
    -webkit-animation: 20s rotate1 linear infinite;
    animation: 20s rotate1 linear infinite;

    -webkit-animation-direction: reverse;
    animation-direction: reverse;

    /* -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%; */
    
    position: absolute;
    left: 0%;
    top: 0%;
    z-index: -4;
    width: 100%;
}


.carr2 {
    -webkit-animation: 20s rotate2 linear infinite;
    animation: 20s rotate2 linear infinite;

    -webkit-animation-direction: reverse;
    animation-direction: reverse;

    /* -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%; */

    position: absolute;
    left: 0%;
    top: 0%;
    z-index: -2;
    width: 100%;
}



/*#carr1{position:relative;left:1px;top:1px;}*/
/*#carr2{position:relative;left:250px;top:-1250px;}*/



.nube1 {
  position: absolute;
  left: 0px;
  top: 50%;
  z-index: -5;
  width: 100%;
  transform: translate(0%, 12.5%);
}

.nube2 {
  position: absolute;
  left: 0px;
  top: 50%;
  z-index: -3;
  width: 100%;
  transform: translate(0%, 12.5%);
}

.nube3 {
  position: absolute;
  left: 0px;
  top: 50%;
  z-index: -1;
  width: 100%;
  transform: translate(0%, 12.5%);
}