*, *::before, *::after {
    box-sizing: border-box
}

html {
    font-family: Arial, sans-serif
}

.nb-button.default {
    display: inline-block;
    padding: .5em 1em;
    background-color: #fff;
    color: #000;
    border: 2.5px solid #000;
    box-shadow: 5px 5px 0 #000;
    cursor: pointer;
    font-size: .875rem;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    outline: none;
    transition: background .15s cubic-bezier(0.77, 0, 0.18, 1), color .15s cubic-bezier(0.77, 0, 0.18, 1), box-shadow .15s cubic-bezier(0.77, 0, 0.18, 1), transform .1s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-button.default {
        padding: .6em 1.2em;
        border-width: 3px;
        box-shadow: 6px 6px 0 #000;
        font-size: .9rem
    }
}

@media (min-width: 768px) {
    .nb-button.default {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 7px 7px 0 #000;
        font-size: 1rem
    }
}

.nb-button.default:hover, .nb-button.default:focus {
    background-color: #aaa;
    color: #000;
    box-shadow: 2px 2px 0 #000;
    outline: none;
    transform: translate(2px, 2px)
}

.nb-button.default:active {
    box-shadow: none;
    transform: translate(4px, 4px)
}

.nb-button.default.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-button.orange {
    display: inline-block;
    padding: .5em 1em;
    background-color: #ff5733;
    color: #fff;
    border: 2.5px solid #000;
    box-shadow: 5px 5px 0 #000;
    cursor: pointer;
    font-size: .875rem;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    outline: none;
    transition: background .15s cubic-bezier(0.77, 0, 0.18, 1), color .15s cubic-bezier(0.77, 0, 0.18, 1), box-shadow .15s cubic-bezier(0.77, 0, 0.18, 1), transform .1s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-button.orange {
        padding: .6em 1.2em;
        border-width: 3px;
        box-shadow: 6px 6px 0 #000;
        font-size: .9rem
    }
}

@media (min-width: 768px) {
    .nb-button.orange {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 7px 7px 0 #000;
        font-size: 1rem
    }
}

.nb-button.orange:hover, .nb-button.orange:focus {
    background-color: #d64b2b;
    color: #fff;
    box-shadow: 2px 2px 0 #000;
    outline: none;
    transform: translate(2px, 2px)
}

.nb-button.orange:active {
    box-shadow: none;
    transform: translate(4px, 4px)
}

.nb-button.orange.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-button.blue {
    display: inline-block;
    padding: .5em 1em;
    background-color: #0077b6;
    color: #fff;
    border: 2.5px solid #000;
    box-shadow: 5px 5px 0 #000;
    cursor: pointer;
    font-size: .875rem;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    outline: none;
    transition: background .15s cubic-bezier(0.77, 0, 0.18, 1), color .15s cubic-bezier(0.77, 0, 0.18, 1), box-shadow .15s cubic-bezier(0.77, 0, 0.18, 1), transform .1s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-button.blue {
        padding: .6em 1.2em;
        border-width: 3px;
        box-shadow: 6px 6px 0 #000;
        font-size: .9rem
    }
}

@media (min-width: 768px) {
    .nb-button.blue {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 7px 7px 0 #000;
        font-size: 1rem
    }
}

.nb-button.blue:hover, .nb-button.blue:focus {
    background-color: #005785;
    color: #fff;
    box-shadow: 2px 2px 0 #000;
    outline: none;
    transform: translate(2px, 2px)
}

.nb-button.blue:active {
    box-shadow: none;
    transform: translate(4px, 4px)
}

.nb-button.blue.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-button.green {
    display: inline-block;
    padding: .5em 1em;
    background-color: #40d39c;
    color: #fff;
    border: 2.5px solid #000;
    box-shadow: 5px 5px 0 #000;
    cursor: pointer;
    font-size: .875rem;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    outline: none;
    transition: background .15s cubic-bezier(0.77, 0, 0.18, 1), color .15s cubic-bezier(0.77, 0, 0.18, 1), box-shadow .15s cubic-bezier(0.77, 0, 0.18, 1), transform .1s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-button.green {
        padding: .6em 1.2em;
        border-width: 3px;
        box-shadow: 6px 6px 0 #000;
        font-size: .9rem
    }
}

@media (min-width: 768px) {
    .nb-button.green {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 7px 7px 0 #000;
        font-size: 1rem
    }
}

.nb-button.green:hover, .nb-button.green:focus {
    background-color: #30ac7e;
    color: #fff;
    box-shadow: 2px 2px 0 #000;
    outline: none;
    transform: translate(2px, 2px)
}

.nb-button.green:active {
    box-shadow: none;
    transform: translate(4px, 4px)
}

.nb-button.green.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-button.sky-blue {
    display: inline-block;
    padding: .5em 1em;
    background-color: #b9e2f8;
    color: #fff;
    border: 2.5px solid #000;
    box-shadow: 5px 5px 0 #000;
    cursor: pointer;
    font-size: .875rem;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    outline: none;
    transition: background .15s cubic-bezier(0.77, 0, 0.18, 1), color .15s cubic-bezier(0.77, 0, 0.18, 1), box-shadow .15s cubic-bezier(0.77, 0, 0.18, 1), transform .1s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-button.sky-blue {
        padding: .6em 1.2em;
        border-width: 3px;
        box-shadow: 6px 6px 0 #000;
        font-size: .9rem
    }
}

@media (min-width: 768px) {
    .nb-button.sky-blue {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 7px 7px 0 #000;
        font-size: 1rem
    }
}

.nb-button.sky-blue:hover, .nb-button.sky-blue:focus {
    background-color: #91bed6;
    color: #fff;
    box-shadow: 2px 2px 0 #000;
    outline: none;
    transform: translate(2px, 2px)
}

.nb-button.sky-blue:active {
    box-shadow: none;
    transform: translate(4px, 4px)
}

.nb-button.sky-blue.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-button.pale-red {
    display: inline-block;
    padding: .5em 1em;
    background-color: #ffc5c8;
    color: #fff;
    border: 2.5px solid #000;
    box-shadow: 5px 5px 0 #000;
    cursor: pointer;
    font-size: .875rem;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    outline: none;
    transition: background .15s cubic-bezier(0.77, 0, 0.18, 1), color .15s cubic-bezier(0.77, 0, 0.18, 1), box-shadow .15s cubic-bezier(0.77, 0, 0.18, 1), transform .1s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-button.pale-red {
        padding: .6em 1.2em;
        border-width: 3px;
        box-shadow: 6px 6px 0 #000;
        font-size: .9rem
    }
}

@media (min-width: 768px) {
    .nb-button.pale-red {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 7px 7px 0 #000;
        font-size: 1rem
    }
}

.nb-button.pale-red:hover, .nb-button.pale-red:focus {
    background-color: #ffb2b2;
    color: #fff;
    box-shadow: 2px 2px 0 #000;
    outline: none;
    transform: translate(2px, 2px)
}

.nb-button.pale-red:active {
    box-shadow: none;
    transform: translate(4px, 4px)
}

.nb-button.pale-red.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-button.pale-violet {
    display: inline-block;
    padding: .5em 1em;
    background-color: #bc98cb;
    color: #fff;
    border: 2.5px solid #000;
    box-shadow: 5px 5px 0 #000;
    cursor: pointer;
    font-size: .875rem;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    outline: none;
    transition: background .15s cubic-bezier(0.77, 0, 0.18, 1), color .15s cubic-bezier(0.77, 0, 0.18, 1), box-shadow .15s cubic-bezier(0.77, 0, 0.18, 1), transform .1s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-button.pale-violet {
        padding: .6em 1.2em;
        border-width: 3px;
        box-shadow: 6px 6px 0 #000;
        font-size: .9rem
    }
}

@media (min-width: 768px) {
    .nb-button.pale-violet {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 7px 7px 0 #000;
        font-size: 1rem
    }
}

.nb-button.pale-violet:hover, .nb-button.pale-violet:focus {
    background-color: #b482c9;
    color: #fff;
    box-shadow: 2px 2px 0 #000;
    outline: none;
    transform: translate(2px, 2px)
}

.nb-button.pale-violet:active {
    box-shadow: none;
    transform: translate(4px, 4px)
}

.nb-button.pale-violet.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-button.soft-blue {
    display: inline-block;
    padding: .5em 1em;
    background-color: #4799ae;
    color: #fff;
    border: 2.5px solid #000;
    box-shadow: 5px 5px 0 #000;
    cursor: pointer;
    font-size: .875rem;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    outline: none;
    transition: background .15s cubic-bezier(0.77, 0, 0.18, 1), color .15s cubic-bezier(0.77, 0, 0.18, 1), box-shadow .15s cubic-bezier(0.77, 0, 0.18, 1), transform .1s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-button.soft-blue {
        padding: .6em 1.2em;
        border-width: 3px;
        box-shadow: 6px 6px 0 #000;
        font-size: .9rem
    }
}

@media (min-width: 768px) {
    .nb-button.soft-blue {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 7px 7px 0 #000;
        font-size: 1rem
    }
}

.nb-button.soft-blue:hover, .nb-button.soft-blue:focus {
    background-color: #378589;
    color: #fff;
    box-shadow: 2px 2px 0 #000;
    outline: none;
    transform: translate(2px, 2px)
}

.nb-button.soft-blue:active {
    box-shadow: none;
    transform: translate(4px, 4px)
}

.nb-button.soft-blue.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-button.pale-cyan {
    display: inline-block;
    padding: .5em 1em;
    background-color: #b9e7de;
    color: #fff;
    border: 2.5px solid #000;
    box-shadow: 5px 5px 0 #000;
    cursor: pointer;
    font-size: .875rem;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    outline: none;
    transition: background .15s cubic-bezier(0.77, 0, 0.18, 1), color .15s cubic-bezier(0.77, 0, 0.18, 1), box-shadow .15s cubic-bezier(0.77, 0, 0.18, 1), transform .1s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-button.pale-cyan {
        padding: .6em 1.2em;
        border-width: 3px;
        box-shadow: 6px 6px 0 #000;
        font-size: .9rem
    }
}

@media (min-width: 768px) {
    .nb-button.pale-cyan {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 7px 7px 0 #000;
        font-size: 1rem
    }
}

.nb-button.pale-cyan:hover, .nb-button.pale-cyan:focus {
    background-color: #a0e5d7;
    color: #fff;
    box-shadow: 2px 2px 0 #000;
    outline: none;
    transform: translate(2px, 2px)
}

.nb-button.pale-cyan:active {
    box-shadow: none;
    transform: translate(4px, 4px)
}

.nb-button.pale-cyan.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-button.pale-yellow {
    display: inline-block;
    padding: .5em 1em;
    background-color: #fdfd96;
    color: #000;
    border: 2.5px solid #000;
    box-shadow: 5px 5px 0 #000;
    cursor: pointer;
    font-size: .875rem;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    outline: none;
    transition: background .15s cubic-bezier(0.77, 0, 0.18, 1), color .15s cubic-bezier(0.77, 0, 0.18, 1), box-shadow .15s cubic-bezier(0.77, 0, 0.18, 1), transform .1s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-button.pale-yellow {
        padding: .6em 1.2em;
        border-width: 3px;
        box-shadow: 6px 6px 0 #000;
        font-size: .9rem
    }
}

@media (min-width: 768px) {
    .nb-button.pale-yellow {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 7px 7px 0 #000;
        font-size: 1rem
    }
}

.nb-button.pale-yellow:hover, .nb-button.pale-yellow:focus {
    background-color: #fcfc7e;
    color: #000;
    box-shadow: 2px 2px 0 #000;
    outline: none;
    transform: translate(2px, 2px)
}

