.rules {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;

    padding: 20px;

    margin-bottom: 90px;
}

.rules__header {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.rules__header-title {
    font-family: "BalsamqSansBold", sans-serif;
    font-size: 40px;
    color: #333333;
}

.rules__section {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
}

.rules__section-title {
    font-family: "BalsamqSansBold", sans-serif;
    font-size: 24px;
    color: #333333;
}

.rules__section-text {
    font-family: "Onest", sans-serif;
    font-size: 14px;
    color: #333333;
}

.rules__section-link {
    font-family: "Onest", sans-serif;
    font-size: 14px;
    color: #00B17C;
}

.rules__section-maker-list {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    padding: 0px 5px;

    list-style: none;

    gap: 10px;
}

@font-face {
    font-family: "Onest";
    src: url("/fonts/Onest-VariableFont_wght.ttf") format("truetype");

    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "BalsamqSansBold";
    src: url("/fonts/BalsamiqSans-Bold.ttf") format("truetype");

    font-weight: normal;
    font-style: normal;
}

@media (min-width:1200px) {
    .rules{
        padding: 32px;
        margin-top: 32px;

        gap: 69px;
    }

    .rules__header-title{
        font-size: 55px;
    }

    .rules__section{
        gap: 24px;
    }
}