/*########################### ALLGEMEINE EINSTELLUNGEN ###########################*/

#m4_s1_content,#m4_s2_content,#m4_s3_content,#m4_s4_content,#m4_s5_content,#m4_s6_content{
    display:grid;
    grid-template-columns: 6vw 2fr 1.5fr 6vw;
}

#empty_left{
    grid-column: 1; 
    grid-row:1;
}

#m4_s2_content_left,
#m4_s3_content_left,
#m4_s4_content_left,
#m4_s5_content_left,
#m4_s6_content_left{
    grid-column: 2; 
    grid-row:1;
    display: grid;
    justify-items: stretch;
}
#m4_s1_content_top,
#m4_s2_content_top,
#m4_s3_content_top,
#m4_s4_content_top,
#m4_s5_content_top,
#m4_s6_content_top{
    grid-column: 2 / 4;
    grid-row:1;
    display:grid;
    justify-items: stretch;
}

#m4_s1_content_bottom{
    grid-column:2 / 3;
    grid-row:2;
    display:grid;
    justify-items: stretch;
}

#m4_s2_content_right,
#m4_s3_content_right,
#m4_s4_content_right,
#m4_s5_content_right,
#m4_s6_content_right{
    display: grid;
    grid-column: 3; 
    grid-row:1;
}

#empty_right{
    grid-column: 4; 
    grid-row:1;
}

#m4_s1_text,
#m4_s2_text,
#m4_s3_text,
#m4_s4_text,
#m4_s5_text,
#m4_s6_text{
    margin:0 1fr;width:100%;
}

#div_m4_desc{
    left:2vw!important;
    max-width:75%;
    transform: translateY(0vw);
}

/* ##############AUSGANGSHÖHE SUBCATEGORIES UND INDIVIDUELLE HÖHE###########*/
/* AUCH ALS 3. PARAMETER(height_closed) IN DER FUNKTION DER PHP DATEI DER HAUPTKATEGORIE ANPASSEN!!!!*/
#ly_m4_s1{height:30vw;}
#ly_m4_s2{height:20vw; margin-top:0vw;}
#ly_m4_s3{height:30vw; margin-top:0vw;}
#ly_m4_s4{height:22vw; margin-top:-1vw;}
#ly_m4_s5{height:28vw; margin-top:-1vw;}
#ly_m4_s6{height:38vw; margin-top:-1vw;}

#img_ly_m4_s1_t {z-index:1;}
#ly_m4_s1       {z-index:2;}
#img_ly_m4_s1_b {z-index:3;}
#ly_m4_s2       {z-index:4;}
#img_ly_m4_s2   {z-index:5;}
#ly_m4_s3       {z-index:6;}
#img_ly_m4_s3   {z-index:7;}
#ly_m4_s4       {z-index:8;}
#img_ly_m4_s4   {z-index:9;}
#ly_m4_s5       {z-index:10;}
#img_ly_m4_s5   {z-index:11;}
#ly_m4_s6       {z-index:12;}
#img_ly_m4_s6   {z-index:13;}

/* ATTACH FOOTER IMAGE TO BOTTOM*/
#img_ly_m4_s1_b,
#img_ly_m4_s2,
#img_ly_m4_s3,
#img_ly_m4_s4,
#img_ly_m4_s5,
#img_ly_m4_s6{
    bottom:0vw;
}

/*########################### M4 S1###########################*/
#m4_s1_content{
    transform:translateY(8vw);
    display:grid;
    /* grid-template-columns: 6vw 1fr 6vw !important; */
}

#m4_s1_content_top{
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr auto auto;
    gap:3vw;
}

#item_m4_s1_text{
    grid-column:1 / 3;
    grid-row:1;
    justify-items: right;
    align-self:right;
}

#m4_s1_text{text-align:right;justify-content: end;}


#item_m4_s1_1{grid-column: 3 / 5 ; grid-row: 1 ;}
#item_m4_s1_2{grid-column: 1; grid-row: 2; justify-self: end;}
#item_m4_s1_3{grid-column: 2; grid-row: 2; justify-self: end;}
#item_m4_s1_4{grid-column: 3; grid-row: 2; justify-self: end;}
#item_m4_s1_5{grid-column: 4; grid-row: 2; justify-self: end;}
#item_m4_s1_6{grid-column: 1; grid-row: 3; justify-self: end;}
#item_m4_s1_7{grid-column: 2; grid-row: 3; justify-self: end;}
#item_m4_s1_8{grid-column: 3; grid-row: 3; justify-self: end;}
#item_m4_s1_9{grid-column: 4; grid-row: 3; justify-self: end;}