.nb-button.pale-yellow:active {
    box-shadow: none;
    transform: translate(4px, 4px)
}

.nb-button.pale-yellow.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.rounded {
    border-radius: .7em
}

.nb-input.default {
    padding: .5em .75em;
    background-color: #fff;
    color: #000;
    border: 2px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    nb-button blue    font-size: .875rem;
    font-weight: 900;
    text-align: left;
    text-decoration: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .nb-input.default {
        padding: .6em 1em;
        border-width: 2.5px;
        box-shadow: 4px 4px 0px 0px #000;
        font-size: .9rem;
        max-width: 350px
    }
}

@media (min-width: 768px) {
    .nb-input.default {
        padding: .7em 1.25em;
        border-width: 3px;
        box-shadow: 5px 5px 0px 0px #000;
        font-size: 1rem;
        max-width: 400px
    }
}

@media (min-width: 992px) {
    .nb-input.default {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 5px 5px 0px 0px #000;
        max-width: 450px
    }
}

.nb-input.default:hover {
    background-color: #aaa
}

.nb-input.default:focus {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px 0px #000
}

.nb-input.default.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-input.default::placeholder {
    color: #000;
    opacity: .7
}

.nb-input.orange {
    padding: .5em .75em;
    background-color: #ff5733;
    color: #000;
    border: 2px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    nb-button blue    font-size: .875rem;
    font-weight: 900;
    text-align: left;
    text-decoration: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .nb-input.orange {
        padding: .6em 1em;
        border-width: 2.5px;
        box-shadow: 4px 4px 0px 0px #000;
        font-size: .9rem;
        max-width: 350px
    }
}

@media (min-width: 768px) {
    .nb-input.orange {
        padding: .7em 1.25em;
        border-width: 3px;
        box-shadow: 5px 5px 0px 0px #000;
        font-size: 1rem;
        max-width: 400px
    }
}

@media (min-width: 992px) {
    .nb-input.orange {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 5px 5px 0px 0px #000;
        max-width: 450px
    }
}

.nb-input.orange:hover {
    background-color: #d64b2b
}

.nb-input.orange:focus {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px 0px #000
}

.nb-input.orange.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-input.orange::placeholder {
    color: #000;
    opacity: .7
}

.nb-input.blue {
    padding: .5em .75em;
    background-color: #0077b6;
    color: #fff;
    border: 2px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    nb-button blue    font-size: .875rem;
    font-weight: 900;
    text-align: left;
    text-decoration: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .nb-input.blue {
        padding: .6em 1em;
        border-width: 2.5px;
        box-shadow: 4px 4px 0px 0px #000;
        font-size: .9rem;
        max-width: 350px
    }
}

@media (min-width: 768px) {
    .nb-input.blue {
        padding: .7em 1.25em;
        border-width: 3px;
        box-shadow: 5px 5px 0px 0px #000;
        font-size: 1rem;
        max-width: 400px
    }
}

@media (min-width: 992px) {
    .nb-input.blue {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 5px 5px 0px 0px #000;
        max-width: 450px
    }
}

.nb-input.blue:hover {
    background-color: #005785
}

.nb-input.blue:focus {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px 0px #000
}

.nb-input.blue.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-input.blue::placeholder {
    color: #fff;
    opacity: .7
}

.nb-input.green {
    padding: .5em .75em;
    background-color: #40d39c;
    color: #fff;
    border: 2px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    nb-button blue    font-size: .875rem;
    font-weight: 900;
    text-align: left;
    text-decoration: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .nb-input.green {
        padding: .6em 1em;
        border-width: 2.5px;
        box-shadow: 4px 4px 0px 0px #000;
        font-size: .9rem;
        max-width: 350px
    }
}

@media (min-width: 768px) {
    .nb-input.green {
        padding: .7em 1.25em;
        border-width: 3px;
        box-shadow: 5px 5px 0px 0px #000;
        font-size: 1rem;
        max-width: 400px
    }
}

@media (min-width: 992px) {
    .nb-input.green {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 5px 5px 0px 0px #000;
        max-width: 450px
    }
}

.nb-input.green:hover {
    background-color: #30ac7e
}

.nb-input.green:focus {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px 0px #000
}

.nb-input.green.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-input.green::placeholder {
    color: #fff;
    opacity: .7
}

.nb-input.sky-blue {
    padding: .5em .75em;
    background-color: #b9e2f8;
    color: #fff;
    border: 2px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    nb-button blue    font-size: .875rem;
    font-weight: 900;
    text-align: left;
    text-decoration: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .nb-input.sky-blue {
        padding: .6em 1em;
        border-width: 2.5px;
        box-shadow: 4px 4px 0px 0px #000;
        font-size: .9rem;
        max-width: 350px
    }
}

@media (min-width: 768px) {
    .nb-input.sky-blue {
        padding: .7em 1.25em;
        border-width: 3px;
        box-shadow: 5px 5px 0px 0px #000;
        font-size: 1rem;
        max-width: 400px
    }
}

@media (min-width: 992px) {
    .nb-input.sky-blue {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 5px 5px 0px 0px #000;
        max-width: 450px
    }
}

.nb-input.sky-blue:hover {
    background-color: #91bed6
}

.nb-input.sky-blue:focus {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px 0px #000
}

.nb-input.sky-blue.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-input.sky-blue::placeholder {
    color: #fff;
    opacity: .7
}

.nb-input.pale-red {
    padding: .5em .75em;
    background-color: #ffc5c8;
    color: #fff;
    border: 2px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    nb-button blue    font-size: .875rem;
    font-weight: 900;
    text-align: left;
    text-decoration: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .nb-input.pale-red {
        padding: .6em 1em;
        border-width: 2.5px;
        box-shadow: 4px 4px 0px 0px #000;
        font-size: .9rem;
        max-width: 350px
    }
}

@media (min-width: 768px) {
    .nb-input.pale-red {
        padding: .7em 1.25em;
        border-width: 3px;
        box-shadow: 5px 5px 0px 0px #000;
        font-size: 1rem;
        max-width: 400px
    }
}

@media (min-width: 992px) {
    .nb-input.pale-red {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 5px 5px 0px 0px #000;
        max-width: 450px
    }
}

.nb-input.pale-red:hover {
    background-color: #ffb2b2
}

.nb-input.pale-red:focus {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px 0px #000
}

.nb-input.pale-red.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-input.pale-red::placeholder {
    color: #fff;
    opacity: .7
}

.nb-input.pale-violet {
    padding: .5em .75em;
    background-color: #bc98cb;
    color: #fff;
    border: 2px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    nb-button blue    font-size: .875rem;
    font-weight: 900;
    text-align: left;
    text-decoration: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .nb-input.pale-violet {
        padding: .6em 1em;
        border-width: 2.5px;
        box-shadow: 4px 4px 0px 0px #000;
        font-size: .9rem;
        max-width: 350px
    }
}

@media (min-width: 768px) {
    .nb-input.pale-violet {
        padding: .7em 1.25em;
        border-width: 3px;
        box-shadow: 5px 5px 0px 0px #000;
        font-size: 1rem;
        max-width: 400px
    }
}

@media (min-width: 992px) {
    .nb-input.pale-violet {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 5px 5px 0px 0px #000;
        max-width: 450px
    }
}

.nb-input.pale-violet:hover {
    background-color: #b482c9
}

.nb-input.pale-violet:focus {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px 0px #000
}

.nb-input.pale-violet.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-input.pale-violet::placeholder {
    color: #fff;
    opacity: .7
}

.nb-input.soft-blue {
    padding: .5em .75em;
    background-color: #4799ae;
    color: #fff;
    border: 2px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    nb-button blue    font-size: .875rem;
    font-weight: 900;
    text-align: left;
    text-decoration: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .nb-input.soft-blue {
        padding: .6em 1em;
        border-width: 2.5px;
        box-shadow: 4px 4px 0px 0px #000;
        font-size: .9rem;
        max-width: 350px
    }
}

@media (min-width: 768px) {
    .nb-input.soft-blue {
        padding: .7em 1.25em;
        border-width: 3px;
        box-shadow: 5px 5px 0px 0px #000;
        font-size: 1rem;
        max-width: 400px
    }
}

@media (min-width: 992px) {
    .nb-input.soft-blue {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 5px 5px 0px 0px #000;
        max-width: 450px
    }
}

.nb-input.soft-blue:hover {
    background-color: #378589
}

.nb-input.soft-blue:focus {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px 0px #000
}

.nb-input.soft-blue.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-input.soft-blue::placeholder {
    color: #fff;
    opacity: .7
}

.nb-input.pale-cyan {
    padding: .5em .75em;
    background-color: #b9e7de;
    color: #fff;
    border: 2px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    nb-button blue    font-size: .875rem;
    font-weight: 900;
    text-align: left;
    text-decoration: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .nb-input.pale-cyan {
        padding: .6em 1em;
        border-width: 2.5px;
        box-shadow: 4px 4px 0px 0px #000;
        font-size: .9rem;
        max-width: 350px
    }
}

@media (min-width: 768px) {
    .nb-input.pale-cyan {
        padding: .7em 1.25em;
        border-width: 3px;
        box-shadow: 5px 5px 0px 0px #000;
        font-size: 1rem;
        max-width: 400px
    }
}

@media (min-width: 992px) {
    .nb-input.pale-cyan {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 5px 5px 0px 0px #000;
        max-width: 450px
    }
}

.nb-input.pale-cyan:hover {
    background-color: #a0e5d7
}

.nb-input.pale-cyan:focus {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px 0px #000
}

.nb-input.pale-cyan.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-input.pale-cyan::placeholder {
    color: #fff;
    opacity: .7
}

.nb-input.pale-yellow {
    padding: .5em .75em;
    background-color: #fdfd96;
    color: #000;
    border: 2px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    nb-button blue    font-size: .875rem;
    font-weight: 900;
    text-align: left;
    text-decoration: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .nb-input.pale-yellow {
        padding: .6em 1em;
        border-width: 2.5px;
        box-shadow: 4px 4px 0px 0px #000;
        font-size: .9rem;
        max-width: 350px
    }
}

@media (min-width: 768px) {
    .nb-input.pale-yellow {
        padding: .7em 1.25em;
        border-width: 3px;
        box-shadow: 5px 5px 0px 0px #000;
        font-size: 1rem;
        max-width: 400px
    }
}

@media (min-width: 992px) {
    .nb-input.pale-yellow {
        padding: .7em 1.5em;
        border-width: 3.5px;
        box-shadow: 5px 5px 0px 0px #000;
        max-width: 450px
    }
}

.nb-input.pale-yellow:hover {
    background-color: #fcfc7e
}

.nb-input.pale-yellow:focus {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0px 0px #000
}

.nb-input.pale-yellow.disabled {
    background-color: #ccc;
    color: #888;
    cursor: not-allowed;
    box-shadow: none
}

.nb-input.pale-yellow::placeholder {
    color: #000;
    opacity: .7
}

.text-black {
    color: #000
}

.bg-black {
    background-color: #000
}

.border-black {
    border-color: #000
}

.text-white {
    color: #fff
}

.bg-white {
    background-color: #fff
}

.border-white {
    border-color: #fff
}

.text-red {
    color: #dc341e
}

.bg-red {
    background-color: #dc341e
}

.border-red {
    border-color: #dc341e
}

.text-orange {
    color: #ff5733
}

.bg-orange {
    background-color: #ff5733
}

.border-orange {
    border-color: #ff5733
}

.text-blue {
    color: #0077b6
}

.bg-blue {
    background-color: #0077b6
}

.border-blue {
    border-color: #0077b6
}

.text-green {
    color: #40d39c
}

.bg-green {
    background-color: #40d39c
}

.border-green {
    border-color: #40d39c
}

.text-green-light {
    color: #92fca2
}

