@import "animations.css";

:root{
    font-size: 18px;
    width: 100%;
    height: 100%;
    font-family: 'Courier New', Courier, monospace
}

body {
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 15px;
    margin: 5px auto; 
    max-width: 850px;

    background-color: #2A7B9B;
    background: linear-gradient(160deg, beige 10%, #FFEEBC 120%);
    background-attachment: fixed;
    background-repeat: no-repeat;
}

img {
    width: 100%;
}

ul > li:hover {
    background-color: whitesmoke;
    border: solid;
    border-width: 0.01vw; 
    border-color: darkslateblue;
    max-width: 480px;
    padding-right: 15px;
    justify-content: center;
    color: darkorchid;
}

.titlepfp {
    float: left;
    width: 75px; 
    border: solid;
    border-color: #0A0A23;
    border-width: 2px;
}

.titlepfp:hover {
    animation-name: SpinnyAnim;
    animation-duration: 1s;
    animation-timing-function: ease-out;
}

.homelink {
    color: black;
}