.steps-indicator button:before, .steps-indicator:before {
	background-color: white;
	content: ''
}

.fa-check-circle-o:before {content: "\f00c"}

.steps-indicator button.current, .steps-indicator button.default,
	.steps-indicator button.editing,.steps-indicator button.skip, .steps-indicator button.done {
	pointer-events: none;
}

.steps-indicator {
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0;
	padding: 12px 0 0;
	/* height: 50px; */
	list-style: none;
    width: 90%;
    margin-left: 5%;
}

.steps-indicator:before {
	position: absolute;
	/* height: 1px */
}

.btn-wizard{
	border-radius: 0% !important;
}

.btn-height{
    border-color: none;
        font-size: 16px!important;
}

/* .btn-padding{
	padding-left: 9px;
    padding-right: 8px;
} */

.steps-indicator.steps-2:before {
	left: calc(100%/ 2/ 2);
	right: calc(100%/ 2/ 2)
}

.steps-indicator.steps-3:before {
	left: calc(100%/ 3/ 2);
	right: calc(100%/ 3/ 2)
}

.steps-indicator.steps-4:before {
	left: calc(100%/ 4/ 2);
	right: calc(100%/ 4/ 2)
}

.steps-indicator.steps-5:before {
	left: calc(100%/ 5/ 2);
	right: calc(100%/ 5/ 2)
}

.steps-indicator.steps-6:before {
	left: calc(100%/ 6/ 2);
	right: calc(100%/ 6/ 2)
}

.steps-indicator.steps-7:before {
	left: calc(100%/ 7/ 2);
	right: calc(100%/ 7/ 2)
}

.steps-indicator.steps-8:before {
	left: calc(100%/ 8/ 2);
	right: calc(100%/ 8/ 2)
}

.steps-indicator.steps-9:before {
	left: calc(100%/ 9/ 2);
	right: calc(100%/ 9/ 2)
}

.steps-indicator.steps-10:before {
	left: calc(100%/ 10/ 2);
	right: calc(100%/ 10/ 2)
}

.steps-indicator * {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}

.steps-indicator button {
	color: grey;
	text-decoration: none;
	font-weight: 600;
	transition: .25s;
	cursor: context-menu;
    padding: 0.5 !important;
    tex-align: left;
	
}

.steps-indicator button:before {
	width: 0px;
	height: 0px;
	border-radius: unset;
	transition: auto;
	border-color: transparent;
	border-right: hidden
}

.steps-indicator button {
	color: #4d4d4d;
	    padding-left: 0 !important;
    padding-right: 0 !important;
}

.steps-indicator.steps-2 button {
	width: calc(100%/ 2)
}

.steps-indicator.steps-3 button {
	width: calc(100%/ 3)
}

.steps-indicator.steps-4 button {
	width: calc(100%/ 4)
}

.steps-indicator.steps-5 button {
	width: calc(100%/ 5)
}

.steps-indicator.steps-6 button {
	width: calc(100%/ 6)
}

.steps-indicator.steps-7 button {
	width: calc(100%/ 7)
}

.steps-indicator.steps-8 button {
	width: calc(100%/ 8)
}

.steps-indicator.steps-9 button {
	width: calc(100%/ 9)
}

.steps-indicator.steps-10 button {
	width: calc(100%/ 10)
}

.steps-indicator.steps-11 button {
	width: calc(100%/ 11)
}


/* .steps-indicator button.default {background-color: #eee9ea; border-bottom: 1px solid #999; border-right: 1px solid #fff;}
.steps-indicator button.current {border-color: #999; border-top-left-radius: 0.5em !important; border-top-right-radius: 0.5em !important; padding: 1em !important; }
.steps-indicator button.editing {border-color: #999;}
.steps-indicator button.skip { border-bottom: 1px solid #999; }
.steps-indicator button.done {padding: 1em; border-right: 1px solid #fff; } */
.steps-indicator button.default {
	color: black;
	padding-top: 0.7em;
	padding-bottom: 0.7em;
	/* padding: 1em!important; */
	/* background-color: #eee9ea; border-bottom: 1px solid #999; border-right: 1px solid #fff; */
}

.steps-indicator button.current {
	color: black;
	    /* border-bottom: white;
	    border-color: #999; */
	     border-top-left-radius: 0.5em !important; 
	     border-top-right-radius: 0.5em !important; 
	     /* padding: 1em !important;  */
	     padding-top: 0.7em;
	padding-bottom: 0.7em;
	         background: #eee9ea;
    border-bottom-left-radius: 0.5em !important;
    border-bottom-right-radius: 0.5em !important;

}

.steps-indicator button.done  {
	color: black;
	/* background-color: #eee9ea; */
	/* padding: 1em; */ 
	padding-top: 0.7em;
	padding-bottom: 0.7em;
	border-right: 1px solid #fff;
	/* border-bottom: 1px solid #999; */
	
}

.steps-indicator button.editing {
	color: black;
	border-bottom: white;
	/* border-color: #999; */
	padding-top: 0.7em;
	padding-bottom: 0.7em;
	
}
.steps-indicator button.skip {
	color: black;
	/* background-color: #eee9ea;
	border-bottom: 1px solid #999; */
	padding-top: 0.7em;
	padding-bottom: 0.7em;
	
}

@media (max-width: 900px) { 
    .steps-indicator-desktop{
        display:none;
    }
    .steps-indicator-mobile{
        display:block;
    }
    .title-heading{
    display:block;
    }
}
@media (min-width: 900px) { 
    .steps-indicator-desktop{
        display:block!important;
    }
    .steps-indicator-mobile{
        display:none;
    }
    .title-heading{
    display:none;
    }
}

.button-mobile{
height: fit-content;
    width: fit-content;
    padding-left: 1%;
    padding-right: 1%;
    padding: 0;
    border-right-color: white;
    border-radius: 100% !important;
}

.title-heading{    
	font-size: 25px;
    margin-top: 2%;
    margin-left:3px;
    color: #005587;
    margin-bottom: -2%;
    }
    
.tick-mark-done{
	       color: green;
	        display: inline-block; font-size: 1.5em;
}

.tick-mark-current{
	    color: black;
    font-size: larger;
}

.tick-mark-default{
	    color: gray;
    font-size: larger;
}

.tick-mark-skipped{
	    color: #d8c015;
     display: inline-block; font-size: 1.5em;
}

.tick-mark-editing{
	    color: #fd7e14;
    display: block; font-size: 1.5em;
}

.skipped-clock{
	    color: #d8c015;
    font-size: 1.2em;
    cursor: pointer;
}
.border-line{
	width: 90%;
    background: #666666;
        border-top: 2px solid rgba(0,0,0,.1);
            margin-top: 0.7rem !important;
            
	
}
.ng-hide:not(.ng-hide-animate {visibility: hidden;} 


