@charset "utf-8";

body {
	background-color: rgba(206, 204, 204, 1);
	color: rgba(66, 128, 149, 1);
	font-family: Montserrat;
	font-weight: 400;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	width: 99%;
	justify-content: center;
	align-content: center;
	align-items: center;
	align-self: center;
	color: navy;
	font-size: 1em;
	background-image: url(bilder/bg4.jpg);
	background-size: cover;
}
h1, h2, h3, h4 {
		font-family: Montserrat;
		text-align: center !important;
			justify-content: center;
	align-content: center;
		font-weight: 300;
}
h1 {
	text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4);
	font-size: 60pt;
	display: flex;
	font-weight: 300;
	margin-bottom: 0px;
	margin-top: 0px;
}
h2 {
	font-size: 1.6em
}
.outerhigh, .innerhigh, .outerwide, .innerwide, .outersquare, .innersquare {
	border:2px solid rgba(0, 0, 0, 1);
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}
.outerhigh, .outerwide, .outersquare {
	margin: 10px;
	color: navy;
	font-weight: 400;
	background-color: rgba(255, 255, 255, 1);
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);
	padding-bottom: 5px;
	font-size: 18pt;
}
.innerhigh, .innerwide, .innersquare {
	background-color: rgba(157, 99, 129, 1);
	background-size: cover;
	background-repeat: no-repeat;
	background-clip: content-box;
	margin-top: 10px;
	filter: saturate(110%) contrast(110%);
  -webkit-filter: saturate(110%) contrast(110%);

}
.outerhigh {
	width: 400px;
	height: 600px;
}
.innerhigh {
	width:	360px;
	height:	530px;
}
.outerwide {
	height:	600px;
	width:	900px;
}
.innerwide {
	height:	530px;
	width:	860px;
}
.outersquare {
	height: 500px;
	width:480px;
}
.innersquare {
	height:	430px;
	width:	430px;
}

.kontakt {
	position: absolute;
	transform: rotate(45deg);
	background-color: rgba(0,0,0,0.0);
	font-size: 30pt;
	padding: 30px;
	width: 560px;
	height: 100px;
	z-index: 999;
	text-align: center;
	font-weight: 600;
	color: rgba(0,0,0,0.1);
	text-shadow: 2px 2px 2px rgba(255,255,255,0.4);
	border:0px solid rgba(0,0,0,0.4);
	display: none;
	visibility: hidden;
}
div:nth-of-type(2n) {
	transform: rotate(-4deg) translate(-25px, 10px);

}
div:nth-of-type(3n) {
	transform: rotate(6deg) translate(25px, -14px);
}
div:nth-of-type(5n) {
	transform: rotate(6deg) translate(-50px, -30px);
}
div:nth-of-type(6n) {
	transform: rotate(3deg) translate(25px, -30px);
}
div:nth-of-type(7n) {
	transform: rotate(-12deg) translate(-15px, -30px);
}
div:nth-of-type(10n) {
	transform: rotate(-8deg) translate(-5px, 10px);
}
div:nth-of-type(17n) {
	transform: rotate(1deg) translate(-5px, -10px);
}
div:nth-of-type(21n) {
	transform: rotate(3deg) translate(25px, -30px);
}
div:nth-of-type(25n) {
	transform: rotate(-3deg) translate(25px, -30px);
}
.outerhigh:hover, .outerwide:hover, .outersquare:hover {
	transform: rotate(0deg) translate(0px, 0px);
	z-index: 999;
}
#kontakta {
	display: flex;
	width: 600px;
	flex-direction: column;
	align-items: center;
	align-self:center;
	margin:0 auto;
	margin-top: 100px;
	margin-bottom:30px;
	transform: rotate(2deg) translate(-50px, 0px);
	color: rgba(0,0,0,0.3);
	background-color: rgba(0,0,0,0.1);
	padding:40px;
	padding-top:20px;
	border:3px solid rgba(0,0,0,0.3);
	font-family: Montserrat;
}
#kontakta span {
	white-space: nowrap;
}
#kontakta a {
	color: rgba(0,0,0,0.3);
	text-decoration: none;
}
h2 a:hover {
	text-decoration: none;
}
p {
	white-space: pre-wrap;
	width: 60%;
	text-align: center;
	margin-bottom:0px;
	font-size: 1.5em;
}
#bilder {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
}
