@charset "utf-8";
/*--μορφοποιηση και χρωματα body και class main--*/
body, .main{
    margin-top: 3em;
    background-color: #191919;
    color: #ffffff;
    font-family: 'Didact Gothic', sans-serif;
    font-size: 18px;
}

/*μορφοποιηση κουμπια main*/

.main button{
    width: 40%;
    padding: 1em;
    margin: 3em;
    background-color: #141414;
    color: #ffffff;  
    font-size: 18px;
    border-radius: 15px;
    border-color: #ffffff;
}

/*μορφοποιηση img και p στο bios του συγκροτήματος*/

#bios img{
    width:50%;
}

#lives {
    text-align: justify;
}

/*--μορφοποιηση h3 tag--*/
h3 {
    text-align: center;
}

/*--class για background color σε tags του bootstrap--*/
.backcolor{
    background-color: #191919;
}

/*--χρωμα γραμμης όπoυ υπαρχει--*/
hr{
    background-color: #f5be17;
}

/*--σελιδα index κενο στα κουμπια */
.index_keno {
    margin-top: 1em;
    text-align: center;
}

/*--μορφοποιηση a tag για τη γραμματοσειρα--*/
#news a, #live a, #forma1 a, #main a{
    color: #ffffff;
    font-size: 22px;
    font-weight: bold;
}

/*--μορφοποιηση input στοιχειων--*/
input[type="text"], input[type="password"], input[type="tel"], textarea {
    background-color: #222222;
    color: #ffffff;
}

/*--μορφοποιηση input με hover--*/
input[type="text"]:focus, input[type="password"]:focus, input[type="tel"]:focus, textarea:focus {
    border: 4px solid #ffffff;
	border-radius: 6px;
}

/*--μορφοποιηση για στοιχηση στο κεντρο σε tag του bootstrap--*/
.center{
    text-align: center;
}

/*--απόσταση το πανω μερους καθε σελιδας--*/
#head {
    margin-top: 2em;
}

/*--animation του logo των fellow yellow--*/
#head img {
    animation-name: zoomin ;
    animation-duration :3s;
}

@-webkit-keyframes zoomin {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    -moz-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

.fy_logo{
    width: 15em;
    float: left;
}

/*--μορφοποιηση του μενου / nav--*/

nav {
    width: 100%;
}

nav ul li {
    display:inline-block;
    width: 19%;
    }

nav a {
    color:#f5be17;
    display:block;
    text-decoration: none;
    padding: 10%;
    float:left;
    width:100%;
 }

nav a:hover {
    background: #f5be17;
    border-radius: 5px;
    text-decoration: none;
    color:#141414;
}

.menu-trigger {
    display:none;
    color:#f5be17;
}

@media screen and (max-width:1180px) {
 /*menu για το responsive σε hamburger*/
    .menu-trigger {
    display:block;
  }
nav ul li {
    display:inline-block;
          
  }   
nav ul {
    display:none;
  }
 /*--εξαφάνιση του logo των fy--*/   
    .fy_logo {
        display: none;
    }
}

/*---μορφοποιηση για τα κουμπιά---*/
button, #submit, #clear, #button{
    background-color: #141414;
    color: #ffffff;  
    font-size: 18px;
    border-radius: 15px;
    border-color: #ffffff;
}

/*--μορφοποιηση hover των κουμπιων--*/
button:hover, #submit:hover, #clear:hover, #button:hover {
    background-color: #f5be17;
    color: #141414;
    border-color: #121212;
    cursor: pointer;
}

/*--class και εφε για την image gallery στην index--*/

.gallery{
    text-align: center;
}

.pic2 {
	-webkit-animation:flash 3s linear infinite;
    -moz-animation:flash 3s linear infinite;
    animation:flash 3s linear infinite;
    
}

@-webkit-keyframes flash {
	0% {opacity : 0;}
	100% {opacity : 1;}
		}
/*responsive για την image gallery*/
@media screen and (max-width:1850px) {
    .gallery {
        width: auto;
    }
}

@media screen and (max-width:1430px) {
    .gallery {
        width: auto;
        display: inherit;
    }
}

/*-----μορφοποιηση σελιδας δισκογραφία----*/

/*εξαφάνιση λίσταςS*/
#songsTitles {
    display: none;
}

