/*********************
Forms basic
****************************/
::-webkit-input-placeholder {
  color: #d1d1d1;
}

:-moz-placeholder {
  /* Firefox 18- */
  color: #d1d1d1;
}

::-moz-placeholder {
  /* Firefox 19+ */
  color: #d1d1d1;
}

:-ms-input-placeholder {
  color: #d1d1d1;
}

section#form input[type=text],
section#form input[type=password],
section#form input[type=email],
section#form input[type=url],
section#form input[type=time],
section#form input[type=date],
section#form input[type=datetime-local],
section#form input[type=tel],
section#form input[type=number],
section#form input[type=search-md],
section#form textarea.materialize-textarea {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #ababab;
  border-radius: 0;
  outline: none;
  height: 2.5rem;
  width: 100%;
  font-size: 1rem;
  margin: 0 0 15px 0;
  padding: 0;
  box-shadow: none;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  transition: all .3s;
}

section#form input[type=password]:disabled,
section#form input[type=text]:disabled, input[type=text][readonly="readonly"],
section#form input[type=password][readonly="readonly"],
section#form input[type=email]:disabled,
section#form input[type=email][readonly="readonly"],
section#form input[type=url]:disabled,
section#form input[type=url][readonly="readonly"],
section#form input[type=time]:disabled,
section#form input[type=time][readonly="readonly"],
section#form input[type=date]:disabled,
section#form input[type=date][readonly="readonly"],
section#form input[type=datetime-local]:disabled,
section#form input[type=datetime-local][readonly="readonly"],
section#form input[type=tel]:disabled,
section#form input[type=tel][readonly="readonly"],
section#form input[type=number]:disabled,
section#form input[type=number][readonly="readonly"],
section#form input[type=search-md]:disabled,
section#form input[type=search-md][readonly="readonly"],
section#form textarea.materialize-textarea:disabled,
section#form textarea.materialize-textarea[readonly="readonly"] {
  color: rgba(0, 0, 0, 0.26);
  border-bottom: 1px dotted rgba(0, 0, 0, 0.26);
}

section#form input[type=text]:disabled + label,
section#form input[type=text][readonly="readonly"] + label,
section#form input[type=password]:disabled + label,
section#form input[type=password][readonly="readonly"] + label,
section#form input[type=email]:disabled + label,
section#form input[type=email][readonly="readonly"] + label,
section#form input[type=url]:disabled + label,
section#form input[type=url][readonly="readonly"] + label,
section#form input[type=time]:disabled + label,
section#form input[type=time][readonly="readonly"] + label,
section#form input[type=date]:disabled + label,
section#form input[type=date][readonly="readonly"] + label,
section#form input[type=datetime-local]:disabled + label,
section#form input[type=datetime-local][readonly="readonly"] + label,
section#form input[type=tel]:disabled + label,
section#form input[type=tel][readonly="readonly"] + label,
section#form input[type=number]:disabled + label,
section#form input[type=number][readonly="readonly"] + label,
section#form input[type=search-md]:disabled + label,
section#form input[type=search-md][readonly="readonly"] + label,
section#form textarea.materialize-textarea:disabled + label,
section#form textarea.materialize-textarea[readonly="readonly"] + label {
  color: rgba(0, 0, 0, 0.26);
}

section#form input[type=text]:focus:not([readonly]),
section#form input[type=password]:focus:not([readonly]),
section#form input[type=email]:focus:not([readonly]),
section#form input[type=url]:focus:not([readonly]),
section#form input[type=time]:focus:not([readonly]),
section#form input[type=date]:focus:not([readonly]),
section#form input[type=datetime-local]:focus:not([readonly]),
section#form input[type=tel]:focus:not([readonly]),
section#form input[type=number]:focus:not([readonly]),
section#form input[type=search-md]:focus:not([readonly]),
section#form textarea.materialize-textarea:focus:not([readonly]) {
  border-bottom: 1px solid #005c84;
  box-shadow: 0 1px 0 0 #005c84;
}

section#form input[type=text]:focus:not([readonly]) + label,
section#form input[type=password]:focus:not([readonly]) + label,
section#form input[type=email]:focus:not([readonly]) + label,
section#form input[type=url]:focus:not([readonly]) + label,
section#form input[type=time]:focus:not([readonly]) + label,
section#form input[type=date]:focus:not([readonly]) + label,
section#form input[type=datetime-local]:focus:not([readonly]) + label,
section#form input[type=tel]:focus:not([readonly]) + label,
section#form input[type=number]:focus:not([readonly]) + label,
section#form input[type=search-md]:focus:not([readonly]) + label,
section#form textarea.materialize-textarea:focus:not([readonly]) + label {
  color: #005c84;
}

