.block-2 #wrap-msisdn-input {
  width: 320px
}

.block-2 #em-input-msisdn, .block-2 #em-input-pin {
  width: 100%;
  height: 54px;
  border: 1px solid #dbdbdb;
  font-size: 16px;
  font-weight: 400;
  line-height: 28.8px;
  color: #1a1a1a;
  outline: 0;
  border-radius: 15px;
  text-align: left;
  padding-left: 102px
}

.block-2 #em-input-pin {
  padding-left: 0;
  text-align: center
}

.active #em-input-msisdn, .active #em-input-pin {
  color: #60d637;
  border-color: #60d637
}

.error #em-input-msisdn, .error #em-input-pin {
  color: red;
  border-color: red
}

#em-input-msisdn::placeholder, #em-input-pin::placeholder {
  font-family: Exo, sans-serif;
  font-size: 14px;
  font-style: italic;
  font-weight: 200;
  line-height: 24px;
  text-align: left
}

#em-input-pin::placeholder {
  text-align: center
}

#msisdn-form, #pin-form {
  display: flex;
  flex-direction: column;
  gap: 5px;
  position: relative
}

.msisdn-form {
  position: relative;
  order: 1
}

.wrap-msisdn-input:after {
  content: "";
  position: absolute;
  left: 0;
  background: url(../images/phone.png) no-repeat;
  width: 56px;
  height: 54px;
  border-radius: 15px 0 0 15px
}

.wrap-pin-input::after {
  content: "";
  position: absolute;
  left: 0;
  background: url("/lp/ba/squeedio/basic/images/pin.png") no-repeat;
  width: 56px;
  height: 54px;
  border-radius: 15px 0 0 15px
}

.active .wrap-msisdn-input:after {
  background: url(../images/phone-active.png) no-repeat
}

.active .wrap-pin-input:after {
  background: url("/lp/ba/squeedio/basic/images/pin-active.png") no-repeat
}

.error .wrap-msisdn-input:after {
  background: url(../images/phone-error.png) no-repeat
}

.error .wrap-pin-input:after {
  background: url("/lp/ba/squeedio/basic/images/pin-error.png") no-repeat
}

.wrap-msisdn-input:before, .wrap-pin-input::before {
  content: "";
  position: absolute;
  background: url(../images/arrows.png) no-repeat;
  width: 16.32px;
  height: 13.74px;
  top: 50%;
  transform: translateY(-50%);
  left: 71px;
  animation: 2s infinite arrow
}

.active .wrap-msisdn-input:before, .active .wrap-pin-input:before {
  background: url(../images/arrows-active.png) no-repeat;
  animation: none
}

.error .wrap-msisdn-input:before, .error .wrap-pin-input:before {
  background: url(../images/arrows-error.png) no-repeat;
  animation: none
}

.active #em_submit_msisdn {
  background: linear-gradient(180deg, #60d637 0, #65bb3d 100%)
}

.error #em_submit_msisdn {
  background: #dbdbdb
}

.pin-step .title-msisdn {
  display: none !important
}

.pin-step .title-pin {
  display: block !important;
}

.error .error-msisdn, .pin-step.error .title-pin {
  display: block !important;
  color: red;
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 5px
}

.error .cla-title.title-msisdn {
  display: none !important
}

.title-pin {
  display: none
}