hr {
  border-top-color: #d6d6d6;
}

.pointer {
  cursor: pointer;
}

.ion-2x {
  font-size: 2em;
}

.ion-3x {
  font-size: 3em;
}

.ion-4x {
  font-size: 4em;
}

.ion-5x {
  font-size: 5em;
}

.ion-6x {
  font-size: 6em;
}

.ion-7x {
  font-size: 7em;
}

/*.text-base {
    color: #5c5c5c !important;
}*/

.text-base {
  color: #5c5c5c !important;
}

.text-success {
  color: #129017 !important;
}

.text-dark {
  color: #1E1E1E !important;
}

.text-danger {
  color: #CC0000 !important;
}

.btn-primary {
  background-color: #CC0000;
  border-color: #CC0000;
  color: white;
}

.btn-primary:hover {
  background-color: #1E1E1E;
  border-color: #1E1E1E;
}

.text-secondary {
  color: #F0931C;
}

.btn-primary:hover {
  background-color: #1E1E1E;
  border-color: #1E1E1E;
}

.btn-dark {
  background-color: #1E1E1E;
  border-color: #1E1E1E;
  color: white;
}

.btn-solid {
  background-color: #1E1E1E;
  border-color: #1E1E1E;
}

.btn-solid:hover {
  background-color: #CC0000;
  border-color: #CC0000;
}

.btn-black {
  background-color: #000000;
  border-color: #000000;
  color: white;
}

.btn-tertiary {
  background-color: #014A5D;
  border-color: #014A5D;
  color: white;
}

.btn-tertiary:hover {
  background-color: #1E1E1E;
  border-color: #1E1E1E;
  color: white;
}

.btn-outline-tertiary {
  background-color: transparent;
  border-color: #014A5D;
  color: #014A5D;
}

.btn-outline-tertiary:hover {
  background-color: #014A5D;
  color: white;
}

.btn-primary:hover {
  background-color: #1E1E1E;
  border-color: #1E1E1E;
}

.btn-minimal span {
  padding: .5em 2em;
}

.complete-btn {
  background: linear-gradient(120deg, #8e0606 10%, #CC0000 100%);
  color: white;
  padding: 5px 10px;
  border-radius: 5px;
  font-weight: 600;
  font-size: 14px;
}

/*
 * CSS Loader or Busy Indicator that loads in a modal and covers
 * the entire page while processing requests.
 *
 * @source: https://loading.io/css/
*/

.loader {
  /*&.blue {
        border-left-color: $skyblue !important;
    }*/
}

.loader .actions {
  margin-top: 3em;
}

.loader .actions button {
  width: 65%;
  font-weight: 500;
}

.loader.disc {
  margin: 20px auto;
  font-size: 10px;
  position: relative;
  width: 12em;
  height: 12em;
  overflow: hidden;
  border-radius: 50%;
  text-indent: -9999em;
  border-top: 1em solid rgba(255, 255, 255, 0.1);
  border-right: 1em solid rgba(255, 255, 255, 0.1);
  border-bottom: 1em solid rgba(255, 255, 255, 0.1);
  border-left: 1em solid #eaeaea;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}

.loader.size-sm {
  width: 5em;
  height: 5em;
  border-top: 0.5em solid rgba(255, 255, 255, 0.1) !important;
  border-right: 0.5em solid rgba(255, 255, 255, 0.1) !important;
  border-bottom: 0.5em solid rgba(255, 255, 255, 0.1) !important;
  border-left-width: .5em !important;
}

.loader.size-md {
  width: 10em;
  height: 10em;
  border-top: 0.5em solid rgba(255, 255, 255, 0.1) !important;
  border-right: 0.5em solid rgba(255, 255, 255, 0.1) !important;
  border-bottom: 0.5em solid rgba(255, 255, 255, 0.1) !important;
  border-left-width: .5em !important;
}

.loader.size-lg {
  width: 12.5em;
  height: 12.5em;
  border-top: 1em solid rgba(255, 255, 255, 0.1) !important;
  border-right: 1em solid rgba(255, 255, 255, 0.1) !important;
  border-bottom: 1em solid rgba(255, 255, 255, 0.1) !important;
  border-left-width: 1em !important;
}

.loader.primary {
  border-left-color: #CC0000 !important;
}

.loader.success {
  border-left-color: #129017 !important;
}

.loader.tertiary {
  border-left-color: #014A5D !important;
}

.loader.warning {
  border-left-color: #F0931C !important;
}

.loader.default {
  border-left-color: #eaeaea !important;
}

@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/*=== End of css loader ===*/

:root {
  --color-tlight: #009688;
}

body {
  font-family: poppins,sans-serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.9em;
  color: #5c5c5c;
  height: 100%;
}

[v-cloak] > * {
  display: none;
}

body::-webkit-scrollbar {
  width: .15em;
}

body::-webkit-scrollbar-track {
  -webkit-box-shadow: unset 0 0 6px #5c5c5c;
}

body::-webkit-scrollbar-thumb {
  background-color: #CC0000;
  /*outline: 1px solid $color-primary;*/
}

/* Header */

header {
  position: relative !important;
}

#primary-nav li a {
  color: #1E1E1E;
  letter-spacing: 0px;
}

#primary-nav li a:hover {
  color: #CC0000;
  font-weight: 500;
}

