94 lines
1.5 KiB
CSS
94 lines
1.5 KiB
CSS
|
@font-face {
|
||
|
|
font-family: '8bitoperator JVE';
|
||
|
|
src: url('8bitoperator-JVE.woff2') format('woff2'),
|
||
|
|
url('8bitoperator-JVE.woff') format('woff');
|
||
|
|
font-weight: normal;
|
||
|
|
font-style: normal;
|
||
|
|
font-display: swap;
|
||
|
|
}
|
||
|
|
|
||
|
|
* {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
box-sizing: border-box;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
html, body {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
body {
|
||
|
|
color: #000;
|
||
|
|
background: #fff;
|
||
|
|
font-family: '8bitoperator JVE', System;
|
||
|
|
}
|
||
|
|
|
||
|
|
.hidden {
|
||
|
|
display: none;
|
||
|
|
visibility: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
.play {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
left: 0;
|
||
|
|
bottom: 0;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
background: #000;
|
||
|
|
color: #fff;
|
||
|
|
z-index: 9001;
|
||
|
|
}
|
||
|
|
|
||
|
|
.bars {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
left: 0;
|
||
|
|
bottom: 0;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: 1fr;
|
||
|
|
grid-template-rows: repeat(5, 1fr);
|
||
|
|
}
|
||
|
|
|
||
|
|
.bar {
|
||
|
|
overflow: hidden;
|
||
|
|
text-align: center;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
font-size: 25vh;
|
||
|
|
font-size: 25dvh;
|
||
|
|
letter-spacing: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.girl {
|
||
|
|
position: fixed;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
left: 0;
|
||
|
|
bottom: 0;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sprite {
|
||
|
|
flex-shrink: 0;
|
||
|
|
flex-grow: 0;
|
||
|
|
width: 100%;
|
||
|
|
height: 52vh;
|
||
|
|
height: 52dvh;
|
||
|
|
image-rendering: crisp-edges;
|
||
|
|
}
|