body{
	margin:0;
	padding: 0;

}

.rating input{
	display: none;

	
}
.rating label{
	display: block;
	cursor: pointer;
}



.rating label:hover:after,
.rating input:hover ~ label:after,
.rating input:checked ~ label:after{
	opacity: 1;
}
/* For mobile phones: */
@media only screen and (min-width: 250px) {
    /* For desktop: */
.rating label{
    width: 50px;
}
.rating{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotateY(180deg);
	display: flex;
}
.rating label:before{
	content: "\f005";
	font-family: fontAwesome;
	position: relative;
	display: block;
	font-size: 50px;
	color: #101010;
	
}
.rating label:after{
	content: "\f005";
	font-family: fontAwesome;
	position: relative;
	display: block;
	font-size: 50px;
	color: #1f9cff;
	top: -80px;
	opacity: 0;
	transition: .5s;
	text-shadow: 0 2px 5px rgba(0,0,0,.5);

}
}

/* For mobile phones: */
@media only screen and (min-width: 359px) {
    /* For desktop: */
.rating label{
    width: 50px;
}
.rating{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotateY(180deg);
	display: flex;
}
.rating label:before{
	content: "\f005";
	font-family: fontAwesome;
	position: relative;
	display: block;
	font-size: 50px;
	color: #101010;
	
}
.rating label:after{
	content: "\f005";
	font-family: fontAwesome;
	position: relative;
	display: block;
	font-size: 50px;
	color: #1f9cff;
	top: -80px;
	opacity: 0;
	transition: .5s;
	text-shadow: 0 2px 5px rgba(0,0,0,.5);

}
}
/* For mobile phones: */
@media only screen and (min-width: 415px) {
    /* For desktop: */
.rating label{
    width: 100px;
}
.rating{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotateY(180deg);
	display: flex;
}
.rating label:before{
	content: "\f005";
	font-family: fontAwesome;
	position: relative;
	display: block;
	font-size: 100px;
	color: #101010;
	
}
.rating label:after{
	content: "\f005";
	font-family: fontAwesome;
	position: relative;
	display: block;
	font-size: 100px;
	color: #1f9cff;
	top: -150px;
	opacity: 0;
	transition: .5s;
	text-shadow: 0 2px 5px rgba(0,0,0,.5);
}
}