@keyframes ruedita{
0%{
  transform: translateY(-2px);
}
50%{
  transform: translateY(2px);
}
100%{
  transform: translateY(-2px);
}
}
@keyframes flechitas{
0%{
  opacity: 0.1;
}
50%{
  opacity: 0.25;
}
100%{
  opacity: 0.1;
}
}

.scroll {
width: 33%;
height: 12vh;
right: 0px;
bottom: 0;
z-index: 1000;
color: white;
display: block;
position: fixed;
}

.scroll .cont-mouse {
background-color: rgba(0, 0, 0, 0.8);
border-radius: 50%;
width: 100px;
height: 100px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}

.scroll .mouse {
width: 33px;
height: 60px;
border-radius: 60px;
border: solid 3px white;
margin-bottom: 10px;
position: relative;
}

.scroll .mouse .flechas {
position: absolute;
top: 1px;
left: 0;
background-image: none;
width: 100%;
height: 29px;
background-position: center;
background-size: auto 100%;
-webkit-animation-name: flechitas;
animation-name: flechitas;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
text-align: center;
padding: 4px 0;
}

.scroll .mouse .rcont {
width: 100%;
text-align: center;
position: absolute;
left: 0;
top: 15px;
}

.scroll .mouse .flechas .arriba {
margin-bottom: 7px;
}

.scroll .mouse .flechas .fl, .scroll .mouse .flechas .flb {
border-left: solid 1px white;
border-top: solid 1px white;
width: 4px;
height: 4px;
transform: rotate(45deg);
display: block;
margin: 0 auto;
}

.scroll .mouse .flechas .fl, .scroll .mouse .flechas .flb {
border-left: solid 1px white;
border-top: solid 1px white;
width: 4px;
height: 4px;
transform: rotate(45deg);
display: block;
margin: 0 auto;
}

.scroll .mouse .rcont .ruedita {
width: 5px;
height: 9px;
border-radius: 3px;
background-color: white;
display: block;
margin: 0 auto;
-webkit-animation-name: ruedita;
animation-name: ruedita;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}