diff --git a/src/assets/icons/arrowLeft.svg b/src/assets/icons/arrowLeft.svg
index df24f0d..a9f618f 100644
--- a/src/assets/icons/arrowLeft.svg
+++ b/src/assets/icons/arrowLeft.svg
@@ -1,3 +1,6 @@
-<svg id="Flat" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="#c47529">
-  <path d="M198.71094,57.28906A100.00037,100.00037,0,0,0,57.28906,198.71094,100.00037,100.00037,0,0,0,198.71094,57.28906Zm-5.65723,135.76465A91.99945,91.99945,0,1,1,220,128,91.39744,91.39744,0,0,1,193.05371,193.05371Zm-22.2251-94.2251L141.65674,128l29.17187,29.17139a4.00026,4.00026,0,0,1-5.65722,5.65722l-32-32a4.00058,4.00058,0,0,1,0-5.65722l32-32a4.00026,4.00026,0,0,1,5.65722,5.65722Zm-56,0L85.65674,128l29.17187,29.17139a4.00026,4.00026,0,0,1-5.65722,5.65722l-32-32a4.00058,4.00058,0,0,1,0-5.65722l32-32a4.00026,4.00026,0,0,1,5.65722,5.65722Z"/>
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" viewBox="0 0 16 16">
+<path fill="#3f79ad" d="M8 0c-4.4 0-8 3.6-8 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zM6.4 9l1.8 1.8-1.4 1.4-4.2-4.2 4.2-4.2 1.4 1.4-1.8 1.8h6.6v2h-6.6z"></path>
 </svg>
diff --git a/src/assets/icons/caretDown.svg b/src/assets/icons/caretDown.svg
index 621b2b5..258e42a 100644
--- a/src/assets/icons/caretDown.svg
+++ b/src/assets/icons/caretDown.svg
@@ -1,3 +1,6 @@
-<svg id="Flat" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="#c47529">
-  <path d="M128,180a3.98881,3.98881,0,0,1-2.82861-1.17139l-80-80.00024a4.00009,4.00009,0,0,1,5.65722-5.65674L128,170.34326l77.17139-77.17163a4.00009,4.00009,0,0,1,5.65722,5.65674l-80,80.00024A3.98881,3.98881,0,0,1,128,180Z"/>
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" viewBox="0 0 16 16">
+<path fill="#3f79ad" d="M8 13.1l-8-8 2.1-2.2 5.9 5.9 5.9-5.9 2.1 2.2z"></path>
 </svg>
