* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  min-width: 0;
}

/*Show lines to check overflow on the web page

* {
  outline: 1px solid #f00 !important;
}*/

body {
  overflow-x: hidden;
  font-family: "Arimo", "sans-serif";
  padding: 0;
  margin: 0;
  color: var(--main-text-primary);
  line-height: 1.6;
}

section {
  margin: 1rem 0;
  padding: 1px;
}

h1 {
  font-size: 2.5rem;
  font-weight: 400;
  margin-bottom: 0;
  line-height: 1.1;
}

h2 {
  font-size: 1.5rem;
  line-height: 1.3;
  margin-top: 1rem;
}

p {
  font-size: 1rem;
}

figcaption {
  font-size: 0.8rem;
}

section h2,
h4,
p {
  padding: 0.2rem;
}

a {
  text-decoration: none;
}

.wraper {
  display: flex;
  justify-content: space-around;
}

.custom-page-wraper {
  width: 100%;
}

.carousel {
  position: relative;
}
.carousel-control {
  --offset-x: 0;
  cursor: pointer;
  /* Anchor the controls relative to the outer wrapper */
  position: absolute;
  /* Center the controls vertically */
  top: 50%;
  background: none;
  color: inherit;
  border: none;
  padding: 0;
  font: inherit;
  outline: inherit;
  background-color: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(5px);
  height: 2rem;
  width: 2rem;
  border-radius: 50%;
  box-shadow: var(--shadow-one);
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  transform: translateY(-50%) scale(-1);
  border: 1px solid var(--main-link-active);
}

.carousel-control:hover {
  background: rgba(255, 255, 255, 1);
}

.carousel-control svg {
  width: 1rem;
  height: 1rem;
  fill: var(--main-link-active);
  color: var(--main-link-active);
}
/* Don't allow icons to be event targets */
.carousel-control * {
  pointer-events: none;
}
.carousel-control[data-direction="start"] {
  /* Same as left in LTR and right in RTL */
  inset-inline-start: var(--offset-x);
}
.carousel-control[data-direction="end"] {
  /* Same as right in LTR and left in RTL */
  inset-inline-end: var(--offset-x);
}

.carousel [role="list"] {
  /* These are more appropriate in a CSS reset */
  padding: 0;
  list-style: none;
}
.carousel-media {
  /* Arrange media horizontally */
  display: flex;
  height: 210px;
}

.carousel-item img {
  max-height: 150px;
}

.video {
  max-height: 150px;
}

.video-section {
  max-width: 560px;
}

