.navbar__info__mobile__block { padding: var(--y-gap) 0; border-top: 2px solid var(--color-primary); border-bottom: 2px solid var(--color-primary); } .navbar__info__mobile__link { font-size: 1.5rem; font-weight: 700; text-transform: capitalize; text-decoration: none; display: flex; justify-content: end; align-items: center; gap: .75rem; } .navbar__info__mobile__link:hover, .navbar__info__mobile__link:focus { text-decoration: none; } .navbar__info__mobile__link::before { content: ''; height: .75em; width: .75em; mask-size: contain; mask-repeat: no-repeat; mask-position: center; background-color: currentColor; } .navbar__info__mobile__link--email::before { mask-image: url('https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/email.svg'); } .navbar__info__mobile__link--phone::before { mask-image: url('https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/phone.svg'); } .navbar__info__mobile__link--residents::before { mask-image: url('https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/residents.svg'); } .navbar__info__mobile__apply { margin-top: var(--y-gap); width: 100%; }  .footer { position: relative; color: white; background-color: var(--color-secondary); overflow: hidden; } .footer__graphic { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; object-position: 70% bottom; z-index: 0; pointer-events: none; user-select: none; } .footer__inner { display: grid; grid-template-areas: "logo" "location" "contact" "sns" "menu" "bottom" ; text-align: center; place-items: center; gap: 1.25rem; padding: var(--y-gap) var(--x-gap); } .footer__label { font-weight: bold; margin-bottom: 5px; } .footer__logo { grid-area: logo; } .footer__logo img { --prefers-width: 13.647058823529vw; max-width: var(--prefers-width); height: auto; } .footer__menu { grid-column: 1 / -1; display: flex; justify-content: center; flex-wrap: wrap; gap: 1rem; margin-top: .5rem; font-size: 0.9375rem; text-transform: uppercase; width: 100%; } .footer__contact { grid-area: contact; display: grid; } .footer__tel { font-size: 1.625rem; font-weight: 700; } .footer__email { font-size: 1.5rem; } .footer__addresses { font-size: 1.25rem; } .footer__directions { font-size: 11px; text-decoration: underline; text-transform: uppercase; } .footer__hours { font-size: 1.25rem; } .footer__hour { display: flex; justify-content: space-between; gap: 10px; max-width: 360px; } .footer__sns-group { grid-area: sns; justify-content: center; } .footer__sns { margin-bottom: 1.25rem; } .footer__bottom { grid-area: bottom; grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; gap: 0.5rem; font-size: 0.875rem; border-top: 1px solid rgba(217, 217, 217, 0.5); padding: 1rem 0 0; width: 100%; } .footer__policies { display: flex; gap: 1rem; font-size: 11px; text-decoration: underline; } .footer .menu__item { position: relative; } .footer .menu__item .menu__link:hover, .footer .menu__item .menu__link:focus { text-decoration: none; } .footer .menu__item .menu__link::after { content: ''; position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%); height: 1px; width: 0; background-color: white; transition: width .3s ease; } .footer .menu__item .menu__link:hover::after, .footer .menu__item .menu__link:focus::after, .footer .menu__item--current .menu__link::after { width: 100%; } @media(min-width: 992px) { .footer__inner { grid-template-areas: "logo contact sns" "menu menu menu" "bottom bottom bottom" ; grid-template-columns: auto auto 1fr; place-items: center; padding: var(--y-gap) var(--x-gap) 1.19rem; gap: 1rem var(--y-gap); } .footer__inner:has(.footer__hour) { grid-template-areas: "logo contact sns" "logo hours sns" "menu menu menu" "bottom bottom bottom" ; grid-template-columns: auto auto 1fr; } .footer__logo { margin-right: clamp(2rem, 5.7vw, 6.1rem); } .footer__menu { grid-column: 1 / -1; justify-content: end; margin-top: 0; } .footer__contact, .footer__hours, .footer__sns-group { padding-bottom: 4rem; } .footer__sns { margin-bottom: 3.87rem; } .footer__bottom { width: 100%; flex-direction: row; justify-content: space-between; } } @media(min-width: 1200px) { .footer__inner { grid-template-areas: "logo contact sns" "menu menu menu" "bottom bottom bottom" ; grid-template-columns: auto auto 1fr; justify-content: space-between; text-align: left; gap: 2rem; } .footer__inner:has(.footer__hour) { grid-template-areas: "logo contact hours sns" "menu menu menu menu" "bottom bottom bottom bottom" ; grid-template-columns: auto auto auto auto; } .footer__sns-group { justify-self: end; text-align: right; } }  .sns { display: flex; gap: 8px; padding: 0; flex-shrink: 0; } .sns__link { border-radius: 50px; padding: .65rem; display: flex; justify-content: center; align-items: center; transition: .15s ease; background: var(--color-primary); border: 2px solid var(--color-primary); } .sns__link::before { content: ''; width: 17px; height: 17px; display: inline-block; mask-size: contain; mask-repeat: no-repeat; mask-position: center; background: white; } .sns__link--facebook::before { mask-image: url("https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/facebook.svg"); } .sns__link--instagram::before { mask-image: url("https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/instagram.svg"); } .sns__link--snapchat::before { mask-image: url("https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/snapchat.svg"); } .sns__link--twitter::before { mask-image: url("https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/twitter.svg"); } .sns__link--youtube::before { mask-image: url("https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/youtube.svg"); } .sns__link--whatsapp::before { mask-image: url("https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/whatsapp.svg"); } .sns__link--wechat::before { mask-image: url("https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/wechat.svg"); } .sns__link--tiktok::before { mask-image: url("https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/tiktok.svg"); } .sns__link--google::before { mask-image: url("https://www.live30north.com/wp-content/themes/30-north/assets/images/icons/google.svg"); } .sns__link:hover { background: white; } .sns__link:hover::before { background: var(--color-primary); }  .jumpem { text-align: center; font-size: 12px; line-height: 1; padding: 1rem var(--x-gap); color: #fff; background-color: #121212; overflow: hidden; } .jumpem img { height: 1.1em; vertical-align: middle; }