.wizard > .steps .current a:after, .wizard > .steps .current a:hover:after, .wizard > .steps .current a:active:after, .wizard > .steps .done a:after, .wizard > .steps .done a:hover:after, .wizard > .steps .done a:active:after { content: ""; width: 100%; height: 8px; position: absolute; top: 0; bottom: 0; margin: auto; background: #08C177; }
.wizard > .steps .disabled a:after, .wizard > .steps .disabled a:hover:after, .wizard > .steps .disabled a:active:after { content: ""; width: 100%; height: 8px; position: absolute; top: 0; bottom: 0; margin: auto; background: #333; }
.wizard > .steps .disabled:last-child a:after, .wizard > .steps .disabled:last-child a:hover:after, .wizard > .steps .disabled:last-child a:active:after, .wizard > .steps .current:last-child a:after, .wizard > .steps .current:last-child a:hover:after, .wizard > .steps .current:last-child a:active:after, .wizard > .steps .done:last-child a:after, .wizard > .steps .done:last-child a:hover:after, .wizard > .steps .done:last-child a:active:after { display: none; }
.disabled span.number { background: #333333 !important; }
.form { transition: background 1s, border 0.3s, border-radius 0.3s, box-shadow 0.3s; padding: 35px 40px 0 40px;/* margin: auto; *//*     display: flow-root; */ }
#example-forma:hover. span:hover, li:hover { text-decoration: none }
#example-forma:focus { outline: 0; outline-offset: 0 }
#example-form ul[role="tablist"] { margin: auto; padding: 0; text-align: center; }
#example-form ul[role="tablist"] li {list-style: none;display: inline-block;width: 12%;position: relative;}
#example-form ul[role="tablist"] li.current { }
#example-form ul[role="tablist"] li.current a span.number { color: #333; }
#example-form ul[role="tablist"] li a span.current-info { display: none }
#example-form ul[role="tablist"] li a span.number { text-align: center; text-indent: inherit; width: 25px; height: 25px; border-radius: 50%; font-size: 13px; padding: 0 0; margin-right: -3px; cursor: default; color: #fff !important; display: inline-block !important; background: #08C177; }
#example-form ul[role="tablist"] li a span.number:last-letter { display: none }
#example-form ul[role="tablist"] li a { font-size: 0; pointer-events: none; }
#example-form .title { display: none }
#example-form section h2 { text-align: center; color: #ffffff !important; font-size: 2.5rem; }
#example-form section h2 small { color: #fff; font-size: 65%; font-weight: 400; line-height: 1 }
#example-form section h2 i { font-size: 21px; text-shadow: 0 2px 3px #0000006b; position: relative; top: -26px; margin-left: -27px; left: 17px; position: relative }
#example-form .step-select, #main-text .step .step-input, #main-text .step input[type=month], #main-text .step input[type=date] { font-size: 16px; color: #464545; text-indent: 5px; height: 55px; padding: 6px 15px; margin-bottom: 10px; border-radius: 4px; outline: 0; width: 100%; display: inline-block; border: 0 !important; }
#example-form .answers-small-margin { margin-top: 18px }
#example-form .step-buttons { transition: all .2s ease; font-size: 24px; color: #238ac5; border: 0; border-radius: 50px; box-shadow: 0 15px 34px rgba(0, 0, 0, 0.52); width: 100%; margin-bottom: 15px; margin-top: 5px }
#example-form .actions ul li { list-style-type: none }
#example-form .actions ul li:nth-child(2) a:hover { text-decoration: none }
#example-form .actions ul li:nth-child(2) a, .nextbtn { height: 46px; width: 118px; margin: 0; background: #08C177; background-size: 33%; font-size: 16px; border: 0; padding: 0; box-shadow: none; color: #ffffff; overflow: visible; pointer-events: all;/* top: 40%; */ position: relative; line-height: 46px; text-align: center; border-radius: 6px; display: grid; float: right; }
#example-form .actions ul li:nth-child(2) a, .prevbtn { height: 46px; width: 118px; margin: 0; background: #08C177; background-size: 33%; font-size: 16px; border: 0; padding: 0; box-shadow: none; color: #ffffff; overflow: visible; pointer-events: all;/* top: 40%; */ position: relative; line-height: 46px; text-align: center; border-radius: 6px; display: grid; float: none; margin: auto; }
#example-form .actions ul li:nth-child(1) a { margin: 0; font-size: 15px; color: #333; pointer-events: all; text-decoration: underline; font-weight: 800; }
#example-form .actions ul li:nth-child(3) a, a.lastbtn { height: 45px; width: 89%; line-height: 45px; text-align: center; margin: 0 auto; position: relative; background: #08C177; right: 0; left: 0; font-size: 18px; border: 0; padding: 0; box-shadow: none; color: #ffffff; overflow: visible; pointer-events: all; border-radius: 8px; margin-top: 30px; display: block; }
#example-form .actions ul li:nth-child(2) a, .nextbtn:hover { color: #fff; text-decoration: none; transform: translateX(-20px); }
#example-form .actions ul { position: relative; margin: 60px 0 0; }
#example-form .slider-wapper { display: block; background: rgba(255, 255, 255, 0.7); color: #333; border-radius: 3px; box-shadow: 0 9px 21px rgba(0, 0, 0, .33), 0 2px 3px rgba(0, 0, 0, .49); text-align: center; max-width: 50%; margin: auto; position: relative; padding: 23px 23px; margin-top: 24px; }
#example-form .slider-wapper > div { font-size: 38px; font-weight: 700; }
#example-form .slider-wapper p { color: #352f2c; }
#example-form .slider-wapper h3 { margin-bottom: 3px; font-size: 1.6em; color: #258ac5; margin-top: 17px }
#example-form .slider-wapper input { margin-bottom: 10px }
#example-form .slider-wapper #howmuch-num { font-size: 37px; font-weight: 300; margin-bottom: 7px }
#example-form .slider-handle.min-slider-handle.round { background: #08C177; width: 29px; height: 29px; cursor: pointer }
#example-form .slider-selection { background: #08C177 }
#example-form .slider-track { position: absolute; cursor: pointer; background-image: -webkit-linear-gradient(top, #f5f5f5 0, #f9f9f9 100%); background-image: -o-linear-gradient(top, #f5f5f5 0, #f9f9f9 100%); background-image: linear-gradient(to bottom, #f5f5f5 0, #f9f9f9 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#fff9f9f9', GradientType=0); -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1); border-radius: 4px }
#example-form .slider-wapper .slider-horizontal { width: 85%; height: 31px }
#example-form .slider-handle.min-slider-handle.round:focus, .slider-handle.min-slider-handle.round:active { outline: none; -webkit-animation: buttonblink .5s 1; -moz-animation: buttonblink .5s 1; -o-animation: buttonblink .5s 1; animation: buttonblink .5s 1; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards }
#example-form label.error {color: #ce0847;font-size: 14px;margin: auto;display: inline-block;margin-top: 0;font-weight: 600;}
.error{text-align:center}
#example-form input.error { border: 2px solid #ce0847 !important }
#example-form h3#days { font-size: 24px; padding-top: 24px; font-weight: 600; color: #fff; }
#example-form .secure_mcafee_lead { margin-bottom: 13px; border-bottom: 1px solid rgba(255, 255, 255, .44); padding-bottom: 16px; }
#example-form div#declimer, div#declimer a { color: #fff; margin-top: 28px; text-align: center; }
#example-form .secure_mcafee_lead { margin-bottom: 13px; border-bottom: 1px solid rgba(255, 255, 255, .44); padding-bottom: 16px }
#example-form .secure_mcafee_lead .secure_details { font-size: 13px; color: #fff; margin-left: 16px; border-left: 1px solid #fff; padding-left: 10px }
#example-form .secure_mcafee_lead .secure_details i { color: #fff }
#example-form img.mfes-trustmark.mfes-trustmark-hover { top: 7px; position: relative; }
#example-form section h2#amount { text-align: center; font-size: 2.5em; border-top: 1px solid #fff; border-bottom: 1px solid #fff; padding: 8px 35px !important; position: relative; margin-top: 0; line-height: 1.2em; color: #fff; margin-bottom: 30px; }
.slider.slider-horizontal { overflow: visible; width: 100% !important; }
.slider.slider-horizontal .slider-handle { margin-top: -5px; }
#example-form .slider-wrapper { width: 300px; margin: auto; }
#example-form .slider-wrapper .range-container { text-align: center; padding: 20px 0; margin: 20px auto; width: 80%; border: 1px solid #eeeeee; font-size: 24px; font-weight: 600; }
#example-form .content { padding: 20px 0 0px; }

/* CSS FOR CUSTOM FORM  */
.custom-form { padding: 8vh 0; }
.custom-form .text-center { text-align: center; }
.custom-form .row>div>h2 { font-size: 32px; }
.custom-form .card-container .card { width: 80%; margin: 8vh auto; padding: 2vw; box-shadow: 0px 3px 30px rgba(0, 0, 0, 0.1); border-radius: 15px; }
.custom-form .card-container .card h3 { margin-bottom: 20px; font-size: 24px; line-height: 1; }
.custom-form input, .custom-form select, .custom-form textarea { padding: 10px 20px; min-width: 400px; max-width: 400px; margin: auto !important; display: block; }
#example-form .radio-wrapper { text-align: center; margin: auto; }
#example-form .radio-wrapper label { width: 200px; height: 200px; display: inline-block; background-image: url(https://www.calfinhomeloans.com/wp-content/uploads/2020/07/home-page.png); background-size: 50%; background-repeat: no-repeat; background-position: 50% 70%; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); border-radius: 3px; vertical-align: top; position: relative; margin: 10px; transition: 0.2s ease-in-out; filter: invert(7%) sepia(61%) saturate(843%) hue-rotate(176deg) brightness(101%) contrast(93%); }
#example-form .radio-wrapper label:hover { box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15); }
#example-form .radio-wrapper input { opacity: 0; position: absolute; }
#example-form .radio-wrapper span.radio-text { font-weight: 700; font-size: 24px; text-transform: uppercase; color: #030104; margin: 20px 0; display: block; }
#example-form .radio-wrapper a.full-button { position: absolute; left: 0; right: 0; bottom: 0; top: 0; }
#example-form .radio-wrapper input + span.radio-text::after { content: '\f058'; position: absolute; top: 0px; right: 0px; font: normal normal normal 20px/1 FontAwesome; opacity: 0; color: #08C177; }
#example-form .radio-wrapper input:checked + span.radio-text::after { opacity: 1; }
.radio-wrapper2 { display: flex; justify-content: center; align-items: center; flex-direction: column; }
.radio-wrapper2 label { width: 250px; margin: 5px 0; height: 45px; }
.radio-wrapper2 input { position: absolute; opacity: 0; }
.radio-wrapper2 input + span { background: transparent; display: block; text-align: center; height: 100%; line-height: 45px; border: 1px solid #08C177; transition: 0.25s ease-in-out; }
.radio-wrapper2 input:checked+ span { background: #08C177; color: white; }
.input-wrapper { max-width: 400px; min-width: 400px; margin: auto; }
div.steps {
    margin-bottom: 35px;
}
@media screen and (max-width:768px) {
    .input-wrapper, .custom-form input, .custom-form select, .custom-form textarea { min-width: 40px; }
    .custom-form .card-container .card { margin: 10px 0; width: 100%; padding: 20px; }
}