/* DATEI: main.css */

h1,h2,h3,h4,p,ul,ol,li,div,td,th,address,blockquote,nobr,b,i {
 font-family:Arial,sans-serif; }

h1 { font-size:48px; margin-bottom:18px; "color:white"; }

h2 { font-size:21px; margin-bottom:18px; "color:white"; }

h3 { font-size:16px; margin-bottom:16px; "color:white"; }

body {background-color: white;}

/* Table */
table, th, td   {
     border: 1px solid black;
     padding: 12px;
     border-spacing: 10px;
     vertical-align: center;
     text-align: center;    
}

th {
  background-color: #000080;
  color: white;
}

td:hover {border: 2px solid #777}

div {
  border: 5px #2E9AFE;
  padding: 1px;
  font-weight: bold;
  margin: 1px; 
}

.grid-container {
  display: grid;
  grid-template-columns: 99vw;
  grid-template-rows: 99vh;
  justify-items: center;
  align-items: center;
  margin-left: -5px;
  margin-top: -17px;
  padding-top: 0px;
}

img {
  max-width: 99%;
  height: 98%;
  object-fit: scale-down;
  border-radius: 8%;
}

.flex-container {
  display: flex;
  background-color: #2E9AFE;
}

.flex-container > div {
  background-color: #2E9AFE;
  margin: 10px;
  padding: 10px;
  font-size: 30px;
  font-weight: bold;
  border: 1px #DF013A;
  color: white;
}

/* Horizontal Menu Bar */

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #333;
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0;
}

li {
  float: left;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover {
  background-color: #111;
}

.active {
  background-color: #0000CD;
}