  <style type="text/css">

  /* OTHER */

  a color: blue        a.more: link, a.more: visited, a.more: active {  color: blue;  text-decoration: none;  }        a.more: hover {  color: #00548E;  text-decoration: none;  }

  body {  background-color: none;  }
  hr {   display: block;  margin-top: 0.5em;  margin-bottom: 0.5em;  margin-left: auto;  margin-right: auto;  border-style: inset;  border-width: 3px;  } 

  img {  border-radius: 8px;  }  p.no_space {  display: block;  margin-top: 0;  margin-bottom: 0;   margin-left: 0;  margin-right: 0;  }	
  /* CLASSES */        .button {  background-color: #99badd;   border: none;  color: white;  padding: 5px 10px;  text-align: center;  text-decoration: none;  display: inline-block;  font-size: 25px;  margin: 2px 2px;  cursor: pointer;  }        .mailbutton { 
  border-radius: 10px; 
  box-shadow: 0 8px 15px 0px #333333;
  }

  .flex-container {
  display: flex;
  height: 150px;
  justify-content: center;
  align-items: center;
  background-color: none;
  }

  .flex-container > div { /* '> div' selects all 'div' child elements of flex-container */
  background-color: none;
  width: 540px;
  margin: 0px;
  text-align: center;
  font-size: 30px;
  }  

  .mainheader {
  color: blue;
  font-size: 40px;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  text-align: center;
  }

  /* IDENTITIES */
  #imgf {  float: left;  }        #twopanels {	  max-width: 540px;	/* Sum of panel widths and gap */  margin-left: auto;  margin-right: auto;	  }		  #panell {  width: 250px;  margin-left: 5px;  margin-right: 30px;	/* Gap between panels */  float: left;  }		  #panelr {  width: 250px;  margin-left: 5px;  float: left;  }        #paneltext {  text-align: justify;  margin-top: 10px;  font-family: Arial, Helvetica, sans-serif;  font-size: 16px;  color: #000000;  margin-bottom: 10px  }  

  #headline {  width: 160px;  height: 30px;  text-align: center;  }        #topheader1 {  margin-top: auto;  margin-left: auto;  margin-right: auto;  width: 450px;  text-align: center;  font-family: Arial, Helvetica, sans-serif;  font-weight: bold;  color: #000000;  font-size: 25px;  }        #topheader2 {  max-width: 500px;  margin-top: 0;  margin-left: auto;  margin-right: auto;  padding-left: 10px;  padding-right: 10px;  text-align: justify;  font-family: Arial, Helvetica, sans-serif;  color: #000000;  font-size: 16px;  }        #orheader {  margin-top: 20px;  width: 245px;
  text-align: center;
  font-size: 20px;
  font-weight: bold;  font-family: Arial, Helvetica, sans-serif;  color: blue;  }	  #footer {  font-size: 10px;  font-family: Arial, Helvetica, sans-serif;  text-align: center;  }         #orfooter {  margin-top: auto;  margin-bottom: 20px;  text-align: left;
  font-size: 20px;  font-weight: bold;  font-family: Arial, Helvetica, sans-serif;  color: blue;  }              /* ORDERING IS IMPORTANT FOR THE FOLLOWING, ELSE INCORRECTLY APPLIED */
  /* DIV MENUBAR */  #menubar{ 
  width: 600px; 
  margin-left: auto; 
  margin-right: auto; 
  margin-top: 6px; 
  margin-bottom: auto;
  height: auto;
  text-align: center;
  }
  ul {  text-transform: uppercase;  text-align: left;  display: inline;   margin: 0;  padding: 17px 4px 15px 0;  list-style: none;  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);  }        ul li {  font: bold 16px/18px sans-serif;  display: inline-block;  margin-right: -5px;  position: relative;  padding: 18px 15px;  color: #6aa25d;  cursor: pointer;  transition: all 0.2s;  }    ul li:hover {  background: #87cefa;  color: #ffffff;  }  /* (A) FULL HEIGHT DOCUMENT */  html, body {  padding: 0;  margin: 0;  height: 100%;  }  /* (B) FLEXIBLE BOX ON BODY */  body {  display: flex;  flex-direction: column;  }  /* (C) ALLOW MAIN CONTENT SECTION TO AUTO-FILL HEIGHT */  #page-main { flex-grow: 1; }
  </style>