@media (max-width: 991px) {
  .main-nav {
    flex-flow: inherit;
  }

  .navicon {
    width: 1rem;
    height: 2px;
  }

  .navicon::before,
  .navicon::after {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all .2s ease-out;
    content: '';
    background: #5E5553;
  }

  .navicon::before {
    top: 5px;
  }

  .navicon::after {
    top: -5px;
  }

  .menu-btn:not(:checked) ~ .menu {
    display: none;
  }

  .menu-btn:checked ~ .menu {
    flex-grow: 0;
    flex-basis: 100%;
    display: block;
  }

  .menu-btn:checked ~ .menu-icon .navicon {
    background: transparent;
  }

  .menu-btn:checked ~ .menu-icon .navicon::before {
    transform: rotate(-45deg);
  }

  .menu-btn:checked ~ .menu-icon .navicon::after {
    transform: rotate(45deg);
  }
  .menu-btn:checked ~ .menu-icon .navicon .patty{
    display: none;
  }
  .menu-btn:checked ~ .menu-icon .navicon::before,
  .menu-btn:checked ~ .menu-icon .navicon::after {
    top: 0;
  }
}


.footer-icons a {
  color: black;
}

.menu, .child-menu {
  transition: .3s ease all;
}

.menu-mobile-hide {
  transform: translateX(-100%);
}

#child-menu {
  left: 100%;
}

.megaMenuImage {
  box-shadow: 20px -20px #ffffff;
}