header #topo_1 { left:0px; top:0px; float:left; position: absolute; z-index: 10; background: linear-gradient(180deg, rgba(0,0,0,0.8), rgba(0,0,0,0)) }
header #topo_1 #topo_1_site #iconeSubirPag { width:40px; height:40px; float:left; position:fixed; z-index:999; bottom:15px; right:15px }

header #topo_1 #topo_1_site #topo_1_logo img { width:100%; height:auto; float:left }
header #principal_1_menu { height: calc(100vh - 30px); float: left; padding:30px 30px 0 30px; position: fixed; z-index: 9; background-color: #0095DB; overflow:auto }
header #principal_1_menu::-webkit-scrollbar { width: 5px; }
header #principal_1_menu::-webkit-scrollbar-track { background: #0095DB; }
header #principal_1_menu::-webkit-scrollbar-thumb { background: #00699B; }

.tituloVitrine { position:absolute; z-index:999999; float:left; margin: 0; text-align:center }
.tituloVitrineTexto { width:100%; font-family:"Space Grotesk"; font-weight:300; color:#FFFFFF; height:auto; text-align:center; float:left; text-shadow: 3px 3px 5px rgba(0,0,0,0.15); }
.tituloVitrineTexto2 { width:100%; font-family:"Space Grotesk"; font-weight:100; color:#FFFFFF; height:auto; text-align:center; float:left; letter-spacing:-2px; text-shadow: 3px 3px 5px rgba(0,0,0,0.15); }
.tituloVitrineComentario { width:100%; font-family:"Space Grotesk"; font-weight:300; color:#FFFFFF; padding:10px 0 0 0; height:auto; text-align:center; float:left; text-shadow: 3px 3px 5px rgba(0,0,0,0.15); }
.tituloVitrineBotao { width:100%; font-family:"Space Grotesk"; font-weight:700; color:#FFFFFF; text-shadow:1px 1px #333333; padding:10px 0 10px 0; height:auto; text-align:center; margin: 20px 0 0 0 }
.tituloVitrineLogo { width:100%; height: auto; text-align:left; float:left; text-align:center }
.destaque-mask { width: 100%; height: 100vh; float: left; position: absolute; background-image: url("../imagens/bg-destaques.png"); z-index: 999 }
.tituloVitrineLogo > img { margin: 0 0 40px 0 }
.tituloVitrineLogo1 { width:auto; height: auto; text-align:center; float:left; -webkit-border-radius: 300px; -moz-border-radius: 300px; border-radius: 300px; border: 1px solid #FFFFFF; background-color: rgba(255,255,255,0.1) }
.tituloVitrineLogo1 > img { height: auto; float: left; filter: brightness(0) saturate(100%) invert(99%) sepia(53%) saturate(203%) hue-rotate(42deg) brightness(114%) contrast(110%) }

header #topo_1 #topo_1_site #topo_1_logo { height:auto; float:left; margin: 5px 0 0 0 }
header #topo_1 #topo_1_site #topo_1_site_1_itens { height:auto; float:left; position: relative }
header #topo_1 #topo_1_site #topo_1_site_1_itens #botaoTopo620Mais { width:100%; height:auto; float:left }
header #topo_1 #topo_1_site #topo_1_site_1_itens #botaoTopo620Mais #topo_1_telefone { width:210px; float:left; margin: 0 0 0 calc(100% - 210px) }
header #topo_1 #topo_1_site #topo_1_site_1_itens #botaoTopo620Menos { width:100%; height:auto; float:left; background-color: #ff0000 }

.botao_whatsapp { width:100%; height:auto; float:left; background-color:rgba(255,255,255,0); padding:6px 0 8px 0; color:#FFFFFF; cursor:pointer; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; margin:0 0 10px 0; font-size:20px; font-weight:500; white-space:normal; text-align:center; font-family:'Roboto'; border: 1px solid rgba(255,255,255,0.1) }
.botao_whatsapp:hover { border: 1px solid rgba(255,255,255,0.4); background-color: rgba(255,255,255,0.05)  }

@media only screen and (min-width: 1251px){

:root {
  --largura-menu: 550px;
  --padding-banner: 10%;
}

header #topo_1 { width:calc(100% - (var(--largura-menu) + 30px)); height: 200px; float: left; padding:15px 15px 15px 15px  }
header #topo_1 #topo_1_site { width:100%; height:auto }

header #topo_1 #topo_1_site #topo_1_logo { width:220px }
header #topo_1 #topo_1_site #topo_1_site_1_itens { width:calc(100% - 220px); }
header #topo_1 #topo_1_site { width:100%; height:auto; float:left }

header #principal_1_destaques { width:calc(100% - (var(--largura-menu) + 30px)); }

header #principal_1_menu { width:calc(var(--largura-menu) - 60px); margin: 0 0 0 calc(100% - var(--largura-menu)); }
	
/* DESTAQUE PRINCIPAL */
.tituloVitrine { width:calc(100% - (var(--padding-banner) * 2)); margin:0 var(--padding-banner) 0 var(--padding-banner) }
.tituloVitrineLogo > img { width: 100%; max-width: 400px; min-width: 200px }
.tituloVitrineTexto2 { font-size:50px; line-height:52px; text-align:center }
.tituloVitrineComentario { font-size:20px; text-align:center }
.tituloVitrineBotao { margin: 15px 0 0 0 }

.tituloVitrineLogo1 { margin: 0 0 20px calc((100% / 2) - ((120px + 60px) / 2)) }
.tituloVitrineLogo1 > img { width: 120px; margin: 30px }
	
}


@media only screen and (min-width: 961px) and (max-width: 1250px){

:root {
  --largura-menu: 100%;
  --padding-banner: 10%;
}

header #topo_1 { width:calc(100% - 30px); height: 200px; float: left; padding:15px 15px 15px 15px;  }
header #topo_1 #topo_1_site { width:100%; height:auto }

header #topo_1 #topo_1_site #topo_1_logo { width:220px }
header #topo_1 #topo_1_site #topo_1_site_1_itens { width:calc(100% - 220px); }
header #topo_1 #topo_1_site { width:100%; height:auto; float:left }

header #principal_1_destaques { width:100%; }

header #principal_1_menu { width:calc(var(--largura-menu) - 60px); margin: 0 0 0 calc(100% - var(--largura-menu)); }
	
/* DESTAQUE PRINCIPAL */
.tituloVitrine { width:calc(100% - (var(--padding-banner) * 2)); margin:0 var(--padding-banner) 0 var(--padding-banner) }
.tituloVitrineLogo > img { width: 100%; max-width: 300px; min-width: 200px }
.tituloVitrineTexto2 { font-size:50px; line-height:52px; text-align:center }
.tituloVitrineComentario { font-size:22px; text-align:center }
.tituloVitrineBotao { margin: 15px 0 0 0 }

.tituloVitrineLogo1 { margin: 0 0 20px calc((100% / 2) - ((120px + 60px) / 2)) }
.tituloVitrineLogo1 > img { width: 120px; margin: 30px }

}


@media only screen and (min-width: 769px) and (max-width: 960px){

:root {
  --largura-menu: 100%;
  --padding-banner: 10%;
}

header #topo_1 { width:calc(100% - 30px); height: 200px; float: left; padding:15px 15px 15px 15px;  }
header #topo_1 #topo_1_site { width:100%; height:auto }

header #topo_1 #topo_1_site #topo_1_logo { width:220px }
header #topo_1 #topo_1_site #topo_1_site_1_itens { width:calc(100% - 220px); }
header #topo_1 #topo_1_site { width:100%; height:auto; float:left }

header #principal_1_destaques { width:100%; }

header #principal_1_menu { width:calc(var(--largura-menu) - 60px); margin: 0 0 0 calc(100% - var(--largura-menu)); }
	
/* DESTAQUE PRINCIPAL */
.tituloVitrine { width:calc(100% - (var(--padding-banner) * 2)); margin:0 var(--padding-banner) 0 var(--padding-banner) }
.tituloVitrineLogo > img { width: 100%; max-width: 300px; min-width: 200px }
.tituloVitrineTexto2 { font-size:45px; line-height:47px; text-align:center }
.tituloVitrineComentario { font-size:20px; text-align:center }
.tituloVitrineBotao { margin: 15px 0 0 0 }

.tituloVitrineLogo1 { margin: 0 0 20px calc((100% / 2) - ((120px + 60px) / 2)) }
.tituloVitrineLogo1 > img { width: 120px; margin: 30px }

}




@media only screen and (min-width: 621px) and (max-width: 768px){

:root {
  --largura-menu: 100%;
  --padding-banner: 10%;
}

header #topo_1 { width:calc(100% - 30px); height: 200px; float: left; padding:15px 15px 15px 15px;  }
header #topo_1 #topo_1_site { width:100%; height:auto }

header #topo_1 #topo_1_site #topo_1_logo { width:220px }
header #topo_1 #topo_1_site #topo_1_site_1_itens { width:calc(100% - 220px); }
header #topo_1 #topo_1_site { width:100%; height:auto; float:left }

header #principal_1_destaques { width:100%; }

header #principal_1_menu { width:calc(var(--largura-menu) - 60px); margin: 0 0 0 calc(100% - var(--largura-menu)); }
	
/* DESTAQUE PRINCIPAL */
.tituloVitrine { width:calc(100% - (var(--padding-banner) * 2)); margin:0 var(--padding-banner) 0 var(--padding-banner) }
.tituloVitrineLogo > img { width: 100%; max-width: 300px; min-width: 200px }
.tituloVitrineTexto2 { font-size:45px; line-height:47px; text-align:center }
.tituloVitrineComentario { font-size:20px; text-align:center }
.tituloVitrineBotao { margin: 15px 0 0 0 }

.tituloVitrineLogo1 { margin: 0 0 20px calc((100% / 2) - ((120px + 60px) / 2)) }
.tituloVitrineLogo1 > img { width: 120px; margin: 30px }

}




@media only screen and (min-width: 481px) and (max-width: 620px){

:root {
  --largura-menu: 100%;
  --padding-banner: 10%;
}

header #topo_1 { width:calc(100% - 30px); height: 200px; float: left; padding:15px 15px 15px 15px;  }
header #topo_1 #topo_1_site { width:100%; height:auto }

header #topo_1 #topo_1_site #topo_1_logo { width:220px }
header #topo_1 #topo_1_site #topo_1_site_1_itens { width:calc(100% - 220px); }
header #topo_1 #topo_1_site { width:100%; height:auto; float:left }

header #principal_1_destaques { width:100%; }

header #principal_1_menu { width:calc(var(--largura-menu) - 60px); margin: 0 0 0 calc(100% - var(--largura-menu)); }
	
/* DESTAQUE PRINCIPAL */
.tituloVitrine { width:calc(100% - (var(--padding-banner) * 2)); margin:0 var(--padding-banner) 0 var(--padding-banner) }
.tituloVitrineLogo > img { width: 100%; max-width: 300px; min-width: 200px }
.tituloVitrineTexto2 { font-size:40px; line-height:42px; text-align:center }
.tituloVitrineComentario { font-size:20px; text-align:center }
.tituloVitrineBotao { margin: 15px 0 0 0 }

.tituloVitrineLogo1 { margin: 0 0 20px calc((100% / 2) - ((100px + 60px) / 2)) }
.tituloVitrineLogo1 > img { width: 100px; margin: 30px }

}





@media only screen and (min-width: 0px) and (max-width: 480px){

:root {
  --largura-menu: 100%;
  --padding-banner: 10%;
}

header #topo_1 { width:calc(100% - 30px); height: 200px; float: left; padding:15px 15px 15px 15px;  }
header #topo_1 #topo_1_site { width:100%; height:auto }

header #topo_1 #topo_1_site #topo_1_logo { width:220px }
header #topo_1 #topo_1_site #topo_1_site_1_itens { width:calc(100% - 220px); }
header #topo_1 #topo_1_site { width:100%; height:auto; float:left }

header #principal_1_destaques { width:100%; }

header #principal_1_menu { width:calc(var(--largura-menu) - 30px); padding:30px 15px 0 15px; margin: 0 0 0 calc(100% - var(--largura-menu)); }
	
/* DESTAQUE PRINCIPAL */
.tituloVitrine { width:calc(100% - (var(--padding-banner) * 2)); margin:0 var(--padding-banner) 0 var(--padding-banner) }
.tituloVitrineLogo > img { width: 100%; max-width: 300px; min-width: 200px }
.tituloVitrineTexto2 { font-size:35px; line-height:37px; text-align:center }
.tituloVitrineComentario { font-size:20px; line-height:21px; text-align:center }
.tituloVitrineBotao { margin: 15px 0 0 0 }

.tituloVitrineLogo1 { margin: 0 0 20px calc((100% / 2) - ((100px + 60px) / 2)) }
.tituloVitrineLogo1 > img { width: 100px; margin: 30px }

}