53 lines
1019 B
CSS
53 lines
1019 B
CSS
{9814368a41f0e32a9b60224827e953eb045c7282 true 1019 style.css 0xc001de0230}
* {
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
body {
|
|
margin: 0;
|
|
background: #313433;
|
|
color: #313433;
|
|
}
|
|
.page {
|
|
height: 100vh;
|
|
}
|
|
.page::before {
|
|
content: "";
|
|
width: 300%;
|
|
height: 100%;
|
|
background-color: #B6D6C8;
|
|
position: fixed;
|
|
left: 50%;
|
|
top: 50%;
|
|
z-index: -1;
|
|
transform: translateX(-50%) skew(0, -10deg);
|
|
border-radius: 50%;
|
|
animation: waving 5s ease-in-out infinite alternate;
|
|
}
|
|
@keyframes waving {
|
|
from {
|
|
transform: translateX(-50%) skew(0, -10deg);
|
|
}
|
|
to {
|
|
transform: translateX(-30%) skew(10deg, 0);
|
|
}
|
|
}
|
|
.card {
|
|
width: 300px;
|
|
padding: 20px;
|
|
position: absolute;
|
|
left: 50%;
|
|
top: 50%;
|
|
transform: translate(-50%, -50%);
|
|
text-align: center;
|
|
background-color: rgba(255, 255, 255, .2);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 10px;
|
|
box-shadow:
|
|
1px 1px 10px rgba(255, 255, 255, .2),
|
|
-1px -1px 10px rgba(255, 255, 255, .2);
|
|
}
|
|
.card img {
|
|
max-width: 100%;
|
|
border-radius: 10px;
|
|
} |