
header #grid {
  	display: grid;
  	grid-template-columns:11% 30% auto;
  	gap: 0;

	}
header #grid div {
	align-self: end; 
	}
#grid-img-l {
    display: grid;
    grid-template-columns: 50% 30% auto;
    margin-bottom: 100px; 
    padding: 0 20px;
	text-align:right;
    }
#grid-img-sm-l {
    display: grid;
    grid-template-columns: 30% 40% auto;
    margin-bottom: 100px; 
    padding: 0 20px;
	}
#grid-img-r {
    display: grid;
    grid-template-columns: auto 35% 45%;
    margin-bottom: 100px; 
    padding: 0 20px;
    }
#grid-img-img {
    display: grid;
    grid-template-columns: 60% 40%;
    margin-bottom: 100px; 
    padding: 0 20px;
    }
#grid-textblock {
    display: grid;
    grid-template-columns: 28% 42% auto;
    margin-bottom: 100px; 
    padding: 0 20px;
	}
.overlap-l {
    position: relative;
    z-index: 2;
    left: -5vw;
    top: 8vh;
	text-align:left;
    }
.overlap-r {
    position: relative;
    z-index:2;
    top: 4vh;
    left:8vw;
    }
.re-ausr {
  	justify-self: end;
    }
.bildklein {
	max-width: 300px;
	
	}
/**********************************************/
/********** SITEMAP UNTERSEITEN ****************/
/**********************************************/

.image-grid-preview {
	display: grid;
	gap:20px;
	grid-template-columns: repeat(6, 1fr);
	grid-template-rows: repeat(300px, 1fr);
	margin:0  20px;
	max-width:100vw;
 	}
.image-grid-preview .item img{
	height:100%;
	width: 100%;
	object-fit:cover;
 	}
.image-grid-preview .item:nth-child(1){
	grid-column: 1 / 4;
	grid-row: 1 / span 3;
 	}
.image-grid-preview .item:nth-child(2){
	grid-column: 4 / 7;
	grid-row: 2 / span 3;
 	}
.image-grid-preview .item:nth-child(3){
	grid-column: 2 / 4;
	grid-row: 4 / span 2;
 	}
.image-grid-preview .item:nth-child(4){
	grid-column: 4 / span 2;
	grid-row: 5 / span 2;
 	}
.image-grid-preview .item:nth-child(5){
	grid-column: 1 / 4;
	grid-row: 6 / span 3;
 	}
.image-grid-preview .item:nth-child(6){
	grid-column: 4 / auto;
	grid-row: 8 / span 3;
 	}
.image-grid-preview .item:nth-child(7){
	grid-column: 2 / 4;
	grid-row: 9 / span 2;
 	}
.image-grid-preview .item:nth-child(8){
	grid-column: 4 / span 3;
	grid-row: 10 / span 3;
 	}
.image-grid-preview .item:nth-child(9){
	grid-column: 4 / span 2;
	grid-row: 13 / span 1;
	align-self: end;
 	}
.image-grid-preview .item:nth-child(10){
	grid-column: 1 / span 3;
	grid-row: 13 / span 1;
 	}
.image-grid-preview .item:nth-child(11){
	grid-column: 4 / span 3;
	grid-row: 14 / span 1;
 	}
.image-grid-preview .item:nth-child(12){
	grid-column: 2 / 4;
	grid-row: 14 / span 1;
 	}
.image-grid-preview .item:nth-child(13){
	grid-column: 4 / span 2;
	grid-row: 15 / span 3;
 	}
/*********************************************/
/********** Projektvorstellung   **************/
/**********************************************/

.grid-pr_einstieg {
	display: grid;
	gap:20px;
	grid-template-columns: repeat(6, 1fr);
	grid-template-rows: repeat(6, 1fr);
	margin:0  20px 120px 20px;
	max-width:100vw;
	}
.grid-pr_einstieg .item img{
	height:100%;
	width: 100%;
	object-fit:cover;
 	}
.grid-pr_einstieg .item:nth-child(1){
	grid-column: 1 / 4;
	grid-row: 1 / span 1;
 	}
