
body {
  background-color: #000;
  /**text**/
  color: white;
  font-family: 'Inconsolata', monospace;
  font-size: 14px;
  text-transform: lowercase;
  max-width: 500px;
  /**page center **/
  position: absolute;
  top:0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;

}

a { color: yellow; }
a:active { color: blue; }
a:hover { color: blue; }
      

.nav {
  margin-top: 20%;
  width: 40%;
  float: left;
}

.main { 
  margin-top: 20%;
  width: 60%;
  float: left;
}

.dropdown {
                        /* Border */
                        border: 1px solid rgba(0, 0, 0, 0.3);
                        display: flex;

                        /* Reset list styles */
                        list-style-type: none;
                        margin: 0;
                        padding: 0;
                        
                        background-color: #000;
                    }

                    .dropdown li {
                        /* Spacing */
                        padding: 8px;

                        /* Used to position the sub dropdown */
                        position: relative;
                        background-color: #000;
                        color: #fff
                    }

                    /* The sub dropdown */
                    .dropdown ul {
                        /* Border */
                        border: 1px solid rgba(0, 0, 0, 0.3);

                        /* Hidden by default */
                        display: none;

                        /* Absolute position */
                        left: 0;
                        position: absolute;
                        top: 100%;

                        /* Reset styles */
                        list-style-type: none;
                        margin: 0;
                        padding: 0;

                        /* Width */
                        width: 200px;
                    }

                    /* The second level sub dropdown */
                    .dropdown ul ul {
                        left: 100%;
                        position: absolute;
                        top: 0;
                    }

                    /* Change background color of list item when being hovered */
                    .dropdown li:hover {
                        background-color: yellow;
                        color: black;
                    }
                    
                    .dropdown:hover {
                      color: black;
                    }

                    /* Show the direct sub dropdown when hovering the list item */
                    .dropdown li:hover > ul {
                        display: block;
                    }
                     
                    
/*scroollbarr finallyyy */

 /* ===== Scrollbar CSS ===== */
  /* Firefox */
  * {
    scrollbar-width: auto;
    scrollbar-color: #fffb00 #000000;
  }

  /* Chrome, Edge, and Safari */
  *::-webkit-scrollbar {
    width: 10px;
  }

  *::-webkit-scrollbar-track {
    background: #000000;
  }

  *::-webkit-scrollbar-thumb {
    background-color: #fffb00;
    border-radius: 0px;
    border: 3px solid #000000;
  }