.bar,input,select,textarea{display:block;width:100%}.highlight,label{pointer-events:none}.form-btn{transform:rotate(90deg);background:#ff9800;padding:10px 20px;top:350px;right:-61px;color:#fff;overflow:hidden;z-index:999;cursor:pointer;position:fixed;text-decoration:none;transition:.2s;-webkit-transition:.2s}.form-close,label{position:absolute}.form-btn:hover,label{color:#fff;transition:.2s}.form-btn:hover{background:#82b724;text-decoration:none;-webkit-transition:.2s}.form-btn i{transform:rotate(-90deg)}.form-close{right:0;top:0;padding-right:10px;padding-top:10px}.bar,.form-group{position:relative}.form-group{margin-bottom:15px}input,select,textarea{padding:10px 10px 10px 5px;border:none;border-bottom:1px solid #d4d4d4;background:0 0;color:#fff}input:focus,select:focus,textarea:focus{outline:0}option{color:#000}input::-webkit-input-placeholder{color:rgba(255,255,255,.8)}input:-moz-placeholder{color:rgba(255,255,255,.8)}input::-moz-placeholder{color:rgba(255,255,255,.8)}input:-ms-input-placeholder{color:rgba(255,255,255,.8)}textarea::-webkit-input-placeholder{color:rgba(255,255,255,.8)}textarea:-moz-placeholder{color:rgba(255,255,255,.8)}textarea::-moz-placeholder{color:rgba(255,255,255,.8)}textarea:-ms-input-placeholder{color:rgba(255,255,255,.8)}label{font-size:16px;font-weight:400;left:5px;top:10px;-moz-transition:.2s;-webkit-transition:.2s}input:focus~label,input:valid~label{top:-20px;font-size:14px;color:#d4d4d4}textarea:focus~label,textarea:valid~label{top:-20px;font-size:14px;color:#fff}.bar:after,.bar:before{content:'';height:2px;width:0;bottom:1px;position:absolute;background:#fff;transition:.2s;-moz-transition:.2s;-webkit-transition:.2s}.bar:before{left:50%}.bar:after{right:50%}input:focus~.bar:after,input:focus~.bar:before,textarea:focus~.bar:after,textarea:focus~.bar:before{width:50%}.highlight{position:absolute;height:60%;width:100px;top:25%;left:0;opacity:.5}input:focus~.highlight,textarea:focus~.highlight{-webkit-animation:.3s inputHighlighter;-moz-animation:.3s inputHighlighter;animation:.3s inputHighlighter}@-webkit-keyframes textareatHighlighter{from{background:#d4d4d4}to{width:0;background:0 0}}@-moz-keyframes textareaHighlighter{from{background:#d4d4d4}to{width:0;background:0 0}}@keyframes textareaHighlighter{from{background:#d4d4d4}to{width:0;background:0 0}}@-webkit-keyframes inputHighlighter{from{background:#d4d4d4}to{width:0;background:0 0}}@-moz-keyframes inputHighlighter{from{background:#d4d4d4}to{width:0;background:0 0}}@keyframes inputHighlighter{from{background:#d4d4d4}to{width:0;background:0 0}}

    .modal-body input, .modal-body select, .modal-body textarea {
    padding: 10px 10px 10px 5px;
    border: none;
    border-bottom: 1px solid #d4d4d4;
    background: 0 0;
    color: #fff;
}
/* placeholder */
.modal-body input::placeholder,
.modal-body textarea::placeholder {
  color: #fff;
  opacity: 1;
}

/* focus text color */
.modal-body input:focus,
.modal-body textarea:focus,
.modal-body select:focus {
  color: #fff;
  background-color: transparent; /* optional */
  outline: none;
}

/* focus border (optional) */
.modal-body input:focus,
.modal-body textarea:focus,
.modal-body select:focus {
  border-color: #fff;
  box-shadow: none; /* remove bootstrap blue glow */
}

/* vendor fallbacks */
.modal-body input::-webkit-input-placeholder,
.modal-body textarea::-webkit-input-placeholder { color:#fff; }

.modal-body input:-ms-input-placeholder,
.modal-body textarea:-ms-input-placeholder { color:#fff; }

.modal-body input::-ms-input-placeholder,
.modal-body textarea::-ms-input-placeholder { color:#fff; }
.modal-body .bar:before, .modal-body .bar:after{    background: #fff;}
.form-close {
    right: 0;
    top: 0;
    padding-right: 10px;
    padding-top: 10px;
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
}
.form-close:not(:disabled):not(.disabled):focus, .form-close:not(:disabled):not(.disabled):hover {
    color:#fff;
    opacity: .75;
}