@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap');

/*GENERAL*/

:root {
    /* Updated Color & Font Palette */
    --color-primary: rgb(1, 55, 93); /* Used for major accents, links */
    --color-text: rgb(1, 55, 93); /* Main text color */
    --color-background: rgb(231, 144, 136); /* Main document background */
    --color-surface: rgb(255, 255, 255); /* For cards, inputs, footer etc. on top of the background */
    --color-accent-text: rgb(255, 255, 255); /* For text on dark/colored backgrounds */
    --font-main: 'Source Serif 4', serif;
}

*,
*:before,
*:after {
    border: 0px;
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
}

*::-webkit-scrollbar {
    width: 0 !important;
}

html,
body {
    font-family: var(--font-main);
    font-weight: 400; /* Standard weight for better readability */
    width: 100%;
    color: var(--color-text);
    background-color: var(--color-background);
    position: relative;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    margin: 0px;
    padding: 0px;
    font-size: 1rem;
    line-height: 1.6; /* Consistent base line height */
    -webkit-appearance: none;
}

/* Typographic Scale */
h1, h2, h3 {
    font-family: var(--font-main);
    font-weight: 700;
    line-height: 1.2; /* Tighter line height for headings */
    margin-bottom: 0.5em; /* Add some space below headings */
}

h1 {
    font-size: 1.5rem;
}

h2 {
    font-size: 1.25rem;
}

h3 {
    font-size: 1rem;
}

strong {
    font-weight: 700;
}

a {
    text-decoration: none;
    color: var(--color-primary);
    font-weight: 700; /* Bolder links for visibility */
}

a:hover {
    text-decoration: underline;
}

video {
    max-width: 600px;
}

img {
    width: 100%;
    display: block;
}

p {
    margin-bottom: 1.2rem;
}

li {
    list-style: none;
}

::selection {
    background: var(--color-primary);
    color: var(--color-accent-text);
}

::-moz-selection {
    background: var(--color-primary);
    color: var(--color-accent-text);
}

iframe {
    max-width: 400px;
    padding-top: 20px;
    padding-bottom: 20px;
}

hr {
    height: 2px;
    background: var(--color-text);
    margin: 0 0 1rem 0;
}

.debug {
    outline: 2px solid red;
}


/*//////////////////////////////////////////*/


/* W R A P P E R */

#wrapper {
    position: relative;
    margin: 0px;
    padding: 0px;
    margin-bottom: 20px;
}


/*//////////////////////////////////////////*/


/* H E A D E R */

header {
    margin: 0px auto;
    position: relative;
}


/*//////////////////////////////////////////*/


/* C O N T E N T */

#content {
    position: relative;
    width: 100%;
    min-height: 800px;
    padding: 50px 0 0 0;
    color: var(--color-text);
}

#content a {
    text-decoration: none;
    font-weight: 700;
}

section {
    margin: 0 0 20px 0;
    position: relative;
}


/*//////////////////////////////////////////*/


/* A S I D E */

aside {
    padding: 50px 0 0 0;
    margin: 14px 0 0 0;
}

aside article {
    margin: 0 0 20px 0 !Important;
    max-height: 140px;
    overflow: hidden;
    position: relative;
}

aside article a {
    background: var(--color-surface); /* Use surface color for cards */
    color: var(--color-text);
    text-decoration: none !Important;
}

aside article a div.article-text {
    padding: 0px 0 0 0px;
}

aside article.news a div.news-title {
    font-size: 1.1rem; /* Reduced font size */
    font-weight: 700;
}

aside article.news a time {
    padding: 0px;
    margin: -7px 0 0px 0;
    font-size: 0.9rem !Important;
}

aside article.news a time div.month {
    margin: 0 0 10px 0;
    font-size: 0.9rem !Important;
    display: none;
}

aside div.article-text-wrapper div.article-text ul.tags {
    margin: 0 0 7px 0;
}

aside div.article-text-wrapper div.article-text ul.tags li:not(:last-child):after {
    content: ",  ";
    padding: 0 2px 0 0px;
}

aside div.article-text-wrapper {
    background: var(--color-surface);
    margin: 0 0 0 0px;
    padding: 10px 5px 15px 10px;
    font-weight: 400; /* Regular weight */
    line-height: 1.4; /* Slightly tighter line-height for cards */
}

aside article a div.article-image {
    max-height: 140px;
    min-height: 140px;
    overflow: hidden;
}

aside article a div.article-image img {
    display: block;
    margin: 0px !Important;
    padding: 0px !Important;
    height: 100%;
    width: auto !Important;
}


