/* 
    Documento   : estrutura.css
    Criado      : 17/11/2011 16:22:00
    Modificado  : 17/11/2011 16:22:00

    Autor(es)   : 
        André da Silva Severino
        Edson Kendi Maruyama

    Modificado por:
        

    Descrição   : Arquivo com a estrutura do site exclusivo
    Package     : web-files/css
*/
#barra-superior{
    height:38px;
}

#wrap-site{
    width:960px;
    height:100%;
    margin:0 auto;
    text-align: left;
    
}

#wrap-topo{
    height:88px;
}
    #wrap-topo #logo{
        position:absolute;
    }
    #wrap-topo #logo a img{border:none;}

    #wrap-topo #menu_superior{
        position: absolute;
        margin-left:430px;
        width:640px;
        height:88px;
    }
    #wrap-topo #menu_superior ul li#last a{padding-right:0px;}
    #wrap-topo #menu_superior ul{margin-top:30px;}
    #wrap-topo #menu_superior ul li{
        display:inline;
    }
    #wrap-topo #menu_superior ul li a{
        position: relative;
        line-height:30px;
        padding:6px;
    }
    #wrap-relogio{margin:0 auto; width:960px;}
    #relogio_topo{
        background: url(../img/ico-relogio.png) no-repeat left center;
        width:108px;
        height:31px;
        line-height:30px;
        text-align:center;
        position: absolute;
        margin-left:890px;
        margin-top:-2px;
    }

    
/* Conteúdo */    
#wrap-conteudo{
    width:960px;
    height:100%;
    padding-top:10px;
    padding-bottom:20px;
    overflow: hidden;
}
    #wrap-conteudo p{margin:4px 0px;}
    #wrap-conteudo ul,
    #wrap-conteudo ol{margin:10px 0px 10px 30px;}

    #wrap-conteudo ul li{list-style: circle;}
    #wrap-conteudo ol li{list-style: decimal;}
    
    .box_esquerda{width:650px;}
    .box_direita{width:290px;}

    /* Ajustes da página home */
    #box-esquerda{width:620px;}
    #box-direita{width:300px;}
    
    
#ferramentas{
    height:145px;
    padding-top:14px;
    margin-top:10px;
    margin-bottom:20px;
    -moz-box-shadow:0px 1px 4px #333; 
    -webkit-box-shadow:0px 1px 4px #151515;
    border-radius:8px; 
    -moz-border-radius:8px; 
    -webkit-border-radius:8px;
}
    
    
#links{height:350px; margin-top:20px;}

#links ul{width:300px; margin-left:0px;}
#links ul li{
        list-style-type:none; 
        padding:4px;
        height:60px; 
    }
    #links ul li a{
        display: block; 
        padding-left: 60px;
    }
    #links ul li a span{
        display: block;
        padding-top:5px!important; /* Deixa o texto no meio */
    }
    
    /* Box com link's úteis (utilitários) */
    #box-links-uteis p a{padding:4px 2px; display: block;}
    #box-links-uteis div{margin-top:10px;}
    #box-links-uteis div ul{margin-left:30px; margin-bottom:10px; width:260px;}
    #box-links-uteis div ul li a{padding:3px 2px; display:block;}

    /* Lista de artigos */
    #iartigos ul li{list-style-type:none;}
    #iartigos ul li a{margin:4px 0px; padding:3px 0px; display: block;}
    #iartigos ul li a span{font-weight:bold; display:block;}    

    /* Lista de parceiros */
    .box-parceiro{height:120px; padding:30px 0px;}
    .box-parceiro img{position:absolute;}
    .box-parceiro table{position:absolute; margin-left:250px;}
    .box-parceiro table tr td{padding:2px 0px; height:20px;}
    
    /* Lista de downloads */
    
    .box-conteudo ul, .box-conteudo ol{margin:10px 20px;}
    .box-conteudo ul li{list-style: circle; padding:4px 0px;}
    
    
    
    
/* Rodapé */    
#box-tag{
    padding:10px 0px;
    margin:0 auto;
    width:960px;
}
#box-tag p strong{padding-right:10px;}