.bg-green-light {
    background-color: #92fca2
}

.border-green-light {
    border-color: #92fca2
}

.text-sky-blue {
    color: #b9e2f8
}

.bg-sky-blue {
    background-color: #b9e2f8
}

.border-sky-blue {
    border-color: #b9e2f8
}

.text-sky-blue-light {
    color: #d5f0ff
}

.bg-sky-blue-light {
    background-color: #d5f0ff
}

.border-sky-blue-light {
    border-color: #d5f0ff
}

.text-pale-red {
    color: #ffc5c8
}

.bg-pale-red {
    background-color: #ffc5c8
}

.border-pale-red {
    border-color: #ffc5c8
}

.text-pale-violet {
    color: #bc98cb
}

.bg-pale-violet {
    background-color: #bc98cb
}

.border-pale-violet {
    border-color: #bc98cb
}

.text-soft-blue {
    color: #4799ae
}

.bg-soft-blue {
    background-color: #4799ae
}

.border-soft-blue {
    border-color: #4799ae
}

.text-pale-cyan {
    color: #b9e7de
}

.bg-pale-cyan {
    background-color: #b9e7de
}

.border-pale-cyan {
    border-color: #b9e7de
}

.text-pale-yellow {
    color: #fdfd96
}

.bg-pale-yellow {
    background-color: #fdfd96
}

.border-pale-yellow {
    border-color: #fdfd96
}

.text-pale-yellow-light {
    color: #f8f894
}

.bg-pale-yellow-light {
    background-color: #f8f894
}

.border-pale-yellow-light {
    border-color: #f8f894
}

.text-hover-red {
    color: brown
}

.bg-hover-red {
    background-color: brown
}

.border-hover-red {
    border-color: brown
}

.text-hover-orange {
    color: #d64b2b
}

.bg-hover-orange {
    background-color: #d64b2b
}

.border-hover-orange {
    border-color: #d64b2b
}

.text-hover-blue {
    color: #005785
}

.bg-hover-blue {
    background-color: #005785
}

.border-hover-blue {
    border-color: #005785
}

.text-hover-green {
    color: #30ac7e
}

.bg-hover-green {
    background-color: #30ac7e
}

.border-hover-green {
    border-color: #30ac7e
}

.text-hover-sky-blue {
    color: #91bed6
}

.bg-hover-sky-blue {
    background-color: #91bed6
}

.border-hover-sky-blue {
    border-color: #91bed6
}

.text-hover-pale-red {
    color: #ffb2b2
}

.bg-hover-pale-red {
    background-color: #ffb2b2
}

.border-hover-pale-red {
    border-color: #ffb2b2
}

.text-hover-pale-violet {
    color: #b482c9
}

.bg-hover-pale-violet {
    background-color: #b482c9
}

.border-hover-pale-violet {
    border-color: #b482c9
}

.text-hover-soft-blue {
    color: #378589
}

.bg-hover-soft-blue {
    background-color: #378589
}

.border-hover-soft-blue {
    border-color: #378589
}

.text-hover-pale-cyan {
    color: #a0e5d7
}

.bg-hover-pale-cyan {
    background-color: #a0e5d7
}

.border-hover-pale-cyan {
    border-color: #a0e5d7
}

.text-hover-pale-yellow {
    color: #fcfc7e
}

.bg-hover-pale-yellow {
    background-color: #fcfc7e
}

.border-hover-pale-yellow {
    border-color: #fcfc7e
}

.nb-dialog {
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000;
    background: #fff;
    max-width: 600px;
    display: flex;
    flex-direction: column
}

.nb-dialog .nb-dialog-header {
    background-color: #000;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.nb-dialog .nb-dialog-header {
    padding: 1rem 1.5rem;
    nb-button blue    font-weight: 900;
    font-size: 1.5rem;
    text-transform: uppercase
}

.nb-dialog .nb-dialog-body {
    padding: 1.5rem;

    font-size: 1rem;
    line-height: 1.5
}

.nb-dialog .nb-dialog-footer {
    padding: 1rem 1.5rem;
    display: flex;
    justify-content: flex-end;
    gap: 1rem
}

