/* CSS Document */

/* ------------------------------------------------------------------------------------------------ common */
*			{ background-repeat:no-repeat;  background-position:left top; vertical-align:top; font-family:微軟正黑體; }
body		{ padding:0px; margin:0px; background-color:#999999; }
body, textarea, input, select { font-size:18px; color:#333; }

a			{ color:#00A3D8; text-decoration:none; }
a .Strong	{ color:#008FBF; }
a:hover		{ color:#EC358F; text-decoration:underline; }
a:hover .Strong	{ color:#DC1478; }

/* ------------------------------------------------------------------------------------------------ specific */
.Font22		{ font-size:22px; }
.Font20		{ font-size:20px; }
.Font18		{ font-size:18px; }
.Font16		{ font-size:16px; }
.Font14		{ font-size:14px; }
.Font12		{ font-size:12px; }
.FontB		{ font-weight:bold; }
.FontI		{ font-style:italic; }
.FontU		{ text-decoration:underline; }
.FontS		{ text-decoration:line-through; }				/* strikeout */
.FontR		{ font-weight:bold; color:#FF0066; }			/* required */
.FontH		{ background-color:#FFFF00; padding:0px 2px; }	/* highlight */
.FontN		{ white-space:nowrap; }							/* nowrap */
.FontE		{ color:#666699; }								/* example */

.Heading	{ color:#EF0059; font-weight:bold; font-size:20px; }

.BlockE		{ overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }	/* ellipsis */
.BlockZ1	{ z-index:1; }
.BlockZ2	{ z-index:2; }
.BlockZ3	{ z-index:3; }
.BlockZMax	{ z-index:9999; }
.AlignL		{ text-align:left; }							/* left */
.AlignR		{ text-align:right; }							/* right */
.FloatL		{ float:left; }									/* left */
.FloatR		{ float:right; }								/* right */
.FloatC		{ clear:both; }									/* clear */
.Indent20	{ margin-left:20px; }
.Indent40	{ margin-left:40px; }
.Indent60	{ margin-left:60px; }

/* ------------------------------------------------------------------------------------------------ #Layout */
div#Layout	{ margin:0px auto; background-color:#FFFFFF; }

/* --------------------------------------------------------------------------------------- table.Grid */
table.Grid						{}
table.Grid thead.Grid>tr					{ background-color:transparent !important; }
table.Grid thead.Grid>tr th					{ text-align:left; color:#55240C; background-color:rgba(255,255,255,0.7); font-weight:bold; font-size:16px; }
table.Grid tbody.Grid>tr					{ height:36px; line-height:30px; }
table.Grid tbody.Grid>tr:nth-child(odd)		{ background-color:rgba(248,248,248,0.6); }
table.Grid tbody.Grid>tr:hover				{ background-color:#FFFF99; }

/* ------------------------------------------------------------------------------------------------ .Part */
div.Part	{ color:#FFF; background-color:#386B88; font-weight:bold; border-radius:6px; padding:6px 10px; margin-bottom:10px; line-height:30px; }
div.Subpart	{ color:#FFF; background-color:#679FC0; font-weight:bold; border-radius:6px; padding:4px 10px; margin-bottom:10px; line-height:26px; }
div.Subpart .Light	{ font-weight:normal; }

/* ------------------------------------------------------------------------------------------------ .Field */
div.Field				{ margin-bottom:16px; }
div.Field+div.Field		{ clear:left; }
div.Field div.Left, div.Field div.Right
						{ padding:6px 8px; min-height:30px; line-height:30px; border:1px solid #E3F3F9; }
div.Field div.Left		{ width:100px; float:left; color:#386B88; background-color:#E3F3F9; font-weight:bold; text-align:right; border-radius:6px 0px 0px 6px; }
div.Field div.Right		{ margin-left:116px;  }






/* --------------------------------------------------------------------------------------- form */
input[type=text], input[type=password], textarea, select
			{ font-size:16px; border:#0099FF 1px solid; padding:6px; border-radius:8px; }

input[type=text]:hover, input[type=password]:hover, textarea:hover, select:hover
			{ box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }

select		{ height:34px; }

textarea	{ width:360px; height:70px; }

input[type=button], input[type=reset], input[type=submit]
			{ height:36px; font-size:18px; color:#333; }
input[type=button], input[type=reset], input[type=submit]
			{ width:90px; border-radius:8px; }
input[type=button]:hover, input[type=reset]:hover, input[type=submit]:hover, select:hover
			{ cursor:pointer; color:#069;
				box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
input[type=button]+input[type=submit]
, input[type=button]+input[type=button]
			{ margin-left:20px; }
input[disabled=disabled], select[disabled=disabled]
			{ color:#999; }
input[disabled=disabled]:hover, select[disabled=disabled]:hover
			{ cursor:no-drop; color:#999; }

label.Sky:hover
			{ cursor:pointer; color:#F30; }

label.Sky input[type=checkbox]:checked + span.Text,
label.Sky input[type=radio]:checked + span.Text
			{ color:#0099FF; font-weight:bold; }

label.Sky input[type=radio]		{ cursor:pointer; width:18px; height:18px; position:relative; top:3px; }
label.Sky input[type=checkbox]	{ cursor:pointer; width:18px; height:18px; position:relative; top:1px; }
			
label.Sky input[type=file]
			{ display:none; width:0px; height:0px; position:absolute; left:0px; top:0px; }

label.Sky + label.Sky { margin-left:10px; }

div.Upload	{ display:inline-block; }
div.Upload label.Sky { width:132px; height:32px; display:inline-block; position:relative; padding:5px 0px 0px 44px; }





/* ------------------------------------------------------------------------------------------------ */
span.Tag	{ color:#FFF; background-color:#6666FF; border-radius:10px; padding:1px 6px; }
a.Tag		{ color:#FFF; background-color:#00A3D8; border-radius:10px; padding:1px 6px; }
a.Tag:hover	{ color:#FFF; background-color:#EC358F; text-decoration:none; }

div.JobTime.Expired span { color:#900000; }
div.JobTime img { width:18px; height:18px; position:relative; top:5px; }
div.JobTime.Expired img { top:6px !important; }

div.Enabled img { width:18px; height:18px; position:relative; top:6px; }
div.Checked img { width:18px; height:18px; position:relative; top:6px; }

.JobTag	{ font-size:16px; color:#FFF; background-color:#C21B66; border-radius:6px; padding:0px 6px; }
.JobTag + .JobTag { margin-left:6px; }

.Note		{ font-size:16px; color:#666; }




/* --------------------------------------------------------------------------------------- div.Part, div.Field */
div.Field div.Left.Highlight { background-color:#B6EEFA; border-color:1px solid #E3F3F9; }
div.Field div.Right.Highlight { color:#000; border-color:1px solid #E3F3F9; }
div.Field div.Right div.Upload label.Sky { padding:0px 0px 0px 44px; }
div.Field .Note			{ font-size:16px; color:#666; }

table.Fields	{ border-collapse:collapse; margin-bottom:16px; }
table.Fields th	{ padding:6px 10px; line-height:30px; border:1px solid #E3F3F9; height:30px; background-color:#E3F3F9; color:#386B88; border-radius:6px 6px 0px 0px; }
table.Fields td	{ padding:6px 10px; line-height:30px; border:1px solid #E3F3F9; height:30px; }

img.CompanyLogo			{ opacity:0.9; border:1px solid #FFF; border-radius:16px; }
img.CompanyLogo:hover	{ opacity:1.0; border:1px solid #FF0; }

/* --------------------------------------------------------------------------------------- div.Bar */
div.Bar				{ display:inline-block; margin-top:1px; position:relative; }
div.Bar div.Value	{ position:absolute; left:8px; font-size:18px; }
div.Bar table		{ width:79px; height:22px; background-image:url(../home/bar/bg.png); background-repeat:repeat-x; }
div.Bar table td.Cell1	{ width:4px; background-image:url(../home/bar/left.png); }
div.Bar table td.Cell2	{ background-image:url(../home/bar/on.png); background-repeat:repeat-x; }
div.Bar table td.Cell4	{ width:4px; background-image:url(../home/bar/right.png); }

tr.Total div.Bar table 			{ background-image:url(../home/bar/total_bg.png); }
tr.Total div.Bar table td.Cell1	{ background-image:url(../home/bar/total_left.png); }
tr.Total div.Bar table td.Cell2	{ background-image:url(../home/bar/total_on.png); }
tr.Total div.Bar table td.Cell4	{ background-image:url(../home/bar/total_right.png); }

