
/* Materilize input field name */


/* Full name */
.input_fullname {
    border: none;
    /* background-color: rgba(255, 255, 255, 0.221); */
    padding-top: 1.0rem;
    padding-left: 0.5rem;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom: hsla(197, 3%, 53%, 0.386);
    border-bottom-style: solid;
    border-bottom-width: 1.3px;
    width: 100%;
    height: 42px;
    z-index: 1;
}

.input_fullname:hover {
  background-color: rgba(228, 228, 228, 0.35);
  border-bottom: #136b9b;
  border-bottom-style: solid;
  border-bottom-width: 1.3px;
}

.input_fullname:focus {
    background-color: rgba(216, 216, 216, 0.6);
    border-bottom: #136b9b;
    border-bottom-style: solid;
    border-bottom-width: 1.3px;
    caret-color: #136b9b;
    outline: none;  
    transition: all 0.3s;
}

.label_fullname {
    position: absolute;
    padding: 1rem 0 0 0.5rem;
    font-size: 0.8rem;
    color: #136b9b;
    font-family: Roboto, sans-serif;
    transition: all 0.3s;
}

.shrink-colored-fullname {
    color: #136b9b;
    font-size: 0.6rem;
    transform: translateY(-8px);
    transition: all 0.3s;
    z-index: 2;
}

.shrink-uncolored-fullname {
    font-size: 0.6rem;
    transform: translateY(-8px);
}

/* end of fullname name */

/* Mobile No. */

.input_mobile {
    border: none;
    /* background-color: rgba(235, 235, 235, 0.221); */
    padding-top: 1.0rem;
    padding-left: 0.5rem;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom: hsla(197, 3%, 53%, 0.386);
    border-bottom-style: solid;
    border-bottom-width: 1.3px;
    width: 100%;
    height: 42px;
    z-index: 1;
}

.input_mobile:hover {
  background-color: rgba(228, 228, 228, 0.35);
  border-bottom: #136b9b;
  border-bottom-style: solid;
  border-bottom-width: 1.3px;
}

.input_mobile:focus {
    background-color: rgba(216, 216, 216, 0.6);
    border-bottom: #136b9b;
    border-bottom-style: solid;
    border-bottom-width: 1.3px;
    caret-color: #136b9b;
    outline: none;  
    transition: all 0.3s;
}

.label_mobile {
    position: absolute;
    padding: 1rem 0 0 0.5rem;
    font-size: 0.8rem;
    color: #136b9b;
    font-family: Roboto, sans-serif;
    transition: all 0.3s;
}

.shrink-colored-mobile {
    color: #136b9b;
    font-size: 0.6rem;
    transform: translateY(-8px);
    transition: all 0.3s;
    z-index: 2;
}

.shrink-uncolored-mobile {
    font-size: 0.6rem;
    transform: translateY(-8px);
}

/*  end of mobile no */

/* Email address */

.input_email {
    border: none;
    /* background-color: rgba(235, 235, 235, 0.221); */
    padding-top: 1.0rem;
    padding-left: 0.5rem;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom: hsla(197, 3%, 53%, 0.386);
    border-bottom-style: solid;
    border-bottom-width: 1.3px;
    width: 100%;
    height: 42px;
    z-index: 1;
}

.input_email:hover {
  background-color: rgba(228, 228, 228, 0.35);
  border-bottom: #136b9b;
  border-bottom-style: solid;
  border-bottom-width: 1.3px;
}

.input_email:focus {
    background-color: rgba(216, 216, 216, 0.6);
    border-bottom: #136b9b;
    border-bottom-style: solid;
    border-bottom-width: 1.3px;
    caret-color: #136b9b;
    outline: none;  
    transition: all 0.3s;
}

.label_email {
    position: absolute;
    padding: 1rem 0 0 0.5rem;
    font-size: 0.8rem;
    color: #136b9b;
    font-family: Roboto, sans-serif;
    transition: all 0.3s;
}

.shrink-colored-email {
    color: #136b9b;
    font-size: 0.6rem;
    transform: translateY(-8px);
    transition: all 0.3s;
    z-index: 2;
}

.shrink-uncolored-email {
    font-size: 0.6rem;
    transform: translateY(-8px);
}

/*  end of email */