@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');

:root {
	--bs-body-font-family: "Jost", sans-serif;
	--bs-body-color: #13173c;
	--bs-body-color-rgb: 57, 57, 57;
	--bs-primary-rgb: 19, 23, 60;
	--bs-primary-bg-subtle: #21275e;
	--bs-primary-text-emphasis: #21275e;
	--bs-info-rgb: 134, 188, 217;
	--bs-danger-rgb: 122, 28, 28;
	--bs-secondary-rgb: 157, 157, 157;
	--bs-secondary-bg-subtle: #706F6F;
	--bs-warning-bg-subtle: #f3e7c8;
	--bs-warning-rgb: 233, 207, 143;
	--bs-success-rgb: 27, 94, 32;
	--bs-border-color: #d0d0d0;
	--bs-light-rgb: 235, 235, 235;
	--bs-dark-rgb: 57, 57, 57;
	--bs-border-radius-xxl: 1.5rem;
	--c1: #13173c;
	--c2: #f3efe0;
	--c3: #f8ba43;
	--c4: #21275e;
	--c5: #6c8fe5;
}

strong {
	font-weight: 600;
}

::selection {
	background: #2f2a2a;
	color: #fff;
}


/* ------ header ------ */
#header {
	position: absolute;
	top: 22px;
	width: 100%;
	z-index: 2;
}

#header.v2 {
	margin-bottom: 2.5rem;
	position: relative;
}

#logo {
	position: relative;
	width: 170px;
}

#logo {
	fill: #fff;
}

.gradient {
	background: linear-gradient(0deg, rgba(19, 23, 60, 0) 0%, rgba(19, 23, 60, .8) 90%);
	height: 230px;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

@media (max-width:1200px) {
	#logo {
		width: 140px
	}
}

@media (max-width:992px) {
	.gradient {
		display: none
	}

	#header {
		position: relative;
		top: 0;
	}

	#header.v2 {
		margin-bottom: 0
	}
}

@media (max-width:768px) {
	#logo {
		width: 110px
	}
}

@media (max-width:576px) {
	#logo {
		width: 90px
	}
}


/* ------ nav ------ */
#navbarNav .nav-link {
	--bs-navbar-nav-link-padding-x: 1.1rem;
	border-radius: .8rem !important;
	font-size: 1.16rem;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
}

#navbarNav .navbar-nav .nav-link.active,
#navbarNav .navbar-nav .nav-link.show {
	color: #e9cf8f;
	text-decoration: underline;
	text-underline-offset: 10px;
	text-decoration-thickness: 1px;
}

.navbar-dark,
.navbar[data-bs-theme="dark"] {
	--bs-navbar-color: rgba(255, 255, 255, 1);
	--bs-navbar-hover-color: #e9cf8f;
}

.confiteria {
	border: 1px solid #e9cf8f;
	border-bottom-width: 4px;
	backdrop-filter: blur(4px);
}

.search {
	backdrop-filter: blur(4px);
	background-color: rgb(252, 241, 214);
	border: 1px solid #ccc1a4;
	border-bottom-width: 4px;
	color: #21275e;
	padding-left: .9rem !important;
	padding-right: .9rem !important;
	text-align: center;
}

.search:hover,
.search:focus {
	color: #a28853;
}

.cartBtn {
	color: var(--c3);
	font-size: 1.3rem;
	margin-left: .4rem;
	padding: .5rem .8rem .4rem .8rem !important;
	position: relative;
	text-align: center;
	top: 5px;
}

.cartBtn:hover,
.cartBtn:focus {
	color: #b1b9ff;
}

.cartBtn span {
	background-color: rgba(33, 39, 94, .85);
	border: 2px solid var(--c3);
	border-radius: .4rem;
	color: var(--c3);
	font-size: .7rem;
	font-weight: 600;
	left: 23px;
	padding: .06rem .4rem;
	position: absolute;
	top: 0;
}

.navbar-dark,
.navbar[data-bs-theme="dark"] {
	--bs-navbar-toggler-border-color: rgba(255, 255, 255, 0.6);
}

[data-bs-theme="dark"] .navbar-toggler-icon {
	--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.95%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.navbar-toggler:focus {
	box-shadow: 0 0 0 4px rgba(255, 255, 255, .2);
}

@media (max-width:1400px) {
	#navbarNav .nav-link {
		font-size: 1.12rem
	}
}

@media (max-width:1200px) {
	#navbarNav .nav-link {
		--bs-navbar-nav-link-padding-x: .95rem;
		letter-spacing: .5px;
	}

	#navbarNav .navbar-nav .nav-link.active,
	#navbarNav .navbar-nav .nav-link.show {
		text-underline-offset: 5px;

	}
}

@media (max-width:992px) {
	.search {
		background-color: transparent;
		border: 1px solid #a6ace8;
		color: #a6ace8;
	}

	.search:hover,
	.search:focus {
		color: #ccc1a4;
	}
}


/* ------ mainbanner ------ */
#mainBanner .carousel-inner {
	border-radius: 0 0 3rem 3rem;
}

.bannerImg {
	height: 80svh;
}

#noBanner {
	height: 160px;
}

@media (max-width:1400px) {
	.bannerImg {
		height: auto
	}
}

@media (max-width:1200px) {
	#noBanner {
		height: 102px;
	}
}

@media (max-width:992px) {
	#noBanner {
		height: 0;
	}
}

@media (max-width:768px) {
	#mainBanner .carousel-inner {
		border-radius: 0 0 2rem 2rem;
	}
}


/* ------ btn ------ */
.btn {
	border-radius: 0;
	font-size: 1.1rem;
	font-weight: 500;
	padding: .5rem 1.2rem;
	text-transform: uppercase;
}

