/* ***********step progress******************** */
.stepper .form-outer {
width: 100%;
overflow: hidden;
}
.stepper .form-outer form {
display: flex;
width: calc(100% * 3);
}
.stepper .form-outer form .page {
width: calc(100% / 3);
transition: margin-left 0.3s ease-in-out;
padding:10px;
}
.stepper .form-outer form .page .title {
text-align: left;
font-size: 25px;
font-weight: 500;
}
.stepper .form-outer form .page .field {
/* width: 100%;
height: 45px;
margin: 45px 0;
display: flex; */
position: relative;
float: right;
}
.stepper form .page .field .label {
position: absolute;
top: -30px;
font-weight: 500;
}
.stepper form .page .field input {
box-sizing: border-box;
height: 100%;
width: 100%;
border: 1px solid #d3d3d3;
border-radius: 5px;
padding-left: 15px;
margin: 0 1px;
font-size: 18px;
transition: border-color 150ms ease;
}
.stepper form .page .field input.invalid-input {
border-color: red;
}
.stepper form .page .field select {
width: 100%;
padding-left: 10px;
font-size: 17px;
font-weight: 500;
}
/* form .page .field button {
width: 100%;
height: calc(100% + 5px);
border: none;
background: #333;
margin-top: -20px;
border-radius: 5px;
color: #fff;
cursor: pointer;
font-size: 18px;
font-weight: 500;
letter-spacing: 1px;
text-transform: uppercase;
transition: 0.5s ease;
} */
/* form .page .field button:hover {
background: #000;
} */
/* form .page .btns button {
margin-top: -20px !important;
} */
.stepper form .page .btns button.prev {
margin-right: 3px;
}
.stepper form .page .btns button.next {
margin-left: 3px;
}
.stepper .progress-step {
display: table;
table-layout: fixed;
width: 100%;
/* display: flex; */
margin:26px  0 10px;
user-select: none;
overflow: hidden;
}
.stepper .progress-step .step 
{
width: 100%;
counter-increment: stepNum;
text-align: center;
display: table-cell;
position: relative;
color: #027f00;
}
.stepper .progress-step .step:last-child:before
{
content: none;
}
.stepper .progress-step .step:before
{
content: "";
width: 100%;
height: 10px;
background: #eaf0f4;
position: absolute;
left: 50%;
top: 8px;
}
.stepper .progress-step .step:has(.bullet.active):before
{
background:#24730a;
}

.stepper .progress-step .step p 
{
font-weight:600;
font-size: 14px;
color: #031c48;
margin-bottom: 0px;
}

.stepper .progress-step .step .bullet 
{
height: 25px;
width: 25px;
border: 2px solid #ffb050;
display: inline-block;
border-radius: 50%;
position: relative;
transition: 0.2s;
font-weight: 500;
font-size: 13px;
line-height: 22px;
z-index: 100;
background: #fff;
}
.stepper .progress-step .step .bullet.active {
    border-color: #67e606;
    background: #24730a;
}

/* .progress-step .step .bullet:before
{    content: "✓";
display: block;
margin: 0 auto 4px;
background-color: #027f00;
width: 36px;
height: 36px;
line-height: 32px;
text-align: center;
font-weight: bold;
border-width: 2px;
border-style: solid;
border-color: #027f00;
border-radius: 50%;
color: white;
} */
.stepper .progress-step .step .bullet span 
{
position: absolute;
left: 50%;
transform: translateX(-50%);
}
.stepper .progress-step .step .bullet.active span 
{
display: none;
}
/* .progress-step .step .bullet:before,
.progress-step .step .bullet:after {
position: absolute;
content: "";
bottom: 11px;
right: -100px;
height: 3px;
width: 44px;
background: #262626;
} */
.stepper .progress-step .step .bullet.active:after {
background: #333;
transform: scaleX(0);
transform-origin: left;
animation: animate 0.3s linear forwards;
}
@keyframes animate {
100% {
    transform: scaleX(1);
}
}
.stepper .progress-step .step:last-child .bullet:before,
.stepper .progress-step .step:last-child .bullet:after {
display: none;
}
.stepper .progress-step .step p.active {
color: #333;
transition: 0.2s linear;
}
.stepper .progress-step .step .check {
position: absolute;
left: 50%;
top: 23%;
font-size: 15px;
transform: translate(-50%, -50%);
display: none;
z-index: 100;
}
.stepper .progress-step .step .check.active {
display: block;
color: #fff;
}
.stepper label span
      {
        font-size: 14px;
        color:#e3324c;
      }

      .stepper .inspected-check i
{
    font-size: 18px;
}

.stepper .list-unstyled .badge
    {
        font-size: 13px;
    }
    .stepper .list-unstyled .media
    {
        position: relative;
    }
    .stepper .absolute-right
    {
        position: absolute;
        right: 10px;
        top: 10px;
    }
    .stepper .checked-inspection
    {
        width: 30px;
        height: 30px;
    }

    .stepper  .magnific-wrapper .gallery img {
        height: 100px;
        object-fit: cover;
        object-position: top;
    }
 .stepper .scheme-height
    {
    min-height:152px;
    }
    .stepper  .scheme-height p.heading
    {
    min-height:48px;
    margin-right: 8px;
    }
@media (max-width: 1199px) and (min-width: 992px) {

.circle
{
    height: 150px;
    width: 150px;
}
}

@media screen and (max-width: 660px) {
.progress-step .step p {
    display: none;
}
.progress-step .step .bullet::after,
.progress-step .step .bullet::before {
    display: none;
}
.progress-step .step .bullet {
    display: flex;
    align-items: center;
    justify-content: center;
}
.progress-step .step .check {
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 15px;
    transform: translate(-50%, -50%);
    display: none;
}
.step {
    display: flex;
    align-items: center;
    justify-content: center;
}
.progress-step .step:before
{
    left: 35%;
}
}
@media screen and (max-width: 490px) {
.container {
    box-sizing: border-box;
    border-radius: 0;
}
}
.note {
    font-size: 11px;
  font-weight: 700;
  padding-right: 48px;
  line-height: 15px;
  display: block;
}
.form-print  .name_d span {
    font-weight: 400;
    font-size: 14px;
    text-transform: capitalize;
}
 .form-print .form-group mb-3 label {
    font-weight: 600;
    font-size: 16px;
}
.form-print .name_d {
    line-height: 18px;
}
.btn-successc {
    background-color: #1f6308;
    color: #fdff92;
    line-height: 13px;
    padding: 12px 8px 9px 8px;
}
.btn-successc:hover {
    background-color: #5e7606;
    color: #fff;
}
 .btn-danger{
    line-height: 13px;
    padding: 12px 8px 9px 8px;
}
.stepper .form-control, .form-select {
    border: 1px solid #7d7a7a;
}