﻿.labelRating:before {
    content: '☆';
    color: black;
    font-size: 2em;
}

.labelRating.on:before {
    content: '★';
    color: gold;
    /* uncomment for iOS */
    /*   font-size: 2.4em;
  top: -0.1em;
  left: -0.1em; */
}

.inputRating:checked + .labelRating:before {
    content: '★';
    color: gold;
    /* uncomment for iOS */
    /*   font-size: 2.4em;
  top: -0.1em;
  left: -0.1em; */
}

@media only screen and (max-width : 1224px) {
    .labelRating {
        display: inline-block;
        cursor: pointer;
        position: relative;
        padding-left: 1.25em;
        margin-right: 0.25em;
        font-size: 2em;
    }

        .labelRating:before {
            display: inline-block;
            width: 30px;
            height: 30px;
            margin-right: 20px;
            position: absolute;
            left: 0;
            border-radius: 10px;
            line-height: 40px;
            margin-top: -20px;
        }
}

    @media only screen and (min-width : 1224px) {
        .labelRating {
            display: inline-block;
            cursor: pointer;
            position: relative;
            padding-left: 55px;
            margin-right: 25px;
            font-size: 2.25em;
        }

            .labelRating:before {
                display: inline-block;
                width: 40px;
                height: 40px;
                margin-right: 20px;
                position: absolute;
                left: 0;
                border-radius: 10px;
                line-height: 40px;
                margin-top: -20px;
            }
    }




    /*.labelRating {
    display: inline-block;
    cursor: pointer;
    position: relative;
    padding-left: 55px;
    margin-right: 25px;
    font-size: 40px;
}

    .labelRating:before {
        display: inline-block;
        width: 40px;
        height: 40px;
        margin-right: 20px;
        position: absolute;
        left: 0;
        border-radius: 10px;
        line-height: 40px;
        margin-top: -20px;
    }*/

    input[type=radio] {
        display: none;
        -webkit-appearance: none;
    }

    /* Non-essential */
    /*body {
    margin: 2em;
    background-color: #448AC1;
    text-align: center;*/
    /* remove gray highlight on tap in iOS */
    /*-webkit-tap-highlight-color: transparent;
}*/

    .question {
        margin-bottom: 2em;
        text-align: center;
        /* remove gray highlight on tap in iOS */
        /*-webkit-tap-highlight-color: transparent;
        */
    }


    .pRating {
        font-family: Bitter, sans-serif;
        font-size: 1.5em;
        text-align: center;
    }

    /*#submit {
    font-size: 24px;
    font-family: Bitter, sans-serif;
    color: #448AC1;
    background-color: white;
    width: 80px;
    height: 80px;
    border: none;
    border-radius: 40px;
}*/

    .commentSection {
        margin-bottom: 4em;
    }