.grid-pr_einstieg .item:nth-child(2){
	grid-column: 4 / 6;
	grid-row: 1 / span 1;
	align-self: end;
 	}
.grid-pr_einstieg .item:nth-child(3){
	grid-column: 1 / 4;
	grid-row: 2 / span 6;
 	}
.grid-pr_einstieg .item:nth-child(4){
	grid-column: 4 / 6;
	grid-row: 2 / span 3;
 	}
.grid-pr_einstieg .item:nth-child(5){
	grid-column: 4 / 6;
	grid-row: 5 / span 3;
 	}



.grid-pr_66_breit {
	display: grid;
	gap:40px;
	grid-template-columns: repeat(6, 1fr);
	margin:40px 20px;
	max-width:100vw;
	}
.grid-pr_66_breit .item img{
	height:100%;
	width: 100%;
	object-fit:cover;
 	}
.grid-pr_66_breit .item:nth-child(1){
	grid-column: 1 / 4;
 	}
.grid-pr_66_breit .item:nth-child(2){
	grid-column: 4 / 7;
 	}


.grid-pr_66_schmal {
	display: grid;
	gap:40px;
	grid-template-columns: repeat(6, 1fr);
	margin:40px 20px;
	max-width:100vw;
	}
.grid-pr_66_schmal .item img{
	height:100%;
	width: 100%;
	object-fit:cover;
 	}
.grid-pr_66_schmal .item:nth-child(1){
	grid-column: 2 / 4;
 	}
.grid-pr_66_schmal .item:nth-child(2){
	grid-column: 4 / 6;
 	}


.grid-pr_12_breit {
	display: grid;
	gap:20px;
    grid-template-columns: 80%;
	margin:80px 20% 80px 5%;
	}

.grid-pr_12_breit .item {
	grid-column: 1 / 7;
 	}


.grid-container-kunden {
  	display: grid;
  	grid-template-columns: 1fr 1fr 1fr;
  	grid-auto-rows: minmax(150px, auto);
  	gap: 0 20px;
	margin:20px 10%;
	}
.grid-4-spalter {
  	display: grid;
  	grid-template-columns: 1fr 1fr 1fr 1fr;
  	grid-auto-rows: minmax(150px, auto);
  	gap: 0 20px;
	margin:20px 10%;
	}
.projektmenu_oben {
	margin:35px auto auto 35%;
	}
.projektmenu {
  	display: grid;
  	grid-template-columns: 1fr 1fr;
  	gap: 0;
	margin:100px 18%;
	}
.link-li {
	text-align:left;
	padding-left:150px;
  	background-image: url(../Images/pfeil_links.svg);
	background-repeat:no-repeat;
	background-size: auto 12px;
	background-position:left 6px;
	}
.link-li a{
	margin:auto;
	padding-right:auto;
	text-transform:uppercase;
	}
.link-re {
	text-align:right;
	padding-right:150px;
  	background-image: url(../Images/pfeil_rechts.svg);
	background-repeat:no-repeat;
	background-size: auto 12px;
	background-position:right 6px;
	}
.link-re a{
	margin:auto;
	padding:auto;
	text-transform:uppercase;
	}


.footergrid {
  	display: grid;
  	grid-template-columns: 1fr 1fr 1fr;
  	gap:20px;
	margin:200px 5% 100px 5%;
	}
.footergrid .item {
	align-self: end; 
	}





/**********************************************/
@media only screen and (max-width: 1600px)  {


.footergrid {
  	gap:20px;
	margin:200px 5% 100px 5%;
	}
.image-grid-preview .item:nth-child(6){
	grid-column: 4 / 6;
	grid-row: 8 / span 1;
 	}

}

/**********************************************/
@media only screen and (max-width: 1280px)  {

#grid-img-sm-l {
    display: grid;
    grid-template-columns: 20% 60% auto;
    margin-bottom: 100px; 
    padding: 0 20px;
	}
.grid-container-kunden {
	margin:20px 2%;
	}
.footergrid {
	gap:5px;
    grid-template-columns: 230px auto 450px;
	margin:200px 20px 100px 20px;
	}
#grid-img-l {
    display: grid;
    grid-template-columns: 50% 45% auto;
    }
