/* 
    Document   : geral
    Created on : 28/05/2011, 19:12:43
    Author     : Nando
    Description:
        Estilo padrao para o portal e sistema Saude Vianet
*/


* { border: 0; margin: 0; padding: 0; }
strong, b { font-weight: bold; font-size: inherit }

/* ------------------------------------ Barra Modulos */
.barra-topo { height: 40px; z-index: 10; background: #555555; }
.barra-topo.profissional { background: #2088ca; }
.barra-topo.gestor { background: #D96D00; }
.barra-topo.paciente { background: #007537; }

.barra-topo.agenda {  }
.barra-topo.pag-prof { position: fixed; top: 0; left: 0; z-index: 5 }
.barra-topo.configuracoes {  }

.barra-topo .marca { text-align: center; position: relative; z-index: 13; width: 211px; height: 40px; float: left }
.barra-topo .marca a { display: block; height: 100%; text-decoration: none; -webkit-transition: 0.3s; -moz-transition: 0.3s; text-align: left; }
.barra-topo .marca a div {
    vertical-align: top;
    margin: 0;
    padding: 5px 0 6px 8px;
    display: inline-block;
   /* background: rgba(0,0,0,0.3);*/
}

.logo-apps {
    display: inline-block;
    width: 145px;
    height: 20px;
    background: url(/images/geral/logo-apps.png) no-repeat;
    margin: 10px 0 8px;
}
.logo-apps.agenda { background-position: -3px -5px }
.logo-apps.indicadores { background-position: -3px -35px }
.logo-apps.busca { background-position: -3px -65px }
.logo-apps.faturamento { background-position: -3px -95px }
.logo-apps.configuracoes { background-position: -3px -125px }
.logo-apps.contatos { background-position: -3px -155px }
.logo-apps.marketing { background-position: -3px -185px }
.logo-apps.tiss { background-position: -3px -215px }
.logo-apps.pesquisa-nps { background-position: -3px -245px }
.logo-apps.relatorios { background-position: -3px -275px }

.barra-topo .marca a:hover { background: #777777 }
.barra-topo.profissional .marca a:hover, .barra-topo.profissional .marca.ativo { background: #2B6AAA; }
.barra-topo.gestor .marca a:hover, .barra-topo.gestor .marca.ativo { background: #FB9131; }
.barra-topo.paciente .marca a:hover, .barra-topo.paciente .marca.ativo { background: #13914B; }

.gestor .marca a:hover, .gestor .marca.ativo { background: #FB9131; }

.arrow-img {
    background: none;
    margin: 9px 2px;
    display: inline-block;
    vertical-align: top;
}

.aviso-topo-importante td { height: 36px; }
#barraAvisoTopo { width: 100%; height: 36px; background: #FFFFBB; text-align: center; position: relative; z-index: 15 }

#btFecharBarraAviso {
    position: absolute;
    right: 10px;
    top: 5px;
    width: 22px;
    z-index: 20;
    font-size: 15px;
    cursor: pointer;
}

#btFecharBarraAvisoDoc {
    position: absolute;
    right: 75px;
    top: 145px;
    width: 10px;
    z-index: 20;
    font-size: 15px;
    cursor: pointer;
}

#barraAvisoTopo span { font-size: 14px; color: #333; line-height: 36px; }
#barraAvisoTopo a { margin-top: 5px; line-height: 26px; height: 26px; }

#barraAvisoTopo b.teste-vencido{
    color: red;
}


DIV.LinhaHorizontal { height: 10px; display: block; }

.Escondido { display: none; }

.divMsg { margin: 0 0 0 0; background: transparent;  }


#divMsg {
    margin: 0 0 -10px 0;
    border-radius: 4px;
    width: 230px;
    padding: 5px;
    vertical-align: middle;
    text-align: center;
    float: left;
    cursor: pointer;
    position: relative;
    z-index: 9000;
}

#divMsg #divMsg-conteudo { overflow: hidden; }

#divMsg #divMsg-texto{
    width: 200px;
    height: auto;
    border: none;
    margin: 5px 0 0 0;
    color: #fff;
    float: left;
}

#divMsg #divMsg-icone{ border: none; margin: 0 0 0 0; float: left; }

#divMensagem{
    padding: 5px;
    width: 200px;
    height: auto;
    vertical-align: middle;
    text-align: center;
    margin: 0 0 0 142px;
}

#divMensagem-conteudo{ vertical-align: middle; text-align: center; }

.texto-msg-erro{ color: #fff; }


.divMsg.info { padding: 4px; text-align: center; background: rgba(0,102,0,0.7); }
.divMsg.erro { padding: 4px; background: rgba(153,0,0,0.7); }
.divMsg.erro-fatal { color: #333; padding: 4px; background: rgba(153,0,0,0.7); }
.divMsg.aviso { padding: 4px; background: rgba(255,153,0,0.7); }


/*@todo: ver que icone � o que com base na imagem*/
.divMsg div.icone-msg-erro {
    background-image: url(/images/messages.png);
    background-position: 0 0;
    vertical-align: middle;
    width: 24px;
    height: 24px;
}
.divMsg div.icone-msg-erro-fatal {
    background-image: url(/images/messages.png);
    background-color: red;
    background-position: 0 -34px;
    vertical-align: middle;
    width: 24px;
    height: 24px;
}
.divMsg div.icone-msg-info {
    background-image: url(/images/messages.png);
    background-color: yellow;
    background-position: 0 -68px;
    vertical-align: middle;
    width: 24px;
    height: 24px;
}
.divMsg div.icone-msg-aviso {
    background-image: url(/images/messages.png);
    background-color: blue;
    background-position: 0 -102px;
    vertical-align: middle;
    width: 24px;
    height: 24px;
}



#divMensagemPrincipal {
    font-size: 11px;
    margin-top: 8px;
    margin-bottom: 8px;
    border: 1px solid #dddddd;
    position: relative;
    z-index: 2;
    float: none;
    padding: 5px;
}
#divMensagemPrincipal.info {
    background-color: #ccffcc;
    color: #000000;
    padding: 4px;
}
#divMensagemPrincipal.erro {
    background-color: #ff6666;
    color: #ffffff;
    padding: 4px;
}
#divMensagemPrincipal.erro-fatal {
    background-color: #ff3333;
    color: #ffffff;
    padding: 4px;
}
#divMensagemPrincipal.aviso {
    background-color: #ffff99;
    color: #000000;
    padding: 4px;
}
#divMensagemPrincipal #divMensagemPrincipal-conteudo {
    width: 50%;
}
#divMensagemPrincipal SPAN {
    display: inline-block;
}
/*@todo: ver que icone � o que com base na imagem*/
#divMensagemPrincipal SPAN.icone-msg-erro {
    background-image: url(/images/messages.png);
    background-position: 0 0;
    vertical-align: middle;
    width: 24px;
    height: 24px;
}
#divMensagemPrincipal SPAN.icone-msg-erro-fatal {
    background-image: url(/images/messages.png);
    background-position: 0 -34px;
    vertical-align: middle;
    width: 24px;
    height: 24px;
}
#divMensagemPrincipal SPAN.icone-msg-info {
    background-image: url(/images/messages.png);
    background-position: 0 -68px;
    vertical-align: middle;
    width: 24px;
    height: 24px;
}
#divMensagemPrincipal SPAN.icone-msg-aviso {
    background-image: url(/images/messages.png);
    background-position: 0 -102px;
    vertical-align: middle;
    width: 24px;
    height: 24px;
}

