html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.material-icons.ulb-step-aboutyou::before {
    content: "mood";
}

.material-icons.ulb-step-lawfirm::before {
    content: "gavel";
}

.material-icons.ulb-step-payment::before {
    content: "attach_money";
}

.material-icons.ulb-step-terms::before {
    content: "article";
}

.material-icons.ulb-step-review::before {
    content: "visibility";
}

.material-icons.ulb-step-confirm::before {
    content: "done";
}

form #CreditCardNumber {
    background-image: url(../img/cc.png),url(../img/cc.png);
    background-position: 2px -121px,360px -61px;
    background-size: 120px 361px,120px 361px;
    background-repeat: no-repeat;
    padding-left: 54px;
    /*width: 225px*/
}

form #CreditCardNumber.visa {
    background-position: 2px -163px,260px -61px;
}

    /*form #CreditCardNumber.visa_electron {
        background - position: 2px - 205px, 260px - 61px
    }*/

form #CreditCardNumber.mastercard {
    background-position: 2px -247px,260px -61px;
}

    /*form #CreditCardNumber.maestro {
        background - position: 2px - 289px, 260px - 61px
    }

    form #CreditCardNumber.discover {
        background - position: 2px - 331px, 260px - 61px
    }*/

form #CreditCardNumber.valid.visa {
    background-position: 2px -163px,260px -87px;
}

    /*form #CreditCardNumber.valid.visa_electron {
        background - position: 2px - 205px, 260px - 87px
    }*/

form #CreditCardNumber.valid.mastercard {
    background-position: 2px -247px,260px -87px;
}

    /*form #CreditCardNumber.valid.maestro {
        background - position: 2px - 289px, 260px - 87px
    }

    form #CreditCardNumber.valid.discover {
        background - position: 2px - 331px, 260px - 87px
    }*/