.align-content {
  display: grid;
  align-content: center;
}

.align-content1 {
  display: grid;
  align-content: center;
  border-radius: 20px;
  background: linear-gradient(138deg, rgb(49 167 255) 0%, rgb(231 28 224) 100%);
}

p {
  margin-top: -25px;

}

a {
  color: #ffffff;
}

a:hover {
  color: #dbdbdb;
}

A:link {
  text-decoration: none;
}

.nav-rgt {
  display: block;
  padding: 0rem 0rem;
  margin: -33px -7px;
}

.userInput {
  display: flex;
  justify-content: center;
  margin: -22px -114px 0px;
}

.input1,
.input2 {
  margin: 32px 4px;
  height: 42px;
  width: 7%;
  border: none;
  border-radius: 5px;
  text-align: center;
  font-size: 1.2rem;
  background: #eef2f3;
}

.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
}

.overlay:target {
  visibility: visible;
  opacity: 1;
}

.popup {
  margin: 70px auto;
  padding: 60px 15px;
  background: linear-gradient(to right, #E1F0FA, #9bc5c3);
  width: 81%;
  position: relative;
  transition: all 5s ease-in-out;
}

.popup .close {
  position: absolute;
  top: 4px;
  right: 26px;
  transition: all 200ms;
  font-size: 66px;
  font-weight: bold;
  text-decoration: none;
  color: #ef0000;
}

.popup .close:hover {
  color: #06D85F;
}

.popup .content {
  max-height: 30%;
  overflow: auto;
}

.button_popup {
  display: grid;
  align-content: center;
  width: 142px;
  height: 42px;
  margin: 0px auto;
  font-size: 1.1rem;
  border: none;
  border-radius: 5px;
  letter-spacing: 1px;
  background-color: rgb(255, 255, 255);
}

.text-icon {
  font-size: 10px;
  margin-left: 126%;
  margin-top: -68%;
}

.match-msg {
  position: absolute;
  display: none;
  color: green;
  right: 0%;
  margin-top: 10.5%;
}

.error-msg {
  position: absolute;
  display: none;
  color: red;
  right: 0%;
  margin-top: 14.5%;
}

.password-tip {
  display: none;
  color: #555;
  font-size: 0.9em;
  margin-top: 5px;
  background-color: #f8f9fa;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.input2:disabled {
  background-color: #e0e0e0;
  color: #999;
  cursor: not-allowed;
}


@media (max-width: 980px) {
  .text-icon {
    display: none;
  }

  .error-msg {
    position: absolute;
    display: none;
    color: red;
    right: 0px;
    margin-top: 47px;
  }

  .match-msg {
    position: absolute;
    display: none;
    color: green;
    right: 0px;
    margin-top: 47px;
  }

  #img_register {
    margin-top: -70px;
  }
}


@media screen and (max-width: 700px) {
  .box {
    width: 70%;
  }

  .popup {
    width: 70%;
  }
}