body {
	margin: 0;
	height: 100vh;
	overflow: hidden;
}

html {
	height: 100%;
}

.page-container {
	display: flex;
	height: 100%;
	background-color: #FFFFFF;
}

#sidebar {
	background-color: rgba(85, 109, 66, 0.8);
	flex: 0 0 250px;
	height: 100%;
	max-width: 320px;
	min-width: 200px;
	padding: 10px;
	text-align: center;
}

#main {
	flex: 1;
	margin: 0px;
	padding: 20px;
	overflow: auto;
	height: 100%;
	background-color: transparent;
	background-image: url("background1.gif");
  	background-repeat: no-repeat;
	background-position: left top;
	background-size:cover;
	color: #00137F;
}

img {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.image-banner {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 1200px;
	border-radius: 8px;
}

h1, h2, h4, h6 {
  	text-align: center;
}

h2.template {
	text-align: center;
}

h3.template {
	text-align: left;
}

a:link {
  	color: #00137F;
  	background-color: transparent;
  	text-decoration: underline;
}

a:visited {
  	color: #00137F;
 	background-color: transparent;
  	text-decoration: underline;
}

a:hover {
  	color: #00137F;
  	background-color: transparent;
  	text-decoration: underline;
}

a:active {
  	color: yellow;
  	background-color: transparent;
  	text-decoration: underline;
}

.nav-container {
	text-align: center;
}

.nav-heading {
	font-weight: bold;
	margin-top: 20px;
	margin-bottom: 5px;
	margin-left: 10px;
	margin-right: 10px;
}

.nav-menu {
	display: inline-block;
	list-style: none;
	padding: 0;
	margin: 0;
}

.nav-item {
	background-color: #A5FF7F;
	padding: 5px;
	margin: 4px;
	width: 180px;
	text-decoration: none;
	cursor: pointer;
}

.nav-item:hover {
	background-color: #78ba5c;
}

.nav-link:link, .nav-link:visited {
	color: #00137F;
	display: block;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: .9em;
	cursor: pointer;
}

.nav-link:hover {
	color: #ffffff;
}

.assurance {	
	border-color: #000000;
	border-width: 1px;
	border-style: solid;
	background-color: #267F00;
	color: #00137F;
	padding: 15px;
	margin: 30px 200px 0px 200px;
	text-align: left;
}

.button {
	background-color: #A5FF7F;
	border: none;
	color: #00137F;
	padding: 15px 32px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 20px;
	margin: 4px 2px;
	cursor: pointer;
}

.button1 {
	width: 180px;
	background-color: #A5FF7F;
	border: none;
	color: #00137F;
	padding: 5px 10px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 10px;
	margin: 2px 1px;
	cursor: pointer;
}

.button2 {
	width: 245px;
	background-color: #A5FF7F;
	border: none;
	color: #00137F;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 10px;
	margin: 2px 1px;
	cursor: pointer;
}

button.template {
	width: 245px;
	background-color: #A5FF7F;
	border: none;
	color: #00137F;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: .9em;
	margin: 2px 1px;
	cursor: pointer;
}

#map-container {
	display: flex;
	height: 100%;
}

#location-display {
	color: #330099;
	flex: 0 0 250px;
	height: 100%;
	max-width: 320px;
	min-width: 200px;
}

#location-fill {
	background-color: rgb(120, 186, 92);
	padding: 10px;
}

div.location-header {
	text-align: center;
	font-weight: bold;
}

p.location-desc {
	text-align: left;
}

.img-overlay-wrap {
	flex: 1;
	position: relative;
	display: inline-block; /* <= shrinks container to image size */
	transition: transform 150ms ease-in-out;
}

.img-overlay-wrap img { /* <= optional, for responsiveness */
	display: block;
	max-width: 100%;
	height: auto;
}

.img-overlay-wrap svg {
	position: absolute;
	top: 0;
	left: 0;
}

#A1, #A2, #A1-Label, #A2-Label {
  fill: hsl(270, 100%, 20%);
  opacity: 0%;
  stroke: black;
  stroke-width: 0px;
  paint-order="fill";
  clip-rule:evenodd;
  fill-rule:evenodd;
  stroke-linejoin:round;
  stroke-miterlimit:2
}

#A1:hover, #A2:hover, #A1-Label:hover, #A2-Label:hover {
  fill: hsl(270,100%,40%);
  stroke: hsl(270,100%,20%);
  opacity: 50%;
  stroke-width: 1px;
  transition: fill 0.4s;
  paint-order="fill";
  clip-rule:evenodd;
  fill-rule:evenodd;
  stroke-linejoin:round;
  stroke-miterlimit:2
}

#B1, #B2, #B3, #B4, #B5, #B6, #B7, #B8, #B1-Label, #B2-Label, #B3-Label, #B4-Label, #B5-Label, #B6-Label, #B7-Label, #B8-Label {
  fill: hsl(0, 100%, 20%);
  opacity: 0%;
  stroke: black;
  stroke-width: 0px;
  paint-order="fill";
  clip-rule:evenodd;
  fill-rule:evenodd;
  stroke-linejoin:round;
  stroke-miterlimit:2
}

#B1:hover, #B2:hover, #B3:hover, #B4:hover, #B5:hover, #B6:hover, #B7:hover, #B8:hover, #B1-Label:hover, #B2-Label:hover, #B3-Label:hover, #B4-Label:hover, #B5-Label:hover, #B6-Label:hover, #B7-Label:hover, #B8-Label:hover {
  fill: hsl(0,100%,40%);
  stroke: hsl(0,100%,20%);
  opacity: 50%;
  stroke-width: 1px;
  transition: fill 0.4s;
  paint-order="fill";
  clip-rule:evenodd;
  fill-rule:evenodd;
  stroke-linejoin:round;
  stroke-miterlimit:2
}