section#Slide_3 input[type=text].valid, input[type=text]:focus.valid,
section#form input[type=password].valid,
section#form input[type=password]:focus.valid,
section#form input[type=email].valid,
section#form input[type=email]:focus.valid,
section#form input[type=url].valid,
section#form input[type=url]:focus.valid,
section#form input[type=time].valid,
section#form input[type=time]:focus.valid,
section#form input[type=date].valid,
section#form input[type=date]:focus.valid,
section#form input[type=datetime-local].valid,
section#form input[type=datetime-local]:focus.valid,
section#form input[type=tel].valid,
section#form input[type=tel]:focus.valid,
section#form input[type=number].valid,
section#form input[type=number]:focus.valid,
section#form input[type=search-md].valid,
section#form input[type=search-md]:focus.valid,
section#form textarea.materialize-textarea.valid,
section#form textarea.materialize-textarea:focus.valid {
  border-bottom: 1px solid #dbc349;
  box-shadow: 0 1px 0 0 #dbc349;
}

section#form input[type=text].valid + label:after,
section#form input[type=text]:focus.valid + label:after,
section#form input[type=password].valid + label:after,
section#form input[type=password]:focus.valid + label:after,
section#form input[type=email].valid + label:after,
section#form input[type=email]:focus.valid + label:after,
section#form input[type=url].valid + label:after,
section#form input[type=url]:focus.valid + label:after,
section#form input[type=time].valid + label:after,
section#form input[type=time]:focus.valid + label:after,
section#form input[type=date].valid + label:after,
section#form input[type=date]:focus.valid + label:after,
section#form input[type=datetime-local].valid + label:after,
section#form input[type=datetime-local]:focus.valid + label:after,
section#form input[type=tel].valid + label:after,
section#form input[type=tel]:focus.valid + label:after,
section#form input[type=number].valid + label:after,
section#form input[type=number]:focus.valid + label:after,
section#form input[type=search-md].valid + label:after,
section#form input[type=search-md]:focus.valid + label:after,
section#form textarea.materialize-textarea.valid + label:after,
section#form textarea.materialize-textarea:focus.valid + label:after {
  content: attr(data-success);
  color: #dbc349;
  opacity: 1;
}

section#form input[type=text].invalid, input[type=text]:focus.invalid,
section#form input[type=password].invalid,
section#form input[type=password]:focus.invalid,
section#form input[type=email].invalid,
section#form input[type=email]:focus.invalid,
section#form input[type=url].invalid,
section#form input[type=url]:focus.invalid,
section#form input[type=time].invalid,
section#form input[type=time]:focus.invalid,
section#form input[type=date].invalid,
section#form input[type=date]:focus.invalid,
section#form input[type=datetime-local].invalid,
section#form input[type=datetime-local]:focus.invalid,
section#form input[type=tel].invalid,
section#form input[type=tel]:focus.invalid,
section#form input[type=number].invalid,
section#form input[type=number]:focus.invalid,
section#form input[type=search-md].invalid,
section#form input[type=search-md]:focus.invalid,
section#form textarea.materialize-textarea.invalid,
section#form textarea.materialize-textarea:focus.invalid {
  border-bottom: 1px solid #F44336;
  box-shadow: 0 1px 0 0 #F44336;
}

section#form input[type=text].invalid + label:after,
section#form input[type=text]:focus.invalid + label:after,
section#form input[type=password].invalid + label:after,
section#form input[type=password]:focus.invalid + label:after,
section#form input[type=email].invalid + label:after,
section#form input[type=email]:focus.invalid + label:after,
section#form input[type=url].invalid + label:after,
section#form input[type=url]:focus.invalid + label:after,
section#form input[type=time].invalid + label:after,
section#form input[type=time]:focus.invalid + label:after,
section#form input[type=date].invalid + label:after,
section#form input[type=date]:focus.invalid + label:after,
section#form input[type=datetime-local].invalid + label:after,
section#form input[type=datetime-local]:focus.invalid + label:after,
section#form input[type=tel].invalid + label:after,
section#form input[type=tel]:focus.invalid + label:after,
section#form input[type=number].invalid + label:after,
section#form input[type=number]:focus.invalid + label:after,
section#form input[type=search-md].invalid + label:after,
section#form input[type=search-md]:focus.invalid + label:after,
section#form textarea.materialize-textarea.invalid + label:after,
section#form textarea.materialize-textarea:focus.invalid + label:after {
  content: attr(data-error);
  color: #F44336;
  opacity: 1;
}

