body
{ 
background-image: url('images/taiji-3.gif'); 
background-repeat: no-repeat; 
background-position:  fixed; 
margin : 10px;
	font: Verdana, Helvetica, Arial;
	padding: 0px;
}  

h1 
{
color: grey;
text-align: left;
font-size: 16pt
}

H1 {
font-family: arial,helvetica,sans-serif; 
font-weight:bold font-size:16pt; 
color: #999999;
left: 100px;
	
}
hr {color: sienna}

p 
{
margin-left: 20px;
font-family: "sans serif";
text-align: left;
}
p.right {text-align: right}
p.center {text-align: center}

div#t1
{
background-color:#FFFFF;
position:absolute;
top: 220px;
left : 180px;
height: 240px ;
width: 260px;
}


div#t2
{
color : #ffffff;
position : absolute;
top: 320px;
left : 300px;
height: 70px ;
width: 220px;
z-index: 1 ;
}


img.top {vertical-align:text-top}
img.bottom {vertical-align:text-bottom}
img.x
{
position : absolute;
left:0px;
top:0px;
z-index:5
}

div.showyinpic
{
color : #ffffff;
position : absolute;
top: 125px;
left : 300px;
height: 100px ;
width: 100px;
z-index : 5;
visibility:hidden;
}

div.showyangpic
{
color : #ffffff;
position:absolute;
top: 370px;
left : 300px;
height: 100px ;
width: 100px;
z-index : 5;
visibility:hidden;
}


#menu {
border-bottom : 1px solid #ccc;
margin : 0;
padding-bottom : 19px;
padding-left : 10px;
}

#menu ul, #menu li	{
display : inline;
list-style-type : none;
margin : 0;
padding : 0;
}

	
#menu a:link, #menu a:visited
{
background : #E8EBF0;
border : 1px solid #ccc;
color : #666;
float : left;
font-size : small;
font-weight : normal;
line-height : 14px;
margin-right : 8px;
padding : 2px 10px 2px 10px;
text-decoration : none;
}

#menu a:link.active, #menu a:visited.active
{
background : #fff;
border-bottom : 1px solid #fff;
color : #000;
}

#menu a:hover
{
background : #000066;
color : #fff;
}

body.section-1 , 
body.section-2 ,
body.section-3 ,
body.section-4 ,
body.section-5 ,
body.section-6 ,
body.section-7
{
background : #fff;
border-bottom : 1px solid #fff;
color : #000;
	
}
	
body.section-1 #menu li#nav-1 a, 
body.section-2 #menu li#nav-2 a,
body.section-3 #menu li#nav-3 a,
body.section-4 #menu li#nav-4 a,
body.section-5 #menu li#nav-5 a,
body.section-6 #menu li#nav-6 a,
body.section-7 #menu li#nav-7 a
{
background : #fff;
border-bottom : 1px solid #fff;
color : #000;
}

#menu #subnav-1,
#menu #subnav-2,
#menu #subnav-3,
#menu #subnav-4 {
display : none;
width: 90%;
}

body.section-1 #menu ul#subnav-1, 
body.section-2 #menu ul#subnav-2,
body.section-3 #menu ul#subnav-3,
body.section-4 #menu ul#subnav-4,
body.section-5 #menu ul#subnav-5,
body.section-6 #menu ul#subnav-6,
body.section-7 #menu ul#subnav-7
{
display : inline;
left : 10px;
position : absolute;
top : 75px;
}

body.section-1 #menu ul#subnav-1 a, 
body.section-2 #menu ul#subnav-2 a,
body.section-3 #menu ul#subnav-3 a,
body.section-4 #menu ul#subnav-4 a,
body.section-5 #menu ul#subnav-5 a,
body.section-6 #menu ul#subnav-6 a,
body.section-7 #menu ul#subnav-7 a
{
background : #fff;
border : none;
border-left : 1px solid #ccc;
color : #999;
font-size : smaller;
font-weight : bold;
line-height : 10px;
margin-right : 4px;
padding : 2px 10px 2px 10px;
}

 #menu ul a:hover {
	color : #f00 !important;
}
 #menu ul a:visited {
	background : #ff0000 
	color : #ffffff 
}

#contents {
	border : 1px solid #ccc;
	border-top : none;
	clear : both;
	margin : 0px;
	padding : 15px;
	padding-top : 20 ;
}

.pagesection
{
color : #ffffff;
position:absolute;
top: 100px;
left : 10px;
height: 800px ;
width: 580px;
z-index : 3;
visibility:hidden;
}
~
.yinsection
{
background-color : white;
color : black;
position:absolute;
top: 100px;
left : 100px;
height: 400px ;
width: 400px;
visibility:hidden;
z-index : 4;
}
~

.yangsection
{
background-color : black;
color : white;
position:absolute;
top: 100px;
left : 100px;
height: 400px ;
width: 400px;
visibility:hidden;
z-index : 4;
}