#wrap-rodape{
    clear:both;
}
    #wrap-rodape #rodape{
        width:960px;
        height:195px;
        margin:0 auto;
        padding:10px 0px;
    }
    
    #wrap-rodape #rodape div{
        width:270px;
        padding:10px 20px;
    }
    
    #wrap-rodape #rodape #esquerdo{padding-left:0px; width:300px;}
    #wrap-rodape #rodape #meio{padding:10px 29px;}
    
    #wrap-rodape #rodape #direito{text-align:center;}
    #wrap-rodape #rodape #direito img{margin-top:4px;}
    
    #wrap-rodape ul li a#first{margin-top:0px; padding-top:0px;}
    
    #wrap-rodape #meio #email{margin-top:20px;}
    #wrap-rodape #meio p{margin:6px 0px;}
    
    #wrap-rodape #rodape h4{padding-bottom:6px;}
    #wrap-rodape #rodape ul li{height:20px;}
    #wrap-rodape #rodape ul li a{
        padding:4px 2px;
    }

    #wrap-rodape-links #rodape-links{
        width:960px;
        height:80px;
        margin:0 auto;
        padding-top:16px;
    }
    
    #rodape-links ul{position:abolsute; padding-left:100px;}
    #rodape-links ul li{float:left; position:relative; padding:0px 10px; height:30px; line-height: 30px;}

    #rodape-links #tiideal_logo{margin-top:9px; height:17px; line-height:17px;}
    #rodape-links #tiideal_logo a{position:absolute; margin-top:5px; width:70px; height:17px; font:11px Tahoma; color:#FFF; background:url('../../../../../../ti-ideal.com/logo/logo_rodape_modelo_1.png') top no-repeat;}
    #rodape-links #tiideal_logo a:hover{background:url('../../../../../../ti-ideal.com/logo/logo_rodape_modelo_1.png') 0px -17px no-repeat; text-decoration: none;!important}

    
    #w3_validator{float:left; padding-top:6px;}
    #w3_validator a img{border:none;}

    
    /* Paginação */
    #paginacao{text-align:center; margin:16px auto; padding-top:14px; border-top:1px dashed #EBEBEB;}
    #paginacao strong{font:bold 12px Arial; color:#036; padding:2px 4px;}
    #paginacao a{text-decoration:none; font:bold 12px Arial; color:#333; padding:4px 8px; background:#F3F3F3; border:1px solid #999; margin:0px 2px; -moz-border-radius:2px 2px; -webkit-border-radius:2px 2px;}
    #paginacao a:hover{color:#FFF; background:#949494; border:1px solid #333; box-shadow:0 -2px 3px #DFDFDF; -moz-box-shadow:0 -2px 3px #DFDFDF; -webkit-box-shadow:0 -2px 3px #DFDFDF;}

    
/*
 ---------------------------------
 -- Status
 ---------------------------------
*/
.status{
    padding:4px 0px 4px 24px;
    width:90%; 
    margin:10px auto; 
    -moz-box-shadow:0px 1px 2px #000; 
    -webkit-box-shadow:0px 1px 2px #000; 
    border-radius:4px; 
    -moz-border-radius:4px;  
    -webkit-border-radius:4px; 
}
    .status p{font:11px Tahoma; cursor:default;}
    .status p strong{font:bold 12px Arial;}
    
#status_erro{ 
    background:url(../img/ico-erro-1.png) #FFCACA 2px center no-repeat; 
    border:1px solid #AE0000; 
}
	#status_erro p{color:#AE0000;}

#status_ok{ 
    background:url(../img/ico-ok-1.png) #D7FFEB 2px center no-repeat; 
    border:1px solid #00592D;
}
    #status_ok p{color:#060;}

.status_info, #status_info{
    background:url(../img/ico-info-1.png) #FFFF99 3px center no-repeat; 
    border:1px solid #CACA00; 
}

/* Botão Flutuante WhatsApp */    

#fab-wpp{position:fixed;width:64px;right:2%;bottom:9rem;z-index:9998;}
#fab-wpp .fab-action{
  transition:all 225ms ease-in-out;
  position:absolute;
  cursor:pointer;
  bottom:0;
  display:flex;
  align-items:center;
  width:64px;
  height:64px;
  background-color:#34AF23;
  border-radius:50%;
  text-align:center;
  box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
}
#fab-wpp .fab-action:hover{background-color:#2d991e}
#fab-wpp .fab-action i{margin:0 auto;color:#fff;font-size:3.5rem;}


@media screen and (max-width:991px) {
  #intro4 .col-articles {
    border-width: 0;
  }
  #galeria .galeria-videos .video-frame {width:100%;}
  #idocumentos #idocumentos-form {width:100%;}
  #intro3{height:515px;}
  #intro6 {padding:4rem 0 8rem;}
  #intro6 .circle-util {height:auto!important;width:auto!important;border-radius:5px;}
  #intro6 .tabela-circle, #intro6 .manual-circle {margin-top:3rem;}
  #index-depoimentos .depoimento-item, #depoimentos .depoimento-item {margin-top:3rem;}
}
@media screen and (max-width:768px) {
  .margin-top.m3{margin-top:7%;}
  #intro3{height:580px;}
  #intro5 p {width:100%;}
  #intro1 .contato {text-align:center!important;}
  #intro1 .contato .whatsapp-tel {float:none;font-size:2rem;}
}
    
    
    
    
    