#parallax{
  width: 100%;
  height: 400px;

  background-image: url(../../../static/imgs/banner-home-2.jpg);
  background-repeat: no-repeat;
  background-position:10%;
  background-attachment: fixed;
  background-size: cover;
}

#compromisso-content-box{
  margin: 80px auto;
  display: flex;

  flex-direction: column;
  justify-content: center;
  align-items: center;

  column-gap: 30px;
  row-gap: 30px;
}

#compromisso-image-box{
  text-align: center;
}

#compromisso-image-box img{
  max-width: 100%;
}

#compromisso-text-box h2{
  margin-bottom: 20px;
  font-size: 1.5em;
}

@media screen and (min-width:320px) and (max-width:480px) {
  #compromisso-text-box h2{
    font-size: 1.6em;
  }
}

@media screen and (max-width:480px){
  #compromisso-content-box{
    padding: 0px 30px;
  }
}

@media screen and (min-width:481px){
  #compromisso-content-box{
    flex-direction: row;
  }
}

@media screen and (min-width:481px) and (max-width:768px){
  #compromisso-content-box{
    max-width: 90%;
  }

  #compromisso-text-box h2{
    font-size: 1.7em;
  }
}

@media screen and (min-width:769px) {

  #parallax{
    background-position:left;
  }

  #compromisso-content-box{
    max-width: 70%;
  }

  #compromisso-text-box h2{
    font-size: 1.9em;
  }
}