:root {

  --bookingBackground: #1c1f25;

  --bookingPrimary: #e41b13;

  --bookingSecondary: white;

  --bookingDark: #13151a;

  --bookingPrimaryLight: #ff5465;

  --bookingPrimaryDark: #a80600;

  --primaryFont: "Raleway", sans-serif;

  --posterAspectRatio: 101/152;

  --priceInfoForegroundColor: #ffffff !important;

  --priceInfoBackgroundColor: #e41b13 !important;

}



html {

  background: none;

}



body {

  font-family: var(--primaryFont) !important;

  background-color: var(--bookingBackground) !important;

  margin: 0px;

  color: var(--bookingSecondary);

}



a {

  color: #e41b13;

}



a:visited {

  color: #c91811;

}



a:hover,

a:active,

a:focus {

  color: #e7322b;

}



.page-title span {

  color: var(--bookingSecondary) !important;

  font-family: var(--primaryFont) !important;

  font-size: 24px;

  text-transform: uppercase;

}



span,

h4,

h5,

h1,

strong {

  font-family: var(--primaryFont) !important;

}



small {

  font-family: var(--primaryFont) !important;

  color: var(--bookingPrimary) !important;

}



div.seatCharts-row {

  min-width: -webkit-min-content;

  min-width: min-content;

}



div.seatCharts-row>div:first-of-type {

  background-color: var(--bookingPrimary) !important;

  color: var(--bookingSecondary);

}



div.seatCharts-seat,

div.seatCharts-cell {

  min-width: 25px;

}



div.seatCharts-cell.seatCharts-space {

  background-color: var(--bookingBackground) !important;

  color: black;

}



div.seatCharts-seat.seatCharts-cell.focused {



  background-color: #ddd !important;

  color: black;

}



div.seatCharts-seat.seatCharts-cell.unavailable {

  background-color: #2c313e !important;

  color: #717275;

}



div.seatCharts-seat.seatCharts-cell.selected {}



input.form-control {

  border-radius: 9px !important;

}



th,

td {

  background-color: var(--bookingBackground);

  ;

}



div.front-indicator {

  color: var(--bookingSecondary);

  background-color: var(--bookingPrimary);

  font-size: larger;

  margin-bottom: 50px;

}



.btn-primary {

  background-color: var(--bookingPrimary);

  border-color: black;

}



.btn-primary:active,

.btn-primary:hover,

.btn-primary:active:hover,

.btn-primary:visited,

.btn-primary:focus,

.btn-primary[disabled]:hover {

  color: var(--bookingSecondary);

  background-color: var(--bookingPrimaryDark);

  border-color: var(--bookingPrimary);

  border: 0;

}



#HeaderLeft {

  max-width: 70%;

}





div#addTeilnehmerModal {

  color: black;

}



div#messagingBox {

  display: none;

}



td {

  font-size: 13px;

}





.roundborder {

  background-color: var(--bookingBackground) !important;

  border: 2px solid var(--bookingSecondary);

  border-radius: 15px;

}



.wizard {

  background-color: var(--bookingBackground) !important;

  border-color: var(--bookingBackground) !important;



}



.steps-container li {

  background-color: var(--bookingBackground) !important;

  color: var(--bookingSecondary);

}



li span.chevron:before {

  border-left: 14px solid var(--bookingBackground) !important;

}



li.active {

  color: var(--bookingPrimary) !important;

}



li {

  color: var(--bookingBackground) !important;

}



div.actions {

  background-color: var(--bookingBackground) !important;

  border-color: var(--bookingBackground) !important;

}



h1.alert-heading {

  margin: 5px 0;

}





.modal-dialog {

  overflow-y: initial !important;

}



.modal-content {



  background-color: var(--bookingBackground) !important;

  color: var(--bookingSecondary);

}



.modal-body {

  overflow: scroll;

  max-height: calc(100vh - 200px);

  overflow-y: auto;

  overflow-x: hidden;

  box-shadow: 0px 0px 15px --bookingSecondary !important;

}





td>div,

div.radio>label {

  height: 100%;

  width: 100%;

}



table th {

  font-size: 16px;

}



table td {

  font-size: 13px;

}





