/* CSS Document */


/*MODAL*/




/* The Modal (background) */
.modal , .modalstart, .giveupmodal{
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 10000000; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(91,91,91,0.60); /* Black w/ opacity */
	
}


.modalstart{
	display: block;
	background-color: rgba(91,91,91,0);
}

/* Modal Content/Box */
.modal-content, .modal-content2, .modal-content3 , .modal-content4, .giveup-content{
background-color: #fefefe;
 margin: 20% auto; /* 15% from the top and centered */
padding: 10px 10px 0px 10px;
  /*border: 1px solid #888;*/
 position: relative;
max-width: 400px;
	width: 80%;

background: #FFFFFF;
border-radius: 38px;
	
}



.modal-contentstart {
  background-color: #fefefe;
  margin: 10vh auto; /* 15% from the top and centered */
padding: 10px 10px 10px 10px;
  /*border: 1px solid #888;*/
 position: relative;
max-width: 500px;
	width: 80%;
height: auto;
background: #FFFFFF;
border-radius: 38px; 
	margin-top: 80px;
	/* Could be more or less, depending on screen size */
}






.modaltext{
	margin:50px;
	height: auto;
	min-height: 150px;
	padding: 10px;
	display: block;
	text-align: center;
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

#acceptcookies:hover{cursor: pointer;
	
}


.vorschlag{
 /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 10000000; /* Sit on top */
  left: 0;
	display: none;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(91,91,91,0.60); }


.vorschlag-content{
	  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px 20px 70px 20px;
  /*border: 1px solid #888;*/
 position: relative;
max-width: 400px;
	width: 80%;
height: auto;
background: #FFFFFF;
border-radius: 38px; 
}





.nope-content{
	  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  /*border: 1px solid #888;*/
 position: relative;
max-width: 400px;
	width: 80%;
height: 25%;
background: #FFFFFF;
border-radius: 38px; 
}


.modal-content h2{margin-top: -20px;}
.modalimage{
	height:170px;
	margin-top: 15px;
	
}

.vorschlagtext{
	margin:20px 50px;
	
	text-align: center;
}



@media (max-width: 900px){
	
	/* Modal Content/Box */
	
	
	.modal-content, .modal-content2, .modal-content3 , .modal-content4, .giveup-content, .nope-content{
background-color: #fefefe;
 margin: 20% auto; /* 15% from the top and centered */
padding: 10px 10px 20px 10px;
  /*border: 1px solid #888;*/
 position: relative;
max-width: 400px;
	width: 80%;
height: auto;
background: #FFFFFF;
border-radius: 38px;
	
}
	
	
	
	
	.giveup-content, .modal-contentstart{
  margin: 10% auto; height: auto; max-width: 90%;
	
}
	
.vorschlag-content{
  margin: 25% auto; 
	padding-bottom: 50px;/* 15% from the top and centered */
}	
	
	#gladcontent{
		
	}

.modaltext, .vorschlagtext{
margin: 40px 25px 25px 25px;
	
	min-height: 180px;
	
	
}


@media (max-width: 600px){
	
	
	.modaltext{
	margin:40px;
	min-height: 120px;
}

	.modaltext h2{
		font-size: 18pt;
		margin-bottom: 60px;
	}
		
	.vorschlag-content{
  	margin: 20% auto; 
	padding-top: 5px;	
	padding-bottom: 80px;/* 15% from the top and centered */
}	
	

}	
		
	}