#primary-nav li a.active {
  color: #CC0000;
  font-weight: 600;
}

.navbar-brand {
  padding: 15px 0;
}

.navbar-brand img {
  margin-left: 10px;
}

[data-mobile-nav-style=modern]:before {
  background-color: #f6f6f6 !important;
  background-image: linear-gradient(#f6f6f6) !important;
}

[data-mobile-nav-style=modern]:before {
  background-image: unset;
  background-image: unset;
  background-color: #5c5c5c;
}

.bars {
  border-color: #1E1E1E !important;
}

.bars .bar {
  background-color: #1E1E1E !important;
}

/* End of Header */

.table .thead-dark th {
  background-color: #1E1E1E;
  border-color: #1E1E1E;
}

.badge-danger {
  background-color: #CC0000;
  border-color: #CC0000;
}

.badge-success {
  background-color: #129017;
  border-color: #129017;
}

.checkout-header {
  height: 150px;
  padding: 20px 5px;
  display: flex;
  justify-content: center;
  transition: all linear 1s;
}

.checkout-header .checkout-loader img {
  margin-bottom: 10px;
}

#checkout-loader {
  position: absolute;
  height: 100vh;
  width: 100vw;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(30, 30, 30, 0.988);
  color: white;
}

#checkout-loader h1,#checkout-loader h2,#checkout-loader h3,#checkout-loader h4,#checkout-loader h5,#checkout-loader h6 {
  color: white;
}

#checkout-loader .checkout-close-btn {
  position: absolute;
  top: 0;
  right: 0;
  margin: 30px;
}

#checkout-loader .checkout-close-btn .btn > span {
  font-size: 1.4em;
  padding: .7em .5em;
}

.package-item .iconbox-shadow {
  box-shadow: 1px 2px 30px rgba(0, 0, 0, 0.2);
}

.package-item .iconbox {
  padding: 20px 30px !important;
  padding-top: 30px !important;
}

.package-item .iconbox .contents h4 {
  margin: unset;
}

.package-item .iconbox .contents p {
  margin-bottom: 0;
  font-size: .9em;
  line-height: 1.9em;
}

.package-item .iconbox .contents .btn {
  border-radius: 5px;
  margin-top: unset;
}

.package-item .iconbox .contents .btn > span {
  padding: .35em 1em;
  font-size: .85em;
}

.package-item:hover .iconbox-filled.iconbox-side {
  box-shadow: 0 25px 70px rgba(0, 0, 0, 0.3);
}

.ld-masked-image figure {
  background-position: initial;
  background-size: 65%;
  background-repeat: no-repeat;
}

.ld-masked-image {
  position: absolute;
  right: -90vw;
  top: -80vh;
  left: 50vw;
  height: 100vh;
}

.ul-reset {
  list-style-type: none;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 0px;
}

.movie-item {
  display: inline-grid;
  margin-right: 30px;
  margin-bottom: 30px;
  width: 190px;
}

.movie-item:last-child {
  margin-right: unset;
  margin-bottom: unset;
}

.movie-item .movie-runtime {
  font-size: 15px;
  margin-top: -5px;
  margin-bottom: unset;
  font-weight: 300;
  letter-spacing: .2px;
}

