body {
    font-size:13px;
    font-family:'微軟正黑體', arial, sans-serif;
    color:#333;
}
/*--------------Main Style------------------*/
.AdminContentHeadStyle {
    width:100%;
    text-align:center;
}
.AdminContentHeadTitle {
    margin-bottom:20px;
    padding:10px 0;
    background-color:#f9f9f9;
    border-bottom:2px solid #c0c0c0;
    line-height:150%;
}
p {
    font-size:1em;
    color:#666;
    margin:8px auto;
}

/*--------------Head Form Style------------------*/
.FormLabelWords {
    font-size:1.2em;
    font-weight:bold;
    margin-right:5px;
}
.FormLabelWords2 {
    font-size:1.2em;
}
input[type="text"], input[type="password"], textarea, select {
    /*display: inline-block;*/
    padding: 3px 6px;
    font-size: 13px;
    font-family:'微軟正黑體', Arial, sans-serif;
    line-height: 1.428571429;
    color: #555;
    vertical-align: middle;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    /*border:1px solie #f00;
    font-size:12px;
    line-height:130%;
    margin-right:5px;
    padding:3px;*/
}
input[type="text"]:focus, textarea:focus, select:focus {
    border-color:#66afe9;outline:0;
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6);
    box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6)
}
input[type="radio"]+label, input[type="checkbox"]+label{
    padding-right:10px;
    padding-left:5px;
}
input[type="radio"]:checked+label{ font-weight: bold; } 
select {
    font-size:12px;
    line-height:130%;
    margin-right:5px;
    padding:3px;
}
input[type="text"].error, textarea.error, select.error {
    border:1px solid #ED7476;
    background:#FFEDED;
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgb(230, 63, 50,.6);
    box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgb(230, 63, 50,.6);
}

/* Input PlaceHolder Font Color*/
*::-webkit-input-placeholder {
    color: ccc;
}
*:-moz-placeholder {
    /* FF 4-18 */
    color: ccc;
}
*::-moz-placeholder {
    /* FF 19+ */
    color: ccc;
}
*:-ms-input-placeholder {
    /* IE 10+ */
    color: ccc;
}



/* ButtonStyle */
.ButtonStyle {
    display:inline-block;
    position:relative;
    background-color:#e9e9e9;
    border: solid 1px #c0c0c0;
    border-radius: 3px;
    box-shadow: inset 0px 1px 0px rgba(255,255,255, .8), 0px 1px 3px rgba(0,0,0, .1);
    font-family:'微軟正黑體',"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:12px;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    color:#565656;
    cursor:pointer;
    padding:4px 10px; /* Links */
}
.ButtonStyle:hover {
    background-color:#dff4ff;
    border:1px solid #c2e1ef;
    color:#336699;
}
.ButtonStyle:active {
    background-color: #6299c5;
    border: 1px solid #6299c5;
    color: #fff;
}
.BeforeIcon{
    display:inline-block;
    position:absolute;
    width:16px;
    height:16px;
    top:4px;
    padding: 0 2px;
}


.PostBackButtonStyle {
    color: #fff;    /*color:#565656;*/
    cursor: pointer;

    display:inline-block;
    position:relative;
    background-color: #d9534f;
    border:none;    /*border: solid 1px #c0c0c0;*/
    border-radius: 3px;
    box-shadow: inset 0px 1px 0px rgba(255,255,255, .8), 0px 1px 3px rgba(0,0,0, .1);
    font-family:'微軟正黑體',"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:12px;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    
    cursor:pointer;
    /*padding:4px 10px;*/ /* Links */   padding: 5px 6px; margin-right:3px;
}
.PostBackButtonStyle:hover {
    background-color:#dff4ff;
    /*border:1px solid #c2e1ef;*/
    color:#336699;
}
.PostBackButtonStyle:active {
    background-color: #6299c5;
    /*border: 1px solid #6299c5;*/
    color: #fff;
}

/* LinkButton Style  */
.LinkButtonStyle {
    display:inline-block;
    position:relative;
    background-color:#e9e9e9;
    border: solid 1px #c0c0c0;
    border-radius: 3px;
    box-shadow: inset 0px 1px 0px rgba(255,255,255, .8), 0px 1px 3px rgba(0,0,0, .1);
    font-family:'微軟正黑體',"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:12px;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    color:#565656;
    cursor:pointer;
    padding:4px 10px; /* Links */
}
.LinkButtonStyle:hover {
    background-color:#dff4ff;
    border:1px solid #c2e1ef;
    color:#336699;
}
.LinkButtonStyle:active {
    background-color: #6299c5;
    border: 1px solid #6299c5;
    color: #fff;
}

