<meta charset="UTF-8">
/* CSS Document */

<style>


/* STYLES CSS 0.1 */ 
html, body {margin: 0; padding: 0; width: 100%; background-color: #ffffff;}

.logo {width: 1200px; margin: 0 auto;}

.container {width: 100%; margin: 0 auto;}
.inner-container {width: 95%; max-width: 1280px; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap:wrap; }
.column { width: calc(33.33% - 40px); margin-bottom: 60px; }

.inner-container-banner { width: 1080px; max-width: 98%; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap:wrap;}

.inner-container-head { width: 980px; max-width: 980px; margin: 0 auto; padding: 0px;}

.container-cont {width:35%; max-width: 400px; margin: 0 auto; text-align:center; display: flex;  justify-content: space-between; }
.column-cont {width:90px; max-width:90px;}

.container-dep {max-width: 980px; margin: 0 auto; text-align:center;  display: flex; justify-content: space-between; flex-wrap: wrap;}
.column-dep { width: calc(33.33% - 30px); margin-bottom: 55px;}

.inner-container-benef {width: 720px; margin: 0 auto; text-align:center; display: flex; flex-wrap: wrap; justify-content: space-between;}
.column-benef {width:330px; margin-top:30px; margin-bottom: 30px;}

.inner-container-tit {width:75%; margin: 0 auto; text-align:center;}

.container-faq {width: 70%; margin: 0 auto;}
.inner-container-faq {width:90%; margin: 0 auto; }

.inner-container-quad {width: 620px; margin: 0 auto; text-align:center; display: flex; flex-wrap: wrap; justify-content: space-between;}
.column-quad {width:calc(50% - 30px); margin-top:30px; margin-bottom: 30px;}

.inner-container-andre {width: 980px; margin: 0 auto; text-align:center; display: flex; flex-wrap: wrap; justify-content: space-between;}
.column-andre {width:calc(50% - 20px);  margin-top:30px; margin-bottom: 30px;}

img {outline:none; text-decoration:none; border:none; -ms-interpolation-mode: bicubic;}
.img-logo {text-align: left;} .img-logo img {width: 240px; height: 88px; max-width: 52%; height:auto;}
.img-banner {text-align: center;} .img-banner img {width: 1080px; height: 473px; max-width:100%; height:auto;}
.img-dados {text-align: center;} .img-dados img {width: 350px; height: 106px; max-width:85%; height:auto;}
.img-estudio {text-align: center;} .img-estudio img {width: 500px; height: 282px; max-width:94%; height:auto;}
.img-disponivel-esgotado {text-align: center;} .img-disponivel-esgotado img {width: 150px; height: 25px; max-width: 50%; height:auto;}
.img-20anos {text-align: center;} .img-20anos img {width: 200px; height: 113px; max-width:42%; height:auto; }
.img-contato {text-align: center;} .img-contato img {width: 90px; height: 90px; max-width:98%; height:auto; }
.img-aspas {text-align: left;} .img-aspas img {width: 85px; height: 85px; max-width:25%; height:auto;}
.img-prova-imagens {text-align: center;} .img-prova-imagens img {width: 300px; height: 150px; max-width:100%; height:auto;}
.img-quadrada {text-align: center;} .img-quadrada img {width: 240px; height: 240px; max-width:100%; height:auto;}
.img-andretoffani {text-align: center;} .img-andretoffani img {width:380px;; height: 380px; max-width:90%; height:auto;}
.img-redes {text-align: center;} .img-redes img {width: 45px; height: 45px; max-width:80%; height:auto; }

p {margin: 0px 0px !important; font-size: 20px; line-height:25px; text-align:center; padding-left:15px; padding-right:15px; padding-top:10px; padding-bottom:15px;}

a {color: #000; text-decoration: none!important; margin: 0; } a img {border: none;} a strong {font-weight: 700; }

h1 {margin: 0px 0px !important; font-size: 25px; line-height:30px; color:#666666; font-weight: 400; text-align:center; padding-top:30px;}
h1 strong {font-weight: 700; font-size:25px; color:#000; }

h2 {margin: 0px 0px !important;  font-size: 19px; line-height: 26px; font-weight:400; color: #000; text-align:center; padding-left:15px; padding-right:15px;}
h2 strong {font-weight: 700; font-size: 20px;}

h3 {margin: 0px 0px !important; font-size: 16px; line-height:21px; font-weight:400; color: #ffffff; text-align:center; padding-top:10px; padding-left:6px; padding-right:6px;}
h3 strong {font-weight: 700; font-size: 16px;}

h4 {margin: 0px 0px !important;  font-size: 19px; line-height: 24px; color:#ABABAB; font-weight: 400;}
h4 strong {font-weight: 700; font-size: 19px;}

h6 {margin: 0px 0px !important; font-size:15.5px; font-weight:400; color: #000; text-align:center; line-height:24px;}
h6 strong {font-weight: 700; font-size: 17px;}


/* SLIDES */ 
.slider {  position: relative;  width: 100%;  overflow: hidden;  border-radius: 2px;}
.slide {  position: absolute;  inset: 0;  opacity: 0;  transition: opacity 0.8s ease-in-out;}
.slide.active {  opacity: 1;  position: relative;}
.slide::before {  content: "";  display: block;  padding-top: calc(400 / 1024 * 100%); }
.slide img {  position: absolute;  inset: 0;  width: 100%;  height: 100%;  object-fit: cover; object-position: center;  display: block;}

@media (min-width: 768px) {
  .slide img {    width: 80%;    left: 50%;    transform: translateX(-50%); }
}

.slider-nav {  position: absolute;  bottom: 15px;  left: 50%;  transform: translateX(-50%);  display: flex;  gap: 10px;  z-index: 10;}
.slider-nav .dot {width: 12px; height: 12px; background: rgba(255,255,255,.5); border-radius: 50%; cursor: pointer; transition: transform .0.5s, background .2s;}
.slider-nav .dot.active {  background: #fff;  transform: scale(1.2);}


/* MAP */ 
.local-map { max-width: 800px; margin: 60px auto 0; padding: 0 20px; font-size: 0.95rem; color: #333;}
.local-map h1 { font-size: 25px; line-height:30px; color:#666666; font-weight: 400; text-align:center; max-width:100%; padding-top: 7px;}
.local-map h1 strong {font-weight: 700; color:#666666; }
.local-map h2 { font-size: 25px; line-height:30px; color:#666666; max-width:100%; padding-top: 3px; padding-bottom: 20px;}
.local-map h2 strong { font-size: 25px; font-weight: 700;}
.local-map p { font-size: 15px; line-height:21px; color:#666666; max-width:100%; padding-top: 10px; padding-bottom: 10px;}
.map-container {margin: o auto;   position: relative; width: 100%; height: 280px; border-radius: 6px; overflow: hidden;}
.map-container iframe { width: 100%; height: 100%; border: 0;}







/*IPAD STYLES CSS 0.2*/
body, html {overflow-x: hidden;}
@media (min-width: 768px) and (max-width: 1080px) {

.container {width: 100%; margin: 0 auto; }
.inner-container { width: 100%; max-width: 640px; margin: 0 auto; display: flex;  justify-content: space-between; flex-wrap: wrap;}
.column { width: 100%; max-width:640px; margin-bottom: 60px;}

.logo { width: 800px; margin: 0 auto;}

.inner-container-banner { width: 1080px; max-width: 88%; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap:wrap;}

.inner-container-head { width: 80%; max-width: 640px; margin: 0 auto;}

.container-cont {width:55%; max-width: 400px; margin: 0 auto; text-align:center; display: flex;  justify-content: space-between; padding-top:30px; }
.column-cont {width:90px; max-width:90px;}

.container-dep {max-width: 580px; margin: 0 auto; display: flex;  justify-content: space-between; flex-wrap: wrap;}
.column-dep { width: 100%; margin-bottom:40px;}

.inner-container-benef {max-width: 600px; margin: 0 auto; text-align:center; display: flex; flex-wrap: wrap; justify-content: space-between;}
.column-benef {width:100%; margin-top:20px; margin-bottom: 20px;}

.inner-container-tit {width:100%; margin: 0 auto; text-align:center;}

.container-faq {width: 80%; max-width:640px; margin: 0 auto;}
.inner-container-faq {width:90%; margin: 0 auto; }

.inner-container-quad {max-width: 600px; margin: 0 auto; text-align:center; display: flex; flex-wrap: wrap; justify-content: space-between;}
.column-quad {width:100%; margin-top:20px; margin-bottom: 20px;}

.inner-container-andre {width: 640px; margin: 0 auto; text-align:center; display: flex; flex-wrap: wrap; justify-content: space-between;}
.column-andre {width:100%;  margin-top:20px; margin-bottom: 20px;}

h6 {font-size: 14px;}

}

/*IPHONE STYLES CSS 0.3*/
@media  (max-width: 767px) {
body, html {overflow-x: hidden !important; }

.logo { width: 88%; margin: 0 auto; }

.container {width: 100%;  margin: 0 auto;}
.inner-container { width: 94%; max-width: 640px; margin: 0 auto; padding: 0px; display: flex; flex-wrap: wrap; justify-content: space-between;}
.column { width: 100%!important; text-align:center!important; }

.inner-container-head { width: 90%; max-width: 640px; margin: 0 auto;}

.container-cont {width:85%; max-width: 380px; margin: 0 auto; text-align:center; display: flex;  justify-content: space-between; padding-top:30px; }
.column-cont {width:90px; max-width:90px;}

.container-dep {width: 80%; max-width: 580px; margin: 0 auto; display: flex;  justify-content: space-between; flex-wrap: wrap;}
.column-dep { width: 100%; margin-bottom:40px;}

.inner-container-benef {width: 85%; max-width: 380px; margin: 0 auto; text-align:center; display: flex; flex-wrap: wrap; justify-content: space-between;}
.column-benef {width:100%; margin-top:20px; margin-bottom: 20px;}

.container-tit {width: 100%;}
.inner-container-tit {width:90%; max-width:580px; margin: 0 auto; text-align:center;}

.container-faq {width: 92%; max-width:420px; margin: 0 auto;}
.inner-container-faq {width:84%; margin: 0 auto; }

.inner-container-quad {width: 85%; max-width: 380px; margin: 0 auto; text-align:center; display: flex; flex-wrap: wrap; justify-content: space-between;}
.column-quad {width:100%; margin-top:20px; margin-bottom: 20px;}

.inner-container-andre {width: 95%; margin: 0 auto; text-align:center; display: flex; flex-wrap: wrap; justify-content: space-between;}
.column-andre {width:100%;  margin-top:20px; margin-bottom: 20px;}

a:link, a:visited, a:hover, a:active {text-decoration: none;}

h1 {font-size: 25px; line-height:32px; padding-top:20px;} 
h1 strong {font-size:25.5px;}

h2 {font-size: 18px; line-height: 25px; padding-bottom:15px; } 
h2 strong {font-size: 19px; font-weight: 700;}

h3 {font-size: 15px; padding:8px;} 
h3 strong {font-size: 16px;}

h4 {font-size: 17px; line-height: 22px;}
h4 strong {font-size: 17px;}


h6 {font-size: 16px; line-height: 25px; padding-bottom:25px; padding-left:8px; padding-right: 8px;} 
h6 strong {font-size: 16px;}


/* SLIDES */ 
.slide::before {  content: "";  display: block;  padding-top: calc(5 / 4 * 100%); }


}





</style>
