body{ background-color:#333; font-family:Arial; font-size:12px;}
img{ border:none;}
embed{ background:none;}
a{ text-decoration:none;color:#0071AA;}
a:hover{ text-decoration:underline;}
.clearfloat { clear:both; height:0; font-size: 1px; line-height: 0px;}
.send{ text-align:center; margin-top:3em;}
.btnY{ border:2px solid #000; background:#E99E3B;padding-top:4px !important;}
.btnLog{ background:#F0D786;}
/* ===============layout======================= */
.container{ width:960px; margin:0 auto; border:8px solid #BC926D; background:url(../images/bg_container.gif);}
.papercraft .container, .knot_sachet .container, .dough_game .container, .lantern_kite .container { background:#FFECD2 url(../images/bg_left4.gif) repeat-y;}
.header{ background:#231815; position:relative;}
.header h2{ background: url(../images/img_header.gif) no-repeat; height:45px; width:600px; text-indent:-9999px; margin:0; padding:0;}
.header p{ margin:0; padding:0;position:absolute; top:10px; right:15px; color:white; font-size:16px;}
.header img{ vertical-align:middle; margin-left:10px;}
.topMenu{ background:url(../images/bg_topMenu.gif); height:29px; font-size:16px;}
/* new */
.function{ margin:0; padding:0; list-style:none;}
.function li{ float:right; padding-left:22px; line-height:22px; margin-right:15px; margin-top:4px; font-size:12px;}
.function a{ color:#211E0E;}
.guide{ background:url(../images/help-contents.png) no-repeat left center;}
.downloadAll{ background:url(../images/tool_drop_target.png) no-repeat left center;}
.homeBtn{ background:url(../images/redhat-home.png) no-repeat left center;}
.referenceBtn{ background:url(../images/web.png) no-repeat left center;}
.forumBtn{ background:url(../images/bubble_32.png) no-repeat left center;}

/* ---old close--- */
/*.topMenu ul{ margin:0; padding:0; list-style-type:none;}
.topMenu ul li{ float:left; background:url(../images/line_topMenu.gif) no-repeat right;}
.topMenu ul li a{ line-height:29px; display:block; padding:0 20px; text-decoration:none; color:#211E0E;}*/
/* topMenu marker */
/*.topMenu ul li a:hover,
.home .topMenu ul li#menu_home a,
.knot_sachet .topMenu ul li#menu_knot_sachet a,
.dough_game .topMenu ul li#menu_dough_game a,
.lantern_kite .topMenu ul li#menu_lantern_kite a,
.papercraft .topMenu ul li#menu_papercraft a{ color:#663300; font-weight:bold;}*/

/* 登入 */
.logBox{ width:298px; height:207px; background: url(../images/red.png); display:none; padding-top:50px; font-weight:bold;text-align:center;}
.logBox input[type="text"], .logBox input[type="password"]{ width:50%; margin-left:5px; margin-right:15px;}
.logBox .close { background-image:url(../images/close.png); position:absolute; right:5px; top:5px; cursor:pointer; height:35px; width:35px;}

/* 左選單 */
.content .left{width:205px; float:left;}
.content .left ul{ list-style-type:none; margin:0; padding:0; margin-top:20px;}
.content .left li{ margin: 5px 0;}
.content .left li a{ display:block; background:url(../images/btn_left.png) bottom no-repeat; width:181px; height:30px; line-height:30px; text-decoration:none; padding-left:30px; color:black; font-size:14px;}
.content .left li a:hover, .content .left li.active a{background:url(../images/btn_left.png) top no-repeat;}

.content .main{ margin-left:210px; }
/* 右側欄 */
.content .main .right{ float:right; width:182px;}
.content .main .right > p{ margin:20px 0; padding-left:130px; position:relative;}
.download{ display: inline-block; background:url(../images/icons_pdf.png); width:32px; height:32px; text-indent:-9999px; margin-top:5px;}
/*.movie{ display: inline-block; background:url(../images/icons_movie.png) no-repeat; width:34px; height:36px; text-indent:-9999px; position:absolute; right:60px;}*/
.noteBox{ width:145px; background-color:#F0E4C1; border:1px solid #BC926D; padding:10px;}
.noteBox h4{ color:#850910; margin:0; margin-bottom:5px;}
.noteBox p{ font-size:12px; line-height:1.5; margin:0; margin-bottom:5px;}
.noteBox img{ width:100%; margin:3px 0;}

/* 主內容區 */
.content .main .context{ margin-right:190px; padding: 25px 0 0 10px;}
.content .main .context > img{ margin-bottom:30px;}
.content .main .context .textBox > img{ float:left; margin-right:6px;}
.pageNum{ text-align:center; margin:20px 0; padding-left:20px;}
.pageNum a{ background:url(../images/btn_pageNum.png) bottom center no-repeat; padding:5px 10px; font-size:14px;  color:#42210B; text-decoration:none; line-height:26px; margin:0 2px;}
.pageNum a:hover, .pageNum a.active{ background:url(../images/btn_pageNum.png) top  center no-repeat;}
.tip{ display:none; position:absolute;background-color:#eee; color:#000; width:100px; border:1px solid #333; padding:5px; font-size:12px;}
/* 上下頁 */
/*.nextPrePage a{ display:block; background:url(../images/btn_next.png) no-repeat right top; width:24px; height:24px; text-indent:-9999px;}
.nextPrePage a:hover{ background-position:right bottom;}
.prePage a{ background-position:left top;}
.prePage a:hover{ background-position:left bottom;}*/


.footer{ background-color:#231815; padding:20px 0; color:#B39341;  font:12px/.3 Arial, Helvetica, sans-serif; text-align:center; margin-top:3em;}
/* ===========================單元 h1========================== */
h1{ font-size:22px; color:#603813; line-height:45px; margin:0; margin-bottom:1em;}
h1 span{ display:block; width:45px; height:45px; float:left; margin-right:3px;}
.demo h1 span{ background: url(../images/img_homeIcon.png) top center;}
.interview h1 span{ background: url(../images/img_homeIcon.png) top right;}
.homework h1 span{ background: url(../images/img_homeIcon.png) center left;}
.test h1 span{ background: url(../images/img_homeIcon.png) center center;}
.reference h1 span{ background: url(../images/img_homeIcon.png) center right;}


/*===========================index================================*/
.contentPic{ width:776px; margin:0 auto; text-align:center; margin-bottom:20px; position:relative; margin-top:20px;}
.contentPic p a{ background-color:#F1A63B; border: 2px solid #42210B; line-height:24px; margin:0 5px; font-family:Arial; font-size:19px; text-decoration:none; color:#000; padding:0 5px;}
.contentPic p a:hover, .contentPic p a.active{ background-color:#5D99A2;}
.home h1{ text-align:center; background: url(../images/bg_homeH1.gif) ; width:296px; height:65px; text-indent:-9999px; margin:auto;}

/* 六單元說明 */
.intro{ width:605px; margin:0 auto;}
.intro li{ background:url(../images/bg_homeIntro.gif)  bottom; width:168px; height:200px; list-style-type:none; position:relative;float:left; margin:10px 15px;}
.intro li h3{ background:url(../images/bg_homeIntro.gif); font-family:標楷體; font-size:23px; text-align:center; padding-top:21px; line-height:20px; margin:0;}
.intro li h3 span{ display:block; font-family:Georgia, "Times New Roman", Times, serif; font-size:16px; color:#826239; font-weight:normal; text-transform:capitalize;}
.intro li p{ padding:0 20px; line-height:1.5;}
.intro li strong{ position:absolute; width:44px; height:44px; text-indent:-9999px; background:url(../images/img_homeIcon.png) top left; top:-15px; left:-15px; }
.intro li.intro2 strong{background:url(../images/img_homeIcon.png) top center;}
.intro li.intro3 strong{background:url(../images/img_homeIcon.png) top right;}
.intro li.intro4 strong{background:url(../images/img_homeIcon.png) center left;}
.intro li.intro5 strong{background:url(../images/img_homeIcon.png) center center;}
.intro li.intro6 strong{background:url(../images/img_homeIcon.png) center right;}

/* ============================一般===================================== */
.colorRed{ color:#FF0000;}
/* 主題上方BANNER */
.banner{ position:relative;}
.banner h2{  text-indent:-9999px; margin:0; padding:0;}
.knot_sachet .banner{ background:#f1b8a4 url(../images/header_pj1.gif) no-repeat;}
.dough_game .banner{ background:url(../images/header_pj2.gif);}
.lantern_kite .banner{ background:url(../images/header_pj3.gif) ;}
.papercraft .banner{ background:#f1dda2 url(../images/header_pj4.gif) no-repeat;}
/* 單元切換 */
.banner{ height:78px; border-bottom:3px solid #332615;}
.banner ul{ list-style-type:none; margin:0; padding:0; position:absolute; top:10px; right:10px;}
.banner li{ float:left;  margin-right:12px; text-align:center;}
.banner li a{text-decoration:none;font-size:11px; color:#42210B; margin-top:46px;}
.banner li a span{ display:block; width:45px; height:45px; margin-bottom:3px;}
.banner li#nav_course a span{ background: url(../images/img_homeIcon_hover.png);}
.banner li#nav_course  a:hover span, .course .banner li#nav_course  a span{ background: url(../images/img_homeIcon.png);}
.banner li#nav_demo a span{ background: url(../images/img_homeIcon_hover.png) top center;}
.banner li#nav_demo a:hover span, .demo .banner li#nav_demo  a span{ background: url(../images/img_homeIcon.png) top center;}
.banner li#nav_interview a span{ background: url(../images/img_homeIcon_hover.png) top right;}
.banner li#nav_interview a:hover span, .interview .banner li#nav_interview  a span { background: url(../images/img_homeIcon.png) top right;}
.banner li#nav_homework a span{ background: url(../images/img_homeIcon_hover.png)  center left;}
.banner li#nav_homework a:hover span, .homework .banner li#nav_homework  a span{ background: url(../images/img_homeIcon.png)  center left;}
.banner li#nav_test a span{ background: url(../images/img_homeIcon_hover.png) center center;}
.banner li#nav_test a:hover span, .test .banner li#nav_test  a span{ background: url(../images/img_homeIcon.png) center center;}
.banner li#nav_reference a span{ background: url(../images/img_homeIcon_hover.png) center right;}
.banner li#nav_reference a:hover span, .reference .banner li#nav_reference  a span{ background: url(../images/img_homeIcon.png) center right;}
.banner li#nav_forum a span{ background: url(../images/img_homeIcon_hover.png) bottom left;}
.banner li#nav_forum a:hover span, .forum .banner li#nav_forum  a span{ background: url(../images/img_homeIcon.png) bottom left;}

/* 各講選單subNav */
.subNav { background-color:#f1a63b; border-bottom:3px solid #332615;}
.subNav > p{ text-align:center; background-color:#e39c38; margin:0;}
.subNav > p a{ text-decoration:none; padding: 3px; border-right:1px solid #42210B; color:#42210B; font-size:15px; font-weight:bold; line-height:23px; }
.subNav > p a:hover, .subNav > p a.active,
.ch1 .subNav > p a#ch1,
.ch2 .subNav > p a#ch2,
.ch3 .subNav > p a#ch3,
.ch4 .subNav > p a#ch14,
.ch5 .subNav > p a#ch5,
.ch6 .subNav > p a#ch6,
.ch7 .subNav > p a#ch7,
.ch8 .subNav > p a#ch8,
.ch9 .subNav > p a#ch9,
.ch10 .subNav > p a#ch10{ background:#FFF4DA;}
.chTitle{ display:none; padding:2px 8px; border: 2px solid #111; background-color:Purple; position:absolute; font-size:12px; color:#FFF;}
.chBar{ background:url(../images/bg_chBar.gif); height:30px; border-bottom:3px solid #42210B; text-align:center; line-height:33px; font-weight:bold; font-size:18px; color:#42210B;}

/* -------overlay------- */
.overlay {width:600px; height:470px; background: url(../images/white.png); display:none; padding:55px;}
.overlay > div { height:441px;   overflow-y:auto;}
.overlay .close { background-image:url(../images/close.png); position:absolute; right:5px; top:5px; cursor:pointer; height:35px; width:35px;}
.fileBox { margin-left:140px; margin-right:10px;}
.fileBox h3 { border:  double  #222; background:url(../images/bg_testBox_h3.gif) repeat-y white; font-size:18px; color:#333333;  padding-top:4px  !important;}
.fileBox ul { margin:0; margin-left:20px; margin-right:10px; list-style: disc;}
.fileBox li { line-height:1.8;}
.picHead { float:left; margin-left:10px; width:110px; text-align:center; line-height:2;}
.picHead img { padding:5px; background:url(../images/bg_picHead.gif) repeat-x bottom; border:1px solid black;}