.redColor {

  color: var(--bookingPrimary) !important;

}



.form-control[disabled],

.form-control[readonly] {

  background-color: #2c313e;

  color: var(--bookingSecondary);

}



.noStyleReadOnly {

  background-color: #fff !important;

  color: black !important;

}







.categories {

  list-style: none;

  padding: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-wrap: wrap;

}



.categories li {



  background: none !important;

  height: initial !important;

  line-height: initial;

}



.categories li:not(:last-child) {

  margin-right: 13px;

}



.categories input[type="radio"] {

  display: none;

}



.categories label,

.categories input {

  top: 0;

  left: 0;

  right: 0;

  left: 0;

  height: 100%;

  width: 100%;

}



.categories label {

  cursor: pointer;

  padding: 5px;

  background-color: var(--bookingBackground) !important;

  border: 2px solid var(--bookingBackground);

}



.categories label:hover {

  border: 2px solid var(--bookingPrimary) !important;

}



.categories input[type="radio"]:checked+label {

  background-color: var(--bookingPrimary) !important;

  border: 2px solid var(--bookingPrimary) !important;

}



.categories input[type="radio"]:checked+label .note {

  color: var(--bookingSecondary);

}



.categories label {

  font-size: 1.2em;

}



.categories li div label .note {

  font-size: smaller;

}



.categories li div label p {

  margin-top: 15px;

  margin-bottom: 0;

}



.categories li div label p span {

  font-size: x-small;

}



.seatingPlace {

  text-align: center;

  text-transform: uppercase;

  font-weight: 900;

}



.seatingPos {

  font-weight: 400;

}



.bookingSelection {}



#bookingSeats hr {

  width: 0px;

}



#bookingSeats hr:not(:last-child) {

  width: 30px;

  border-color: var(--bookingPrimary) !important;

}



#totHr {

  width: 50px;

  border-color: var(--bookingPrimary) !important;

}



a {

  font-family: var(--primaryFont) !important;

}



legend {

  font-size: 1.875rem;

  text-transform: uppercase;

  color: var(--bookingSecondary);

  font-weight: 700 !important;

}



li>a {

  text-transform: uppercase;

  transition: color 0.15s ease-in-out;

}



.navbar-default {

  background-color: var(--bookingBackground) !important;

}



.navbar-default .navbar-nav>li>a {

  color: var(--bookingSecondary) !important;

  border: 1px solid var(--bookingBackground) !important;

}



.navbar-default .navbar-nav>li>a:hover {

  color: var(--bookingSecondary) !important;

  border: 1px solid var(--bookingPrimary) !important;



}



.navbar-default .navbar-nav>.active>a,

.navbar-default .navbar-nav>.active>a:hover {

  border: 1px solid var(--bookingPrimary) !important;

  background-color: var(--bookingPrimary);

}



#kundendatenDiv {

  background-color: var(--bookingBackground) !important;

}



h1 {

  text-transform: uppercase;

}



h1.title-deko {

  border-bottom: 2px solid var(--bookingPrimary) !important;

}









#bootstrap-wizard-1 {

  background-color: var(--bookingBackground);

}



.bootstrapWizard li:before {

  border-color: var(--bookingPrimary);

}



.bootstrapWizard li.active .title {

  color: var(--bookingPrimary);

}



.bootstrapWizard li.active .step {

  background-color: var(--bookingPrimary);

  border-color: var(--bookingPrimary);

  color: var(--bookingSecondary);

}



.bootstrapWizard li .step {

  background-color: var(--bookingBackground);

  border-color: var(--bookingPrimary);

  color: var(--bookingPrimary);

}



.bootstrapWizard li .step {

  font-family: sans-serif !important;

}



#bookingSeats ul li {

  position: relative;

  float: left;

  height: 46px;

  padding: 10px;

  margin: 0;

  font-size: 16px;

  line-height: 46px;

  color: #999;

  cursor: default;

  background: #ededed;

}



.navigationHeader {

  cursor: default;

}



.form-actions {

  background-color: var(--bookingBackground);

}



.pager li>a,

.pager li>a:hover,