#item_m4_s1_1 img,
#item_m4_s1_2 img,
#item_m4_s1_3 img,
#item_m4_s1_4 img,
#item_m4_s1_5 img,
#item_m4_s1_6 img,
#item_m4_s1_7 img,
#item_m4_s1_8 img,
#item_m4_s1_9 img{
    width:100%;
    height:100%;
    object-fit: cover;
}


/*########################### m4 S2###########################*/
#m4_s2_content{
    transform:translateY(0vw);
    display:grid;
    gap:0;
}

#m4_s2_content_top{
    grid-template-columns: 1fr 0.8fr 0.5fr;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    gap: 3vw;
}
#item_m4_s2_text{
    grid-column: 2 / 4; 
    grid-row:1;
}

#m4_s2_text{text-align:left; justify-content: start;}

#item_m4_s2_1{grid-column: 1; grid-row:1;}
#item_m4_s2_2{grid-column: 1; grid-row:2;}
#item_m4_s2_3{grid-column: 2; grid-row:1 / 3; align-self: center;}
#item_m4_s2_4{grid-column: 3; grid-row:1 / 3; align-self: center;}

#item_m4_s2_1 img,
#item_m4_s2_2 img,
#item_m4_s2_3 img,
#item_m4_s2_4 img
{
    width:100%;
    height:100%;
    object-fit: cover;
}

/*########################### m4 S3###########################*/

#m4_s3_content{
    transform:translateY(0vw);
    display:grid;
    gap:0;
}

#m4_s3_content_top{
    grid-template-columns: 1fr 0.8fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 3vw;
}

#item_m4_s3_text{
    grid-column: 1 / 3; 
    grid-row:1;
    justify-self: end;
}

#m4_s3_text{
    text-align:right; 
    justify-content: end;
}

#item_m4_s3_1{grid-column: 3; grid-row:1;}
#item_m4_s3_2{grid-column: 1; grid-row:2;}
#item_m4_s3_3{grid-column: 2; grid-row:2;}
#item_m4_s3_4{grid-column: 3; grid-row:2;}

#item_m4_s3_1 img
{
    width:100%;
    height:100%;
    object-fit: cover;
}

#item_m4_s3_2 img,
#item_m4_s3_4 img,
#item_m4_s3_3 img{
    width:100%;
    height:auto;
}

/*########################### M4 S4###########################*/

#m4_s4_content{
    transform:translateY(0vw);
    display:grid;
    gap:0;
}

#m4_s4_content_top{
    grid-template-columns: 0.3fr 0.2fr;
    grid-template-rows: 0.2fr 1fr;
    gap: 3vw;
}

#item_m4_s4_text{
    grid-column: 2; 
    grid-row:1;
    justify-self: start;
}

#m4_s4_text{
    text-align:left; 
    justify-content: start;
}

#item_m4_s4_1{grid-column: 1; grid-row:1 / 3;}
#item_m4_s4_2{grid-column: 2; grid-row:2; align-self:end;}

#item_m4_s4_1 img{
    width:100%;
    height:100%;
    object-fit: cover;
}

#item_m4_s4_2 img{
    width:100%;
    height:auto;
    bottom:0px;
}

/*########################### M4 S5###########################*/

#m4_s5_content{
    transform:translateY(0vw);
    display:grid;
    gap:0;
}

#m4_s5_content_top{
    grid-template-columns: 1.4fr 0.6fr ;
    grid-template-rows: auto auto;
    gap: 3vw;
}

#item_m4_s5_text{
    grid-column: 1; 
    grid-row:1;
    justify-self: right;
}

#m4_s5_text{
    text-align:right; 
    justify-content: end;
}

#item_m4_s5_1{grid-column: 1; grid-row:2;}
#item_m4_s5_2{grid-column: 2; grid-row:1 / 3; align-self:end;}

#item_m4_s5_1 img,
#item_m4_s5_2 img {
    max-width:100%;
    height:auto;
    bottom:0px;
}

/*########################### M4 S6###########################*/

#m4_s6_content{
    transform:translateY(0vw);
    display:grid;
    gap:0;
}

#m4_s6_content_top{
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 3fr 1fr;
    gap: 3vw;
}

#item_m4_s6_text{
    grid-column: 2 / 4; 
    grid-row:1;
    justify-self: left;
}

#m4_s6_text{
    text-align:left; 
    justify-content: left;
}

#item_m4_s6_1{grid-column: 1; grid-row:1;}
#item_m4_s6_2{grid-column: 1; grid-row:2;}
#item_m4_s6_3{grid-column: 2; grid-row:2;}
#item_m4_s6_4{grid-column: 3; grid-row:2;}

#item_m4_s6_1 img,
#item_m4_s6_2 img,
#item_m4_s6_3 img,
#item_m4_s6_4 img {
    max-width:100%;
    height:auto;
    bottom:0px;
}