.btn-sm {
	padding: .35rem .7rem;
}

.btn-primary {
	--bs-btn-bg: var(--c4);
	--bs-btn-border-color: var(--c4);
	--bs-btn-hover-bg: var(--c1);
	--bs-btn-hover-border-color: var(--c1);
	--bs-btn-active-bg: var(--c1);
	--bs-btn-active-border-color: var(--c1);
}

.btn-secondary {
	--bs-btn-bg: #706F6F;
	--bs-btn-border-color: #706F6F;
	--bs-btn-hover-bg: #5e5d5d;
	--bs-btn-hover-border-color: #5e5d5d;
	--bs-btn-active-bg: #5e5d5d;
	--bs-btn-active-border-color: #5e5d5d;
}

.btn-outline-secondary {
	--bs-btn-bg: #fff;
	--bs-btn-color: #9d9d9d;
	--bs-btn-border-color: #c2c2c2;
	--bs-btn-hover-bg: #9d9d9d;
	--bs-btn-hover-border-color: #9d9d9d;
	--bs-btn-active-bg: #9d9d9d;
	--bs-btn-active-border-color: #9d9d9d;
	--bs-btn-disabled-color: #9d9d9d;
	--bs-btn-disabled-border-color: #9d9d9d;
}

.btn-outline-info {
	backdrop-filter: blur(7px);
	--bs-btn-color: #c1c6f8;
	--bs-btn-border-color: #c1c6f8;
	--bs-btn-hover-bg: #c1c6f8;
	--bs-btn-hover-border-color: #c1c6f8;
	--bs-btn-active-bg: #c1c6f8;
	--bs-btn-active-border-color: #c1c6f8;
	--bs-btn-disabled-color: #c1c6f8;
	--bs-btn-disabled-border-color: #c1c6f8;
}

.btn-outline-primary {
	--bs-btn-color: var(--c4);
	--bs-btn-border-color: var(--c4);
	--bs-btn-hover-bg: var(--c4);
	--bs-btn-hover-border-color: var(--c4);
	--bs-btn-active-bg: var(--c4);
	--bs-btn-active-border-color: var(--c4);
	--bs-btn-disabled-color: var(--c4);
	--bs-btn-disabled-border-color: var(--c4);
	border-bottom-width: 4px;
}

.btn-outline-primary.v2 {
	border-bottom-width: 1px;
}

.btn-dark {
	--bs-btn-bg: var(--c3);
	--bs-btn-border-color: var(--c3);
	--bs-btn-hover-bg: #292c42;
	--bs-btn-hover-border-color: #292c42;
}

.btn-light {
	--bs-btn-color: var(--c1);
	--bs-btn-hover-color: var(--c1);
	--bs-btn-hover-bg: var(--c3);
	--bs-btn-hover-border-color: var(--c3);
	--bs-btn-active-bg: var(--c3);
	--bs-btn-active-border-color: var(--c3);
	--bs-btn-hover-color: #fff;
	--bs-btn-active-color: #fff;
}

.btn-outline-light {
	--bs-btn-hover-color: #706F6F;
	--bs-btn-active-color: #706F6F;
}

.btn-warning {
	--bs-btn-bg: #e9cf8f;
	--bs-btn-color: #21275e;
	--bs-btn-border-color: #e9cf8f;
	--bs-btn-hover-bg: var(--c3);
	--bs-btn-hover-border-color: var(--c3);
	--bs-btn-active-bg: var(--c3);
	--bs-btn-active-border-color: var(--c3);
	--bs-btn-hover-color: #21275e;
	--bs-btn-disabled-bg: #e9cf8f;
	--bs-btn-disabled-border-color: #e9cf8f;
	--bs-btn-disabled-color: #21275e;
}

.btn-outline-warning {
	backdrop-filter: blur(7px);
	--bs-btn-color: #e9cf8f;
	--bs-btn-border-color: #e9cf8f;
	--bs-btn-hover-bg: transparent;
	--bs-btn-hover-border-color: var(--c3);
	--bs-btn-active-bg: var(--c3);
	--bs-btn-active-border-color: var(--c3);
	--bs-btn-disabled-color: var(--c3);
	--bs-btn-disabled-border-color: var(--c3);
	--bs-btn-hover-color: var(--c3);
}

.btn-outline-warning.v2 {
	border-bottom-width: 4px;
}

