 



#msform {

  position: relative;

  margin-top: 20px;

}



#msform fieldset {

  background: white;

  border: 0 none;

  border-radius: 0.5rem;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

  width: 100%;

  margin: 0;

  padding-bottom: 20px;

  position: relative;

}



#msform fieldset:not(:first-of-type) {

  display: none;

}



.country-code {

  position: relative;

}



.country-code::after {

  font-size: 1rem;

  top: 50%;

  -webkit-transform: translateY(-38%);

          transform: translateY(-38%);

  right: 15px;

  position: absolute;

  content: " ";

  border-style: solid;

  border-width: 0.2em 0.2em 0 0;

  -webkit-transform: rotate(135deg);

          transform: rotate(135deg);

  vertical-align: top;

  width: 0.55em;

  height: 0.55em;

  color: #36b37e;

}



.country-code .custom-select {

  border: 1px solid #36b37e;

  padding: 0.7rem;

  border-radius: 0.4rem;

  min-width: 5rem;

  color: #000;

  outline: none;

  margin-top: 1.2rem;

  background: #FFF !important;

}



.country-code select {

  -webkit-appearance: none;

  -moz-appearance: none;

       appearance: none;

}



.city {

  border: 1px solid #36b37e;

  outline: none;

  padding: 0.5rem;

  width: 100%;

  border-radius: 0.4rem;

}



.phone-code {

  min-width: 4rem;

}



.pin-code {

  position: relative;

}



.city-label, .f-name-label,.l-name-label, .phone-label, .email-label , .emp-label, .company-label, .otp-label,.pincode-label, {

  color: #36b37e;

  position: absolute;

  top: 50%;

  -webkit-transform: translateY(-50%);

          transform: translateY(-50%);

  left: 1rem;

  background-color: #fff;

  -webkit-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

  pointer-events: none;

}



.focused-city {

  top: -12px;

  -webkit-transform: translateY(0);

          transform: translateY(0);

}



#msform .action-button {

  width: 100px;

  background: #36b37e;

  font-weight: bold;

  color: white;

  border: 0 none;

  border-radius: 0.4rem;

  -webkit-transition: all 0.5s ease-in-out;

  transition: all 0.5s ease-in-out;

  cursor: pointer;

  padding: 10px 5px;

  margin: 20px 0px 10px 5px;

  float: right;

}



#msform .action-button:hover,

#msform .action-button:focus {

  background-color: #36b37e;

}



#msform .action-button-previous {

  width: 100px;

  background: #36b37e;

  font-weight: bold;

  color: white;

  border: 0 none;

  border-radius: 0px;

  border-radius: 0.4rem;

  cursor: pointer;

  padding: 10px 5px;

  margin: 20px 5px 10px 0px;

  float: right;

  -webkit-transition: all 0.5s ease-in-out;

  transition: all 0.5s ease-in-out;

}



#msform .action-button-previous:hover,

#msform .action-button-previous:focus {

  background-color: #36b37e;

}



.custom-label {

  color: #36b37e;

}



.custom-checkbox {

  -webkit-appearance: none;

     -moz-appearance: none;

          appearance: none;

}



.custom-checkbox:before {

  content: "";

  display: inline-block;

  width: 18px;

  height: 18px;

  border: 1px solid #36b37e;

  background-color: #fff;

  margin-bottom: -4px;

  border-radius: 0.2rem;

}



.custom-checkbox:checked:before {

  content: "\2713";

  background-color: #36b37e;

  color: #fff;

  text-align: center;

  font-size: 18px;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: center;

      -ms-flex-pack: center;

          justify-content: center;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

}



.ins-small {

  font-size: small;

}



.steps {

  font-size: 25px;

  color: gray;

  margin-bottom: 10px;

  font-weight: normal;

  text-align: right;

}



.fieldlabels {

  color: gray;

  text-align: left;

}



#progressbar {

  padding: 0;

  overflow: hidden;

  color: lightgrey;

}



#progressbar li {

  list-style-type: none;

  font-size: 15px;

  width: 30%;

  float: left;

  position: relative;

  font-weight: 400;

  z-index: 999;

}



#progressbar #account:before {

  content: "1";

}



#progressbar #personal:before {

  content: "2";

}



#progressbar #payment:before {

  content: "3";

}



#progressbar #confirm:before {

  content: "4";

}



#progressbar li:before {

  width: 32px;

  height: 32px;

  line-height: 25px;

  display: block;

  text-align: center;

  font-size: 20px;

  color: #ffffff;

  background: lightgray;

  border-radius: 50%;

  margin: 0 auto 10px auto;

  padding: 2px;

}



#progressbar li:after {

  content: '';

  width: 100%;

  height: 2px;

  background: lightgray;

  position: absolute;

  left: 0;

  top: 17px;

  z-index: -1;

}



#progressbar li.active:before,

#progressbar li.active:after {

  background: #36b37e;

}



.progress {

  height: 20px;

}



.progress-bar {

  background-color: #36b37e;

}



.fit-image {

  width: 100%;

  -o-object-fit: cover;

     object-fit: cover;

}



.form-custom-card {

  -webkit-box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;

          box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;

  padding: 1rem;

  border-radius: 0.4rem;

  background-color: #fff;

}



.form-check-container {

  padding: 0.8rem 0.6rem;

  border: 1px solid #36b37e;

  border-radius: 0.4rem;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: justify;

      -ms-flex-pack: justify;

          justify-content: space-between;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

}



.son-counter {

  padding: 0.2rem;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

}