.movie-item .movie-rating {
  margin-top: 5px;
  margin-bottom: unset;
  font-size: 15px;
}

.movie-item figure {
  display: flex;
  align-items: center;
  width: 190px;
  height: 300px;
}

.movie-item figure img {
  width: 190px;
  height: 300px;
  border-radius: 5px;
}

.movie-item figure:before {
  content: attr(data-movie-title);
  position: absolute;
  display: none;
  align-items: start;
  justify-content: center;
  width: 190px;
  height: 300px;
  color: white;
  font-size: 19px;
  padding: 10px 10px;
  text-align: center;
  /*border-radius: 4px;*/
  background: linear-gradient(150deg, rgba(0, 0, 0, 0.9) 60%, rgba(204, 0, 0, 0.9) 100%);
}

.movie-item figure:after {
  content: attr(data-movie-plot);
  position: absolute;
  display: none;
  align-items: flex-start;
  justify-content: center;
  width: 190px;
  max-height: 130px;
  overflow: hidden;
  color: white;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.4;
  padding: 10px 10px;
  font-family: 'Segoe UI', sans-serif;
  text-align: center;
}

.movie-item figure:hover:before {
  display: flex;
}

.movie-item figure:hover:after {
  display: flex;
}

#movies {
  padding-top: 1em;
  padding-bottom: 4em;
  background: linear-gradient(#000000, #1E1E1E);
}

#movies h1,#movies h2,#movies h3,#movies h4,#movies h5,#movies h6,#movies p,#movies span {
  color: white;
}

#movies h2 {
  margin-top: 10px;
}

#movies ul li {
  display: inline-grid;
  margin-right: 30px;
  margin-bottom: 30px;
}

.movie-panel {
  height: 100vh;
  padding-top: 3em;
}

.movie-panel .movie-backdrop {
  position: absolute;
  top: 0;
  height: 100vh;
  width: 100vw;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.movie-panel .movie-backdrop-inner {
  height: 100%;
  background: linear-gradient(rgba(0, 0, 0, 0.98), rgba(0, 0, 0, 0.9));
}

.movie-panel h2 {
  margin-top: unset;
  margin-bottom: 10px;
}

.movie-panel p {
  font-size: 13.5px;
  font-weight: 300;
  letter-spacing: .5px;
}

.movie-panel a {
  color: #5c5c5c;
}

.movie-panel a:hover {
  color: white;
}

.movie-panel .poster {
  max-height: 480px;
  display: flex;
  justify-content: flex-end;
  border-radius: 5px;
}

.movie-panel .poster img {
  max-height: 480px;
  border-radius: 5px;
}

.movie-panel ul li {
  width: unset !important;
  margin-right: 10px !important;
  margin-bottom: unset !important;
  text-align: center;
}

.movie-panel ul.ratings {
  margin-bottom: 2em;
}

.movie-panel ul.ratings .rating-score {
  vertical-align: middle;
}

.movie-panel ul.buttons {
  font-size: 13px;
  margin-top: 3em;
  display: flex;
  align-items: center;
}

.movie-panel ul.buttons .btn {
  background-color: #5c5c5c;
  border-color: #5c5c5c;
  border-radius: 4px;
  transform: scale(1);
  /* you need a scale here to allow it to transition in both directions */
  transition: 0.35s all ease-in-out;
}

.movie-panel ul.buttons .btn span {
  padding: 1em 2.3em;
}

.movie-panel ul.buttons .btn span i {
  font-size: 1.4em;
}

.movie-panel ul.buttons .btn:hover {
  background-color: #014A5D;
  border-color: #014A5D;
  transform: scale(1.1);
  color: white !important;
}

.movie-panel ul.buttons .btn.trailer-btn {
  background-color: white;
  border-color: white;
  border-radius: 6px;
}

.movie-panel ul.buttons .btn.trailer-btn span {
  color: #1E1E1E !important;
  padding: 1em 2.5em;
}

.movie-panel ul.buttons .btn.trailer-btn span i {
  font-size: 2em;
}

.movie-panel ul.buttons .btn.trailer-btn:hover {
  background-color: #CC0000;
  border-color: #CC0000;
}

.movie-panel ul.buttons .btn.trailer-btn:hover span {
  color: white !important;
}

.movie-casts {
  height: auto;
  background-color: white;
  color: #1E1E1E;
  padding-bottom: 30px;
}

.movie-casts h1,.movie-casts h2,.movie-casts h3,.movie-casts h4,.movie-casts h5,.movie-casts h6,.movie-casts p,.movie-casts span {
  color: #1E1E1E !important;
}

.movie-casts ul li {
  width: unset !important;
  /*margin-right: 15px !important;*/
  margin-bottom: 10px !important;
  text-align: center;
}

.movie-casts ul li .cast-img-container {
  height: 120px;
  width: 120px;
  border-radius: 50%;
  background-size: cover;
  background-position: center;
}

.movie-casts ul li .cast-img-container:before {
  content: '';
  display: none;
  height: 120px;
  width: 120px;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.6);
}

