body {font-family: monospace; font-size: min(2vw, 16px); background-image: url(homephotos/starstwinkle.gif); height: 100%; overflow-y: hidden;}

/* divs */

div.main {width:65vw; display: block; text-align: center; display: flex; margin-left:15vw; max-height: 80vh; scrollbar-width: none;}

/* In Index */

div.leftmain {width: fit-content; width: 20vw; height: 38vw;}

div.rightmain {border-radius: 20px; padding: 2%; margin: 4px; background-color: #aa8ae4; width: 70vw; overflow-y: scroll; border: #f5cb5c 3px outset; scrollbar-width: none}

div.bookmark {margin-top: 20px; margin-bottom: 20px; padding: 20px;border-radius: 3%; background-color: #fce5c2;}

/* text */

@font-face { font-family: Hammer; src: url(homephotos/Hammer.ttf); }

a {text-decoration: inherit; color: #380d83;}

h1 {color: white; text-align: center; padding: 2%;}

h1, h2, h3, h4 {font-family:"Hammer"; text-transform:uppercase;}

span {color: #380d83;}

span:hover {color: white;}

a:hover {color: white;}

hr {border: black 4px double;}

img {display: flex; height: 40vw; top:6vh; left: 64vw;}


img.a {display: flex; height: 40vw; margin-left: auto; margin-right: auto; border: #f5cb5c 3px solid;}

button {font-family: Hammer; font-size: min(2vw, 16px);}

@media only screen and (max-width: 1000px) {
img {visibility: hidden;}
div.main {width:75vw; margin-left:10vw;}
div.leftmain {width: 0vw;}
div.rightmain {width: 100vw;}
}