/* Media Queries */

@media (max-width: 1600px)
{
	nav#main-nav ul li a {
		padding: 29px 20px; 
	}
	#footercontent ul{
		display:block;
		width:100%;
	}
	#footercontent ul li{
		display:inline-block;
		width:24%;
		vertical-align: top;
		padding:0 20px;
	}
	#footercontent ul li .sub-menu li {
		padding:0px;
		margin-bottom:10px;
	}
	.blog_roll_container.posts-show-all {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		grid-gap: 25px;
		padding:0 20px;
	}
}
@media (max-width: 1460px)
{
	nav#main-nav ul li a {
		padding: 29px 10px; 
	}
	nav#main-nav > div > ul > li > a,
	nav#main-nav ul li ul.sub-menu li a{
		font-size: 1.15rem;
	}
	.zentriert.mittel .fl-col-content{
		padding: 50px 175px 50px 80px;
	}
}
@media (max-width: 1355px)
{
	#header_main_site_title > a, .mobile_nav_container a.site_title {
		min-width: auto;
	}

	#header_main_site_title > a {
		font-size: 1.5rem;
		padding: 28px 20px;
	}
	h1, .h2-xxl h2, .h3-xxl h3, .h4-xxl h4, .font-size-xxl p, .font-size-xxl span, .font-size-xxl a, .font-size-xxl li {
		font-size: 3rem;
	}
	h2, .h3-xl h3, h3, .h4-xl h4, .font-size-xl p, .font-size-xl span, .font-size-xl a, .font-size-xl li,.veranstaltungsliste-item .veranstaltungsliste-headline{
		font-size:2rem;
	}
	.farbe-1 .formlos_btn, .farbe-2 .formlos_btn, .farbe-3 .formlos_btn, .farbe-4 .formlos_btn,.blog_roll_container .blog_roll_single_post .blog_roll_headline,.stoerer .bb-formlos-button .formlos_btn,.veranstaltungsliste-item .veranstaltungsliste-link a,.veranstaltungsliste-item .veranstaltungsliste-typ{
		font-size: 1.5rem;
	}
	p,li,h4, .h1-m h1, .h2-m h2, .h3-m h3, .font-size-m p, .font-size-m span, .font-size-m a, .font-size-m li{
		font-size:1.25rem;
	}
	.veranstaltungsliste .veranstaltungsliste-item {
		margin-bottom: 25px;
	}
	nav#meta-nav-wrapper ul,
	nav#meta-nav-wrapper ul li{
		display:inline-block;
		margin-bottom:0;
	} 
}
@media (max-width: 1200px)
{
	.umbrechen .fl-col:nth-child(odd){
		width:30%;
	}
	.umbrechen .fl-col:nth-child(even){
		width:70%;
	}
	.umbrechen .fl-col{
		margin-bottom:30px;
	}
	.umbrechen .fl-row-content-wrap{
		margin-bottom:0 !important;
	}
	.umbrechen.kontakt_box .fl-col:nth-child(odd) {
		width: 40%;
		margin-bottom:0;
	}
	.umbrechen.kontakt_box .fl-col:nth-child(even) {
		width: 60%;
		margin-bottom:0;
	}
}
@media (max-width: 1140px)
{
	.fl-rich-text,
	.header_inner,
	#footercontent,
	#main{
		padding:0 0px;
	}
	#header_logo_meta{
		padding:0 20px;
	}
	nav#main-nav > div > ul > li > a, nav#main-nav ul li ul.sub-menu li a{
		font-size:1rem;
	}
	
	#footercontent ul li{
		width:33%;
	}
}
@media (max-width: 1100px){
	#header_main_site_title > a {
		padding: 16px 20px;
	}
	#header_main_site_title > a{
		width:auto;
		min-width:auto;
	}
	nav#main-nav ul{
		display:block;
	}
	nav#main-nav ul li{
		display:inline-block;
		width:24%;
	}
	nav#main-nav ul li a {
		padding: 10px;
	}
	nav#main-nav ul li ul.sub-menu li{
		width:100%;
	}
	.blog_roll_container.posts-show-all {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-gap: 25px;
	}

}
@media (max-width: 1024px)
{
	nav#main-nav ul li a {
		padding: 10px ;
	}
	nav#main-nav > div > ul > li > a,
	nav#meta-nav-wrapper ul li a {
		font-size:1rem;
	}
	footer {
    	padding-top: 2rem;
	}
	#footercontent ul li .sub-menu li {
		margin-bottom: 10px;
	}
	#footercontent ul li a {
		font-size: 1rem;
	}
	.menu-footer-meta-nav-container a{
		font-size:1rem;
	}
	#footer_logo a {
		font-size: 1.25rem;
	}
	#footer_logo {
		margin: 0 auto 50px auto;
	}	
	.zentriert.mittel .fl-col-content,
	.zentriert.gross .fl-col-content{
		padding:20px;
	}
	.kacheln-4 .fl-col{
		width:50%;
	}
	.blog_roll_container{
		display:block;
	}
	.blog_roll_container.posts-2 > article,
	.blog_roll_container.posts-3 > article{
		width:48%;
		display:inline-block;
		vertical-align: top;
	}
	.blog_roll_container.posts-2 .blog_roll_single_post:last-child{
		margin-left:0;
	}
	.blog_roll_container.posts-3 .blog_roll_single_post:nth-child(2){
		margin:0 0 0 25px;
	}
	.trainings-3 .fl-col.weisse-boxen{
		width: 50%;
		-webkit-box-flex: none;
		-moz-box-flex: none;
		-webkit-flex: none;
		-moz-flex: none;
		-ms-flex: none;
		flex: none;
	}
}



