In order to use this method you have to put the c-box text to every container. But then it allows you to change all of them from one place and you keep the freedom to do a few container manually, because if you don’t put in the c-box value then it simply doesn’t apply. And ofcourse the big benefit that you can add multiple breakpoints. So you can even add more than what I have over here.
<style> /* CONTAINER BOXED LAYOUT*/ /* Ultra wide */ @media (max-width: 3840px) { .c-box {--content-width: 55%;}} /* Desktop */ @media (max-width: 1920px) { .c-box {--content-width: 65%;}} /* Laptop big */ @media (max-width: 1600px) { .c-box {--content-width: 74%;}} /* Laptop small */ @media (max-width: 1366px) { .c-box {--content-width: 77%;}} /* Tablet portrait */ @media (max-width: 1200px) { .c-box {--content-width: 80%;}} /* Mobile */ @media (max-width: 767px) { .c-box {--content-width: 85%;}} </style>