.linksWrapper { display: flex; flex-direction: column; gap: var(--Space-x2); @media screen and (min-width: 768px) { flex-direction: row; justify-content: space-between; } } .links { display: flex; flex-direction: column; gap: var(--Space-x1); @media screen and (min-width: 768px) { flex-direction: row; } } .links .link { text-decoration: none; color: var(--SAS-40); &:hover { color: var(--SAS-40); text-decoration: underline; } &:not(:last-child):after { content: "ยท"; display: inline-flex; font-size: var(--Title-Subtitle-md-Size); line-height: 100%; margin-left: var(--Space-x1); text-decoration: none; } }