/*//////////////////////////////////////////*/


/* TEMPLATE: NEWS-OVERVIEW */


/*//////////////////////////////////////////*/

body#news-overview section aside {
    border-top: 0px solid black !Important;
    padding: 60px 0 0 0;
    color: var(--color-text);
}

body#news-overview section section.archiv {
    line-height: 1.4; /* Improved line height */
    padding: 20px 0 20px 0px;
}

body#news-overview section section.archiv a {
    margin: 0 12px 0 0;
}

body#news-overview section section.archiv a:hover>div {
    color: gray
}

body#news-overview section#archiv-wrapper {
    margin: 20px 0 50px 0;
}


/*//////////////////////////////////////////*/


/* TEMPLATE: NEWS */


/*//////////////////////////////////////////*/

body#news article div.event-details {
    font-size: 1rem;
    margin: 0 0 0px 0;
}

body#news article div.event-details div.time {
    margin: 0 0 0px 10px;
}

body#news article div.news-submenu span {
    font-size: 1rem;
    padding: 0 5px 0 5px;
}

body#news article div h2 {
    font-size: 1.5rem; /* Match global h2 */
}

body#news article div.article-text {
    margin: 0px 0 0px 0;
}

body#news article {
    padding: 0 0px 0 0px;
}

body#news article div.article-main {
    margin: 20px 0px 0 0px;
}

body#news article div.gallery-wrapper {
    margin: 0px 0 0px 0;
}


/*//////////////////////////////////////////*/


/* TEMPLATE: HOME */


/*//////////////////////////////////////////*/

body#home section#sessions article {
    background: var(--color-surface);
    margin: 0 0 20px 0;
    color: var(--color-text);
    padding: 8px;
    border: 1px solid #eee; /* Added subtle border for definition */
}

body#home section#sessions article a {
    color: var(--color-text) !Important;
}

body#home section#sessions h2 {
    margin: 0 0 10px 0;
    font-weight: 700;
}

body#home section#events h2 {
    margin: 0 0 10px 0
}

body#home section article.subpage {
    min-height: 480px;
    background: var(--color-surface);
    margin: 0px 0 20px 0;
    color: var(--color-text);
}

body#home section article.subpage>div.article-text {
    font-weight: 400;
}

body#home section article.subpage h1 {
    padding: 10px 0 0 10px;
}

body#home section article.subpage div {
    background-size: cover;
    height: 200px;
    margin: 0 0 0px 0;
}

body#home section article.subpage div.article-text {
    height: auto;
    padding: 8px 8px 1px 8px;
}

body#home section article.subpage div.article-image {
    filter: gray;
    /* IE6-9 */
    -webkit-filter: grayscale(1);
    /* Google Chrome, Safari 6+ & Opera 15+ */
    filter: grayscale(1);
    /* Microsoft Edge and Firefox 35+ */
}

body#home h3 {
    color: var(--color-primary) !Important; /* Updated to primary accent */
    margin: -20px 0 40px 0;
    text-align: right;
}

body#archiv aside {
    margin: -50px 0 0 0;
}

body#archiv aside h2 {
    margin: 0px 0 20px 0;
}


/*//////////////////////////////////////////*/


/* TEMPLATE:DEFAULT */


/*//////////////////////////////////////////*/

body#default section {
    margin: 0 0 0px 0;
}


/* F O O T E R */

footer {
    margin: 0px 0 0px 0;
    padding: 25px 15px;
    background: var(--color-surface); /* White background */
    color: var(--color-text); /* Dark text */
    font-size: 0.9rem;
}

footer a {
    border-bottom: none !Important;
    color: var(--color-text); /* Dark links */
}

footer div.timetable {
    margin: 0px 0 20px 0;
}

footer div.timetable div {
    margin: 0 0 5px 0px;
}

footer div.timetable div span {
    overflow: hidden !Important;
}

footer div.social-media {
    margin: 0 0px 20px 0px;
}

footer div.social-media a {
    margin: 0 10px 0 0px;
}

footer div.social-media a img {
    display: inline-block;
    float: left;
    width: 12px;
}

footer div {
    color: var(--color-text); /* Dark text */
}


/*//////////////////////////////////////////*/


/*N A V I G A T I O N*/

nav {
    background: none;
    margin: 30px 0 30px 0px;
    color: var(--color-text);
}

nav div.only-mobile {
    display: none;
}

#navigation {
    position: relative;
}

div#lang ul {
    max-height: 1.8rem;
}

div#lang ul li {
    margin: -7px 0 0 0;
}

