shoshinmatcha

above code works on mobile only
if you want it work tablet + mobile, edit 767px to 991px or any number you want.

Seems fine here? or can you describe in detail?

drink & eat images?
Add to Home > Design > Custom CSS
@media screen and (max-width:767px) { body#collection-5bfe7194cd8366f9106cc861 section.Intro .span-9 .row .col:not(:first-child) { width: 50% !important; float: left !important; } }  

I'm not sure. You can try. If it doesn't work, just tag me, I will take a look

@media screen and (max-width:640px) { /* credit cards logo */ div#block-yui_3_17_2_1_1555334200897_7528 .slide { float: left !important; width: 25% !important; } div#block-yui_3_17_2_1_1555334200897_7528 .slide img { width: 100% !important; height: auto !important; } div#block-yui_3_17_2_1_1555334200897_7528 { padding-top: 0 !important; padding-bottom: 0 !important; } } I guess this code looks better

Add to Home > Design > Custom CSS
@media screen and (max-width:640px) { div#page-5c88b8cfa4222f95b671ea08>.row:nth-child(2) .span-4 { float: left !important; width: 50% !important; } div#page-5c88b8cfa4222f95b671ea08>.row:nth-child(2) .span-4 * { font-size: 20px; } }  

Yes. You can solve this. But first, can you turn off "disable right click" function?

try play with padding top or padding bottom in above code

header.Header [href*="/select-your-matcha"] { background: red; color: white !important; padding-top: 5px !important; padding-left: 5px !important; padding-right: 5px !important; }