@media screen and (min-width: 1001px) and (max-width: 10000px) {
    .opinions {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0px 0px;
        padding: 4vw 8vw 4vw 8vw;
    }
    .opinions__header {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        color: #23365a;
        font-size: 2.1vw;
        font-weight: 700;
        line-height: 2.35vw;
        text-transform: uppercase;
        letter-spacing: 2px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
        align-content: center;
    }
    .opinions__list {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
    }
    .opinions__list--left {
        float: left;
        width: 65%;
        position: relative;
        margin: 2vw 0px 0px 0px;
        padding: 0px 5vw 0px 0px;
    }
    .opinion {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 2vw 0px;
        padding: 0px 0px 2vw 0px;
        border-bottom: 1px solid #eeeeee;
    }
    .opinion__name {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0.5vw 0px;
        padding: 0px 0px 0px 0px;
        color: #1a4782;
        font-size: 1.1vw;
        font-weight: 700;
        line-height: 1.1vw;
        letter-spacing: 0.32px;
        text-align: justify;
    }
    .opinion__line {
        float: left;
        width: 100%;
        position: relative;
    }
    .opinion__date {
        float: left;
        position: relative;
        margin: 0px 0px 0px 0.5vw;
        padding: 0px 0px 0px 0px;
        color: #000;
        font-size: 0.9vw;
        font-weight: 400;
        line-height: 0.9vw;
        letter-spacing: 0.32px;
        text-align: justify;
    }
    .opinion__text {
        float: left;
        width: 100%;
        position: relative;
        margin: 1vw 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        color: #23365a;
        font-size: 0.85vw;
        font-weight: 400;
        line-height: 1.15vw;
        letter-spacing: 0.32px;
        text-align: justify;
    }
    .opinion__answer {
        float: right;
        width: 95%;
        margin: 0.8vw 0px 0px 0px;
        padding: 1.5vw;
        position: relative;
        background: #eeeeee;
    }
    .opinion__answer--header {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        color: #000;
        font-size: 0.9vw;
        font-weight: 600;
        line-height: 0.9vw;
        letter-spacing: 0.32px;
    }
    .opinion__answer--text {
        margin: 0.5vw 0px 0px 0px;
    }
    .opinions__list--right {
        float: right;
        width: 35%;
        position: relative;
        margin: -2vw 0px 0px 0px;
        padding: 2vw 2vw 2vw 2vw;
        background: #1a4782;
    }
    .noReviews .opinions__list--right {
        width: 100%;
        margin: 0vw 0px 0px 0px;
    }
    .opinions__list--right .opinion__name {
        margin: 0px 0px 1.5vw 0px;
        color: #fff;
    }
    .opinions__list--right .form-box-name {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0.5vw 0px;
        padding: 0px 0px 0px 0px;
        color: #fff;
        font-size: 0.9vw;
        font-weight: 400;
        line-height: 0.9vw;
        letter-spacing: 0.32px;
    }
    .form-box-help {
        float: left;
        width: 100%;
        position: relative;
        margin: -1vw 0px 0px 0px;
        padding: 0px 0.5vw 0px 0px;
        color: #000;
        font-size: 0.8vw;
        font-weight: 400;
        line-height: 0.8vw;
        letter-spacing: 0.32px;
        font-style: italic;
        text-align: right;
    }
    .opinions__list--right .recaptcha {
        float: left;
        margin: 0px 0px 1.5vw 0px;
    }
    .opinions__list--right .form-textarea {
        font-size: 0.9vw;
    }
    .opinions__list--right .form-submit {
        width: 100%;
    }

    .opinionSmall {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 1vw 0px;
    }
    .opinionSmall__header {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0.2vw 0px;
        padding: 0px 0px 0px 0px;
        color: #23365a;
        font-size: 0.9vw;
        font-weight: 700;
        line-height: 0.9vw;
        letter-spacing: 0.32px;
    }
    .opinionSmall__show {
        float: left;
        width: 100%;
        position: relative;
        margin: 0.5vw 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        color: #000;
        font-size: 0.9vw;
        font-weight: 400;
        line-height: 0.9vw;
        letter-spacing: 0.32px;
        cursor: pointer;
    }
}

