body {
font-family: 'PT Sans', sans-serif;
font-weight: 300;
font-style: normal;
margin:0;
padding:0;
border:0;
background-color:#fff;
width:100%;
height:auto;
display:block;
text-align:center;
background-attachment: fixed;
background-size:cover;
background-repeat:repeat;
background-position:center;
margin:0px;
padding:0px;
letter-spacing:.045em;
font-size:18px;
-webkit-text-size-adjust: none;
text-size-adjust: none;
color: #827b77;
line-height: 1.4em;
top:0 !important;
text-align:left;
hyphens: auto;
hyphenate-limit-chars: 5 5 5;
-webkit-hyphenate-limit-chars: 5 5 5;
}


#lottie {
width: 400px!important;
top: 7vh!important;
left: 4%;
position: absolute;
}

header {
z-index:1000;
position:relative;
width:100%;
display:block;
height:auto;
text-align:center;
}

.headinner {
display:inline-block;
width:100%;
max-width:1600px;
position:relative;
text-align:left;
}

.slideshow {
position:relative;
z-index:1;
}

.ganzoben {
display: block;
width: 100%;
}

article {
padding-bottom: 100px;
text-align:center;
}

.logo img{
-webkit-user-drag: none;
-khtml-user-drag: none;
-moz-user-drag: none;
-o-user-drag: none;
user-drag: none;
}

h1 {
margin-top: 0px;
color: #0055a9;
font-size: 2.2em;
line-height: 1.3em;
}


.kontakt {
width: 35%;
height: auto;
display: inline-flex;
right:0;
position: absolute;
vertical-align: top;
}
.kontakt a {
vertical-align:middle;
}
.kontakt a span:before {
position: relative;
width: 16px;
height: 16px;
background-size: 15px;
margin-right:10px;
background-position:center;
background-repeat: no-repeat;
display:inline-block;
vertical-align:middle;
}

.kontakt a#telefon span:before {
content: " ";
background-image: url(../../media/tel-icon.png);

}
.kontakt a#email span:before {
content: " ";
background-image: url(../../media/mail-icon.png);

}

.logo {
width: 23%;
height: auto;
display: inline-flex;
margin-left:3%;
position: relative;
top: 35px;
z-index: 501;
}

.logo img {
width: 100%;
height: auto;
position: relative;
}

button#openMenu {
display: none;
}

a#telefon {
width: 50%;
height: 30px;
background-color: #0055a9;
position: relative;
text-align: center;
display: inline-flex;
flex-direction: column;
justify-content: center;
color: #fff;
text-decoration: none;
}

a#email {
width: 50%;
height: 30px;
background-color: #646363;
position: relative;
text-align: center;
display: inline-flex;
flex-direction: column;
justify-content: center;
color: #fff;
text-decoration: none;
}

.slideshow img{
width: 100%;
height: auto;
background-repeat: no-repeat;
}

.slideshow {
border-top: 10px solid #0055a9;
}



.rsContent {
width: 100%;
height: auto;
position: relative;
}

.rsContent img {
width: 100%;
height: auto;
position: relative;
background-repeat: no-repeat;

-webkit-user-drag: none;
-khtml-user-drag: none;
-moz-user-drag: none;
-o-user-drag: none;
user-drag: none;
}

div.rsContent {
background-size: cover;
background-position: center;
}






nav {
display: inline-block;
width: 100%;
z-index: 10;
height: auto;
list-style: none;
position: relative;
top: 0px;
margin: 0;
padding: 0;

display: inline-block;
margin-top: 0px;
vertical-align: middle;
height:57px;
font-size: 17px;
line-height: 2.1em;
text-align:center;
z-index: 500;
}

nav > ul {
list-style: none;
display: inline-flex;
justify-content: center;
height: auto;
margin:0;
padding:0;
width:70%;
vertical-align: middle;
right: 0;
position: absolute;
}

