You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
171 lines
2.9 KiB
171 lines
2.9 KiB
html {
|
|
height: 100%;
|
|
width: 100%;
|
|
font-family:rotunda;
|
|
background-color: #300d0d;
|
|
--accentcolor:#ac0e0e;
|
|
--accentcolordark: #68050c;
|
|
--accentcolor2: #921218;
|
|
--bordercolor:black;
|
|
--header-border:white;
|
|
--bgcolor:rgb(0, 0, 0);
|
|
--gapsize: 10px;
|
|
color: whitesmoke;
|
|
}
|
|
|
|
|
|
|
|
@font-face {
|
|
font-family: rotunda;
|
|
src: url(./static/Designer-Notes-Bold.ttf);
|
|
}
|
|
|
|
@font-face {
|
|
font-family: friendolin;
|
|
src: url(./static/Friedolin.ttf);
|
|
}
|
|
|
|
.maindiv {
|
|
width:70vw;
|
|
height: 90vb;
|
|
margin:auto;
|
|
}
|
|
|
|
.header {
|
|
box-shadow: 6px 6px 0px -1px var(--accentcolor);
|
|
border:2px solid var(--accentcolordark);
|
|
outline:2px solid var(--bordercolor);
|
|
height:20vb;
|
|
background-color:var(--bgcolor);
|
|
background-image:url(./static/bg.png);
|
|
background-size:cover;
|
|
background-position:center;
|
|
margin-bottom:var(--gapsize);
|
|
}
|
|
|
|
.bar {
|
|
box-shadow: 6px 6px 0px -1px var(--accentcolor);
|
|
border:2px solid var(--accentcolordark);
|
|
outline:2px solid var(--bordercolor);
|
|
background-color:var(--bgcolor);
|
|
margin-bottom: var(--gapsize);
|
|
text-align:center;
|
|
padding-top:7px;
|
|
padding-bottom:7px;
|
|
}
|
|
|
|
h3 {
|
|
margin:0px;
|
|
color: #68050c;
|
|
}
|
|
|
|
p {
|
|
margin:0px;
|
|
color: #e8646d;
|
|
}
|
|
|
|
h1 {
|
|
font-family:rotunda;
|
|
font-size:50px;
|
|
margin:5px;
|
|
margin-left:10px;
|
|
position:relative;
|
|
top:20px;
|
|
filter: drop-shadow(0px 0px 5px var(--accentcolor));
|
|
}
|
|
|
|
.row {
|
|
display:flex;
|
|
gap:var(--gapsize);
|
|
height:auto;
|
|
}
|
|
|
|
.navigation {
|
|
box-shadow: 6px 6px 0px -1px var(--accentcolor);
|
|
border:2px solid var(--accentcolordark);
|
|
outline:2px solid var(--bordercolor);
|
|
background-color:var(--bgcolor);
|
|
text-align:center;
|
|
box-sizing: border-box;
|
|
width:25%;
|
|
height:auto;
|
|
}
|
|
|
|
.titlebar {
|
|
background-color: var(--accentcolor);
|
|
border-bottom:2px solid var(--accentcolordark);
|
|
padding:4px;
|
|
}
|
|
|
|
.buttonholder {
|
|
padding-left:10px;
|
|
padding-right:10px;
|
|
overflow-y:auto;
|
|
height:70vb;
|
|
}
|
|
|
|
.navigationbutton {
|
|
margin:5px;
|
|
padding:5px;
|
|
border:2px solid var(--bordercolor);
|
|
background-color: var(--accentcolor2);
|
|
}
|
|
|
|
h4 {
|
|
margin:0px;
|
|
color: #0e0eac;
|
|
}
|
|
|
|
a {
|
|
color: var(--accentcolor);
|
|
}
|
|
|
|
.box1 {
|
|
box-shadow: 6px 6px 0px -1px var(--accentcolor);
|
|
border:2px solid var(--accentcolordark);
|
|
outline:2px solid var(--bordercolor);
|
|
background-color:var(--bgcolor);
|
|
box-sizing: border-box;
|
|
padding:10px;
|
|
width:100%;
|
|
height:60vb;
|
|
overflow-y:auto;
|
|
}
|
|
|
|
.bigtext {
|
|
font-size:large;
|
|
font-weight:bold;
|
|
}
|
|
|
|
strong {
|
|
color:var(--accentcolordark);
|
|
}
|
|
|
|
.box2 {
|
|
box-shadow: 6px 6px 0px -1px var(--accentcolor);
|
|
border:2px solid var(--accentcolordark);
|
|
outline:2px solid var(--bordercolor);
|
|
background-color:var(--bgcolor);
|
|
box-sizing: border-box;
|
|
padding:10px;
|
|
width:100%;
|
|
height:80px;
|
|
}
|
|
|
|
.column {
|
|
display:flex;
|
|
flex-wrap:wrap;
|
|
gap:10px;
|
|
}
|
|
|
|
.footer {
|
|
box-shadow: 6px 6px 0px -1px var(--accentcolor);
|
|
border:2px solid var(--accentcolordark);
|
|
outline:2px solid var(--bordercolor);
|
|
background-color:var(--bgcolor);
|
|
margin-top:var(--gapsize);
|
|
box-sizing: border-box;
|
|
padding:10px;
|
|
width:100%;
|
|
text-align: center;
|
|
} |