diff --git a/src/assets/icons/settings-cog.svg b/src/assets/icons/settings-cog.svg
index af9aabb..389fa36 100644
--- a/src/assets/icons/settings-cog.svg
+++ b/src/assets/icons/settings-cog.svg
@@ -1,3 +1,7 @@
-<svg id="Flat" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.00098 256.00098" fill="#c47529">
-  <path d="M128.001,68.00049a60,60,0,1,0,60,60A60.06811,60.06811,0,0,0,128.001,68.00049Zm0,112a52,52,0,1,1,52-52A52.05895,52.05895,0,0,1,128.001,180.00049Zm92-45.21045V121.21191l9.63525-14.45263a12.25263,12.25263,0,0,0,1.56982-10.25049,107.48238,107.48238,0,0,0-7.94873-19.2251,12.06942,12.06942,0,0,0-8.35107-6.12646L197.856,67.74707,188.25488,58.146l-3.41015-17.05127a12.06909,12.06909,0,0,0-6.12647-8.35108,107.50453,107.50453,0,0,0-19.22607-7.94775,12.25915,12.25915,0,0,0-10.25049,1.56982L134.79,36H121.21191l-14.45117-9.63428a12.25671,12.25671,0,0,0-10.251-1.56982,107.50644,107.50644,0,0,0-19.22559,7.94775,12.066,12.066,0,0,0-6.127,8.352L67.74805,58.145,58.146,67.74658,41.0957,71.15625a12.06842,12.06842,0,0,0-8.35107,6.12646A107.47763,107.47763,0,0,0,24.7959,96.50879a12.2545,12.2545,0,0,0,1.56933,10.25049L36,121.21094v13.57812l-9.63477,14.45166a12.256,12.256,0,0,0-1.56933,10.25049,107.48684,107.48684,0,0,0,7.94775,19.22608,12.06841,12.06841,0,0,0,8.35108,6.12646L58.146,188.25391l9.60107,9.60107,3.40918,17.05127a12.06856,12.06856,0,0,0,6.12646,8.35156,107.51667,107.51667,0,0,0,19.2251,7.94776,12.25644,12.25644,0,0,0,10.25049-1.56983l14.45264-9.63476h13.57812l14.45264,9.63525a12.395,12.395,0,0,0,6.84375,2.06982,11.70364,11.70364,0,0,0,3.40674-.50048,107.41894,107.41894,0,0,0,19.22461-7.94727,12.06629,12.06629,0,0,0,6.12695-8.35107l3.41016-17.05127,9.60107-9.60157,17.05127-3.40966a12.06838,12.06838,0,0,0,8.35107-6.12647,107.48207,107.48207,0,0,0,7.94873-19.2251,12.2526,12.2526,0,0,0-1.56982-10.25048Zm3.55127,22.375a99.49716,99.49716,0,0,1-7.355,17.7915A4.15674,4.15674,0,0,1,213.33691,177l-18.23828,3.647a4.00051,4.00051,0,0,0-2.04443,1.09424l-11.31348,11.31445a4.00049,4.00049,0,0,0-1.09375,2.04346l-3.648,18.23877a4.15224,4.15224,0,0,1-2.04345,2.85986,99.42219,99.42219,0,0,1-17.791,7.354,4.17194,4.17194,0,0,1-3.48535-.57178l-15.46045-10.30713A4.00111,4.00111,0,0,0,136,212.001H120a4.00111,4.00111,0,0,0-2.21875.67187L102.3208,222.97949a4.16884,4.16884,0,0,1-3.48486.57178,99.44022,99.44022,0,0,1-17.791-7.354A4.15533,4.15533,0,0,1,79.001,213.3374l-3.647-18.23877a4.00319,4.00319,0,0,0-1.09375-2.04443l-11.314-11.31348a4.00045,4.00045,0,0,0-2.04346-1.09375l-18.23877-3.648a4.15564,4.15564,0,0,1-2.86035-2.04345,99.50156,99.50156,0,0,1-7.354-17.79248,4.17807,4.17807,0,0,1,.57226-3.48487l10.30615-15.45947A4.00112,4.00112,0,0,0,44,136V120a4.00112,4.00112,0,0,0-.67188-2.21875L33.022,102.32178a4.17807,4.17807,0,0,1-.57226-3.48487,99.45812,99.45812,0,0,1,7.35547-17.79248A4.15469,4.15469,0,0,1,42.665,79.001l18.2373-3.647a3.99983,3.99983,0,0,0,2.04395-1.09375L74.26123,62.9458A4.00319,4.00319,0,0,0,75.355,60.90137l3.647-18.23731a4.15392,4.15392,0,0,1,2.044-2.85986,99.422,99.422,0,0,1,17.7915-7.354,4.17513,4.17513,0,0,1,3.48535.57177l15.45948,10.30615A4.0011,4.0011,0,0,0,120.001,44h16a4.00112,4.00112,0,0,0,2.21875-.67188l15.46-10.30615a4.17378,4.17378,0,0,1,3.48486-.57177,99.422,99.422,0,0,1,17.7915,7.354A4.15392,4.15392,0,0,1,177,42.66406l3.648,18.23877a4.00176,4.00176,0,0,0,1.09375,2.04395l11.314,11.31347a4.00034,4.00034,0,0,0,2.04346,1.09375l18.23779,3.64795a4.15477,4.15477,0,0,1,2.85987,2.04346,99.463,99.463,0,0,1,7.35547,17.7915,4.17808,4.17808,0,0,1-.57227,3.48487l-10.30713,15.46045a4.00109,4.00109,0,0,0-.67187,2.21875v16a4.00111,4.00111,0,0,0,.67187,2.21875L222.98,153.68018A4.17805,4.17805,0,0,1,223.55225,157.165Z"/>
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" viewBox="0 0 16 16">
+<path fill="#3f79ad" d="M16 9v-2l-1.7-0.6c-0.2-0.6-0.4-1.2-0.7-1.8l0.8-1.6-1.4-1.4-1.6 0.8c-0.5-0.3-1.1-0.6-1.8-0.7l-0.6-1.7h-2l-0.6 1.7c-0.6 0.2-1.2 0.4-1.7 0.7l-1.6-0.8-1.5 1.5 0.8 1.6c-0.3 0.5-0.5 1.1-0.7 1.7l-1.7 0.6v2l1.7 0.6c0.2 0.6 0.4 1.2 0.7 1.8l-0.8 1.6 1.4 1.4 1.6-0.8c0.5 0.3 1.1 0.6 1.8 0.7l0.6 1.7h2l0.6-1.7c0.6-0.2 1.2-0.4 1.8-0.7l1.6 0.8 1.4-1.4-0.8-1.6c0.3-0.5 0.6-1.1 0.7-1.8l1.7-0.6zM8 12c-2.2 0-4-1.8-4-4s1.8-4 4-4 4 1.8 4 4-1.8 4-4 4z"></path>
+<path fill="#71caf2" d="M10.6 7.9c0 1.381-1.119 2.5-2.5 2.5s-2.5-1.119-2.5-2.5c0-1.381 1.119-2.5 2.5-2.5s2.5 1.119 2.5 2.5z"></path>
 </svg>
diff --git a/src/components/fileBrowser.jsx b/src/components/fileBrowser.jsx
index 7d26078..d62dba9 100644
--- a/src/components/fileBrowser.jsx
+++ b/src/components/fileBrowser.jsx
@@ -57,6 +57,8 @@ const FBContainer = styled.div`
   width: 100%;
   height: inherit;
   position: relative;
+  border-radius: .3rem;
+  box-shadow: ${({active}) => active ? "0 0 6px -3px var(--tertiary-color)" : ""};
 `
 
 // bunch of styled components
