/*   ************************
Styles f?r Remix.ruhr, ab 2022
Styles in Erg?nzung zu Bootstrap 5
 */
 
  /* Links */
a:link { color: white; text-decoration:none;}
a:visited { color: white; text-decoration:none;}
a:hover { color: #f8f908; text-decoration:underline; !important}
a:active { color: #f8f908; text-decoration:none; !important}	
	
.bg-dark {
	background-color: #0161b7 !important;
	}	
  
.textgruen {
	color: #e6007e;
	}	
 
.textweiss {
	color: #fff;
	}

.bg-farbig {
	background-color: #f8f908 !important;
	}
  
.text-farbig {
	color: #f8f908;
	}
  
  /*  Vereinbarung */
.alert-light {  
	background-color: #000000 !important;
	color: #ddd !important;
	font-size: 1.0em !important;
	font-weight: bold !important;
	text-align: left !important;
	}	  
	
	/*  Text */
.alert-success  {   
	background-color: #0161b7 !important;
	color: #ddd !important;
	font-size: 1.0em !important;
	font-weight: bold !important;
	text-align: center !important;
	border: none !important;
	}	
  
.btn-submitter  {
	color: #000;
	background-color:#e6007e;
	}	 
.btn-pfeil-rot  {
	font-size: 20px;
	color: #ff0000;
	}	
.textfeld {
	color: #000;
	background-color:#e6007e;
	}	
	
  
 /*
  Styles f?r Remix.ruhr in den Jahren 2019-2021
  noch ohne Bootstrap
*/

/* Links */    hier die Styles f?r kleine Fenster   
.vereinbarungsfenster   {
	position:relative;
	top:1px;
	left:1px;
	max-width:500px;
	max-height:280px;
	overflow:auto;
    border-top:thin solid #552222;
    border-left:thin solid #552222;
    border-bottom:thin solid #552222;
    border-right:thin solid #552222;
    border:thin solid #000000;
	padding: 5px;
	margin: 25px;
	color: #333;
	background-color: #ccc;
	font-family: sans-serif, Arial, Helvetica, Verdana, Geneva;
	font-size: 1.2em;
	//font-weight: bold;
	  text-align: left;	
scrollbar-face-color: #004da5;
scrollbar-highlight-color: #004da5;
scrollbar-shadow-color: #004da5;
scrollbar-3dlight-color: #21a1de;
scrollbar-arrow-color:  #f04a24;
scrollbar-track-color: #21a1de;
scrollbar-darkshadow-color: #008cd3;
}
*/

/*
.submitfeld {
	font-size: 1.3em;
	font-weight: bold;
	}
	
#content-box {
    width: 99%;
    height: 70%;
    margin-left: 0px;
    padding: 0px;
			background-color: #000;	
	  font-family: sans-serif, Arial, Helvetica, Verdana, Geneva;
	  font-size: 0.9em;
	  color: #fff;	
	  text-align: center;
	  margin: 0px auto;
	}	
	
#content-box-musiclist {
    width: 70%;
    height: 99%;
    margin-left: 20px;
    padding: 20px;
	  background-color: SNOW;	
	  background-image: linear-gradient(to right, #ED6C2D, #F0AC3E);
	  font-family: sans-serif, Arial, Helvetica, Verdana, Geneva;
	  font-size: 18px;
	  color: #000;	
	  text-align: center;
	  margin: 0px auto;
	}		

*/

/*    hier die Styles f?r gr??ere Fenster   
@media (min-width: 50em) { 
  .vereinbarungsfenster {
	position:relative;
	top:1px;
	left:1px;
	max-width:500px;
	max-height:280px;
	overflow:auto;
    border-top:thin solid #552222;
    border-left:thin solid #552222;
    border-bottom:thin solid #552222;
    border-right:thin solid #552222;
    border:thin solid #000000;
	padding: 5px;
	margin: 25px;
	color: #666;
	background-color: #ccc;
	font-family: sans-serif, Arial, Helvetica, Verdana, Geneva;
	font-size: 1.0em;
	//font-weight: bold;
	  text-align: left;	
scrollbar-face-color: #004da5;
scrollbar-highlight-color: #004da5;
scrollbar-shadow-color: #004da5;
scrollbar-3dlight-color: #21a1de;
scrollbar-arrow-color:  #f04a24;
scrollbar-track-color: #21a1de;
scrollbar-darkshadow-color: #008cd3;
}

.submitfeld {
	font-size: 1.1em;
	font-weight: bold;
	}

#content-box {
    width: 99%;
    height: 70%;
    margin-left: 0px;
    padding: 0px;
		background-color: #39dfaa;
	/*	background-image: linear-gradient(to right, #ED6C2D, #F0AC3E); 
	/*	background-image: linear-gradient(to right, #000000, #888888);	
			background-color: #000;		
	  font-family: sans-serif, Arial, Helvetica, Verdana, Geneva;
	  font-size: 0.8em;
	  color: #fff;	
	  text-align: center;
	  margin: 0px auto;
	}	
	
#content-box-musiclist {
    width: 70%;
    height: 99%;
    margin-left: 20px;
    padding: 20px;
	  background-color: #cccccc;	
	  background-image: linear-gradient(to right, #ED6C2D, #F0AC3E);
		background-image: linear-gradient(to right, #000000, #888888);		  
	  font-family: sans-serif, Arial, Helvetica, Verdana, Geneva;
	  font-size: 0.8em;
	  color: #000000;	
	  text-align: center;
	  margin: 0px auto;
	}		

}




body {
		margin-left: 0px;
		height: 1300;
		background-color: #ffffff;
	  font-family: sans-serif, Arial, Helvetica, Verdana, Geneva;
	  font-size: 1.4em;
	  color: #fff;
	  text-align: center;
	}

	
	
	
/* Boxen definieren

#kopf_logo {
	  width: 100%;
    height: 95px;
    background-color: #000000;
    margin-top: 0px;
    margin-bottom: 30px;
	}
#kopf{
	  width: 100%;
    height: 108px;
	}

#footer {
	  width: 100%;
    height: 100px;
    background-color: #000000;
    margin-top: 0px;
    margin-bottom: 0px;
    margin: 0px;
    }	
	
   
#footer1 {
	  width: 100%;
    height: 300px;
    margin-top: 0px;
    margin-bottom: 0px;
	  }	
	  
	      
#footer2 {
	  width: 100%;
    height: 300px;
    margin-top: 0px;
    margin-bottom: 30px;
	}		

#text{
	  margin-left: 0px;
	  width: 99%;
	  height: 99%;
	  text-align: center;
	}

	
	
#Submitbutton {
		font-family: sans-serif, Arial, Helvetica, Verdana, Geneva;
	  font-size: 29px;
	}

.normklein  {
	color: black;
	font-size: 14px;
	}
#form_zentriert {
		text-align: center;
		}
			
}
		
		

@media (min-width: 35em) { 

  .vereinbarungsfenster {
	position:relative;
	top:1px;
	left:1px;
	max-width:500px;
	max-height:280px;
	overflow:auto;
    border-top:thin solid #552222;
    border-left:thin solid #552222;
    border-bottom:thin solid #552222;
    border-right:thin solid #552222;
    border:thin solid #000000;
	padding: 5px;
	margin: 25px;
	color: #333;
	background-color: #ccc;
	font-family: sans-serif, Arial, Helvetica, Verdana, Geneva;
	font-size: 2.0em;
	//font-weight: bold;
	  text-align: left;	
scrollbar-face-color: #004da5;
scrollbar-highlight-color: #004da5;
scrollbar-shadow-color: #004da5;
scrollbar-3dlight-color: #21a1de;
scrollbar-arrow-color:  #f04a24;
scrollbar-track-color: #21a1de;
scrollbar-darkshadow-color: #008cd3;
  } 
  
  
  
#kopf_logo {
	  width: 100%;
    height: 95px;
    background-color: #000000;
    margin-top: 0px;
    margin-bottom: 30px;
	}
#kopf{
	  width: 100%;
    height: 108px;
	}

 }
 */ 
  
  
  
  
  
   
  
