/* 
    Created on : 03/04/2017, 22:05:23
    Author     : SS-Sistemas
*/

body{
  /*  background: #eee; */
  background: #fff;
  
}
/* DICA ------ 
Para saber qual parte do CSS está alterando, é só usar o inspecionar do
goole chrome */

/* Ao passar o mouse */
/*nav a:hover {
    color: #fff !important;
} */
/*============  PERSONALIZAÇÃO DAS CORES DO NAVBAR  ========================*/
/* Altera a cor do Navbar */
.navbar, .navbar-default, .dropdown-menu{
    /* background: #36508C!important; */
    background: navy !important;
    border: none; 
}
/* Altera a cor do botão <li class="active"> */ 
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover {
    color: #fff;
    background-color: #102A66;
}
/* =======  BOTÃO NAVEGAÇÃO CELULAR ======*/
/* Altera a borda do botão de navegação dos celulares */
.navbar-inverse .navbar-toggler {
    border-color: #27407A;
    
}
/* Altera a cor do botão de navegação dos celulares, ao passar o mouse */
.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
    background-color: #102A66;
}
/* Botão três barras estilo celular*/
.navbar-toggle .icon-bar{
    color: #fff;
    background: #fff;
}
/* =======  FIM BOTÃO NAVEGAÇÃO CELULAR ======*/

.nav>li>a, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .dropdown-menu>li>a, .dropdown-menu>li{
  border-bottom: 3px solid transparent;
}
.nav>li>a:focus, .nav>li>a:hover,.nav .open>a, .nav .open>a:focus, .nav .open>a:hover, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{
  border-bottom: 3px solid transparent;
  background: none;
}
.navbar a, .navbar-default, .dropdown-menu>li>a, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .navbar-toggle{
 color: #fff;
}
.dropdown-menu{
      -webkit-box-shadow: none;
    box-shadow:none;
}

.nav li:hover:nth-child(8n+1), .nav li.active:nth-child(8n+1){
    border-bottom: #33ff33 3px solid;
}
.nav li:hover:nth-child(8n+2), .nav li.active:nth-child(8n+2){
    border-bottom: #ffff00 3px solid;
}
.nav li:hover:nth-child(8n+3), .nav li.active:nth-child(8n+3){
  border-bottom: #FECF71 3px solid;
}
.nav li:hover:nth-child(8n+4), .nav li.active:nth-child(8n+4){
  border-bottom: #F0776C 3px solid;
}
.nav li:hover:nth-child(8n+5), .nav li.active:nth-child(8n+5){
  border-bottom: #DB9DBE 3px solid;
}
.nav li:hover:nth-child(8n+6), .nav li.active:nth-child(8n+6){
  border-bottom: #C49CDE 3px solid;
}
.nav li:hover:nth-child(8n+7), .nav li.active:nth-child(8n+7){
  border-bottom: #669AE1 3px solid;
}
.nav li:hover:nth-child(8n+8), .nav li.active:nth-child(8n+8){
  border-bottom: #62C2E4 3px solid;
}
/*============  FIM PERSONALIZAÇÃO DAS CORES DO NAVBAR  ========================*/

/*============  PERSONALIZAÇÃO DAS CORES Do BOTÃO SUCCESS  ========================*/
.btn-success {
    color: #fff;
    background-color: #36508C;
    border-color: #27407A;
}
/* Ao passar o mouse por cima */
.btn-success:hover {
    color: #fff;
    background-color: #102A66;
    border-color: #071D50;
}
/*============  FIM PERSONALIZAÇÃO DAS CORES Do BOTÃO SUCCESS  ========================*/


@media screen and (max-width:767px){
    /* header .contato .mailtopo, header .contato .dados .campo .siga{display:none;}
    header .dados-menu ul{display:none;} */
    .no-mobile-ss{display:none;}
}


@media (max-width: 480px){
    #box-banner{
        min-height: 300px;
    }
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  background-color: #f5f5f5;
}

