diff --git a/.idea/libraries/Maven__org_controlsfx_controlsfx_8_40_14.xml b/.idea/libraries/Maven__org_controlsfx_controlsfx_8_40_14.xml
new file mode 100644
index 0000000000000000000000000000000000000000..6958924699b78bf9fc0ac738e26728ea669201b2
--- /dev/null
+++ b/.idea/libraries/Maven__org_controlsfx_controlsfx_8_40_14.xml
@@ -0,0 +1,13 @@
+<component name="libraryTable">
+  <library name="Maven: org.controlsfx:controlsfx:8.40.14">
+    <CLASSES>
+      <root url="jar://$MAVEN_REPOSITORY$/org/controlsfx/controlsfx/8.40.14/controlsfx-8.40.14.jar!/" />
+    </CLASSES>
+    <JAVADOC>
+      <root url="jar://$MAVEN_REPOSITORY$/org/controlsfx/controlsfx/8.40.14/controlsfx-8.40.14-javadoc.jar!/" />
+    </JAVADOC>
+    <SOURCES>
+      <root url="jar://$MAVEN_REPOSITORY$/org/controlsfx/controlsfx/8.40.14/controlsfx-8.40.14-sources.jar!/" />
+    </SOURCES>
+  </library>
+</component>
\ No newline at end of file
diff --git a/.idea/libraries/Maven__org_jfxtras_jmetro_8_6_9.xml b/.idea/libraries/Maven__org_jfxtras_jmetro_8_6_9.xml
new file mode 100644
index 0000000000000000000000000000000000000000..aafb0724342dc2f9c6dfc357c5e001b63cb42e5d
--- /dev/null
+++ b/.idea/libraries/Maven__org_jfxtras_jmetro_8_6_9.xml
@@ -0,0 +1,13 @@
+<component name="libraryTable">
+  <library name="Maven: org.jfxtras:jmetro:8.6.9">
+    <CLASSES>
+      <root url="jar://$MAVEN_REPOSITORY$/org/jfxtras/jmetro/8.6.9/jmetro-8.6.9.jar!/" />
+    </CLASSES>
+    <JAVADOC>
+      <root url="jar://$MAVEN_REPOSITORY$/org/jfxtras/jmetro/8.6.9/jmetro-8.6.9-javadoc.jar!/" />
+    </JAVADOC>
+    <SOURCES>
+      <root url="jar://$MAVEN_REPOSITORY$/org/jfxtras/jmetro/8.6.9/jmetro-8.6.9-sources.jar!/" />
+    </SOURCES>
+  </library>
+</component>
\ No newline at end of file
diff --git a/Bachelor_application.iml b/Bachelor_application.iml
index bcd84db39f631518a3f8fc961e3ff70eb08138ab..989e66de81c62536f810c25a8694f7b5eb459ba1 100644
--- a/Bachelor_application.iml
+++ b/Bachelor_application.iml
@@ -52,5 +52,7 @@
     <orderEntry type="library" name="Maven: com.google.cloud:google-cloud-storage:2.4.0" level="project" />
     <orderEntry type="library" name="Maven: com.google.apis:google-api-services-storage:v1-rev20211201-1.32.1" level="project" />
     <orderEntry type="library" name="Maven: com.google.auto.value:auto-value-annotations:1.9" level="project" />
+    <orderEntry type="library" name="Maven: org.jfxtras:jmetro:8.6.9" level="project" />
+    <orderEntry type="library" scope="RUNTIME" name="Maven: org.controlsfx:controlsfx:8.40.14" level="project" />
   </component>
 </module>