.btn-warning2 {
	background-image: linear-gradient(to right, #ebddb5, #e2ce99, #e2ce99, #ebddb5, #f5e9c8);
	background-size: 300% 100%;
	border: 1px solid #d8c48e;
	border-radius: .8rem;
	box-shadow: 0 4px #cfbc87;
	color: var(--c4);
	display: block;
	font-size: 1.1rem;
	font-weight: 600;
	letter-spacing: .5px;
	line-height: 1.3;
	padding: .6rem 1.2rem;
	position: relative;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	transition: all 0.4s ease;
}

.btn-warning2:hover {
	background-position: 100% 0;
	border-bottom-width: 1px;
}

.btn-warning2:active {
	box-shadow: 0 2px #c4b282;
	transform: translateY(4px);
}

.or {
	font-size: 1.15rem;
	margin-bottom: 17px;
	position: relative;
	text-align: center;
}

.or:before {
	background-color: #cbc9b7;
	content: "";
	height: 1px;
	left: 0;
	position: absolute;
	top: 14px;
	width: 100%;
}

.or span {
	background-color: #f4f2e0;
	padding: 0 10px;
	position: relative;
	z-index: 10;
}


/* ------ misc ------ */
.lastP p:last-of-type {
	margin-bottom: 0;
}

.textBalance {
	text-wrap: balance;
}

.whites-nw {
	white-space: nowrap;
}

.numberBadge {
	position: relative;
	top: 1px;
}

.bgTexture {
	background-attachment: fixed;
	background-image: url(../img/texture.png);
}

.bgTexture.v2 {
	background-attachment: initial;
	background-size: 290%;
}

.fs-5a {
	font-size: 1.15rem;
}

.fs-5b {
	font-size: 1.12rem;
}

.fs-5c {
	font-size: 1.09rem;
}

.text-beige {
	color: #a89e89;
}

.text-beige2 {
	color: #a2873e;
}

.sArrow {
	margin-top: 6px;
}

.embed-container {
	height: 0;
	max-width: 100%;
	overflow: hidden;
	position: relative;
	padding-bottom: 56.25%;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
	height: 100%;
	left: 0;
	top: 0;
	position: absolute;
	width: 100%;
}

.embed-container.map {
	padding-bottom: 82%;
}

.embed-container.kubrick {
	padding-bottom: 70%;
}

.link-primary {
	color: var(--c4) !important;
}

.link-primary:focus,
.link-primary:hover {
	color: #5f5f5f !important;
	text-decoration-color: #5f5f5f !important;
}

.link-light {
	color: #fff !important;
	text-decoration: none;
}

.link-light:hover {
	color: #f1d1a9 !important;
}

.link-light.v2:hover {
	color: #356c88 !important;
}

.ls0 {
	letter-spacing: .5px;
}

.ls1 {
	letter-spacing: 1px;
}

.rounded-6 {
	border-radius: 3rem;
}

.bg-warning-subtle2 {
	/* background-color: #f4f2e0; */
	/* -webkit-mask-image: linear-gradient(160deg, rgba(0,0,0,1) 65%, rgba(0,0,0,0.4)), linear-gradient(rgba(0,0,0,1), rgba(0,0,0,.4)); */
}

.bg-warning-subtle2::after {
	background-color: #f4f2e0;
	border-radius: 0 0 1.5rem 1.5rem;
	-webkit-mask-image: linear-gradient(160deg, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0.4)), linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, .4));
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
}

.bg-warning-subtle3 {
	background-color: #f4f2e0;
}

.bg-warning-subtle4 {
	background-color: #fcf1d6;
}

.bg-warning-subtle5 {
	background-color: #f4f2e01c;
	backdrop-filter: blur(3px);
}

.bg-warning-subtle6 {
	background-color: #faf8e8;
}

.text-warning2 {
	color: #f7dea1;
}

.text-warning3 {
	color: #f4f2e0;
}

.popcorn2 {
	height: 50px;
	position: relative;
	left: 4px;
	top: -2px;
}

.daySelect {
	width: auto
}

@media (max-width:1400px) {
	.fs-1 {
		font-size: 1.9rem !important
	}

	.fs-2 {
		font-size: 1.7rem !important
	}

	.fs-4 {
		font-size: 1.3rem !important
	}

	.fs-5b {
		font-size: 1.07rem
	}
}

@media (min-width: 1200px) {
	.fs-4b {
		font-size: 1.35rem !important
	}
}

@media (max-width:992px) {
	.bg-warning-subtle2::after {
		-webkit-mask-image: linear-gradient(120deg, rgba(0, 0, 0, 1) 65%, rgba(0, 0, 0, 0.7)), linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, .2));
	}

	.popcorn2 {
		height: 40px;
		top: -1px;
	}

	.daySelect {
		width: 100%
	}
}

@media (max-width:576px) {
	.bgTexture {
		background-size: 320%
	}

	.social {
		font-size: 1.8rem !important
	}

	.fs-5a {
		font-size: 1.2rem
	}

	.embed-container.map {
		padding-bottom: 108%
	}

	.embed-container.kubrick {
		padding-bottom: 105%
	}
}


/* ------ form ------ */
.form-label {
	font-weight: 500;
	letter-spacing: .2px;
	margin-bottom: .3rem;
}

.form-control {
	font-size: 1.1rem;
	padding: .4rem .75rem;
}

.form-control.fc {
	background-color: transparent;
	border-color: var(--c4);
	border-radius: .8rem !important;
	border-width: 2px;
	padding: .6rem .75rem;
}

.form-control:focus {
	border-color: var(--c1);
	box-shadow: 0 0 0 .25rem rgba(0, 33, 71, .17);
}

.form-select {
	background-color: var(--c2);
	border-color: var(--c4);
	border-radius: .8rem !important;
	color: var(--c4);
	font-size: 1.05rem;
	font-weight: 500;
	padding: .5rem 2.25rem .5rem .75rem;
}

.form-select.fc {
	background-color: var(--c2);
	border-color: var(--c4);
	border-radius: .8rem !important;
	border-width: 2px;
	padding: .6rem 2.25rem 0.6rem .75rem;
}

.form-select:focus {
	border-color: #a28853;
	box-shadow: 0 0 0 .25rem rgba(162, 136, 83, .3);
}

.form-control:disabled {
	background-color: #e4e2d2;
}

.form-check-input {
	border-color: var(--c4);
}

.form-check-input:checked {
	background-color: var(--c4);
	border-color: var(--c4)
}

.form-check-input:focus {
	border-color: var(--c4);
	box-shadow: 0 0 0 .25rem rgba(33, 39, 94, .25);
}

[data-bs-theme="dark"] .form-check-input {
	border-color: var(--c2);
}

[data-bs-theme="dark"] .form-check-input:checked {
	border-color: #e9cf8f;
}

[data-bs-theme="dark"] .form-select {
	background-color: #13173c;
	border-color: #f7dea1;
	color: #f3edde;
}


