/**
 * COCOA MATCH STYLES
 */

body {
    font-family: Arial;
    padding: 0;
    margin: 0;
    background: url(../images/main_bg.gif) left top repeat;
    padding-bottom: 30px;
}

img {
    border: 0;
}

.center_wrap {
    width: 793px;
    margin: 0 auto;
    overflow: hidden;
}

.header {
    float: left;
    width: 793px;
    margin-top: 10px;
}

.logo {
    margin: 0 10px;
    float: left;
}

.header_text {
    float: left;
    width: 435px;
    color: #ffe69f;
    font-size: 12px;
}

h2 {
    color: #735130;
    font-size: 20px;
    margin: 0 0 7px 0;
}

h3 {
    color: #ffe69f;
    font-size: 14px;
    margin: 0 0 8px 0;
}

h4 {
    color: #ffe69f;
    font-size: 12px;
    margin: 0 0 8px 0;
}

.bold {
    font-weight: bold;
}

.header_text  p {
    margin: 0;
    line-height: 1.5em;
}

.reg_invite_block {
    font-size: 12px;
    text-align: center;
    color: #ffe69f;
    float: left;
}

.reg_invite_block p{
    margin: 4px 0;
}

.invite_btn {
    background: url(../images/invite_btn.png) left top no-repeat;
    width: 201px;
    height: 48px;
    border: 0;
    margin-top: 7px;
    cursor: pointer;
}

.invite_btn:hover {
    background: url(../images/invite_btn_over.png) left top no-repeat;
}

.reg_btn {
    background: url(../images/reg_btn.png) left top no-repeat;
    width: 201px;
    height: 48px;
    border: 0;
    margin-top: 7px;
}

.reg_btn:hover {
    background: url(../images/reg_btn_over.png) left top no-repeat;
}

.game_block {
    clear: both;
    float: left;
}

.game_block .top_frame  {
    width: 793px;
    background: url(../images/top_frame_game.png) left top no-repeat;
    padding-top: 32px;
    float: left;
}

.game_block  .left_frame {
    width: 760px;
    background: url(../images/left_frame_game.png) left top repeat-y;
    padding-left: 33px;
    float: left;
}

.game_block  .right_frame {
    width: 728px;
    background: url(../images/right_frame_game.png) right top repeat-y;
    padding-right: 32px;
    float: left;
}

.game_block  .bot_frame {
    width: 793px;
    background: url(../images/bot_frame_game.png) left bottom no-repeat;
    height: 34px;
    float: left;
}

.message_block {
    float: left;
    width: 775px;
    margin: 5px 0 5px 12px;
    -margin: 5px 0 5px 6px;
}

.message_block .top_bg {
    float: left;
    width: 775px;
    background: url(../images/top_mess_bg.png) left top no-repeat;
    padding-top: 20px;
}

.message_block .bot_bg {
    float: left;
    width: 760px;
    background: url(../images/bot_mess_bg.png) left bottom no-repeat;
    padding: 0 0 20px 15px;
}

.comment_block {
    float: left;
    clear: both;
    
}

.comment_block .top_frame  {
    width: 793px;
    background: url(../images/top_comment_frame.png) left top no-repeat;
    padding-top: 32px;
    float: left;
}

.comment_block  .left_frame {
    width: 772px;
    background: url(../images/left_comment_frame.png) left top repeat-y;
    padding-left: 21px;
    float: left;
}

.comment_block  .right_frame {
    width: 751px;
    background: url(../images/right_comment_frame.png) right top repeat-y;
    padding-right: 21px;
    float: left;
}

.comment_block  .bot_frame {
    width: 793px;
    background: url(../images/bot_comment_frame.png) left bottom no-repeat;
    height: 34px;
    float: left;
}

.comments {
    background: #a86420;
    float: left;
    width: 728px;
    padding: 0 11px 0 12px;
}

.pages {
    float: left;
    width: 528px;
    color: #ffe69f;
    line-height: 22px;
    margin-bottom: 10px;
}

.pages  a {
    color: #ffe69f;
    font-weight: bold;
    font-size: 12px;
    float: left;
}

.page_num {
    float: left;
    margin: 0 5px;
    color: #fff;
}

.page_num a {
    padding: 4px 7px;
    background-color: #9f6732;
    border: 1px #784008 solid;
    color: #fff;
    text-decoration: none;
    margin-right: 1px;
    line-height: 12px;
}

.page_num a.active, .page_num a:hover {
    background-color: #ffe69f;
    border: 1px #fff solid;
    color: #572e08;
    text-decoration: none;
}

.add_comment {
    float: right;
    width: 150px;
    margin: 5px 15px 0 0;
}

.comment .top_frame  {
    width: 729px;
    background: url(../images/top_com_bg.gif) left top no-repeat;
    padding-top: 31px;
    float: left;
}

.comment  .bot_frame {
    width: 729px;
    background: url(../images/bot_com_bg.gif) left bottom no-repeat;
    float: left;
    height: auto;
}

.comment {
    float: left;
    clear: both;
    width: 729px;
    margin-bottom: 10px;
}

.answer .top_frame  {
    width: 729px;
    background: url(../images/top_com_ans_bg.gif) left top no-repeat;
    padding-top: 31px;
    float: left;
}

.answer  .bot_frame {
    width: 728px;
    background: url(../images/bot_com_ans_bg.gif) left bottom no-repeat;
    float: left;
}

.comment_text {
    float: left;
    width: 659px;
    padding: 0 35px 10px 35px;
}

.name {
    float: left;
    color: #a0790b;
    font-size: 14px;
    font-weight: bold;
    margin-top: -15px;
    width: 659px;
    -position: relative;
}

.name a {
    color: #a0790b;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
}

.com_text {
    float: left;
    font-size: 12px;
    color: #3a2213;
}

.com_text p {
    margin: 5px 0;
}

.footer {
    color: #a8895a;
    text-align: center;
    font-size: 10px;
}

.copyright {
    font-weight: bold;
}

/** 
 * APP-SPECIFIC STYLES
 */
 
label, input { 
    ___display:block;
}

input.text { 
    margin-bottom:12px; 
    width:95%; 
    padding: .4em; 
}

fieldset { 
    padding:0; 
    border:0; 
    margin-top:25px; 
}

h1 { 
    font-size: 1.2em; 
    margin: .6em 0; 
}

div#users-contain { 
    width: 350px; 
    margin: 20px 0; 
}

div#users-contain table { 
    margin: 1em 0; 
    border-collapse: collapse; 
    width: 100%; 
}

div#users-contain table td, div#users-contain table th { 
    border: 1px solid #eee; 
    padding: .6em 10px; 
    text-align: left; 
}

.ui-button { 
    outline: 0; 
    margin:0;
     padding: .4em 1em .5em; 
     text-decoration:none;  !important; 
     cursor:pointer; 
     position: relative; 
     text-align: center; 
}

.ui-progressbar-value { 
    background-image: url(/static/css/images/pbar-ani.gif); 
}

#progressbar { 
    z-index: 1005; 
    width: 100%; 
    height: 100%; 
}

.ui-state-error{
    border: 2px solid red;
}

#found-bug{
    background: url('/static/images/found_bug.png') no-repeat;
    width: 83px;
    height: 95px;
    position: fixed;
    left: 0;
    top: 50%;
    cursor: pointer;
    margin-top: -47px;
}