Select doesn't work like expected

Hello, people.

I need some help with a problem that seems to be simple.

I have a select, but he always open in modal mod, and I can’t change the colors of the options on hover, select, click, etc.

I catch the same example from the site, and open like modal… I’m gona paste some code above.

I did a project from zero, just to test, and continues opening like a modal.

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body ng-app="starter">

Ionic Blank Starter

		  <label class="item item-input item-select">
			<div class="input-label">
			  <span id="itemCustom">Região</span>
			</div>
			<select>
			  <option selected>Região 1</option>
			  <option style="background:#fc0;
font-weight:bold;
font-style:italic;
font-family:Verdana;
font-size:18px;
color:#ff0000;" > Região 2</option>
			  <option>Região 3</option>
			</select>
		  </label>
		  
		  <label class="item item-input item-select">
			<div class="input-label">
			 <span id="itemCustom"> Tamanho </span>
			</div>
			<select>
			  <option style=".option-selected{ background-color: #ccc !important; border:0px;}">Tamanho 1</option>
			  <option style=".option-selected{ background-color: #ccc !important; border:0px;}" selected> Tamanho 2</option>
			  <option style=".option-selected{ background-color: #ccc !important; border:0px;}">Tamanho 3</option>
			</select>
		  </label>
		  
		  <label class="item item-input item-select">
			<div class="input-label">
			<span id="itemCustom">  Canal </span>
			</div>
			<select>
			  <option>Canal 1</option>
			  <option > Canal 2</option>
			  <option selected>Canal 3</option>
			</select>
		  </label>

		</div>
		<a ui-sref="lojas"  class="button button-positive button-block" style="padding-left: 10% !important; padding-right: 10% !important; margin-left: 3%; margin-right: 3%;">Acessar</a>