@font-face {
  font-family: "regular";
  src: url('../type/regular.woff2') format('woff2'), 
  url('../type/regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "bold";
  src: url('../type/bold.woff2') format('woff2'), 
  url('../type/bold.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "display";
  src: url('../type/display.woff2') format('woff2'), 
  url('../type/display.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}


img[data-sizes="auto"] { display: block; min-width: auto; }

.lazyload,
.lazyloading {
  opacity: 0;
}

.lazyloaded {
  opacity: 1;
  transition: opacity 200ms;
}

video.lazyload,
video.lazyloading {
  opacity: 1; 
}

video.lazyloaded {
  transition: opacity 200ms;
}

::-moz-selection { color: #EDECE7; background: #363636; }
::selection { color: #EDECE7; background: #363636; }

*,
*:before,
*:after { box-sizing: inherit; }

body { margin:0; padding: 0; background: #EDECE7; color: #363636; }
html { -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%; -webkit-tap-highlight-color:transparent; box-sizing: border-box; }

body, html { 
  -webkit-font-smoothing: antialiased; 
  -moz-osx-font-smoothing: grayscale;
  font-family: "regular", "Helvetica Neue", Helvetica, sans-serif;
  overflow-x: hidden;
}

a { transition: all 0.2s ease-in-out; }
 
h1, h2, h3, h4, h5, p { padding: 0; margin: 0; font-weight: 400; font-size: normal; }
h1, h2, h3, h4 { font-family: "display", "Helvetica Neue", Helvetica, sans-serif; }
b, strong { font-family: "bold", "Helvetica Neue", Helvetica, sans-serif; }

p { color: #363636; font-size: 17px; line-height: 27px; }
p.mini { font-size: 14px; line-height: 22px; }

h1 { font-size: 80px; line-height: 80px; color: #fff; letter-spacing: -1.5px; }
h2 { font-size: 60px; line-height: 60px; color: #323232; letter-spacing: -1.5px;  }
h3 { font-size: 42px; line-height: 45px; color: #323232; letter-spacing: -1.5px; }
h4 { font-size: 32px; line-height: 36px; color: #323232; letter-spacing: -1px; }

.pushable {
  background: #323232;
  border: none;
  border-radius: 30px;
  padding: 0;
  cursor: pointer;
}
.front {
  display: block;
  padding: 22px 50px 20px;
  border-radius: 30px;
  background: #fff;
  color: #323232;
  transform: translateY(-4px);
  font-family: "bold", "Helvetica Neue", Helvetica, sans-serif;
  text-transform: uppercase;
  font-size: 13px;
  border: 2px solid #323232;
}

.front.mini {
  font-size: 12px;
  padding: 12px 28px 11px;
}

.pushable:active .front { transform: translateY(-2px); }
.pushable:focus:not(:focus-visible) { outline: none; }
.front { transition: transform 600ms cubic-bezier(.3, .7, .4, 1); }
.pushable:hover .front { transform: translateY(-6px); transition: transform 250ms cubic-bezier(.3, .7, .4, 1.5); }
.pushable:active .front { transform: translateY(-2px); transition: transform 34ms; }

#intro {
  text-align: center;
  height: 50vh;
  background: gray;
  display: flex;
  justify-content: center; /* horizontal centering */
  align-items: center;     /* vertical centering */
  text-align: center;
  margin-top: 67px;
}

#intro h1 {
/*   padding: 100px 0; */
}

.assinatura-img {
  width: 90px !important;
  padding: 5px 0 22px;
  margin: 0 !important;
}

@media only screen and (max-width: 992px) {
  .assinatura-img {
    margin: 0 auto !important; /* or unset or auto, depending on what you want */
    padding: 0 0 22px !important;
  }
}

#sinopse {
  background: #E0E0DA;
  padding: 110px 0;
}

#sinopse p {
  padding: 22px 0 0;
}

#sinopse img {
  width: 90%;
  margin: 0 auto;
}

#personagens {
  padding: 120px 0 100px;
}

#personagens h2 {
  text-align: center;
  padding-bottom: 60px;
}

#personagens h4 {
  padding: 22px 0 15px;
}

#personagens .flickity-slider {
  position: relative
}

#personagens .carousel-cell {
width: 32.9%;
margin-right: 10px;
}

#personagens  .carousel-cell img {
max-width: 100%;
border-radius: 12px;
}

/* #personagens .flickity-prev-next-button {
background: #333;
color: white;
width: 40px;
height: 40px;
top: 40%;
transform: translateY(-50%);
}

#personagens .flickity-prev-next-button.previous { left: -50px; }
#personagens .flickity-prev-next-button.next { right: -50px; } */


.custom-prev,
.custom-next {
  position: absolute;
  top: 28%;
  transform: translateY(-50%);
  cursor: pointer;
  z-index: 10;
}

.custom-prev .front.mini,
.custom-next .front.mini {
  padding: 12px 15px 10px;
  font-size: 20px;
}


.custom-prev {
  left: -18px;
}

.custom-next {
  right: -18px;
}

#historia {
  padding: 95px 0 90px;
  background: #E0E0DA;
}


.historia-carousel {
/*   height: 400px; */
width: 90%;
margin: 0 auto;
}

.historia-cell {
/*   width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0; */
  transition: opacity 1s ease-in-out;
 
}


.historia-cell.is-selected {
  opacity: 1;
  z-index: 2;
}

.flickity-button,
.flickity-page-dots {
  display: none !important;
}


/* flickity-fade */

.flickity-enabled.is-fade .flickity-slider > * {
  pointer-events: none;
  z-index: 0;
}