/* ------ movies ------ */
.btn-sm {
	font-size: .95rem;
	padding: .5rem .7rem;
}

.wrapMovie,
.movieItem {
	display: block;
	height: 100%;
	position: relative;
}

.wrapMovie img {
	aspect-ratio: 274 / 396;
}

.movieItem.v2 {
	border: 2px solid rgba(214, 220, 252, .4);
	border-radius: .4rem;
}

.movieItem::before {
	background-color: rgba(10, 10, 10, 0);
	border-radius: .5rem;
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	transition: all 0.3s ease;
	width: 100%;
}

.wrapMovie:hover .movieItem::before {
	background-color: rgba(10, 10, 10, .6);
}

.movieItem .title {
	color: #fff;
	display: flex;
	height: calc(100% - 106px);
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	transition: all 0.3s ease;
	width: 100%;
	z-index: 1;
}

.wrapMovie:hover .title {
	opacity: 1;
}

.wrapMovie .trailer {
	bottom: 66px;
	border-radius: .5rem;
	font-weight: 600;
	left: 50%;
	opacity: 0;
	position: absolute;
	transform: translateX(-50%);
	transition: all 0.3s ease;
	width: 90%;
}

.wrapMovie:hover .trailer {
	opacity: 1;
}

.movieItem .buy {
	bottom: 14px;
	border-radius: .5rem;
	font-weight: 600;
	left: 50%;
	opacity: 0;
	position: absolute;
	transform: translateX(-50%);
	transition: all 0.3s ease;
	width: 90%;
}

.wrapMovie:hover .buy {
	opacity: 1;
}

.movieItem .public {
	background-color: rgba(10, 10, 10, .4);
	backdrop-filter: blur(5px);
	border: 1px solid rgba(252, 241, 214, .7);
	border-radius: 4px;
	color: #fcf1d6;
	font-size: .82rem;
	font-weight: 500;
	left: 10px;
	padding: 2px 6px;
	position: absolute;
	text-transform: uppercase;
	top: 10px;
	z-index: 1;
}

.detailTitle {
	background-color: #222651;
	background-size: cover;
	background-position: center top;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, .2);
	margin-bottom: .8rem;
	padding: 8rem 0;
	position: relative;
}

.detailTitle::after {
	background-color: rgba(19, 23, 60, .25);
	border-radius: 1.5rem 1.5rem 0 0;
	content: "";
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.detailTitle::before {
	background-color: rgba(19, 23, 60, .4);
	backdrop-filter: blur(5px);
	border-radius: 1.5rem 1.5rem 0 0;
	content: "";
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	-webkit-mask: linear-gradient(-90deg, transparent, #13173c 75%);
}

.fancybox__container {
	--fancybox-bg: rgba(19, 23, 60, .7);
}

.buyCol::before {
	background-color: #deddcf;
	content: "";
	height: 100%;
	left: 16px;
	position: absolute;
	top: 0;
	width: 1px;
}

.genres {
	font-size: 1.1rem;
}

@media (max-width:1400px) {
	.detailTitle {
		padding: 6rem 0
	}

	.movieInfoCol {
		padding-left: 24.4%
	}
}

@media (max-width:1200px) {
	.movieInfoCol {
		padding-left: 15.7%
	}

	.movieGroup2 .col:nth-child(5) {
		display: none
	}
}

@media (max-width:992px) {
	.movieInfoCol {
		padding-left: 26.6%
	}

	.buyCol {
		padding-bottom: 2.4rem;
	}

	.buyCol::before {
		background-color: #13173c;
		bottom: 0;
		height: .6rem;
		left: -1rem;
		top: initial;
		width: calc(100% + 2rem);
	}

	.movieGroup2 .col:nth-child(4) {
		display: none
	}
}

@media (max-width:768px) {

	.movieItem .title,
	.wrapMovie .trailer,
	.movieItem .buy,
	.movieItem::before {
		display: none
	}

	.detailTitle::before {
		backdrop-filter: blur(1px);
		-webkit-mask: linear-gradient(-90deg, transparent, #13173c 40%);
	}

	.movieGroup2 .col:nth-child(4) {
		display: block
	}
}

@media (max-width:576px) {
	.detailTitle {
		padding: 2.8rem 0
	}

	.detailTitle::before {
		-webkit-mask: linear-gradient(-90deg, transparent, #13173c 50%);
	}

	.movieInfoCol {
		padding-left: calc(var(--bs-gutter-x) * .5)
	}

	.genres {
		font-weight: 300
	}
}


/* ------ tabs ------ */
.nav-tabs {
	--bs-nav-tabs-link-active-bg: #fcf1d6;
	--bs-nav-tabs-link-active-color: #21275e !important;
	--bs-nav-tabs-border-radius: 1rem;
}

.nav-tabs .nav-link {
	border: none;
	color: #ae9f81;
	font-weight: 600;
	letter-spacing: 1px;
	position: relative;
	text-transform: uppercase;
	top: -1px;
	white-space: nowrap;
}

.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
	/* isolation: initial; */
}

.nav-tabs .nav-link.active {
	isolation: initial;
	top: 0;
}

#billboardTabs {
	background-color: #fcf1d6;
	border-radius: 0 0 1.5rem 1.5rem;
}

@media (max-width:600px) {
	.mainTabs {
		flex-wrap: nowrap;
		overflow-x: scroll;
		overflow-y: hidden;
	}

	::-webkit-scrollbar {
		display: none
	}

	.nav-tabs .nav-link {
		background-color: rgba(24, 29, 77, .65);
		letter-spacing: 0;
		text-transform: initial;
	}

	.nav-tabs .nav-item:nth-child(1) .nav-link {
		border-top-left-radius: 0
	}

	.nav-tabs .nav-item:nth-child(3) .nav-link {
		border-top-right-radius: 0
	}
}


/* ------ carousel ------ */
.carousel-indicators [data-bs-target] {
	height: 5px;
}


/* ------ banners ------ */
.banners h4 {
	background: linear-gradient(0deg, rgba(19, 23, 60, .92) 0%, rgba(19, 23, 60, 0) 90%);
	border-radius: 0 0 1rem 1rem;
	bottom: 0;
	left: 0;
	margin-bottom: 0;
	padding-top: 10rem !important;
	position: absolute;
	width: 100%;
}


/* ------ modal ------ */
.modal {
	--bs-modal-border-width: 3px;
}

.modal-title {
	color: #fcf1d6;
}

@media (min-width: 1200px) {
	#modalResponsive.modal-dialog {
		max-width: 900px;
		/* tamaño lg */
	}
}

@media (min-width: 1400px) {
	#modalResponsive.modal-dialog {
		max-width: 1140px;
		/* tamaño xl */
	}
}