.movie-casts ul li .cast-img-container:hover:before {
  display: block;
}

.movie-casts ul li h6 {
  margin: unset;
  font-weight: bold;
  margin-top: 7px;
  font-size: 16px;
}

.movie-casts ul li p {
  margin: unset;
  font-size: 13px;
}

#tickets {
  background-color: white;
  padding-bottom: 5em;
}

#tickets hr {
  margin-top: 10px;
  margin-bottom: 10px;
}

#tickets h6 {
  margin: unset;
  margin-top: 8px;
}

#tickets .ticket .ticket-div {
  /*display: flex;
            justify-content: center;*/
}

#tickets .ticket .ticket-face {
  /*height: 280px;*/
  border-radius: 7px;
  padding-top: 10px;
  padding-bottom: 20px;
}

#tickets .ticket .ticket-front {
  display: flex;
  justify-content: center;
  margin-top: 15px;
}

#tickets .ticket .ticket-front-left h5 {
  margin: unset;
}

#tickets .ticket .ticket-front-left ul {
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}

#tickets .ticket .ticket-front-left ul li {
  margin-right: 40px;
}

#tickets .ticket .ticket-front-left ul li span {
  display: flex;
  justify-content: center;
}

#tickets .ticket .ticket-front-left ul li .h2 {
  font-size: 4.5em;
  margin: unset;
}

#tickets .ticket .ticket-front-left ul:before {
  content: '';
  display: none;
  position: absolute;
  height: 1px;
  width: 70%;
  margin-left: auto;
  background-color: black;
}

#tickets .ticket .ticket-front-left ul:after {
  content: '';
  display: none;
  position: absolute;
  height: 1px;
  width: 70%;
  top: 55%;
  margin-left: auto;
  background-color: black;
}

#tickets .ticket .ticket-front-right {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

#tickets .ticket .ticket-front-right h3 {
  margin: unset;
  color: white;
}

#tickets .ticket .ticket-front-right .ticket-code {
  position: absolute;
  top: 0;
  right: 0;
  margin: 15px;
  color: #8e0404;
}

#tickets .ticket .ticket-back .ticket-back-left {
  padding: 10px 15px;
}

#tickets .ticket .ticket-back .ticket-back-left h1,#tickets .ticket .ticket-back .ticket-back-left h2,#tickets .ticket .ticket-back .ticket-back-left h3,#tickets .ticket .ticket-back .ticket-back-left h4,#tickets .ticket .ticket-back .ticket-back-left h5,#tickets .ticket .ticket-back .ticket-back-left h6,#tickets .ticket .ticket-back .ticket-back-left p,#tickets .ticket .ticket-back .ticket-back-left span {
  color: white;
  margin: unset;
}

#tickets .ticket .ticket-back .ticket-back-left h6 {
  font-weight: 300;
}

#tickets .ticket .ticket-back .ticket-back-left .ticket-code {
  position: absolute;
  bottom: 0;
  left: 0;
  margin: 15px;
  color: #4e0202;
}

#tickets .ticket .ticket-back .ticket-back-left table {
  margin-top: 30px;
  border: none;
}

#tickets .ticket .ticket-back .ticket-back-left table tr {
  border-bottom: 1px dashed #8e0606;
}

#tickets .ticket .ticket-back .ticket-back-left table tbody td {
  border-right: 1px dashed #8e0606;
  margin-right: 20px;
  padding-bottom: 10px;
}

