@font-face {
font-family: 'Grilled Cheese';
src: url(https://file.garden/ZceRIIBo0FZgJaaA/font/GrilledCheese%20BTN%20Regular.woff);
}

@font-face {
font-family: 'Shag Expert Lounge';
src: url(https://file.garden/ZceRIIBo0FZgJaaA/font/ShagExpert-Lounge.otf);
}

:root {
--p-size: 25px;
--p-font: 'Shag Expert Lounge', "Brush Script MT", cursive;
--header-font: 'Grilled Cheese', Copperplate, Papyrus, fantasy;    
--border-style: 5px solid;
--border-radius: 35px;
--margin-bottom: -10px;
--header-margin: -18px;
--pixel-img: pixelated;
--marker: "𖦹 ";
}

body {
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
cursor: default;
}

summary {
font-family: var(--p-font);
font-size: var(--p-size);
}
summary::marker {
content: var(--marker);
font-size: var(--p-size);
}
summary:hover {
cursor: pointer;
}
.sumtitle {
color: white;
font-family: var(--p-font);
font-size: var(--p-size);
}

a:link {
color: yellow;
text-decoration: underline;
}
a:visited {
color: yellow;
text-decoration: underline;
}
a:hover {
color: orange;
text-decoration: underline wavy;
cursor: pointer;
}

::selection {
color: orange;
background-color: yellow;
}

p {
font-family: var(--p-font);
font-size: var(--p-size);
}

button {
border: none;
padding-left: 50px;
padding-right: 50px;
font-family: var(--header-font);
color: white;
height: 50px;
font-size: 30px;
text-align: center;
white-space: nowrap;
text-overflow: ellipsis;
border-radius: 50%;
}
button:hover {
cursor: pointer;
transform: scale(1.3);
}

header {
text-align: center;
font-family: var(--header-font);
color: white;
font-size: 75px;
padding: 10px;
margin-bottom: var(--header-margin);
}

h1 {
font-family: var(--header-font);
font-size: 45px;
font-weight: normal;
color: white;
margin-bottom: var(--margin-bottom);
}

h2 {
font-family: var(--header-font);
font-size: 30px;
font-weight: normal;
text-decoration: underline;
margin-bottom: var(--margin-bottom);
}

main {
padding-left: 40px;
padding-right: 40px;
}

li { 
font-size: var(--text);
font-family: var(--p-font);
margin: -10px;
}
li::marker {
content: var(--marker);
font-size: var(--p-size);
text-shadow: none;
}

hgroup {
text-align: center;
}

.home {
position: absolute;
top: 20px; 
left: 30px;
}
.home:hover {
cursor: pointer;
transform: scale(1.3);
filter: drop-shadow(0px 0px 10px white);
}

.sub {
font-family: var(--p-font);
font-size: var(--p-size);
color: white;
}

.imgleft {
float: left;
}
.imgright {
float: right;
}

.bar {
padding-top: 5px;
padding-bottom: 10px;
text-align: center;
}