.jumbotron {
  text-align: center;
  background-color: transparent;
}

.alert{
    background: #f5f5f5;
}

.form-consulta-ss{
    border: 0px solid #fff; 
    padding: 50px 60px; 
    margin-top: 5vh;
/*    background: #f5f5f5; */
}

.form-consulta-ss-2{
    border: 1px solid #669AE1; /*#fff;  */
    margin-top: 10%; /* 9vh; */
}

.form-container_desabilitado{border: 0px solid #fff; padding: 50px 60px; margin-top: 20vh;
    -webkit-box-shadow: -1px 4px 26px 11px rgba(0,0,0,0.75);
    -moz-box-shadow: -1px 4px 26px 11px rgba(0,0,0,0.75);
    box-shadow: -1px 4px 26px 11px rgba(0,0,0,0.75);
}
/* Altera apenas o tr do tbody */
.table-striped > tbody > tr {
    background-color: #cccccc;
}

/* Barra ao passar o mouse */
.table-hover > tbody > tr:hover {
    background-color: #99ff00; /* Verde #009900;*/
    color: #fff;
}

.row-ss{padding-top: 5px;}


/* ícone a esquerda e a direita da caixa de texto. */
.left-inner-addon {
    position: relative;
}
.left-inner-addon input {
    padding-left: 30px;    
}
.left-inner-addon i {
    position: absolute;
    padding: 9px 12px;
    pointer-events: none;
}

.right-inner-addon {
    position: relative;
}
.right-inner-addon input {
    padding-right: 30px;    
}
.right-inner-addon i {
    position: absolute;
    right: 0px;
    padding: 10px 12px;
    pointer-events: none;
}
/* . = class*/ 
.print {
display:none;
}

.no-print { 
display:block; 
}
/* #= id*/ 
hr#assinatura{
    border-color: #000; 
}

/* CUSTOMIZA O CAROUSEL
-------------------------------------------------- */
/* Classe base do carousel */
.carousel {
  margin-bottom: 1rem;
}

/* Já que usamos posicionamento de imagens, precisaremos fazer alguns ajustes na legenda */
.carousel-caption {
  bottom: 3rem;
  z-index: 10;
}

/* Declaramos alturas, devido ao posicionamento do elemento img */
.carousel-item {
  height: 30rem;
  background-color: #777;
}
.carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 30rem;
}

/* Configuração do tamanho do carousel*/
/*
.carousel-item {
  height: 65vh;
  /* min-height: 300px; */
/*  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
} */
/* CONFIGURAÇÕES DO SIDEBAR (MENU A ESQUERDA)
https://pt.broculos.net/2015/08/how-to-build-collapsible-sidebars-with.html


/* FIM CONFIGURAÇÕES DO SIDEBAR (MENU A ESQUERDA)*/

.whatsapp {
    position:fixed;
    width:60px;
    height:60px;
    bottom:40px;
    right:40px;
    background-color:#25d366;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    font-size:30px;
    box-shadow: 1px 1px 2px #888;
    z-index:1000;
}

/* Exemplos
<div class="left-inner-addon ">
    <i class="icon-user"></i>
    <input type="text"
           class="form-control" 
           placeholder="Username" />
</div>
<div class="right-inner-addon ">
    <i class="icon-search"></i>
    <input type="search"
           class="form-control" 
           placeholder="Search" />
</div>


<br/>

<p>Smaller:</p>
<div class="col-xs-6" >
    <div class="left-inner-addon">
        <i class="icon-user"></i>
        <input type="text"
               class="form-control" 
               placeholder="Username" />
    </div>
</div>
<div class="col-xs-6" >
    <div class="right-inner-addon">
        <i class="icon-search"></i>
        <input type="search"
               class="form-control" 
               placeholder="Search" />
    </div>
</div>


FIM ícone a esquerda e a direita da caixa de texto. */