form,
input,
select,
textarea,
button {
  font-size: 1.25rem;
}

input,
select,
textarea,
button {
  font-size: 1rem;
  margin: 2%;
  padding: 1%;
  border: 1px solid #ccc;
  border-radius: 6px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: #d181cd;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

fieldset {
  padding: 2%;
}

/*DARK MODE.*/

.darkmode {
  header {
    background-color: black;
  }

  .mainbox,
  .info,
  .homereturn a:link,
  .homereturn a:visited {
    background-color: black;
  }

  .headertitle a:link,
  a:visited,
  nav ul li a,
  p,
  h2 {
    color: white;
    background-color: transparent;
  }
  nav ul li a:hover {
    color: rgb(184, 138, 214);
  }

  .homereturn a:link,
  .homereturn a:visited {
    color: white;
    background-color: transparent;
  }

  .homereturn a:hover {
    color: rgb(208, 166, 230);
    background-color: transparent;
  }

  legend,
  fieldset {
    color: white;
  }

  .mainbox p {
    background-color: black;
  }

  #socials a:hover {
    color: #ae83b3;
  }

  .panel {
    background-color: black;
  }

  input:focus,
  select:focus,
  textarea:focus {
    outline: none;
    border-color: #da53d1;
  }
}
