/*
 Theme Name:     Divi Child
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Elegant Themes
 Author URI:     https://www.elegantthemes.com
 Template:       Divi
 Version:        1.0.0
*/
 
 
/* =Theme customization starts here
------------------------------------------------------- */
/* red-hat-display-300 - latin */
@font-face {
  font-display: swap;  
  font-family: 'Red Hat Display';
  font-style: normal;
  font-weight: 300;
  src: url('/wp-content/themes/divi-child/webfonts/red-hat-display-v21-latin-300.woff2') format('woff2');  
}
/* red-hat-display-regular - latin */
@font-face {
  font-display: swap;  
  font-family: 'Red Hat Display';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/divi-child/webfonts/red-hat-display-v21-latin-regular.woff2') format('woff2');  
}
/* red-hat-display-500 - latin */
@font-face {
  font-display: swap;  
  font-family: 'Red Hat Display';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/themes/divi-child/webfonts/red-hat-display-v21-latin-500.woff2') format('woff2');  
}
/* red-hat-display-600 - latin */
@font-face {
  font-display: swap; 
  font-family: 'Red Hat Display';
  font-style: normal;
  font-weight: 600;
  src: url('/wp-content/themes/divi-child/webfonts/red-hat-display-v21-latin-600.woff2') format('woff2'); 
}
/* red-hat-display-700 - latin */
@font-face {
  font-display: swap;  
  font-family: 'Red Hat Display';
  font-style: normal;
  font-weight: 700;
  src: url('/wp-content/themes/divi-child/webfonts/red-hat-display-v21-latin-700.woff2') format('woff2');  
}
/* red-hat-display-800 - latin */
@font-face {
  font-display: swap;  
  font-family: 'Red Hat Display';
  font-style: normal;
  font-weight: 800;
  src: url('/wp-content/themes/divi-child/webfonts/red-hat-display-v21-latin-800.woff2') format('woff2');  
}
/* red-hat-display-900 - latin */
@font-face {
  font-display: swap;  
  font-family: 'Red Hat Display';
  font-style: normal;
  font-weight: 900;
  src: url('/wp-content/themes/divi-child/webfonts/red-hat-display-v21-latin-900.woff2') format('woff2');  
}
html, body {
    font-family: 'Red Hat Display', sans-serif;
}


.footer-bottom-line {
    margin-top: 20px;   
}
.footer-bottom-line ul.bottom-nav {
        padding: 0;
    }
@media (min-width: 768px) {
    .footer-bottom-line p {
        display: inline-block;
    }
    ul.bottom-nav {
        display: inline-flex;
    }
    ul.bottom-nav li {
        margin-left: 20px;
        margin-right: 10px;
    }
}


.et_pb_row_2.js-masonry-grid, .et_pb_row_1.js-masonry-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 40px; 
    grid-template-rows: masonry; 
    column-gap: 40px;
}

/* Optional: Damit das Polyfill weiß, welche Elemente es beobachten muss. */
.js-masonry-grid > * {
    /* Jedes Item soll über eine Spalte gehen */
    grid-column: span 1;
}

/* Wichtig: Auf kleinen Bildschirmen sollte es nur eine Spalte geben */
@media (max-width: 979px) {
    .et_pb_row_2.js-masonry-grid, .et_pb_row_1.js-masonry-grid {
        grid-template-columns: 1fr;
    }
}

/* Divi-Standard für Galerie-Modul zurücksetzen, damit Masonry Grid funktioniert */
.masonry-grid .et_pb_gallery_items.et_grid_module {
    display: grid !important;
    /* Drei Spalten auf dem Desktop */
    grid-template-columns: repeat(3, 1fr); 
    column-gap: 30px;
    row-gap: 30px;
    /* Vorbereitung für Masonry */
    grid-template-rows: masonry; 
    align-items: start;
}

/* Divi-interne Breitenberechnungen und Floats entfernen */
.masonry-grid.et_pb_gallery_grid .et_pb_gallery_item {
    width: 100% !important;
    /*margin: 0 !important;
    float: none !important;*/
    display: block !important;
}

.masonry-grid.et_pb_gallery_grid .et_pb_gallery_title {
    display: none; /* Versteckt den Titel in der Galerie-Ansicht */
}

.masonry-grid.et_pb_gallery_grid .et_pb_gallery_caption {
    display: block;
    margin-top: 10px;
    font-size: 16px;
    line-height: 1.4em;
}


/* Tablet: 2 Spalten */
@media (max-width: 1200px) {
    .masonry-grid.et_pb_gallery.et_pb_gallery_grid .et_pb_gallery_items.et_grid_module {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Smartphone: 1 Spalte */
@media (max-width: 767px) {
    .masonry-grid.et_pb_gallery.et_pb_gallery_grid .et_pb_gallery_items.et_grid_module {
        grid-template-columns: 1fr;
    }
}