﻿/*Common Style*/
*, ::before, ::after {
  box-sizing: border-box;
}

body {
  margin: 0 auto;
  padding: .2em .5em .2em .5em;
  font: normal 1em Arial, sans-serif;
  color: white;
  background-color: black;
  background-image: url("Pictures/Mond.jpg");
  background-attachment: fixed;
  background-size: cover;
  height: auto; 
  bottom: auto; 
  width: auto;
}

header {
	padding: 0 .5em 0 .5em; /*top, right, bottom, left */
  background-color: #211F1E;
  opacity: 0.95;
  font-family:Arial, Helvetica, sans-serif;
  border-radius: .7em;
  width: 100%;
}

table, th, tr, td{
	border-collapse: collapse;
	border: none;
}

.User {
  border-radius: .7em;
  transition: transform 0.2s ease-in-out;
}

.User:hover {
  transform: scale(0.9);    
}

main {
	margin: .2em 0 0 0;
  padding: .5em .5em .5em .5em;
  border-style: solid;
  border-radius: .7em;
  background-color: rgba(33, 31, 30, 0.5);
  border-color: rgba(33, 31, 30, 0.5);  /*rgba(33, 31, 30, 1) corresponds to #211F1E;*/
  border-width: medium;
  /*height: calc(100vh - 4em);*/
  height: calc(100vh - 113px);
  overflow-y: auto;
}

footer {
	margin: .2em 0 0 0;
  padding: .5em .5em .1em .5em; /*top, right, bottom, left */
  border-radius: .7em;
  background-color: #211F1E;
  opacity: 0.95;
  height: 3em;
}

a {
	color: white; 
	border-color: white;
	text-decoration: none;
	background-color: transparent;
}
a:link, a:visited, a:active, a:hover {
  color: white;
  background-color: transparent;
}

/* ====================================================  LAYOUT  ==================================================== */
/*@media screen and (min-width: 35em) { }

@media screen and (min-width: 55em) { }
*/