.label {
    clear: both;
    float: left;
    width: 100%;
    padding: 0.5rem 1rem;
}

.comment-name {
    float: left;
    padding: 0 1rem;
    width: 100%;
}

.comment {
    float: left;
    padding: 0 1rem;
    width: 100%;
}

.text-area {
    width: 100%;
    resize: none;
}

.comment-user-name {
    width: 100%;
    border: solid thin #aaa;
}

.submit {
    color: white;
    float: right;
    padding: 0.3rem 1rem;
    background: green;
    margin: 0 1rem;
}

.comments-container {float: left;width: 100%;padding: 1rem;}

commentKey {
}

.user-comment {
    overflow: auto;
}

.comment-author {background: #82ab82;color: white;padding: 0.2rem 1rem;border-radius: 3px;}

.comment-text {padding: 0.5rem;font-style: italic;background: white;margin: 0.5rem;border-radius: 0.5rem;border: thin solid #8a8;}
.comment-reply {padding: 0.5rem;font-style: italic;background: #ded;margin: 0.5rem;border-radius: 0.5rem;border: thin solid #8a8;}

.errorMessage {position: absolute;top: 0rem;}

@media only screen and (min-width: 768px) {

    .label{
        width: 25%;
    }

    .comment-name {
        width: 75%;
        padding: 0.5rem 1rem;
    }

    .comment {
        width: 75%;
        padding: 0.5rem 1rem;
    }


    .errorMessage {
    }
}