/* ------ banner3 ------ */
.banner3 {
	background-color: rgba(24, 29, 77, .5);
	backdrop-filter: blur(3px);
}

.banner4 {
	background-color: rgba(46, 55, 136, .5);
	backdrop-filter: blur(3px);
}

.banner5 {
	background-color: rgba(46, 55, 136, .6);
	backdrop-filter: blur(3px);
	border: 2px solid rgba(233, 208, 143, .7);
}

.banner6 {
	background-color: rgba(46, 55, 136, .5);
}

@media (max-width:992px) {
	.banner4 {
		backdrop-filter: initial
	}
}


/* ------ btTop ------ */
.btTop {
	background-color: rgba(255, 255, 255, .8);
	box-shadow: 0 0 0 1px rgba(0, 33, 71, .5);
	border-radius: .35rem;
	border: none;
	bottom: 18px;
	display: none;
	font-size: 1rem;
	height: 36px;
	margin: 0;
	outline: none;
	padding: 0;
	position: fixed;
	right: 18px;
	text-align: center;
	width: 36px;
	z-index: 1040;
}

.btTop:hover {
	box-shadow: 0 0 0 1px var(--c1);
}

.btTop path {
	fill: var(--c1);
}

.btTop:hover path {
	fill: var(--c1);
}


/* ------ confectionery ------ */
.wrapConfect {
	top: 24px;
}

.buyConfect {
	width: 320px;
}

.lineProduct {
	border-bottom: 1px solid rgba(255, 255, 255, .2);
}

.lineProduct.pad {
	padding-bottom: .6rem;
	padding-top: .6rem;
}

.confecBg {
	background-image: url(../img/confecBg.png);
	background-position: center;
	background-size: cover;
}

@media (max-width: 1649px) {
	#combos.row-cols-xxl-4>* {
		width: 33.33333333%
	}
}

@media (min-width: 1650px) {
	#combos.row-cols-xxl-4>* {
		width: 25%
	}
}

@media (max-width:1400px) {
	.buyConfect {
		width: 300px
	}
}

@media (max-width:1200px) {
	#combos.row-cols-xxl-4>* {
		width: 50%
	}
}

@media (max-width:992px) {
	.buyConfect {
		width: initial
	}

	#payBtn {
		background-color: rgba(19, 23, 60, .9);
		bottom: 0;
		left: 0;
		padding: 1rem;
		position: fixed;
		width: 100%;
		z-index: 10000;
	}
}

@media (max-width:576px) {
	#combos.row-cols-xxl-4>* {
		width: 100%
	}
}


/* ------ choose ticket ------ */
.wrapSteps {
	/* background-color: rgba(32, 37, 85, .8); */
	background-color: rgba(46, 55, 136, .5);
	user-select: none;
}

.wrapSteps p {
	color: rgba(173, 172, 166, 0.6);
	font-weight: 500;
}

.wrapSteps .active {
	/* background-color: #f4f2e0; */
}

.wrapSteps .active p {
	color: #e9cf8f;
	font-weight: 600;
}

.wrapSteps .active p .tTxt {
	border-bottom: 1px solid #e9cf8f;
	display: inline-block;
	padding-bottom: 1px;
}

.wrapSteps .col:first-of-type.active {
	border-bottom-left-radius: 1.5rem;
	border-top-left-radius: 1.5rem;
}

.wrapSteps .col:last-of-type.active {
	border-bottom-right-radius: 1.5rem;
	border-top-right-radius: 1.5rem;
}

.wrapTicket {
	width: 460px
}

.pWidth {
	width: 116px
}

.pNumber {
	width: 120px
}

@media (max-width:992px) {
	.wrapTicket {
		width: auto
	}
}

@media (max-width:576px) {
	.wrapSteps p {
		font-size: .85rem !important
	}

	.wrapSteps p .tNum {
		display: block
	}

	.pWidth {
		width: auto
	}

	.pNumber {
		width: auto
	}

	.btn-rwd {
		width: 100%
	}
}


/* ------ seats ------ */
.wrapSeats {
	overflow-x: auto;
	overflow-y: hidden;

	padding-bottom: 20px;
	position: relative;
	width: 100%;

	-webkit-overflow-scrolling: touch;
	/* Habilita el scroll táctil suave */
	scrollbar-width: thin;
	/* Firefox: hace que la barra de desplazamiento sea más visible */
	scrollbar-color: rgba(20, 20, 20, .4) rgba(0, 0, 0, .1);
	/* Firefox: color de la barra de desplazamiento */
}

.wrapSeats::-webkit-scrollbar {
	height: 6px;
	/* Tamaño de la barra de desplazamiento */
}

