fixes

content.php

@@ -1,3 +1,21 @@
+<section class="hero-main hero">
+    <div class="hero-body">
+        <div class="container">
+            <div class="columns">
+                <div class="column is-two-fifths">
+                    <h1>Mobile Kork Sauna</h1>
+                    <p class="body1">
+                        Handgefertigt in Fachwerkbauweise aus den Naturstoffen Kork und 
+                        Holz. Die mobile Sauna mit Holzofen für den eigenen Garten oder 
+                        direkt am See.
+                    <p> <br> 
+                    <!--<a class="get-signal button" href="https://signal.org/download/">Jetzt mieten</a> -->
+                </p>
+                </div>
+            </div>
+        </div>
+    </div>
+</section>
 <section class="why-signal section">
         <div class="container">
             <div class="columns is-centered">

files/bulma.css

@@ -7851,18 +7851,6 @@ a.navbar-item {
     cursor: pointer
 }
 
-.navbar-link.is-active,
-.navbar-link:focus,
-.navbar-link:focus-within,
-.navbar-link:hover,
-a.navbar-item.is-active,
-a.navbar-item:focus,
-a.navbar-item:focus-within,
-a.navbar-item:hover {
-    background-color: #fafafa;
-    color: #3273dc
-}
-
 .navbar-item {
     display: block;
     flex-grow: 0;

functions.php

@@ -23,6 +23,18 @@ add_action( 'after_setup_theme', 'fachwerksauna_setup' );
 
 function theme_customize_register( $wp_customize ) {
 
+    $wp_customize->add_setting( 'theme_color', array(
+        'default'   => '#ed9b40',
+        'transport' => 'refresh',
+      ) );
+
+    $wp_customize->add_control( new WP_Customize_Color_Control(
+    $wp_customize, 'theme_color', array(
+    'section' => 'colors',
+    'label'   => esc_html__( 'Theme color', 'theme' ),
+    ) ) );
+  
+  
     $wp_customize->add_setting( 'fachwerksauna_footer-text', array(
         'default' => '',
         'type' => 'option',
@@ -42,4 +54,18 @@ function theme_customize_register( $wp_customize ) {
 
 }
 
-add_action( 'customize_register', 'theme_customize_register' );
+add_action( 'customize_register', 'theme_customize_register' );
+
+function kit_customize_css()
+{
+    $theme_color = get_theme_mod('theme_color', '#ed9b40');
+    ?>
+         <style type="text/css">
+             :root {
+                --themeColor: <?php echo $theme_color; ?>;
+            }
+         </style>
+    <?php
+}
+
+add_action( 'wp_head', 'kit_customize_css');

index.php

@@ -23,7 +23,7 @@
             <div class="navbar-brand">
                 <a href="/">
                     <img class="logo" 
-                        src="<?php echo get_stylesheet_directory_uri().'/files/logo.webp'; ?>">
+                        src="<?php echo get_stylesheet_directory_uri().'/files/logo.png'; ?>">
                 </a>
                 <a
                     role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false"
@@ -150,24 +150,6 @@
             </div>
         </div>
     </nav>
-    <section class="hero-main hero">
-        <div class="hero-body">
-            <div class="container">
-                <div class="columns">
-                    <div class="column is-two-fifths">
-                        <h1>Mobile Kork Sauna</h1>
-                        <p class="body1">
-                            Handgefertigt in Fachwerkbauweise aus den Naturstoffen Kork und 
-                            Holz. Die mobile Sauna mit Holzofen für den eigenen Garten oder 
-                            direkt am See.
-                        <p> <br> 
-                        <!--<a class="get-signal button" href="https://signal.org/download/">Jetzt mieten</a> -->
-                    </p>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section>
     <div class="contentWrapper">
         <?php the_content(); ?>
     </div>

style.css

@@ -121,7 +121,7 @@ a.no-underline {
 }
 
 .button {
-    background-color: #ED9B40;
+    background-color: var(--themeColor);
     text-shadow: none;
     border: none;
     border-radius: 8px;
@@ -133,7 +133,7 @@ a.no-underline {
 }
 
 .rentButton {
-    background-color: #ED9B40;
+    background-color: var(--themeColor);
     border-radius: 10px;
     padding: 10px 20px !important;
     margin-left: 10px;
@@ -148,7 +148,9 @@ a.no-underline {
 }
 
 .rentButton:hover {
-    background-color: #FFAA48 !important;
+    background-color: var(--themeColor) !important;
+    /* box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.6); */
+    filter: brightness(120%);
 }
 
 .button[disabled] {
@@ -278,7 +280,7 @@ html.has-navbar-fixed-top {
 }
 
 .mainNavbar a.navbar-item:hover {
-    color: #C76E08;
+    color: var(--themeColor);
 }
 
 .mainNavbar .language-selector .icon {