/* COMMONS */
a { color: #77dd00; }
.fleft { float: left; }
.fright { float: right; }
.m10 { margin: 10px !important; }
.mt3 { margin-top: 3px !important; }
.mt5 { margin-top: 5px !important; }
.mt10 { margin-top: 10px !important; }
.mb10 { margin-bottom: 10px !important; }
.ml5 { margin-left: 5px !important; }
.mr5 { margin-right: 5px !important; }
.pr25 { padding-right: 25px !important; }
.d-b { display: block; }
.d-ib { display: inline-block; }
.w40p { width: 40%; }
.w60p { width: 60%; }
.va-m { vertical-align: middle; }
.nowrap { white-space: nowrap; }
.font-italic { font-style: italic; }
.text-center { text-align: center; }
.c-gray { color: #bbb; }
.c-verygray { color: #888; }
.c-btn-info { color: #d0bae0; }
.c-red { color: #cc4444; }
.font12 { font-size: 12px; }
.font14 { font-size: 14px; }
/* end of commons */

/* CONTENT */
.lk-descr  {
    padding: 0 5px;
    margin: 5px auto 10px auto;
    text-align: center;
    font-style: italic;
    color: #bbb;
}
.b-social-buttons {
    margin: 10px;
    text-align: center;
}
    .soc-descr, .btn-soc {
        display: inline-block;
        vertical-align: middle;
        margin: 0 5px;
    }
.b-auth {
    background: #3f3f3f;
    margin: 10px;
}
    .auth-tab {
        float: left;
        text-align: center;
        font-size: 14px;
        padding: 9px 0;
        color: #fff;
        text-decoration: none;
    }
    .auth-tab.inactive {
        background: #292929;
        color: #bbb;
        border-bottom: 1px solid #4a4a4b;
    }
    .auth-inner {
        margin-top: 10px;
        padding: 5px 5px 10px 5px;
    }
    .line-in-btn { display: block; }
.b-mainmenu { margin-top: 10px; }
    .b-mainmenu img { vertical-align: middle; }
.b-container .b-category { /*override default style*/
    margin-top: 5px;
}
.b-content {
    border-top: 1px solid #444;
    border-bottom: 1px solid #444;
    background: #333333;
}
    .content-inner { padding: 5px; }
    .content-darkgray { background: #2e2e2e; }
.b-lk-head {
    padding: 8px 5px;
    background: #000;
    vertical-align: middle;
}
    h1.lk-title {
        float: left;
        margin: 0;
        padding: 0;
        vertical-align: middle;
        color: #bbb;
        font-size: 12px;
        font-weight: bold;
    }
    .head-name {
        float: right;
        margin-left: 10px;
        color: #bbb;
    }
.progress {
    display: inline-block;
    width: 48px;
    height: 5px;
    background: #191919;
    border: 1px solid #000;
    border-radius: 4px;
    overflow: hidden;
}
    .progress-full {
        display: block;
        height: 5px;
        background: #85e400;
    }
    .progress.big {
        display: block;
        width: auto;
        height: 8px;
    }
        .progress-full.big {
            height: 8px;
        }

.bright-info {
    padding: 5px;
    color: #fff;
    text-align: center;
    border: 1px solid #75c502;
    background: #4c770f;
}
.lite-game {
    overflow: hidden;
    display: block;
    padding: 8px 4px 4px 4px;
    border-top: 1px solid #8d8d8d;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    text-decoration: none;
    background: #333;       
}
    .lite-game.with-arrow {
        padding-right: 25px;
        background: url('../images/r-arrow-gray.png') no-repeat 100% 50% #333;    
    }
.lite-game .image {
    float: left;
    margin-right: 4px;
}
.lite-game .info { }
    .lite-game .title {
        font-size: 14px;
    }
    .lite-game .descr {
        margin-top: 5px;
        text-decoration: none;
        font-size: 11px;
        color: #cccccc;
    }
/* end of content */    
    
/* === PROFILE === */
.profile-img {
    float: left;
    width: 55px;
    height: 62px;
    margin: 0 18px 5px 0;
    margin-bottom: 5px;
    background: url('../images/profile/neutral.png') no-repeat 0 0;    
}
.progress-info { color: #e4d700; }
.field {
    overflow: hidden;
    margin-bottom: 8px;
    color: #bbb;
}
.field-name {
    float: left;
    font-size: 14px;
    width: 75px;
}
.fiel-dval {
    float: left;
    margin-left: 80px;
}
/* end of profile */

/* BUTTONS */    
.btn {
    position: relative;
    display: block;
    padding: 6px 5px;
    color: #fff;
    font-size: 14px;
    border: none;
    text-decoration: none;
    border-top: 1px solid #8734c1;
    border-bottom: 1px solid #34005a;
    background: #6a00b5;
}
    input.btn {
        cursor: pointer;
        width: 98%;
        margin: 0 auto;
        text-align: center;
    }
    .btn.btn-gray {
        background-color: #3f3f3f;
        border-top-color: #585859;
        border-bottom-color: #2f2f2f;
    }
    .btn span { vertical-align: middle; }
.btn-back {
    display: inline-block;
    vertical-align: middle;
    width: 62px;
    height: 15px;
    margin-right: 5px;
    color: #b6d0e2;
    text-decoration: none;
    background: url('../images/btn-back2.png') no-repeat 0 0;
    text-align: center;
}
.r-arrow, .r-circle {
    position: absolute;
    top: 50%;
    right: 8px;
    width: 13px;
    height: 20px;
    margin-top: -10px;
    background: url('../images/r-arrow-btn.png') no-repeat 0 100%;
}
    .r-circle {
        width: 19px;
        height: 16px;
        padding: 2px 0;
        background-image: url('../images/r-circle.png');
        text-align: center;
        color: #85e400;
    }
.percent-in-btn {
    display: inline-block;
    font-size: 12px;
    color: #bbb;
}
.pad-game-name { padding: 7px; }
/* END OF BUTTONS */    
    
/* FORMS */
input { -webkit-appearance: none; }
.typical-form {
    width: 96%;
    margin: 0 auto;
}
    .typical-form .form-line { margin-bottom: 8px; overflow: hidden; }
    .typical-form label {
        float: left;
        width: 50px;
        margin: 2px 10px 0 0;
        text-align: right;
    }
    .typical-form .text-input {
        position: relative;
        margin: 0 0 0 70px;
    }
        .typical-form .text-input.wide { margin: 0; }
        .typical-form .text-input input,
        .typical-form .text-input textarea {
            display: block;
            width: 97%;
            padding: 2px;
            border: 0;
            background: #727274;
        }
    .typical-form.profile-form {
        max-width: 230px;
        margin: 10px auto;
        font-size: 14px;
        color: #bbb;
    }
        .typical-form.profile-form label {
            margin-top: 0;
        }
        
/* end of forms */