/*
VARS
*/
:root {
	--black: #35363A;
	--white: #FFFFFF;
	--gray: #A8A5A3;
	--green: #A4CF57;
	--darkGreen: #75B858;
	--blue: #5AA1CE;
}
@keyframes spin {
	from {transform:rotate(0deg);}
	to {transform:rotate(360deg);}
}
/*
RESET
*/
*, *::after, *::before {
	box-sizing: border-box;
}
* {
font: inherit;
margin: 0;
padding: 0;
border: 0;
}
body {
	background-color: var(--g-bg-body, white);
}
html,
body {
	height: 100%;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main, form legend {
	display: block;
}
ol, ul, menu {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
button, input, textarea, select {
	margin: 0;
}
.co-button, .form-control, .link, .reset {
	background-color: transparent;
	padding: 0;
	border: 0;
	border-radius: 0;
	color: inherit;
	line-height: inherit;
	appearance: none;
}
select.form-control::-ms-expand {
	display: none;
}
textarea {
	resize: vertical;
	overflow: auto;
	vertical-align: top;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
img, video, svg {
	height: auto;
	max-width: 100%;
}
embed,
iframe,
object {
	max-width: 100%;
}
h1, h2, h3, h4, h5, h6 {
	font-family: sans-serif;
	text-wrap: balance;
	line-height: 1.1;
}
p, li, figcaption {
	text-wrap: pretty;
}
.bold {
	font-weight: 600;
}
/*
BASE
*/
html {
	background-color: var(--black);
	height: 100%;
	scroll-behavior: smooth;
}
body {
	color: var(--white);
	font-family: sans-serif;
	font-size: 16px;
	font-size-adjust: 0.49;
	font-weight: normal;
	height: auto;
	line-height: 1.4;
	min-height: 100%;
	position: relative;
}
body::before {
	background-color: var(--green);
	background-image: url(images/ticketsLiveBackground.jpg);
	background-position: center center;
	background-size: cover;
	content: "";
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
}
@media (min-width: 1500px) {
	body {
		background-image: url(images/BG-texture-2160.jpg);
	}
}
.fonts-loaded body {
	font-family: "bf-monument", sans-serif;
	font-size-adjust: none;
}
h1 {
	font-family: serif;
	font-size-adjust: 0.49;
}
h1, h2, h3, h4, h5, h6 {
	font-family: "bf-share-tech", monospace;
}
h2 {
	font-size: min(7vw, 40px);
}
h3 {
	font-size: min(5vw, 40px);
	font-weight: 600;
	margin-bottom: 0.4em;
}
/* .fonts-loaded h1 {
	font-family: sabbath-black, serif;
	font-size-adjust: none;
} */
a:link,
a:visited {
	color: var(--green);
	text-decoration: underline;
	transition: color 0.1s ease;
}
a:hover,
a:active {
	color: var(--blue);
}
p {
	margin-bottom: 1em;
}
ul {
	list-style-type: disc;
	padding-left: 1em;
}
ul {
	margin-bottom: 1em;
}
li {
	margin-bottom: 0.2em
}
@property --button-s1 {
	syntax: '<percentage>';
	inherits: false;
	initial-value: 0%;
}
@property --button-s2 {
	syntax: '<percentage>';
	inherits: false;
	initial-value: 130%;
}
@property --button-s3 {
	syntax: '<percentage>';
	inherits: false;
	initial-value: 170%;
}
@property --button-s4 {
	syntax: '<percentage>';
	inherits: false;
	initial-value: 300%;
}
.button,
.button:link {
	background-image: linear-gradient(20deg, var(--blue) var(--button-s1), var(--blue) var(--button-s2), var(--green) var(--button-s3), var(--green) var(--button-s4) );
	color: var(--black);
	display: inline-block;
	padding: 5px 10px;
	transition: --button-s1 1s ease, --button-s2 1s ease, --button-s3 1s ease, --button-s4 1s ease;
}
.button:hover,
.button:focus {
	--button-s4: 100%;
	--button-s3: -130%;
	--button-s2: -170%;
	--button-s1: -200%;
}
.button:link,
.button:visited {
	color: var(--black);
	text-decoration: none;
}
.shadow {
	position: relative;
}
.shadow::before {
	background-image: url(images/texture3.gif);
	content: "";
	height: calc(100% + 120px);
	mask-image: radial-gradient(black, transparent 90%);
	left: -60px;
	mix-blend-mode: multiply;
	pointer-events: none;
	position: absolute;
	top: -60px;
	width: calc(100% + 60px);
	z-index: 1;
}
.shadow::after {
	background-color: var(--black);
	box-shadow: 0px 0px 40px 40px var(--black);
	border-radius: 20%;
	content: "";
	height: calc(100% - 40px);
	left: 20px;
	opacity: 0.9;
	position: absolute;
	top: 20px;
	width: calc(100% - 40px);
	z-index: 1;
}
.shadow * {
	position: relative;
	z-index: 2;
}
.top {
	position: relative;
	z-index: 10;
}

.header {
	font-family: 'bf-share-tech', monospace;
	height: 100vh;
	margin-inline: auto;
	position: relative;
	left: 0;
	top: 0;
	width: 100%;
}
.header--text {
	display: flex;
	gap: 15px;
	flex-wrap: wrap;
	justify-content: space-around;
	margin-top: 15px;
	position: relative;
	width: 100%;
	z-index: 5;
}
.header--title {
	line-height: 1.4;
}
.header--location {}
.header-text {
	background-color: var(--green);
	border-radius: 1em;
	color: var(--black);
	display: inline-block;
	font-size: clamp(20px, 3vw, 35px);
	padding: 0.25em 1em;
}
.header--save_the_date {
	height: 95%;
	left: 50%;
	max-height: 75vh;
	max-width: 95vw;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 95%;
	z-index: 1;
}
.header--date {
	font-family: 'bf-share-tech', monospace;
	font-size: min(10vw, 100px);
	position: absolute;
	z-index: 5;
}
.header--date__start {
	left: 30px;
	top: 30px;
}
.header--date__end {
	bottom: 90px;
	right: 30px;
}
.header--on_sale {
	bottom: 60px;
	left: 50%;
	position: absolute;
	text-align: center;
	transform: translateX(-50%);
	width: 100%;
	z-index: 5;
}
@media screen and (min-width: 600px) {
	.header--on_sale {
		width: auto;
	}
}
.header--tickets_button {
	background-color: var(--blue);
	border-radius: 20px;
	box-shadow: 5px 5px 0px 0px var(--black);
	display: inline-block;
	font-size: max(4vw, 30px);
	padding: 20px 40px;
	text-align: center;
	text-decoration: none;
}
.header--tickets_button:link,
.header--tickets_button:visited,
.header--tickets_button:hover,
.header--tickets_button:focus {
	transition: color 0.3s ease, background-color 0.3s ease;
}
.header--tickets_button:link,
.header--tickets_button:visited {
	color: var(--black);
	text-decoration: none;
}
.header--tickets_button:hover,
.header--tickets_button:focus {
	background-color: var(--black);
	box-shadow: 5px 5px 0px 0px var(--blue);
	color: var(--blue);
}



/*
CONTACT
*/
.contact {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	justify-content: space-between;
	margin-inline: auto;
	margin-top: 60px;
	margin-bottom: 60px;
	max-width: 1000px;
	padding-right: 30px;
	padding-left: 30px;
	@media screen and (min-width: 500px) {
		flex-wrap: nowrap;
	}
}
.contact--section {
	container-type: inline-size;
	width: 100%;
	@media screen and (min-width: 500px) {
		width: min(50%, 400px);
	}
}
.contact--section h2 {
	text-align: center;
	line-height: 1;
	margin-bottom: min(2vw, 20px);
	position: relative;
	z-index: 2;
}
.mailchimp-form {
	position: relative;
	z-index: 2;
}
.mailchip-label {
	font-size: min(3.4vw, 16px);
}
.mailchimp-input-row {
	column-gap: 15px;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	row-gap: 5px;
}
@container (width > 300px) {
	.mailchimp-input-row {
		flex-wrap: nowrap;
	}
}
.mailchimp-input-row input[type=email] {
	width: 100%;
}
.instagram_link:link,
.instagram_link:visited {
	color: var(--white);
	display: block;
	position: relative;
	text-align: center;
	text-decoration: none;
	transition: --button-s1 1s ease, --button-s2 1s ease, --button-s3 1s ease, --button-s4 1s ease;
	z-index: 2;
}
.instagram_logo {
	display: inline-block;
	margin-inline: auto;
	width: 55px;
}
.instagram_logo path {
	fill: var(--green);
	transition: fill 0.5s ease;
}
.instagram_link:hover .instagram_logo path,
.instagram_link:active .instagram_logo path {
	fill: var(--blue);
}
/* 
* Conduct
*/
.conduct {
	margin-inline: auto;
	max-width: 790px;
	padding: 0 30px 60px;
}
.conduct h2 {
	margin-bottom: 0.3em;
	text-align: center;
}
.intro_desc__short {
	margin-top: -130px;
}
@media screen and (min-width: 800px) {
	.intro_desc {
		align-items: center;
		display: flex;
		gap: 2vw;
		flex-wrap: wrap;
	}
	.intro_desc__short {
		margin-top: 0;
	}
	.intro_desc > * {
		flex: 1 1 0;
		min-width: 0;
	}
}
.content_box {
	padding: 0 30px;
	margin-inline: auto;
}
.intro_desc .content_box--text {
	margin-top: -150px;
	margin-inline: auto;
	max-width: 650px;
}
@media screen and (min-width: 800px) {
	.intro_desc .content_box--text {
		margin-top: 0;
	}
}
 .content_box--image_wrap {
	display: inline-block;
	margin-left: -30px;
	mask-image:  linear-gradient(180deg, hsla(0, 0%, 0%, 0.05), black 20%, black 80%, hsla(0, 0%, 0%, 0.05));
	position: relative;
	width: calc(100% + 60px);
}
@media screen and (min-width: 800px) {
	.content_box--image_wrap {
		margin-inline: auto;
		max-width: 500px;
	}
	.intro_desc__2 .content_box--image_wrap {
		order: 10;
	}
}
.content_box--image_wrap::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #35373A;
	mix-blend-mode: hue;
	opacity: 0.8;
	z-index: 10;
}
.content_box--image {
	height: auto;
	mask-image: url("images/mask6.png");
	mask-size: 110%;
	mask-repeat: no-repeat;
	mask-position: left center;
	max-width: 100%;
	width: 100%;
}
.lasers_wrap {
	mask-image:  linear-gradient(transparent, black 30%, black 80%, transparent 100%);
	position: relative;
	width: 100%;
}
.lasers_wrap::before {
	background-color: #363A35;
	content: "";
	height: 100%;
	left: 0;
	mix-blend-mode: hue;
	opacity: 0.8;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 10;
}
.lasers_wrap::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-image: url("images/texture2.jpg");
	mix-blend-mode: multiply;
	opacity: 0.8;
	z-index: 10;
}
.lasers {
	display: block;
	height: auto;
	mask-image:  linear-gradient(transparent, black 30%, black 80%, transparent 100%);
	width: 100%;
}