nav > ul > li {
display: inline-block;
position: relative;
margin: 0;
padding-left: 0%;
padding-right: 0%;
height: 57px;
vertical-align: middle;
width:15%;
}

nav > ul > li:hover {
display: inline-block;
position: relative;
margin: 0;
padding-left: 0%;
padding-right: 0%;
height: auto;
vertical-align: middle;
width:15%;
}
nav ul li a {
color: #646363;
text-decoration: none;
font-size: 18px;
width:100%;
height: auto;
vertical-align: middle;
padding-top: 0px;
font-weight: 400;
height: 57px;
transition:.5s;
display: block;
padding-top:10px;
}

nav > ul > li.rex-current,
nav ul > li.rex-active  {
font-weight:600;
position: relative;
background-color:transparent;
}

nav > ul > li.rex-current > a,
nav > ul > li.rex-active > a {
font-weight:600;
width: 100%;
height: 57px;
position: relative;
display: inline-block;
color: #0055a9;
top: 0px;
background-repeat: no-repeat;
display: block;
padding-top:10px;
}

nav ul ul { 
display:none;
margin:0;
padding:0;
left:0;
}

nav ul li ul { 

}



nav ul li a:hover,
nav ul li a.rex-current,
nav ul li a.rex-active {

display:block;
text-align: center;
background-color:transparent;
border-bottom:0px solid #0055a9;
}
nav > ul > li > a:hover,
nav > ul > li > a.rex-current,
nav > ul > li > a.rex-active {
color:#0055a9;
display:block;
text-align: center;
background-color:transparent;
border-bottom:0px solid #0055a9;
}
nav ul li:hover > ul,
nav ul li a:hover > ul,
nav ul li a:hover > ul:hover {
list-style:none;
margin:0px 0 0 0;
padding:0px 0;
display:block;
width:260px;
height:auto;
background-color:rgba(0,85,169,0.90);
box-shadow:none;
transition-property: opacity;
transition-duration: 0.4s;
}



nav ul li:hover ul li a {
width:230px;
height:auto;
padding:10px 20px;
display:block;
color:#fff;
border-bottom: 3px solid transparent;

transition-property: background-color;
background-color:transparent;
text-align: left;
margin:0;
}

nav ul li:hover ul li a:hover,
nav ul li:hover ul li.rex-current > a,
nav ul li:hover ul li.rex-active > a {
width:220px;
height:auto;
padding:10px 20px;
display:block;
color:#fff;
border-bottom: 3px solid transparent;
background-color:rgba(0,0,0,0.3);
text-align: left;
word-wrap:normal;
}

nav ul li ul li {
position:relative;
}

nav ul li ul li ul {
display:block;
position:absolute;
margin:0px 0 0 0;
width:240px;
height:auto;
overflow:hidden;
left:230px;
visibility:hidden;

}

nav ul li ul li:hover ul {
display:block;
position:absolute;
margin:0px 0 0 0;
width:240px;
height:auto;
overflow:hidden;
left:230px;
top:0;
visibility:visible;

}


.inhalt {
width: 100%;
background-image: url(../../media/hintergrund-theodor-heuss-realschule.jpg);
}

.zweispalten {
background-color: #fff;
display:inline-flex;
justify-content:space-between;
position:relative;
margin-bottom: 50px;
padding-left:3%;
padding-right:3%;
}


.zweispalten > div {
background-color: #fff;
width:47%;
height:auto;
position:relative;
vertical-align: top;
text-align: left;
}

.zweispalten div.spa div.bildwechsel {
width:100%;
height:auto;
position:relative;
}

article {

}

a {
text-decoration:none;
}


article a {
color: #0055a9;
text-decoration: none;
font-weight: bold;
}

ul.pagination {
list-style: none;
padding-left:0;
margin-left:0;
}

article > div:first-child {
padding-top:50px;
}

.auflistung, .startkal, .textRahmen {
text-align:left;
}
.textRahmen img {
text-align:left;
max-width:100%;
height:auto;
}

