@import './navbar.css';
@import './footer.css';

.about-club {
    display: flex;
    margin-top: calc(200 * var(--rpx));
    padding-inline: calc(40 * var(--rpx));
    color: var(--alt);
}

.about-club-1 {
    margin-inline-end: calc(30 * var(--rpx));
}

.about-club-header {
    color: #272E67;
    text-align: center;
    font-family: Alexandria, serif;
    font-size: calc(36 * var(--rpx));
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    margin-bottom: calc(50 * var(--rpx));
}

.about-club-img {
    width: calc(686 * var(--rpx));
    height: calc(686 * var(--rpx));
}

.statistics {
    width: 100%;
    height: calc(120 * var(--rpx));
    background: #D9D9D9;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.first-half-stats {
    color: #D95722;
    text-align: center;
    font-family: Alexandria;
    font-size: calc(25 * var(--rpx));
    font-style: normal;
    font-weight: 800;
    line-height: normal;
}

@media only screen and (max-width: 768px) {
    p {
        margin-block: 10px;
    }
}



.second-half-stats {
    color: #272E67;
    text-align: center;
    font-family: Alexandria;
    font-size: calc(25 * var(--rpx));
    font-style: normal;
    font-weight: 800;
    line-height: normal;
}

.stats-img {
    width: calc(224 * var(--rpx));
    height: calc(182 * var(--rpx));
}

.stats-numbers-div {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    row-gap: calc(30 * var(--rpx));
    width: calc(900 * var(--rpx));
    padding-inline-start: calc(100 * var(--rpx));
}

.club-info {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-top: calc(112 * var(--rpx));
}

.club-info-section {
    width: calc(360 * var(--rpx));
}

.club-info-header {
    color: #D95722;
    text-align: center;
    font-family: Alexandria, serif;
    font-size: calc(30 * var(--rpx));
    font-style: normal;
    font-weight: 800;
    line-height: normal;
}



.club-info-links {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    gap: calc(40 * var(--rpx));
    margin-top: calc(103 * var(--rpx));
    margin-bottom: calc(172 * var(--rpx));
}

.orange-filled-btn {
    display: flex;
    width: calc(253 * var(--rpx));
    height: calc(36 * var(--rpx));
    min-width: calc(64 * var(--rpx));
    padding: calc(6 * var(--rpx)) calc(16 * var(--rpx)) calc(6 * var(--rpx)) calc(12 * var(--rpx));
    justify-content: space-between;
    align-items: center;
    gap: calc(8 * var(--rpx));
    flex-shrink: 0;
    text-decoration: none;
}

.circle {
    width: calc(100 * var(--rpx));
    height: calc(100 * var(--rpx));
    aspect-ratio: 1/1;
    border-radius: calc(50 * var(--rpx));
    background: rgba(0, 0, 0, 0.05);
}

.circle-text {
    color: #000;
    text-align: center;
    font-family: Alexandria, serif;
    font-size: calc(20 * var(--rpx));
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}