/* ------------------------------
global styles
------------------------------ */
body {
    /*background:url(../imagens/bg.jpg) top center no-repeat;*/
    font-family: arial,hevetica,sans-serif;
    font-size: 13px;
    margin: 0;
    padding: 0;
}

#topo-novo {
    height: 270px; 	
    z-index: 99999;
    margin-bottom: 40px;
    background-repeat: no-repeat;    
    background-position: center top;    
    background-image:url("../imagens/bg3.jpg");	
}

h3 {
    color: #0A3D70;
    font: bold 15px Calibri,Arial,Helvetica,sans-serif;
}


/* Estilo para a base do rodapé */
.base {
    background-color: #2c3e50; /* Cor de fundo escura */
    color: #ecf0f1; /* Cor do texto clara */
    padding: 20px 0;
    text-align: center;
    font-family: 'Arial', sans-serif;
    font-size: 14px;
    position: relative;
    bottom: 0;
    width: 100%;
}

/* Estilo para a seção de direitos autorais */
.direitos-autorais-rodape {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Estilo para o texto principal */
.direitos-autorais-rodape::before {
    content: "© 2023 ABC Portas SP. Todos os direitos reservados. ";
    margin-bottom: 10px;
}

/* Estilo para o link de Política de Privacidade */
.direitos-autorais-rodape a {
    color: #ecf0f1;
    text-decoration: underline;
    transition: color 0.3s;
}

.direitos-autorais-rodape a:hover {
    color: #bdc3c7;
}

/* Estilo para o parágrafo de desenvolvimento */
.direitos-autorais-rodape p {
    margin-top: 10px;
    font-size: 12px;
}

/* Estilo para a imagem do desenvolvedor */
.direitos-autorais-rodape img {
    width: 100px; /* Ajuste o tamanho conforme necessário */
    height: auto;
    margin-top: 5px;
    transition: transform 0.3s;
}

.direitos-autorais-rodape img:hover {
    transform: scale(1.05);
}

/* Responsividade para dispositivos menores */
@media (max-width: 600px) {
    .base {
        padding: 15px 10px;
        font-size: 12px;
    }

    .direitos-autorais-rodape img {
        width: 80px;
    }
}



.atendimento{
	float:right;
    margin-top: 5px;
}

.whatsapp
{
    float: right;
    margin-top: 3px;
    margin-right: 3px;
}

.telefone-header
{
    float: right;
    font-family: Arial;
    font-size: 17px;
    color: #0a3d7e;
    font-weight: bold;
    margin-top: 20px; 
	margin-bottom: 20px;	
}

a {
   color:#0A3D70;
   text-decoration: none;
}
a:hover {
   color:#0A3D70;
   text-decoration: underline;
}


img { border:0; }

.img_style {
    border: 2px solid #CCCCCC;
    margin: 12px -1px 0 0;
    padding: 0;
}

/* ------------------------------
header styles
------------------------------ */

#header {
    width: 100%;
    float: left;
    display: block;
    padding: 18px 0;
    margin-bottom: 25px;
    background-color: #294970;
    background: #294970 url(../imagens/repeat.jpg) center bottom repeat-x;
}

#header .alinha{
    width: 960px;
    display: block;
    margin: 0 auto;
}

#header .alinha h1{
    width: 330px;
    height: 100px;
    float: left;
    display: block;
    background: url(../imagens/portasdeacoabc.png) 0 0 no-repeat;
}

#header .alinha h1 a{
    width: 330px;
    height: 68px;
    display: block;
    text-indent: -999999px;
}

#righttopcolumn{
    width: 470px;
    float: right;
    display: block;
}

.telefone {
    color: #FFF;
    font-size: 22px;
    text-align: right;
    padding: 10px 0 0 0;
}

.contact-top{
    width: auto;
    float: right;
}

.contact-top li{
    height: 32px;
    float: left;
    color: #FFF;
    list-style-type: none;
    margin-left: 20px;
    padding: 5px 0 0 40px;
    list-style-image: none;
}

.contact-top li:nth-of-type(1){
    background: url(../imagens/icon-mail.png) 0 0 no-repeat;
}

.contact-top li:nth-of-type(2){
    background: url(../imagens/icon-whats.png) 0 0 no-repeat;
}

.contact-top li a{
    color: #FFF;
}

#menu-top{
    width: 100%;
    float: left;
    margin: 0;
    padding: 20px 0 0 0;
}

#menu-top li{
    float: left;
    padding-right: 15px;
    position: relative;
    list-style-type: none;
}

#menu-top li a{
    font-weight: bold;
}

