html,
html,
body {
   margin:0;
   padding:0;
   height:100%;
}
#container {
   min-height:100%;
   position:relative;
}
#header {
   background:#8BA69C;
   padding:0px;
   height:85px;
   display:inline-block;
   width:100%;

}
#header h1 {
   font-size:x-large;
}
#header h2 {
	font-size:medium;
}
#footer {
	clear: both;
	width: 100%;
	height: 60px; /* Height of the footer */;
	color: #fff;
	background: #455c5a;
	text-align: center;
}
#footer p, #header p {
	color: #fff;
}
#footer a {
	color: #00FFFF;
}
#footer a:hover {
	text-decoration: none;
}

/* Start of Column CSS */
#container3 {
	clear:left;
	float:left;
	width:100%;
	overflow:hidden;
	background:#e0d0d0; /* column 3 background colour */
}
#container2 {
	clear:left;
	float:left;
	width:100%;
	position:relative;
	right:20%;
	background:#c0c0c0; /* column 2 background colour */
}
#container1 {
	float:left;
	width:100%;
	position:relative;
	right:60%;
	background:#e0d0d0; /* column 1 background colour */
}
#col1 {
	float:left;
	width:18%;
	position:relative;
	left:80%;
	overflow:hidden;
}
#col2 {
	float:left;
	width:58%;
	position:relative;
	left:83%;
	overflow:hidden;
}
#col3 {
	float:left;
	width:18%;
	position:relative;
	left:86%;
	overflow:hidden;
}

#col1 div {
   font-size:       90%;
   margin:          0;
   padding:         0.25em 0.25em;
}

#col1 div.lighter {
   color:           inherit;
   background:      white;
}

#col1 p {
   margin:          0.5em 0;
}

#col1 .title a:link,
#col1 .title a:visited {
   color:           black;
   background:      transparent;
}

#col1 ul {
   list-style:      none outside;
   margin:          0.5em 0;
   padding:         0;
}

#col1 ul li {
   margin:          0;
   padding:         0.125em 0;
}

#col1 ul li.highlight {
   color:           inherit;
   background:      white;
   margin-left:     -1em;
   margin-right:    -1em;
   padding-left:    1em;
   border-top:      1px solid #999999;
   border-bottom:   1px solid #999999;
}

#col1 a:link,
#col1 a:visited {
    color:#0000FF;
}
#col1 a:hover {
	text-decoration: none;
}

#col2 div.desc {
	font-size: 18px;
	color: blue;
	padding: 2px 2px 0px 2px;
}

#col3 div {
   font-size: 14px;
   color: blue;
   padding: 5px 2px 5px 2px;
}

#col3 ul {
   list-style:      none outside;
   margin:          0.5em 0;
   padding:         0;
}

#col3 ul li {
   margin:          0;
   padding:         0.125em 0;
}

#col3 ul li.highlight {
   color:           inherit;
   background:      white;
   margin-left:     -1em;
   margin-right:    -1em;
   padding-left:    1em;
   border-top:      1px solid #999999;
   border-bottom:   1px solid #999999;
}

#col3 a:link,
#col3 a:visited {
    color:inherit;
}
#col3 a:hover {
	text-decoration: none;
}

#route:nth-of-type(1) {
    color: red;
}
#route:nth-of-type(3) {
    color: blue;
}
#route:nth-of-type(5) {
    color: yellow;
}
#route:nth-of-type(7) {
    color: green;
}
#route:nth-of-type(9) {
    color: purple;
}
#route:nth-of-type(11) {
    color: red;
}
#route:nth-of-type(13) {
    color: blue;
}
#route:nth-of-type(15) {
    color: yellow;
}
#route:nth-of-type(17) {
    color: green;
}
#route:nth-of-type(19) {
    color: purple;
}



.overview {
	background: #FFFF99;
}

.content {
	padding: 10px;
}
.contentNoPad {
	padding: 0px;
}
.descContent {
	padding: 0px 10px 0px 10px;
}

.overviewMap {
	border-style: solid;
	border-width: thin;
	border-color: inherit;
	float: right;
	margin: 0 5px 0 0;
}
.ol-tooltip {
	position: absolute;
	background-color: white;
	-webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
	filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
	padding: 10px;
	border-radius: 10px;
	border: 1px solid #cccccc;
	bottom: 17px;
	left: -50px;
    min-width: 170px;
}
.ol-tooltip:after, .ol-tooltip:before {
	top: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.ol-tooltip:after {
	border-top-color: white;
	border-width: 10px;
	left: 48px;
	margin-left: -10px;
}
.ol-tooltip:before {
	border-top-color: #cccccc;
	border-width: 11px;
	left: 48px;
	margin-left: -11px;
}
.ol-tooltip p {
	margin-top: 0;
	margin-bottom: 0;
}