@media screen and (min-width: 0px) and (max-width: 1000px) {
    .opinions {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0px 0px;
        padding: 8vw 4vw 8vw 4vw;
    }
    .opinions__header {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        color: #23365a;
        font-size: 5vw;
        font-weight: 700;
        line-height: 5vw;
        text-transform: uppercase;
        letter-spacing: 2px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
        align-content: center;
    }
    .opinions__list {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
    }
    .opinions__list--left {
        float: left;
        width: 100%;
        position: relative;
        margin: 6vw 0px 0px 0px;
        padding: 0px 0px 0px 0px;
    }
    .opinion {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 4vw 0px;
        padding: 0px 0px 4vw 0px;
        border-bottom: 1px solid #eeeeee;
    }
    .opinion__name {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 2vw 0px;
        padding: 0px 0px 0px 0px;
        color: #1a4782;
        font-size: 4vw;
        font-weight: 700;
        line-height: 4vw;
        letter-spacing: 0.32px;
        text-align: justify;
    }
    .opinion__line {
        float: left;
        width: 100%;
        position: relative;
    }
    .opinion__date {
        float: left;
        width: 100%;
        position: relative;
        margin: 2vw 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        color: #000;
        font-size: 3vw;
        font-weight: 400;
        line-height: 3vw;
        letter-spacing: 0.32px;
        text-align: justify;
    }
    .opinion__text {
        float: left;
        width: 100%;
        position: relative;
        margin: 3vw 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        color: #23365a;
        font-size: 3.5vw;
        font-weight: 400;
        line-height: 4.5vw;
        letter-spacing: 0.32px;
        text-align: justify;
    }
    .opinion__answer {
        float: right;
        width: 95%;
        margin: 3vw 0px 0px 0px;
        padding: 4vw;
        position: relative;
        background: #eeeeee;
    }
    .opinion__answer--header {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        color: #000;
        font-size: 4vw;
        font-weight: 600;
        line-height: 4vw;
        letter-spacing: 0.32px;
    }
    .opinion__answer--text {
        margin: 0.5vw 0px 0px 0px;
    }
    .opinions__list--right {
        float: right;
        width: 100%;
        position: relative;
        margin: 4vw 0px 0px 0px;
        padding: 4vw;
        background: #1a4782;
    }
    .noReviews .opinions__list--right {
        width: 100%;
        margin: 0vw 0px 0px 0px;
    }
    .opinions__list--right .opinion__name {
        margin: 0px 0px 4vw 0px;
        color: #fff;
    }
    .opinions__list--right .form-box-name {
        float: left;
        width: 100%;
        position: relative;
        margin: 2vw 0px 2vw 0px;
        padding: 0px 0px 0px 0px;
        color: #fff;
        font-size: 3vw;
        font-weight: 400;
        line-height: 3vw;
        letter-spacing: 0.32px;
    }
    .form-box-help {
        float: left;
        width: 100%;
        position: relative;
        margin: 0vw 0px 0px 0px;
        padding: 0.5vw 0px 0px 0px;
        color: #fff;
        font-size: 3vw;
        font-weight: 400;
        line-height: 3vw;
        letter-spacing: 0.32px;
        font-style: italic;
        text-align: right;
    }
    .opinions__list--right .recaptcha {
        float: left;
        margin: 2vw 0px 3vw 0px;
    }
    .opinions__list--right .form-textarea {
        height: 30vw;
        min-height: 30vw;
        max-height: 30vw;
    }
    .opinions__list--right .form-submit {
        width: 100%;
        position: relative;
    }

    .opinionSmall {
        float: left;
        width: 100%;
        position: relative;
        margin: 2vw 0px 4vw 0px;
    }
    .opinionSmall__header {
        float: left;
        width: 100%;
        position: relative;
        margin: 0px 0px 1vw 0px;
        padding: 0px 0px 0px 0px;
        color: #23365a;
        font-size: 3vw;
        font-weight: 700;
        line-height: 3vw;
        letter-spacing: 0.32px;
    }
    .opinionSmall__show {
        float: left;
        width: 100%;
        position: relative;
        margin: 2vw 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        color: #000;
        font-size: 3vw;
        font-weight: 400;
        line-height: 3vw;
        letter-spacing: 0.32px;
        cursor: pointer;
    }
}

@import url(//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css);

/****** Style Star Rating Widget *****/

.rating {
    position: relative;
    border: none;
    float: left;
}
.rating.noRating {
    pointer-events: none;
}

.rating > input {
    position: absolute;
    left: 0;
    top: 4px;
    z-index: 1;
    opacity: 0;
}
.rating > label:before {
    margin: 5px;
    font-size: 1.25em;
    font-family: FontAwesome;
    display: inline-block;
    content: "\f005";
}

.rating > .half:before {
    content: "\f089";
    position: absolute;
}

.rating > label {
    color: #ddd;
    float: right;
    position: relative;
    z-index: 5;
}

/***** CSS Magic to Highlight Stars on Hover *****/

.rating > input:checked ~ label, /* show gold star when clicked */
.rating:not(:checked) > label:hover, /* hover current star */
.rating:not(:checked) > label:hover ~ label {
    color: #ffd700;
} /* hover previous stars in list */

.rating > input:checked + label:hover, /* hover current star when changing rating */
.rating > input:checked ~ label:hover,
.rating > label:hover ~ input:checked ~ label, /* lighten current selection */
.rating > input:checked ~ label:hover ~ label {
    color: #ffed85;
}