/*--μορφοποιηση input στην ευρεση αλμπουμ--*/
#songName {
    padding: 1%;
    border-radius: 6px;
}
#songName:focus {
    border: 4px solid #ffffff;
	border-radius: 6px;
}

.inputField #button {
    width: 40%;
    padding: 2%;
}

/*μορφοποιηση drop down list στην ευρεση αλμπουμ*/

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

/*--animation για τα αλμπουμ-*/
.zoom-image:hover {
  transition: all 200ms linear;
  transform: scale(1.2); 
  opacity: 1; 
  z-index: 99;
}

/*μορφοποιηση  στο hover της λίστας*/
#songsTitles li:hover {
	background-color:#f5be17;
	color:#141414;
    border: 2px solid #141414;
	}

/*---divs στη σελίδα δισκογραφία---*/

.albums {
    margin:3em 0;    
    }

/*animation για τα ποδήλατα και μορφοποίηση img */
.roll {
	-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);}
	}
.roll img{
    width: 80%;
    margin-top: 5em;
    }

/*μορφοποίηση κουμπί νεα αναζητηση*/
.song button {
    width: 15%;
    padding: 1em;
    background-color: #141414;
    color: #ffffff;  
    font-size: 18px;
    border-radius: 15px;
    border-color: #ffffff;
    }
.song button:hover {
	background-color:#f5be17;
	color:#141414;
    border: 2px solid #141414;
    cursor: pointer;
	}
/*---μορφοποιηση FELLOW YELLOW σελίδα---*/

#news, #live, #main {
    margin-top: 2em;
    height: 35em;
    overflow: auto;
    }
#member h3{
    margin-top: 1em;
}

 /*μορφοποίηση κουμπί νεα αναζητηση*/
#elegxos, #member input[type=submit] {
    width: 60%;
    padding: 1em;
    background-color: #141414;
    color: #ffffff;  
    font-size: 18px;
    border-radius: 15px;
    border-color: #ffffff;
}
#elegxos:hover, #member input[type=submit]:hover, #forma1 input[type="submit"]:hover{
	background-color:#f5be17;
	color:#141414;
    border: 2px solid #141414;
    cursor: pointer;
	}

/*--SCROLL BAR STYLE--*/
.scroll_bar::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    -moz-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 10px;
	background-color: #141414;
}

.scroll_bar::-webkit-scrollbar
{
	width: 12px;
	background-color: #141414;
}

.scroll_bar::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    -moz-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #f5be17;
}

/*μορφοποιήσεις σελίδα εισοδος/εγγραφη και login plugin*/

#forma1 input[type="text"], #forma1 input[type="password"], #signup input[type="text"], #signup input[type="password"], #forma2 input[type="text"], #forma2 input[type="tel"], #psw_reminder input[type="text"], #psw_reminder input[type="password"]{
    margin: 1%;
    padding: 1%;
    border-radius: 6px;
}

#forma1 input[type="submit"], #right input[type="submit"], #right input[type="button"], #live_articles button, #new_articles button, #psw_reminder input[type="submit"] {   /*και κουμπια απο: φορμα επικοινωνιας στη σελιδα επικοινωνια, αρθρα απο live και news*/ 
    width: 30%;
    padding: 1em;
}

#forma2 input[type="submit"] {
    margin-top: 3em;
    width: 50%;
    padding: 1em;
}

/*--CLASS ελεγχου χρήστη μέσω js--*/

.check {
	display:none;
	width:40px;
	height:40px;
	}
.showCheck{
	display:inline-block;
    width:40px;
	height:40px;
	}
.lathos{
	color:#ffffff;
	font-weight:bold;
	font-size:20px;
	padding:5px;
	}

.wrongInput {
	color: #ffffff;
	font-weight:bold;
	font-size:16px;
	}

/*--CLASS ελεγχου χρήστη στην σελίδα επικοινωνία και μορφοποίηση σελίδας--*/

.input {
	color:#f5be17;
	font-weight:bold;
}

#footer {
    margin-top: 4em;
}

#left, #right {
    text-align: left;
}
#left input[type="text"], #left input[type="tel"], #left textarea{
    margin: 1%;
    padding: 1%;
    border-radius: 6px;
}