@media only screen and (max-width: 567px) {
    .menu-body {
      position: fixed;
      bottom: -110px;
      left: 50%;
      font-family: 'Mulish', sans-serif;
      padding: 0px 0px 0px 0px;
      transform: translate(-50%, -50%);
      margin: 0 auto;
      width: 100%;
      background-color: #000;
      z-index: 99;
      display: block !important;
    }
  
    .navigationo {
      /* height: 70px; */
      background: var(--brandgray);
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 0px;
      bottom: 0px;
      background-color: black;
      position: fixed;
      width: 100vw;
    }
  
    .navigationo ul {
      display: flex;
      width: 100%;
      padding: 0;
      justify-content: space-between;
    }
  
    .navigationo ul li {
      position: relative;
      list-style: none;
      /* width: 90px;
      height: 65px; */
      z-index: 1;
      width: 50%;
      border: 1px solid #fff;
        border-bottom: unset;
    }
  
    .navigationo ul li a {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      width: 100%;
      text-align: center;
    }
  
    .navigationo ul li a .icon {
      position: relative;
      display: block;
      line-height: 45px;
      font-size: 20px;
      text-align: center;
      transition: 0.5s;
      width: 50px;
      height:
        50px;
      /* color: blue; */
      color: #fff !important;
      padding-bottom: 30px;
      border-radius: 50%;
    }
  
    .fab {
      font-family: "Font Awesome 5 Brands";
      font-weight: 400;
    }
  
    .navigationo ul li.active a .text {
      opacity: 1;
      /* transform: translateY(10px); */
      font-size: 12px;
    }
  
    .navigationo ul li.active a .icon {
      transform: translateY(-30px);
      padding-bottom: 18px;
      color: black;
      /* width: 50px;
    height: 
    50px; */
      background-color: #1c447f;
      /* border-radius: 50%; */
    }
  
    .list .text {
      font-size: 14px;
        color: white;
        padding: 10px 0px;
        font-weight: 600;
    }
  
  }
  
  
  .navigationo ul li.active a .icon i {
    color: #fff;
  }
  
  .menu-body {
    display: none ;
  }
  
  .menu-body.show{
    bottom: 0;
    transition: all 0.4s ease;
  }