body {
padding-top: 50px;
}
.avatar{
width: 100px;
height: 100px;
}
.espacio{
padding-top: 50px!important;
}
.letra{
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-size: 50px;
color: whitesmoke;
}
a:active:focus:hover{
background-color: #5cb85c;
}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover{
background-color: #5cb85c;
}
#rojo{
color: red;
}
#amarillo{
color: yellow;
}
/*SCROLLING TEXT EJEMPLOS EN CSS
Right to Left
Here we make the text scroll from right to left. The actual animation is done using the animation property and @keyframes rule. We also use vendor prefixes in these examples (eg -webkit- and -moz-). We add the browser prefixes in order to get the marquee working cross-browser. To make the code fully W3C compliant, omit the vendor prefixes (although note that this could prevent it from working in some browsers).
Here is the code and its result:
Source Code Result
Scroll left...
Left to Right
To scroll from left to right, we simply switch the values of translateX() around so that 100% becomes -100% and vice-versa. We've also set the starting position to -100% and changed the class and animation names to scroll-right (but these could be any name you like). All other code can remain the same:
Source Code Result
*/