.nb-dialog.default {
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-dialog.default .nb-dialog-header {
    background-color: #000;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.nb-dialog.orange {
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-dialog.orange .nb-dialog-header {
    background-color: #ff5733;
    color: #000;
    border-bottom: 3.5px solid #000
}

.nb-dialog.blue {
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-dialog.blue .nb-dialog-header {
    background-color: #0077b6;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.nb-dialog.green {
    border: 3.5px solid "black";
    box-shadow: 8px 8px 0px #000
}

.nb-dialog.green .nb-dialog-header {
    background-color: #40d39c;
    color: #fff;
    border-bottom: 3.5px solid "black"
}

.nb-dialog.sky-blue {
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-dialog.sky-blue .nb-dialog-header {
    background-color: #b9e2f8;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.nb-dialog.pale-red {
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-dialog.pale-red .nb-dialog-header {
    background-color: #ffc5c8;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.nb-dialog.pale-violet {
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-dialog.pale-violet .nb-dialog-header {
    background-color: #bc98cb;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.nb-dialog.soft-blue {
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-dialog.soft-blue .nb-dialog-header {
    background-color: #4799ae;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.nb-dialog.pale-cyan {
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-dialog.pale-cyan .nb-dialog-header {
    background-color: #b9e7de;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.nb-dialog.pale-yellow {
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-dialog.pale-yellow .nb-dialog-header {
    background-color: #fdfd96;
    color: #000;
    border-bottom: 3.5px solid #000
}

.button-container {
    display: flex;
    text-align: right
}

.nb-marquee {
    background-color: #fff;
    color: #000;
    border: 3.5px solid #000;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    padding: 1rem 0
}

.nb-marquee .nb-marquee-content {
    display: inline-block;
    padding-left: 100%;
    animation: marquee 15s linear infinite
}

.nb-marquee .nb-marquee-content span {
    display: inline-block;
    padding: 0 2rem;
    font-size: 1.5rem
}

@keyframes marquee {
    0% {
        transform: translateX(0)
    }
    100% {
        transform: translateX(-100%)
    }
}

.nb-marquee.default {
    background-color: #fff;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

.nb-marquee.orange {
    background-color: #ff5733;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

.nb-marquee.blue {
    background-color: #0077b6;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

.nb-marquee.green {
    background-color: #40d39c;
    color: #fff;
    border: 3.5px solid #000;
}

.nb-marquee.sky-blue {
    background-color: #b9e2f8;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

.nb-marquee.pale-red {
    background-color: #ffc5c8;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

.nb-marquee.pale-violet {
    background-color: #bc98cb;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

.nb-marquee.soft-blue {
    background-color: #4799ae;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

.nb-marquee.pale-cyan {
    background-color: #b9e7de;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

.nb-marquee.pale-yellow {
    background-color: #fdfd96;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

.card {
    width: 300px;
    margin: 20px;
    border-radius: 8px;
    overflow: hidden;
    border: 3px solid #000;
    box-shadow: -3px 3px 0px #000;
    transition: box-shadow .2s ease, transform .2s ease
}

.card:hover {
    box-shadow: 0px 0px 0px #000;
    transform: translate(-6px, 6px)
}

.card a {
    margin: 0;
    text-decoration: none;
    color: inherit
}

.card-thumbnail img {
    width: 100%;
    height: auto
}

.card-content {
    padding: 16px
}

.text-small {
    font-size: 14px;
    color: #888
}

.card-content div {
    font-size: 16px;
    line-height: 1.5;
    color: #333
}

.card-content strong {
    cursor: pointer
}

.nb-card {
    background-color: #fff;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000;
    width: 100%;
    max-width: 100%;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1);
    display: flex;
    flex-direction: column
}

.nb-card:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

@media (min-width: 576px) {
    .nb-card {
        max-width: 320px
    }
}

@media (min-width: 768px) {
    .nb-card {
        max-width: 350px
    }
}

@media (min-width: 992px) {
    .nb-card {
        max-width: 380px
    }
}

.nb-card:hover {
    transform: translate(4px, 4px)
}

.nb-card .nb-card-img {
    width: 100%;
    height: 120px;
    object-fit: cover
}

@media (min-width: 576px) {
    .nb-card .nb-card-img {
        height: 150px
    }
}

@media (min-width: 768px) {
    .nb-card .nb-card-img {
        height: 180px
    }
}

@media (min-width: 992px) {
    .nb-card .nb-card-img {
        height: 200px
    }
}

.nb-card .nb-card-content {
    padding: .75rem;
    flex-grow: 1;
    display: flex;
    flex-direction: column
}

@media (min-width: 576px) {
    .nb-card .nb-card-content {
        padding: 1rem
    }
}

@media (min-width: 768px) {
    .nb-card .nb-card-content {
        padding: 1.25rem
    }
}

@media (min-width: 992px) {
    .nb-card .nb-card-content {
        padding: 1.5rem
    }
}

.nb-card .nb-card-content .nb-card-title {
    nb-button blue    font-weight: 900;
    font-size: 1.125rem;
    text-transform: uppercase;
    margin-bottom: .5rem
}

@media (min-width: 576px) {
    .nb-card .nb-card-content .nb-card-title {
        font-size: 1.25rem;
        margin-bottom: .75rem
    }
}

@media (min-width: 768px) {
    .nb-card .nb-card-content .nb-card-title {
        font-size: 1.375rem;
        margin-bottom: .875rem
    }
}

@media (min-width: 992px) {
    .nb-card .nb-card-content .nb-card-title {
        font-size: 1.5rem;
        margin-bottom: 1rem
    }
}

.nb-card .nb-card-content .nb-card-text {

    font-size: .875rem;
    margin-bottom: 1rem;
    flex-grow: 1
}

@media (min-width: 576px) {
    .nb-card .nb-card-content .nb-card-text {
        font-size: .9rem;
        margin-bottom: 1.125rem
    }
}

@media (min-width: 768px) {
    .nb-card .nb-card-content .nb-card-text {
        font-size: .95rem;
        margin-bottom: 1.25rem
    }
}

@media (min-width: 992px) {
    .nb-card .nb-card-content .nb-card-text {
        font-size: 1rem;
        margin-bottom: 1.5rem
    }
}

.nb-card .nb-card-content .nb-card-actions {
    margin-top: auto
}

.nb-card.default {
    background-color: #fff;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-card.default:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card.default .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

.nb-card.orange {
    background-color: #ff5733;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-card.orange:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card.orange .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

.nb-card.blue {
    background-color: #0077b6;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-card.blue:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card.blue .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

.nb-card.green {
    background-color: #40d39c;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-card.green:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card.green .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

.nb-card.sky-blue {
    background-color: #b9e2f8;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-card.sky-blue:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card.sky-blue .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

.nb-card.pale-red {
    background-color: #ffc5c8;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-card.pale-red:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card.pale-red .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

.nb-card.pale-violet {
    background-color: #bc98cb;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-card.pale-violet:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card.pale-violet .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

.nb-card.soft-blue {
    background-color: #4799ae;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-card.soft-blue:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card.soft-blue .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

.nb-card.pale-cyan {
    background-color: #b9e7de;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-card.pale-cyan:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card.pale-cyan .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

.nb-card.pale-yellow {
    background-color: #fdfd96;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-card.pale-yellow:hover {
    box-shadow: 4px 4px 0px #000
}

.nb-card.pale-yellow .nb-card-img {
    border-bottom: 3.5px solid #000;
    background-color: #fdfd96
}

.avatar {
    background-color: #fff;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    overflow: hidden;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%
}

.avatar img {
    border: 0;
    max-width: 100%;
    vertical-align: middle;
    display: inline-block;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.avatar-sm {
    width: 40px;
    height: 40px
}

.avatar-md {
    width: 60px;
    height: 60px
}

.avatar-lg {
    width: 80px;
    height: 80px
}

.avatar.default {
    background-color: #fff;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase
}

.avatar.orange {
    background-color: #ff5733;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase
}

.avatar.blue {
    background-color: #0077b6;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase
}

.avatar.green {
    background-color: #40d39c;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase
}

.avatar.sky-blue {
    background-color: #b9e2f8;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase
}

.avatar.pale-red {
    background-color: #ffc5c8;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase
}

.avatar.pale-violet {
    background-color: #bc98cb;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase
}

.avatar.soft-blue {
    background-color: #4799ae;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase
}

.avatar.pale-cyan {
    background-color: #b9e7de;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase
}

.avatar.pale-yellow {
    background-color: #fdfd96;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    nb-button blue    font-weight: 900;
    text-transform: uppercase
}

.nb-label {
    cursor: pointer;
    display: flex;
    align-items: center;
    nb-button blue    font-size: 1rem;
    font-weight: 900;
    color: #000;
    text-transform: uppercase
}

input.nb-checkbox {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox:checked {
    background-color: #000;
    color: #fff
}

input.nb-checkbox:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

input.nb-checkbox.default {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox.default:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox.default:checked {
    background-color: #000;
    color: #fff
}

input.nb-checkbox.default:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

input.nb-checkbox.orange {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #ff5733;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox.orange:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox.orange:checked {
    background-color: #d64b2b;
    color: #000
}

input.nb-checkbox.orange:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

input.nb-checkbox.blue {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #0077b6;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox.blue:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox.blue:checked {
    background-color: #005785;
    color: #fff
}

input.nb-checkbox.blue:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

input.nb-checkbox.green {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #40d39c;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox.green:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox.green:checked {
    background-color: #30ac7e;
    color: #fff
}

input.nb-checkbox.green:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

input.nb-checkbox.sky-blue {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #b9e2f8;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox.sky-blue:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox.sky-blue:checked {
    background-color: #91bed6;
    color: #fff
}

input.nb-checkbox.sky-blue:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

input.nb-checkbox.pale-red {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #ffc5c8;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox.pale-red:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox.pale-red:checked {
    background-color: #ffb2b2;
    color: #fff
}

input.nb-checkbox.pale-red:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

input.nb-checkbox.pale-violet {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #bc98cb;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox.pale-violet:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox.pale-violet:checked {
    background-color: #b482c9;
    color: #fff
}

input.nb-checkbox.pale-violet:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

input.nb-checkbox.soft-blue {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #4799ae;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox.soft-blue:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox.soft-blue:checked {
    background-color: #378589;
    color: #fff
}

input.nb-checkbox.soft-blue:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

input.nb-checkbox.pale-cyan {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #b9e7de;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox.pale-cyan:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox.pale-cyan:checked {
    background-color: #a0e5d7;
    color: #fff
}

input.nb-checkbox.pale-cyan:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

input.nb-checkbox.pale-yellow {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background-color: #fdfd96;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0px 0px #000;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

input.nb-checkbox.pale-yellow:hover {
    transform: translate(1.5px, 1.5px);
    box-shadow: 1.5px 1.5px 0px 0px #000
}

input.nb-checkbox.pale-yellow:checked {
    background-color: #fcfc7e;
    color: #000
}

input.nb-checkbox.pale-yellow:checked::before {
    content: "✔";
    font-weight: bold;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px
}

.badge {
    background-color: #fff;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000;
    width: fit-content;
    padding: 5px;
    border-radius: 50px;
    text-transform: uppercase;
    nb-button blue    font-weight: 900
}

.badge .badge-inner {
    border: 3.5px solid #000
}

.badge .badge-inner {
    display: flex;
    height: 100%;
    margin: 0;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    background: inherit
}

.badge .badge-inner .badge-text {
    padding: 10px;
    margin: 0
}

.badge.default {
    background-color: #fff;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000
}

.badge.default .badge-inner {
    border: 3.5px solid #000
}

.badge.orange {
    background-color: #ff5733;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000
}

.badge.orange .badge-inner {
    border: 3.5px solid #000
}

.badge.blue {
    background-color: #0077b6;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000
}

.badge.blue .badge-inner {
    border: 3.5px solid #000
}

.badge.green {
    background-color: #40d39c;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000
}

.badge.green .badge-inner {
    border: 3.5px solid #000
}

.badge.sky-blue {
    background-color: #b9e2f8;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000
}

.badge.sky-blue .badge-inner {
    border: 3.5px solid #000
}

.badge.pale-red {
    background-color: #ffc5c8;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000
}

.badge.pale-red .badge-inner {
    border: 3.5px solid #000
}

.badge.pale-violet {
    background-color: #bc98cb;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000
}

.badge.pale-violet .badge-inner {
    border: 3.5px solid #000
}

.badge.soft-blue {
    background-color: #4799ae;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000
}

.badge.soft-blue .badge-inner {
    border: 3.5px solid #000
}

.badge.pale-cyan {
    background-color: #b9e7de;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000
}

.badge.pale-cyan .badge-inner {
    border: 3.5px solid #000
}

.badge.pale-yellow {
    background-color: #fdfd96;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 3px 3px 0 0 #000
}

.badge.pale-yellow .badge-inner {
    border: 3.5px solid #000
}

.alert.success {
    background-color: #92fca2;
    color: #000;
    border: 3.5px solid #40d39c;
    box-shadow: 5px 5px 0px #40d39c;
    padding: 1rem;
    margin-bottom: 1rem;
    text-align: center;
    nb-button blue    font-size: 1.2rem;
    font-weight: 900
}

.alert.error {
    background-color: #ffc5c8;
    color: #000;
    border: 3.5px solid #dc341e;
    box-shadow: 5px 5px 0px #dc341e;
    padding: 1rem;
    margin-bottom: 1rem;
    text-align: center;
    nb-button blue    font-size: 1.2rem;
    font-weight: 900
}

.alert.warning {
    background-color: #f8f894;
    color: #000;
    border: 3.5px solid #fdfd96;
    box-shadow: 5px 5px 0px #fdfd96;
    padding: 1rem;
    margin-bottom: 1rem;
    text-align: center;
    nb-button blue    font-size: 1.2rem;
    font-weight: 900
}

.alert.info {
    background-color: #d5f0ff;
    color: #000;
    border: 3.5px solid #b9e2f8;
    box-shadow: 5px 5px 0px #b9e2f8;
    padding: 1rem;
    margin-bottom: 1rem;
    text-align: center;
    nb-button blue    font-size: 1.2rem;
    font-weight: 900
}

.accordion-tab {
    position: absolute;
    opacity: 0;
    z-index: -1
}

.accordion {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion .accordion-label {
    background: #000;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.accordion-label {
    display: flex;
    padding: 1em;
    nb-button blue    font-weight: 900;
    cursor: pointer;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

.accordion-label:hover {
    background-color: #333
}

.accordion-content {
    max-height: 0;
    padding: 0 1em;
    background: #fff;
    transition: all .35s;
    color: #000
}

.accordion-tab:checked ~ .accordion-content {
    max-height: 100vh;
    padding: 1em
}

.accordion.default {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion.default .accordion-label {
    background: #000;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.accordion.orange {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion.orange .accordion-label {
    background: #ff5733;
    color: #000;
    border-bottom: 3.5px solid #000
}

.accordion.blue {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion.blue .accordion-label {
    background: #0077b6;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.accordion.green {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion.green .accordion-label {
    background: #40d39c;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.accordion.sky-blue {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion.sky-blue .accordion-label {
    background: #b9e2f8;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.accordion.pale-red {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion.pale-red .accordion-label {
    background: #ffc5c8;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.accordion.pale-violet {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion.pale-violet .accordion-label {
    background: #bc98cb;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.accordion.soft-blue {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion.soft-blue .accordion-label {
    background: #4799ae;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.accordion.pale-cyan {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion.pale-cyan .accordion-label {
    background: #b9e7de;
    color: #fff;
    border-bottom: 3.5px solid #000
}

.accordion.pale-yellow {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 5px 5px 0px #000;
    border: 3.5px solid #000
}

.accordion.pale-yellow .accordion-label {
    background: #fdfd96;
    color: #000;
    border-bottom: 3.5px solid #000
}

.nb-dropdown {
    background-color: #fff;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000;
    position: relative;
    display: inline-block;
    nb-button blue    font-weight: 900;
    text-transform: uppercase;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: .7em 2.5em .7em 1.5em;
    cursor: pointer;
    outline: none;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

.nb-dropdown:focus {
    box-shadow: 2px 2px 0px #000
}

.nb-dropdown + .nb-dropdown-arrow {
    position: absolute;
    top: 50%;
    right: 1.5rem;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 1.5rem;
    color: inherit
}

.nb-dropdown:focus {
    transform: translate(2px, 2px)
}

.nb-dropdown option {

    font-weight: normal;
    text-transform: none;
    background-color: #fff;
    color: #000
}

select.nb-dropdown.default {
    background-color: #fff;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

select.nb-dropdown.default:focus {
    box-shadow: 2px 2px 0px #000
}

select.nb-dropdown.orange {
    background-color: #ff5733;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

select.nb-dropdown.orange:focus {
    box-shadow: 2px 2px 0px #000
}

select.nb-dropdown.blue {
    background-color: #0077b6;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

select.nb-dropdown.blue:focus {
    box-shadow: 2px 2px 0px #000
}

select.nb-dropdown.green {
    background-color: #40d39c;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

select.nb-dropdown.green:focus {
    box-shadow: 2px 2px 0px #000
}

select.nb-dropdown.sky-blue {
    background-color: #b9e2f8;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

select.nb-dropdown.sky-blue:focus {
    box-shadow: 2px 2px 0px #000
}

select.nb-dropdown.pale-red {
    background-color: #ffc5c8;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

select.nb-dropdown.pale-red:focus {
    box-shadow: 2px 2px 0px #000
}

select.nb-dropdown.pale-violet {
    background-color: #bc98cb;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

select.nb-dropdown.pale-violet:focus {
    box-shadow: 2px 2px 0px #000
}

select.nb-dropdown.soft-blue {
    background-color: #4799ae;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

select.nb-dropdown.soft-blue:focus {
    box-shadow: 2px 2px 0px #000
}

select.nb-dropdown.pale-cyan {
    background-color: #b9e7de;
    color: #fff;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

select.nb-dropdown.pale-cyan:focus {
    box-shadow: 2px 2px 0px #000
}

select.nb-dropdown.pale-yellow {
    background-color: #fdfd96;
    color: #000;
    border: 3.5px solid #000;
    box-shadow: 5px 5px 0px #000
}

select.nb-dropdown.pale-yellow:focus {
    box-shadow: 2px 2px 0px #000
}

.nb-navbar {
    background: #fff;
    border: 2.5px solid #000;
    box-shadow: 6px 6px 0px #000;
    padding: .75rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;

    position: relative
}

@media (min-width: 576px) {
    .nb-navbar {
        border-width: 3px;
        box-shadow: 7px 7px 0px #000;
        padding: .875rem 1.25rem
    }
}

@media (min-width: 768px) {
    .nb-navbar {
        border-width: 3.5px;
        box-shadow: 8px 8px 0px #000;
        padding: 1rem 1.5rem
    }
}

.nb-navbar-brand {
    nb-button blue    font-weight: 900;
    font-size: 1.25rem;
    text-transform: uppercase;
    color: #000;
    text-decoration: none
}

@media (min-width: 576px) {
    .nb-navbar-brand {
        font-size: 1.375rem
    }
}

@media (min-width: 768px) {
    .nb-navbar-brand {
        font-size: 1.5rem
    }
}

.nb-navbar-brand:hover {
    transform: translate(2px, 2px);
    transition: transform .15s cubic-bezier(0.77, 0, 0.18, 1)
}

.nb-navbar-nav {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: .5rem
}

@media (min-width: 576px) {
    .nb-navbar-nav {
        gap: .75rem
    }
}

@media (min-width: 768px) {
    .nb-navbar-nav {
        gap: 1rem
    }
}

.nb-navbar-item {
    margin: 0
}

.nb-navbar-link {
    display: block;
    padding: .5rem .875rem;
    color: #000;
    text-decoration: none;
    font-weight: 600;
    font-size: .875rem;
    border: 2px solid rgba(0, 0, 0, 0);
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-navbar-link {
        padding: .625rem 1rem;
        font-size: .9rem;
        border-width: 2.5px
    }
}

@media (min-width: 768px) {
    .nb-navbar-link {
        padding: .75rem 1.25rem;
        font-size: 1rem;
        border-width: 3px
    }
}

.nb-navbar-link:hover {
    background: #000;
    color: #fff;
    border-color: #000;
    transform: translate(-2px, -2px);
    box-shadow: 2px 2px 0px #000
}

@media (min-width: 576px) {
    .nb-navbar-link:hover {
        transform: translate(-2.5px, -2.5px);
        box-shadow: 2.5px 2.5px 0px #000
    }
}

@media (min-width: 768px) {
    .nb-navbar-link:hover {
        transform: translate(-3px, -3px);
        box-shadow: 3px 3px 0px #000
    }
}

.nb-navbar-link.active {
    background: #000;
    color: #fff;
    border-color: #000;
    box-shadow: 2px 2px 0px #000
}

@media (min-width: 576px) {
    .nb-navbar-link.active {
        box-shadow: 2.5px 2.5px 0px #000
    }
}

@media (min-width: 768px) {
    .nb-navbar-link.active {
        box-shadow: 3px 3px 0px #000
    }
}

.nb-navbar-toggle {
    display: none;
    background: none;
    border: 2px solid #000;
    padding: .375rem;
    cursor: pointer
}

@media (min-width: 576px) {
    .nb-navbar-toggle {
        border-width: 2.5px;
        padding: .5rem
    }
}

@media (min-width: 768px) {
    .nb-navbar-toggle {
        border-width: 3px;
        padding: .5rem
    }
}

.nb-navbar-toggle .hamburger {
    width: 18px;
    height: 2px;
    background: #000;
    position: relative
}

@media (min-width: 576px) {
    .nb-navbar-toggle .hamburger {
        width: 20px
    }
}

.nb-navbar-toggle .hamburger::before, .nb-navbar-toggle .hamburger::after {
    content: "";
    position: absolute;
    width: 18px;
    height: 2px;
    background: #000;
    transition: transform .3s ease
}

@media (min-width: 576px) {
    .nb-navbar-toggle .hamburger::before, .nb-navbar-toggle .hamburger::after {
        width: 20px
    }
}

.nb-navbar-toggle .hamburger::before {
    top: -5px
}

@media (min-width: 576px) {
    .nb-navbar-toggle .hamburger::before {
        top: -6px
    }
}

.nb-navbar-toggle .hamburger::after {
    bottom: -5px
}

@media (min-width: 576px) {
    .nb-navbar-toggle .hamburger::after {
        bottom: -6px
    }
}

.nb-navbar-toggle.active .hamburger {
    background: rgba(0, 0, 0, 0)
}

.nb-navbar-toggle.active .hamburger::before {
    transform: rotate(45deg);
    top: 0
}

.nb-navbar-toggle.active .hamburger::after {
    transform: rotate(-45deg);
    bottom: 0
}

.nb-breadcrumb {
    display: flex;
    align-items: center;
    gap: .375rem;

    font-size: .8rem;
    margin: .75rem 0
}

@media (min-width: 576px) {
    .nb-breadcrumb {
        gap: .5rem;
        font-size: .85rem;
        margin: .875rem 0
    }
}

@media (min-width: 768px) {
    .nb-breadcrumb {
        gap: .5rem;
        font-size: .9rem;
        margin: 1rem 0
    }
}

.nb-breadcrumb-item {
    display: flex;
    align-items: center
}

.nb-breadcrumb-item:not(:last-child)::after {
    content: "/";
    margin-left: .375rem;
    color: #666
}

@media (min-width: 576px) {
    .nb-breadcrumb-item:not(:last-child)::after {
        margin-left: .5rem
    }
}

.nb-breadcrumb-link {
    color: #000;
    text-decoration: none;
    padding: .2rem .375rem;
    border: 1.5px solid rgba(0, 0, 0, 0);
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

@media (min-width: 576px) {
    .nb-breadcrumb-link {
        padding: .25rem .5rem;
        border-width: 2px
    }
}

.nb-breadcrumb-link:hover {
    background: #000;
    color: #fff;
    border-color: #000;
    transform: translate(-1.5px, -1.5px);
    box-shadow: 1.5px 1.5px 0px #000
}

@media (min-width: 576px) {
    .nb-breadcrumb-link:hover {
        transform: translate(-2px, -2px);
        box-shadow: 2px 2px 0px #000
    }
}

.nb-breadcrumb-current {
    color: #666;
    font-weight: 600
}

@media (max-width: 767px) {
    .nb-navbar-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: #fff;
        border: 2.5px solid #000;
        border-top: none;
        box-shadow: 6px 6px 0px #000;
        flex-direction: column;
        padding: .75rem;
        z-index: 1000
    }
}

@media (max-width: 767px)and (min-width: 576px) {
    .nb-navbar-nav {
        border-width: 3px;
        box-shadow: 7px 7px 0px #000;
        padding: 1rem
    }
}

@media (max-width: 767px) {
    .nb-navbar-nav.active {
        display: flex
    }

    .nb-navbar-toggle {
        display: block
    }
}

.nb-navbar.default {
    background: #000;
    border-color: #fff;
    box-shadow: 8px 8px 0px #fff
}

.nb-navbar.default .nb-navbar-brand {
    color: #fff
}

.nb-navbar.default .nb-navbar-link {
    color: #fff;
    border-color: rgba(0, 0, 0, 0)
}

.nb-navbar.default .nb-navbar-link:hover {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.default .nb-navbar-link.active {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.default .nb-navbar-toggle {
    border-color: #fff
}

.nb-navbar.default .nb-navbar-toggle .hamburger, .nb-navbar.default .nb-navbar-toggle .hamburger::before, .nb-navbar.default .nb-navbar-toggle .hamburger::after {
    background: #fff
}

@media (max-width: 767px) {
    .nb-navbar.default .nb-navbar-nav {
        background: #000;
        border-color: #fff;
        box-shadow: 6px 6px 0px #fff
    }

    .nb-navbar.default .nb-navbar-nav .nb-navbar-link {
        color: #fff
    }

    .nb-navbar.default .nb-navbar-nav .nb-navbar-link:hover {
        background: #fff;
        color: #000
    }

    .nb-navbar.default .nb-navbar-nav .nb-navbar-link.active {
        background: #fff;
        color: #000
    }
}

.nb-navbar.orange {
    background: #ff5733;
    border-color: #000;
    box-shadow: 8px 8px 0px #000
}

.nb-navbar.orange .nb-navbar-brand {
    color: #000
}

.nb-navbar.orange .nb-navbar-link {
    color: #000;
    border-color: rgba(0, 0, 0, 0)
}

.nb-navbar.orange .nb-navbar-link:hover {
    background: #000;
    color: #fff;
    border-color: #000;
    box-shadow: 3px 3px 0px #000
}

.nb-navbar.orange .nb-navbar-link.active {
    background: #000;
    color: #fff;
    border-color: #000;
    box-shadow: 3px 3px 0px #000
}

.nb-navbar.orange .nb-navbar-toggle {
    border-color: #000
}

.nb-navbar.orange .nb-navbar-toggle .hamburger, .nb-navbar.orange .nb-navbar-toggle .hamburger::before, .nb-navbar.orange .nb-navbar-toggle .hamburger::after {
    background: #000
}

@media (max-width: 767px) {
    .nb-navbar.orange .nb-navbar-nav {
        background: #ff5733;
        border-color: #000;
        box-shadow: 6px 6px 0px #000
    }

    .nb-navbar.orange .nb-navbar-nav .nb-navbar-link {
        color: #000
    }

    .nb-navbar.orange .nb-navbar-nav .nb-navbar-link:hover {
        background: #000;
        color: #fff
    }

    .nb-navbar.orange .nb-navbar-nav .nb-navbar-link.active {
        background: #000;
        color: #fff
    }
}

.nb-navbar.blue {
    background: #0077b6;
    border-color: #fff;
    box-shadow: 8px 8px 0px #fff
}

.nb-navbar.blue .nb-navbar-brand {
    color: #fff
}

.nb-navbar.blue .nb-navbar-link {
    color: #fff;
    border-color: rgba(0, 0, 0, 0)
}

.nb-navbar.blue .nb-navbar-link:hover {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.blue .nb-navbar-link.active {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.blue .nb-navbar-toggle {
    border-color: #fff
}

.nb-navbar.blue .nb-navbar-toggle .hamburger, .nb-navbar.blue .nb-navbar-toggle .hamburger::before, .nb-navbar.blue .nb-navbar-toggle .hamburger::after {
    background: #fff
}

@media (max-width: 767px) {
    .nb-navbar.blue .nb-navbar-nav {
        background: #0077b6;
        border-color: #fff;
        box-shadow: 6px 6px 0px #fff
    }

    .nb-navbar.blue .nb-navbar-nav .nb-navbar-link {
        color: #fff
    }

    .nb-navbar.blue .nb-navbar-nav .nb-navbar-link:hover {
        background: #fff;
        color: #000
    }

    .nb-navbar.blue .nb-navbar-nav .nb-navbar-link.active {
        background: #fff;
        color: #000
    }
}

.nb-navbar.green {
    background: #40d39c;
    border-color: #fff;
    box-shadow: 8px 8px 0px #fff
}

.nb-navbar.green .nb-navbar-brand {
    color: #000
}

.nb-navbar.green .nb-navbar-link {
    color: #000;
    border-color: rgba(0, 0, 0, 0)
}

.nb-navbar.green .nb-navbar-link:hover {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.green .nb-navbar-link.active {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.green .nb-navbar-toggle {
    border-color: #000
}

.nb-navbar.green .nb-navbar-toggle .hamburger, .nb-navbar.green .nb-navbar-toggle .hamburger::before, .nb-navbar.green .nb-navbar-toggle .hamburger::after {
    background: #000
}

@media (max-width: 767px) {
    .nb-navbar.green .nb-navbar-nav {
        background: #40d39c;
        border-color: #fff;
        box-shadow: 6px 6px 0px #fff
    }

    .nb-navbar.green .nb-navbar-nav .nb-navbar-link {
        color: #000
    }

    .nb-navbar.green .nb-navbar-nav .nb-navbar-link:hover {
        background: #fff;
        color: #000
    }

    .nb-navbar.green .nb-navbar-nav .nb-navbar-link.active {
        background: #fff;
        color: #000
    }
}

.nb-navbar.sky-blue {
    background: #b9e2f8;
    border-color: #fff;
    box-shadow: 8px 8px 0px #fff
}

.nb-navbar.sky-blue .nb-navbar-brand {
    color: #000
}

.nb-navbar.sky-blue .nb-navbar-link {
    color: #000;
    border-color: rgba(0, 0, 0, 0)
}

.nb-navbar.sky-blue .nb-navbar-link:hover {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.sky-blue .nb-navbar-link.active {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.sky-blue .nb-navbar-toggle {
    border-color: #000
}

.nb-navbar.sky-blue .nb-navbar-toggle .hamburger, .nb-navbar.sky-blue .nb-navbar-toggle .hamburger::before, .nb-navbar.sky-blue .nb-navbar-toggle .hamburger::after {
    background: #000
}

@media (max-width: 767px) {
    .nb-navbar.sky-blue .nb-navbar-nav {
        background: #b9e2f8;
        border-color: #fff;
        box-shadow: 6px 6px 0px #fff
    }

    .nb-navbar.sky-blue .nb-navbar-nav .nb-navbar-link {
        color: #000
    }

    .nb-navbar.sky-blue .nb-navbar-nav .nb-navbar-link:hover {
        background: #fff;
        color: #000
    }

    .nb-navbar.sky-blue .nb-navbar-nav .nb-navbar-link.active {
        background: #fff;
        color: #000
    }
}

.nb-navbar.pale-red {
    background: #ffc5c8;
    border-color: #fff;
    box-shadow: 8px 8px 0px #fff
}

.nb-navbar.pale-red .nb-navbar-brand {
    color: #000
}

.nb-navbar.pale-red .nb-navbar-link {
    color: #000;
    border-color: rgba(0, 0, 0, 0)
}

.nb-navbar.pale-red .nb-navbar-link:hover {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.pale-red .nb-navbar-link.active {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.pale-red .nb-navbar-toggle {
    border-color: #000
}

.nb-navbar.pale-red .nb-navbar-toggle .hamburger, .nb-navbar.pale-red .nb-navbar-toggle .hamburger::before, .nb-navbar.pale-red .nb-navbar-toggle .hamburger::after {
    background: #000
}

@media (max-width: 767px) {
    .nb-navbar.pale-red .nb-navbar-nav {
        background: #ffc5c8;
        border-color: #fff;
        box-shadow: 6px 6px 0px #fff
    }

    .nb-navbar.pale-red .nb-navbar-nav .nb-navbar-link {
        color: #000
    }

    .nb-navbar.pale-red .nb-navbar-nav .nb-navbar-link:hover {
        background: #fff;
        color: #000
    }

    .nb-navbar.pale-red .nb-navbar-nav .nb-navbar-link.active {
        background: #fff;
        color: #000
    }
}

.nb-navbar.pale-violet {
    background: #bc98cb;
    border-color: #fff;
    box-shadow: 8px 8px 0px #fff
}

.nb-navbar.pale-violet .nb-navbar-brand {
    color: #000
}

.nb-navbar.pale-violet .nb-navbar-link {
    color: #000;
    border-color: rgba(0, 0, 0, 0)
}

.nb-navbar.pale-violet .nb-navbar-link:hover {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.pale-violet .nb-navbar-link.active {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.pale-violet .nb-navbar-toggle {
    border-color: #000
}

.nb-navbar.pale-violet .nb-navbar-toggle .hamburger, .nb-navbar.pale-violet .nb-navbar-toggle .hamburger::before, .nb-navbar.pale-violet .nb-navbar-toggle .hamburger::after {
    background: #000
}

@media (max-width: 767px) {
    .nb-navbar.pale-violet .nb-navbar-nav {
        background: #bc98cb;
        border-color: #fff;
        box-shadow: 6px 6px 0px #fff
    }

    .nb-navbar.pale-violet .nb-navbar-nav .nb-navbar-link {
        color: #000
    }

    .nb-navbar.pale-violet .nb-navbar-nav .nb-navbar-link:hover {
        background: #fff;
        color: #000
    }

    .nb-navbar.pale-violet .nb-navbar-nav .nb-navbar-link.active {
        background: #fff;
        color: #000
    }
}

.nb-navbar.soft-blue {
    background: #4799ae;
    border-color: #fff;
    box-shadow: 8px 8px 0px #fff
}

.nb-navbar.soft-blue .nb-navbar-brand {
    color: #fff
}

.nb-navbar.soft-blue .nb-navbar-link {
    color: #fff;
    border-color: rgba(0, 0, 0, 0)
}

.nb-navbar.soft-blue .nb-navbar-link:hover {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.soft-blue .nb-navbar-link.active {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.soft-blue .nb-navbar-toggle {
    border-color: #fff
}

.nb-navbar.soft-blue .nb-navbar-toggle .hamburger, .nb-navbar.soft-blue .nb-navbar-toggle .hamburger::before, .nb-navbar.soft-blue .nb-navbar-toggle .hamburger::after {
    background: #fff
}

@media (max-width: 767px) {
    .nb-navbar.soft-blue .nb-navbar-nav {
        background: #4799ae;
        border-color: #fff;
        box-shadow: 6px 6px 0px #fff
    }

    .nb-navbar.soft-blue .nb-navbar-nav .nb-navbar-link {
        color: #fff
    }

    .nb-navbar.soft-blue .nb-navbar-nav .nb-navbar-link:hover {
        background: #fff;
        color: #000
    }

    .nb-navbar.soft-blue .nb-navbar-nav .nb-navbar-link.active {
        background: #fff;
        color: #000
    }
}

.nb-navbar.pale-cyan {
    background: #b9e7de;
    border-color: #fff;
    box-shadow: 8px 8px 0px #fff
}

.nb-navbar.pale-cyan .nb-navbar-brand {
    color: #000
}

.nb-navbar.pale-cyan .nb-navbar-link {
    color: #000;
    border-color: rgba(0, 0, 0, 0)
}

.nb-navbar.pale-cyan .nb-navbar-link:hover {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.pale-cyan .nb-navbar-link.active {
    background: #fff;
    color: #000;
    border-color: #fff;
    box-shadow: 3px 3px 0px #fff
}

.nb-navbar.pale-cyan .nb-navbar-toggle {
    border-color: #000
}

.nb-navbar.pale-cyan .nb-navbar-toggle .hamburger, .nb-navbar.pale-cyan .nb-navbar-toggle .hamburger::before, .nb-navbar.pale-cyan .nb-navbar-toggle .hamburger::after {
    background: #000
}

@media (max-width: 767px) {
    .nb-navbar.pale-cyan .nb-navbar-nav {
        background: #b9e7de;
        border-color: #fff;
        box-shadow: 6px 6px 0px #fff
    }

    .nb-navbar.pale-cyan .nb-navbar-nav .nb-navbar-link {
        color: #000
    }

    .nb-navbar.pale-cyan .nb-navbar-nav .nb-navbar-link:hover {
        background: #fff;
        color: #000
    }

    .nb-navbar.pale-cyan .nb-navbar-nav .nb-navbar-link.active {
        background: #fff;
        color: #000
    }
}

.nb-navbar.pale-yellow {
    background: #fdfd96;
    border-color: #000;
    box-shadow: 8px 8px 0px #000
}

.nb-navbar.pale-yellow .nb-navbar-brand {
    color: #000
}

.nb-navbar.pale-yellow .nb-navbar-link {
    color: #000;
    border-color: rgba(0, 0, 0, 0)
}

.nb-navbar.pale-yellow .nb-navbar-link:hover {
    background: #000;
    color: #fff;
    border-color: #000;
    box-shadow: 3px 3px 0px #000
}

.nb-navbar.pale-yellow .nb-navbar-link.active {
    background: #000;
    color: #fff;
    border-color: #000;
    box-shadow: 3px 3px 0px #000
}

.nb-navbar.pale-yellow .nb-navbar-toggle {
    border-color: #000
}

.nb-navbar.pale-yellow .nb-navbar-toggle .hamburger, .nb-navbar.pale-yellow .nb-navbar-toggle .hamburger::before, .nb-navbar.pale-yellow .nb-navbar-toggle .hamburger::after {
    background: #000
}

@media (max-width: 767px) {
    .nb-navbar.pale-yellow .nb-navbar-nav {
        background: #fdfd96;
        border-color: #000;
        box-shadow: 6px 6px 0px #000
    }

    .nb-navbar.pale-yellow .nb-navbar-nav .nb-navbar-link {
        color: #000
    }

    .nb-navbar.pale-yellow .nb-navbar-nav .nb-navbar-link:hover {
        background: #000;
        color: #fff
    }

    .nb-navbar.pale-yellow .nb-navbar-nav .nb-navbar-link.active {
        background: #000;
        color: #fff
    }
}

.nb-textarea {
    width: 100%;
    min-height: 120px;
    padding: 1rem;
    border: 3.5px solid #000;
    background: #fff;

    font-size: 1rem;
    line-height: 1.5;
    resize: vertical;
    box-sizing: border-box;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

.nb-textarea:focus {
    outline: none;
    transform: translate(-3px, -3px);
    box-shadow: 6px 6px 0px #000
}

.nb-textarea::placeholder {
    color: #999
}

.nb-radio {
    display: none
}

.nb-radio + label {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    cursor: pointer;

    font-size: 1rem;
    padding: .5rem;
    border: 2px solid rgba(0, 0, 0, 0);
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

.nb-radio + label::before {
    content: "";
    width: 20px;
    height: 20px;
    border: 3px solid #000;
    border-radius: 50%;
    background: #fff;
    display: inline-block;
    position: relative;
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

.nb-radio + label:hover {
    transform: translate(-2px, -2px);
    box-shadow: 2px 2px 0px #000
}

.nb-radio:checked + label::before {
    background: #000;
    box-shadow: inset 0 0 0 4px #fff
}

.nb-radio:checked + label {
    background: #000;
    color: #fff;
    border-color: #000;
    transform: translate(-2px, -2px);
    box-shadow: 2px 2px 0px #000
}

.nb-form-group {
    margin-bottom: 1.5rem
}

.nb-form-group label {
    display: block;

    font-weight: 600;
    font-size: 1rem;
    color: #000;
    margin-bottom: .5rem
}

.nb-form-group .nb-input, .nb-form-group .nb-textarea, .nb-form-group .nb-dropdown {
    width: 100%
}

.nb-form-group .nb-radio {
    margin-right: .5rem
}

.nb-textarea.default {
    border-color: #000
}

.nb-textarea.default:focus {
    box-shadow: 6px 6px 0px #000
}

.nb-radio.default + label::before {
    border-color: #000
}

.nb-radio.default:checked + label::before {
    background: #000
}

.nb-radio.default:checked + label {
    background: #000;
    border-color: #000;
    box-shadow: 2px 2px 0px #000
}

.nb-textarea.orange {
    border-color: #ff5733
}

.nb-textarea.orange:focus {
    box-shadow: 6px 6px 0px #ff5733
}

.nb-radio.orange + label::before {
    border-color: #ff5733
}

.nb-radio.orange:checked + label::before {
    background: #ff5733
}

.nb-radio.orange:checked + label {
    background: #ff5733;
    border-color: #ff5733;
    box-shadow: 2px 2px 0px #ff5733
}

.nb-textarea.blue {
    border-color: #0077b6
}

.nb-textarea.blue:focus {
    box-shadow: 6px 6px 0px #0077b6
}

.nb-radio.blue + label::before {
    border-color: #0077b6
}

.nb-radio.blue:checked + label::before {
    background: #0077b6
}

.nb-radio.blue:checked + label {
    background: #0077b6;
    border-color: #0077b6;
    box-shadow: 2px 2px 0px #0077b6
}

.nb-textarea.green {
    border-color: #40d39c
}

.nb-textarea.green:focus {
    box-shadow: 6px 6px 0px #40d39c
}

.nb-radio.green + label::before {
    border-color: #40d39c
}

.nb-radio.green:checked + label::before {
    background: #40d39c
}

.nb-radio.green:checked + label {
    background: #40d39c;
    border-color: #40d39c;
    box-shadow: 2px 2px 0px #40d39c
}

.nb-textarea.sky-blue {
    border-color: #b9e2f8
}

.nb-textarea.sky-blue:focus {
    box-shadow: 6px 6px 0px #b9e2f8
}

.nb-radio.sky-blue + label::before {
    border-color: #b9e2f8
}

.nb-radio.sky-blue:checked + label::before {
    background: #b9e2f8
}

.nb-radio.sky-blue:checked + label {
    background: #b9e2f8;
    border-color: #b9e2f8;
    box-shadow: 2px 2px 0px #b9e2f8
}

.nb-textarea.pale-red {
    border-color: #ffc5c8
}

.nb-textarea.pale-red:focus {
    box-shadow: 6px 6px 0px #ffc5c8
}

.nb-radio.pale-red + label::before {
    border-color: #ffc5c8
}

.nb-radio.pale-red:checked + label::before {
    background: #ffc5c8
}

.nb-radio.pale-red:checked + label {
    background: #ffc5c8;
    border-color: #ffc5c8;
    box-shadow: 2px 2px 0px #ffc5c8
}

.nb-textarea.pale-violet {
    border-color: #bc98cb
}

.nb-textarea.pale-violet:focus {
    box-shadow: 6px 6px 0px #bc98cb
}

.nb-radio.pale-violet + label::before {
    border-color: #bc98cb
}

.nb-radio.pale-violet:checked + label::before {
    background: #bc98cb
}

.nb-radio.pale-violet:checked + label {
    background: #bc98cb;
    border-color: #bc98cb;
    box-shadow: 2px 2px 0px #bc98cb
}

.nb-textarea.soft-blue {
    border-color: #4799ae
}

.nb-textarea.soft-blue:focus {
    box-shadow: 6px 6px 0px #4799ae
}

.nb-radio.soft-blue + label::before {
    border-color: #4799ae
}

.nb-radio.soft-blue:checked + label::before {
    background: #4799ae
}

.nb-radio.soft-blue:checked + label {
    background: #4799ae;
    border-color: #4799ae;
    box-shadow: 2px 2px 0px #4799ae
}

.nb-textarea.pale-cyan {
    border-color: #b9e7de
}

.nb-textarea.pale-cyan:focus {
    box-shadow: 6px 6px 0px #b9e7de
}

.nb-radio.pale-cyan + label::before {
    border-color: #b9e7de
}

.nb-radio.pale-cyan:checked + label::before {
    background: #b9e7de
}

.nb-radio.pale-cyan:checked + label {
    background: #b9e7de;
    border-color: #b9e7de;
    box-shadow: 2px 2px 0px #b9e7de
}

.nb-textarea.pale-yellow {
    border-color: #fdfd96
}

.nb-textarea.pale-yellow:focus {
    box-shadow: 6px 6px 0px #fdfd96
}

.nb-radio.pale-yellow + label::before {
    border-color: #fdfd96
}

.nb-radio.pale-yellow:checked + label::before {
    background: #fdfd96
}

.nb-radio.pale-yellow:checked + label {
    background: #fdfd96;
    border-color: #fdfd96;
    box-shadow: 2px 2px 0px #fdfd96
}

.nb-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;

    font-size: 1rem;
    line-height: 1.5;
    margin: 1rem 0
}

.nb-table th, .nb-table td {
    padding: 1rem;
    text-align: left;
    border-bottom: 3px solid #000;
    background: #fff
}

.nb-table th {
    font-weight: 900;
    text-transform: uppercase;
    background: #000;
    color: #fff;
    position: sticky;
    top: 0;
    z-index: 10
}

.nb-table tr {
    transition: all .15s cubic-bezier(0.77, 0, 0.18, 1)
}

.nb-table tr:hover {
    transform: translate(-3px, -3px);
    box-shadow: 6px 6px 0px #000
}

.nb-table tr:hover td {
    background: #f8f8f8
}

.nb-table.striped tr:nth-child(even) td {
    background: #f5f5f5
}

.nb-table.bordered {
    border: 3px solid #000;
    box-shadow: 8px 8px 0px #000
}

.nb-table.bordered th, .nb-table.bordered td {
    border-right: 3px solid #000
}

.nb-table.bordered th:last-child, .nb-table.bordered td:last-child {
    border-right: none
}

.nb-table.compact th, .nb-table.compact td {
    padding: .5rem
}

@media (max-width: 768px) {
    .nb-table.responsive {
        display: block;
        overflow-x: auto;
        white-space: nowrap
    }
}

.nb-table-container {
    border: 3px solid #000;
    box-shadow: 8px 8px 0px #000;
    overflow: hidden;
    background: #fff
}

.nb-table-container .nb-table {
    margin: 0
}

.nb-table-container .nb-table th, .nb-table-container .nb-table td {
    border-bottom: 2px solid #ddd
}

.nb-table-container .nb-table tr:last-child td {
    border-bottom: none
}

.nb-table-header {
    background: #000;
    color: #fff;
    padding: 1rem 1.5rem;
    nb-button blue    font-weight: 900;
    font-size: 1.25rem;
    text-transform: uppercase;
    border-bottom: 3px solid #000
}

.nb-table-footer {
    background: #f5f5f5;
    padding: 1rem 1.5rem;
    border-top: 3px solid #000;

    font-size: .9rem;
    color: #666
}

.nb-table.default th {
    background: #000;
    border-bottom-color: #000
}

.nb-table.default tr:hover {
    box-shadow: 6px 6px 0px #000
}

.nb-table-container.default {
    border-color: #000;
    box-shadow: 8px 8px 0px #000
}

.nb-table-container.default .nb-table-header {
    background: #000;
    border-bottom-color: #000
}

.nb-table.orange th {
    background: #ff5733;
    border-bottom-color: #ff5733
}

.nb-table.orange tr:hover {
    box-shadow: 6px 6px 0px #ff5733
}

.nb-table-container.orange {
    border-color: #ff5733;
    box-shadow: 8px 8px 0px #ff5733
}

.nb-table-container.orange .nb-table-header {
    background: #ff5733;
    border-bottom-color: #ff5733
}

.nb-table.blue th {
    background: #0077b6;
    border-bottom-color: #0077b6
}

.nb-table.blue tr:hover {
    box-shadow: 6px 6px 0px #0077b6
}

.nb-table-container.blue {
    border-color: #0077b6;
    box-shadow: 8px 8px 0px #0077b6
}

.nb-table-container.blue .nb-table-header {
    background: #0077b6;
    border-bottom-color: #0077b6
}

.nb-table.green th {
    background: #40d39c;
    border-bottom-color: #40d39c
}

.nb-table.green tr:hover {
    box-shadow: 6px 6px 0px #40d39c
}

.nb-table-container.green {
    border-color: #40d39c;
    box-shadow: 8px 8px 0px #40d39c
}

.nb-table-container.green .nb-table-header {
    background: #40d39c;
    border-bottom-color: #40d39c
}

.nb-table.sky-blue th {
    background: #b9e2f8;
    border-bottom-color: #b9e2f8
}

.nb-table.sky-blue tr:hover {
    box-shadow: 6px 6px 0px #b9e2f8
}

.nb-table-container.sky-blue {
    border-color: #b9e2f8;
    box-shadow: 8px 8px 0px #b9e2f8
}

.nb-table-container.sky-blue .nb-table-header {
    background: #b9e2f8;
    border-bottom-color: #b9e2f8
}

.nb-table.pale-red th {
    background: #ffc5c8;
    border-bottom-color: #ffc5c8
}

.nb-table.pale-red tr:hover {
    box-shadow: 6px 6px 0px #ffc5c8
}

.nb-table-container.pale-red {
    border-color: #ffc5c8;
    box-shadow: 8px 8px 0px #ffc5c8
}

.nb-table-container.pale-red .nb-table-header {
    background: #ffc5c8;
    border-bottom-color: #ffc5c8
}

.nb-table.pale-violet th {
    background: #bc98cb;
    border-bottom-color: #bc98cb
}

.nb-table.pale-violet tr:hover {
    box-shadow: 6px 6px 0px #bc98cb
}

.nb-table-container.pale-violet {
    border-color: #bc98cb;
    box-shadow: 8px 8px 0px #bc98cb
}

.nb-table-container.pale-violet .nb-table-header {
    background: #bc98cb;
    border-bottom-color: #bc98cb
}

.nb-table.soft-blue th {
    background: #4799ae;
    border-bottom-color: #4799ae
}

.nb-table.soft-blue tr:hover {
    box-shadow: 6px 6px 0px #4799ae
}

.nb-table-container.soft-blue {
    border-color: #4799ae;
    box-shadow: 8px 8px 0px #4799ae
}

.nb-table-container.soft-blue .nb-table-header {
    background: #4799ae;
    border-bottom-color: #4799ae
}

.nb-table.pale-cyan th {
    background: #b9e7de;
    border-bottom-color: #b9e7de
}

.nb-table.pale-cyan tr:hover {
    box-shadow: 6px 6px 0px #b9e7de
}

.nb-table-container.pale-cyan {
    border-color: #b9e7de;
    box-shadow: 8px 8px 0px #b9e7de
}

.nb-table-container.pale-cyan .nb-table-header {
    background: #b9e7de;
    border-bottom-color: #b9e7de
}

.nb-table.pale-yellow th {
    background: #fdfd96;
    border-bottom-color: #fdfd96
}

.nb-table.pale-yellow tr:hover {
    box-shadow: 6px 6px 0px #fdfd96
}

.nb-table-container.pale-yellow {
    border-color: #fdfd96;
    box-shadow: 8px 8px 0px #fdfd96
}

.nb-table-container.pale-yellow .nb-table-header {
    background: #fdfd96;
    border-bottom-color: #fdfd96
}

.nb-progress {
    width: 100%;
    height: 30px;
    background: #fff;
    border: 3px solid #000;
    box-shadow: 4px 4px 0px #000;
    position: relative;
    overflow: hidden;
    margin: 1rem 0
}

.nb-progress-bar {
    height: 100%;
    background: #000;
    transition: width .3s ease;
    position: relative
}

.nb-progress-bar::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    animation: shimmer 2s infinite
}

.nb-progress-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    font-weight: 700;
    font-size: .9rem;
    color: #000;
    z-index: 1
}

.nb-progress.small {
    height: 20px
}

.nb-progress.small .nb-progress-text {
    font-size: .8rem
}

.nb-progress.large {
    height: 40px
}

.nb-progress.large .nb-progress-text {
    font-size: 1rem
}

.nb-progress.striped .nb-progress-bar {
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-size: 1rem 1rem;
    animation: progress-stripes 1s linear infinite
}

.nb-progress.animated .nb-progress-bar {
    animation: progress-animate 2s ease-in-out infinite
}

.nb-spinner {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 4px solid #fff;
    border-top: 4px solid #000;
    border-radius: 50%;
    animation: spin 1s linear infinite
}

.nb-spinner.small {
    width: 20px;
    height: 20px;
    border-width: 2px
}

.nb-spinner.large {
    width: 60px;
    height: 60px;
    border-width: 6px
}

.nb-spinner.dots {
    width: 40px;
    height: 40px;
    border: none;
    background: none;
    position: relative
}

.nb-spinner.dots::before, .nb-spinner.dots::after, .nb-spinner.dots::before {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #000;
    animation: spinner-dots 1.4s ease-in-out infinite both
}

.nb-spinner.dots::before {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    animation-delay: -0.32s
}

.nb-spinner.dots::after {
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    animation-delay: -0.16s
}

.nb-spinner.dots span {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #000;
    animation: spinner-dots 1.4s ease-in-out infinite both
}

@keyframes spin {
    0% {
        transform: rotate(0deg)
    }
    100% {
        transform: rotate(360deg)
    }
}

@keyframes shimmer {
    0% {
        transform: translateX(-100%)
    }
    100% {
        transform: translateX(100%)
    }
}

@keyframes progress-stripes {
    0% {
        background-position: 1rem 0
    }
    100% {
        background-position: 0 0
    }
}

@keyframes progress-animate {
    0%, 100% {
        transform: translateX(-100%)
    }
    50% {
        transform: translateX(100%)
    }
}

@keyframes spinner-dots {
    0%, 80%, 100% {
        transform: scale(0)
    }
    40% {
        transform: scale(1)
    }
}

.nb-progress.default {
    border-color: #000;
    box-shadow: 4px 4px 0px #000
}

.nb-progress.default .nb-progress-bar {
    background: #000
}

.nb-spinner.default {
    border-top-color: #000
}

.nb-spinner.default.dots::before, .nb-spinner.default.dots::after, .nb-spinner.default.dots span {
    background: #000
}

.nb-progress.orange {
    border-color: #ff5733;
    box-shadow: 4px 4px 0px #ff5733
}

.nb-progress.orange .nb-progress-bar {
    background: #ff5733
}

.nb-spinner.orange {
    border-top-color: #ff5733
}

.nb-spinner.orange.dots::before, .nb-spinner.orange.dots::after, .nb-spinner.orange.dots span {
    background: #ff5733
}

.nb-progress.blue {
    border-color: #0077b6;
    box-shadow: 4px 4px 0px #0077b6
}

.nb-progress.blue .nb-progress-bar {
    background: #0077b6
}

.nb-spinner.blue {
    border-top-color: #0077b6
}

.nb-spinner.blue.dots::before, .nb-spinner.blue.dots::after, .nb-spinner.blue.dots span {
    background: #0077b6
}

.nb-progress.green {
    border-color: #40d39c;
    box-shadow: 4px 4px 0px #40d39c
}

.nb-progress.green .nb-progress-bar {
    background: #40d39c
}

.nb-spinner.green {
    border-top-color: #40d39c
}

.nb-spinner.green.dots::before, .nb-spinner.green.dots::after, .nb-spinner.green.dots span {
    background: #40d39c
}

.nb-progress.sky-blue {
    border-color: #b9e2f8;
    box-shadow: 4px 4px 0px #b9e2f8
}

.nb-progress.sky-blue .nb-progress-bar {
    background: #b9e2f8
}

.nb-spinner.sky-blue {
    border-top-color: #b9e2f8
}

.nb-spinner.sky-blue.dots::before, .nb-spinner.sky-blue.dots::after, .nb-spinner.sky-blue.dots span {
    background: #b9e2f8
}

.nb-progress.pale-red {
    border-color: #ffc5c8;
    box-shadow: 4px 4px 0px #ffc5c8
}

.nb-progress.pale-red .nb-progress-bar {
    background: #ffc5c8
}

.nb-spinner.pale-red {
    border-top-color: #ffc5c8
}

.nb-spinner.pale-red.dots::before, .nb-spinner.pale-red.dots::after, .nb-spinner.pale-red.dots span {
    background: #ffc5c8
}

.nb-progress.pale-violet {
    border-color: #bc98cb;
    box-shadow: 4px 4px 0px #bc98cb
}

.nb-progress.pale-violet .nb-progress-bar {
    background: #bc98cb
}

.nb-spinner.pale-violet {
    border-top-color: #bc98cb
}

.nb-spinner.pale-violet.dots::before, .nb-spinner.pale-violet.dots::after, .nb-spinner.pale-violet.dots span {
    background: #bc98cb
}

.nb-progress.soft-blue {
    border-color: #4799ae;
    box-shadow: 4px 4px 0px #4799ae
}

.nb-progress.soft-blue .nb-progress-bar {
    background: #4799ae
}

.nb-spinner.soft-blue {
    border-top-color: #4799ae
}

.nb-spinner.soft-blue.dots::before, .nb-spinner.soft-blue.dots::after, .nb-spinner.soft-blue.dots span {
    background: #4799ae
}

.nb-progress.pale-cyan {
    border-color: #b9e7de;
    box-shadow: 4px 4px 0px #b9e7de
}

.nb-progress.pale-cyan .nb-progress-bar {
    background: #b9e7de
}

.nb-spinner.pale-cyan {
    border-top-color: #b9e7de
}

.nb-spinner.pale-cyan.dots::before, .nb-spinner.pale-cyan.dots::after, .nb-spinner.pale-cyan.dots span {
    background: #b9e7de
}

.nb-progress.pale-yellow {
    border-color: #fdfd96;
    box-shadow: 4px 4px 0px #fdfd96
}

.nb-progress.pale-yellow .nb-progress-bar {
    background: #fdfd96
}

.nb-spinner.pale-yellow {
    border-top-color: #fdfd96
}

.nb-spinner.pale-yellow.dots::before, .nb-spinner.pale-yellow.dots::after, .nb-spinner.pale-yellow.dots span {
    background: #fdfd96
}

.nb-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem
}

@media (min-width: 576px) {
    .nb-container {
        max-width: 540px
    }
}

@media (min-width: 768px) {
    .nb-container {
        max-width: 720px
    }
}

@media (min-width: 992px) {
    .nb-container {
        max-width: 960px
    }
}

@media (min-width: 1200px) {
    .nb-container {
        max-width: 1140px
    }
}

.nb-hidden {
    display: none !important
}

.nb-block {
    display: block !important
}

.nb-inline {
    display: inline !important
}

.nb-inline-block {
    display: inline-block !important
}

.nb-flex {
    display: flex !important
}

.nb-inline-flex {
    display: inline-flex !important
}

.nb-grid {
    display: grid !important
}

@media (min-width: 576px) {
    .nb-hidden-sm {
        display: none !important
    }

    .nb-block-sm {
        display: block !important
    }

    .nb-flex-sm {
        display: flex !important
    }

    .nb-grid-sm {
        display: grid !important
    }
}

@media (min-width: 768px) {
    .nb-hidden-md {
        display: none !important
    }

    .nb-block-md {
        display: block !important
    }

    .nb-flex-md {
        display: flex !important
    }

    .nb-grid-md {
        display: grid !important
    }
}

@media (min-width: 992px) {
    .nb-hidden-lg {
        display: none !important
    }

    .nb-block-lg {
        display: block !important
    }

    .nb-flex-lg {
        display: flex !important
    }

    .nb-grid-lg {
        display: grid !important
    }
}

@media (min-width: 1200px) {
    .nb-hidden-xl {
        display: none !important
    }

    .nb-block-xl {
        display: block !important
    }

    .nb-flex-xl {
        display: flex !important
    }

    .nb-grid-xl {
        display: grid !important
    }
}

.nb-grid-1 {
    display: grid;
    grid-template-columns:1fr;
    gap: 1rem
}

.nb-grid-2 {
    display: grid;
    grid-template-columns:1fr;
    gap: 1rem
}

@media (min-width: 576px) {
    .nb-grid-2 {
        grid-template-columns:repeat(2, 1fr);
        gap: 1.5rem
    }
}

.nb-grid-3 {
    display: grid;
    grid-template-columns:1fr;
    gap: 1rem
}

@media (min-width: 576px) {
    .nb-grid-3 {
        grid-template-columns:repeat(2, 1fr);
        gap: 1.5rem
    }
}

@media (min-width: 768px) {
    .nb-grid-3 {
        grid-template-columns:repeat(3, 1fr);
        gap: 2rem
    }
}

.nb-grid-4 {
    display: grid;
    grid-template-columns:1fr;
    gap: 1rem
}

@media (min-width: 576px) {
    .nb-grid-4 {
        grid-template-columns:repeat(2, 1fr);
        gap: 1.5rem
    }
}

@media (min-width: 768px) {
    .nb-grid-4 {
        grid-template-columns:repeat(3, 1fr);
        gap: 2rem
    }
}

@media (min-width: 992px) {
    .nb-grid-4 {
        grid-template-columns:repeat(4, 1fr);
        gap: 2rem
    }
}

.nb-flex-col {
    display: flex;
    flex-direction: column;
    gap: 1rem
}

.nb-flex-row {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    flex-wrap: wrap
}

@media (min-width: 576px) {
    .nb-flex-col-sm {
        flex-direction: column
    }

    .nb-flex-row-sm {
        flex-direction: row
    }
}

@media (min-width: 768px) {
    .nb-flex-col-md {
        flex-direction: column
    }

    .nb-flex-row-md {
        flex-direction: row
    }
}

.nb-p-1 {
    padding: .5rem
}

.nb-p-2 {
    padding: 1rem
}

.nb-p-3 {
    padding: 1.5rem
}

.nb-p-4 {
    padding: 2rem
}

.nb-m-1 {
    margin: .5rem
}

.nb-m-2 {
    margin: 1rem
}

.nb-m-3 {
    margin: 1.5rem
}

.nb-m-4 {
    margin: 2rem
}

@media (min-width: 576px) {
    .nb-p-sm-1 {
        padding: .75rem
    }

    .nb-p-sm-2 {
        padding: 1.5rem
    }

    .nb-p-sm-3 {
        padding: 2rem
    }

    .nb-p-sm-4 {
        padding: 3rem
    }

    .nb-m-sm-1 {
        margin: .75rem
    }

    .nb-m-sm-2 {
        margin: 1.5rem
    }

    .nb-m-sm-3 {
        margin: 2rem
    }

    .nb-m-sm-4 {
        margin: 3rem
    }
}

@media (min-width: 768px) {
    .nb-p-md-1 {
        padding: 1rem
    }

    .nb-p-md-2 {
        padding: 2rem
    }

    .nb-p-md-3 {
        padding: 3rem
    }

    .nb-p-md-4 {
        padding: 4rem
    }

    .nb-m-md-1 {
        margin: 1rem
    }

    .nb-m-md-2 {
        margin: 2rem
    }

    .nb-m-md-3 {
        margin: 3rem
    }

    .nb-m-md-4 {
        margin: 4rem
    }
}

.nb-text-center {
    text-align: center
}

.nb-text-left {
    text-align: left
}

.nb-text-right {
    text-align: right
}

.nb-text-sm {
    font-size: .875rem
}

.nb-text-base {
    font-size: 1rem
}

.nb-text-lg {
    font-size: 1.125rem
}

.nb-text-xl {
    font-size: 1.25rem
}

.nb-text-2xl {
    font-size: 1.5rem
}

.nb-text-3xl {
    font-size: 2rem
}

@media (min-width: 576px) {
    .nb-text-sm-lg {
        font-size: 1rem
    }

    .nb-text-sm-xl {
        font-size: 1.25rem
    }

    .nb-text-sm-2xl {
        font-size: 1.5rem
    }

    .nb-text-sm-3xl {
        font-size: 2rem
    }
}

@media (min-width: 768px) {
    .nb-text-md-lg {
        font-size: 1.125rem
    }

    .nb-text-md-xl {
        font-size: 1.5rem
    }

    .nb-text-md-2xl {
        font-size: 2rem
    }

    .nb-text-md-3xl {
        font-size: 2.5rem
    }
}

.nb-w-full {
    width: 100%
}

.nb-w-auto {
    width: auto
}

.nb-max-w-sm {
    max-width: 300px
}

.nb-max-w-md {
    max-width: 400px
}

.nb-max-w-lg {
    max-width: 500px
}

.nb-max-w-xl {
    max-width: 600px
}

@media (min-width: 576px) {
    .nb-max-w-sm-lg {
        max-width: 350px
    }

    .nb-max-w-sm-xl {
        max-width: 450px
    }
}

@media (min-width: 768px) {
    .nb-max-w-md-lg {
        max-width: 450px
    }

    .nb-max-w-md-xl {
        max-width: 550px
    }
}