/* Button Style Before Icon*/
.NewAdd {
    display:inline-block;
    padding-left: 30px;
    background-image: url(/_images/backend/icon-add.png);
    background-repeat: no-repeat;
    background-position: 10px center;
}
.Edit {
    display:inline-block;
    padding-left: 30px;
    background-image: url(/_images/backend/icon-edit.png);
    background-repeat: no-repeat;
    background-position: 10px center;
}
.Save {
    display:inline-block;
    padding-left: 30px;
    background-image: url(/_images/backend/icon-save.png);
    background-repeat: no-repeat;
    background-position: 10px center;
}
.Cancel {
    display:inline-block;
    padding-left: 30px;
    background-image: url(/_images/backend/icon-delete.png);
    background-repeat: no-repeat;
    background-position: 10px center;
}
.Reject {
    display:inline-block;
    padding-left: 30px;
    background-image: url(/_images/backend/icon-reject.png);
    background-repeat: no-repeat;
    background-position: 10px center;

}
.OK{
    display:inline-block;
    padding-left: 30px;
    background-image: url(/_images/backend/icon-OK.png);
    background-repeat: no-repeat;
    background-position: 10px center;
}
.Reset{
    display:inline-block;
    padding-left: 30px;
    background-image: url(/_images/backend/icon-reset.png);
    background-repeat: no-repeat;
    background-position: 10px center;
}

.btn-xs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}
.EditButton {
    color: #fff;
    background-color: #428bca;
    border-color: #357ebd;
    text-decoration: none;
    cursor: pointer;
    margin-right:3px;
}
.PostBackButton {
    background-color: #d9534f;
    border-radius:3px;
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    cursor: pointer;
    border:none;
    padding: 5px 6px;
    margin-right:3px;
}
.PostBacklinkButton {
    background-color: #d9534f;
    border-radius:3px;
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    cursor: pointer;
    border:none;
    padding: 5px 6px;
    margin-right:3px;
}

/*--------------Error Message Style------------------*/
.InputArea {
    position:relative;
}
.AlignInput {
    /*position:absolute;
    top:32px;
    left:0;*/
    margin-top:5px;
}
.RequiredError {
	position: relative;
	background:#f8e3e3 url(/_images/backend/icon_error.png) no-repeat 10px center;
    border: 1px solid #e22f32;
    padding:5px 20px 5px 35px;
}
.RequiredError:after, .RequiredError:before{
	content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent;
    border-top: 0;
}
/* Stroke */
.RequiredError:before {
    top: -11px;
    left: 21px;

    /* If 1px darken stroke slightly */
    border-bottom-color: #e22f32;
    border-width: 11px;
}
/* Fill */
.RequiredError:after {
    top: -10px;
    left: 22px;
    border-bottom-color: #f8e3e3;
    border-width: 10px;
}
.InvalidFormat {
	position: relative;
	background:#fbf1b6 url(/_images/backend/icon-warning.png) no-repeat 10px center;
	border: 1px solid #c94407;
    padding:5px 20px 5px 35px;
}
.InvalidFormat:after, .InvalidFormat:before{
	content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent;
    border-top: 0;
}
/* Stroke */
.InvalidFormat:before {
    top: -11px;
    left: 21px;

    /* If 1px darken stroke slightly */
    border-bottom-color: #c94407;
    border-width: 11px;
}
/* Fill */
.InvalidFormat:after {
    top: -10px;
    left: 22px;
    border-bottom-color: #fbf1b6;
    border-width: 10px;
}