#menu-top li ul{
    display: none;
}

#menu-top li ul li{
    padding-bottom: 5px;
}

#menu-top li:hover ul{
    width: 150px;
    display: block;
    top: 16px;
    left: 0;
    padding: 15px;
    position: absolute;
    background-color: #CCC;
}




.logo {
    float: left;
    margin: 7px 0 0;
    padding: 0;
    width: 210px;
}


.bt_fotos {
    float: right;
    margin: -20px 190px 0 0;
    overflow: hidden;
    padding: 0;
}

.online {
    float: right;
    margin: -95px 20px -25px;
    padding: 0;
}

/* ------------------------------
container styles
------------------------------ */
#site {
    width: 964px;
    padding: 8px;
    clear: both;
    margin: 0 auto; 
    border: 1px solid #509161;
    background: none repeat scroll 0 0 #FFFFFF;
}

.col_esq {
    float: left;
    margin: 10px 0;
    width: 675px;
}
.col_esq h1 {
    color: #0A3D70;
    font: bold 20px Arial,Helvetica,sans-serif;
}
.col_esq h2 {
    color: #0A3D70;
    font: bold 16px Arial,Helvetica,sans-serif;
    margin-top: 5px;
}
.col_esq p {
    margin: 10px 0;
    text-align: justify;
}

.col_dir {
    float: right;
    margin: 10px 0;
    text-align: center;
    width: 275px;
}
.col_dir ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.col_dir ul li {
  margin: 0 0 15px 0;
}
.col_dir img {
  border: 1px dashed #ccc;
  margin-top: 10px;
  padding: 10px 3px;
}
.li_palavras {
  margin: 0 20px;
  padding: 0;
  list-style: disc;
}

.col_esq2 {
    float: left;
    margin: 10px 0;
    width: 450px;
}
.col_dir2 {
    float: right;
    margin: 0;
    text-align: center;
    width: 500px;
}
.fotos_categoria {
   margin: 0 7px;
   clear: both;
}
.fotos_categoria li {
    width: 225px;
    height: 210px;
    float: left;
    padding: 3px;
    display: inline;
    margin: 0 5px 20px;
    text-align: center;
    background: none repeat scroll 0 0 #C6E3BD;
}
.fotos_categoria li img {
    border: 1px solid #509161;
    margin-bottom: 3px;
}
.li_palavras li {
  margin: 0px 10px 3px;
  padding: 0;
  font-weight: bold;
}


/* ------------------------------
faixa 1 styles
------------------------------ */
#faixa_1 {
    margin: 0 0 -35px;
    /* overflow: hidden; */
    padding: 0 0 30px;
}

#conteudo_faixa_1 {
    height: 311px;
	margin: 0 auto;
    width: 960px;
}

.img_faixa_1 {
    margin: 15px 0 0 4px;
    width: 960px;
}
#banner {
    height: 300px;
    margin: 0 0 0;
    padding: 15px 15px 0;
}




/* ------------------------------
faixa 2 styles
------------------------------ */

#faixa_2 {
    background: url("../imagens/bg_faixa_2.png") no-repeat scroll center top transparent;
    clear: both;
    margin: 0 auto;
    overflow: hidden;
}

#conteudo_faixa_2 {
    margin: 0 auto;
    overflow: hidden;
    padding: 45px 4px 50px;
    width: 960px;
}

.servicos {
    clear: both;
    float: left;
    margin: 36px 10px 0 73px;
    padding: 0;
    width: 310px;
}

.servicos p {
    padding: 0 0 0 12px;
    text-align: justify;
}

.servicos h3 {
    border-left: 2px solid #0A3D70;
    padding: 0 0 0 25px;
}

.titulo_img {
    float: left;
    margin: 20px 0 0 10px;
}

.servicos_img {
    float: right;
    margin: 5px;
}

.fale_conosco {
    float: right;
    margin: -40px 3px;
}


/* ------------------------------
faixa 3 styles
------------------------------ */
#faixa_3 {
    background: url("../imagens/bg_faixa_3.png") repeat scroll center top transparent;
    clear: both;
    margin: 0 auto;
    overflow: hidden;
}

#conteudo_faixa_3 {
    margin: 0 auto;
    overflow: hidden;
    width: 960px;
}

.galeria {
    float: left;
    margin: 20px 10px 10px 5px;
    padding: 0;
    width: 670px;
}

.meio_galeria {
    background: url("../imagens/galeria2.png") no-repeat;
    width: 670px;
    height: 155px;
}

