.cinema {
background-color: #D8D8D8;
padding:20px;
}
.cinemaProgram {
	padding-top:20px;
}
.leftFloat {
  float: left;
}
.rightFloat {
  float: right;
}
.bild_text {
	float:left;
	margin-right: 30px;
	font-size:0.8em;
}
.cinemaText {
font-size:0.8em;
}
.film_list {
	padding-bottom:20px;
padding-top:20px;
}
.film_list_image {
	width:150px;
}
.cinemaImageProgram {
position: relative;
height:100%;
background-repeat: no-repeat;
   background-position: center ;
   background-size: cover;
width:215px;
height:215px;
margin:0px 10px 10px 0px;
}

.cinemaImage {
position: relative;
height:100%;
background-repeat: no-repeat;
   background-position: center ;
   background-size: cover;
width:215px;
height:215px;
margin:0px 10px 10px 10px;
}
.cinemaImage  a {
display:block;
height:100%;
}
.cinemaImage  a:hover {
background-color: rgba(255, 255, 255, 0.2);
}
.cinemaImage img {
    display: block;
}
.cinemaImage span {
display: block;
    background-color: silver;
    background-color: hsla(0, 0%, 100%, 0.5);
	color:#ffffff;
	font-weight:bold;
	text-shadow: 1px  1px 1px black, 1px -1px 1px black, -1px  1px 1px black, -1px -1px 1px black;
	text-align:center;
	position:absolute;
bottom:0;
width:100%;
text-align: center;
}

.cinemaOrt {
background-color: #b51a26;
color:#ffffff;
width:215px;
margin:10px 0px 0px 10px;
text-align:center
}

/*************** movie section *********************/
#movie {
	height:100%;
	display:flex;
	/*border:2px solid #ff0000;*/
}
.movieContainer {
  display: grid;
  grid-template-columns: 350px 1fr; /* links Poster+Trailer, rechts Texte */
  gap: 20px;
  align-items: start;
  margin: 20px 0;
}
#movie hr {
	padding:10px 0px 10px 0px;
	margin:10px 0px 0px 0px;
	
}
.movieTop {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.moviePicture {
  width: 100%;
  height: auto;
  border-radius: 6px;
}
.movieTrailer iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9; /* responsive Trailer */
  border-radius: 6px;
}
.movieTitle {
	font-size:1.2em;
	color:#337ab7;
	font-weight:bold;
	padding-bottom: 10px;
}
.movieDesc {
padding: 0px 0px 20px 0px;
/*border:2px solid #ff0000;*/
/*border:2px solid blue;*/
text-align:justify;
font-size:1.2em;
margin-bottom: 15px;
}
.info {
padding: 10px 0px 0px 0px;
/*border:2px solid #ff10e0;*/
/*border:2px solid orange;*/
text-align:left;
font-size:1.0em;
line-height:1.4em;
margin-bottom: 15px;
}
.movieCredits {
padding: 0px 20px 0px 0px;
/*border:2px solid #f0ff47;*/
font-size:1.0em;
/*min-height:200px;*/
}
.cSpan {
	
}
.cTopic {
	color: #337ab7;
	font-weight: bold;
}
.cTopicList {
  display: block;
  font-size: 1.0em;
  font-weight: bold;
  margin-bottom: 10px;
}
.cColor {
	color: #337ab7;
}
.movieBottom {

padding: 0px 0px 0px 0px;

/*border:2px solid #00FF00;*/
width:100%;
/*background:#f3f3f3;*/
font-size:1.0em;
margin-bottom: 15px;
}
.movieEvents {
	padding: 30px 0px 0px 0px;
	margin: 20px 0;
	font-family: Arial, sans-serif;
	margin-top: 20px;
}
.movieLinks {
/*text-align:right;*/
padding: 0px 0px 0px 0px;
/*border:2px solid #8A2908;*/
margin:0px 0px 0px 0px;
}
.programList {
 display: grid;
  grid-template-columns: 1fr auto; /* links: Datum/Text | rechts: Button */
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-bottom: 1px solid #ddd;
}
.programList div {
  display: contents; /* Trick: Inhalte des inneren divs direkt im Grid platzieren */
}
.programList a,
.programList span.btn {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 0.9em;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
}

.programList a:hover {
  background-color: #0056b3;
}

.programList br {
  display: none; /* <br> wird überflüssig im Grid */
}


.btn {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 0.9em;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
}

/* Anmelde-Button */
.btn-anmelden {
  background-color: #ff7f24;
  color: #fff;
}

.btn-anmelden:hover {
  background-color: #ffa54f;
}

/* Ausgebucht-Button */
.btn-ausgebucht {
  background-color: #6c757d;
  color: #fff;
  cursor: not-allowed;
}

/************responsive************/
/* Responsive: bei kleinen Screens einspaltig */
@media (max-width: 768px) {
  .movieContainer {
    grid-template-columns: 1fr;
  }

  .movieTop {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
  }

  .movieTrailer,
  .moviePicture {
    flex: 1 1 100%;
  }

  .programList {
    grid-template-columns: 1fr; /* Buttons unter Datum */
    text-align: left;
  }
}

