.rating_section{padding: 30px 0;}
.logo{margin-bottom: 15px;}
.logo a{display: block;}
.wrap{width: 100%; max-width: 500px; margin: auto;}
.wrap .rate_head{font-size:22px; color:#4c9c18;}
.wrap .rate_cont{font-size:20px; color:#888; font-weight:500; margin-top: 3px;}
.rates ul,.rates ol{ margin:0; padding:0;}
.rates ul li{display:block; width:auto; margin:0 10px 0 0; padding:0; float: left;}

.rates ul li input{background:#f4f4f4;font-size:1.1em; font-weight:bold; color:#CCCCCC; padding:10px;cursor:pointer; width:40px; height:40px; border-radius:40px; border:none; text-align:center}


.rates ul li.rated input,.rates ul li input:hover{ background:#4c9c18; color:#fff;}

.rates{display:inline-block; margin:20px 0 5px;}


#rates-cont a{color:#31690d; font-weight:400;}
#rates-cont a:hover{color:#000;}
#rates-cont{font-size:16px; color:#555; max-width:500px; width: 100%; margin: 10px auto;}

.rates_textarea textarea{ border:1px solid #ddd; border-radius:0; color:#999; font-size:14px; width: 100%; max-width: 500px; display: block; margin: auto;}
.rates_textarea textarea:focus{color:#555;}

.rates ul li input{ transition:all 0.2s ease-out; transform:scale(1,1);}
.rates ul li input:hover{ transition:all 0.2s ease-in; transform:scale(1.02,1.02);}
.rates.noselect ul li input{
    pointer-events: none;
}
form #rates-btn a, form #rates-btn input{
    padding:10px 50px;
    max-width: 250px;
    margin: auto;
    background-color: #449d44;
    border: none;
    display: block;
    width: 100%;
    font-weight: bold;
    font-size: 16px;
    margin-top: 15px;
}
.alert.alert-success{padding: 8px; max-width:500px; margin: 10px auto 0;}

@media(max-width:640px){
    .rates ul li{margin:5px 2px;}
    .rates_textarea textarea.input-lg{ width:100%; border-radius:0; }
}