div.svg {
  position: relative;
}
div.svg::before {
  position: absolute;
  content: "Grafik";
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: -1;
}

/* DIMENSIONEN */
.weiche {
/* 	width: 20em; */
/* 	height: 20em; */
}
.bahnhof {
	width: 20em;
	height: 10em;
}
.gleisstueck,
.uebergang,
.abschluss,
.sperre {
	width: 10em;
	height: 10em;
}

/* HINTERGRUND */
.hg .hg0 {
	fill: #ccc;
	fill: var(--light, #ccc);
}

.weiche[fma="0"] .hg .hg0 {
	fill: #8453c9;		/* Befahrung */
	fill: var(--purple, #8453c9);
}
/*.weiche[vs="1"] .hg .hg0 { /* Verschluss */
/*	fill: #96bd3f;		
	fill: var(--teal, #96bd3f);
}*/

.weiche[fma="0"] .hg .hg0 { /* FMA=0 */
	fill: #007bff;		
	fill: var(--primary, #007bff);
}

/*ÜBERGANG */
.strasse .s0 {
	fill: #666;
	fill: var(--dark, #666);
}
.strasse .s1 {
	fill: #aaa;
}
.schranken {
	display: none;
}
.uebergang[gs] .schranken {
	display: initial;
}

/* BAHNHOF */
.plattform {
	fill: #ffd;
}

/* GLEISE */
.gleis {
	fill: #222;
	fill: var(--dark, #222);
}
.weiche .gleis,
.sperre .gleis {
	fill: #888;
	fill: var(--gray, #888);
}

/* WEICHE FEHLER */
.weiche[sb="0"] .gleise .gleis {
	fill: #f00;
	fill: var(--red, #f00);
}

/* WEICHE HEIZUNG */
.weiche .heizung {
	fill: none;
}
.weiche[heiz] .heizung {
	fill: #888;
	fill: var(--gray, #888);
}
.weiche[heiz="1"] .heizung {
	fill: #da251d;
	fill: var(--red, #da251d);
}


/* WEICHE FAHRWEG */
.weiche[sb="1"] .gleis.spitze,
.weiche[sb="1"].SpL.AbzwR[wl="1"] .gleise .gerade,
.weiche[sb="1"].SpL.AbzwL[wl="1"] .gleise .abzweig,
.weiche[sb="1"].SpR.AbzwR[wl="1"] .gleise .gerade,
.weiche[sb="1"].SpR.AbzwL[wl="1"] .gleise .abzweig,
.weiche[sb="1"].SpL.AbzwR[wr="1"] .gleise .abzweig,
.weiche[sb="1"].SpL.AbzwL[wr="1"] .gleise .gerade,
.weiche[sb="1"].SpR.AbzwR[wr="1"] .gleise .abzweig,
.weiche[sb="1"].SpR.AbzwL[wr="1"] .gleise .gerade {
	fill: #222;
	fill: var(--dark, #222);
}

/* WEICHE GRUNDSTELLUNG */
.weiche .gs .gerade,
.weiche .gs .abzweig
{
	fill: none;
}


.weiche.AbzwR[gsx="0"] .gs .abzweig,
.weiche.AbzwL[gsx="0"] .gs .gerade,
.weiche.AbzwR[gsx="1"] .gs .gerade,
.weiche.AbzwL[gsx="1"] .gs .abzweig,
.weiche.AbzwR[gsx="2"][gsl="1"] .gs .gerade,
.weiche.AbzwL[gsx="2"][gsl="1"] .gs .abzweig,
.weiche.AbzwR[gsx="2"][gsl="0"] .gs .abzweig,
.weiche.AbzwL[gsx="2"][gsl="0"]	.gs .gerade{
	fill: #f80;
	fill: var(--orange, #f80);
}

/*Ne13*/
.weiche .ne13 .ne13-square{ 
	fill: #000;
	fill: var(--dark, #000);
}

.weiche .ne13 .ne13-circle
{
fill: #666;
fill: var(--gray, #666);
}
	
.weiche[gst="1"] .ne13 .ne13-circle{
	fill: #fff;
	fill: var(--white, #fff);
}

/*VS LOCK*/

.vsLock{
	transform:scale(0.090);
	transform-origin:9.5px 5.2px;
}

.weiche[vs="1"] .vsLock .vsLock-handle{
	opacity:1;
	rx:3px;
	ry:3px;
	fill:none;
	stroke-width:2px;
	stroke-linejoin:round;
	stroke:#000;
	stroke: var(--black, #000);
}

.weiche[vs="1"] .vsLock .vsLock-body{
	opacity:1;
	rx:3px;
	ry:3px;
	stroke-linejoin:round;
	stroke-width:10px;
	fill:#000;
	fill: var(--black, #000);
}

.weiche[vs="1"] .vsLock .vsLock-keyhole{
	fill:#ccc;
	fill: var(--light, #ccc);	
}

.weiche.SpL.AbzwL .vsLock .vsLock-handle,
.weiche.SpL.AbzwL .vsLock .vsLock-body,
.weiche.SpL.AbzwL .vsLock .vsLock-keyhole
{
	rotate: 180deg;
	transform-origin:9.5px 6.0px;
}

.weiche.SpR.AbzwR .vsLock .vsLock-handle,
.weiche.SpR.AbzwR .vsLock .vsLock-body,
.weiche.SpR.AbzwR .vsLock .vsLock-keyhole
{
	rotate: 180deg;
	transform-origin:9.5px 5.5px;
}

.weiche[vs="0"] .vsLock {
	display: none;
}

/* WEICHE NICHT BEREIT */
.weiche[sb="0"] .gs .gerade,
.weiche[sb="0"] .gs .abzweig {
	fill: none !important;
}
/* in BA Uex gibt es keine Grundstellung */
.weiche[ba="2"] .gs,
.weiche[ba="2"] .ne13 {
	display: none;
} 

/* WEICHE TYP - Spitze links/rechts - Abzweig links/rechts */
.weiche {
	-webkit-transform-origin: center;
	   -moz-transform-origin: center;
	    -ms-transform-origin: center;
	     -o-transform-origin: center;
	        transform-origin: center;
}
.weiche.AbzwL {
	-webkit-transform: scaleY(-1);
	   -moz-transform: scaleY(-1);
	    -ms-transform: scaleY(-1);
	     -o-transform: scaleY(-1);
	        transform: scaleY(-1);
}
.weiche.SpR {
	-webkit-transform: scale(-1);
	   -moz-transform: scale(-1);
	    -ms-transform: scale(-1);
	     -o-transform: scale(-1);
	        transform: scale(-1);
}
.weiche.SpR.AbzwL,
.abschluss.links {
	-webkit-transform: scaleX(-1);
	   -moz-transform: scaleX(-1);
	    -ms-transform: scaleX(-1);
	     -o-transform: scaleX(-1);
	        transform: scaleX(-1);
}