body {
    background: #f4f6f9;
}

.navbar-webnotas {
    background: linear-gradient(135deg, #263238, #37474f);
    border: none;
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
}

    .navbar-webnotas .navbar-brand {
        color: #fff !important;
        font-weight: 600;
        letter-spacing: .3px;
        padding: 18px 20px;
    }

    .navbar-webnotas .navbar-nav > li > a {
        color: #e8eef2 !important;
        font-weight: 500;
        padding-top: 18px;
        padding-bottom: 18px;
        transition: all .2s ease;
    }

        .navbar-webnotas .navbar-nav > li > a:hover,
        .navbar-webnotas .navbar-nav > .open > a,
        .navbar-webnotas .navbar-nav > .open > a:hover {
            background: rgba(255,255,255,.10) !important;
            color: #fff !important;
        }

    .navbar-webnotas .dropdown-menu {
        border: none;
        border-radius: 0 0 6px 6px;
        box-shadow: 0 6px 18px rgba(0,0,0,.18);
        padding: 8px 0;
        min-width: 230px;
    }

        .navbar-webnotas .dropdown-menu > li > a,
        .navbar-webnotas .dropdown-menu a {
            display: block;
            padding: 9px 18px;
            color: #34495e;
            font-size: 13px;
            text-decoration: none;
            transition: all .15s ease;
        }

            .navbar-webnotas .dropdown-menu > li > a:hover,
            .navbar-webnotas .dropdown-menu a:hover {
                background: #eef3f7;
                color: #1f5f8b;
                padding-left: 23px;
            }

    .navbar-webnotas .caret {
        margin-left: 5px;
    }

.menu-chat-badge {
    position: absolute;
    top: 8px;
    right: 7px;
    background: #d9534f;
    color: #fff;
    font-size: 10px;
    min-width: 18px;
    height: 18px;
    line-height: 18px;
    padding: 0 5px;
    border-radius: 10px;
}

.body-content {
    background: #fff;
    margin-top: 18px;
    padding: 20px 25px;
    border-radius: 6px;
    box-shadow: 0 1px 5px rgba(0,0,0,.08);
}

footer {
    color: #777;
    font-size: 12px;
}

@media (max-width: 767px) {
    .navbar-webnotas .navbar-nav > li > a {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .navbar-webnotas .dropdown-menu a {
        color: #e8eef2;
    }

    .body-content {
        margin-top: 10px;
        padding: 15px;
        border-radius: 0;
    }
}

/* ===== BOTÕES GERAIS ===== */

.btn {
    border-radius: 6px;
    border: none;
    font-weight: 600;
    transition: all .18s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,.08);
    padding: 7px 14px;
}

    .btn:focus,
    .btn:active:focus {
        outline: none !important;
    }

    .btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(0,0,0,.15);
    }

    .btn:active {
        transform: scale(.98);
    }

/* ===== PRIMARY ===== */

.btn-primary {
    background: linear-gradient(135deg, #1976d2, #1565c0);
    color: #fff;
}

    .btn-primary:hover,
    .btn-primary:focus {
        background: linear-gradient(135deg, #1e88e5, #1976d2);
        color: #fff;
    }

/* ===== SUCCESS ===== */

.btn-success {
    background: linear-gradient(135deg, #2e7d32, #388e3c);
    color: #fff;
}

    .btn-success:hover,
    .btn-success:focus {
        background: linear-gradient(135deg, #43a047, #2e7d32);
        color: #fff;
    }

/* ===== DANGER ===== */

.btn-danger {
    background: linear-gradient(135deg, #c62828, #d32f2f);
    color: #fff;
}

    .btn-danger:hover,
    .btn-danger:focus {
        background: linear-gradient(135deg, #e53935, #c62828);
        color: #fff;
    }

/* ===== WARNING ===== */

.btn-warning {
    background: linear-gradient(135deg, #ef6c00, #fb8c00);
    color: #fff;
}

    .btn-warning:hover,
    .btn-warning:focus {
        background: linear-gradient(135deg, #ff9800, #f57c00);
        color: #fff;
    }

/* ===== INFO ===== */

.btn-info {
    background: linear-gradient(135deg, #00838f, #0097a7);
    color: #fff;
}

    .btn-info:hover,
    .btn-info:focus {
        background: linear-gradient(135deg, #00acc1, #00838f);
        color: #fff;
    }

/* ===== DEFAULT ===== */

.btn-default {
    background: #fff;
    border: 1px solid #dcdfe3;
    color: #34495e;
}

    .btn-default:hover {
        background: #f8f9fb;
        color: #1f2d3d;
    }

/* ===== BOTÕES PEQUENOS ===== */

.btn-xs {
    border-radius: 4px;
    font-size: 11px;
}

.btn-sm {
    border-radius: 5px;
}

/* ===== ÍCONES ===== */

.btn .glyphicon {
    margin-right: 4px;
}