﻿@charset "UTF-8";
/* CSS Document */


/* ----------------------------------------------------- */
/* ------------------------ FONTES --------------------- */



@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Bol-webfont.eot');
    src: url('../fonts/Lato-Bol-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato-Bol-webfont.woff') format('woff'), url('../fonts/Lato-Bol-webfont.ttf') format('truetype'), url('../fonts/Lato-Bol-webfont.svg#LatoBold') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Reg-webfont.eot');
    src: url('../fonts/Lato-Reg-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato-Reg-webfont.woff') format('woff'), url('../fonts/Lato-Reg-webfont.ttf') format('truetype'), url('../fonts/Lato-Reg-webfont.svg#LatoRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* ------------------------------------------------------ */
/* ------------------------ GERAL ----------------------- */

body {
    font-size: 14px;
    background-color: #fff;
    font-family: 'Lato', Arial, sans-serif;
    font-weight: normal;
    color: #333;
}

.container {
    margin: auto;
}

.clearfloat {
    clear: both;
    height: 0;
    font-size: 1px;
    line-height: 0px;
}

a {
    color: #333;
    text-decoration: none;
}

    a:hover {
        color: #000;
    }


.show_480 {
    display: none;
}

.show_640 {
    display: none;
}

.show_800 {
    display: none;
}

/* ----------------------------------------------------------- */
/* ------------------------ ESTILO --------------------------- */


/* -------------------- LOGIN ------------------- */

.login {
    margin-top: 150px;
    background-color: #f5f5f5;
    background-image: url(../imagens/fundo_hachura.png);
}

#caixa_login {
    width: 500px;
    margin: 0px auto;
    *left: 50%;
    *margin-left: -150px;
    border-radius: 6px;
    -moz-border-radius: 6x;
    -webkit-border-radius: 6px;
    position: relative;
}

#area_login {
    width: 328px;
    *width: 400px;
    height: 178px;
    float: left;
    padding: 45px;
    background-color: #fff;
    border-radius: 6px 0px 0px 6px;
    -moz-border-radius: 6x 0px 0px 6px;
    -webkit-border-radius: 6px 0px 0px 6px;
    box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 8px 8px rgba(0,0,0,0.03) inset, 0px 0px 12px 12px rgba(0,0,0,0.01) inset;
    -moz-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 8px 8px rgba(0,0,0,0.03) inset, 0px 0px 12px 12px rgba(0,0,0,0.01) inset;
    -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 8px 8px rgba(0,0,0,0.03) inset, 0px 0px 12px 12px rgba(0,0,0,0.01) inset;
    border: 1px solid #fff;
    z-index: 3;
    position: relative;
}

#cabecalho_login {
    height: 60px;
    position: relative;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #bbb;
}

    #cabecalho_login img {
        float: left;
        position: absolute;
        left: -71px;
        width: 160px;
        height: auto;
    }

    #cabecalho_login #titulo_login {
        position: absolute;
        left: 100px;
        top: 14px;
    }

    #cabecalho_login h4 {
        margin-top: 3px;
        text-transform: lowercase;
        font-size: 1.5em;
        color: #222;
    }

    #cabecalho_login h5 {
        text-transform: uppercase;
        font-size: 0.9em;
        font-weight: lighter;
        color: #4c4c4c;
    }

#acoes_login {
    padding: 0px 60px 0px 10px;
    ;
}


    #acoes_login .usuario {
        background-image: url(../imagens/icone_login_usuario.png);
        background-repeat: no-repeat;
        padding-left: 40px;
        margin-bottom: 10px;
    }

    #acoes_login .senha {
        background-image: url(../imagens/icone_login_senha.png);
        background-repeat: no-repeat;
        padding-left: 40px;
        margin-bottom: 10px;
    }



    #acoes_login a {
        font-size: 0.82em;
        text-decoration: none;
        color: #333;
    }

#botao_login {
    height: 268px;
    width: 68px;
    border: 1px solid #2f96db;
    display: block;
    float: left;
    background-image: url(../imagens/botao_login.png);
    background-color: #146cac;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 0px 6px 6px 0px;
    -moz-border-radius: 0px 6px 6px 0px;
    -webkit-border-radius: 0px 6px 6px 0px;
    box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1);
    z-index: 4;
    position: relative;
    box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 4px 4px rgba(0,0,0,0.03) inset, 0px 0px 9px 9px rgba(0,0,0,0.05) inset;
    -moz-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 4px 4px rgba(0,0,0,0.03) inset, 0px 0px 9px 9px rgba(0,0,0,0.05) inset;
    -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 4px 4px rgba(0,0,0,0.03) inset, 0px 0px 9px 9px rgba(0,0,0,0.05) inset;
}

    #botao_login:hover {
        background-color: #126aa5;
        box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 4px 4px rgba(0,0,0,0.06) inset, 0px 0px 9px 9px rgba(0,0,0,0.1) inset;
        -moz-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 4px 4px rgba(0,0,0,0.03) inset, 0px 0px 9px 9px rgba(0,0,0,0.05) inset;
        -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 4px 4px rgba(0,0,0,0.03) inset, 0px 0px 9px 9px rgba(0,0,0,0.05) inset;
    }

#caixa_login .sombra {
    background-image: url(../imagens/sombra_login.png);
    height: 40px;
    width: 120%;
    position: relative;
    left: -70px;
    top: -12px;
    z-index: 1;
}

/* -------------------- PRE-CADASTRO ------------------- */

.precadastro {
    margin-top: 20px;
    background-color: #f5f5f5;
    background-image: url(../imagens/fundo_hachura.png);
}

#caixa_precadastro {
    width: 800px;
    margin: 0px auto;
    *left: 50%;
    *margin-left: -400px;
    border-radius: 6px;
    -moz-border-radius: 6x;
    -webkit-border-radius: 6px;
    position: relative;
}

#area_precadastro {
    width: 728px;
    *width: 800px;
    height: 578px;
    float: left;
    padding: 45px;
    background-color: #fff;
    border-radius: 6px 0px 0px 6px;
    -moz-border-radius: 6x 0px 0px 6px;
    -webkit-border-radius: 6px 0px 0px 6px;
    box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 8px 8px rgba(0,0,0,0.03) inset, 0px 0px 12px 12px rgba(0,0,0,0.01) inset;
    -moz-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 8px 8px rgba(0,0,0,0.03) inset, 0px 0px 12px 12px rgba(0,0,0,0.01) inset;
    -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1), 0px 0px 8px 8px rgba(0,0,0,0.03) inset, 0px 0px 12px 12px rgba(0,0,0,0.01) inset;
    border: 1px solid #fff;
    z-index: 3;
    position: relative;
}

/* ------------------- INICIO -------------------- */

#paineis_inicio {
    padding: 25px 0px;
}

    #paineis_inicio .borda {
        background-color: rgba(0,0,0,0.05);
        padding: 6px;
    }

    #paineis_inicio .largura30 {
        margin-left: 15px !important;
    }

.painel_inicio {
    float: left;
    margin-top: 0px;
    padding: 0px;
    padding: 9px 5px 10px 9px;
    border: 0px solid #fff;
    margin-bottom: 0px;
}

    .painel_inicio .titulo {
        padding: 7px 13px 2px 13px;
        display: inline-block;
        color: #fff;
        font-size: 1.1em;
        position: relative;
        top: 3px;
        *top: 0px;
        left: 5px;
        border-radius: 5px 5px 0px 0px;
        height: 20px;
        text-align: left;
        font-weight: bold;
    }

.painel_modulos .titulo,
.painel_mensagens .titulo,
.painel_favoritos .titulo {
    background-color: #222;
}


.painel_inicio h3 {
    margin-left: 10px;
    color: #555;
    font-size: 1.3em;
    font-weight: lighter;
    text-transform: lowercase;
}

.painel_modulos {
    float: left;
    width: 65%;
}

.caixa_modulo {
    width: 32.8%;
    float: left;
    background-color: #fff;
    box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.02) inset, 0px 0px 10px 10px rgba(0,0,0,0.01) inset;
    border: 1px solid #dfdfdf;
    position: relative;
    border: 1px solid #dfdfdf;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #d4d4d4;
    background-color: #fbfbfb;
    background-image: url(../imagens/fundo_modulo.png);
    background-repeat: repeat-x;
}

    .caixa_modulo a {
        padding: 78px 15px 10px 15px;
        position: relative;
        text-decoration: none;
        display: block;
    }

    .caixa_modulo:hover {
        box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.04) inset, 0px 0px 10px 10px rgba(0,0,0,0.01) inset;
        border: 1px solid #ddd !important;
    }

    .caixa_modulo h1 {
        padding: 5px;
        margin: 0px 10px;
        border-radius: 4px;
        position: relative;
        z-index: 100;
        color: #333;
        font-size: 1.3em;
        text-align: center;
        font-weight: normal;
    }

    .caixa_modulo:hover h1 {
        top: 2px;
    }

    .caixa_modulo img {
        position: absolute;
        top: 15px;
        left: 50%;
        margin-left: -32px;
        width: 64px !important;
        height: auto;
        z-index: 800;
    }

    .caixa_modulo:hover img {
        top: 18px;
    }


    .caixa_modulo .sombra {
        background-image: url(../imagens/base_caixa.png);
        background-repeat: no-repeat;
        background-position: bottom right;
        height: 15px;
        width: 100%;
        position: absolute;
        top: -15px;
        right: 0px;
    }

    .caixa_modulo:hover .sombra {
        background-image: none;
    }

.painel_mensagens {
    float: left;
    width: 65%;
    margin-bottom: 1%;
}

.caixa_mensagem {
    width: 48.9%;
    margin: 0.3%;
    float: left;
    color: #111;
    font-size: 0.9em;
    line-height: 1.1;
    text-decoration: none;
    border: 1px solid #dfdfdf;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #d4d4d4;
    background-color: #fbfbfb;
    background-image: url(../imagens/fundo_modulo.png);
    background-repeat: repeat-x;
}

    .caixa_mensagem .data {
        float: left;
        padding: 7px 7px 10px 7px;
        margin: 10px 12px 10px 10px;
        border-right: 1px dotted #ccc;
        background-color: transparent;
    }

        .caixa_mensagem .data h1 {
            font-size: 2.3em;
        }

        .caixa_mensagem .data h2 {
            font-size: 1.1em;
            line-height: 0.6;
        }

    .caixa_mensagem .texto {
        padding: 12px;
    }

.caixa_mensagem_destacado {
    width: 48.9%;
    margin: 0.3%;
    float: left;
    color: red;
    font-size: 0.9em;
    line-height: 1.1;
    text-decoration: none;
    border: 2px solid red;
    border-top: 2px solid red;
    border-bottom: 2px solid red;
    background-color: #fbfbfb;
    background-image: url(../imagens/fundo_modulo.png);
    background-repeat: repeat-x;
}

    .caixa_mensagem_destacado .data {
        float: left;
        padding: 7px 7px 10px 7px;
        margin: 10px 12px 10px 10px;
        border-right: 1px dotted #ccc;
        background-color: transparent;
    }

        .caixa_mensagem_destacado .data h1 {
            font-size: 2.3em;
        }

        .caixa_mensagem_destacado .data h2 {
            font-size: 1.1em;
            line-height: 0.6;
        }

    .caixa_mensagem_destacado .texto {
        padding: 12px;
    }

.painel_favoritos {
    float: right;
    width: 32%;
}

.caixa_favorito {
    margin: 0px;
    margin-right: 4px;
    display: block;
    position: relative;
    text-decoration: none;
    color: #454545;
    box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.01) inset, 0px 0px 10px 10px rgba(0,0,0,0.01) inset;
    position: relative;
    border: 1px solid #dfdfdf;
    border-top: 1px solid #f4f4f4;
    border-bottom: 1px solid #ccc;
    background-color: #eee;
    background-image: url(../imagens/fundo_modulo.png);
    background-repeat: repeat-x;
}

    .caixa_favorito:hover {
        box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1) inset;
        border: 1px solid #ccc !important;
    }


    .caixa_favorito img {
        position: absolute;
        left: 9px;
        top: 9px;
        width: 21px;
        height: auto;
    }

    .caixa_favorito:hover img {
        left: 10px;
        top: 10px;
    }

    .caixa_favorito a {
        color: #333;
        text-decoration: none;
        padding: 15px 0px;
        display: block;
        border-left: 0px solid #146cac;
    }

    .caixa_favorito h2 {
        margin-left: 35px;
        font-size: 0.92em;
    }

    .caixa_favorito:hover h2 {
        position: relative;
        top: 2px;
    }

    .atalho_favorito {
        float: left;
        margin-bottom: 10px;
    }

    .atalho_favorito img {
        position: relative;
        left: 9px;
        top: 4px;
        width: 21px;
        height: auto;
    }

    .atalho_favorito:hover img {
        left: 10px;
        top: 5px;
    }
/* ------------------ CABEÇALHO ----------------- */

#cabecalho {
    width: 100%;
    height: 57px;
    color: #eee;
    background-color: #4d4d4f;
    background-image: url(../imagens/fundo_cabecalho.png);
    border-bottom: 5px solid #146cac;
    *position: relative;
    *z-index: 99999;
}

    #cabecalho a {
        text-decoration: none;
        color: #eee;
    }

    #cabecalho #marca {
        width: 95px;
        height: 57px;
        float: left;
        margin: 0px 15px;
        border-left: 1px solid #444;
        border-right: 1px solid #444;
        background-color: rgba(0,0,0,0.4);
        *background-color: #222;
        box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
        -moz-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
        -webkit-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
    }

        #cabecalho #marca img {
            position: relative;
            width: 100%;
            height: auto;
            margin-top: 12px;
            left: -15px;
        }

    #cabecalho #busca {
        float: right;
        margin-top: 9px;
        margin-right: 8px;
        font-size: 1.0em;
    }

    #cabecalho #boxPesquisa_actextbox {
        height: 38px !important;
        font-size: 1.0em;
    }

    #cabecalho #busca input {
        width: 130px;
        height: 25px;
        margin: 0px;
        color: #eee !important;
        border: 1px solid #444;
        background-image: url(../imagens/cabecalho_busca_bg.png);
        background-position: right top;
        background-repeat: no-repeat;
        border-radius: 3px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        background-color: rgba(0,0,0,0.4);
        background-color: #333\9;
        box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
        -moz-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
        -webkit-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
        font-size: 1.0em;
        padding-right: 0px !important;
        padding-left: 0px !important;
        text-align: center;
    }

.sf-autocomplete.Autocomplete_SuggestionList ul li {
    text-decoration: none;
    display: block;
    padding: .2em .4em;
    line-height: 1.7;
    zoom: 1;
}

.sf-autocomplete.Marble.Autocomplete_SuggestionList {
    border: 1px solid #aaaaaa;
    background: #ffffff url(../scripts/jquery-ui/themes/base/images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x;
    color: #222222;
    font-size: 1.1em;
    -moz-border-radius-bottomright: 4px;
    -webkit-border-bottom-right-radius: 4px;
    -khtml-border-bottom-right-radius: 4px;
    border-bottom-right-radius: 4px;
    text-decoration: none;
    display: block;
    padding: .2em .4em;
    line-height: 1.5;
    zoom: 1;
}

#cabecalho #box_usuario {
    float: right;
    width: 180px;
    *width: 210px;
    height: 33px;
    margin-right: 0px;
    background-color: rgba(0,0,0,0.4);
    box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
    -moz-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
    -webkit-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
    background-image: url(../imagens/menu_usuario_icon.png);
    background-position: left top;
    background-repeat: no-repeat;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border: 1px solid #444;
}

    #cabecalho #box_usuario #nome {
        width: 110px;
        *width: 70%;
        float: left;
        padding: 8px;
        padding-left: 28px;
        font-size: 0.85em;
        line-height: 1.5;
    }

    #cabecalho #box_usuario ul {
        width: auto;
        float: left;
    }

        #cabecalho #box_usuario ul ul {
            width: 95%;
        }

    #cabecalho #box_usuario #relogio.clock {
        width: auto;
    }

/*#relogio .menu .clock {
  float:left;
    *width: 100px;
	height: 29px;
	margin:2px;
	border-right: 1px solid #555;
	background-color:transparent;
}*/

/* -------------------- MENU ------------------- */

#cabecalho #box_menu_principal {
    width: 600px;
    *float: left;
    margin-right: 15px;
    *margin-right: 0px;
    *width: 550px;
}

#cabecalho .menu {
    float: right;
    margin-top: 11px;
    background-color: #333;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    background-color: rgba(0,0,0,0.5);
    box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
    -moz-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
    -webkit-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.5) inset;
    border: 1px solid #444;
}

    #cabecalho .menu ul li {
        *width: 60px;
        float: left;
        height: 29px;
        position: relative;
        margin: 2px 2px 2px 0px;
    }

        #cabecalho .inicio ul li span,
        #cabecalho .menu ul li a {
            height: 20px;
            padding: 9px;
            padding-bottom: 0px;
            display: block;
            text-transform: uppercase;
            font-size: 0.85em;
            color: #fff;
        }

    #cabecalho .menu.inicio ul li {
        *width: 70%;
    }

    #cabecalho .menu ul #nome_modulo {
        *width: 100px;
        height: 29px;
        margin: 2px;
        border-right: 1px solid #555;
        background-color: transparent;
    }

        #cabecalho .menu ul #nome_modulo a {
            font-size: 1.1em;
            height: 21px;
            padding: 8px 15px 0px;
        }

        #cabecalho .menu ul #nome_modulo:hover,
        #cabecalho .menu ul li.ativo {
            background-color: #146cac;
            background-image: url(../imagens/textura_azul.png);
            color: #fff;
        }

            #cabecalho .menu ul #nome_modulo:hover a {
                color: #fff;
            }

    #cabecalho .menu ul li:hover {
        background-color: #fff;
        background-image: none;
    }

#cabecalho .inicio ul li:hover {
    background-color: transparent;
}

#cabecalho .menu ul li:hover a {
    color: #eee;
    font-weight: normal;
    background-color: #333;
    background-image: url(../imagens/fundo_escuro.png);
}

#cabecalho .menu ul li:hover li a {
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,0) inset;
}

#cabecalho .menu .dropdown_pequeno,
#cabecalho .menu .dropdown_medio,
#cabecalho .menu .dropdown_grande {
    margin: 0px auto;
    float: left;
    position: absolute;
    z-index: 99999999999;
    *z-index: 99;
    top: 28px;
    left: -999em; /* Esconde o drop down */
    text-align: left;
    padding: 5px 20px 20px 0px;
    background-color: #333;
    background-image: url(../imagens/fundo_escuro.png);
    border: 1px solid #444;
    border-top: 0px;
    -webkit-border-radius: 0px 0px 4px 4px;
    -moz-border-radius: 0px 0px 4px 4px;
    border-radius: 0px 0px 4px 4px;
    -webkit-box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 3px 2px 2px rgba(0, 0, 0, 0.08);
}

#cabecalho .menu .dropdown_pequeno {
    width: 540px;
}

#cabecalho .menu .dropdown_medio {
    width: 750px;
}

#cabecalho .menu .dropdown_grande {
    width: 1100px;
}

#cabecalho #box_usuario.menu li:hover .dropdown_pequeno {
    left: -200px;
}

#cabecalho .menu li:hover .dropdown_pequeno {
    left: -70px;
}

#cabecalho .menu li:hover .dropdown_medio {
    left: -120px !important;
}

#cabecalho .menu li:hover .dropdown_grande {
    left: -150px;
}

#cabecalho .menu .coluna {
    float: left;
}



#cabecalho .menu .submenu {
    margin: 0px 0px 5px 0px;
    padding: 10px 1px 4px 17px;
    border-bottom: 0px solid #666666;
    text-transform: uppercase;
    color: #fff;
    font-weight: bold;
    display: block;
    clear: both;
}

#cabecalho .menu li ul {
    padding: 0px 0px 0px 15px;
    margin: 0px;
    height: auto !important;
    float: none;
}

    #cabecalho .menu li ul li {
        height: auto !important;
        padding: 2px 1px;
        margin: 0px;
        float: none;
        text-align: left;
        width: 100%;
        border-top: 1px dashed #666;
        display: block;
        text-transform: none;
        background-color: transparent;
    }

        #cabecalho .menu li ul li:hover {
            background-color: transparent;
        }

        #cabecalho .menu li ul li a,
        #cabecalho .menu li ul li.ativo a {
            padding: 4px;
            margin: 0px;
            border: 0px;
            color: #fff;
            display: block;
            font-weight: bold;
            height: auto;
            text-transform: none;
        }

            #cabecalho .menu li ul li a:hover,
            #cabecalho .menu li ul li.ativo a:hover {
                color: #fff;
                border: 0px;
                background-color: #444;
                background-image: none;
            }



