/* General settings */
.body {
    background: #e6e6e6; /* Light gray for page background */
    color: #4d4d4d; /* Default text color */
    font-family: Arial, sans-serif; /* Default text font */
    font-size: 1rem; /* Default text size */
    text-align: left; /* Default text alignment */
    margin: 0;
    padding: 0;
}

/* Breadcrumbs */
.breadcrumb {
    background: #d9d9d9;
    color: #4d4d4d;
    font-family: Arial, sans-serif;
    font-size: 0.9rem;
    text-align: left;
    padding: 0.1rem;
    margin: 0.1rem;
}

/* Header */
.header {
    background: #ffffff;
    color: #333333;
    font-family: Arial, sans-serif;
    font-size: 1.5rem;
    text-align: center;
    padding: 0.1rem;
    margin: 0.1rem;
}

/* Navigation */
.nav {
    background: #ffffff;
    color: #333333;
    font-family: Arial, sans-serif;
    font-size: 1rem;
    text-align: center;
    padding: 0.1rem;
    margin: 0.1rem;
}

/* Menu */
.metismenu-item {
    background: #ffffff;
    color: #4d4d4d;
    font-family: Arial, sans-serif;
    font-size: 1rem;
    text-align: left;
    padding: 0;
    margin: 0;
}

/* Banner */
.banner {
    background: #bfbfbf;
    color: #4d4d4d;
    font-family: Arial, sans-serif;
    font-size: 1.2rem;
    text-align: center;
    padding: 0.1rem;
    margin: 0.1rem;
}

/* Module */
.module {
    background: #e6e6e6;
    color: #4d4d4d;
    font-family: Arial, sans-serif;
    font-size: 1rem;
    text-align: left;
    padding: 0.1rem;
    margin: 0.1rem;
}

/* Active Link */
a:active {
    color: #808080; /* Medium gray for active links */
    font-family: Arial, sans-serif;
    font-size: 1rem;
    text-align: left;
}

/* Regular Link */
a {
    color: #666666; /* Slightly darker gray */
    font-family: Arial, sans-serif;
    font-size: 1rem;
    text-align: left;
}

/* Hover Link */
a:hover {
    color: #999999; /* Slightly lighter gray for hover effect */
    font-family: Arial, sans-serif;
    font-size: 1rem;
    text-align: left;
}

/* Footer */
footer {
    background: #cccccc;
    color: #333333;
    font-family: Arial, sans-serif;
    font-size: 0.8rem;
    text-align: center;
    padding: 0.1rem;
    margin: 0.1rem;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    color: #333333; /* Dark gray for headings */
    font-family: Arial, sans-serif;
    text-align: left;
    margin: 0.1rem;
    padding: 0.1rem;
}

h1 {
    font-size: 1.4rem;
}

h2 {
    font-size: 1.2rem;
}

h3 {
    font-size: 1.6rem;
}

h4 {
    font-size: 1.4rem;
}

h5 {
    font-size: 1.2rem;
}

h6 {
    font-size: 1rem;
}

/* =======================================
   LARS ZECH LAYOUT
   ======================================= */

/* Header */
.container-header {
    background: transparent !important;
    border: none;
    box-shadow: none !important;
}

/* Navigation */
.container-nav {
    max-width: 1320px;
    margin: 0 auto;
}

.mod-menu {
    justify-content: center;
    border-top: 1px solid #d0d0d0;
    padding-top: 12px;
}

.mod-menu > li > a {
    color: #777777 !important;
    text-transform: lowercase;
    letter-spacing: 1px;
    font-size: 1rem;
    font-weight: 400;
}

.mod-menu > li.active > a,
.mod-menu > li > a:hover {
    color: #444444 !important;
}

/* Inhalt */
.container-component {
    max-width: 1320px;
    margin: 0 auto;
}

/* Kein Rahmen um den Hauptinhalt */
main {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
}

/* Überschriften */
h1 {
    font-size: 1.4rem;
    font-weight: 400;
    color: #444444;
}

h2 {
    font-size: 1.2rem;
    font-weight: 400;
    color: #555555;
}

/* Blogtitel */
.blog-item .page-header h2,
.blog-item .page-header h2 a {
    font-size: 1.2rem;
    font-weight: 400;
    color: #555555 !important;
    text-decoration: none;
}

/* Links */
a {
    color: #666666;
}

a:hover {
    color: #999999;
}

/* Footer */
.container-footer {
    max-width: 1320px;
    margin: 50px auto 20px auto;
    border-top: 1px solid #d0d0d0;
    padding-top: 15px;
}

.footer {
    background: transparent !important;
    color: #666666 !important;
    text-align: center;
}

.footer .mod-menu {
    border: none;
    padding: 0;
    justify-content: center;
}

.footer .mod-menu a {
    color: #666666 !important;
    text-transform: lowercase;
}

.footer .mod-menu a:hover {
    color: #333333 !important;
}

.grid-child {
    max-width: 707px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.container-footer {
    max-width: 707px !important;
    margin: 40px auto 20px auto;
    border-top: 1px solid #d0d0d0;
    padding-top: 15px;
    text-align: center;
}
/* =======================================
   LARS ZECH BREITE
   ======================================= */

@media (min-width: 1000px) {

    .container-nav,
    .container-component,
    .container-footer {
        max-width: 707px !important;
        margin: 0 auto;
    }

}

main {
    max-width: 707px;
    margin: 0 auto;
}

/* Hamburger-Menü sichtbar machen */
.navbar-toggler {
    color: #666666 !important;
    border-color: #666666 !important;
}