/**** FLEX ****/
.flex {
  display: flex;
  flex-wrap: wrap;
}

.flex-column {
  display: flex;
  flex-direction: column;
}

.align-center {
  align-items: center;
  font-size: 20px;
}

.align-end {
  align-content: flex-end;
}

.justify-center {
  justify-content: center;
}

.justify-end {
  justify-content: flex-end;
}

.justify-between {
  justify-content: space-between;
}

.justify-around {
  justify-content: space-around;
}



.logo-section{
  width: 300px;
  margin-bottom: 70px;
}

/**** ABOUT ****/
.about__content{
  font-size: 50px;
  font-weight: bold;
}

.about__paragraph{
  margin-bottom: 85px;
}

.about__qr-title{
  margin-top: 170px;
  font-size: 50px;
}

.about__qr-content{
  font-size: 40px;
}

.about__box{
  width: 280px;
}





.usability{
  background-color: #00b700;
  font-weight: bold;
  margin: 200px 50px;
  padding: 30px 0px;
}

.usability__title{
  color: white;
  font-size: 50px;
}




.register{
  font-size: 50px;
  font-weight: bold;
  margin-bottom: 150px;
}

.register__content{
  font-size: 35px;
  margin-top: 80px;

}

.register__content p{
  margin-bottom: 20px;
}

.download_text{
  color: black;
}


.box{
  border-radius: 50px;
  font-size: 40px;
  padding: 80px 100px;
  margin: 15px 0px;
}
.box--white{
  background-color: white;
  width: 30%;
}
.ml-3{
  margin-left: 3rem;
}

.mt-4 {
  margin-top: 1rem;
}

.txt_error {
  color: red;
}

@media screen and (max-width: 1024px) {
  .about__content,.about__qr-content{
    font-size: 45px;
  }

  .about__qr-title, .register{
    font-size: 60px;
  }

  .register__content{
    font-size: 45px;
  }

  .usability__title{
    font-size: 55px;
  }


  .box{
    border-radius: 40px;
    font-size: 25px;
    padding: 15px 60px;
    margin: 15px 0px;
  }
  .ml-3{
    margin-left: 3rem;
  }
}

@media screen and (max-width: 900px) {
  .download_text{
    color: white;
  }
  .logo-section{
    width: 70px;
    margin: 15px;
  }

  .about__paragraph{
    margin-bottom: 12px;
    font-size: 17px;
  }
  .about__content,.about__qr-content{
    font-size: 0.9rem;
  }

  .about__qr-title, .register{
    margin-top: 30px;
    font-size: 1rem;
    font-size: 20px;
  }


  .about__qr-text{
    margin-top: 20px;
    font-size: 20px;
  }


  .register__all{
    max-width: 86%;
  }

  .register__content{
    font-size: 0.9rem;
    margin: 0;
  }
  .about__box{
    width:100%;
    max-width: 350px;
  }


  .usability{
    margin: 0;
    margin-top: 50px;
    padding: 0px;
    padding-bottom: 20px;
  }

  .usability__title{
    font-size: 1.4rem;
  }

  .register{
    /* margin-top: 80px; */
    margin-bottom: 10px;
  }
  .register__content{
    margin-top: 25px;
  }
  .register__content p{
    margin-bottom: 5px;
  }

  .box{
    font-size: 1.3rem;
    width: 210px;
    /* padding: 20px 30px; */
    margin: 5px 0px;
    border-radius: 20px;
  }
  .ml-3{
    /* margin-left: 10px; */
  }
}

@media screen and (max-width: 575px) {
  #tweet {
      width: 325px !important;
      margin: 0 auto;
  }
}

@media screen and (max-width: 900px) {
  .register__all {
    max-width: 86%;
  }
}