diff --git a/data/buildingsData.js b/data/buildingsData.js
index 98acd96..612eb46 100644
--- a/data/buildingsData.js
+++ b/data/buildingsData.js
@@ -138,7 +138,9 @@ export const buildingsData = {
         spritePlace: "city",
         description: "",
         jobs: {
+            worker: 3,
             artificer: 2,
+            patrician: 1,
         },
         build: {
             wood: 20,
@@ -161,7 +163,7 @@ export const buildingsData = {
         jobs: {
             worker: 2,
             artificer: 2,
-            patrician: 1,
+            noble: 1,
         },
         build: {
             wood: 20,
@@ -203,6 +205,7 @@ export const buildingsData = {
         jobs: {
             worker: 4,
             artificer: 2,
+            patrician: 1,
         },
         build: {
             wood: 20,
@@ -264,7 +267,8 @@ export const buildingsData = {
         spritePlace: "city",
         description: "",
         jobs: {
-            worker: 2,
+            worker: 4,
+            noble: 1,
         },
         build: {
             wood: 12,
@@ -389,4 +393,22 @@ export const buildingsData = {
             leather: 0.75
         }
     },
+    barracks: {
+        name: "Quartel",
+        spriteSize: "lg",
+        spritePlace: "city",
+        description: "",
+        jobs: {
+            soldier: 50,
+        },
+        build: {
+            wood: 100,
+            stone: 30,
+        },
+        maintenance: {
+            gold: 5,
+        },
+        production: {
+        }
+    },
 }
\ No newline at end of file
diff --git a/data/gameData.js b/data/gameData.js
index bfa02a8..b000f8f 100644
--- a/data/gameData.js
+++ b/data/gameData.js
@@ -15,6 +15,8 @@ export const game = {
     modifiers:{},
     activeEvents:{},
 
+    popDeaths:{},
+
     impacts: {
         popGrowth: 1,
         popDeath: 1,
@@ -33,7 +35,6 @@ export const game = {
     food_consumption: 0,
     knowledge: 0,
     popLimit: 0,
-    lifeQuality: 0,
 
     productivity: 0,
     happiness: 0.5,
diff --git a/data/popsData.js b/data/popsData.js
index dffcb39..c08ae8f 100644
--- a/data/popsData.js
+++ b/data/popsData.js
@@ -34,6 +34,14 @@ export const popsData = {
             tools: 0.02,
         },
     },
+    soldier:{
+        name: "Soldado",
+        food_consumption: 0.1,
+        consumption: {
+            clothes: 0.01,
+            weapon: 0.01,
+        },
+    },
     artificer:{
         name: "Artífice",
         food_consumption: 0.05,
@@ -49,6 +57,7 @@ export const popsData = {
         consumption: {
             ale: 0.05,
             clothes: 0.03,
+            wine: 0.05,
         },
     },
     noble:{
@@ -57,6 +66,7 @@ export const popsData = {
         consumption: {
             ale: 0.1,
             clothes: 0.05,
+            wine: 0.1,
         },
     },
 }
\ No newline at end of file
diff --git a/img/background.webp b/img/background.webp
new file mode 100644
index 0000000..c071133
Binary files /dev/null and b/img/background.webp differ
diff --git a/img/grass.webp b/img/grass.webp
deleted file mode 100644
index 52facfd..0000000
Binary files a/img/grass.webp and /dev/null differ
diff --git a/img/icons/pop-deaths/cold.png b/img/icons/pop-deaths/cold.png
new file mode 100644
index 0000000..6d4a0a7
Binary files /dev/null and b/img/icons/pop-deaths/cold.png differ
diff --git a/img/icons/pop-deaths/homeless.png b/img/icons/pop-deaths/homeless.png
new file mode 100644
index 0000000..5072137
Binary files /dev/null and b/img/icons/pop-deaths/homeless.png differ
diff --git a/img/icons/pop-deaths/hungry.png b/img/icons/pop-deaths/hungry.png
new file mode 100644
index 0000000..9fddab2
Binary files /dev/null and b/img/icons/pop-deaths/hungry.png differ
diff --git a/img/icons/pop-deaths/natural.png b/img/icons/pop-deaths/natural.png
new file mode 100644
index 0000000..ddb4d12
Binary files /dev/null and b/img/icons/pop-deaths/natural.png differ
diff --git a/img/icons/soldier.png b/img/icons/soldier.png
new file mode 100644
index 0000000..3dbbf88
Binary files /dev/null and b/img/icons/soldier.png differ
diff --git a/index.html b/index.html
index 7b71920..c284bed 100644
--- a/index.html
+++ b/index.html
@@ -23,6 +23,11 @@
     <title>TownRise</title>
 </head>
 <body>
+    <div id="console">
+        <input type="text" name="" id="">
+        <button class="btn">OK</button>
+        <p></p>
+    </div>
     <div id="main-interface">
         <div id="start-game" class="container menu">
             <h1>TownRise</h1>
@@ -30,7 +35,7 @@ <h1>TownRise</h1>
             <input type="button" class="btn btn-active" value="Nova Vila" id="start">
             <input type="button" class="btn btn-active" value="Carregar Vila" id="load">
             <input type="button" class="btn btn-active" value="Opções" id="options">
-            <p>v<span id="game-version">0.17</span>.2 &copy; JGSS</p>
+            <p>v<span id="game-version">0.18</span> &copy; JGSS</p>
         </div>
         <div id="load-game" class="container menu hidden">
             <h1>Carregar Vila</h1>
@@ -49,10 +54,10 @@ <h1>Carregar Vila</h1>
             <div class="container" id="time">
                 <div id="game-time">
                     <input type="button" class="btn btn-active hidden" value="Voltar para o Menu" id="restart">
-                    <input type="button" class="time-btn hidden" value="=" id="pause">
-                    <input type="button" class="time-btn hidden" value=">" id="1x">
-                    <input type="button" class="time-btn hidden" value=">>" id="5x">
-                    <input type="button" class="time-btn hidden" value=">>>" id="10x">
+                    <input type="button" class="btn time-btn hidden" value="=" id="pause">
+                    <input type="button" class="btn time-btn hidden" value=">" id="1x">
+                    <input type="button" class="btn time-btn hidden" value=">>" id="5x">
+                    <input type="button" class="btn time-btn hidden" value=">>>" id="10x">
                 </div>
                 <p><span>Dia </span><span id="totalDays-stat">1</span><span> - Ano </span><span id="year-stat">0</span></p>
                 <p><span id="day-weather"><i class="fa-solid fa-sun"></i></span> <span id="day-stat">1</span> - <span id="season">Primavera</span></p>
@@ -75,6 +80,7 @@ <h1>Carregar Vila</h1>
         </div>
         <div id="map-section">
             <div id="active-modifiers"></div>
+            <div id="pop-deaths"></div>
             <div class="hidden container grass-spring" id="map">
                 <div class="map-div" id="map-city"></div>
                 <div class="map-div" id="map-farms"></div>
@@ -143,6 +149,7 @@ <h1>Carregar Vila</h1>
             <div class="container" id="resources"></div>
         </div>
     </div>
+    <!--
     <div id="pops"></div>
     <div class="hidden" id="combat">
         <div id="combat-container">
@@ -195,5 +202,6 @@ <h1>Inimigos</h1>
             </div>
         </div>
     </div>
+     -->
 </body>
 </html>
\ No newline at end of file
diff --git a/scripts/handleInput.js b/scripts/handleInput.js
index 4bce98d..10e69f7 100644
--- a/scripts/handleInput.js
+++ b/scripts/handleInput.js
@@ -6,7 +6,7 @@ import { setGameSpeed, pauseGame } from "./gameTime.js";
 import { initPopulation } from "./ui/popUI.js";
 import { updateDataInfo } from "./ui/ui.js";
 import { selectGameDifficultyUI, gameOptionsUI } from "./ui/options.js";
-import { initBuildings } from "./ui/buildingsUI.js";
+import { buildingsBootstrap, updateMapItemsScale } from "./ui/buildingsUI.js";
 
 import { jobs } from "./jobs.js";
 import { buildBuilding, destroyBuilding } from "./buildings.js";
@@ -19,6 +19,10 @@ window.addEventListener("beforeunload", function (event) {
         event.returnValue = "\o/";
 });
 
+window.onresize = e => {
+    document.querySelector("body").style.height = window.innerHeight-20+"px";
+};
+
 window.onclick = e => {
     //Buildings
     const b = e.target.id.replace(/^add-/, "");
@@ -27,7 +31,7 @@ window.onclick = e => {
     }
     if(game.destroyBuildingCheck){
         if(e.target.parentNode.classList.contains("map-item")){
-            const building = e.target.parentNode.classList[3].substring(4)
+            const building = e.target.parentNode.classList[3].substring(4);
             destroyBuilding(building, 1);
         }
     }
@@ -121,6 +125,9 @@ async function startSequence(type) {
     initBuildings();
     initPopulation();
     updateDataInfo();
+    popBootstrap();
+    populationStart();
+    updateMapItemsScale();
 
     game.isStarted = true;
     game.isPaused = true;
diff --git a/scripts/population.js b/scripts/population.js
index 4fe84f4..e9c66a2 100644
--- a/scripts/population.js
+++ b/scripts/population.js
@@ -2,6 +2,7 @@ import { popsUpdate } from "./pops.js";
 import { game } from "../data/gameData.js";
 import { rand } from "./funcs.js";
 import { logPush } from "./ui/log.js";
+import { popDeathsUI } from "./ui/ui.js";
 
 let difficulty;
 
@@ -44,13 +45,19 @@ export function popGrowth(){
             logPush("1 cidadão morreu");
         else                        
             logPush((popDeath-popGrowth)+" cidadãos morreram");
+
+            
+        if(game.popDeaths.hasOwnProperty("natural"))
+            game.popDeaths["natural"] += popDeath;
+        else
+            game.popDeaths["natural"] = popDeath;
     }    
 }
 
 function popDeaths(){
     hungryDeaths();
     homelessDeaths();
-    withoutClothesDeaths();
+    cold();
     //randDeaths();
     
     function hungryDeaths(){
@@ -65,6 +72,11 @@ function popDeaths(){
     
             if(popDeath > 1)        logPush(popDeath+" cidadãos morreram de fome");
             if(popDeath == 1)       logPush(popDeath+" cidadão morreu de fome");
+
+            if(game.popDeaths.hasOwnProperty("hungry"))
+                game.popDeaths["hungry"] += popDeath;
+            else
+                game.popDeaths["hungry"] = popDeath;
     
             if(!game.population)    game.population = 0;
         }
@@ -106,9 +118,10 @@ function popDeaths(){
         
         homelessDeathChance = Math.round(homelessDeathChance);
 
-        let popDeath = rand(0,100) < homelessDeathChance;
+        const popDeathChance = rand(0, 100) < homelessDeathChance;
+        let popDeath = 0;
 
-        if(popDeath){
+        if(popDeathChance){
             popDeath = Math.ceil((rand(0,homelessDeathChance)/100)*homelessPops);
         }
 
@@ -116,9 +129,14 @@ function popDeaths(){
 
         if(popDeath > 1)    logPush(popDeath+" cidadãos morreram sem abrigo");
         if(popDeath == 1)   logPush(popDeath+" cidadão morreu sem abrigo");
+
+        if(game.popDeaths.hasOwnProperty("homeless"))
+            game.popDeaths["homeless"] += popDeath;
+        else
+            game.popDeaths["homeless"] = popDeath;
     }
 
-    function withoutClothesDeaths(){
+    function cold(){
         if(rand(0,5) != 0) return;
 
         let popWithoutClothes = game.population - Math.floor(game.clothes);
@@ -132,6 +150,11 @@ function popDeaths(){
 
         if(popDeath < 0) popDeath = 0;
 
+        if(game.popDeaths.hasOwnProperty("cold"))
+            game.popDeaths["cold"] += popDeath;
+        else
+            game.popDeaths["cold"] = popDeath;
+
         game.population -= popDeath;
     }
 }
diff --git a/scripts/sound.js b/scripts/sound.js
index b5b4f3f..35c0213 100644
--- a/scripts/sound.js
+++ b/scripts/sound.js
@@ -1,6 +1,6 @@
 import { rand } from "./funcs.js"
 
-var audio = new Audio();
+export let audio = new Audio();
 const NUMBER_OF_SONGS = 7;
 
 export function soundStart(){
@@ -12,20 +12,19 @@ export function soundtrack(){
     if(audio.paused){
         const newSongID = rand(0,NUMBER_OF_SONGS);
         audio = new Audio("./songs/"+newSongID+".mp3");
+        audio.volume = Number(localStorage.getItem("mv-volume"))/4;
         
         const tryToPlay = setInterval(() => {        
             audio.play()
-                .then(() => {
-                    clearInterval(tryToPlay);
-                })
-                .catch(error => {
-                    console.error(error);
-                });
+            .then(() => {
+                clearInterval(tryToPlay);
+            })
+            .catch(error => {
+                ;
+            });
+
+            audio.addEventListener('ended', setTimeout(soundtrack, rand(500,4000)));
         }, 1000);
     }
-
-    audio.volume = Number(localStorage.getItem("mv-volume"))/4;
-    
-    window.setTimeout(soundtrack, 500);
 }
 
diff --git a/scripts/time/month.js b/scripts/time/month.js
index 7527525..af9546a 100644
--- a/scripts/time/month.js
+++ b/scripts/time/month.js
@@ -6,6 +6,8 @@ import { eventsData } from "../../data/eventsData.js";
 export function advanceMonth(){
     shuffleArr(eventsData);
     
+    resetPopDeaths();
+    
     if(game.season == "spring"){
         game.season = "summer";
 
@@ -29,4 +31,10 @@ export function advanceMonth(){
         document.getElementById("map").classList.remove("map-winter");
         advanceYear();
     }
+}
+
+function resetPopDeaths(){
+    for(const m in game.popDeaths){
+        game.popDeaths[m] = 0;
+    }
 }
\ No newline at end of file
diff --git a/scripts/ui/buildingsUI.js b/scripts/ui/buildingsUI.js
index 74d865f..9bb4c68 100644
--- a/scripts/ui/buildingsUI.js
+++ b/scripts/ui/buildingsUI.js
@@ -12,7 +12,7 @@ export function buildingHTML(id){
 
     let buildingHTML = `
     <div class="map-item map-item-${building.spriteSize} map-${building.spritePlace} map-${id}">
-        <img src="./img/buildings/${id}.png">
+        <img src="./img/buildings/${id}.png" draggable="false">
     </div>`;
 
     if(building.spritePlace == "city")           city.innerHTML += buildingHTML;
@@ -139,12 +139,12 @@ export function updateMapItemsScale(){
     let mWidth = -Math.round(mapItems * 0.1);
     let mHeight = -Math.round(mapItems * 0.05);
 
-    if(mWidth < -10) mWidth = -10;
-    if(mHeight < -7) mHeight = -7;
+    if(mWidth < -15) mWidth = -15;
+    if(mHeight < -10) mHeight = -10;
     
     //IMG Sizes
-    let modifier = Math.round(mapItems*0.1);
-    if(modifier > 32) modifier = 32;
+    let modifier = Math.round(mapItems*0.15);
+    if(modifier > 48) modifier = 48;
 
     let smSize = 48 - modifier;
     let mdSize = 64 - modifier;
@@ -155,7 +155,7 @@ export function updateMapItemsScale(){
     document.querySelector("#map").style.setProperty("--marginHeight", mHeight+"px");   
     document.querySelector("#map").style.setProperty("--sm_img_size", smSize+"px");   
     document.querySelector("#map").style.setProperty("--md_img_size", mdSize+"px");   
-    document.querySelector("#map").style.setProperty("--lg_img_size", lgSize+"px");   
+    document.querySelector("#map").style.setProperty("--lg_img_size", lgSize+"px");
 }
 
 const buildings = [
@@ -168,7 +168,7 @@ const buildings = [
     ["businesses", 
         ["bakery","tavern"]],
     ["handicraft", 
-        ["tailorsmith","armory","blacksmith"]],
+        ["tailorsmith","armory","blacksmith","barracks"]],
     ["resources", 
         ["huntingCabin","foundry","lumbermill","mine","deepMine"]],
 ];
diff --git a/scripts/ui/options.js b/scripts/ui/options.js
index 11dbd16..95eb475 100644
--- a/scripts/ui/options.js
+++ b/scripts/ui/options.js
@@ -1,4 +1,5 @@
 import { game } from "../../data/gameData.js";
+import { audio } from "../sound.js";
 
 export function gameOptionsUI(){
     const volumeValue = localStorage.getItem("mv-volume");
@@ -22,6 +23,7 @@ export function gameOptionsUI(){
       const volumeEl = document.querySelector("#volume input");
       volumeEl.addEventListener("change", () => {
           localStorage.setItem("mv-volume", volumeEl.value);
+          audio.volume = volumeEl.value;
       });
 }
 
diff --git a/scripts/ui/ui.js b/scripts/ui/ui.js
index 07571a6..c80d5f6 100644
--- a/scripts/ui/ui.js
+++ b/scripts/ui/ui.js
@@ -44,7 +44,7 @@ export function resourcesUI(){
 
             html += `
             <div class="resources-btn" id="${r}">
-                <img id="${r}-img" src="./img/icons/${r}.png">
+                <img id="${r}-img" src="./img/icons/${r}.png" draggable="false">
                 <p id="${r}-stat"></p>
                 <small id="${r}-balance-stat">0</small>
             </div>
@@ -84,7 +84,7 @@ export function professionsUI(){
     let html = `
     <table>
         <tr>
-            <td><img src="./img/icons/idle.png"></td>
+            <td><img src="./img/icons/idle.png" draggable="false"></td>
             <td><p>Ocioso:</p></td>
             <td></td>
             <td><p><span id="idle-stat">10</span></p></td>
@@ -96,7 +96,7 @@ export function professionsUI(){
 
         html += `
             <tr>
-                <td><img src="./img/icons/${p}.png"></td>
+                <td><img src="./img/icons/${p}.png" draggable="false"></td>
                 <td><p>${popsData[p].name}:</p></td>
                 <td><input id="${p}-input" class="professions-slider" type="range" value="0" step="1"></td>
                 <td><p><span id="${p}-stat">10</span>/<span id="${p}-jobs-stat">10</span></p></td>
@@ -124,6 +124,7 @@ export function updateDataInfo(){
     buildingsDescriptionUpdate();
 
     modifiersUI();
+    popDeathsUI();
 
     //Bars
     const barsElements = ["productivity","happiness","lifeQuality"];
@@ -149,7 +150,7 @@ export function modifiersUI(){
     function createModElement(id){
         document.getElementById("active-modifiers").innerHTML += `
             <div class="container modifier-icon" id="${id}-modifier">
-                <img src="./img/icons/modifiers/${id}.png">
+                <img src="./img/icons/modifiers/${id}.png" draggable="false">
                 <small>${game.modifiers[id]}</small>
             </div>
         `;
@@ -179,7 +180,7 @@ export function modifiersUI(){
     }
 
     document.querySelectorAll(".modifier-icon").forEach(e => {
-        const elID = e.id.slice(0, -9);
+        const elID = e.id.slice(0, -"-modifier".length);
         
         if(!game.modifiers.hasOwnProperty(elID)){
             deleteModElement(elID);
@@ -187,6 +188,76 @@ export function modifiersUI(){
     });
 }
 
+const deathData = {
+    natural: {
+        article: "de ",
+        name: "Morte Natural",
+    },
+    hungry: {
+        article: "de ",
+        name: "Fome",
+    },
+    homeless: {
+        article: "",
+        name: "Sem Abrigo",
+    },
+    cold: {
+        article: "de ",
+        name: "Frio",
+    },
+}
+
+export function popDeathsUI(){
+    function createTippy(id){
+        tippy("#"+id+"-pop-death", {
+            content: "<p>Mortos <b>"+deathData[id].article+deathData[id].name+"</b></p>",
+            allowHTML: true,
+            theme: "townrise",
+            interactive: false,
+        });
+    }
+    function createModElement(id){
+        document.getElementById("pop-deaths").innerHTML += `
+            <div class="container pop-death-icon" id="${id}-pop-death">
+                <img src="./img/icons/pop-deaths/${id}.png" draggable="false">
+                <small>${game.popDeaths[id]}</small>
+            </div>
+        `;
+
+        createTippy(id);
+    }
+    function updateModElement(id){
+        document.querySelector("#"+id+"-pop-death small").innerText = game.popDeaths[id];
+    }
+    function deleteModElement(id){
+        document.getElementById(id+"-pop-death").remove();
+    }
+    //###############################################################
+
+    for(const m in game.popDeaths){
+        if(document.getElementById(m+"-pop-death") == null){
+            createModElement(m);
+        }
+        else{
+            updateModElement(m);
+        }
+    }
+
+    for(const m in game.popDeaths){
+        if(document.getElementById(m+"-pop-death")._tippy == undefined)
+            createTippy(m);
+    }
+
+    document.querySelectorAll(".pop-death-icon").forEach(e => {
+        const id = e.id.slice(0, -"-pop-death".length);
+
+        if(!game.popDeaths.hasOwnProperty(id) || game.popDeaths[id] == 0){
+            deleteModElement(id);
+            delete game.popDeaths[id];
+        }
+    });
+}
+
 function resourcesStatAndLack(){
     for(const r in resources){
         document.getElementById(r+"-stat").innerText = numberF(Math.floor(game[r]),"",0);
diff --git a/styles/map.css b/styles/map.css
index e89b3a0..d75eeb1 100644
--- a/styles/map.css
+++ b/styles/map.css
@@ -1,6 +1,8 @@
 #map-section {
-    position: relative;
-    width: 100%;
+    width: 57%;
+    -webkit-user-select: none; /* Safari */
+    -ms-user-select: none; /* IE 10 and IE 11 */
+    user-select: none; /* Standard syntax */
 }
 
 #map {
@@ -10,18 +12,20 @@
     --md_img_size: 64px;
     --lg_img_size: 72px;
 
+    border: 0;
     height: 100%;
-    width: 100%;
+    min-height: 650px;
     justify-items: center;
     flex-direction: column;
     flex-wrap: wrap;
     align-content: center;
     justify-content: space-evenly;
     align-items: center;
-    border: 1px solid black;
-    background-color: #32a20b;
-    background-image: url("../img/grass.webp");
-    background-repeat: repeat;
+    background-color: transparent;
+    background-image: url("../img/background.webp");
+    background-repeat: space;
+    background-size: cover;
+    background-position-x: center;
     -webkit-transition: 2s -webkit-filter linear;
     -moz-transition: 2s -moz-filter linear;
     -moz-transition: 2s filter linear;
@@ -50,13 +54,23 @@
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
-    align-items: center;
-    justify-content: center;
+    position: relative;
 }
 .map-div:first-child {
     margin-top: 45px;
 }
 
+#map-city {
+    top: 42%;
+}
+#map-farms {
+    top: 33%;
+}
+#map-manufactories {
+    top: -6%;
+}
+
+
 .map-item {
     filter: drop-shadow(2px 2px 2px #333);
     margin: var(--marginHeight) var(--marginWidth);
diff --git a/styles/pops.css b/styles/pops.css
index a7b362a..e2e7ea9 100644
--- a/styles/pops.css
+++ b/styles/pops.css
@@ -1,5 +1,8 @@
 #pops {
     padding: 5px;
+    -webkit-user-select: none; /* Safari */
+    -ms-user-select: none; /* IE 10 and IE 11 */
+    user-select: none; /* Standard syntax */
 }
 #pops table{
     text-align: center;
diff --git a/styles/style.css b/styles/style.css
index ef67889..3018818 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -18,11 +18,36 @@ body {
     background: -webkit-linear-gradient(to right, var(--body-bg-gradient1), var(--body-bg-gradient2));
     background: linear-gradient(to right, var(--body-bg-gradient1), var(--body-bg-gradient2));
     margin: 0;
+    overflow: hidden;
+}
+@media only screen and (max-height: 650px) {
+    body {
+        overflow: overlay;
+    }
 }
 
 #main-interface {
     display: flex;
-    justify-content: space-evenly;
+    justify-content: start;
+    height: 100vh;
+    max-height: 768px;
+}
+
+#console {
+    padding: 0.25em;
+    display: flex;
+    justify-content: center;
+    display: none;
+}
+
+#console input {
+    width: 50%;
+    padding: 1em;
+    margin-right: 1em;
+}
+
+#console button {
+    padding: 1em;
 }
 
 p {
@@ -54,6 +79,7 @@ select {
 
 .data {
     padding: 5px 10px;
+    border: 0;
 }
 
 #infos td:first-child {
@@ -81,6 +107,9 @@ select {
     font-family: Arial, Helvetica, sans-serif;
     border-radius: 0.5em;
     border: 1px solid var(--dark-border);
+    -webkit-user-select: none; /* Safari */
+    -ms-user-select: none; /* IE 10 and IE 11 */
+    user-select: none; /* Standard syntax */
 }
 
 .btn:hover{
@@ -117,13 +146,24 @@ select {
 #left-section{
     flex-direction: column;
     align-items: stretch;
-    width: min-content;
+    background-color: var(--container-bg);
 }
 #left-section div{
     margin-bottom: -1px;
+    border: 0;
+}
+#left-section > div:nth-child(2),
+#left-section > div:nth-child(3) {
+    border-top: 1px solid;
+}
+
+#info-section {
+    flex-direction: column;
 }
 
-#resources{
+#resources {
+    width: calc(25px + 95px * 3);
+    overflow: overlay;
     display: flex;
     flex-wrap: wrap;
     border: 0;
@@ -132,22 +172,23 @@ select {
     justify-content: space-between;
 }
 
-.resources-row{
-    margin-bottom: 0.5em;
+.resources-row {
+    display: flex;
+    flex-direction: column;
     width: 95px;
+    padding: 2px;
 }
-.resources-row p:first-child{
+.resources-row p:first-child {
     font-size: 12px;
     overflow: hidden;
     font-weight: bold;
     text-align: center;
-    background-color: #d3d3d3;
     border-bottom: 1px solid #999;
     padding: 2px;
+    background-color: var(--container-bg);
 }
-.resources-btn{
+.resources-btn {
     display: flex;
-    cursor: normal;
     background-color: #e2e2e2;
     padding: 5px;
     font-size: 12px;
@@ -163,12 +204,6 @@ select {
     filter: drop-shadow(1px 1px 1px black);
 }
 
-#info-section {
-    flex-direction: column;
-    width: 25%;
-    min-width: 300px;
-}
-
 button:hover span {
     display: block;
     line-height: 1.5;
@@ -185,7 +220,6 @@ button:hover span b {
 
 #buildings-menu{
     flex-direction: row;
-    width: min-content;
     height: min-content;
     padding: 5px;
 }
@@ -240,15 +274,16 @@ button:hover span b {
     padding: 10px;
 }
 
-#active-modifiers {
-    position: absolute;
+#active-modifiers, #pop-deaths {
+    position: absolute;;
     z-index: 999;
     display: flex;
     flex-wrap: wrap;
-    left: 0;
-    top: 0;
 }
-#active-modifiers div{
+#pop-deaths {
+    top: 50px;
+}
+#active-modifiers div, #pop-deaths div{
     width: 40px;
     height: 40px;
     font-weight: bold;
@@ -256,12 +291,12 @@ button:hover span b {
     text-align: center;
     justify-content: center;
 }
-#active-modifiers small{
+#active-modifiers small, #pop-deaths small{
     margin-top: 1px;
     background-color: #b6b6b6;
     border-top: 1px solid #777;
 }
-#active-modifiers img{
+#active-modifiers img, #pop-deaths img{
     width: 24px;
     height: 24px;
     align-self: center;