html, body {font-family: 'Raleway', sans-serif;margin:0;font-size:1.15em;overflow-x: hidden;}
body {position: relative;}
a, a:visited, a:hover, a:active {color:inherit;text-decoration: none;}
a:hover {text-decoration: underline;}

ul {padding-left: 0;list-style: none;}
nav, ul, .conteudo, .fundo-home, .fundo > div {width:1400px;margin:0 auto;}
.fundo > div { padding:4em 0;}
nav, ul, .conteudo, .fundo-home {text-align:center;}
nav, .conteudo {display: grid;}
nav, .conteudo, .fundo-home, .fundo > div {max-width:80%;}

.conteudo { text-align: left;}

nav {text-align: right;padding-bottom: 2em;}
ul li {display: block;}

nav {grid-template-columns: 1fr auto auto auto auto auto auto;align-items:center;color:#398376;}
nav a {text-align: left;font-size:0.85em;font-weight: 700;padding:0 1em;}
nav a.ativo {color:#51c4ce;text-decoration: underline;}
nav img {width: 410px;}
nav h1 {text-align: left;}

.icones {text-align: center;padding-bottom: 3em;}
.icones img, .icone {height:100px;}
.verde img, img.verde {filter: brightness(0) saturate(100%) invert(94%) sepia(16%) saturate(4988%) hue-rotate(151deg) brightness(89%) contrast(78%);}
.cinza img, img.cinza {filter: brightness(0) saturate(100%) invert(34%) sepia(42%) saturate(24%) hue-rotate(182deg) brightness(87%) contrast(87%);}
.branco img, img.branco {filter: brightness(0) saturate(100%) invert(99%) sepia(2%) saturate(823%) hue-rotate(234deg) brightness(115%) contrast(100%);}
.verdeescuro img, img.verdeescuro {filter: brightness(0) saturate(100%) invert(43%) sepia(51%) saturate(419%) hue-rotate(120deg) brightness(93%) contrast(87%);}

.branco a {color: #fff;}
.icones img.visivel, img.icone.visivel {animation: none;vertical-align: middle;}

#menu-mobile {position:absolute;right:30px;top:80px;width:40px;cursor:pointer;display: none;}
#menu-mobile span {display: block;height:7px;margin-bottom:5px;border-radius:5px;background-color: #398376;width:100%;}

.video-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
/*  padding:20px;
  border: solid 1px rgba(0,0,0,0.3);*/
}
.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

video {width:70%;margin:0 auto;display: block;  padding:20px;
  border: solid 1px rgba(0,0,0,0.3);}

path {fill: transparent;}
text  {font-size:3em;font-weight: 700;fill:#398376;}
.clientes text {fill:#51c4ce;}
.fundo-home {overflow:visible;text-align: left;position: relative;}
.fundo-home div {overflow:visible;width:100%;padding:5em 0;}
.fundo-home div::before {content: url('img/fundo-home.png');position:absolute;right:-10%;bottom: 15%;scale: 150%;z-index: -1;}


.fundo-home.clientes div, .fundo-home.profissionais div {padding:0 0 2em 0;}
.fundo-home.clientes div::before, .fundo-home.profissionais div::before {content:"";}


.fundo-home.clientes div, .fundo-home.profissionais div {background:none;/*background-image: url('img/dente-clientes.png');background-position-x: 100%;padding:2em 0;*/}
.fundo-home.clientes div h3, .fundo-home.profissionais div h3 {padding-top:1em;padding:1em 0;margin:0;text-align: center;}

.fundo-home.clientes svg {width: 25%;}
.fundo-home.clientes text {font-size: 5em;}

.fundo-home.profissionais svg {width: 33%;}
.fundo-home.profissionais text {font-size: 3em;}


.fundo-home img {max-width: none;margin-left:-13em;margin-top: -7em;}
.fundo-home img.icone {margin:0;}
.fundo-home svg {margin:0;width:60%;height: 100px;overflow: visible;}
.fundo-home button, .fundo-home a.whats {margin:3em auto 3em 15%;}
.fundo.sobreposto {margin-top:-2.2em;}

.tripla, .dupla, .mono {display: grid;max-width: 80%;width:1400px;margin-left:auto;margin-right:auto;}
.dupla {grid-template-columns: auto 472px;column-gap: 2em;}
.dupla.inversa {grid-template-columns: 472px auto;}
.tripla {grid-template-columns: 1fr 1fr 1fr;column-gap: 2em;padding-bottom: 2em;}
header.dupla {text-align: center;grid-template-columns: 0.8fr 1.2fr;}
.mono {grid-template-columns: 1fr;}

.fundo-home img.estrelas {width:200px;margin:0;}

.tripla p {font-size: 1.2em;line-height: 1.4em;padding:0;}
header > section > img {margin:3em auto 2em;padding-right:1em;display: block;}
header section div, .fundo section div { display: inline-block;padding:1em;}
header button, header a.whats {margin:2em auto;}

@keyframes opacidade { 
    0% {
      opacity: 0.5;
    }
  
    100% {
      opacity: 1;
    }
  }


.cover {position: relative;overflow: visible;}
.cover img {height:500px;object-fit: cover;position:relative;z-index:2;}
.cover::before {content:"";border:solid 1px rgba(0,0,0,0.3);position: absolute; left:-20px;top:40px;width:90%;height:480px;z-index:1; }
.cover.right {margin-bottom:40px;}

.cover .foto {margin:0;}

img.fade {opacity:0;}  
img.visivel {opacity:1;animation: opacidade 4s;transition-timing-function: ease;}
img.img-fundo {position:relative;z-index: -1;}

img.circulo {border-radius: 50%;border:solid 9px #398376;margin:0;width:280px;}

.right { float:right;max-width:50%;margin-left:40px;}
.center {margin-right: auto;margin-left: auto;display: block;text-align: center;}

.fundo {background: url('img/fundo.png') #51c4ce;position:relative;margin-top:-1em;}
.fundo::before {content:"";position:absolute;top:-27px;width:100%;height:27px;background: url('img/fundo-curva.png');}

.fundo.escuro {background: url('img/fundo-escuro.png');}
.fundo.escuro::before {background: url('img/fundo-curva-escuro.png');}

.fundo.claro { margin-top:0;background: #e6e6e8;}

.fundo > p, .fundo > h5 {margin:0 0;padding:1em 1em 1.5em;text-align: center;margin-left:auto;margin-right:auto;}
.fundo > h5 {padding-bottom: 1em;font-weight: 400;}
.fundo > h5.extrapadding {padding-bottom: 2em;}
header.dupla, .fundo.claro {padding-bottom:3em;}

.fundo.claro::before {content: none;background: #e6e6e8;}

p {font-size: 1.2em;}
button, a.whats {font-size:1.4em;display: block;}
a.whats {width:fit-content;}

h1, h2, h4 { color: #398376;}
h2, p {color:#58595b;font-weight:400;}
h3 {color:#51c4ce;margin-top:0;}
h4{ text-transform: uppercase;margin-bottom: 0;}
h6 { font-size: 1em;}
.fundo h1, .fundo h2, .fundo h3, .fundo h4, .fundo p, footer, .fundo h5 {color:#fff;}
.fundo.claro h3, .fundo.claro h5 {color:#398376;}
.fundo.claro p {color:#58595b;}

.fundo button, .fundo a.whats {background-color: #58595b;color:#fff;}
.fundo.claro button, .fundo.claro a.whats {background-color: #51c4ce;color:#58595b}

/*section h2, section h3, section h4, section p {text-align: center;}*/

.fundo .dente {display: inline;vertical-align: middle;vertical-align: -webkit-baseline-middle;padding:0 1em 1em 0;}
.dente + h3 {display: inline;}

img {max-width: 100%;}
button, a.whats {border:0;border-radius:15px;font-size: 1.2em;font-weight: 700; padding:0.5em 0.8em;font-family:inherit;display: block;cursor:pointer;}
button.whats, a.whats {padding-left:90px;background-image: url('img/whatsapp-button.png');background-repeat: no-repeat;background-position: 25px center;}
/*.whats {position: relative;width:7em;display:block;margin:1.6em 0 1.3em 64px;font-size:2.3em;padding:0.15em 0.5em;font-weight: 700;border-top-right-radius: 0.5em;border-bottom-right-radius: 0.5em;border: solid 0.166em #000;border-left:0;padding-left:0.66em;}
.whats::before {content: url('img/whatsapp-button.png');scale:50%;position:absolute;left:-128px;top:-63px;}*/

section > h3, section > h4 {text-align: center;}
section > h3 {font-size:2.5em;}
h3 {font-size:4em;}
h5 {font-size: 2.5em;}
li h5 {font-size:1.8em;color:#398376;}
p {line-height: 2em;}

h4 {font-size:0.56em;letter-spacing: 0.8em;}
button, h2 span, a.whats {background-color: #398376;color:#fff;}

.lista-img {max-width:60%;margin: 0 auto;text-align: center;}

footer {background-color: #58595b;}
footer section, footer section div, footer section p {max-width:80%;width:1400px;margin:0 auto;}
footer section p {padding:1em 0;font-size:1.8em;text-align:center;}
footer section div {padding:3em 0;}
footer img {float:left;margin:0 1.75em 0 0;}
footer .sociais {float:right;width:50%;}
footer section.fundo {width:100%;max-width: 100%;}
.extras li {padding-bottom: 200px;}

#topo {display: none;}
.flutuante {max-width:15%;width:100px;position:fixed;bottom:2em;right:2em;display: block;z-index:10;}
.flutuante.esquerda {right:auto;left:2em;font-size: 0.8em;text-align: center;}

.legenda {font-size:13px;}

footer .fundo > p {padding:0.3em;}
footer .fundo > p.frase {font-size: 1em;padding-bottom:3em;}

.sociais {text-align: right;}
.sociais a {display: inline-block;}

address {font-size:1.1em;font-weight: 700;font-style:normal;padding-bottom:2em;}


@media only screen and (max-width: 1700px) { body, html {font-size:1.1em;} }
@media only screen and (max-width: 1500px) { body, html {font-size:1.075em;} img.circulo {width:250px;}}
@media only screen and (max-width: 1450px) {
  body, html {font-size:1.05em;}
  .fundo-home div::before {bottom: 10%;scale: 120%;}
}
@media only screen and (max-width: 1350px) { body, html {font-size:1.025em;} }
@media only screen and (max-width: 1300px) {
  body, html {font-size:1em;}
  nav, .conteudo, .fundo-home, .tripla, .dupla, .mono {max-width: 90%;}
  .fundo-home.clientes svg {width: 40%;}
  .fundo-home.profissionais svg {width: 50%;}

  img.circulo {width:225px;}

}
@media only screen and (max-width: 1250px) {
  body, html {font-size:0.975em;}
  .fundo-home div::before {bottom: 0%;scale: 100%;}
} 
@media only screen and (max-width: 1200px) {
  body, html {font-size:0.95em;}
  img.circulo {width:200px;}
}
@media only screen and (max-width: 1100px) {
  body, html {font-size:0.9em;}
}

@media only screen and (max-width: 1025px) {
    nav, .conteudo, .fundo-home, .tripla, .dupla, .mono {max-width: 96%;}

    body, html {font-size:0.9em;}
    ul.itens, footer section, .conteudo, .tripla, header.dupla, .dupla.inversa, .dupla { grid-template-columns: 1fr;}

    nav {padding-bottom: 0;margin-bottom:4em;}

    img.circulo {width:280px;}

    .fundo-home > div {padding:0;}
    .fundo-home.clientes svg {width: 60%;}
    .fundo-home.profissionais svg {width: 75%;}

    iframe {height:75%;}
  
/*    .conteudo .fundo::after {content:"";background-color: #0076f5;position:absolute;right:-100%;width:100%;top:0;height:100%;}*/

    p {font-size: 1.5em;}

    .cover {margin:3em 0;}
    header img {max-width:100%;}
    /*header button {font-size: 2em;}*/
    header img, header button, header a.whats {margin:2em auto;}
    .sociais {text-align: center;}

    text {font-size: 5em;}
    button, a.whats {font-size: 2.2em;}

    video {width: 90%;}

    .right { float:none;max-width:100%;margin:0;}

    .fundo-home div {overflow:hidden;background-position: center 100%;text-align: center;padding-bottom: 50%;}
    .fundo-home div svg {width: 75%;}
    .fundo-home button, .fundo-home a.whats {margin-left:auto;}

    .fundo-home.clientes div {text-align: left;text-indent: 20px;}

    .fundo-home div::before {bottom: 0%;left:-5em;scale: 100%;}

    .fundo > div { grid-template-columns: 1fr;}
    .foto {margin: 4em auto;}

/*    .cover img {height:300px;}
    .cover::before {height: 300px;}*/

    footer .sociais {width: 100%;}

}
@media only screen and (max-width: 900px) {
    .conteudo > div > img {width: 90%;}
    .fundo-home div::before {bottom:-3%;scale: 85%;left:-6em;}

}

@media only screen and (max-width: 800px) {
    body, html {font-size:1.15em;}

    #menu-mobile {display: block;}

    nav {grid-template-columns: 1fr;font-size: 1em;}
    nav a {display: none;border-bottom: solid 1px #398376;}
    nav a:first-of-type {border-top: solid 1px #398376;}
    nav h1, nav a, nav p {text-align: center;padding:1em 0;}
    nav img {width: 300px;max-width: 80%;}
    footer img {width:3em;}
    footer section {width:80%;}
    .fundo-home div {padding-bottom: 50%;}
    footer .sociais {float: none;}
    h3 {font-size:3em;}

    p {font-size: 1em;}
    h5 {font-size: 1.5em;}
    .fundo > h5 {padding-bottom: 3em;}

    text {font-size: 3em;}
    button, a.whats {font-size: 1.5em;}
    
    header section div, .fundo section div {padding:1em 2em/* 0*/;}
    nav, .conteudo, .fundo-home, .tripla, .dupla, .mono {max-width: 100%;}


}
@media only screen and (max-width: 700px) {
     .fundo-home div {padding-bottom: 85%;}
     .fundo-home div {padding-bottom: 60%;}
  
     .fundo-home div::before {left:-6.5em;}

}
@media only screen and (max-width: 600px) {
  .fundo-home div {padding-bottom: 100%;}
  address {font-size: 0.9em;}
  h5 {font-size: 1.3em;}
  h3 {font-size:2em;}
  .lista-img, .fundo > div { max-width: 82%;}
  .fundo-home div {padding-bottom: 70%;}

  .fundo-home div::before {left:-7em;}

}
@media only screen and (max-width: 500px) {
  nav h1 {text-align: left;text-indent: 20px;}
  h2, section > h3 {font-size: 2em;}
  header button, header a.whats {font-size:1em;}
  .fundo-home div {padding-bottom: 100%;}
  .fundo-home.clientes svg {width: 65%;}
  .fundo-home.profissionais svg {width: 75%;}

  .lista-img, .fundo > div { max-width: 83%;}

  img.circulo {width:200px;}

  address {font-size: 0.8em;}

  .fundo-home div::before {left:-7.5em;}

}
@media only screen and (max-width: 400px) {
    body, html {font-size:1em;}
    ul.itens img, ul.itens.maior img {height: 150px;}
    text {font-size: 4em;}

    footer section {width:90%;}
    .lista-img, .fundo > div { max-width: 90%;}
    .fundo-home div::before {left:-11em;scale:60%;bottom:-11%;}


}
@media only screen and (max-width: 300px) {
  body, html {font-size:0.9em;}
  footer section {width:100%;}
  .lista-img,  .fundo > div { max-width: 100%;}
  .lista-img, .fundo > div { max-width: 100%;}

  img.circulo {width:180px;}


}