/* 2013大開學-心理測驗 CSS Document */

/*Reset CSS*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

a{
 outline: none; /* for Firefox Google Chrome  */
 behavior:expression(this.onFocus=this.blur()); /* for IE */
}

body{    
    margin:0 auto !important;
    padding:0;
    text-align:center; 
    background:url(../images/background.jpg) center 33px ;
	/*position:relative;*/
	}	
#logo{
	  width:100%;
	  background:#424242;
	  margin:0;
	  margin:0 auto;
	  padding:0;
	  height:33px;
	  text-align:center;
}
#logo table{margin:0 auto;}

#wrap{
	  width:1003px;
	  height:850px;
	  /*text-align:left;*/
	  margin:0 auto;
	  position:relative; 
	  /*background:url(../images/vision.png) 100px 0px no-repeat;*/
	 } 

.men{background:url(../images/men.gif) no-repeat;position:absolute; top:170px;left:430px;width:140px;height:140px; }
h1{background:url(../images/heading.gif) no-repeat;
	width:750px;height:60px;
	position:absolute; 
	top:320px;left:130px;
	display:block;
	}
h1 span{display:none;}
div.back{position:absolute;top:720px;right:115px;}
div.back a{
	display:block;width:75px;height:70px;
	background:url(../images/back.jpg) no-repeat;
	}
div.back a:hover{background:url(../images/back_hover.jpg) no-repeat;}
  
  
h3{font-weight:800;color:pink;}
h3, h4{padding:5px;}
.scroll-pane div{margin-bottom:200px;} 

div#ct-test{margin-left:180px;padding-top:410px;}
ol li{ margin:0 auto;margin-bottom:200px;}

/*
vision-------------------------------------------------------------------------------------
*/
p, a.start-button{margin:0 auto;}
p.start{background:url(../images/start_men.gif) no-repeat;width:565px;height:203px;margin-bottom:10px;} /*start*/
a{display:block;}
a span, h3 span, h4 span, h5 span{display:none;}
a.start-button{background:url(../images/start_button.gif) no-repeat;width:160px;height:100px;display:block;}/*button*/
a.start-button:hover{background:url(../images/start_button_hover.gif) no-repeat;}/*button*/

.q1, .q2, .q3, .q4, .q5, .q6, .q7, .q8, .q9, .q10{position:relative;height:330px;}
.q1 h3, .q2 h3, .q3  h3, .q4 h3, .q5 h3, .q6 h3, .q7 h3, .q8 h3, .q9 h3, .q10 h3{
	width:600px;height:110px;
	background-image:url(../images/question.gif);
	background-repeat:no-repeat;
	display:block;
	margin-bottom:75px;
	}
.q1 h3{background-position:-0px -0px;} 
.q2 h3{background-position:-0px -150px;} 
.q3 h3{background-position:-0px -300px;} 
.q4 h3{background-position:-0px -450px;} 
.q5 h3{background-position:-0px -600px;} 
.q6 h3{background-position:-0px -750px;} 
.q7 h3{background-position:-0px -900px;} 
.q8 h3{background-position:-0px -1050px;} 
.q9 h3{background-position:-0px -1200px;} 
.q10 h3{background-position:-0px -1350px;} 

div.q6{background:url(../images/q6_a.gif) 60px 270px no-repeat;width:620px;height:330px;}/*答案註解*/

/*answerbutton*/
div a.choose-a{
	position:absolute;
	top:235px;left:115px;
	width:150px;height:45px;
	background:url(../images/butto_choose_a.gif) no-repeat;
	}
div a.choose-a:hover, div a.choose-a:active{background:url(../images/butto_choose_a_h.gif) no-repeat;}
div a.choose-b{
	position:absolute;
	top:235px;right:80px;
	width:150px;height:45px;
	background:url(../images/butto_choose_b.gif) no-repeat;
	}	
div a.choose-b:hover, div a.choose-b:active{background:url(../images/butto_choose_b_h.gif) no-repeat;}
div.q6 a.choose-a, div.q6 a.choose-b{top:210px;}/*special setting*/
div.q7 a.choose-a{left:100px;}
div.q7 a.choose-b{right:110px;}/*special setting*/
div.q8 a.choose-a{left:90px;}
div.q8 a.choose-b{right:100px;}/*special setting*/
div.q9 a.choose-a{left:100px;}
div.q9 a.choose-b{right:100px;}/*special setting*/
div.q10 a.choose-a{left:100px;}
div.q10 a.choose-b{right:100px;}/*special setting*/



/*answer*/
div h4{width:270px;height:50px;display:block;position:absolute;background-image:url(../images/answer.gif);background-repeat:no-repeat;}
div h4.a{top:180px;left:45px;}
div h4.b{top:180px;right:15px;}

div.q1 h4.a{background-position:-0px -0px;}
div.q1 h4.b{background-position:-300px -0px;}
div.q2 h4.a{background-position:-0px -100px;}
div.q2 h4.b{background-position:-300px -100px;}
div.q3 h4.a{background-position:-0px -200px;}
div.q3 h4.b{background-position:-300px -200px;}
div.q4 h4.a{background-position:-0px -300px;}
div.q4 h4.b{background-position:-300px -300px;}
div.q5 h4.a{background-position:-0px -400px;}
div.q5 h4.b{background-position:-300px -400px;}
div.q6 h4.a{background-position:-0px -500px;}
div.q6 h4.b{background-position:-300px -500px;}
div.q7 h4.a{background-position:-0px -600px;}
div.q7 h4.b{background-position:-300px -600px;}
div.q8 h4.a{background-position:-0px -700px;}
div.q8 h4.b{background-position:-300px -700px;}
div.q9 h4.a{background-position:-0px -800px;}
div.q9 h4.b{background-position:-300px -800px;}
div.q10 h4.a{background-position:-0px -900px;}
div.q10 h4.b{background-position:-300px -900px;}




/*
偉人-------------------------------------------------------------------------------------
*/ 
.block{text-align:left; width:600px;height:130px;padding-top:130px;}
#b .block, #c .block, #d .block{height:120px;padding-top:140px;}
.block p{ 
		text-align:left;color:#73230a;
		width:385px;
		font-size:13px;
		font-weight:100;
		margin:0 10px 0 220px;
		line-height:1.4em;
		}
ol li{background-image:url(../images/block_men.gif);background-repeat:no-repeat;}
ol li#a{background-position:-0px -0px;}
ol li#b{background-position:-0px -350px;}
ol li#c{background-position:-0px -700px;}
ol li#d{background-position:-0px -1050px;}
ol li#e{background-position:-0px -1400px;}
.block h2{display:none;}

/*share FB button*/
.block h6{margin-left:440px;width:140px;}
.block h6 a{
	display:block;
	background:url(../images/share.gif) no-repeat;
	width:140px;height:45px;
	}/*shareFB button*/
.block h6 a:hover, .block h6 a:active{background:url(../images/share_hover.gif) no-repeat;}

/*more button*/
.block h5{margin-left:210px;width:385px;}
.block h5 a{
	display:block;
	background:url(../images/test_more.gif) no-repeat;
	width:385px;height:30px;
	}/*more button*/
.block h5 a:hover, .block h5 a:active{background:url(../images/test_more_hover.gif) no-repeat;}



div#footer{display:none;}