body:not(#article1) article > div.inhalt2spalten {
display:inline-flex;
justify-content:space-between;
position:relative;
vertical-align:top;
width:94%;
height:auto;
}

body:not(#article1) article > div.inhalt2spalten > div {
width:47%;
height:auto;
position:relative;
display:inline-block;
vertical-align:top;
}
body:not(#article1) article > div.inhalt2spalten > div img {
max-width:100%;
position:relative;
}


.rex-article-23 > a:after{
content: " ";
background-image: url(../../media/pfeil.png);
display: inline-block;
text-align: center;
width: 20px;
height: 20px;
background-size: 8px auto;
position: relative;
margin: 0 auto;
background-repeat: no-repeat;
left: 9px;
top: 8px;
}

.rex-article-16 .rex-navi2 {
z-index:600;
}

ul.pagination {
list-style: none;
display:block;
position: relative;
width:100%;
}
ul.pagination li {
display:inline-block;
}

ul.pagination li a {
padding:.7em 1em;
border:1px solid #646363;
margin-right:1em;
font-size:.8em;
font-weight:normal;
}
ul.pagination li a.active, 
ul.pagination li a:hover {
padding:.7em 1em;
border:1px solid #0055a9;
margin-right:1em;
font-size:.8em;
color:#fff;
background-color:#0055a9;
}

.popup_background {
max-height: 100%;
}

@media screen and (min-width:1800px) {
article {
margin: 0 auto;
width:80%;
max-width:1600px;
text-align:center;
padding-left:0;
padding-left:0;
}





#lottie {
width:600px;
height:auto;
position:absolute;
top:15vh;
left:10%;
z-index:2000;
transform: rotate(-3deg);
}
}

.bildwechsel img {
width:100%;
height:auto;
position:relative;
}
.textRahmen {
width: 94%;
padding-left: 3%;
padding-right: 3%;
}

.textRahmenVB3sp {
width: 94%;
padding-left: 3%;
padding-right: 3%;
height: auto;
position: relative;
display: inline-flex;
justify-content: space-around;
padding-top: 0px;
padding-bottom: 50px;
text-align:left;
padding: 0;
margin-bottom: 60px;
}

.textRahmenVB3sp img{
width: 100%;
height: auto;
position: relative;
display: block;
}

.textRahmenVB3sp > div {
width: 30%;
height: auto;
position: relative;
display: inline-block;
text-align:left;

}

.inhalt .textRahmenVB3sp > div {
border: 1px solid #aaa;
}



.inhalt .textRahmenVB3sp h2{
background-color: #646363;
color: #fff;
text-align: center;
text-transform: uppercase;
margin: 0;
padding-top: 15px;
padding-bottom: 15px;
}

.inhalt .textRahmenVB3sp p {
color: #646363;
padding: 12px;
}

.textRahmenVB3sp p{
margin:0;
}

.textRahmenVB3sp a {
color: #0055a9;
font-weight: 600;
text-decoration: none;
}

#textRahmen4 {
padding-top: 70px;
padding-bottom: 70px;
}

.textSpalteLinksVB3sp h2:before {
content: " ";
background-image: url(../../media/eltern-portal-icon.png);
}

#textSpalteMitteVB6 h2:before {
content: " ";
background-image: url(../../media/schueler-portal-icon.png);
}

#textSpalteRechtsVB6 h2:before {
content: " ";
background-image: url(../../media/lehrer-portal-icon.png);
}

.inhalt .textRahmenVB3sp h2:before {
position: relative;
width: 28px;
height: 28px;
background-size: 28px;
margin-right: 10px;
background-position: center;
background-repeat: no-repeat;
display: inline-block;
vertical-align: middle;
top: -3px;
}

.inhalt .textRahmenVB3sp #textSpalteMitteVB6 h2:before {
position: relative;
width: 15px;
height: 29px;
background-size: 12px;
margin-right: 10px;
background-position: center;
background-repeat: no-repeat;
display: inline-block;
vertical-align: middle;
top: -3px;
}





