58 lines
952 B
CSS
58 lines
952 B
CSS
body {
|
|
font-family: 'Cairo', sans-serif;
|
|
font-size:30px;
|
|
background-color:black;
|
|
color:white;
|
|
}
|
|
|
|
a {
|
|
padding-left:25px;
|
|
}
|
|
|
|
i {
|
|
color:white;
|
|
}
|
|
|
|
#container {
|
|
/* margin: 0 auto; */
|
|
top:50%;
|
|
left:50%;
|
|
position:absolute;
|
|
transform: translate(-50%, -50%)
|
|
}
|
|
|
|
#textDiv {
|
|
/* display:inline-block; */
|
|
float:left;
|
|
animation: typingEffect 2s forwards;
|
|
width:0%;
|
|
border-width:1px;
|
|
overflow:hidden;
|
|
white-space:nowrap;
|
|
}
|
|
|
|
#box {
|
|
background-color:gray;
|
|
width:15px;
|
|
opacity:0%;
|
|
height:35px;
|
|
border: 1px solid gray;
|
|
animation-name: cursorBlink;
|
|
animation-duration:0.5s;
|
|
animation-iteration-count: infinite;
|
|
margin: -25;
|
|
z-index:1;
|
|
position:absolute;
|
|
transform: translate(-65%, 100%);
|
|
}
|
|
|
|
@keyframes cursorBlink {
|
|
0% {opacity:0%;}
|
|
25% {opacity:50%;}
|
|
75% {opacity:0%;}
|
|
}
|
|
|
|
@keyframes typingEffect {
|
|
from {width:0%;}
|
|
to {width:34%;}
|
|
} |