.pager li>a:focus {

  background-color: var(--bookingPrimary);

  border-radius: 0px;

  border-color: var(--bookingPrimary);

  color: var(--bookingSecondary);

}



.pager .disabled>a,

.pager .disabled>a:focus,

.pager .disabled>a:hover,

.pager .disabled>span {

  background-color: var(--bookingPrimaryDark);

  border-color: var(--bookingPrimaryDark);

}



.btn:active,

.btn:active:hover,

.btn:focus {

  background-color: var(--bookingPrimaryDark);

  border-color: var(--bookingPrimaryDark);

}



.tab-pane {

  margin-top: 45px;

}



li.previous.disabled,

li.next.disabled {

  visibility: hidden;

}







.row.head {

  margin-left: 0px;

  margin-right: 0px;

}





@media (min-width: 1200px) {}





@media (max-width: 840px) and (min-width: 750px) {

  div.seatCharts-row {}



  div#seat-map {

    overflow-x: auto;

    overflow-y: hidden;

  }



}



@media (max-width: 767px) {

  div.seatCharts-row {}



  div#seat-map {

    overflow-x: auto;

    overflow-y: hidden;

  }



  .row:last-of-type {

    margin-bottom: 3rem;

  }



}



@media(max-width: 666px) {



  h1 span,

  h1 i {

    font-size: smaller !important;

  }



  div.blockUI.blockMsg.blockPage {

    left: 10% !important;

    width: 80% !important;

  }



  i.far.fa-clock {

    font-size: 15px !important;

  }

}



@media (max-width: 480px) {

  div.seatCharts-row {}



  div#seat-map {

    overflow-x: auto;

    overflow-y: hidden;

  }



  .row.head {

    margin-left: 2%;

    margin-right: 2%;

  }



}



@media(max-width: 375px) {

  .headerMenu.headerMenu-Title-Container {

    font-size: 17px;

  }

}



@media (max-width: 320px) {

  #registerBtn {

    font-size: 8px !important;

  }

}



@media only screen and (max-width: 576px) {



  h2.page-title.eventHeader.smallOnPhone {

    font-size: 20px;

  }



  .anmeldenFooterButtons {

    margin-top: 13px;

  }





  .btn-movieInfos {

    box-shadow: 0px 0px 32px 11px rgba(0, 0, 0, 0.61);

    -webkit-box-shadow: 0px 0px 32px 11px rgba(0, 0, 0, 0.61);

    -moz-box-shadow: 0px 0px 32px 11px rgba(0, 0, 0, 0.61);

  }



  .programMovie:hover img {

    filter: unset !important;

    transform: none !important;

  }



  .programMovie .btn-movieInfos {

    transition: opacity 1s, margin 1s;

  }



  #registerBtn,

  #anmeldeBtn {

    margin-left: auto;

  }



  #anmeldeDiv h2.headerMenu,

  #registerDiv h2.headerMenu {

    display: flex;

  }





  .profilenavh1 {

    font-size: x-large;

  }



  .nameContainerNav {

    overflow: hidden;

  }



}



























::-moz-selection {

  color: var(--bookingSecondary);

  background: var(--bookingPrimary);

}



::selection {

  color: var(--bookingSecondary);

  background: var(--bookingPrimary);

}





.fieldiconPWD {

  top: 0.95vh !important;

  color: black;

}



.page-title.eventHeader * {

  color: var(--bookingPrimary);

}





.programMoviesWrapper {

  width: 100%;

}



.programMovie {

  color: var(--bookingPrimary);

  background-color: var(--bookingBackground);

  border: 3px solid var(--bookingPrimary);

  padding: 15px;

  margin-top: 200px;

  margin-bottom: 20px;

}



.programMovie img {

  margin-top: -200px;

  width: 80%;

  aspect-ratio: var(--posterAspectRatio);

  object-fit: cover;

  transition: all .8s;

}



.programMovie h3 {

  max-height: 2em;

  text-overflow: ellipsis;

  overflow: hidden;

}



.programMovie .btn-movieInfos {

  position: absolute;

  left: 50%;

  -webkit-transform: translateX(-50%);

  transform: translateX(-50%);

  margin-top: -130px;

  opacity: 0;

  transition: opacity .8s, margin .8s;

}



