﻿/*  
Name: missunderstood template
Author: will rossiter
Date: 2/05/2006
*/

/***Misc Tags***/

* {
 margin: 0px;
 padding: 0px;
}

body {
 /* background:#f9ff4d url(css/bg.gif) repeat-x; ; */
 background:#f5b252;
 font-family: "標楷體", Verdana, Arial, sans-serif, 新細明體;
 font-size: 17px;
 color: #000;}
 
a img{ border: 0px; }

a { text-decoration: none;}

td, th {vertical-align:top;text-align:left;padding:5px;}
li {list-style:none;}

input {
 background: #333;
 font-family: Verdana;
 font-size: 0.7em;
 padding: 3px;
 color: #f4f4f4;
 border: 2px solid #555;}
	
button {
 background: #222;
 font-family: Verdana;
 font-size: 0.7em;
 padding: 2px;
 color: #f4f4f4;
 border: 2px solid #444;
 height: 2em;} 


/**** Span class's *****/

.hidden { text-indent: -9000px;}
.br { clear: both;}
.pink { color: #D01A71;}
.small { font-size: x-small;}
.large { font-size: xx-large;}
.right { float: right;}
.left { float: left;}
.lspace {margin-right:10px;}
.center, #content p.center { margin-left:auto; margin-right:auto; text-align: center;}

.red {color:#de3901;font-weight:bold;}
.dark {font-size:1.2em;font-weight:bold;}

/**** Site Container ****/
 
#top, #container { width: 900px;margin:0 auto;background:#f5b252;}
#top {height:180px;}


/***Header***/

 
#logo { float: left;width:740px; background: url(css/h1.jpg) 0 0 no-repeat;
}
#logo img {margin-left:5px;} 
#logo img, #logo h1 {float:left}
#logo h1 { 
 text-indent:-999px;	
 margin-top: 0px;
 margin-left: 10px;
 font-size: 1.6em;
 letter-spacing: -0.1em;
 width:450px; height:134px;
 }
#heart {padding-top:40px;}
 
#search {
 margin-top: 30px;
 float: right;}
 
#search button { margin-left: 5px; padding: 0 2px 2px 2px;}

/***left Side Bar***/

.navlist { float: left; width: 130px; margin-top: 15px; margin-left: 5px;}

 
.navlist ul {
 list-style: none;
}

.navlist li a {
 font-family: "標楷體"; font-weight:bold;
 display: block;
 height: 25px;
  width: 100px; 
 padding: 9px;
 margin: 5px;
 background: inherit;
 background: url(css/menu.gif) center; /* bottom repeat-x; */
 border-right: 4px solid #444;
 color: #000;
 text-transform: lowercase;
 font-size: 1.3em;}
 
.navlist li a:hover {
 color: #e13d00		;
 background: #c73100 url(css/menu2.png); /**/
 border-right: 4px solid #f3e500;}
 
.navlist li .active {
 color: #056000;
 background: #ccc; /*f4ac00*/
 border:1px solid #000;
 border-right: 4px solid #000;/*ff8914*/}

.navlist ul li ul li a {width:110px;height:24px;margin:0px 3px;}

/***Content***/

#content { float: right; width: 735px; margin-top: 20px; margin-right: 10px; font-size:1.1em;}

#content a { color:#850001; font-weight: bold;}

#content a:hover { 
 color: #e55401; text-decoration:underline; 
 /*background: #D01A71;  */
 font-weight: bold;}

#content h2 { padding:0;margin:0; text-indent:-990px;height:80px;background:url(css/h2.gif) top left no-repeat;}
#content h2#intro {background:url(images/h2-intro.jpg) top left no-repeat}
#content h2#news {background:url(images/h2-news.jpg) top left no-repeat}
#content h2#facilities {background:url(images/h2-facilities.jpg) top left no-repeat}
#content h2#library {background:url(images/h2-library.jpg) top left no-repeat}
#content h2#archive {background:url(images/h2-archive.jpg) top left no-repeat}
#content h2#learn {background:url(images/h2-learn.jpg) top left no-repeat}
#content h2#links {background:url(images/h2-links.jpg) top left no-repeat}
#content h2#support {background:url(images/h2-support.jpg) top left no-repeat}
#content h2#contact {background:url(images/h2-contact.jpg) top left no-repeat}
 
#content p, #content li, #content td, #content th { text-align:justify; line-height: 1.5em; letter-spacing:0.1em; }
#content p, #content li { margin-bottom: 15px; }

#content span.nospace, #content a.nospace {letter-spacing:0em;}

#content h3 {
text-indent: 0px;
color: #000;
font-size:1.5em;
letter-spacing: 0.1em;
margin-bottom: 15px;
}
#content h3 span { padding:10px 20px 9px 10px;background:url(css/h3.gif) bottom right no-repeat;}

#content h3:hover# { color: #fff;}
	  
h4 {font-size:1.2em;color:#7a3232;;margin-top:20px;}

#content ul.learn li {padding-left:30px; margin-bottom:0; background:url(images/li3.gif) 3px 8px no-repeat}
#content ul.info li { padding-left:30px;background:url(css/li.gif) top left no-repeat}
#content ul.links li {float:left;width:33%;height:100px;letter-spacing:0;}
#content ul.links li {position:relative;}
#content ul.links li div {position: absolute;bottom:0;text-align:center;width:100%;}

#content blockquote { color: #999; font-style: italic; text-align: center; width: 300px; margin: 10px auto;}

table {margin:15px 0;}
table caption {font-size:1.3em; padding-right:120px; color:#ad3a3a; }
table table {margin:0px;}
#content td p, #content td li { margin-bottom: 0px; }

.center {text-align:center;}
#content div.full {width:100%;float:left;text-align:center;}
#content div.half, #content div.left, #content div.right {width:50%;float:left;text-align:center;}
#content div.full p, #content div.half  p {font-family: 新細明體, Times New Roman;font-size:0.9em;clear:both;margin-bottom:15px;}
#content div.full img, #content div.half img {margin:0 10px 5px 0; float:left;}
img.left {margin-right:10px;}
#content img.right, #content div img.right, #content div.right img {margin-right:0;float:right;}
#content div.right p {text-align:right;}
#content img.photos { border:1px solid #000;}

#content a.listen {padding-right:20px; background:url(css/listen.gif) right no-repeat;}
div.clip img {border:5px solid #fff;}
 
p.linkxs {margin-left:20px;}
.linkxs a { padding:5px 30px;background:url(css/links.gif) 5px 70% no-repeat;} 
/***Footer***/

#footer {
 text-align: center;
 color: #666;
 margin-top: 30px;
 font-size: 0.7em;
 height:150px;
 background:url(css/bottom.gif) bottom left no-repeat;}
 }
 
#footer p { color: #666;}
 
#footer a { color: #666;}
 
#footer a:hover { color: #f4f4f4;}
	
/****chart****/


table.chart td {text-align:center }
#content table.library {margin-top;0}
#content .chart caption {font-size:1.4em; text-decoration:underline; padding-right:0;}
#content .chart td {padding:0;}
#content .chart p {margin:0px auto;text-align:center;width:100px;padding:10px;border:1px solid #000;background:#fff;}
#content .chart table p {letter-spacing:0;width:70px;padding:5px;}
.chart td.c1 {background:url(css/chartc1.gif) center no-repeat;}
.chart td.c2 {background:url(css/chartc2.gif) center no-repeat;}
.chart td.c3 {background:url(css/chartc3.gif) center no-repeat;}
.chart td.r1 {background:url(css/chartright.gif) center no-repeat;}
.chart td.l1 {background:url(css/chartleft.gif) center no-repeat;}
 
 .tablerem {margin-top:-20px;margin-bottom:20px;}
 
.in8char {text-indent:-8em;padding-left:8em;}
.in4char {text-indent:-4em;padding-left:4em;}
.download {font-style:italic; padding-left:40px; background:url(css/down.gif) 25px 50% no-repeat;}

#content ul.support {margin-top:10px;}
#content ul.support li{margin-bottom:30px;padding-left:15px;background:url(css/li-star.gif) 0 5px no-repeat;}
 
ol.number li {list-style-position:outside;list-style:decimal; margin-left:30px}
