:root {
    --cung-height: 197px;
    --hoang-dao-color: #ff0000;
    --hac-dao-color: #95149A;
}

html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    margin: 0;
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

.loading {
    justify-content: center;
    align-items: center;
    display: flex;
    height: 100vh;
}

.yinyang {
    --d: 50vmin;
    --f: 0.5;
    --t: 1s;
    display: flex;
    align-items: center;
    width: var(--d);
    height: var(--d);
    border-radius: 50%;
    background: linear-gradient(black 50%, white 0);
}

    .yinyang:before, .yinyang:after {
        flex: 1;
        border: solid calc(var(--d)/6) white;
        height: calc(var(--d)/6);
        border-radius: 50%;
        transform-origin: 0 50%;
        transform: scale(var(--f));
        background: black;
        animation: s 1s ease-in-out infinite alternate;
        content: ''
    }

    .yinyang:after {
        border-color: black;
        transform-origin: 100% 50%;
        background: white;
        animation-delay: -1s;
    }

@keyframes s {
    to {
        transform: scale(1.5);
    }
}

.rz-radiobutton-box {
    width: unset;
}

.rz-label {
    color: var(--rz-text-color);
}