@import url("../css/normalize.css");
@import url(https://fonts.googleapis.com/css?family=Carme|Open+Sans:400,700);
/* HTML5 Boilerplate */
html, button, input, select, textarea {color:#333;}
body{font-size:1em; line-height:1.4; background:#d6efe9; font-family:Helvetica, Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;}

::-moz-selection {background:#b3e0fc; text-shadow:none;}
::selection {background:#b3e0fc; text-shadow:none;}

hr{display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0;}

/* 移除圖片底下間隙 */
img{vertical-align: middle;}

/* 移除fieldset預設樣式 */
fieldset{border:0; margin:0; padding:0;}

/* 只允許文字區域垂直調整大小 */
textarea{resize:vertical;}

a, a:hover, a:active, a:focus {outline:0;}
a:visited{color:#8c41a1;}
/* --- ! --- */


/* --- GLOBAL --- */
body{-webkit-font-smoothing:antialiased;}
.PMingLiU{font-family:"PMingLiU";}
.JhengHei{font-family:"Microsoft JhengHei";}

/* 設置提示文字顏色 */
::-webkit-input-placeholder{color:#aaa;}
:-moz-placeholder{color:#aaa;}
.placeholder{color:#ccc;}
/* --- ! --- */


/* --- HEADER --- */
#header-container{height:186px; background:url(../images/top-bg.png) center 0 #5dc6b0 repeat-x;}
#header-container header{width:980px; height:145px; margin:0 auto; background:url(../images/top-bg-center.jpg) center 0 no-repeat;}
#header-container header hgroup{float:left; padding:26px 5px;}
#header-container header h1{background:url(../images/dest-logo.png) no-repeat; width:454px; height:91px; text-indent:-9999em; margin:0; }
#header-container header h2{display:none;}

#top-right{float:right; font-size:12px; color:#3baf95; padding-top:45px; position:relative; width:350px; text-align:right; padding-right:165px;}
#top-right a{text-decoration:none; color:#fff; margin:0 5px;}
#top-right a:hover{color:#111;}
	/* --- SEARCH --- */
	#top-right .top-search{position:absolute; top:40px; right:14px;}
	#top-right .gsc-search-box{}
	#top-right input.gsc-input{width:120px; border:1px solid #6cc7b2; padding:3px;}
	#top-right input.gsc-search-button{background:url(../images/icon-search.png) center 50% no-repeat #fff; width:17px; height:17px; border:none; 
		position:absolute; right:18px; top:3px; text-indent:-9999em; box-shadow:none;}
	#top-right .gsc-clear-button, #top-right input.gsc-clear-button{display:none; z-index:-1;}
	
	/* --- LOGIN INFORMATION --- */
	#login-info{position:absolute; top:80px; right:5px; font-size:12px; color:#333; text-align:right; padding:10px; border-bottom:1px solid #17a794;}
	#login-info span{color:#111;}
	#login-info .logout{color:#d81b2b; text-decoration:none;}
/* --- ! --- */

/* --- NAVIGATION --- */
#header-container nav{margin:0 auto; width:980px; height:41px;}
#menu{margin:0 auto; width:970px;}
#menu li{float:left; position:relative;}
#menu li#member     {background:url(../images/menu-bg-green.png);}
#menu li#dr         {background:url(../images/menu-bg-yellow.png);}
#menu li#technicians{background:url(../images/menu-bg-blue.png);}
#menu li#people     {background:url(../images/menu-bg-red.png);}
#menu li a {display:block; color:#fff; text-decoration:none; height:41px;}
#menu li a:hover, #menu li a:active{text-decoration:none; }
#menu li ul {position:absolute; top:41x; left:0; z-index:101; background:#0f7661; display:none; opacity:0; padding:0; margin:0; width:100%;
	border:0px solid #ddd; border-bottom:none; border-top:none;
	box-shadow:0 2px 3px rgba(0,0,0,.3);}
#menu li ul li {position:relative; border-bottom:1px solid rgba(0,0,0,.2); border-top:none; margin:0; font-size:12px; width:100%;}
#menu li ul li a{display:block; padding:8px 10px; height:18px; line-height:18px; color:#fff;}
#menu li ul li a:hover {background:rgba(0,0,0,.2); color:#fff;}
#menu li ul li .disabled{display:block; padding:8px 10px; height:18px; line-height:18px; color:#333;}
#menu li ul ul {left:150px; top:0px}

#menu .menulink{font-size:13px; line-height:41px; padding:0 8.1px; 
	width:50px;
	background-image:url(../images/menu-item.png); background-repeat:no-repeat;
	text-indent:-9999em;}

#menu .news       {width:64px; background-position:center 0px;}
#menu .photo      {width:64px; background-position:center -41px;}
#menu .about      {width:64px; background-position:center -82px;}
#menu .event      {width:64px; background-position:center -123px;}
#menu .data       {width:106px; background-position:center -164px;}
#menu .elearning  {width:100px; background-position:center -205px;}
#menu .magazine   {width:64px; background-position:center -246px;}
#menu .member     {width:35px; background-position:center -287px;}
#menu .dr         {width:64px; background-position:center -328px;}
#menu .technicians{width:50px; background-position:center -369px;}
#menu .people     {width:35px; background-position:center -410px;}
#menu .hr         {width:64px; background-position:center -451px;} 
/* --- ! --- */


/* --- SUB MENU --- */
#sub-menu{margin-bottom:20px; font-family:"微軟正黑體", "Microsoft JhengHei";}
#sub-menu h3{margin:0; padding:5px 10px 8px; font-size:18px; color:#118772; border-bottom:3px solid #15a693;}
#sub-menu ul{list-style:none; padding:0; margin:0 0 15px; font-size:13px;}
#sub-menu ul li{border-bottom:1px solid #ccc; font-family:"微軟正黑體", "Microsoft JhengHei";}
#sub-menu ul li a{display:block; padding:8px 10px; text-decoration:none; color:#333; font-weight:bold; 
	background:url(../images/icon-arr.png) 98% 50% no-repeat;}
#sub-menu ul li a:hover{background:url(../images/icon-arr-hover.png) 98% 50% #118772 no-repeat; color:#fff;}
#sub-menu ul li a.current{background:url(../images/icon-arr-current.png) 98% 50% #f8f8f8 no-repeat; color:#118772;}
#sub-menu ul li a.current:hover{background-color:#f8f8f8; color:#118772; cursor:default;}
#sub-menu ul li .disabled{display:block; padding:8px 10px; text-decoration:none; color:#aaa; font-weight:bold; }
	/* 受訓醫師 */
	#sub-menu.typeR h3{color:#d2852a; border-color:#d2852a;}
	#sub-menu.typeR ul li a:hover{background-color:#d2852a;}
	#sub-menu.typeR ul li a.current{background:url(../images/icon-arr-current-d.png) 98% 50% #f8f8f8 no-repeat; color:#d2852a;}
	#sub-menu.typeR ul li a.current:hover{background-color:#f8f8f8; color:#d2852a;}
	/* 技術師 */
	#sub-menu.typeT h3{color:#2188d5; border-color:#2188d5;}
	#sub-menu.typeT ul li a:hover{background-color:#2188d5;}
	#sub-menu.typeT ul li a.current{background:url(../images/icon-arr-current-t.png) 98% 50% #f8f8f8 no-repeat; color:#2188d5;}
	#sub-menu.typeT ul li a.current:hover{background-color:#f8f8f8; color:#2188d5;}
	/* 民眾專區 */
	#sub-menu.typeP h3{color:#c94240; border-color:#c94240;}
	#sub-menu.typeP ul li a:hover{background-color:#c94240;}
	#sub-menu.typeP ul li a.current{background:url(../images/icon-arr-current-p.png) 98% 50% #f8f8f8 no-repeat; color:#c94240;}
	#sub-menu.typeP ul li a.current:hover{background-color:#f8f8f8; color:#c94240;}
/* --- ! --- */


/* --- CONTAINER --- */
#content-container-bg{background:url(../images/content-bg.png) repeat-x #fff; height:auto!important;min-height:470px;height:470px;}
#content-container{margin:0 auto; width:980px; height:auto!important;min-height:340px;height:340px; padding-top:20px; padding-bottom:24px;}
#page-left{float:left; width:202px; height:100%;}
#content{float:right; width:760px; position:relative;}
#content.google-results{float:none; width:100%;}
#content header{background:#15a693;}
#content header h2{margin:0; padding:8px 10px; color:#fff; font-family:"微軟正黑體", "Microsoft JhengHei", sans-serif; font-size:18px;}
#content article{font-size:.8em; word-wrap:break-word; word-break:normal; padding-top:15px;}
	/* 受訓醫師 */
	#content header.typeR{background:#d2852a;}
	/* 技術師 */
	#content header.typeT{background:#2188d5;}
	/* 民眾專區 */
	#content header.typeP{background:#c94240;}
/* --- ! --- */


/* --- BREADCRUMB --- */
#breadcrumb{float:right; text-align:right; font-size:12px; color:#333; line-height:24px; margin-top:8px; padding-right:10px;}
#breadcrumb a{color:#333; text-decoration:none;}
/* --- ! --- */


/* --- GOOGLE RESULTS --- */
a.result{color:#333; text-decoration:none; font-size:15px; display:block; padding:10px; border-bottom:1px dotted #ccc;}
a.result:hover{color:#118772; background:#fefce8;}
a.result:visited{color: #8c41a1;}
/* --- ! --- */


/* --- SEARCH --- */
#search-block{font-size:13px; color:#333; padding:8px 10px 8px; margin-bottom:5px; text-align:right; background:#f8f8f8; border:1px solid #ddd;}
#search-block input[type=text]{background:#fff; box-sizing:border-box;}
#search-block input[type=submit], #search_block input[type=button]{
	background:url(../images/button-bg.png) 0 bottom repeat-x #fff; width:60px; 
	font-weight:normal; font-size:13px; color:#11917c;
	text-shadow:0 1px 0px rgba(100%,100%,100%,1); 
	-moz-text-shadow:0 1px 0px rgba(100%,100%,100%,1); 
	-webkit-text-shadow:0 1px 0px rgba(100%,100%,100%,1);}
#search-block input[type=submit]{float:right; margin-left:10px;}
#search-block input[type=submit]:hover{background:#11917c; color:#fff; text-shadow:none; -moz-text-shadow:none; -webkit-text-shadow:none; }
	/* 受訓醫師 */
	#search-block.typeR input[type=submit]{color:#cf8329; border-color:#cf8329;}
	#search-block.typeR input[type=submit]:hover{color:#fff; background:#cf8329; border-color:#cf8329;}
	/* 技術師 */
	#search-block.typeT input[type=submit]{color:#097eda; border-color:#097eda;}
	#search-block.typeT input[type=submit]:hover{color:#fff; background:#097eda; border-color:#097eda;}
	/* 民眾 */
	#search-block.typeP input[type=submit]{color:#c53735; border-color:#e96765;}
	#search-block.typeP input[type=submit]:hover{color:#fff; background:#c53735; border-color:#c53735;}
	#search-block.typeP .button{color:#c53735; border-color:#e96765;}
	#search-block.typeP .button:hover{color:#fff; background:#c53735; border-color:#c53735;}
/* --- ! --- */


/* --- Error Information --- */
.err-info{font-size:15px; line-height:180%; padding:1em; background:#fffcee; border:1px solid #efc88c; margin:5px 0;}
.err-info p{text-align:center; padding:2em; margin:0;}
.err-info p strong{color:#111; padding:0 8px;}
.err-info #sec{color:#0b5fd0; padding:5px;}
.err-info a.back{color:#0b5fd0; padding:5px;}
/* --- ! --- */


/* --- PAGE --- */
.page{font-size:12px; padding:3px; margin:14px 0px; text-align:center;}
.page span a, .page span a:hover, .page .current, .page .disabled{padding:3px 4px; margin:2px;	}
.page a{color:#333; border:1px solid #aaa; cursor:pointer; text-decoration:none; }
.page a:hover{color:#fff; background:#118772; border:1px solid #118772;}
.page .current{color:#118772; font-weight:bold;}
.page .disabled{color:#ddd; border:1px solid #ddd;}
	/* 受訓醫師 */
	.page.typeR a:hover{color:#fff; background:#c67c24; border:1px solid #c67c24;}
	.page.typeR .current{color:#c67c24; font-weight:bold;}
	/* 技術師 */
	.page.typeT a:hover{color:#fff; background:#097bd7; border:1px solid #097bd7;}
	.page.typeT .current{color:#097bd7; font-weight:bold;}
	/* 民眾專區 */
	.page.typeP a:hover{color:#fff; background:#b72c2a; border:1px solid #b72c2a;}
	.page.typeP .current{color:#b72c2a; font-weight:bold;}
/* --- ! --- */


/* --- BANNER --- */
#banners{background:none; float:left;}
#banners ul{width:202px; margin:0 auto; padding:0; list-style:none;}
#banners ul li{float:none; text-align:center; padding:5px 0;}
#banners ul li img{margin:0 auto; border:1px solid #ccc;}
/* --- ! --- */


/* --- FOOTER --- */
footer{background:url(../images/footer-bg.png) repeat-x #d6efe9; height:114px;}
footer small{display:block; width:980px; margin:0 auto; color:#436d64; font-size:12px; line-height:18px; text-align:center; padding:18px 0;}
footer small .add{background:url(../images/icon-add.png) 0 50% no-repeat; padding-left:16px;}
footer small .tel{background:url(../images/icon-tel.png) 0 50% no-repeat; padding-left:16px;}
footer small .fax{background:url(../images/icon-fax.png) 0 50% no-repeat; padding-left:16px;}
footer small .email{background:url(../images/icon-email.png) 0 50% no-repeat; padding-left:16px;}
footer small a{color:#436d64; text-decoration:none;}
footer small a:hover{color:#000;}
/* --- ! --- */


/* Hide from both screenreaders and browsers */
.hidden{display:none !important; visibility: hidden;}

/* Clearfix: contain floats */
.clearfix:before,
.clearfix:after {
    content: ""; /* 1 */
    display: table; /* 2 */
}
.clearfix:after{clear: both;}
/* For IE 6/7 only */
.clearfix{*zoom: 1;}


/* --- COMM --- */
.ul-nostyle{ padding:0px 0px 0px 0px; list-style:none;}
.maxWidth { width:100%;}
.maxHeight { height:100%; margin:0 auto;}
.floatL{ float:left; }
.floatR{ float:right; }
.relative{ position:relative;}
.fixed{ position:fixed;}
.absolute{position:absolute;}
.explanation{font-size:12px; color:#C60; font-weight:normal;}
.required{color:#f00; font-weight:normal; font-size:12px;}
table tr.even{background:#f7f7f7;}
table tr.odd{background:#fff;}
#ui-datepicker-div{font-size:12px;}
.ui-datepicker-trigger{margin-left:3px;}
/* --- ! --- */


/* Form */
input[type=text], input[type=password], input[type=email], input[type=tel], textarea, select{
	box-sizing:border-box;
	padding:5px 4px;
	border:1px solid #ccc;
	background:#fff;
	box-shadow:inset 0 1px 2px #ddd, 0 1px 1px rgba(100%,100%,100%,.4); 
	-moz-box-shadow:inset 0 1px 2px #ddd, 0 1px 1px  rgba(100%,100%,100%,.4);
	-webkit-box-shadow:inset 0 1px 2px #ddd, 0 1px 1px  rgba(100%,100%,100%,.4);
}
select{padding:3px; border:1px solid #ccc;}
select option{padding:3px; background:#fff;}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, textarea:focus, select:focus{
	outline:0;
	background:#d2f1f8;
	border:1px solid #67cfff; background:#fff;
	box-shadow:0 0 3px rgba(123,211,255,0.8), inset 0 1px 2px #ddd; 
	-moz-box-shadow:0 0 3px rgba(123,211,255,0.8), inset 0 1px 2px #ddd; 
	-webkit-box-shadow:0 0 3px rgba(123,211,255,0.8), inset 0 1px 2px #ddd;
	-ms-box-shadow:0 0 3px rgba(123,211,255,0.8), inset 0 1px 2px #ddd;
	webkit-appearance:none;
}

/* Buttons */
input[type=submit], input[type=button], input[type=reset], .buttons a, a.button, button{
	-webkit-appearance:none;
	box-sizing:border-box;
	display:inline-block; *display:inline; *zoom:1;
	vertical-align:top; text-align:center;
	background:url(../images/button-bg.png) 0 bottom repeat-x #fff;
	color:#11917c; font-weight:bold; font-size:13px; text-decoration:none;
	padding:5px 8px;
	border:1px solid #11917c;
	box-shadow:0 1px 3px rgba(0%,0%,0%,.3); -moz-box-shadow:0 1px 3px rgba(0%,0%,0%,.3); -webkit-box-shadow:0 1px 3px rgba(0%,0%,0%,.3);
	text-shadow:0 1px 0px rgba(100%,100%,100%,1);
	-moz-text-shadow:0 1px 0px rgba(100%,100%,100%,1);
	-webkit-text-shadow:0 1px 0px rgba(100%,100%,100%,1);
	cursor:pointer;
}
input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover, .buttons a:hover, a.button:hover, button:hover{
	background:#11917c;
	color:#fff;
	box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none; 
	text-shadow:none; -moz-text-shadow:none; -webkit-text-shadow:none; 
}

.buttons{text-align:right; padding:0 0 18px;}
.buttons.center{text-align:center;}
.buttons input[type=submit], .buttons input[type=button], .buttons input[type=reset], .buttons a, a.button{
	padding:5px 15px;
}


/* 受訓醫師 */
.typeR input[type=submit], .typeR input[type=button], .typeR input[type=reset], .typeR .buttons a, .typeR a.button, .typeR .btn-print, .buttons.typeR a{
	color:#c46f0a; border-color:#c46f0a;
}
.typeR input[type=submit]:hover, .typeR input[type=button]:hover, .typeR input[type=reset]:hover, .typeR .buttons a:hover, .typeR a.button:hover, .buttons.typeR a:hover{
	color:#fff; background:#c46f0a; border-color:#c46f0a;
}
/* 技術師 */
.typeT input[type=submit], .typeT input[type=button], .typeT input[type=reset], .typeT .buttons a, .typeT a.button, .typeT .btn-print, .buttons.typeT a{
	color:#097eda; border-color:#097eda;
}
.typeT input[type=submit]:hover, .typeT input[type=button]:hover, .typeT input[type=reset]:hover, .typeT .buttons a:hover, .typeT a.button:hover, .buttons.typeT a:hover{
	color:#fff; background:#097eda; border-color:#097eda;
}
