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.
159 lines
2.1 KiB
CSS
159 lines
2.1 KiB
CSS
@font-face {
|
|
font-family: symbols;
|
|
src: url(/fonts/Symbolic-Regular.ttf);
|
|
}
|
|
|
|
|
|
:root{
|
|
--background: rgb(27, 27, 27);
|
|
--entities: black;
|
|
--highlight: whitesmoke;
|
|
--font-title: sans-serif;
|
|
--font-body: monospace;
|
|
--font-symbols: symbols;
|
|
}
|
|
|
|
body{
|
|
font-family: monospace;
|
|
margin: 0;
|
|
overflow: hidden;
|
|
background-color: var(--background);
|
|
}
|
|
|
|
|
|
.comic {
|
|
width: 200px;
|
|
height: 200px;
|
|
margin: 0;
|
|
padding: 0%;
|
|
border-right: 2pt solid black;
|
|
}
|
|
|
|
.symbol{
|
|
font-family: var(--font-symbols);
|
|
font-size: 1.7em;
|
|
margin: 0;
|
|
}
|
|
|
|
.comic img{
|
|
width: 100%;
|
|
}
|
|
|
|
.title{
|
|
font-family: monospace;
|
|
font-size: 20pt;
|
|
}
|
|
|
|
a{
|
|
color: black;
|
|
text-decoration: underline 2pt dotted black;
|
|
}
|
|
|
|
.header {
|
|
position: absolute;
|
|
border-top: 2pt solid black;
|
|
display: nones;
|
|
flex-flow: row wrap;
|
|
width: 40%;
|
|
margin:0;
|
|
}
|
|
|
|
.tab {
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
align-items: center;
|
|
border-bottom: 2pt solid black;
|
|
margin: 0;
|
|
width: 200%;
|
|
padding-top: 5pt;
|
|
padding-bottom: 5pt;
|
|
padding-left: 10pt;
|
|
padding-right: 10pt;
|
|
background-color: white;
|
|
}
|
|
|
|
#legend-show{
|
|
margin: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
|
|
.info{
|
|
width: 30%;
|
|
display: block;
|
|
background: white;
|
|
}
|
|
|
|
p {
|
|
text-indent: 10pt;
|
|
margin: 0;
|
|
}
|
|
|
|
h2{
|
|
margin: 0;
|
|
margin-left: 15pt;
|
|
width: 80%;
|
|
}
|
|
|
|
h3{
|
|
margin: 0;
|
|
margin-left: 15pt;
|
|
width: 80%;
|
|
}
|
|
|
|
|
|
/* SVG */
|
|
.wave{
|
|
position: absolute;
|
|
z-index: -100;
|
|
width: 100%;
|
|
margin: 0;
|
|
}
|
|
|
|
path{
|
|
cursor: pointer;
|
|
fill:none;
|
|
stroke: transparent;
|
|
mix-blend-mode: multiply;
|
|
stroke-width:5;
|
|
stroke-linecap:round;
|
|
}
|
|
|
|
ellipse{
|
|
fill:none;
|
|
stroke: transparent;
|
|
stroke-width:5;
|
|
stroke-linecap:round;
|
|
mix-blend-mode: multiply;
|
|
}
|
|
|
|
text{
|
|
font-size: 20pt;
|
|
font-family: sans-serif;
|
|
}
|
|
|
|
#one path:hover{
|
|
stroke:#fd2bda;
|
|
}
|
|
|
|
#two path:hover{
|
|
stroke: cornflowerblue;
|
|
}
|
|
|
|
#three path:hover{
|
|
stroke: rgb(119, 119, 119);
|
|
}
|
|
|
|
#three ellipse:hover{
|
|
stroke: rgb(119, 119, 119);
|
|
}
|
|
|
|
#four path:hover{
|
|
stroke: rgb(241, 36, 36);
|
|
}
|
|
|
|
#five path:hover{
|
|
stroke: rgb(35, 187, 86);
|
|
}
|
|
|