@media (max-width: 960px)
{
	nav#meta-nav-wrapper ul,
	nav#meta-nav-wrapper ul li{
		display:inline-block;
		margin-bottom:0;
	} 
}

@media (max-width: 940px)
{

}

@media (max-width: 840px)
{
}

@media (max-width: 810px)
{
	header{
		background:white;
	}
	.header_inner{
		padding: 0;
	}
	#header_logo_meta{
		padding:.5rem;
	}
	body{
		padding-top:200px !important;
		
	}
	#main img{
		width:100%;
	}
	
	body.projektoberseite #main{
		padding: 0 20px;
	}
	.mobile_nav_open nav#main-nav ul li ul.sub-menu, .mobile_nav_open .fl_fixed #header_main_site_title{
		box-shadow:0 0 0 0;
		-webkit-box-shadow: 0 0 0 0;
	}
	
	#wrapper > header,
	.fl_fixed{
		position: fixed;
		top:0;
		z-index:120;
	}
	.fl_fixed{
		
	}
	#logo_container {
		width: 220px;
		max-width:100%;
	}
	#logo_container img{
		width:100%;
	}
	.mobile_nav_container{
		display:block;
	}
	.mobile_nav_container a.site_title{
		display:block;
		width:100%;
		font-size:2rem;
		_text-align: center;
		text-decoration: none;
		padding:30px 120px 30px 30px;
	}
	header #main-nav,
	header #meta-nav-wrapper,
	.hamburger-box .caption{
		display:none;
	}
	
	#header_main_site_title > a{
		display: block;
		width: 100%;
		font-size: 5.5vw;
	}
	
	.projektoberseite_links{
		margin-bottom: 25px;
	}
	
	/*
   * Footer
   */
	#footercontent ul,
	#footer_meta_content ul{
		flex-wrap: wrap;
		flex-direction: column;
	}
	#footercontent ul.menu li > .sub-menu{
		padding-left: 1rem;
	}
	#footer_meta_content{
		margin-top: 1rem;
		padding-top: 1rem;
	}
	#footer_meta_content ul li a{
		padding: 0;
	}
	#single_content,
	#single_content.post > div, 
	#single_content.veranstaltung .header_image, 
	#single_content.veranstaltung .article_title, 
	#single_content.veranstaltung .entry .sidebar, 
	#single_content.veranstaltung .entry .content{
		display:block;
		width:100%;
	}
	.single .article_titel{
		min-height:auto;
	}
	.single .article_titel h1{
		margin-bottom:0;
	}
	/*
   * Burger Menu
   */

	.hamburger {
		padding: 12px;
		display: inline-block;
		cursor: pointer;
		transition-property: opacity, filter;
		transition-duration: 0.15s;
		transition-timing-function: linear;
		font: inherit;
		color: #0077C8;
		text-transform: none;
		background-color: white;
		border: 0;
		margin: 0;
		overflow: visible;
		position: fixed;
		top: 0px;
		right: 10px;
		z-index: 125;
	}

	.hamburger:focus {
		outline: solid 2px #0077C8;
		border-radius: 3px;
	}

	.hamburger:hover {
		_opacity: 0.7;
	}

	.hamburger.is-active:hover {
		_opacity: 0.7;
	}

	.hamburger.is-active .hamburger-inner,
	.hamburger.is-active .hamburger-inner::before,
	.hamburger.is-active .hamburger-inner::after {
		
	}

	.hamburger-box {
		width: 50px;
		height: 50px;
		display: inline-block;
		position: relative;
		font-weight: 500;
		letter-spacing: 1px;
	}

	.hamburger-inner {
		display: block;
		top: 50%;
		margin-top: 8px;
	}

	.hamburger-inner,
	.hamburger-inner::before,
	.hamburger-inner::after {
		width: 50px;
		height: 5px;
		background-color: #0077C8;
		border-radius: 3px;
		position: absolute;
		transition-property: transform;
		transition-duration: 0.15s;
		transition-timing-function: ease;
	}

	.hamburger-inner::before,
	.hamburger-inner::after {
		content: "";
		display: block;
	}

	.hamburger-inner::before {
		top: -10px;
	}

	.hamburger-inner::after {
		bottom: -10px;
	}

	.hamburger--slider .hamburger-inner {
		top: 6px;
	}

	.hamburger--slider .hamburger-inner::before {
		top: 10px;
		transition-property: transform, opacity;
		transition-timing-function: ease;
		transition-duration: 0.15s;
	}

	.hamburger--slider .hamburger-inner::after {
		top: 20px;
	}

	.hamburger--slider.is-active .hamburger-inner {
		transform: translate3d(0, 10px, 0) rotate(45deg);
	}

	.hamburger--slider.is-active .hamburger-inner::before {
		transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
		opacity: 0;
	}

	.hamburger--slider.is-active .hamburger-inner::after {
		transform: translate3d(0, -20px, 0) rotate(-90deg);
	}
	
	.mobile_nav_container  ul > li .dropdown_btn {
		display: inline-block;
		width: 32px;
		height: 32px;
		background: url(../img/icon-mobilenav-dropdown-expand.svg) center center no-repeat;
		vertical-align: middle;
		margin-left: 1rem;
	}
	
	.mobile_nav_container  ul > li .dropdown_btn.open {
		background: url(../img/icon-mobilenav-dropdown-collapse.svg) center center no-repeat;
	}
	
    body.mobile_nav_open{
        overflow:hidden;
    }
    #wrapper.mobile_nav_open{
        
    }
    footer.mobile_nav_open{

    }
    .mobile_nav_container{
        display:block;
    }
    .mobile_nav_container.mobile_nav_open{
        margin-top:0;
        overflow-y: scroll;
        overflow-x:hidden;
        -webkit-overflow-scrolling: touch;
		background-color: #0077C8;
		background-image: url('img/handicap_international_logo_white.svg');
		background-repeat: no-repeat;
		background-position: 20px 7px;
		padding-bottom:80px;
    }
	.mobile_nav_open header{
		background:white ;
	}
    .mobile_nav_container.left.mobile_nav_open{
        margin-left:0;
        overflow-y: scroll;
        overflow-x:hidden;
        -webkit-overflow-scrolling: touch;
    }
    .mobile_nav_container{
        background: white;
        position:fixed;
        top:0;
        width:100%;
        margin-top:-100vh;
        transition:margin .5s;
        height:100%;
        left:0;
        overflow:auto;
        z-index:100;
		_padding-top: 100px;
		
    }
	.mobile_nav_container > #meta-nav-wrapper{
		padding-top:50px;
		width:80%;
		margin:0 auto;
		border-top:3px solid white;
	}
	body.projektoberseite .mobile_nav_container > #meta-nav-wrapper{
		padding-top:100px;
	}
	.mobile_nav_container > #meta-nav-wrapper ul li{
		display:block;
		margin-bottom:.5rem;
		text-align: left;
	}
	.mobile_nav_container > #meta-nav-wrapper ul li a{
		color:white;
		font-size: 1.25rem;
		padding:.25rem 0;
	}
	.mobile_nav_container > #meta-nav-wrapper ul li.link_oberseite a{
		padding:.25rem;
	}
	.mobile_nav_container #meta-nav-wrapper ul li{
		padding:0;
	}
	.mobile_nav_container #meta-nav-wrapper ul li.font_trigger{
		display:inline-block;
		background: transparent;
		_padding-left:7px;
	}
	.mobile_nav_container #meta-nav-wrapper ul li.font_trigger a{
		background: transparent;
	}
	nav#meta-nav-wrapper ul li.high_contrast a::before{
		background: url(../img/high_contrast_icon-active.svg) center center no-repeat;
    	background-size: 100% auto;
	}
	nav#meta-nav-wrapper ul li.leichte_sprache a::before{
		background: url(../img/einfache_sprache_icon_white.svg) center center no-repeat;
    	background-size: auto 100% ;
	}
	nav#meta-nav-wrapper ul li.link_oberseite a{
		border:2px solid white;
	}
	.mobile_nav_container > div{
        padding:20px; 
		padding-top:28vw;
	}
	.mobile_nav_container.left{
		margin-top:0;
		margin-left:-200%;
	}
	.mobile_nav_container > a{
		color: #fff;
	}
    .mobile_nav_container div > ul{
		padding-left: 0;
	}
    .mobile_nav_container ul li{
        text-align: left;
		display:block;
		margin-bottom: 1.875rem;
		font-size: 1.5rem;
		position: relative;
		font-family:'Nunito',sans-serif;
	}
    .mobile_nav_container ul.sub-menu li{
		margin-bottom: 1rem;
	}
    .mobile_nav_container ul li a{ 
		text-decoration: none;
		color: #fff;
		font-size: 1.25rem;
	}
	.mobile_nav_container ul li.current-menu-item > a,
	.mobile_nav_container ul li.current-menu-parent > a{ 
		text-decoration: underline;
	}
    .mobile_nav_container ul li .sub-menu{
		margin-top: .5rem;
		
	}
	nav#main-nav > div {
		padding-left:0;
	}
	nav#main-nav ul{
		display:block;
	}
	nav#main-nav ul li{
		text-align: left;
	}
	nav#main-nav{
		float:none;
		margin-left:0;
		padding-top:0;
	}
	nav#main-nav ul li:first-child a,
	nav#main-nav ul li:last-child a,
	nav#main-nav ul li a{
		padding:20px;
	}
    .mobile_nav_container nav ul li a{
        color:black;
        border-bottom:0;
        font-size:1.25em;
        font-weight:500;
        letter-spacing:2px;
    }
    
    .mobile_nav_container nav ul li.current-menu-item a span, 
    .mobile_nav_container nav ul li.current_page_parent a span, 
    .mobile_nav_container nav ul li:hover a span{
        border-bottom:0;
        font-weight:500;
    }
    
    .mobile_nav_container nav ul li ul.sub-menu{
        display:block;
        position:relative;
        left:0;
        margin-left:0;
        background:rgba(0,0,0,0);
        width:100%;
        padding:40px 0 0 40px;
    }
    .mobile_nav_container nav ul li ul.sub-menu li{
        float:none;
        width:90%;
    }
    .mobile_nav_container nav ul li ul.sub-menu li a,
    .mobile_nav_container nav ul li ul.sub-menu li a:before{
        background:none !important;
        color:white;
        padding:0;
    }
    
    .mobile_nav_container nav ul li ul.sub-menu li:hover a{
        text-decoration:none;
    }
    .mobile_nav_container nav ul li ul.sub-menu li:hover a .textarea{
        bottom:0;
    }
    .mobile_nav_container nav ul li ul.sub-menu li a .textarea h2 {
        border-bottom:0;
        font-weight:700;
        text-transform:none;
        margin-bottom:.2em;
        padding-bottom:0;
    }
    
    .mobile_nav_container nav ul li ul.sub-menu li a{
        width:100%;
        height:auto;
    }
	
	.blog_roll_container{
		flex-wrap: wrap;
	}
	.blog_roll_container.posts-2 .blog_roll_single_post:first-child {
		margin-right: 0px;
	}
	.blog_roll_container.posts-1 > article,
	.blog_roll_container.posts-2 > article,
	.blog_roll_container.posts-3 > article,
	.blog_roll_container.posts-3 .blog_roll_single_post:nth-child(2){
		width: auto;
		margin: 12.5px 0;
	}
	.blog_roll_container.posts-1 .blog_roll_single_post{
		width: calc(100% - 50px);
	}
	
	.blog_roll_container.posts-1 .blog_roll_single_post a{
		flex-direction: column;
		flex-wrap: wrap;
	}
	.posts-1 .post_header,
	.posts-1 .post_content{
		width: 100%;
	}
	.blog_roll_container.posts-1 .blog_roll_single_post .post_content{
		padding-left: 0;
		padding-top: 25px;
	}
	.zentriert.mittel .fl-col-content,
	.zentriert.gross .fl-col-content{
		_padding: 0;
	}
	.zentriert.gross .fl-col-content .fl-rich-text,
	.kontakt_box .fl-module-heading .fl-heading,
	.kontakt_box .fl-rich-text{
		padding: 0 25px !important;
	}
	
	.text_rechts .fl-heading,
	.text_rechts .fl-rich-text{
		text-align: left;
	}
	.fl-rich-text{
		padding: 0;
	}
	.testimonial{
		margin-bottom: 25px;
	}
	.stoerer .fl-row-content{
		margin-left: 0;
		margin-right: 0;
	}
	.fl-row-fixed-width.farbe-1, .fl-row-fixed-width.farbe-2, .fl-row-fixed-width.farbe-3, .fl-row-fixed-width.farbe-4{ border-left:0; border-right:0;}
	
	#single_content.veranstaltung .header_image,
	#single_content.veranstaltung .entry .sidebar{
		width: 33%;
	}
	
	.single-veranstaltung article header .article_titel,
	#single_content.veranstaltung .entry .content{
		width: 67%;
	}
	
	.weisser-hintergrund .fl-module{
		height:270px;
		background:transparent;
		display:flex;
		justify-content: center;
		align-items:center;
	}
	.weisser-hintergrund .fl-module .fl-module-content{

	}
	.weisser-hintergrund .fl-module img{
		max-height:100%;
		max-width:400px;
		width:auto;
	}
}