@@ -67,7 +69,7 @@ const BrowserWrapper = styled.div`
   overflow-y: scroll;
   position: relative;
   background: var(--box-radial-gradient);
-  border-radius: 0 0 .3em .3em;
+  border-radius: 0 0 .3rem .3rem;
   user-select: none;
 
   &::-webkit-scrollbar {
@@ -112,6 +114,7 @@ const BrowserHeaderDiv = styled.div`
   display: flex;
   align-items: center;
   gap: 0 .25rem;
+  padding-left: .5rem;
 
   @media only screen and (max-width: 800px) {
     &:nth-child(1) {
@@ -169,11 +172,6 @@ const SearchLabel = styled(Label)`
 
 const BrowseImage = styled.img`
   cursor: pointer;
-
-  @media screen and (max-width: 800px) {
-    width: 30px;
-    height: 30px;
-  }
 `
 const SearchInput = styled(Input)`
   width: 15rem;
@@ -571,7 +569,7 @@ class FileBrowser extends Component {
     const rows = Math.max(this.props.files.length, files.length)
 
     return (
-      <FBContainer>
+      <FBContainer active={this.props.active} onClick={this.props.setActive}>
         {
           this.renderMenu()
         }
@@ -583,8 +581,8 @@ class FileBrowser extends Component {
         }
         <BrowserHeader>
           <BrowserHeaderDiv>
-            <BrowseImage src={Back} alt="up directory" width="35" height="35" onClick={this.previousDirectory} />
-            <BrowseImage src={Home} alt="root directory" width="35" height="35" onClick={this.rootDirectory} />
+            <BrowseImage src={Back} alt="up directory" width="25" height="25" onClick={this.previousDirectory} />
+            <BrowseImage src={Home} alt="root directory" width="25" height="25" onClick={this.rootDirectory} />
             <p> { this.props.currentPath !== "/" ? this.renderPath() : "/" } </p>
           </BrowserHeaderDiv>
           <BrowserHeaderDiv>
@@ -600,11 +598,11 @@ class FileBrowser extends Component {
               {
                 orderBy === "name" &&
                 <img src={CaretDown} alt={orderAscending ? "ascending" : "descending"}
-                height="20" width="20"
+                height="12" width="12"
                 style={{
                   transform: orderAscending ? "rotateZ(180deg)" : undefined,
                   position: "absolute",
-                  top: "2px",
+                  top: 6,
                   marginLeft: ".5rem"
                   }}
                   />
@@ -615,11 +613,11 @@ class FileBrowser extends Component {
               {
                 orderBy === "modified" &&
                 <img src={CaretDown} alt={orderAscending ? "ascending" : "descending"}
-                height="20" width="20"
+                height="12" width="12"
                 style={{
                   transform: orderAscending ? "rotateZ(180deg)" : undefined,
                   position: "absolute",
-                  top: "2px",
+                  top: 6,
                   marginLeft: ".5rem"
                   }}
                   />
@@ -630,11 +628,11 @@ class FileBrowser extends Component {
               {
                 orderBy === "size" &&
                 <img src={CaretDown} alt={orderAscending ? "ascending" : "descending"}
-                height="20" width="20"
+                height="12" width="12"
                 style={{
                   transform: orderAscending ? "rotateZ(180deg)" : undefined,
                   position: "absolute",
-                  top: "2px",
+                  top: 6,
                   marginLeft: ".5rem"
                   }}
                   />
diff --git a/src/components/fileBrowser.styled.js b/src/components/fileBrowser.styled.js
index 3f1a945..e8d72b6 100644
--- a/src/components/fileBrowser.styled.js
+++ b/src/components/fileBrowser.styled.js
@@ -1,4 +1,5 @@
 import styled from 'styled-components'
+import { Button } from '../styled'
 
 export const Input = styled.input`
   width: 100%;
@@ -24,18 +25,18 @@ export const Label = styled.label`
 
 export const FileBrowsersContainer = styled.div`
   display: flex;
-  gap: 0 1rem;
+  flex-direction: column;
+  gap: .5rem 0;
   height: calc(94vh - 9rem);
-
+  
   @media only screen and (max-width: 800px) {
     height: calc(100vh - 9rem);
   }
-`
+  `
 
 export const FileBrowserWrapper = styled.div`
   display: flex;
-  flex-direction: column;
-  gap: .5rem 0;
+  gap: 0 1rem;
   width: 100%;
   height: inherit;
 `
@@ -44,4 +45,17 @@ export const FileBrowserRemotes = styled.div`
   display: flex;
   gap: .5rem;
   justify-content: flex-start;
+`
+
+export const FileBrowserSettings = styled.div`
+  display: flex;
+  gap: .5rem;
+  flex-grow: 1;
+  justify-content: flex-end;
+`
+
+export const BrowserSettingButton = styled(Button)`
+  padding: .5rem;
+  display: flex;
+  align-items: center;
 `
\ No newline at end of file