div.polymer-form {/* 不可改 會影響input樣式 */position:relative; }


/*
==============================================
   input 
==============================================
*/
.polymer-form input, .polymer-form input.text {
	position:relative;
	margin:25px 0 0;

	font-size:16px;
	font-size:1.6rem;
	border:none;
	background:transparent;
	padding:0 0 6px;
	width:100%;
	height:20px;

	color: #ffffff;
}
.polymer-form.dirty input, .polymer-form.dirty input.text, 
.polymer-form.dirty textarea, .polymer-form.dirty textarea.text { margin:25px 0 0; }
.polymer-form input.un, .polymer-form input.text.un, 
.polymer-form textarea.un, .polymer-form textarea.text.un { margin: 0; }

.polymer-form input:focus, .polymer-form input.text:focus {
	outline:none;
	box-shadow: none;
	background:transparent;
}
.polymer-form .bar {
	width:100%;
	position:relative;
	background-color: #dedede;
}
.polymer-form .bar-in {
	width:0;
	margin:0 auto;
	background-color: #00A0EA;
	-webkit-transition:width .2s ease-in-out;
	transition:width .2s ease-in-out;
}
.polymer-form .bar-in.active { width:100%; }
.polymer-form label.placeholder {
	font-size:14px;
	font-size:1.4rem;
	color: #666666;
	position:absolute;
	top:20px;
	left:0;
	-webkit-transition:all .2s cubic-bezier(.63,0,.55,.96);
	transition:all .2s cubic-bezier(.63,0,.55,.96);
	-webkit-transform-origin:0 0;
	transform-origin:0 0;
}
.polymer-form.dirty label.placeholder {
	left:0;
	-webkit-transform:translateY(-100%);
	transform:translateY(-100%);
	font-size:13px;
	font-size:1.3rem;
}
.polymer-form.dirty label.placeholder.active { color: #00A0EA; }
.polymer-form input.unlabel, .polymer-form input.text.unlabel { margin:0; }
.cBox label.placeholder { width: auto; }

/* carrie 20160108 */
div.polymer-form ~ div.polymer-form { margin-top: 10px; }
div.polymer-form ~ div.polymer-form.inline { margin-top: 0; }


/* 有加icon的輸入框 */
.polymer-form input, .polymer-form input.text {}

.input-group.inside.polymer .input-group-addon { top:25px; left: 0; text-align: left; padding-left: 0; padding-right: 0; }
.input-group.inside.polymer.un .input-group-addon { top: 0px; padding-left: 0; padding-right: 0; }

.input-group.inside.polymer .input-group-addon.active { color: #00A0EA; }

.input-group.inside.polymer .input-group-button { padding-right: 0; top: 13px;/*25改13 因為上下各有6px carrie 20160411*/ }
.input-group.inside.polymer [class*="btn-"].cube.circle.input-group-button { top: 25px; }
.input-group.inside.polymer.un [class*="btn-"].cube.circle.input-group-button { top: 13px; }

.input-group.inside.polymer.un .input-group-button { top: 0px; }
.input-group.inside.polymer .input-group-button.no-label { top:-2px; }

.input-group.inside.polymer .input-group-addon ~ .polymer-form label.placeholder {
	padding-left:26px;
	top: 27px;
}

.input-group.inside.polymer .polymer-form.dirty label.placeholder { padding-left:0px; }

.input-group.inside.polymer .polymer-form input, 
.input-group.inside.polymer .polymer-form input.text { width: auto; }

.input-group.inside.polymer .input-group-addon ~ .polymer-form input, 
.input-group.inside.polymer .input-group-addon ~ .polymer-form input.text { padding-left:20px; }

/* polymer display-block 底下input的長度 20160509 Gabby */
.input-group.inside.polymer.display-block .polymer-form input { width: 100%; }

/* 可以跟其他內容並排的輸入框 */
div.polymer-form.inline {/* 不可改 會影響input樣式 */
	display: inline-block;
	*display: inline;
	*zoom:1;
	vertical-align: middle;
}
.input-group.polymer.inline {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	/*width: 47%; carrie註解 20151202*/
	/*margin-left: 3px;
	margin-right: 3px; carrie註解 20150115 */
}
.input-group.polymer.inline + .input-group.polymer.inline {
	margin-left: 6px;
}
.polymer-form.inline input.un, .polymer-form.inline input.text.un { margin: 0; }
.input-group.polymer.inline .polymer-form.inline input.un, .input-group.polymer.inline .polymer-form.inline input.text.un { margin: 0 0 0;/*label沒值的不應該有margin-top carrie 20160115*/ }

.input-group.inside.polymer.inline .input-group-button { top: 26px; }
.input-group.inside.polymer.inline .input-group-addon { top: 26px; }

.input-group.inside.polymer.inline.un .input-group-button { top: 3px; }
.input-group.inside.polymer.inline.un .input-group-addon { top: 3px; }

div.polymer-form.inline.fill-small { width: 10%; } 
div.polymer-form.inline.fill-middle { width: 20%; } 
div.polymer-form.inline.fill-large { width: 30%; }


/*
==============================================
   select 
==============================================
*/
.select-title {
	font-size: 13px;
	font-size: 1.3rem;
	color: #666666;
	position: relative;
	top: -2px;
	text-align: left;
}
span.select-title { display: inline-block; }

.polymer-select.inline:nth-of-type(4n) { margin-right:0; }
.polymer-select.inline + .polymer-select.inline + .polymer-select.inline + .polymer-select.inline + .polymer-select.inline { margin-top:20px; }
.polymer-select[class*="select-"] { width: 100%; }
.polymer-select.inline {
	width: 23%;
	display: inline-block;
	vertical-align: bottom;
	margin-right: 1%;
	/* float: none; */
}

.polymer-select.inline.fill-large { width: 50%; }

.inlineColumn.polymer-select.inline, .inlineColumn > .polymer-select.inline { width: 100%; margin-right: 0%; }
.polymer-select div.selector {
	width: 100%;
	border:none;
	border-bottom: 1px solid #dedede;
	margin-right: 10px;
	margin-top: 5px;
	background-position:right center;
	font-size: 16px;
	font-size: 1.6rem;
	height: 24px;
	line-height: 1;
	background-color: transparent;
}
.polymer-select div.selector.hover { background:#ffffff; }
.polymer-select div.selector span { padding-left: 0; height: 24px; line-height: 1; }
.polymer-select div.selector select { height: 24px; }

.polymer-select ~ .input-group .polymer-form.dirty { margin-top: 30px; }

.polymer-select div.selector:active, .polymer-select div.selector.active { background-color: transparent; border:1px solid #00A0EA; border-width: 0 0 1px; }
.polymer-select div.selector.hover, .polymer-select div.selector:hover { background-color: transparent; border:1px solid #00A0EA; border-width: 0 0 1px; /*color:#00A0EA;*/ }
.polymer-select div.selector.hover span, .polymer-select div.selector:hover span { /*color:#00A0EA;*/ }
.polymer-select div.selector.focus, .polymer-select div.selector:focus { background-color: transparent; border:1px solid #00A0EA; border-width: 0 0 1px; /*color:#00A0EA;*/ }
.polymer-select div.selector.focus span, .polymer-select div.selector:focus span { /*color:#00A0EA;*/ }
.polymer-select div.selector.focus:active, 
.polymer-select div.selector.focus.active, 
.polymer-select div.selector:hover:active { border:1px solid #00A0EA; border-width: 0 0 1px; }
.polymer-select div.selector.active:hover { border:1px solid #00A0EA; border-width: 0 0 1px; }
.polymer-select div.selector.disabled { border:none; background-color:#d4d4d4; }


/*
==============================================
   select sizing 
==============================================
*/
div.polymer-select.select-tiny, 
div.polymer-select.select-xs, 
div.polymer-select.select-small, 
div.polymer-select.select-middle, 
div.polymer-select.select-large {
	width: auto;/* for ie11 */
	width: initial;
}
div.polymer-select.select-tiny div.selector {
  width: 80px;
}
div.polymer-select.select-xs div.selector {
  width: 100px;
}
div.polymer-select.select-small div.selector {
  width: 120px;
}
div.polymer-select.select-middle div.selector {
  width: 145px;
}
div.polymer-select.select-large div.selector {
  width: 260px;
}


/*
==============================================
   se-dropdown 
==============================================
*/
.se-dropdown.polymer-select {
	border-bottom: 1px solid #dedede;
	font-size: 16px;
	font-size: 1.6rem;
}
.se-dropdown.polymer-select > .dropdown-text {
	padding-bottom: 6px;
	padding-left: 5px;
	height: 19px;
}

/* se-dropdown multiple polymer-select */
.selection.multiple.se-dropdown.polymer-select {
	width: 100%;
	border:none;
	border-bottom: 1px solid #dedede;
	margin-right: 10px;
	margin-top: 5px;
	/* background-position:right center; */
	font-size: 13px;
	font-size: 1.3rem;
	min-height: 24px;
	line-height: 1;
	min-width: inherit;
	background:#ffffff;
	padding: 0;
	color: #666666;
	box-shadow: none;

	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.selection.multiple.se-dropdown.polymer-select.active { z-index: 990; }
.selection.multiple.se-dropdown.polymer-select:hover, 
.selection.multiple.se-dropdown.polymer-select.active, 
.selection.multiple.se-dropdown.polymer-select:active,  
.selection.multiple.se-dropdown.polymer-select:focus { border-color: #00A0EA; box-shadow: none; }
.multiple.se-dropdown.polymer-select .icon.fa-caret-down {
	/* background:url('../images/icon/multiple-active.png') no-repeat;
	background-position:right center; */
	margin: 0;
	padding: 0;
	width: 20px;
	height: 20px;
	right: 0;
}
/* .multiple.se-dropdown.polymer-select .icon.fa-caret-down::before { display: none; } */
.selection.multiple.se-dropdown.polymer-select:hover .icon.fa-caret-down, 
.selection.multiple.se-dropdown.polymer-select.active .icon.fa-caret-down, 
.selection.multiple.se-dropdown.polymer-select:active .icon.fa-caret-down,  
.selection.multiple.se-dropdown.polymer-select:focus .icon.fa-caret-down {
	/* background:url('../images/icon/multiple.png') no-repeat;
	background-position:right center; */
}
.multiple.search.se-dropdown.polymer-select > input.search {
	width: 50px;
	margin: 0;
	line-height: 24px;
	/*position: absolute;*/
}
.selection.visible.se-dropdown.polymer-select .dropdown-menu {
	border: none;
    box-shadow: 0 5px 10px #999;
    margin: 1px 0 0;
    padding: 0;
    min-width: inherit;
    width: 100%;
	border-radius: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition:all 0.3s ease-in-out;
          transition:all 0.3s ease-in-out;
}
.inline.se-dropdown.polymer-select .dropdown-menu {
	width: 100%;
	border-radius: 0;
	margin: 1px 0 0;
	-webkit-transition:all 0.3s ease-in-out;
          transition:all 0.3s ease-in-out;
}
.selection.visible.se-dropdown.polymer-select .dropdown-menu .message {
    padding: 9px 10px;
    -webkit-transition:all 0.3s ease-in-out;
          transition:all 0.3s ease-in-out;
}
.selection.se-dropdown.polymer-select .dropdown-menu > .dropdown-item { border-top: none; padding: 5px 10px !important; }
.multiple.se-dropdown.polymer-select > .label {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	display: inline-block;
	vertical-align: top;
	white-space: normal;
	font-size: 13px;
	font-size: 1.3rem;
    padding: 1px 0px 1px 8px;
    margin: 0 6px 4px 0;
    box-shadow: none;
    background-color: #efefef;
    line-height: 24px;
}
/*選項是一整條滿版的 carrie 20160513*/
.multiple.se-dropdown.polymer-select.block > .label {
	font-size: 15px;
	font-size: 1.5rem;
    padding: 3px 8px;
    margin: 0 10px 6px 0;
    background-color: #efefef;
    line-height: 24px;
}


/*
==============================================
   textarea 
==============================================
*/
textarea.polymer-textarea {
  font-size: 16px;
  font-size: 1.6rem;
  margin:25px 0 0;
  padding:0px 0 15px;
  color: #000000;
  border:none;
  /*border-bottom: solid 1px #dedede;*/
  outline: 0;
  width:100% !important;
  height: 80px;
  vertical-align:top;
  background: transparent;
  
  -webkit-transition:border 0.3s ease-in-out;
          transition:border 0.3s ease-in-out;
  
  /* 解決ios 輸入框圓角問題 */
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  /* end */
}
/*textarea.polymer-textarea:hover { border-bottom: 1px solid #00A0EA; }
textarea.polymer-textarea:focus { border-bottom: 1px solid #00A0EA; }*/
.polymer-textarea.input-xs { height:40px !important; }
.polymer-textarea.input-small { height:80px !important; }
.polymer-textarea.input-middle { height:100px !important; }
.polymer-textarea.input-large { height:150px !important; }
.polymer-textarea.full { width: 100%; height: 300px !important; }


/*
==============================================
   responsive 
==============================================
*/
@media screen and (max-width : 800px) {
	.polymer-select.inline { width: 31%; margin-right: 2%; }
	.polymer-select.inline:nth-of-type(4n) { margin-right:2%; margin-top: 20px; }
	.polymer-select.inline:nth-of-type(3n) { margin-right:0; }
}

@media screen and (max-width : 680px) {
	.polymer-select + .polymer-select {
		margin-top: 20px;
	}
	.polymer-select.inline { width: 100%; margin-right: 0%; }
	.polymer-select.inline:nth-of-type(4n) { margin-right:0%; margin-top: 20px; }
	.polymer-select.inline:nth-of-type(3n) { margin-top: 20px; }
	.polymer-select.inline:nth-of-type(2n) { margin-top: 20px; }
	div.polymer-select.select-tiny div.selector {
	  width: 100%;
	}
	div.polymer-select.select-xs div.selector {
	  width: 100%;
	}
	div.polymer-select.select-small div.selector {
	  width: 100%;
	}
	div.polymer-select.select-middle div.selector {
	  width: 100%;
	}
	div.polymer-select.select-large div.selector {
	  width: 100%;
	}
	div.polymer-select.select-tiny, div.polymer-select.select-xs, div.polymer-select.select-small, div.polymer-select.select-middle, div.polymer-select.select-large {
		width: 100%;
	}
}