.meio_galeria p {
    float: right;
    font-size: 20px;
    line-height: 20pt;
    margin: 53px 288px 0 0;
    text-align: center;
    width: 205px;
}

.meio_galeria a {
    text-decoration: none;
    color: #000;
}


.box_text {
    background: none repeat scroll 0 0 #C6E3BD;
    border: 1px solid #509161;
    float: left;
    margin: 0 10px 20px 5px;
    padding: 0;
    width: 668px;
}

.box_text span {
    float: left;
    padding: 10px 0 0 10px;
    text-align: justify;
    width: 349px;
}

.box_text h3 {
    padding: 12px 0 0 15px;
}

.box_text_img {
    float: right;
    margin: 0 20px 10px 0;
}

.banner_2 {
    float: right;
    margin: 20px 0;
}

/* ------------------------------
box interno styles
------------------------------ */
.meio {
  margin: 0;
  padding: 10px 0;
}


#box_int {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #509161;
    margin: 0 auto;
    min-height: 500px;
    /* overflow: hidden; */
    width: 980px;
}

.box_int_titulo {
    background: none repeat scroll 0 0 #C6E3BD;
    border-bottom: 1px solid;
    float: left;
    width: 100%;
}

.box_int_titulo h2 {
    color: #0A3D70;
    font: italic bold 35px Calibri,Arial,Helvetica,sans-serif;
    margin: 10px;
    text-shadow: 1px 1px 2px #666666;
}

.box_clientes {
    clear: both;
}

.box_clientes p {
    font-size: 10pt;
    line-height: 20pt;
    margin: 20px;
}

.box_clientes ul {
    line-height: 23pt;
    margin: 5px 15px;
    font-size: 14px;
}

.box_clientes ul li {
    list-style: none;
}

.box_int_text {
    clear: both;
    float: left;
    margin: 15px 0 0;
    min-height: 400px;
}

.box_int_text p {
    font-size: 10pt;
    line-height: 18pt;
    margin: 5px 10px 15px;
    padding: 0;
    text-align: justify;
}

#title_catalogo {
    color: #4D9089;
    font-family: Arial;
    font-size: 26px;
    font-weight: bold;
    text-align: center;
}

#subtitle_catalogo {
    color: #4D9089;
    font-family: Arial;
    font-size: 38px;
    text-align: center;
}

#title2 {
    color: #4D9089;
    font-family: Arial;
    font-size: 20px;
    float: left;
}

#title3 {
    color: #4D9089;
    font-family: Arial;
    font-size: 20px;
    float: right;
}

.img_title1 {
    float: left;
    margin: -2px 0;
}

.img_title2 {
    float: left;
    margin: 7px 0;
}



.box_int_text ul {
    margin: 0 15px;
}

.box_int_text ul li {
    list-style: none outside none;
    margin: 0 0 45px;
}


#fotos {
   margin: 0 7px;
}
#fotos li {
    background: none repeat scroll 0 0 #C6E3BD;
    display: inline;
    float: left;
    height: 235px;
    margin: 0 5px 20px;
    padding: 3px;
    text-align: center;
    width: 225px;
}
#fotos li img {
    border: 1px solid #509161;
    margin-bottom: 3px;
}

.fotos_categoria {
   margin: 0 7px;
   clear: both;
}
.fotos_categoria li {
    background: none repeat scroll 0 0 #C6E3BD;
    display: inline;
    float: left;
    /* height: 235px; */
    margin: 0 5px 20px;
    padding: 3px;
    text-align: center;
    width: 225px;
}
.fotos_categoria li img {
    border: 1px solid #509161;
    margin-bottom: 3px;
}
.last {
  clear: both;
}


.imgs_clientes ul {
   margin: 0 35px;
}

.imgs_clientes ul li {
    display: inline;
    float: left;
    margin: 0 13px 20px;
    min-height: 110px;
    padding: 20px 0 0;
    text-align: center;
    width: 200px;
}


.back {
    clear: both;
    font-weight: bold;
    margin: 35px 0 10px;
    text-align: center;
}

.back p {
    font-size: 10pt;
}

.back a {
    color: #000;
    text-decoration: none;
}


/* ------------------------------
footer styles
------------------------------ */
#tags {
  /*overflow: hidden;
  float: left;*/
  clear: both;
  margin-left: 10px;
}

#openTag {
  cursor: pointer;
  font-size: 11px;
}

#palavras-chave {
    margin: 0 auto;
    overflow: hidden;
    text-align: justify;
    width: 950px;
    font-size: 10px;
}

#footer {
    margin: 0 auto;
    overflow: hidden;
    background:url(../imagens/bg_footer.jpg) repeat top;
	clear:both;
    min-height: 145px;
    margin-bottom: 20px;
}