#C1, #C2, #C3, #C4, #C5, #C6, #C7, #C8, #C9, #C10, #C11, #C12, #C1-Label, #C2-Label, #C3-Label, #C4-Label, #C5-Label, #C6-Label, #C7-Label, #C8-Label, #C9-Label, #C10-Label, #C11-Label, #C12-Label {
  fill: hsl(240, 100%, 20%);
  opacity: 0%;
  stroke: black;
  stroke-width: 0px;
  paint-order="fill";
  clip-rule:evenodd;
  fill-rule:evenodd;
  stroke-linejoin:round;
  stroke-miterlimit:2
}

#C1:hover, #C2:hover, #C3:hover, #C4:hover, #C5:hover, #C6:hover, #C7:hover, #C8:hover, #C9:hover, #C10:hover, #C11:hover, #C12:hover, #C1-Label:hover, #C2-Label:hover, #C3-Label:hover, #C4-Label:hover, #C5-Label:hover, #C6-Label:hover, #C7-Label:hover, #C8-Label:hover, #C9-Label:hover, #C10-Label:hover, #C11-Label:hover, #C12-Label:hover {
  fill: hsl(240,100%,40%);
  stroke: hsl(240,100%,20%);
  opacity: 50%;
  stroke-width: 1px;
  transition: fill 0.4s;
  paint-order="fill";
  clip-rule:evenodd;
  fill-rule:evenodd;
  stroke-linejoin:round;
  stroke-miterlimit:2
}

#D1, #D2, #D3, #D4, #D1-Label, #D2-Label, #D3-Label, #D4-Label {
	fill: hsl(120, 100%, 20%);
	opacity: 0%;
	stroke: black;
	stroke-width: 0px;
	paint-order="fill";
	clip-rule:evenodd;
	fill-rule:evenodd;
	stroke-linejoin:round;
	stroke-miterlimit:2
  }
  
  #D1:hover, #D2:hover, #D3:hover, #D4:hover, #D1-Label:hover, #D2-Label:hover, #D3-Label:hover, #D4-Label:hover {
	fill: hsl(120,100%,40%);
	stroke: hsl(120,100%,20%);
	opacity: 50%;
	stroke-width: 1px;
	transition: fill 0.4s;
	paint-order="fill";
	clip-rule:evenodd;
	fill-rule:evenodd;
	stroke-linejoin:round;
	stroke-miterlimit:2
  }
  
 #E1, #E2, #E3, #E4, #E1-Label, #E2-Label, #E3-Label, #E4-Label {
  fill: hsl(60, 100%, 20%);
  opacity: 0%;
  stroke: black;
  stroke-width: 0px;
  paint-order="fill";
  clip-rule:evenodd;
  fill-rule:evenodd;
  stroke-linejoin:round;
  stroke-miterlimit:2
}

#E1:hover, #E2:hover, #E3:hover, #E4:hover, #E1-Label:hover, #E2-Label:hover, #E3-Label:hover, #E4-Label:hover {
  fill: hsl(60,100%,40%);
  stroke: hsl(60,100%,20%);
  opacity: 50%;
  stroke-width: 1px;
  transition: fill 0.4s;
  paint-order="fill";
  clip-rule:evenodd;
  fill-rule:evenodd;
  stroke-linejoin:round;
  stroke-miterlimit:2
}

 #S1, #S2, #S3, #S4, #S1-Label, #S2-Label, #S3-Label, #S4-Label {
  fill: hsl(180, 100%, 20%);
  opacity: 0%;
  stroke: black;
  stroke-width: 0px;
  paint-order="fill";
  clip-rule:evenodd;
  fill-rule:evenodd;
  stroke-linejoin:round;
  stroke-miterlimit:2
}

 
#F1, #F2, #F3, #F4, #F5, #F1-Label, #F2-Label, #F3-Label, #F4-Label, #F5-Label {
	fill: hsl(30, 100%, 20%);
	opacity: 0%;
	stroke: black;
	stroke-width: 0px;
	paint-order="fill";
	clip-rule:evenodd;
	fill-rule:evenodd;
	stroke-linejoin:round;
	stroke-miterlimit:2
  }
  
#F1:hover, #F2:hover, #F3:hover, #F4:hover, #F5:hover, #F1-Label:hover, #F2-Label:hover, #F3-Label:hover, #F4-Label:hover, #F5-Label:hover {
	fill: hsl(30,100%,40%);
	stroke: hsl(30,100%,20%);
	opacity: 50%;
	stroke-width: 1px;
	transition: fill 0.4s;
	paint-order="fill";
	clip-rule:evenodd;
	fill-rule:evenodd;
	stroke-linejoin:round;
	stroke-miterlimit:2
  }
  
 #S1:hover, #S2:hover, #S3:hover, #S4:hover, #S1-Label:hover, #S2-Label:hover, #S3-Label:hover, #S4-Label:hover {
  fill: hsl(180,100%,40%);
  stroke: hsl(180,100%,20%);
  opacity: 50%;
  stroke-width: 1px;
  transition: fill 0.4s;
  paint-order="fill";
  clip-rule:evenodd;
  fill-rule:evenodd;
  stroke-linejoin:round;
  stroke-miterlimit:2
}