@charset "UTF-8";
@import url("../../../css/study_tools.css");

/* 
div#content div#leftは無し。
div#contentの幅はstandard.cssで定められたデフォルトのまま。
div#content div#mainの幅はgames.cssで設定されたデフォルトのまま。
div#content div#rightは無し。
*/

div#playArea {
    position:absolute;
    width:600px;
    height:98px;
    left:50%;
    top: 121px;
    margin-left:-300px;
    margin-top:0px;
    background:#ddd;
    color:#999;
    border-left: solid #eee 1px;
    border-right: solid #ccc 1px;
    border-top: solid #eee 1px;
    border-bottom: solid #ccc 1px;
    display: none;
}

div#wordArea{
    position:absolute;
    width:580px;
    height:100px;
    left:50%;
    margin-left:-290px;
    top:0px;
}

div.character{
    font-size:400%;
    float:left;
}

div#settingArea, div#progressArea, div#info, div#gameInstructionArea{
    position:absolute;
    /*width:600px;*/
    background-color:#ccc;
    border-left: solid #ddd 1px;
    border-right: solid #bbb 1px;
    border-top: solid #ddd 1px;
    border-bottom: solid #bbb 1px;
    display: none;
}

div#settingArea{
    width:118px;
    height:38px;
    left: 20px;
    top:221px;
}

form#settingForm{
    position:absolute;
    width:120px;
    height:40px;
    top:2px;
}

form#settingForm p{
    margin: 0.2em 0.8em;
    padding: 0.2em 0.4em;
}

div#progressArea{
    width:480px;
    height:38px;
    left: 140px;
    top:221px;
}

div#wordCount{
    position:absolute;
    top: 10px;
    left: 10px;
    font-weight:bold;
}

div#studyToolBoard div#info {
    width:600px;
    height: 58px;
    left: 50%;
    top: 261px;
    margin: 0px;
    margin-left: -300px;
}

div#timeTitle, div#time, div#typingRateTitle, div#typingRate{
    position:absolute;
    top: 10px;
    font-weight: bold;
}

#timeTitle {
    left: 10px;
}

#time {
    left: 60px;
    text-align: right;
}

#typingRateTitle {
    left: 300px;
}

#typingRate {
    left: 380px;
    text-align: right;
}

div#gameMessageTitle, div#gameMessage{
    position:absolute;
    top: 30px;
    font-weight: bold;
}

div#gameMessageTitle{
    height:20px;
    left: 10px;
}

div#gameMessage{
    height:20px;
    left: 90px;
    color:red;
}

div#gameInstructionArea{
    width:600px;
    height:38px;
    left: 50%;
    top:321px;
    margin-left: -300px;
}

div#gameInstruction{
    position:absolute;
    height:20px;
    left:10px;
    top:10px;
    font-weight:bold;
}