/*GENERAL*/
main {
    color: var(--pink) !important;
    padding: 2em;
}

main#collection {
    color: var(--yellow) !important;
}

ul {
    list-style: none;
    padding-left: 0em;
}

li { padding: 0.15em 0em; }

/*HEADER*/
.main-head,
.person-head,
.artwork-head {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
}

.main-head > * {
    max-width: 50%;
}

#extra { font-weight: 1000; }

/*LIST*/
#community-list,
#artworks-list {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
    padding-left: 0em;
}

#artworks-list {
    justify-content: space-around;
}

/*PERSON*/
.person,
.artwork {
    display: flex;
    flex-flow: column nowrap;
    margin: 0.5em;
}

/*Images*/
.person img,
.person-head img,
.artwork img,
.head img {
    border-radius: 10em;
    width: 15em;
    margin-bottom: 1em;
}
.person img:hover { filter: drop-shadow(0 0 0.75rem var(--pink)); }
.artwork img:hover { filter: drop-shadow(0 0 0.75rem var(--yellow)); }

.person-info,
.artwork-info { max-width: 15em; }
.person-info > *,
.artwork-info> * {margin: 0em; }

/*links*/
#community a { color: var(--pink); }
a { color: var(--yellow); }

.person-info a:hover {
    color: var(--pink);
    border: none;
}

.artwork-info a:hover {
    color: var(--yellow);
    border: none;
}

.person-social a,
.main-head a { 
    color: var(--pink);
    border-bottom: 2px solid var(--pink)
}
.person-social a:hover,
.main-head a:hover {
    color: var(--orange);
    border-bottom: 2px solid var(--orange);
}

/*Modal*/
.trigger-modal:hover {
    cursor: pointer;
    color: var(--pink);
}

/*PERSON SITES*/

.person-head > *,
.artwork-head > * {
    max-width: 50%;
}