.main {
    vertical-align: middle;
    margin:3%;
    background-color: #3b4252;
    background: conic-gradient(from 90deg ,#3b4252, #3b4252, #434c5e, #4c566a);
    height: max-content;
    padding-bottom: 2%;
    width: 40%;
    color:white;
    overflow: none;
    border: 4px dotted #a5bae5;
}
.main:hover {
    border: 4px solid #a5bae5;
}

@keyframes slide {
    0% {
        background-position-x: 0px;
        background-position-y: 0px;
    }
    100% {
        background-position-x: 1920px;
        background-position-y: 1080px;
    }

}
body {
    display:flex;
    justify-content: center;
    align-items: centers;
    background-image: url(assets/background.jpg);
    animation: slide 10s linear infinite;
    /* background-color: rgba(191, 97, 106, 1);
    background: conic-gradient(from 90deg , #8fbcbb, #88c0d0, #81a1c1, #5e81ac); */
}
a:link { color: inherit; text-decoration: none; }
a:visited { color: inherit; text-decoration: none; }
a:active { color: inherit; text-decoration: none; }
a:hover { font-style: italic; text-decoration: none; color: inherit;}
.toolbar {
    text-align: center;
    background-color: #373e4c;
    color:#6e7c99;
    transform: translateY(-20px);
}
h1:hover {
    font-style: italic;
}
/* bleh */
.socials {
    a {
        text-decoration: underline;
        color:#8fbcbb
    }
}
.ol {
    li {
        color: #a1b3dd
    }
}
.info {
    padding: 3%;
    margin-top: -6%;
}
.info h1 { 
    color: #d8dee9;
}
.sticker1 {
    position: absolute;
    z-index: 2;
    top: 75%;
    left: 65%;
    rotate: -20deg;
}
.sticker2 {
    position: absolute;
    z-index: 2;
    top:26%;
    left: 4%;
    rotate: -23deg;
}
.sticker3 {
    position: absolute;
    z-index: 2;
    left:85%;
    top:50%;
    rotate: 50deg;
}
hr{
    background-color: #7b8baa;
    color: #7b8baa;
    height: 5px;
    width: var(max-content-200px);
    border-radius: 10px;
}