/* ------------------- CORPO -------------------- */

#corpo {
    background-color: #f5f5f5;
    background-image: url(../imagens/fundo_hachura.png);
    margin: 0px;
}


/* ------------------ MENU MODULOS ---------------- */

.menu_modulos {
    padding: 8px 0px;
    background-color: #EBF4F7;
    background-image: url(../imagens/menu_modulos.png);
    background-repeat: repeat-x;
    background-position: center;
    box-shadow: inset 0px 0px 4px 1px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0px 0px 4px 1px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: inset 0px 0px 4px 1px rgba(0, 0, 0, 0.05);
}

    .menu_modulos ul {
        background-image: url(../imagens/menu_modulos_linha.png);
        background-repeat: repeat-y;
        background-position: right;
    }

        .menu_modulos ul li {
            width: 10%;
            float: left;
            text-align: center;
            background-image: url(../imagens/menu_modulos_linha.png);
            background-repeat: no-repeat;
            background-position: left;
        }

            .menu_modulos ul li a {
                display: block;
                width: 100%;
                padding: 35px 0px 7px;
                background-position: center 11px;
                background-repeat: no-repeat;
            }

                .menu_modulos ul li a:hover {
                    padding: 36px 0px 5px;
                    color: #333;
                    background-color: #fbfbfb;
                    border-top: 1px solid #eaeaea;
                    background-position: center 12px;
                    -webkit-box-shadow: inset 0px 0px 13px 1px rgba(0, 0, 0, 0.05);
                    -moz-box-shadow: inset 0px 0px 13px 1px rgba(0, 0, 0, 0.05);
                    box-shadow: inset 0px 0px 13px 1px rgba(0, 0, 0, 0.05);
                }

                .menu_modulos ul li a.faturas {
                    background-image: url(../imagens/icone_menu_faturas.png);
                }

                .menu_modulos ul li a.boletos {
                    background-image: url(../imagens/icone_menu_boletos.png);
                }

                .menu_modulos ul li a.negociacoes {
                    background-image: url(../imagens/icone_menu_parcelamento.png);
                }

                .menu_modulos ul li a.lancamentos {
                    background-image: url(../imagens/icone_menu_lancamentos.png);
                }

                .menu_modulos ul li a.servicos {
                    background-image: url(../imagens/icone_menu_servicos.png);
                }

                .menu_modulos ul li a.cadastro {
                    background-image: url(../imagens/icone_menu_cadastro.png);
                }

                .menu_modulos ul li a.leituras {
                    background-image: url(../imagens/icone_menu_leituras.png);
                }

                .menu_modulos ul li a.hidrometros {
                    background-image: url(../imagens/icone_menu_leituras.png);
                }

                .menu_modulos ul li a.historico {
                    background-image: url(../../Content/imagens/icone_menu_historico.png);
                }

                .menu_modulos ul li a.hidrometro {
                    background-image: url(../../Content/imagens/icone_menu_leituras.png);
                }

                .menu_modulos ul li a.atendimentos {
                    background-image: url(../../Content/imagens/botao_registro_icon.png);
                }

                .menu_modulos ul li a.dashboard {
                    background-image: url(../../Content/imagens/icone_menu_dashboard.png);
                }

                .menu_modulos ul li a.assistenciatecnica {
                    background-image: url(../../Content/imagens/icone_menu_assistenciatecnica.png);
                }

                .menu_modulos ul li a.fabricante {
                    background-image: url(../../Content/imagens/icone_menu_fabricante.png);
                }

                .menu_modulos ul li a.sgeservicos {
                    background-image: url(../../Content/imagens/icone_menu_sgeservicos.png);
                }

                .menu_modulos ul li a.fornecedor {
                    background-image: url(../../Content/imagens/icone_menu_fornecedor.png);
                }

                .menu_modulos ul li a.gerencia {
                    background-image: url(../../Content/imagens/icone_menu_gerencia.png);
                }

                .menu_modulos ul li a.itemespecificacao {
                    background-image: url(../../Content/imagens/icone_menu_itemespecificacao.png);
                }

                .menu_modulos ul li a.pecas {
                    background-image: url(../../Content/imagens/icone_menu_pecas.png);
                }

                .menu_modulos ul li a.tipoequipamento {
                    background-image: url(../../Content/imagens/icone_menu_tipoequipamento.png);
                }

                .menu_modulos ul li a.acessorios {
                    background-image: url(../../Content/imagens/icone_menu_acessorios.png);
                }

                .menu_modulos ul li a.ligacaonova {
                    background-image: url(../../Content/imagens/icone_menu_ligacaonova.png);
                }

                .menu_modulos ul li a.coletores {
                    background-image: url(../../Content/imagens/icone_menu_coletores.png);
                }

                .menu_modulos ul li a.logradouro {
                    background-image: url(../../Content/imagens/icone_menu_fabricante.png);
                }

                .menu_modulos ul li a.contaservico {
                    background-image: url(../../Content/imagens/icone_menu_cadastro.png);
                }

                .menu_modulos ul li a.precoservicos {
                    background-image: url(../../Content/imagens/icone_menu_faturas.png);
                }

                .menu_modulos ul li a.tarifaaguaesgoto {
                    background-image: url(../../Content/imagens/icone_menu_pecas.png);
                }

                .menu_modulos ul li a.programacao {
                    background-image: url(../../Content/imagens/icone_menu_ordemservico.png);
                }

                .menu_modulos ul li a.ativo {
                    background-color: #efefef;
                    -webkit-box-shadow: inset 0px 0px 8px 1px rgba(0, 0, 0, 0.08);
                    -moz-box-shadow: inset 0px 0px 8px 1px rgba(0, 0, 0, 0.08);
                    box-shadow: inset 0px 0px 8px 1px rgba(0, 0, 0, 0.08);
                }

                    .menu_modulos ul li a.ativo:hover {
                        padding: 34px 0px 7px;
                        background-position: center 10px;
                        -webkit-box-shadow: inset 0px 0px 8px 1px rgba(0, 0, 0, 0.08);
                        -moz-box-shadow: inset 0px 0px 8px 1px rgba(0, 0, 0, 0.08);
                        box-shadow: inset 0px 0px 8px 1px rgba(0, 0, 0, 0.08);
                    }

/* ------------------ MENU MODULOS ---------------- */

.menu_modulos8 {
    padding: 8px 0px;
    background-color: #EBF4F7;
    background-image: url(../imagens/menu_modulos.png);
    background-repeat: repeat-x;
    background-position: center;
    background-size: auto 100%;
    box-shadow: inset 0px 0px 4px 1px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0px 0px 4px 1px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: inset 0px 0px 4px 1px rgba(0, 0, 0, 0.05);
}

    .menu_modulos8 ul {
        background-image: url(../imagens/menu_modulos_linha_base.png), url(../imagens/menu_modulos_linha.png);
        background-repeat: repeat-x, repeat-y;
        background-position: left, right;
    }

        li.menu_modulos8_last_child {
            width: 14%;
            float: left;
            text-align: center;
            background-image: url(../imagens/menu_modulos_linha_base.png), url(../imagens/menu_modulos_linha.png), url(../imagens/menu_modulos_linha.png) !important;
            background-repeat: repeat-x, no-repeat, no-repeat !important;
            background-position: left, left, right !important;
        }

        .menu_modulos8 ul li {
            width: 14%;
            float: left;
            text-align: center;
            background-image: url(../imagens/menu_modulos_linha_base.png), url(../imagens/menu_modulos_linha.png);
            background-repeat: repeat-x, no-repeat;
            background-position: left, left;
        }

            .menu_modulos8 ul li a {
                display: block;
                width: 100%;
                padding: 35px 0px 7px;
                background-position: center 11px;
                background-repeat: no-repeat;
            }

                .menu_modulos8 ul li a:hover {
                    padding: 34px 0px 5px;
                    color: #333;
                    background-color: #fbfbfb;
                    border-top: 1px solid #eaeaea;
                    background-position: center 12px;
                    -webkit-box-shadow: inset 0px 0px 13px 1px rgba(0, 0, 0, 0.05);
                    -moz-box-shadow: inset 0px 0px 13px 1px rgba(0, 0, 0, 0.05);
                    box-shadow: inset 0px 0px 13px 1px rgba(0, 0, 0, 0.05);
                }

                .menu_modulos8 ul li a.faturas {
                    background-image: url(../imagens/icone_menu_faturas.png);
                }

                .menu_modulos8 ul li a.boletos {
                    background-image: url(../imagens/icone_menu_boletos.png);
                }

                .menu_modulos8 ul li a.negociacoes {
                    background-image: url(../imagens/icone_menu_parcelamento.png);
                }

                .menu_modulos8 ul li a.lancamentos {
                    background-image: url(../imagens/icone_menu_lancamentos.png);
                }

                .menu_modulos8 ul li a.servicos {
                    background-image: url(../imagens/icone_menu_servicos.png);
                }

                .menu_modulos8 ul li a.cadastro {
                    background-image: url(../imagens/icone_menu_cadastro.png);
                }

                .menu_modulos8 ul li a.leituras {
                    background-image: url(../imagens/icone_menu_leituras.png);
                }

                .menu_modulos8 ul li a.hidrometros {
                    background-image: url(../imagens/icone_menu_leituras.png);
                }

                .menu_modulos8 ul li a.historico {
                    background-image: url(../../Content/imagens/icone_menu_historico.png);
                }

                .menu_modulos8 ul li a.hidrometro {
                    background-image: url(../../Content/imagens/icone_menu_leituras.png);
                }

                .menu_modulos8 ul li a.atendimentos {
                    background-image: url(../../Content/imagens/botao_registro_icon.png);
                }

                .menu_modulos8 ul li a.dashboard {
                    background-image: url(../../Content/imagens/icone_menu_dashboard.png);
                }

                .menu_modulos8 ul li a.assistenciatecnica {
                    background-image: url(../../Content/imagens/icone_menu_assistenciatecnica.png);
                }

                .menu_modulos8 ul li a.fabricante {
                    background-image: url(../../Content/imagens/icone_menu_fabricante.png);
                }

                .menu_modulos8 ul li a.sgeservicos {
                    background-image: url(../../Content/imagens/icone_menu_sgeservicos.png);
                }

                .menu_modulos8 ul li a.fornecedor {
                    background-image: url(../../Content/imagens/icone_menu_fornecedor.png);
                }

                .menu_modulos8 ul li a.gerencia {
                    background-image: url(../../Content/imagens/icone_menu_gerencia.png);
                }

                .menu_modulos8 ul li a.itemespecificacao {
                    background-image: url(../../Content/imagens/icone_menu_itemespecificacao.png);
                }

                .menu_modulos8 ul li a.pecas {
                    background-image: url(../../Content/imagens/icone_menu_pecas.png);
                }

                .menu_modulos8 ul li a.tipoequipamento {
                    background-image: url(../../Content/imagens/icone_menu_tipoequipamento.png);
                }

                .menu_modulos8 ul li a.acessorios {
                    background-image: url(../../Content/imagens/icone_menu_acessorios.png);
                }

                .menu_modulos8 ul li a.itempreventiva {
                    background-image: url(../../Content/imagens/icone_menu_itempreventiva.png);
                }

                .menu_modulos8 ul li a.ordemservico {
                    background-image: url(../../Content/imagens/icone_menu_ordemservico.png);
                }

                .menu_modulos8 ul li a.modelo {
                    background-image: url(../../Content/imagens/icone_menu_modelo.png);
                }

                .menu_modulos8 ul li a.equipamento {
                    background-image: url(../../Content/imagens/icone_menu_equipamento.png);
                }

                .menu_modulos8 ul li a.ligacaonova {
                    background-image: url(../../Content/imagens/icone_menu_ligacaonova.png);
                }

                .menu_modulos8 ul li a.coletores {
                    background-image: url(../../Content/imagens/icone_menu_coletores.png);
                }                

                .menu_modulos8 ul li a.ativo {
                    background-color: #efefef;
                    -webkit-box-shadow: inset 0px 0px 8px 1px rgba(0, 0, 0, 0.08);
                    -moz-box-shadow: inset 0px 0px 8px 1px rgba(0, 0, 0, 0.08);
                    box-shadow: inset 0px 0px 8px 1px rgba(0, 0, 0, 0.08);
                }

                    .menu_modulos8 ul li a.ativo:hover {
                        padding: 34px 0px 5px;
                        border-top: 1px solid #eaeaea;
                        background-position: center 12px;
                        -webkit-box-shadow: inset 0px 0px 13px 1px rgba(0, 0, 0, 0.05);
                        -moz-box-shadow: inset 0px 0px 13px 1px rgba(0, 0, 0, 0.05);
                        box-shadow: inset 0px 0px 13px 1px rgba(0, 0, 0, 0.05);
                    }

/* ------------------ TITULO ----------------- */

#titulo {
    padding-top: 15px;
    padding-bottom: 5px;
    position: relative;
    background-color: #fff;
}

    #titulo #breadscrumb {
        margin-bottom: 5px;
    }

        #titulo #breadscrumb a {
            text-decoration: none;
            font-size: 0.95em;
            color: #555;
        }

    #titulo .nome_tela,
    #subtitulo .nome_tela {
        float: left;
        font-size: 1.2em;
        margin-bottom: 15px;
        padding: 7px 12px 5px 12px;
        *padding-bottom: 7px;
        text-transform: uppercase;
    }

    #titulo .nome_tela,
    #subtitulo .nome_tela {
        background-color: #146cac;
        color: #fff;
    }

        #titulo .nome_tela.secundario,
        #subtitulo .nome_tela.secundario {
            margin-right: 20px;
            background-color: #146cac;
        }

#subtitulo .nome_tela {
    margin-bottom: 10px;
}

#titulo #filtro_unidade {
    float: left;
    width: 84%;
    padding-left: 10px;
    margin-top: -2px;
}

    #titulo #filtro_unidade .campo {
        margin-top: 0px !important;
    }

    #titulo #filtro_unidade a {
        width: 24px;
        height: 24px;
        float: left;
        margin-top: 3px;
        margin-left: 10px;
        *margin-left: 0px;
        display: block;
        background-image: url(../imagens/icone_titulo_mais.png);
        background-position: center;
        background-repeat: no-repeat;
    }

#titulo.abrir #filtro_unidade a {
    background-image: url(../imagens/icone_titulo_menos.png);
}

#titulo .acoes,
#subtitulo .acoes {
    float: right;
    margin-top: 0px;
    margin-right: 4px;
}

.box .acoes {
    margin-top: 19px !important;
}

#titulo .acoes a {
    text-decoration: none;
    font-size: 0.85em;
    color: #666;
    margin-top: 9px;
}

    #titulo .acoes a:hover {
        color: #146cac;
    }

#titulo .acoes .tipo_busca {
    display: block;
    width: 100px;
    text-align: right;
    float: right;
}

.num_registros {
    width: 80px;
    height: 30px;
    float: right;
    text-align: right;
    position: relative;
    top: -2px;
    right: 5px;
}

    .num_registros select {
        width: 100%;
    }

    .num_registros div.selector span {
        width: 15px;
        padding: 0 40px 0 2px;
    }

#titulo #filtro_servico {
    float: left;
    /*width: 84%;*/
    padding-left: 10px;
    margin-top: -2px;
}

#titulo #filtro_servico .campo {
    margin-top: 0px !important;
}

#titulo #filtro_servico a {
    width: 24px;
    height: 24px;
    float: left;
    margin-top: 3px;
    margin-left: 10px;
    *margin-left: 0px;
    display: block;
    background-image: url(../imagens/icone_titulo_mais.png);
    background-position: center;
    background-repeat: no-repeat;
}

#titulo.abrir #filtro_servico a {
    background-image: url(../imagens/icone_titulo_menos.png);
}

#titulo #filtro_servico .pesquisar .mapabotao {
    margin-top: 2px !important;
}

#titulo .area_retratil {
    padding: 0px 0px 5px 0px;
    background-color: #f8f8f8;
    margin-bottom: 10px;
}

#titulo .balao_mensagem {
    width: 85%;
    padding: 20px;
    padding-top: 12px;
    padding-left: 55px;
    margin: 0px 0px 22px 15px;
    color: #666;
    line-height: 1.15;
    border: 1px solid #dbdbdb;
    background-position: top left;
    background-repeat: no-repeat;
    border-radius: 7px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
}


    #titulo .balao_mensagem.alerta {
        background-image: url(../imagens/icone_alerta.png);
        background-color: #f5f6e7;
    }

    #titulo .balao_mensagem.erro {
        background-image: url(../imagens/icone_erro.png);
        background-color: #fde5df;
    }

    #titulo .balao_mensagem.sucesso {
        background-image: url(../imagens/icone_sucesso.png);
        background-color: #e1edde;
    }

    #titulo .balao_mensagem h3 {
        font-size: 1.25em;
        font-weight: lighter;
        line-height: 1.4;
        color: #333;
    }

    #titulo .balao_mensagem .ponta_balao {
        width: 20px;
        height: 15px;
        display: block;
        float: left;
        margin-top: -24px;
        margin-left: -8px;
        background-position: top center;
    }

    #titulo .balao_mensagem.erro .ponta_balao {
        background-image: url(../imagens/balao_erro.png);
    }

    #titulo .balao_mensagem.alerta .ponta_balao {
        background-image: url(../imagens/balao_alerta.png);
    }

    #titulo .balao_mensagem.sucesso .ponta_balao {
        background-image: url(../imagens/balao_sucesso.png);
    }

#titulo .balao_fixo_mensagem {
    width: 85%;
    padding: 20px;
    padding-top: 12px;
    padding-left: 55px;
    margin: 0px 0px 22px 15px;
    color: #666;
    line-height: 1.15;
    border: 1px solid #dbdbdb;
    background-position: top left;
    background-repeat: no-repeat;
    border-radius: 7px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
}

    #titulo .balao_fixo_mensagem.blink_border {
        -moz-transition: all 0.5s ease-in-out;
        -webkit-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -moz-animation: blink_border normal 1.5s infinite ease-in-out;
        /* Firefox */
        -webkit-animation: blink_border normal 1.5s infinite ease-in-out;
        /* Webkit */
        -ms-animation: blink_border normal 1.5s infinite ease-in-out;
        /* IE */
        animation: blink_border normal 1.5s infinite ease-in-out;
        /* Opera */
    }

@keyframes blink_border {
    0% {
        border-color: rgba(255,0,0,1);
        border-width: 2px;
    }

    50% {
        border-color: rgba(255,0,0,0.5);
        border-width: 2px;
    }

    100% {
        border-color: rgba(255,0,0,1);
        border-width: 2px;
    }
}

@-webkit-keyframes blink_border {
    0% {
        border-color: rgba(255,0,0,1);
        border-width: 2px;
    }

    50% {
        border-color: rgba(255,0,0,0.5);
        border-width: 2px;
    }

    100% {
        border-color: rgba(255,0,0,1);
        border-width: 2px;
    }
}

#titulo .balao_fixo_mensagem.alerta {
    background-image: url(../imagens/icone_alerta.png);
    background-color: #fde5df;
}

#titulo .balao_fixo_mensagem.erro {
    background-image: url(../imagens/icone_erro.png);
    background-color: #fde5df;
}

#titulo .balao_fixo_mensagem.sucesso {
    background-image: url(../imagens/icone_sucesso.png);
    background-color: #e1edde;
}

#titulo .balao_fixo_mensagem h3 {
    font-size: 1.25em;
    font-weight: lighter;
    line-height: 1.4;
    color: #333;
}

#titulo .balao_fixo_mensagem .ponta_balao {
    width: 20px;
    height: 15px;
    display: block;
    float: left;
    margin-top: -24px;
    margin-left: -8px;
    background-position: top center;
}

#titulo .balao_fixo_mensagem.erro .ponta_balao {
    background-image: url(../imagens/balao_erro.png);
}

#titulo .balao_fixo_mensagem.alerta .ponta_balao {
    background-image: url(../imagens/balao_alerta.png);
}