.programMovie:hover .btn-movieInfos {

  opacity: 1;

  margin-top: -145px;

}



.programMovie:hover img {

  filter: brightness(50%);

  transform: scale(1.05);

}



.programMovieWrap {

  margin: 0 -13px;

}



.programMovieDate {

  padding-bottom: 20px;

  border-bottom: var(--bookingPrimary) 3px solid;

}



.btn-movieTime {

  background-color: var(--bookingPrimary);

  color: var(--bookingSecondary);

  border-color: var(--bookingPrimary);

  font-family: var(--secondaryFont);

  margin: 0 5px 5px 0;

}



.btn-movieTime:visited {

  background-color: var(--bookingPrimary);

  color: var(--bookingSecondary);

  border-color: var(--bookingPrimary);

}



.btn-movieTime:hover {

  filter: brightness(90%);

  color: unset;

}













.movieBannerBGEffects {

  height: 100%;

  width: 100%;

  backdrop-filter: brightness(0.6);

}



.movieBanner {

  background-position: center;

  background-size: cover;



}



.movieBanner .container {

  height: 500px;

  width: 100% !important;

}



.moviePoster {

  display: flex;

  justify-content: center;

  align-items: center;

  height: 100%;

}



.moviePoster img {

  height: 80%;

  aspect-ratio: var(--posterAspectRatio);

  object-fit: cover;

}



.movieDetails {

  padding: 20px 0;

}



.movieTrailer {

  width: 100%;

  aspect-ratio: 16/9;

}



.movieImages {

  width: 100%;

  margin: -5px;

}



.movieImage {

  width: calc(50% - 10px);

  margin: 5px;

  aspect-ratio: 16/9;

  object-fit: cover;

}



.movieTicketDate {

  text-align: center;

}



.movieTicketTimes {

  text-align: center;

  padding: 10px 0px 15px 0px;

}



.ColTwo {

  background-color: var(--bookingPrimary);

  color: var(--bookingSecondary);

  padding: 10px 30px 10px 30px;



  order: 2;

}



.ColOne {



  padding: 10px 30px 30px 30px;



  order: 1;

}



#AGBLinkWrapper a {

  color: var(--bookingSecondary);

}





@media (max-width: 995px) {



  .ColTwo {

    order: 1;

  }



  .ColOne {

    order: 2;

  }



}



.form-actions {

  padding-bottom: 0 !important;

}





.ui-datepicker {

  width: 20em;

}





span.toggle-password {

  font-family: "Font Awesome 5 Pro" !important;

}







* {

  -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;

}



.profilenavh1 {

  text-align: left !Important;

  padding-left: 13px;

}



#tbl_Tickets {

  margin-top: 13px

}



#passwordForgot,

#login-guestloginbtn {

  text-decoration: underline;

  cursor: pointer;

}



#btnAlsGastBestellen,

#btnAlsGastAnmelden {

  background-color: var(--bookingBackground);

  border: 1px solid var(--bookingSecondary);

  color: var(--bookingSecondary);

}





@keyframes spin {

  0% {

    transform: rotate(0deg);

  }



  100% {

    transform: rotate(360deg);

  }

}





.spin {

  animation: spin 2s linear infinite;

}





.btn-package {

  text-decoration: underline;

  cursor: pointer;

}



.iconBundle {

  margin-right: 2px;

}



#bundleH1 {

  margin-top: 5px;

  margin-bottom: 0px;

}



#BundleModal * {

  color: var(--bookingPrimary) !important;

}



#BundleModal .btn-primary {

  color: var(--bookingBackground) !important;

}



#tbl_bundles,

#tbl_bundles th,

#tbl_bundles td {

  border: none;

}



#BundleModal .buttonIncDec i {

  color: var(--bookingBackground) !important;

}



#BundleModal .btnBundleAmmount:hover {

  color: var(--bookingBackground) !important;

}



input.bundleMengeInput {

  border-radius: 0px !important;

  text-align: center;

}





input.bundleMengeInput::-webkit-inner-spin-button,

input.bundleMengeInput::-webkit-outer-spin-button {

  -webkit-appearance: none;

  appearance: none;

  margin: 0;

}



