/*<!style>*/
@font-face {
  font-family:"NotoSans Regular";
  src: url(../Fonts/NotoSans-Regular.ttf) format("truetype");
}
@font-face {
  font-family:"NotoSans Bold";
  src: url(../Fonts/NotoSans-Bold.ttf) format("truetype");
}
@font-face {
  font-family:"NotoSans Italic";
  src: url(../Fonts/NotoSans-Italic.ttf) format("truetype");
}

body {
    margin:0; padding:0; border:0;
    font: normal normal normal 1rem "NotoSans Regular", sans-serif;
}

main {margin:auto; padding:0; border:0;}

#canvasMap  {position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index:8;}
nav         {position: absolute; top: 0; right: 20px; z-index:9;}
.bw {filter: grayscale(75%) contrast(75%) brightness(1.25);}

.ol-popup-content li {margin-left:0; padding-left:4;}
.ol-popup-content {
    margin-right:2px;
    font: 1rem/1.5 "NotoSans Regular", sans-serif;
	text-align:left;
	color:#335;
	background-color:#FFD;
	border-radius: 8px;
	box-shadow: 8px 4px 8px rgba(0, 180, 180, 0.4);
	list-style-type: circle;
}

header {
    position: absolute; top: 10rem; right: 0; bottom: 0; left: 0; z-index:9;
    display:flex;
}
header a {text-decoration:none; color:black;}

article {
    flex-basis: auto; display:flex; flex-direction: column; margin:auto; max-width:52rem;
    background-color:#fefffe; background-color:rgba(154,202,60,0.9);
}
article:hover {background-color:rgb(154,202,60); background-color:rgba(154,202,60,0.7);}
.EYRlogo {align-self: center; flex-basis: auto; margin: 0.1rem 2rem; padding:1rem 0 0 0; }
h2 {align-self: center; flex-basis: auto; margin:0; padding:0; font-size:1.2rem; font-weight:normal; color:rgb(183,221,255);}
div.p1  {align-self: center; flex-basis: auto; padding:0.8rem 0;}
span.p1 a  {font-weight:bold; font-size:2rem; font-family:Courier; color:#ffa52f; text-shadow: 2px 2px black; padding:0;}
span.p1 a:hover  {text-shadow: 2px 2px white;}
.p2  {align-self: center; flex-basis: auto; padding:0; }
.p3  {align-self: center; flex-basis: auto; padding:0.1rem 0 0.5rem 0; }
.p3 a {color:black;}

.whiterule {width:100%; height:0.8rem; padding:0; margin:0;  border:none; background-color:white; background-color:rgba(250,255,250,0.1);}
hr {width:100%; height:0.8rem; padding:0; margin:0;  border:none; background-color:white;}
footer {display:flex; flex-direction: row; margin:auto; height:6rem; padding:0; border:none;
    background-color:#aaee33; background-color:rgba(154,202,60,0.8);}
.choice {align-self: center; flex-basis: auto; background: radial-gradient(rgb(154,202,60), rgb(50,41,59)); border-radius:50%; color:white;}
.choice a {text-decoration:none; color:black;}
.choice:hover {background: radial-gradient(rgb(50,41,59), rgb(154,202,60)); color:white;}
.choice:hover a {text-decoration:none; color:white;}
.choice {margin:1rem auto; padding:1rem; vertical-align:middle;}
.title_initiative {
    width:35rem;
    align-self: center;
    background-color:rgb(154,202,60); background-color:rgba(154,202,60,0);
    background-image:url("Data/EYR_train_870x156.png");
    background-size: 35rem;
}
.title_initiative:hover {background-image:none;}
.t1 {padding: 0.3rem 0 0 2.8rem;}
.t1 b {font-size:1.52rem; line-height: 1.8; color:#efe; background-color:rgb(50,41,59);}
.t2 {padding: 0.33rem 0 1.5rem 2.5rem;}
.t2 i {font-size:1.1rem; color:#fff; background-color:rgb(48,133,161);}

/*</style>*/