.continue-form {
  display: flex;
  align-items: center;
  width: 500px;
  min-height: 560px;
  margin: 50px auto 30px;
  border-radius: 10px;
  flex-direction: column;
  /*justify-content: center;*/
  opacity: 0.94;
  background-color: #94D82D;
  text-align: center;
}


.moderator-form {
  display: flex;
  align-items: center;
  width: 500px;
  min-height: 560px;
  margin: 50px auto 30px;
  border-radius: 10px;
  flex-direction: column;
  /*justify-content: center;*/
  opacity: 0.94;
  background-color: #94d82d;
}

.question-form {
  display: flex;
  align-items: center;
  width: 500px;
  min-height: 75vh;
  margin: 50px auto 30px;
  border-radius: 10px;
  flex-direction: column;
  justify-content: center;
  opacity: 0.94;
  background-color: #ffdf00;
}


.question-area {
  width: 400px;
  height: 25vh;
  margin-bottom: 15px;
  font-size: large;
}

.mod-name, .cod-name {
  display: flex;
  width: 357px;
  justify-content: center;
  align-items: center;
}

.name-group {
  display: flex;
  flex-direction: column;
  width: 300px;
}

.name-group label {
  font-weight: bold;
}

@media (min-width: 576px) {
  .form-label input {
    width: 527px;
  }
}

h1 {
  margin-top: 20px;
  font-family: 'Fredoka One', serif;
}

.name-campus-fields {
  margin: 5px;
}

.form-continue {
  display: flex;
  min-height: 560px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 550px;
  margin: 20px auto 30px;
  border-radius: 10px;
}


@media (max-width: 560px) {
  .mod-name label, .cod-name label {
    margin: 6px;
  }
}

@media (max-width: 560px) {
  .mod-name, .cod-name {
    margin-top: 20px;
    flex-direction: column;
    width: 300px;
    align-items: center;
    /*margin: 0px;*/
  }
}

.continue-btns {
  display: flex;
  flex-direction: column-reverse;
  margin: 60px auto;
  align-items: center;
}

.question-btns {
  display: flex;
  flex-direction: column-reverse;
  margin: 14px;
}

.question-btns a:hover, .continue-btns a:hover  {
  box-shadow: 0 0 15px rgba(148, 216, 45, 0.8);
  text-shadow: 0 0 18px rgba(255, 255, 255, 0.8);
  transform: scale(1.05);
}

@media (max-width: 560px) {
  .form-continue {
    width: 300px;
  }
}

.mod-label, .cod-label {
  font-family: 'Fredoka One', serif;
  padding: 0px;
  margin-right: 20px;
}

.cod-label {
  margin-right: 61px;
}

.mod-login-btn {
  background: #ffdf00;
  border-style: none;
  font-family: 'Fredoka One', serif;
  width: 34vh;
  margin-top: 45px;
}

.mod-login-btn:hover {
  box-shadow: 0 0 15px rgba(148, 216, 45, 0.8);
  text-shadow: 0 0 18px rgba(255, 255, 255, 0.8);
  transform: scale(1.05);
}

.mod-name {
  margin-top: 35px;
}

.question-btns a {
  margin: 10px;
}

.continue-btns a {
  margin: 10px;
}

.no-question {
  display: flex;
  align-items: center;
  width: 500px;
  min-height: 50vh;
  margin:  auto; 
  border-radius: 10px;
  flex-direction: column;
  justify-content: center;
  opacity: 0.94;
  background-color: #94D82D;
  text-align: center;
  
}


.query-section {
  background: #ffdf00;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

@media (max-width: 576px) and (min-width: 270px) {
  .query-section {
    /*background: blue;*/
    max-width: 60vh;
    margin: auto;
    min-height: 20vh;
    width: 85vw;
  }
}

.query-section {
  /*margin: 0px;*/
  padding: 0px;
  border-radius: 10px;
  box-shadow: 1px -4px 17px 1px #94d82d;
  opacity: 0.94;
  min-height: 20vh;
}

.name-query {
  display: flex;
  justify-content: space-between;
  width: fit-content;
}


@media (max-width: 576px) {
  .name-query {
    display: flex;
    flex-direction: column;
    margin: 10px;
    align-items: center;
  }
}

@media (max-width: 570px) {
  .name-query div {
    margin: 5px;
  }
}

.name-qw {
  font-family: 'Fredoka One', serif;
  background: #94d82d;
  border-radius: 5px;
  margin-right: 5px;
  padding: 3px;
}

.camp-qw {
  font-family: 'Fredoka One', serif;
  margin-left: 3px;
  margin-right: 3px;
}

@media (min-width: 250px) and (max-width: 560px) {
  .name-group {
    width: 70vw;
    align-items: center;
  }
}

@media (min-width: 250px) and (max-width: 560px) {
  .question-area {
    width: 65vw;
  }
}

@media (min-width: 250px) and (max-width: 560px) {
  .question-form {
    width: 80vw;
  }
}

@media (min-width: 250px) and (max-width: 560px) {
  .continue-form {
    width: 80vw;
  }
  .no-question {
    width: 80vw;
  }
}

@media (min-width: 250px) and (max-width: 560px) {
  .mod-name input, .cod-name input, .mod-login-btn {
    width: 70vw;
  }
}

@media (min-width: 250px) and (max-width: 560px) {
  .moderator-form {
    width: 80vw;
  }
}

.query-pad {
  margin-bottom: 2rem;
}

.form-label {
  font-family: 'Fredoka One', serif;
}

.submit-btn {
  background-color: #94D82D;
  border-style: none;
  font-family: 'Fredoka One', serif;
  color: rgb(0,0,0);
}

.mod-login-btn {
  background: #94D82D;
  border-style: none;
  font-family: 'Fredoka One', serif;
  color: rgb(0,0,0);
}

.refresh {
  margin-top: 5rem;
}

.footer, .refresh, .clear{
  display: flex;
  justify-content: center;
}

#LoadMore, #oldLink, #refresh {
  color: black;
  text-decoration: none;
  background-color: #94D82D;
  outline: none;
  border-style: none;
  font-family: 'Fredoka One', serif;
  margin: 5px;
}

#LoadMore:hover, #oldLink:hover , #refresh:hover {
  box-shadow: 0 0 15px rgba(148, 216, 45, 0.8);
  text-shadow: 0 0 18px rgba(255, 255, 255, 0.8);
  transform: scale(1.05);
}


.fade-in {
  opacity: 0;
  animation: fadeIn 0.5s ease-in forwards;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.slide-in {
  animation: slideIn 0.4s ease-out;
}

@keyframes slideIn {
  from {
    transform: translateY(20px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}