#grid-img-sm-l {
    display: grid;
    grid-template-columns: 40% 50% auto;
	}
#grid-img-r {
    display: grid;
    grid-template-columns: auto 45% 45%;
    }
#grid-textblock {
    grid-template-columns: 20% 60% auto;
	}
.grid-pr_einstieg {
	display: grid;
	gap:20px;
	grid-template-columns: repeat(6, 1fr);
	grid-template-rows: repeat(5, 1fr);
	margin:0  20px 60px 20px;
	max-width:100vw;
	}

.grid-pr_einstieg .item:nth-child(1){
	grid-column: 1 / 4;
	grid-row: 1 / 2; 
 	}
.grid-pr_einstieg .item:nth-child(2){
	grid-column: 4 / 7;
	grid-row: 1 / 2; 
 	}
.grid-pr_einstieg .item:nth-child(3){
	grid-column: 1 / 4;
	grid-row: 2 / 6; 
 	}
.grid-pr_einstieg .item:nth-child(4){
	grid-column: 4 / 7;
	grid-row: 2 / 4; 
 	}
.grid-pr_einstieg .item:nth-child(5){
	grid-column: 4 / 7;
	grid-row: 4 / 7; 
 	}



.grid-pr_66_schmal {
	margin:40px 10%;
	}
.grid-pr_66_schmal .item:nth-child(1){
	grid-column: 1 / 4;
 	}
.grid-pr_66_schmal .item:nth-child(2){
	grid-column: 4 / 7;
 	}
.projektmenu_oben {
	margin:45px auto 0 35%;
	}
.projektmenu {
	margin:100px 10%;
	}
.grid-4-spalter {
  	display: grid;
  	grid-template-columns: 1fr 1fr 1fr 1fr;
  	grid-auto-rows: minmax(250px, auto);
  	gap: 0 20px;
	margin:20px;
	}

}



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

header #grid {
  	display: grid;
  	grid-template-columns:11% 35% auto;
  	gap: 0;
	margin:0 0 0 0;
	}
header #grid div {
	align-self: end; 
	}

#grid-img-l {
    display: grid;
    grid-template-columns: 50% 45% auto;
    }
#grid-img-r {
    display: grid;
    grid-template-columns: auto 50% 50%;
    }
#grid-img-sm-l {
    display: grid;
    grid-template-columns: 50% 50% auto;
	}
#grid-textblock {
    grid-template-columns: 15% 70% auto;
	}

.overlap-l {
    top: 4vh;
    }
.overlap-r {
    top: 4vh;
    }
.grid-container-kunden {
  	display: grid;
  	grid-template-columns: 1fr 1fr 1fr;
  	grid-auto-rows: minmax(150px, auto);
  	gap: 0;
	margin:20px;
	}
.grid-pr_einstieg {
	grid-template-columns: repeat(6, 1fr);
	grid-template-rows: repeat(5, 1fr);
	margin:0  20px 20px 0;
	}
.projektmenu_oben {
	margin-left: 100px;
	}
.footergrid {
	gap:50px;
    grid-template-columns: 40% 60%;
	grid-template-rows: repeat(270px, auto);
	margin:120px 40px 100px 40px;
	}
.grid-4-spalter {
  	display: grid;
  	grid-template-columns: 1fr 1fr;
  	grid-auto-rows: minmax(250px, auto);
  	gap: 0 20px;
	margin:20px;
	}
}

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

header #grid {
  	display: grid;
  	grid-template-columns: 50% 50%;
  	gap: 0;
	margin:20px 0 60px 10%;
	}
header #grid div {
	align-self: end; 
    grid-column: span 2; 
    }   
.footergrid {
	display: flex;
    flex-direction: column; 
  	gap: 30px;
	margin:20px 0 30px 20px;
	}
.footergrid .item:nth-child(1) {
	align-self: start; 
	order: 2;
	}
.footergrid .item:nth-child(2) {
	align-self: start; 
	order: 1;
	}
.footergrid .item:nth-child(3) {
	align-self: start; 
	order: 3;
	}


#grid-img-l div, #grid-img-r div, #grid-img-sm-l div {
    grid-column: span 3;
    }