#conteudo_footer {
    margin: 0 auto;
    overflow: hidden;
    width: 980px;
    margin-top: 10px;
}

.logo_footer {
    width: 210px;
    float: left;
    margin: 10px 0 0;
}

.central_atendimento {
    border-right: 1px dashed #AAAAAA;
    float: left;
    height: 160px;
    line-height: 22px;
    margin: 10px 0 0 -26px;
    padding: 0;
    text-align: center;
    width: 315px;
}
.central_atendimento p {
    font-size: 14px;
    margin: 0 0 10px;
}
.central_atendimento p span {
    color: #0A3D70;
    float: right;
    font-weight: bold;
    margin-right: 90px;
    text-align: right;
}
.central_atendimento ol {
    margin: 0;
    padding: 0;
}
.central_atendimento ol li {
    color: #0A3D70;
    font-size: 15px;
    list-style: none outside none;
    margin: 0;
    padding: 0 0 0 20px;
    text-align: left;
}
.central_atendimento ol li span {
    width: 50px;
    float: left;
    text-align: left;
    color: #000;
}


#menu_rodape {
    float: right;
    font-size: 13px;
    line-height: 18px;
    margin: 10px 190px 0 20px;
}

.mrodape_esquerda {
    float: left;
    width: 100px;
}

.mrodape_direita {
  float: left;
  width: 124px;
}


#menu_rodape a {
    text-decoration: none;
    color: #000;
}

#menu_rodape ul {
    list-style: none;
    margin: 0;
    padding: 0;


}

#menu_rodape li ul {
  display: inline;
  text-align: left;

}

#menu_rodape ul li {
	float: left;
	position: relative;
    display: inline;
}
#menu_rodape ul li a {
  color: #000;
  text-decoration: none;
}

#menu_rodape ul li a:hover {
  color: #000;
  text-decoration: underline;
}

.creditos {
    clear: both;
    float: left;
    margin: 10px 0 0;
}

.redes_sociais {
    float: right;
    margin: 10px 0 0;
    padding: 0 8px 0;
    width: 295px;
    border-left: 1px  dashed #aaa;
    height: 150px;
}
.redes_sociais ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.redes_sociais ul li {
  margin: 5px 5px 0;
  padding: 0;
  float: left;
}


.local_direita {
    float: left;
    padding-left: 30px;
    text-align: left;
}
.endereco {
    clear: both;
    font-size: 14px;
    line-height: 18px;
    margin: 15px auto 10px;
    text-align: center;
}


.btn_voltar {
  text-align: center;
  clear: both;
  padding: 20px 0 10px 0;
}

.button-whats {
    position: fixed;
    left: auto;
    right: 1%;
    margin-bottom: 12px;
    z-index: 999999999;
    background: #25d366;
    border-radius: 22px;
    text-align: center;
    bottom: 7%;
        box-shadow: 0 0 0 0 rgb(0 168 34 / 37%);
}

.button-whats a  {
   color: #fff;
   text-decoration: none;
}

.button-whats a:hover  {
   color: #fff;
   text-decoration: none;
}
.button-whats p {
    margin: 0;
    font-size: 19px;
    padding: 5px 16px;
}

#form { margin: 17px 0 0px 0px; width:607px; }
#form input {border:#1a1a1a 1px solid; background:#fff; font-size:14px; font-family: Century Gothic; color:#000; padding:3px 10px 3px 10px;outline: medium none;width: 473px; height:17px; float:left;}
#form textarea {border:#1a1a1a 1px solid; background:#fff; font-size:14px; font-family: Century Gothic; color:#000; height: 170px;outline: medium none;overflow: auto; padding: 4px 0px 0px 10px;width:483px;resize:none;margin:0px 0 0 0;float:left;}
#form label {position:relative;display: block; min-height:30px; overflow:hidden;}
.btns {text-align:right; overflow:hidden; width:566px; }
.btns a {display:inline-block; margin:20px 0px 0 10px; width:88px; text-align:center;}
#form label strong {float:left; display:block; padding-top:3px; line-height:15px; width:85px; font-weight:normal; white-space:nowrap;} 
#form input[type='submit']{float:right;width:100px;margin-top:7px;padding: 10px 10px 30px;text-align:center;color:#fff;border:0;background-color:#000;margin-right: 299px;}
#form .captcha {width: 260px;}
#form #imagem {float: left; height: 40px;}
#form #captcha {width: 115px; float: right; margin-left: -20px; height: 32px;}

.clear
{
    clear: both;
}