#titulo .balao_fixo_mensagem.sucesso .ponta_balao {
    background-image: url(../imagens/balao_sucesso.png);
}

#titulo .area_retratil .coluna.largura33 {
    padding: 0px;
    overflow: auto;
}

    #titulo .area_retratil .coluna.largura33 table {
        background-color: #f5f5f6;
        border: 1px solid #dadada;
        -moz-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.075);
        -webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.075);
        box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.075);
    }

.pergunta #titulo {
    padding-top: 0px !important;
}


/* ----------------- SUBTITULO ----------------- */

#subtitulo {
    padding-top: 20px;
    background-color: #fff;
}

    #titulo .nome_tela.breadscrumb,
    #subtitulo .nome_tela.breadscrumb {
        float: left;
        color: #fff;
        padding: 6px 12px 6px 8px;
        text-transform: lowercase;
        background-color: #0c4c7b;
    }

    #subtitulo .nome_tela.secundario {
        margin-right: 20px;
    }

.abrir h3 {
}

#titulo a.breadscrumb img,
#subtitulo a.breadscrumb img {
    margin: 0px 3px;
}

/* ----------------- WIZARD ----------------- */

.wizard {
    float: left;
    margin-bottom: 6px;
    overflow: hidden;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

    .wizard span {
        display: block;
        float: left;
        position: relative;
        padding: 7px 32px 6px;
        padding-right: 15px;
        color: #b4b4b4;
        border: 1px solid #d8d8d8;
        background-image: url(../imagens/wizard_bg.png);
        background-position: center right;
        background-repeat: no-repeat;
    }

        .wizard span.atual {
            padding: 8px 32px 7px;
            padding-right: 15px;
            color: #3c3c3c;
            background-color: #bae5f1;
            box-shadow: none;
            border: none;
            background-image: url(../imagens/wizard_ativo_bg.png);
            background-repeat: repeat-x;
        }

        .wizard span h3 {
            display: block;
            position: absolute;
            top: 1px;
            left: 2px;
            padding: 7px 11px;
            font-size: 0.8em;
            line-height: 1;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url(../imagens/wizard_numero.png);
        }

        .wizard span.atual h3 {
            color: #f4f4f4;
            background-image: url(../imagens/wizard_atual_numero.png);
        }

/* ----------------- CAMPOS ----------------- */

.coluna {
    float: left;
}

.campo_visualizacao,
.campo {
    float: left;
    position: relative;
}

.campo {
    min-height: 50px;
}

.campoCheck {
    min-height: 20px;
}

.campo label {
    font-size: 0.92em;
    color: #222;
    font-weight: bold;
    padding-left: 3px;
}

.campo input,
.campo select {
    width: 100%;
    margin-top: 2px;
}

.campo select {
    height: 22px;
    margin-top: 1px;
}

.campo_visualizacao {
    height: auto;
    padding-bottom: 15px;
    font-size: 0.92em;
    line-height: 1.1;
    color: #353535;
    border-bottom: 1px solid #ccc;
}

    /*.campo_visualizacao+.campo_visualizacao {
	border-left: 1px solid #ddd;
}*/

    .campo_visualizacao span {
        font-weight: bold;
        color: #222;
    }


.campo .botao_alerta {
    display: none;
}

.campo .info .botao_alerta,
.campo .alerta .botao_alerta {
    display: block;
    width: 15px !important;
    height: 15px !important;
    border: 0px !important;
    position: absolute !important;
    left: 7px !important;
    top: 10px !important;
    z-index: 2;
    padding: 0px !important;
}

.campo .alerta .botao_alerta {
    background-image: url(../imagens/botao_alerta.png);
}

.campo .info .botao_alerta {
    background-image: url(../imagens/botao_info.png);
}

.campo .balao_alerta {
    position: absolute;
    top: 35px;
    left: 3px;
    padding: 8px 12px;
    color: #fff;
    font-size: 0.8em;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    z-index: 1000;
    display: none;
}

.campo .alerta .balao_alerta {
    background-color: #7C1C23;
}

.campo .info .balao_alerta {
    background-color: #1f79bc;
}

.campo .botao_alerta:hover {
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
    -moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
    -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
}

.campo .balao_alerta .ponta {
    width: 17px;
    height: 8px;
    display: block;
    float: left;
    margin-top: -16px;
    margin-left: -7px;
    background-position: center top;
    background-repeat: no-repeat;
}

.campo .info .balao_alerta .ponta {
    background-image: url(../imagens/info.png);
}

.campo .alerta .balao_alerta .ponta {
    background-image: url(../imagens/alerta.png);
}

.mensagem .balao_alerta {
    display: block;
}

.campo.grupo input,
.campo.grupo div {
    float: left;
}

.campo.grupo .componente {
    width: 100%;
    padding: 0px;
    margin-top: 1px;
}

    .campo.grupo .componente.select input {
        padding-bottom: 6px;
    }

    .campo.grupo .componente div input {
        margin-top: 0px;
    }

.campo.grupo.com_botao .componente input.primeiro {
    position: relative;
}

.campo.grupo input.primeiro,
.campo.grupo select.primeiro {
    border-right: none;
    border-radius: 4px 0px 0px 4px;
    -moz-border-radius: 4px 0px 0px 4px;
    -webkit-border-radius: 4px 0px 0px 4px;
}

.campo.grupo input.meio,
.campo.grupo select.meio {
    border-left: 1px solid #eaeaea;
    border-right: none;
    border-radius: 0px 0px 0px 0px;
    -moz-border-radius: 0px 0px 0px 0px;
    -webkit-border-radius: 0px 0px 0px 0px;
}

.campo.grupo input.ultimo,
.campo.grupo .selector.ultimo {
    border-left: 1px solid #eaeaea;
    border-radius: 0px 4px 4px 0px;
    -moz-border-radius: 0px 4px 4px 0px;
    -webkit-border-radius: 0px 4px 4px 0px;
}

.campo.grupo input.botao_alerta,
.campo.grupo select.botao_alerta {
    float: none !important;
}

.container table td .campo {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    padding-left: 16px !important;
}

    .container table td .campo .selector {
        margin-left: -16px;
    }

.campo label.obrigatorio {
    padding-right: 17px;
    background-image: url(../imagens/campo_obrigatorio.png);
    background-position: center right;
    background-repeat: no-repeat;
}

/* ----------------- GRUPOS CAMPOS ----------------- */

.grupo_campos {
    float: left;
}

    .grupo_campos .campos {
        padding: 6px;
        padding-top: 25px;
        position: relative;
        border: 1px solid #dadada;
        -moz-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.075);
        -webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.075);
        box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.075);
    }

        .grupo_campos .campos.desabilitado {
            background-color: #EFEFEF;
            border-color: #E0E0E0;
            box-shadow: none;
        }

            .grupo_campos .campos.desabilitado h5 {
                border-color: #D0D0D0;
                color: #a2a2a2;
            }

            .grupo_campos .campos.desabilitado .campo label {
                color: #a2a2a2;
            }

            .grupo_campos .campos.desabilitado .campo input {
                color: #a5a5a5;
                background-color: #f7f7f7;
            }

    .grupo_campos .campos {
        background-color: #f3f3f4;
    }

        .grupo_campos .campos h5 {
            border-top: 3px solid #2179ba;
        }

    .grupo_campos h5 {
        position: absolute;
        top: -1px;
        left: -1px;
        padding: 3px 15px;
        padding-right: 5px;
        float: left;
        font-size: 0.95em;
        text-transform: uppercase;
    }


/* ----------------- COMPONENTE ----------------- */

.componente {
    padding: 0px 12px 0px 0px;
    position: relative;
}

    .componente.select {
        padding: 0px;
    }

    .componente.info,
    .componente.alerta {
        padding-left: 18px;
    }

    .componente.select.info,
    .componente.select.alerta {
        padding: 0px;
    }

    .campo .componente.info .container_check_radio,
    .componente.info textarea,
    .componente.info input,
    .campo .componente.alerta .container_check_radio,
    .componente.alerta textarea,
    .componente.alerta input {
        padding-left: 25px;
        position: relative;
        left: -18px;
    }

.campo.grupo .componente.info .container_check_radio,
.campo.grupo .componente.info textarea,
.campo.grupo .componente.info input,
.campo.grupo .componente.alerta .container_check_radio,
.campo.grupo .componente.alerta textarea,
.campo.grupo .componente.alerta input {
    left: 0px;
}

.campo .componente.info .container_check_radio,
.campo .componente.alerta .container_check_radio {
    padding-left: 25px !important;
}

.campo .componente.info .selector,
.campo .componente.alerta .selector {
    position: relative !important;
    left: 0px !important;
}

    .campo .componente.info .selector span,
    .campo .componente.alerta .selector span {
        padding-left: 22px !important;
        position: relative !important;
    }

.campo .componente.info .container_check_radio,
.componente.info textarea,
.componente.info input,
.componente.info .selector,
.componente.info .selector span {
    color: #1f79bc;
}

.campo .componente.alerta .container_check_radio,
.componente.alerta textarea,
.componente.alerta input,
.componente.alerta .selector,
.componente.alerta .selector span {
    color: #BF1328;
}


/* ----------------- FILTROS ----------------- */

#filtros {
    background-color: #fff;
}

    #filtros .container {
        padding-bottom: 10px;
        position: relative;
        left: -10px;
    }

.box #filtros .container {
    border-top: 1px dashed #ccc;
}

#filtros .painel_filtros {
    width: 89%;
    float: left;
}

#filtros .painel_botao_filtro {
    width: 11%;
    float: left;
}


/* ------------------ BOTÕES ----------------- */

.componente.botao_campo {
    padding: 0px;
}

input.pesquisar {
    display: block;
    padding: 7px 12px 7px 30px !important;
    margin: 14px 0px 0px 0px;
    cursor: pointer;
    text-decoration: none;
    font-size: 0.9em;
    font-weight: bold;
    color: #fff;
    background-color: #146cac;
    background-image: url(../imagens/botao_pesquisa_icon.png);
    background-position: 28px 1px;
    *background-position: 10px 1px !important;
    background-repeat: no-repeat;
    border-radius: 3px;
    border: none !important;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

.painel_botao_filtro input {
    margin-top: 22px;
    background-position: 4px center;
    float: right;
}

.componente.botao_campo input {
    width: 100%;
    height: auto;
    padding: 7px 21px 6px 21px;
    margin: 15px 0px 0px 0px;
    text-decoration: none;
    font-size: 0.9em;
    font-weight: bold;
    color: #fff;
    border: none;
    background-color: #146cac;
    *background-color: #146cac !important;
}

    .componente.botao_campo input:hover,
    input.pesquisar:hover {
        background-color: #222;
    }

input.mapabotao {
    display: block;
    padding: 7px 12px 7px 30px !important;
    margin: 14px 0px 0px 0px;
    cursor: pointer;
    text-decoration: none;
    font-size: 0.9em;
    font-weight: bold;
    color: #fff;
    background-color: #146cac;
    background-image: url(../imagens/botao_mapa_icon.png);
    background-repeat: no-repeat;
    border-radius: 3px;
    border: none !important;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

    input.mapabotao:hover {
        background-color: #222;
    }

    input.mapabotao.inativo {
        background-image: url(../imagens/botao_mapa_escuro_icon_disabled.png);
        background-color: #c1c1c1;
        border: 0px;
        box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
        -moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
        -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
    }

        input.mapabotao.inativo:hover {
            background-image: url(../imagens/botao_mapa_escuro_icon.png);
            background-color: #222;
        }

    input .mapabotao[disabled] {
        background-image: url(../imagens/botao_mapa_escuro_icon_disabled.png);
        background-color: #c1c1c1;
        border: 0px;
        box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
        -moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
        -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
    }

.barra_botoes {
    width: 100%;
}

    .barra_botoes li {
        float: left;
        margin: 1px 0px;
        margin-bottom: 4px;
    }

        .barra_botoes li + li {
            border-left: 1px solid #bbb;
        }

        .barra_botoes li a {
            padding: 5px 6px;
            margin: 2px 3px;
            display: block;
            border: 1px solid transparent;
            height: 14px;
        }

            .barra_botoes li a:hover {
                padding: 5px 6px;
                margin: 2px 3px;
                display: block;
                box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.15) inset;
                background-color: #ddd;
                border: 1px solid #bbb;
                border-radius: 3px;
            }

.botao_visualizar, .botao_editar, .botao_excluir, .botao_atualizar,
.botao_adicionar, .botao_imprimir, .botao_salvar, .botao_cancelar,
.botao_registro, .botao_debito, .botao_pendencias, .botao_anterior,
.botao_proximo, .botao_seta_esquerda, .botao_seta_direita,
.botao_mais, .botao_menos, .botao_ok, .botao_observacao, .botao_observacao_highlighted, .botao_imprimir_observacao,
.botao_sql, .botao_reativar {
    height: 26px;
    width: 26px;
    padding: 0px;
    border: 0px;
    background-color: transparent;
    background-position: center;
    background-repeat: no-repeat;
    margin: 0px 3px;
}


.botao_registro, .botao_debito, .botao_observacao, .botao_observacao_highlighted, .botao_imprimir_observacao, .botao_sql {
    width: 31px;
}

    .botao_visualizar:hover, .botao_editar:hover,
    .botao_excluir:hover, .botao_adicionar:hover,
    .botao_imprimir:hover, .botao_salvar:hover,
    .botao_atualizar:hover, .botao_atualizar:hover,
    .botao_cancelar:hover, .botao_anterior:hover,
    .botao_proximo:hover, .botao_seta_esquerda:hover,
    .botao_seta_direita:hover, .botao_mais:hover,
    .botao_menos:hover, .botao_ok:hover, .botao_sql:hover, .botao_reativar:hover {
        cursor: pointer;
        box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.15) inset;
        -moz-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.15) inset;
        -webkit-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.15s) inset;
        background-color: #ddd;
        border: 1px solid #bbb;
        border-radius: 3px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
    }

    .botao_debito:hover {
        background-image: url(../imagens/botao_debito_hover_icon.png);
    }

    .botao_registro:hover {
        background-image: url(../imagens/botao_registro_hover_icon.png);
    }

    .botao_observacao:hover {
        background-image: url(../imagens/botao_observacao_hover_icon.png);
    }

    .botao_observacao_highlighted:hover {
        background-image: url(../imagens/botao_observacao_hover_icon.png);
    }

    .botao_imprimir_observacao:hover {
        background-image: url(../imagens/botao_imprimir_observacao_hover_icon.png);
    }

.botao_pendencias:hover {
    background-image: url(../imagens/botao_pendencias_hover_icon.png);
}

#titulo .barra_botoes li input:hover {
    cursor: pointer;
}

.botao_visualizar[disabled]:hover, .botao_editar[disabled]:hover,
.botao_excluir[disabled]:hover, .botao_adicionar[disabled]:hover,
.botao_imprimir[disabled]:hover, .botao_salvar[disabled]:hover,
.botao_atualizar[disabled]:hover, .botao_registro[disabled]:hover,
.botao_debito[disabled]:hover, .botao_pendencias[disabled]:hover,
.botao_cancelar[disabled]:hover, .botao_anterior[disabled]:hover,
.botao_proximo[disabled]:hover, .botao_seta_esquerda[disabled]:hover,
.botao_seta_direita[disabled]:hover, .botao_mais[disabled]:hover,
.botao_menos[disabled]:hover, .botao_ok[disabled]:hover,
.botao_observacao[disabled]:hover, .botao_observacao_highlighted[disabled]:hover,
.botao_imprimir_observacao[disabled]:hover, .botao_sql[disabled]:hover, .botao_reativar[disabled]:hover {
    background-color: transparent;
    border: 0px;
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
    -moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
    -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
    cursor: default;
}

.botao_visualizar {
    background-image: url(../imagens/botao_visualizar_icon.png);
}

.botao_editar {
    background-image: url(../imagens/botao_editar_icon.png);
}

.botao_excluir {
    background-image: url(../imagens/botao_excluir_icon.png);
}

.botao_adicionar {
    background-image: url(../imagens/botao_adicionar_icon.png);
}

.botao_imprimir {
    background-image: url(../imagens/botao_imprimir_icon.png);
}

.botao_salvar {
    background-image: url(../imagens/botao_salvar_icon.png);
}

.botao_atualizar {
    background-image: url(../imagens/botao_atualizar_icon.png);
}

.botao_cancelar {
    background-image: url(../imagens/botao_cancel_icon.png);
}

.botao_debito {
    background-image: url(../imagens/botao_debito_icon.png);
}

.botao_registro {
    background-image: url(../imagens/botao_registro_icon.png);
}

.botao_observacao {
    background-image: url(../imagens/botao_observacao_icon.png);
}

.botao_observacao_highlighted {
    background-image: url(../imagens/botao_observacao_icon_highlighted.png);
}

.botao_imprimir_observacao {
    background-image: url(../imagens/botao_imprimir_observacao_icon.png);
}

.botao_pendencias {
    background-image: url(../imagens/botao_pendencias_icon.png);
}

.botao_anterior {
    background-image: url(../imagens/botao_anterior_icon.png);
}

.botao_proximo {
    background-image: url(../imagens/botao_proximo_icon.png);
}

.botao_seta_esquerda {
    background-image: url(../imagens/botao_seta_esquerda_icon.png);
}

.botao_seta_direita {
    background-image: url(../imagens/botao_seta_direita_icon.png);
}

.botao_mais {
    background-image: url(../imagens/botao_+_icon.png);
}

.botao_menos {
    background-image: url(../imagens/botao_menos_icon.png);
}

.botao_ok {
    background-image: url(../imagens/botao_ok_icon.png);
}

.botao_sql {
    background-image: url(../imagens/botao_sql_icon.png);
}

.botao_reativar {
    background-image: url(../imagens/botao_reativar_icon.png);
}

.botao_visualizar[disabled] {
    background-image: url(../imagens/botao_visualizar_icon_disabled.png);
}

.botao_editar[disabled] {
    background-image: url(../imagens/botao_editar_icon_disabled.png);
}

.botao_excluir[disabled] {
    background-image: url(../imagens/botao_excluir_icon_disabled.png);
}

.botao_adicionar[disabled] {
    background-image: url(../imagens/botao_adicionar_icon_disabled.png);
}

.botao_imprimir[disabled] {
    background-image: url(../imagens/botao_imprimir_icon_disabled.png);
}

.botao_salvar[disabled] {
    background-image: url(../imagens/botao_salvar_icon_disabled.png);
}

.botao_atualizar[disabled] {
    background-image: url(../imagens/botao_atualizar_icon_disabled.png);
}

.botao_cancelar[disabled] {
    background-image: url(../imagens/botao_cancel_icon_disabled.png);
}

.botao_debito[disabled] {
    background-image: url(../imagens/botao_debito_icon_disabled.png);
}

.botao_registro[disabled] {
    background-image: url(../imagens/botao_registro_icon_disabled.png);
}

.botao_observacao[disabled] {
    background-image: url(../imagens/botao_observacao_icon_disabled.png);
}

.botao_observacao_highlighted[disabled] {
    background-image: url(../imagens/botao_observacao_icon_disabled.png);
}

.botao_imprimir_observacao[disabled] {
    background-image: url(../imagens/botao_imprimir_observacao_icon_disabled.png);
}

.botao_pendencias[disabled] {
    background-image: url(../imagens/botao_pendencias_icon_disabled.png);
}

.botao_anterior[disabled] {
    background-image: url(../imagens/botao_anterior_icon_disabled.png);
}

.botao_proximo[disabled] {
    background-image: url(../imagens/botao_proximo_icon_disabled.png);
}

.botao_seta_esquerda[disabled] {
    background-image: url(../imagens/botao_seta_esquerda_icon_disabled.png);
}

.botao_seta_direita[disabled] {
    background-image: url(../imagens/botao_seta_direita_icon_disabled.png);
}

.botao_mais[disabled] {
    background-image: url(../imagens/botao_+_icon_disabled.png);
}

.botao_menos[disabled] {
    background-image: url(../imagens/botao_menos_icon_disabled.png);
}

.botao_ok[disabled] {
    background-image: url(../imagens/botao_ok_icon_disabled.png);
}

.botao_reativar[disabled] {
    background-image: url(../imagens/botao_reativar_icon_disabled.png);
}

.botao_debito[disabled]:hover, .botao_registro[disabled]:hover,
.botao_pendencias[disabled], .botao_observacao[disabled],
.botao_observacao_highlighted[disabled], .botao_imprimir_observacao[disabled] {
    cursor: default !important;
}

