/* Portrait */

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

	#respindicator {z-index: 5!important;}

	#container, #header, #content, #footer{
        
        position: relative;
        
        width: 700px;
        margin: 0 auto;
        
    }
    
    #imageslider{
    	
    	width: auto;
    	
    }
    
    #ffmann{
    	
    	display: none;
    	
    }
    
    #navi ul {
    	
	    padding: 0;
	    
	}
	
	#content{
		
		width: 660px;
		padding: 40px 20px 20px 20px; 
		
	}
	
	.colLeft50, .colRight50 {
		
	    width: 320px!important;
	    
	}
	
	.colLeft33, .colMiddle33, .colRight33 {
		
	    width: 210px!important;
	    
	}
	
	.colMiddle33{
		
	    margin-left: 15px;
	    
	}
	
	.hometeaser-container {
		
	    width: 320px;
	    
	}
	
	#footercontainer{
		
		background: #333333;
		
	}
	
	.fLeft {
	    margin: 0;
	    width: 340px;
	}
	
	a#notruf{

		left: 200px;
		
	}
	
	#c34 .csc-textpic-image img,
	#c43 .csc-textpic-image img,
	#c211 .csc-textpic-image img{
		width: 100%;
		height: auto;
	}
	
	#c35 div.csc-textpic-intext-left .csc-textpic-imagewrap {
	    float: none;
	}
	
	#c35 div.csc-textpic {
	   	margin-bottom: 20px;
	}
	
	#c79 table{
		width: 100%;
	}
	
	.einsatzlist-text, .news-list-view .teaser-text {
	    float: left;
	    width: 527px;
	}
	
	.dpgalleryfal-list-element{
	    width: 200px!important;
	    min-height: 210px!important;
	}
	
	.dpgalleryfal-single-image {
	    width: 157px!important;
	}
	
	.dpgalleryfal-list-element img,
	.dpgalleryfal-single-image img{
		width: 100%;
		height: auto;
	}
	
	#wespen-form .type-check .checkLabel{
		display: block;
		float: none;
		width: auto!important;
		min-height: auto;
		margin-bottom: 5px;
	}

}

