#game{
    margin-bottom: 40px;
    position: relative;
    padding: 0 30px;
}
#game .view{
    background-color: #343434;
    padding: 2px 0;
}
#html5{
    display: none;
}
#html5 .centering_box{
    position: relative;
    margin: 0 auto;
    background-color: #ffffff;
}
#canvas_debug{
}
#canvas{
    /*
    margin: 0 auto;
    background-color: #ffffff;
    display: block;
    */
    position: absolute;
    top: 0;
    left: 0;
}
#flash{
    display: none;
}
#flash object{
    margin: 0 auto;
    display: block;
}
#game .select_button{
    position: relative;
    height: 40px;
}
#game .select_button div{
}
#game .select_button div.flash{
    top: 0;
    left: 0;
    position: absolute;
}
#game .select_button div.html5{
    top: 0;
    left: 140px;
    position: absolute;
}
#game .select_button div.flash:hover{
    cursor: pointer;
    color: #ff7700;
}
#game .select_button div.html5:hover{
    cursor: pointer;
    color: #ff7700;
}
#game .title{

    position: absolute;
    top: 10px;
    right: 30px;
    text-align: right;
}


/*
 *
 */
#message{
    display: none;
    width: 700px;
    margin: 0 auto;
    text-align: center;
}
#message p{
    margin-bottom: 10px;
}
#loading{
    width: 200px;
    margin: 0 auto;
    text-align: center;
}
#login_button{
    position: relative;
    text-align: center;
    top: 0;
    left: 0;
}

/*
 *
 */
#game_info{

    height: 435px;
    position: relative;
    margin-bottom: 20px;
}


/*
 *
 */
#score_info{
    display: none;
    width: 170px;
    border-top: 4px solid #9c9c9c;
    margin: 0 0 30px 80px
}
#score_info .title{
    text-align: center;
    margin: 10px 0 15px 0;
    padding-bottom: 5px;
    border-bottom: 1px solid #9c9c9c;
}
#score_info table{
    width: 80%;
    margin: 0 auto;
}
#score_info th{
    width: 65%;
    text-align: left;
    font-weight: normal;
}
#score_info td{
    text-align: left;
}

/*
 *
 */
#state{
    border-top: 4px solid #9c9c9c;
    display: none;
    width: 170px;
    text-align: center;
    font-size: 300%;
    border-bottom: 1px solid #9c9c9c;
    margin: 0 0 0 80px
}
#state .title{
    margin: 10px 0 5px 0;
    padding-bottom: 5px;
    border-bottom: 1px solid #9c9c9c;
}
#state .steps{

    padding: 20px 0;
}


/*
 *
 */
#rank_list{
    position: absolute;
    top: 0;
    left: 310px;
    border-top: 4px solid #9c9c9c;
    display: none;
    width: 420px;
}
#rank_list .title{
    text-align: center;
    margin: 10px 0 15px 0;
    padding-bottom: 5px;
    border-bottom: 1px solid #9c9c9c;
}
#rank_list .select_button{
    position: relative;
    height: 30px;
}
#rank_list .select_button div{
}
#rank_list .select_button div.social{
    top: 0;
    left: 140px;
    position: absolute;
}
#rank_list .select_button div.public{
    top: 0;
    left: 290px;
    position: absolute;
}
#rank_list .select_button div.social:hover{
    cursor: pointer;
}
#rank_list .select_button div.public:hover{
    cursor: pointer;
}
#rank_list .list{
    margin-bottom: 15px;
}

#rank_public{

    display: none;
}
.rank{
    width: 100%;
    background-color: #e0e0e0;
}
.rank table{
    width: 100%;
}
.rank tr{
    text-align: center;
    height: 30px;
}
.rank td{
    background-color: #ffffff;
}
.rank td.avatar_image{
    width: 30px;
    height: 30px;
}
.rank td.avatar_image img{
    width: 30px;
    height: 30px;
}
.rank td.display_name{
   width: 60%;
}
.rank td.formatted_rank{
}
.rank td.score{
}

/*
 *
 */
#share_button{

    display: none;
    position: absolute;
    bottom: -10px;
    left: 300px;
}
#googleplus_button_hide{

    position: absolute;
    left: 0px;
}
#googleplus_button{

    display: none;
    position: absolute;
    left: 0px;
}

#googleplus_button:hover{
    cursor: pointer;
}
#twitter_button{
    position: absolute;
    left: 80px;
}
#facebook_button{
    position: absolute;
    left: 147px;
}

/* */
#game_hint{
    display: none;
    position: relative;
    margin: 0 40px 20px 40px;
}
#game_hint .button{
    text-align: center;
}
#game_hint pre{
    height: 50px;
    width: 600px;
    overflow: auto;
    margin: 0 auto 5px auto;
    display: none;
    background-color: #eeeeee;
    padding: 10px;
    color: #333333;
}


/*
10 	 77
11 	 85
12 	 93
13 	 100
14 	 108
15 	 116
16 	 123.1
17 	 131
18 	 138.5
19 	 146.5
20 	 153.9
21 	 161.6
22 	 167
23 	 174
24 	 182
25 	 189
26 	 197
*/