﻿	body { background-color: #FFFFFF; }

	* {
	  margin: 0;
	  padding: 0;
	  box-sizing: border-box;
	}
	.page {
	  display: flex;
	  flex-wrap: wrap;
	}

	#kopf { width: 100%; background-color: #bcbaa4; }
	#logo {
	  position: relative;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%,-50%);
	}

	.col { width: 50%;  }

	#bild { width: 50vw; border-width: 2em 1em 2em 2em; border-style: solid; border-color: #FFFFFF; }
	#textbox { width: 50%; padding: 2em 2em 2em 1em; }
	#textfull { width: 100%; padding: 2em 2em 2em 1em; }
	#fintego { width: 100%; padding: 2em 2em 2em 2em; }

	h1 { font-family: "Times New Roman", Times, serif; color: #333333; font-weight: 200; font-size: 3vw; }
	h2 { font-family: "Times New Roman", Times, serif; color: #bcbaa4; font-weight: 200; font-size: 3vw; display: block; margin-top: 4vw; }
	h4 { font-family: "Times New Roman", Times, serif; color: #bcbaa4; font-weight: 200; font-size: 2vw; line-height: 120%; display: block; margin-top: 2vw; }
	.text { font-family: "Times New Roman", Times, serif; color: #333333; font-weight: 200; font-size: 1.5vw; line-height: 120%; display: block; margin-top: 2vw; }
	#subline, a { font-family: "Times New Roman", Times, serif; color: #bcbaa4; font-weight: 200; font-size: 1.5vw; line-height: 120%; }
	#subline { width: 100%; text-align: center; margin-top: 10vh; margin-bottom: 6vh; margin-left: auto; margin-right: auto; }

	/* Mobile Styles */
	@media only screen and (max-width: 400px) {
  	  .col { width: 100%; }
  	  #kopf { height: calc(85vw / 4); }
  	  #logo { width: 85vw; }
  	  #bild { width: 100vw; border-width: 0vw 0vw 4vw 0vw; }
  	  #textbox { width: 100vw; padding: 0vw 7.5vw 5vw 7.5vw; }
  	  h1 { font-size: 6vw; }
  	  h2 { font-size: 6vw; margin-top: 2vw; }
	  h4 { font-size: 4vw }
	  .text { font-size: 4vw }
	  #fintego { width: 100vw; padding: 0vw 7.5vw 5vw 7.5vw; }
	  #subline, a { font-size: 4vw }
  	  #subline { margin-top: 4vw }
	}

	/* Tablet Styles */
	@media only screen and (min-width: 401px) and (max-width: 960px) {
	  body {
	    background-color: #FFFFFF; /* Yellow */
	  }
  	  .col { width: 100%; }
  	  #kopf { height: calc(60vw / 4); }
  	  #logo { width: 60vw; }
  	  #bild { width: 100vw; border-width: 5vw 7.5vw 4vw 7.5vw; }
  	  #textbox { width: 100vw; padding: 0vw 7.5vw 5vw 7.5vw; }
  	  h1 { font-size: 5vw; }
  	  h2 { font-size: 5vw; margin-top: 2vw; }
	  h4 { font-size: 2.5vw }
	  .text { font-size: 2.5vw }
	  #fintego { width: 100vw; padding: 0vw 7.5vw 5vw 7.5vw; }
	  #subline, a { font-size: 2.5vw }
	  #subline { margin-top: 4vw }
	}

	/* Desktop Styles */
	@media only screen and (min-width: 961px) {
  	  #kopf { height: 10vh; }
  	  #logo { height: 6vh; }
	}