
/* 
    Created on : 30.07.2024, 23:54:12
    Author     : jw
*/

/* Mobile */
@media only screen and (max-width: 767px) {
    .mobile.hidden,
    .tablet.only,
    .computer.only,
    .large.monitor.only,
    .widescreen.monitor.only {
        display: none !important;

        font-size: 2rem !important;
    }
}

/* Tablet */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .mobile.only,
    .tablet.hidden,
    .computer.only,
    .large.monitor.only,
    .widescreen.monitor.only {
        display: none !important;

        font-size: 1.5rem !important;
    }
}

/* Small Monitor */
@media only screen and (min-width: 992px) and (max-width: 1200px) {
    .mobile.only,
    .tablet.only,
    .computer.hidden,
    .large.monitor.only,
    .widescreen.monitor.only {
        display: none !important;
    }
}

/* Large Monitor */
@media only screen and (min-width: 1201px) and (max-width: 1920px) {
    .mobile.only,
    .tablet.only,
    .computer.only,
    .large.monitor.hidden,
    .widescreen.monitor.only {
        display: none !important;
    }
}

/* Widescreen Monitor */
@media only screen and (min-width: 1921px) {
    .mobile.only,
    .tablet.only,
    .computer.only,
    .large.monitor.only,
    .widescreen.monitor.hidden {
        display: none !important;
    }


}

@font-face {
    font-family: "Lato Regular";
    src: url("./Lato-Regular.woff2");
}

/*
@font-face {
    font-family: 'Font Awesome 5 Free';
    font-style: normal;
    font-weight: 900;
    src: url("../webfonts/fa-solid-900.eot");
    src: url("../webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"),
         url("../webfonts/fa-solid-900.woff2") format("woff2"),
         url("../webfonts/fa-solid-900.woff") format("woff"),
         url("../webfonts/fa-solid-900.ttf") format("truetype"),
         url("../webfonts/fa-solid-900.svg#fontawesome") format("svg");
}
*/


body {
    background-image: url("./images/hintergrund.jpg");
}

* {
    font-family: "Lato Regular" ! important;
}

img {
    width: 100%; /* Die Grafik nimmt die gesamte Breite des Containers ein */
}

.slide {
    width: 100%;
    height: auto; /* Beibehaltung des Seitenverhältnisses */
    position: absolute;
}

.header {
    width: 100%;
    overflow: hidden;
    top: 0;
    left: 0;
    right: 0;
    transition: height 0.3s ease; /* Weiche Schrumpfung */
}

#slideshow1 {
    background-image: url("./images/d-edia-titel-1.jpg") !important;
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
    width: 100%;

}

#slideshow img {
    width: 100%;
    height: auto; /* Beibehaltung des Seitenverhältnisses */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* Zentriert die Grafik */
}

#inhalt {
    margin-top: 50px ! important;

}

#deviceImage {
    margin-top: 50px;
    width: auto;
    max-height: 350px;
}
li.hasImage {
    cursor: pointer;
    color: blue;
}

a {
    cursor: pointer;
    color: blue;    
}