﻿.review-panel {
    padding: 0;
    margin: 15px 0;
}
.review-panel-head {
    border-bottom: 1px inset silver;
}
.review-panel-rate {
    border: 1px solid black;
    padding: 8px 10px; 
    margin: 10px 5px;
    box-shadow: rgba(128, 128, 128, 0.75) 3px 3px 15px;
    max-width: 350px;
}
.review-panel-ratebox {
    width: 100%; 
    background-color: white;
    margin-bottom: 5px;
}

.review-panel-title {
    margin: 8px 6px;
}
.icon-box {
    max-width: 500px;
    padding: 5px; 
}
.icon-image {
    display: inline-block;
    width: 70px;
    padding: 5px;
    vertical-align: top; 
    text-align: center;
    box-shadow: rgba(128, 128, 128, 0.75) 3px 3px 15px, rgba(128, 128, 128, 0.75) -1px -1px 2px;
    margin: 5px;
    border-radius: 100%; 
    border: 3px double green;
}
.icon-bttn {
    display: inline-block;
    padding: 5px;
    vertical-align: middle;
    min-height: 70px;
    width:250px;
}
.icon-thmb {
    width: 100%; 
}
.ithumbs {
    width: 36px;
    margin: 5px;
    border-radius: 100%;
    border: 2px double green;
    padding: 2px;
}
.icon-group {
    margin: 3px;
    padding: 3px;
    border-bottom: 1px double green;
    background-color:azure;
}
    .icon-group p {
        margin: 2px;
        font-weight: bold;
        border-bottom: 1px double green;
        background-color: rgba(206, 255, 0, 0.62);
        padding: 2px 4px;
        font-variant: small-caps;
    }
.ithumbs:hover {
    cursor: pointer;
    background-color: rgba(182, 255, 0, 0.55);
}
.review-panel-star {
    height: 20px;
    vertical-align: top;
    border: 1px solid green;
    padding: 2px;
    background-color: darkgreen; 
}
.review-star {
    height: 17px;
    vertical-align: top;
    border: 1px solid green;
    padding: 2px;
    background-color: darkgreen;
    margin-top: 10px;
}
.star-cell-1 {
    padding: 2px 0;
    width: 20px;
    text-align: right;
    border: 1px solid green;
    font-weight: bold;
    border-right: unset;
}
.star-cell-1 span {
    background-color: darkgreen;
    padding: 2px 0;
    color: yellow;
    padding-left: 6px;
    font-weight: bold;
}
.star-cell-2 {
     border-top: 1px solid green;
   padding: 2px 0;
    border-bottom: 1px solid green;
}
.star-cell-3 {
    padding: 2px 4px;
    text-align: center;
    width: 45px;
    border-bottom: 1px solid green;
    border-right: 1px solid green;
    border-top: 1px solid green;
}
.total-votes {
    border-radius: 35%;
    background-color: Highlight;
    padding: 2px 4px;
    color: white;
}
.media-controls {
    padding: 3px 5px;
    margin: 3px;
}
.media {
    /*padding: 8px 3px;*/
    margin: 10px auto 20px auto;
    box-shadow: rgba(128, 128, 128, 0.75) 1px 1px 2px 1px;
}
.media-reply {
    margin-left: 22px;
    margin-bottom: 1px;
    box-shadow: none;
    border-bottom: 1px double silver;
}
.media-left {
    background-color: snow;
    display: inline-block;
    vertical-align: middle;
}
.media-left-text {
    font-size: 13px;
    display: block;
}
.media-body {
    padding: 3px;
    background-color: white;
    border-top: 3px double silver;
}
.media-reply-body {
    padding: 3px;
    background-color: white;
}
.media-heading {
    margin-top: 3px;
    margin-bottom: 2px;
    font-size: 19px;
}
.media-heading small{
    font-size: 14px;
}
.media-reply-heading {
    margin-top: 3px;
    margin-bottom: 2px;
    font-size: 19px;
    float: left;
}

    .media-reply-heading small {
        font-size: 14px;
        display:block;
    }

.media-object {
    box-shadow: rgba(128, 128, 128, 0.75) 3px 3px 15px, rgba(128, 128, 128, 0.75) -1px -1px 2px;
    border-radius: 100%;
    border: 3px double green;
    padding: 0;
    margin: 6px 8px;
    width: 55px; 
}
.media-object-reply {
    box-shadow: rgba(128, 128, 128, 0.75) 3px 3px 15px, rgba(128, 128, 128, 0.75) -1px -1px 2px;
    border-radius: 100%;
    border: 3px double green;
    padding: 0;
    margin: 2px;
    margin-right: 10px;
    width: 40px;
    float: left;
}
.media-body-head {
    display: inline-block;
    vertical-align: middle;
}
.media-body-message {
    padding: 1px 5px;
    margin: 8px auto;
}
.media-reply-body-message {
    padding: 4px 5px;
    border-top: 3px double silver;
    /*border-bottom: 1px outset silver;*/
}
    .media-body .media-body-message .emotion-navbar {
    float: none; 
}
.media-body-message p {
    min-height: 60px;
    margin: 3px 10px;
    text-align: left;
}
.message-line {
    margin: 2px auto;
    padding: 2px;
    font-size: 15px;
}
.media-showlikes {
    font-size: 13px;
    float: left;
    margin: 4px;
}
.repmedia{
    /*border: 1px solid lightgreen;*/
    padding: 2px 5px;
}
.btn-reply {
    background: linear-gradient(snow,lightyellow,goldenrod);
    box-shadow: rgba(154, 205, 50, 0.64) 1px 1px 8px;
    border-radius: 5px;
    padding: 2px 4px;
    border: 1px solid green;
    transition: background linear 3s;
}
.reply-link {
    margin: 1px 3px;
}
    .btn-reply:hover {
        background: linear-gradient(white, ghostwhite,yellow);
        box-shadow: rgba(154, 205, 50, 0.64) 0 0 0;
        text-decoration: unset;
    }
.previous a {
    background-color: dodgerblue;
    box-shadow: rgba(128, 128, 128, 0.58) 1px 1px 8px;
}
.next a {
    background-color: dodgerblue;
    box-shadow: rgba(128, 128, 128, 0.58) 1px 1px 8px;
}
.emotion-bar {
    margin-bottom: 1px;
    padding-left: 2px; 
}
    .emotion-bar li {
        display: inline-block;
        padding: 1px 3px;
        margin: 2px 4px;
        border-radius: 5px;
    }
    .emotion-bar .badge {
        background-color: transparent;
        color: orangered;
        font-size: 10px;
        position: absolute;
        left: -8px;
        top: -8px;
        border-radius: 50%;
        padding: 3px;
    }

@media only screen and (max-width: 480px) {
    .media-showlikes {
        float: left;
        white-space: nowrap; 
    }
}