.botao_texto {
    height: 26px;
    width: auto;
    padding: 0px 3px;
    border: 0px;
    background-color: transparent;
    margin: 0px 3px;
    -webkit-appearance: none;
}

    .botao_texto[disabled] {
        color: #999;
    }

    .botao_texto:hover {
        cursor: pointer;
        box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.15) inset;
        -moz-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.15) inset;
        -webkit-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.15) inset;
        background-color: #ddd;
        border-radius: 3px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
    }

#titulo .barra_botoes li .botao_texto:hover {
    box-shadow: none;
    color: #146cac;
    background-color: #fff;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

.botao_texto[disabled]:hover {
    cursor: default;
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,0) inset;
    -moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0) inset;
    -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0) inset;
    background-color: transparent;
    color: #999;
}

#titulo .barra_botoes li .botao_texto[disabled]:hover {
    cursor: default;
    color: #999;
}

.botao {
    text-decoration: none;
    color: #fff;
    font-size: 0.85em;
    padding: 5px 7px;
    background-color: #146cac;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

    .botao:hover {
        color: #fff;
        cursor: pointer;
        background-color: #000;
    }

.botao_texto.mais {
    padding-right: 12px;
    background-image: url(../imagens/botao_mais_icon.png);
    background-repeat: no-repeat;
    background-position: center right;
}

    .botao_texto.mais.ativo {
        background-color: #fcfcfc;
        border: 1px solid #ccc;
        border-bottom: none;
    }

.container_dropdown_acoes {
    position: relative;
}

.dropdown_acoes {
    width: 420px;
    position: absolute;
    right: 3px;
    display: none;
    padding: 10px;
    background-color: #fcfcfc;
    border: 1px solid #ccc;
    border-top: none;
    z-index: 101;
    -moz-box-shadow: 0px 8px 11px 0px rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: 0px 8px 11px 0px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 8px 11px 0px rgba(0, 0, 0, 0.15);
}

    .dropdown_acoes ul {
        float: left;
        width: 48%;
        margin: 1%;
    }

        .dropdown_acoes ul li {
            float: none !important;
            display: block !important;
        }

            .dropdown_acoes ul li + li {
                border-left: none;
                border-top: 1px solid #e7e7e7;
            }

/* Para dropdowns de botões à esquerda */
    .dropdown_acoes.left-button {
        right: auto;
        left: 0;
    }

/* Estilos para o botão de fechar */
.close-dropdown {
    position: absolute;
    top: 5px;
    right: 10px;
    font-size: 20px;
    font-weight: bold;
    cursor: pointer;
    color: #777;
    z-index: 1002;
}


/* ------------------- GRID ------------------- */


#area_grid {
    padding: 0px;
    padding-bottom: 30px;
}

.grid {
    width: 100%;
}

    .grid th {
        text-align: left;
        border-top: 0px solid #146cac;
        color: #fff;
        padding: 15px 7px 5px 7px;
        background-color: rgba(0,0,0,0.0);
    }

        .grid th a {
            text-decoration: none;
            color: #222;
            text-transform: uppercase;
            font-size: 1em;
        }

            .grid th a:hover {
                color: #146cac;
            }


.box .grid .linha_par {
    background-color: #f4f4f4;
}

.grid .linha_par {
    background-color: rgba(255,255,255,0.5);
}

.grid td {
    font-size: 0.88em;
    line-height: 1.1;
    color: #222;
    border-top: 1px solid #ccc;
    vertical-align: middle;
    padding: 5px 7px;
}

    .grid td.azul,
    .grid tr.azul td {
        color: #1b52b0;
    }

    .grid td.verde,
    .grid tr.verde td {
        color: #188418;
    }

    .grid td.vermelho,
    .grid tr.vermelho td {
        color: #e91922;
    }

.grid th + th {
    border-left: 0px solid #bbb;
}

.grid td + td {
    border-left: 1px solid #ddd;
}

.grid .checkbox input {
    height: 17px;
    width: 17px;
    margin: 1px;
}

.grid .navegacao,
.grid .paginacao {
    padding-top: 12px;
    border-top: 1px solid #ccc !important;
    border-right-width: 0px !important;
    border-left-width: 0px !important;
    font-size: 0.9em;
    height: 24px;
}

    .grid .navegacao .botao_navegacao {
        padding: 4px 6px;
        text-decoration: none;
        color: #fff;
        background-color: #146cac;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }

.dados_secundarios .grid .navegacao .botao_navegacao {
    background-color: #ddd;
    color: #333;
}

.grid .navegacao .botao_navegacao:hover {
    background-color: #000;
}

.grid .navegacao .navegacao_more {
    font-weight: bold;
}

.grid .navegacao .botao_navegacao_atual {
    padding: 4px 6px;
    text-decoration: none;
    color: #fff;
    background-color: #000;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.grid .paginacao {
    text-align: right;
}


.grid tr.selecionada {
    background-color: #cfdfe6 !important;
}

.grid_campos {
    background-color: #f5f5f6;
    padding: 7px 0px 10px 0px !important;
}

table td.grid_campos .campo {
    padding-left: 11px !important;
    margin-top: 8px !important;
}

.grid tr td input.botao {
    top: 0px !important;
}

/* ------------------- DADOS --------------------- */

.dados {
    padding: 25px 0px;
}

.box .dados {
    padding: 10px 0px 0px;
}

.paineis_retrateis {
    padding: 25px 0px 0px 0px;
}

.area_retratil {
    display: none;
    padding: 10px 15px 0px 10px;
}

.painel_filtros .area_retratil {
    padding: 0px !important;
}

.abrir .area_retratil {
    display: block !important;
    padding-bottom: 20px;
}

.abrir {
    background-color: #f5f5f6;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

#filtros.abrir {
    background-color: #fff;
    border-left: 0px solid #ccc;
    border-right: 0px solid #ccc;
}

#titulo.abrir,
.dados_secundarios .abrir {
    background-color: #fff;
    border-left: 0px solid #ccc;
    border-right: 0px solid #ccc;
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.00) inset;
}

    .dados_secundarios .abrir h3 {
        background-color: #c2d9e7;
    }


.painel {
    border-top: solid 1px #ccc;
    position: relative;
}


    .painel h3 a {
        text-decoration: none;
        color: #111;
        padding: 12px 12px 12px 35px;
        display: block;
        background-image: url(../imagens/icone_mais.png);
        background-repeat: no-repeat;
        background-position: 10px 10px;
    }

        .painel h3 a:hover {
            background-color: rgba(174, 205, 233, 0.35);
            *background-color: #e2edf7;
        }

    .painel.abrir {
        margin-bottom: 30px;
        border-bottom: 1px solid #ccc;
        box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.07);
        -moz-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.07);
        -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.07);
    }

.dados_secundarios .painel.abrir {
    margin-bottom: 0px;
    border-bottom: none;
    box-shadow: none;
}

.abrir h3 a {
    background-image: url(../imagens/icone_menos.png);
}

    .abrir h3 a:hover {
        background-color: #84baec;
    }

.dados_titulo {
    float: left;
    padding: 8px 7px 7px;
    margin-bottom: 10px;
    background-color: rgba(0,0,0,0.15);
}


/* -------------- FAIXA de TITULO ---------------- */

.faixa_botoes {
    padding: 10px 0px 8px;
    border-top: solid 0px #ccc;
    border-bottom: 1px solid #fff;
    box-shadow: 0px -2px 2px 1px rgba(0,0,0,0.15) inset;
    -moz-box-shadow: 0px -2px 2px 1px rgba(0,0,0,0.15) inset;
    -webkit-box-shadow: 0px -2px 2px 1px rgba(0,0,0,0.15) inset;
}

.faixa_titulo {
    padding: 25px 0px 0px 0px;
    background-color: #fff;
    border-top: solid 0px #ccc;
    border-bottom: 1px solid #fff;
}

    .faixa_titulo h2 {
        font-size: 1.3em;
        font-weight: bold;
        color: #146cac;
        border-radius: 3px 3px 0px 0px;
        display: inline-block;
        padding: 15px 10px 10px 10px;
    }

.fixar .faixa_flutuante {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000000;
    width: 100%;
    background-color: #f5f5f5;
    background-image: url(../imagens/fundo_hachura.png);
    box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0) inset;
    -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0) inset;
    border-bottom: 3px solid #146cac !important;
}

.container_botoes_dados {
    padding-bottomx: 0px;
}

.fixar .dados {
    padding-top: 73px !important;
}

.fixar .grid th {
    padding-top: 57px !important;
}

.fixar .dados .grid th {
    padding-top: 0px !important;
}



/* ------------- DADOS SECUNDARIOS --------------- */

.dados_secundarios {
    background-color: #fff;
}

    .dados_secundarios input {
        background-color: transparent;
    }

    .dados_secundarios .painel + .painel {
        border-top: solid 1px #ccc;
    }


    .dados_secundarios .painel .botao {
        position: absolute;
        /*right: 10px;
        top: 8px;*/
    }

    .dados_secundarios .painel .area_retratil {
        border: 0px dashed #ccc;
        padding: 0px;
        padding-bottom: 30px !important;
    }

        .dados_secundarios .painel .area_retratil .grid {
            width: 100%;
        }

            .dados_secundarios .painel .area_retratil .grid .linha_impar {
                background-color: #eee;
            }


            .dados_secundarios .painel .area_retratil .grid td + td,
            .dados_secundarios .painel .area_retratil .grid th + th {
                border-left: 1px solid #ccc;
            }

            .dados_secundarios .painel .area_retratil .grid th {
                border-bottom: 2px solid #ccc;
                padding-top: 5px;
            }

            .dados_secundarios .painel .area_retratil .grid td input {
                float: right;
            }

.area_retratil .botoes_area_retratil {
    border-bottom: 1px solid #ccc;
    background-color: #f8f8f8;
    padding: 5px;
    margin-bottom: 10px;
    height: 31px;
}

    .area_retratil .botoes_area_retratil .barra_botoes {
        width: 100%;
    }

.box .area_retratil .botoes_area_retratil {
    border-bottom: 1px solid #e1e1e1;
    background-color: #e9e9e9;
    margin-bottom: 0px;
}


/* --------------------- BOX --------------------- */

.box {
    padding: 5px;
    position: relative;
    margin: 0px;
    background-color: #fff;
}

    .box h2 {
        margin-bottom: 10px;
        font-size: 1.35em;
        font-weight: lighter;
        color: #444;
    }

    .box .botao {
        float: right;
    }

    .box table th {
        background-color: #eee;
    }

    .box .faixa_botoes {
        margin: auto;
        padding: 6px 0px 4px;
        border-top: solid 0px #ccc;
        border-bottom: 0px solid #fff;
        background-color: #f9f9f9;
        box-shadow: none;
    }

    .box .campo .componente.botao_campo input {
        padding: 7px 21px 7px 21px !important;
        background-image: none !important;
        -webkit-appearance: none;
    }

.janela .faixa_botoes {
    width: 1080px;
    margin-top: 6px;
}

.popup .faixa_botoes {
    width: 580px;
}

.janela .coluna .faixa_botoes,
.popup .coluna .faixa_botoes {
    width: 100%;
}

/* --------------------- INPUT --------------------- */

.login input,
.campo input {
    width: 100%;
    height: 14px;
    *height: 29px;
    margin: 2px 1px 2px;
    padding: 7px;
    background-color: #fff;
    border: 1px solid #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-family: 'Lato', Arial, sans-serif;
    -webkit-appearance: none;
}

    .login input:hover,
    .campo input:focus,
    .campo input:hover {
        -webkit-box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.08);
        -moz-box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.08);
        box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.08);
    }

.selector.focus span,
select:focus,
/*input:focus,*/
input[type="text"]:focus,
input[type="radio"]:focus,
input[type="check"]:focus,
textarea:focus {
    color: #146cac !important;
}

/*-------  select ----------------------------------------------------------*/

.campo div.selector {
    width: 100%;
}

.campo.grupo div.selector {
    height: 32px;
    margin-top: -2px;
}

.campo.grupo .primeiro .selector {
    margin-left: -6px;
}

.campo select {
    width: 100%;
}


/*-------  textarea ----------------------------------------------------------*/


textarea {
    width: 100%;
    max-width: 100%;
    padding: 7px;
    background-color: #fff !important;
    background-image: none !important;
    font-family: 'Lato', Arial, sans-serif;
    font-size: 0.85em;
}

    textarea:hover, textarea:focus {
        -webkit-box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.08);
        -moz-box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.08);
        box-shadow: 0px 0px 1px 3px rgba(0, 0, 0, 0.08);
    }



/*-------  radio e check ----------------------------------------------------------*/

.campo .container_check_radio {
    *width: 106% !important;
    margin-top: 2px;
    margin-bottom: 0px;
    padding: 4px 7px;
    border: 1px solid #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size: 0.85em;
    background-color: rgba(255,255,255,0.5);
    width: 100%;
}

    .campo .container_check_radio .radio {
        margin-right: 0px;
        margin-left: 5px;
    }

/*-------  botão pesquisar ----------------------------------------------------------*/

.com_botao .componente {
    padding-right: 38px;
}

.com_botao_dois .componente {
    padding-right: 68px;
    *padding-right: 56px;
}

.com_botao_tres .componente {
    padding-right: 98px;
}

.com_botao_quatro .componente {
    padding-right: 126px;
}

.com_botao input.botao,
.com_botao_dois input.botao,
.com_botao_tres input.botao,
.com_botao_quatro input.botao {
    width: 20px !important;
    *width: 30px !important;
    height: 30px;
    position: absolute;
    *position: absolute !important;
    right: -6px;
    *right: 0px !important;
    top: 0px;
    margin-left: 0px;
    margin-top: 2px;
    padding: 0px 20px 0px 8px !important;
    font-weight: bold;
    background-repeat: no-repeat !important;
    background-position: 6px 6px !important;
    background-color: #ededed !important;
    border: 1px solid #ccc;
    border-radius: 0px 3px 3px 0px;
    -moz-border-radius: 0px 3px 3px 0px;
    -webkit-border-radius: 0px 3px 3px 0px;
    box-shadow: inset 0px 1px 0px 0px #ffffff;
    -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
    -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
}

.com_botao .componente.select input.botao,
.com_botao_dois .componente.select input.botao,
.com_botao_tres .componente.select input.botao,
.com_botao_quatro .componente.select input.botao {
    height: 29px;
}

input.botao.busca_layer {
    background-image: url(../imagens/botao_pesquisar_escuro_icon.png);
}

    input.botao.busca_layer[disabled] {
        background-image: url(../imagens/botao_pesquisar_escuro_icon_disabled.png);
        -webkit-appearance: none;
    }

input.botao.editar {
    background-image: url(../imagens/botao_editar_icon.png);
}

    input.botao.editar[disabled] {
        background-image: url(../imagens/botao_editar_icon_disabled.png);
    }

input.botao.inserir {
    background-image: url(../imagens/botao_adicionar_icon.png);
}

    input.botao.inserir[disabled] {
        background-image: url(../imagens/botao_adicionar_icon_disabled.png);
    }

input.botao.historico {
    background-image: url(../imagens/botao_historico_escuro_icon.png);
}

input.botao.check {
    background-image: url(../imagens/botao_check_icon.png);
}

input.botao.registroatendimento {
    background-image: url(../imagens/botao_registro_icon_16x16.png);
}

input.botao.primeiro,
input.botao.segundo,
input.botao.terceiro {
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
}

.com_botao_dois input.botao.primeiro,
.com_botao_tres input.botao.segundo,
.com_botao_quatro input.botao.terceiro {
    right: 23px;
    *right: 29px !important;
}

.com_botao_tres input.botao.primeiro,
.com_botao_quatro input.botao.segundo {
    right: 52px;
    *right: -48px;
}

.com_botao_quatro input.botao.primeiro {
    right: 80px;
    *right: -74px;
}


.com_botao .componente.info input.botao,
.com_botao .componente.alerta input.botao {
    position: absolute !important;
    left: auto !important;
    right: -6px !important;
}

.container_tabela {
    height: 300px;
    overflow: scroll;
    border-top: 1px solid #aaa;
}

.container_mapa {
    height: 76vh;
    border-top: 1px solid #aaa;
}

.campo.grupo.com_botao .largura10,
.campo.grupo.com_botao_dois .largura10 {
    height: 30px;
}

.campo.grupo.com_botao input.botao,
.campo.grupo.com_botao_dois input.botao {
    position: static;
    margin-left: -16px;
    *margin-left: 0px;
}


input.botao[disabled] {
    cursor: default;
}

/* ------------------- ABAS -------------------- */

.abas_simples li {
    float: left;
    border: none !important;
}

.aba {
    display: none;
}

    .aba.exibir_aba {
        display: block !important;
    }

.area_retratil .container {
    *margin-left: 0px !important;
}

.area_retratil .abas {
    margin: 12px 0px;
    min-height: 100px;
}

.area_retratil .abas_simples {
    margin: 0px;
    border-bottom: 1px solid #CDDFE4;
}

    .area_retratil .abas_simples li {
        padding: 0px;
        margin-bottom: -1px;
        text-align: center;
    }

        .area_retratil .abas_simples li a {
            padding: 7px 28px;
            margin-top: 3px;
            margin-right: 2px;
            display: block;
            background-image: url(../imagens/icone_aba.png);
            background-repeat: no-repeat;
            background-position: 7px 8px;
            background-color: #e3e3e3;
            -webkit-border-radius: 5px 5px 0px 0px;
            -moz-border-radius: 5px 5px 0px 0px;
            border-radius: 5px 5px 0px 0px;
        }

            .area_retratil .abas_simples li a.ativo {
                padding: 9px 28px 8px;
                margin-top: 0px;
                font-size: 1em;
                background-color: #dee8ed;
                background-position: 7px 11px;
                border: 1px solid #CDDFE4;
                border-bottom: none;
            }

            .area_retratil .abas_simples li a.editado {
                background-image: url(../imagens/icone_aba_editado.png);
            }

.area_retratil .aba {
    padding: 5px 0px 0px;
    background-color: #dee8ed;
    border: 1px solid #CDDFE4;
    border-top: none;
}

/* ------------------ DASHBOARD ------------------- */

.dashboard #titulo {
    padding-bottom: 0px;
    border-bottom: 1px solid #dfdfdf;
}

    .dashboard #titulo .container {
        position: relative;
    }

    .dashboard #titulo .acoes {
        position: absolute;
        bottom: -1px;
        right: 0px;
        margin-right: 0px;
    }

        .dashboard #titulo .acoes a.filtrar {
            width: 46px;
            display: block;
            padding: 10px 5px;
            padding-left: 33px;
            font-size: 0.7em;
            text-transform: uppercase;
            background-color: #efefef;
            background-image: url(../imagens/icone_filtro_dashboard.png);
            background-position: 15px center;
            background-repeat: no-repeat;
            border: 1px solid #e6e6e6;
            border-bottom: none;
            border-radius: 3px 3px 0px 0px;
            -moz-border-radius: 3px 3px 0px 0px;
            -webkit-border-radius: 3px 3px 0px 0px;
        }

            .dashboard #titulo .acoes a.filtrar:hover {
                color: #000;
                background-color: #e6e6e6;
            }

.dashboard #filtros {
    padding-top: 5px;
    background-color: #fff;
    border-bottom: 1px solid #dadada;
}

.dashboard .menu_abas + #filtros {
    background-color: #fff;
}

.dashboard #filtros .campo {
    min-height: 32px;
}

.dashboard #filtros .separador {
    height: 38px;
    float: left;
    margin: 6px 4px 0px;
    border-left: 1px solid #d1d1d1;
}

.dashboard #filtros .separador-comparacao {
    width: 30px;
    height: 38px;
    float: left;
    margin-top: 6px;
    margin-left: -4px;
    background-image: url(../imagens/icone-separador-comparacao.png);
    background-position: center;
    background-repeat: no-repeat;
}

    .dashboard #filtros .separador-comparacao + .campo {
        padding-left: 0% !important;
    }

.dashboard #filtros .campo .componente.data input {
    background-image: url(../imagens/icone_campo_data.png);
    background-repeat: no-repeat;
    background-position: center right;
}

.dashboard #filtros .painel_botao_filtro input {
    margin-top: 10px;
    padding: 7px 32px !important;
    background-image: none;
}

