/* GENERAL SETTINGS */
body {
	background-image: url("img/hintergrund_band01_test.jpg");
	background-color: #000;
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	font-family: Times, Times New Roman, Serif;
	height: 100%;
	width: 100%;
	position: absolute;
}
/* END GENERAL */

/* NAVBAR SETTINGS*/
.top-nav a:hover {
	/* Change the color of links on hover */
  background-color: #002;
}
/* END NAVBAR*/


/* CONTENT SETTINGS */
.profile-pics {					/*MAIN-CLASS*/
	position: absolute;
	padding: 1%;
	margin-top: 10%;
	width: 96.5%;
	min-height: 100%;
	float: left;
	/*border-style: solid;
	border-color: purple;*/					/*BORDER*/
	overflow: hidden;
	display: inline-block;
}
.profile {							/*General Profile-SETTINGS*/
	position: static;
	min-width: 20rem;
	min-height: 30rem;
	margin: 2rem;
	overflow: hidden;
	border-style: solid;		
	border-color: #000; 		/*BORDER*/
	float: left;
}


/*individual profile-settings*/
#Gina1 {
	background: url("img/gina_band02_test.jpg");
	background-size: cover;
	background-position: top center;
	background-repeat: no-repeat;
	left: 5%;
	background-color: rgba(0,0,0,0.8);
}
#Lucas1 {
	background: url("img/lucas_band02_test.jpg");
	background-size: cover;
	background-position: top;
	background-repeat: no-repeat;
	left: 30%;
	background-color: rgba(0,0,0,0.8);
}
#Celina1 {
	background: url("img/celina_band01_test.jpg");
	background-size: cover;
	background-position: top;
	background-repeat: no-repeat;
	left: 55%;
	background-color: rgba(0,0,0,0.8);
}
#Basti1 {
	background: url("img/basti_band01_test.jpeg");
	background-size: cover;
	background-position: top;
	background-repeat: no-repeat;
	top: 45%;
	left: 5%;
	background-color: rgba(0,0,0,0.8);
}
#Niko1 {
	background: url("img/niko_band02_test.jpg");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	top: 45%;
	left: 30%;
	background-color: rgba(0,0,0,0.8);
}
#Julian1 {
	background: url("img/julian_band01_test.jpeg");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	top: 45%;
	left: 55%;
	background-color: rgba(0,0,0,0.8);
}
/*		#Nico1 {
 *			background: url("img/nico_band01_test.JPG");
 *			background-size: cover;
 *			background-position: top left;
 *			background-repeat: no-repeat;
 *			top: 45%;
 *			left: 75%;
 *			background-color: rgba(0,0,0,0.8);
 *		} 														*/


/*Hover BEFORE Settings*/
.overlay {
	/*border-style: solid;
	border-color: yellow;*/						/*BORDER*/
	overflow: hidden;
	position: absolute;
	width: 20rem;
	height: 30rem;
	z-index: 2;
	text-decoration: none;
}

.profile-pics .text {
	position: relative;
	top: 30%;
	opacity: 0;
	vertical-align: middle;
	text-align: center;
	font-size: 200%;
}

/*Hover AFTER Settings*/
#Gina2:hover .text{
	opacity: 1;
	color: #fff;
}
#Gina2:hover {
	background-color: #000010;
	opacity: 0.8;
	z-index: 3;
}

#Lucas2:hover .text{
	opacity: 1;
	color: #fff;
}
#Lucas2:hover {
	background-color: #000010;
	opacity: 0.8;
	z-index: 3;
}

#Celina2:hover .text{
	opacity: 1;
	color: #fff;
}
#Celina2:hover {
	background-color: #000010;
	opacity: 0.8;
	z-index: 3;
}

#Basti2:hover .text{
	opacity: 1;
	color: #fff;
}
#Basti2:hover {
	background-color: #000010;
	opacity: 0.8;
	z-index: 3;
}

#Niko2:hover .text{
	opacity: 1;
	color: #fff;
}
#Niko2:hover {
	background-color: #000010;
	opacity: 0.8;
	z-index: 3;
}

#Julian2:hover .text{
	opacity: 1;
	color: #fff;
}
#Julian2:hover {
	background-color: #000010;
	opacity: 0.8;
	z-index: 3;
}

#Nico2:hover .text{
	opacity: 1;
	color: #fff;
}
#Nico2:hover {
	background-color: #000010;
	opacity: 0.8;
	z-index: 3;
}


/* END CONTENT */