@font-face {
    font-family: 'Calibri';
    src: url('/font/calibri-regular.ttf');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Calibri';
    src: url('/font/calibri-bold.ttf');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}



* {
  box-sizing: border-box;
}
.item {
  display: inline-block;
}
/* on PC */
@media screen and (min-width: 1000px) {
  .featured-image {
    float: right;
    width: 44%;
    padding-right: 15px;
  }
  .featured-image img {
    width: 100%;
  }
  .description {
    float: left;
    width: 56%;
  }
#inhalt {
	font-size: 16pt;
	display: block;
	margin-right: 6%;
  }
h2 {
	font-size: 32pt;
	font-weight: bold;
	color: #00c1e1;
	margin-top: 20px;
	margin-bottom: 10px;
  }
}

/* on Mobile */
@media screen and (max-width: 1000px) {
  .featured-image {
    width: 100%;
  }
  .featured-image img {
    width: 100%;
  }
  .description {
    width: 100%;
  }
#inhalt {
	font-size: 36pt;
	display: block;
	margin-right: 6%;
  }
h2 {
	font-size: 44pt;
	font-weight: bold;
	color: #00c1e1;
	margin-top: 20px;
	margin-bottom: 10px;
  }
}




html {
	font-size: 100%;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

button,
input,
select,
textarea {
	font-family: Calibri;
}

body {
	color: #000000;
	line-height: 1.3;
	margin: 0;
	font-family: Calibri;
}






#hauptbereich {
	left: 0px;
	right: 0px;
	position: absolute;
}


#name {
	position: absolute;
	left: 8%;
	right: 0;
}

h1 {
	font-size: 50pt;
	font-weight: bold;
	color: #00c1e1;
	margin-top: 20px;
}



#punkte {
	position: absolute;
	width: 100%;
	height: 120px;
	top: 100px;
}

#band {
	position: absolute;
	left: 8%;
	right: 0;
	top: 12px;
	height: 64px;
	background-color: #00c1e1;
	color: #ffffff;
	padding-left: 10px;
	font-family: Calibri;
	font-size: 16pt;
}


#wrapper{
	position: absolute;
	left: 8%;
	right: 0;
	top: 250px;
	background-color: #ffffff;
}





td{
	font-family: Calibri;
	font-size: 16pt;
}


#fusszeile{
	width: 100%;
	height: 100px;
	margin-left: 0px;
	padding-top: 63px;
	padding-bottom: 0px;
	color: #000000;
	font-family: Calibri;
	font-size: 12pt;
	display: block;
	clear: both;
}

#fusszeile2{
	width: 100%;
	height: 0px;
	margin-top: 0px;
	margin-left: 0px;
	padding-top: 63px;
	padding-bottom: 0px;
	margin-bottom: 90px;
	color: #000000;
	font-family: Calibri;
	font-size: 12pt;
	display: block;
	clear: both;
}

#footerband{
	width: 100%;
	height: 8px;
	background-color: #00c1e1;
	margin-bottom: 3px;
}

.kachel {
	float: left;
	margin-bottom: 0px;
}

.kachelrechts {
	position: absolute;
	left: 450px;
	margin-left: 0px;
	top: 0px;
	margin-bottom: 0px;
}



#InfoJurist, #InfoLektor, #InfoSchriftleiter, #InfoKorrektor, #InfoProjektleiter, #InfoWebdesigner, #InfoBlogger, #InfoAutofahrer, #InfoSocial {
	max-width: 800px;
	padding-right: 50px;
	height: 220px;
	display: block;
}




a:link, a:visited, a:active 
{ 
	color: #00c1e1; 
	text-decoration: none;
}

a:hover 
{ 
	color: #00c1e1; 
	text-decoration: underline; 
}



a.navi:link, a.navi:visited, a.navi:active, a.navi:hover { 
	font-family: Calibri;
	font-size: 38pt;
	font-weight: 550;
	color: #ffffff;
	background-color: #00c1e1;
	border-bottom: none; 
	text-decoration: none; 
	padding-left: 5px;
	padding-right: 5px;
	margin-top: -5px;
	margin-bottom: -5px;
	margin-left: -70px;
	margin-right: 120px;
	line-height: 1.15em;
}



#foto {
	position: absolute;
	left: 52%;
	top: 225px;
	width: 20%;
}