\ No newline at end of file
diff --git a/src/main/java/com/application/DB/DB.java b/src/main/java/com/application/DB/DB.java
index 16db20756fb43d079b9bd71e439b5a2a22db3972..b674e533e8c8fe2a03d9cff9fdc2f642aff021de 100644
--- a/src/main/java/com/application/DB/DB.java
+++ b/src/main/java/com/application/DB/DB.java
@@ -46,7 +46,7 @@ public class DB {
         // Step 2: Prepare query job
         // A "QueryJob" is a type of job that executes SQL queries
         // we create a new job configuration from our SQL query and
-        final String GET_WORD_COUNT = "SELECT VariantValue, TimeStamp FROM sf-drying-optimization.124.int_sd_winccsensordata WHERE TimeStamp BETWEEN \"2020-06-09\" AND \"2020-06-29\" ORDER BY TimeStamp";
+        final String GET_WORD_COUNT = "SELECT VariantValue, TimeStamp FROM sf-drying-optimization.124.int_sd_winccsensordata WHERE treeSpecies LIKE AND TimeStamp BETWEEN \"2020-06-09\" AND \"2020-06-29\" ORDER BY TimeStamp";
 
                         QueryJobConfiguration queryConfig =
                 QueryJobConfiguration.newBuilder(GET_WORD_COUNT).build();
diff --git a/src/main/java/com/application/DB/Sort.java b/src/main/java/com/application/DB/Sort.java
deleted file mode 100644
index 2527342551641af8c19c6659950250fef741668c..0000000000000000000000000000000000000000
--- a/src/main/java/com/application/DB/Sort.java
+++ /dev/null
@@ -1,5 +0,0 @@
-package com.application.DB;
-
-public class Sort {
-
-}
diff --git a/src/main/java/com/application/Main.java b/src/main/java/com/application/Main.java
index 2fd00b723766fc1e7f4e08304f49b3140821b39a..e04a12ca8c75e9f041c49f4f2b3ee20ef36f7ee4 100644
--- a/src/main/java/com/application/Main.java
+++ b/src/main/java/com/application/Main.java
@@ -1,12 +1,26 @@
 package com.application;
 
-import com.application.DB.DB;
 import javafx.application.Application;
-import javafx.fxml.FXMLLoader;
-import javafx.scene.Parent;
+
+import javafx.scene.chart.LineChart;
+
+import javafx.scene.control.ToggleButton;
+import javafx.scene.control.ToggleGroup;
+import javafx.scene.image.Image;
+import javafx.scene.image.ImageView;
+import javafx.scene.layout.*;
 import javafx.scene.Scene;
 import javafx.stage.Stage;
 
+
+import javafx.scene.chart.CategoryAxis;
+
+import javafx.scene.chart.NumberAxis;
+import javafx.scene.chart.XYChart;
+
+
+import java.io.FileInputStream;
+import java.io.FileNotFoundException;
 import java.io.IOException;
 import java.util.Objects;
 
@@ -18,6 +32,12 @@ import java.util.Objects;
  */
 public class Main extends Application {
 
+    private BorderPane topBar;
+    private HBox menuBar;
+    private HBox logoBar;
+    private VBox sideBar;
+    private LineChart lineChart;
+
     /**
      * Starts the application
      * @param args
@@ -27,6 +47,22 @@ public class Main extends Application {
         launch(args);
     }
 
+    /**
+     * Initializes the application with all the different panes.
+     *
+     * @throws Exception Exception in super.
+     */
+    @Override
+    public void init() throws Exception {
+        super.init();
+
+        // Initializing variables
+        this.topBar = new BorderPane();
+        this.menuBar = new HBox();
+        this.logoBar = new HBox();
+        this.sideBar = new VBox();
+    }
+
     /**
      * Sets the primaryStage and sets the scene for the window.
      * @param primaryStage
@@ -35,18 +71,138 @@ public class Main extends Application {
     @Override
     public void start(Stage primaryStage) throws Exception {
 
-        DB.getFromExistingTable();
+        // Create panes for root
+        BorderPane root = new BorderPane();
+        this.menuBar = createMenuBar();
+        this.logoBar = createLogoBar();
+        this.lineChart = createLineChart();
+
+        // Sets alignment for the topBar
+        this.topBar.setTop(menuBar);
+        this.topBar.setCenter(logoBar);
+
+        this.sideBar.setMinWidth(300);
+
+        //Set id for panes
+        root.setId("root");
+        this.menuBar.setId("menuBar");
+
+        // Sets alignment for the panes to the parent root
+        root.setTop(this.topBar);
+        root.setLeft(this.sideBar);
+        root.setCenter(this.lineChart);
 
-        // Loading the GUI-fxml file from resources
-        Parent root = FXMLLoader.load(Objects.requireNonNull(getClass().getResource("/com.application/GUI/graphical_user_interface.fxml")));
 
         // Sets the scene and defines boundaries
+        //Scene scene = new Scene(root, 1200, 600);
         Scene scene = new Scene(root, 1200, 600);
-        primaryStage.setMaximized(true);
+        scene.getStylesheets().add(Objects.requireNonNull(getClass().getResource("/com.application/styleSheet.css")).toExternalForm());
+
+        primaryStage.setTitle("Moelven Drying Application");
+        //primaryStage.setMaximized(true);
         primaryStage.setMinHeight(600);
         primaryStage.setMinWidth(1200);
         primaryStage.setScene(scene);
         primaryStage.show();
     }
+
+    /**
+     * Creates the menubar with buttons.
+     * Defines each action when button is clicked.
+     *
+     * @return MenuBar as a HBox
+     */
+    private HBox createMenuBar() {
+        // Creating buttons for menubar
+        ToggleGroup btnMenuGroup = new ToggleGroup();
+        ToggleButton btnMenuHome = new ToggleButton("Home");
+        ToggleButton btnMenuInput = new ToggleButton("Input");
+        ToggleButton btnMenuFinish = new ToggleButton("Finish");
+        ToggleButton btnMenuHelp = new ToggleButton("Help");
+
+
+        // Set the buttons toggleable
+        btnMenuHome.setToggleGroup(btnMenuGroup);
+        btnMenuInput.setToggleGroup(btnMenuGroup);
+        btnMenuFinish.setToggleGroup(btnMenuGroup);
+        btnMenuHelp.setToggleGroup(btnMenuGroup);
+
+        // Set the home button as default selected
+        btnMenuHome.setSelected(true);
+
+        //Make sure always one button is selected
+        btnMenuGroup.selectedToggleProperty().addListener((obsVal, oldVal, newVal) -> {
+            if (newVal == null)
+                oldVal.setSelected(true);
+        });
+
+        /*
+        btnMenuMetaImage.setOnAction(e -> featurePane.loadMetaImage());
+        btnMenuImport.setOnAction(e -> featurePane.loadImport());
+        btnMenuCreate.setOnAction(e -> featurePane.loadCreate());
+        btnMenuSearch.setOnAction(e -> featurePane.loadSearch());
+         */
+
+        menuBar.getChildren().addAll(btnMenuHome, btnMenuInput, btnMenuFinish, btnMenuHelp);
+        return menuBar;
+    }
+
+
+
+    private HBox createLogoBar() throws FileNotFoundException {
+        //Creating an image
+        Image moelvenLogoM = new Image(new FileInputStream("src/main/resources/com.application/GUI/moelven_logo_m.jpg"));
+        Image moelvenLogoTitle = new Image(new FileInputStream("src/main/resources/com.application/GUI/moelven_logo_title.jpg"));
+
+        //Setting the image view
+        ImageView imageViewM = new ImageView(moelvenLogoM);
+        ImageView imageViewTitle = new ImageView(moelvenLogoTitle);
+
+        imageViewM.setFitHeight(100);
+        imageViewM.setPreserveRatio(true);
+
+        imageViewTitle.setFitHeight(100);
+        imageViewTitle.setPreserveRatio(true);
+
+        Region region1 = new Region();
+        HBox.setHgrow(region1, Priority.ALWAYS);
+
+        Region region2 = new Region();
+        HBox.setHgrow(region2, Priority.ALWAYS);
+
+        return new HBox(imageViewM, region1, imageViewTitle, region2);
+    }
+
+
+    private LineChart<String,Number> createLineChart() {
+
+        final CategoryAxis xAxis = new CategoryAxis();
+        final NumberAxis yAxis = new NumberAxis();
+        xAxis.setLabel("Month");
+        final LineChart<String, Number> lineChart =
+                new LineChart<String, Number>(xAxis, yAxis);
+
+        lineChart.setTitle("Stock Monitoring, 2010");
+
+        XYChart.Series series1 = new XYChart.Series();
+        series1.setName("Portfolio 1");
+
+        series1.getData().add(new XYChart.Data("Jan", 23));
+        series1.getData().add(new XYChart.Data("Feb", 14));
+        series1.getData().add(new XYChart.Data("Mar", 15));
+        series1.getData().add(new XYChart.Data("Apr", 24));
+        series1.getData().add(new XYChart.Data("May", 34));
+        series1.getData().add(new XYChart.Data("Jun", 36));
+        series1.getData().add(new XYChart.Data("Jul", 22));
+        series1.getData().add(new XYChart.Data("Aug", 45));
+        series1.getData().add(new XYChart.Data("Sep", 43));
+        series1.getData().add(new XYChart.Data("Oct", 17));
+        series1.getData().add(new XYChart.Data("Nov", 29));
+        series1.getData().add(new XYChart.Data("Dec", 25));
+
+        lineChart.getData().add(series1);
+        return lineChart;
+    }
+
 }
 
diff --git a/src/main/resources/com.application/GUI/graphical_user_interface.fxml b/src/main/resources/com.application/GUI/graphical_user_interface.fxml
index 6b2bd5ef3d226874dfd39606f44e07bcbbd53adc..975d47da34a8cbb9301984afc53582812ac0721b 100644
--- a/src/main/resources/com.application/GUI/graphical_user_interface.fxml
+++ b/src/main/resources/com.application/GUI/graphical_user_interface.fxml
@@ -62,7 +62,7 @@
                      <center>
                         <ImageView fitHeight="30.0" fitWidth="125.0" pickOnBounds="true" preserveRatio="true">
                            <image>
-                              <Image url="@moelven_logo_tittle.jpg" />
+                              <Image url="@moelven_logo_title.jpg" />
                            </image>
                         </ImageView>
                      </center>
diff --git a/src/main/resources/com.application/GUI/moelven_logo_tittle.jpg b/src/main/resources/com.application/GUI/moelven_logo_title.jpg
similarity index 100%
rename from src/main/resources/com.application/GUI/moelven_logo_tittle.jpg
rename to src/main/resources/com.application/GUI/moelven_logo_title.jpg
diff --git a/src/main/resources/com.application/styleSheet.css b/src/main/resources/com.application/styleSheet.css
new file mode 100644
index 0000000000000000000000000000000000000000..1efb3b448daa04860ce8a99e33b390db82969f34
--- /dev/null
+++ b/src/main/resources/com.application/styleSheet.css
@@ -0,0 +1,12 @@
+/* General css for alle the main windows */
+
+/*noinspection CssUnusedSymbol*/
+.root {
+    -fx-pref-width: 1150;
+    -fx-pref-height: 600;
+    -fx-fill-height: true;
+    -fx-max-width: infinity;
+    -fx-font-size: 14;
+}
+
+
diff --git a/target/classes/com.application/GUI/graphical_user_interface.fxml b/target/classes/com.application/GUI/graphical_user_interface.fxml
index 6b2bd5ef3d226874dfd39606f44e07bcbbd53adc..975d47da34a8cbb9301984afc53582812ac0721b 100644
--- a/target/classes/com.application/GUI/graphical_user_interface.fxml
+++ b/target/classes/com.application/GUI/graphical_user_interface.fxml
@@ -62,7 +62,7 @@
                      <center>
                         <ImageView fitHeight="30.0" fitWidth="125.0" pickOnBounds="true" preserveRatio="true">
                            <image>
-                              <Image url="@moelven_logo_tittle.jpg" />
+                              <Image url="@moelven_logo_title.jpg" />
                            </image>
                         </ImageView>
                      </center>
diff --git a/target/classes/com.application/GUI/moelven_logo_tittle.jpg b/target/classes/com.application/GUI/moelven_logo_title.jpg
similarity index 100%
rename from target/classes/com.application/GUI/moelven_logo_tittle.jpg
rename to target/classes/com.application/GUI/moelven_logo_title.jpg
diff --git a/target/classes/com.application/styleSheet.css b/target/classes/com.application/styleSheet.css
new file mode 100644
index 0000000000000000000000000000000000000000..1efb3b448daa04860ce8a99e33b390db82969f34
--- /dev/null
+++ b/target/classes/com.application/styleSheet.css
@@ -0,0 +1,12 @@
+/* General css for alle the main windows */
+
+/*noinspection CssUnusedSymbol*/
+.root {
+    -fx-pref-width: 1150;
+    -fx-pref-height: 600;
+    -fx-fill-height: true;
+    -fx-max-width: infinity;
+    -fx-font-size: 14;
+}
+
+
diff --git a/target/classes/com/application/DB/DB.class b/target/classes/com/application/DB/DB.class
index 5fc50365604b4b0b0667010e8571d75202544d72..c77ffce8fa0cbecece9c222fcf0d44db5e517a4b 100644
Binary files a/target/classes/com/application/DB/DB.class and b/target/classes/com/application/DB/DB.class differ
diff --git a/target/classes/com/application/DB/Sort.class b/target/classes/com/application/DB/Sort.class
new file mode 100644
index 0000000000000000000000000000000000000000..a8073b0698d44e99c2a6ec25c9c9012f4d5568f2
Binary files /dev/null and b/target/classes/com/application/DB/Sort.class differ
diff --git a/target/classes/com/application/Main.class b/target/classes/com/application/Main.class
index 72d339a777587e42e0b4cf66b835e33ec457f966..6df8d5af623e4d83379853b325596f2de5b2fa48 100644
Binary files a/target/classes/com/application/Main.class and b/target/classes/com/application/Main.class differ