/*style flechita*/
#circulo-fl{
background-image:none !important;
background-color:rgba(255,255,255,0.3);
box-shadow:0px 0px 6px rgba(255,255,255,0.3);
border-radius:50%;
padding:10px;
	color:#eee;
font-size:13px;
opacity:0.5;
display:none;
}
#circulo-fl:before{
content:'Scroll';
vertical-align:middle;
font-family:"tradegothiceighteen";
letter-spacing:2px;
font-size:14px;
display:block;
margin-top:4px;
  -webkit-animation: color-change 4.5s infinite 2s;
  -moz-animation: color-change 4.5s infinite 2s;
  -ms-animation: color-change 4.5s infinite 2s;
  -o-animation: color-change 4.5s infinite 2s;
  animation: color-change 4.5s infinite 2s;
}
#circulo-fl:before, #circulo-fl:after{
position:relative;
}

#circulo-fl:after{
font-family:'Quicksand';
content:'>';
-ms-transform: rotate(90deg); /* IE 9 */
-webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
transform: rotate(90deg);
font-size:30px;
display:block;
  -webkit-animation: color-change 4.5s infinite 2.2s;
  -moz-animation: color-change 4.5s infinite 2.2s;
  -ms-animation: color-change 4.5s infinite 2.2s;
  -o-animation: color-change 4.5s infinite 2.2s;
  animation: color-change 4.5s infinite 2.2s;
}

/* The animation code */
@-webkit-keyframes color-change {
50%{opacity:1}
60%, 80% {
    opacity: 0.1;
  }
  70% {
    opacity: 1;
  }
@-moz-keyframes color-change {
55%{opacity:1}
60%, 80% {
    opacity: 0.1;
  }
  70% {
    opacity: 1;
  }
@-ms-keyframes color-change {
55%{opacity:1}
60%, 80% {
    opacity: 0.1;
  }
  70% {
    opacity: 1;
  }
@-o-keyframes color-change {
55%{opacity:1}
60%, 80% {
    opacity: 0.1;
  }
  70% {
    opacity: 1;
  }
@keyframes color-change {
55%{opacity:1}
60%, 80% {
    opacity: 0.1;
  }
  70% {
    opacity: 1;
  }
@media (max-width: 1050px) {
#circulo-fl{display:none !important}
}