/**
 * CSS para os botoes de todos os dialogs.
 * 
 * @todo Fazer as devidas substituicoes em todos os dialogs para usar esse CSS generico
*/

.ui-dialog .ui-dialog-buttonpane { padding: 2px 5px 1px; }

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { text-align: right; }

.ui-dialog .ui-dialog-buttonset .ui-button {
    font-size: 12px;
    font-weight: normal;
    line-height: 17px;
    margin: 3px 0 3px 5px;
    cursor: pointer;
    text-shadow: 0 0 1px rgba(255,255,255,0.1);
    border: none !important;
    color: #fff;

    text-decoration: none;

    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.ui-dialog .ui-dialog-buttonset .ui-button.ui-state-default {
    background: #555555 !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#777777), color-stop(100%,#555555)) !important;
    background: -webkit-linear-gradient(top, #777777 0%, #555555 100%) !important;
    background: -moz-linear-gradient(top,  #777777 0%, #555555 100%) !important;
    background: -o-linear-gradient(top,  #777777 0%,#555555 100%) !important;
    background: -ms-linear-gradient(top,  #777777 0%,#555555 100%) !important;
    background: linear-gradient(top,  #777777 0%,#555555 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#777777', endColorstr='#555555',GradientType=0 ) !important;
}

.ui-dialog .ui-dialog-buttonset .ui-button.ui-state-hover {
    background: #777777 !important;
}

.ui-dialog .ui-dialog-buttonset .ui-button.ui-state-active {
    background: #555555 !important;
    color: #ffffff !important;
}

.ui-dialog .ui-dialog-buttonset .ui-button.ui-state-disabled,
.ui-dialog .ui-dialog-buttonset .ui-button:disabled {
    background: #DDD !important;
    filter: none;
    color: #999 !important;
    border: 1px solid #CCC !important;
    text-shadow: none !important;
}

.ui-dialog .ui-dialog-buttonset .ui-button.confirm.ui-state-default:not(.ui-state-disabled){
    background: #00478C !important;
    background: -moz-linear-gradient(top,  #2B6AAA 0%, #00478C 100%) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2B6AAA), color-stop(100%,#00478C)) !important;
    background: -webkit-linear-gradient(top,  #2B6AAA 0%,#00478C 100%) !important;
    background: -o-linear-gradient(top,  #2B6AAA 0%,#00478C 100%) !important;
    background: -ms-linear-gradient(top,  #2B6AAA 0%,#00478C 100%) !important;
    background: linear-gradient(top,  #2B6AAA 0%,#00478C 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2B6AAA', endColorstr='#00478C',GradientType=0 ) !important;
}

.ui-dialog .ui-dialog-buttonset .ui-button.confirm.ui-state-hover:not(.ui-state-disabled) {
    background: #2B6AAA !important;
}

.ui-dialog .ui-dialog-buttonset .ui-button.confirm.ui-state-active:not(.ui-state-disabled) {
    background: #00478C !important;
    color: #ffffff !important;
}

.ui-dialog .ui-dialog-buttonset .ui-button.left {
    float: left;
    margin: 3px 5px 3px 0;
}






/* Icones padrao de busca, inclusao, alteracao e exclusao de dados - 26x26 */
.btAdicionar { background-image: url(/images/messages.png); background-position: 0 -68px; width: 24px; height: 24px; }

#divRecSenhaMensagem{ text-align: center; width: 100%; float: left; margin: 5px 0 0 0; }

/* Estilo padrao para que os autocompletes n�o fique muito grandes - o mesmo pode ser sobrescrito em casos especiais */
.ui-autocomplete {
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
}
/* IE 6 doesn't support max-height
 * we use height instead, but this forces the menu to always be this tall
*/
* html .ui-autocomplete { height: 134px; }

/* DEFINICOES DE ESTILO PADROES UTILIZADOS EM SCRIPTS DE GERAL.JS */

/* ------------------------------- TELEFONE ------------------------------- */

.itemTelefone .tipoTelefone{
    float: left;
    background: #f9f9f9;
    color: #666;
    position: relative;
    z-index: 4;
}
.itemTelefone .tipoTelefone .txtTipoTelefoneNovo {
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffffff 0%, #cccccc 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#cccccc)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #ffffff 0%,#cccccc 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #ffffff 0%,#cccccc 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #ffffff 0%,#cccccc 100%); /* IE10+ */
    background: linear-gradient(top,  #ffffff 0%,#cccccc 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cccccc',GradientType=0 ); /* IE6-8 */

    font-family: Segoe ui, arial, serif;
    font-size: 8pt;
    width: auto;
    height: 24px;
    margin: 1px 0 0;
    padding: 4px 5px 3px;
    position: absolute;
    z-index: 9998;
    border-right: 1px solid #ccc;
    border-bottom: 0;
    border-left: 0;
    border-top: 0;
    border-radius: 0px;
    cursor: pointer;
    color: #333;
}

.itemTelefone .textoTelefone {
    margin: 0 0 0 -3px;
    padding: 0px 5px 0px 2px;
    background: #fff;
    color: #000;
    height: 30px;
    border-radius: 0 3px 3px 0;
}
.itemTelefone .textoTelefone .txtTextoTelefoneNovo {
    background: none;
    font-family: Segoe ui, arial, serif;
    width: 100px;
    padding-left: 92px;
}
.itemTelefone .textoTelefone .btNovoTel {
    margin-left: -25px;
    float: right;
    padding: 5px;
    cursor: pointer;
    position: absolute;
    z-index: 9999;
}
/* ------------------------------- FIM TELEFONE --------------------------- */




.svn-dialog-generico .ui-dialog-content .wrap-content {
    font-size: 13px;
    line-height: 20px;
    display: inline-block;
    width: 100%;
}

.svn-dialog-generico div.ui-dialog-content #divIcone {
    display: inline-block;
    padding: 0 13px;
    vertical-align: middle;
}

.svn-dialog-generico div.ui-dialog-content #divIcone.vazio {
    display: none;
}

.svn-dialog-generico div.ui-dialog-content #divIcone span {
    display: inline-block;
    background: url(/images/bgIconeMensagem.png) center top no-repeat;
    width: 70px;
    height: 70px;
}

.svn-dialog-generico div.ui-dialog-content #divIcone.sucesso span {
    background-position: 0 0;
}

.svn-dialog-generico div.ui-dialog-content #divIcone.info span {
    background-position: -70px 0;
}

.svn-dialog-generico div.ui-dialog-content #divIcone.alerta span {
    background-position: -140px 0;
}

.svn-dialog-generico div.ui-dialog-content #divIcone.erro span {
    background-position: -210px 0;
}

.svn-dialog-generico div.ui-dialog-content #divIcone.confirm span {
    background-position: -280px 0;
}

.svn-dialog-generico div.ui-dialog-content #divConteudo {
    display: inline-block;
    vertical-align: middle;
    width: 70%;
    float: right;
}




/*Icone de visualizacao/alteracao da localizacao de um endereco */
.IconeMapa {
    position: absolute;
    cursor: pointer;
    left: 100%;
    margin-left: -120px;
    top: 85px;
}

/* Mensagem Usu�rios */
#divMensagemRetornoRecuperarSenha{
    width: 100%;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    margin: 12px  0 0 0;
}

#divMensagemRecuperarSenha{ text-align: center; }

.container-mensagem { display: block; width: 100%; }
.icone { display: inline-block; vertical-align: middle; height: 100%; text-align: center; width: 25%; }
.texto { display: inline-block; vertical-align: middle; width: 70%; padding: 0 0 0 3%; }

.bgIconeMensagem {
    background:  url(/images/geral/dialog-icons.png) center top no-repeat;
    display: inline-block;
    width: 89px;
    height: 75px;
    vertical-align: middle;
}

.bgIconeMensagemSucesso { background-position: 0 0; }
.bgIconeMensagemAlerta { background-position: -89px 0; }
.bgIconeMensagemInformacao { background-position: -178px 0; }
.bgIconeMensagemErro { background-position: -267px 0; }
.bgIconeMensagemPergunta { background-position: -356px 0; }

.txtMensagemAlerta {
    color: #555;
    display: inline-block;
    font-family: "Segoe ui", arial, "Myriad Pro";
    font-size: 13px;
    vertical-align: middle;
    text-align: left;
    line-height: 18px;
    width: 70%;
    margin: 0 0 0 20px;
}

.wrap-bt-aviso { display: block; width: 100%; text-align: right }
.wrap-bt-aviso span { float: left; line-height: 30px; }

.txtMensagemAlertaAgenda {
    display: inline-block;
    font-family: "Segoe ui", arial, "Myriad Pro";
    font-size: 15px;
    vertical-align: middle;
    text-align: justify;
    line-height: 18px;
    width: 100%;
}


#emailSolicitacaoSenha{ font-weight: bold; }

.labelObrigatorio{ color: #000; }

.loadingDialog {
    background: #FFFFFF url('/images/agenda/loading_agenda_big.gif') no-repeat center center;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 10;
}

.divLoadingPequeno {
    background: url("/images/ajax-loader.gif") no-repeat scroll center center #FFFFFF;
    float: right;
    height: 34px;
    margin: -74px 0 0;
    position: relative;
    width: 34px;
    z-index: 10;
}

.hasPlaceholder { color: #999 !important; }

#CModalOverlay { opacity: 0.5 !important; }
#CModal.intercom { background: rgba(255, 255, 255, 0.8) !important; }
#CModal.intercom a.new_message, #CModal.intercom a.back, #CModal.intercom #CModalClose, #CModal.intercom h1{
    color: #333 !important;
}

#CModal.intercom a { opacity: 1.0 !important; text-decoration: none; }
#CModal.intercom a.new_message span, #CModal.intercom a.back span {
    color: #15C !important;
    text-shadow: none !important;
}

.pane h1{ color: #fff !important; text-shadow: none !important; }

.messages_wrapper{ box-shadow: none !important; }

#cmodal.intercom #intercomnewmessagecontainer form textarea {
    /*width: 415px!important;*/
    border: 1px solid #CCC !important;
    background: white !important;
    box-shadow: inset 0 4px 9px -7px black !important;
    border-radius: 3px !important;
    word-wrap: break-word;
}

/*======================================================
============================================== BT SWITCH
======================================================*/
.divBtSwitch {
    background: url("/images/switch.png") no-repeat top left;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    float: right;

    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

/*============================================ SWITCH GRANDE*/
.SwitchGrande { width: 57px; height: 27px; background-position: 0 -65px; }

/*============================================ SWITCH M�DIO*/
.SwitchMedio { width: 60px; height: 22px; background-position:  -60px -91px; }
.SwitchMedio.ativo { background-position:  0px -91px; }

/*============================================ SWITCH PEQUENO*/
.SwitchPequeno { width: 37px; height: 18px; background-position: 0 -114px; }

/*======================================================
============================================== BT ON OFF
======================================================*/
.divBtOnOff{ background: url("/images/switch.png") no-repeat top left; display: inline-block; position: absolute; }

/*============================================ BT ON OF PEQUENO*/
.btOnOffGrande{ width: 71px; height: 26px; background-position: 2px 0; }

/*============================================ BT ON OF PEQUENO*/
.btOnOffMedio { width: 92px; height: 21px; background-position: 16px -26px; left: -38px; }
.divBtSwitch.ativo .btOnOffMedio { left: -11px; background-position: 16px -26px; }

/*============================================ BT ON OF PEQUENO*/
.btOnOffPequeno{ width: 47px; height: 17px; background-position: 0 -48px; left: 4px; }

/* ============================================ fotos e avatares */

.molduraFotoPequena {
    padding: 1px;
    border: 1px solid #CCC;
    border-radius: 2px;
    background: #F6F8F9;
    background: -moz-linear-gradient(top, #F6F8F9 0%, #E5EBEE 50%, #CCC 51%, #F5F7F9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F6F8F9), color-stop(50%,#E5EBEE), color-stop(51%,#CCC), color-stop(100%,#F5F7F9));
    background: -webkit-linear-gradient(top, #F6F8F9 0%,#E5EBEE 50%,#CCC 51%,#F5F7F9 100%);
    background: -o-linear-gradient(top, #F6F8F9 0%,#E5EBEE 50%,#CCC 51%,#F5F7F9 100%);
    background: -ms-linear-gradient(top, #F6F8F9 0%,#E5EBEE 50%,#CCC 51%,#F5F7F9 100%);
    background: linear-gradient(top, #F6F8F9 0%,#E5EBEE 50%,#CCC 51%,#F5F7F9 100%);
}

.molduraFotoPequena.ativo {
    padding: 1px;
    border: 1px solid #CCC;
    border-radius: 2px;
    background: #fff;
    background: -moz-linear-gradient(top, #fff 0%, #eee 50%, #ddd 51%, #F5F7F9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(50%,#eee), color-stop(51%,#ddd), color-stop(100%,#F5F7F9));
    background: -webkit-linear-gradient(top, #fff 0%,#eee 50%,#ddd 51%,#F5F7F9 100%);
    background: -o-linear-gradient(top, #fff 0%,#eee 50%,#ddd 51%,#F5F7F9 100%);
    background: -ms-linear-gradient(top, #fff 0%,#eee 50%,#ddd 51%,#F5F7F9 100%);
    background: linear-gradient(top, #fff 0%,#eee 50%,#ddd 51%,#F5F7F9 100%);
}

.molduraFoto {
    padding: 1px;
    border: 1px solid #CCCCCC;
  /*  border-radius: 3px;*/
    background: white;
  /*  background: -moz-linear-gradient(top, white 0%, #F1F1F1 50%, #CCC 50%, #F6F6F6 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,white), color-stop(50%,#F1F1F1), color-stop(50%,#CCC), color-stop(100%,#F6F6F6));
    background: -webkit-linear-gradient(top, white 0%,#F1F1F1 50%,#CCC 50%,#F6F6F6 100%);
    background: -o-linear-gradient(top, white 0%,#F1F1F1 50%,#CCC 50%,#F6F6F6 100%);
    background: -ms-linear-gradient(top, white 0%,#F1F1F1 50%,#CCC 50%,#F6F6F6 100%);
    background: linear-gradient(top, white 0%,#F1F1F1 50%,#CCC 50%,#F6F6F6 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 );
    box-shadow: 0 0 8px -2px black;*/
}

.molduraFoto.ativo {
    padding: 1px;
    border: 1px solid #CCCCCC;
  /*  border-radius: 3px;*/
    background: #ddd;
  /*  background: -moz-linear-gradient(top, white 0%, #ddd 50%, #888 50%, #F6F6F6 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,white), color-stop(50%,#ddd), color-stop(50%,#888), color-stop(100%,#F6F6F6));
    background: -webkit-linear-gradient(top, white 0%,#ddd 50%,#888 50%,#F6F6F6 100%);
    background: -o-linear-gradient(top, white 0%,#ddd 50%,#888 50%,#F6F6F6 100%);
    background: -ms-linear-gradient(top, white 0%,#ddd 50%,#888 50%,#F6F6F6 100%);
    background: linear-gradient(top, white 0%,#ddd 50%,#888 50%,#F6F6F6 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 );
    box-shadow: 0 0 8px -2px black;*/
}


/**
 * CSS para os tooltips de ajuda
*/

.tooltip-tutorial {
    width: 260px;
    border-radius:6px;
    font-family: "Segoe UI", Arial;
    font-size: 12px;
    border-color: #BBB;

    -webkit-box-shadow: 2px 2px 3px 1px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 2px 2px 3px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 2px 2px 3px 1px rgba(0, 0, 0, 0.3);
}

.tooltip-tutorial .ui-tooltip-content { padding: 10px 15px; border-radius: 6px; background: rgba(0,0,0,0.9); color: #FFF; }
.tooltip-tutorial .ui-tooltip-content h4 { padding: 0 0 10px; }
.tooltip-tutorial .ui-tooltip-content p { line-height: 15px; padding: 0 0 10px; }
.tooltip-tutorial .ui-tooltip-content a {
    text-decoration: none;
    float: left;
    padding: 5px;
    background: #CCC;
    margin-right: 8px;
    cursor: pointer;
    color: #222;
    border: #DDD 1px solid;
    border-radius: 2px;
    box-shadow: 0px 0px 1px 1px black;
}
.tooltip-tutorial .ui-tooltip-content a.confirm { background: #0062c4; color:white; border: none; padding: 6px }

#divBarraEtapasTutorial{
    width: 70%;
    height: 70px;
    position: fixed;
    bottom: 25px;
    left: 50%;
    margin-left: -35%;
    z-index: 1050;
    color: #CCC;
    border: 1px solid #555;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 3px;
    font-family: "Segoe ui";
}

#divBarraEtapasTutorial .barraEtapasTutorial{ width: 100%; height: 100%; overflow: hidden; }
#divBarraEtapasTutorial .barraEtapasTutorial DIV.componentesBarra{ float: left; width: 80%; height: 100%; }
#divBarraEtapasTutorial .barraEtapasTutorial DIV.componentesBarra DIV.tituloBarra{ font-size: 14px; line-height: 100%; }
#divBarraEtapasTutorial .barraEtapasTutorial DIV.componentesBarra DIV.tituloBarra DIV{ line-height: 25px; margin-left: 9px; }
#divBarraEtapasTutorial .barraEtapasTutorial DIV.componentesBarra DIV.itensEtapas{ height: 60%; text-align: center; }
#divBarraEtapasTutorial .barraEtapasTutorial DIV.componentesBarra DIV.itemEtapa{
    float: left;
    border-radius: 3px;
    text-align: center;
    padding: 2px;
    background: #999;
    box-shadow: inset 0px 0px 4px #222;
    width: 23px;
    margin-left: 7px;
    line-height: 20px;
    margin-top: 7px;
    cursor: default;
}

#divBarraEtapasTutorial .barraEtapasTutorial DIV.componentesBarra DIV.itemEtapaAtiva{
    background: #0062C4;
    border: 1px solid #ddd;
    box-shadow: none;
    color: #fff;
}

#divBarraEtapasTutorial .barraEtapasTutorial DIV.botoes{ width: 20%; height: 100% }
#divBarraEtapasTutorial .barraEtapasTutorial DIV.botao{ float: right; margin: 6px 7px 0px 0px; cursor: pointer; }
#divBarraEtapasTutorial .barraEtapasTutorial DIV.botoes DIV.btTutorialFinalizar{
    background: #0062C4;
    border: none;
    padding: 6px;
    width: 105px;
    border-radius: 3px;
    font-size: 12px;
    text-align: center;
}

.divBarraEtapasTutorial .itensEtapas{ text-align: center }

/* pol�tica de privacidade */

#politicaPortal, #duvidasPortal{ text-align: justify; padding: 5px 20px; }
#politicaPortal p{ margin: 30px 0; }
#politicaPortal h1, #politicaPortal h3 { color: #333; font-weight: normal; }
#politicaPortal h4{ margin: 0 0 -27px 0; font-size: 14px; }
#politicaPortal h5{ margin: 0 0 -27px 0; border-bottom: 1px solid #ccc; }

/*----------INPUT tipo RADIO------------*/

INPUT.inputCustom{ opacity: 0; }

DIV.inputRadio{
    background: url('/images/geral/sprite-inputs.png') no-repeat;
    width: 20px;
    height: 20px;
}

DIV.radioDesmarcado{ background-position: 0px 0px; }
DIV.radioDesmarcado:hover{ background-position: -20px 0px; }
DIV.radioDesmarcado:active{ background-position: 0px -20px; }
DIV.radioMarcado{ background-position: -20px -40px; }
DIV.radioMarcado:hover{ background-position: 0px -40px; }
DIV.radioMarcado:active{ background-position: 0px -20px; }

/* botoes aplicativos */
.container-bts-apps {
    padding: 8px;
    position: absolute;
    left: 0;
    background: rgba(255, 255, 255, 1);
    box-shadow: -3px 1px 3px 1px rgba(0, 0, 0, 0.4);
    z-index: 10;
    width: 194px;
    border-bottom: 1px solid #CCCCCC;
    border-right: 1px solid #CCCCCC;
}
.container-bts-apps .linha {overflow: hidden;}

.container-bts-apps .item-app {
    float: left;
    width: 100%;
   /* height: 46px;*/
   /* margin: 0 8px 8px 0;*/
    position: relative;
    overflow: hidden;
    text-decoration: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    border: 1px solid transparent;

    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
}
.container-bts-apps .item-app:hover {
    border: 1px solid #CCCCCC;
    background-color: #CCCCCC;
}

.container-bts-apps .item-app.app-desativado:hover {
    border: none;
    background: none;
}

.container-bts-apps .item-app .app-icone {
    background: url('/images/agenda/sprite-apps.png') no-repeat top center;
    display: inline-block;
    width: 45px;
    height: 30px;
   /* margin: 5px 0;*/
    vertical-align: middle;
}

.container-bts-apps .item-app .app-rotulo {
    display: inline-block;
    width: 80px;
    /*text-align: right;
    text-transform: uppercase;*/
    font-size: 12px;
    text-shadow: 0 0 1px rgba(255,255,255,0.15);
    color: #333333;
    margin: 0 10px 0 0;
    vertical-align: middle;
}

.container-bts-apps .item-app .app-dica {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.8);
    color: #FFF;
    top: 100%;
    left: 0;
}

.container-bts-apps .item-app .app-dica p { margin: 12px; font-size: 15px; line-height: 17px; }

/*.container-bts-apps .item-app.app-agenda { background: #00478c }
.container-bts-apps .item-app.app-indicadores { background: #D96D00 }
.container-bts-apps .item-app.app-faturamento { background: #007537 }
.container-bts-apps .item-app.app-busca { background: #2B6AAA }
.container-bts-apps .item-app.app-relatorios { background: #FB9131 }
.container-bts-apps .item-app.app-receitas { background: #B30058 }
.container-bts-apps .item-app.app-lembretes { background: #13914B }
.container-bts-apps .item-app.app-chat { background: #5990C6 }
.container-bts-apps .item-app.app-agendamentos { background: #F2AA62 }
.container-bts-apps .item-app.app-ficha { background: #D9629C }
.container-bts-apps .item-app.app-documentacao { background: #22BF81 }
.container-bts-apps .item-app.app-operadoras { background: #C12881 }
.container-bts-apps .item-app.app-velocidade { background: #EE4D4D }
.container-bts-apps .item-app.app-configuracoes { background: #AE1111 }
.container-bts-apps .item-app.app-contatos { background: #CC2424 }
.container-bts-apps .item-app.app-marketing { background: #F1D031 }
.container-bts-apps .item-app.app-app { background: #000 }
.container-bts-apps .item-app.app-manual { background: #D9629C }
.container-bts-apps .item-app.app-tiss { background: #AE1143 }*/
.container-bts-apps .item-app.app-desativado {/* background: #ccc;*/ border: #eee; cursor: default; opacity: 0.3;}

.container-bts-apps .app-agenda .app-icone { background-position: 0 0; }
.container-bts-apps .app-indicadores .app-icone { background-position: 0 -37px; }
.container-bts-apps .app-faturamento .app-icone { background-position: 0 -74px; }
.container-bts-apps .app-tiss .app-icone { background-position: 0 -691px; }
.container-bts-apps .app-busca .app-icone { background-position: 0 -111px; }
.container-bts-apps .app-relatorios .app-icone { background-position: 0 -148px; }
.container-bts-apps .app-receitas .app-icone { background-position: 0 -185px; }
.container-bts-apps .app-lembretes .app-icone { background-position: 0 -221px; }
.container-bts-apps .app-chat .app-icone { background-position: 0 -258px; }
.container-bts-apps .app-agendamentos .app-icone { background-position: 0 -295px; }
.container-bts-apps .app-ficha .app-icone { background-position: 0 -331px; }
.container-bts-apps .app-documentacao .app-icone { background-position: 0 -368px; }
.container-bts-apps .app-sms .app-icone { background-position: 0 -405px; }
.container-bts-apps .app-velocidade .app-icone { background-position: 0 -442px; }
.container-bts-apps .app-configuracoes .app-icone { background-position: 0 -479px; }
.container-bts-apps .app-contatos .app-icone { background-position: 0 -516px; }
.container-bts-apps .app-marketing .app-icone { background-position: 0 -658px; }
.container-bts-apps .app-pesquisa-nps .app-icone { background-position: 0 -553px; }
.container-bts-apps .app-app .app-icone { background-position: 0 -590px; }
.container-bts-apps .app-manual .app-icone { background-position: 0 -627px; }
.container-bts-apps .app-granatum .app-icone { background-position: 0 -728px; }

/* rodape padrao para os layouts dos aplicativos */
.rodape-apps {
    background: #F1F1F1;
    border-top: 1px solid #CCC;
    box-shadow: inset 0 1px 0px #FFF;
    height: 24px;
    width: 100%;
    bottom: 0px;
    left: 0;
    /*font-size: 13px; */
    text-align: center;
    /*margin-top: -40px; */
    white-space: nowrap;
    position: fixed;
    min-width: 900px;
    font-size: 11px;
    z-index: 10;
}
.rodape-apps .container-rodape-apps {
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 5px;
    white-space: nowrap;
}
.rodape-apps .container-rodape-apps .rodape-esquerdo { float: left; color: #555; white-space: nowrap }
.rodape-apps .container-rodape-apps .rodape-direito { 
    /*float: right; */
    text-align: right;
    padding-left: 15px;
    color: #555; 
    min-width: 850px;
}
.rodape-apps .container-rodape-apps .rodape-esquerdo a, .rodape-apps .container-rodape-apps .rodape-direito a{
    opacity: 0.7;
    cursor: pointer;
    text-decoration: none;
    color: #00478C;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    white-space: nowrap;
}
.rodape-apps .container-rodape-apps .rodape-esquerdo a:hover, .rodape-apps .container-rodape-apps .rodape-direito a:hover{
    opacity: 1;
    text-decoration: underline;
}

.operadora-telefone {
    display: inline-block;
    height: 25px;
    width: 56px;
    background: url('/images/geral/sprite-telefones.png');
    margin-left: 5px;
    vertical-align: middle;
}

.operadora-telefone.claro, .operadora-telefone.ddd-21  {background-position: 0 0; }
.operadora-telefone.brasil-telecom, .operadora-telefone.ddd-14 {background-position: 0 -25px; }
.operadora-telefone.oi, .operadora-telefone.ddd-31 {background-position: 0 -50px; }
.operadora-telefone.nextel, .operadora-telefone.ddd-99 {background-position: 0 -75px; }
.operadora-telefone.vivo, .operadora-telefone.ddd-15 {background-position: 0 -100px; }
.operadora-telefone.tim, .operadora-telefone.ddd-41 {background-position: 0 -125px; }

/* mensagens svn */
.barra-msg-svn {
    position:absolute;
    z-index:8;
    top:40;
    left:0;
    width:100%;
    height:40px;
    background-color:yellow;
}

/* ---------------- Mensagem IE --------------------- */

#dgMensagemIE {
    display: none;
    position: absolute;
    z-index: 20000;
    left: 50%;
    top: 50%;
    width: 500px;
    margin: 10px;
    margin-left: -265px;
    margin-top: -72px;
    padding: 15px 40px 5px 15px;

    background-color: #FFF;
    color: black;
    font-family: Segoe ui, Arial;
    font-size: 12px;
    line-height: 18px;
    text-align: left;
    border-radius: 5px;

    box-shadow: 0px 0px 10px 2px #999;
}

#dgMensagemIE #btFechar {
    position: absolute;
    top: 0;
    right: 0;
    margin: 15px 12px;
    cursor: pointer;
    background: url('/images/agenda/btFechar.png') no-repeat top left;
    width: 14px;
    height: 14px;
    display: block;
}

#dgMensagemIE #btFechar:hover{
    background-position: -24px 0;
}

#dgMensagemIE #btFechar:active{
    background-position: -48px 0;
}

#dgMensagemIE div.divBrowsers {
    display: block;
    text-align: center;
}

#dgMensagemIE div.divBrowsers span {
    display: inline-block;
    opacity: 0.6;
    filter:alpha(opacity=60);
    padding: 10px 20px;
    cursor: pointer;
}

#dgMensagemIE div.divBrowsers span:hover {
    opacity: 1.0;
    filter:alpha(opacity=100);
}

#dgMensagemIE div.divBrowsers span h4 {
    font-size: 11px;
}