.dashboard .menu_abas + #filtros .painel_filtros .show_hide {
    width: 30px;
    height: 30px;
    float: right;
    margin-top: 10px;
    margin-right: 4px;
    background-image: url(../imagens/icone-menu-mais-vazado.png);
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.7;
}

.dashboard .menu_abas + #filtros.abrir .painel_filtros .show_hide {
    background-image: url(../imagens/icone-menu-menos-vazado.png);
}

.dashboard .menu_abas + #filtros .painel_filtros .show_hide:hover,
.dashboard .menu_abas + #filtros .painel_filtros .show_hide:focus {
    opacity: 1;
}

.dashboard #filtros .painel_filtros .area_retratil {
    padding-right: 30px !important;
    margin-right: 8px;
    margin-top: 8px;
    border-top: 1px solid #d4d4d4;
}


.menu_abas {
    box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.05) inset, inset 0px 4px 3px 0px rgba(0,0,0,0.1), 0px -1px 0px 0px rgba(0,0,0,0.65);
    -moz-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.05) inset, inset 0px 4px 3px 0px rgba(0,0,0,0.1), 0px -1px 0px 0px rgba(0,0,0,0.65);
    -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.05) inset, inset 0px 4px 3px 0px rgba(0,0,0,0.1), 0px -1px 0px 0px rgba(0,0,0,0.65);
    background-color: #146cac;
}

    .menu_abas .abas {
        width: 100%;
        display: table;
    }

        .menu_abas .abas li {
            width: 12.5%;
            display: table-cell;
            padding: 6px 0px;
            background-color: rgba(255, 255, 255, 0.15);
        }

            .menu_abas .abas li a {
                display: block;
                padding: 0px 8px;
                text-align: center;
            }

            .menu_abas .abas li + li a {
                border-left: 1px solid rgba(255, 255, 255, 0.12);
            }

            .menu_abas .abas li a span {
                display: block;
                padding: 6px 0px;
                color: #fff;
                text-transform: uppercase;
                border-radius: 1px;
                -moz-border-radius: 1px;
                -webkit-border-radius: 1px;
            }

            .menu_abas .abas li:hover a span {
                background-color: rgba(255, 255, 255, 0.2);
            }

            .menu_abas .abas li.ativo a span {
                color: #333;
                background-color: #fff;
                box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3), inset 0px -4px 7px 0px rgba(0, 0, 0, 0.18);
                box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3), inset 0px -4px 7px 0px rgba(0, 0, 0, 0.18);
                box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3), inset 0px -4px 7px 0px rgba(0, 0, 0, 0.18);
            }

    .menu_abas .selector,
    .menu_abas .selector select {
        width: 100%;
        cursor: pointer;
    }

    .menu_abas .selector {
        margin: 3px 0px;
    }

        .menu_abas .selector > span {
            text-transform: uppercase;
        }

        .menu_abas .selector select option {
            padding: 10px 8px;
            color: #333;
            letter-spacing: 0.4px;
            text-transform: uppercase;
            background-color: #eee;
        }

            .menu_abas .selector select option + option {
                border-top: 1px solid #ccc;
            }

.periodo {
    margin: 0px;
    padding: 4px 10px;
    color: #444;
    font-size: 0.8em;
    font-weight: bold;
    letter-spacing: 0.6px;
    background-color: #fff;
    color: #333;
    box-shadow: 0px -1px 2px 0px rgba(0, 0, 0, 0.09) inset;
    -moz-box-shadow: 0px -1px 2px 0px rgba(0, 0, 0, 0.09) inset;
    -webkit-box-shadow: 0px -1px 2px 0px rgba(0, 0, 0, 0.09) inset;
}


.indicadores_topo {
    padding: 10px 0px;
    background-color: #fff;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.14);
    -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.14);
    -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.14);
    border-top: 3px solid #1b7ec7;
}

.alerta .indicadores_topo {
    border-top: 3px solid #d81f1f;
}

.atencao .indicadores_topo {
    border-top: 3px solid #de8d0b;
}

.indicadores_topo + .periodo {
    margin-top: 10px;
}

.indicadores_topo * {
    cursor: default;
}

.indicadores_topo .destaque {
    display: inline-block;
    padding: 0px 0px;
    padding-right: 14px;
    border-right: 1px solid #ddd;
    vertical-align: top;
}

    .indicadores_topo .destaque > * {
        display: inline-block;
        vertical-align: top;
    }

    .indicadores_topo .destaque h3 {
        display: inline-block;
        margin: 2px 0px 5px;
        padding-left: 20px;
        padding-right: 8px;
        color: #333;
        line-height: 1;
        font-size: 1.3em;
        font-weight: normal;
        text-transform: lowercase;
        background-color: #fff;
    }

        .indicadores_topo .destaque h3 span {
            height: 25px;
            display: inline-block;
            margin-left: 6px;
            margin-right: -8px;
            padding: 0px 7px 0px 7px;
            background-color: rgba(255,255,255,0.35);
            vertical-align: middle;
        }

    .indicadores_topo .destaque .valor {
        display: block;
        padding-left: 18px;
        color: #000;
        font-size: 2.2em;
        font-weight: bold;
    }

    .indicadores_topo .destaque .secundario {
        border-left: 1px solid #ddd;
        padding-left: 15px;
        margin: 7px 0px 7px 20px;
    }

        .indicadores_topo .destaque .secundario li {
            padding: 1px;
            padding-top: 0px;
            text-align: left;
            font-size: 1.0em;
        }

            .indicadores_topo .destaque .secundario li.total {
                margin-top: -5px;
                padding-top: 5px;
                background-color: #eee;
            }

            .indicadores_topo .destaque .secundario li + li {
                padding-top: 5px;
                border-top: 0px dashed #bbb;
            }

            .indicadores_topo .destaque .secundario li:last-child {
                padding-bottom: 0px;
            }

            .indicadores_topo .destaque .secundario li label {
                padding: 0px 3px;
                text-transform: lowercase;
                font-size: 0.8em;
                font-weight: bold;
            }

            .indicadores_topo .destaque .secundario li span {
                color: #999;
            }

            .indicadores_topo .destaque .secundario li.total span {
                color: #777;
            }

.indicadores_topo .indicadores {
    display: inline-block;
    vertical-align: top;
}

.indicadores_topo .indicadores {
    border: 1px solid #ccc;
    border-radius: 3px;
    margin-left: 15px;
}

.arrecadacao .indicadores_topo .indicadores {
    margin-top: 9px;
}

.indicadores_topo .indicadores ul {
    display: table;
}

    .indicadores_topo .indicadores ul li {
        width: 100px;
        height: 53px;
        display: table-cell;
        padding: 8px 10px 5px 10px;
        overflow: hidden;
        border-left: 1px solid #ccc;
    }

        .indicadores_topo .indicadores ul li:first-child {
            border-left: 0px solid #ccc;
        }

.dados.faturamento .indicadores_topo .indicadores ul li {
    padding: 8px;
}

.indicadores_topo .indicadores ul li.alerta {
    box-shadow: inset 0px -4px 0px 0px rgba(209, 83, 83, 0.75);
    -moz-box-shadow: inset 0px -4px 0px 0px rgba(191, 83, 83, 0.75);
    -webkit-box-shadow: inset 0px -4px 0px 0px rgba(191, 83, 83, 0.75);
}

.indicadores_topo .indicadores ul li.atencao {
    box-shadow: inset 0px -4px 0px 0px rgba(221, 169, 85, 0.7);
    -moz-box-shadow: inset 0px -4px 0px 0px rgba(221, 169, 85, 0.7);
    -webkit-box-shadow: inset 0px -4px 0px 0px rgba(221, 169, 85, 0.7);
}

.indicadores_topo .indicadores ul li label {
    height: 27px;
    display: block;
    text-align: center;
    color: #666;
    font-size: 1.0em;
    font-weight: normal;
    line-height: 1;
    text-transform: lowercase;
}

.indicadores_topo .indicadores ul li span {
    display: block;
    padding-bottom: 1px;
    padding-top: 3px;
    color: #000;
    font-size: 1.4em;
    text-align: center;
}

/* -------- */

.indicadores_topo + .paineis_dashboard {
    margin-top: 15px;
}

.dashboard .paineis_dashboard .painel_dashboard.largura25 {
    width: 24% !important;
    padding-left: 0.5% !important;
    padding-right: 0.5% !important;
}

.paineis_dashboard .painel_dashboard {
    float: left;
}

    .paineis_dashboard .painel_dashboard > div {
        position: relative;
    }

.painel_dashboard .grafico {
    background-color: #eee;
}

.painel_dashboard.atendimento .grafico {
    height: 190px;
}

.painel_dashboard.servicos .grafico {
    height: 214px;
}

.painel_dashboard.arrecadacao .grafico {
    height: 136px;
}

.painel_dashboard.leituras .grafico {
    height: 162px;
}

.painel_dashboard.faturamento .grafico {
    height: 180px;
}

.painel_dashboard.operacional .grafico {
    height: 268px;
}

.painel_dashboard.hidrometria .grafico {
    height: 295px;
}

.painel_dashboard.juridico .grafico {
    height: 210px;
}

.painel_dashboard.largura50 .grafico {
    height: 450px;
}

.painel_dashboard.largura33 .grafico {
    height: 420px;
}

.painel_dashboard > div {
    height: 475px;
    position: relative;
    margin-bottom: 10px;
    padding: 0px 14px 10px;
    background-color: #fff;
    border: 1px solid #d3d3d3;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
    color: #000;
}

.dashboard .paineis_dashboard .painel_dashboard.largura25.curto > div {
    height: 280px;
}

.dashboard .paineis_dashboard .painel_dashboard.largura100 > div {
    height: auto;
    min-height: 450px;
}

.painel_dashboard > div h2 {
    padding: 15px 0px 11px;
    color: #000;
    font-size: 1.3em;
    text-transform: uppercase;
    font-weight: normal;
}

.indicadores_topo + .paineis_dashboard .painel_dashboard > div h2 {
    font-size: 1.2em;
    padding-right: 25px;
    text-transform: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.painel_dashboard > div a {
    width: 100%;
    height: 40px;
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    background-image: url(../imagens/icone-menu-mais-vazado.png);
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: center right 10px;
    border-top: 3px solid #1b7ec7;
    z-index: 999;
    color: #000;
    border-bottom: 1px dotted #ddd;
}

.painel_dashboard.atencao > div a {
    border-top: 3px solid #de8d0b;
}

.painel_dashboard.alerta > div a {
    border-top: 3px solid #d81f1f;
}

.painel_dashboard > div a:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.painel_dashboard .indicadores {
    font-size: 0.9em;
}

.painel_dashboard > div ul {
    margin-top: 10px;
}

    .painel_dashboard > div ul li {
        padding: 7px 5px;
    }

.painel_dashboard.juridico > div ul li.colunas {
    padding: 7px 0px;
    font-size: 0.9em;
}


.painel_dashboard > div ul li.destaque + li.secundario,
.painel_dashboard > div ul li.destaque {
    width: 49%;
    display: inline-block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    vertical-align: top;
}

.painel_dashboard.juridico > div ul li.destaque,
.painel_dashboard.hidrometria > div ul li.destaque,
.painel_dashboard.leituras > div ul li.destaque {
    width: 100%;
}

    .painel_dashboard.juridico > div ul li.destaque > *,
    .painel_dashboard.hidrometria > div ul li.destaque > *,
    .painel_dashboard.leituras > div ul li.destaque > * {
        display: inline-block;
    }

    .painel_dashboard.leituras > div ul li.destaque > label,
    .painel_dashboard.hidrometria > div ul li.destaque > label {
        width: 78px;
    }

    .painel_dashboard.juridico > div ul li.destaque > label {
        width: 90px;
    }

.painel_dashboard > div ul li.destaque span {
    font-size: 2.6em;
    font-weight: normal;
}

.painel_dashboard.atendimento > div ul li.destaque span,
.painel_dashboard.operacional > div ul li.destaque span,
.painel_dashboard.servicos > div ul li.destaque span {
    padding-right: 34px;
    background-size: 30px;
    background-position: center right;
    background-repeat: no-repeat;
}

.painel_dashboard.atendimento > div ul li.destaque span {
    background-image: url(../imagens/icone-dashboard-atendimentos.png);
}

.painel_dashboard.servicos > div ul li.destaque span {
    background-image: url(../imagens/icone-dashboard-servicos.png);
}

.painel_dashboard.operacional > div ul li.destaque span {
    background-image: url(../imagens/icone-dashboard-operacional.png);
}

.painel_dashboard > div ul li.destaque label {
    color: #000;
    font-size: 1.1em;
    font-weight: normal;
    text-transform: lowercase;
}

.painel_dashboard > div ul li.destaque + li.secundario {
    padding: 0px;
}

.painel_dashboard > div ul li.secundario {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 7px 9px;
}

.painel_dashboard.atencao > div ul li.secundario,
.painel_dashboard.alerta > div ul li.secundario {
    background-color: transparent;
}

.painel_dashboard > div ul li.destaque + li.secundario label {
    width: 100%;
    display: inline-block;
    padding: 3px 0px;
    text-align: center;
    border-bottom: 1px solid #ddd;
}

.painel_dashboard.atencao > div ul li.destaque + li.secundario label,
.painel_dashboard.alerta > div ul li.destaque + li.secundario label {
    background-color: #fff;
}

.painel_dashboard > div ul li.destaque + li.secundario span {
    width: 100%;
    display: inline-block;
    padding: 10px 0px;
    text-align: center;
    font-size: 1.9em;
}

.painel_dashboard > div ul li ul {
    margin-top: 0px;
}

    .painel_dashboard > div ul li ul li {
        padding: 7px 5px;
    }

        .painel_dashboard > div ul li ul li.alerta {
            margin-top: 15px;
            padding: 6px;
            padding-left: 28px;
            border: 1px solid #e78b8b;
            background-image: url(../imagens/icone-dashboard-alerta.png);
            background-position: 7px center;
            background-repeat: no-repeat;
            background-size: 16px;
            border-radius: 3px;
        }

.painel_dashboard.leituras > div ul li ul li.alerta {
    margin-top: 0px;
}

.painel_dashboard > div ul li ul li + li {
    border-top: 1px dotted #ccc;
}

.painel_dashboard > div ul li ul li.alerta + li,
.painel_dashboard > div ul li.destaque + li.secundario ul li + li {
    border: none;
}

.painel_dashboard > div ul li ul li span {
    margin-right: 3px;
    font-weight: normal;
    font-size: 1.3em;
}

.painel_dashboard > div ul li.destaque + li.secundario ul {
    padding: 5px 0px;
}

    .painel_dashboard > div ul li.destaque + li.secundario ul li {
        padding: 4px 6px;
    }

        .painel_dashboard > div ul li.destaque + li.secundario ul li span,
        .painel_dashboard > div ul li.destaque + li.secundario ul li label {
            display: inline;
            padding: 0px;
            font-size: 1em;
            background-color: transparent !important;
            border-bottom-width: 0;
        }

.painel_dashboard > div ul li.secundario li span {
    font-size: 1em;
    margin-left: 4px;
    margin-right: 3px;
}

.painel_dashboard > div ul li.secundario li.destaque {
    width: 100%;
    padding: 6px 0px 8px;
}

    .painel_dashboard > div ul li.secundario li.destaque span,
    .painel_dashboard > div ul li.secundario li.destaque label {
        display: inline-block;
        padding: 0px;
        font-size: 1em;
    }

    .painel_dashboard > div ul li.secundario li.destaque span {
        margin-left: 0px;
        font-size: 1.6em;
    }

.painel_dashboard > div ul li.secundario li + li {
    padding: 4px 0px;
    border-top: none;
    font-size: 0.9em;
}

    .painel_dashboard > div ul li.secundario li + li span {
        font-weight: bold;
    }

.painel_dashboard > div ul li.secundario li.destaque + li {
    padding-top: 10px;
    border-top: 1px dotted #ccc;
}


.painel_dashboard > div ul li ul li.vertical {
    padding: 10px 0px;
}

    .painel_dashboard > div ul li ul li.vertical ul {
        width: 100%;
        display: table;
    }

        .painel_dashboard > div ul li ul li.vertical ul li {
            width: 33%;
            display: table-cell;
            padding: 4px 3px;
            font-size: 0.9em;
            text-align: left;
        }

            .painel_dashboard > div ul li ul li.vertical ul li + li {
                padding: 4px 8px;
            }

            .painel_dashboard > div ul li ul li.vertical ul li + li {
                border-top: none;
                border-left: 1px solid #ccc;
            }

                .painel_dashboard > div ul li ul li.vertical ul li + li + li {
                    background-color: transparent;
                }

            .painel_dashboard > div ul li ul li.vertical ul li span {
                font-size: 1.4em;
            }

.painel_dashboard > div ul li.colunas {
    width: 100% !important;
    display: table !important;
}

    .painel_dashboard > div ul li.colunas > div {
        width: 50%;
        display: table-cell;
        vertical-align: top;
    }

    .painel_dashboard > div ul li.colunas.secundario > div {
        padding-left: 3px;
    }

.secundario + .painel_dashboard > div ul li.colunas {
    font-weight: 0.9em;
}

.painel_dashboard > div ul li.colunas > div + div {
    border-left: 1px solid #ddd;
}

.painel_dashboard > div ul li.colunas > div ul {
    padding: 3px 5px;
}

.painel_dashboard > div ul li.colunas .total span {
    margin: 0px;
    font-size: 1.8em !important;
    font-weight: normal;
}

.painel_dashboard > div ul li.colunas ul li {
    padding: 5px 3px;
}

    .painel_dashboard > div ul li.colunas ul li + li {
        border-top: none;
    }



/* -- comparação --*/

.painel_dashboard.largura50 > div {
    height: 520px;
    padding-bottom: 0px;
}

.painel_dashboard.largura50 .indicadores {
    width: 47%;
    display: inline-block;
    margin-bottom: 5px;
    padding-bottom: 10px;
}

    .painel_dashboard.largura50 .indicadores + .indicadores {
        padding-left: 14px;
        margin-left: 13px;
        border-left: 1px solid #ccc;
    }

    .painel_dashboard.largura50 .indicadores .periodo {
        display: block;
        margin-top: 10px;
        padding: 6px 10px;
        background-color: #666;
        color: #fff;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        border-radius: 3px;
    }


#filtros_grafico {
    background-color: #fff;
    border-bottom: 1px solid #e0e0e0;
}

.titulo_grafico {
    margin-bottom: 2px;
    padding-bottom: 6px;
    padding-left: 11px;
    font-size: 1.2em;
    font-weight: normal;
    border-bottom: 1px dashed #b0b0b0;
}

/*------ realcionados ------*/

.lista_relacionados {
    margin-top: 10px;
    padding: 12px;
    border-top: 5px double #c9c9c9;
}

    .lista_relacionados h4 {
        margin-bottom: 5px;
        font-size: 1.3em;
        font-weight: normal;
        text-transform: uppercase;
    }

    .lista_relacionados ul li {
        margin: 3px 5px;
        display: inline-block;
        vertical-align: top;
    }

        .lista_relacionados ul li a {
            display: inline-block;
            padding: 8px 15px 12px;
            font-size: 1.1em;
            background-color: #fff;
            border: 1px solid #c1c1c1;
            border-radius: 3px;
            -moz-border-radius: 3px;
            -webkit-border-radius: 3px;
            box-shadow: 0px -2px 0px 2px rgba(0,0,0,0.1) inset;
            -moz-box-shadow: 0px -2px 0px 2px rgba(0,0,0,0.1) inset;
            -webkit-box-shadow: 0px -2px 0px 2px rgba(0,0,0,0.1) inset;
        }

            .lista_relacionados ul li a:hover,
            .lista_relacionados ul li a:focus {
                padding: 9px 15px 11px;
                background-color: #f4f4f4;
                box-shadow: 0px -0px 0px 2px rgba(0,0,0,0.1) inset;
                -moz-box-shadow: 0px -0px 0px 2px rgba(0,0,0,0.1) inset;
                -webkit-box-shadow: 0px -0px 0px 2px rgba(0,0,0,0.1) inset;
            }

            .lista_relacionados ul li a:active {
                padding: 10px 15px;
                color: #fff;
                background-color: #333;
                border: 1px solid #000;
                box-shadow: 0px -0px 0px 3px rgba(0,0,0,0.1) inset;
                -moz-box-shadow: 0px -0px 0px 3px rgba(0,0,0,0.1) inset;
                -webkit-box-shadow: 0px -0px 0px 3px rgba(0,0,0,0.1) inset;
            }