/*************** cinemaProgramList *********************/
#cinemaProgramList {
	height:100%;	
}
/* #cinemaProgramList a{
	color: #f27800;	
} */
#cinemaProgramList a:hover{
	text-decoration:underline;
}
#cinemaProgramListMovie {
font-weight:bold;
color:#81b538;

}
#cinemaProgramListLink {
font-weight:bold;
color:#f27800;

}
#cinemaProgramListMovie:hover {
text-decoration:underline;
color: #f27800;	
}
#cinemaProgramListMovie a:hover {
text-decoration:underline;
color: #f27800;	
}
.cinemaProgramListContainer {
  display: grid;
  grid-template-columns: 35% 10% 10% 25% 20%;
  padding: 0px;
  	
}
.cinemaProgramListContainerSonder {
  display: grid;
  grid-template-columns: 35% 10% 10% 25% 20%;
  padding: 5px 2px 2px 5px;
  background-color: #CEE3F6;
  font-size: 0.8em;
  }
  .cinemaProgramListContainerSonderZusatz {
  display: grid;
  grid-template-columns: 100%;
  padding: 2px 2px 5px 5px;
  background-color: #CEE3F6;
  font-size: 0.8em;
  }
.weekday {
font-weight: bold;
color: #337ab7;
}
.cinemaProgramListItem { 
  padding: 0px 10px 0px 0px;
  margin: 0px 5px 5px 0px;
  font-size: 15px;
  text-align: ;
}
.cinemaProgramListItem a {
	color: #f27800;
}
.button {
	padding: 10px 0px 20px 0px;
}
.register{
	color: #f27800;
	font-weight: bold;
}
.grey{
	color: #b2b2b2;
	font-weight: bold;
}
.green {
color:#81b538;
}
.cinemaProgramAbsprache {
	background-Color:#b51a26; 
	padding:20px; 
	margin-top:20px; 
	color:#fff
}
.cinemaProgramAbsprache a {
	color:#fff
}

/******Autocomplete*************/
#schoolResults {
	width:100%;
	 
}
.easy-autocomplete.eac-skw {  
}
.easy-autocomplete.eac-skw input {
  font-size: 0.9em;
  padding: 6px 12px;
}
.easy-autocomplete.eac-skw ul { 
  border-radius: 6px;
  border-width: 0;
  top: 10px;
  overflow:auto;
}
.easy-autocomplete.eac-skw ul li, .easy-autocomplete.eac-plate-dark ul .eac-category {
  background: #ffffff;
  color: #000000;
  font-size: 12px;
  transition: all 0.4s ease 0s;
}
.easy-autocomplete.eac-skw ul li b, .easy-autocomplete.eac-plate-dark ul .eac-category b {
  color: #b51a26;
}
.easy-autocomplete.eac-skw ul li.selected, .easy-autocomplete.eac-plate-dark ul .eac-category.selected {
  background: #EDEDED;
}
.easy-autocomplete.eac-skw ul li:first-child, .easy-autocomplete.eac-plate-dark ul .eac-category:first-child {
  border-radius: 6px 6px 0 0;
}
.easy-autocomplete.eac-skw ul li:last-child, .easy-autocomplete.eac-plate-dark ul .eac-category:last-child {
  border-radius: 0 0 6px 6px;
}
/********Anmeldung***************/
#signupContainer h1 {
	color: #b51a26;
	margin: 0;
	padding: 0 0 10 0;
	border-bottom: 0px solid #000;
	font-size: 1.6em;
}
.signupHead {
	float:left;
	padding-bottom:10px;
	width:100%;
}
.signupMoviePic {
	float:left;
	padding-right: 20px;
}
.signupMovieInfo {
	
	padding: 0px 0px 10px 20px;
}

/********Formular****************/
.skw  {
  
}
.btn.rot {
	background-color: #b51a26;
	color:#ffffff;
}
.form-group {
  margin-bottom: 1rem;
}

.form-text {
  display: block;
  margin-top: 0.25rem;
}

.form-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -5px;
  margin-left: -5px;
}

.form-row > .col,
.form-row > [class*="col-"] {
  padding-right: 5px;
  padding-left: 5px;
}

.form-check {
  position: relative;
  display: block;
  padding-left: 1.25rem;
}

.form-check-input {
  position: absolute;
  margin-top: 0.3rem;
  margin-left: -1.25rem;
}

.form-check-input:disabled ~ .form-check-label {
  color: #6c757d;
}

.form-check-label {
  margin-bottom: 0;
}

.form-check-inline {
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-align: center;
  align-items: center;
  padding-left: 0;
  margin-right: 0.75rem;
}

.form-check-inline .form-check-input {
  position: static;
  margin-top: 0;
  margin-right: 0.3125rem;
  margin-left: 0;
}
label {
    font-weight: normal;
	font-size:0.9em;
}