﻿.busy {
    opacity: .5;
    cursor: wait;
}

.comments-container {
    display: table;
    width: 100%;
    padding-top: 50px;
}

.comments-row {
    display: table-row;
}

.comment-rating-selection .rating-star {
    font-size: 1.4em;
    color: white;
    cursor: pointer;
}

.comment-rating-selection .rating-star:hover {
    color: black;
}

.rating-star.rating-fill {
    color: black;
}

.comment-list {
    display: table-cell;
    padding: 0 3%;
    width: 60%;
}

.comment-header {
    position:relative;
}

.comment p {
    font-size: .9em;
}

.comment p:first-letter {
    font-size: 1em;
    font-family: Arial, Helvetica, sans-serif;    
    letter-spacing: inherit;
}

.comment-form {
    display: table-cell;
}

.comment-block {
    position: relative;
}

.comment h5 {
    font-size: 1em;
    padding-top: 20px;
    background-color: rgba(0,0,0,.1);
    padding: 10px;
}

.tier-indicator {
    position: absolute;
    display: inline-block;
    color: #9999aa;
    top: 17px;
}

.comment small {
    font-size: .8em;
}

.comment {
    padding-bottom: 35px !important;
    border-left: 1px dotted #9999AA;
    border-bottom: 1px solid #9999AA;
    margin-bottom: 12px;
}

.tier-1.comment {
    padding: 2%;
    margin-left: 0;
    background-color: rgba(225,225,225,0.5);
}

.tier-2.comment {
    padding: 2%;
    margin-left: 20px;
}

.tier-3.comment {
    padding: 2%;
    margin-left: 40px;
}

.tier-4.comment {
    padding: 2%;
    margin-left: 60px;
}

.tier-5.comment {
    padding: 2%;
    margin-left: 70px;
}

.tier-6.comment, .tier-7.comment, .tier-8.comment, .tier-9.comment, .tier-10.comment, .tier-11.comment,
.tier-12.comment, .tier-13.comment, .tier-14.comment, .tier-15.comment {
    padding: 2%;
    margin-left: 90px;
}

.comment-link {
    cursor: pointer;
    font-size: .8em;
    display: inline-block;
    color: #DD7777 !important;
}

.offensive-link {
    line-height: 15px;
    vertical-align: text-top;
    font-size:1.5em;
}

a.collapse-button {
    margin-right: 15px;
    font-size: 1.5em;
}

@media screen and (max-width:980px) {
    .comments-row {
        display: -webkit-box;
        display: -moz-box;
        display: box;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        box-orient: vertical;
    }

    .comment-list {
        display: inherit;
        padding: 0 3%;
        -webkit-box-ordinal-group: 2;
        -moz-box-ordinal-group: 2;
        box-ordinal-group: 2;
        width: 100%;
    }

    .comment-form, .login-form {
        display: inherit;
        -webkit-box-ordinal-group: 1;
        -moz-box-ordinal-group: 1;
        box-ordinal-group: 1;
    }

    .login-form #login-form {
        display: block;
        width: 100%;
    }

    .comment-form #comment-form {
        display: block;
        width: 100%;
    }
    .comments-inner-container {
        display: inline;
    }
    .comment-header {
        display: inline;
    }
}
