/* 
 * FlowupLabels Basic Stylesheet 
 * -----------------------------
 * This style sheet is marked with comments indicating 
 * what should and what shouldn't be changed for your 
 * styling purposes.
 */


.fl_wrap {
  position: relative;
  margin-bottom: 1.5rem;
}
.fl_wrap > span, .fl_wrap > input {
    transition: all 0.2s;
    touch-action: manipulation;
}
.floating-label{
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 0px 0 0 0px;
  transition: all 200ms;
  opacity: 1;
  font-size: 13px;
  color: #777777;
  pointer-events: none;
}

.inputText:focus + .floating-label,
.inputText:valid + .floating-label {
  left: 0;
  transform: translate3d(0, -150%, 0);
  opacity: 1;
}
#order .inputText:focus + .floating-label,
#order .inputText:valid + .floating-label {
  left: 10px;
  top: -5px;
}
#login_form.FlowupLabels .floating-label,#order .FlowupLabels .field_phone .floating-label {
  transform: translate3d(0, -150%, 0);
  opacity: 1;
  left: 0;
}
#order .FlowupLabels .field_phone .floating-label {
  top: 0px;
  left: 10px;
}
.inputText:focus + .floating-label,
.inputText:valid + .floating-label {
  left: 0;
  transform: translate3d(0, -150%, 0);
  opacity: 1;
}
/* #authentication #account-creation_form.FlowupLabels .fl_wrap.focused .floating-label,
#authentication #account-creation_form.FlowupLabels .fl_wrap.populated .floating-label,
#authentication #account-creation_form.no-js .FlowupLabels .floating-label  { left: 13px !important; top: 16px;}
#authentication #account-creation_form.FlowupLabels .floating-label { left: 22px !important; }
#order .FlowupLabels .addresses .fl_wrap.focused .floating-label,#order .FlowupLabels .addresses .fl_wrap.populated .floating-label { left: 10px; top:-26px; }
 */
#order .FlowupLabels .floating-label { left: 20px;top: 17px;}
@media (max-width:480px)  {
.FlowupLabels #order-delivery-address .form-right .fl_wrap.focused .floating-label,
.FlowupLabels #order-delivery-address .form-right .fl_wrap.populated .floating-label { left: 26px; }
  #order .inputText:focus + .floating-label, #order .inputText:valid + .floating-label {top: 0;}

.FlowupLabels #order-invoice-address .form-right .fl_wrap.focused .floating-label,
.FlowupLabels #order-invoice-address .form-right .fl_wrap.populated .floating-label { left: 27px; }
.FlowupLabels #order-delivery-address .form-right .floating-label {left: 10px;}
}
#order .FlowupLabels .address-country .floating-label{
  top: -29px;
  left: 12px;
}