#tickets .ticket .ticket-back .ticket-back-left table tbody td:last-child {
  border-right: none;
}

#tickets .ticket .ticket-back .ticket-back-right figure img {
  max-width: 270px;
  transform: translatex(-27%) translatey(110%) rotate(-90deg);
}

#tickets .upper-strip {
  background: linear-gradient(120deg, #014A5D 40%, #009688 100%);
}

#tickets .tickets-inner {
  margin-top: 20px;
  margin-bottom: 30px;
}

#tickets .tickets-inner ul {
  margin-top: 20px;
}

#tickets .tickets-inner ul li {
  margin-right: 30px;
  border: 1px solid #dadada;
  padding: 15px 15px;
  border-radius: 8px;
  text-align: center;
  box-shadow: 2px 2px 15px #dadada;
  margin-bottom: 15px;
}

#tickets .tickets-inner ul li h2,#tickets .tickets-inner ul li p {
  margin: unset;
}

#tickets .tickets-inner ul li:hover {
  background: linear-gradient(140deg, #009688 30%, var(--color-tertiary) 100%);
  border-color: #009688;
  cursor: pointer;
  box-shadow: 2px 2px 25px #009688;
}

#tickets .tickets-inner ul li:hover .show-time {
  color: white;
}

#tickets .tickets-inner ul li:hover .show-week {
  color: white;
}

#tickets .tickets-inner ul li.active {
  background: linear-gradient(120deg, #CC0000 40%, #8e0606 100%);
  border-color: transparent;
  box-shadow: 2px 2px 10px #CC0000;
}

#tickets .tickets-inner ul li.active .show-time {
  color: white;
}

#tickets .tickets-inner ul li.active .show-week {
  color: white;
}

#tickets .tickets-inner.seats ul li {
  border: 1px solid #dadada;
  border-radius: 5px;
  box-shadow: 2px 2px 5px #d0d0d0;
  margin-bottom: 15px;
  margin-right: 10px;
  height: 42px;
  width: 42px;
}

#tickets .tickets-inner.seats ul li .seat-div {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#tickets .tickets-inner.seats ul li:hover {
  color: white;
  cursor: pointer;
}

#tickets .tickets-inner.seats ul li.active {
  color: white;
}

#tickets .tickets-inner.seats ul li.booked {
  background-color: #cbd7e9;
  color: #a2b1c3;
}

#tickets .tickets-inner.seats .legend {
  display: flex;
  justify-content: center;
  margin-top: 15px;
  margin-bottom: 15px;
}

#tickets .tickets-inner.seats .legend span {
  margin-right: 10px;
  border: 1px solid #dadada;
  padding: 5px 10px;
  border-radius: 5px;
  text-align: center;
  font-size: 13px;
}

#tickets .tickets-inner.seats .legend span.taken {
  background-color: #cbd7e9;
  border-color: #cbd7e9;
  color: #a2b1c3;
}

#tickets .tickets-inner.seats .legend span.selected {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  color: white;
}

#tickets .tickets-inner .show-time {
  font-size: 1.6em;
  font-weight: 100;
  color: black;
}

#tickets .tickets-inner .show-week {
  color: var(--color-tertiary);
  font-size: 13px;
}

@media (min-width: 1300px) {
  .ld-masked-image {
    top: -65vh;
    left: 20vw;
  }
}

@media (min-width: 920px) {
  .ld-masked-image {
    top: -40vh;
    left: 10vw;
  }
}

@media (min-width: 768px) {
  .ld-masked-image {
    top: -35vh;
    left: 10vw;
  }
}

@media (min-width: 992px) {
  .ld-masked-image {
    top: -70vh;
    left: 40vw;
  }
}

@media (min-width: 1000px) {
  .ld-masked-image {
    top: -50vh;
    left: 30vw;
  }
}

@media (min-width: 1200px) {
  .ld-masked-image {
    top: -40vh;
    left: 10vw;
  }
}

@media (min-width: 1300px) {
  .ld-masked-image {
    top: -40vh;
    left: 10vw;
  }
}

@media (max-width: 660px) {
  .movie-panel {
    height: 120vh;
    padding-top: 2em;
  }

  .movie-panel .movie-backdrop {
    height: 120vh;
  }
}