/**
*    Stripgenerator Profile
**
*    @author  David Panzalović
*    @version 1.1
**/

/* =User info
----------------------------------------------- */
#user_info {
    width: 100%;
    margin-bottom: 24px;
    float: left;
    clear: left;
}

    /* Notice */
    .notice .reject {
        width: 12px;
        height: 12px;
        position: absolute;
        top: 6px;
        right: 6px;
        text-indent: -9999px;
    }

    /* Avatar */
    #user_info .avatar {
        width: 137px;
        margin-right: 19px;
        float: left;
        position: relative;
    }

    #user_info .avatar img {
        width: 135px;
        display: block;
    }

    #user_info .avatar > span {
        margin-top: 16px;
    }

        #user_info .avatar > a {
            height: 20px;
            line-height: 20px;
            padding: 0 4px 0 24px;
            position: absolute;
            top: 113px;
            right: 2px;
            display: none;
        }

        #user_info .avatar:hover > a {
            display: block;
        }

    /* Menu */
    #user_info > ul {
        width: 760px;
        line-height: 48px;
        margin: -24px 0 24px 0;
        float: left;
    }

        #user_info > ul > li {
            width: auto;
            padding-left: 22px;
            margin-left: 18px;
            float: left;
        }

        #user_info > ul > li:first-child {
            margin-left: 0;
        }

        #user_info > ul > .numbers {
            padding-left: 0;
            float: right;
        }

    /* User info content */
    #user_info > div {
        width: 760px;
        float: left;
    }

        #user_info > div > div {
            width: 604px;
            line-height: 1.6;
            float: left;
            word-wrap: break-word;
        }

        #user_info > .dual > div   { width: 526px }
        #user_info > .quad > div   { width: 448px }

            #user_info > div > div > p {
                width: 100%;
                float: left;
            }

        #user_info > div .notice {
            width: 100%;
            margin-bottom: 0;
            left: 0;
        }

            #user_info > div .notice > div {
                line-height: 1.6;
            }

    /* SNS links */
    #user_info .sns_links {
        width: 100%;
        margin-top: 20px;
        float: left;
    }

        #user_info .sns_links li {
            width: auto;
            margin-left: 20px;
            float: left;
        }

        #user_info .sns_links li:first-child {
            margin-left: 0;
        }

            #user_info .sns_links li a {
                line-height: 18px;
                padding-left: 26px;
                display: block;
            }

    /* Badges */
    #user_info .badges {
        width: 136px;
        margin: 3px 0 0 20px;
        float: right;
    }

    #user_info .dual .badges   { width: 214px }
    #user_info .quad .badges   { width: 292px }

        #user_info .badges li {
            width: 60px;
            height: 60px;
            margin-left: 18px;
            float: left;
        }

        #user_info .badges li:first-child {
            width: 136px;
            height: 125px;
            margin: -3px 0 0 0;
        }

/* =Achievement bar
----------------------------------------------- */
#achievement_bar {
    width: 916px;
    margin-bottom: 39px;
    float: left;
    clear: both;
    position: relative;
}
    #achievement_bar ul {
        width: 912px;
        height: 49px;
        padding-top: 10px;
        margin: 0 2px 2px 2px;
        float: left;
        position: relative;
    }

        #achievement_bar ul li {
            height: 47px;
            padding-right: 8px;
            float: left;
            position: relative;
        }

        #achievement_bar ul li.l {
            position: absolute;
            top: 10px;
            right: 0;
        }

        #achievement_bar ul li.ach1 {
            padding: 0 0 0 6px;
        }

        #achievement_bar ul li.ach16 {
            padding: 0 6px 0 0;
        }

        #achievement_bar ul li.ach1 { width: 849px; }
        #achievement_bar ul li.ach2 { width: 106px; }
        #achievement_bar ul li.ach3 { width: 163px; }
        #achievement_bar ul li.ach4 { width: 220px; }
        #achievement_bar ul li.ach5 { width: 277px; }
        #achievement_bar ul li.ach6 { width: 334px; }
        #achievement_bar ul li.ach7 { width: 391px; }
        #achievement_bar ul li.ach8 { width: 448px; }
        #achievement_bar ul li.ach9 { width: 505px; }
        #achievement_bar ul li.ach10 { width: 562px; }
        #achievement_bar ul li.ach11 { width: 619px; }
        #achievement_bar ul li.ach12 { width: 676px; }
        #achievement_bar ul li.ach13 { width: 733px; }
        #achievement_bar ul li.ach14 { width: 790px; }
        #achievement_bar ul li.ach15 { width: 847px; }
        #achievement_bar ul li.ach16 { width: 906px; }

    #achievement_bar > div {
        width: 890px;
        line-height: 16px;
        padding: 12px;
        margin: 15px 0 0 0;
        position: absolute;
        left: 0;
        top: 8px;
        visibility: hidden;
        z-index: 1000;
    }

/* =Tabs
----------------------------------------------- */
#tabs {
    width: 100%;
    height: 48px;
    margin: 0 0 31px 0;
    float: left;
    clear: left;
}

    #tabs li {
        width: auto;
        height: 48px;
        margin-left: 20px;
        float: left;
    }

    #tabs li:first-child {
        margin-left: 0;
    }

        #tabs li a {
            height: 48px;
            display: block;
        }

        #tabs li a.selected {
            height: 49px;
        }

        #tabs li a.gallery   { width: 193px }
        #tabs li a.booklet   { width: 109px }
        #tabs li a.library   { width:  93px }
        #tabs li a.friends   { width: 177px }
        #tabs li a.happening { width: 173px }