.about-object
{
    align-items: center;
    aspect-ratio: 1;
    border-radius: 50%;
    padding: 4vw;
    width: 20vw;
    text-align: center;
}
.about-object #title
{
    font-size: 1.75vw;
    margin-bottom: 2vw;
    margin-top: 1vw;
}
.about-object:nth-child(4n + 1)
{
    background-image: radial-gradient(rgba(255, 255, 255, 0), var(--info-bubble-color-1));

    translate: 55vw 10vw;
}
.about-object:nth-child(4n + 2)
{
    background-image: radial-gradient(rgba(255, 255, 255, 0), var(--info-bubble-color-2));

    translate: 60vw 25vw;
}
.about-object:nth-child(4n + 3)
{
    background-image: radial-gradient(rgba(255, 255, 255, 0), var(--info-bubble-color-3));

    translate: 20vw -20vw;
}
.about-object:nth-child(4n + 4)
{
    background-image: radial-gradient(rgba(255, 255, 255, 0), var(--info-bubble-color-4));

    translate: 15vw -5vw;
}

.big-h3
{
    font-size: 3vw;
}

.more #intro
{
    margin: 0vw 37.5vw;
    text-align: center;
    width: 25vw;
}

.more-items
{
    display: flex;
    margin: 5vw 15vw;
}

.more-items .item
{
    border-radius: 0.75vw;
    color: black;
    cursor: pointer;
    margin: 0vw 3vw;
    padding: 2vw;
    text-align: center;
}
.more-items .item:nth-child(3n + 0)
{
    border: 0.15vw solid var(--info-bubble-color-1);

    transition: all 0.2s;
}
.more-items .item:nth-child(3n + 1)
{
    border: 0.15vw solid var(--info-bubble-color-2);

    transition: all 0.2s;
}
.more-items .item:nth-child(3n + 2)
{
    border: 0.15vw solid var(--info-bubble-color-3);

    transition: all 0.2s;
}
.more-items .item:hover
{
    color: white;
}
.more-items .item:nth-child(3n + 0):hover
{
    background-color: var(--info-bubble-color-1);
}
.more-items .item:nth-child(3n + 1):hover
{
    background-color: var(--info-bubble-color-2);
}
.more-items .item:nth-child(3n + 2):hover
{
    background-color: var(--info-bubble-color-3);
}
.more-items .item h5
{
    margin-bottom: 1.5vw;
}

.quote #person
{
    margin-top: 1.5vw;
    text-align: center;
}
.quote-container #intro
{
    padding-left: 60vw;
    padding-top: 2.5vw;
    text-align: right;
    width: 25vw;
}
.quote-container .quote
{
    color: white;
    padding-bottom: 2vw;
    padding-top: 2vw;
    margin-top: 5vw;
    width: 35vw;
}
.quote-container .quote:nth-child(2n + 0)
{
    padding-left: 5vw;
    padding-right: 5vw;
    text-align: left;
}
.quote-container .quote:nth-child(2n + 1)
{
    margin-left: 55vw;
    padding-left: 5vw;
    padding-right: 5vw;
    text-align: right;
}
.quote-container .quote:nth-child(4n + 1)
{
    background-image: linear-gradient(to left, var(--info-bubble-color-1) 75%, rgba(255, 255, 255, 0));
}
.quote-container .quote:nth-child(4n + 2)
{
    background-image: linear-gradient(to right, var(--info-bubble-color-2) 75%, rgba(255, 255, 255, 0));
}
.quote-container .quote:nth-child(4n + 3)
{
    background-image: linear-gradient(to left, var(--info-bubble-color-3) 75%, rgba(255, 255, 255, 0));
}
.quote-container .quote:nth-child(4n + 4)
{
    background-image: linear-gradient(to right, var(--info-bubble-color-4) 75%, rgba(255, 255, 255, 0));
}

.title
{
    align-items: center;
    display: flex;
    height: max-content;
    width: 100%;
    text-align: center;
}
.title #left
{
    padding: 5% 5% 5% 10%;
    width: 40%;
}
.title #right
{
    padding: 5% 10% 5% 5%;
    width: 40%;
}
.title * h1
{
    color: #303030;
    font-size: 4.5vw;
}
.title * .additional
{
    color: #A0A0A0;
    font-size: 1.375vw;

    transition: color 0.2s;
}
.title * .additional:hover
{
    color: #606060;
}

#title-image
{
    border: 0.1vw solid #303030;
    border-radius: 2vw;
    width: 100%;
}