/**
*    Tools: Comments
**
*    Used on: -> strip view
*             -> profile
*
*    @author  Frenk T. Sedmak Nahtigal
*    @version 1.06
**/

/* =common
----------------------------------------------- */
#comments {
    width: 100%;
    float: left;
    clear: both;
}

#comments h2 {
    position: relative;
}

    #comments h2 .follow {
        padding-left: 20px;
        position: absolute;
        right: 0;
        top: 4px;
        font-size: 12px;
    }

/* =submit form
----------------------------------------------- */
#comments form {
    width: 100%;
    min-height: 90px;
    margin-bottom: 48px;
    float: left;
    position: relative;
}

    #comments form fieldset {
        position: relative;
    }

#comments .user {
    width: 60px;
    height: auto;
    margin: 0 30px 0 0;
    float: left;
}

#comments img {
    width: 58px;
    height: auto;
    float: left;
}

#comments .textarea {
    width: 436px;
    margin-right: 20px;
    float: left;
}

#comments textarea {
    width: 404px;
    height: 88px;
    min-height: 88px;
    padding: 10px 15px 10px 15px;
    margin: 0;
    float: left;
    font-size: 16px;
}

#comments form#comment_edit_form {
    margin-bottom: 0;
}

    #comments form#comment_edit_form fieldset {
        position: relative;
    }

#comments form#comment_edit_form textarea {
    width: 348px;
    height: 180px;
    margin-right: 20px;
}

#comments .bubble.dark.left {
    width: 12px;
    height: 11px;
    position: absolute;
    top: 26px;
    left: 79px;
}

#comments p {
}

#comments fieldset > p,
#comments.mega > p {
    width: 136px;
    margin-bottom: 0;
    float: right;
    position: absolute;
    right: 0;
    bottom: 47px;
    font-size: 12px;
}

#comments fieldset p b,
#comments.mega p b {
    margin-bottom: 2px;
    display: block;
    font-size: 32px;
}

#comments fieldset .button,
#comments.mega .button {
    position: absolute;
    right: 0;
    bottom: 0;
}

#comments > p {
    width: 100%;
}

#comments .errors {
    width: 411px;
    margin: 8px 0 0 0;
}

/* =submit form mega
----------------------------------------------- */
#comments.mega {
    margin-bottom: 16px;
}

    #comments.mega .textarea {
        width: 670px;
    }

        #comments.mega textarea {
            width: 638px;
        }

        #comments.mega input[type="submit"]{
            float: right;
        }

/* =comments
----------------------------------------------- */
#comments > ul {
    margin-bottom: 32px;
}

#comments > ul, #comments > ul li {
    width: 100%;
    float: left;
    position: relative;
}

#comments > ul li {
    margin-bottom: 16px;
}

    #comments > ul li.l {
        margin-bottom: 0;
    }

#comments > ul li > img {
    width: 58px;
    margin: 0 30px -15px 0;
    float: left;
    display: block;
}

#comments > ul li > img.hund {
    margin-right: 32px;
}

#comments > ul li > dl {
    width: 570px;
    padding: 10px 10px 16px 10px;
    float: left;
    position: relative;
}

#comments > ul li > dl > dt {
    min-height: 16px;
    line-height: 16px;
    padding: 0 80px 0 24px;
    margin-bottom: 12px;
    float: left;
    font-size: 14px;
}

#comments > ul li > dl > dt .time {
    width: auto;
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 11px;
}

#comments > ul li > dl > dd {
    width: 468px;
    line-height: 24px;
    padding-left: 24px;
    float: left;
    clear: left;
    word-wrap: break-word;
}

#comments > ul li > dl > dd.edit {
    width: 536px;
}

    #comments > ul li > dl > dd > p {
        margin-top: 8px;
    }

#comments > ul .bubble.left {
    width: 12px;
    height: 11px;
    position: absolute;
    top: 20px;
    left: 79px;
}

    /* =comments mega
    ----------------------------------------------- */
    #comments.mega > ul li > img {
        width: 58px;
        margin: 0;
        float: left;
        display: block;
    }

    #comments.mega > ul li > dl {
        width: 810px;
        margin-right: 26px;
    }

/* Comments notice */
#comments .comments_notice {
    width: 472px;
    padding: 10px 60px;
    margin: 0 0 16px 90px;
    float: left;
}

    #comments .comments_notice strong {
        width: 100%;
        margin-bottom: 6px;
        float: left;
        display: block;
    }

/* Errors */
#comments ul.errors {
    position: absolute;
    left: 90px;
    bottom: -30px;
}

    #comments ul.errors > li {
        margin: 0 0 4px 0;
    }

/* =show all
----------------------------------------------- */
#comments > p.showAll,
.friends > p.showAll,
.stalkers > p.showAll {
    width: 100%;
    min-height: 14px;
    padding: 14px 0;
    float: left;
    clear: left;
    position: relative;
}

#comments > p.showAll a,
.friends > p.showAll a,
.stalkers > p.showAll a {
    width: 648px;
    padding: 14px 0 14px 34px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

    #comments > p.showAll .aerror,
    .friends > p.showAll .aerror,
    .stalkers > p.showAll .aerror {
        height: 63px;
        float: left;
    }

        #comments > p.showAll .aerror > div > div,
        .friends > p.showAll .aerror > div > div,
        .stalkers > p.showAll .aerror > div > div {
            height: auto;
            margin-top: 0;
            top: 6px;
        }

        #comments > p.showAll .aerror > div > div .button,
        .friends > p.showAll .aerror > div > div .button,
        .stalkers > p.showAll .aerror > div > div .button {
            width: 136px;
            position: relative;
            padding: 11px 0 0 0;
            margin-top: 6px;
        }

    #comments > p.showAll .loading,
    .friends > p.showAll .loading,
    .stalkers > p.showAll .loading {
        height: 110%;
        min-height: 60px;
    }

/* =options
----------------------------------------------- */
#strip-replies li .options {
    height: 20px;
    line-height: 20px;
    padding: 0 4px 0 24px;
    position: absolute;
    top: 96px;
    right: 2px;
    visibility: hidden;
}

#comments > ul li > dl > dt ul {
    visibility: hidden;
    position: absolute;
    bottom: 1px;
    right: 1px;
}

    #comments > ul li > dl > dt ul li {
        float: right;
        width: auto;
        margin: 0;
    }

        #comments > ul li > dl > dt ul li a {
            line-height: 20px;
            margin-left: 10px;
            padding: 0 4px 0 24px;
        }

#comments > ul li > dl:hover .options,
#comments > ul li > dl:hover ul,
#strip-replies li li:hover .options {
    visibility: visible;
}

/* =flood warning
----------------------------------------------- */
form .flood {
    width: 100%;
    height: 100%;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10000;
}

    form .flood.hidden {
        display: none;
    }

    form .flood > div {
        width: 382px;
        height: 66px;
        margin-top: -33px;
        position: absolute;
        top: 50%;
        left: 150px;
        z-index: 10001;
    }

        form .flood h4 {
            margin-bottom: 8px;
        }

        form .flood p {
            line-height: 1.2;
        }