ul.slick-dots {
list-style: none;
position: absolute;
display: inline-block;
justify-content: center;
text-align:center;
width: 100%;
height: auto;
bottom: 0px;
padding:0;
margin:0;

}

ul.slick-dots li {
display:inline-block;
margin: 3%;
width: 22px;
height: 22px;
background-color: rgba(255,255,255,1);
box-shadow: 0px 0px 5px 2px #000;

}

ul.slick-dots li.slick-active {
display:inline-block;
margin: 3%;
width: 15px;
height: 15px;
background-color: #0055a9;
border: 4px solid #fff;
box-shadow: 0px 0px 5px 2px #000;
}

.bildwechsel button{
display: none;
}

body:not(#article1) .inhalt {
width: 100%;
background-image: none;
}

body:not(#article1) article {
text-align:center;
}
body:not(#article1) article > div {
width:94%;

height:auto;
display:inline-block;
position:relative;
text-align:left;
} 
body:not(#article1) article > div.textRahmenVB3sp {
margin-left: 0%;
margin-right: 0%;
display:inline-flex;
justify-content:space-between;
}

footer {
background-color: #646363;
color: #fff;
padding-top: 30px;
padding-bottom: 100px;
text-align:center;
}

footer .textRahmenVB3sp a{
color: #fff;
font-weight: normal;
}

footer .textRahmenVB3sp {

display:inline-flex;
max-width:1500px;
padding-left: 2%;
padding-right: 2%;
text-align: center;
justify-content: space-around;
}
footer .textRahmenVB3sp > div {
width: 32%;
height: auto;
position: relative;
display: inline-block;
text-align:left;
}
.schmal {
width: 90%;
height: auto;
position: relative;
padding-left: 5%;
padding-right: 5%;
text-align: left;
}

