*{
	font-size:16 pt;
}
body {
    font-family:helvetica,tahoma,verdana,sans-serif;
    padding:20px;
    font-size:16px;
    margin:0;
}
h2 {
    font-size:18px;
    font-weight:bold;
    margin:0;
    margin-bottom:15px;
}
.demo-info{
	background:#FFFEE6;
	color:#8F5700;
	padding:12px;
}
.demo-tip{
	width:16px;
	height:16px;
	margin-right:8px;
	float:left;
}
input {
	height:28px ;
	margin : 2px 0px ;
	padding: 4px;
    border: 1px solid #BBBBBB; //改變外框
    background: #fff; // 背景色
    /* 邊角圓弧化，不同瀏器?設定不同　*/
    -moz-border-radius:3px; // Firefox
    -webkit-border-radius: 3px; // Safari 和 Chrome
    border-radius: 3px; // opera; 
    font-style:normal; font-variant:normal; font-weight:normal; font-size:16px
}


td           {
	height:16px ;
	padding: 0px;
}


textarea { 
	margin: 0px; 
	padding: 5px; 
	font-family: arial, helvetica, clean, sans-serif; 
	font-size: 18px; 
	font-weight: normal; 
	font-style: normal; 
	font-variant: normal; 
	line-height: 18px;
	 width: 492px; 
	 border: 1px solid rgb(207, 207, 204); 
	 overflow: hidden; 
	 background-color: rgb(249, 255, 255); 
	 resize: none; 
	 box-sizing: border-box; 
	 display: block; 
}


