@media only screen and (min-width: 1024px) {
    #header {
        display:none;
    }
	#mainmenu label, #mainmenu input {
        display:none;
    }
}

@media only screen and (max-width: 1024px) {
	html, body {
		height: auto;
		width: auto;
	}
	html {
    	overflow: scroll;
    	background-position: center top;
	}
    #footer #mainmenu, #footer #logo {
        display:none;
    }
	#logo {
		margin-left: 30px;
	}
	#header {
	    position: absolute;
	    height: 130px;
	    margin-bottom: 0px;
		width: 600px;
	    background: rgba(255,255,255,0.9);
		z-index: 3000;
		right: 30px;
		top: 30px;
	}
	#text {
	    position: relative;
	    width: 600px;
		height: auto;
	    margin-left: auto;
	    margin-top: 160px;
		left: auto;
	    background: rgba(255,255,255,0.9);
		margin-right: 30px;
		margin-bottom: 30px;
	}
	.scroll-pane {
	    height: auto;
		width: 530px;
	}
	.jspContainer {
    	margin-top: 0px;
	}
	#footer {
	    position: relative;
	    height: 44px;
		background-position: bottom;
		z-index: auto;
	}
	#footercontent {
	    width: auto;
	    height: auto;
		margin-right: 30px;
	}

	.burger{font: 300 100%/1 Roboto, FontAwesome, sans-serif;}
	.burger label { display: block; height: 120px; width: 120px; line-height: 120px; text-align: center; color: #91c912; font-size: 2.8rem; background: #fff; cursor: pointer; float: right;}
	.burger .nav { display: none; }
	#mainmenu.burger {
	    float: right;
	    position: absolute;
	    right: 0px;
	    width: 100%;
	}
	#mainmenu.burger ul li { 
		width: 100%; 
		padding: 10px; 
		display: block;
		text-align: right;
		box-sizing: border-box;
		padding-right: 47px;
		height: auto;
	}
	#mainmenu.burger ul li:hover {
	    color: #91c912;
	    background-color: transparent;
	}
	#mainmenu.burger ul li ul {
	    position: relative;
		display: block;
	    margin-left: -3px;
	    bottom: auto;
	    left: auto;
	    padding-top: 5px;
	    padding-bottom: 5px;
		background-color: transparent;
	}
	#mainmenu.burger ul li ul li { 
	    padding: 5px;
		padding-right: 15px;
	}
	#mainmenu.burger li ul li a {
	    color: #91c912;
	    padding: 3px;
	}
	#mainmenu.burger ul li ul li a:hover {
	    color: rgb(79, 11, 86);
	}
	#mainmenu ul li.active{ 
		color: #91c912;
		background-color: transparent;
	}
	#mainmenu ul li.active ul li a {
		color: #A1CA3E;
    	background-color: transparent;
	}
	#mainmenu.burger li ul li.active a {
	    color: #4f0b56;
    	background-color: transparent;
	}
	#mainmenu ul li.active:first-child > a {
		color: #ffffff;
    	background-color: #A1CA3E;
	}
	#menu-toggle:checked ~ .nav {
		display: block; 
		width: 100%;
		background-color: white;
		margin-top: 120px; 
	}
	.burger label:active .nav { display: none;  }
	#mainmenu input {
        display:none;
    }
	
}

@media only screen and (max-width: 660px) {
	html{
		background-attachment: fixed;
	}
	#header {
	    width: auto;
	    margin-right: 30px;
	    margin-top: 30px;
	    margin-left: 30px;
	    box-sizing: border-box;
	    position: relative;
		right: 0px;
		top: 0px;
	}
	#text {
	    width: auto;
	    margin-right: 30px;
	    margin-top: 0px;
	    margin-left: 30px;
	    box-sizing: border-box;
	    position: relative;
		right: 0px;
		top: 0px;
	}
	.scroll-pane {
	    margin-top: 0px;
		width: auto;
	    margin-right: 10px;
	}
	#footer {
        height: 70px;
    	background-color: #333333;
		background-image: none;
    }
	#langmenu {
		float: none;
		text-align: center;
	}
	#footermenu {
        padding-top: 0px !important;
    }

	.jspContainer {
	}
	.jspPane div{
		padding-right: 20px;
	}
	#logo {
		width: 60%;
	}
	#logo img{
		width: 100%;
		height: auto;
		max-width: 270px;
	}
	.burger label {
	    display: block;
	    height: 70px;
	    width: 70px;
	    line-height: 70px;
	    background: transparent;
	}
	#footercontent {
    	margin-right: 0px;
	}
	#footermenu {
    	font-size: 13px;
		text-align: center;
		float: none;
		padding-top: 15px;
	}
	#text img{
		max-width: 100%;
		height: auto;
	}
	#text form[id^="rueckrufformular-"] .form-element-text,
    #text form[id^="rueckrufformular-"] .form-element-email {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    #text form[id^="rueckrufformular-"] .form-control {
        width: 100%;
    }

    #text form[id^="rueckrufformular-"] .form-element-check,
    #text form[id^="rueckrufformular-"] .actions {
        margin-left: 0;
    }
	
    #text form[id^="kontaktformular-"] .form-element-text,
    #text form[id^="kontaktformular-"] .form-element-email,
    #text form[id^="kontaktformular-"] .form-element-textarea {
        grid-template-columns: 1fr;
    }

    #text form[id^="kontaktformular-"] .form-element-check,
    #text form[id^="kontaktformular-"] .actions {
        margin-left: 0;
    }
}