/* Sober 2 Day CSS - Index Page*/

* {
  transition: 0.5s;
  box-sizing: border-box;
  margin: 0;
}
body {
  background: url("/assets/images/construction-blueprint.jpg") no-repeat center
    center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#logo {
  text-shadow: 2px 2px 2px royalblue, 4px 4px 2px black;
}

.hide {
  display: block;
}

#teleconference a {
  color: white;
}

/* .navbar {
  display: flex;
} */
.navbar-collapse.mt-5.collapse.show {
  background-color: white;
  z-index: 100;
}

.navbar-brand {
  padding: 0;
}

.nav-item {
  margin-bottom: 2rem;
}

#quote {
  text-shadow: 4px 6px 10px black;
  /* -webkit-animation: slideinout 5s 5s 5 ease-in;
  -moz-animation: slideinout 5s 5s 5 ease-in;
  -o-animation: slideinout 5s 5s 5 ease-in;
  animation: slideinout 5s 5s 5 ease-in; */
}

/* #more {
  -webkit-animation: slideinout 3s 3s 5 ease-in;
  -moz-animation: slideinout 3s 3s 5 ease-in;
  -o-animation: slideinout 3s 3s 5 ease-in;
  animation: slideinout 3s 3s 5 ease-in;
} */

.basics {
  display: block;
  transition: 0.5s;
}

.navbar {
  height: 70px;
}

.text-main {
  text-shadow: 4px 8px 16px black;
  -webkit-animation: slidein 0.5s ease-in;
  -moz-animation: slidein 0.5s ease-in;
  -o-animation: slidein 0.5s ease-in;
  animation: slidein 0.5s ease-in;
}

.heading {
  overflow: hidden;
}

#subhead {
  width: 80%;
  -webkit-animation: fadeIn 2.5s forwards ease-in;
  -moz-animation: fadeIn 2.5s forwards ease-in;
  -o-animation: fadeIn 2.5s forwards ease-in;
  animation: fadeIn 2.5s forwards ease-in;
  visibility: hidden;
}

@keyframes slideinout {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes slidein {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  99% {
    visibility: hidden;
  }
  100% {
    visibility: visible;
  }
}

@keyframes bulge {
  0% {
    font-size: 120%;
  }
  50% {
    font-size: 110%;
  }
  100% {
    font-size: 100%;
  }
}

/* Class Registration Page - reg.php */

input.error {
  border-color: red;
}

.reg-form label {
  color: white;
  text-shadow: 2px 4px 8px black;
}

.reg-form .text-muted {
  background: white;
}

.card {
  width: 18rem;
}

/* Media Queries */

@media only screen and (max-width: 700px) {
  .hide {
    display: none;
  }
  .basics {
    display: block;
  }
  .card {
    width: 100%;
  }
}