.flickity-enabled.is-fade .flickity-slider > .is-selected {
  pointer-events: auto;
  z-index: 1;
}

/* #historia img {
  width: 90%;
  margin: 0 auto;
} */

#historia h3 {
  padding-bottom: 30px;
}

#downloads {
  padding: 120px 0;
}

#downloads h2 {
  text-align: center;
  padding-bottom: 70px;
}

.flexy {
  display: flex;
  align-items: center;
}

.box {
   background: #DED4C3;
   padding: 20px;
   border-radius: 12px;
   height: 350px;
   position: relative; /* Needed for absolute positioning inside */
   
}

.box.highlight {
  background: #B05A12;
  background-image: url("../img/mateus_transparencia.png");
  background-size: 70%;
  background-repeat: no-repeat;
  background-position: bottom right;
}

.box.highlight h4,
.box.highlight p {
  color: #fff
}

.box h4 {
  padding: 10px 0 20px;
  text-align: center;
}

.box .centered {
  text-align: center;
  position: absolute;
  bottom: 35px;
  left: 50%;
  transform: translateX(-50%);
  
}

#autores {
  padding: 120px 0;
  background: #E0E0DA;
}

#autores h2 {
  padding-bottom: 70px;
}

#autores img {
  border-radius: 20px;
}

#autores h2 {
  text-align: center;
}

#autores h4 {
  padding: 20px 0 15px;
}

#autores button {
  margin-top: 40px;
}

#faq {
  padding: 120px 0 95px;
}

#faq h2 {
  padding-bottom: 40px;
  text-align: center;
}

#contactos {
  text-align: center;
  background: #E0E0DA;
  padding-top: 120px;
}

#contactos p {
  padding: 30px 0;
  width: 90%;
  margin: 0 auto;
}

#contactos a {
  color: #636363;
}

#documentos {
  padding: 100px 0;
}

section#documentos a {
  text-decoration: underline;
  color: #363636;
}

#recursos {
  padding: 120px 0 80px;
  text-align: center;
  background: #E0E0DA
}

#recursos h2 {
  padding-bottom: 70px;
}

#recursos .recurso {
  padding: 22px 15px 24px;
  background: #EDECE7;
  border-radius: 12px;
  margin-bottom: 40px;
}

#recursos .recurso p {
  padding-top: 12px;
}

#recursos button {
  margin-top: 30px
}

#ebook {
  background: #EDECE7;
  border-radius: 12px;
  padding: 80px 120px 50px;
  margin-top: 100px;
}

#ebook input[type="text"],
#ebook input[type="email"] {
  width: 70%;
  padding: 10px 18px;
  margin-bottom: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
/*   text-transform: uppercase; */
  color: #A0A0A0;
  transition: all 0.3s ease;
  font-family: "regular", "Helvetica Neue", Helvetica, sans-serif;
  font-size: 16px;
  line-height: 26px;
}

#ebook input::placeholder {
  color: #A0A0A0;
}

#ebook input:focus {
  text-transform: none;
  color: #363636;
}

#ebook label {
  display: block;
  margin-bottom: 10px;
}

#ebook .checkbox {
  margin-bottom: 30px;
}


#ebook .error {
  color: red;
  font-size: 14px; line-height: 22px;
  font-family: "bold", "Helvetica Neue", Helvetica, sans-serif;
  letter-spacing: -0.2px;
  margin-top: 20px;
}

#ebook .success {
  color: green;
  font-size: 14px; line-height: 22px;
  font-family: "bold", "Helvetica Neue", Helvetica, sans-serif;
  letter-spacing: -0.2px;
  margin-top: 20px;
}

p.micro {
  font-size: 13px;
  line-height: 20px;
  text-align: center;
  padding: 0 0 10px !important;
}

.logo img {
  width: 238px;
  margin: 0 auto;
  padding: 60px 0;
}

.accordion {
  margin: 40px auto;
  font-family: sans-serif;
}

.accordion-item:hover {
  cursor: pointer;
}

.accordion-item {
  padding: 22px 0;
  border-top: 2px solid #323232;
  border-bottom: 2px solid #323232;
  margin-top: -2px;
  cursor: pointer;
}

.accordion-item h4 {
  margin: 0;
  padding-right: 60px;
}

.accordion-item .mini {
  display: none;
  padding-top: 10px;
  margin: 0;
  transition: height 0.3s ease, padding-top 0.3s ease;
}

.accordion-item.active .mini {
  display: block;
}

.accordion-item {
  position: relative;
  transition: all 0.3s ease;
}

.accordion-item .pushable {
  position: absolute;
  top: 24px;
  right: 10px;
  cursor: pointer;
  z-index: 2;
}

.accordion-item .pushable.open .front {
  transform: rotate(45deg); 
}

.accordion-item .pushable .front {
  display: inline-block;
  font-size: 16px;
  transition: transform 0.3s ease;
  padding: 7px 10px 5px;
  border-radius: 30px;
  background: #fff;
  color: #323232;
  transform: translateY(-4px);
  font-family: "bold", "Helvetica Neue", Helvetica, sans-serif;
  text-transform: uppercase;
  border: 2px solid #323232;
}

.accordion-item .pushable:active .front { transform: translateY(-2px); }
.accordion-item .pushable:focus:not(:focus-visible) { outline: none; }
.accordion-item .front { transition: transform 600ms cubic-bezier(.3, .7, .4, 1); }
.accordion-item .pushable:hover .front { transform: translateY(-6px); transition: transform 250ms cubic-bezier(.3, .7, .4, 1.5); }
.accordion-item .pushable:active .front { transform: translateY(-2px); transition: transform 34ms; }
