@charset "utf-8";

/* CSS Document */



.block {

	margin-left:2em;

	margin-top: 2em;

	}

	

body {

	margin-left: auto;

	margin-right: auto;

	margin-top:5em;

	width: 40%;

	background-repeat: no-repeat;

	background-position: center top;

	font-family: Arial, Helvetica, sans-serif;

	font-size: 16px;

	line-height: 18px;

	color: #666666;

}



.box-center {

	border: 1px solid #707070;

}	



.box-center a {

	color:#999999;

	text-decoration:none;

}	



.box-center a:hover {

	color: #ACACAC;

}	



.parent1 {

display: grid;

grid-template-columns: repeat(2, 1fr);

grid-template-rows: 1fr;

grid-column-gap: 0px;

grid-row-gap: 0px;

}



.left-grid {

	grid-area: 1 / 1 / 2 / 2;

	padding-top: 2em;

	padding-left: 2em;

}

.right-grid {

	grid-area: 1 / 2 / 2 / 3;

	background-image: url(../images/friseurin-simon-held-lemgo.jpg);

	background-size: 100%;

	background-position: left;

	background-repeat: no-repeat;

	width: 100%;

	height: auto;

}



.text-box {

	margin: 2em;

}



.text {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 16px;

	font-weight: 200;

	color: #333333;

}

.logo {

	width: 60%;

	height: auto;

	clear: both;

}



.logo2 {

	width: 30%;

	height: auto;

	clear: both;

}



.slogan {

	margin-top: 7em;

	margin-bottom: 1em;

	width: 80%;

	height:auto;

}



.footer {

	padding-right: 2em;

	padding-left: 2em;

	background-color: #6f7072;

	border-top-width: 0px;

	border-right-width: 1px;

	border-bottom-width: 1px;

	border-left-width: 1px;

	border-top-style: solid;

	border-right-style: solid;

	border-bottom-style: solid;

	border-left-style: solid;

	border-right-color: #707070;

	border-bottom-color: #707070;

	border-left-color: #707070;

	font-family: Arial, Helvetica, sans-serif;

	font-size: 16px;

	font-weight: normal;

	color: #FFFFFF;

}	



.footer a {

	color: #FFFFFF;

	text-decoration: none;

}



.footer a:hover {

	color: #999999;

	text-decoration: none;

}


.parent {

display: grid;

grid-template-columns: repeat(4, 1fr);

grid-template-rows: ;

grid-column-gap: 7px;

grid-row-gap: 2px;

}



.div1 { grid-area: 1 / 1 / 2 / 2; }

.div2 { grid-area: 1 / 2 / 2 / 3; }

.div3 { grid-area: 1 / 3 / 2 / 4; }

.div4 { grid-area: 1 / 4 / 2 / 5; }



@media (min-width: 300px) and 
  (max-width: 1300px) {

body {
	margin-left: auto;
	margin-right: auto;
	margin-top:5em;
	width: 90%;
	background-repeat: no-repeat;
	background-position: center top;
}

.right-grid {

	grid-area: 1 / 2 / 2 / 3;
	background-image: url(../images/friseurin-simon-held-lemgo.jpg);
	background-size: 80%;
	background-position: right;
	background-repeat: no-repeat;
	width: 100%;
	height: auto;

}

}

@media (min-width: 1300px) and 
  (max-width: 1500px) {

body {
	margin-left: auto;
	margin-right: auto;
	margin-top:5em;
	width: 75%;
	background-repeat: no-repeat;
	background-position: center top;
}

.right-grid {
	grid-area: 1 / 2 / 2 / 3;
	background-image: url(../images/friseurin-simon-held-lemgo.jpg);
	background-size: 80%;
	background-position: right;
	background-repeat: no-repeat;
	width: 100%;
	height: auto;
}
}