How can I turn off the gel-box styling of Safari's dropdowns using the code -webkit-appearance:none in Webflow?

To remove the default gel-box styling of Safari's dropdowns in Webflow using the `-webkit-appearance: none;` code, you will need to apply custom styles to the select element.

Here's how you can achieve this:

1. Select the drop-down element on your Webflow canvas.
2. Go to the Styles panel (on the right side of the screen).
3. Click on the "+" button next to the selector field to create a new class or use an existing class if you prefer.
4. In the selector field, make sure the drop-down element is targeted correctly.
5. Scroll down in the Styles panel until you reach the "Custom Code" section.
6. Inside the "Custom Code" section, click on the "< style >" tag to open the code editor.
7. Add the following code:

```css
select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
```

8. Click outside the code editor to save your changes.

By specifying the `-webkit-appearance: none;` property, you instruct Safari to remove its default styling for the select element, effectively disabling the gel-box look. The `-moz-appearance: none;` and `appearance: none;` properties are also included to ensure consistent styling across different browsers.

Remember to publish or export your Webflow project for the changes to take effect on your live website.