*{
    box-sizing: border-box;
}


input[type=text], select, textarea {
width: 100%;
padding: 12px;
border: 1px solid #ccc;
margin-top: 6px;
margin-bottom: 16px;
resize: vertical;
}

input[type=submit] {
background-color: #4CAF50;
color: white;
padding: 12px 20px;
border: none;
cursor: pointer;
}

input[type=submit]:hover {
background-color: #45a049;
}

  

/* Style the container/contact section */
.container {
border-radius: 5px;
background-color: #f2f2f2;
padding: 10px;
}

/* Create two columns that float next to eachother */
.column {
float: left;
width: 50%;
margin-top: 6px;
padding: 20px;
}

/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}

/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
.btn-scale {
min-width: 44px;
width: 6%;
text-align: center;
font-weight: bold;
color: black;
font-family: 'Lato', sans-serif;
}

.btn-scale-asc-1, .btn-scale-desc-10 {
background-color: #33FF00;
}

.btn-scale-asc-1:hover,
.btn-scale-desc-10:hover {
background-color: #2CDE00;
}

.btn-scale-asc-2,
.btn-scale-desc-9{
background-color: #66FF00;
}

.btn-scale-asc-2:hover,
.btn-scale-desc-9:hover{
background-color: #59DE00;
}

.btn-scale-asc-3,
.btn-scale-desc-8 {
background-color: #99FF00;
}

.btn-scale-asc-3:hover,
.btn-scale-desc-8:hover {
background-color: #85DE00;
}

.btn-scale-asc-4,
.btn-scale-desc-7 {
background-color: #CCFF00;
}

.btn-scale-asc-4:hover,
.btn-scale-desc-7:hover {
background-color: #B1DE00;
}

.btn-scale-asc-5,
.btn-scale-desc-6 {
background-color: #FFFF00;
}

.btn-scale-asc-5:hover,
.btn-scale-desc-6:hover {
background-color: #DEDE00;
}


/* Rating */
a[href*="intent"] {
        display:inline-block;
        margin-top: 0.4em;
    }
.rating {
        width: 246px;
        margin: 0 auto 1em;
        font-size: 45px;
        overflow:hidden;
        padding-right: 30px;
    }
.rating input {
float: right;
opacity: 0;
position: absolute;
}
.rating a,
.rating label {
        float:right;
        color: #aaa;
        text-decoration: none;
        -webkit-transition: color .4s;
        -moz-transition: color .4s;
        -o-transition: color .4s;
        transition: color .4s;
    }
.rating label:hover ~ label,
.rating input:focus ~ label,
.rating label:hover,
    .rating a:hover,
    .rating a:hover ~ a,
    .rating a:focus,
    .rating a:focus ~ a		{
        color: orange;
        cursor: pointer;
    }
    
@media screen and (max-width: 600px) {
.column, input[type=submit] {
width: 100%;
margin-top: 0;
}
}