11 changed files with 3979 additions and 232 deletions
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,31 @@ |
|||
@font-face { |
|||
font-family: "Compagnon Roman"; |
|||
src: url("fonts/Compagnon-Roman.woff") format("woff"); |
|||
font-weight: bold; |
|||
font-style: normal; |
|||
} |
|||
|
|||
@keyframes gradient { |
|||
0% { |
|||
background-color: pink; |
|||
} |
|||
25% { |
|||
background-color: lightgreen; |
|||
} |
|||
50% { |
|||
background-color: lightblue; |
|||
} |
|||
100% { |
|||
background-color: cornsilk; |
|||
} |
|||
} |
|||
|
|||
body { |
|||
font-family: "Compagnon Roman", serif; |
|||
animation-name: gradient; |
|||
animation-duration: 120s; |
|||
} |
|||
|
|||
html * { |
|||
border: 1px black solid; |
|||
} |
|||
@ -1,221 +0,0 @@ |
|||
/* Custom CSS styles */ |
|||
|
|||
@font-face { |
|||
font-family: "Signika Bold"; |
|||
src: url("fonts/Signika-Bold.ttf") format("ttf"); |
|||
font-weight: bold; |
|||
font-style: normal; |
|||
} |
|||
|
|||
@font-face { |
|||
font-family: "Signika"; |
|||
src: url("fonts/Signika-Regular.ttf") format("ttf"); |
|||
font-weight: normal; |
|||
font-style: normal; |
|||
} |
|||
|
|||
body { |
|||
height: 100vh; |
|||
margin: 0px; |
|||
overflow: hidden; |
|||
} |
|||
|
|||
a { |
|||
text-decoration: none; |
|||
color: #26b529; |
|||
} |
|||
|
|||
a:hover { |
|||
font-style: italic; |
|||
} |
|||
|
|||
canvas { |
|||
display: block; |
|||
} |
|||
|
|||
img.perms { |
|||
width: 30%; |
|||
display: inline; |
|||
} |
|||
|
|||
/* Button style */ |
|||
|
|||
img.button { |
|||
width: 4%; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.record { |
|||
position: fixed; |
|||
top: 20px; |
|||
left: 20px; |
|||
} |
|||
|
|||
.record:hover { |
|||
top: 22px; |
|||
left: 22px; |
|||
} |
|||
|
|||
.stop { |
|||
position: fixed; |
|||
top: 100px; |
|||
left: 20px; |
|||
} |
|||
|
|||
.stop:hover { |
|||
top: 102px; |
|||
left: 22px; |
|||
} |
|||
|
|||
.leaf { |
|||
position: fixed; |
|||
top: 180px; |
|||
left: 20px; |
|||
} |
|||
|
|||
.leaf:hover { |
|||
top: 182px; |
|||
left: 22px; |
|||
} |
|||
|
|||
.about { |
|||
width: 3% !important; |
|||
position: fixed; |
|||
top: 260px; |
|||
left: 20px; |
|||
} |
|||
|
|||
.about:hover { |
|||
top: 262px; |
|||
left: 22px; |
|||
} |
|||
|
|||
.about-text { |
|||
height: 100vh; |
|||
padding: 1em; |
|||
width: 60%; |
|||
font-family: "Signika", sans-serif; |
|||
font-size: 1.5em; |
|||
line-height: 1.5em; |
|||
overflow: scroll; |
|||
} |
|||
|
|||
h1 { |
|||
line-height: 1em; |
|||
} |
|||
|
|||
h3 { |
|||
padding: 1em 0; |
|||
} |
|||
|
|||
.backtoindex img { |
|||
width: 10%; |
|||
margin: 0 auto !important; |
|||
margin-left: 20vw; |
|||
padding: 3em 2em 0 10em; |
|||
float: left; |
|||
} |
|||
|
|||
.button.button-about { |
|||
float: left; |
|||
padding-right: 2em; |
|||
cursor: auto; |
|||
} |
|||
|
|||
/* Footer */ |
|||
|
|||
div.footer { |
|||
padding: 3em 0; |
|||
} |
|||
|
|||
.ac { |
|||
width: 30%; |
|||
} |
|||
|
|||
.stimu { |
|||
width: 12%; |
|||
} |
|||
|
|||
.up { |
|||
width: 10%; |
|||
padding-left: 0.4em; |
|||
} |
|||
|
|||
/* Other displays */ |
|||
|
|||
@media screen and (max-width: 770px) { |
|||
img.button { |
|||
width: 10%; |
|||
} |
|||
|
|||
.backtoindex img { |
|||
padding: 3em 2em 0 11em; |
|||
} |
|||
|
|||
.about { |
|||
width: 7% !important; |
|||
top: unset; |
|||
right: 25vw; |
|||
bottom: 2vh; |
|||
left: unset; |
|||
} |
|||
|
|||
.about:hover { |
|||
width: 7% !important; |
|||
top: unset; |
|||
right: 25vw; |
|||
bottom: 2vh; |
|||
left: unset; |
|||
} |
|||
|
|||
.leaf { |
|||
top: unset; |
|||
bottom: 3vh; |
|||
left: 55vw; |
|||
} |
|||
|
|||
.leaf:hover { |
|||
top: unset; |
|||
bottom: 3vh; |
|||
left: 55vw; |
|||
} |
|||
|
|||
.stop { |
|||
top: unset; |
|||
bottom: 3vh; |
|||
left: 40vw; |
|||
} |
|||
|
|||
.stop:hover { |
|||
top: unset; |
|||
bottom: 3vh; |
|||
left: 40vw; |
|||
} |
|||
|
|||
.record { |
|||
top: unset; |
|||
bottom: 3vh; |
|||
left: 25vw; |
|||
} |
|||
|
|||
.record:hover { |
|||
top: unset; |
|||
bottom: 3vh; |
|||
left: 25vw; |
|||
} |
|||
|
|||
.about-text { |
|||
height: 100vh; |
|||
padding: 3em; |
|||
width: 100%; |
|||
font-family: sans-serif; |
|||
font-size: 1em; |
|||
line-height: 1.5em; |
|||
overflow: scroll; |
|||
} |
|||
|
|||
h1 { |
|||
line-height: 1em; |
|||
font-family: sans; |
|||
} |
|||
} |
|||
Loading…
Reference in new issue