html, body{
	margin: 10px 5 0 5;
	padding: 0;
	background-color: #e6e6cc;
	font-family: 'Roboto', sans-serif;
	color: black;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
}
.item1 {
	grid-area: spalte1;
	background-color: #cccc99;
	padding: 6px;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: Black;
}
.item2 {
	grid-area: spalte2;
	background-color: #92934b;
	padding: 6px;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: black;
}
.item3 {
	grid-area: spalte3;
	background-color: #cccc99;
	padding: 6px;
	font-family: 'Roboto', sans-serif;
	color: black;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
}
.item4 {
	grid-area: spalte4;
	background-color: #92934b;
	padding: 6px;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: White;
}
.item5 {
	grid-area: footer;
	background-color: #2E5E5D;
	padding: 6px;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: White;
}
.item6 {
	grid-area: footer2;
	background-color: #2E5E5D;
	padding: 6px;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: White;
}
.grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-areas:
  	'spalte1 spalte2 spalte3 spalte4'
	'footer footer footer footer'
	'footer2 footer2 footer2 footer2';
  grid-gap: 10px;
  background-color: #e6e6cc;
  }
.grid-container-index2 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-areas:
  	'spalte1 spalte1 spalte1 spalte1'
	'footer2 footer2 footer2 footer2';
  grid-gap: 10px;
  background-color: #0080d2;
  }
