﻿@import "https://use.typekit.net/dcw5ikn.css";
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
* {
  font-family: bitter, serif;
  font-weight: 400;
  font-style: normal;
}
strong {
  font-weight: 700;
}
strong em,
em {
  font-style: italic;
}
h1 {
  font-size: clamp(1.4em, 1.4em + 1vw, 1em);
  font-weight: 700;
  line-height: 150%;
  margin: 4% 0;
}
h2 {
  font-size: clamp(1em, 1em + 1vw, 0.8em);
  font-weight: 700;
  line-height: 120%;
}
p {
  font-size: clamp(0.8em, 0.8em + 1vw, 1.2em);
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.slide-items-details-text-intro ul,
.slide-items-details-text-intro ol {
  font-size: clamp(0.8em, 0.8em + 1vw, 0.6em);
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  margin: 0 auto;
  max-width: 80%;
  text-align: left;
}
body {
  background: #1b1d20;
}
h2 {
  margin: 6% 0 4%;
}
p {
  margin: 3% 0;
}
img {
  max-width: 100%;
  display: block;
}
hr {
  margin: 4% 0;
  height: 1px;
  border-width: 0;
  color: white;
  background-color: white;
}
.slide {
  max-width: 23.75rem;
  display: grid;
  box-shadow: 0 4px 20px 2px #00000080;
  position: relative;
}
@media (min-width: 770px) {
  .slide {
    margin: 1.25rem auto;
  }
}
.slide_nav {
  position: absolute;
  bottom: 0;
  width: 100%;
}
.slide_nav ul {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 6%;
}
.slide_nav ul li img {
  width: 1.5rem;
}
.slide_nav ul li:nth-child(2) img {
  width: 8rem;
}
.slide-items {
  position: relative;
  grid-area: 1/1;
  border-radius: 0.3125rem;
  overflow: hidden;
}
.slide-items-details {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.slide-items-details-text-intro,
.slide-items-details-text-content {
  max-width: 88%;
  width: 88%;
  height: 70%;
  position: absolute;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
.slide-items-details:nth-child(1) > .slide-items-details-text-intro {
  bottom: auto;
}
.slide-items-details-text-intro {
  background: radial-gradient(circle, #ffffff0d, #ffffff40);
  padding: 4%;
  border-radius: 1rem;
  border: 1px solid #ffffff;
  text-align: center;
}
.slide-items-details-text-intro img {
  border-radius: 0.8rem;
  width: 100%;
  height: auto;
}
.slide-items-details-text-intro div {
  width: 100%;
}
.slide-items-details-text-content {
  background: #3d0603;
  bottom: 10%;
  padding: 0 3%;
  left: 10%;
  margin-right: 10%;
}
.slide-nav {
  grid-area: 1/1;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto 1fr;
}
.slide-nav button {
  -webkit-appearance: none;
  -webkit-tap-highlight-color: #000000;
  opacity: 0;
}
.slide-items > * {
  position: absolute;
  top: 0;
  opacity: 0;
  pointer-events: none;
}
.slide-items > .active {
  position: relative;
  opacity: 1;
  pointer-events: initial;
}
.slide-thumb {
  display: flex;
  grid-column: 1/3;
}
.slide-thumb > span {
  flex: 1;
  display: block;
  height: 0.25rem;
  background: #00000080;
  margin: 0.3125rem;
  border-radius: 0.25rem;
  overflow: hidden;
}
.slide-thumb > span.active > span.test {
  display: block;
  height: inherit;
  background: #ffffffe6;
  border-radius: 0.25rem;
  transform: translate(-100%);
  animation: thumb 20s forwards linear;
}
@keyframes thumb {
  to {
    transform: initial;
  }
}
.btn-slide-pause,
.btn-slide-play {
  position: absolute;
  z-index: 1;
  left: 1rem;
  background-color: transparent;
  border: none;
  color: #fff;
  padding: 0.75rem;
  font-size: 1rem;
  cursor: pointer;
  top: 2rem;
}
.icon {
  display: inline-block;
  font-size: 0.875rem;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-pause:before {
  content: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20height='24'%20viewBox='0%20-960%20960%20960'%20width='24'%20fill='%23fff'%3e%3cpath%20d='M520-200v-560h240v560H520Zm-320%200v-560h240v560H200Zm400-80h80v-400h-80v400Zm-320%200h80v-400h-80v400Zm0-400v400-400Zm320%200v400-400Z'/%3e%3c/svg%3e");
}
.icon-play:before {
  content: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20height='24'%20viewBox='0%20-960%20960%20960'%20width='24'%20fill='%23fff'%3e%3cpath%20d='M320-200v-560l440%20280-440%20280Zm80-280Zm0%20134%20210-134-210-134v268Z'/%3e%3c/svg%3e");
}
.hidden {
  display: none;
}
.legenda {
  font-size: clamp(0.6em, 0.6em + 1vw, 0.6em);
  margin: 2% 0 4%;
}
.slide-in-bottom {
  -webkit-animation: slide-in-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
    both;
  animation: slide-in-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}
@-webkit-keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(1000px);
    transform: translateY(1000px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(1000px);
    transform: translateY(1000px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
.fade-in {
  -webkit-animation: fade-in 1s cubic-bezier(0.39, 0.575, 0.565, 1) 0.5s both;
  animation: fade-in 1s cubic-bezier(0.39, 0.575, 0.565, 1) 0.5s both;
}
@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.footer_copyright {
  font-size: smaller;
  text-align: center;
  color: #fff;
}
button.on-off {
  border: none;
  bottom: 3.5rem;
  cursor: pointer;
  font-size: larger;
  padding: 0 1rem;
  right: -1%;
  z-index: 2;
}
.copyright,
button.on-off {
  border-bottom-left-radius: 2rem;
  border-top-left-radius: 2rem;
  color: #000;
  position: fixed;
}
.copyright {
  bottom: 3rem;
  max-height: 80%;
  max-width: 20rem;
  overflow: auto;
  padding: 1rem;
  right: -160%;
  text-transform: none;
  transition: right 1s;
  z-index: 1;
  background: #fff;
  padding-bottom: 3.5rem;
}
.open {
  right: 0;
}
.copyright ul {
  list-style: none;
  margin: 0 1rem;
}
.copyright p {
  text-align: left;
}
/* img selector pela ordem do slide, troque X pelo número do slide */

/* .slide-items-details:nth-child(X) .slide-items-details-text-intro img {
  max-width: 85%;
} */


.slide-items-details-text-intro ul { margin-left: 2.5rem; font-size: clamp(0.8em, 0.8em + 1vw, 1.2em); }