/* ------------------- GALERIA -------------------- */

ul.galeria {
    padding: 12px 0px;
}

    ul.galeria li {
        width: 176px;
        padding-top: 123px;
        padding-left: 5px;
        margin: 5px;
        float: left;
        position: relative;
        background-color: #eee;
    }

        ul.galeria li a {
            width: 171px;
            height: 113px;
            position: absolute;
            left: 5px;
            top: 5px;
            display: block;
            background-image: url(../imagens/galeria.png);
            background-repeat: no-repeat;
            background-position: left top;
        }

            ul.galeria li a:hover {
                background-image: url(../imagens/galeria_hover.png);
            }

            ul.galeria li a.botao {
                width: 157px;
                height: 12px;
                margin-bottom: 5px;
                position: static !important;
                color: #333;
                text-align: center;
                background-color: #dadada;
                background-image: none;
            }

                ul.galeria li a.botao:hover {
                    color: #eee;
                    background-color: #222;
                }

        ul.galeria li img {
            width: 171px;
            height: 113px;
            left: 0px;
            top: 0px;
            position: absolute;
        }

#box_imagem {
    padding: 5px;
    max-width: 850px;
    height: auto;
}

    #box_imagem img {
        width: 100%;
    }

/* ---------------- AREA IMAGEM ------------------ */

.area_imagem {
    width: 96%;
    position: relative;
    padding: 2%;
    background-color: #f5f5f6;
    border: 1px solid #ededed;
}

    .area_imagem img {
        width: 100%;
        height: auto;
        z-index: 1;
    }

    .area_imagem a {
        width: 96%;
        height: 94%;
        position: absolute;
        left: 2%;
        top: 3%;
        display: block;
        background-image: url(../imagens/galeria.png);
        background-repeat: no-repeat;
        background-position: left top;
        z-index: 2;
    }

        .area_imagem a:hover {
            background-image: url(../imagens/galeria_hover.png);
        }

/* ----------------- DATEPICKER ------------------ */

.ui-datepicker {
    background-color: #fff;
    border: 1px solid #ccc;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0px 8px 11px 0px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: 0px 8px 11px 0px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 8px 11px 0px rgba(0, 0, 0, 0.05);
}

    .ui-datepicker td {
        border: 1px solid #ececec !important;
    }

        .ui-datepicker td:hover {
            background-color: #daecf2;
        }

        .ui-datepicker td.ui-datepicker-other-month:hover {
            background-color: #fff;
        }

    .ui-datepicker thead {
        background-color: #f8f8f8;
        border-top: 1px dotted #e6e6e6;
    }

.ui-datepicker-prev,
.ui-datepicker-next {
    cursor: pointer;
    background-repeat: no-repeat;
    background-color: #eee;
    border-bottom: 1px solid #e7e7e7;
}

    .ui-datepicker-prev:hover,
    .ui-datepicker-next:hover {
        -webkit-box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
        box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
    }

.ui-datepicker-prev {
    background-position: 6px center;
    background-image: url(../imagens/datepicker_prev.png);
    -webkit-border-radius: 2px 0px 0px 2px;
    -moz-border-radius: 2px 0px 0px 2px;
    border-radius: 2px 0px 0px 2px;
}

.ui-datepicker-next {
    background-position: 9px center;
    background-image: url(../imagens/datepicker_next.png);
    -webkit-border-radius: 0px 2px 2px 0px;
    -moz-border-radius: 0px 2px 2px 0px;
    border-radius: 0px 2px 2px 0px;
}

/**/

.sf-jqueryui.Metro .ui-widget-header {
    color: #333;
    background-color: #fff;
    border: none;
}

    .sf-jqueryui.Metro .ui-widget-header span {
        font-size: 1.3em;
        font-weight: normal;
        line-height: 1.9em;
    }

    .sf-jqueryui.Metro .ui-widget-header .ui-icon {
        background-image: none;
    }

.sf-jqueryui .ui-datepicker .ui-datepicker-prev,
.sf-jqueryui .ui-datepicker .ui-datepicker-next {
    width: 24px;
    height: 24px;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}

.sf-jqueryui.Metro .ui-datepicker-prev.ui-state-hover,
.sf-jqueryui.Metro .ui-datepicker-prev.ui-widget-content .ui-state-hover,
.sf-jqueryui.Metro .ui-datepicker-prev.ui-state-focus,
.sf-jqueryui.Metro .ui-datepicker-prev.ui-widget-content .ui-state-focus,
.sf-jqueryui.Metro .ui-datepicker-next.ui-state-hover,
.sf-jqueryui.Metro .ui-datepicker-next.ui-widget-content .ui-state-hover,
.sf-jqueryui.Metro .ui-datepicker-next.ui-state-focus,
.sf-jqueryui.Metro .ui-datepicker-next.ui-widget-content .ui-state-focus {
    height: 25px;
    margin-left: 1px;
    margin-top: 1px;
    background-color: #eee;
    border: none;
    -webkit-box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
}

.sf-jqueryui.Metro .ui-datepicker-next.ui-state-hover,
.sf-jqueryui.Metro .ui-datepicker-next.ui-widget-content .ui-state-hover,
.sf-jqueryui.Metro .ui-datepicker-next.ui-state-focus,
.sf-jqueryui.Metro .ui-datepicker-next.ui-widget-content .ui-state-focus {
    margin-right: 1px;
    background-repeat: no-repeat;
    background-position: 9px center;
    background-image: url(../imagens/datepicker_next.png);
}

.sf-jqueryui.Metro .ui-datepicker-prev.ui-state-hover,
.sf-jqueryui.Metro .ui-datepicker-prev.ui-widget-content .ui-state-hover,
.sf-jqueryui.Metro .ui-datepicker-prev.ui-state-focus,
.sf-jqueryui.Metro .ui-datepicker-prev.ui-widget-content .ui-state-focus {
    margin-left: 1px;
    background-repeat: no-repeat;
    background-position: 6px center;
    background-image: url(../imagens/datepicker_prev.png);
}

.sf-jqueryui .ui-datepicker th {
    background-color: #f8f8f8;
}

.sf-jqueryui.Metro .ui-widget-content .ui-datepicker-calendar td a.ui-state-default {
    padding: 3px;
    color: #333;
    font-size: 1.1em;
    background-color: #fff;
    border: none;
}

    .sf-jqueryui.Metro .ui-widget-content .ui-datepicker-calendar td a.ui-state-default.ui-state-hover {
        background-color: #c1e1fa;
    }

    .sf-jqueryui.Metro .ui-widget-content .ui-datepicker-calendar td a.ui-state-default.ui-state-highlight {
        background-color: #c1e1fa;
    }

    .sf-jqueryui.Metro .ui-widget-content .ui-datepicker-calendar td a.ui-state-default.ui-state-active {
        background-color: #2179ba;
        color: #fff;
    }


/* ------------------- RODAPÉ -------------------- */

#rodape {
    padding: 30px 0px;
    color: #999;
    font-size: 0.85em;
}


/* ------------------- COMPONENTES -------------------- */

.Table tbody tr td.EmptyCell {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-weight: 500;
}

.sf-jqueryui .ui-dialog .ui-dialog-content {
    width: 100% !important;
    padding: 0px !important;
}

.Syncfusion-Grid-Core {
    border-width: 0px;
}

    .Syncfusion-Grid-Core .EditForm .faixa_botoes fieldset {
        padding: 0px;
    }

        .Syncfusion-Grid-Core .EditForm .faixa_botoes fieldset > div {
            padding: 0px;
            margin: 0px;
        }

.ui-widget-overlay {
    background-image: none !important;
    background-color: #000 !important;
    opacity: 0.7 !important;
}

.campo .hasDatepicker {
    width: 100%;
}

.campo .largura50.hasDatepicker {
    width: 45% !important;
}

.faixa_botoes .sf-button.Marble.background {
    color: #222 !important;
    cursor: pointer !important;
    background-image: none !important;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #EFEFEF !important;
    border: 1px solid #c6c6c6 !important;
    border-radius: 3px !important;
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
}

    .faixa_botoes .sf-button.Marble.background.backgroundhover {
        box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.15) inset;
        -moz-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.15) inset;
        -webkit-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.15s) inset;
        background-color: #e8e8e8 !important;
        border: 1px solid #bbb;
        border-radius: 3px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
    }

.Syncfusion-Grid-Marble .GridPager {
    background-color: transparent !important;
    border-color: #ccc !important;
}

.Syncfusion-Grid-Marble .GridContent {
    background-color: transparent !important;
}

.Syncfusion-Grid-Core .RowCell {
    line-height: 1.1 !important;
}

.Syncfusion-Grid-Marble .EnableRowHover tbody > tr:hover {
    background-color: transparent !important;
}

.Syncfusion-Grid-Core table tr:nth-child(even),
.Syncfusion-Grid-Marble .EnableRowHover tbody > tr:nth-child(even):hover {
    background-color: rgba(255, 255, 255, 0.5) !important;
}

.Syncfusion-Grid-Marble .SelectionBackground {
    background-color: #D1EDF7 /*#2EA3F2*/ /*#e1e4f3*/ !important;
}

.GridPager .first, .GridPager .prev, .GridPager .NextPage, .GridPager .LastPage, .GridPager .NextPageDisabled,
.GridPager .LastPageDisabled, .GridPager .RefreshePager {
    padding: 2px 9px;
}

.GridPager .NumericContainer .NumericItem, .GridPager .NumericContainer .CurrentItem {
    /*display: inline-block !important;*/
    padding: 4px 6px !important;
    color: #fff !important;
    font-size: 1.2em !important;
    line-height: 1 !important;
    background-color: #146CAC;
}

.GridPager .NumericContainer .CurrentItem {
    background-color: #222 !important;
}

.Syncfusion-Grid-Marble .NextPage:hover, .Syncfusion-Grid-Marble .LastPage:hover, .Syncfusion-Grid-Marble .FirstPage:hover,
.Syncfusion-Grid-Marble .PrevPage:hover, .Syncfusion-Grid-Marble .GridPager .RefreshPager:hover {
    background-color: #fff;
}

.Syncfusion-Grid-Marble .GridHeader {
    background-color: transparent !important;
}

    .GridHeader .GroupTopLeftCell,
    .Syncfusion-Grid-Marble .GridHeader .HeaderCell,
    .Syncfusion-Grid-Marble .GridHeader .HeaderCellHover {
        text-transform: uppercase;
        background-image: none !important;
        background-color: transparent !important;
        border-right: none;
    }

    .Syncfusion-Grid-Marble .GridHeader .HeaderCellHover {
        color: #146cac;
    }

.Syncfusion-Grid-Core .HeaderCellDiv {
    margin: 0px !important;
    padding-left: 16px !important;
    font-weight: 900;
}

.Syncfusion-Grid-Core .FilterIcon {
    margin: -23px -4px -3px 0 !important;
    float: left !important;
}

.Gridtoolbar {
    padding: 9px 0px 5px;
    margin-bottom: 12px;
    background-image: none !important;
    background-color: transparent !important;
}

    .Gridtoolbar ul div {
        float: left;
    }

.customToolItem.Tool_Hover {
    border: none !important;
    background-image: none !important;
    background-color: transparent !important;
}

.customToolItem .dropdown_acoes ul {
    width: 47% !important;
}

    .customToolItem .dropdown_acoes ul li {
        float: none !important;
        display: block !important;
    }

        .customToolItem .dropdown_acoes ul li.Tool_Hover {
            margin: 1px 2px 2px !important;
            background-color: #fcfcfc !important;
            background-image: none !important;
            border-bottom: medium none !important;
            border-left: medium none !important;
            border-right: medium none !important;
            border-top: 1px solid #e4e4e4 !important;
        }

            .customToolItem .dropdown_acoes ul li.Tool_Hover:first-child {
                border-top: none !important;
            }

.dropdown_acoes .Toolbar_Separator {
    display: none !important;
    height: 0px !important;
    margin: 0px !important;
}

.Syncfusion-Grid-Marble .GroupCaption {
    padding: 6px 0px 0px !important;
}

.Syncfusion-Grid-Marble .GroupCaption,
.Syncfusion-Grid-Marble .RecordPlusCollapse,
.Syncfusion-Grid-Marble .RecordPlusExpand {
    background-color: rgba(0, 0, 0, 0.05) !important;
}

.Syncfusion-Grid-Marble .IndentCell,
.Syncfusion-Grid-Core table tr:nth-child(even) .GroupCaption,
.Syncfusion-Grid-Core table tr:nth-child(even) .RecordPlusExpand,
.Syncfusion-Grid-Core table tr:nth-child(even) .RecordPlusCollapse {
    background-color: rgba(0, 0, 0, 0.098) !important;
}

.Syncfusion-Grid-Core table tr:nth-child(odd) .IndentCell {
    background-color: rgba(0,0,0,0.06) !important;
}

.Syncfusion-Grid-Core .RecordPlusCollapse > div,
.Syncfusion-Grid-Core .MasterCellCollapse > div {
    background-position: -189px -212px !important;
}

.Syncfusion-Grid-Core .RecordPlusExpand > div,
.Syncfusion-Grid-Core .MasterCellExpand > div {
    background-color: transparent !important;
    background-position: -203px -212px !important;
}

.Syncfusion-Grid-Marble .GridContent.ui-droppable .Table {
    border-right: 1px solid #d7d7d7 !important;
}

.Syncfusion-Grid-Marble .GroupDropArea.ui-droppable {
    margin-top: 16px !important;
    background-color: rgba(0, 0, 0, 0.04) !important;
    border-bottom: 1px solid #C9C9C9 !important;
}

    .Syncfusion-Grid-Marble .GroupDropArea.ui-droppable .GroupHeaderCell {
        margin: 0px 11px;
    }

.Syncfusion-Grid-Core .Ascending {
    background-position: 0 -783px !important;
}

.Syncfusion-Grid-Core .Descending {
    background-position: 0 -806px !important;
}

.grid-icon.GroupHeaderCell.ui-draggable div {
    margin-top: 4px;
}

.Syncfusion-Grid-Marble .IndentCell {
    border-color: #F0F0F0 !important;
    border-left: 1px solid #F0F0F0 !important;
}

.Syncfusion-Grid-Marble .RecordPlusExpand,
.Syncfusion-Grid-Marble .RecordPlusCollapse,
.Syncfusion-Grid-Marble .GroupCaption {
    border-color: #F0F0F0 !important;
    border-top: 1px solid #F0F0F0 !important;
}

.Syncfusion-Grid-Marble tr:first-child .RecordPlusExpand,
.Syncfusion-Grid-Marble tr:first-child .RecordPlusCollapse,
.Syncfusion-Grid-Marble tr:first-child .GroupCaption {
    border-top: none !important;
}

.sf-jqueryui .ui-dialog .ui-dialog-titlebar-close {
    right: 17px !important;
    top: 14px !important;
    padding: 0px !important;
    background-color: #fff !important;
    border: 1px solid #ddd !important;
    z-index: 99999 !important;
}

.ui-dialog .ui-dialog-titlebar {
    background-color: #FFFFFF !important;
    background-image: none !important;
    border: medium none !important;
    padding: 0px !important;
}

    .ui-dialog .ui-dialog-titlebar span {
        display: none !important;
    }

    .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close span {
        display: block !important;
    }

.Syncfusion-Grid-Marble .GroupDropArea.ui-droppable .GroupHeaderCell {
    background-color: #EFEFEF !important;
    background-image: none !important;
    border: 1px solid #C6C6C6 !important;
    border-radius: 3px 3px 3px 3px !important;
    -moz-border-radius: 3px 3px 3px 3px !important;
    -webkit-border-radius: 3px 3px 3px 3px !important;
}

    .Syncfusion-Grid-Marble .GroupDropArea.ui-droppable .GroupHeaderCell + .GroupHeaderCell {
        margin-left: -7px !important;
    }

    .Syncfusion-Grid-Marble .GroupDropArea.ui-droppable .GroupHeaderCell:hover {
        background-color: #ddd !important;
        border: 1px solid #bbb !important;
    }

.sf-jqueryui.Marble .ui-widget-content {
    border: none !important;
    background-color: #fff !important;
}

/* AUTOCOMPLETE*/

.sf-autocomplete.Marble.Autocomplete_Wrapper {
    /*border: 1px solid #B3B3B3;*/
    /*color: #2E2E2E;*/
    height: 18px;
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    border-radius: 3px 3px 3px 3px;
    font-family: 'Lato',Arial,sans-serif;
    height: 16px;
    margin: 2px 1px 2px;
    padding: 7px;
    margin: 0px 1 2px !important;
    /*padding-left: 1% !important;
    padding-right: 1% !important;*/
    width: 100%;
}

    .sf-autocomplete.Marble.Autocomplete_Wrapper input, .sf-autocomplete.Marble.Autocomplete_Wrapper .Syncfusion_Watermark_TextBox, .sf-autocomplete.Marble.Autocomplete_Wrapper .Syncfusion_Value_TextBox {
        background-color: #FFFFFF;
        border: 1px solid #CCCCCC;
        font-family: 'Lato',Arial,sans-serif;
        height: 20px;
        /*margin: 0 0 0;
padding: 0;*/
        width: 100%;
        line-height: 16px;
        margin: 0;
        padding: 0;
        text-indent: 0px;
    }

.sf-autocomplete.Marble .watermark {
    color: #666666;
    font-style: normal;
    /*margin: 0;
    padding: 0;*/
    margin: 0px 0 0px !important;
    padding-left: 1% !important;
    padding-right: 1% !important;
}


.sf-core [class^="Syncfusion"] input, .Autocomplete_Wrapper input {
    box-shadow: 0 0 0 rgba(0, 0, 0, 0.2) inset;
    text-decoration: none;
    text-shadow: none;
}

.sf-core input {
    border: 0 none;
    font-size: 11px;
    height: 16px;
}

.sf-autocomplete.Autocomplete_Wrapper {
    height: 20px !important;
    padding: 0px !important;
    border: none !important;
    background-color: transparent !important;
}

    .sf-autocomplete.Autocomplete_Wrapper input {
        width: 98% !important;
        padding: 4px !important;
    }

/* UPLOAD */
.upload-file-list {
    margin-left: 75px;
    margin-top: -46px;
}


.CustomCss-UploadBox .file-progress {
    border: 1px solid #8DA046;
}

.CustomCss-UploadBox .file-progress-status {
    background-color: #ccc;
}

.CustomCss-UploadBox .file-list .file-size {
    border-color: #ccc #ccc #ccc -moz-use-text-color;
}

.CustomCss-UploadBox .inputbutton {
    background-color: #CCCCCC;
    color: #FFFFFF;
    border: 1px solid #ccc;
    padding: 5px 10px;
    -moz-border-radius: 5px 5px 5px 5px;
    font-size: 17px;
    border-radius: 5px;
}

.CustomCss-UploadBox .file-list {
    color: #ccc;
}

.CustomCss-UploadBox .file-action {
    border-color: #ccc #ccc #ccc -moz-use-text-color;
}

.uploadbox {
    position: relative;
}

    .uploadbox .sf_uploadinput {
        position: absolute;
        opacity: 0;
        filter: alpha(opacity=0);
        top: 1px;
        cursor: pointer;
        font-size: 200px;
        right: 0;
        z-index: 1;
    }

    .uploadbox .uploadform {
        display: table-cell;
        padding-left: 10px;
        display: inline-block;
        display: none;
    }

    .uploadbox .selectionpart {
        overflow: hidden;
        position: relative;
        width: auto;
        *display: inline !important;
        *zoom: 1;
        display: inline-block;
    }

.componente .uploadbox .selectionpart {
    width: 100%;
}

.uploadbox .upload-button {
    margin-left: 10px;
}

.uploadbox .upload-progress-status {
    background-color: Red;
    height: 2px;
    position: absolute;
}

.uploadbox .upload-progress {
    height: 3px;
    width: 125px;
    position: absolute;
    bottom: -2px;
    border: 1px solid black;
    left: 5px;
}

.uploadbox .syncfusion-upload-file {
    position: relative;
    min-width: 120px;
    vertical-align: middle;
}

.uploadbox .file-list .file-size {
    border-style: solid solid solid none;
    border-width: 1px 1px 1px 0;
    float: left;
    min-width: 100px;
    padding-left: 0px;
    padding-right: 0px;
}