/* Smartphone */

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

	#respindicator {z-index: 10!important;}

    body{
    	
    	background: none;
    	
    }
    
    #outercontainer{
    	
    	background: none;
    	
    }
    
    #container {
        
        width: auto;
        margin: 0;
        padding: 0;
        float: none;
        
    }
    
    #c280{
		
		float: none;
		margin: 20px 0 30px 0;
		
	}
	
	#c280 a:before{
		left: 0;
	}
	
	#c280 a{
		padding: 10px 10px 10px 90px;
	}
    
    #imageslider{
    	
    	display: none;
    	
    }
    
    #header  {
	    height: auto;
	    overflow: visible;
	    width: auto;
	}
	
	#ffmann, #logo{
		
		display: none;
		
	}
	
	#mobile-logo{
		display: block;
		padding: 25px 0 20px 0;
		text-align: center;
	}
    
    #mobileNavButton {
        display: block;
        position: relative;
        color: #FFFFFF;
        font-size: 18px;
        line-height: 18px;
        height: auto!important;
        padding: 15px 10px;
        text-transform: uppercase;
        background: #E30513;
        cursor: pointer;
        
        
    }
    
    #mobileNavButton:after {
        background: url("../img/nav-icon.png") no-repeat;
        content: "";
        display: inline-block;
        height: 20px;
        position: absolute;
        right: 10px;
        top: 50%;
        width: 20px;
        margin-top: -10px;
    }
    
    
    #navi{
        height: auto;
        float: none;
    }
    
    #navi > ul{
        
        display: none;
        padding: 0;
        margin: 0;
        
    }
    
    #navi > ul > li {
        display: block;
        float: none;
        border: none;
        text-align: left;
        border-bottom: 1px solid #333333;
        background: none;
        margin: 0;
        padding: 0;
    }
    
    #navi > ul > li.sub > a:after{
    	content: '\f107';
        display: inline-block;
        position: absolute;
        right: 10px;
        top: 5px;
	    font-family: FontAwesome;
	    font-feature-settings: normal;
	    font-kerning: auto;
	    font-language-override: normal;
	    font-size: 1.8em;
	    font-size-adjust: none;
	    font-stretch: normal;
	    font-style: normal;
	    font-synthesis: weight style;
	    font-variant: normal;
	    font-weight: normal;
	    line-height: 1;
	    text-rendering: auto;
	    color: #E30513;
    }
    
    #navi > ul > li > a {
        height: auto;
        display: block;
        padding: 10px!important;
        border: none!important;
        font-size: 18px;
        color: #000;
        background: #F0F0F0!important;
    }
    
    #navi > ul > li.active > a {
        color: #E30513;
    }
    
    /* LEVEL 1 */
    
    #navi > ul > li > ul.lvl-1{
        top:auto;
        left: auto;
        position: static;
        width: auto;
        margin: 0;
        background: none;
        border: none;
        display: none;
        padding: 0;
    }
    
    #navi ul.lvl-1 > li{
        position: static;
        border-top: 1px solid #555555;
        padding: 0;
    }
    
    #navi ul.lvl-1 > li > a,
    #navi ul li.sub ul.lvl-1 li.sub a.sub,
    #navi ul.lvl-1 > li.sub > a.sub{
        color: #000000!important;
        padding: 10px 10px 10px 20px!important;
        background-color: #FFF!important;
        display:block!important; 
    }
    
    #content {
	    background: none;
	    margin: 0;
	    min-height: auto;
	    padding: 30px 10px 20px 10px;
	    width: auto;
	}
	
	.colRight50, .colLeft50, .colLeft33, .colMiddle33, .colRight33{
		
		float: none!important;
		width: auto!important;
		padding: 0!important;
		margin: 10px 0!important;
		
	}
	
	.hometeaser-container {
	    height: 273px;
	    overflow: hidden;
	    position: relative;
	    width: auto;
	}
	
	.hometeaser-text {
    	bottom: 0!important;
    }
	
	.hometeaser-image img {
	    display: block;
	    min-width: 100%;
	    width: auto;
	    height: auto;
	    min-height: 273px;
	}

	.ce-left .ce-gallery, .ce-column { float: none; margin: 10px 0; }
	.ce-column img { width: 100%; height: auto; }
	.ce-center .ce-outer { position: relative; float: none; right: 0; }
	.ce-center .ce-inner { position: relative; float: none; right: 0; }
	.ce-right .ce-gallery { float: none; margin-left: 0!important; margin-right: 0!important; }

	.ce-gallery figure {
		display: block;
		margin: 0;
	}

	div.csc-textpic .csc-textpic-text{
		
		margin: 0;
		
	}
	
	#footer{
		
		width: auto;
		padding: 0 10px;
		font-size: 14px;
		
	}
	
	#footercontainer{
		
		background: #333;
		height: auto;
		padding-bottom: 0;
		
	}
	
	.fLeft, .fRight{
		
		float: none;
		width: auto;
		
		margin: 0;
		
	}
	
	.fRight{
		
		width: auto;
		max-width: 300px;
		margin: 20px auto 0 auto;
		overflow: hidden;
		padding: 30px 0;
		
	}
	
	a#notruf {
	    left: auto;
	    right: 20px;
	}
	
	.fRight .fwirsuchendichimg {
		top: 0;
	    right: auto;
	    left: 160px;
	    height: 199px;
	    overflow: hidden;
	}
	
	figcaption.csc-textpic-caption {
	    display: block;
	}
	
	.columnar .type-check label.checkLabel, .columnar .type-select label {
	    float: none;
	    text-align: left;
	    width: auto;
	}
	
	.tx-ffst-einsaetze .filtercontainer{
		
		position: relative;
		right: auto;
		top: auto;
		
		margin-bottom: 15px;
		
	}
	
	.filteritem {
	    float: none;
	    margin: 0 0 5px 0;
	}
	
	.einsatzlist-image, .news-list-view .news-img-wrap {
	    float: none;
	    height: auto;
	    margin-right: 0;
	    position: relative;
	    width: auto;
	    max-height: 300px;
	    overflow: hidden;
	}
	
	.einsatzlist-image img, .news-list-view .news-img-wrap img,
	.news-single .news-img-wrap img,
	.einsatzsingle-images img {
	    height: auto;
	    width: 100%;
	}
	
	.news-single .news-img-wrap a,
	.einsatzsingle-images a{
		display: inline-block;
		width: 49%;
		
	}
	
	.einsatzlist-text, .news-list-view .teaser-text {
	    float: none;
	    width: auto;
	}
	
	.einsatzlist-textpreview, .news-list-view .teaser-text-inner {
	    height: auto;
	    margin: 8px 0;
	    overflow: visible;
	}
	
	.einsatzsingle-fahrzeuge{
		
		float: none;
		width: auto;
		overflow: hidden;
		
	}
	
	.tx-ffst-einsaetze .f3-widget-paginator li, .news-list-view .f3-widget-paginator li {
	    margin: 0 2px 5px 2px;
	}
	
	.tx-ffst-einsaetze .f3-widget-paginator, .news-list-view .f3-widget-paginator {
	    overflow: hidden;
	}
	
	#c35 div.csc-textpic {
	   	margin-bottom: 20px;
	}
	
	#uid21 .csc-textpic-imagewrap .csc-textpic-imagecolumn{
		margin-bottom: 10px;
	}
	
	div.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
	    margin-bottom: 10px!important;
	}
    
}
/* Smartphone: Wespen button as a full-width bar above the heading, wasp inside the bar
   (floated next to the heading the wasp covered "Herzlich Willkommen") */

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

	#c2 {
		float: none;
		margin: 40px 0 25px 0;
	}

	#c2 a {
		height: auto;
		padding: 12px 10px 12px 85px;
		line-height: 20px;
	}

	#c2 a:before {
		width: 80px;
		height: 69px;
		background-size: contain;
		top: -30px;
		left: 0;
	}

}