html {
  height: 100%;
  font-family: "Overpass", sans-serif;
}

body {
  height: 100%;
  flex-direction: column;
}

main {
  width: 100%;
  min-height: calc(100% - 64px - 60px - 170px);
  display: flex;
  padding-top: 2em;
}

.vertical-center {
  align-self: center;
  width: 100%;
}

footer {
  width: 100%;
}

.footer-text > a:link,
.footer-text > a:visited {
  color: white;
  padding-left: 1em;
}

.footer-text {
  text-align: center;
  padding: 0.3em;
  height: 3em;
  background: linear-gradient(
    90deg,
    rgb(195, 158, 193) 0%,
    rgba(7, 106, 171) 100%
  );
  margin-top: -10px;
}

.footer-text > a > i {
  vertical-align: middle;
}

.wave-container {
  position: relative;
  text-align: center;
  overflow: hidden;
}

/*Material.css color adaption -> switch to sass sometimes*/
.btn,
.btn-floating {
  background-color: rgb(15, 3, 3);
}

.btn:hover,
.btn-floating:hover {
  background-color: rgb(7, 106, 171);
}

/* label focus color */
input:focus + label {
  color: rgb(7, 106, 171) !important;
}
/* label underline focus color */
input:focus {
  border-bottom: 1px solid rgb(7, 106, 171) !important;
  box-shadow: 0 1px 0 0 rgb(7, 106, 171) !important;
}