section#form input[type=text] + label:after,
section#form input[type=password] + label:after,
section#form input[type=email] + label:after,
section#form input[type=url] + label:after,
section#form input[type=time] + label:after,
section#form input[type=date] + label:after,
section#form input[type=datetime-local] + label:after,
section#form input[type=tel] + label:after,
section#form input[type=number] + label:after,
section#form input[type=search-md] + label:after,
section#form textarea.materialize-textarea + label:after {
  display: block;
  content: "";
  position: absolute;
  top: 65px;
  opacity: 0;
  transition: .2s opacity ease-out, .2s color ease-out;
}

section#form select:focus {
  outline: 1px solid white;
}

button:focus {
  outline: none;
  background-color: #b275d1;
}

/* section#form label {
  font-size: 0.8rem;
  color: #9e9e9e;
} */

section#form .input-field {
  position: relative;
  margin-top: 1.4rem;
  margin-bottom: 0.6rem;
}

section#form .input-field label {
  color: #838ba2;
  position: absolute;
  top: 0.8rem;
  /* left: 0.75rem; */
  font-size: 1rem;
  cursor: text;
  -webkit-transition: 0.2s ease-out;
  -moz-transition: 0.2s ease-out;
  -o-transition: 0.2s ease-out;
  -ms-transition: 0.2s ease-out;
  transition: 0.2s ease-out;
}

section#form .input-field label.active {
  font-size: 0.8rem;
  -webkit-transform: translateY(-140%);
  -moz-transform: translateY(-140%);
  -ms-transform: translateY(-140%);
  -o-transform: translateY(-140%);
  transform: translateY(-140%);
}

section#form .input-field .prefix {
  position: absolute;
  width: 3rem;
  font-size: 2rem;
  -webkit-transition: color 0.2s;
  -moz-transition: color 0.2s;
  -o-transition: color 0.2s;
  -ms-transition: color 0.2s;
  transition: color 0.2s;
}

section#form .input-field .prefix.active {
  color: #4285F4;
}

section#form .input-field .prefix ~ input,
section#form .input-field .prefix ~ textarea {
  margin-left: 3rem;
  width: 92%;
  width: calc(100% - 3rem);
}

section#form .input-field .prefix ~ textarea {
  padding-top: .8rem;
}

section#form .input-field .prefix ~ label {
  margin-left: 3rem;
}

@media only screen and (max-width: 992px) {
  section#form .input-field .prefix ~ input {
    width: 86%;
    width: calc(100% - 3rem);
  }
}

@media only screen and (max-width: 600px) {
  section#form .input-field .prefix ~ input {
    width: 80%;
    width: calc(100% - 3rem);
  }
}

section#form .input-field input[type=search-md] {
  display: block;
  line-height: inherit;
  padding-left: 4rem;
  width: calc(100% - 4rem);
}

section#form .input-field input[type=search-md]:focus {
  background-color: #fff;
  border: 0;
  box-shadow: none;
  color: #444;
}

section#form .input-field input[type=search-md]:focus + label i,
section#form .input-field input[type=search-md]:focus ~ .mdi-navigation-close {
  color: #444;
}

section#form .input-field input[type=search-md] + label {
  left: 1rem;
}

section#form .input-field input[type=search-md] ~ .mdi-navigation-close {
  position: absolute;
  top: 0;
  right: 1rem;
  color: transparent;
  cursor: pointer;
  font-size: 2rem;
  transition: .3s color;
}

section#form textarea {
  width: 100%;
  height: 3rem;
  background-color: transparent;
}

section#form textarea.materialize-textarea {
  overflow-y: hidden;
  /* prevents scroll bar flash */
  padding: 1.6rem 0;
  /* prevents text jump on Enter keypress */
  resize: none;
  min-height: 3rem;
}

.hiddendiv {
  display: none;
  white-space: pre-wrap;
  word-wrap: break-word;
  overflow-wrap: break-word;
  /* future version of deprecated 'word-wrap' */
  padding-top: 1.2rem;
  /* prevents text jump on Enter keypress */
}