body article > div.galerie {
display:flex;
justify-content:space-between;
flex-flow: row wrap;
align-content:center;
justify-content:space-between;
flex-wrap : wrap;
position:relative;
width: 94%;
padding-left: 3%;
padding-right: 3%;
padding-top:50px;
padding-bottom:50px;
}
.galerie .clr {
display:none;
}
.galerie a.galerieBilder {
	width:32%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:30px;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
.galerie a.galerieBilder:hover {
	width:32%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:30px;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
.galerie a.galerieBilder img {
width:100%;
height:auto;
position:relative;
visibility:hidden;
}
@media screen and (min-width:1000px) {

.galerie a.galerieBilder {
	width:31%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:50px;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
.galerie a.galerieBilder:hover {
	width:31%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:50px;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
}
.entry_data {
text-transform:uppercase;
display:inline-block;
width:35px;
height:80px;
font-size:.9em;
line-height:1.2em;
vertical-align:top;
padding-top:0;
margin-top:0;
min-width:35px;
}
.bisstrich {
text-transform:uppercase;
display:inline-block;
width:10px;
min-width:10px;
height:50px;
font-size:.7em;
line-height:1.0em;
vertical-align:middle;
}
.enddate {
text-transform:uppercase;
display:inline-block;
width:40px;
min-width:40px;
height:80px;
font-size:.7em;
line-height:1.3em;
vertical-align:top;
}

.entry_data h3 {
margin-top:3px;
margin-bottom:3px;
padding-top:0;
padding-bottom:0;
font-size:1.9em;
display:inline-block;

}
.enddate h3 {
margin-top:3px;
margin-bottom:3px;
padding-top:0;
padding-bottom:0;
font-size:1.9em;
}

.kalender-eintrag div.entry_text {
width:65%;
min-height:60px;
display:inline-block;
vertical-align:top;
}

.kalender-eintrag .entry_text h3 {
display:block;
width:100%;
height:auto;

margin-top:0px;
margin-bottom:0px;
vertical-align:top;
line-height:1.0em;
}

.kalender-eintrag {
display:flex;

vertical-align:top;
flex-wrap: wrap;
height:auto;
vertical-align:top;
}

.kalender-eintrag p.uhrzeit {
width:100%;
min-width:100%;

display:block;
flex-grow:1;

}
div.enddate {
display:inline-block;
margin-left:4px;
margin-right:15px;
border-right:1px solid #aaa;
}

.kalender-eintrag span {
line-height:.8em;
display:block;
margin-top:7px;
}

span.tagname {
font-size:1.3em;

display:block;
line-height:.8em;
}

span.tag {
font-size:2em;

display:block;
line-height:.8em;
}

span.bisstrich {
font-size:1.5em;
margin-top:33px;
display:block;
margin-left:4px
line-height:.8em;
}




@media screen and (max-width: 1400px) { 
.kontakt {
width: 45%;
}

}

@media screen and (max-width: 1000px) {


nav ul li a {
padding-top: 00px;
padding-bottom: 00px;
}

nav > ul > li.rex-current > a, nav > ul > li.rex-active > a {
padding-top: 00px;
padding-bottom: 00px;
}

.rex-article-23 a li a {
display: none;
}

.rex-article-23 a li a {
display: none;
}


.rex-article-23 a:hover li a {
display: block;
}

.rex-article-23 a:hover li a {
display: block;
}

.open .inhalt {
display: none;
}

.open .slideshow {
display: none;
}

.open footer {
display: none;
}

body:not(#article1) article > div.inhalt2spalten {
width: 94%!important;
padding-top: 15px!important;
padding-bottom: 15px!important;
display:inline-block;
}

body:not(#article1) article > div.inhalt2spalten > div {
display: block;
width: 100%;
padding-right: 0%;
}


footer .textRahmenVB3sp > div {
width: 100%;
height: auto;
position: relative;
display: block;
text-align: left;
vertical-align: top;
}

.galerie {
display:flex;
justify-content:space-between;
flex-flow: row wrap;
}

.galerie a.galerieBilder {
	width:48%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:2%;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
.galerie a.galerieBilder:hover {
	width:48%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:2%;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
.galerie a.galerieBilder img {
width:100%;
height:auto;
position:relative;
visibility:hidden;
}

body {
letter-spacing:.045em;
font-size:14px;
}

.kontakt {
width: 100%;
}

.logo {
width: 50%;
}

button#openMenu {
display: block;
}
.headinner button {
display: block;
position:absolute;
right:5%;
top: 50px;
background-color:transparent;
width: 50px;
height:40px;
border:0;
outline:0;
z-index:1100;
transition:top .5s;
}

#nav-icon1 span {
background-color: #0055a9;
width:100%;
height:3px;
margin:5px 0;
position: relative;
display: block;
transition:transform .5s;
}

#nav-icon1.open span:nth-child(2) {
opacity:0;
margin:0px 0;
}
#nav-icon1.open span:nth-child(1) {
 transform: rotate(-45deg);
 margin:0px 0;
}
#nav-icon1.open span:nth-child(3) {
 transform: rotate(45deg);
 margin:0px 0;
 top:-6px;
}
.header #navbarResponsive {
padding-top:20px;
padding-bottom:20px;

}

.ganzoben {
height: 110px;
}

nav {
display: none;
}

.open nav {
display: block;
height: 100vh;
}

nav > ul > li {
display: block;
width: 100%;
}

nav > ul > li:hover {
display: block;
width: 100%;
}

nav ul {
display: block;
width: 100%;
text-align: center;
}
nav ul li:hover ul, 
nav ul li a:hover ul, 
nav ul li a:hover ul:hover {
position: relative;
width: 100%;
text-align: center;
}

nav ul li:hover ul li a:hover, nav ul li:hover ul li.rex-current a, nav ul li:hover ul li.rex-active a {
width: 100%;
display: block;
text-align: center;
padding-left:0;
}
nav ul li:hover ul li a {
width: 100%;
text-align: center;
padding-left:0;
}

nav ul li:hover ul li a:hover, 
nav ul li:hover ul li.rex-current a, 
nav ul li:hover ul li.rex-active a {
padding-left:0;
}

nav ul li:hover ul, 
nav ul li a:hover ul, 
nav ul li a:hover ul:hover {
padding: 0px 0;
}

nav > ul > li {
padding:0;

}

nav ul li ul li ul {
position: relative;
left: 0px;
top: 0;
width: 100%;
height:0;
display:none;
}

nav ul li ul li:hover ul, 
nav ul li ul li a:hover ul {
position: relative;
left: 0px;
top: 0;
width: 100%;
height:auto;
display:block;
}

nav ul li:hover ul li a {
padding-left: 0;
padding-right: 0;
}

nav ul li ul li a {
padding-left: 0;
padding-right: 0;
}

.rex-article-23 > a:after{
content: " ";
background-image: url(../../media/pfeil.png);
display: inline-block;
text-align: center;
width: 20px;
height: 20px;
background-size: 8px auto;
position: relative;
margin: 0 auto;
background-repeat: no-repeat;
left: 9px;
top: 8px;
}

#lottie {
width:300px!important;
top:2vh!important;
left:3%;
position:absolute;
}

