Hello,
This will required some Css knowledge and a good mastery of the "@media" command.
See this
documentation
how to add custom Css Command
Now in order to advice & guide you :
1. DON'T modify hikashop.css file that manage the HikaShop Grid system
=> Use it to copy your required command, like this example :
@media (min-width:768px) {
.hkc-sm-11 { width:91.66666667%; }
.hkc-sm-10 { width:83.33333333%; }
...
.hkc-sm-2 { width:16.66666667%; }
.hkc-sm-1 { width:8.33333333%; }
}
=> To modify it to achieved what you need
2. Then paste it at the end of your frontend file css (or style.css) to override default HikaShop command.
=> You can use an "!important" to increase your command priority, and be sure to override default command.
3. You have to readjust "width" command and his value, to switch it like this example :
@media (min-width:768px) {
.hkc-sm-11 { width:50%; }
.hkc-sm-10 { width:50%; }
...
.hkc-sm-2 { width:50%; }
.hkc-sm-1 { width:50%; }
}
Hope this will help you to achieved what you need, and stay available for more guidance.
Regards