.css_input_header {
	border: 1px solid rgb(0, 0, 0);
	background-color: #800000; 
	color:#ffffff;
	text-align: center;

	
	font-size:16px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	border:1px solid #469df5;
	padding:0px 0px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #79bbff 5%, #4197ee 100% );
	background:-ms-linear-gradient( top, #79bbff 5%, #4197ee 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#4197ee');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #79bbff), color-stop(100%, #4197ee) );
	background-color:#79bbff;
	color:#30303;
	display:inline-block;
	text-shadow:1px 1px 0px #287ace;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #cae3fc;
 	-moz-box-shadow:inset 1px 1px 0px 0px #cae3fc;
 	box-shadow:inset 1px 1px 0px 0px #cae3fc;
}


.css_input_header2 {
	border: 1px solid rgb(0, 0, 0);
	background-color: #800000; 
	color:#ffffff;
	text-align: center;


	font-size:16px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	border:1px solid #dcdcdc;
	padding:3px 0px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	background:-ms-linear-gradient( top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ededed), color-stop(100%, #dfdfdf) );
	background-color:#ededed;
	color:#777777;
	display:inline-block;
	text-shadow:1px 1px 0px #ffffff;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #ffffff;
 	-moz-box-shadow:inset 1px 1px 0px 0px #ffffff;
 	box-shadow:inset 1px 1px 0px 0px #ffffff;
}




.css_input_catalog {
	height:15px;
	padding: 4px; width: 170px;
	background-color: rgb(255, 255, 255); 
	border: 2px solid rgb(217, 217, 217);
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 16px;
	color: rgb(0, 0, 0); 
	font-style: normal;
    font-variant: normal;
    font-weight: normal; 
    orphans: auto; 
    white-space: normal;
	widows: auto;
	-webkit-text-stroke-width: 0px;
	background-position:initial;
	background-repeat: initial initial; 
	margin-left:0px; 
	margin-right:5px; 
	margin-top:5px; 
	margin-bottom:1px
}


.css_input_catalog2 {
	height:24px ;
	margin : 2px 0px ;
	padding: 4px;
    border: 1px solid #BBBBBB; //改變外框
    background: #fff; // 背景色
    /* 邊角圓弧化，不同瀏器?設定不同　*/
    -moz-border-radius:3px; // Firefox
    -webkit-border-radius: 3px; // Safari 和 Chrome
    border-radius: 3px; // opera; 
    font-style:normal; font-variant:normal; font-weight:normal; font-size:16px
}



.css_header_class {
	font-size:16px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	border:1px solid #dcdcdc;
	padding:2px 5px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #f9f9f9 5%, #e9e9e9 100% );
	background:-ms-linear-gradient( top, #f9f9f9 5%, #e9e9e9 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #f9f9f9), color-stop(100%, #e9e9e9) );
	background-color:#f9f9f9;
	color:#666666;
	display:inline-block;
	text-shadow:1px 1px 0px #ffffff;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #ffffff;
 	-moz-box-shadow:inset 1px 1px 0px 0px #ffffff;
 	box-shadow:inset 1px 1px 0px 0px #ffffff;
}.css_header_class:hover {
	background:-moz-linear-gradient( center top, #e9e9e9 5%, #f9f9f9 100% );
	background:-ms-linear-gradient( top, #e9e9e9 5%, #f9f9f9 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #e9e9e9), color-stop(100%, #f9f9f9) );
	background-color:#e9e9e9;
}.css_header_class:active {
	position:relative;
	top:1px;
}



.css_btn_class {
	cursor:hand;
	font-size:16px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	border:1px solid #337fed;
	padding:2px 5px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #3d94f6 5%, #1e62d0 100% );
	background:-ms-linear-gradient( top, #3d94f6 5%, #1e62d0 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3d94f6', endColorstr='#1e62d0');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #3d94f6), color-stop(100%, #1e62d0) );
	background-color:#3d94f6;
	color:#ffffff;
	display:inline-block;
	text-shadow:1px 1px 0px #1570cd;
 	-webkit-box-shadow:inset 1px 1px 8px 0px #97c4fe;
 	-moz-box-shadow:inset 1px 1px 8px 0px #97c4fe;
 	box-shadow:inset 1px 1px 8px 0px #97c4fe;
}.css_btn_class:hover {
	background:-moz-linear-gradient( center top, #1e62d0 5%, #3d94f6 100% );
	background:-ms-linear-gradient( top, #1e62d0 5%, #3d94f6 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e62d0', endColorstr='#3d94f6');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #1e62d0), color-stop(100%, #3d94f6) );
	background-color:#1e62d0;
}.css_btn_class:active {
	position:relative;
	top:1px;
}


.css_btn_class1 {
	font-size:16px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	border:1px solid #dcdcdc;
	padding:2px 5px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	background:-ms-linear-gradient( top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ededed), color-stop(100%, #dfdfdf) );
	background-color:#ededed;
	color:#777777;
	display:inline-block;
	text-shadow:1px 1px 0px #ffffff;
 	-webkit-box-shadow:inset 1px 1px 8px 0px #ffffff;
 	-moz-box-shadow:inset 1px 1px 8px 0px #ffffff;
 	box-shadow:inset 1px 1px 8px 0px #ffffff;
}.css_btn_class1:hover {
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	background:-ms-linear-gradient( top, #dfdfdf 5%, #ededed 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #dfdfdf), color-stop(100%, #ededed) );
	background-color:#dfdfdf;
}.css_btn_class1:active {
	position:relative;
	top:1px;
}


.css_btn_class2 {
	cursor:hand;
	font-size:16px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	border:1px solid #d83526;
	padding:2px 5px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
	background:-ms-linear-gradient( top, #fe1a00 5%, #ce0100 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #fe1a00), color-stop(100%, #ce0100) );
	background-color:#fe1a00;
	color:#ffffff;
	display:inline-block;
	text-shadow:1px 1px 0px #b23e35;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #f29c93;
 	-moz-box-shadow:inset 1px 1px 0px 0px #f29c93;
 	box-shadow:inset 1px 1px 0px 0px #f29c93;
}.css_btn_class2:hover {
	background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
	background:-ms-linear-gradient( top, #ce0100 5%, #fe1a00 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ce0100), color-stop(100%, #fe1a00) );
	background-color:#ce0100;
}.css_btn_class2:active {
	position:relative;
	top:1px;
}


.css_btn_class3 {
	cursor:hand;
	font-size:16px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	border:1px solid #d83526;
	padding:2px 5px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
	background:-ms-linear-gradient( top, #fe1a00 5%, #ce0100 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #fe1a00), color-stop(100%, #ce0100) );
	background-color:#fe1a00;
	color:#ffffff;
	display:inline-block;
	text-shadow:1px 1px 0px #b23e35;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #f29c93;
 	-moz-box-shadow:inset 1px 1px 0px 0px #f29c93;
 	box-shadow:inset 1px 1px 0px 0px #f29c93;
}.css_btn_class3:hover {
	background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
	background:-ms-linear-gradient( top, #ce0100 5%, #fe1a00 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ce0100), color-stop(100%, #fe1a00) );
	background-color:#ce0100;
}.css_btn_class3:active {
	position:relative;
	top:1px;
}


.css_btn_class4 {
	cursor:hand;
	font-size:16px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	border:1px solid #337fed;
	padding:2px 5px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #3d94f6 5%, #1e62d0 100% );
	background:-ms-linear-gradient( top, #3d94f6 5%, #1e62d0 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3d94f6', endColorstr='#1e62d0');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #3d94f6), color-stop(100%, #1e62d0) );
	background-color:#3d94f6;
	color:#ffffff;
	display:inline-block;
	text-shadow:1px 1px 0px #1570cd;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #97c4fe;
 	-moz-box-shadow:inset 1px 1px 0px 0px #97c4fe;
 	box-shadow:inset 1px 1px 0px 0px #97c4fe;
}.css_btn_class4:hover {
	background:-moz-linear-gradient( center top, #1e62d0 5%, #3d94f6 100% );
	background:-ms-linear-gradient( top, #1e62d0 5%, #3d94f6 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e62d0', endColorstr='#3d94f6');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #1e62d0), color-stop(100%, #3d94f6) );
	background-color:#1e62d0;
}.css_btn_class4:active {
	position:relative;
	top:1px;
}

