How to do these follwing things using CSS

1. How to change the dropdown arrow icon of select box using background image in css?
   

.item1 select{
 appearance: none !important;
font-size: 16px;
font-family: 'Poppins',sans-serif;
font-weight: 400;
padding-left: 20px;
-webkit-appearance: none;
-moz-appearance: none;
background-image: url("data:image/svg+xml;utf8,<svg fill='white' height='50' viewBox='0 2 28 24' width='40' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
background-repeat: no-repeat;
background-position-x: 98%;
background-position-y: 5px;
}

2. How to change the placeholder color in firefox browser?

::-moz-placeholder {
    opacity: 1;
  }

3. How to reduce the column width(which is display flex column) in css?

Flex basis:15%;(according to width)