figuras.css

*{
  box-sizing: border-box;
  padding: 0;
  margin: 0; 
  font-family: "Helvetica Neue",Helvetica,Arial,sans;
}

header{
  text-align:center;
}

header h1, p{
  color:rgb(3, 2, 54);
  margin-bottom: 10px;
}

.main-container{
  display: flex;
  flex-flow: row wrap;
  width: 85%;
  margin: 0 auto;
}

.figure-container{
  width: 44%;
  min-height: 400px;
  display: flex;
  justify-content: center;
  flex-flow:column nowrap;
  margin: 25px auto;
  padding: 25px;
  box-shadow: 0px 2px 8px 3px rgb(194, 194, 194);
  border-radius: 8px;
  background: rgb(247, 247, 247);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
form{
  text-align: center;
}

.input{
  min-width: 49%;
  margin:0;
  display: inline-block;
}

.input-left{
  margin-right: 5px;
}

.figure-container h2{
  text-align: center;
  align-content: flex-start;
}

.figure-container h2 img{
  width: 35px;
}

.figure-container label{
  color: rgb(77, 77, 77);
  font-weight: 900;
  font-size: 0.8rem;

  display: inline-block;
  margin-top: 15px;
}
.figure-container input{
  width: 45%;
  height: 28px;
  border: 1px solid rgb(3,2,54);
  margin: 5px 0px 10px 0px;
  text-align: center;
  font-size: 25px;
}

.figure-container button{
  width: 100%;
  height: 28px;
  border: 1px solid rgb(3,2,54);
  background:rgb(224, 232, 255);
  color: rgb(3,2,54);
  font-weight: 900;
  font-size: 14px;
  margin: 5px 0px;
}



@media screen and (max-width:960px) {
  .figure-container{
    width: 90%;
}

.input{
  width: 100%;
}
}

@media screen and (max-width:1410px) {
  .input{
    width: 100% !important;
  }
  }


@media screen and (max-width:1820px) {
.input{
  width: 45%;
}
}