/***********************************************************************
RESPONSIVE
@media only screen and (min-width:1500px) {
.container {
max-width:1140px;
}
}

lastmod w 23.10.2018  mobilehide ab 600 pixel f

*/



 
/* large
820

= breakpiont seitenspalte
  */
@media only screen and (max-width:900px) {


/* gallery */

.gallery{
  padding-right:0%
}

.gallery.grid5 .item{
width:24%;
margin:0.5%;
}



#nav {
width:100%;
}

 #nav ul {
float:none;
margin-right:0px;
}

.hide-content-l{
display:none;
}
.show-content-l{
display: block;
}

.container {
max-width:745px;
}

.col-lg-1 {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
}
.col-lg-2 {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;;
  max-width: 50%;
}
.col-lg-3 {
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%;
}
.col-lg-4 {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}




/* overlays */
 .article-overlay .inner{
min-height:300px;
}
 .firstrow  .article-overlay .inner{
min-height:320px;
}

 .article-overlay .text,
  .firstrow .article-overlay .text {
  min-height:  100px;
 }

.article-feature  h2,
 .firstrow  .article-overlay .text h2,
 .article-overlay .text h2{
  font-size:24px;
  line-height:27px;
}





/* hide feature img */
.article-feature .img{
    display: none;
}

.aktuelleausgabe .inner{
   background-color:var(--afw--bgoverlayteaser); 
  //overflow: hidden;
  //max-height: 320px;
}

.aktuelleausgabe .img2{
   //display:inline-block;
   //height:50px;
}

.article-feature .text{
    width:100%;
    padding:20px;
}

.aktuelleausgabe .text, .aktuelleausgabe .ressort, .aktuelleausgabe h2 {
  color: var(--afw--aktuelleausgabetitel);
}


/* articledetail */

.col-main,
.col-aside{
  float:none;
  width: 100%;
}

.col-aside:empty{
display: none;
}



 
.articledetail .col-aside figure {
 max-width:45%;
 display: inline-block;
margin-right:10px;
vertical-align:bottom;
}

.articledetail .col-aside figure.hoch{
  display: inline-block;
margin-right:10px;
vertical-align:bottom;
}
 

.articledetail   .zitat,
.articledetail  .main-zitat {
width:100%;
float:none;
clear:both;
}

 
 

.col-main .content{
padding-left:8.5%;
padding-right:8.5%;
}

.articledetail .main-zitat{
float:none;
width: 100%;
max-width:none;
padding:0% 8.5% 0px 8.5%;
margin:0px;
}



/* flex and reorder 

.articledetail .content,
.articledetail .col-aside{
display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;

  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.txt1 {
  order: 5;
}
.side1 {
  order: 1;
}
.txt2 {
  order: 1;
}
.side2 {
  order: 4;
}
*/


 /* themenschwerpunkt */
 .themenschwerpunkt  {
     margin-top:0px;
 }

.themenschwerpunkt .col-main,
.themenschwerpunkt .col-aside{
  float:none;
  width: 100%;
}

.themenschwerpunkt .col-aside{
padding-left:8.5%;
padding-right:8.5%;
}

/* margin-top:40px;
max-width: 250px; */
.themenschwerpunkt .banner{
margin-top:0px;
max-width: 250px;
}

/* banner themenschwerpunkt detailpage */
  .banner-articledetail{
 float:none;
  width: 100%;
  max-width: 250px;
  margin-bottom:30px;
 }

  .banner-articledetail + .articledetail{
 }



}




/* breakpoint nav float
*/
@media only screen and (max-width:800px) {

/* bereits 900
#nav {
width:100%;
}

 #nav ul {
float:none;
margin-right:0px;
}
*/


/* gallery */
.gallery.grid5 .item{
width:32%;
margin:0.5%;
}



.article-feature .text{
width:100%;
padding:10px;
float:none;
}
 
}






/* medium */

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

 #header{
 
 }

#footernav li a{
 padding:0px 20px;
}

.col-md-1 {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
}
.col-md-2 {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;;
  max-width: 50%;
}
.col-md-3 {
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%;
}
.col-md-4 {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}


 
 

}




/* breakpoint article overlay > normal
760
*/
@media only screen and (max-width:160px) {


/* reset article overlay to normal */
  .firstrow  .article{
min-height:250px;
}
 .article-overlay .inner{
min-height:250px;
}
 .firstrow  .article-overlay .inner{
min-height:250px;
}

.article-overlay .inner{
background:none!important;
min-height:none;
}
.article-overlay .article-img{
display: block;
}
 .article-overlay .text .ressort{
color:#777;
}

 

 .article-overlay .text{
min-height:none;
background:none;

  width: 100%;
   position:relative; 
   bottom:none; 
   padding:none;
   color: #111;
}
 .article-overlay .text h2{
  font-size:22px;
  line-height:26px;
color:#111;
font-weight: normal;
text-shadow:none;
  -webkit-font-smoothing:inherit;
  -moz-osx-font-smoothing:inherit;
}



}





