Search Bar Customisation

Site URL: https://rocksforlife.com/

I would love the search bar to have rounded corners and the input text have a different font. How could I target the area? For some reason the following doesn't work:

 

.sqs-search-page-input

{ border: 2px black yellow !important;
border-radius: 14px !important;
padding: 15px 15px 15px 45px;
}

Also, the search bar is only placed for mobile.

Thank you loads!

The site is: www.rocksforlife.com
 

I think you place the code at the wrong place? The code is working but you should either place it in custom CSS or in the page https://rocksforlife.com/search

Attached an image to show how it looks:

7 hours ago, aravsanj said:

I think you place the code at the wrong place? The code is working but you should either place it in custom CSS or in the page https://rocksforlife.com/search

Attached an image to show how it looks:

Oh brilliant! It was a bug from my end 🙂

@ievavi Do you want fix this?

Site URL: https://rocksforlife.com/

1. (Tablet-Footer) Increase email width?

10 minutes ago, tuanphan said:

@ievavi Do you want fix this?

Site URL: https://rocksforlife.com/

1. (Tablet-Footer) Increase email width?

Good point! Actually, yes :) Would you provide some help for this?

On 6/21/2021 at 2:34 PM, ievavi said:

Good point! Actually, yes :) Would you provide some help for this?

Add to Design > Custom CSS

/* Tablet footer */
@media screen and (max-width:991px) and (min-width:768px) {
div#block-yui_3_17_2_1_1622052386291_10520+.row>.span-2:nth-child(4) {
    position: relative;
    left: -100px;
}
div#block-yui_3_17_2_1_1622048999936_40928 * {
    white-space: nowrap;
}
}