From bb71193ea38ab7a13ea61fc5df3087a6cb040788 Mon Sep 17 00:00:00 2001
From: subnub <kyle.hoell@gmail.com>
Date: Sat, 19 Oct 2024 01:29:00 -0400
Subject: [PATCH] removed most scss files

---
 src/components/Header/Header.tsx              |    5 +-
 src/styles/base/_base.scss                    |   22 +-
 src/styles/base/_settings.scss                |   17 -
 .../components/_AddGoogleAccountPage.scss     |   39 -
 src/styles/components/_AddStorageItems.scss   |  164 ---
 src/styles/components/_AddStoragePage.scss    |   36 -
 src/styles/components/_ContentMenu.scss       |   77 --
 src/styles/components/_Dataform.scss          |   33 -
 src/styles/components/_DownloadPage.scss      |   49 -
 src/styles/components/_File.scss              |  268 ----
 src/styles/components/_Filter.scss            |   65 -
 src/styles/components/_Folder-tree.scss       |  193 ---
 src/styles/components/_Folder.scss            |   91 --
 src/styles/components/_Header.scss            |  513 -------
 src/styles/components/_HomePage.scss          |  108 --
 src/styles/components/_LeftSection.scss       |  554 --------
 src/styles/components/_LoginPage.scss         |  915 -------------
 src/styles/components/_MobileContextMenu.scss |   54 -
 src/styles/components/_MoverMenu.scss         |  161 ---
 src/styles/components/_Photoviewer.scss       |   39 -
 src/styles/components/_Popup-window.scss      |  230 ----
 src/styles/components/_QuickAccess.scss       |  108 --
 src/styles/components/_ResetPasswordPage.scss |   51 -
 src/styles/components/_RightSection.scss      |  144 --
 src/styles/components/_SettingsMenu.scss      |  314 -----
 src/styles/components/_Sharemenu.scss         |  174 ---
 src/styles/components/_Spacer.scss            |   25 -
 src/styles/components/_Spinner.scss           |    4 -
 src/styles/components/_Subbar.scss            |  129 --
 src/styles/components/_Swal.scss              |   21 +-
 src/styles/components/_UploadSwitcher.scss    |   21 -
 src/styles/components/_Uploader.scss          |  148 --
 src/styles/components/_VerifyEmailPage.scss   |   12 -
 src/styles/components/_box-layout.scss        |   87 --
 src/styles/components/_button.scss            |   50 -
 src/styles/components/_content-container.scss |    6 -
 src/styles/components/_loader.scss            |    3 -
 src/styles/components/body.scss               |  116 --
 src/styles/components/file_content.scss       |  701 ----------
 src/styles/components/file_panel.scss         | 1192 -----------------
 src/styles/components/main.scss               |    4 -
 src/styles/components/modals.scss             |  593 --------
 src/styles/components/settings.scss           |  486 -------
 src/styles/styles.scss                        |   35 -
 44 files changed, 32 insertions(+), 8025 deletions(-)
 delete mode 100644 src/styles/base/_settings.scss
 delete mode 100644 src/styles/components/_AddGoogleAccountPage.scss
 delete mode 100644 src/styles/components/_AddStorageItems.scss
 delete mode 100644 src/styles/components/_AddStoragePage.scss
 delete mode 100644 src/styles/components/_ContentMenu.scss
 delete mode 100644 src/styles/components/_Dataform.scss
 delete mode 100644 src/styles/components/_DownloadPage.scss
 delete mode 100644 src/styles/components/_File.scss
 delete mode 100644 src/styles/components/_Filter.scss
 delete mode 100644 src/styles/components/_Folder-tree.scss
 delete mode 100644 src/styles/components/_Folder.scss
 delete mode 100644 src/styles/components/_Header.scss
 delete mode 100644 src/styles/components/_HomePage.scss
 delete mode 100644 src/styles/components/_LeftSection.scss
 delete mode 100644 src/styles/components/_LoginPage.scss
 delete mode 100644 src/styles/components/_MobileContextMenu.scss
 delete mode 100644 src/styles/components/_MoverMenu.scss
 delete mode 100644 src/styles/components/_Photoviewer.scss
 delete mode 100644 src/styles/components/_Popup-window.scss
 delete mode 100644 src/styles/components/_QuickAccess.scss
 delete mode 100644 src/styles/components/_ResetPasswordPage.scss
 delete mode 100644 src/styles/components/_RightSection.scss
 delete mode 100644 src/styles/components/_SettingsMenu.scss
 delete mode 100644 src/styles/components/_Sharemenu.scss
 delete mode 100644 src/styles/components/_Spacer.scss
 delete mode 100644 src/styles/components/_Subbar.scss
 delete mode 100644 src/styles/components/_UploadSwitcher.scss
 delete mode 100644 src/styles/components/_Uploader.scss
 delete mode 100644 src/styles/components/_VerifyEmailPage.scss
 delete mode 100644 src/styles/components/_box-layout.scss
 delete mode 100644 src/styles/components/_button.scss
 delete mode 100644 src/styles/components/_content-container.scss
 delete mode 100644 src/styles/components/_loader.scss
 delete mode 100644 src/styles/components/body.scss
 delete mode 100644 src/styles/components/file_content.scss
 delete mode 100644 src/styles/components/file_panel.scss
 delete mode 100644 src/styles/components/main.scss
 delete mode 100644 src/styles/components/modals.scss
 delete mode 100644 src/styles/components/settings.scss

diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index cd1df62..1700e16 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -31,7 +31,10 @@ const Header = () => {
   );
 
   return (
-    <header id="header" className="select-none">
+    <header
+      id="header"
+      className="select-none border border-b fixed top-0 left-0 w-full bg-white z-10"
+    >
       <div className="px-6 flex justify-between min-h-16 items-center py-3.5">
         <div className="items-center w-[260px] hidden desktopMode:flex">
           <a
diff --git a/src/styles/base/_base.scss b/src/styles/base/_base.scss
index 0df8531..c153bed 100644
--- a/src/styles/base/_base.scss
+++ b/src/styles/base/_base.scss
@@ -3,8 +3,6 @@
 }
 
 html {
-  // font-size: 62.5%;
-  // --webkit-touch-callout: default;
 }
 
 input[type="text"],
