/*STYLE GIA OLH TH SELIDA*/
* {
    font-family:comfortaa;
	font-size: 18px;
    }

/*XRWMA SELIDAS*/
body {
    background-color:#141414;
    }

/*EKSAFANISH LISTAS*/
#songsTitles {
    display: none;
    }

/*STYLE KYRWS SWMATOS SE OLES TIS SELIDES*/
#yellowBikes {
    margin-top: 2%;
    text-align: center;
    color:#fef11a;
    padding-bottom: 5%;
    }

/*TOPOTHETHSH TOY IMG*/
#yellowBikes img{
    margin-top: 2%;
    }

#yb {
    font-size: 70px;
    margin-top: 2%;
    }

#yellowBikes h1 {
    margin-top: 2%;
    }

/*STYLE TWN INPUT STOIXEIWN KAI TVN KOYMPIWN*/

.inputField input{
    padding: 1%;
	color:#141414;
	width:auto;
    border-radius: 6px;
    margin-top: 5%;
	}
#songName:focus {
    border: 4px solid #fef11a;
	border-radius: 6px;
    }

/*STYLE EMFANISHS THS DROP DOWN LIST*/

#songsTitles {
    text-align:left;
	margin-top:3%;
    background-color: #141414;
    height: auto;
    max-height: 20%;
    overflow-x: hidden;
    width: 100%;
    list-style-image:url(../images/yblogosm.png);
    border: 2px solid #fef11a;
	padding-left:12%;
    padding-top: 2%;
	cursor:pointer;
    border-radius: 6px;
    }

/*MORFOPOIHSH STO HOVER*/
#songsTitles li:hover {
	background-color:#fef11a;
	color:#141414;
    border: 2px solid #141414;
    border-radius: 6px;
    padding: 1%;
	}

/*MORFOPOIHSH THS SELIDAS SFALMATOS */
#wrong {
	text-align: center;
    color:#fef11a;
	margin-top:6%;
	}
#wrong button{
	margin-top:8%;
	width:30%;
	}
.roll img{
    width: 70%;
    }

/*ANIMATION GIA TA PODILATA*/
.roll {
    margin-top: 5%;
	-webkit-animation:rotate2 3s infinite;
	-webkit-animation-timing-function:linear;
	-moz-animation:rotate2 3s infinite;
	-moz-animation-timing-function:linear;
	-o-animation:rotate2 3s infinite;
	-o-animation-timing-function:linear;
	}
@-webkit-keyframes rotate2 {
	from {transform:rotateY(0deg);}
	to {transform:rotateY(360deg);}
	}