.trailer {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

.trailer iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.center {
  justify-content: center;
  width: 100%;
  height: 100%;
}

.center .carousel-item {
  width: 100% !important;
  height: auto !important;
  max-height: 100% !important;
  display: flex;
  justify-content: center;
}

.center picture {
  display: flex;
  justify-content: center;
}

.center img {
  width: 95% !important;
  height: auto !important;
  max-height: 100% !important;
}

.carousel-scroll-container {
  /* Enable horizontal scrolling */
  overflow-x: auto;
  /* Enable horizontal scroll snap */
  scroll-snap-type: x proximity;
  /* Smoothly snap from one focal point to another */
  scroll-behavior: smooth;
}

.carousel-scroll-container-center {
  overflow-x: initial;
}

.carousel-media.center {
  height: auto;
}

.carousel-item {
  margin: 0 15px;

  /* Limit the height of each media item */
  height: 180px;
  /* Prevent media from shrinking */
  flex-shrink: 0;
  /* The focal point for each item is the center */
  scroll-snap-align: center;
}
.carousel-item:first-of-type {
  /* Allow users to fully scroll to the start */
  scroll-snap-align: start;
}
.carousel-item:last-of-type {
  /* Allow users to fully scroll to the end */
  scroll-snap-align: end;
}
/* Target direct descendant too in case the images have a wrapper parent */
.carousel-item > *,
.carousel-item :is(picture, figure, img) {
  height: 100%;
  border-radius: 20px;
}
.carousel-item img {
  /* Remove line height (typically done in a CSS reset) */
  display: block;
  /* Responsive width based on aspect ratio */
  width: auto;
}

picture {
  position: relative;
}

figcaption {
  position: absolute;
  bottom: -35px;
  left: 10px;
  font-size: 0.55rem;
}

.video {
  aspect-ratio: 16 / 9;
  width: 100%;
}

.breadcrumbs {
  margin: 0.7rem 0;
}

.breadcrumbs a {
  text-decoration: none;
  color: initial;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  align-content: center;
}

.icon-breadcrumbs {
  width: 19px;
  height: 19px;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  align-content: center;
  justify-content: center;
}

.icon-breadcrumbs svg {
  width: 100%;
  height: 100%;
}

.wraper {
  width: 100%;
  display: flex;
  position: relative;
}

.side-bar {
  display: none;
}

.custom-page-wraper {
}

.title-cont {
  width: 100%;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  margin: 0;
}

.main {
  padding: 0.5rem;
}

.main > .title-cont {
  margin: 0;
}

.main > .title-cont > h2 {
  font-size: 1.15rem;
}

.main-title {
  border-bottom: 5px solid var(--main-link-active);
  padding: 5px 10px;
  text-align: center;
}

.sub-title {
  width: 100%;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  text-align: center;
  margin: 0.2rem 0 0 0;
  line-height: 1.6rem;
}

.sub-title > h4 {
  max-width: 850px;
}

.events-view-input-cont {
}

select {
  margin: 1em;
  padding: 0.25em;
  border: 0;
  border-bottom: 2px solid #fb2095;
  font-weight: bold;
  letter-spacing: 0.15rem;
  border-radius: 0;
  font-size: 0.75rem;
}

select:focus {
  outline: 0;
  border-bottom-color: #fb2095;
}

select:active {
  outline: 0;
  border-bottom-color: #fb2095;
}

.connected-cont {
  display: flex;
  flex-flow: column;
  align-items: flex-start;
  justify-content: flex start;
  align-items: flex-start;
}

.connected-event-wraper {
  width: 85%;
  display: flex;
  flex-flow: column;
  align-items: flex-start;
  align-content: flex-start;
  justify-content: flex-start;
  margin-right: 1.2rem;
  border-bottom: 2px dashed var(--main-link-active);
  padding: 0.5rem;
  position: relative;
}

.connected-event-wraper > h3 {
  margin: 0.5rem 0;
}

.connected_event_title {
  letter-spacing: 0.15rem;
  font-size: 1.3rem;
}

.icon-cont {
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}

.connected-row {
  padding: 0.2rem;
  margin: 0.2rem 0;
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  align-content: center;
  justify-content: flex-start;
}

.connected-row a,
time {
  padding: 0;
  margin: 0 0.5rem;
}

.icon-cont svg {
  width: 22px;
  height: 22px;
}

.icon-time {
  width: 22px;
  height: 22px;
}

.location-link {
  text-decoration: none;
  color: var(--main-link);
}

.btn {
  text-decoration: none;
}

.btn:hover {
  text-decoration: none;
  cursor: pointer;
}

.btn:active {
  text-decoration: none;
}

.order-now {
  background: red;
  padding: 0.2rem 0.7rem;
  color: #ffffff;
  border-radius: 30px;
  position: absolute;
  left: 15px;
  bottom: 15px;
  font-size: 0.85rem;
}

.order-now:hover {
  background: red;
  color: #ffffff;
}

.order-now:active {
  background: red;
  color: #ffffff;
}

.connected-cont-group {
  flex-flow: row wrap;
  justify-content: center;
  text-align: center;
}

.group-cont {
  display: flex;
  flex-flow: column;
  align-items: flex-start;
  align-content: flex-start;
  justify-content: flex-start;
  margin: 20px 40px;
}

.groups-ul {
  width: 100%;
  list-style: none;
  display: flex;
  flex-flow: column;
  align-items: center;
  align-content: center;
  justify-content: flex-start;
}

.group-title {
  border-bottom: 2px dashed #fb2095;
  padding: 0.2rem;
  margin-bottom: 0.5rem;
  text-align: center;
  align-self: center;
}

.offers-cont a {
  text-decoration: none;
  color: inherit;
}

.offers-cont a:hover {
  text-decoration: none;
  color: inherit;
}
.offers-cont a:active {
  text-decoration: none;
  color: inherit;
}

.offer-row {
  display: flex;
  flex-flow: column wrap;
  align-items: center;
  align-content: center;
  justify-content: center;
  width: 100%;

  padding: 0.5rem;
}

.offer-logo-box {
  width: 100px;
  height: 100px;

  display: flex;
  align-items: center;
  justify-content: center;
}

.offer-logo-box img {
}

.offer-text-box {
  display: flex;
  flex-flow: column;
  align-items: center;
  align-content: center;
  justify-content: flex-start;
  text-align: center;
  padding: 0 0 2px 0;
}

.offer-row:hover > .offer-text-box {
  border-bottom: 2px dashed var(--main-link-active);
  padding: 0;
}

.offer-text-box h4 {
  border-bottom: 2px dashed #fb2095;
  margin-bottom: 5px;
}

.review-cont {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  align-content: center;
  justify-content: flex-start;
  width: 100%;
  margin: 2.5rem 0;
}

.review-ele {
  margin: 0;
  display: flex;
  flex-flow: column;
  align-items: center;
  align-content: center;
  justify-content: flex-start;
  text-align: center;
}

.review-logo-box {
  width: 65px;
  height: 65px;
}

.review-logo-box img {
  width: 100%;
  height: 100%;
  align-self: center;
  margin: 0;
}

blockquote {
  padding: 0.8rem;
}

.qoute-block-wrpaer {
  position: relative;
}

.qoute-wraper svg {
  width: 25px;
  height: 25px;
  position: absolute;
  right: 1%;
  top: -5%;
}

.qoute-wraper-end svg {
  width: 25px;
  height: 25px;
  transform: rotate(180deg);
  position: absolute;
  left: 1%;
  bottom: -5%;
}

.info-cont {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
}

.info-item {
  display: flex;
  flex-flow: column;

  padding: 0.5rem;
  width: 100%;
}

.info-item-header {
  width: 100%;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  align-content: center;
  justify-content: flex-start;
  margin: 0.5rem 0;
}

.info-item-body {
  margin: 0 auto;
  max-width: 400px;
}

.info-item-body p {
  padding: 5px;
}

.info-icon {
  width: 30px;
  height: 30px;
  margin: 0 27% 0 10px;
}

.info-icon svg {
  fill: #fb2095;
}

.info-title {
  border-bottom: 2px dashed var(--main-link-active);
}

.secondary {
}

.secondary h2 {
  margin: 0 0.5rem 1rem 0.5rem;
}

.related-cont {
  width: 100%;
  display: flex;
  flex-flow: row nowrap;

  overflow-x: scroll;
  padding: 15px;
  margin: 0;
  flex-grow: 0;
}

.related-item {
  display: flex;
  flex-flow: column;
  align-items: center;
  align-content: center;
  justify-content: flex-start;
  max-width: 330px;
  box-shadow: var(--shadow-two);
  border-radius: 20px;
  margin: 1rem;
  text-decoration: none;
  color: initial;
  flex-shrink: 0;
}

.related-item img {
  border-radius: 20px 20px 0 0;
  max-height: 220px;
}

.related-text-box {
  display: flex;
  flex-flow: column;
  align-items: center;
  align-content: center;
  justify-content: center;
  padding: 0.3rem;
  text-align: center;
}

.related-news-cont {
  width: 100%;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-evenly;
  padding: 15px;
  margin: 0 0 2rem 0;
}

.related-news-item {
  display: flex;
  flex-flow: column;
  align-items: center;
  align-content: center;
  justify-content: center;
  box-shadow: var(--shadow-two);
  border-radius: 20px;
  margin: 1rem;
  text-decoration: none;
  color: initial;
  flex-shrink: 0;
  width: 320px;
}

.related-news-item img {
  border-radius: 20px 20px 0 0;
  width: 100%;
}

@media screen and (min-width: 450px) {
  .carousel-media {
    height: 310px;
  }
  .carousel-item img {
    max-height: 240px;
  }

  .video {
    max-height: 240px;
  }

  .carousel-item {
    height: 280px;
  }
}

@media screen and (min-width: 768px) {
  html {
    font-size: 110%;
  }

  .carousel-media {
    height: 430px;
  }
  .carousel-item img {
    max-height: 460px;
  }

  .video {
    max-height: 460px;
  }
  .carousel-item {
    height: 400px;
  }

  .center img {
    width: auto !important;
    height: 100% !important;
    max-height: 500px !important;
  }

  .carousel-control {
    height: 2.4rem;
    width: 2.4rem;
  }

  .carousel-control svg {
    width: 1.4rem;
    height: 1.4rem;
  }

  .connected-cont-group {
    text-align: right;
  }

  .info-item {
    display: flex;
    flex-flow: column;

    width: calc(50% - 1rem);
    /*min-width: 300px;*/
    margin: 0 0.5rem;
  }

  .info-icon {
    margin: 0 20% 0 10px;
  }

  .groups-ul {
    align-items: flex-start;
    align-content: flex-start;
  }
}

@media screen and (min-width: 1024px) {
  html {
    font-size: 120%;
  }
  .carousel-media {
    height: 530px;
  }
  .carousel-item img {
    max-height: 460px;
  }
  .video {
    max-height: 460px;
  }
  .carousel-item {
    height: 500px;
  }
  .carousel-control {
    height: 2.7rem;
    width: 2.7rem;
  }

  .carousel-control svg {
    width: 1.7rem;
    height: 1.7rem;
  }
  section h2,
  h4,
  p {
    padding: 0.2rem;
  }

  .custom-page-wraper {
    max-width: 800px;
  }

  .side-bar-cont {
    position: relative;
  }

  .side-bar {
    width: 160px;
    margin: 0 8px 0 40px;
    border: 1px solid var(--main-link-active);
    border-radius: 20px;
    position: sticky;
    top: 160px;
    left: 10px;
    margin-top: 40px;
    display: flex;
    flex-flow: column;
    align-items: center;
    align-content: center;
  }

  .order-button {
    width: 140px;
    height: 46px;
    font-size: 0.85rem;
    border: 1px solid #fb2095;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    margin: 30px 0 20px 0;
    border-radius: 30px;
    color: #fb2095;
    cursor: pointer;
    text-decoration: none;
  }

  .order-button:hover {
    background: #fb2095;
    color: #ffffff;
  }

  .share-cont {
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    align-content: center;
    justify-content: space-around;
  }

  .share-title-cont {
    width: 100%;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    align-content: center;
    justify-content: center;
  }

  .share-title-cont h4 {
    direction: ltr;
    border-bottom: 3px solid #fb2095;
    padding: 0 5px;
    margin: 8px 0;
    text-transform: uppercase;
  }

  .hurt {
    color: #fb2095;
  }

  .social-button {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    box-shadow: var(--shadow-two);
    overflow: hidden;
    padding: 3.5px;
    cursor: pointer;
  }

  .content-table {
    margin: 30px 0;
    width: 100%;
    display: flex;
    flex-flow: column;
    align-items: center;
    align-content: center;
    justify-content: center;
  }

  .content-table h4 {
    padding: 0 5px;
    border-bottom: 3px solid #fb2095;
  }

  .content-table ol {
    margin: 2px 0;
    list-style-position: inside;
    padding: 5px;
  }

  .content-table ol li {
    font-size: 0.85rem;
    overflow: hidden;
  }

  .content-table ol li a {
    text-decoration: none;
    color: inherit;
  }

  .content-table ol li a:hover {
    color: var(--main-link-active);
  }

  .content-table ol li a:active {
    color: var(--main-link-active);
  }

  .reviews {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-evenly;
    align-items: flex-start;
    align-content: flex-start;
    width: 100%;
  }

  .review-cont {
    max-width: 430px;
    margin: 2.5rem;
  }

  .info-icon {
    margin: 0 27% 0 10px;
  }
}

@media screen and (min-width: 1200px) {
  html {
    font-size: 130%;
  }
  .carousel-media {
    height: 610px;
  }
  .carousel-item img {
    max-height: 540px;
  }
  .video {
    max-height: 540px;
  }
  .carousel-item {
    height: 570px;
  }
  .custom-page-wraper {
    width: 95%;
    max-width: 1300px;
  }

  .center img {
    max-height: 600px !important;
  }

  .side-bar {
    width: 180px;
    margin: 0 8px 0 40px;
  }

  .order-button {
    width: 160px;
  }

  .info-icon {
    margin: 0 30% 0 10px;
  }
}

@media screen and (min-width: 1300px) {
  .custom-page-wraper {
    width: 95%;
    max-width: 1400px;
  }

  .info-icon {
    margin: 0 35% 0 10px;
  }
  .side-bar {
    width: 190px;
    margin: 0 8px 0 30px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1280px) and (orientation: landscape) {
  .side-bar {
    top: 50px;
  }

  .custom-page-wraper {
    width: 95%;
    max-width: 1050px;
  }

  .carousel-media {
    height: 430px;
  }

  .carousel-item img {
    max-height: 410px;
  }
  .video {
    max-height: 410px;
  }
  .carousel-item {
    height: 350px;
  }
}
