Custom CSS for Changing the Height of Buttons on Mobile Only

Site URL: https://www.harvestfilmco.com/

I would like to change the height of the two buttons on my home page (on mobile only) so that they are centered over the photos. What is the custom css input to change the height of the buttons on mobile only?

3 hours ago, harvestfilmco said:

Site URL: https://www.harvestfilmco.com/

I would like to change the height of the two buttons on my home page (on mobile only) so that they are centered over the photos. What is the custom css input to change the height of the buttons on mobile only?

Try this custom css

@media only screen and (max-width: 768px) {
        #block-yui_3_17_2_1_1609256643007_5560 {
          position: fixed;
          top: 25vh;
        }
        #block-yui_3_17_2_1_1609256643007_6227 {
          position: fixed;
          bottom: 12.5vh
        }
}

17 hours ago, bangank36 said:

Try this custom css

@media only screen and (max-width: 768px) {
        #block-yui_3_17_2_1_1609256643007_5560 {
          position: fixed;
          top: 25vh;
        }
        #block-yui_3_17_2_1_1609256643007_6227 {
          position: fixed;
          bottom: 12.5vh
        }
}

Thank you! Worked like a charm.

@harvestfilmco I see on tablet, the navigation items are't on same line. You can add this to Design > Custom CSS to fix this.

/* tablet navigation */
@media screen and (max-width:900px) and (min-width:641px) {
.Header-inner.Header-inner--top {
    flex-direction: column;
    padding-top: 0;
}
}

On 1/5/2021 at 4:47 AM, tuanphan said:

@harvestfilmco I see on tablet, the navigation items are't on same line. You can add this to Design > Custom CSS to fix this.

/* tablet navigation */
@media screen and (max-width:900px) and (min-width:641px) {
.Header-inner.Header-inner--top {
    flex-direction: column;
    padding-top: 0;
}
}

I never noticed that until now! Thank you! Worked like a charm.