.son-counter .son-number, .son-counter .daughter-number {

  font-size: 1rem;

  font-weight: bold;

  color: #36b37e;

  border: 0;

  background: transparent;

  max-width: 1rem;

  text-align: center;

  margin: 0 0.5rem;

}



.son-counter i {

  color: #36b37e;

  font-size: 1.1rem;

  font-weight: bold;

  cursor: pointer;

}



.more-member {

  cursor: pointer;

}



.more-member i {

  color: #36b37e;

  font-size: 1.2rem;

  font-weight: bold;

}



.hide {

  display: none;

}



.city-ul {

  padding: 0 1rem;

  margin: 0;

  list-style: none;

  margin-top: 1.5rem;

}



.city-ul li {

  display: inline-block;

  margin-right: 0.5rem;

  margin-top: 0.5rem;

}



.city-ul li .selected-city {

  padding: 0.3rem 1.3rem;

  border: 1px solid #36b37e;

  border-radius: 2rem;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: center;

      -ms-flex-pack: center;

          justify-content: center;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  color: #36b37e;

  cursor: pointer;

  -webkit-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

}



.city-ul li .selected-city:hover {

  background-color: #36b37e;

  color: white;

}



.form-submit-btn {

  background-color: #36b37e;

  color: white;

  border: 0;

  border-radius: 0.4rem;

  padding: 0.5rem 1rem;

  font-size: 1rem;

  font-weight: bold;

  cursor: pointer;

  -webkit-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

}



.prev-step {

  background-color: #36b37e;

}



.bitcoin-label {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  border: 1px solid #D9E1E7;

  padding: 0.5rem 1rem;

  border-radius: 0.4rem;

  -webkit-box-pack: justify;

      -ms-flex-pack: justify;

          justify-content: space-between;

  width: 100%;

  align-items: center;

}



.bitcoin-label h6 {

  margin: 0;

  margin-left: 1rem;

}



.active-label {

  background-color: #36b37e;

}



.whatsapp {

  font-size: 1.5rem;

  color: #36b37e;

  margin-right: 0.5rem;

}



.active-label h6 {

  color: #fff;

}



.active-label p {

  color: #fff;

  font-weight: bold;

}



.ins-heading{

  font-size: 20px !important;

  color: #36b37e !important;   

  font-family: "Lato", sans-serif;

  /*font-weight: bold; */

  font-weight: 400 !important;

  margin-top:10px !important;

}



.ins-sub-heading {

  margin-bottom: 2rem;

  position: relative;

}



.ins-sub-heading::before {

  content: "";

  position: absolute;

  bottom: -0.5rem;

  left: 0;

  width: 5rem;

  height: 3px;

  background-color: #0E6CAA;

}



@media all and (max-width: 768px) {

  .form-check-container {

    padding: 0.4rem;

  }

  .custom-label {

    font-size: 0.9rem;

  }

  .custom-checkbox:before {

    margin-bottom: 0;

    width: 14px;

    height: 14px;

  }

  .custom-checkbox:checked:before {

    font-size: 1rem;

  }

  #progressbar li:before {

    padding-top: 4px;

  }

  /* .son-counter{

  position: fixed;

  width: 100%;

  background: #fff;

  bottom: 0;

  left: 0;

  justify-content: space-around;

  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;

  min-height: 20vh;

  border-radius: 20px 20px 0 0;



   

}



.son-counter::after{

  content: "\26CC";

  position: absolute;

  top: 1rem;

  right: 1rem;

  color: #000;

  

} */

}



.floating-label, .floating-label-age, .floating-label-fage, .floating-label-mage, .floating-label-gf, .floating-label-gm, .floating-label-fil, .floating-label-mil, .floading-d-1, .floading-d-2, .floading-d-3, .floading-d-4, .floading-s-1, .floading-s-2, .floading-s-3, .floading-s-4 {

  color: #36b37e;

  position: absolute;

  top: 50%;

  -webkit-transform: translateY(-50%);

          transform: translateY(-50%);

  left: 1rem;

  background-color: #fff;

  -webkit-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

  pointer-events: none;

}



.focused {

  top: -4px;

  -webkit-transform: translateY(0);

          transform: translateY(0);

}



.whats-app {

  position: relative;

  width: 40px;

  height: 14px;

  -webkit-appearance: none;

  -moz-appearance: none;

       appearance: none;

  background: #8f8c8c;

  outline: none;

  border-radius: 2rem;

  cursor: pointer;

}



.whats-app::before {

  content: "";

  width: 22px;

  height: 22px;

  border-radius: 50%;

  background: #fff;

  position: absolute;

  top: -4px;

  left: -1px;

  -webkit-box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;

          box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;

  -webkit-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

}



.whats-app:checked {

  background: #36B37E;

}



.whats-app:checked::before {

  -webkit-transform: translateX(100%);

          transform: translateX(100%);

  background: #fff;

}

 



#country-list  { 

	float: left;

    list-style: none !important;

    margin-top: 0px;

    margin-left: 1%;

    padding: 0;

    width: 100%;

	position: absolute; 

}



#country-list li{list-style-type: none !important; padding: 5px  !important; background: #f4f4f4 !important; border-bottom: #bbb9b9 1px solid  !important;}

#country-list li:hover{background:#36B37E !important;cursor: pointer  !important;color: #FFF;}

#selected-city{border: #eaffe1 1px solid;border-radius:4px;}

ul#country-list {

  border-top-left-radius: 5px;

  border-bottom-left-radius: 5px;

  border-top-right-radius: 5px;

  border-bottom-right-radius: 5px;

  overflow:hidden;

}	