body {
  background-color: #FDE2BA;
  color: #191919;
  border-style: none; 
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  line-height: 1;
  font: inherit;
  }


hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 2px dotted #ffffff;
}

 /* ==========================================================================
https://matthewjamestaylor.com/responsive-font-size#fluid

Screen width 	Font size
320px -- 16px (eg: iPhone 4 & 5) 
768px -- 18px (eg: iPad portrait) 
1024px - 19px (eg: iPad landscape)
1280px - 20px
1536px - 21px
1920px - 23px
2560px - 25px
 ========================================================================== */

html {
    font-size: calc(15px + 0.290625vw);
	font-family: 'Lato', sans-serif; 
	
}

h1, h2, h3 {
	font-family: sans-serif; 
	font-weight:600;
	line-height: 1.2em;
	margin-top: 1em;
	}

p, h5, h4 {
	font-family: sans-serif; 
	font-weight:400;
	line-height: 1.5em;
	}

h1 {
    color: #ffffff;
	font-size: 3.1rem;
	letter-spacing: -1.8px;
}
h2 {
    font-size: 1.5rem;
	letter-spacing: -0.8px;
}
h3 {
    font-size: 1.2rem;
}

h4 {
    font-size: 1.5rem;
}
h5 {
    font-size: 1.2rem;
}

p {
    font-size: 1rem;
}

a {
	color: #00939D;
	text-decoration: none;
}

a:visited {
	color: #888888;
}

a:hover, a:focus {
	text-decoration: underline;
}



.container-top {
  display: inline-block;
  position: relative;
  left: 0;
  width: 100%;
    z-index: 0;
    margin-top: 0px;
background-color: #009293; }
    

.container-menue {
  display: inline-block;
  position: relative;
  left: 1vw;
  width: 100%;
    z-index: 9999;
    margin-top: -6vh; 
}


.container-center {
  display: inline-block;
  position: relative;
  left: 3%;
  right: 3%;
  width: 94%;
background-color: #FDE2BA; }


.container-left {
  display: inline-block;
  position: relative;
  left: 5%;
  right: 5%;
  width: 90%;
background-color: #FDE2BA; }

@media (min-width: 990px) {
    .container-left {
      float: left;
      /*position: fixed;*/
      left: 3%;
      right: 0;
      top: 0;
      width: 45%; } 
}	  

	 
.container-right {
  display: inline-block;
  position: relative;
  left: 5%;
  right: 5%;
  width: 90%;
  background-color: FDE2BA; }

@media (min-width: 990px) {
    .container-right {
      float: left;
      /*position: fixed;*/
      left: 5%;
      right: 0;
      top: 0;
      width: 45%; }
}	  
 
.container-bottom {
  display: inline-block;
  position: relative;
  left: 0;
  width: 100%;
	margin-top: 4em;
  
background-color: #F0D6B1; }
    

    

/* BUTTON https://fdossena.com/?p=html5cool/buttons/i.frag  */

a.button{
  display:inline-block;
  width:99%;
  padding:0.5em 1.2em;
  margin:0;
  border:0.16em solid rgba(255,255,255,0);
  border-radius:10px;
  box-sizing: border-box;
  text-decoration:none;
  font-family:'Roboto',sans-serif;
  font-weight:300;
  color:#FFFFFF;
  font-size: 90%;
  text-shadow: 0 0.04em 0.04em rgba(0,0,0,0.35);
  text-align:center;
  transition: all 0.2s;
}
a.button:hover{
  border-color: rgba(255,255,255,1);
  cursor: pointer;
}
@media all and (max-width:45em){
  a.button{
    display:block;
    margin:0.2em auto;
  }
}

  
@media screen and (max-width: 600px)  {
.hidden {
  display: none;
}
  }
