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

.grid-6 {
width: 100%;  }
.grid-4 {
width: 100%; }


#start
{ width: 75vW;
left: 25vW; }

#content
{ width: 75vW;
left: 25vW; }

#impressum
{ width: 75vW;
left: 25vW; }


.sidebar {
height: 100%;
width: 25%;}} 



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

body
{ font-size: 14px; }
/* S I D E B A R */

#schalter {
display: none; }

#header_mobile
{ display: block;
width: 100%; 
height: 50px; 
position: fixed;
z-index: 5000;
background: #f2f2f2;
-webkit-touch-callout: none; 
-webkit-user-select: none;
-khtml-user-select: none; 
-moz-user-select: none; 
-ms-user-select: none; 
user-select: none; 
border-bottom: 1px solid #000; }

#header_desktop
{ display: none; }  

#logo_m
{ height: 36px;
width: auto;
position: fixed;
left: 0;
top: 0;
z-index: 10000;
display: block;
margin: 7px 15px; }

.sidebar {
width: 0;
border-right: 1px solid #000;
left: -1px;
transition: 0.3s;
padding-top: 55px;  /* ais .top 10% und #logo 8vH + 1px border  */
 }

#kontakt
{ padding: 15px 15px; }

a.navi
{ font-size: 22px; /*anstatt 24üx desktop */
margin-left: 5px;
margin-top: 1px;} 

h1
{ font-size: 22px;
border: 0px solid #000;
border-radius: 35px;
margin-left: -11px; }

#start
{ width: 100vW;
left: 0vW;
height: 100%;
padding: 0px; }



p.start
{ font-size: 26px;
line-height: 115%;
padding: 15px;  }

#content
{ width: 100vW;
left: 0vW;
top: 100vH; 
padding: 15px; }

#impressum
{ width: 100vW;
left: 0vW;
top: 45px; 
padding: 15px; }




#unternehmen
{ height: 100vH; }

[class*='grid-'] {
float: left;
width:100%;
padding: 0px 0px 20px 0px; }


.top_start {
top: 45px; }
.top {
top: 55px; }

.wrap
{ padding-top: 55px;
margin-bottom: -35px }

/*-----------------------------------------*/


a.show,
a.hide
{ font-family: "Starter-Light";
display: block; 
padding: 0px 10px;
font-size: 32px;
position: fixed; 
padding-top: 4px;
z-index: 1000;
width: 100%;
text-align: right;
border-bottom: 0px } /* weil a border-bottom: 1px; */
a.show:hover,
a.hide:hover
{ text-decoration: none; } 

a.hide
{ font-size: 32px;
display: none;
padding-top: 4px; }


.space
{ min-height: 0px;
width: 100%;
display: block;
background: transparent; }


h1
{ font-size: 22px;
border: 0px solid #000;
padding: 1px 10px 2px 10px;
border-radius: 35px;
margin-bottom: 20px;}

h2, 
h3
{ font-size: 22px;}

h3
{ margin-bottom: 4px; }

h4 
{ font-size: 18px;
margin-bottom: 4px; }

.s 
{ max-height: calc(100% - 30px);
max-width: calc(100% - 30px);
left: 0%;}

p.highlight
{ font-size: 16px;
padding: 0px 6px 0px 6px;}

p.highlighth4
{ font-size: 22px;
padding: 0px 6px 0px 6px;}



a.mehr:hover
{ text-decoration: none;
border: 1px solid #000;
background: transparent;}

.grid-6 {
width: 100%;  }
.grid-4 {
width: 100%; } } 


}