main {
    display: flex;
    flex-flow: column;
    position: relative;
}

main > p {
    font-size: 28px;
    margin: 10px;
}
@media(max-width: 1196px) {
    main > p {
        font-size: 24px;
    }
}
@media(max-width: 905px) {
    main > p {
        font-size: 22px;
    }
}

#bioButtons {
    width: 100%;
    flex-grow: 1;
    display: flex;
    justify-content: space-evenly;
    column-gap: 15%;
}
#bioButtons > div {
    display: flex;
}

img {
    max-height: 100%;
    max-width: 100%;
}

#cameronContainer {
    align-items: end;
}
#cameronContainer a {
    position: relative;
}
#cameronContainer a:hover {
    filter: drop-shadow(0 0 16px black);
}
#handwrittenName {
    position: absolute;
    top: 8%;
    right: -23%;
    width: 50%;
}

#hopperelecContainer {
    align-items: center;
}
@media(min-width: 856px) {
    #hopperelecContainer a {
        padding: 10px;
        border: var(--border);
    }
}
#hopperelecContainer a:hover {
    box-shadow: 0 0 16px black;
}
#hopperelecContainer svg {
    fill: white;
}