
.frmContainer{
    width: calc(100% - 22px);
    display: inline-block;
    margin-top: 10px;
    
    padding: 10px;
    border: 1px solid #eee;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    background: white;    
    
} 
  
.frmContainer.rtl{
    text-align:right;
    direction:rtl;
  }
  
  .frmContainer .lblContainer{
    margin-bottom: 5px;
    width: calc(100%);
    background: white;
    border: 1px solid #dadada;
    position:relative;
    height: 42px;
    display: inline-block;
  } 
  
  .lblContainer--buttons{
    text-align:left;
    margin:10px 5px;
    border:0px;
    background:transparent;
    line-height: 40px;    
  }
  
  .lblContainer--buttons .bttn{
    margin-right:5px;
  }
  .lblContainer--buttons input{
    width:83px
  }
  
  .frmContainer .multiRow{
    width: calc(100% + 2px);
    display:flex;
    justify-content: space-between;
  }

  .frmContainer .space{
    width: 10px;
  }
  .frmContainer .space20{
    width: 20px;
  }
  .frmContainer .space30{
    width: 30px;
  }

  .frmContainer label{
    display:inline-block;
    width: 100%;
    height: 100%;
  }
  .frmContainer label b{
    font-size:14px;
    font-weight:normal;
  }
  
  .frmContainer label span{
    display: block;
    height:100%;
    width: calc(100%);;
    top: 4px;
    position: absolute;
    color:#9e9e9e;
    text-indent: 4px;
    pointer-events: none;
  }
  
  .frmContainer label span:after{
      content: "";
      width:0px;
      position:absolute;
      background: #2196F3;
      height: 2px;
      position: absolute;
      bottom: 2px;
      left: calc(100% / 2);
      transition: 0.0s;
    }
  
  .frmContainer  label input, .frmContainer label textarea, .frmContainer label select{
    display: block;
    width: calc(100%);
    border: 0px;
    outline: none;
    top: 14px;
    position: relative;
    padding:0px;
    height: 27px;
    font-size:14px;
    text-indent: 0px;
    background:transparent;
    
  }
  .frmContainer label select{
    z-index:2;
  }

  /* ---=== Disable Under line on focuse ===---  */
  .frmContainer label span.noLine:after{
    display:none;
  }
  
  .frmContainer label input{
    text-indent: 4px;
  }
  
  .frmContainer input:focus + span,
  select:focus + span,
  textarea:focus + span{
    color:#2196F3;
  }
  
  .frmContainer input:focus + span:after,
  select:focus + span:after,
  textarea:focus + span:after{
    transition: 0.15s;
    width: 100%;
    left: 0px;
  }
  
  /* CheckBox Size Fix */
  /* ============================================================ */
  .frmContainer  label input[type="checkbox"]{
    height: auto;
    width: auto;
    display: inline-block;
    top: 3px;
  }  
  
 .frmContainer .emptyRow{
    border:0px;
    background:transparent;
    line-height: 40px;
  }
  
  .frmContainer label select{
    z-index:0;
    -webkit-appearance: menulist-button; 
    -moz-appearance: menulist-button; 
  }


.frmContainer label select:focus::-ms-value { 
  color: black; 
  background: transparent; 
} 


  
  /* ============= end CheckBox Size Fix ================= */
  
  /* textarea Size Fix */
  /* ============================================================ */
  .frmContainer .lblContainer.textarea{
    height: auto; 
  }  
  
  
  .frmContainer label textarea{
    height: auto;
    padding: 4px;
    width: calc(100% - 8px);
    resize: none; 
  }
  /* ============= end textarea Size Fix ================= */
  
  
  
  
  /* ============= OUTLINE OUTLINE OUTLINE ================= */
  .frmContainer .lblContainer--outline{
    background:white;
    border:0px;
    padding:10px 0px;
  }
  .frmContainer .lblContainer--outline input,
  .frmContainer .lblContainer--outline select, 
  .frmContainer .lblContainer--outline textarea{
    
    /*border: 1px solid #dadce0;*/
    box-shadow: 0 0 0 1px #dadce0;;
    top: 0px;
    border-radius: 4px;
    height:34px;
  }
  
  .frmContainer .lblContainer--outline label{
    height:auto;
    width: calc(100% - 0px);
  }
      
  
   .frmContainer .lblContainer--outline input:focus,
   .frmContainer .lblContainer--outline select:focus,
   .frmContainer .lblContainer--outline textarea:focus{
      /*border: 2px solid #2196F3;*/
      box-shadow: 0 0 0 2px #2196F3;
  }
  
  .frmContainer .lblContainer--outline span,
  .frmContainer .lblContainer--outline span,
  .frmContainer .lblContainer--outline span{
    top: 19px;
    transition: 0.15s;
    width: auto;
    height: auto;
    left: 8px;
    display: inline-block;
    background: white;
    padding-right: 4px;
    padding-left: 4px;
    font-size:14px;
    text-indent: 0px;
  }
  .frmContainer.rtl .lblContainer--outline span,
  .frmContainer.rtl .lblContainer--outline span,
  .frmContainer.rtl .lblContainer--outline span{
    right: 8px;
    left: auto;
  }
  
  
  .frmContainer .lblContainer--outline .frmContainer--helperText{
    color: #9e9e9e;
    font-size: 12px;
    margin-right: 9px;
    margin-top: 2px;
  }
  .frmContainer .lblContainer--outline .frmContainer--errorText{
    color: red;
    font-size: 12px;
    margin-right: 9px;
    margin-top: 2px;
    display:none;
  }
  
  .frmContainer .lblContainer--outline input:focus + span,
  .frmContainer .lblContainer--outline select:focus + span,
  .frmContainer .lblContainer--outline textarea:focus + span  {
    top: 2px;
    font-size:12px;
  }
  .frmContainer .lblContainer--outline span.notEmpty{
    transition:0s;
    top: 2px;
    font-size:12px;
  }
  
  .frmContainer .lblContainer--outline input:focus + span:after,
  .frmContainer .lblContainer--outline select:focus + span:after,
  .frmContainer .lblContainer--outline textarea:focus + span:after{
    display:none;
  }
  
  /*--- ERROR ERROR --- */
  .frmContainer .lblContainer--outline-error input:focus,
  .frmContainer .lblContainer--outline-error select:focus,
  .frmContainer .lblContainer--outline-error textarea:focus{
      /*border: 2px solid red;*/
      box-shadow: 0 0 0 2px red;;
  }
  .frmContainer .lblContainer--outline-error .frmContainer--helperText {
    display:none;
  }
  .frmContainer .lblContainer--outline-error .frmContainer--errorText { 
    display:block;
  }
  
  
  .frmContainer .lblContainer--outline-error input,
  .frmContainer .lblContainer--outline-error select,
  .frmContainer .lblContainer--outline-error textarea{
      /*border: 2px solid red;*/
      box-shadow: 0 0 0 2px red;;
  }
  .frmContainer .lblContainer--outline-error input:focus + span,
  .frmContainer .lblContainer--outline-error select:focus + span,
  .frmContainer .lblContainer--outline-error textarea:focus + span{
    color:red;
  }
  
  .frmContainer .lblContainer--outline-error span.helperText{
    color: red;
    margin-top: 2px;
  }