﻿/* *********************************************************************************
// 1. 程式描述：環域科技共用函式庫 - 專案相關 CSS
// 2. 撰寫人員：fen
// *********************************************************************************/

/* ----------------------------------------------------------------- ☆ 統一專案 */

/* Color CSS

色系：藍綠

深色(D): #22434a;
淺色(L): #e1fafd;
框色(B): #3a82b0; // old: #468f98
中色(M): #c6e8f2;
淡色(P): #f6fcfe;

深橘色: #7d422b;
淺橘色: #fdf1e1;
框橘色: #ff9a00;
中橘色: #ffe7ce;
淡橘色: #fef6ea;
-------------------------------------------------- */
/* 深色 */
.ForeColorD { color: #22434a; }
.BackColorD { background-color: #22434a; }

/* 淺色 */
.ForeColorL { color: #e1fafd; }
.BackColorL { background-color: #e1fafd; }

/* 框色 */
.ForeColorB { color: #3a82b0; }
.BackColorB { background-color: #3a82b0; }

/* 中色 */
.ForeColorM { color: #c6e8f2; }
.BackColorM { background-color: #c6e8f2; }

/* 淡色 */
.ForeColorP { color: #f6fcfe; }
.BackColorP { background-color: #f6fcfe; }



/* Frame CSS
-------------------------------------------------- */

/* 選單大小背景圖 */
.nav-md .main_container {
	background: url(../Images/SiteLeft.png) no-repeat left bottom 35px fixed;
	/*background-position-x: 1px;*/ /* fen 202004, mark */
	background-size: 230px auto; /* fen 202004, 228px auto */
}
.nav-sm .main_container {
}

/* 主版頁面 */
.main_container {
}
	/* 標題 */
	.main_container h1 {
		font-size: 32px;
		font-weight: 700;
		font-family: Lato, "PingFang TC", "Helvetica Neue", Helvetica, 微軟正黑體, 新細明體, Arial, sans-serif; /* fen 202004, 微軟正黑體 */
		border-bottom: 3px solid #3a82b0;
		color: #3a82b0;
		padding-bottom: 5px;
		margin-bottom: 40px;
	}
	.main_container h2 {
		/* x_panel 標題會變 */
	}
	.main_container h3 {
		/* 選單子系統名稱顯示會變 */
	}

/* site_title Logo 圖檔 */
.site_logo {
	height: 40px; /* fen 202004, add */
	display: none;
}
.nav-sm .site_logo {
	/*height: 48px;*/ /* fen 202004, add */
	content: url(../Images/LogoS.png);
	display: inline;
}

/* 區域 - 等待中 Progress */
.Frame_Progress {
	margin: 0 auto;
	border: 3px solid #4b53b4;
	background: url(../Images/Progress.jpg) no-repeat;
	width: 300px;
	height: 60px;
	text-align: center;
	vertical-align: middle;
	color: #4b53b4;
	font-size: 21px;
	font-weight: bold;
}

/* 控制項 */
input[type="radio"], input[type="checkbox"] {
	margin-right: 8px;
}
.flat label {
	margin-left: 8px;
}



/* DWPanelX CSS
-------------------------------------------------- */

/* DWPanelX 標題及輸入控制 */
.x_panel {
	border-radius: 10px; /* fen 202004, add */
}
	.x_panel .x_content > br {
		display: none; /* fen 202004, add */
	}
.x_panel .control-label,
.x_panel .form-control {
	color: black;
}
	/* 主標題 */
	.x_panel h2:before {
		font-family: FontAwesome;
		display: inline-block;
		padding-right: 6px;
		vertical-align: middle;
	}

	/* 主標題描述 */
	.x_panel h2 small {
		/*color: red;*/
	}

	/* 標題 */
	.x_panel h3 {
		font-size: 20px;
		/*font-family: 微軟正黑體;*/
		color: olive;
	}

	/* 查詢[黑] */
	.x_panel .control-label.Q,
	.x_panel .form-control.Q {
	}

	/* 必輸[紅] */
	.x_panel .control-label.N,
	.x_panel .form-control.N {
		color: red;
	}

	/* 唯讀[綠] */
	.x_panel .control-label.D,
	.x_panel .form-control.D {
		color: green;
	}

/* 查詢 */
.DWQ {
	background-color: #edf5f5; /* fen 202004, #f6fcfe */
}
	.DWQ h2:before {
		content: "\f002";
	}

/* 明細 */
.DWF {
}
	.DWF h2:before {
		content: "\f1ea";
	}

/* 清單 */
.DWG {
}
	.DWG h2:before {
		content: "\f022";
	}



/* Grid CSS
-------------------------------------------------- */

/* 表格 - 標題 */
.Grid_Head {
	background-color: #e1fafd; /* fen 202004, #c6e8f2 */
}

/* 表格 - 資料 */
.Grid_Detail {

}

/* 表格 - 資料(選擇列) */
.Grid_Select {
	background-color: #ffffc0;
}



/* Grid 分頁
-------------------------------------------------- */
.pagination-ys {
	/*display: inline-block;*/
	padding-left: 0;
	margin: 20px 0;
	border-radius: 4px;
}

	.pagination-ys table > tbody > tr > td {
		display: inline;
	}

		.pagination-ys table > tbody > tr > td > a,
		.pagination-ys table > tbody > tr > td > span {
			position: relative;
			float: left;
			padding: 8px 12px;
			line-height: 1.42857143;
			text-decoration: none;
			color: navy;
			background-color: #ffffff;
			border: 1px solid #dddddd;
			margin-left: -1px;
		}

		.pagination-ys table > tbody > tr > td > span {
			position: relative;
			float: left;
			padding: 8px 12px;
			line-height: 1.42857143;
			text-decoration: none;
			margin-left: -1px;
			z-index: 2;
			color: #aea79f;
			background-color: #f5f5f5;
			border-color: #dddddd;
			cursor: default;
		}

		.pagination-ys table > tbody > tr > td:first-child > a,
		.pagination-ys table > tbody > tr > td:first-child > span {
			margin-left: 0;
			border-bottom-left-radius: 4px;
			border-top-left-radius: 4px;
		}

		.pagination-ys table > tbody > tr > td:last-child > a,
		.pagination-ys table > tbody > tr > td:last-child > span {
			border-bottom-right-radius: 4px;
			border-top-right-radius: 4px;
		}

		.pagination-ys table > tbody > tr > td > a:hover,
		.pagination-ys table > tbody > tr > td > span:hover,
		.pagination-ys table > tbody > tr > td > a:focus,
		.pagination-ys table > tbody > tr > td > span:focus {
			color: #97310e;
			background-color: #eeeeee;
			border-color: #dddddd;
		}



/* AjaxControlToolkit CSS
-------------------------------------------------- */

/* Modal Popup */
.modalBackground {
	background-color: gray;
	filter: alpha(opacity=70);
	opacity: 0.7;
}

.modalPopup {
	padding: 3px;
	border: 3px solid gray;
	background: #fff9f2;
	width: 250px;
	text-align: center;
	vertical-align: middle;
}

.modalPopup_T {
	margin: 0;
	padding: 6px 0 3px 0;
	border: 1px solid #3a82b0;
	width: 100%;
	text-align: center;
	vertical-align: middle;
	font-size: 20px;
	font-weight: bold;
	background-color: #c6e8f2;
	color: #3a82b0;
}



/* Notice CSS
-------------------------------------------------- */

/* 區域 - Notice */
table.Frame_NoticeTable {
	margin: 0 0 2px 0;
	border: 1px solid #3a82b0;
	width: 100%;
}

td.Frame_NoticeHeader {
	padding: 8px 2px 5px 2px;
	background-color: #3a82b0;
	color: #fff;
	font-weight: bold;
	text-align: center;
}

td.Frame_NoticeIMG {
	padding: 5px 5px 0 5px;
}

td.Frame_NoticeDate {
	padding: 0 5px 10px 5px;
	width: 64px;
	color: #2a4452;
	vertical-align: top;
}

td.Frame_NoticeTitle {
	padding: 0 5px 5px 5px;
	color: #2a4452;
	vertical-align: top;
}

a.Frame_NoticeShow {
	color: #4169e1;
	text-decoration: none;
	font-size: 13px;
}

	a.Frame_NoticeShow:hover {
		color: #ff9900;
		text-decoration: none;
	}

td.Frame_NoticeUnit {
	padding: 0 5px 5px 5px;
	width: 100px;
	color: #808080;
	vertical-align: top;
}

div.Frame_NoticeContent {
	margin: 2px 0 4px 0;
	padding: 10px 20px 10px 20px;
	border: 1px dashed #3a82b0;
	color: #666666;
	font-size: 16px;
	line-height: 25px;
	width: 100%;
}

a.Frame_NoticeUrl {
	color: #4169e1;
	text-decoration: none;
}

	a.Frame_NoticeUrl:hover {
		color: #ff9900;
		text-decoration: none;
	}
