.home {
    padding-top: 8vh;
}

.home .bento {
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 1vh;
}

.home .education {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-color: rgba(var(--background-800-rgb), .2);
    border: 2px solid var(--background-300);
    border-radius: 20px;
    backdrop-filter: blur(3px);
}

.home .card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    border-radius: 20px;
}

.home .card h3,
.home .card h4,
.home .card p {
    margin: 0;
    padding: 0;
}

.home .card h3 {
    font-size: 0.9em;
}

.home .card h4 {
    font-size: .8em;
}

.home .card p {
    font-size: 0.7em;
}

.home .card svg {
    height: 5vh;
    width: auto;
    margin-right: 5%;
    fill: var(--text-700);
}

.home .hobbies {
    display: flex;
    justify-content: space-around;
    height: 100%;
    background-color: rgba(var(--background-800-rgb), .2);
    border: 2px solid var(--background-300);
    border-radius: 20px;
    backdrop-filter: blur(3px);
}

.home .hobbies .icon {
    width: 22%;
    display: flex;
    justify-content: center;
    align-items: center;
    filter: drop-shadow(2px 4px 6px black);
}

.home .hobbies svg {
    fill: var(--text-700);
    width: 70%;
}

.home .about-me {
    height: 100%;
    width: 100%;

    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;

    background-color: rgba(var(--background-800-rgb), .2);
    border: 2px solid var(--background-300);
    border-radius: 20px;
    backdrop-filter: blur(3px);
}

.home p,
.home h1,
.home h2,
.home h3,
.home h4 {
    color: var(--text-800);
    padding: 10px;
    margin: 0;
}

.home .about-me img {
    height: 15vh;
    width: 15vh;
    border-radius: 50%;
    margin-bottom: 10px;
    object-fit: cover;
    filter: drop-shadow(2px 4px 6px black);
}

.home .about-me h2 {
    font-size: 1rem;
}

.home .about-me h3 {
    font-size: 0.7rem;
    margin: 0;
}

.home .about-me p {
    font-size: 0.6rem;
    margin: 0;
}

.home .random-project {
    background-color: rgba(var(--background-800-rgb), .2);
    border: 2px solid var(--background-300);
    border-radius: 20px;
    height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    backdrop-filter: blur(3px);
}

.home .random-project-button {
    background-color: var(--background-800);
    color: var(--text-200);
    border: 2px solid var(--text-200);
    height: fit-content;
    padding: 10px 20px;
    border-radius: 20px;
    cursor: pointer;
    font-size: 1rem;
    transition: all 0.3s;
}

.home .profiles {
    position: relative;
    overflow: hidden;
    height: 200px;

    background-color: rgba(var(--background-800-rgb), .2);
    border: 2px solid var(--background-300);
    border-radius: 20px;
    backdrop-filter: blur(3px);
}

.home .profiles .profile {
    position: absolute;
    height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;   
}

.home .profiles .hidden {
    left: 100%;
}