/*NAME CONTAINER */
.name__container {
    text-align: center;
    width: 95%;
}

.name__container--hello {
    font-size: 3rem;
    font-weight: 800;
}

.name {
    font-size: 1.5rem;
}

/*COINS */
.coins__container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    gap: 2rem;
    margin: 2rem 0;
}


.coins__amount {
    font-size: 3rem;
    min-width: 7rem;
    font-weight: 800;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--main__white);
    border-radius: 50%;
    padding: 1rem;
}

.coins__container-one {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 1rem;
    text-align: center;
}

@media only screen and (max-width: 510px) {

    .coins__container {
        gap: 1.5rem;
    }

    .coins__amount {
        min-width: 6rem;
        font-size: 2.25rem;
    }

    .coins__container-one {

        gap: 0.75rem;
    }

}

@media only screen and (max-width: 360px) {
    .coins__container {
        display: flex;
        flex-direction: column;
        gap: 2rem;
    }

}

/*DIAMONDS*/

.diamonds__container {
    position: relative;
    background-color: var(--main__white);
    width: 100%;
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 5rem 0;
}

p.activitiesInformation__container {
    width: 100%;
    background-color: var(--main__white);
    padding: 1rem 2rem;
    text-align: center;
    text-transform: uppercase;
    font-size: 1.5rem;
    font-weight: 800;
    margin: 2rem 0;
}

.diamonds__wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0.5rem;
    gap: 0.75rem;
}

.diamonds__number {
    font-size: 3rem;
    min-width: 7rem;
    font-weight: 800;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--main__black);
    border-radius: 50%;
    padding: 1rem;
    color: var(--main__yellow);
    border: var(--main__white) solid var(--border__size);
}

.diamonds__description {
    font-weight: 800;
    font-size: 1.5rem;
}

@media only screen and (max-width: 690px) {
    .diamonds__number {
        font-size: 2.5rem;
    }

    .diamonds__description {
        font-size: 1.25rem;
    }
}

@media only screen and (max-width: 510px) {
    .diamonds__number {
        font-size: 2rem;
    }

    .diamonds__description {
        font-size: 1rem;
    }
}

@media only screen and (max-width: 360px) {
    .diamonds__wrapper {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        left: 0.25rem;
        gap: 0.5rem;
    }
}

/*WORKSHOP*/
.workshop__container {
    width: 100%;
    padding-left: 0.75rem;
}

.swiper {
    width: 100%;
}

.swiper-slide a {
    background-color: var(--main__black);
    padding: 2rem 0;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    text-decoration: none;
    gap: 1rem;
}

.swiper-slide a hr {
    width: 100%;
    color: var(--main__yellow);
}

.workshop__heading {
    color: var(--main__yellow);
    font-size: 2rem;
    font-weight: 700;
    text-transform: uppercase;
    padding: 0 0.75rem;
}

.workshop__title {
    font-size: 1.25rem;
    color: var(--main__white);
    font-weight: 500;
    text-transform: uppercase;
    padding: 0 0.75rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
}

.workshop__description {
    color: var(--main__white);
    font-weight: 200;
    padding: 0 0.75rem;
}

p.workshop__description {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
}

.workshop__dateTime {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 0 0.75rem;
}

.workshop__date {
    font-size: 1.5rem;
    min-width: 4rem;
    font-weight: 800;
    background-color: var(--main__white);
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    padding: 0.5rem;
    color: var(--main__black);
}

.workshop__time {
    text-align: left;
    color: var(--main__white);
    font-size: 1.5rem;
    font-weight: 800;
}

@media only screen and (max-width: 455px) {
    .workshop__heading {
        color: var(--main__yellow);
        font-size: 1.5rem;
    }

    .workshop__title {
        font-size: 1rem;
    }

    .workshop__description {
        font-size: 0.75rem;
    }

    .workshop__date {
        font-size: 1.25rem;
    }

    .workshop__time {
        font-size: 1.25rem;
    }
}

@media only screen and (max-width: 390px) {
    .workshop__date {
        font-size: 1rem;
    }

    .workshop__time {
        font-size: 1rem;
    }
}

.code__container {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 2.5rem 0;
    flex-direction: column;
}

.code__container img {
    width: min(90%, 35rem);
    display: flex;
    align-items: center;
    justify-content: center
}
