/* ========== HOME / BILD LINKS ========== */
.grid_311 {
display: grid;
grid-template-columns: 0px 1fr 1fr 1fr 100px;
grid-template-rows: auto;
margin-bottom:80px;

}

.div311_pic { grid-area: 1 / 1 / 2 / 4; }
.div311_txt { grid-area: 1 / 4 / 2 / 5; }
.div311_gap { grid-area: 1 / 5 / 2 / 6; }


.div311_pic { border:0px solid #FF0000;}
.div311_txt { border:0px solid #00C0FF;padding-top:00px;}
.div311_gap { border:0px solid #00BF00;}



@media all and (max-width: 1500px) {
         .grid_311 { grid-template-columns: 0px 1fr 1fr 2fr 20px;}
         .div311_txt { padding-top: 40px;}
         .div311_pic { padding-top: 40px;}
}

@media all and (max-width: 1000px) {
         .grid_311 { grid-template-columns: 0px 1fr 1fr 2fr 20px;}
         .div311_txt { padding-top: 20px;}
         .div311_pic { padding-top: 80px;}
}



@media all and (max-width: 900px) {
         .grid_311 {
          grid-template-columns: 1fr;
          grid-template-rows: 1fr auto;
         }

         .div311_pic { grid-area: 1 / 1 / 2 / 2; padding-top: 0px;}
         .div311_txt { grid-area: 2 / 1 / 2 / 3; padding:0 20px 0 20px;}

}



/* ========== HOME / BILD RECHTS ========== */
.grid_113 {
display: grid;
grid-template-columns: 100px 1fr 1fr 1fr 0px;
grid-template-rows: 1fr;
margin-bottom:80px;

}

.div113_gap { grid-area: 1 / 1 / 2 / 2; }
.div113_txt { grid-area: 1 / 2 / 2 / 3; }
.div113_pic { grid-area: 1 / 3 / 2 / 6; }

.div113_pic { border:0px solid #FF0000;}
.div113_txt { border:0px solid #00C0FF;padding-top:00px;}
.div113_gap { border:0px solid #00BF00;}


@media all and (max-width: 1500px) {
         .grid_113 { grid-template-columns: 20px 2fr 1fr 1fr 0px;}
         .div113_txt { padding-top: 40px;}
         .div113_pic { padding-top: 40px;}
}


@media all and (max-width: 1000px) {
         .grid_113 { grid-template-columns: 20px 2fr 1fr 1fr 0px;}
         .div113_txt { padding-top: 20px;}
         .div113_pic { padding-top: 80px;}
}



@media all and (max-width: 900px) {
         .grid_113 {
         grid-template-columns: 1fr;
         grid-template-rows: 1fr auto;
         }

         .div113_pic { grid-area: 1 / 1 / 2 / 2; padding-top: 0px;}
         .div113_txt { grid-area: 2 / 1 / 3 / 2; padding:0 20px 0 20px;}



}





/* =========== 4 spalten > 1 + 1 + 2 ======== */
.gridtype4fr {
display: grid;
grid-template-columns: repeat(4, 24.2%);
grid-template-rows: auto;
grid-column-gap: 1%;
grid-row-gap: 0px;
margin-bottom:0px;
border:0px solid #FF0000;
}

.grd4fr_a { grid-area: 1 / 1 / 2 / 2; border-left:0px solid #5f8ce9; padding:2px 10px 0 0px}
.grd4fr_b { grid-area: 1 / 2 / 2 / 3; border-left:0px solid #5f8ce9;}
.grd4fr_c { grid-area: 1 / 3 / 2 / 5; border-left:1px solid #5f8ce9;}



@media all and (max-width: 800px) {
        .gridtype4fr {
        grid-template-columns: repeat(4, 24.2%);
        grid-template-rows: repeat(2, auto);
        }

        .grd4fr_a { grid-area: 1 / 1 / 2 / 3; margin-bottom:10px;}
        .grd4fr_b { grid-area: 1 / 3 / 2 / 5; margin-bottom:10px;}
        .grd4fr_c { grid-area: 2 / 1 / 3 / 5; border-left:0px solid #5f8ce9;}

}



/* =========== 4 spalten > 2 + 2 ======== */
.grd2fr_a { grid-area: 1 / 1 / 2 / 3; border:0px solid #00FFDF; }
.grd2fr_c { grid-area: 1 / 3 / 2 / 5; border:0px solid #00FFFF; }



@media all and (max-width: 800px) {
        .grd2fr_a { grid-area: 1 / 1 / 2 / 5; }
        .grd2fr_c { grid-area: 2 / 1 / 3 / 5; }
}


/* =========== 4 spalten > 1 + 1 + 1 + 1 ======== */
.grd4fr_e { grid-area: 1 / 1 / 2 / 2;  }
.grd4fr_f { grid-area: 1 / 2 / 2 / 3; }
.grd4fr_g { grid-area: 1 / 3 / 2 / 4; }
.grd4fr_h { grid-area: 1 / 4 / 2 / 5; }



@media all and (max-width: 800px) {
         .grd4fr_e { grid-area: 1 / 1 / 2 / 3;  }
         .grd4fr_f { grid-area: 1 / 3 / 2 / 5; }
         .grd4fr_g { grid-area: 2 / 1 / 3 / 3; }
         .grd4fr_h { grid-area: 2 / 3 / 3 / 5; }
}



