body {
	margin-bottom: 10px;
}

svg {
	font-family: "Open Sans", sans;
	font-size: 13px;
	min-width: 550px;
	min-height: 500px;
}

.title {
	font-size: 16px;
	font-weight: bold;
}

.title-live {
	font-size: 16px;
	font-weight: bold;
	font-family: FontAwesome;
}

.no-screen {
	fill: white;
}

.small,.station {
	font-size: 11px;
}

.km,.distance,.code {
	font-size: 8px;
}

.station, .code {
	cursor: pointer;
}

.hour {
	font-size: 13px;
	text-anchor: middle;
}

.minute {
	font-size: 9px;
	text-anchor: middle;
}

.train-number {
	font-size: 9px;
	text-anchor: middle;
}

.train-number.number-cancelled {
	opacity: 0.5;
}

.hour-line {
	stroke: black;
	stroke-width: 0.3mm;
}

.half-hour-line {
	stroke: black;
	stroke-width: 0.225mm;
}

.ten-minute-line {
	stroke: black;
	stroke-width: 0.1mm;
}

.minute-line {
	stroke: black;
	stroke-width: 0.1mm;
}

.station-line {
	stroke: black;
	stroke-width: 0.1mm;
}

.vertical-line {
	stroke: #ccc;
	stroke-width: 1px;
}

.train-line {
	stroke-width: 0.225mm;
	stroke-linecap: round;
	fill: none;
}

.stop-symbol {
	stroke-width: 0.2mm;
	stroke-linecap: round;
	fill: none;
	opacity: 0.75;
}

.current-time {
	stroke-width: 0.7mm;
	stroke-linecap: round;
	stroke: #0b0;
	fill: none;
}

.train-line-width1 {
	stroke-width: 0.3mm;
}

.train-line-width2 {
	stroke-width: 0.5mm;
}

.train-line-width3 {
	stroke-width: 0.7mm;
}

.train-line.scheduled {
	fill: none;
	opacity: 0.5;
}

.train-line-selected {
	stroke-width: 1mm !important;
	fill: none;
}

.train-line-width1.train-line-selected {
	stroke-width: 1mm !important;
}

.train-line-width2.train-line-selected {
	stroke-width: 1mm !important;
}

.train-line-width3.train-line-selected {
	stroke-width: 1.4mm !important;
}

.train-number:hover,.train-number-selected {
	font-size: 120% !important;
}

.train-line, .train-line-selected, .train-number, .train-number-selected {
	cursor: pointer;
}

.train-line.cancelled {
	fill: none;
	opacity: 0.3;
  stroke-width: 0.225mm;
  stroke-dasharray: 4,4;
}

.train-line-interesting {
	stroke-width: 2mm !important;
	opacity: 0.25 !important;
	stroke: red;
}

.train-line-interesting.scheduled {
	stroke-width: 2mm !important;
	opacity: 0.125 !important;
	stroke: red;
}

.train-line-interesting.cancelled {
	stroke-width: 2mm !important;
	opacity: 0.1 !important;
	stroke: red;
}

@media print {
	@page {
		size: A3 landscape;
		margin: 10mm;
	}
	svg {
		page-break-after: always;
	}
	.train-number {
		font-size: 8px;
	}
	.train-line-width1 {
		stroke-width: 0.1mm;
	}
	.train-line-width2 {
		stroke-width: 0.225mm;
	}
	.train-line-width3 {
		stroke-width: 0.4mm;
	}
	.no-screen {
		fill: black !important;
	}
	.vertical-line {
		stroke: black;
		stroke-width: 0.1mm;
	}
	#graphical-live-log, #graphical-tooltip {
		display: none !important;
	}
	#graphical-live-log {
		height: 0 !important;
	}
	.graphical-container-live {
		padding-right: 0 !important;
	}
	body,html,div#content {
		padding: 0;
		margin: 0;
	}
	nav.navbar {
		display: none !important;
	}
}

nav div#toolbar form select {
	width: 200px;
}

@media ( max-width : 767px) {
	nav ul.navbar-nav,nav ul.navbar-nav li {
		float: left;
	}
	nav div#toolbar form select {
		width: 100%;
	}
	.graphical-container-live {
		padding-right: 0;
	}
}

@media ( min-width : 992px) {
	.graphical-container-live {
		padding-right: 170px;
	}
}

.graphical-container-live {
	float: left;
	width: 100%;
}

#graphical-live-log {
	float: right;
	margin-right: 10px;
	position: absolute;
	right: 0;
	width: 170px;
	font-size: 14px;
	font-weight: bold;
	border-left: 1px solid #ddd;
	overflow: hidden;
	padding-left: 10px;
}

.graphical-log-item {
	font-size: 11px;
	font-weight: normal;
	margin-top: 15px;
}

#graphical-tooltip {
	background-color: rgb(255, 252, 239);
	padding: 5px;
	border-radius: 6px;
	border: 1px solid black;
	box-shadow: 3px 3px 5px #888888;
	display: inline-block;
	position: absolute;
	max-width: 300px;
}

#graphical-tooltip-number {
	font-weight: bold;
	font-size: 13px;
	display: inline-block;
}

#graphical-tooltip-difference {
	display: inline-block;
	padding-left: 10px;
}

#graphical-tooltip-route {
	font-size: 11px;
}

#graphical-tooltip-operator {
	font-size: 11px;
	font-weight: bold;
}

#graphical-tooltip-flag {
	display: inline-block;
	margin: 3px;
	margin-right: 5px;
}

circle.track-section {
	stroke: none;
	fill: #D9534F;
}

circle.track-section.occupied {
	fill: #D9534F;
}

circle.track-section.released {
	fill: #449D44;
}

circle.track-section.not-released {
	fill: #EFAB00;
}

circle.train-position {
	stroke: none;
}