.wid-50 {
   width: 50% !important; 
   /* border: 1px solid red; */
}

.wid-30 {
   width: 30%;
}

.arrange-left {
   float: left;
} 

.center {
   display: block;
   margin-left: auto;
   margin-right: auto;
   width: 50%;
}


@media only screen and (max-width: 700px) {
   .wid-50 {
      width: 100%;
   }

   .arrange-left {
      float: none;

   }

   .wrapper .resume-title h1 {
      margin-bottom: 0;
   }

   .navbar {
      display: none;
   }
}

.navbar a {
   transition: 0.3s;
}

/* Sidebar Toggle Button */
.menu-bars {
   font-size: 1.5rem;
   cursor: pointer;
   color: white;
   display: none;
   margin-right: 10px;
   /* Mobile Safari tap highlight fix */
   -webkit-tap-highlight-color: transparent;
   /* Remove default button styles */
   appearance: none;
   -webkit-appearance: none;
}

.menu-bars:active,
.menu-bars:focus,
.menu-bars:hover {
   background-color: transparent;
   outline: none;
   color: black;
}
/* Sidebar */
.nav-menu {
   background-color: #167ac6;
   flex-direction: column;
   align-items: flex-start;
   justify-content: flex-start;
   box-sizing: border-box;
   width: 100%;
   height: 100vh;
   position: fixed;
   top: 0;
   right: -100%;
   transition: 0.5s;
   z-index: 1000;
   }

.nav-menu.active {
   right: 0;
   /* Show when active */
}

.nav-menu-items {
   /* border: 1px solid red; */
   list-style-type: none;
   padding: 20px 0;
   text-align: center !important;
}

.nav-menu-items li {
   padding: 15px 20px;
} 

.nav-menu-items a {
   text-decoration: none;
   transition: 0.3s;
}

/* Close Button Inside Sidebar */
.close-button {
   width: 12%;
   margin-top: 50px;
   font-size: 2rem;
   cursor: pointer;
   color: white;
   /* border: 1px solid red; */
   position: relative;
   left: 300px;
   border: none;
   border-radius: 5px;
   padding-top: 5px;
   background-color: transparent;
   /* Mobile Safari tap highlight fix */
   -webkit-tap-highlight-color: transparent;
   /* Remove default button styles */
   appearance: none;
   -webkit-appearance: none;
}

.close-button:active,
.close-button:focus,
.close-button:hover {
   background-color: transparent;
   outline: none;
   color: black;
}

/* Media Queries */
@media only screen and (max-width: 700px) {
   .navbar-list {
      display: none;
      /* Hide navbar list on small screens */
   }

   .menu-bars {
      display: block;
      /* Show the sidebar button */
   }

   .navbar-logo {
      padding-left: 20px;
      margin-top: 50px;
      font-size: 2rem;
      color: white;
      font-weight: bold;
      margin-left: -30px;
   }
}