.uploadbox .file-list {
    display: inline-block;
    height: 30px;
    padding: 3px 5px;
    text-align: center;
    text-indent: 3px;
}

    .uploadbox .file-list .file-status {
        float: left;
        padding-top: 10px;
        min-width: 77px;
        padding-right: 0px;
        text-align: right;
    }

    .uploadbox .file-list .file-percentage {
        float: left;
        padding-top: 10px;
        width: 40px;
        padding-left: 0px;
        padding-right: 0px;
    }

.uploadbox .file-name {
    display: block;
    height: 28px;
    text-align: left;
    width: 100%;
}

.uploadbox .file-name-text {
    position: relative;
    top: 6px;
}

.uploadbox .file-progress-bar {
    height: 5px;
    left: 0;
    position: absolute;
    width: 100%;
}

.uploadbox .file-list .file-action-cancel:hover,
.uploadbox .file-list .file-action-delete:hover,
.uploadbox .file-list .file-action-retry:hover {
    cursor: pointer;
}

.uploadbox .file-list .file-action-cancel {
    background-position: 5px 10px;
}

.uploadbox .file-list .file-action-delete {
    background-position: -61px 10px;
}

.uploadbox .file-list .file-action-retry {
    background-position: -193px 10px;
}

.uploadbox .file-list .file-percentage-success {
    background: url("Content/css/CustomCSS/Images/Icons.png") no-repeat;
    background-position: -251px 10px;
}

.uploadbox .file-list .file-percentage-failed {
    /*background: url("Content/css/CustomCSS/Images/Icons.png") no-repeat;*/
    background-position: -127px 10px;
}

.uploadbox .file-list .file-status-failed {
    color: Red;
}

.uploadbox .file-list .file-status-success {
    color: #6BD16B;
}

.uploadbox .file-progress-status {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
}

.uploadbox .file-progress {
    float: left;
    min-width: 200px;
    position: relative;
}

.uploadbox .file-progress {
    border: 1px solid;
}

.uploadbox .file-action {
    border-style: solid solid solid none;
    border-width: 1px 1px 1px 0;
    float: left;
    width: 16px;
    /*background: url("Content/css/CustomCSS/Images/Icons.png") no-repeat scroll transparent;*/
}

.uploadbox .upload-file-list {
    list-style: none outside none;
    padding: 3px;
}

    .uploadbox .upload-file-list > li {
        padding-top: 3px;
    }

.uploadbox .file-list > div {
    height: 100%;
    padding: 3px 5px;
}

.componente .uploadbox .selectionpart .uploader span.action {
    margin-right: 10px;
}

.inputbutton {
    background-color: #FBFCFC;
    display: none;
    color: gray;
    border: 1px solid lightgray;
    padding: 5px 10px;
    -moz-border-radius: 5px 5px 5px 5px;
    font-size: 17px;
    border-radius: 5px;
}

.sf-autocomplete.Marble.Autocomplete_Wrapper {
    width: 100% !important;
    height: 30px !important;
}

.ui-widget,
.Syncfusion-Grid-Core {
    font-family: inherit !important;
}

.ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close {
    position: absolute;
    top: 7px;
    right: -2px;
    width: 30px;
    height: 30px;
    cursor: pointer;
    z-index: 999;
}

a.ui-dialog-titlebar-close span.ui-icon {
    width: 30px;
    height: 30px;
    background: url('../imagens/close.png') no-repeat;
}

a.ui-dialog-titlebar-close ui-state-hover {
    border: none;
    background-color: #fff;
}

.ui-dialog .ui-dialog-content {
    padding: 0px !important;
}

.sf-jqueryui .ui-dialog .ui-dialog-content, .ui-dialog-content iframe {
    width: 100% !important;
}

/* PAGINAS INTERNAS */

.internas #conteudos {
    min-height: 400px;
    padding: 40px;
}

    .internas #conteudos .esquerda {
        width: 655px;
        float: left;
    }

    .internas #conteudos .direita {
        width: 205px;
        float: right;
    }

    .internas #conteudos .esquerda a {
        color: #537b95;
    }

    .internas #conteudos h2 {
        margin-bottom: 20px;
        padding-bottom: 10px;
        font-family: 'OpenSansCondensedLight',serif;
        font-size: 40px;
        font-weight: 100;
        color: #003283;
        line-height: 40px;
        border-bottom: 1px solid #54b024;
    }

    .internas #conteudos h3 {
        padding: 0 0 5px 0;
        font-family: 'OpenSansCondensedBold',serif;
        font-size: 30px;
        font-weight: 100;
        color: #0987cc;
        line-height: 30px;
    }

    .internas #conteudos h4 {
        padding: 20px 30px 5px 0;
        font-family: 'OpenSansCondensedBold',serif;
        font-size: 20px;
        font-weight: 100;
        color: #003283;
        line-height: 20px;
    }

    .internas #conteudos p, td {
        margin-bottom: 10px;
        font-size: 14px;
        line-height: 20px;
    }

    .internas #conteudos .direita ul {
        margin-top: 5px;
        border-top: 1px solid #eee;
    }

        .internas #conteudos .direita ul li {
            list-style: none;
            color: #ccc;
        }

            .internas #conteudos .direita ul li a {
                padding: 10px 0 10px 10px;
                display: block;
                font-family: 'OpenSansCondensedLight',serif;
                font-size: 16px;
                color: #666;
                background: url(/imagens/bullet.png) no-repeat 0 15px;
                border-bottom: 1px solid #eee;
            }

                .internas #conteudos .direita ul li a:hover {
                    color: #000;
                }

.close_btn_alert_box {
    position: relative;
    width: 28px;
    height: 28px;
    right: -20px;
    float: right;
    cursor: pointer;
    z-index: 100;
    background-repeat: no-repeat;
}

.loader {
    margin-top: -1em;
    height: 30px;
    margin-top: 1em;
    background-color: #000;
    width: 100%;
}

a.disabled, li.disabled {
    opacity: 0.5;
    pointer-events: none;
    cursor: none;
}

.loadingCEP {
    background: url('../../Content/imagens/loading.gif') no-repeat right center;
}

.single_label {
    padding-top: 25px;
    /*position: fixed;*/
}

.single_text {
    text-decoration: none;
    font-size: 1.15em;
    color: #555;
    line-height: 120%;
}

.notifyjs-system-base {
    opacity: 0.95;
    width: 300px;
    background: #F5F5F5;
    padding: 5px;
    border-radius: 10px;
    border: solid;
    border-width: 1px;
    border-color: red;
    -moz-animation: blink_border normal 1.5s infinite ease-in-out;
    /* Firefox */
    -webkit-animation: blink_border normal 1.5s infinite ease-in-out;
    /* Webkit */
    -ms-animation: blink_border normal 1.5s infinite ease-in-out;
    /* IE */
    animation: blink_border normal 1.5s infinite ease-in-out;
    /* Opera */
}

.notifyjs-error-base {
    opacity: 0.95;
    width: 300px;
    background: #fde5df;
    padding: 5px;
    border-radius: 10px;
    border: solid;
    border-width: 1px;
    border-color: red;
}
    .notifyjs-error-base .title {
        width: 290px;
        float: left;
        margin: 10px 0 0 10px;
        text-align: left;
    }

    .notifyjs-error-base .buttons {
        float: left;
        font-size: 11px;
        padding: 5px;
        margin: 2px;
    }

    .notifyjs-error-base button {
        font-size: 9px;
        padding: 5px;
        margin: 2px;
        width: 60px;
    }


.notifyjs-foo-base {
    opacity: 0.95;
    width: 300px;
    background: #F5F5F5;
    padding: 5px;
    border-radius: 10px;
}

    .notifyjs-foo-base .title {
        width: 290px;
        float: left;
        margin: 10px 0 0 10px;
        text-align: left;
    }

    .notifyjs-foo-base .buttons {
        float: left;
        font-size: 11px;
        padding: 5px;
        margin: 2px;
    }

    .notifyjs-foo-base button {
        font-size: 9px;
        padding: 5px;
        margin: 2px;
        width: 60px;
    }


#pdfviewerdiv {
    width: 1000px;
    height: 490px;
    margin-top: 5px;
    margin-left: auto;
    margin-right: auto;
}

    #pdfviewerdiv p {
        padding: 1em;
    }

    #pdfviewerdiv object {
        display: block;
        border: solid 0px #666;
    }

.upperCase {
    text-transform: uppercase;
}

.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #999;
    border-radius: 10px;
}

.badge-green {
    top: 4px;
    font-size: .9em;
    font-weight: bold;
    background: green;
    color: white;
    width: 23px;
    height: 23px;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    box-shadow: 0 0 1px #333;
    float: right;
    vertical-align: top;
}

.badge-yellow {
    top: 4px;
    font-size: .9em;
    font-weight: bold;
    background: yellow;
    color: black;
    width: 23px;
    height: 23px;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    box-shadow: 0 0 1px #333;
    float: right;
    vertical-align: top;
}

.badge-red {
    top: 4px;
    font-size: .9em;
    font-weight: bold;
    background: red;
    color: white;
    width: 23px;
    height: 23px;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    box-shadow: 0 0 1px #333;
    float: right;
    vertical-align: top;
}

.badge-blue {
    top: 4px;
    font-size: .9em;
    font-weight: bold;
    background: blue;
    color: white;
    width: 23px;
    height: 23px;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    box-shadow: 0 0 1px #333;
    float: right;
    vertical-align: top;
}

.badge-grey {
    top: 4px;
    font-size: .9em;
    font-weight: bold;
    background: grey;
    color: white;
    width: 23px;
    height: 23px;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    box-shadow: 0 0 1px #333;
    float: right;
    vertical-align: top;
}

.badge-orange {
    top: 4px;
    font-size: .9em;
    font-weight: bold;
    background: orange;
    color: white;
    width: 23px;
    height: 23px;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    box-shadow: 0 0 1px #333;
    float: right;
    vertical-align: top;
}

.badge-success {
    display: inline-block;
    padding: 2px 8px;
    font-size: 0.9em;
    font-weight: normal;
    line-height: 1.4;
    border-radius: 20px;
    white-space: nowrap;
    text-align: center;
    background-color: #dcfce7; /* bg-green-100 */
    color: #166534; /* text-green-800 */
}

.badge-warning {
    display: inline-block;
    padding: 2px 8px;
    font-size: 0.9em;
    font-weight: normal;
    line-height: 1.4;
    border-radius: 20px;
    white-space: nowrap;
    text-align: center;
    background-color: #fef9c3; /* bg-yellow-100 */
    color: #854d0e; /* text-yellow-800 */
}

.badge-info {
    display: inline-block;
    padding: 2px 8px;
    font-size: 0.9em;
    font-weight: normal;
    line-height: 1.4;
    border-radius: 20px;
    white-space: nowrap;
    text-align: center;
    background-color: #dbeafe; /* bg-blue-100 */
    color: #1e40af; /* text-blue-800 */
}

.badge-danger {
    display: inline-block;
    padding: 2px 8px;
    font-size: 0.9em;
    font-weight: normal;
    line-height: 1.4;
    border-radius: 20px;
    white-space: nowrap;
    text-align: center;
    background-color: #fee2e2; /* bg-red-100 */
    color: #991b1b; /* text-red-800 */
}

.badge-light {
    display: inline-block;
    padding: 2px 8px;
    font-size: 0.9em;
    font-weight: normal;
    line-height: 1.4;
    border-radius: 20px;
    white-space: nowrap;
    text-align: center;
    background-color: #f1f5f9; /* bg-slate-100 */
    color: #475569; /* text-slate-600 */
}
.badge:empty {
    display: none;
}

.badge-empty {
    display: none;
}

.badge-menu-red {
    position: relative;
}

.badge-grid-red {
    position: relative;
}

    .badge-grid-red[data-badge]:after {
        content: attr(data-badge);
        position: absolute;
        top: 4px;
        right: 2px;
        font-size: .9em;
        font-weight: bold;
        background: red;
        color: white;
        width: 24px;
        height: 24px;
        text-align: center;
        line-height: 24px;
        border-radius: 50%;
        box-shadow: 0 0 1px #333;
    }

.badge-menu-red[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    top: -12px;
    right: 2px;
    font-size: .9em;
    font-weight: bold;
    background: red;
    color: white;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    box-shadow: 0 0 1px #333;
}

.badge-menu-blue {
    position: relative;
}

.badge-grid-blue {
    position: relative;
}

    .badge-grid-blue[data-badge]:after {
        content: attr(data-badge);
        position: absolute;
        top: 4px;
        right: 2px;
        font-size: .9em;
        font-weight: bold;
        background: blue;
        color: white;
        width: 24px;
        height: 24px;
        text-align: center;
        line-height: 24px;
        border-radius: 50%;
        box-shadow: 0 0 1px #333;
    }

.badge-menu-blue[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    top: -12px;
    right: 2px;
    font-size: .9em;
    font-weight: bold;
    background: blue;
    color: white;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    box-shadow: 0 0 1px #333;
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    background-color: white;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}

    .sidenav .closebtn {
        position: absolute;
        top: 0;
        right: 25px;
        font-size: 36px;
        margin-left: 50px;
    }

.animated-progress {
    width: 92%;
    height: 30px;
    border-radius: 5px;
    margin: 20px 10px;
    border: 1px solid rgb(19 108 172));
    overflow: hidden;
    position: relative;
}

    .animated-progress span {
        height: 100%;
        display: block;
        width: 0;
        color: rgb(255, 251, 251);
        line-height: 30px;
        position: absolute;
        text-align: end;
        padding-right: 5px;
    }

.progress-gray span {
    background-color: #5c5c5c;
}

.progress-green span {
    background-color: green;
}

.progress-blue span {
    background-color: blue;
}

.progress-red span {
    background-color: red;
}

@media screen and (max-height: 450px) {
    .sidenav {
        padding-top: 15px;
    }

        .sidenav a {
            font-size: 18px;
        }
}

/* =================== WIDGET DE NOTIFICAÇÕES SCI =================== */

/* Botão flutuante de notificações */
.sci-notif-btn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: #1E88E5;
    color: white;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    z-index: 998;
    transition: background-color 0.3s ease;
}

    .sci-notif-btn:hover {
        background-color: #1565C0;
    }

@keyframes sci-pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 4px 12px rgba(20, 108, 172, 0.3);
    }

    50% {
        transform: scale(1.1);
        box-shadow: 0 6px 20px rgba(20, 108, 172, 0.6);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 4px 12px rgba(20, 108, 172, 0.3);
    }
}

/* Badge contador */
.sci-notif-badge {
    position: absolute;
    top: -8px;
    right: -8px;
    background: #e91922;
    color: white;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    font-size: 12px;
    font-weight: bold;
    display: none;
    align-items: center;
    align-content: center;
    justify-content: center;
    border: 2px solid white;
    animation: sci-bounceIn 0.5s ease;
    font-family: 'Lato', Arial, sans-serif;
}

@keyframes sci-bounceIn {
    0% {
        transform: scale(0);
    }

    50% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}

/* Widget principal */
.sci-notif-widget {
    position: fixed;
    bottom: 80px;
    right: 20px;
    width: 320px;
    height: 600px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    z-index: 998;
    display: none;
    overflow: hidden;
    border: 1px solid #e0e0e0;
    flex-direction: column;
}

    .sci-notif-widget.show {
        display: flex !important;
        flex-direction: column !important;
    }

    .sci-notif-widget.hidden {
        display: none !important;
    }

/* Cabeçalho do widget */
.sci-notif-header {
    background-color: #1E88E5;
    color: white;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .sci-notif-header h3 {
        display: flex;
        align-items: center;
        font-size: 16px;
        font-weight: 500;
    }

        .sci-notif-header h3 svg {
            margin-right: 8px;
        }

.sci-close-btn {
    background: none;
    border: none;
    color: white;
    cursor: pointer;
}

    .sci-close-btn:hover {
        background: rgba(255, 255, 255, 0.2);
    }

/* Abas de navegação */
.sci-notif-tabs {
    display: flex;
    border-bottom: 1px solid #e0e0e0;
}

.sci-notif-tab {
    padding: 10px 16px;
    font-size: 14px;
    cursor: pointer;
    background: none;
    border: none;
    color: #616161;
    font-weight: 500;
}

    .sci-notif-tab.active {
        color: #1E88E5;
        border-bottom: 2px solid #1E88E5;
    }

        .sci-notif-tab.active::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: #146cac;
        }

    .sci-notif-tab:hover:not(.active) {
        background-color: #f5f5f5;
        color: #333;
    }

.sci-tab-count {
    background: #e91922;
    color: white;
    border-radius: 10px;
    padding: 2px 6px;
    font-size: 11px;
    margin-left: 6px;
    font-weight: bold;
}

/* Lista de notificações */
.sci-notif-list {
    flex: 1;
    overflow-y: auto;
    max-height: none;
}

    .sci-notif-list::-webkit-scrollbar {
        width: 6px;
    }

    .sci-notif-list::-webkit-scrollbar-thumb {
        background: #ccc;
        border-radius: 3px;
    }

/* Item individual de notificação */
.sci-notif-item {
    padding: 16px 20px;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
    transition: background 0.2s;
    position: relative;
}

    .sci-notif-item:hover {
        background: #f8f9fa;
    }

    .sci-notif-item.unread {
        background: #fff3e0;
        border-left: 4px solid #146cac;
    }

        .sci-notif-item.unread:hover {
            background: #ffebcc;
        }

    .sci-notif-item.highlighted {
        background: #e3f2fd;
        border-left: 4px solid #2179ba;
    }

.sci-notif-item-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

/* Tipos de notificação */
.sci-notif-type {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'Lato', Arial, sans-serif;
}

.sci-type-info {
    background: #E3F2FD;
    color: #1976D2;
}

.sci-type-error {
    background: #FFEBEE;
    color: #D32F2F;
}

.sci-type-warning {
    background: #FFF3E0;
    color: #F57C00;
}

.sci-type-system {
    background: #F3E5F5;
    color: #7B1FA2;
}

.sci-type-confirm {
    background: #E8F5E8;
    color: #388E3C;
}

/* Tempo da notificação */
.sci-notif-time {
    font-size: 12px;
    color: #666;
}