img{
	max-width: 100%;
	height: auto;
}
.title{
	font-family: 'Acme', sans-serif;
	font-size: calc(14px + (48 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: #FC8C08;
}
.text{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: White;
}
h1{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (42 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	color: ButtonFace;
}
h2{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (32 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	color: black;
}
h3{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (28 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	color: black;
}
h1.anzeigenseiten1{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (20 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	color: red;
}
h2.anzeigenseiten2{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	color: black;
}
h3.anzeigenseiten3{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	color: black;
}
a{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (20 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #1D3F3F;
	color: white;
	display: block;
	margin: 3px;
	padding: 3px;
}
a.mehr{
	font-family: 'Roboto', sans-serif;
	font-size: calc(12px + (14 - 12) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #FDFF4D;
	color: black;
	display: block;
	margin: 3px;
	padding: 3px;
}
a.mehr-top{
	font-family: 'Roboto', sans-serif;
	font-size: calc(12px + (14 - 12) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #0000FF;
	color: white;
	display: block;
	margin: 3px;
	padding: 3px;
}
a.ohne-hintergrund{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (28 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: transparent;
	color: black;
	display: block;
	margin: 3px;
	padding: 3px;
}
a.rubriken-links{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #005C5B;
	color: white;
	display: block;
	margin: 3px;
	padding: 3px;
}
a.kontaktanzeigen{
	float: left;
	width: 31%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #00C0BE;
	color: black;
	display: block;
	margin: 3px;
	padding: 3px;
	padding-top: 8px;
	min-height: 30px;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}
a.kontaktanzeigen-breit{
	float: left;
	width: 31%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #00C0BE;
	color: black;
	display: block;
	margin: 3px;
	padding: 3px;
	padding-top: 8px;
	min-height: 30px;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}
a.kontaktanzeigen-werbung{
	float: left;
	width: 31%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #007E7D;
	color: white;
	display: block;
	margin: 3px;
	padding: 3px;
}
a.kontaktanzeigen-werbung-breit{
	float: left;
	width: 31%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #007E7D;
	color: white;
	display: block;
	margin: 3px;
	padding: 3px;
}
.link-footer{
	float: left;
	width: 32%;
	background-color:#2929A5;
	background-image:linear-gradient( #252525 20%,#2e5e5d 95%);
	padding: 2%;
	color:white;
	margin: 3px;
	font-family: "Raleway", sans-serif;
	font-weight: normal;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	border-top-right-radius: 20px;
	border-top-left-radius: 20px;
	border-bottom-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border: 0.5px solid #ffffff;
	text-align: center;
	padding: 3px;
}

.zwei-nebeneinander{
	float: left;
	width: 47%;
	text-align: center;
}
.drei-nebeneinander{
	float: left;
	width: 30%;
	text-align: center;
}
.drei-nebeneinander-breit{
	float: left;
	width: 30%;
	text-align: center;
}
.um-anzeigenbild{
	float: none;
	width: 100%;
	margin-right: 6px;
	margin-bottom: 6px;
	font-family: 'Roboto', sans-serif;
	font-size: calc(12px + (14 - 12) * ((100vw - 320px) / (1600 - 320)));
}
.clear{
	clear: both;
}
.clear-handy{
	clear: none;
}
input{
	width: 96%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	margin-bottom: 5px;
}
textarea{
	width: 80%;
	height: 250px;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	margin-bottom: 5px;
}
textarea.backlinkbanner{
	width: 96%;
	height: 150px;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	margin-bottom: 5px;
}
select{
	width: 96%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	margin-bottom: 5px;
	background-color: White;
}
select.suche{
	width: 96%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	margin-bottom: 5px;
	background-color: White;
}
input.suche{
	width: 96%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	margin-bottom: 5px;
}
form{
	width: 98%;
}
.rubrikenueberschrift{
	background-color: #ff0000;
	margin: 3px;
	padding: 3px;
	margin-top: 10px;
	color: White;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
}
.ueberschrift{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (20 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: Red;
	margin: 3px;
}
.ueberschrift-top{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (20 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: Maroon;
	margin: 3px;
	padding: 3px;
	background-color: #4D41EF;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}
.um-topanzeigentext{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (20 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: black;
	margin: 3px;
	padding: 3px;
	background-color: #4D41EF;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}
.texthintergung-ueberschrift{
	background-color: #fdff4d;
	padding: 3px;
}
/* ABC Seiten */
.zwei-nebeneinander-abc{
	background-image: url(../files/abc_picture2.gif);
	background-position: left;
	background-repeat: no-repeat; 
	float: left;
	width: 44%;
	text-align: center;
	margin: 3px;
}
.bild-mitte-abc{
	float: left;
}
a.abc{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (28 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: transparent;
	color: black;
	display: block;
	margin: 3px;
	padding: 3px;
	border: 1px solid Black;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}
.nach-topanzeigen{
	background-color: red;
}
.um-b7-videos{
	float: left;
	width: 20%;
	min-height: 350px;
}
.um-backlinkbanner{
	float: left;
	width: 46%;
	background-color: #eecf42;
	margin: 3px;
	padding: 3px;
}
.um-backlinkbanner-einzeln{
	float: none;
	width: 96%;
}

/* ABC Seiten ende */
@media screen and (max-width: 1183px) {
.grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-areas:
  	'spalte1 spalte1 spalte2 spalte2'
	'spalte3 spalte3 spalte4 spalte4'
	'footer footer footer footer'
	'footer2 footer2 footer2 footer2';
  grid-gap: 10px;
  background-color: #e6e6cc;
  }
.grid-container-index2 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-areas:
  	'spalte1 spalte1 spalte1 spalte1'
	'footer2 footer2 footer2 footer2';
  grid-gap: 10px;
  background-color: #0080d2;
  }
  
 .title{
	font-family: 'Acme', sans-serif;
	font-size: calc(14px + (28 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: #FC8C08;
}
.text{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
	color: White;
}
a.kontaktanzeigen{
	float: left;
	width: 45%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(12px + (16 - 12) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #00C0BE;
	color: black;
	display: block;
	margin: 3px;
	margin-left: 1%;
	margin-bottom: 12px;
	padding: 3px;
	padding-top: 8px;
	min-height: 30px;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}
a.kontaktanzeigen-breit{
	float: none;
	width: 97%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #00C0BE;
	color: black;
	display: block;
	margin: 3px;
	margin-left: 1%;
	margin-bottom: 12px;
	padding: 3px;
	padding-top: 8px;
	min-height: 30px;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}
a.kontaktanzeigen-werbung{
	float: left;
	width: 45%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #007E7D;
	color: white;
	display: block;
	margin: 3px;
	margin-bottom: 12px;
	padding: 3px;
}
a.kontaktanzeigen-werbung-breit{
	float: none;
	width: 96.5%;
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #007E7D;
	color: white;
	display: block;
	margin: 3px;
	padding: 3px;
}
.clear-handy{
	clear: both;
}
.um-anzeigenbild{
	float: left;
	width: 47%;
	margin-right: 6px;
	margin-bottom: 6px;
}
.drei-nebeneinander{
	float: left;
	width: 47%;
	text-align: center;
}
.drei-nebeneinander-breit{
	float: none;
	width: 96%;
	text-align: center;
}
.zwei-nebeneinander{
	float: none;
	width: 96%;
	text-align: center;
}
.zwei-nebeneinander-abc{
	background-image: url(../files/abc_picture2.gif);
	background-position: left;
	background-repeat: no-repeat; 
	float: left;
	width: 33%;
	text-align: center;
	margin: 3px;
}

a.rubriken-links{
	font-family: 'Roboto', sans-serif;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	text-decoration: none;
	background-color: #005C5B;
	color: white;
	display: block;
	margin: 6px;
	padding: 3px;
}
.um-b7-videos{
	float: left;
	width: 45%;
	min-height: 350px;
}
}
@media screen and (max-width: 1080px) {
.link-footer{
	float: left;
	width: 30%;
	background-color:#2929A5;
	background-image:linear-gradient( #252525 20%,#2e5e5d 95%);
	padding: 2%;
	color:white;
	margin: 3px;
	font-family: "Raleway", sans-serif;
	font-weight: normal;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	border-top-right-radius: 20px;
	border-top-left-radius: 20px;
	border-bottom-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border: 0.5px solid #ffffff;
	text-align: center;
	padding: 3px;
}

}
@media screen and (max-width: 1060px) {
	.grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-areas:
  	'spalte1 spalte1 spalte1 spalte1'
	'spalte2 spalte2 spalte2 spalte2'
	'spalte3 spalte3 spalte4 spalte4'
	'spalte4 spalte4 spalte4 spalte4'
	'footer footer footer footer'
	'footer2 footer2 footer2 footer2';
  grid-gap: 10px;
  background-color: #e6e6cc;
  }
  .um-anzeigenbild{
	float: none;
	width: 100%;
	margin-right: 6px;
	margin-bottom: 6px;
	font-family: 'Roboto', sans-serif;
	font-size: calc(12px + (14 - 12) * ((100vw - 320px) / (1600 - 320)));
}
}
@media screen and (max-width: 1060px) {
	.grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-areas:
  	'spalte1 spalte1 spalte1 spalte1'
	'spalte2 spalte2 spalte2 spalte2'
	'spalte3 spalte3 spalte3 spalte3'
	'spalte4 spalte4 spalte4 spalte4'
	'footer footer footer footer'
	'footer2 footer2 footer2 footer2';
  grid-gap: 10px;
  background-color: #e6e6cc;
  }
  .um-anzeigenbild{
	float: none;
	width: 100%;
	margin-right: 6px;
	margin-bottom: 6px;
	font-family: 'Roboto', sans-serif;
	font-size: calc(12px + (14 - 12) * ((100vw - 320px) / (1600 - 320)));
}
}
@media screen and (max-width: 450px) {
.link-footer{
	float: left;
	width: 45%;
	background-color:#2929A5;
	background-image:linear-gradient( #252525 20%,#2e5e5d 95%);
	padding: 2%;
	color:white;
	margin: 3px;
	font-family: "Raleway", sans-serif;
	font-weight: normal;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
	border-top-right-radius: 20px;
	border-top-left-radius: 20px;
	border-bottom-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border: 0.5px solid #ffffff;
	text-align: center;
	padding: 3px;
}