@@ -15,11 +13,6 @@ textarea {
 }
 
 body {
-  // color: $dark-grey;
-  // font-family: Helvetica, Arial, sans-serif;
-  // font-size: $m-size;
-  // background-color: white;
-  // line-height: 1.6;
   height: 100vh;
   width: 100vw;
   overflow: hidden;
@@ -32,3 +25,18 @@ button {
 button:disabled {
   cursor: default;
 }
+body,
+html {
+  margin: 0px;
+  padding: 0px;
+  & input[type="text"],
+  & input[type="submit"] {
+    outline: none;
+  }
+}
+body {
+  & * {
+    box-sizing: border-box;
+    font-family: "Roboto", sans-serif;
+  }
+}
diff --git a/src/styles/base/_settings.scss b/src/styles/base/_settings.scss
deleted file mode 100644
index 8ed2469..0000000
--- a/src/styles/base/_settings.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-// Sizes 
-
-$s-size: 1.2rem;
-$m-size: 1.6rem;
-$l-size: 3.2rem;
-$xl-size: 4.8rem;
-$dark-grey: #333333;
-$blue: #1c88bf;
-$dark-blue: #364051;
-$off-white: #f7f7f7;
-$grey: #666;
-$desktop-breakpoint: 45rem;
-$teal: #00bfa5;
-$small-border: 2px;
-
-// font sizees
-$font-size-large: 1.8rem;
diff --git a/src/styles/components/_AddGoogleAccountPage.scss b/src/styles/components/_AddGoogleAccountPage.scss
deleted file mode 100644
index 1504745..0000000
--- a/src/styles/components/_AddGoogleAccountPage.scss
+++ /dev/null
@@ -1,39 +0,0 @@
-.google-account-page__wrapper {
-    width: 100vw;
-    height: 100vh;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-}
-
-.google-account-page__box {
-    background: rgba(255,255,255,.85);
-    border-radius: 3px;
-    text-align: center;
-    width: 35rem;
-    padding: 3.2rem 1.6rem 1.2rem 1.6rem;
-    border: .5px;
-    border-style: groove;
-    display: flex;
-    flex-direction: column;
-}
-
-.google-account-page__button {
-    cursor: pointer;
-    color: #fff;
-    background: #3c85ed;
-    font-size: 1.8rem;
-    padding: 1.2rem;
-    border: none;
-    display: inline-block;
-    text-decoration: none;
-    line-height: 1;
-    border-radius: 2px;
-}
-
-.google-account-page__title {
-    font-size: 19px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
\ No newline at end of file
diff --git a/src/styles/components/_AddStorageItems.scss b/src/styles/components/_AddStorageItems.scss
deleted file mode 100644
index 172b552..0000000
--- a/src/styles/components/_AddStorageItems.scss
+++ /dev/null
@@ -1,164 +0,0 @@
-.storage-item__wrapper {
-    height: 436px;
-    width: 332px;
-    min-width: 332px;
-    // background: green;
-    margin-right: 10px;
-    margin-left: 10px;
-    border: 1px solid #dadce0;
-    border-radius: 10px;
-    
-}
-
-.storage-item__title-wrapper {
-    border-bottom: 1px solid black;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-}
-
-.storage-item__title {
-    font-weight: 600;
-    font-size: 22px;
-    margin: 13px;
-}
-
-.storage-item__image__wrapper {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    margin-top: 27px;
-}
-
-.storage-item__image {
-
-    width: 152px;
-}
-
-.storage-item__storage-title__wrapper {
-
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    margin-top: -15px;
-}
-
-.storage-item__storage-title {
-
-    font-size: 19px;
-    font-weight: 500;
-}
-
-.storage-item__button-wrapper {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    margin-top: 36px;
-}
-
-.storage-item__button {
-    color: #fff;
-    font-size: unset;
-    padding: 13px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background-color: #3c85ee;
-    text-decoration: none;
-    border-radius: 5px;
-    margin-bottom: 6px;
-    border: none;
-}
-
-.add-storage-card__wrapper {
-    width: 632px;
-    height: 400px;
-    // background: red;
-    position: relative;
-    box-shadow: 0 11px 8px 0 rgba(0,0,0,.2);
-    border: 2px solid #dadce0;
-    border-radius: 6px;
-}
-
-.add-storage-card__title-wrapper {
-    display: flex;
-    justify-content: center;
-    align-items: center
-}
-
-.add-storage-card__title {
-    font-size: 27px;
-}
-
-.add-storage-card__number-wrapper {
-    display: flex;
-    flex-direction: row;
-    justify-content: center;
-    align-items: center;
-    margin-top: 42px;
-}
-
-.add-storage-card__number {
-    border: 1px solid #cacccd;
-    border-radius: 2px;
-    height: 43px;
-    font-size: 1.8rem;
-    font-weight: 300;
-    padding: 1.2rem;
-    margin: 0 0 1.2rem 0;
-    width: 383px;
-}
-
-.add-storage-card__expiry-wrapper {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-}
-
-.add-storage-card__expiry {
-
-    border: 1px solid #cacccd;
-    border-radius: 2px;
-    height: 43px;
-    font-size: 1.8rem;
-    font-weight: 300;
-    padding: 1.2rem;
-    width: 223px;
-    /* margin: 0 0 1.2rem 0; */
-    /* margin-left: 10px; */
-    margin-right: 10px;
-}
-
-.add-storage-card__cvc {
-
-    border: 1px solid #cacccd;
-    border-radius: 2px;
-    height: 43px;
-    font-size: 1.8rem;
-    font-weight: 300;
-    padding: 1.2rem;
-    width: 70px;
-    /* margin: 0 0 1.2rem 0; */
-    margin-left: 10px;
-    margin-right: 10px;
-}
-
-.add-storage-card__button-wrapper {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    margin-top: 98px;
-}
-
-.add-storage-card__close-wrapper {
-    position: absolute;
-    right: 0;
-}
-
-.add-storage-card__close {
-    width: 39px;
-    cursor: pointer;
-}
\ No newline at end of file
diff --git a/src/styles/components/_AddStoragePage.scss b/src/styles/components/_AddStoragePage.scss
deleted file mode 100644
index 5de6a42..0000000
--- a/src/styles/components/_AddStoragePage.scss
+++ /dev/null
@@ -1,36 +0,0 @@
-.add-storage__wrapper {
-    height: 100vh;
-    width: 100vw;
-    // background: blue;
-    display: flex;
-    flex-direction: row;
-    justify-content: center;
-    align-items: center;
-}
-
-.add-storage__box {
-
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-}
-
-.add-storage__body {
-    width: 70vw;
-    height: 60vh;
-    // background: red;
-    display: flex;
-    flex-direction: row;
-    // justify-content: center;
-    align-items: center;
-    overflow-x: scroll;
-    -webkit-box-shadow: 0 11px 8px 0 rgba(0,0,0,.2);
-    box-shadow: 0 11px 8px 0 rgba(0,0,0,.2);
-    border: 2px solid #dadce0;
-    border-radius: 10px;
-}
-
-.add-storage__title {
-    font-size: 32px;
-    margin: 0;
-}
\ No newline at end of file
diff --git a/src/styles/components/_ContentMenu.scss b/src/styles/components/_ContentMenu.scss
deleted file mode 100644
index f37a412..0000000
--- a/src/styles/components/_ContentMenu.scss
+++ /dev/null
@@ -1,77 +0,0 @@
-.context-menu {
-    background: white;
-    position: absolute;
-    width: 230px;
-
-    z-index: 1;
-    box-shadow: 0 1px 2px 0 rgba(60,64,67,0.302), 0 1px 3px 1px rgba(60,64,67,0.149);
-    border: 1px solid #dadce0;
-    border-radius: 10px;
-    overflow: hidden;
-    height: fit-content;
-
-    @media (max-width: $desktop-breakpoint) {
-        
-        position: fixed;
-        width: 99%;
-        border-bottom-left-radius: 0;
-        border-bottom-right-radius: 0;
-        -webkit-touch-callout: none;
-        -webkit-user-select: none;
-        -khtml-user-select: none;
-        -moz-user-select: none;
-        -ms-user-select: none;
-        user-select: none;
-        -webkit-tap-highlight-color: transparent;
-    }
-}
-
-.context__item {
-    display: flex;
-    height: 41px;
-
-    @media (max-width: $desktop-breakpoint) {
-        
-        height: 55px;
-    }
-}
-
-.context__item:hover {
-    background: lightgrey;
-
-
-    @media (max-width: $desktop-breakpoint) {
-        
-        background: white;
-    }
-   
-}
-
-.context__item:active {
-
-    background: lightgrey;
-}
-
-.context__item__image {
-    width: 30px;
-    /* height: 43px; */
-    opacity: 0.7;
-    margin-left: 7px;
-
-    @media (max-width: $desktop-breakpoint) {
-        
-        width: 40px;
-    }
-}
-
-.context__item__title {
-    color: black;
-    margin-left: 7px;
-    font-weight: 300;
-    font-size: 13px;
-
-    @media (max-width: $desktop-breakpoint) {
-        
-        font-size: 15px;
-    }
-}
\ No newline at end of file
diff --git a/src/styles/components/_Dataform.scss b/src/styles/components/_Dataform.scss
deleted file mode 100644
index 331b4e7..0000000
--- a/src/styles/components/_Dataform.scss
+++ /dev/null
@@ -1,33 +0,0 @@
-.dataform {
-    display: flex;
-    flex-wrap: wrap;
-    flex-direction: row;
-    justify-content: start;
-}
-
-.dataform__item {
-    flex-basis: 100px;
-    flex-grow: 1;
-}
-
-.dataform__no-files {
-    text-align: center;
-    font-weight: 300;
-}
-
-.dataform__spinner__wrapper {
-    margin-top: 10px;
-    width: 61vw;
-    height: 65vh;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.dataform-loadmore-files {
-    width: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    margin-top: 17px;
-}
\ No newline at end of file
diff --git a/src/styles/components/_DownloadPage.scss b/src/styles/components/_DownloadPage.scss
deleted file mode 100644
index ab90849..0000000
--- a/src/styles/components/_DownloadPage.scss
+++ /dev/null
@@ -1,49 +0,0 @@
-.downloadpage {
-    width: 100vw;
-    height: 100vh;
-}
-
-.downloadpage__box {
-
-    display: flex;
-    flex-direction: column;
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    margin: auto;
-    justify-content: center;
-    width: 345px;
-    align-items: center;
-    height: 289px;
-    padding: 3.2rem 1.6rem 1.2rem 1.6rem;
-    border: 0.5px;
-    border-style: groove;
-    /* position: relative; */
-    border-radius: 7px;
-}
-
-.downloadpage__box__button {
-    color: red;
-}
-
-.downloadpage__box__title {
-    color: black;
-    font-size: 19px;
-    margin-top: -18px;
-    font-weight: 300;
-    max-width: 94%;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    text-align: center;
-}
-
-.downloadpage__box__subtitle {
-    color: black;
-    font-weight: 200;
-    font-size: 12px;
-    max-width: 94%;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
\ No newline at end of file
diff --git a/src/styles/components/_File.scss b/src/styles/components/_File.scss
deleted file mode 100644
index 9202363..0000000
--- a/src/styles/components/_File.scss
+++ /dev/null
@@ -1,268 +0,0 @@
-.file__item {
-    flex-grow: 1;
-    display: flex;
-    flex-direction: column;
-    border: 1px solid #dadce0;
-    align-items: center;
-    justify-content: initial;
-    border-radius: 10px;
-    flex-basis: 23%;
-    max-width: 23%;
-    margin: 5px;
-    cursor: pointer;
-    height: 171px;
-
-    // overflow: hidden;
-    position: relative;
-
-    // -webkit-touch-callout: none;
-    // -webkit-user-select: none;
-    // -khtml-user-select: none;
-    // -moz-user-select: none;
-    // -ms-user-select: none;
-    // user-select: none;
-    -webkit-tap-highlight-color: transparent;
-
-    @media (max-width: $desktop-breakpoint) {
-        flex-basis: 28%;
-        max-width: 30.2%;
-        position: unset;
-        //-webkit-touch-callout: default;
-    }
-}
-
-.file__item--selected {
-    background:#e8f0fe;
-}
-
-.file__title {
-    color: #373737;
-    margin-top: 25px;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-    width: 90%;
-    max-width: 23vw;
-    text-align: center;
-    font-weight: 300;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    // text-transform: capitalize;
-}
-
-.file__title--gone {
-
-    display: none;
-}
-
-.file__title--selected {
-    color: #1967d2;
-}
-
-.file__image__wrapper {
- 
-    width: 100px;
-    height: 100px;
-    position: relative;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    overflow: hidden;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-   -webkit-tap-highlight-color: transparent;
-    pointer-events: none;
-}
-
-.file__image {
-    width: 100px;
-    opacity: 0.7;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    pointer-events: none;
-}
-
-.file__item__wrapper {
-    flex-grow: 1;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: initial;
-    // -webkit-touch-callout: none;
-    // -webkit-user-select: none;
-    // -khtml-user-select: none;
-    // -moz-user-select: none;
-    // -ms-user-select: none;
-    // user-select: none;
-   // -webkit-tap-highlight-color: transparent;
-    width: 100%;
-    height: 100%;
-    cursor: pointer;
-}
-
-.file__item__listview {
-
-    flex-grow: 1;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-    border-radius: 10px;
-    flex-basis: 98%;
-    min-width: 98%;
-    max-width: 98%;
-    max-width: 99%;
-    width: 100%;
-    margin: 5px;
-    cursor: pointer;
-    height: 50px;
-    position: relative;
-    
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    -webkit-tap-highlight-color: transparent;
-
-    @media (max-width: $desktop-breakpoint) {
-        position: unset;
-        overflow: hidden;
-    }
-
-}
-
-.file__item__listview--smaller-max-width {
-    max-width: 98%;
-}
-
-.file__image__listview {
-    width: 31px;
-    opacity: 0.7;  
-    min-width: 31px;
-}
-
-.file__image__listview--mover {
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 38px;
-        min-width: 38px;
-    }
-}
-
-.file__image__listview--no-opacity {
-    width: 31px;
-    opacity: 1;
-    /* min-width: 30px; */
-    /* max-width: 30px; */
-    height: 33px;
-    /* max-height: 30px; */
-    border-radius: 5px;
-    width: 31px;
-    opacity: 1;
-    max-width: 31px;
-    height: 33px;
-    max-height: 33px;
-    border-radius: 5px;
-}
-
-.file__image--no-opacity {
-    width: 87%;
-    max-height: 100%;
-    object-fit: cover;
-    opacity: 1;
-    max-width: 100%;
-    margin-top: 8px;
-    padding: -1px;
-    border-radius: 11px;
-    margin-left: 6.5%;
-}
-
-.file__title__listview {
-    color: #373737;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-    max-width: 18%;
-    width: 18%;
-    min-width: 18%;
-    text-align: center;
-    font-weight: 300;
-    margin-right: 15px;
-    text-align: left;
-}
-
-.file__title__listview--no-margin {
-    margin-right: none
-}
-
-.file__title__listview--no-max {
-    max-width: none;
-    width: unset;
-    padding-left: 7px;
-}
-
-.file__title__listview--mover {
-    
-    @media (max-width: $desktop-breakpoint) {
-        font-size: 18px;
-    }
-}
-
-.file__item__listview__title__wrapper {
-    display: flex;
-    flex-direction: row;
-    margin-left: 15px;
-    max-width: 30%;
-    min-width: 30%;
-    width: 30%;
-    align-items: center;
-}
-
-.file__item__listview__title__wrapper--folder {
-    display: flex;
-    flex-direction: row;
-    margin-left: 15px;
-    max-width: 50%;
-    min-width: 30%;
-    width: 50%;
-    align-items: center;
-}
-
-.file__item__listview__title__wrapper--mover {
-
-    max-width: 63%;
-    width: 63%;
-}
-
-.file__item__tag {
-
-    width: 49px;
-    height: 25px;
-    background: lightblue;
-    position: absolute;
-    top: 60px;
-    left: 9px;
-    border-radius: 5px;
-}
-
-.file__item__tag__title {
-    font-size: 10px;
-}
-
-.file__item-no-thumbnail {
-    object-fit: unset !important;
-}
\ No newline at end of file
diff --git a/src/styles/components/_Filter.scss b/src/styles/components/_Filter.scss
deleted file mode 100644
index 5a7b22f..0000000
--- a/src/styles/components/_Filter.scss
+++ /dev/null
@@ -1,65 +0,0 @@
-.filter {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    height: 52px;
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 100vw;
-    }
-}
-
-.filter__folder-wrapper {
-    background: white;
-}
-
-.filter__folder-title {
-    color: #5f6368;
-    margin-left: 22px;
-    font-weight: 500;
-    font-size: 13px;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-}
-.filter__folder-title-wrapper {
-    margin-left: 15px;
-}
-
-.filters__wrapper {
-    margin-right: 6%;
-    display: flex;
-    flex-direction: row;
-}
-
-.filter__select-wrapper {
-    margin-right: 7px;
-    display: flex;
-    flex-direction: row;
-}
-
-.filter__select-image {
-    margin-top: 5px;
-    width: 18px;
-    opacity: 0.7;
-}
-
-.filter__select {
-    background: none;
-    border: none;
-    -moz-appearance: none;
-    -webkit-appearance: none;
-    color: #5f6368;
-    font-size: 13px;
-    outline: none;
-    font-weight: 500;
-    padding-left: 3px;
-    padding-right: 4px;
-}
-
-.filter__select:hover {
-    background: lightgrey
-}
\ No newline at end of file
diff --git a/src/styles/components/_Folder-tree.scss b/src/styles/components/_Folder-tree.scss
deleted file mode 100644
index 209591e..0000000
--- a/src/styles/components/_Folder-tree.scss
+++ /dev/null
@@ -1,193 +0,0 @@
-.folder-tree__main {
-    height: 327px;
-    width: 100%;
-    margin-top: 4px;
-    // background: #000;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.folder-tree__wrapper {
-    display: flex;
-    flex-direction: column;
-}
-
-.folder-tree__box {
-    width: 95%;
-    height: 85%;
-    overflow: scroll;
-    // -ms-overflow-style: none;  /* IE and Edge */
-    // scrollbar-width: none;
-    // &::-webkit-scrollbar {
-    //     display: none;
-    //     width: 0px;
-    //     background: transparent
-    // }
-    // border: 1px solid #dadce0;
-    // border-radius: 10px;
-}
-
-.folder-tree__box-hide-scroll-bars {
-
-    width: 95%;
-    height: 85%;
-    overflow: scroll;
-
-    -ms-overflow-style: none;  /* IE and Edge */
-    scrollbar-width: none;
-    &::-webkit-scrollbar {
-        display: none;
-        width: 0px;
-        background: transparent
-    }
-
-}
-
-.folder-tree__storage {
-    // width: 100%;
-    // height: 55px;
-    // background: blue;
-    margin-top: 10px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-direction: column;
-}
-
-.folder-tree-sub__storage {
-    // background: blue;
-    margin-top: 1px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-direction: column;
-}
-
-.folder-tree__storage__box {
-    width: 179px;
-    // background: green;
-    display: flex;
-    flex-direction: row;
-    justify-content: flex-start;
-    margin-left: 46px;
-}
-
-.folder-tree-sub__storage__box {
-    width: 179px;
-    // background: green;
-    display: flex;
-    flex-direction: row;
-    justify-content: flex-start;
-}
-
-.folder-tree__storage__image-div {
-    display: flex;
-    align-items: center;
-}
-
-.folder-tree-sub__storage__image-div {
-    display: flex;
-    align-items: center;
-    margin-left: 30px;
-}
-
-.folder-tree__storage__image {
-
-    margin-right: 1px;
-    height: 31px;
-
-    @media (max-width: $desktop-breakpoint) {
-        margin-right: -2px;
-        height: 54px;
-    }
-}
-
-.folder-tree-sub__storage__image {
-
-    margin-right: 1px;
-    // height: 21px;
-    width: 6px;
-    height: 10px;
-
-    @media (max-width: $desktop-breakpoint) {
-        margin-right: 1px;
-        width: 11px;
-        height: unset;
-    }
-}
-
-.folder-tree__storage__text {
-    color: #2e2e38;
-    font-size: 16px;
-    font-weight: 400;
-
-    @media (max-width: $desktop-breakpoint) {
-        font-size: 22px;
-    }
-}
-
-.folder-tree__storage__text-div {
-    display: flex;
-    align-items: center;
-}
-
-.folder-tree-sub__storage__text {
-    font-size: 16px;
-    white-space: nowrap;
-    max-width: 117px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    margin: 4px;
-    user-select: none;
-    cursor: pointer;
-    color: #2e2e38;
-    font-weight: 400;
-
-    @media (max-width: $desktop-breakpoint) {
-        font-size: 20px;
-    }
-}
-
-.folder-tree-sub__storage__text-div {
-    display: flex;
-    align-items: center;
-}
-
-.folder-tree__storage-subview {
-    // height: 151px;
-    width: 100%;
-    // background: purple;
-}
-
-.folder-tree-sub__storage-subview {
-    // height: 151px;
-    width: 100%;
-    // background: purple;
-}
-
-.folder-tree__storage-subview-box {
-    margin-left: 25px;
-}
-
-.folder-tree-sub__storage-subview-box {
-    margin-left: 25px;
-}
-
-.folder-tree-sub__icon-wrapper {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.folder-tree-sub__icon {
-    width: 19px;
-    margin-left: 9px;
-    margin-right: 3px;
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 26px;
-        margin-left: 14px;
-        margin-right: 5px;
-    }
-}
\ No newline at end of file
diff --git a/src/styles/components/_Folder.scss b/src/styles/components/_Folder.scss
deleted file mode 100644
index dc58011..0000000
--- a/src/styles/components/_Folder.scss
+++ /dev/null
@@ -1,91 +0,0 @@
-.folder__image {
-    width: 30px;
-    height: 30px;
-    margin-left: 10px;
-    opacity: 0.7;
-
-    @media (max-width: $desktop-breakpoint) {
-        // flex-basis: 29%;
-        max-width: 31%;
-    }
-    
-}
-
-.folder__title {
-    color: #373737;
-    margin-right: 2px;
-    margin-top: 25px;
-    margin-left: 4px;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-    width: 77%;
-    max-width: 50vw;
-    font-weight: 300;
-    text-transform: capitalize;
-}
-
-.folder__title--selected {
-    color: #1967d2;
-}
-
-.folder__item {
-
-    flex-grow: 1;
-    display: flex;
-    flex-direction: row;
-    /* border: 1px solid #dadce0; */
-    align-items: center;
-    justify-content: initial;
-    /* border-radius: 10px; */
-    /* flex-basis: 23%; */
-    /* max-width: 23%; */
-    height: 100%;
-    width: 100%;
-    /* margin: 5px; */
-    /* height: 50px; */
-    cursor: pointer;
-    /* position: relative; */
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    -webkit-tap-highlight-color: transparent;
-  
-}
-
-.folder__item__wrapper {
-
-    flex-grow: 1;
-    display: flex;
-    flex-direction: row;
-    border: 1px solid #dadce0;
-    align-items: center;
-    justify-content: initial;
-    border-radius: 10px;
-    flex-basis: 23%;
-    max-width: 23%;
-    margin: 5px;
-    height: 50px;
-    cursor: pointer;
-    position: relative;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    -webkit-tap-highlight-color: transparent;
-
-    @media (max-width: $desktop-breakpoint) {
-        flex-basis: 46%;
-        max-width: 47%;
-        position: unset;
-    }
-}
-
-.folder__item--selected {
-    background:#e8f0fe;
-}
\ No newline at end of file
diff --git a/src/styles/components/_Header.scss b/src/styles/components/_Header.scss
deleted file mode 100644
index b894fb7..0000000
--- a/src/styles/components/_Header.scss
+++ /dev/null
@@ -1,513 +0,0 @@
-
-header{
-	border-bottom:1px solid #E8EEF2;
-	position: fixed;
-	top:0px;
-	left:0px;
-	width:100%;
-	background-color:#fff;
-	z-index:4;
-	& .container{
-		padding-left:25px;
-		padding-right:25px;
-		margin-left:auto;
-		margin-right:auto;
-		width:100%;
-		& .outer__header{
-			display: flex;
-			justify-content: space-between;
-			min-height:68px;
-			align-items:center;
-			padding:15px 0px;
-			& .left__header{
-				display: flex;
-				align-items:center;
-				width:100%;
-				& .search__wrapper{
-					width:100%;
-					max-width:700px;
-					position: relative;
-					display: flex;
-					align-items:center;
-                    justify-content:center;
-                    flex-direction: column;
-					&>a{
-						& img{
-							transition:.05s ease all;
-						}
-					}
-					& .search__files--dropdown{
-						position: absolute;
-						left:0px;
-						background: #FFFFFF;
-						box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15), inset 0px 1px 0px #F5F7FA;
-						border-radius: 4px;
-						width:100%;
-						top:42px;
-						& .elem__search--files{
-							& a{
-								display:flex;
-								padding:15px;
-								text-decoration:none;
-								color: #637381;
-								font-size:16px;
-								line-height:19px;
-								transition:.4s ease all;
-								&:hover{
-									background: #F6F5FD;
-								}
-								&>span{
-									display: inline-block;
-									margin:0px 5px;
-									height: 18px;
-									&.file__name{
-										color:#212B36;
-										font-size:16px;
-										line-height:19px;
-										font-weight:bold;
-										overflow: hidden;
-										max-width: 22vw;
-										white-space: nowrap;
-										text-overflow: ellipsis;
-									}
-									&.root__parent , &.current__folder{
-										color: #212b36;
-										font-size: 16px;
-										line-height: 19px;
-										overflow: hidden;
-										max-width: 22vw;
-										text-overflow: ellipsis;
-										white-space: nowrap;
-										font-weight: 400;
-									}
-								}
-								& .spacer{
-									display: inline-block;
-									margin:0px 5px;
-								}
-							}
-						}
-					}
-					&>a{
-						position: absolute;
-						left:15px;
-						transition:.4s ease all;
-						&:hover{
-							opacity:.7;
-						}
-					}
-					&>input{
-						width:100%;
-						min-height:42px;
-						border:1px solid #BEC9D3;
-						padding-left:45px;
-						padding-right:15px;
-						font-size:16px;
-						color:#000;
-						border-radius:5px;
-						&:focus{
-							border-color:#3c85ee;
-						}
-					}
-				}
-				& .logo__wrapper{
-					margin-right:40px;
-					&>a{
-						display: inline-flex;
-						align-items:center;
-						justify-content:center;
-						transition:.4s ease all;
-						&:hover{
-							opacity:.7;
-						}
-					}
-				}
-			}
-			& .right__header{
-				padding-left:100px;
-				& .profile__info{
-					display: flex;
-					align-items:center;
-					& .settings__button{
-						display: inline-flex;
-						align-items:center;
-						& a{
-							display: inline-flex;
-							transition:.4s ease all;
-							&:hover{
-								opacity:.7;
-							}
-						}
-					}
-				}
-
-				& .profile__wrapper{
-					margin-left:25px;
-					& .profile__button{
-						&>a{
-							min-width:36px;
-							min-height:36px;
-							border-radius:250px;
-							display: inline-flex;
-							align-items:center;
-							justify-content:center;
-							transition:.4s ease all;
-							text-decoration: none;
-							&:hover{
-								opacity:.7;
-							}
-						}
-					}
-				}
-			}
-		}
-	}
-}
-
-@media (max-width:1200px){
-	header{
-		& .container {
-			& .outer__header {
-				& .left__header {
-					& .search__wrapper{
-						max-width:550px;
-					}
-				}
-			}
-		}
-	}
-}
-@media (max-width:991px){
-	header{
-		& .container {
-			& .outer__header {
-				position: relative;
-				& .left__header {
-					display: flex;
-					flex-direction:column;
-					justify-content:center;
-					align-items:center;
-					& .logo__wrapper{
-						margin-bottom:5px;
-						margin-right: auto;
-						& a{
-							& img{
-								max-width:180px;
-							}
-						}
-					}
-					& .search__wrapper{
-						max-width:100%;
-					}
-				}
-				& .right__header{
-					position: absolute;
-					padding-left:0px;
-					right:0px;
-					top:12px;
-				}
-			}
-		}
-	}
-}
-@media (max-width:480px){
-	header{
-		& .container{
-			padding-left:15px;
-			padding-right:15px;
-			& .outer__header{
-				& .left__header{
-					min-height:40px;
-					& .search__wrapper{
-						& .search__files--dropdown{
-							& .elem__search--files{
-								& a{
-									&>span.file__name{
-										font-size:14px;
-									}
-									&>span.root__parent{
-										font-size:14px;
-									}
-									&>span.current__folder{
-										font-size:14px;
-									}
-									font-size:14px;
-									padding:12px;
-									flex-wrap:wrap;
-								}
-							}
-						}
-					}
-					& .logo__wrapper{
-						margin-bottom:10px;
-						& a{
-							& img{
-								max-width:140px;
-							}
-						}
-					}
-				}
-				& .right__header{
-					& .profile__info{
-						& .profile__wrapper{
-							margin-left:15px;
-							& .profile__button{
-								& a{
-									min-width:30px;
-									min-height:30px;
-									& span{
-										font-size: 13px;
-									}
-								}
-							}
-						}
-					}
-				}
-			}
-		}
-	}
-}
-
-
-
-
-
-.header__icon {
-	width: 161px;
-}
-
-
-
-
-
-// .header {
-//     text-align: center;
-//     // height: 11vh;
-//     display: flex;
-//     flex-direction: row;
-//     border-bottom: 1px solid #dadce0;
-//     justify-content: space-between;
-//     /* display: none; */
-//     position: fixed;
-//     /* top: 0; */
-//     width: 100%;
-//     z-index: 1;
-
-//     @media (max-width: $desktop-breakpoint) {
-//         text-align: center;
-//         display: flex;
-//         flex-direction: row;
-//         border-bottom: 1px solid #dadce0;
-//         justify-content: space-between;
-//         position: fixed;
-//         background: white;
-//         top: 0;
-//         left: 0;
-//         right: 0;
-//         width: 100%;
-//         height: 80px;
-//         padding: 0;
-//         z-index: 2;
-//         // background: blue;
-//     }
-// }
-
-// .header__title {
-//     color: white;
-//     text-decoration: none;
-//     h1 {
-//         margin: 0;
-//     }
-// }
-
-// .header__image {
-//     width: 100px;
-//     height: 30px;
-//     margin: 20px 0 15px 20px;
-//     cursor: pointer;
-//     user-select: none;
-
-//     @media (max-width: $desktop-breakpoint) {
-//         width: 73px;
-//         height: 24px;
-//         margin: 25px 0 15px 14px;
-//         display: none;
-//     }
-    
-// }
-
-// .header__form {
-//     width: 55%;
-//     margin-left: -179px;
-//     position: relative;
-
-//     @media (max-width: $desktop-breakpoint) {
-//         width: 67%;
-//         margin-top: 5px;
-//         margin-left: 8px;
-//         position: unset;
-//     }
-// }
-
-
-// .header__content {
-//     display: flex;
-//     justify-content: space-between;
-//     align-items: center;
-//     padding: $s-size 0;
-// }
-
-// .header__setting {
-//     width: 30px;
-//     height: 30px;
-//     /* position: fixed; */
-//     /* right: 15px; */
-//     /* top: 0px; */
-//     margin: 20px 20px 20px 0;
-//     cursor: pointer;
-
-//     @media (max-width: $desktop-breakpoint) {
-//         margin: 25px 20px 20px 10px;
-//     }
-
-    
-// }
-
-// .header__input {
-//     border: 1px solid #f1f3f4;
-//     height: 50px;
-//     font-size: 1.8rem;
-//     font-weight: 300;
-//     padding: 1.2rem;
-//     margin: 10px 0 10px 0;
-//     /* margin-left: 130px; */
-//     width: 100%;
-//     border-radius: 3px;
-//     background: #f1f3f4;
-
-//     @media (max-width: $desktop-breakpoint) {
-       
-//         width: 121%;
-//     }
-// }
-// .header__input:focus {
-   
-//     background: white;
-//     outline: none;
-//     border-style: groove;
-// }  
-
-// .header__input__suggested {
-//     width: 100%;
-//     max-height: 43vh;
-//     overflow: scroll;
-//     background: white;
-//     /* color: black; */
-//     margin-top: -10px;
-//     position: absolute;
-//     z-index: 3;
-//     box-shadow: 0 2px 8px 0 rgba(0,0,0,0.2);
-//     border-radius: 0 0 6px 6px;
-//     border: groove 1px #f1f3f4;
-    
-//     scrollbar-width: none; /* Firefox */
-//     -ms-overflow-style: none;  /* IE 10+ */
-//     &::-webkit-scrollbar {
-//         width: 0px;
-//         background: transparent; /* Chrome/Safari/Webkit */
-//     }
-
-//     @media (max-width: $desktop-breakpoint) {
-        
-//         width: 100vw;
-//         // margin-left: -23vw;
-//         left: 0;
-//         max-height: 50vh;
-//         overflow: scroll;
-//         background: white;
-//         margin-top: 1px;
-//         position: absolute;
-//         z-index: 3;
-//         box-shadow: 0 2px 8px 0 rgba(0,0,0,0.2);
-//         border-radius: 0 0 6px 6px;
-//         border: groove 1px #f1f3f4;
-//     }
-
-// }
-
-
-// .header__input__suggested--gone {
-//     display: none;
-// }
-
-// .header__input__suggested__item {
-//     display: flex;
-//     flex-direction: row;
-//     justify-content: space-between;
-//     align-items: center;  
-    
-
-//     @media (max-width: $desktop-breakpoint) {
-//         height: 55px;
-//     }
-// }
-
-// .header__input__suggested__item:hover {
-    
-//     background: lightgrey;
-//     border-radius: 6px;
-// }
-
-// .header__input__suggested__item__title__wrapper {
-
-//     height: inherit;
-//     color: red;
-//     /* width: 400px; */
-//     display: flex;
-//     flex-direction: row;
-// }
-
-// .header__input__suggested__item__title {
-//     color: #373737;;
-//     font-weight: 300;
-//     font-size: 18px;
-//     padding-left: 9px;
-//     font-size: small;
-//     text-overflow: ellipsis;
-//     max-width: 41vw;
-//     overflow: hidden;
-//     white-space: nowrap;
-
-//     @media (max-width: $desktop-breakpoint) {
-//         color: #373737;
-//         font-weight: 300;
-//         font-size: 18px;
-//         padding-left: 9px;
-//         font-size: medium;
-//         text-overflow: ellipsis;
-//         max-width: 41vw;
-//         overflow: hidden;
-//         white-space: nowrap;
-//     }
-    
-// }
-
-// .header__input__suggested__item__subtitle {
-//     color: #373737;;
-//     font-weight: 100;
-//     font-size: small;
-//     margin-right: 10px;
-// }
-
-// .header__input__suggested__item__image {
-//     width: 25px;
-//     margin-left: 10px;
-//     opacity: 0.7;  
-
-//     @media (max-width: $desktop-breakpoint) {
-//         width: 42px;
-//         margin-left: 10px;
-//         opacity: 0.7;
-//     }
-
-// }
\ No newline at end of file
diff --git a/src/styles/components/_HomePage.scss b/src/styles/components/_HomePage.scss
deleted file mode 100644
index 2f47244..0000000
--- a/src/styles/components/_HomePage.scss
+++ /dev/null
@@ -1,108 +0,0 @@
-.section {
-    float: left;
-    height: 100%;
-    width: 100%;
-    overflow-x: hidden;
-    overflow-y: scroll;
-    
-
-    scrollbar-width: none; /* Firefox */
-    -ms-overflow-style: none;  /* IE 10+ */
-    &::-webkit-scrollbar {
-        width: 0px;
-        height: unset;
-        background: transparent; /* Chrome/Safari/Webkit */
-    }
-
-    @media (max-width: $desktop-breakpoint) {
-     
-        overflow-y: hidden;
-    }
-
-}
-.main-container {
-    display: flex;
-    flex-direction: column;
-    width: 80vw;
-    width: fill-available;
-    // overflow-y: scroll;
-    overflow-x: hidden;
-
-    @media (max-width: $desktop-breakpoint) {
-        // margin-top: 77px;
-        display: flex;
-        flex-direction: column;
-        //overflow-x: hidden;
-        overflow: hidden;
-        width: unset;
-    }
-
-}
-
-.sub-container {
-    width: inherit;
-    // height: 83vh;
-    height: -webkit-fill-available;
-    display: inherit;
-    overflow: hidden;
-
-    @media (max-width: $desktop-breakpoint) { 
-        height: unset;
-    }
-}
-
-.outter-wrapper {
-
-    @media (max-width: $desktop-breakpoint) {
-     
-        scrollbar-width: none; /* Firefox */
-        -ms-overflow-style: none;  /* IE 10+ */
-        &::-webkit-scrollbar {
-            width: 0px;
-            height: unset;
-            background: transparent; /* Chrome/Safari/Webkit */
-        }
-    }
-}
-
-// .outter-wrapper {
-//     height: 100%;
-//     width: 100%;
-//     overflow: hidden;
-//     @media (max-width: $desktop-breakpoint) {
-//         //background: blue;
-//         position: fixed;
-//         top: 0;
-//         left: 0;
-//         right: 0;
-//         bottom: 0;
-//     }
-// }
-
-.main-page {
-    background: white;
-    height: 100vh;
-    width: 100vw;
-    display: inline-flex;
-    padding-top: 71px;
-
-    @media (max-width: $desktop-breakpoint) {
-        background: #fff;
-        /* height: 100vh; */
-        // height: calc(100% - 80px);
-        height: unset;
-        width: 100vw;
-        display: inline-flex;
-        padding: 0;
-        overflow: hidden;
-        // position: fixed;
-        // padding: 0;
-        // bottom: 0;
-        // left: 0;
-        // right: 0;
-        // margin-top: 80px;
-        //background: red;
-    }
-}
-
-
diff --git a/src/styles/components/_LeftSection.scss b/src/styles/components/_LeftSection.scss
deleted file mode 100644
index 06b641e..0000000
--- a/src/styles/components/_LeftSection.scss
+++ /dev/null
@@ -1,554 +0,0 @@
-.navigation__block{
-	& .folder__structure{
-		// padding:20px;
-		max-height: 40vh;
-		overflow-y: scroll;
-		max-width: 100%;
-		overflow-x: scroll;
-		scrollbar-width: none; /* Firefox */
-   		-ms-overflow-style: none;  /* IE 10+ */
-    	&::-webkit-scrollbar {
-			width: 0px;
-			height: unset;
-			background: transparent; /* Chrome/Safari/Webkit */
-    	}
-		&>.elem__structure{
-			cursor:pointer;
-			margin-bottom:30px;
-			& .last__structure--child{
-				& .parent__structure{
-					padding-left:2px;
-				}
-			}
-			&{
-				&>.child__structure{
-					&>.elem__structure{
-						padding-left:10px;
-						&>.parent__structure{
-							&>span{
-								padding-right:15px;
-							}
-						}
-						&>.child__structure{
-							margin-top: 5px;
-    						margin-bottom: 5px;
-							padding-left:10px;
-							&>.elem__structure{
-								padding-left:10px;
-								&>.parent__structure{
-									&>span{
-										// margin-right:15px;
-									}
-								}
-								&>.child__structure{
-									padding-left:10px;
-									margin-top: 5px;
-    								margin-bottom: 5px;
-									&>.elem__structure{
-										padding-left:10px;
-										&>.parent__structure{
-											&>span{
-												// margin-right:15px;
-											}
-										}
-									}
-								}
-							}
-						}
-					}
-				}
-			}
-			&:last-child{
-				margin-bottom:0px;
-			}
-			&>.child__structure{
-				margin-bottom:15px;
-				&:last-child{
-					margin-bottom:0px;
-				}
-			}
-			& .parent__structure{
-				&.current__folder--caret{
-					&>.info__name{
-						&>p{
-							font-weight:bold;
-							color:#3c85ee;
-							&>span{
-								&>i{
-									color:#3c85ee;
-								}
-							}
-						}
-					}
-				}
-				display: flex;
-				align-items:center;
-				margin-bottom:0px;
-				&.active__parent{
-					margin-bottom:15px;
-					&:last-child{
-						margin-bottom:0px;
-					}
-					&>span{
-						& img{
-							transform:rotate(90deg);
-						}
-					}
-				}
-				&>span{
-					padding-right:20px;
-					transition:.4s ease all;
-					& img{
-						transition:.4s ease all;
-					}
-				}
-				& .info__name{
-					&>p{
-						color:#2E2E38;
-						font-size:16px;
-						font-weight:400;
-						margin:0px;
-						transition:.4s ease color;
-						max-width: 141px;
-						overflow: hidden;
-						white-space: nowrap;
-						text-overflow: ellipsis;
-						&>span{
-							display: inline-flex;
-							margin-right:8px;
-							transition:.4s ease all;
-							&>i{
-								transition:.4s ease all;
-								font-size:15px;
-								color:#637381;
-							}
-						}
-					}
-				}
-			}
-		}
-	}
-	& .utility__buttons{
-		padding:20px;
-		border-top:1px solid #E8EEF2;
-		& ul{
-			padding:0px;
-			list-style-type: none;
-			margin:0px;
-			& li {
-				margin-bottom:25px;
-				&:last-child{
-					margin-bottom:0px;
-				}
-				& a{
-					display: inline-flex;
-					align-items:center;
-					text-decoration:none;
-					color:#2E2E38;
-					font-size:16px;
-					font-weight:400;
-					transition:.4s ease all;
-					&:hover{
-						opacity:.7;
-					}
-					& span{
-						display: inline-flex;
-						align-items:center;
-						min-width:30px;
-					}
-				}
-			}
-		}
-	}
-	& .page__navigation{
-		border-bottom:1px solid #E8EEF2;
-		padding-left:20px;
-		padding-right:20px;
-		& ul{
-			margin:0px;
-			list-style-type: none;
-			padding:0px;
-			padding-bottom:20px;
-			& li {
-				& a{
-					display: flex;
-					align-items:flex-start;
-					justify-content:flex-start;
-					color:#3c85ee;
-					font-weight:500;
-					text-decoration:none;
-					transition:.4s ease all;
-					&:hover{
-						opacity:.7;
-					}
-					& span{
-						min-width: 30px;
-					}
-				}
-			}
-		}
-	}
-	& .add__new{
-		position: relative;
-		margin-bottom:30px;
-		&>a{
-			&>span{
-				transition:.4s ease all
-			}
-		}
-		&.active__new{
-			&>a>span{
-				background: #361DAE;
-			}
-		}
-		&>.dropdown__list{
-			position: absolute;
-			bottom:0px;
-			top:100%;
-			width:100%;
-			display: none;
-			& ul{
-				padding-left:0px;
-				list-style-type: none;
-				margin:0px;
-				border-radius:5px;
-				overflow:hidden;
-				background: white;;
-				box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15), inset 0px 1px 0px #F5F7FA;
-				& li{
-					& a{
-						display: flex;
-						align-items:center;
-						background-color:#fff;
-						justify-content:flex-start;
-						padding:12px 20px;
-						transition:.4s ease all;
-						text-decoration:none;
-						border-radius:5px;
-						overflow:hidden;
-						color:#0E1C71;
-						font-size:15px;
-						line-height:18px;
-						& span{
-							display: inline-flex;
-							min-width:30px;
-						}
-						&:hover{
-							background: #F6F5FD;
-						}
-					}
-				}
-			}
-		}
-		&>a{
-			display: flex;
-			align-items:center;
-			justify-content:center;
-			background-color:#3c85ee;
-			text-decoration:none;
-			border-radius:5px;
-			transition:.4s ease all;
-			&:hover{
-				opacity:.7;
-			}
-			&>p{
-				width:100%;
-				margin:0px;
-				width:100%;
-				text-align:center;
-				color:#fff;
-				font-size:16px;
-				font-weight:500;
-			}
-			&>span{
-				min-width:50px;
-				min-height:45px;
-				border-top-right-radius:5px;
-				border-bottom-right-radius:5px;
-				display:flex;
-				align-items:center;
-				justify-content:center;
-				border-left:1px solid rgba(255,255,255,.2);
-			}
-		}
-	}
-}
-
-.file__settings{
-	padding:0px 20px;
-	& .settings__menu{
-		margin-top:30px;
-		& ul{
-			& li{
-				margin-bottom:20px;
-				&:last-child{
-					margin-bottom:0px;
-				}
-				& a{
-					color:#2E2E38;
-					font-size:15px;
-					font-weight:400;
-					text-decoration:none;
-					transition:.4s ease all;
-					&:hover{
-						opacity:.7;
-					}
-				}
-				&.active__settings{
-					& a{
-						color:#3c85ee;
-						font-weight:bold;
-						font-size:15px;
-					}
-				}
-			}
-			padding:0px;
-			list-style-type: none;
-			margin:0px;
-		}
-	}
-	& .back__button{
-		& a{
-			color:#3c85ee;
-			text-decoration:none;
-			font-weight:500;
-			transition:.4s ease all;
-			&:hover{
-				opacity:.7;
-			}
-			& span{
-				display: inline-flex;
-				margin-right:10px;
-			}
-		}
-	}
-}
-
-
-
-
-
-
-
-
-
-
-.section--left {
-    margin: 0 3px 0 0;
-    width: 20vw;
-    min-width: 20%;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    // background: green;
-    @media (max-width: $desktop-breakpoint) {
-        display: none
-    }
-}
-
-.add-button {
-    display: inline-flex;
-    flex-direction: row;
-    margin-top: 13px;
-    margin-left: 12px;
-    height: 50px;
-    width: 132px;
-    align-items: center;
-    box-shadow: 0 1px 2px 0 rgba(60,64,67,0.302), 0 1px 3px 1px rgba(60,64,67,0.149);
-    border: 1px solid transparent;
-    border-radius: 24px;
-    overflow: hidden;
-    cursor: pointer;
-    user-select: none;
-
-    @media (max-width: $desktop-breakpoint) {
-        height: 40px;
-        width: 104px;
-        margin-left: 6px;
-        margin-top: 6px;
-        min-height: 40px;
-    }
-}
-
-.add-button-2 {
-
-    display: none;
-    @media (max-width: $desktop-breakpoint) {
-        display: inline-flex;
-    }
-}
-
-.add-button__img {
-    width: 30px;
-    height: 30px;
-    margin-left: 13px;
-    margin-bottom: 3px;
-
-    @media (max-width: $desktop-breakpoint) {
-        height: unset;
-        width: 21%;
-        margin-bottom: 1px;
-    }
-}
-
-.add-button__title {
-    font-weight: 500;
-    color: #373737;
-    padding-left: 2px;
-    -moz-appearance: none;
-    -webkit-appearance: none;
-    background: none;
-    border: none;
-    font-size: 20px;
-    margin-left: 10px;
-    width: 50%;
-
-    @media (max-width: $desktop-breakpoint) {
-        padding-left: 0px;
-        font-size: 17px;
-        margin-left: 8px;
-    }
-}
-
-.add-button__title:focus {
-    outline: none;
-}
-
-.add-button__option-wrapper {
-    position: absolute;
-    background: white;
-    border: none;
-    height: 200px;
-    width: 300px;
-    max-height: 0px;
-    overflow: hidden;
-    margin-left: -3px;
-    z-index: 1;
-    transition: margin 0.3s, max-height 0.3s;
-    cursor: pointer;
-}
-
-.add-button__option-wrapper2 {
-    position: absolute;
-    background: white;
-    border: none;
-    height: 200px;
-    width: 300px;
-    max-height: 0px;
-    overflow: hidden;
-    margin-left: 6px;
-    z-index: 1;
-    transition: margin 0.3s, max-height 0.3s;
-    cursor: pointer;
-}
-
-
-.add-button__option-wrapper--show {
-
-    max-height: 185px;
-    border: 1px solid #dadce0;
-    border-radius: 10px;
-    // padding: 0 140px 132px 36px;
-    margin-top: 52px;
-    box-shadow: 0 1px 2px 0 rgba(60,64,67,0.302),0 1px 3px 1px rgba(60,64,67,0.149);
-
-    @media (max-width: $desktop-breakpoint) {
-        margin-top: 75px;
-    }
-}
-
-.add_button__option__add-folder-wrapper {
-    border-bottom: 1px solid #dadce0;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    cursor: pointer;
-}
-.add_button__option__add-folder-wrapper:hover {
-    background: lightgrey
-}
-
-.add_button__option__add-folder-wrapper--no-border {
-    border: none;
-}
-
-.add_button__option__add-folder-image {
-    width: 14%;
-    height: 10%;
-    margin-left: 14px;
-}
-
-.add_button__option__add-folder-title {
-    color: #373737;
-    padding-top: 4px;
-    padding-left: 10px;
-}
-.add_button__option__add-file-input {
-    opacity: 0.0;
-
-   /* IE 8 */
-   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-
-   /* IE 5-7 */
-   filter: alpha(opacity=0);
- 
-   /* Netscape or and older firefox browsers */
-   -moz-opacity: 0.0;
-
-   /* older Safari browsers */
-   -khtml-opacity: 0.0;
-
-   cursor: pointer;
-
-    position: absolute;
-    top: 63px;
-    left: 0;
-    bottom: 0;
-    background: red;
-    height: 32%;
-}
-
-.storage__wrapper {
-    width: inherit;
-    height: 86px;
-}
-
-.storage__title {
-    color: black;
-    font-size: 13px;
-    font-weight: 400;
-    margin-bottom: 3px;
-    margin-left: 16px;
-}
-
-.storage__subtitle {
-    font-size: 11px;
-    margin-left: 16px;
-    color: black;
-    font-weight: 300;
-    white-space: nowrap;
-    width: 85%;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    margin-top: 4px;
-}
-
-.storage__progress__wrapper {
-
-    width: 75%;
-    height: 6px;
-    margin-left: 16px;
-    background: #e0e0e0;
-}
-
-.storage__progress {
-
-    // width: 50%;
-    // height: inherit;
-    // /* color: red; */
-    // background: #3f85f0;
-}
-
-.utility__buttons_no_border {
-	border: none !important;
-}
\ No newline at end of file
diff --git a/src/styles/components/_LoginPage.scss b/src/styles/components/_LoginPage.scss
deleted file mode 100644
index 5e96984..0000000
--- a/src/styles/components/_LoginPage.scss
+++ /dev/null
@@ -1,915 +0,0 @@
-// .login {
-//     position: absolute;
-//     margin: auto;
-//     top: 0;
-//     right: 0;
-//     bottom: 0;
-//     left: 0;
-// }
-
-// .login-resend-email__button {
-
-//     color: #fff;
-//     background: #3c85ed;
-//     font-size: 12px;
-//     border: none;
-//     display: inline-block;
-//     text-decoration: none;
-//     line-height: 1;
-//     border-radius: 2px;
-//     padding: 9px;
-//     width: 107px;
-//     margin: 3px;
-// }
-
-// .login-resend-email__wrapper {
-//     display: flex;
-//     flex-direction: column;
-//     justify-content: center;
-//     align-items: center;
-// }
-
-.get__started--block{
-	height:100vh;
-	width:100%;
-	background-color:#fff;
-	display: flex;
-	align-items:center;
-	justify-content:center;
-	position: relative;
-	& .login__head{
-		position: absolute;
-		top:20px;
-		right:30px;
-		& a{
-			color:#3c85ee;
-			font-weight:500;
-			text-decoration:none;
-			transition:.4s ease all;
-			&:hover{
-				opacity:.7;
-			}
-		}
-	}
-	& .center__get--started{
-		&>p{
-			text-align:center;
-			color:#637381;
-			font-size:25px;
-			font-weight:400;
-			margin-top:0px;
-			margin-bottom:40px;
-		}
-		& .center__button{
-			display: flex;
-			align-items:center;
-			justify-content:center;
-			& a{
-				min-width:175px;
-				min-height:50px;
-				display: inline-flex;
-				align-items:center;
-				justify-content:center;
-				background-color: #3c85ee;
-				border-radius: 5px;
-				font-weight:500;
-				color:#fff;
-				text-decoration: none;
-				transition:.4s ease opacity;
-				&:hover{
-					opacity:.7;
-				}
-			}
-		}
-		&>.logo__wrap , &>.logo__text{
-			display: flex;
-			justify-content:center;
-			align-items:center;
-			
-			& img{
-				display:inline-flex;
-			}
-		}
-		&>.logo__text{
-			margin-top:50px;
-			margin-bottom:35px;
-		}
-	}
-}
-.bottom__float{
-	position: fixed;
-	bottom:45px;
-	left:0px;
-	right:0px;
-	margin-left:auto;
-	margin-right:auto;
-	display: flex;
-	justify-content:center;
-	align-items:center;
-	& p{
-		margin:0px;
-		color:#637381;
-		font-size:14px;
-		line-height:24px;
-		font-weight:400;
-	}
-}
-
-.sign__block , .login__block{
-	height:auto;
-	min-height:100vh;
-	width:100%;
-	background-color:#F4F4F6;
-	padding-top:90px;
-	& .sign__inner , & .login__inner{
-		display: flex;
-		flex-direction:column;
-		&>.confirm__PIN{
-			text-align:center;
-			padding-bottom:120px;
-			& form{
-				& .after__pin{
-					margin-top:20px;
-					&>p{
-						color:#637381;
-						font-size:14px;
-						line-height:24px;
-						font-weight:400;
-						margin:0px;
-					}
-				}
-				& .group__submit{
-					justify-content:center;
-					align-items:center;
-					& input{
-						max-width:270px;
-					}
-				}
-			}
-			&>h2{
-				color:#212B36;
-				font-size:25px;
-				font-weight:500;
-				margin-top:0px;
-				margin-bottom:20px;
-			}
-			&>.pin__wrap{
-				&>p{
-					color:#637381;
-					font-size:14px;
-					font-weight:400;
-					margin-top:0px;
-					margin-bottom:15px;
-				}
-				& .pin__inner{
-					display: flex;
-					align-items:center;
-					justify-content:center;
-					margin-bottom:30px;
-					&>span{
-						color:#212B36;
-						font-size:44px;
-						line-height:38px;
-						font-weight:bold;
-						display: inline-flex;
-						margin-right:15px;
-						&:last-child{
-							margin-right:0px;
-						}
-					}
-				}
-			}
-			&>p{
-				color:#637381;
-				font-size:14px;
-				font-weight:400;
-				line-height:25px;
-				margin-bottom:20px;
-				margin-top:0px;
-
-				& span{
-					color:#212B36;
-					font-weight:500;
-				}
-			}
-		}
-		&>.confirm__email{
-			width:100%;
-			max-width:420px;
-			&>h2{
-				color:#212B36;
-				font-size:25px;
-				margin:0px;
-				margin-bottom:5px;
-				font-weight:500;
-			}
-			&>p{
-				color:#637381;
-				font-size:14px;
-				& span{
-					font-weight:500;
-					color:#212B36;
-				}
-			}
-		}
-		& .resend__email{
-			margin-top:20px;
-			display: flex;
-			justify-content:center;
-			align-items:center;
-			flex-direction:column;
-			&>p{
-				color:#637381;
-				font-size:15px;
-				font-weight:400;
-				display: none;
-				align-items:center;
-				justify-content:center;
-				margin:0px;
-				& span{
-					margin-right:5px;
-					display: inline-flex;
-					&.full__timer{
-						margin-right:0px;
-					}
-					&>span{
-						margin-right:0px;
-					}
-				}
-			}
-			& a{
-				text-decoration:none;
-				transition:.4s ease all;
-				color:#3c85ee;
-				font-size:15px;
-				font-weight:500;
-				line-height:24px;
-				&:hover{
-					opacity:.7;
-					text-decoration:none;
-				}
-			}
-		}
-		& .group__submit{
-				&>input[type="submit"]{
-					width:100%;
-					height:48px;
-					background: #3c85ee;
-					border: 1px solid #3c85ee;
-					border-radius:5px;
-					color: #FFFFFF;
-					font-size:15px;
-					line-height:24px;
-					font-weight:500;
-					cursor:pointer;
-					transition:.4s ease all;
-					&:hover{
-						opacity:.7;
-					}
-				}
-			}
-		& .group__input{
-			&.forgot__pass{
-					position: relative;
-					display: flex;
-					align-items:center;
-					& input{
-						padding-right:75px;
-					}
-					& a{
-						color:#3c85ee;
-						font-size:15px;
-						font-weight:500;
-						text-decoration: none;
-						transition:.4s ease all;
-						position: absolute;
-						right:15px;
-						&:hover{
-							opacity:.7;
-						}
-					}
-				}
-			width:100%;
-			margin-bottom:20px;
-			&>input{
-				width:100%;
-				height:48px;
-				padding-left:12px;
-				padding-right:12px;
-				color:#000;
-				border:1px solid #637381;
-				border-radius: 5px;
-				outline:none;
-				font-size:15px;
-				&::-webkit-input-placeholder {
-				  color: #637381;
-				}
-				&::-moz-placeholder { 
-				  color: #637381;
-				}
-				&:-ms-input-placeholder {
-				  color: #637381;
-				}
-				&:-moz-placeholder { 
-				  color: #637381;
-				}
-			}
-		}
-		display:flex;
-		width:100%;
-		max-width:620px;
-		margin-left:auto;
-		margin-right:auto;
-		background: #FFFFFF;
-		box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15), inset 0px 1px 0px #F5F7FA;
-		border-radius: 4px;
-		justify-content:center;
-		align-items:center;
-		position: relative;
-		padding-top:70px;
-		padding-left:100px;
-		padding-right:100px;
-		padding-bottom:45px;
-		&>.create__account{
-			width:100%;
-			&>form{
-				width:100%;
-				& .already__group{
-					margin-top:20px;
-					& p{
-						margin:0px;
-						text-align:center;
-						color:#637381;
-						font-size:15px;
-						line-height:24px;
-						font-weight:400;
-						& a{
-							color:#3c85ee;
-							font-weight:500;
-							font-size:15px;
-							line-height:24px;
-							text-decoration:none;
-							transition:.4s ease all;
-							&:hover{
-								opacity:.7;
-							}
-						}
-					}
-				}
-			}
-			&>h2{
-				margin-top:0px;
-				margin-bottom:20px;
-				color:#212B36;
-				font-size:25px;
-				font-weight:500;
-			}
-		}
-		&>.checkemail__pass{
-			padding-bottom:30px;
-			text-align:center;
-			&>h2{
-				margin-bottom:20px;
-				margin-top:0px;
-				color:#212B36;
-				font-size:25px;
-				font-weight:500;
-			}
-			&>p{
-				margin-bottom:20px;
-				font-size:14px;
-				line-height:25px;
-				color:#637381;
-				&:last-child{
-					margin-bottom:0px;
-				}
-			}
-		}
-		&>.new__password{
-			width:100%;
-			max-width:420px;
-			&>h2{
-				margin-bottom:20px;
-				margin-top:0px;
-				color:#212B36;
-				font-size:25px;
-				font-weight:500;
-			}
-		}
-		&>.resetpass__request{
-			padding:15px 0px;
-			&>h2{
-				color:#212B36;
-				font-weight:500;
-				font-size:25px;
-				margin-top:0px;
-				margin-bottom:15px;
-				text-align:center;
-			}
-			&>p{
-				text-align:center;
-				color:#637381;
-				font-size:14px;
-				line-height:24px;
-				font-weight:400;
-				margin:20px 0px;
-			}
-			& .group__submit{
-				max-width:260px;
-				margin-left:auto;
-				margin-right:auto;
-			}
-			& .after__request{
-				margin-top:50px;
-				&>p{
-					margin:0px;
-					color:#637381;
-					font-size:14px;
-					line-height:25px;
-					text-align:center;
-				}
-			}
-		}
-		&>.login__form , &>.forgotpass__form{
-			&>p{
-				color:#637381;
-				font-size:14px;
-				line-height:24px;
-				margin-bottom:15px;
-				&:last-child{
-					margin-bottom:0px;
-					margin-top:0px;
-				}
-			}
-			padding-bottom:20px;
-			width:100%;
-			max-width:420px;
-			& .create__account{
-				&>p{
-					text-align:center;
-					color:#637381;
-					font-size:15px;
-					font-weight:400;
-					& a{
-						color:#3c85ee;
-						font-size:15px;
-						font-weight:500;
-						text-decoration:none;
-						transition:.4s ease all;
-						&:hover{
-							opacity:.7;
-						}
-					}
-				}
-			}
-			&>h2{
-				color:#212B36;
-				font-weight:500;
-				font-size:25px;
-				margin-top:0px;
-				margin-bottom:15px;
-			}
-		}
-		&>.sign__logo , &>.login__logo{
-			position: absolute;
-			left:0px;
-			margin-left:auto;
-			margin-right:auto;
-			right:0px;
-			top:0px;
-			top:-35px;
-			width:70px;
-			height:70px;
-			display: flex;
-			align-items:center;
-			justify-content:center;
-			border-radius:250px;
-			box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
-			background-color:#fff;
-			& img{
-				max-width:45px;
-			}
-		}
-	}
-}
-
-
-.storage__block{
-    height: auto;
-    min-height: 100vh;
-    width: 100%;
-    background-color: #F4F4F6;
-    padding-top: 90px;
-	& .inner__storage{
-	    display: flex;
-	    flex-direction: column;
-	    display: flex;
-	    width: 100%;
-	    max-width: 620px;
-	    margin-left: auto;
-	    margin-right: auto;
-	    background: #FFFFFF;
-	    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15), inset 0px 1px 0px #F5F7FA;
-	    border-radius: 4px;
-	    justify-content: center;
-	    align-items: center;
-	    position: relative;
-	    padding-top: 70px;
-	    padding-left: 100px;
-	    padding-right: 100px;
-	    padding-bottom: 45px;
-		& .login__logo{
-		    position: absolute;
-		    left: 0px;
-		    margin-left: auto;
-		    margin-right: auto;
-		    right: 0px;
-		    top: 0px;
-		    top: -35px;
-		    width: 70px;
-		    height: 70px;
-		    display: flex;
-		    align-items: center;
-		    justify-content: center;
-		    border-radius: 250px;
-		    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
-		    background-color: #fff;
-		    &>img{
-		    	max-width:45px;
-		    }
-		}
-		& .storage__main{
-			width:100%;
-			max-width:420px;
-			&>h2{
-				margin-bottom:20px;
-				margin-top:0px;
-				color:#212B36;
-				font-size:25px;
-				font-weight:500;
-			}
-
-			& .wrap__storage--elements{
-				&>.elem__storage{
-					& .status__text{
-						position: relative;
-						display: inline-flex;
-						align-items:center;
-						&.active__status:before{
-							content:"";
-							position: absolute;
-							right:-20px;
-							width:12px;
-							height:12px;
-							background:url("/assets/fill.svg");
-							background-repeat: no-repeat;
-							background-size:cover;
-							background-position:center;
-						}
-					}
-					display: flex;
-					flex-direction:column;
-					& .add__storage{
-						position: absolute;
-						right:30px;
-						& a{
-							text-decoration:none;
-							color:#3c85ee;
-							font-weight:500;
-							font-size:15px;
-							transition:.4s ease all;
-							&:hover{
-								opacity:.7;
-							}
-						}
-					}
-					& .success__storage{
-						position: absolute;
-						right:25px;
-					}
-					border:1px solid #BEC9D3;
-					border-radius: 5px;
-					margin-bottom: 10px;
-					position: relative;
-					cursor:pointer;
-					transition:.4s ease all;
-					display: flex;
-					align-items:center;
-					&:last-child{
-						margin-bottom:0px;
-					}
-					&>.storage__main{
-						padding:20px;
-						padding-top:0px;
-						padding-bottom:10px;
-						& div{
-							& button {
-								color: white;
-								font-size: unset;
-								padding: 13px;
-								display: flex;
-								align-items: center;
-								justify-content: center;
-								background-color: #3c85ee;
-								text-decoration: none;
-								border-radius: 5px;
-								margin-bottom: 6px;
-								border: none
-							}
-						}
-						& .enter__storage--key{
-							width:100%;
-							border:1px solid #637381;
-							border-radius:5px;
-							display: flex;
-							justify-content:space-between;
-							align-items:center;
-							&>input{
-								border-radius:5px;
-								padding:10px;
-								width:100%;
-								margin-right:10px;
-								color:#000;
-								font-size:15px;
-								line-height:24px;
-								font-weight:400;
-								border:0px;
-								outline:none;
-								&::-webkit-input-placeholder {
-								  color: #637381;
-								}
-								&::-moz-placeholder { 
-								  color: #637381;
-								}
-								&:-ms-input-placeholder {
-								  color: #637381;
-								}
-								&:-moz-placeholder { 
-								  color: #637381;
-								}
-							}
-							&>a{
-								padding:2px 10px;
-								border:1px solid #3c85ee;
-								border-radius: 5px;
-								min-width:60px;
-								text-decoration:none;
-								color:#3c85ee;
-								font-weight:500;
-								text-transform: uppercase;
-								min-height:26px;
-								transition:.4s ease all;
-								margin-right:10px;
-								&:hover{
-									background-color:#3c85ee;
-									color:#fff;
-								}
-							}
-						}
-						&>p{
-							margin-top:0px;
-							color:#637381;
-							font-size:14px;
-							line-height:25px;
-							font-weight:400;
-							margin-bottom:20px;
-						}
-					}
-					&>.head__storage{
-						display: flex;
-						width:100%;
-						align-items:center;
-						padding:20px;
-						& .info__storage{
-							&>p{
-								margin:0px;
-								color:#212B36;
-								font-size:16px;
-								font-weight:500;
-							}
-							&>span{
-								color:#637381;
-								font-size:13px;
-								font-weight:400;
-							}
-						}
-					}
-				}
-			}
-		}
-	}
-}
-
-
-@media only screen and (max-width: 991px) and (orientation: landscape) {
-	.bottom__float{
-		bottom:10px;
-		position: static;
-		padding:25px 0px;
-	}
-
-	.get__started--block {
-		.center__get--started{
-			&>.logo__wrap{
-				&>img{
-					max-width:70px;
-				}
-			}
-			&>.logo__text{
-				margin-top:20px;
-				margin-bottom:15px;
-				&>img{
-					max-width:220px;
-				}
-			}
-			&>p{
-				margin-bottom:25px;
-				font-size:21px;
-			}
-		}	
-	}
-}
-
-@media (max-width:991px){
-	.storage__block{
-		& .inner__storage{
-			max-width:450px;
-			padding-top:45px;
-			padding-left:50px;
-			padding-right:50px;
-			padding-bottom:25px;
-		}
-	}
-	.login__block{
-		& .login__inner{
-			max-width:450px;
-			padding-top:45px;
-			padding-left:50px;
-			padding-right:50px;
-			padding-bottom:25px;
-		}
-	}
-	.sign__block{
-		& .sign__inner{
-			max-width:450px;
-			padding-top:45px;
-			padding-left:50px;
-			padding-right:50px;
-			padding-bottom:25px;
-			&>.confirm__PIN{
-				padding-bottom:40px;
-			}
-		}
-	}
-}
-
-@media (max-width:480px){
-	.storage__block{
-		& .inner__storage{
-			& .storage__main{
-				& .wrap__storage--elements{
-					&>.elem__storage{
-						&>.storage__main{
-							& .enter__storage--key{
-								& input{
-									font-size:14px;
-								}
-							}
-						}
-					}
-				}
-			}
-		}
-	}
-	.sign__block, .login__block , .storage__block{
-		padding-top:50px;
-	}
-	.storage__block{
-		padding-left:15px;
-		padding-right:15px;
-		padding-bottom:20px;
-		&>.inner__storage{
-			padding-left:15px;
-			padding-right:15px;
-			&>.storage__main{
-				&>h2{
-					font-size:22px;
-					margin-bottom:12px;
-				}
-			}
-		}
-	}
-	.login__block{
-		padding-left:15px;
-		padding-right:15px;
-		& .login__inner{
-			padding-left:25px;
-			padding-right:25px;
-			&>.resetpass__request , &>.new__password , &>.login__form , &>.forgotpass__form , &>.checkemail__pass{
-				& .after__request{
-					margin-top:30px;
-					&>p{
-						font-size:13px;
-						line-height:20px;
-					}
-				}
-				& .group__submit{
-					& input{
-						height:42px;
-					}
-					margin-bottom:12px;
-					&:last-child{
-						margin-bottom:0px;
-					}
-				}
-				& .group__input{
-					&>input{
-						height:42px;
-					}
-					margin-bottom:12px;
-					&:last-child{
-						margin-bottom:0px;
-					}
-				}
-				&>h2{
-					margin-bottom:12px;
-					font-size:22px;
-				}
-			}
-		}
-	}
-	.sign__block{
-		padding-left:15px;
-		padding-right:15px;
-		& .sign__inner{
-			padding-left:25px;
-			padding-right:25px;
-			&>.create__account , &>.confirm__email, &>.confirm__PIN{
-				&>h2{
-					font-size:22px;
-					margin-bottom:12px;
-				}
-			}
-			& .create__account{
-				&>form{
-					&>.already__group{
-						margin-top:12px;
-					}
-					&>.group__input , &>.group__submit{
-						margin-bottom:12px;
-						&>input[type="submit"]{
-							height:42px;
-						}
-						&>input{
-							height:42px;
-						}
-					}
-				}
-				&>h2{
-					margin-bottom:12px;
-					font-size:22px;
-				}
-			}
-		}
-	}
-
-	.bottom__float{
-		bottom:15px;
-		& p{
-			font-size:13px;
-			line-height:20px;
-		}
-	}
-	.get__started--block{
-		& .center__get--started{
-			&>p{
-				margin-bottom:25px;
-				font-size:21px;
-			}
-			& .logo__text{
-				margin-top:30px;
-				margin-bottom:15px;
-				&>img{
-					max-width: 240px;
-				}
-			}
-		}
-	}
-}
-
-.login-resend-email__wrapper {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-}
-
-.login-resend-email {
-    color: #3c85ee;
-    font-size: 15px;
-    font-weight: 500;
-    transition: .4s ease all;
-    text-decoration: none;
-    text-align: center;
-    margin: 6px;
-}
\ No newline at end of file
diff --git a/src/styles/components/_MobileContextMenu.scss b/src/styles/components/_MobileContextMenu.scss
deleted file mode 100644
index 54f1a25..0000000
--- a/src/styles/components/_MobileContextMenu.scss
+++ /dev/null
@@ -1,54 +0,0 @@
-.mobile__context-menu__wrapper {
-  // height: 165px;
-
-  width: 98%;
-  // background: red;
-  position: fixed;
-  bottom: 0;
-  /* margin-right: 130px; */
-  margin-left: 1%;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.302),
-    0 1px 3px 1px rgba(60, 64, 67, 0.149);
-  border: 1px solid #dadce0;
-  border-bottom: none;
-  -webkit-touch-callout: none;
-  -webkit-user-select: none;
-  -khtml-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  -webkit-tap-highlight-color: transparent;
-  background: white;
-}
-
-.mobile__context-menu__item {
-  // background: blue;
-  display: flex;
-  flex-direction: row;
-  width: 90%;
-}
-
-.mobile__context-menu__image {
-  width: 28px;
-  margin-right: 15px;
-}
-
-.mobile__context-menu__title {
-  color: #637381;
-}
-
-// TODO: Get mobile context working
-.mobile__context__menu {
-  @media (max-width: 640px) {
-    bottom: 0 !important;
-    left: 0 !important;
-    top: unset !important;
-    right: unset !important;
-    z-index: 10;
-  }
-}
diff --git a/src/styles/components/_MoverMenu.scss b/src/styles/components/_MoverMenu.scss
deleted file mode 100644
index bc922a3..0000000
--- a/src/styles/components/_MoverMenu.scss
+++ /dev/null
@@ -1,161 +0,0 @@
-.movermenu {
-    width: 400px;
-    height: 500px;
-    background: white;
-    position: fixed;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    margin: auto;
-    -webkit-box-shadow: 0 11px 8px 0 rgba(0,0,0,0.2);
-    box-shadow: 0 11px 8px 0 rgba(0,0,0,0.2);
-    border: 2px solid #dadce0;
-    z-index: 4;
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 100%;
-        height: 100%;
-        z-index: 4;
-    }
-}
-
-.movermenu__close-button {
-    width: 32px;
-    opacity: 0.8;
-    cursor: pointer;
-}
-
-.movermenu__form {
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 100%;
-        display: flex;
-        justify-content: center
-    }
-}
-
-.movermenu__nav_wrapper {
-    width: 100%;
-    height: 32px;
-    /* background: green; */
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-}
-
-.movermenu__main_wrapper {
-    width: 100%;
-    height: 341px;
-    overflow: scroll;
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 100%;
-        height: calc(100% - 155px);
-    }
-}
-
-.movermenu__search_wrapper {
-    width: 100%;
-    height: 48px;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-}
-
-.movermenu__input {
-    border: 1px solid #cacccd;
-    border-radius: 2px;
-    height: 32px;
-    font-size: 1.8rem;
-    font-weight: 300;
-    padding: 1.2rem;
-    margin: 0 0 1.2rem 0;
-    width: 381px;
-    margin-top: 11px;
-    background: #f1f3f4;
-
-    @media (max-width: $desktop-breakpoint) {
-        height: 41px;
-        font-size: 1.9rem;
-        width: 98%;
-    }
-}
-
-
-.movermenu__input:focus {
-
-    background: white;
-    outline: none;
-    border-style: groove;
-}
-
-.movermenu__home-button {
-    width: 32px;
-    margin-right: 10px;
-    cursor: pointer;
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 35px;
-    }
-}
-
-.movermenu__home-button--disabled {
-
-    cursor: default;
-    opacity: 0.4;
-}
-
-.movermenu__back-button {
-    width: 32px;
-    margin-left: 3px;
-    cursor: pointer;
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 35px;
-    }
-
-}
-
-.movermenu__back-button--disabled {
-    opacity: 0.4;
-    cursor: default;
-}
-
-.movermenu__title {
-    color: black;
-    font-size: 20px;
-    font-weight: 200;
-    margin-left: -6px;
-    max-width: 55%;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-}
-
-.movermenu__button {
-    margin-right: 10px;
-    color: white;
-    background: #3c85ed;
-    font-size: 12px;
-    border: none;
-    display: inline-block;
-    text-decoration: none;
-    line-height: 1;
-    border-radius: 2px;
-    padding: 9px;
-}
-
-.movermenu__button_wrapper {
-    width: 100%;
-    /* background: blue; */
-    height: 36px;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-end;
-
-    
-}
\ No newline at end of file
diff --git a/src/styles/components/_Photoviewer.scss b/src/styles/components/_Photoviewer.scss
deleted file mode 100644
index 3497295..0000000
--- a/src/styles/components/_Photoviewer.scss
+++ /dev/null
@@ -1,39 +0,0 @@
-.photoviewer {
-  background: rgba(0, 0, 0, 0.95);
-  width: 100%;
-  position: fixed;
-  height: 100%;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  display: flex;
-  flex-direction: column;
-}
-
-.photoviewer__close-button {
-  width: 22px;
-  margin-left: 10px;
-  margin-top: 10px;
-  opacity: 0.6;
-  cursor: pointer;
-}
-
-.photoviewer__image {
-  width: 95%;
-  height: 90%;
-  margin-left: 2.5%;
-  // background: blue;
-  object-fit: contain;
-}
-
-.photoviewer__loader {
-  width: 98%;
-  height: 88%;
-  display: flex;
-  align-items: center;
-
-  @media (max-width: $desktop-breakpoint) {
-    width: 90%;
-  }
-}
diff --git a/src/styles/components/_Popup-window.scss b/src/styles/components/_Popup-window.scss
deleted file mode 100644
index 4385713..0000000
--- a/src/styles/components/_Popup-window.scss
+++ /dev/null
@@ -1,230 +0,0 @@
-.popup-window {
-    width: 61%;
-    height: 70%;
-    background: white;
-    position: fixed;
-    margin: 0 auto;
-    left: 50%;
-    top: 50%;
-    max-width: 800px;
-    transform: translate(-50%, -50%);
-    -ms-transform: translate(-50%, -50%);
-    -webkit-transform: translate(-50%, -50%);
-    z-index: 5;
-    -webkit-box-shadow: 0 11px 8px 0 rgba(0,0,0,0.2);
-    box-shadow: 0 11px 8px 0 rgba(0,0,0,0.2);
-    border: 2px solid #dadce0;
-    border-radius: 6px;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    align-items: center;
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 100%;
-        height: 100%;
-        z-index: 5;
-        max-width: unset;
-    }
-    
-}
-
-.popup-window-video {
-    height: unset;
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 100%;
-        height: 100%;
-        z-index: 5;
-        max-width: unset;
-    }
-}
-
-.popup-window--gone {
-
-    display: none;
-}
-
-.popup-window__title {
-    color: black;
-    font-weight: 300;
-    margin-top: 10px;
-    /* width: 100px; */
-    max-width: 72%;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    white-space: nowrap;
-    font-size: 21px;
-    height: 35px;
-    margin-bottom: 0;
-
-    @media (max-width: $desktop-breakpoint) {
-        overflow: hidden;
-    }
-}
-
-.popup-window__subtitle {
-    color: black;
-    font-weight: 300;
-    font-size: 11px;
-    margin-top: -11px;
-}
-
-.popup-window__image__wrapper__subwrapper {
-    background: red;
-}
-
-.popup-window__image {
-    width: 120px;
-    opacity: 0.8;
-}
-
-.popup-window__image--loaded {
-
-    width: 100%;
-    max-height: 100%;
-    max-width: 100%;
-    object-fit: contain;
-    opacity: 1;
-    border-radius: 6px;
-    height: 100%;
-    cursor: pointer;
-
-    @media (max-width: $desktop-breakpoint) { 
-        width: 90vw;
-        max-height: 70vh;
-        max-width: 90vw;
-        object-fit: contain;
-        opacity: 1;
-        border-radius: 6px;
-        height: 70vh;
-        cursor: pointer;
-    }
-}
-
-.popup-window__button {
-    // width: unset;
-    // margin-bottom: 12px;
-    font-size: unset;
-    padding: 13px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background-color: #3c85ee;
-    text-decoration: none;
-    border-radius: 5px;
-    margin-bottom: 6px;
-
-    &:hover{
-        background-color: darken($color: #3c85ee, $amount: 20);
-    }
-
-    @media (max-width: $desktop-breakpoint) {
-        margin-bottom: 12px;
-    }
-}
-
-.popup-window__button-video {
-    margin-bottom: 14px;
-}
-
-.popup-window__image__wrapper {
-
-    flex-direction: column-reverse;
-    align-items: center;
-    display: flex;
-    margin-bottom: 50px;
-    height: 50%;
-    width: 38%;
-    max-width: 80%;
-    overflow: hidden;
-    position: relative;
-    justify-content: center;
-    max-height: 50%;
-
-    @media (max-width: $desktop-breakpoint) {
-
-        width: 98%;
-        max-width: 98%;
-    }
-
-    // flex-direction: column-reverse;
-    // align-items: center;
-    // display: flex;
-    // margin-bottom: 50px;
-    // height: 50%;
-    // width: 80%;
-    // max-width: 80%;
-    // overflow: hidden;
-    // position: relative;
-    // justify-content: center;
-    // max-height: 50%;
-
-    // @media (max-width: $desktop-breakpoint) {
-
-    //     flex-direction: column-reverse;
-    //     align-items: center;
-    //     display: flex;
-    //     margin-bottom: 50px;
-    //     overflow: visible;
-    //     position: relative;
-    //     justify-content: center;
-    //     height: 100vh;
-    //     width: 100vw;
-    // }
-
-}
-
-.popup-window__spinner__wrapper {
-    margin-left: -25px;
-}
-
-.popup-window__close-button {
-    width: 29px;
-    position: absolute;
-    left: 8px;
-    top: 10px;
-    opacity: 0.7;
-    cursor: pointer;
-}
-
-.popup-window__video {
-    max-height: 70%;
-    max-width: 95%;
-    border-radius: 3px;
-}
-
-.popup-window-wrapper {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    flex-direction: row;
-    justify-content: space-around;
-    align-items: center;
-
-    @media (max-width: $desktop-breakpoint) {
-
-        flex-direction: column;
-        justify-content: center;
-    }
-}
-
-.popup-window-wrapper-video {
-    flex-direction: column;
-    justify-content: space-evenly;
-
-    @media (max-width: $desktop-breakpoint) {
-        justify-content: center;
-    }
-}
-
-.popup-file-details-title {
-    font-family: "Roboto",sans-serif;
-    font-weight: 300;
-}
-
-.popup-window-button-wrapper {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
\ No newline at end of file
diff --git a/src/styles/components/_QuickAccess.scss b/src/styles/components/_QuickAccess.scss
deleted file mode 100644
index 8f8e506..0000000
--- a/src/styles/components/_QuickAccess.scss
+++ /dev/null
@@ -1,108 +0,0 @@
-.quickaccess {
-    width: inherit;
-    height: 170px;
-    // background: red;
-    display: flex;
-    /* flex-direction: row; */
-    flex-flow: row wrap;
-    align-items: center;
-    /* overflow-y: hidden; */
-    overflow: hidden;
-
-    @media (max-width: $desktop-breakpoint) {
-        // margin-top: calc(80px + 3vh);
-        width: inherit;
-        height: 153px;
-        display: flex;
-        flex-flow: row wrap;
-        align-items: center;
-        overflow: hidden;
-    }
-}
-
-.quickaccess__item {
-    min-width: 186px;
-    min-height: 160px;
-    height: 160px;
-    width: 186px;
-    margin: 5px;
-    // background: blue;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    border: 1px solid #dadce0;
-    border-radius: 10px;
-
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    -webkit-tap-highlight-color: transparent;
-    position: relative;
-
-    @media (max-width: $desktop-breakpoint) {
-        min-height: 144px;
-        height: 148px;
-        min-width: 46%;
-        width: 46%;
-        position: unset;
-    }
-    
-}
-
-.quickaccess__item__image__wrapper {
-    width: 100px;
-    height: 100px;
-}
-
-.quickaccess__item__image {
-    width: 100px;
-    height: 100px;
-    opacity: 0.7;
-}
-
-.quickaccess__item__image--no-opacity {
-    opacity: 1;
-    border-radius: 10px;
-    margin-top: 5px;
-    max-height: 99px;
-    max-width: 99px;
-    object-fit: cover;
-
-}
-
-.quickaccess__item__title {
-    // color: black;
-    font-size: 13px;
-    font-weight: 350;
-    margin-top: 8px;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    /* max-width: 100px; */
-    width: 90%;
-    /* height: 54px; */
-    /* overflow: hidden; */
-    overflow-x: hidden;
-    overflow-y: visible;
-    margin-left: 5px;
-}
-
-.quickaccess__item__subtitle {
-
-    // color: black;
-    margin-top: -12px;
-    font-weight: 100;
-    font-size: 11px;
-    overflow-x: hidden;
-    overflow-y: visible;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    width: 90%;
-    margin-left: 5px;
-}
-
-.quickaccess__item__title__wrapper {
-    width: 100%;
-}
\ No newline at end of file
diff --git a/src/styles/components/_ResetPasswordPage.scss b/src/styles/components/_ResetPasswordPage.scss
deleted file mode 100644
index 0f87a03..0000000
--- a/src/styles/components/_ResetPasswordPage.scss
+++ /dev/null
@@ -1,51 +0,0 @@
-.reset-password__main {
-    display: flex;
-    width: 100vw;
-    height: 100vh;
-    justify-content: center;
-    align-items: center;
-}
-
-.reset-password__box {
-    background: rgba(255,255,255,.85);
-    border-radius: 3px;
-    text-align: center;
-    width: 35rem;
-    padding: 3.2rem 1.6rem 1.2rem 1.6rem;
-    border: .5px;
-    border-style: groove;
-    display: flex;
-    flex-direction: column;
-}
-
-.reset-password__title {
-    margin: 0 0 3rem 0;
-    line-height: 1;
-    font-family: Arial,Helvetica,sans-serif;
-    font-weight: 500;
-    color: #666;
-}
-
-.reset-password__input {
-    border: 1px solid #cacccd;
-    border-radius: 2px;
-    height: 43px;
-    font-size: 1.8rem;
-    font-weight: 300;
-    padding: 1.2rem;
-    margin: 0 0 1.2rem 0;
-    width: -webkit-fill-available;
-    overflow: visible;
-}
-
-.reset-password__button {
-    color: #fff;
-    background: #3c85ed;
-    font-size: 1.8rem;
-    padding: 1.2rem;
-    border: none;
-    display: inline-block;
-    text-decoration: none;
-    line-height: 1;
-    border-radius: 2px;
-}
\ No newline at end of file
diff --git a/src/styles/components/_RightSection.scss b/src/styles/components/_RightSection.scss
deleted file mode 100644
index a8e1fa2..0000000
--- a/src/styles/components/_RightSection.scss
+++ /dev/null
@@ -1,144 +0,0 @@
-.section--right {
-    margin: 0 0 0 3px;
-    width: 37vw;
-    transition: width 0.5s;
-    overflow: hidden;
-    display: flex;
-    flex-direction: column;
-    // height: 83vh;
-    scrollbar-width: none; /* Firefox */
-    -ms-overflow-style: none;  /* IE 10+ */
-    &::-webkit-scrollbar {
-        width: 0px;
-        background: transparent; /* Chrome/Safari/Webkit */
-    }
-
-    @media (max-width: $desktop-breakpoint) {
-        display: none
-    }
-}
-
-.section--minimized {
-    width: 0%;
-    margin: 0;
-}
-
-.section--no-animation {
-    
-    transition: none;
-}   
-
-.section__title-wrapper {
-    width: 25vw;
-    height: 30%;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-}
-
-.section__title-text {
-
-    color: black;
-    word-wrap: break-word;
-    overflow: scroll;
-    line-height: 24px;
-    font-weight: 300;
-    margin-left: 10px;
-    text-overflow: ellipsis;
-    max-height: 100%;
-    padding: 6px;
-    width: 77%;
-   
-    scrollbar-width: none; /* Firefox */
-    -ms-overflow-style: none;  /* IE 10+ */
-    &::-webkit-scrollbar {
-        width: 0px;
-        background: transparent; /* Chrome/Safari/Webkit */
-    }
-
-}
-
-.section__image {
-
-    width: 17vw;
-    margin-left: 36px;
-    opacity: 0.3;
-}
-
-.section__title {
-    color: black;
-    font-weight: 300;
-    line-height: 24px;
-    min-width: 25vw;
-    max-width: 25vw;
-}
-
-.section-detail-wrapper {
-    width: inherit;
-    height: inherit;
-}
-
-.section__none--wrapper {
-    width: inherit;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-}
-
-.section__title-text--gone {
-    visibility: hidden;
-}
-
-.section__title-image {
-
-    width: 30px;
-    margin-right: 10px;
-    cursor: pointer;
-    position: absolute;
-    right: 0;
-    top: 5px;
-}
-
-.section__title-image--gone {
-    visibility: hidden;
-}
-
-.section-detail__block {
-    width: 34vw;
-    height: 70%;
-    /* background: green; */
-    overflow: scroll;
-    margin-top: 10px;
-}
-
-.section-detail__wrapper {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-}
-
-.section-detail__title {
-    color: black;
-    margin-left: 15px;
-    font-weight: 300;
-}
-
-.section-detail__title--margin {
-    margin-top: -15px;
-}
-
-.section-detail__body {
-    color: black;
-    font-weight: 500;
-    margin-right: 35%;
-    word-wrap: break-word;
-    overflow: hidden;
-    width: 43%;
-    line-height: 22px;
-    margin-left: 10px;
-}
-
-.section-detail__body--margin {
-    margin-top: -15px;
-}
-
diff --git a/src/styles/components/_SettingsMenu.scss b/src/styles/components/_SettingsMenu.scss
deleted file mode 100644
index 5de6bc9..0000000
--- a/src/styles/components/_SettingsMenu.scss
+++ /dev/null
@@ -1,314 +0,0 @@
-.settingsmenu {
-    width: 918px;
-    height: 487px;
-    background: white;
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    margin: auto;
-    -webkit-box-shadow: 0 11px 8px 0 rgba(0,0,0,0.2);
-    box-shadow: 0 11px 8px 0 rgba(0,0,0,0.2);
-    border: 2px solid #dadce0;
-    z-index: 1;
-    border-radius: 6px;
-
-    @media (max-width: $desktop-breakpoint) {
-        width: 100%;
-        height: 100%;
-        z-index: 2;
-    }
-}
-
-.settingsmenu--gone {
-
-    display: none;
-}
-
-.settingsmenu__header {
-    height: 45px;
-    background: #fff;
-    width: 100%;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-    
-}
-
-
-.settingsmenu__header__image {
-    height: 27px;
-    opacity: 0.8;
-    margin-top: 17px;
-}
-
-.settingsmenu__header__title {
-    color: black;
-    font-weight: 300;
-    margin-left: 6px;
-    font-size: 13px;
-    margin-top: 21px
-}
-
-.settingsmenu__header__button {
-
-    margin-right: 10px;
-    height: 28px;
-    margin-top: -6px;
-    cursor: pointer;
-}
-
-.settingsmenu__header__box {
-
-    height: inherit;
-    width: 30%;
-    display: flex;
-    flex-direction: row;
-    margin-left: 10px;
-    margin-top: -18px;
-}
-
-.settingsmenu_body {
-
-    max-height: 441px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-
-    @media (max-width: $desktop-breakpoint) {
-        max-height: 93vh;
-    }
-}
-
-.settingsmenu__option {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-around;
-    border-bottom: 1px solid #eee;
-    height: 77px;
-    max-height: 77px;
-    /* align-items: center; */
-    position: relative;
-    /* align-content: center; */
-    align-items: center;
-
-    @media (max-width: $desktop-breakpoint) {
-        justify-content: space-between;
-    }
-}
-
-.settingsmenu__option--no-border {
-
-    border: unset
-}
-
-.settingsmenu__option__title {
-
-    width: 250px;
-    margin-left: 8%;
-    font-weight: 500;
-    /* position: absolute; */
-   
-    @media (max-width: $desktop-breakpoint) {
-        margin-left: 10px;
-    }
-}
-
-.settingsmenu__option__title--offset {
-    margin-left: 59.5px;
-
-    @media (max-width: $desktop-breakpoint) {
-        margin-left: 10px;
-    }
-}
-
-.settingsmenu__suboption {
-    width: 230px;
-    height: 76px;
-    display: flex;
-    align-items: center;
-
-    @media (max-width: $desktop-breakpoint) {
-       
-        justify-content: center;
-        flex-direction: column;
-        margin-right: 10px;
-        width: 135px;
-        align-items: flex-end;
-    }
-}
-
-.settingsmenu__suboption--offset {
-    margin-left: -42px;
-
-    @media (max-width: $desktop-breakpoint) {
-       
-        margin-left: unset;
-    }
-}
-
-.settingsmenu__select {
-
-    background: none;
-    border: none;
-    -moz-appearance: none;
-    -webkit-appearance: none;
-    color: #5f6368;
-    font-size: 15px;
-    outline: none;
-    font-weight: 500;
-    padding-left: 3px;
-    padding-right: 4px;
-}
-
-.settingsmenu__select:hover {
-    background: lightgrey
-}
-
-.settingsmenu__button {
-
-    color: white;
-    background: #3c85ed;
-    font-size: 12px;
-    /* padding: 1.2rem; */
-    border: none;
-    display: inline-block;
-    text-decoration: none;
-    line-height: 1;
-    border-radius: 2px;
-    padding: 9px;
-
-    &:hover {
-        background: darken(#3c85ed, 10);
-        color: darken(white, 10)
-    }
-}
-
-.settingsmenu__button--red {
-    background: red;
-    margin-left: 3.5px;
-
-    &:hover {
-        background: darken(red, 10);
-        color: darken(white, 10)
-    }
-  
-}
-
-.settingsmenu__button--offset-logout {
-    margin-left: -3px;
-}
-
-.settingsmenu__button--offset-logout-all {
-    margin-left: 4px;
-}
-
-.settingsmenu__option__title__wrapper {
-    display: flex;
-    justify-content: center;
-    /* width: 100%; */
-    margin-left: 47px;
-
-    @media (max-width: $desktop-breakpoint) {
-       
-        margin-left: unset;
-    }
-}
-
-.settingsmenu__option__info {
-    width: 18px;
-    position: absolute;
-    margin-left: -21px;
-    opacity: 0.7;
-    top: 12px;
-    cursor: pointer;
-
-    @media (max-width: $desktop-breakpoint) {
-        margin-left: -41px;
-    }
-}
-
-.settingsmenu__option__info__style {
-    width: 18px;
-    position: absolute;
-    margin-left: 28px;
-    opacity: 0.7;
-    top: 12px;
-    cursor: pointer;
-
-    @media (max-width: $desktop-breakpoint) {
-        margin-left: 10px;
-    }
-}
-
-.settingsmenu__option__info__size {
-    width: 18px;
-    position: absolute;
-    margin-left: 25px;
-    opacity: 0.7;
-    top: 12px;
-    cursor: pointer;
-
-    @media (max-width: $desktop-breakpoint) {
-        margin-left: 2px;
-    }
-}
-
-.settingsmenu__add-account {
-    width: 100%;
-    height: 100%;
-    background: white;
-    position: absolute;
-    z-index: 3;
-    display: block;
-}
-
-.settingsmenu__add-account-gone {
-    display: none;
-}
-
-.settingsmenu__add-account-wrapper {
-    // background: blue;
-    width: 100%;
-    height: 441px;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-}
-
-.settingsmenu__add-account-box {
-
-    width: 54%;
-    height: 61%;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    // background: green;
-}
-
-.settingsmenu_add-account-input-wrapper {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    margin-top: 10px;
-}
-
-.settingsmenu_add-account-input {
-        /* font-weight: 300; */
-        border: 1px solid #f1f3f4;
-        /* height: 50px; */
-        font-size: 15px;
-        font-weight: 300;
-        /* padding: 7px; */
-        /* margin: 10px 0 10px 0; */
-        /* width: 100%; */
-        /* margin: 3px; */
-        height: 32px;
-        padding-left: 8px;
-        border-radius: 3px;
-        background: #f1f3f4;
-        width: 286px;
-}
diff --git a/src/styles/components/_Sharemenu.scss b/src/styles/components/_Sharemenu.scss
deleted file mode 100644
index cf0a321..0000000
--- a/src/styles/components/_Sharemenu.scss
+++ /dev/null
@@ -1,174 +0,0 @@
-.sharemenu {
-  width: 425px;
-  height: 230px;
-  position: fixed;
-  background: white;
-  left: calc(70% - 425px);
-  box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.302),
-    0 1px 3px 1px rgba(60, 64, 67, 0.149);
-  border: 1px solid transparent;
-  border-radius: 6px;
-  z-index: 1;
-  left: 0;
-  right: 0;
-  margin: 0 auto;
-  display: flex;
-  flex-direction: column;
-  text-align: center;
-  justify-content: center;
-  align-items: center;
-
-  @media (max-width: $desktop-breakpoint) {
-    width: 100%;
-    height: 100%;
-    top: 0;
-    z-index: 2;
-  }
-}
-
-.sharemenu--gone {
-  display: none;
-}
-
-.sharemenu--block {
-  width: 100%;
-}
-
-.sharemenu__title {
-  color: black;
-  max-width: 88%;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  /* margin-left: 5px; */
-  margin-right: 5px;
-  font-size: 13.5px;
-  font-weight: 200;
-  white-space: nowrap;
-
-  @media (max-width: $desktop-breakpoint) {
-    max-width: 80%;
-  }
-}
-
-.sharemenu__subtitle {
-  color: black;
-}
-
-.sharemenu__button__public {
-  color: white;
-  background: #3c85ed;
-  border: none;
-  display: inline-block;
-  text-decoration: none;
-  line-height: 1;
-  border-radius: 2px;
-  width: 29%;
-  height: 37px;
-  padding: 3px;
-
-  &:hover {
-    background: darken(#3c85ed, 10);
-    color: darken(white, 10);
-  }
-
-  @media (max-width: $desktop-breakpoint) {
-    width: 36%;
-    height: 47px;
-  }
-}
-
-.sharemenu__close-button {
-  width: 25px;
-  position: absolute;
-  top: 1px;
-  left: 1px;
-  opacity: 0.8;
-
-  @media (max-width: $desktop-breakpoint) {
-    width: 42px;
-  }
-}
-
-.sharemenu__button__one {
-  color: white;
-  background: #3c85ed;
-  font-size: $font-size-large;
-  padding: $s-size;
-  border: none;
-  display: inline-block;
-  text-decoration: none;
-  line-height: 1;
-  border-radius: $small-border;
-
-  &:hover {
-    background: darken(#3c85ed, 10);
-    color: darken(white, 10);
-  }
-}
-
-.sharemenu__button__done {
-  color: white;
-  background: #3c85ed;
-  font-size: $font-size-large;
-  padding: $s-size;
-  border: none;
-  display: inline-block;
-  text-decoration: none;
-  line-height: 1;
-  border-radius: $small-border;
-
-  &:hover {
-    background: darken(#3c85ed, 10);
-    color: darken(white, 10);
-  }
-}
-
-.sharemenu__link__wrapper {
-  width: 100%;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-
-  @media (max-width: $desktop-breakpoint) {
-    height: 49px;
-  }
-}
-
-.sharemenu__image {
-  width: 27px;
-  margin-left: 10px;
-  margin-right: 5px;
-}
-
-.spinner-image {
-  border: 3px solid white;
-  border-top: 3px solid #3498db;
-  border-radius: 50%;
-  width: 40px;
-  height: 40px;
-  // margin-left: 50%;
-  text-align: center;
-  animation: spin 2s linear infinite;
-}
-
-.spinner-image-grey {
-  border: 3px solid lightgray;
-  border-top: 3px solid #3498db;
-}
-
-.share-model-spinner-wrapper {
-  margin-top: 10px;
-  margin-bottom: 10px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.share-model-share-buttons-wrapper {
-  margin-top: 12px;
-  margin-bottom: 4px;
-}
-
-.share-button__wrapper {
-  margin-bottom: 11px;
-}
diff --git a/src/styles/components/_Spacer.scss b/src/styles/components/_Spacer.scss
deleted file mode 100644
index 57d8802..0000000
--- a/src/styles/components/_Spacer.scss
+++ /dev/null
@@ -1,25 +0,0 @@
-.spacer {
-    display: flex;
-    height: 37px;
-}
-
-.spacer__mobile {
-   
-    @media (max-width: $desktop-breakpoint) {
-        margin-top: calc(80px + 6vh);
-    }
-}
-
-.spacer__title {
-    color: #5f6368;
-    margin-left: 22px;
-    font-weight: 500;
-    font-size: 13px;
-    margin-left: 38px;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-}
\ No newline at end of file
diff --git a/src/styles/components/_Spinner.scss b/src/styles/components/_Spinner.scss
index 7813a2b..38af7ac 100644
--- a/src/styles/components/_Spinner.scss
+++ b/src/styles/components/_Spinner.scss
@@ -36,10 +36,6 @@
 .spinner__no-margin {
   margin: 0;
   margin-bottom: 108px;
-
-  // @media (max-width: $desktop-breakpoint) {
-  //   margin-bottom: 108px;
-  // }
 }
 
 .homepage__spinner__wrapper {
diff --git a/src/styles/components/_Subbar.scss b/src/styles/components/_Subbar.scss
deleted file mode 100644
index f021f1d..0000000
--- a/src/styles/components/_Subbar.scss
+++ /dev/null
@@ -1,129 +0,0 @@
-.info-button {
-    width: 30px;
-    position: absolute;
-    right: 15px;
-    cursor: pointer;
-
-    @media (max-width: $desktop-breakpoint) {
-        display: none;
-     }
-}
-
-.info-button:hover {
-    -webkit-filter: drop-shadow(1px 1px 3px #222222);
-}
-
-.drive-dropdown {
-
-    width: 100px;
-    padding-left: 15px;
-}
-
-.grid-button {
-    width: 30px;
-    position: absolute;
-    right: 60px;
-    cursor: pointer;
-
-    @media (max-width: $desktop-breakpoint) {
-        right: 9px;
-     }
-}
-
-.subbar {
-    // background: purple;
-    width: 80vw;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    height: 7vh;
-    min-height: 50px;
-    user-select: none;
-    // overflow-x: scroll;
-
-    @media (max-width: $desktop-breakpoint) { 
-        width: 100vw;
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        height: 7vh;
-        min-height: 50px;
-        user-select: none;
-        position: fixed;
-        top: 80px;
-        background: white;
-        z-index: 1;
-    }
-
-
-}
-
-.path__block {
-    height: inherit;
-    /* min-height: 7vh; */
-    /* width: 50px; */
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    cursor: pointer;
-
-    @media (max-width: $desktop-breakpoint) {
-        height: 52px;
-        max-height: 52px;
-     }
-    
-}
-
-.path__wrapper {
-    // background: blue;
-    width: 50vw;
-    margin-left: 12px;
-    display: flex;
-    flex-direction: row;
-    overflow-x: scroll;
-    overflow-y: hidden;
-    height: 52px;
-    /* max-height: inherit; */
-    min-height: inherit;
-    /* min-height: 7vh; */
-    // margin-top: 4px;
-    scrollbar-width: none;
-    -ms-overflow-style: none;
-
-    &::-webkit-scrollbar {
-        width: 0px;
-        //background: transparent; /* Chrome/Safari/Webkit */
-    }
-
-    @media (max-width: $desktop-breakpoint) {
-        margin-top: 4px;
-     }
-
-}
-
-.path__title {
-    color: black;
-    font-size: 17px;
-    line-height: 0;
-    font-weight: 300;
-    white-space: nowrap;
-    /* height: fit-content; */
-    padding: 0px 0 2px 0;
-    margin-top: 19px;
-
-    @media (max-width: $desktop-breakpoint) {
-        line-height: normal;
-        padding: unset;
-        margin: unset;
-        text-align: center;
-     }
-}
-
-.path__image {
-    height: fit-content;
-    /* width: 30px; */
-    // margin-top: 7px;
-    @media (max-width: $desktop-breakpoint) {
-        //margin-top: 3px;
-     }
-}
\ No newline at end of file
diff --git a/src/styles/components/_Swal.scss b/src/styles/components/_Swal.scss
index ad606cb..4a25f20 100644
--- a/src/styles/components/_Swal.scss
+++ b/src/styles/components/_Swal.scss
@@ -1,10 +1,15 @@
-
 .swal2-popup {
-    
-    font-size: 10px !important;
+  font-size: 10px !important;
 
-     @media (max-width: $desktop-breakpoint) {
-        
-        font-size: 13px !important;
-    }
-}
\ No newline at end of file
+  @media (max-width: 480px) {
+    font-size: 13px !important;
+  }
+}
+
+.swal2-confirm {
+  background-color: #3c85ee !important;
+}
+
+.swal2-cancel {
+  background-color: red !important;
+}
diff --git a/src/styles/components/_UploadSwitcher.scss b/src/styles/components/_UploadSwitcher.scss
deleted file mode 100644
index 64d13f8..0000000
--- a/src/styles/components/_UploadSwitcher.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-.upload-switcher__select {
-    background: none;
-    border: none;
-    -moz-appearance: none;
-    -webkit-appearance: none;
-    color: #5f6368;
-    font-size: 19px;
-    outline: none;
-    font-weight: 500;
-    padding-left: 3px;
-    padding-right: 4px;
-}
-
-.upload-switcher__wrapper {
-
-    display: flex;
-    flex-direction: row;
-    justify-content: center;
-    align-items: center;
-    margin-top: 28px;
-}
\ No newline at end of file
diff --git a/src/styles/components/_Uploader.scss b/src/styles/components/_Uploader.scss
deleted file mode 100644
index 58c7eb9..0000000
--- a/src/styles/components/_Uploader.scss
+++ /dev/null
@@ -1,148 +0,0 @@
-.uploader__wrapper {
-    width: 330px;
-    /* max-height: 255px; */
-    /* overflow: scroll; */
-    background: white;
-    display: flex;
-    flex-direction: column;
-    position: absolute;
-    right: 25px;
-    bottom: 25px;
-    border-radius: 5px;
-    overflow: hidden;
-    -webkit-box-shadow: 0 2px 8px 0 rgba(0,0,0,0.2);
-    box-shadow: 0 2px 8px 0 rgba(0,0,0,0.2);
-
-    @media (max-width: $desktop-breakpoint) {
-        position: fixed;
-        left:0;right:0;bottom:0;
-        margin:0 auto;
-    }
-    
-}
-
-.uploader__wrapper--gone {
-    display: none;
-}
-
-.uploader__header__wrapper {
-    width: inherit;
-    height: 51px;
-    display: flex;
-    flex-direction: row;
-    background: #323232;
-    justify-content: space-between;
-    align-items: center;
-}
-
-.uploader__header__title {
-    max-width: 50%;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    font-weight: 300;
-    margin-left: 15px;
-    color: white;
-}
-
-.uploader__header__button_wrapper {
-    display: flex;
-    flex-direction: row;
-    margin-right: 15px;
-    height: inherit;
-    align-items: center;
-    
-}
-
-.uploader__header__button {
-
-    margin-left: 33px;
-    /* height: 34px; */
-    width: 27px;
-    opacity: 0.7;
-    padding: 4px;
-    cursor: pointer;
-}
-
-.upload__item__wrapper {
-    width: inherit;
-    height: 50px;
-    /* background: green; */
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-    border-bottom: 1px solid #dadce0;
-    position: relative;
-
-    @media (max-width: $desktop-breakpoint) {
-        min-height: 50px;
-     }
-}
-
-.CircularProgressbar {
-
-    height: 30px;
-    width: 30px;
-}   
-
-.upload__item__block {
-    width: inherit;
-    max-height: 255px;
-    overflow-x: hidden;
-    overflow-y: scroll;
-    display: flex;
-    // flex-direction: column-reverse;
-    flex-direction: column;
-    transition: height 0.5s;
-    scrollbar-width: none; /* Firefox */
-    -ms-overflow-style: none;  /* IE 10+ */
-    &::-webkit-scrollbar {
-        width: 0px;
-        background: transparent; /* Chrome/Safari/Webkit */
-    }
-}
-
-.upload__item__block--hide {
-
-    height: 0px;
-}
-
-.upload__item__item {
-    margin-right: 15px;
-    max-width: 72%;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    font-weight: 300;
-    margin-left: 15px;
-    color: black;
-    white-space: nowrap;
-}
-
-.upload__item__progress {
-   cursor: pointer;
-}
-
-.upload__item__image {
-    width: 30px;
-    height: 30px;
-    position: absolute;
-    /* top: 1px; */
-    /* margin-right: 15px; */
-    opacity: 0;
-    transition: opacity 0.5s;
-    right: 15px;
-}
-
-.upload__item__item__wrapper {
-    cursor: pointer;
-    margin-right: 15px;
-    margin-left: 15px;
-    z-index: 3;
-    width: 30px;
-    max-width: 30px;
-    // background: purple;
-}
-
-.upload__item__item__wrapper--hidden {
-    visibility: hidden;
-}
\ No newline at end of file
diff --git a/src/styles/components/_VerifyEmailPage.scss b/src/styles/components/_VerifyEmailPage.scss
deleted file mode 100644
index 9f2e1c1..0000000
--- a/src/styles/components/_VerifyEmailPage.scss
+++ /dev/null
@@ -1,12 +0,0 @@
-.verify-page__wrapper {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    width: 100vw;
-    height: 100vh;
-}
-
-.verify-page__title {
-
-}
\ No newline at end of file
diff --git a/src/styles/components/_box-layout.scss b/src/styles/components/_box-layout.scss
deleted file mode 100644
index a446637..0000000
--- a/src/styles/components/_box-layout.scss
+++ /dev/null
@@ -1,87 +0,0 @@
-.box-layout {
-    background: white;
-    height: 100vh;
-    width: 100vw;
-    background-size: cover;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.box-layout__box {
-    background: fade-out(white, .15);
-    border-radius: 3px;
-    text-align: center;
-    width: 35rem;
-    padding: 3.2rem 1.6rem 1.2rem 1.6rem;
-    border: 0.5px;
-    border-style: groove;
-    display: flex;
-    flex-direction: column;
-
-    @media (max-width: $desktop-breakpoint) {
-        border: none;
-        width: -webkit-fill-available;
-    }
-}
-
-.box-layout__title {
-    margin: 0 0 3rem 0;
-    line-height: 1;
-    font-family: Arial, Helvetica, sans-serif;
-    font-weight: 500;
-    color: $grey;
-}
-
-.box-layout__input {
-    border: 1px solid #cacccd;
-    border-radius: $small-border;
-    height: 43px;
-    font-size: $font-size-large;
-    font-weight: 300;
-    padding: $s-size;
-    margin: 0 0 $s-size 0;
-    width: -webkit-fill-available;
-}
-
-.box-layout--button {
-    width: -webkit-fill-available;
-}
-
-.box-layout__icon {
-    position: absolute;
-    width: 130px;
-    left: 25px;
-    top: 25px;
-
-    @media (max-width: $desktop-breakpoint) {
-        left: 0;
-        top: 0;
-        padding: 15px;
-    }
-}
-
-.box-layout__text {
-    color: $grey;
-}
-
-.login__image__wrapper {
-    width: inherit;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    height: 20px;
-}
-
-.login__image {
-
-    width: 25px;
-    height: 25px;
-    margin-right: 4px;
-}
-
-.login__title {
-
-    color: black;
-}
\ No newline at end of file
diff --git a/src/styles/components/_button.scss b/src/styles/components/_button.scss
deleted file mode 100644
index f0a567d..0000000
--- a/src/styles/components/_button.scss
+++ /dev/null
@@ -1,50 +0,0 @@
-.button {
-    color: white;
-    background: #3c85ed;
-    font-size: $font-size-large;
-    padding: $s-size;
-    border: none;
-    display: inline-block;
-    text-decoration: none;
-    line-height: 1;
-    border-radius: $small-border;
-
-    &:hover {
-        background: darken(#3c85ed, 10);
-        color: darken(white, 10)
-    }
-}
-
-.button--small {
-    color: white;
-    background: #3c85ed;
-    font-size: 11px;
-    padding: 12px;
-    border: none;
-    display: inline-block;
-    text-decoration: none;
-    line-height: 1;
-    border-radius: 2px;
-    width: 35%;
-    white-space: nowrap;
-    height: 100%;
-    margin-left: 10%;
-
-    &:hover {
-        background: darken(#3c85ed, 10);
-        color: darken(white, 10)
-    }
-}
-
-.button--small--disabled {
-
-    opacity: 0.5;
-}
-
-.button--link {
-    background: none;
-}
-
-.button--secondary {
-    background: #888888
-}
\ No newline at end of file
diff --git a/src/styles/components/_content-container.scss b/src/styles/components/_content-container.scss
deleted file mode 100644
index 2f0166e..0000000
--- a/src/styles/components/_content-container.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-.content-container {
-    margin: 0 auto; 
-    max-width: 80rem;
-    padding: 0 $m-size;
-    background: black;
-}
\ No newline at end of file
diff --git a/src/styles/components/_loader.scss b/src/styles/components/_loader.scss
deleted file mode 100644
index f7ec77b..0000000
--- a/src/styles/components/_loader.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.loader {
-  
-}
\ No newline at end of file
diff --git a/src/styles/components/body.scss b/src/styles/components/body.scss
deleted file mode 100644
index 7f52e20..0000000
--- a/src/styles/components/body.scss
+++ /dev/null
@@ -1,116 +0,0 @@
-body , html{
-	margin:0px;
-	padding:0px;
-	& input[type="text"] , & input[type="submit"]{
-		outline:none;
-	}
-}
-body{
-	&.get__started--body{
-		& .bottom__float{
-			background-color:#fff;
-		}
-	}
-	&.float__copyright{
-		display: flex;
-		flex-direction:column;
-		align-items:flex-start;
-		& .bottom__float{
-			position: static;
-			padding:20px 0px;
-		}
-			
-		& .sign__block ,  & .login__block{
-			min-height:0px;
-			height:auto;
-		}
-	}
-	&.sign__back , &.login__block , &.storage__back{
-		background-color:#F4F4F6;
-	}
-	& *{
-		box-sizing:border-box;
-		font-family:"Roboto" ,sans-serif;
-	}
-}
-
-
-.main__wrapper--container{
-	display: flex;
-	justify-content:space-between;
-	height:auto;
-	min-height:calc(100vh - 73px);
-	margin-top:73px;
-	padding-left:250px;
-	padding-right:275px;
-	&>.menu__block{
-		min-width:250px;
-		max-width: 250px;
-		border-right: 1px solid #E8EEF2;
-		padding:20px 10px;
-		position: fixed;
-		top:72px;
-		left:0px;
-		background-color:#fff;
-		height:calc(100vh - 73px);
-	}
-	&>.content__block{
-		width:100%;
-		position: relative;
-	}
-}
-.small__switcher--content{
-	display: none;
-}
-.overlay{
-	width:100%;
-	height:100vh;
-	position: fixed;
-	top:0px;
-	left:0px;
-	z-index:5;
-	background-color:rgba(0,0,0,.7);
-	display: none;
-}
-@media (max-width:1200px){
-	.main__wrapper--container > .menu__block{
-		position: fixed;
-		top:0px;
-		left:0px;
-		z-index:6;
-		height:100vh;
-		overflow-y:auto;
-		left:-290px;
-		transition:.5s ease all;
-	}
-	.settings__container{
-		& .small__switcher--content{
-			padding-top:15px;
-			display: flex;
-			justify-content:space-between;
-			max-width:690px;
-			margin-left:auto;
-			margin-right:auto;
-			padding-left:15px;
-			padding-right:15px;
-			&>a{
-				text-decoration:none;
-				font-size:30px;
-				color:#3c85ee;
-				transition:.4s ease all;
-				display: inline-flex;
-				&:hover{
-					opacity:.7
-				}
-			}
-		}
-	}
-}
-@media (max-width:991px){
-	.main__wrapper--container{
-		margin-top:110px;
-	}
-}
-@media (max-width:640px){
-
-}
\ No newline at end of file
diff --git a/src/styles/components/file_content.scss b/src/styles/components/file_content.scss
deleted file mode 100644
index 17705d0..0000000
--- a/src/styles/components/file_content.scss
+++ /dev/null
@@ -1,701 +0,0 @@
-.file__container {
-  display: flex;
-  height: 100%;
-  & .file__control--panel {
-    width: 100%;
-    padding: 65px 40px;
-    overflow-y: scroll;
-    &.empty__control--panel {
-      & > .file__get--started {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        height: 100%;
-        flex-direction: column;
-        & .get__started--image {
-          margin-bottom: 30px;
-        }
-        & > h6 {
-          color: #212b36;
-          font-size: 33px;
-          font-weight: 400;
-          margin-top: 0px;
-          margin-bottom: 20px;
-        }
-        & > p {
-          color: #637381;
-          font-size: 20px;
-          font-weight: 400;
-          margin: 0px;
-        }
-      }
-    }
-  }
-  & .file__details {
-    min-width: 260px;
-    max-width: 260px;
-    border-left: 1px solid #e8eef2;
-    padding: 25px;
-    // position: fixed;
-    // top:73px;
-    background-color: #fff;
-    // height:calc(100vh - 73px);
-    right: 0px;
-    & .file__info--wrap {
-      & .file__control {
-        margin-top: 15px;
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        & > .file__settings {
-          margin-left: 15px;
-          & a {
-            min-width: 40px;
-            min-height: 40px;
-            border-radius: 4px;
-            display: inline-flex;
-            align-items: center;
-            justify-content: center;
-            border: 1px solid #919eab;
-            color: #919eab;
-            text-decoration: none;
-            transition: 0.4s ease all;
-            &:hover {
-              background-color: #3c85ee;
-              color: #fff;
-            }
-          }
-        }
-        & > a {
-          width: 100%;
-          max-width: 150px;
-          height: 40px;
-          display: inline-flex;
-          align-items: center;
-          justify-content: center;
-          border: 1px solid #3c85ee;
-          border-radius: 4px;
-          color: #3c85ee;
-          font-size: 15px;
-          font-weight: 500;
-          text-decoration: none;
-          transition: 0.4s ease all;
-          &:hover {
-            background-color: #3c85ee;
-            color: #fff;
-          }
-        }
-      }
-      & .file__information {
-        & .elem__file--info {
-          display: flex;
-          margin-bottom: 7px;
-          &:last-child {
-            margin-bottom: 0px;
-          }
-          justify-content: flex-start;
-          & > span:nth-child(1) {
-            color: #637381;
-            font-size: 13px;
-            font-weight: 400;
-            margin-right: 35px;
-            line-height: 20px;
-            min-width: 50px;
-          }
-          & > span:nth-child(2) {
-            color: #212b36;
-            font-size: 13px;
-            font-weight: 400;
-            line-height: 20px;
-          }
-        }
-      }
-      & > .file__name {
-        margin: 20px 0px;
-        & p {
-          margin: 0px;
-          color: #212b36;
-          font-size: 16px;
-          font-weight: bold;
-          max-height: 54px;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          display: block;
-        }
-      }
-      & > .file__type {
-        & img {
-          display: flex;
-          width: auto;
-          max-width: 100%;
-        }
-      }
-    }
-    &.empty__details {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      & .file__details--inner {
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-        text-align: center;
-        & span {
-          display: flex;
-          justify-content: center;
-          align-items: center;
-        }
-        & p {
-          color: #637381;
-          font-size: 16px;
-          line-height: 24px;
-          font-weight: 400;
-          margin: 0px;
-          margin-top: 30px;
-        }
-      }
-    }
-  }
-}
-
-.settings__mobile__margin {
-  @media (max-width: $desktop-breakpoint) {
-    width: 64vw !important;
-  }
-}
-
-.settings__folder__margin {
-  margin-top: 32px !important;
-
-  @media (max-width: $desktop-breakpoint) {
-    margin-top: -10px !important;
-  }
-}
-
-.access__info--file {
-  & .settings__wrap {
-    & > a {
-      &.active__setting {
-        background-color: #3c85ee;
-        & i {
-          color: #fff !important;
-        }
-      }
-      min-width: 40px;
-      min-height: 40px;
-      border-radius: 250px;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      text-decoration: none;
-      transition: 0.4s ease all;
-      &:hover {
-        background-color: #3c85ee;
-        & i {
-          color: #fff !important;
-        }
-      }
-    }
-    & a i {
-      transition: 0.4s ease all;
-    }
-  }
-}
-
-.upload__mobile {
-  opacity: 0;
-  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-  filter: alpha(opacity=0);
-  -moz-opacity: 0;
-  -khtml-opacity: 0;
-  cursor: pointer;
-  position: absolute;
-  /* top: 63px; */
-  /* left: 0; */
-  /* bottom: 0; */
-  width: 100%;
-  top: 0;
-  background: red;
-  height: 41px;
-  margin-top: 3px;
-}
-
-.recent__table--wrap {
-  & .main__access {
-    display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(185px, 185px));
-    grid-column-gap: 20px;
-    grid-row-gap: 20px;
-    & .elem__access {
-      width: 100%;
-      border: 1px solid #ebe9f9;
-      border-radius: 4px;
-      overflow: hidden;
-      transition: 0.4s ease all;
-      cursor: pointer;
-      &:hover {
-        border: 1px solid #3c85ee;
-      }
-      & .access__image {
-        display: inline-flex;
-        min-height: 100px;
-        max-height: 100px;
-        align-items: center;
-        width: 100%;
-        background: white;
-        & > img {
-          width: 100%;
-          min-height: 100px;
-          max-height: 100px;
-          height: 100%;
-          display: flex;
-          object-fit: cover;
-        }
-      }
-      & .access__info--file {
-        padding-top: 10px;
-        padding-left: 10px;
-        padding-right: 10px;
-        padding-bottom: 15px;
-        display: flex;
-        flex-direction: column;
-        & > p {
-          margin: 0px;
-          color: #212b36;
-          font-size: 14px;
-          line-height: 16px;
-          font-weight: 400;
-          // display: flex;
-          max-width: 100%;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-        }
-        & > span {
-          color: #637381;
-          font-size: 12px;
-          line-height: 14px;
-          font-weight: 400;
-          display: flex;
-        }
-      }
-      &.active__recent {
-        &:hover {
-          background-color: #3c85ee;
-          & > td.settings__row i {
-            color: #fff;
-          }
-        }
-        background-color: #3c85ee;
-        & > td.location__row,
-        & > td.name__row > .inner__name--row > p,
-        & > td.modified__row,
-        & > td.settings__row i {
-          color: #fff;
-        }
-      }
-    }
-  }
-}
-
-// div {
-// 	&.fa-folder {
-// 		width: 40px !important;
-// 		height: 40px;
-// 		color: #3c85ee;
-// 	}
-// }
-
-.sorting__select {
-  border: none;
-  color: #212b36;
-  font-size: 14px;
-  font-weight: 500;
-  text-align: left;
-  -moz-appearance: none;
-  -webkit-appearance: none;
-  background: none;
-}
-
-.folders__image {
-  & > svg {
-    width: 40px !important;
-    height: 40px;
-    color: #3c85ee;
-  }
-}
-
-.folder__selected {
-  & > svg {
-    color: #fff;
-  }
-}
-
-.upload__overlay {
-  position: fixed;
-  top: 0px;
-  left: 0px;
-  display: none;
-  width: 100%;
-  height: 100vh;
-  z-index: 10;
-  & .inner__upload {
-    width: 100%;
-    height: 100vh;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background: rgba(33, 43, 54, 0.9);
-    flex-direction: column;
-    & > p {
-      margin: 0px;
-      color: #ffffff;
-      font-size: 33px;
-      line-height: 39px;
-      margin-top: 30px;
-    }
-  }
-}
-
-.no-extension__wrapper {
-  height: 27px;
-  width: 27px;
-  background: red;
-  border-radius: 3px;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-}
-
-.no-extension__title {
-  font-weight: 600;
-  font-size: 9.5px;
-  font-family: sans-serif;
-  color: white;
-}
-
-.upload__status {
-  position: fixed;
-  bottom: 0px;
-  right: 20px;
-  z-index: 5;
-  background: #ffffff;
-  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15), inset 0px 1px 0px #f5f7fa;
-  border-radius: 4px;
-  border-top-left-radius: 5px;
-  border-top-right-radius: 5px;
-  max-width: 315px;
-  overflow: hidden;
-  & .content__upload {
-    max-height: 300px;
-    overflow-y: scroll;
-    & > .elem__upload {
-      position: relative;
-      &.uploading__now {
-        &:hover {
-          & .stop__download {
-            display: block;
-          }
-          & .upload__size > span {
-            display: none;
-          }
-        }
-        & .stop__download {
-          position: absolute;
-          top: 20px;
-          cursor: pointer;
-          right: 20px;
-          display: none;
-          transition: 0.4s ease all;
-          &:hover {
-            opacity: 0.7;
-          }
-        }
-      }
-      &.uploaded__cancelled {
-        & > .upload__info {
-          & > .top__upload {
-            & > .retry__download {
-              & > a {
-                text-decoration: none;
-                transition: 0.4s ease all;
-                color: #3c85ee;
-                font-size: 13px;
-                font-weight: bold;
-                &:hover {
-                  opacity: 0.7;
-                }
-              }
-            }
-            margin-bottom: 5px;
-          }
-        }
-      }
-      padding: 20px;
-      display: flex;
-      justify-content: space-between;
-      align-items: flex-start;
-      transition: 0.4s ease all;
-      &:hover {
-        background: #f6f5fd;
-      }
-      & > .upload__info {
-        width: 100%;
-        & > .bottom__upload {
-          & .failed__info {
-            & > span {
-              display: inline-flex;
-              color: #bf0711;
-              font-size: 12px;
-              font-weight: 400;
-            }
-          }
-          & > .progress__upload {
-            width: 100%;
-            background: #e0dcf3;
-            border-radius: 1.5px;
-            height: 3px;
-            position: relative;
-            & .active__progress {
-              height: 3px;
-              background: #3c85ee;
-              border-radius: 1.5px;
-            }
-          }
-        }
-        & > .top__upload {
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          margin-bottom: 15px;
-          & > .upload__text {
-            padding-right: 30px;
-            & p {
-              // display: inline-flex;
-              // word-break:break-all;
-              // max-width:200px;
-              color: #0e1c71;
-              font-size: 15px;
-              line-height: 18px;
-              font-weight: 500;
-              max-width: 160px;
-              overflow: hidden;
-              white-space: nowrap;
-              text-overflow: ellipsis;
-            }
-          }
-          & > .upload__size {
-            & > span {
-              color: #637381;
-              font-size: 13px;
-              line-height: 16px;
-              font-weight: 400;
-            }
-          }
-          & p {
-            margin: 0px;
-          }
-        }
-      }
-      & > .upload__elem--status {
-        display: inline-flex;
-        margin-right: 12px;
-        & > img {
-          min-width: 26px;
-          max-width: 26px;
-        }
-      }
-    }
-  }
-  & .head__upload {
-    padding: 20px 15px;
-    background: #3c85ee;
-    min-width: 315px;
-    border-radius: 0px 0px 3px 3px;
-    display: flex;
-    align-items: center;
-    position: relative;
-    & .hide__upload {
-      position: absolute;
-      right: 15px;
-      display: inline-flex;
-      & > a {
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        padding: 5px;
-        transition: 0.4s ease all;
-        &:hover {
-          opacity: 0.7;
-        }
-      }
-    }
-    & > p {
-      color: #ffffff;
-      margin: 0px;
-      font-size: 15px;
-      line-height: 19px;
-    }
-  }
-}
-@media (max-width: 1200px) {
-  .file__container {
-    & > .file__control--panel {
-      padding: 25px 15px;
-    }
-  }
-  .main__wrapper--container {
-    padding-left: 15px;
-    padding-right: 15px;
-    &.settings__container {
-      & > .content__block {
-        & > .small__switcher--content {
-          max-width: 690px;
-        }
-      }
-    }
-    & > .content__block {
-      & .small__switcher--content {
-        padding-top: 15px;
-        display: flex;
-        justify-content: space-between;
-        max-width: 100%;
-        margin-left: auto;
-        margin-right: auto;
-        padding-left: 15px;
-        padding-right: 15px;
-        position: fixed;
-        z-index: 3;
-        width: 100%;
-        background: white;
-        margin-top: 0;
-        padding-bottom: 15px;
-        // top: 109px;
-        margin-top: -2px;
-        & > a {
-          text-decoration: none;
-          font-size: 30px;
-          color: #3c85ee;
-          transition: 0.4s ease all;
-          display: inline-flex;
-          margin-right: 23px;
-          &:hover {
-            opacity: 0.7;
-          }
-        }
-      }
-    }
-  }
-  .upload__status {
-    & > .head__upload {
-      padding: 15px 12px;
-    }
-    & .content__upload {
-      & > .elem__upload {
-        padding: 12px;
-      }
-    }
-  }
-}
-@media (max-width: 640px) {
-  // .small__switcher--content {
-  // 	width: 92% !important;
-  // }
-
-  .upload__overlay {
-    & .inner__upload {
-      & > p {
-        padding-left: 10px;
-        padding-right: 10px;
-        text-align: center;
-        font-size: 24px;
-      }
-    }
-  }
-  .main__wrapper--container {
-    min-height: auto;
-  }
-  .file__container {
-    & > .file__control--panel.empty__control--panel {
-      padding: 15px 0px;
-      & .file__get--started {
-        & > h6 {
-          font-size: 24px;
-          margin-bottom: 15px;
-          text-align: center;
-        }
-        & > p {
-          font-size: 16px;
-          text-align: center;
-        }
-        & > .get__started--image {
-          margin-bottom: 12px;
-          & > img {
-            max-width: 170px;
-          }
-        }
-      }
-    }
-  }
-  .upload__status {
-    right: 0px;
-    width: 100%;
-    border-radius: 0px;
-    max-width: 100%;
-    position: fixed;
-    bottom: 0px;
-    & > .head__upload {
-      padding: 10px;
-    }
-    & .content__upload {
-      // display: none;
-      max-height: 120px;
-      overflow-y: scroll;
-      & > .elem__upload {
-        padding: 10px;
-      }
-    }
-  }
-}
-
-@media (max-width: 500px) {
-  .recent__table--wrap {
-    & > .main__access {
-      grid-template-columns: repeat(auto-fit, minmax(40%, 48%));
-      grid-column-gap: 10px;
-      & .elem__access {
-        & > .access__image {
-          min-height: 85px;
-          max-height: 85px;
-          & > img {
-            min-height: 85px;
-            max-height: 85px;
-            object-fit: cover;
-          }
-        }
-      }
-    }
-  }
-}
-
-.location__row {
-  @media (max-width: 780px) {
-    display: none;
-  }
-
-  @media (max-width: $desktop-breakpoint) {
-    display: none;
-  }
-}
-
-.modified__row {
-  @media (max-width: 780px) {
-    display: none;
-  }
-
-  @media (max-width: $desktop-breakpoint) {
-    display: none;
-  }
-}
diff --git a/src/styles/components/file_panel.scss b/src/styles/components/file_panel.scss
deleted file mode 100644
index 4c17aea..0000000
--- a/src/styles/components/file_panel.scss
+++ /dev/null
@@ -1,1192 +0,0 @@
-// .recent__table {
-// 	pointer-events: auto;
-// }
-
-.content__block {
-  & .no__results {
-    width: 100%;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    & .results__image {
-      margin-bottom: 30px;
-      & > img {
-        max-width: 90px;
-      }
-    }
-    & > h6 {
-      color: #212b36;
-      font-size: 33px;
-      font-weight: 400;
-      margin: 0px;
-      margin-bottom: 20px;
-    }
-    & > p {
-      color: #637381;
-      font-size: 20px;
-      font-weight: 400;
-      margin: 0px;
-    }
-    & > p.searching__result {
-      color: #637381;
-      font-size: 13px;
-      font-weight: 400;
-      margin: 0px;
-      margin-top: 20px;
-      & > span {
-        color: #212b36;
-        font-size: 13px;
-        font-weight: 400;
-        display: inline-flex;
-        margin: 0px 2px;
-      }
-      & > a {
-        color: #3c85ee;
-        font-size: 13px;
-        font-weight: 500;
-        text-decoration: none;
-        transition: 0.4s ease all;
-        &:hover {
-          opacity: 0.7;
-        }
-      }
-    }
-  }
-  & .recent__table {
-    width: 100%;
-    border-collapse: collapse;
-    & tbody > tr:nth-child(1):hover {
-      background-color: #fff;
-    }
-    & tr {
-      position: relative;
-      // transform:scale(1);
-      &.moving__file {
-        width: 100%;
-        height: 75px;
-        & .inner__moving {
-          position: absolute;
-          left: 0px;
-          top: 0px;
-          width: 100%;
-          padding: 15px 20px;
-          height: 75px;
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          & > .moving__info {
-            width: 100%;
-            margin-right: 30px;
-          }
-          & p {
-            margin: 0px;
-            color: #212b36;
-            font-size: 16px;
-            font-weight: 400;
-          }
-          & span {
-            color: #637381;
-            font-size: 12px;
-            font-weight: 400;
-          }
-          & > .cancel__moving {
-            position: static;
-            transition: 0.4s ease all;
-            &:hover {
-              opacity: 0.7;
-            }
-          }
-          & .progress__moving {
-            width: 100%;
-            height: 3px;
-            background-color: #dae6ff;
-            position: relative;
-            margin-top: 7px;
-            border-radius: 25px;
-            & .active__progress {
-              height: 3px;
-              border-radius: 250px;
-              background-color: #5864ff;
-            }
-          }
-        }
-      }
-      & .delete__wrap {
-        position: absolute;
-        left: 0px;
-        width: 100%;
-        background-color: green;
-        top: 0px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        height: 100%;
-        background: rgba(149, 13, 20, 0.8);
-        & .delete__buttons {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          & > .keep__button {
-            min-width: 100px;
-            min-height: 35px;
-            display: inline-flex;
-            align-items: center;
-            justify-content: center;
-            border-radius: 4px;
-            transition: 0.4s ease all;
-            border: 1px solid #fff;
-            font-size: 15px;
-            line-height: 18px;
-            font-weight: 500;
-            text-decoration: none;
-            color: #fff;
-            transition: 0.4s ease all;
-            &:hover {
-              background-color: #fff;
-              color: #bf0711;
-            }
-          }
-          & > a.delete__button {
-            min-width: 100px;
-            min-height: 35px;
-            display: inline-flex;
-            align-items: center;
-            justify-content: center;
-            border-radius: 4px;
-            background-color: #fff;
-            transition: 0.4s ease all;
-            color: #bf0711;
-            font-size: 15px;
-            line-height: 18px;
-            font-weight: 500;
-            text-decoration: none;
-            margin-right: 10px;
-            &:hover {
-              opacity: 0.7;
-            }
-          }
-        }
-        & p {
-          margin: 0px;
-          margin-right: 20px;
-          color: #ffffff;
-          display: inline-flex;
-          font-size: 15px;
-          font-weight: 500;
-        }
-      }
-      &:nth-child(1) {
-        cursor: default;
-      }
-      & .settings__drop {
-        display: none;
-        position: absolute;
-        left: -60%;
-        right: 50%;
-        bottom: auto;
-        min-width: 215px;
-        background: #ffffff;
-        box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15), inset 0px 1px 0px #f5f7fa;
-        border-radius: 4px;
-        top: -100%;
-        margin-top: -5px;
-        transform: translate(0%, -80%);
-        z-index: 4;
-        & ul {
-          padding: 0px;
-          list-style-type: none;
-          margin: 0px;
-          & li {
-            & a {
-              display: flex;
-              width: 100%;
-              padding: 12px 20px;
-              align-items: center;
-              font-weight: 400;
-              justify-content: flex-start;
-              text-decoration: none;
-              transition: 0.4s ease all;
-              & a {
-                & img {
-                  transition: 0.4s ease all;
-                }
-              }
-              &:hover {
-                background: #f6f5fd;
-                color: #3c85ee;
-                font-weight: 500;
-                & img {
-                  filter: invert(43%) sepia(91%) saturate(1645%)
-                    hue-rotate(198deg) brightness(96%) contrast(94%);
-                  //filter: invert(66%) sepia(149%) saturate(3678%) hue-rotate(239deg) brightness(72%) contrast(113%);
-                }
-              }
-              & span {
-                display: inline-flex;
-                margin-right: 18px;
-              }
-            }
-          }
-        }
-      }
-      cursor: pointer;
-      &.active__recent {
-        &:hover {
-          background-color: #3c85ee;
-          & > td.settings__row i {
-            color: #fff;
-          }
-        }
-        background-color: #3c85ee;
-        & > td.location__row,
-        & > td.name__row > .inner__name--row > p,
-        & > td.modified__row,
-        & > td.settings__row i {
-          color: #fff;
-        }
-      }
-      transition: 0.4s ease all;
-      & .settings__wrap {
-        & > a {
-          &.active__setting {
-            background-color: #3c85ee;
-            & i {
-              color: #fff !important;
-            }
-          }
-          min-width: 40px;
-          min-height: 40px;
-          border-radius: 250px;
-          display: inline-flex;
-          align-items: center;
-          justify-content: center;
-          text-decoration: none;
-          transition: 0.4s ease all;
-          &:hover {
-            background-color: #3c85ee;
-            & i {
-              color: #fff !important;
-            }
-          }
-        }
-        & a i {
-          transition: 0.4s ease all;
-        }
-      }
-    }
-    & tr:hover {
-      background-color: #f6f5fd;
-      & .settings__wrap {
-        position: relative;
-        & a i {
-          color: #3c85ee;
-        }
-      }
-    }
-    & tr > td.location__row,
-    & tr > td.modified__row {
-      color: #212b36;
-      font-size: 14px;
-      font-weight: 400;
-    }
-    & tr > td.modified__row,
-    & tr > th.modified__row {
-      min-width: 150px;
-      padding-right: 10px;
-      padding-left: 10px;
-      transition: 0.4s ease all;
-    }
-    & tr > th.size__row {
-      min-width: 90px;
-      padding-right: 10px;
-      padding-left: 10px;
-    }
-    & tr > td.size__row {
-      margin: 0px;
-      min-width: 90px;
-      align-items: center;
-      color: #212b36;
-      font-size: 14px;
-      font-weight: 400;
-      transition: 0.4s ease all;
-      padding-right: 10px;
-      padding-left: 10px;
-      min-height: 71px;
-    }
-    & tr > td.location__row,
-    & tr > th.location__row {
-      min-width: 190px;
-      padding-right: 10px;
-      padding-left: 10px;
-      transition: 0.4s ease all;
-    }
-    & tr > td.settings__row,
-    & tr > th.settings__row {
-      padding-right: 20px;
-      min-width: 120px;
-      & .settings__wrap {
-        & a {
-          color: #919eab;
-        }
-        position: relative;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        @media (max-width: $desktop-breakpoint) {
-          width: 58vw;
-        }
-      }
-    }
-    & tr > td.name__row,
-    & tr > th.name__row {
-      // width:100%;
-      padding-left: 20px;
-      text-align: left;
-      transition: 0.4s ease all;
-      & .edit__name {
-        width: 100%;
-        position: relative;
-        display: flex;
-        align-items: center;
-        & > input {
-          width: 100%;
-          min-height: 42px;
-          border: 1px solid #bec9d3;
-          padding-left: 15px;
-          padding-right: 80px;
-          font-size: 14px;
-          color: #212b36;
-          border-radius: 5px;
-          caret-color: #3c85ee;
-        }
-        & > a {
-          position: absolute;
-          right: 10px;
-          min-width: 62px;
-          min-height: 28px;
-          display: inline-flex;
-          align-items: center;
-          justify-content: center;
-          border: 1px solid #3c85ee;
-          border-radius: 4px;
-          color: #3c85ee;
-          font-size: 13px;
-          font-weight: 500;
-          text-decoration: none;
-          transition: 0.4s ease all;
-          &:hover {
-            color: #fff;
-            background-color: #3c85ee;
-          }
-        }
-      }
-      & .inner__name--row {
-        display: flex;
-        align-items: center;
-        & p {
-          // margin:0px;
-          // // word-break:break-all;
-          // max-width: 33%;
-          // max-height: 30px;
-          // overflow: hidden;
-          // text-overflow: ellipsis;
-          // word-break: break-word;
-          margin: 0px;
-          // max-width: 50%;
-          max-height: 30px;
-          overflow: hidden;
-          white-space: nowrap;
-          text-overflow: ellipsis;
-          display: block;
-        }
-      }
-      & p {
-        margin: 0px;
-        display: inline-flex;
-        align-items: center;
-        color: #212b36;
-        font-size: 14px;
-        font-weight: 400;
-        transition: 0.4s ease all;
-      }
-      & .extension__wrap {
-        display: inline-flex;
-        align-items: center;
-        margin-right: 15px;
-        max-width: 27px;
-        min-width: 27px;
-        min-height: 27px;
-        max-height: 27px;
-      }
-    }
-    & tr > td {
-      padding-top: 15px;
-      padding-bottom: 15px;
-      border-bottom: 1px solid #e8eef2;
-    }
-    & tr > th {
-      padding-bottom: 10px;
-      border-bottom: 1px solid #e8eef2;
-      & a {
-        display: inline-flex;
-        margin-left: 5px;
-      }
-      color: #212b36;
-      font-size: 14px;
-      font-weight: 500;
-      text-align: left;
-    }
-  }
-  & .file__view {
-    margin-top: 50px;
-    & .recent__table--wrap {
-      & .head__recent--files {
-        display: flex;
-        justify-content: space-between;
-        margin-bottom: 20px;
-        & > h2 {
-          color: #212b36;
-          font-size: 22px;
-          font-weight: 500;
-          line-height: 26px;
-          margin: 0px;
-        }
-        & .view__recent {
-          & ul {
-            display: flex;
-            align-items: center;
-            list-style-type: none;
-            margin: 0px;
-            padding: 0px;
-            & li {
-              &.active__view {
-                & a {
-                  color: #3c85ee;
-                }
-              }
-              margin-right: 15px;
-              & a:hover {
-                color: #3c85ee;
-              }
-              & a {
-                transition: 0.4s ease all;
-                color: #919eab;
-              }
-              &:last-child {
-                margin-right: 0px;
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-  & .file__control--panel {
-    &.folder__view {
-      &.file__control--panel {
-        & .settings__row {
-          & .settings__wrap {
-            & > .settings__drop {
-              left: 20%;
-              transform: translate(-100%, -40%);
-            }
-          }
-        }
-      }
-      padding-top: 65px;
-      & > .results__files {
-        margin-bottom: 25px;
-        & > p.searching__result {
-          color: #637381;
-          font-size: 13px;
-          font-weight: 400;
-          margin: 0px;
-          display: inline-flex;
-          & > span {
-            color: #212b36;
-            font-size: 13px;
-            font-weight: 400;
-            display: inline-flex;
-            margin: 0px 3px;
-            &.current__folder {
-              margin-right: 0px;
-            }
-          }
-          & > a {
-            color: #3c85ee;
-            font-size: 13px;
-            font-weight: 500;
-            text-decoration: none;
-            transition: 0.4s ease all;
-            &:hover {
-              opacity: 0.7;
-            }
-          }
-        }
-        & > h2 {
-          margin-top: 0px;
-          margin-bottom: 5px;
-          color: #637381;
-          font-size: 18px;
-          line-height: 24px;
-          font-weight: 400;
-          & > .result__search--word {
-            color: #212b36;
-            font-weight: 500;
-            font-size: 18px;
-          }
-        }
-      }
-      & > .file__view {
-        // margin-top:0px;
-        & > .recent__table--wrap {
-          & > .head__recent--files {
-            & .path__files {
-              display: flex;
-              align-items: center;
-              & > a {
-                color: #637381;
-                font-size: 18px;
-                line-height: 21px;
-                font-weight: 500;
-                margin: 0px;
-                text-decoration: none;
-                transition: 0.4s ease all;
-                &:hover {
-                  opacity: 0.7;
-                }
-              }
-              & > p {
-                color: #212b36;
-                font-size: 18px;
-                line-height: 21px;
-                font-weight: 500;
-                margin: 0px;
-                white-space: nowrap;
-              }
-              & .spacer__path {
-                display: inline-flex;
-                margin: 0px 10px;
-              }
-            }
-          }
-        }
-      }
-    }
-    & .folders__panel {
-      // margin-top:50px;
-      & .inner__folders {
-        display: grid;
-        grid-template-columns: repeat(auto-fit, minmax(185px, 185px));
-        grid-column-gap: 20px;
-        grid-row-gap: 20px;
-        & .elem__folders {
-          padding: 12px;
-          border: 1px solid #ebe9f9;
-          border-radius: 4px;
-          overflow: hidden;
-          cursor: pointer;
-          transition: 0.4s ease all;
-          &.active__folder {
-            background-color: #3c85ee;
-            & .folders__image {
-              -webkit-touch-callout: none;
-              -webkit-user-select: none;
-              -khtml-user-select: none;
-              -moz-user-select: none;
-              -ms-user-select: none;
-              user-select: none;
-              & i {
-                color: #fff;
-                -webkit-touch-callout: none;
-                -webkit-user-select: none;
-                -khtml-user-select: none;
-                -moz-user-select: none;
-                -ms-user-select: none;
-                user-select: none;
-                ::before {
-                  content: "\f07b";
-                }
-              }
-            }
-            & .folder__info {
-              -webkit-touch-callout: none;
-              -webkit-user-select: none;
-              -khtml-user-select: none;
-              -moz-user-select: none;
-              -ms-user-select: none;
-              user-select: none;
-              & > p {
-                color: #fff;
-              }
-              & > ul {
-                & li {
-                  color: #fff;
-                }
-              }
-            }
-          }
-          &:hover {
-            border-color: #3c85ee;
-          }
-          & .folder__info {
-            margin-top: 8px;
-            -webkit-touch-callout: none;
-            -webkit-user-select: none;
-            -khtml-user-select: none;
-            -moz-user-select: none;
-            -ms-user-select: none;
-            user-select: none;
-            & > p {
-              margin: 0px;
-              color: #212b36;
-              font-size: 15px;
-              line-height: 18px;
-              font-weight: 500;
-              margin-bottom: 5px;
-              transition: 0.4s ease all;
-              max-width: 97%;
-              overflow: hidden;
-              // word-break: break-word;
-              //max-height: 36px;
-              white-space: nowrap;
-              text-overflow: ellipsis;
-            }
-            & ul {
-              display: flex;
-              padding: 0px;
-              list-style-type: none;
-              margin: 0px;
-              transition: 0.4s ease all;
-              & li {
-                display: inline-flex;
-                color: #637381;
-                font-size: 12px;
-                line-height: 14px;
-                transition: 0.4s ease all;
-              }
-              & .spacer__folder {
-                display: inline-flex;
-                margin: 0px 4px;
-              }
-            }
-          }
-          & .folders__image {
-            & i {
-              color: #3c85ee;
-              font-size: 40px;
-              transition: 0.4s ease all;
-
-              ::before {
-                content: "\f07b";
-              }
-            }
-          }
-        }
-      }
-      & .head__folders {
-        & > h2 {
-          margin: 0px;
-          margin-bottom: 20px;
-          color: #212b36;
-          font-size: 22px;
-          font-weight: 500;
-        }
-      }
-    }
-    & .quick__access {
-      & .main__access {
-        display: grid;
-        grid-template-columns: repeat(auto-fit, minmax(185px, 185px));
-        grid-column-gap: 20px;
-        grid-row-gap: 20px;
-        & .elem__access {
-          width: 100%;
-          border: 1px solid #ebe9f9;
-          border-radius: 4px;
-          overflow: hidden;
-          transition: 0.4s ease all;
-          cursor: pointer;
-          &:hover {
-            border: 1px solid #3c85ee;
-          }
-          & .access__image {
-            display: inline-flex;
-            min-height: 100px;
-            max-height: 100px;
-            align-items: center;
-            width: 100%;
-            background: white;
-            & > img {
-              width: 100%;
-              min-height: 100px;
-              max-height: 100px;
-              height: 100%;
-              display: flex;
-              object-fit: cover;
-            }
-          }
-          & .access__info--file {
-            padding-top: 10px;
-            padding-left: 10px;
-            padding-right: 10px;
-            padding-bottom: 15px;
-            //display: flex;
-            flex-direction: column;
-            // white-space: nowrap;
-            max-width: 98%;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            display: block;
-            & > p {
-              margin: 0px;
-              color: #212b36;
-              font-size: 14px;
-              line-height: 16px;
-              font-weight: 400;
-              // display: flex;
-              max-width: 100%;
-              overflow: hidden;
-              text-overflow: ellipsis;
-              white-space: nowrap;
-            }
-            & > span {
-              color: #637381;
-              font-size: 12px;
-              line-height: 14px;
-              font-weight: 400;
-              display: flex;
-            }
-          }
-          &.active__recent {
-            &:hover {
-              background-color: #3c85ee;
-              & > td.settings__row i {
-                color: #fff;
-              }
-            }
-            background-color: #3c85ee;
-            & > td.location__row,
-            & > td.name__row > .inner__name--row > p,
-            & > td.modified__row,
-            & > td.settings__row i {
-              color: #fff;
-            }
-          }
-        }
-      }
-      & > .head__access {
-        & > h2 {
-          margin: 0px;
-          margin-bottom: 20px;
-          color: #212b36;
-          font-size: 22px;
-          font-weight: 500;
-        }
-      }
-    }
-  }
-}
-
-.noSelect {
-  -webkit-touch-callout: none;
-  -webkit-user-select: none;
-  -khtml-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-}
-
-.context__menu--wrapper {
-  & .settings__drop {
-    display: none;
-    position: absolute;
-    min-width: 215px;
-    background: #ffffff;
-    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15), inset 0px 1px 0px #f5f7fa;
-    border-radius: 4px;
-    margin-top: -5px;
-    z-index: 2;
-    // @media (max-width: $desktop-breakpoint) {
-    // 	transform: translate(-6%,-80%) !important;
-    // }
-    & ul {
-      padding: 0px;
-      list-style-type: none;
-      margin: 0px;
-      & li {
-        & a {
-          display: flex;
-          width: 100%;
-          padding: 12px 20px;
-          align-items: center;
-          font-weight: 400;
-          justify-content: flex-start;
-          text-decoration: none;
-          transition: 0.4s ease all;
-          & a {
-            & img {
-              transition: 0.4s ease all;
-            }
-          }
-          &:hover {
-            background: #f6f5fd;
-            color: #3c85ee;
-            font-weight: 500;
-            & img {
-              filter: invert(43%) sepia(91%) saturate(1645%) hue-rotate(198deg)
-                brightness(96%) contrast(94%);
-              //filter: invert(66%) sepia(149%) saturate(3678%) hue-rotate(239deg) brightness(72%) contrast(113%);
-            }
-          }
-          & span {
-            display: inline-flex;
-            margin-right: 18px;
-          }
-        }
-      }
-    }
-  }
-}
-
-// .recent__table {
-// 	@media (max-width: $desktop-breakpoint) {
-
-//         min-width: 129vw;
-//     }
-// }
-
-.folders__panel {
-  margin-top: 35px;
-
-  @media (max-width: 1200px) {
-    margin-top: 35px;
-  }
-}
-
-.folders__panel__folder {
-  margin-top: 0px;
-
-  // @media (max-width: $desktop-breakpoint) {
-  //     margin-top: 50px;
-  // }
-
-  @media (max-width: 1200px) {
-    margin-top: 50px;
-  }
-}
-
-.path__files {
-  & p {
-    max-width: 300px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-
-    @media (max-width: 1200px) {
-      max-width: 50vw;
-    }
-  }
-}
-
-.quick__access {
-  height: 221px;
-  overflow: hidden;
-}
-
-@media (max-width: 1200px) {
-  .results__files {
-    margin-top: 50px;
-  }
-  .quick__access {
-    margin-top: 33px;
-  }
-  .content__block {
-    & .file__control--panel.folder__view {
-      padding-top: 25px;
-    }
-    & .recent__table {
-      & tr {
-        & .settings__drop {
-          left: 20%;
-          transform: translate(-100%, -40%);
-        }
-      }
-    }
-  }
-  .file__container {
-    & .file__details {
-      // z-index: 6;
-      // top:0px;
-      // right:-260px;
-      // height: 100vh;
-      // transition:.5s ease all;
-    }
-  }
-}
-
-.name__row-filename {
-  //max-width: 50%;
-  max-width: 353px;
-
-  @media (max-width: 1500px) {
-    max-width: 250px;
-  }
-
-  @media (max-width: 1400px) {
-    max-width: 150px;
-  }
-
-  @media (max-width: 1300px) {
-    max-width: 80px;
-  }
-
-  @media (max-width: 1200px) {
-    max-width: 400px;
-  }
-
-  @media (max-width: 1000px) {
-    max-width: 300px;
-  }
-
-  @media (max-width: 900px) {
-    max-width: 250px;
-  }
-
-  @media (max-width: $desktop-breakpoint) {
-    max-width: 50vw;
-  }
-}
-
-.recent__table {
-  @media (max-width: $desktop-breakpoint) {
-    table-layout: fixed;
-  }
-}
-
-@media (max-width: 767px) {
-  // .inner__name--row {
-  // 	display: flex;
-  // 	align-items:center;
-  // 		& p{
-  // 				// margin:0px;
-  // 				// // word-break:break-all;
-  // 				// max-width: 33%;
-  // 				// max-height: 30px;
-  // 				// overflow: hidden;
-  // 				// text-overflow: ellipsis;
-  // 				// word-break: break-word;
-  // 				margin: 0px;
-  // 				max-width: 25%;
-  // 				max-height: 30px;
-  // 				overflow: hidden;
-  // 				white-space: nowrap;
-  // 				text-overflow: ellipsis;
-  // 				display: block;
-
-  // 			}
-  // }
-
-  .file__view {
-    margin-top: 0px !important;
-  }
-
-  .file__container {
-    & > .file__control--panel {
-      padding: 25px 0px;
-    }
-  }
-  .content__block {
-    & > .file__container {
-      & > .file__control--panel {
-        & > .quick__access {
-          & > .main__access {
-            grid-template-columns: repeat(auto-fit, minmax(165px, 165px));
-          }
-        }
-        & > .folders__panel {
-          & > .inner__folders {
-            grid-template-columns: repeat(auto-fit, minmax(165px, 165px));
-          }
-        }
-        & > .file__view {
-          & > .recent__table--wrap {
-            & > .head__recent--files {
-              // margin-bottom:-80px;
-            }
-          }
-
-          & > .recent__table--wrap {
-            overflow-x: hidden;
-            padding-top: 32px;
-            // pointer-events: none;
-          }
-        }
-      }
-    }
-
-    & .file__control--panel.folder__view {
-      & > .file__view {
-        & > .recent__table--wrap {
-          & > .head__recent--files {
-            // margin-bottom:-80px;
-          }
-        }
-        & > .recent__table--wrap {
-          overflow-x: hidden;
-          padding-top: 32px;
-          // pointer-events: none;
-        }
-      }
-    }
-    & .recent__table {
-      width: 100%;
-      min-width: 125vw;
-      max-width: 100%;
-    }
-  }
-}
-@media (max-width: 480px) {
-  .content__block {
-    & .recent__table {
-      & tr {
-        & .settings__drop {
-          min-width: 170px;
-          & ul {
-            & li {
-              & a {
-                & span {
-                  margin-right: 10px;
-                }
-                padding: 10px 12px;
-                font-size: 14px;
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-  .content__block {
-    & > .file__container {
-      & > .file__control--panel {
-        & > .quick__access {
-          & > .main__access {
-            grid-template-columns: repeat(auto-fit, minmax(40%, 47%));
-          }
-        }
-        & > .folders__panel {
-          & > .inner__folders {
-            grid-template-columns: repeat(auto-fit, minmax(40%, 47%));
-          }
-        }
-      }
-    }
-    & .file__control--panel.folder__view {
-      padding-top: 15px;
-      & .file__view {
-        & .recent__table--wrap {
-          & .head__recent--files {
-            flex-direction: column;
-            justify-content: center;
-            align-items: center;
-            position: relative;
-            // z-index:4;
-            & > .view__recent {
-              margin-top: 15px;
-            }
-            & > .path__files {
-              flex-wrap: wrap;
-              & > a {
-                font-size: 15px;
-                line-height: 17px;
-              }
-              & > .current__folder {
-                font-size: 15px;
-                line-height: 17px;
-                white-space: nowrap;
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-}
-@media (max-width: 400px) {
-  .content__block {
-    & > .file__container {
-      & > .file__control--panel {
-        & > .quick__access {
-          & > .main__access {
-            grid-template-columns: repeat(auto-fit, minmax(40%, 47%));
-            grid-column-gap: 10px;
-            & .elem__access {
-              & > .access__image {
-                min-height: 85px;
-                max-height: 85px;
-                & > img {
-                  min-height: 85px;
-                  max-height: 85px;
-                  object-fit: cover;
-                }
-              }
-            }
-          }
-        }
-        & > .folders__panel {
-          & > .inner__folders {
-            grid-template-columns: repeat(auto-fit, minmax(40%, 47%));
-            grid-column-gap: 10px;
-            & .elem__access {
-              & > .access__image {
-                min-height: 85px;
-                max-height: 85px;
-                & > img {
-                  min-height: 85px;
-                  max-height: 85px;
-                  object-fit: cover;
-                }
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-}
-
-.name__row {
-  @media (max-width: 767px) {
-    width: 46%;
-  }
-
-  @media (max-width: $desktop-breakpoint) {
-    width: 40%;
-  }
-}
-
-// .inner__name--row {
-// 	@media (max-width: $desktop-breakpoint) {
-
-//         display: flex;
-// 		align-items:center;
-// 				& p{
-// 					// margin:0px;
-// 					// // word-break:break-all;
-// 					// max-width: 33%;
-// 					// max-height: 30px;
-// 					// overflow: hidden;
-// 					// text-overflow: ellipsis;
-// 					// word-break: break-word;
-// 					margin: 0px;
-// 					max-width: 25%;
-// 					max-height: 30px;
-// 					overflow: hidden;
-// 					white-space: nowrap;
-// 					text-overflow: ellipsis;
-// 					display: block;
-
-// 				}
-//     }
-// }
diff --git a/src/styles/components/main.scss b/src/styles/components/main.scss
deleted file mode 100644
index 493c63e..0000000
--- a/src/styles/components/main.scss
+++ /dev/null
@@ -1,4 +0,0 @@
-@import '../components/body';
-@import "../components/file_content";
-@import "../components/file_panel";
-@import "../components/modals";
diff --git a/src/styles/components/modals.scss b/src/styles/components/modals.scss
deleted file mode 100644
index 226de53..0000000
--- a/src/styles/components/modals.scss
+++ /dev/null
@@ -1,593 +0,0 @@
-.modal__wrap{
-	position: fixed;
-	top:0px;
-	left:0px;
-	width:100%;
-	height:100vh;
-	z-index:8;
-	background: rgba(33, 43, 54, 0.9);
-	& .inner__modal{
-		display: flex;
-		width:100%;
-		height:100%;
-		justify-content:center;
-		align-items:center;
-		& .destination__modal{
-			width:100%;
-			max-width:460px;
-			background-color:#fff;
-			&>.destination__structure{
-				&>.folder__structure{
-					& .selected__destination{
-						background-color:#3c85ee!important;
-						&>span{
-							&>i{
-								color:#fff!important;
-							}
-						}
-						&>.info__name{
-							&>p{
-								color:#fff!important;
-								&>span>i{
-									color:#fff!important;
-								}
-							}
-						}
-					}
-					&>.elem__structure{
-						cursor: pointer;
-					    margin-bottom: 15px;
-					    &{
-							&>.child__structure{
-								& p{
-									font-size:14px!important;
-								}
-								&>.elem__structure{
-									&>.parent__structure{
-										padding-left:55px;
-									}
-									&>.child__structure{
-										&>.elem__structure{
-											&>.parent__structure{
-												padding-left:65px;
-											}
-											&>.child__structure{
-												padding-left:10px;
-											}
-										}
-									}
-								}
-							}
-						}
-					    & .parent__structure{
-				    	    display: flex;
-						    align-items: center;
-						    margin-bottom: 0px;
-						    padding-left:45px;
-						    padding-right:25px;
-						    min-height:40px;
-						    transition:.4s ease all;
-						    &.last__structure{
-						    	&>.info__name{
-						    		&>p{
-						    			padding-left:9px;
-						    		}
-						    	}
-						    }
-						    &>span{
-						    	&>i{
-						    		transition:.4s ease all;
-						    	}
-						    }
-						    &.active__parent{
-								&:last-child{
-									margin-bottom:0px;
-								}
-								&>span{
-									& i{
-										transform:rotate(90deg);
-									}
-								}
-							}
-						    &:hover{
-						    	&>span>img{
-						    		width:80px;
-						    	}
-								background-color:#3c85ee;
-								& *{
-									color:#fff!important;
-								}
-						    }
-						    & .info__name{
-						    	position: relative;
-						    	& p{
-						    		color: #2E2E38;
-								    font-size: 16px;
-								    font-weight: 400;
-								    margin: 0px;
-								    display: flex;
-								    align-items:center;
-								    &>span{
-								    	display: inline-flex;
-								    	margin-right:7px;
-								    	&>i{
-								    		color:#3c85ee;
-								    		font-size:20px;
-								    	}
-								    }
-						    	}
-						    }
-						    &>span{
-						    	&>i{
-						    		color:#7780AF;
-						    		font-size:20px;
-						    	}
-					    	    padding-right: 10px;
-							    transition: .4s ease all;
-						    }
-					    }
-					}
-				}
-			}
-			& .destination__move{
-				padding:15px 0px;
-				display: flex;
-				justify-content:center;
-				align-items:center;
-				border-top:1px solid #E9ECFB;
-				& a{
-					min-width:150px;
-					min-height:45px;
-					display: inline-flex;
-					align-items:center;
-					justify-content:center;
-					background-color:#3c85ee;
-					border-radius:5px;
-					color:#FFFFFF;
-					font-size:15px;
-					font-weight:bold;
-					text-decoration:none;
-					transition:.4s ease all;
-					&:hover{
-						opacity:.7;
-					}
-				}
-			}
-			& .destination__structure{
-				padding:20px 0px
-			}
-			& .destination__head{
-				padding: 18px 30px;
-			    position: relative;
-			    display: flex;
-			    align-items: center;
-			    justify-content: flex-start;
-			    border-bottom: 1px solid #DFE2F3;
-				&>h2{
-					margin:0px;
-					color:#212B36;
-					font-size:16px;
-					font-weight:400;
-				}
-				&>.close__modal{
-					position: absolute;
-					right:20px;
-					&>a{
-						transition:.4s ease all;
-						&:hover{
-							opacity:.7;
-						}
-						&>img{
-							cursor: pointer;
-						}
-					}
-				}
-			}
-		}
-		& .password__modal{
-			width:100%;
-			max-width:460px;
-			background-color:#fff;
-			& .password__content{
-				padding-top:15px;
-				padding-bottom:35px;
-				padding-left: 30px;
-				padding-right:30px;
-				&>form{
-					& .password__submit{
-						& input[type="submit"]{
-						    width: 100%;
-						    height: 48px;
-						    background: #3c85ee;
-						    border: 1px solid #3c85ee;
-						    border-radius: 5px;
-						    color: #FFFFFF;
-						    font-size: 15px;
-						    line-height: 24px;
-						    font-weight: 500;
-						    cursor: pointer;
-						    transition: .4s ease all;
-						    &:hover{
-						    	opacity:.7;
-							}
-						}
-						& div {
-						    width: 100%;
-						    height: 48px;
-						    background: #3c85ee;
-						    border: 1px solid #3c85ee;
-						    border-radius: 5px;
-						    color: #FFFFFF;
-						    font-size: 15px;
-						    line-height: 24px;
-						    font-weight: 500;
-						    cursor: pointer;
-							transition: .4s ease all;
-							position: relative;
-						    &:hover{
-						    	opacity:.7;
-							}
-							& input[type="file"]{
-								width: 100%;
-								height: 100%;
-								opacity: 0;
-							}
-							& p {
-								position: absolute;
-								left: 0;
-								top: -3px;
-								right: 0;
-								text-align: center;
-								pointer-events: none;
-							}
-						}
-						& button {
-							width: 100%;
-							height: 48px;
-							background: #3c85ee;
-							border: 1px solid #3c85ee;
-							border-radius: 5px;
-							color: #FFFFFF;
-							font-size: 15px;
-							line-height: 24px;
-							font-weight: 500;
-							cursor: pointer;
-							transition: .4s ease all;
-							&:hover{
-								opacity:.7;
-							}
-						}
-					}
-					& .group__password{
-						width:100%;
-						margin-bottom:20px;
-						&:last-child{
-							margin-bottom:0px;
-						}
-						&>input{
-						    width: 100%;
-						    min-height: 48px;
-						    border: 1px solid #BEC9D3;
-						    padding-left: 15px;
-						    outline:none;
-						    padding-right: 15px;
-						    font-size: 16px;
-						    color: #000;
-						    border-radius: 5px;
-						}
-					}
-				}
-			}
-			& .head__password{
-			    padding: 18px 30px;
-			    position: relative;
-			    display: flex;
-			    align-items: center;
-			    justify-content: flex-start;
-			    border-bottom: 1px solid #DFE2F3;
-			    &>.close__modal{
-					position: absolute;
-					right:20px;
-					&>a{
-						transition:.4s ease all;
-						&:hover{
-							opacity:.7;
-						}
-						&>img{
-							cursor: pointer;
-						}
-					}
-				}
-			    &>h2{
-			    	color:#212B36;
-			    	font-size:16px;
-			    	font-weight:400;
-			    	margin:0px;
-			    }
-			}
-		}
-		& .share__modal{
-			width:100%;
-			max-width:460px;
-			background-color:#fff;
-			&>div{
-				&.get__share--link{
-					padding:25px 30px;
-					&>p{
-						margin-bottom:7px;
-						margin-top:0px;
-						color:#212B36;
-						font-size:15px;
-						font-weight:400;
-					}
-					&>.get__link{
-						& .copied__wrap{
-							position: absolute;
-							min-width:85px;
-							right:-19px;
-							top:-32px;
-							height:30px;
-							background: rgba(44, 46, 47, 0.9);
-							box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.15), 0px 1px 0px rgba(0, 0, 0, 0.05);
-							border-radius: 5px;
-							display:none;
-							text-align:center;
-							align-items:center;
-							justify-content:center;
-							&:before{
-								content:"";
-								position: absolute;
-								border-left: 7px solid transparent;
-								border-right: 7px solid transparent;
-								border-top: 7px solid rgba(44, 46, 47, 0.9);
-								top:30px;
-								background:url('/assets/triangle.png');
-								background-repeat: no-repeat;
-								background-size:cover;
-								background-position:center;
-								left: 50%;
-							    transform: translate(-50%, 0);
-							}
-							& img{
-								margin-right:7px;
-								display: inline-flex;
-							}
-							& p{
-								color:#fff;
-								font-size:13px;
-								font-weight:400;
-								margin:0px;
-								display: inline-flex;
-								min-height:30px;
-								align-items:center;
-							}
-						}
-						position: relative;
-						display: flex;
-						align-items:center;
-						&>input{
-							width: 100%;
-						    height: 48px;
-						    padding-left: 12px;
-						    padding-right: 35px;
-						    color: #000;
-						    border: 1px solid #637381;
-						    border-radius: 5px;
-						    outline: none;
-						    font-size: 15px;
-						}
-						&>a{
-							position: absolute;
-							right:10px;
-							display: inline-flex;
-							align-items:center;
-							justify-content:center;
-							transition:.4s ease all;
-							&:hover{
-								opacity:.7;
-							}
-						}
-					}
-				}
-				width:100%;
-				&.share__recipient{
-					& .share__success{
-						margin-top: 15px;
-						& p{
-							& span{
-								display: inline-flex;
-								margin-right:7px;
-							}
-							color:#00CF92;
-							font-size:15px;
-							font-weight:400;
-							margin:0px;
-							display: inline-flex;
-							align-items:center;
-						}
-					}
-					padding:25px 30px;
-					border-bottom:1px solid #DFE2F3;
-					&>form{
-						display: flex;
-						width:100%;
-						&>.group__submit{
-							& input{
-								min-height:48px;
-								min-width:70px;
-								display: inline-flex;
-								align-items:center;
-								justify-content:center;
-								background-color:#3c85ee;
-								color:#fff;
-								font-size:15px;
-								font-weight:bold;
-								line-height:24px;
-								text-decoration:none;
-								border:0px;
-								border-radius:4px;
-								transition:.4s ease all;
-								cursor:pointer;
-								&:hover{
-									opacity:.7;
-								}
-							}
-						}
-						&>.group__input{
-							width:100%;
-							margin-right: 15px;
-							position: relative;
-							display: flex;
-							align-items:center;
-							&>span{
-								position: absolute;
-								left:12px;
-								font-size:16px;
-								top:14px;
-								transition:.3s ease all;
-								color:#212B36;
-							}
-							& input{
-								width: 100%;
-							    height: 48px;
-							    padding-left: 12px;
-							    padding-right: 12px;
-							    color: #000;
-							    border: 1px solid #637381;
-							    border-radius: 5px;
-							    outline: none;
-							    font-size: 15px;
-							}
-						}
-					}
-					&>p{
-						margin-bottom:7px;
-						margin-top:0px;
-						color:#212B36;
-						font-size:15px;
-						font-weight:400;
-					}
-				}
-				&.share__head{
-					padding:18px 30px;
-					position: relative;
-					display: flex;
-					align-items:center;
-					justify-content:flex-start;
-					border-bottom:1px solid #DFE2F3;
-					&>.share__info{
-						display: flex;
-						flex-direction:column;
-						& p{
-							margin:0px;
-							color:#212B36;
-							font-size:15px;
-							font-weight:400;
-							// display: inline-flex;
-							white-space: nowrap;
-							overflow: hidden;
-							text-overflow: ellipsis;
-							max-width: 329px;
-							@media (max-width:500px) {
-    							max-width: 283px;
-							}
-							@media (max-width:500px) {
-    							max-width: 283px;
-							}
-							@media (max-width:400px) {
-    							max-width: 200px;
-							}
-							@media (max-width:280px) {
-    							max-width: 151px;
-							}
-						}
-						& span{
-							color:#637381;
-							font-size:13px;
-							font-weight:300;
-							display: inline-flex;
-						}
-					}
-
-					&>.share__type{
-						max-width:30px;
-						width:100%;
-						display: inline-flex;
-						align-items:center;
-						margin-right:10px;
-					}
-					&>.close__modal{
-						position: absolute;
-						right:20px;
-						&>a{
-							transition:.4s ease all;
-							&:hover{
-								opacity:.7;
-							}
-							&>img{
-								cursor: pointer;
-							}
-						}
-					}
-				}
-			}
-		}
-	}
-}
-
-.share-button__wrapper {
-	display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center
-}
-
-@media (max-width:767px){
-	.modal__wrap{
-		& .inner__modal {
-			padding-left:15px;
-			padding-right:15px;
-		}
-
-	}
-}
-@media (max-width:480px){
-	div.modal__wrap{
-		&>.inner__modal{
-			& .password__modal{
-				& .head__password{
-					padding:18px 15px;
-				}
-				& .password__content{
-					padding:15px;
-				}
-			}
-			& .destination__modal{
-				max-height: 90vh;
-			    overflow-y: auto;
-				& div.destination__head{
-					padding:15px;
-				}
-				& div.destination__structure{
-					padding:15px 0px;
-				}
-				& div.destination__move{
-					padding:15px 0px;
-				}
-			}
-			& .share__modal {
-				max-height: 90vh;
-			    overflow-y: auto;
-				& div.share__head{
-					padding:15px;
-				}
-				& div.share__recipient{
-					padding:15px;
-				}
-				& div.get__share--link{
-					padding:15px;
-				}
-			}
-		}
-	}
-}
\ No newline at end of file
diff --git a/src/styles/components/settings.scss b/src/styles/components/settings.scss
deleted file mode 100644
index a600ab3..0000000
--- a/src/styles/components/settings.scss
+++ /dev/null
@@ -1,486 +0,0 @@
-.main__settings--block{
-	& .inner__settings{
-		max-width:690px;
-		margin-left:auto;
-		margin-right:auto;
-		padding-top:30px;
-		padding-bottom:30px;
-		& .elem__settings{
-			&>.settings__switchers{
-				padding-top:25px;
-				padding-left:15px;
-				padding-right:15px;
-				&>span{
-					display: inline-flex;
-					margin-bottom:10px;
-					color:#637381;
-					font-size:13px;
-					font-weight:400;
-				}
-				&>p{
-					margin:0px;
-					margin-bottom:12px;
-					display: flex;
-					&:last-child{
-						margin-bottom:0px;
-					}
-				}
-				& [type="checkbox"]:not(:checked),
-				& [type="checkbox"]:checked {
-				  position: absolute;
-				  left: -9999px;
-				}
-				& [type="checkbox"]:not(:checked) + label,
-				& [type="checkbox"]:checked + label {
-				  position: relative;
-				  padding-left: 34px;
-				  cursor: pointer;
-				  color:#2C2E2F;
-				  font-size:15px;
-				  font-weight:400;
-				}
-
-				/* checkbox aspect */
-				& [type="checkbox"]:not(:checked) + label:before,
-				& [type="checkbox"]:checked + label:before {
-				  content: '';
-				  position: absolute;
-				  left: 0; top: 0;
-				  width: 24px; height: 24px;
-				  border: 2px solid #ECECEC;
-				  background: #fff;
-				  border-radius: 4px;
-				  box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
-				  left: 0%;
-				  top: 50%;
-				  box-sizing:border-box;
-				  transform: translate(0%,-50%);
-				}
-				/* checked mark aspect */
-				& [type="checkbox"]:not(:checked) + label:after,
-				& [type="checkbox"]:checked + label:after {
-				  content: '';
-				  position: absolute;
-				  top:0px;
-				  left:0px;
-				  width:24px;
-				  height:24px;
-				  background:url("/assets/activecheckbox.png");
-				  background-repeat: no-repeat;
-				  background-size:auto;
-				  background-position:center;
-				  background-color:#3c85ee;
-				  border-radius:5px;
-				  font-size: 1.3em;
-				  line-height: 0.8;
-				  color: #09ad7e;
-				  box-sizing:border-box;
-				  transition: all .2s;
-				  font-family: 'Lucida Sans Unicode', 'Arial Unicode MS', Arial;
-				  left: 0%;
-				  top: 50%;
-				  transform: translate(0%,-50%);
-				}
-				/* checked mark aspect changes */
-				& [type="checkbox"]:not(:checked) + label:after {
-				  opacity: 0;
-				  transform: scale(0);
-				}
-				& [type="checkbox"]:checked + label:after {
-				  opacity: 1;
-				  transform: scale(1);
-				  left: 0%;
-				  top: 50%;
-				  transform: translate(0%,-50%);
-				}
-				/* disabled checkbox */
-				& [type="checkbox"]:disabled:not(:checked) + label:before,
-				& [type="checkbox"]:disabled:checked + label:before {
-				  box-shadow: none;
-				  border-color: #bbb;
-				  background-color: #ddd;
-				}
-				& [type="checkbox"]:disabled:checked + label:after {
-				  color: #999;
-				}
-				& [type="checkbox"]:disabled + label {
-				  color: #aaa;
-				}
-			}
-			margin-bottom:50px;
-			&>.history__table{
-				&>table{
-					width:100%;
-					& tr{
-						width:100%;
-						&>td{
-							padding-top:35px;
-							padding-bottom:35px;
-							border-bottom:1px solid #E8EEF2;
-							&:last-child{
-								text-align:right;
-							}
-							&>a{
-								color:#3c85ee;
-								font-weight:500;
-								font-size:15px;
-								text-decoration:none;
-								transition:.4s ease all;
-								&:hover{
-									opacity:.7;
-								}
-							}
-							&:nth-child(1){
-								padding-left:15px;
-							}
-							&:last-child{
-								padding-right:15px;
-							}
-							padding-left:10px;
-							padding-right:10px;
-							&.date__history{
-								color:#637381;
-								font-size:15px;
-								font-weight:400;
-								width:140px;
-								min-width:140px;								
-							}
-							&.plan__history{
-								min-width:240px;
-								width:240px;
-							}
-							&.amount__history{
-								min-width:100px;
-								max-width:100px;
-							}
-							&.status__history{
-								min-width:85px;
-								width:85px;
-								&.unpaid{
-									color:#BF0711;
-									font-weight:500;
-								}
-								&.paid{
-									color:#39B54B;
-									font-weight:500;
-								}
-							}
-							color:#212B36;
-							font-size:15px;
-							font-weight:400;
-						}
-						&>th{
-							text-align:left;
-							border-bottom:1px solid #E8EEF2;
-							color:#637381;
-							font-size:13px;
-							font-weight:400;
-							padding:15px 10px;
-						}
-					}
-				}
-			}
-			&.more__accounts{
-				& .elem__control--settings{
-					&>.control__title{
-						&>p{
-							color:#212B36;
-							font-size:15px;
-						}
-					}
-				}
-			}
-			&:last-child{
-				margin-bottom:0px;
-			}
-			& .head__settings{
-				padding:10px 15px;
-				background-color:#F6F5FD;
-				&>h2{
-					margin:0px;
-					color:#212B36;
-					font-size:18px;
-					font-weight:500;
-				}
-			}
-			& .elem__control--settings{
-				& .more__space{
-					border:1px solid #E8EEF2;
-					display: flex;
-					justify-content:space-between;
-					padding:10px 12px;
-					width:100%;
-					margin-top:20px;
-					&>a{
-						color:#3c85ee;
-						font-size:13px;
-						font-weight:500;
-						text-decoration:none;
-						min-width:80px;
-						margin-left:10px;
-						transition:.4s ease all;
-						&:hover{
-							opacity: .7;
-						}
-					}
-					& p{
-						margin:0px;
-						font-size:13px;
-						font-weight:400;
-						display: inline-flex;
-						flex-wrap:wrap;
-						align-items:center;
-						color:#637381;
-						&>span{
-							color:#212B36;
-							font-weight:bold;
-						}
-						&>img{
-							margin-right:7px;
-						}
-					}
-				}
-				& .available__space--wrap{
-					max-width:200px;
-					width:100%;
-					padding-right:25px;
-					&>span{
-						color:#637381;
-						font-size:12px;
-						font-weight:400;
-					}
-					& .space__bar{
-						width:100%;
-						height:11px;
-						background-color:#EDEAF9;
-						border-radius:50px;
-						margin-bottom:3px;
-						position: relative;
-						& .active__space--bar{
-							height:100%;
-							position: absolute;
-							left:0px;
-							top:0px;
-							border-radius:50px;
-						}
-					}
-				}
-				& .control__title .double__title{
-					&>p{
-						color:#212B36;
-						font-size:16px;
-						font-weight:400;
-						margin:0px;
-					}
-					&>span{
-						display: inline-flex;
-						color:#637381;
-						font-size:13px;
-						max-width: 100px;
-						white-space: nowrap;
-						overflow: hidden;
-						text-overflow: ellipsis;
-						display: block;
-					}
-				}
-				&.storage__control{
-					flex-direction:column;
-					&>.active__storage{
-
-						width:100%;
-						display: flex;
-						justify-content:space-between;
-						align-items:center;
-						position: relative;
-						& .value__updater{
-							right:0px;
-						}
-					}
-				}
-				padding:22px 15px;
-				display: flex;
-				justify-content:space-between;
-				align-items:center;
-				position: relative;
-				border-bottom:1px solid #E8EEF2;
-
-				& .control__title{
-					& p{
-						margin:0px;
-						color:#637381;
-						font-size:15px;
-						font-weight:400;
-					}
-				}
-				& .control__value{
-					padding-right:70px;
-					width:50%;
-					& .profile__picture{
-						& p{
-							display: inline-flex;
-							justify-content:center;
-							align-items:center;
-							min-width:48px;
-							max-width:48px;
-							min-height:48px;
-							border-radius:250px;
-							text-decoration:none;
-							& span{
-								font-size:24px;
-								font-weight:400;
-							}
-						}
-					}
-					& p{
-						text-align:left;
-						color:#212B36;
-						font-size:15px;
-						font-weight:400;
-						width:100%;
-						margin:0px;
-					}
-				}
-				& .value__updater{
-					position: absolute;
-					right:20px;
-					& a{
-						color:#3c85ee;
-						font-size:15px;
-						font-weight:500;
-						transition:.4s ease all;
-						text-decoration:none;
-						&:hover{
-							opacity:.7;
-						}
-					}
-				}
-			}
-		}
-	}
-}
-
-.settings__container{
-	padding-right:250px;
-	padding-left:250px;
-}
-@media (max-width:1440px){
-	.settings__container{
-		padding-right:150px;
-		padding-left:250px;
-	}
-}
-@media (max-width:1200px){
-	.settings__container{
-		padding-left:0px;
-		padding-right:0px;
-	}
-	.main__settings--block{
-		& .inner__settings{
-			padding-top:15px;
-			margin-top: 56px;
-			& .elem__settings{
-				&>.history__table{
-					width:100%;
-					overflow-x:scroll;
-					&>table{
-						width:690px;
-					}
-				}
-			}
-		}
-	}
-}
-@media (max-width:640px){
-	.main__settings--block{
-		& .inner__settings{
-			& .elem__settings{
-				margin-bottom:35px;
-				&>.settings__switchers [type="checkbox"]:not(:checked) + label, &>.main__settings--block .inner__settings .elem__settings > &>.settings__switchers [type="checkbox"]:checked + label{
-					font-size:14px;
-				}
-				&>.history__table{
-					width:100%;
-					overflow-x:scroll;
-					&>table{
-						& tr{
-							&>td{
-								padding-top:20px;
-								padding-bottom:20px;
-								&.date__history, &.plan__history , &.amount__history , &.status__history {
-									font-size:14px;
-								}
-							}
-						}
-					}
-				}
-				& .head__settings{
-					& h2{
-						font-size:16px;
-					}
-				}
-				& .elem__control--settings{
-					&.storage__control > .active__storage{
-						justify-content: center;
-					}
-					&>.active__storage{
-						display: flex;
-						flex-direction:column;
-					}
-					&>.more__space{
-						display: flex;
-						flex-direction:column;
-						justify-content: center;
-						align-items:center;
-						& p{
-							justify-content:center;
-							text-align:center;
-							&>span , &>img{
-								margin-bottom:5px;
-							}
-						}
-					}
-					padding:15px;
-					display: flex;
-					flex-direction:column;
-					justify-content:center;
-					align-items:center;
-					& .control__title{
-						&>.double__title{
-							text-align:center;
-						}
-						&>p{
-							font-size:14px;
-						}
-						margin-bottom:5px;
-					}
-					& .control__value{
-						width:100%;
-						max-width:180px;
-						& .available__space--wrap{
-							padding-right:0px;
-							&>span{
-								display: flex;
-								justify-content: center;
-								margin-top:5px;
-							}
-						}
-						& .profile__picture{
-							text-align: center;
-						}
-						padding-right:0px;
-						&>p{
-							word-break:break-all;
-							text-align:center;
-							font-size:14px;
-						}
-					}
-					& .value__updater{
-						&>a{
-							font-size:13px;
-						}
-					}
-				}
-			}
-		}
-	}
-}
\ No newline at end of file
diff --git a/src/styles/styles.scss b/src/styles/styles.scss
index 450aa20..ae214b7 100644
--- a/src/styles/styles.scss
+++ b/src/styles/styles.scss
@@ -2,44 +2,9 @@
 @tailwind components;
 @tailwind utilities;
 
-@import "./base/settings";
 @import "./base/base";
-@import "./components/content-container";
-@import "./components/LoginPage";
-@import "./components/box-layout";
-@import "./components/button";
-@import "./components/Header";
-@import "./components/HomePage";
-@import "./components/Dataform";
-@import "./components/Folder";
-@import "./components/File";
-@import "./components/Filter";
-@import "./components/LeftSection";
-@import "./components/Subbar";
-@import "./components/RightSection";
-@import "./components/Uploader";
-@import "./components/loader";
 @import "./components/Spinner";
-@import "./components/QuickAccess";
-@import "./components/Spacer";
-@import "./components/Popup-window";
-@import "./components/ContentMenu";
-@import "./components/Sharemenu";
-@import "./components/DownloadPage";
-@import "./components/SettingsMenu";
 @import "./components/Swal";
-@import "./components/Photoviewer";
-@import "./components/MoverMenu";
-@import "./components/Folder-tree";
-@import "./components/VerifyEmailPage";
-@import "./components/ResetPasswordPage";
-@import "./components/AddGoogleAccountPage";
-@import "./components/AddStoragePage";
-@import "./components/AddStorageItems";
-@import "./components/UploadSwitcher";
-@import "./components/main.scss";
-@import "./components/settings.scss";
-@import "./components/MobileContextMenu";
 
 .animate {
   transition: 0.2s ease all;