update mystyle.css

public/css/mystyle.css

@@ -76,6 +76,12 @@ ul li{
 /*#endregion*/
 
 /*#region CONTAINERS */
+.fixed{
+  position: fixed;
+}
+.scroll{
+  overflow:auto;
+}
 .flex{
   display:flex;
 }
@@ -122,6 +128,7 @@ div{
   justify-content: center;
   align-items: center;
   flex-wrap:wrap;
+  align-self: center;
 }
 .bottom{
   display:flex;
@@ -132,6 +139,18 @@ div{
 .right{
   justify-content:right;
 }
+.left{
+  justify-content:left;
+}
+.text-left{
+  text-align: left;
+}
+.text-right{
+  text-align: right;
+}
+.text-center{
+  text-align: center;
+}
 /*#endregion*/
 
 /*#region FORM */
@@ -160,9 +179,15 @@ select{
 .w-100{
   width:100%;
 }
+.w-95{
+  width: 95%;
+}
 .w-90{
   width:90%;
 }
+.w-85{
+  width: 85%;
+}
 .w-80{
   width:80%;
 }
@@ -172,9 +197,27 @@ select{
 .w-70{
   width:70%;
 }
+.w-65{
+  width: 65%;
+}
+.w-60{
+  width: 60%;
+}
+.w-55{
+  width: 55%;
+}
 .w-50{
   width:50%;
 }
+.w-45{
+  width:45%;
+}
+.w-40{
+  width: 40%;
+}
+.w-35{
+  width: 35%;
+}
 .w-33{
   width:33%;
 }
@@ -187,6 +230,9 @@ select{
 .w-20{
   width:20%;
 }
+.w-15{
+  width: 15%;
+}
 .w-10{
   width:10%;
 }
@@ -433,7 +479,7 @@ select{
 .border-0{
   border:none;
 }
-.border-bot{
+.border-bottom{
   border-bottom:solid 1px;
 }
 .border-top{
@@ -494,6 +540,7 @@ select{
 input[type=submit],button,.btn{
   cursor:pointer;
   border:none;
+  margin: 0px;
   padding:14px 10px;
   background-color: var(--primary);
   color:white;
@@ -605,23 +652,13 @@ ul li > * {
   border-bottom:var(--primary) inset 2px;
 }
 
-.nav-logo img{
-  margin-left:10px;
-  height:64px;
-  cursor:pointer;
-}
-
-.nav-avatar{
-  cursor:pointer;
-  background-color: var(--main-bg-color);
-}
-
-.nav-avatar:hover .avatar{
-  filter:brightness(75%);
+.clickable{
+  cursor: pointer;
+  transition: all .1s ease-in;
 }
 
-.nav-avatar:hover .menu-dropdown .menu-drop-item{
-  display:block;
+.clickable:hover{
+  filter: brightness(75%);
 }
 
 .menu-drop-item{