You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

101 lines
1.8 KiB
CSS

@font-face {
font-family: 'worksans';
src: url('css/fonts/worksans/WorkSans-Regular.woff') format('opentype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'worksans';
src: url('./css/fonts/worksans/WorkSans-Bold.woff') format('opentype');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'worksans';
src: url('./css/fonts/worksans/WorkSans-Italic.woff') format('opentype');
font-weight: normal;
font-style: oblique;
}
@font-face {
font-family: 'worksans';
src: url('./css/fonts/worksans/WorkSans-Bold.woff') format('opentype');
font-weight: bold;
font-style: oblique;
}
body {
font-size: calc(1rem + 1vw);
min-height: 100vh;
background-color: #131313;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
h1 {
font-family: monospace;
font-size: calc(5rem + 3vw);
color: #e5e5e5;
margin-top: 200px;
margin-bottom: 20px;
}
h2 {
font-family: monospace;
font-size: 1.6rem;
color: #e5e5e5;
}
h3 {
font-size: 1rem;
margin-top: 300px;
}
#header {
font-family: 'worksans', sans-serif;
font-size: calc(1.2rem + 0.5vw);
margin-top: 20px;
color: #e5e5e5;
}
#image-container {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: center;
}
#image-container img {
max-width: 400px;
max-height: 400px;
cursor: pointer;
}
#start-text {
display: none;
}
#footer {
font-size: calc(1rem + 0.5vw);
position: absolute;
bottom: 0;
left: 10px;
color: #313131;
}
#christmas-image {
position: fixed;
top: 5px;
left: 5px;
width: 100px;
height: auto;
z-index: 1000;
}