html, body {
  overflow-x: hidden;
}

div {
  overflow: hidden;
}

header {
  background-color: #002C5F;
  padding: 20px 0px;
}

p {
  color: #707070;
  font-size: 18px;
}

#hero {
  background-image: url(https://content.campanhaporto.com.br/cartao/3521/images/bg-topo.jpg);
  background-position: center;
  background-size: 100%;
  height: auto;
  background-repeat: no-repeat;
  border-bottom: 5px solid #00AEEF
  }

.paragrafo {
    padding-top: 30px
  }

.beneficios {
  background-color: #F7F8F8;
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 20px
}

.beneficios p{
  margin-bottom: 0px;
}

.beneficios img{
  margin-bottom: 10px;
}

button {
  background-color: #00AEEF;
  color: #FFFFFF;
}

#app {
  background-color: #EEF9FE;
  margin-top: 40px
}

#app p{
  color: #0065A2;
  margin-top: 15px;

}

.politicas {
  border-top: thin solid #C4C4C4;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 12px
}

footer {
  background-color: #0065A2
}

.tj {
  padding-top: 30px;
  padding-bottom: 10px;
}

.tj p{
  font-size: 12px;
  color: #FFFFFF;
  margin-top: 20px
}

.assinatura {
  padding-top: 40px
}


@media (min-width: 1200px) {
  #hero {
  height: 450px;
  }

  p {
    font-size: 23px;
  }
  
}

@media (min-width: 992px) and (max-width: 1199.98px) {
   p {
    font-size: 23px;
  }
  
}

@media (min-width: 768px) and (max-width: 991.98px) {
 
 
 
}

@media (min-width: 576px) and (max-width: 767.98px) { 
  .logo {
    text-align: center
  }

  #app {
  text-align: center
  }
  .app {
    margin-top: 30px
  }
  .chamada {
    margin-top: 30px
  }
  
  
}

@media (max-width: 575.98px) {
  .logo {
    text-align: center
  }
  #app {
  text-align: center
  }
  .app {
    margin-top: 30px
  }
  .chamada {
    margin-top: 30px
  }
  
 
  
}