@media (max-width: 768px)
{
	.single-veranstaltung article header,
	.single-veranstaltung .entry{
		flex-wrap: wrap;
	}
	#single_content.veranstaltung .header_image,
	#single_content.veranstaltung .entry .sidebar,
	.single-veranstaltung article header .article_titel,
	#single_content.veranstaltung .entry .content{
		width: 100%;
	}
	.single-veranstaltung article header .article_titel{
		min-height: 0;
		padding-top: 1rem;
		padding-bottom: 1rem;
	}
	.blog_roll_container.posts-1 > article, .blog_roll_container.posts-2 > article, .blog_roll_container.posts-3 > article, .blog_roll_container.posts-3 .blog_roll_single_post:nth-child(2) {
		width: auto;
		margin: 12.5px 25px;
	}
	.blog_roll_container.posts-2 .blog_roll_single_post:last-child,
	.blog_roll_container.posts-2 .blog_roll_single_post:first-child{
		margin: 12.5px 25px;
	}
}

@media (max-width: 640px)
{
	.header_inner{
		padding: 0;
	}
	#header_logo_meta{
		padding: 0 20px;
	}
	.hamburger-inner{
		margin-top:0;
	}
	.hamburger-box{
		height:30px;
	}
	.trainings-2 .weisse-boxen .fl-module-heading .fl-module-content, .trainings-2 .weisse-boxen .fl-module-rich-text .fl-module-content{
		margin-left:20px;
		margin-right:20px;
	}
	#footercontent ul li{
		width:100%;
	}
	#footer_logo .seperator{
		display:none;
	}
	#footer_logo a{

		display:table;
		margin:20px auto;
	}
	#logo_container {
		width: 180px;
	}
	.veranstaltungsliste.post-count-1 .veranstaltungsliste-meta, .veranstaltungsliste.post-count-1 .veranstaltungsliste-content,
	.veranstaltungsliste .veranstaltungsliste-item{
		width: 100%;
	}
	.veranstaltungsliste.post-count-1 .veranstaltungsliste-item{
		display: block;
	}
	.veranstaltungsliste.post-count-1 .veranstaltungsliste-meta{
		padding-right:0;
		margin-bottom:20px;
	}
	.veranstaltungsliste.post-count-1 .veranstaltungsliste-content{
		padding-left:0;
	}
	
	.veranstaltungsliste .veranstaltungsliste-item:nth-child(even){
		padding-left: 0;
	}	
	.veranstaltungsliste .veranstaltungsliste-item:nth-child(odd){
		padding-right: 0;
	}
	.blog_roll_container.posts-show-all {
		width:100% !important;
		display:block !important;
		margin-bottom:20px !important;
	}
	
	.mobile_nav_container > #meta-nav-wrapper ul li.link_oberseite a,
	.mobile_nav_container > #meta-nav-wrapper ul li.link_oberseite a{
		white-space: normal;
	}
}

@media (max-width: 480px)
{
	body,
	.mobile_nav_container > div{
		padding-top:180px;
	}
	h1, .h2-xxl h2, .h3-xxl h3, .h4-xxl h4, .font-size-xxl p, .font-size-xxl span, .font-size-xxl a, .font-size-xxl li {
		font-size: 2rem;
	}
	h2, .h3-xl h3, h3, .h4-xl h4, .font-size-xl p, .font-size-xl span, .font-size-xl a, .font-size-xl li, .veranstaltungsliste-item .veranstaltungsliste-headline{
		font-size:1.75rem;
	}
	
	body{
		padding-top:140px !important;
		
	}
}