div#lang ul li a {
    text-decoration: none;
    color: var(--color-text);
    font-size: 1.2rem; /* Adjusted size */
    font-weight: 700;
}

div#lang ul li a.only-mobile {
    display: none;
}

div#lang ul li:first-child::after {
    content: "/";
    font-size: 1.2rem;
    margin: 0 5px 0 -2px;
    color: var(--color-text);
}

div#lang {
    margin: 0 0 0px 0;
}

#navigation div.nav-lang {
    position: absolute;
    right: 60px;
    top: -0px;
}

#navigation form input[type="email"] {
    background: var(--color-surface);
    border: 1px solid var(--color-text);
    font-size: 1rem;
    padding: 2px 5px;
    height: 2rem;
}

nav #navigation-content ul.mainmenu li a h1 {
    line-height: 1.3;
    color: var(--color-accent-text); /* Text inside menu should be light */
}

nav #navigation-content ul.mainmenu li a.only-mobile {
    display: none;
}

nav div#navigation-content ul.mainmenu li ul.navigation-submenu li {
    display: none;
}

#navigation div#logo {
    width: 200px;
    margin: 0 0 0 0px;
}

#navigation div#logo h1 {
    font-size: 2rem; /* Consistent with H1 */
}

nav div#logo-mobile {
    display: none;
}

#navigation #navigation-wrapper div#close-button {
    cursor: pointer;
    font-size: 3rem;
    height: 3rem;
    margin: 0px 0 0 0;
    background: none;
    position: absolute;
    right: 15px;
    color: var(--color-accent-text); /* Make close button visible */
}

#navigation #navigation-wrapper {
    position: absolute;
    top: 0px;
}

#navigation #navigation-wrapper label {
    position: fixed;
    height: 35px;
    z-index: 5;
    left: 50%;
    margin-left: 430px;
}

/* Hamburger Menu Button */
#navigation #navigation-wrapper label div#menu-button {
    cursor: pointer;
    position: absolute;
    top: -2px;
    z-index: 5;
    background: transparent;
    max-width: 45px;
    min-width: 45px;
    min-height: 25px;
    right: 0px;
    padding: 2px;
    border-top: 10px solid var(--color-text);
    border-bottom: 10px solid var(--color-text);
}

/* Fullscreen Navigation Menu */
div#navigation-content {
    position: fixed;
    z-index: 2000;
    background: var(--color-primary); /* Use primary color for overlay */
    color: var(--color-accent-text);
    left: 0;
    top: -10000px;
    z-index: 100000;
    padding: 20px 0 0 0;
    overflow: auto;
    min-width: 100%;
    height: 99.9%;
}

nav div#navigation-content div.navigation-content-inner {
    position: relative;
    background: transparent !Important;
    padding: 20px;
    color: var(--color-accent-text) !Important;
}

nav div#navigation-content div.navigation-content-inner a {
    color: var(--color-accent-text) !Important;
}

nav div#navigation-content div.navigation-content-inner div.social-media a:first-child {
    margin: 0 0px 0 0px;
}

nav div#navigation-content div.navigation-content-inner div.social-media a {
    margin: 0 0px 0 15px;
}

nav div#navigation-content div.navigation-content-inner div.social-media {
    margin: 40px 0 0 0px;
}

nav div#navigation-content div.navigation-content-inner div.newsletter {
    margin: 20px 0 0 00px;
}
.content-text, .article-text {
    font-size: 1.2rem;
}

#navigation input[type="checkbox"] {
    display: none;
}


/*WHEN CLICKED*/

#desktop-icon:checked~label div#menu-button {
    display: none !Important;
}

#desktop-icon:checked~label+div#navigation-content {
    overflow: auto;
    top: 0px;
}


/*
  
   ___   ___   ___  
  / _ \ / _ \ / _ \ 
 | (_) | | | | | | |
  \__, | | | | | | |
    / /| |_| | |_| |
   /_/  \___/ \___/ 
                    
                    



*/

