.input{
    background-color: transparent;
    border: 1px solid #ccc;
    margin: 0px 0px 15px 0px;
    padding: 4px 10px 5px 10px;
    border-radius: 2px;
    display: block;
    width: 100%;
}

.input:active,
.input:focus,
.input:hover{
    box-shadow: 0px 0px 0px transparent;
    border: 1px solid #2196f3;
    /*animation-name: input-active;
    animation-duration: 0.3s;
    animation-iteration-count: infinite;*/
}

/*@keyframes input-active {
    0%  {background-clip: border-box;}
    50%  {background-clip: padding-box;}
    100%  {background-clip: content-box;}
}*/

.input.disabled{
    background-color: #efefef;
    color: #666;
    cursor: none;
}

.input.disabled:active,
.input.disabled:focus,
.input.disabled:hover{
    box-shadow: 0px 0px 0px transparent;
    background-color: #efefef;
    border: 1px solid #ccc;
    color: #666;
    cursor: auto;
}

.input.input-success{
    border: 1px solid #43a047;
}

.input.input-info{
    border: 1px solid #1e88e5;
}

.input.input-warning{
    border: 1px solid #fb8c00;
}

.input.input-danger{
    border: 1px solid #f4511e;
}

.input::-webkit-input-placeholder { color: #aaa; }
.input::-moz-placeholder { color: #aaa; }
.input:-ms-input-placeholder { color: #aaa; }
.input:-moz-placeholder { color: #aaa; }

.input-help{
    color: #d86868;
    padding: 5px 0px;
    margin-top: -10px;
}

.input-help-danger{
    margin: -10px 0px 20px 0px;
    color: #eb6262;
    font-weight: 500;
    font-size: 10px;
    line-height: 10px;
}