/*  header v4 fixes (display the schools button and utilities bar on mobile, increase the font size of Schools and Menu buttons, plus other small fixes)
Confluence article https://apptegy.atlassian.net/wiki/x/CoDLIAE
*/
@media only screen and (min-width: 960px) {
  #view-header .h4 {
    button.menu-item .button-action-content {
      font-size: 19px;
      font-weight: 700;
    }
  }
}

@media only screen and (max-width: 959px) {
  #view-header .h4 {
    .logo {
      max-width: 100%;

      img {
        object-fit: contain;
        max-width: 100%;
      }
    }

    .bottom-header {
      padding: 5px 25px 20px;

      .wrapper {
        flex-direction: column;

        .org-banner {
          flex: 1;
          justify-content: space-between;

        }
      }
    }

    .utility-bar {
      display: flex;
      flex-wrap: wrap;
      gap: 5px 20px;
      order: -1;
      padding-bottom: 5px;

      .utilities {
        margin: 0;
      }
    }
  }
}

@media only screen and (max-width: 600px) {
  #view-header .h4 {
    .bottom-header {
      padding: 5px 15px 15px;
    }
  }
}
/* display schools button on mobile */
@media only screen and (max-width: 599px) {
    #view-header .h4 .bottom-header .org-banner .menu-buttons {
        display: flex;
    }
    #view-header .h4 .wrapper > #menubutton {
        display: none;
    }
}

@media only screen and (max-width: 460px) {
    #view-header .h4 .bottom-header .wrapper .org-banner {
        flex-wrap: wrap;
        justify-content: center;
        
        .logo {
            height: 45px;
        }
    }
}
/* end header v4 fix */