body .assinatura { background: #fff; overflow: hidden; }
body h2.title { text-align: center; text-transform: uppercase; font-size: 16px; letter-spacing: 0.5px; color: #535353; font-weight: bolder; margin-top: 0.5rem; }
@media (min-width: 992px) { body h2.title { font-size: 22px; } }
body p.subtitle, body p.text { font-size: 14px; line-height: 18px; letter-spacing: 0.7px; color: #535353; text-align: center; }
@media (min-width: 992px) { body p.subtitle, body p.text { font-size: 16px; line-height: 20px; } }
body .row { margin-right: 0; margin-left: 0; }
body .wrp { position: relative; width: 100%; padding: 0; font-family: "Montserrat", Arial, Helvetica, sans-serif; }
body .wrp h1.brand-top { position: relative; transform: translate(0, 0); z-index: 1; overflow: hidden; margin-bottom: 0; top: 30px; }
body .wrp h1.brand-top img { display: block; margin-right: auto; margin-left: 30px; }
@media (min-width: 992px) { body .wrp h1.brand-top img { margin: 0; } }
body section.banner { background: url(/duvidas/assinatura-cruzada/assets/images/banner-topo.png) no-repeat; background-position: 80%; background-size: cover; height: 475px; margin-top: 39px; position: relative; }
body section.banner::before { content: ""; background-color: #1d1d1d; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s; opacity: 0.75; position: absolute; width: 100%; height: 100%; z-index: 0; }
@media (min-width: 992px) { body section.banner::before { opacity: 0; background-size: cover; } }
body section.banner div.box-title { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 580px; width: 100%; padding-right: 15px; padding-left: 15px; }
@media (min-width: 992px) { body section.banner div.box-title { left: 31%; } }
body section.banner div.box-title h2.title { color: #fff; text-align: left; letter-spacing: 2.27px; font-size: 18px; text-align: center; }
body section.banner div.box-title h2.title br { display: none; }
@media (min-width: 992px) { body section.banner div.box-title h2.title { text-align: left; font-size: 25px; }
  body section.banner div.box-title h2.title br { display: block; } }
body section.banner div.box-title p.subtitle { color: #fff; font-size: 16px; }
body section.banner div.box-title p.subtitle br { display: none; }
@media (min-width: 992px) { body section.banner div.box-title p.subtitle { text-align: left; font-size: 17px; }
  body section.banner div.box-title p.subtitle br { display: block; } }
body section.banner h2.title { color: #fff; font-size: 22px; text-transform: uppercase; }
@media (min-width: 992px) { body section.banner h2.title { font-size: 26px; } }
body section.box-gray { padding: 30px 15px 15px; margin-bottom: 0; position: relative; background: #ebebeb; top: -40px; }
body section.box-gray::before { content: ""; position: absolute; display: block; background: #e5173f; width: 4px; height: 40px; left: 50%; top: -20px; }
body section.box-gray::after { content: ""; display: block; margin: 0 auto; background: url(/duvidas/assinatura-cruzada/assets/images/icon-assinatura-cruzada.png) no-repeat; width: 88px; height: 88px; }
body section.content .line { background: #535353; width: 50%; height: 1px; display: block; margin: 0 auto; margin-bottom: 0.9rem; }
body section.content p.subtitle::after { content: ""; display: block; width: 50px; height: 4px; background-color: #e5173f; text-align: center; margin: 0 auto; margin-top: 15px; }
body section.content p.text { max-width: 599px; margin-right: auto; margin-left: auto; }
@media (min-width: 992px) { body section.passo .col-lg-1, body section.passo .col-lg-2, body section.passo .col-lg-6 { padding-right: 0; padding-left: 0; } }
body section.passo .arrow { display: none; }
@media (min-width: 992px) { body section.passo .arrow { display: block; } }
body section.passo p.text, body section.passo h2.title { text-align: left; display: inline-block; }
body section.passo p.text:last-child::after { content: ""; display: block; width: 50px; height: 4px; background-color: #e5173f; text-align: center; margin: 0; margin-top: 15px; }
body footer #openContact a { position: relative; cursor: pointer; }
body footer #openContact a::before { content: "\e316"; position: absolute; font-family: "Material Icons"; right: -25%; top: 0; font-size: 24px; transform: rotate(180deg); transition: all 0.5s; color: #e5173f; }
body footer #openContact a.active::before { transform: rotate(0deg); transition: all 0.5s; }
body footer .hidden { display: none !important; }
body footer .box-gray { background: #ebebeb; padding: 15px 0 0; }
body footer .box-gray p.text { text-transform: uppercase; }
body footer .box-gray .line { width: 50%; height: 1px; background: #bbbbbb; display: block; margin: 10px auto; position: relative; top: 0; }
@media (min-width: 992px) { body footer .box-gray .line { width: 1px; height: 50%; } }
body footer .box-gray .contact-media img { margin: 0 auto; display: block; }
body footer .box-gray .contact-media span.small { font-size: 11px; line-height: 14px; letter-spacing: 0.5px; text-transform: uppercase; display: flex; justify-content: center; text-align: center; }
@media (min-width: 992px) { body footer .box-gray .contact-media span.small { justify-content: flex-start; text-align: left; } }
body footer .box-gray .contact-media span.normal { font-size: 11px; display: flex; justify-content: center; text-transform: none; text-align: left; color: #535353; }
@media (min-width: 992px) { body footer .box-gray .contact-media span.normal { justify-content: flex-start; font-size: 14px; line-height: 18px; text-align: left; } }
body footer .box-gray .contact-media span.normal a { text-decoration: none; color: #535353; }
body footer .brand { background: #e5173f; padding: 15px 0; }
body footer .brand img { display: block; margin: 0 auto; }
body footer .dados { background: #637f8b; }
body footer .dados p.text { padding: 10px 0 0; color: #fff; font-size: 14px; line-height: 18px; }

.todo-pelo-app-body .images {
  width: 100vw;
  display: flex;
  justify-content: center;
}

.todo-pelo-app-body .images a:first-child {
  width: 34vw;
  text-decoration: none;
  margin-left: 150px;
}

.todo-pelo-app-body .images p {
  color: #47484C;
  position: relative;
  top: 200px;
  left: 10px;
}

.todo-pelo-app-device-imagens {
  position: relative;
  top: -80px;
  width: 70vw;
  height: 750px;
}

.todo-pelo-app-imagens {
  display: flex;
}

.todo-pelo-app-imagens-buttons {
  display: flex;
  flex-direction: column;
  position: relative;
  top: 270px;
  gap: 20px;
  padding-left: 20px;
}

.todo-pelo-app-voltar {
  width: 164px;
  height: 56px;
  background-color: #E1173F;
  padding: 19px 16px 20px;
  border-radius: 200px;
  display: flex;
  gap: 10px;
  margin: 20px auto;
  text-decoration: none;
  position: relative;
  z-index: 20;
}

.todo-pelo-app-voltar span {
  color: #fff;
  font-size: 13px;
  line-height: 16px;
  font-weight: 600;
}

.todo-pelo-app-voltar picture {
  display: flex;
  align-items: center;
}

#tpa-arrow {
  transform: rotate(180deg);
  width: 100%;
  height: 100%;
}