SCSS
body {
display: flex;
flex-direction: column;
justify-contents: center;
align-items: center;
background-color: #e74c3c;
}
.card {
width: 500px;
height: 135px;
background-color: #ffffe6;
box-shadow: 6px 6px 5px rgba(0, 0, 0, 0.65);
margin: 25px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 6px;
}
.glasses {
font-family: 'Lobster', cursive;
font-size: 90px;
color: rgb(51, 51, 51);
letter-spacing: 3px;
text-shadow: -3px 0 1px rgb(30,242,241) , 3px 0 1px rgb(246,5,10) ;
}
.long-shadow {
font-family: 'Oswald', sans-serif;
font-size:80px;
color: #F25F5C;
text-shadow: 1px 1px 0 #70C1B3 ,
2px 2px 0 #70C1B3 ,
3px 3px 0 #70C1B3 ,
4px 4px 0 #70C1B3 ,
5px 5px 0 #70C1B3 ,
6px 6px 0 #70C1B3 ,
7px 7px 0 #70C1B3 ,
8px 8px 0 #70C1B3 ,
9px 9px 0 #70C1B3 ,
10px 10px 0 #70C1B3 ,
11px 11px 0 #70C1B3 ,
12px 12px 0 #70C1B3 ,
13px 13px 0 #70C1B3 ,
14px 14px 0 #70C1B3 ,
15px 15px 0 #70C1B3 ,
16px 16px 0 #70C1B3 ,
17px 17px 0 #70C1B3 ,
18px 18px 0 #70C1B3 ,
19px 19px 0 #70C1B3 ,
20px 20px 0 #70C1B3 ;
}
.retro {
font-family: 'Oswald', sans-serif;
font-size: 66px;
color: #663300;
text-transform: uppercase;
-o-text-overflow: clip;
text-overflow: clip;
letter-spacing: 10px;
text-shadow: 2px 2px 0 #F07818 ,
4px 4px 0 #ffcc00 ,
6px 6px 0 rgb(112,112,112) ;
}
.vintage {
font-family: 'Oswald', sans-serif;
font-size: 80px;
color: #990033;
text-shadow: 4px 4px 0 #00ffff ,
5px 5px 0 #b3b3b3 ,
6px 6px 0 #b3b3b3 ,
7px 7px 0 #b3b3b3 ,
8px 8px 0 #b3b3b3 ,
9px 9px 0 #b3b3b3 ,
10px 10px 0 #b3b3b3 ,
11px 11px 0 #b3b3b3 ,
12px 12px 0 #b3b3b3 ,
13px 13px 0 #b3b3b3 ,
14px 14px 0 #b3b3b3 ,
15px 15px 0 #b3b3b3 ,
16px 16px 0 #b3b3b3 ,
17px 17px 0 #b3b3b3 ,
18px 18px 0 #b3b3b3 ,
19px 19px 0 #b3b3b3 ,
20px 20px 0 #b3b3b3 ;
}