.wrapSeats::-webkit-scrollbar-thumb {
	background-color: rgba(20, 20, 20, .4);
	/* Color de la "raya" del scroll */
	border-radius: 10px;
	/* Redondear la barra de desplazamiento */
}

.wrapSeats::-webkit-scrollbar-track {
	background: rgba(20, 20, 20, .1);
	/* Fondo de la pista del scroll */
}

.remainingTime {
	border: 2px solid var(--c3);
	padding: 10px 14px;
	position: absolute;
	right: 20px;
	top: 20px;
	z-index: 10;
}

.remainingTime p {
	font-size: .8rem;
}

.remainingTime.out {
	color: var(--c3);
	padding: 10px 44px;
	position: relative;
	right: -7px;
	top: -18px;
	width: auto;
}

.wrapSeats .wrapScreen {
	perspective: 600px;
}

.wrapSeats .screen {
	background-position: center;
	background-size: cover;
	height: 110px;
	margin: -1.25rem auto auto;
	transform: rotateX(-65deg);
	width: 66%;
}

.wrapSeats.v2 .screen {
	width: 38%;
}

.wrapSeats .screen::after {
	background-color: #13173c;
	content: "";
	height: 100%;
	left: 0;
	opacity: .5;
	position: absolute;
	top: 0;
	width: 100%;
}

.screenTxt {
	color: var(--c4);
	letter-spacing: 1px;
	margin-top: -26px;
	position: relative;
}

.wrapSeats .seat {
	background-color: #f4f2e0;
	border: 1px solid var(--c4);
	border-radius: .5rem;
	box-shadow: 0 0 0 4px rgba(244, 242, 224, .9);
	cursor: pointer;
	display: block;
	font-size: .8rem;
	font-weight: 500;
	padding: .219rem .2rem;
	text-align: center;
	user-select: none;
	width: 28.2px;
}

.wrapSeats .seat:hover {
	background-color: #fffdec;
	box-shadow: inset 0 0 0 1px rgb(33, 39, 94, .95),
		0 0 0 4px rgba(244, 242, 224, .9);
}

.wrapSeats .seat.wheel:hover {
	/* background-color: rgba(108,143,229,.1); */
	box-shadow: inset 0 0 0 2px rgba(108, 142, 229, .95),
		0 0 0 4px rgba(244, 242, 224, .9);
}

.wrapSeats .seat.invisible {
	visibility: hidden;
}

.wrapSeats .seat.half {
	width: 12px;
}

.wrapSeats .seat.leftMargin {
	left: -32px;
	position: relative;
}

.wrapSeats .seat.leftMargin.fst {
	margin-left: 8px;
}

.wrapSeats .seat.leftMargin.lst {
	margin-right: 8px;
}

.wrapSeats .seat.rightMargin {
	right: -23px;
	position: relative;
}

.wrapSeats .seat.selected,
.status.st1 {
	background-color: var(--c4);
	color: #fff;
}

.wrapSeats .seat.wheel.selected {
	background-color: var(--c5);
	color: #fff;
}

.wrapSeats .seat.wheel.selected em {
	position: relative;
	z-index: 1;
}

.wrapSeats .seat.occupied,
.status.st2 {
	background-color: #e3d6ab;
	border: 1px solid #b9a36d;
	color: #817248;
	cursor: default;
	pointer-events: none;
}

/* .locationOpt .seat.occupied {
	filter: contrast(.82);
	mix-blend-mode: luminosity;
} */
.wrapSeats .seat.blocked,
.status.st4 {
	background-color: #d9d9d0;
	border-color: #8a8c9f;
	color: #8a8c9f;
	cursor: default;
	pointer-events: none;
}

.wrapSeats .seat.wheel {
	border-color: var(--c5);
	box-shadow: inset 0 0 0 1px rgba(108, 142, 229, .95),
		0 0 0 4px rgba(244, 242, 224, .9);
	color: var(--c5);
	font-weight: 600;
}

.wrapStatus {
	color: #626262;
}

.wrapStatus.v2 {
	color: var(--c4);
}

.status {
	border-radius: 5px;
	display: inline-block;
	height: 22px;
	margin-right: 7px;
	position: relative;
	top: 5px;
	width: 22px;
}

.status.st3,
.status.st4 {
	border: 1px solid var(--c4);
}

.status.st4 i,
.status.st5 i {
	font-size: .78rem;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
}

.status.st5 {
	border: 1px solid var(--c5);
	box-shadow: inset 0 0 0 1px rgba(108, 142, 229, .8);
	color: var(--c5);
}

.status.st5+span {
	color: var(--c5);
}

.status.st6 {
	background-color: rgba(248, 185, 67, .18);
	color: #f0a417;
}

.status.st7 {
	background-color: rgba(99, 101, 117, .18);
	color: #6d7195;
}

.status.st8 {
	background-color: rgba(91, 140, 255, .18);
	color: #6590f9;
}

.status.st9 {
	background-color: rgba(185, 56, 47, .18);
	color: #d52c1f;
}

.status.main {
	background-color: #3a4399;
}

.status.little {
	background-color: #f7c668;
}

.local1 {
	color: #e1970c
}

.local2 {
	color: #7d81a6
}

.local3 {
	color: #5f8bf7
}

.local4 {
	color: #d52c1f
}

.lineLetter {
	font-size: .8rem;
	font-weight: 500;
	left: -24px;
	opacity: .45;
	position: absolute;
	text-align: center;
	text-shadow: 1px 0 0 #f4f2e0,
		0 1px 0 #f4f2e0;
	top: 4px;
	width: 22px;
}

.locationOpt .lineLetter {
	opacity: .65;
}

.lineLetter.balcon {
	left: -56px;
}