@media screen and (min-width: 0px) and (max-width: 900px) {
    html,
    body {
        font-size: 1rem;
    }
    .content-text, .article-text {
        font-size: 1rem;
    }   
    /*//////////////////////////////////////////*/
    /* TEMPLATE: HOME */
    /*//////////////////////////////////////////*/
    body#home section article.subpage {
        min-height: 300px;
        height: auto;
        margin: 0 0 30px 0;
        display: block;
    }
    body#home section article.subpage div.article-text {
        height: auto;
    }
    body#home section article.subpage div.article-image {
        font-size: 1rem;
        background-size: cover;
        height: 200px;
        margin: 0 0 0px 0;
        padding: 8px;
    }
    body#home section {
        margin: 50px 0 50px 0;
    }
    /*//////////////////////////////////////////*/
    /* TEMPLATE: NEWS */
    /*//////////////////////////////////////////*/
    body#news article {
        margin: 50px 0 0 0;
    }
    body#news article img {
        margin: 0 0 50px 0;
    }
    body#news article div.article-text {
        padding: 0px 10px 0px 10px;
    }
    body#news article div.event-details div.date-time {
        padding: 0px 10px 0px 10px;
    }
    body#news article div.event-details div.date-time div.time {
        margin: 0px;
    }
    body#news article div.event-details h1 {
        padding: 0px 10px 0px 10px;
    }
    /*//////////////////////////////////////////*/
    /* TEMPLATE:DEFAULT */
    /*//////////////////////////////////////////*/
    body#default section {
        margin: 50px 0 0px 0;
        font-size: 1.1rem;
    }
    body#default div.content-text {
        padding: 0 10px 0 10px;
    }
    /*//////////////////////////////////////////*/
    /*N A V I G A T I O N*/
    nav {
        background: none;
        margin: 0px 0 0px 0px;
        color: var(--color-text);
    }
    #navigation div#logo {
        min-width: 200px !Important;
        max-width: 200px !Important;
        margin: 0 0 0 0px;
        padding: 0 10px 0 10px;
        position: fixed;
        top: 10px;
        z-index: 6;
    }
    nav #navigation div#logo h1 {
        font-size: 1.5rem !Important; /* Smaller logo for mobile */
    }
    div.content-text {
        padding: 0 5px 0 5px;
    }
    #navigation #navigation-wrapper div#close-button {
        cursor: pointer;
        position: absolute;
        z-index: 1;
        max-width: 20px;
        min-width: 20px;
        border: none !Important;
        right: 10px;
        top: 10px;
        background: none;
    }
    #navigation #navigation-wrapper label {
        position: fixed;
        height: 45px;
        z-index: 0;
        left: 0%;
        margin: 0 0px 0 0px;
        padding: 10px 0 0 0;
        z-index: 3;
        background: var(--color-background); /* Match body background */
        width: 100%; /* Ensure label covers width */
    }
    #navigation #navigation-wrapper label div#menu-button {
        cursor: pointer;
        position: absolute;
        z-index: 5;
        background: transparent;
        max-width: 35px;
        min-width: 35px;
        min-height: 16px;
        right: 0px;
        top: 12px;
        padding: 2px;
        margin: 0 10px 0 0 !Important;
        border-top: 6px solid var(--color-text);
        border-bottom: 6px solid var(--color-text);
    }
    nav #navigation-content ul.mainmenu li {
        line-height: 1.5; /* Improved line height */
    }
    nav div#navigation div.nav-lang {
        display: none;
    }
    nav div#navigation div.nav-lang-mobile {
        width: 200px;
    }
    nav div#navigation div.nav-lang-mobile a {
        font-size: 1.4rem;
        color: var(--color-accent-text); /* Updated for menu overlay */
    }
    nav div#navigation div.nav-lang-mobile li {
        font-size: 1rem;
    }
    div#lang ul li:first-child::after {
        content: "/";
        font-size: 1.2rem;
        margin: 0 5px 0 -2px;
        color: var(--color-accent-text); /* Updated for menu overlay */
    }
    nav div#navigation div.nav-lang-mobile {
        position: relative;
        max-width: 80px !Important;
        min-width: 40px;
        display: block !Important;
        margin: -5px 0 20px 0;
    }
    /*//////////////////////////////////////////*/
    /*F O O T E R*/
    /*//////////////////////////////////////////*/
    /* A S I D E */
    aside article {
        margin: 0 0 20px 0 !Important;
        overflow: hidden;
        position: relative;
        max-height: 200px;
    }
    aside article.news a div.news-title {}
    aside article.news a time {
        padding: 0px;
        margin: 0 0 20px 0;
    }
    aside div.grid-col-33 {
        margin: 0 0 0 0px;
        padding: 25px 15px 15px 15px;
        font-weight: 400; /* Regular weight */
        line-height: 1.4;
        min-width: 70%;
        max-width: 70%;
    }
    aside article a div.article-image {
        max-height: 100%;
        min-height: 100%;
        min-width: 30%;
        max-width: 30%;
        overflow: hidden;
    }
    aside article a div.article-image img {
        display: block;
        margin: 0px !Important;
        padding: 0px !Important;
        height: 100%;
        width: auto !Important;
    }
}