.logo img {
max-width: 220px;
}
.zweispalten > div {
width: 100%;
display: block;
}
.zweispalten {
display: block;
}
.article {
overflow: hidden;
}

footer .textRahmenVB3sp {
display: block;

}
footer p {

line-height:1.5em;
font-size:1.15em;
}
.zweispalten .spalte2 {
padding-top: 30px;
}

.nav > ul > li:hover {
width: 100%;
}

.textRahmenVB3sp > div {
width: 100%;
height: auto;
position: relative;
display: block;
text-align: left;
margin-bottom: 50px;
}
body:not(#article1) article > div.textRahmenVB3sp {
display: block;
margin: 0 auto;
}

}

@media screen and (max-width: 700px) {
.textSpalteLinksVB3sp {
width: 100%;
display: block;
margin-bottom: 30px;
}
.textSpalteMitteVB3sp {
width: 100%;
display: block;
margin-bottom: 30px;
}
.textSpalteRechtsVB3sp {
width: 100%;
display: block;
margin-bottom: 30px;
}
.textRahmenVB3sp {
display: block;
}

}

@media screen and (min-width: 1000px) {
width: 500px!important;
top: 3vh!important;
}
}

@media screen and (min-width: 700px) {
#lottie {
width:400px!important;
top:10vh!important;
left:4%;
}

}

@media screen and (max-width: 500px) {
#lottie {
width: 200px!important;
top: 3vh!important;
left: 3%;
position: absolute;
}
}

@media screen and (max-width: 400px) {
#lottie {
width: 150px!important;
top: 3vh!important;
left: 3%;
position: absolute;
}
}





body:not(#article1) article > div.auflistung.kategorien {
width:94%;

height:auto;
  display: inline-flex;
position:relative;
text-align:left;
  flex-wrap: wrap;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-start;
} 

div.auflistung.kategorien {
  width: 94%;
  height: auto;
  padding-right: 0%;
  display: inline-flex;
  
  position: relative;
  text-align: left;
  vertical-align: top;
  justify-content:space-between;
flex-wrap:wrap;
}

div.auflistung.kategorien > h2 {
width:90%;
display:none;
}


div.auflistung.kategorien .listelement .vorschaubild {
width: 100%;
height: 220px;
position: relative;
background-size: cover;
background-position: center;
}
div.auflistung.kategorien .listelement .vorschaubild a {
display:block;
width:100%;
height:100%;
position:relative;
}
div.auflistung.kategorien .listelement {
height: auto;
position: relative;
display: inline-block;

background-color: #fff;
padding-top: 15px;
border:1px solid #aaa;
width: 27%;
padding-left:2%;
padding-right:2%;

margin-top: 20px;
margin-bottom: 20px;
padding-top:30px;
padding-bottom:30px;
}

