body {
/* keeps stuff centered and from touching edges */
            max-width: 800px;
            margin: 0 auto;
            padding: 0 20px;
/*-- colors */
            background-color: white;
            background: linear-gradient(lightskyblue, #FFD580);
            min-height: 100vh;
/* fonts */
            font-family: Georgia, serif;
            font-size: 18px;
            color: black;
        }
/* headers */
        h1 {
            color: #450820;
            text-align: center;
        }
/* links */    
        a {
            color: mediumvioletred;
        }
        a:hover {
            background-color: gold;
        }
        a:visited {
            color: violet;
        }
/* images */
        img {
            margin: 5px;
        }
/* classes */
        .infobox {
            background-color: white;
            border-color: hotpink;
            border-style: solid;
            border-width: 4px;
            border-radius: 12px;
            padding: 10px;
        }
        .page {
            display: flex;
            gap: 20px;
            align-items: flex-start;
        }
        .sidebar {
            background-color: white;
            border-color: hotpink;
            border-style: solid;
            border-width: 4px;
            border-radius: 12px;
            position: sticky;
            top: 50%;
            transform: translateY(-50%);
            width: 150px;
            flex-shrink: 0;
            padding: 10px;
        }
        .main {
            min-width: 0;
        }