*{
	margin: 0;
	padding: 0;
	text-decoration: none;
	list-style: none;
	box-sizing: border-box;
}
*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box; 
}
html{
	font-size: 63.5%;
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}
body, html{
	height: 100%;
	width:100%;
	font-size: 10px;
	line-height: 13px;
}
body{
	font-family: "Arsenal";	
	hyphens: auto; 
	background: whitesmoke;
}
.page {
	display: flex;
	width: 100%;
	flex-direction: column;
	justify-content: center;
	background: whitesmoke;
	max-width: 1080px;
	margin: 0 auto;
	padding: 0;
      }
.sitehead {
	display: flex;
	flex-direction:row;
	width: 100%;
	margin: 0rem 0rem 0rem 0rem;
	flex-wrap: wrap;
	justify-content: center;
	align-content: flex-start;
	align-items: center;
      }
.logo {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100px;
	margin: 0 2rem 0 0;
      }
.sitename {
	display: flex;
	justify-content: center;
      }
header, main, footer {
	display: flex;
	width: 100%;
      }
      header {
	height: 140px;
      }
.logo img {
	max-width: 180px;
	min-width: 119px;
	width: 70%;
      }
.content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	height: 100%;
	max-width: 1080px;
	background: url(../images/bckgrd_Baustelle.jpg) no-repeat;
	background-position: center;
	background-size: 100% 100%;
	padding: 0rem;
	color: rgba(255,255,255,1.0);
	background-position: center;
	border-radius: 1rem;
      }


main {
	display: flex;
	width: 100%;
      }
.content-inner {
	display: flex;
	width: 100%;
	flex-direction: column;
	margin: 6rem 0rem 0 0;
	padding: 2rem;
}
a.button {
  padding: 11px 24px;
  border: 1px outset buttonborder;
  border-radius: 19px;
  color: rgba(255,255,255,0.8);
  background-color: #4C44A5;
  text-decoration: none;
  font-size: 1.8rem;
  width: 145px;
  display: flex;
  justify-content: center;
  margin-top: 3rem;
}
a.button:hover{
	background-color: rgba(255,255,255,0.8) !important;
      }
.stiftbox{
	display: flex;
	width: 29%;
}
footer{
	flex-direction: column;
}
.copyright {
	display: flex;
	padding: .3rem;
	color: darkslategray;
	font-size: 0.51rem;
	flex-direction: column;
	justify-content: center;
}

/** Mittelgroße Monitore: Inhalte in zwei Spalten **/
@media (min-width: 376px) {

	.page {
		padding:0 4%;
	      }

}
@media (min-width: 466px) {

header {
	height: 120px;
	}
.sitehead {
	justify-content: space-between;
      }

}
/** Mittelgroße Monitore: Inhalte in zwei Spalten **/
@media (min-width: 720px) {
	.page {
		height:100vh;
		}
	.sitehead {
		flex-direction: row;
		margin: 0rem 5rem 0rem 5rem;
		justify-content: space-between;
		}

}


/** Mittelgroße Monitore: Inhalte in drei Spalten **/
@media (min-width: 800px) {
.content {
	flex-direction: row;
	align-items: center;
	padding: 5rem;
	      }
.content-inner {
	display: flex;
	width: 55%;
	flex-direction: column;
	margin: 0 1rem 0 0;
	padding: 2rem;
	}
}