@import url("https://assets.waag.org/fonts/maax/font.css");

body {
  font-family: "Maax", sans-serif;
  color: #000;
}

.header .logo img {
 
}
.header { /* the element was header.header */
  display: flex;
  justify-content: center;
  align-items: center;
}

html, body {
   
    background-color: #121212;
}

/* Styling for links in .home-options */
.home-options a {
  color: lightgray; /* Or a specific hex code like #D3D3D3 */
  text-decoration: none; /* Optional: remove underline */
}

.home-options a:hover {
  color: yellow; /* Or a specific hex code like #FFFF00 */
  text-decoration: underline; /* Optional: add underline on hover */
}

/* Hiding the footer */
footer {
  display: none;
}

body {
    font-size:1em;
}

.container {
    background-color: transparent;
    color: #f8f8fb;
    height:auto;
}


div, p, td, .ui-widget {
    font-family:"Roboto", sans-serif;
    font-size: 1rem;
    letter-spacing: 0.5px;
}

section {
    padding-top:0;
    padding-right:0;
    padding-bottom:0;
    padding-left:0;
    margin-top: 30px; 
    margin-right: 10px; 
    margin-bottom: 10px; 
    margin-left: 30px; 
    position: relative;
    grid-area: section;
}



.button {
    background-color: #1e1e1e !important;
    color: #F9C74F !important;
    border: 1px solid #F9C74F !important;
    font-size: 0.8rem;
    padding: 2px 5px;
}

.button:hover {
    color: #f5e2b8 !important;
    box-shadow: inset 0 0 0.8em #1e1e1e;
}

/**
*   Linkfarben
**/

/**
*   Navigation Menu (Sitebar)
**********************************************************************************/


ul.navi {
    list-style-type:none;
    background-color: #0b0b0b;
    border: 1px solid #292929;
    margin:0 0 10px 0;
}

ul.navi li {
    background-color: #0b0b0b;
    border: 1px solid #0b0b0b;
    margin-left: -40px;
}

ul.navi li ul {
    list-style: none;
}

ul.navi li:hover {
    background-color: #0b0b0b;
    border: 1px solid #0b0b0b;
}

ul.navi li.sub_sites {
    padding-left: 15px;
}

ul.navi li a {
    padding:5px 10px;
    display: block;
}

ul.navi li.navi_main_site a,
ul.navi li.navi_sub_site a {
    color: #F9C74F;
    font-size: 0.875rem;
    text-decoration:none;
}

ul.navi li.navi_main_site:hover a,
ul.navi li.navi_sub_site:hover a,
ul.navi li a.activelink {
    color: #f5e2b8;
    font-size: 0.875rem;
}

/* Links in Content-Boxen */
nav .ui-widget-content a,
.fotosuche_content li a,
.videothek_content li a,
.video_info_categories_content a,
.shop_bestellung_danke a,
.breadcrumbs a,
#blog_startseite_blogs a,
#blog_startseite_archiv a,
.login_site a,
.signup_form label, .signup_form a {
    color: #F9C74F;
    text-decoration: none;
    font-size: 0.875rem;
}


.shop_breadcrumb,
.shop_breadcrumb a {
    font-size: 0.9rem;
}

.shop_breadcrumb {
    color: #f8f8fb;
}

.shop_breadcrumb a {
    color: #F9C74F;
    text-decoration:none;
}

nav a:hover,
.fotosuche_content li a:hover,
.videothek_content li a:hover,
.video_info_categories_content a:hover,
.shop_breadcrumb a:hover,
.shop_bestellung_danke a:hover,
.kategorie_artikel a:hover,
.breadcrumbs a:hover,
#blog_startseite_blogs a:hover,
#blog_startseite_archiv a:hover,
.login_site a:hover,
.signup_form a:hover {
    color: #f5e2b8;
}

nav .nav_statistic {
    font-size: 0.875rem;
}


/**
*   Navigation Menu (Header)
**********************************************************************************/

ul.header_menu {
    list-style-type:none;
    background-color: #0b0b0b;
    border: 1px solid #292929;
    margin:0;
    padding:0;
    
    top: 0px;
    right: 0px;
    position: absolute;
    
    display:flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
}

ul.header_menu li {
    background-color: #0b0b0b;
    border: 1px solid #0b0b0b;
}

ul.header_menu li ul {
    list-style: none;
    padding: 0;
}

ul.header_menu li:hover {
    background-color: #0b0b0b;
    border: 1px solid #0b0b0b;
}

ul.header_menu li.sub_sites {
    display:none;
    width: auto;
    padding-right: 2rem;
    box-sizing:border-box;
    bottom:0;
    position:absolute;
    z-index: 1;
    border-left: 1px solid #292929;
    border-right: 1px solid #292929;
    border-bottom: 1px solid #292929;
}

ul.header_menu li a {
    padding:5px 10px;
    display: block;
}

ul.header_menu li.navi_main_site a,
ul.header_menu li.navi_sub_site a {
    color: #F9C74F;
    font-size: 0.875rem;
    text-decoration:none;
}

ul.header_menu li.navi_main_site:hover a,
ul.header_menu li.navi_sub_site:hover a,
ul.header_menu li a.activelink {
    color: #f5e2b8;
    font-size: 0.875rem;
}


/**
*   Login Menü
**********************************************************************************/

ul.login_menu,
div.gast_menu {
    background-color: #121212;
    border: 1px solid #121212;
    top: 290px;
    right: 80px;
    margin: 0;
    padding: 5px;
    list-style-type:none;
    position: absolute;
}

ul.login_menu li {
    background-color: #121212;
    border: 1px solid #121212;
    color: #F9C74F;
    margin-top:5px;
    margin-left:20px;
    display: inline-block;
}

ul.login_menu li img {
    height:20px;
    width:auto;
    vertical-align:middle;
}

ul.login_menu li .material-icons {
    vertical-align: middle;
    font-size: 2rem;
}


ul.login_menu li a:hover {
    background-color: #121212;
    border: 1px solid #121212;
}

ul.login_menu li a {
    color: #F9C74F;
    font-size: 1rem;
    text-decoration:none;
    vertical-align: middle;
}

ul.login_menu li:hover a,
ul.login_menu li a.activelink {
    color: #f5e2b8;
    font-size: 1rem;
}    



h1 {
    font-family: Playfair Display;
    font-size: 1.7rem;
    font-weight:bold;
}

h2 {
    font-family: Playfair Display;
    font-size: 1.4rem;
    font-weight:bold;
}

h3 {
    font-family: Playfair Display;
    font-size: 1rem;
    font-weight:bold;
}

h4 {
    font-family: Playfair Display;
    font-size: 1rem;
}

h5 {
    font-family: Playfair Display;
    font-size: 1rem;
}

h6 {
    font-family: Playfair Display;
    font-size: 1rem;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
}