#grid-img-l {
    display: grid;
    grid-template-columns: 50% 50%;
    margin-bottom: 50px; 
    }
#grid-img-l img {
    padding-bottom:20px;
    }
#grid-img-r {
    display: grid;
    grid-template-columns: 50% 50%;
  	margin-bottom: 50px; 
    }
#grid-img-sm-l {
    display: grid;
    grid-template-columns: 50% 50%;
  	margin-bottom: 50px; 
	}
#grid-textblock {
    grid-template-columns: 0 auto 20px;
    margin-bottom: 50px;
	}

.overlap-l {
    top: 0;
    left: 0;
    }
.overlap-r {
    top: 0;
    left:0;
    }
.grid-container-kunden div { 
 	grid-column: span 3;
margin-bottom:30px;
	}  
.grid-container-kunden {
  	grid-template-columns: 1fr;
  	gap: 0;
	margin:20px;
	}
.image-grid-preview {
	display: flex;
    flex-direction: column; 
	gap:20px;
	margin:20px;
	max-width:auto;
 	}
.image-grid-preview .item:nth-child(1){
	grid-column: 1 / 7;
 	}
.image-grid-preview .item:nth-child(2){
	grid-column: 1 / 7;
 	}
.image-grid-preview .item:nth-child(3){
	grid-column: 1 / 7;
 	}
.image-grid-preview .item:nth-child(4){
	grid-column: 1 / 7;
 	}
.image-grid-preview .item:nth-child(5){
	grid-column: 1 / 7;
 	}
.image-grid-preview .item:nth-child(6){
	grid-column: 1 / 7;
 	}
.image-grid-preview .item:nth-child(7){
	grid-column: 1 / 7;
 	}
.image-grid-preview .item:nth-child(8){
	grid-column: 1 / 7;
 	}
.image-grid-preview .item:nth-child(9){
	grid-column: 1 / 7;
 	}
.image-grid-preview .item:nth-child(10){
	grid-column: 1 / 7;
 	}

.grid-pr_einstieg {
	display: flex;
    flex-direction: column; 
	gap:10px;
	margin:0  20px 60px 20px;
	}

.grid-pr_einstieg .item:nth-child(2){
	align-self: start; 
	padding-left:20px;
 	}
.projektmenu_oben {
	margin:20px auto 20px 0;
	}
.projektmenu {
  	display: grid;
  	grid-template-columns: 1fr;
  	gap: 20px;
	margin:100px 18%;
	}



.grid-pr_66_schmal {
	margin:40px 10%;
	}
.grid-pr_66_schmal .item:nth-child(1){
	grid-column: 1 / 7;
 	}
.grid-pr_66_schmal .item:nth-child(2){
	grid-column: 1 / 7;
 	}

.grid-pr_66_breit {
	gap:20px;
	grid-template-columns: repeat(6, 1fr);
	margin:40px 0;
	max-width:100vw;
	}
.grid-pr_66_breit .item:nth-child(1){
	grid-column: 1 / 7;
 	}
.grid-pr_66_breit .item:nth-child(2){
	grid-column: 1 / 7;
 	}

.grid-pr_12_breit {
	display: flex;
    flex-direction: column; 
	gap:20px;
	margin:20px;
	max-width:auto;
	}
.grid-pr_12_breit .item {
	grid-column: 1 / 7;
 	}


.grid-4-spalter {
  	display: grid;
  	grid-template-columns: 1fr 1fr;
  	grid-auto-rows: minmax(250px, auto);
  	gap: 0 20px;
	margin:50px 20px 100px 20px;
	}


.projektmenu {
	margin:100px 20px;
	}
/*
.projektmenu .link-li {
	text-align:left;
	padding-left:100px;
  	background-image: url(../Images/pfeil_links.svg);
	background-size:70% 70%;
	background-size: auto 12px;
	background-position:left 6px;
	}
.projektmenu .link-re {
	text-align:right;
	padding-right:100px;
  	background-image: url(../Images/pfeil_rechts.svg);
	background-repeat:no-repeat;
	background-size: auto 12px;
	background-position:right 6px;
	}
*/

}
