.header {
        height: 75px;

        display: flex;
        flex-direction: row;
        justify-content: space-between;

        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 100;

        background-color: white;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-bottom-color: rgb(224, 224, 224);
      }

      .left-section {
        display: flex;
        align-items: center;
      }

      .hamburger-menu {
        height: 25px;
        margin-left: 30px;
        margin-right: 20px ;
      }

      .youtube-logo {
        height: 25px;
      }

      .middle-section {
        flex: 1;
        margin-left: 60px;
        margin-right: 25px;
        max-width: 550px;
        display: flex;
        align-items: center;
      }

      .Search-bar {
        flex: 2;
        height: 45px;
        padding-left: 10px;
        font-size: 22px;
        border-width: 1px;
        border-style: solid;
        border-color: rgb(165, 165, 165);
        width: 0;
        border-radius: 40px;
        box-shadow: inset;
      }

      .Search-bar::placeholder {
        font-family: Roboto, Arial;
        font-size: 20px;
      }

      .search-button {
        height: 50px;
        width: 60px;
        border-width: 0;
        background-color: transparent;
        margin-left: -70px;
        margin-right: 30px;

        
      }

      .search-button,
      .voice-search-button,
      .upload-icon-container,
      .youtube-apps-icon-container,
      .notifications-icon-container {
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
      }

      .search-button .tooltip,
      .voice-search-button .tooltip,
      .upload-icon-container .tooltip,
      .youtube-apps-icon-container .tooltip,
      .notifications-icon-container .tooltip  {
        font-family: Roboto, arial;
        position: absolute;
        background-color: gray;
        color: white;
        padding-top: 4px;
        padding-bottom: 4px;
        padding-right: 8px;
        padding-left: 8px;
        border-radius: 3.5px;
        bottom: -24px;
        opacity: 0;
        transition: 0.15s;
        pointer-events: none;
        white-space: nowrap;
      }

      .search-button:hover .tooltip,
      .voice-search-button:hover .tooltip,
      .upload-icon-container:hover .tooltip,
      .youtube-apps-icon-container:hover .tooltip,
      .notifications-icon-container:hover .tooltip {
        opacity: 1;
      }

      .search-icon {
        height: 30px;
      }

      .voice-search-button {
        height: 50px;
        width: 50px;
        border-radius: 30px;
        border: none;

      }

      .voice-search-icon {
        height: 30px;
      }

      .right-section {
        width: 270px;
        margin-right: 30px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-shrink: 0;
      }

      .upload-icon {
        height: 30px;
      }

      .youtube-apps-icon {
       height: 30px; 
      }

      .notifications-icon {
        height: 30px;
      }

      .notifications-icon-container {
        position: relative;
      }

      .notifications-count {
        position: absolute;
        top: 0;
        right: 0;
        background-color: rgb(207, 0, 0);
        color: white;
        font-family: Roboto, Arial;
        font-size: 15px;
        font-weight: 500;
        padding-left: 5.2px;
        padding-bottom: 1px;
        padding-right: 5.2px;
        padding-top: 1px;
        border-radius: 30px;
      }
      .current-user-picture {
        height: 45px;
        border-radius: 30px;
      }