@import url(https://fonts.googleapis.com/css?family=Lato:300,400,700|Sacramento|Jost:300|Tajawal:wght@300&display=swap|Six+Caps|Cardo:400italic,700);

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

body {
	font-family: 'Tajawal', sans-serif;
	color: #64696a;
	background-color: rgba(204, 153, 0, 0.05);
}

a {
	text-decoration: none;
	color:#666;
}

a:hover, a:focus {
	color: #333;
}

.body-header {
max-width:990px;
height:675px;
position: relative;
margin: 0 auto 80px;
padding: 3em 1em;
color: #000;
text-align: center;
background-image: url('/img/schule.jpg');
background-position: 50% 50%;
background-color: blanchedalmond;
background-size: cover;
opacity: 0.8;
border-left: 30px solid blanchedalmond;
border-right: 30px solid blanchedalmond;
border-bottom: 50px solid blanchedalmond;
border-top: 30px solid blanchedalmond;}

.title {
	display:block;
	text-align:center;
	margin-bottom:5em;
	margin-top: -1em;
}
	
.title h1 {
	font-family: 'Lato', Arial, sans-serif;
	font-size: 160%;
	font-weight: 400;
	color:black;
	line-height: 2em;
	opacity:1;
}

.title h2 {
	font-family: 'Lato', Arial, sans-serif;
	color:saddlebrown;
	font-weight:400;
	text-transform:uppercase;
	opacity:1;

}

.middot {
	font-size:140%;
	color:blue;
}

h2 {
	font-family: 'Lato', Arial, sans-serif;
	color:#000;
	font-weight:400;
}

.pre {width:98%;padding:0 5% 0;line-height:30px;text-align:center;}

.prew1 {font-size: 21px;padding: 0 15px 24px 15px;}
.prew2 {font-size: 21px;padding: 70px 15px 50px 15px;}

.footer {
font-family: 'Jost', Arial, sans-serif;
position: relative;
display: block;
width: 80%;
margin: 300px auto 50px;
border:1px solid #000;
text-align: left;
padding: 30px;}

.footer img {
width: 100%;
display: block;
opacity: 0.8;
border-left: 30px solid blanchedalmond;
border-right: 30px solid blanchedalmond;
border-bottom: 50px solid blanchedalmond;
border-top: 30px solid blanchedalmond;
}

p.fphoto {
margin: 0px auto 50px;
padding: 15px 20px;
}

p.dphoto {
font-size:85%;
font-style:italic;
}


@media screen and (max-width: 810px) { 
.body-header {margin: 0 auto 80px;}
.prew1 {font-size: 19px;padding: 0 15px 5px 8px;}
.prew2 {font-size: 18px;padding: 35px 15px 10px 8px;}
h1, h2 {
font-size: 115%;}
.footer {
width:90%;
}
.footer img {
width: 100%;
display: block;
opacity: 0.8;
border-left: 10px solid blanchedalmond;
border-right: 10px solid blanchedalmond;
border-bottom: 15px solid blanchedalmond;
border-top: 10px solid blanchedalmond;
}
p.fphoto {
margin: 0px auto 50px;
padding: 0;
}


}