body {
    font-family: 'Archia';
}

a {
    color: #7b493a;
}

.dropdown-menu {
    background-color: #7b493a;
    border: 0;
    border-radius: 0;
}


.dropdown-item:hover, .dropdown-item:active, .dropdown-item:focus {
    color: #63b4f6 !important;
    background-color: #fff !important;
}

.navbar {
    padding: 1rem 1rem;
}

.login-box {
    box-shadow: 0 0 5px rgba(0,0,0,0.25);
    border-radius: 0.75rem;
}

.btn {
    background-color: #7b493a;
    color: #fff;
}

.btn.lg {
    padding: 0.75rem .75rem;
}

.btn.block {
    width: 100%;
    display: block;
}

.btn:hover, .btn:active, .btn:focus {
    background-color: #7b493a;
    color: #fff;
}

.form-control {
    border: 1px solid #eee;
    height: calc(2em + .75rem + 2px);
    -webkit-appearance: none;
    appearance: none;
}

.form-control, .btn {
    border-radius: 0.5rem;
}

.login-box > .title {
    background-color: #7b493a;
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
    text-align: center;
    color: #fff;
    font-weight: 600;
}

.records {
    font-size: 80%;
}

.records > .record.active {
    background-color: #c7c8c7;
    color: #fff;
}

.records .btn {
    font-size: inherit;
}

.btn.delete {
    background-color: #f43366;
}

.btn.edit {
    background-color: #4ce0fd;
}

main > section {
    padding: 3rem 0;
}

.price-records .form-control {
    font-size: 80%;
}

.pagination > ul {
    list-style: none;
    padding: 0;
}

.pagination > ul > li > a {
    position: relative;
    line-height: 1.42857143;
    color: #333;
    text-decoration: none;
    padding: 5px 10px;
    display: block;
    border: 1px solid #e3e3e3;
    margin-left: -1px;
}

.pagination > ul > li.disabled > a {
    pointer-events: none;
    cursor: auto;
    color: #e3e3e3;
}

.pagination > ul > li.active > a {
    background-color: #7b493a;
    color: #fff;
    border-color: #7b493a;
}

.custom-control-input:checked ~ .custom-control-label::before {
    border-color: #7b493a;
    background-color: #7b493a;
}

.navbar-brand > img {
    height: 2.5rem;
}

#cocoloa-header {
    background-color: #f3ebde;
    box-shadow: 0 0 5px rgba(0,0,0,.15);
}

@media( min-width: 768px ){
    .navbar-brand > img {
        height: 2.75rem;
    }
}

@media( min-width: 992px ){
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: 1rem;
        padding-left: 1rem;
    }
}