/* button */
input.submit, input.submit:focus, input.submit:active {
	border:1px solid #999999; 
	/* -webkit-border-radius: 3px;  */
	/* -moz-border-radius: 3px; */
	/* border-radius: 3px; */
	font-size:0.8em;
	width: 55px;
	height:25px;
	margin-top: 5px;
	font-family:arial, helvetica, sans-serif; 
	/* padding: 5px 15px 5px 8px; */
	text-decoration:none; 
	display:inline-block;
	text-shadow: 1px 1px 0 rgba(255,255,255,0.3);
	font-weight:bold; color: #000000;
 	background-color: #f2f5f6;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f2f5f6), to(#c8d7dc));
 	background-image: -webkit-linear-gradient(top, #f2f5f6, #c8d7dc);
 	background-image: -moz-linear-gradient(top, #f2f5f6, #c8d7dc);
 	background-image: -ms-linear-gradient(top, #f2f5f6, #c8d7dc);
 	background-image: -o-linear-gradient(top, #f2f5f6, #c8d7dc);
 	background-image: linear-gradient(to bottom, #f2f5f6, #c8d7dc);
    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f2f5f6, endColorstr=#c8d7dc);
}

/* button hover */
input.submit:hover {
 	border:1px solid #696969;
 	background-color: #d4dee1;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#d4dee1), to(#a9c0c8));
 	background-image: -webkit-linear-gradient(top, #d4dee1, #a9c0c8);
 	background-image: -moz-linear-gradient(top, #d4dee1, #a9c0c8);
 	background-image: -ms-linear-gradient(top, #d4dee1, #a9c0c8);
 	background-image: -o-linear-gradient(top, #d4dee1, #a9c0c8);
 	background-image: linear-gradient(to bottom, #d4dee1, #a9c0c8);
 	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#d4dee1, endColorstr=#a9c0c8);
}




.selectdiv {
  position: relative;
  /*Don't really need this just for demo styling*/
  
  float: left;
  min-width: 200px;
  /*margin: 50px 33%; */
}

.selectdiv:after {
    content: '\f078';
    font: normal normal normal 17px/1 FontAwesome;
    color: #0ebeff;
    right: 11px;
    top: 1px;
    height: 24px;
    padding: 1px 0px 0px 8px;
    border-left: 1px solid #0ebeff;
    position: absolute;
    pointer-events: none;
}

/* IE11 hide native button (thanks Matt!) */
select::-ms-expand {
display: none;
}

.selectdiv select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* Add some styling */
  
  display: block;
  width: 100%;
  max-width: 320px;
  height: 25px;
  float: right;
  /* margin: 5px 0px; */
  /* padding: 0px 24px; */
  padding-left: 5px;
  font-size: 0.9em;
  line-height: 1;
  color: #333;
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #999;
  -ms-word-break: normal;
  word-break: normal;
}


/* CAUTION: IE hackery ahead */
select::-ms-expand { 
    display: none; /* remove default arrow in IE 10 and 11 */
}

/* target Internet Explorer 9 to undo the custom arrow */
@media screen and (min-width:0\0) {
    select {
        background:none\9;
        padding: 5px\9;
    }
}
