﻿textarea {
    border: 2px solid #808080 !important;
    border-radius: 0 !important;
    padding: 0;
    padding-top: 1.75em !important;
    padding-left: 1em;
}

textarea:focus + label {
    color: #808080;
    top: -.1em;
    background: transparent;
    font-size: 9px;
    z-index: 10000;
}

textarea:not(:focus) + label {
    top: .1rem;
    font-size: 10px;
}

input {
    border: 2px solid #808080 !important;
    border-radius: 0 !important;
    height: 3.25em;
    padding: 0;
    padding-top: 1.75em !important;
    padding-left: 1em;
}

input:not(:focus) {
    padding-left: 1em;
}

input:focus {
    /*border: 2px solid #ffde00 !important;
    box-shadow: 0 0 10px #ffde00 !important;*/
    border: 2px solid #333333 !important;
    box-shadow: 0 0 0 #333333 !important;
    border-radius: 0 !important;
    height: 3.25em;
    padding-left: 1em;
}

label {
    position: absolute;
    top: 2rem;
    left: 1rem;
    /*transition: all .4s ease-in-out;*/
    cursor: text;
    font-size: 10px;
    text-transform: uppercase;
}

input:focus + label {
    color: #808080;
    top: -.1em;
    background: transparent;
    font-size: 9px;
    z-index: 10000;
}

input:not(:focus) + label {
    top: .1rem;
    font-size: 10px;
}

select {
    border: 2px solid #808080 !important;
    border-radius: 0 !important;
    height: 3.25em !important;
    padding: 0;
    padding-top: 1.5em !important;
    padding-left: 0.75em;
}

select:focus {
    border: 2px solid #333333 !important;
    box-shadow: 0 0 0 #333333 !important;
    overflow: hidden;
}

select:focus + label {
    color: #808080;
    top: -.1rem;
    background: transparent;
    font-size: 10px;
}

select:not(:focus) + label {
    top: -.3rem;
    font-size: 10px;
}

select:not(:focus) {
    padding-left: 0.75em;
}
