* {
        margin: 0;
        padding: 0
    }

    html {
        height: 100%
    }

    h5{
        margin-bottom: 40px;
        color: #f9603e;
    }
    #form {
      padding: 5%;
      text-align: center;
      position: relative;
      margin-top: 20px
  }
  
  #form fieldset {
    background: white;
    border: 0 none;
    border-radius: 0.5rem;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding-bottom: 20px;
    position: relative
}

.finish {
    text-align: center
}

#form fieldset:not(:first-of-type) {
    display: none
}

#form .previous-step, .next-step {
    width: 100px;
    font-weight: bold;
    color: white;
    border: 0 none;
    border-radius: 0px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 5px 10px 0px;
    float: right
}

.form, .previous-step {
    background: #289901;
}

.form, .next-step {
    background: #f9603e;
}

#form .previous-step:hover,
#form .previous-step:focus {
    background-color: #289901
}

#form .next-step:hover,
#form .next-step:focus {
    background-color: #f9603e
}

.text {
    color: #f9603e;
    font-weight: normal
}

#progressbar {
    margin-bottom: 30px;
    overflow: hidden;
    color: lightgrey
}

#progressbar .active {
    color: #f9603e
}

#progressbar li {
    list-style-type: none;
    font-size: 14px;
    width: 25%;
    float: left;
    position: relative;
    font-weight: 400
}

#progressbar #step1:before {
    content: "1"
}

#progressbar #step2:before {
    content: "2"
}

#progressbar #step3:before {
    content: "3"
}

#progressbar #step4:before {
    content: "4"
}
/*#progressbar #step5:before {
    content: "5"
    }*/

    #progressbar li:before {
        width: 40px;
        height: 40px;
        line-height: 36px;
        display: block;
        font-size: 19px;
        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: 19px;
        z-index: -1
    }

    #progressbar li.active:before,
    #progressbar li.active:after {
        background: #f9603e
    }
    #phone-flage{
        border-top-left-radius: 25px;
        border-bottom-left-radius: 25px;
    }
    .next-step, .previous-step{
      border-bottom-right-radius: 25px !important;
      border-bottom-left-radius: 25px !important;
      border-top-right-radius: 25px !important;
      border-top-left-radius: 25px !important;
  }
  .spotlight-row .active{
     background: #f9603e;
     color: #fff;
 }
 .spotlight .char{
    position: absolute;
    left: 5px;
    top: 85px;
    font-size: 14px;}
    .spotlight .icon{
        position: absolute;
        left: 10px;
        top: 20px;
        font-size: 35px;}
        .spotlight{  
            cursor: pointer;  
            background: #fff;
            padding: 12px;
            border-radius: 5px;
            height: 135px;
            width:100%;
            color: #f9603e;
            border: 2px solid #f9603e;
            transition: 0.8s;
            margin: 4px;}
            .spotlight:hover{background: #f9603e;color: #fff !important;}
            .spotlight:hover .iconn {color: #ffffff;}
            .spotlight input{ display: none;}
            .template-section  .active{transition: all .1s ease-in-out;border-radius: 6px;border: #0872b4 solid;}
            .template-theme{margin: 4px;}
            .template-theme .template-img{height: auto;}

            /*Design*/
            #user-login-form{position: relative;max-width: 900px;}

            .form-page-inner{position: relative; max-width:750px; margin:70px auto 40;}
            .form-page-inner > .row{display: block;}
            .form-page-inner .verify-btns{padding-right:0;}
            .form-page-inner .verify-btns .btn{min-width: 1px; min-height: 1px; line-height: normal; border-radius: 5px; padding: 7px 10px; font-size: 14px; margin-top:0;}
            .form-page-inner .verify-btns .btn span{position:relative;}
            .form-page-inner .otp-input{padding-left:0;}
            .form-page-inner .otp-input .passcode-wrapper1{margin-top:0;}

            /*.next-step-btn{text-align: right;}*/
            /*.next-step-btn .next-step, #form .next-step-btn .previous-step{float: none; margin:20px 0 5px; width:120px;}*/
            .next-step, #form .previous-step{float:none;  margin:20px auto 5px; width:auto; min-width:120px;}
            #form .previous-step, #form .previous-step{background:#4444; color:#fff; border-color:#444; text-decoration: none;}
            #form .previous-step:hover, #form .previous-step:focus{background:#000; color:#fff; border-color:#000; text-decoration: none;}
            .text-right.account-div{float: none; clear: both; width:100%; padding-right: 15px; text-align: center !important;}
            .spotlight-row .col-md-4{padding:2px 6px;}
            .spotlight{padding-top:32px;}
            .spotlight .icon{position: static;}
            .spotlight .char{position: static; display: block; clear: both; padding-top:6px;}
            .fieldset-h5{margin-bottom:20px;}
            .captcha-section{text-align: center;}
            .captcha-section .g-recaptcha{display: inline-block; margin:0 auto;}

            .phone-design .input-group-text{height:38px;}
            .phone-design .form-control{height:38px;}

            .full-form-inner{max-width:100%; box-shadow:none;}
            .full-form-inner .template-theme{-ms-flex: 0 0 32.333333%; flex: 0 0 32.333333%; max-width: 32.333333%;}

            @media (max-width:991px){
                .full-form-inner .template-theme{-ms-flex: 0 0 48%; flex: 0 0 48%; max-width: 48%; margin:4px 4px 12px;}
                .full-form-inner .template-section .col-md-12 .row{justify-content:center;}
            }

            @media (max-width:767px){
                .form-page-inner{max-width:95%;}
                .form-page-inner .row{justify-content: center;}
                .spotlight-row .col-md-4{padding: 2px 6px;}
                .full-form-inner .template-theme{-ms-flex: 0 0 48%; flex: 0 0 48%; max-width: 48%;}
            }

            @media (max-width:500px){
                .form-page-inner{margin:20px auto 15px;}
                .form-page-inner .otp-input{-ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%;}
                .form-page-inner .verify-btns{-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}

                .full-form-inner .template-theme{-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; margin: 0 0 15px;}
            }