/* breakpoint mobile nav
*/
@media only screen and (max-width:768px) {



#topnav,
#nav{
  display: none;
}

 
 #mobilenav-open,
#mobilenav-wraper{
display:block;
}


 #header {
position: relative;
height:130px;
}




.termine-item .img{
  -ms-flex: 0 0 130px;
  flex: 0 0 130px;
  max-width: 130px;
}
.termine-item .img{
padding-right:0px;
}
 .termine-item .img img{
max-width: 100px;
}

.servicedetail .content{
max-width: 850px;
padding-left:0px;
}

.mobile-only{
display:block!important;
}






#footernav ul li{
  display: inline;
  float:none;
width:auto;
}
#footernav li a{
     font-size: 14px; 
}
#footernav li.newsletter {
  display: block;
}



.hide-content-m{
display:none;
}
.show-content-m{
display: block;
}



}




/* small  576 */
@media only screen and (max-width:600px) {


/* gallery */
.gallery.grid3 .item,
.gallery.grid4 .item,
.gallery.grid5 .item{
width:48%;
margin:0.5%;
}
 
.container {
max-width:480px;
}


/* overlays */
 .overlay{
min-height:300px;
}
 .firstrow .overlay{
min-height:300px;
}



 
.socialmedia-footer{
line-height:42px;
font-size:28px;
margin-bottom: 10px;
}
 
.row{
  display: block;
min-height:100px;
}

.col-1,
.col-2,
.col-3{
float:none;
width:100%;
max-width:none;
}

.col-lg-1,
.col-lg-2,
.col-lg-3{
 float:none;
width:100%;
max-width:none;
}

.col-md-1,
.col-md-2,
.col-md-3{
 float:none;
width:100%;
max-width:none;
}
 
 


      #logo a{
width:221px;
height:83px;
background-size: 221px 83px;
}

.article-feature {
min-height:250px!important;
height:auto!important;
}




 .article,
 .article-overlay{
border-bottom:1px solid #dedede;
padding-bottom:20px;
margin-bottom:20px;
}

 .themenschwerpunkt .article {
border-bottom:none;
  }

 
 .article-grid-chronological .article,
 .article-overlay{
border-bottom:none;
}
 


 
.col-main .featureimg{
padding-right:0px;
}

.articledetail .col-aside .main-zitat,
.articledetail .col-aside .zitat,
.articledetail .col-aside figure {
 max-width:100%;
float:none;
}


.themenschwerpunkt .col-main .content,
.themenschwerpunkt .col-aside{
padding-left:0px;
padding-right:0px;

padding-left:0%;
padding-right:0%;
}


.printview .container-wraper{
padding:0px 20px 0px 20px;
}


.col-main .content,
.col-main .aside,
.col-main iframe{
padding-left:0%;
padding-right:0%;
}

/* 23.10 schaltet weisses bild aus */
.article .mobilehide{
display:none;
}
 
 
/* ### nur für appankünder
.topmeldung{
	min-height: 80px;
 }
  
.topmeldung h1{
    font-size: 24px;
    line-height: 28px;
}*/

/* ### nur für appankünder*/




/* logo app 13.5.2023*/ 

.b-icon-app {
	width:26px;
	height:26px;
	background-size: 26px 26px;
}

/* logo app  */ 




}



/*
float:none;
width:100%;
max-width:none;


  -ms-flex: 0 0 21%;
  flex: 0 0 21%;
  max-width:21%;

  order: 1;
*/

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




.termine-item .img{
  order: 2;
 margin-top:20px;

   -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}
.termine-item .img img{
max-width: 100px;
}



.termindetail .termine-item .img img{
 max-width:145px;
}

.termine-item .text{
  order: 1;
   -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}


#logofooter .aekwien{
	margin-top: 30px;
} 


/*größer im smartphone*/


.article-boxed h2, .article h2 {
    font-size: 18px;
    line-height: 24px;
}

.article p {
    font-size: 16px;
    line-height: 24px;
}

.kicker{
	font-size: 13px;
}


.articledetail h1, .articledetail .titel {
    font-size: 28px;
    line-height: 32px;
}

.articledetail .short {
    font-size: 18px;
    line-height: 22px;
}

.articledetail .long {
     font-size: 16px;
    line-height: 24px;
}

.termine-item p {
     font-size: 16px;
    line-height: 24px;
}






/*größer im smartphone*/


}



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

/* gallery */
.gallery.grid3 .item,
.gallery.grid4 .item,
.gallery.grid5 .item{
width:98%;
margin:1%;
}
 
}




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

.container-wraper{
clear:both;
padding:0px 10px;
}

     #logo a{
width:200px;
height:75px;
background-size: 200px 75px;
}
 
}
 