.btnBundleAmmount {

  border-radius: 0px !important;

  height: 32px !important;

}



.bundleMengeInput {

  background-color: var(--bookingBackground) !important;

  cursor: initial !Important;

}



.packageEntfernen {

  cursor: pointer;

}



.bundleRow td {

  border-top: none !important;

  padding-top: 0px !important;

}





#preview-display {

  display: flex;

  justify-content: center;

  align-items: start;

  height: 100%;

  width: 100%;

  gap: 50px;

}



div.screen {

  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

  margin: 0px;

  padding: 0px;

  width: 100%;

  max-width: 1000px;

  height: 80px;

  min-height: 80px;

  transform: matrix3d(0.98, 0, 0, 0, 0, 0.866025, -0.5, 0.00104167, 0, 0.5, 0.866025, -0.00180422, 0, 0, 0, 1);

  border-radius: 4px;

  background-attachment: scroll;

  background-clip: border-box;

  background-origin: padding-box;

  background-position: center center;

  background-repeat: no-repeat;

  background-size: cover;

  font-size: 35px;

  color: black;

  border: 1px solid black;

  font-weight: 900;

  margin: 0 auto;

  text-transform: uppercase;

  letter-spacing: 10px;

  text-align: center;

}



div.screen-shadow {

  display: block;

  margin: -15px auto 10px auto;

  padding-top: 46.7344px;

  width: 100%;

  max-width: calc(1000px - 18px);

  height: 80px;

  min-height: 80px;

  transform: matrix3d(1, 0, 0, 0, 0, 0.866025, 0.5, -0.00104167, 0, -0.5, 0.866025, -0.00180422, 0, 0, 0, 1);

  border-radius: 4px;

  color: white !important;

  background: linear-gradient(rgba(240, 240, 240, .1) 0%, rgba(240, 240, 240, 0) 100%) !important;

}



div#qr-code {

  margin-top: 25px;

}



.qr-code-blur {

  filter: blur(6px);

}



.ticket-container {

  .ticket-seat-info {

    place-content: center;

  }

}



.ticket-storno-container {

  .Info-Container {

    text-align: center;

  }



  .list-entry-ticket {

    padding: 10px;

    display: flex;

    place-items: center;

    cursor: pointer;

    user-select: none;

  }



  .list-tickets {

    margin-bottom: 10px;

  }



  .checkbox-like-container {

    font-size: 19px;

  }



  .list-entry-ticket.active {

    background-color: color-mix(in srgb, var(--bookingDark) 50%, #bebebe);

  }

}



#qr-code {

  i {

    display: none;

  }

}



#qr-code.qr-code-inactive {

  position: relative;

  display: inline-block;



  i {

    display: block;

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    font-size: 40px;

    color: #bebebe;

    background: rgba(0, 0, 0, 0.5);

    padding: 10px;

    border-radius: 50%;

  }

}



@media (max-width: 767px) {

  .removePackageText {

    display: none;

  }

}



@media (max-width: 434px) {

  #paymentDiv #makeReservationBtn {

    margin-top: 15px;

  }

}



.btn-stornieren {

  margin: 5px;

}



@media (max-width: 1500px) {

  #ticketsDiv {

    .poster-container img {

      height: 300px !important;

    }

  }

}



@media (max-width: 1200px) {

  #ticketsDiv {

    .poster-container img {

      height: 250px !important;

    }

  }

}



@media (max-width: 1000px) {

  #ticketsDiv {

    .poster-container img {

      display: none;

    }

  }

}



@media (max-width: 765px) {

  .div-btns-overview a {

    margin: 5px 3px;

  }



  .div-btns-overview button {

    margin: 5px 8px;

  }

}



h1#containerLogoutBtn {

  margin: 0;

}



h1.page-title.eventHeader.profilenavh1 {

  margin: 0;

}



.nameContainerNav {

  padding: 1% !important;

  display: flex;

  align-items: center;

  justify-content: space-between;

}



ul.pager.wizard.no-margin {

  height: 48px;

  margin: 0 15px !important;

}



tr.CC_Credit_AfterPayment td {

  border: none !important;

}