/*--------------GridView Table Style------------------*/
.TableBox {
	border: 0;
    border-collapse: collapse;
	width: 98%;
    color:#8F8F91;
    font-family: "Arial", "Helvetica", "sans-serif";
    font-size:13px;
    margin:0 auto 32px auto;
}
.TableBox tr td {
	border: 1px solid #D6DDE6;
    padding:5px 5px 10px 5px;
}
.TableBox th {
	border: 1px solid #7492c2;
    background-color: #a6b5d0;
    text-align: center;
    color:#ffffff;
    padding:5px;
    font-weight:bold;
}
.TableBox tr:hover {
	background-color: #ffecf0;
    color: #ae6e76;
}
.TableBox tr.PageClass:hover { 
    background-color:#fff; /*取消滑鼠滑過出現背景色,background-color:none;無效,所以用白色*/
}
.TableBox .PageClass td{
    border:none;
}
.PageClass table{
    border:0;
    margin:10px auto;
}
.PageClass tr:hover{
    background-color:#fff;/*取消滑鼠滑過出現背景色,background-color:none;無效,所以用白色*/
}
.PageClass table td{
    border:0;
    padding:0;
}
.PageClass table td span{
    color: #f0f0f0;
    font-size: 14px;
    line-height:24px;
    font-weight: bold;
    display: inline-block;
    padding: 0px 9px;
    margin-right: 4px;
    border-radius: 3px;
    border: solid 1px #c0c0c0;
    text-decoration: none;
    text-shadow: 0px 1px 0px rgba(255,255,255, 1);
    background: #616161;
    box-shadow: inset 0px 0px 8px rgba(0,0,0, .5), 0px 1px 0px rgba(255,255,255, .8);
    text-shadow: 0px 0px 3px rgba(0,0,0, .5);

}
.PageClass table td a{
    color: #666;
    font-size: 14px;
    line-height:24px;
    display: inline-block;
    padding: 0px 9px;
    margin-right: 4px;
    border-radius: 3px;
    border: solid 1px #c0c0c0;
    background: #e9e9e9;
    box-shadow: inset 0px 1px 0px rgba(255,255,255, .8), 0px 1px 3px rgba(0,0,0, .1);
    font-size: .875em;
    font-weight: bold;
    text-decoration: none;
    color: #717171;
    text-shadow: 0px 1px 0px rgba(255,255,255, 1);
}
.PageClass table td a:active {
    border: none;
    background: #616161;
    box-shadow: inset 0px 0px 8px rgba(0,0,0, .5), 0px 1px 0px rgba(255,255,255, .8);
    color: #f0f0f0;
    text-shadow: 0px 0px 3px rgba(0,0,0, .5);
}


/*-----------------Pop Up Edit Window-----------------------*/
.Popup {
    position:absolute;
	left:0;
	top:0;
	z-index:888;
	width:100%;
	min-height:100%;
	margin:0 auto;
	background-color:rgba(0,0,0,0.5);
	display:none;
}
.PopupDiv {
    position:absolute;
	width:80%;
	height:80%;
	margin:6% 10%;
	background-color:#D6DDE6;
    padding:20px;
    box-shadow: 1px 1px 15px rgba(0,0,0, .7);
    transition: all .4s ease-out;
}

.Popup .XX{
	display:block;
	position:absolute;
	right:-5px;
	top:-5px;
	width:20px;
	height:20px;
	background-color:#FFF;
	border-radius:3px;
	text-align:center;
    color:#7492c2;
    font-size:15px;
    font-weight:bold;
	line-height:20px;
    border:2px solid #7492c2;
    cursor:pointer;
}
.CLOSE {
    -webkit-transform: scale(0);
    opacity:0;
}
.OPEN {
    -webkit-transform: scale(1);
    opacity:1;
}

/*-----------------Edit Form Div Style-----------------------*/
.EditFormDiv {
    display:block;
    width:80%;
    margin:2% auto;
    padding:20px;
    -webkit-box-shadow:0 0 10px 1px #999;
    -moz-box-shadow:0 0 10px 1px #999;
    box-shadow:0 0 10px 1px #999;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    font-size:1.1em;
}
.FormHeadTitle {
    text-align:center;
    margin-bottom:20px;
    padding:10px 0;
    background-color:#f9f9f9;
    border-bottom:2px solid #c0c0c0;
    line-height:150%;
}
.FormGroup{
    padding:15px 0;
}
.FormGroup:hover{
    background-color:#f0f0f0;
}
.form-control:focus {
    border-color:#66afe9;
    outline:0;
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6);
    -moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6);
    box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6)
}
select option{
    color: #555;
}
.EditFormLabel {
    width:20%;
    display:inline-block;
    text-align:right;
    padding-right:20px;
    vertical-align:top;
    position:relative;
    line-height:100%;
}
.InputArea {
    width:70%;
    display:inline-block;
}

.RequiredField:after {
    content:"✱";
    color:#f00;
    display:inline-block;
    position:absolute;
    right:5px;
}
.SendButtonGroup {
    text-align:center;
    margin:10px 0;
}

/***** for programming *****/
.PopupDiv iframe {
    width:100%;
    height:100%;
    background-color:white;
}