@media (max-width: 1240px) {
  body .xs-banner-image {
    margin-left: 30px;
    margin-right: 30px;
    margin-top: 50px;
  }

  body {
    height: 100% !important;
    padding-bottom: 100px !important;
  }
  body .row .col-xl-5 {
    width: 100%;
  }
  .row{
    flex-direction: column;
    justify-content: space-evenly;
    flex-wrap: nowrap!important;
  }
  .navbar-brand{
    font-size: 1.5rem !important;
    
  }
}
@media (min-width: 1240px) {
  body .container-fluid .col-xl-7 p {
    max-width: 600px;
  }

  body .container-fluid .col-xl-7 h1::before {
    position: absolute;
    content: "";
    top: 40%;
    width: 50px;
    height: 5px;
  }
  body .xs-banner-image {
    margin-left: 30px;
    margin-right: 30px;
    margin-top: 50px;
  }
  .row{
    flex-direction: row;
    justify-content: space-evenly;
    flex-wrap: nowrap!important;
  }
  section {
    margin-left: 5em !important;
  }
  .navbar-brand{
    font-size: 2.5rem !important;
  }
  .col-xl-5 {
    flex: 0 0 41.666667%;
    max-width: 40%;
  }
}
@media (max-width: 800px) {
  html{
    height: 100%;
  }
  .navbar{
    text-align: center;
  }
  .navbar-brand{
    font-size: 1.25rem !important;
    width: 100%;
  }
}