diff --git a/eloquentjavascript/script.js b/eloquentjavascript/script.js
index 79a6fef..8878af5 100644
--- a/eloquentjavascript/script.js
+++ b/eloquentjavascript/script.js
@@ -2,4 +2,39 @@ let number = 0;
 while (number <= 12) {
   console.log(number);
   number = number + 2;
-}
\ No newline at end of file
+}
+
+
+let result = 1;
+let counter = 0;
+while (counter < 10) {
+  result = result * 2;
+  counter = counter + 1;
+}
+console.log(result);
+
+for (let number = 0; number <= 12; number = number +2){
+    console.log(number);
+    ;
+}
+
+for (let current = 20; ;current = current +1){
+    if (current % 7 == 0){
+        console.log(current);
+        break;
+    }
+}
+
+switch (prompt("What is the weather like?")) {
+    case "rainy":
+      console.log("Remember to bring an umbrella.");
+      break;
+    case "sunny":
+      console.log("Dress lightly.");
+    case "cloudy":
+      console.log("Go outside.");
+      break;
+    default:
+      console.log("Unknown weather type!");
+      break;
+  }
diff --git a/intro_html/css.html b/intro_html/css.html
index 2b07a4b..455c1ad 100644
--- a/intro_html/css.html
+++ b/intro_html/css.html
@@ -13,7 +13,12 @@
         div.page{
             height: 100vh;
             display: grid;
-            grid-template-areas: "header header """"";
+            grid-template-columns: 1fr 4fr;
+            grid-template-rows: 20px 10fr 20px;
+            grid-template-areas: 
+            'menu header'
+            'menu mainContent'
+            'menu footer';                  ;
         }
         div.header {
             background-color: aquamarine;
@@ -34,6 +39,18 @@
             background-color: crimson;
             grid-area: footer;
         }
+        @media only screen and (max-width: 400px) {
+          div.page {
+            grid-template-columns: 1fr;
+            grid-template-rows: 20px 1fr 4fr 20px;
+            grid-template-areas:  
+            'header'
+            'menu'
+            'mainContent'
+            'footer';
+          }  
+
+        }
     </style>
 </head>
 
diff --git a/intro_js/betale.html b/intro_js/betale.html
new file mode 100644
index 0000000..3a93b56
--- /dev/null
+++ b/intro_js/betale.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>JS intro variable opertaor og parametre</title>
+</head>
+<style>
+    #app {
+        display: grid;
+    }
+</style>
+
+<body>
+    Per har betalt:<input type="number" id="per"><br />
+    Paal har betalt:<input type="number" id="paal"><br/>
+    Espen har betalt:<input type="number" id="espen"><br/>
+    <button onclick="calculate()">Beregne</button>
+
+    <div id="app"></div>
+
+    <script>
+
+        function calculate() {
+            let amountPayedPer = document.getElementById("per").valueAsNumber;
+            let amountPayedPaal = document.getElementById("paal").valueAsNumber;
+            let amountPayedEspen = document.getElementById("espen").valueAsNumber;
+            let totalAmountPayed = amountPayedPer + amountPayedPaal + amountPayedEspen;
+            let costPerPerson = totalAmountPayed / 3;
+            let owesPer = costPerPerson - amountPayedPer;
+            let owesPaal = costPerPerson - amountPayedPaal;
+            let owesEspen = costPerPerson - amountPayedEspen;
+
+            document.getElementById("app").innerHTML = /*HTML*/ `
+             Per har betalt: ${amountPayedPer}<br/>
+             Paal har betalt: ${amountPayedPaal}<br/>
+             Espen har betalt: ${amountPayedEspen}<br/>
+             Sum betalt: ${totalAmountPayed}<br/>
+             Kostnad per person: ${costPerPerson}<br/>
+             Per skylder: ${owesPer}<br/>
+             Paal skylder: ${owesPaal}<br/>
+             Espen skylder: ${owesEspen}<br/>
+        `;
+        }
+    </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/intro_js/index.html b/intro_js/index.html
new file mode 100644
index 0000000..5c86b22
--- /dev/null
+++ b/intro_js/index.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=<device-width>, initial-scale=1.0">
+    <title>Document</title>
+</head>
+
+<body>
+    <div id="app">
+    </div>
+    <script>
+        add('green', 500, "Det", 'div');
+        add('red', 250, "var", 'h3');
+        add('blue', 600, "en", 'li');
+        add('rgb(200, 200, 42)', 500, "gang", 'span');
+        
+        function add(color, size, word, tagName) {
+            let existingHtml = document.getElementById('app').innerHTML;
+            let newHtml =  /*HTML*/ `
+            <${tagName} style="color:${color}; font-size: ${size}%;">${word}</${tagName}>
+            `;
+            document.getElementById('app').innerHTML = existingHtml + newHtml ;
+        }
+    </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/team/variabler/script.js b/intro_js/intro.js
similarity index 100%
rename from team/variabler/script.js
rename to intro_js/intro.js
diff --git a/prosjekt/index.html b/prosjekt/index.html
index 513f4f7..3dbbedb 100644
--- a/prosjekt/index.html
+++ b/prosjekt/index.html
@@ -7,35 +7,41 @@
     <title>Super cool project for homelabers</title>
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/water.css">
     <style>
-        div.main {
+        div.page{
+            height: 100vh;
             display: grid;
-            grid-template-columns:
-                "sidebar topbar topbar"
-                "sidebar main"
-                "sidebar footer footer";
+            grid-template-columns: 1fr 4fr;
+            grid-template-rows: 20px 10fr 20px;
+            grid-template-areas: 
+            'menu header'
+            'menu mainView'
+            'menu footer';                  ;
         }
-
-        .item-a {
-            grid-area: sidebar;
+        div.header{
+            background-color: aquamarine;
+            grid-area: header;
         }
-
-        .item-b {
-            grid-area: topbar;
+        div.menu{
+            background-color: grey;
+            grid-area: menu;
         }
-
-        .item-c {
-            grid-area: main;
+        div.mainView{
+            background-color: whitesmoke;
+            grid-area: mainView;
         }
-
-        .item-d {
+        div.footer{
+            background-color: black;
             grid-area: footer;
         }
     </style>
 </head>
 
 <body>
-    <div class="main">
-
+    <div class="page">
+        <div class="header">Header</div>
+        <div class="menu">Menu</div>
+        <div class="mainContent">MainContent</div>
+        <div class="footer">Footer</div>
     </div>
 </body>
 
diff --git a/team/variabler/healthMana.html b/team/variabler/healthMana.html
deleted file mode 100644
index d0d56ec..0000000
--- a/team/variabler/healthMana.html
+++ /dev/null
@@ -1,83 +0,0 @@
- <!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Health og Mana</title>
-    <style>
-        body {
-            margin: 0;
-            padding: 0;
-        }
-        .container {
-            border: 10px solid greenyellow;
-            display: grid;
-            grid-template-columns: repeat(4, 1fr);
-            height: 10vh;
-
-        }
-        .header{
-            border: 10px solid grey;
-            border-radius: 10px;
-            background-color: antiquewhite;
-            font-size: x-large;
-        }
-    </style>
-</head>
-<body>
-    <div class="header">Add or delete potions from inventory</div>
-    <div class="container">
-     <button onclick="addHealth()">add health potion</button>
-     <button onclick="delHealth()">delete health potion</button>
-     <button onclick="addMana()">add mana potion</button>
-     <button onclick="delMana()">delete mana potion</button>
-     </div>
-     <div>
-        <div onclick="showHideInventory()">
-            <div class="header">Inventory</div>
-        </div>
-        <div id="inventory">
-        
-        </div>
-     </div>
-     <script>
-        var healthTotal = 0;
-        var manaTotal = 0;
-        var inventoryOpen = Boolean(false);
-        function addHealth() {
-            ++healthTotal 
-            document.getElementById("healthTotal").innerHTML = healthTotal;
-        }
-        function delHealth() {
-            --healthTotal 
-            document.getElementById("healthTotal").innerHTML = healthTotal;
-        }
-        function addMana() {
-            ++manaTotal
-            document.getElementById("manaTotal").innerHTML = manaTotal;
-        }
-        function delMana() {
-            --manaTotal
-            document.getElementById("manaTotal").innerHTML = manaTotal;
-        }
-        function showHideInventory() {
-            if (inventoryOpen != true) {
-                document.getElementById('inventory').innerHTML = /*HTML*/ `
-                <div class="container">Health<div id="healthTotal"></div>
-                Mana<div id="manaTotal"></div>
-                </div>`;
-                document.getElementById("manaTotal").innerHTML = manaTotal;
-                document.getElementById("healthTotal").innerHTML = healthTotal;
-                inventoryOpen = true;
-            } else {
-                blankAll()
-                inventoryOpen = false;
-            }
-        }
-        function blankAll() {
-            document.getElementById('inventory').innerHTML = '';
-        }
-
-     </script>
-</body>
-</html>
\ No newline at end of file
diff --git a/team/variabler/style.css b/team/variabler/style.css
deleted file mode 100644
index e69de29..0000000
