
:root {
    --main-color: #334d9a;
    --hover-color: #77a6f8;
    --sub-color: #727274;
}

html, body {
    color: var(--main-color);
}


.my-btn.no1 {
    color: white;
    background-color: var(--main-color);
}

    .my-btn.no1:hover {
        -webkit-transform: translateY(-2px);
        transform: translateY(-2px);
        background: var(--main-color);
        box-shadow: 0 7px 14px rgba(50, 50, 93, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
    }

    .my-btn.no1:active {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        background-color: var(--hover-color);
    }

.my-btn.no2 {
    color: var(--main-color);
    background: white;
}

    .my-btn.no2:hover {
        -webkit-transform: translateY(-2px);
        transform: translateY(-2px);
        color: var(--hover-color);
        box-shadow: 0 7px 14px rgba(50, 50, 93, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
    }

    .my-btn.no2:active {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        color: var(--main-color);
    }

.my-table .control input:checked ~ .control__indicator {
    background: var(--main-color);
}
.my-pagination li a {
    color: var(--main-color)
}