form select, form input[type="text"], form input[type="email"], form input[type="url"], form input[type="password"], form input[type="search"], form input[type="number"], form input[type="tel"], form input[type="range"], form input[type="date"], form input[type="month"], form input[type="week"], form input[type="time"], form input[type="datetime"], form input[type="datetime-local"], form input[type="color"], textarea { color: #04134e; border: 1px solid #ebeff2; background: #ffffff; } form select:focus, form input[type="text"]:focus, form input[type="email"]:focus, form input[type="url"]:focus, form input[type="password"]:focus, form input[type="search"]:focus, form input[type="number"]:focus, form input[type="tel"]:focus, form input[type="range"]:focus, form input[type="date"]:focus, form input[type="month"]:focus, form input[type="week"]:focus, form input[type="time"]:focus, form input[type="datetime"]:focus, form input[type="datetime-local"]:focus, form input[type="color"]:focus, textarea:focus { color: #111; outline: 0; box-shadow: none; border: 1px solid #A6BFDD; background: #E8F5FF; } form select option { padding: 10px; color: #555555; box-shadow: none; background: #fff; } form select { color: #888; border-radius: 4px; border: 1px solid #ebeff2; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { opacity: 1; } /******** Custom Select *******/ .custom-select { position: relative; display: inline-block; font-family: Arial; width: 250px; border: 1px solid #ebeff2; border-radius: 40px; padding: 5px; background: #ffffff; } .custom-select select { display: none; /*hide original SELECT element:*/ } .select-selected { } /*style the arrow inside the select element:*/ .select-selected:after { position: absolute; z-index: 9; content: ""; top: 20px; right: 10px; width: 0; height: 0; border: 6px solid transparent; border-color: #333 transparent transparent transparent; } /*point the arrow upwards when the select box is open (active):*/ .select-selected.select-arrow-active:after { border-color: transparent transparent #333 transparent; top: 7px; } /*style the items (options), including the selected item:*/ .select-items div,.select-selected { color: #777; padding: 10px 16px; border-color: 1px solid #CCD5E0; cursor: pointer; user-select: none; text-align: left; } /*style items (options):*/ .select-items { position: absolute; background: #fff; top: 100%; left: 0; right: 0; z-index: 999; border: 1px solid #ebeff2; overflow: auto; max-height: 400px; } /*hide the items when the select box is closed:*/ .select-hide { display: none; } .select-items div:hover, .same-as-selected { background-color: #ebeff2; } .select-items div { padding: 5px 15px; text-align: left; }