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

	#start h1 {
		    font-size: 12vw;
    		margin: 0 0 2vh;
    		line-height: 12vw;
}
	.wrapper {
	width:90%;	
		}
	#logo {
		display: none;
	}
	
	#logo_icon {
		top:34px;
	}
	

    #top {
        padding-top: 180px;
        height: 400px;
    }
    
    .unterseite #top {
        padding-top: 0px!important;
        height: 100px!important;
    }
    
    #workshops .box_content .button {
        margin-top: 20px;
  position: inherit;
  bottom: inherit;
}
    
	
	h2 {
		font-size: calc(28px + 2vw);
		line-height: calc(32px + 3vw);
		margin-bottom: 20px;
	}
	
		h3, h3 *, .box_16_quadrat h3, hr * {
			font-size: calc(12px + 2vw);
			line-height: calc(12px + 3vw);
			margin-bottom: 20px;
  
}
	
	h4 {
font-size: calc(20px + 2vw);
		line-height: calc(24px + 3vw);	}
	

p, li, li a {
		font-size: calc(12px + 1vw);
		line-height: calc(14px + 2vw);
	}

	#mainmenu li a {
			font-size: calc(14px + 1vw);
			padding: 3%;
	}

	.openedmenu {
		width: 100%!important;
	}
	
	.overlay_content {
		width: 90%;
		left: 0;
		margin: 0 5%;
		top:0;
		padding: 40px;
	}

	#menuswitch {

display:block;
width:30px;
height: 20px;
position:fixed;
right:20px;
top:22px;
border-top:4px solid #efefef;
	z-index: 10;
		transition: all 0.5s ease;

}

#menuswitch:after {
	content: " ";
	display:block;
	border-top:4px solid #efefef;
	margin-top:4px;
	transition: all 0.5s ease;
	}

#menuswitch:before {
	content: " ";
	display:block;
	border-top:4px solid #efefef;	
	margin-top:4px;
	transition: all 0.5s ease;

	}


.opened:after {
	transform: rotate(90deg)!important;
	transition: all 0.5s ease;
	margin-top: -10px!important;
    margin-left: -1px!important;
	border-bottom:0!important;
	border-top:4px solid #000!important;	

}

.opened:before {
	border: 0!important;
	margin-top: 6px!important;
}
	
	
.opened {
	border-top-color:#000!important;
	transform: rotate(45deg)!important;
	height:6px!important;
	transition: all 0.5s ease;
	position: absolute;
	border-bottom: 0!important;
	top:26px!important;


	}	

#mainmenu_nav {
	position: fixed;
	top:0;
	right: 0;
	height: 100%;
	width: 0;
	background-color:#fff;
	z-index: 4;
	transition: all 0.5s ease;

}
	
	#mainmenu {
		right: 0;
		
		display: none;
	}
	
	.openedmenu #mainmenu {
		display: block!important;
		width: 100%!important;
	}
	
	#mainmenu li {
width: 100%;
    float: none;
	}
	#mainmenu li a {
		color: #000!important;
		width: 100%;
		    float: none!important;
		margin: 0!important;
		text-align: center;

	}
	
	.parallax_container {
		display: none;
	}
	
    
    .mobile_visible {
  display: block;
}
    
    
    .mobile_invisible {
  display: none;
}
        
	
	#footer .col_25 {
		margin: 0 0 20px 0;
	}
	
	#header {
		z-index: 4;
	}
	

	
	
#header {
	position: fixed;
	width: 100%;
	top: 0;
height: 66px!important;
background-color: rgba(0,0,0,.7)!important;	
	}

	
	#header h1 a {
		width: 170px;
		background-repeat: no-repeat;
		top: 6px;
		background-image: url("../img/logo_mobile.png");
	}	
	
	
	.col_33 {
		width: 100%;
		margin: 2% 0;
	}
	
	.col_67 {
    width: 100%;
    float: none;
}
	
	.col_25 {
		width: 48%;
		margin: 1%;
	}
	
	.unterseite .col_25 {
		width: 100%;
		margin: 0;
	}
	
	.unterseite .col_50 {
		width: 100%;
		margin: 0;
	}
	
	.col_70 {
    width:100%;
    float: none;
    position: relative;
}
	
	.box_quadrat {
		width: 50%;
		margin: 0;
		border: 4px solid #e7e7e7;
	}
	
	#workshops .box {
    min-height: inherit;
}
	
	#workshops .box_content {
    min-height: inherit;
}
	.section {
		padding: 20px 0;
	}
	
	#features br {
		display: none;
	}
	
	.flex_container {
    display: block;
    align-content: center;
    box-sizing: border-box;
}
	img.flex_child  {
		width: 100%;
		
		height: auto;
	}
	
	.flex_child {
		padding: 20px 0;
	}
	.fltrt {
		float: none;
	}
	
	#footermenu li, #footermenu li a {
    font-size: 11px;
}
	
	#press .box_content {
    padding: 10px;
    position: relative;
}
	.mouse {
		display: none;
	}
	
	
	#mainmenu ul {
		box-shadow: 0!important;
		display: none!important;
		height: 0;
		margin: 0;
		padding: 0;
	}
	
	#mainmenu  ul li {
		display: none!important;
		height: 0;
		margin: 0;
		padding: 0;
	
}
	
	.unterseite img {
		max-width: 100%;
		height: auto;
	}

	.fltlft {
		float: none;
	}
	
	ol li {
		width: 100%;
		display: block;
		background-image: none!important;
	}
	
	#top h2 {
		margin: 0;
    font-size: 32px;
    line-height: 32px;
    color: #ffffff;
    font-weight: 600;
    text-align: left;
    text-transform: inherit;
    text-shadow: rgba(0,0,0,.2) 0 0 20px;
}
	
	#startseite #top {
		background-image: url("../img/img_top_mobile.jpg");
	}
	#top h3 {
		margin: 20px 0 20px 0;
font-size: 20px;
width: 100%;
line-height: 20px;
color:#009fdf !important;

	}
	
	.icon_back {
   display: none!important;
}
	
	#workshops br {
		display: none;
	}
	
	.spacer_20 {
		height: 10px;
	}
	
	.mobile_invisible {
		display: none;
	}
	
	
	#video {
		width: 100%;
		height: auto;
	}
	
	.stoerer {
    z-index: 3;
    position: absolute;
    right: 0;
    left: inherit;
    transform: scale(0.8);
}
	
}