button, input, select, textarea{ border-radius: 0px !important;}

.js .inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    max-width: 100%;
    font-size: 16px;
    font-weight: 200;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
}

.no-js .inputfile + label {
    display: none;
}


.inputfile + label svg {
    width: 4em;
    height: 3em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    /* 4px */
    margin-right: 0.25em;
    /* 4px */
}

.inputfile + label svg:hover {
    width: 4em;
    height: 3em;
    vertical-align: middle;
    fill: red;
    margin-top: -0.25em;
    /* 4px */
    margin-right: 0.25em;
    /* 4px */
}
/* style 1 */

.inputfile-1 + label {
    width: 100%;
    height: 20px;
}


/****  floating-Lable style start ****/
.floating-label { 
  position:relative; 
  margin-bottom:35px; 
}
.floating-input , .floating-select {
      font-size: 14px;
    padding: 5px 5px;
    display: block;
    width: 98%;
    height: 35px;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #e6e6e6;
}
.floating-input{
	width: 100%;
}

.floating-input:focus , .floating-select:focus {
     outline:none;
     border-bottom:1px solid #e6e6e6; 
}

.floating_label {
 font-size: 16px;
  font-weight:200;
  position:absolute;
  pointer-events:none;
  left:5px;
  top:10px;
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
}

.floating-label-large{
	 font-weight:600!important;
	 margin-bottom: 0px;
	 font-size:14px!important;
	 left: 0px;
	 top: -10px;
}
.floating-label-large .floating-input{
	font-weight:500;
}

.floating-input:focus ~  .floating-label-large, .floating-input:not(:placeholder-shown) ~ .floating-label-large{
	top: -25px!important;
	font-size:14px!important;
	left: 0px;
}

.floating-input:focus ~ label, .floating-input:not(:placeholder-shown) ~ label {
  top:-10px;
  font-size:12px;
}

.floating-select:focus ~ label , .floating-select:not([value=""]):valid ~ label {
  top:-18px;
  font-size:14px;
}

/* active state */
.floating-input:focus ~ .bar:before, .floating-input:focus ~ .bar:after, .floating-select:focus ~ .bar:before, .floating-select:focus ~ .bar:after {
  width:50%;
}


.floating-textarea {
   min-height: 30px;
   max-height: 260px; 
   overflow:hidden;
  overflow-x: hidden; 
}

/* highlighter */
.highlight {
 position: absolute;
    height: 50%;
    width: 100%;
    top: 50%;
    left: 0;
    pointer-events: none;
    opacity: 0.5;
    width: 10%;
}
.highlight{width:100%}

.highlight:after {
	content: '';
    display: block;
    margin: auto;
    height: 3px;
    width: 0px;
    background: transparent;
    transition: width .7s ease, background-color .7s ease;
    margin-top: 15px;
}

.floating-label .floating-input:focus + .highlight:after
{
  /* width: 100%;
    border-bottom: 2px solid #ffab10;
    transition: width 0.4s ease;*/
    width: 100%;
	background: #ffab10;
}

/* ***  css added for lable placed upper side when form is auto filled **** */
.floating-input:-webkit-autofill ~ label
{
  top:-10px;
  font-size:12px;
}
/* ***  css added for lable placed upper side when form is auto filled **** */

/* active state */

/**#################################CSS OVERWRITE BY DEEPAK FOR CUSTOMER REQUEST DETAIL FORM*/
#customer_request_first_contaner .floating_label{top:10px;}

/**#################################CSS OVERWRITE BY DEEPAK FOR CUSTOMER REQUEST DETAIL FORM*/
/**#################################CSS OVERWRITE BY SUNEEL FOR REPAIR IMAGES DESCRIPTION BOX*/
.floating-textarea  {
    font-size: 14px;
    padding: 16px 5px 0px;
    display: block;
    width: 98%;
    height: 52px;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #e6e6e6;
}
.floating-textarea{
	width: 100%;
}

.floating-textarea:focus {
     outline:none;
     border-bottom:1px solid #e6e6e6; 
}
.floating-label-large .floating-textarea:focus ~ label, .floating-label-large .floating-textarea:not(:placeholder-shown) ~ label {font-size:14px!important;margin-left: 0px;}
.floating-label-large .floating-textarea{
	font-weight:500;
}
.floating-textarea:focus ~ label, .floating-textarea:not(:placeholder-shown) ~ label {
  top:-10px;
  font-size:12px;
}

.floating-textarea:focus ~ .bar:before, .floating-textarea:focus ~ .bar:after {
  width:50%;
}
.floating-label .floating-textarea:focus + .highlight:after
{
    width: 100%;
	background: #ffab10;
}

/* animation */
@-webkit-keyframes inputHighlighter {
	from { background:#5264AE; }
  to 	{ width:0; background:transparent; }
}
@-moz-keyframes inputHighlighter {
	from { background:#5264AE; }
  to 	{ width:0; background:transparent; }
}
@keyframes inputHighlighter {
	from { background:#5264AE; }
  to 	{ width:0; background:transparent; }
}