div.auflistung.kategorien .listelement:hover {
background-color:#eFeFeF;
}

div.auflistung.kategorien .listelement:last-child:nth-of-type(3n + 2) {
margin-right: auto;
margin-left: 3.5%;

}


div.auflistung.kategorien div h3 {
margin-bottom:0;

}

div.auflistung.kategorien h3 a {
color: #0055a9;
text-decoration: none;
font-size: 1.2em;
line-height: 1.2em;
}

div.auflistung.kategorien p {
margin-top: 7px;
}

div.auflistung.kategorien a {
color: #0055a9;
text-decoration: none;
font-weight: bold;
}









div.auflistung.kategorien p.anlesetext { 
width:100%;
max-width:100%;

height:100px;
position:relative;
overflow-x: hidden;
text-overflow: ellipsis;

white-space: wrap;

}

@media screen and (max-width:1000px) {
div.auflistung.kategorien  {
width: 100%;
display: block;
margin-bottom: 60px;
padding-right: 0%;
}

div.auflistung.kategorien .listelement {
width: 96%;
padding-left: 2%;
padding-right: 2%;
margin-right: 0%;
margin-bottom: 40px;
}



}

@media screen and (min-width: 1000px) and (max-width: 1050px) {
nav > ul > li > a {
font-size: 14px;
}

}


@media screen and (min-width: 1050px) and (max-width: 1250px) {
nav > ul > li > a {
font-size: 15px;
}

}

@media screen and (min-width:700px) and (max-width:1000px){
div.auflistung.kategorien .listelement {
width: 42%;
}
div.auflistung.kategorien .listelement:last-child:nth-of-type(3n + 2) {
margin-left: 0%;
}
div.auflistung.kategorien .listelement:last-child:nth-of-type(3n + 2) {
margin-right: 0;
margin-left: 0%;

}
}

.popup_content {
  margin: 10px;
  padding: 20px 20px;
  max-width: 60%;
  background: rgba(255,255,255,0.95);
  position:absolute;
  background-image:url(../../media/pop-up.jpg);
  color: #fff;
  font-family: chalky, sans-serif;
font-weight: 400;
font-style: normal;
font-size: 18px;
font-size: 22px;
line-height: 1.2em;
background-repeat: none;
background-size: cover;
}

.popup_content h2 {
line-height: 1.2em;
}

.JPO_close {
width:50px;
height:50px;
background-image:url(../../media/weg-machen.png);
position: relative;
background-size: 25px;
background-repeat: no-repeat;
color: transparent;
right:00px;
position:absolute;
cursor: pointer;
top: 20px;
}
.popup_content a.button {
font-size: 18px;
font-weight: 200;
border: 2px solid #fff;
letter-spacing: .11em;
height: 28px;
padding-top: 5px;
padding-bottom: 1px;
width: 200px;
display: inline-block;
position: relative;
text-align: center;
margin: 0;
text-align: center;
vertical-align: middle;
line-height: 1.3em;
color: #fff;
text-decoration: none;
font-family: 'PT Sans', sans-serif;

}

.popup_content a.button:hover {
border: 2px solid #646363;
}

.JPO_open {
display:none;
}
@media screen and (max-width:1000px) {

.popup_content {
  width:90%;
  max-width:80%;
}

.popup_content br {
display: none;
}

.popup_content h2 {
line-height: 1.1em;
}

.popup_content a.button {
font-size: 16px;
font-weight: 200;
border: 2px solid #fff;
letter-spacing: .11em;
height: 28px;
padding-top: 5px;
padding-bottom: 1px;
width: 180px;
display: inline-block;
position: relative;
text-align: center;
margin: 0;
text-align: center;
vertical-align: middle;
line-height: 1.3em;
color: #fff;
text-decoration: none;
}


}

body:not(#article1) article > div.textRahmen.video {
max-width:600px;
display:block;
position:relative;
}