.formRow {
  position: relative;
  width: 100%;
   
}   
      
.formRow--item {  
  display: block;
  width: 100%;
  margin-top:10px;
   
}

.formRow--input {
  position: relative;
  /* padding: 10px 20px 10px; */
  /*padding: 10px 15px 5px; */


  width: 100%;
  outline: none;
  

  border: 0px;
  /*border-bottom: solid 2px rgba( 56, 159, 168, 1); */

  border-bottom: dotted 1px  rgb(100,100,100);

  background-color: none;
  background: transparent!important;
   /*rgb(240,240,240) ; */

  /*border: solid 1px rgba(149, 152, 154,0.6);*/

  /*border: solid 1px rgba(220,220,220,1);*/
  height: 40px;

  border-radius: 0px;
  color: rgb(50,50,50) ; /* #2c3235; */
  /*letter-spacing: .2px;*/
  font-weight: normal;
  font-size: 18px;
  resize: none;

  -webkit-transition: all .2s ease;
  transition: all .2s ease;
   /*height: 40px;*/
   margin-top:5px;
   margin-bottom:5px;
    
}


.formRow--input:hover {
   /*border-color: rgba( 56, 159, 168, 1); */
   /*border-color: rgba(79, 204, 205, 1);*/

    border-bottom: dotted 2px  rgba( 57, 123, 255,1); 


    /*transition: border-bottom 0.8s linear 0.2s;*/
   
      
}


.formRow--input:focus {   
  /* border-color: rgba( 0, 0,0 , 0.5);    
   border-color: rgba( 75, 145, 200,1);  */

   border-bottom: solid 2px  rgba( 57, 123, 255,1);  

      
}


.formRow--input[readonly] {
  /*color: red; */
}


.formRow--input-wrapper {
  position: relative;
  display: block;
  width: 100%;
}

.formRow--input-wrapper.active .placeholder {
  
  top: -10px!important;
  left: -10px!important;
  background-color: transparent; /* color fondo when little */
   
  color: black;     
  /*text-transform: uppercase;*/
  /*letter-spacing: .2px;*/
  font-weight: normal;
  font-size: 12px;
  /*line-height: 14px;*/
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

.formRow--input-wrapper.active .formRow--input:not(:focus):not(:hover) ~ .placeholder { 
   
   color: rgb(0, 123, 255);  /* little pierde foco */ 
   color: rgb(24, 75, 219);  /* little pierde foco */ 
   /*font-weight: bold;*/

}

.formRow--input-wrapper .formRow--input:focus, .formRow--input-wrapper .formRow--input:hover
 { border4: #fd999a; }

.formRow .placeholder {
  position: absolute; /* place holder sin dato */
  top: 50%;
  left: 5px;
  display: block;
  padding: 0 10px;
  color: #95989a;
  /*white-space: nowrap;*/
  /*letter-spacing: .2px;*/
  font-weight: normal;
  /*font-size: 14px;*/

  -webkit-transition: all, .2s;
  transition: all, .2s;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/*------------------------------------------------*/

/*
.formRow--input:before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(to right, #b47dcd, #e878a2, #eb85ab);
  z-index: 1;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.5s ease-in-out;
}

.formRow--input:hover::before {
  transform: scaleX(1);
}


/* ANIMATIONS */
/*
.menu[data-animation="to-left"] a::before {
  transform-origin: right;
}

.menu[data-animation="center"] a::before {
  transform-origin: center;
}

.menu[data-animation="bonus"] a::before {
  transform-origin: right;
}

.menu[data-animation="bonus"] a:hover::before {
  transform-origin: left;
  transform: scaleX(1);
  transition-timing-function: cubic-bezier(0.2, 1, 0.82, 0.94);
}

*/