// see https://css-tricks.com/snippets/css/fluid-typography/ for 🤯 .viewport-fluid(@property, @from, @to, @screen-min: @screen-sm, @screen-max: @screen-lg, @viewport-unit: vw) { @{property}: @from; @media (min-width: @screen-min) { @{property}: calc( @from + unit(@to - @from) * ((~"100@{viewport-unit}" - @screen-min) / unit(@screen-max - @screen-min)) ); } @media (min-width: @screen-max) { @{property}: @to; } }