.lineLetter.right {
	left: initial;
	right: -23px;
}

.lineLetter.right.balcon {
	right: -55px;
}

.legendTxt {
	left: 50%;
	position: absolute;
	top: -29px;
	transform: translateX(-50%);
}

.balcon1 {
	right: -32px;
}

.balcon3 {
	left: -32px;
}

.wrapGuideLines .row {
	position: relative;
	z-index: 1;
}

.wrapGuideLines .row::after {
	background-color: rgba(200, 188, 157, .7);
	content: "";
	height: 1px;
	left: 0;
	position: absolute;
	top: 18px;
	width: 100%;
	z-index: -1;
}

.wrapGuideLines.big .row::after {
	top: 18px;
}

.wrapGuideLines.big.v2 .row::after {
	left: -24px;
	width: calc(100% + 48px);
}

.wrapGuideLines.big .row.guideLeft::after {
	left: -32px;
	width: calc(100% + 32px);
}

.wrapGuideLines.big .row.guideRight::after {
	right: -32px;
	width: calc(100% + 32px);
}

@media (max-width:1400px) {
	.wrapSeats {
		zoom: 94%
	}

	.wrapSeats.v2 .screen {
		width: 100%
	}
}

@media (max-width:992px) {
	.remainingTime {
		position: relative;
		right: initial;
		top: initial;
	}

	.remainingTime.out {
		padding: 8px 44px;
		right: 0;
		top: -2px;
	}
}

@media (max-width: 768px) {
	.wrapSeats .seat {
		border-width: 2px !important;
		transform: scale(.95);
		transform-origin: center center;
	}

	.wrapSeats {
		zoom: 64%;
		/* zoom: 25%; */
	}

	.wrapSeats.v2 {
		zoom: 60%;
	}

	.wrapSeats.v2 .screen {
		width: 90%;
	}

	.status {
		height: 20px;
		width: 20px;
	}

	.status.st4 i,
	.status.st5 i {
		font-size: .7rem;
	}

	.wrapStatus {
		font-size: .9rem;
		text-transform: initial !important;
	}
}

@media (max-width: 576px) {
	.wrapLocal .status {
		top: 4px;
	}

	.wrapGuideLines .row::after {
		height: 2px;
	}
}


/* ------ stairs and exits ------ */
.stairs {
	background-color: #f4f2e0;
	left: 17px;
	padding: 12px 14px 0 14px;
	position: absolute;
	top: 4px;
	width: 81px;
	z-index: 10;
}

.stairs.right {
	left: initial;
	right: 17px;
}

.stairs span {
	border-bottom: 1px solid #118a44;
	display: block;
	margin-bottom: .8rem;
}

.stairs p {
	background-color: #f4f2e0;
	color: #118a44;
	font-weight: 500;
	left: 12px;
	letter-spacing: 3px;
	position: absolute;
	text-align: center;
	top: 5px;
	transform: rotate(180deg);
	writing-mode: vertical-rl;
}

.exitDoor1 {
	left: -59px;
	position: absolute;
	top: -37px;
	z-index: 5;
}

.exitDoor2 {
	left: -27px;
	position: absolute;
	top: -32px;
	z-index: 5;
}

.exitDoor3 {
	right: -12px;
	position: absolute;
	top: -33px;
	z-index: 5;
}

.exitDoor1 svg,
.exitDoor2 svg {
	fill: #118a44;
	transform: scaleX(-1);
	width: 30px;
}

.exitDoor3 svg {
	fill: #118a44;
	width: 30px;
}

.entrance {
	border: 2px solid #118a44;
	border-left: none;
	height: 24px;
	position: absolute;
	right: -48px;
	top: -34px;
	width: 8px;
}

.entrance span {
	color: #118a44;
	font-size: .65rem;
	font-weight: 600;
	letter-spacing: 1px;
	position: absolute;
	right: 9px;
	top: 1px;
}


/* ------ location ------ */
.location1 {
	background-color: rgba(248, 185, 67, .18);
	border-radius: 0 0 .5rem .5rem;
	bottom: -14px;
	color: #f0a417;
	left: 50%;
	height: 36.5%;
	opacity: .7;
	pointer-events: none;
	position: absolute;
	transform: translateX(-50%);
	width: 100%;
}

.location2 {
	background-color: rgba(91, 140, 255, .18);
	bottom: 35.5%;
	color: #6590f9;
	left: 50%;
	height: 17%;
	opacity: .7;
	pointer-events: none;
	position: absolute;
	transform: translateX(-50%);
	width: 100%;
}

.location3 {
	background-color: rgba(99, 101, 117, .18);
	bottom: 53.2%;
	color: #6d7195;
	left: 50%;
	height: 35.2%;
	opacity: .7;
	pointer-events: none;
	position: absolute;
	transform: translateX(-50%);
	width: 100%;
}

.location4 {
	background-color: rgba(185, 56, 47, .18);
	border-radius: .5rem .5rem 0 0;
	bottom: 89%;
	color: #d52c1f;
	left: 50%;
	height: 13%;
	opacity: .7;
	pointer-events: none;
	position: absolute;
	transform: translateX(-50%);
	width: 100%;
}

@media (max-width:1200px) {

	.location1,
	.location2,
	.location3,
	.location4 {
		left: 0;
		transform: none;
	}
}


/* ------ table ------ */
.table> :not(caption)>*>* {
	background-color: transparent !important;
}

.tr2 th {
	border-bottom-width: 3px;
}


/* ------ guide ------ */
.sala,
.salita {
	border-radius: .3rem;
	display: table;
	font-weight: 500;
	margin: .35rem auto;
	text-decoration: none;
	white-space: nowrap;
}