/* Conteúdo da notificação */
.sci-notif-content {
    font-size: 14px;
    color: #333;
    line-height: 1.4;
    margin-bottom: 8px;
}

    .sci-notif-content.truncated {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

/* Ações das notificações */
.sci-notif-actions {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

.sci-action-btn {
    padding: 6px 12px;
    border: 1px solid #ddd;
    border-radius: 3px;
    background: white;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s;
    font-family: 'Lato', Arial, sans-serif;
    font-weight: bold;
}

    .sci-action-btn.primary {
        background: #146cac;
        color: white;
        border-color: #146cac;
    }

    .sci-action-btn:hover {
        border-color: #146cac;
        color: #146cac;
    }

    .sci-action-btn.primary:hover {
        background: #222;
        color: white;
    }

/* Barra de progresso */
.sci-progress-bar {
    width: 100%;
    height: 6px;
    background: #f0f0f0;
    border-radius: 3px;
    margin: 8px 0;
    overflow: hidden;
    border: 1px solid #ccc;
}

.sci-progress-fill {
    height: 100%;
    background: #188418;
    transition: width 0.3s;
}

.sci-progress-text {
    font-size: 11px;
    color: #666;
    text-align: right;
    font-family: 'Lato', Arial, sans-serif;
}

/* Rodapé do widget */
.sci-notif-footer {
    padding: 12px 16px;
    background: #f8f8f8;
    border-top: 1px solid #ccc;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    flex-shrink: 0; /* Não encolher */
}

.sci-notif-counter {
    font-size: 12px;
    color: #666;
    font-family: 'Lato', Arial, sans-serif;
}

.sci-clear-all-btn {
    background: #146cac;
    color: white;
    border: none;
    border-radius: 3px;
    padding: 8px 12px;
    font-size: 12px;
    cursor: pointer;
    font-family: 'Lato', Arial, sans-serif;
    font-weight: bold;
    transition: background-color 0.2s ease;
}

    .sci-clear-all-btn:hover {
        background: #222;
    }

/* Estado vazio */
.sci-empty-state {
    text-align: center;
    padding: 40px 20px;
    color: #666;
}

/* Toast notification (notificação flutuante) */
.sci-toast-notification {
    position: fixed;
    top: 20px;
    right: 20px;
    max-width: 350px;
    background: white;
    border-radius: 6px;
    box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.02) inset, 0px 0px 10px 10px rgba(0,0,0,0.01) inset, 0px 0px 4px 1px rgba(0,0,0,0.1);
    border-left: 4px solid #146cac;
    padding: 16px;
    z-index: 998;
    transform: translateX(100%);
    transition: transform 0.3s ease;
    font-family: 'Lato', Arial, sans-serif;
    border: 1px solid #dfdfdf;
}

    .sci-toast-notification.show {
        transform: translateX(0);
    }

.sci-toast-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.sci-toast-title {
    font-weight: bold;
    font-size: 14px;
    color: #333;
    text-transform: uppercase;
}

.sci-toast-close {
    background: none;
    border: none;
    cursor: pointer;
    color: #666;
    padding: 4px;
    font-size: 18px;
    line-height: 1;
}

.sci-toast-content {
    font-size: 13px;
    color: #555;
    line-height: 1.4;
    margin-bottom: 12px;
}

.sci-toast-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.sci-toast-btn {
    padding: 6px 12px;
    border: 1px solid #ddd;
    border-radius: 3px;
    background: white;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s;
    font-family: 'Lato', Arial, sans-serif;
    font-weight: bold;
}

    .sci-toast-btn.primary {
        background: #146cac;
        color: white;
        border-color: #146cac;
    }

    .sci-toast-btn:hover {
        border-color: #146cac;
        color: #146cac;
    }

    .sci-toast-btn.primary:hover {
        background: #222;
        color: white;
    }

/* Responsividade para mobile */
@media (max-width: 480px) {
    .sci-notif-widget {
        left: 10px;
        right: 10px;
        bottom: 10px;
        width: auto;
        height: 70vh;
        max-height: 500px;
    }

    .sci-notif-btn {
        bottom: 10px;
        right: 10px;
    }

    .sci-toast-notification {
        left: 10px;
        right: 10px;
        max-width: none;
    }
}

/* Navegação de data */
.sci-notif-date-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 16px;
    background-color: #f5f5f5;
    flex-shrink: 0; /* Não encolher */
}

    .sci-notif-date-navigation span {
        font-size: 14px;
        color: #424242;
        font-weight: 500;
    }

.sci-notif-nav-btn {
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border-radius: 4px;
}

    .sci-notif-nav-btn:hover {
        background-color: #e0e0e0;
    }
/* =================== FIM WIDGET DE NOTIFICAÇÕES SCI ===================*/

/* ========================================  ESTILOS MODERNOS PARA NOTIFICAÇÕES   ======================================== */
/* Container principal */
.modern-notifications-container {
    position: fixed;
    bottom: 80px;
    right: 20px;
    z-index: 998;
    max-width: 320px;
    width: 100%;
    pointer-events: none;
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    transition: all 0.3s ease;
}

    /* Estados do toggle */
    .modern-notifications-container.hidden-mode {
        opacity: 0;
        visibility: hidden;
        transform: translateX(100%);
    }

/* Notificação individual */
.modern-notification {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    margin-bottom: 12px;
    padding: 16px;
    transform: translateX(100%);
    opacity: 0;
    transition: all 0.3s ease;
    border-left: 4px solid #e5e7eb;
    position: relative;
    overflow: hidden;
    pointer-events: auto;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

    /* Estados da notificação */
    .modern-notification.show {
        transform: translateX(0);
        opacity: 1;
    }

    .modern-notification.closing {
        transform: translateX(100%);
        opacity: 0;
    }

    .modern-notification.highlighted {
        box-shadow: 0 8px 32px rgba(59, 130, 246, 0.3);
        border-left-color: #3b82f6;
    }

    .modern-notification.new {
        border-left-width: 6px;
    }

    /* Tipos de notificação com gradientes */
    .modern-notification.type-info {
        border-left-color: #3b82f6;
        background: linear-gradient(135deg, #ffffff 0%, #f8faff 100%);
    }

    .modern-notification.type-confirm {
        border-left-color: #f59e0b;
        background: linear-gradient(135deg, #ffffff 0%, #fffbf0 100%);
    }

    .modern-notification.type-error {
        border-left-color: #ef4444;
        background: linear-gradient(135deg, #ffffff 0%, #fef7f7 100%);
    }

    .modern-notification.type-system {
        border-left-color: #6b7280;
        background: linear-gradient(135deg, #ffffff 0%, #f9fafb 100%);
    }

/* Header da notificação */
.modern-notification-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.modern-notification-title {
    font-weight: 600;
    font-size: 14px;
    color: #374151;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Ícone da notificação */
.modern-notification-icon {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    color: white;
    font-weight: bold;
}

.type-info .modern-notification-icon {
    background: #3b82f6;
}

.type-confirm .modern-notification-icon {
    background: #f59e0b;
}

.type-error .modern-notification-icon {
    background: #ef4444;
}

.type-system .modern-notification-icon {
    background: #6b7280;
}

/* Botão fechar */
.modern-notification-close {
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 6px;
    border-radius: 8px;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .modern-notification-close:hover {
        color: #6b7280;
        background: rgba(0, 0, 0, 0.05);
        transform: scale(1.1);
    }

/* Conteúdo */
.modern-notification-content {
    color: #6b7280;
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 12px;
    word-wrap: break-word;
}

/* Barra de progresso */
.modern-progress-container {
    background: #f3f4f6;
    border-radius: 8px;
    height: 8px;
    margin-bottom: 8px;
    overflow: hidden;
    position: relative;
}

.modern-progress-bar {
    background: #3b82f6;
    height: 100%;
    border-radius: 8px;
    transition: width 0.5s ease;
    position: relative;
}

.modern-progress-text {
    font-size: 12px;
    color: #6b7280;
    text-align: center;
    margin-top: 4px;
    font-weight: 500;
}

/* Ações */
.modern-notification-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 12px;
}

.modern-action-btn {
    padding: 8px 16px;
    border: 1px solid #d1d5db;
    background: white;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

    .modern-action-btn:hover {
        background: #f9fafb;
        border-color: #9ca3af;
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    .modern-action-btn.primary {
        background: #3b82f6;
        border-color: #3b82f6;
        color: white;
    }

        .modern-action-btn.primary:hover {
            background: #2563eb;
            border-color: #2563eb;
            transform: translateY(-1px);
            box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
        }

    .modern-action-btn.danger {
        background: #ef4444;
        border-color: #ef4444;
        color: white;
    }

    .modern-action-btn.danger {
        background: #ef4444;
        border-color: #ef4444;
        color: white;
    }

        .modern-action-btn.danger:hover {
            background: #dc2626;
            border-color: #dc2626;
        }

/* Animação de pulse para atualizações */
.modern-notification.pulse {
    animation: notif-pulse 0.6s ease-in-out;
}

@keyframes notif-pulse {
    0%, 100% {
        transform: translateX(0) scale(1);
    }

    50% {
        transform: translateX(0) scale(1.02);
    }
}

/* Versão mobile */
.modern-notifications-container.mobile-view {
    left: 16px;
    right: 16px;
    bottom: 80px;
    max-width: none;
}

    .modern-notifications-container.mobile-view .modern-notification {
        margin-bottom: 8px;
        padding: 12px;
    }

    .modern-notifications-container.mobile-view .modern-notification-actions {
        flex-direction: column;
    }

    .modern-notifications-container.mobile-view .modern-action-btn {
        width: 100%;
        text-align: center;
    }

/* NOVO: Botão especial "Limpar Tudo" */
.modern-clear-all-container {
    margin-top: 16px;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s ease;
    position: relative;
    z-index: 998; /* Maior que o container principal */
    pointer-events: auto;
}

    .modern-clear-all-container.show {
        opacity: 1;
        transform: translateY(0);
    }

    .modern-clear-all-container.closing {
        opacity: 0;
        transform: translateY(20px);
    }

.modern-clear-all-separator {
    height: 1px;
    background: linear-gradient(90deg, transparent, #e5e7eb, transparent);
    margin-bottom: 12px;
    position: relative;
}

    .modern-clear-all-separator::after {
        content: "✨";
        position: absolute;
        top: -8px;
        left: 50%;
        transform: translateX(-50%);
        background: white;
        padding: 0 8px;
        font-size: 12px;
    }

.modern-clear-all-button {
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    border: none;
    border-radius: 10px;
    color: white;
    padding: 14px 20px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(99, 102, 241, 0.2);
}

    .modern-clear-all-button:hover {
        background: linear-gradient(135deg, #4f46e5, #7c3aed);
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(99, 102, 241, 0.4);
        z-index: 998; /* Ainda maior no hover */
    }

    .modern-clear-all-button:active {
        transform: translateY(0);
    }

.modern-clear-all-icon {
    font-size: 16px;
}

.modern-clear-all-text {
    flex: 1;
}

.modern-clear-all-counter {
    background: rgba(255, 255, 255, 0.25);
    border-radius: 12px;
    padding: 3px 8px;
    font-size: 11px;
    font-weight: bold;
    min-width: 20px;
    text-align: center;
}

/* Estados do botão "Limpar Tudo" */
.modern-clear-all-button.processing {
    background: #6b7280;
    cursor: not-allowed;
    transform: translateY(0);
}

.modern-clear-all-button.success {
    background: linear-gradient(135deg, #10b981, #059669);
}

/* Estilos para o botão flutuante */
#sciNotifBtn {
    transition: all 0.3s ease;
}

        #sciNotifBtn.widget-mode::after {
            content: "📋";
            position: absolute;
            top: -4px;
            right: -4px;
            font-size: 14px;
            background: white;
            border-radius: 50%;
            width: 18px;
            height: 18px;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        }

/* Widget de notificações com transições */
#sciNotifWidget {
    transition: all 0.3s ease;
}

/* Versão mobile */
.modern-notifications-container.mobile-view {
    left: 16px;
    right: 16px;
    bottom: 80px;
    max-width: none;
}

    .modern-notifications-container.mobile-view .modern-notification {
        margin-bottom: 8px;
        padding: 12px;
    }

    .modern-notifications-container.mobile-view .modern-notification-actions {
        flex-direction: column;
    }

    .modern-notifications-container.mobile-view .modern-action-btn {
        width: 100%;
        text-align: center;
    }

    .modern-notifications-container.mobile-view .modern-clear-all-button {
        padding: 12px 16px;
        font-size: 12px;
    }

    /* Ajustes para o modo widget em mobile */
    .modern-notifications-container.mobile-view.hidden-mode {
        transform: translateY(100%);
    }

/* Estados de animação aprimorados */
.modern-notification {
    will-change: transform, opacity;
}

.modern-clear-all-container {
    will-change: transform, opacity;
}

/* Melhorias de performance */
.modern-notifications-container * {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.sci-notif-item.new {
    animation: sci-slideInRight 0.3s ease-out;
}

@keyframes sci-slideInRight {
    from {
        opacity: 0;
        transform: translateX(100%);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.sci-notif-item.removing {
    animation: sci-slideOutRight 0.3s ease-in;
}

@keyframes sci-slideOutRight {
    from {
        opacity: 1;
        transform: translateX(0);
    }

    to {
        opacity: 0;
        transform: translateX(100%);
    }
}
/* ========================================  FIM ESTILOS MODERNOS PARA NOTIFICAÇÕES   ======================================== */

/* =================== WIDGET DE AGENDAMENTO  ===================*/
/* Estilo do botão flutuante */
.agendamento-btn {
    position: fixed;
    bottom: 20px;
    left: 20px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: #1E88E5;
    color: white;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    z-index: 999;
    transition: background-color 0.3s ease;
}

    .agendamento-btn:hover {
        background-color: #1565C0;
    }

/* Estilo do widget */
.agendamento-widget {
    position: fixed;
    bottom: 80px;
    left: 20px;
    width: 380px;
    height: 500px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    z-index: 999;
    display: none;
    overflow: hidden;
    border: 1px solid #e0e0e0;
    flex-direction: column;
}

/* ========== CABEÇALHO DO WIDGET ========== */
.agendamento-header {
    background-color: #1E88E5;
    color: white;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .agendamento-header h3 {
        display: flex;
        align-items: center;
        font-size: 16px;
        font-weight: 500;
    }

        .agendamento-header h3 svg {
            margin-right: 8px;
        }

.close-btn {
    background: none;
    border: none;
    color: white;
    cursor: pointer;
}

/* ========== NAVEGAÇÃO E ABAS ========== */
/* Navegação por abas */
.agendamento-tabs {
    display: flex;
    border-bottom: 1px solid #e0e0e0;
}

.agendamento-tab {
    padding: 10px 16px;
    font-size: 14px;
    cursor: pointer;
    background: none;
    border: none;
    color: #616161;
    font-weight: 500;
}

    .agendamento-tab.active {
        color: #1E88E5;
        border-bottom: 2px solid #1E88E5;
    }

/* Navegação de data */
.date-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 16px;
    background-color: #f5f5f5;
}

    .date-navigation span {
        font-size: 14px;
        color: #424242;
        font-weight: 500;
    }

.nav-btn {
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border-radius: 4px;
}

    .nav-btn:hover {
        background-color: #e0e0e0;
    }

/* ========== LISTA DE AGENDAMENTOS ========== */
.agendamento-list {
    max-height: 360px;
    overflow-y: auto;
}

    /* Estilos para a rolagem */
    .agendamento-list::-webkit-scrollbar {
        width: 6px;
    }

    .agendamento-list::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .agendamento-list::-webkit-scrollbar-thumb {
        background: #bdbdbd;
        border-radius: 3px;
    }

        .agendamento-list::-webkit-scrollbar-thumb:hover {
            background: #9e9e9e;
        }

/* Item de agendamento */
.agendamento-item {
    padding: 12px 16px;
    border-bottom: 1px solid #f0f0f0;
    transition: background-color 0.2s ease;
}

    .agendamento-item:hover {
        background-color: #f9f9f9;
    }

.agendamento-item-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 6px;
    align-items: flex-start;
}

/* ========== INFORMAÇÕES DO CLIENTE ========== */
/* Nome do cliente */
.cliente-nome {
    align-items: center;
    font-weight: 500;
    color: #212121;
    font-size: 14px;
    margin-bottom: 4px;
    display: flex;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 220px;
}

.servico-tipo {
    color: #616161;
    font-size: 12px;
    margin-bottom: 3px;
    font-weight: 500;
    text-transform: uppercase;
}

.agendamento-obs {
    color: #616161;
    font-size: 12px;
    margin-top: 2px;
    font-style: italic;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.3;
}

.agendamento-meta {
    display: flex;
    gap: 12px;
    margin-top: 8px;
}

.agendamento-meta-item {
    display: flex;
    align-items: center;
    font-size: 12px;
    color: #757575;
}

    .agendamento-meta-item svg {
        margin-right: 4px;
    }

/* ========== STATUS E AÇÕES ========== */
.agendamento-status {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.status-badge {
    padding: 3px 8px;
    border-radius: 12px;
    color: white;
    font-size: 11px;
    font-weight: 500;
    margin-bottom: 8px;
}

.status-confirmado {
    background-color: #4CAF50;
}

.status-pendente {
    background-color: #FFC107;
}

.status-cancelado {
    background-color: #F44336;
}

.status-iniciado {
    background-color: #2196F3;
}

.status-finalizado {
    background-color: #9C27B0;
}

.iniciar-btn {
    background-color: #4CAF50;
    color: white;
    border: none;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: background-color 0.2s ease;
}

    .iniciar-btn:hover {
        background-color: #388E3C;
    }

    .iniciar-btn svg {
        margin-right: 4px;
    }

/* ========== RODAPÉ ========== */
.agendamento-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px 0px;
    background-color: #f5f5f5;
    border-top: 1px solid #e0e0e0;
    height: 10px;
    flex-shrink: 0;
}

.agendamento-counter {
    font-size: 12px;
    color: #757575;
}

.ver-todos-btn {
    background-color: #1E88E5;
    color: white;
    border: none;
    border-radius: 4px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

    .ver-todos-btn:hover {
        background-color: #1565C0;
    }

/* ========== ANIMAÇÕES E EFEITOS ========== */
.atualizando-indicador {
    font-size: 12px;
    color: #1E88E5;
    margin-right: 10px;
    opacity: 0.7;
    transition: opacity 0.5s ease;
}

    .atualizando-indicador:hover {
        opacity: 1;
    }

.fadeIn {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

    .fadeIn.active {
        opacity: 1;
        transform: translateY(0);
    }

/* Estilo para destacar itens com status alterado */
.status-alterado {
    animation: pulsar 3s ease-in-out;
}

@@keyframes pulsar {
    0% {
        background-color: rgba(33, 150, 243, 0.1);
    }

    50% {
        background-color: rgba(33, 150, 243, 0.2);
    }

    100% {
        background-color: transparent;
    }
}

@@-webkit-keyframes pulsar {
    0% {
        background-color: rgba(33, 150, 243, 0.1);
    }

    50% {
        background-color: rgba(33, 150, 243, 0.2);
    }

    100% {
        background-color: transparent;
    }
}

/* ========== ESTILOS DE PRIORIDADE ========== */
/* Base para ícones de prioridade */
.prioridade-icone {
    display: inline-flex;
    align-items: center;
    margin-right: 8px;
    vertical-align: middle;
}

    .prioridade-icone[title] {
        position: relative;
        cursor: help;
    }

/* Estilos específicos para prioridade preferencial */
.icone-preferencial {
    color: #FFC107;
}

    .icone-preferencial svg {
        width: 16px;
        height: 16px;
        stroke-width: 2.5;
        filter: drop-shadow(0 0 2px rgba(255, 193, 7, 0.5));
    }

.cliente-preferencial {
    border-left: 3px solid #FFC107;
    padding-left: 8px;
}

/* Estilos específicos para prioridade prioritária */
.icone-prioritario {
    color: #F44336;
    background-color: rgba(244, 67, 54, 0.15);
    padding: 3px;
    border-radius: 50%;
    box-shadow: 0 0 5px rgba(244, 67, 54, 0.5);
}

    .icone-prioritario svg {
        width: 18px;
        height: 18px;
        stroke-width: 3;
        filter: drop-shadow(0 0 3px rgba(244, 67, 54, 0.5));
    }

.cliente-prioritario {
    background-color: rgba(244, 67, 54, 0.05);
    border-left: 3px solid #F44336;
    padding-left: 8px;
}
/* =================== FIM WIDGET DE AGENDAMENTO  ===================*/

/* CSS para o botão toggle multiselect */
.select-container {
    position: relative;
    display: inline-block;
    width: 100%;
}

    /* Suporte para Uniform.js - modo single */
    .select-container .selector {
        display: inline-block;
        width: calc(100% - 25px) !important;
        vertical-align: top;
    }

    /* Select nativo quando multiselect está ativo */
    .select-container.multiselect-mode select {
        width: calc(100% - 25px) !important;
        height: auto !important;
        min-height: 200px !important;
        border: 1px solid #ccc !important;
        padding: 4px !important;
        font-family: inherit !important;
        font-size: inherit !important;
        background: white !important;
        display: block !important;
    }

.toggle-multiselect {
    display: inline-block;
    width: 18px;
    height: 22px;
    cursor: pointer;
    border: 1px solid #ccc;
    border-radius: 3px;
    background-color: #f9f9f9;
    transition: all 0.2s ease;
    box-sizing: border-box;
    /* Posicionamento será definido via JavaScript */
}

    .toggle-multiselect:hover {
        background-color: #e9e9e9;
        border-color: #999;
    }

    .toggle-multiselect.active {
        background-color: #007cba;
        border-color: #005a87;
    }

    /* Ícone usando pseudo-elemento */
    .toggle-multiselect::before {
        content: "☰";
        display: block;
        text-align: center;
        line-height: 20px;
        font-size: 11px;
        color: #666;
        font-weight: bold;
    }

    .toggle-multiselect.active::before {
        color: #fff;
    }

    /* Tooltip */
    .toggle-multiselect[title]:hover::after {
        content: attr(title);
        position: absolute;
        bottom: 100%;
        left: 50%;
        transform: translateX(-50%);
        background: #333;
        color: #fff;
        padding: 4px 8px;
        border-radius: 4px;
        font-size: 11px;
        white-space: nowrap;
        z-index: 1000;
        margin-bottom: 5px;
        pointer-events: none;
    }

/* Garante que o container mantenha o layout original */
.componente .select-container {
    display: block;
}