.cont {
 width: 26%;
 margin: auto;
 padding: 0 !important;
 display: flex;
 justify-content: space-between;
}
.cont:nth-child(2){
 padding-top: 20px;
}
input {
  display: block;
  margin: 4px 0 8px 0;
  padding: 7px;
  border-radius: 7px;
  border: 1px solid gray;
  width: 100%;
}

 h2 {
  text-align: center;
  color: black;
}
.sign-up {
  display: flex;
  justify-content: center;
  margin: 10px 0 17px;
}
.sign-up a {
  color: #617251;
  font-weight: 600;
}
.sign-up p {
  margin-right: 5px;
}
label {
  font-size: 13px;
  color: #535353;
}
button {
  padding: 8px 21px;
  border-radius: 71px;
  background-color: #a1e871;
  display: block;
  margin: auto;
  cursor: pointer;
  width: 100%;
  border: none;
  font-weight: 700;
  margin-bottom: 15px;
  transition: all 0.2s ease-in;
}
button:hover {
  background-color: #67c02b;
}
.forgot-conyt {
  text-align: right;
}
.forgot-conyt a {
  color: #3b4a2a;
  font-weight: 600;
  font-size: 14px;
}
#register, #login {
 padding: 0 25px 15px 25px;
 width: 100%;
}
#register button, #login button {
 margin-top: 15px;
}
.forgotPassBtn {
 display: block;
 margin: auto;
 text-decoration: none;
 padding: 11px 24px;
 background-color: rgb(215, 234, 250);
 border-radius: 37px;
 color: rgb(97, 146, 187);
 font-weight: 600;
}

@media only screen and (max-width: 1200px){
 .cont {
  width: 51%;
 }
}
@media only screen and (max-width: 1024px){
 .cont {
  width: 64%;
 }
}
@media only screen and (max-width: 800px){
 .cont {
  width: 84%;
}
}
@media only screen and (max-width: 600px){
 .cont {
  width: 85%;
  flex-wrap: wrap;
 }
 #register, #login {
  width: 100%;
 }
 #register {
  margin-bottom: 15px;
 }
 #register input, #login input {
  width: 100%;
 }
}