.sala:hover,
.salita:hover {
	opacity: .9;
}

.sala span,
.salita span {
	display: block;
	padding: .1rem .5rem;
}

.sala {
	background-color: #3a4399;
	color: #fff;
}

.salita {
	background-color: #f7c668;
	color: var(--c4);
}


/* ------ mainText ------ */
.mainText p+h2,
.mainText p+h3,
.mainText ul+h2,
.mainText table+h2 {
	margin-top: 1.7rem !important;
}

.mainText p:last-of-type {
	margin-bottom: 0;
}

.mainText figure img {
	border-radius: 1rem;
	height: auto;
	width: 100%;
}

.mainText figcaption {
	font-size: .875em;
	font-style: italic;
	margin-top: .3rem;
}

.mainText .embed-container {
	margin-bottom: 1rem;
}

.mainText .embed-container+h2,
.mainText .embed-container+h3 {
	margin-top: 2rem;
}

.mainText a {
	color: var(--c4);
	font-weight: 500;
	text-decoration: underline;
}

.mainText a:hover {
	color: var(--c3);
}

.mainText ul {
	list-style: none;
	margin: 0 0 1.5rem 0;
	padding: 0 0 0 .5rem;
}

.mainText ul:last-of-type {
	margin-bottom: 0;
}

.mainText ul li {
	padding: 4px 0 4px 20px;
	position: relative;
}

.mainText ul li::before {
	content: "\f105";
	color: #7780d5;
	font: var(--fa-font-solid);
	font-size: .9rem;
	left: 0;
	position: absolute;
	top: 12px;
}

@media (max-width:768px) {
	.mainText .w-50 {
		width: 100% !important
	}
}

@media (max-width:576px) {
	.mainText.fs-5 {
		font-size: 1.15rem !important
	}
}


/* ------ timeline ------ */
.timeline {
	position: relative;
}

.timeline__progressbar {
	--width: 2px;
	--left: -moz-calc(((15vw / 2) + 15px) - (var(--width) / 2));
	--left: calc(((15vw / 2) + 15px) - (var(--width) / 2));
	position: absolute;
	left: var(--left);
	width: var(--width);
	height: 100%;
	background: linear-gradient(#f7dea1, var(--c3));
}

@media screen and (min-width: 800px) {
	.timeline__progressbar {
		--width: 3px;
		--left: -moz-calc(50% - (var(--width) / 2));
		--left: calc(50% - (var(--width) / 2));
	}
}

@media (max-width:800px) {
	.timeline__progressbar {
		left: 11px
	}
}

.timeline__block {
	align-items: start;
	display: grid;
	grid-template-columns: 15vw 1fr;
	padding-bottom: 5rem;
}

.timeline__block:last-of-type {
	padding-bottom: 0;
}

.timeline__block img {
	width: 60%;
}

.timeline__block__head {
	color: #fff;
	margin-top: -28px;
}

@media screen and (min-width: 800px) {
	.timeline__block {
		grid-template-columns: 1fr 15vh 1fr;
	}
}

@media screen and (min-width: 800px) {
	.timeline__block__head {
		grid-column: 1 / 2;
		text-align: right;
	}
}

@media (max-width:800px) {
	.timeline__block {
		grid-template-columns: 8vw 1fr
	}

	.timeline__block img {
		margin-top: .8rem;
		width: 74%
	}
}

@media (max-width:550px) {
	.timeline__block {
		grid-template-columns: 11vw 1fr
	}

	.timeline__block img {
		width: 90%
	}
}

@media (max-width:800px) {
	.timeline__block__head {
		margin-top: -22px
	}

	.timeline__block__head h1 {
		margin-bottom: 2rem !important;
	}
}

.timeline__block__body {
	grid-column: 2 / -1;
	margin-top: -28px;
}

@media screen and (min-width: 800px) {
	.timeline__block__body {
		grid-column: 3 / -1;
	}
}

.timeline__block__bullet-point {
	display: flex;
	justify-content: center;
	z-index: 1;
}

@media screen and (min-width: 800px) {
	.timeline__block__bullet-point {
		grid-column: 2 / 3;
	}
}

@media (max-width:800px) {
	.timeline__block__bullet-point {
		justify-content: start;
	}
}

.timeline__block__circle {
	border: 4px solid #f7dea1;
	background-color: #212762;
	border-radius: 50%;
	display: inline-block;
	height: 1.5rem;
	position: relative;
	width: 1.5rem;
}

@media (max-width:800px) {
	.timeline__block__circle {
		top: -20px
	}
}

@media (max-width:550px) {
	.timeline__block__circle {
		transform: scale(.8);
	}
}


/* ------ locationMap ------ */
.locationMap::after {
	background-color: rgba(59, 58, 43, .04);
	border-radius: .5rem;
	content: "";
	height: 100%;
	left: 0;
	pointer-events: none;
	position: absolute;
	top: 0;
	width: 100%;
}

.locationMap i {
	color: #fff;
	font-size: 2rem;
	left: 50%;
	pointer-events: none;
	position: absolute;
	text-shadow: 0 0 40px #706F6F;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 5;
}


/* ------ pagination ------ */
.page-link {
	color: var(--c4);
	font-weight: 500;
}

.active>.page-link,
.page-link.active {
	background-color: var(--c4);
	border-color: var(--c4);
	color: #fff;
	font-weight: 600;
	min-width: 38px;
	text-align: center;
}

.page-link:focus {
	box-shadow: 0 0 0 .25rem rgba(186, 186, 186, .3);
}


/* ------ toast ------ */
.toast-body {
	font-size: .95rem !important;
	font-weight: 500;
}

#customToast.bg-warning .toast-body {
	color: var(--c4) !important;
}