/*	=== Farben === 
Blau = #002f87
Active-Orange = #ff671d
*/

.acall-step-navigation ul {
	background-image: url('https://www.acall.de/files/tao/img/logos_und_icons/step-nav-line-acall.png');
	background-repeat: repeat-x;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
	padding-left: 0;
}

.acall-step-navigation ul li { background-image: none; }

.acall-step-navigation ul li { padding-left: 10px; padding-right: 10px; }
.acall-step-navigation ul li.first { padding-left: 0; }
.acall-step-navigation ul li.last { padding-right: 0; }

.acall-step-navigation a {
	text-decoration: none;
}

.acall-step-navigation a::after {
	background-color:#002f87;
}

.acall-step-navigation li::after {
	background-color:#ff671d;
}

.acall-step-navigation a::after, .acall-step-navigation li::after {
	border-radius: 50%;
	color:#fff;
	display: block;
	font-size: 1.5rem;
	font-family: 'Assistant';
    font-weight: 600;
	height: 40px;
	line-height: 1.5;
	text-align: center;
	width: 40px;
}

/* Anpassungen hier vornehmen.
Die Klassen, z.B. step-1-mengen etc. müssen in dem Feld CSS-Klasse in den Seiteneinstellungen eingetragen sein. Eine neue Klasse wäre z.B. .step-99-foobar, in der Seite wird die Klasse step-99-foobar eingetragen. Die Deklaration für diese Klasse hier, wäre:

.acall-step-navigation a.step-99-foobar::after { content: '1'; }
.acall-step-navigation li.active.step-99-foobar::after { content: '1'; }

*/

.acall-step-navigation a.step-1-nebenstellen::after { content: '1'; }
.acall-step-navigation li.active.step-1-nebenstellen::after { content: '1'; }

.acall-step-navigation a.step-2-devices::after { content: '2'; }
.acall-step-navigation li.active.step-2-devices::after { content: '2'; }

.acall-step-navigation a.step-3-funktionen::after { content: '3'; }
.acall-step-navigation li.active.step-3-funktionen::after { content: '3'; }

.acall-step-navigation a.step-4-lines::after { content: '4'; }
.acall-step-navigation li.active.step-4-lines::after { content: '4'; }

.acall-step-navigation a.step-5-nummer::after { content: '5'; }
.acall-step-navigation li.active.step-5-nummer::after { content: '5'; }

.acall-step-navigation a.step-6-portierung::after { content: '6'; }
.acall-step-navigation li.active.step-6-portierung::after { content: '6'; }

.acall-step-navigation a.step-7-vertrag::after { content: '7'; }
.acall-step-navigation li.active.step-7-vertrag::after { content: '7'; }

/* Ende Anpassungen */

.acall-step-navigation span, .acall-step-navigation strong { display: none; }