body{
color:#04443D;
background-color:#ECD9A1;
font-size:100%;
font-family: Verdana, Arial, Helvetica, sans-serif;
margin:8px;
} 
#outwrapDv{
min-width: 500px;
text-align: center;
}
#containerDv{
width: 580px;
height:420px;
margin: 0px auto;
margin-top: 55px;
text-align: left;
position: relative;
} 
#conDv{
/*border: 1px solid blue;*/
width:200px;
height:100px;
left:0px;
top:0px;
position:absolute;
}
#picDv{
width:165px;
height:132px;
left:206px;
top:0px;
text-align: center;
position:absolute;
display:none;
}
#wordDv{
width:580px;
height:65px;
left:0px;
top:158px;
font-size:42px;
text-align: center;
position:absolute;
display:none;
}
#sylContDv{
width:580px;
height:120px;
left:0px;
top:250px;
position:absolute;
display:none;
}
#midDv{
width:100%;
height:300px;
top:130px;
font-size: 90%;
text-align:center;
position:absolute;
display:none;
}
#midDv em{
font-size: 45px;
}
#endDv{
border: 1px solid blue;
color:#dfffe2;
width:200px;
height:200px;
left:130px;
top:30px;
font-size: 36px;
text-align:left;
position:absolute;
display:none;
}
#startBt{
background-color:# FFF9FF;
}
#startBt:hover{
color:#000000;
background-color:#FAECB5;
}

#startBt:active{
background-color:#E5D69F;
}
div.syllable{
border: 1px solid # FFFaaa;
background-color:#ffecdf;
width:100px;
height:64px;
padding-top:15px;
font-size:36px;
text-align:center;
position:absolute;
cursor:pointer;

}
div.syllable:hover{
background-color:#fffaec;
}
#s0Dv{
top:0px;
left:0px;
}
#s1Dv{
top:0px;
left:120px;
}
#s2Dv{
top:0px;
left:240px;
}
#s3Dv{
top:0px;
left:360px;
}
#s4Dv{
top:0px;
left:480px;
}
#s5Dv{
top:0px;
left:600px;
}
#s6Dv{
top:9px;
left:120px;
}
#s7Dv{
top:99px;
left:240px;
}
#s8Dv{
top:99px;
left:360px;
}