/* FONTS */

h1, h2, h3, h4, button {
  font-family: 'Lora', serif;
}

body {
  font-family: 'Rubik', sans-serif;
}

/* INPUT FOCUS */
input.form-control {
  background-color: transparent;
  color: #aaaaaa;
}

input.form-control::placeholder {
  color: #cccccc;
}

input.form-control:focus::placeholder {
  color: #cccccc;
}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 1);
  border-width: 2px;
  box-shadow: none;
  background-color: transparent;
  outline: 0 none;
  transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -webkit-transition: all 300ms ease;
  -o-transition: all 300ms ease;
}
/* BACKGROUNDS */
.bg-gray {
  background-color: #212529;
}

/* ERROR MESSAGE */
.error-container.hidden {
  font-size: 1px;
  visibility: hidden;
  opacity: 0;
}

.error-container {
  font-size: 14px;
  visibility: visible;
  opacity: 1;
  transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -webkit-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  margin: 10px 0;
}

/* TRANSITION */

.example-enter {
    opacity: 0.01;
  }
  
.example-enter.example-enter-active {
  opacity: 1;
  transition: opacity 500ms ease-in;
}

.example-leave {
  opacity: 1;
}

.example-leave.example-leave-active {
  opacity: 0.01;
  transition: opacity 500ms ease-in;
}

/* COPYRIGHT */

.copyright {
  font-size: 12px;
}

.copyright a {
  color: #2bb673;
  transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -webkit-transition: all 300ms ease;
  -o-transition: all 300ms ease;
}

.copyright a:hover {
  color: #0c314c;
  font-weight: bold;
  text-decoration: none;
}