.Gif_Box { height: 5rem; } .Gif_Box img { height: 100%; width: 100%; object-fit: contain; } .bgcolor { border: 1px solid #ddd; background: var(--login_bg_one); } @media(max-width:767px) { .bgcolor { border: none; background: var(--login_bg_one); } } .alert.custom { font-size: 14px; padding: 4px; margin-bottom: 0; } .alert.custom .btn-close { font-size: 12px; padding: 0.6rem 1rem; } #heading { text-transform: uppercase; color: #3cb73a; font-weight: normal } .msform { text-align: center; position: relative; margin-top: 0px; overflow-x: hidden; } .msform fieldset { background: white; border: 0 none; border-radius: 0.5rem; box-sizing: border-box; width: 100%; margin: 0; /* padding-bottom: 20px; */ position: relative } .form-card { text-align: left } .card { z-index: 0; border: none; position: relative } .fs-title { font-size: 25px; color: #3cb73a; margin-bottom: 15px; font-weight: normal; text-align: center; } .purple-text { color: #3cb73a; font-weight: normal } .steps { font-size: 25px; color: gray; margin-bottom: 10px; font-weight: normal; text-align: right } .fieldlabels { color: gray; text-align: left } #progressbar { margin-bottom: 0px; overflow: hidden; color: lightgrey; visibility: hidden; height: 0px; } #progressbar .active { color: #3cb73a } #progressbar li { list-style-type: none; font-size: 15px; width: 25%; float: left; position: relative; font-weight: 400 } #progressbar #account:before { font-family: FontAwesome; content: "\f13e" } #progressbar #personal:before { font-family: FontAwesome; content: "\f007" } #progressbar #payment:before { font-family: FontAwesome; content: "\f030" } #progressbar #confirm:before { font-family: FontAwesome; content: "\f00c" } #progressbar li:before { width: 50px; height: 50px; line-height: 45px; display: block; 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: 25px; z-index: -1 } #progressbar li.active:before, #progressbar li.active:after { background: #3cb73a } .progress { height: 0px; visibility: hidden; height: 0px; } .progress-bar { background-color: #3cb73a } .fit-image { width: 100%; object-fit: cover } .wrap-login100 { width: 680px; background: #fff; border-radius: 10px; position: relative; padding: 10px; } .container-login100 { background: #e3e3e3; width: 100%; min-height: 100vh; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 15px; background-position: center; background-size: cover; background-repeat: no-repeat; } .text-right { text-align: right; } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Firefox */ input[type=number] { -moz-appearance: textfield; } .otpinputs { margin-right: 5px; } .otpinputsfrg { margin-right: 5px; } .col-sm-12.pr-0 { padding-right: 0; } span#otp_err { margin-left: 12px; } .slider_box { margin-top: 0; } @media (max-width:378px) { .alert.custom { font-size: 12px; padding: 2px; } .alert.custom .btn-close { font-size: 12px; padding: 0.2rem 0.3rem; padding-top: 7px; } } #loading { position: fixed; width: 100%; height: 100vh; background: #ffffffad url(assets-tab/img/loader.gif) no-repeat center center; z-index: 99999; background-size: 170px; } .copycolor { color: rgba(255, 255, 255, 0.6) !important; } .copycolor.u-link{ color: rgba(255, 255, 255, 0.6) !important; } .Login_boc h3{ text-align: center; letter-spacing: 3px; color: #fff; font-family: KoHo, sans-serif; font-size: 24px; text-shadow: 0 8px 10px #000; line-height: 30px; }