/* =========================================================
   22) RESPONSIVE ≤ 767px y altura ≤ 700px
   ========================================================= */

@media (max-width: 767px) and (max-height: 700px) {
  .canalla-side-menu {
    top: 14px !important;
    left: 14px !important;
  }

  .canalla-side-menu::before {
    width: 40px !important;
    height: 40px !important;
    font-size: 19px !important;
    border-radius: 11px !important;
  }

  .canalla-side-menu.canalla-menu-collapsed {
    width: 40px !important;
    height: 40px !important;
  }

  .canalla-side-menu ul,
  .canalla-side-menu .menu,
  .canalla-side-menu nav ul {
    gap: 14px !important;
    padding: 18px 16px !important;
    border-radius: 18px !important;
  }

  .canalla-side-menu.canalla-menu-collapsed ul,
  .canalla-side-menu.canalla-menu-collapsed .menu,
  .canalla-side-menu.canalla-menu-collapsed nav ul {
    opacity: 0 !important;
    transform: scale(0.96) translateY(2px) !important;
    pointer-events: none !important;
  }

  .canalla-side-menu.canalla-menu-open ul,
  .canalla-side-menu.canalla-menu-open .menu,
  .canalla-side-menu.canalla-menu-open nav ul {
    opacity: 1 !important;
    transform: scale(1) translateY(0) !important;
    pointer-events: auto !important;
  }

  .canalla-side-menu a,
  .canalla-side-menu li a,
  .canalla-side-menu .menu > li > a,
  .canalla-side-menu nav ul li a,
  .canalla-side-menu .menu_wrapper a,
  .canalla-side-menu .menu_wrapper .menu > li > a {
    font-size: 14px !important;
    line-height: 1.3 !important;
    letter-spacing: 1px !important;
  }

  .canalla-side-menu a:hover {
    transform: translateX(3px) !important;
  }

  .canalla-social-top {
    right: 14px !important;
    bottom: 14px !important;
  }

  .canalla-social-top.canalla-social-compact .mcb-wrap-inner {
    width: 36px !important;
    height: 36px !important;
    border-radius: 11px !important;
  }

  .canalla-social-top.canalla-social-compact .mcb-wrap-inner::before {
    font-size: 17px !important;
  }

  .canalla-social-top:not(.canalla-social-compact) .mcb-wrap-inner {
    padding: 16px 12px !important;
  }

  .canalla-social-top:not(.canalla-social-compact) a {
    width: 44px !important;
    height: 44px !important;
  }

  .canalla-social-top:not(.canalla-social-compact) i,
  .canalla-social-top:not(.canalla-social-compact) svg {
    font-size: 20px !important;
  }

  .canalla-top-mark {
    top: 18px !important;
  }

  .canalla-top-mark .canalla-isotipo-svg {
    width: 34px !important;
  }
}