@media (min-aspect-ratio: 1300/867) {   /*  ########## overstretched ##########  */
html {
  background: #AAA url('images/bg_mywind2.jpg') no-repeat fixed center 35%;
  -webkit-background-size: 100% auto;
  -moz-background-size: 100% auto;
  -o-background-size: 100% auto;
  background-size: 100% auto;
  }
}
@media (max-aspect-ratio: 1300/867) {   /*  ########## original size of background photo ##########  */
html {
  background: #AAA url('images/bg_mywind2.jpg') no-repeat fixed center center;
  -webkit-background-size: auto 100%;
  -moz-background-size: auto 100%;
  -o-background-size: auto 100%;
  background-size: auto 100%;
  }
}

body {
  font-family: 'Montserrat', arial, serif;
 
  /* #### VARIABLES do not work for IE ##### */
  --lowerFooterPositionP: 7%;
  --lowerFooterPosition: 7vmin;
  --footerHeightP: 6.5%;
  --footerHeight: 6.5vmin;
  --footerTopP: 13.5%;  /* 7% + 6.5% */
  --footerTop: 13.5vmin; /* 7vmin + 6.5 vmin */
  --footerWidth: 90%;
}

/* ####################################### */
/* ########### Content-Bereich ########### */
/* ####################################### */

.content_zone {
	position: fixed;
	padding: 0;
	height: 80%;   /* important figure */
	height: 80vmin; /* important figure */
	bottom: 16%;  /* important figure */
	bottom: 16vmin; /* important figure */
	left: 50%;
	width: 90%;  /* changes require to correct margin-left! */
	margin-left: calc(90%/-2); /* Negative half of width! */
	border-radius: 6px;
	border-radius: 0.5vw;
	box-shadow: 2px 2px 3px black;

	float: none;
	background: rgba(20,20,20,1);
	background-color: rgba(245,245,245,1); /* COLOR of CONTENT WINDOW for ALL sites! */
	/* z-index: 0; */
}