/*

Theme Name: Thunder Fest
Theme URI: https://thunder-fest.com/
Description: Theme for Thunder Fest.
Version: 1.0
Author: Joe Mendonca
Author URI: https://electricmonument.com/

*/

/*--------------------------------------------------------------
HTML Elements
--------------------------------------------------------------*/

* {
	margin: 0;
	padding: 0;
}

body {
	background: linear-gradient(to bottom, #5a4387, #2a1f3e);
	background-attachment: fixed;
	background-size: cover;
	color: #f48a27;
	font-family: 'Riverside';
	height: 100%;
	margin: 0;
	width: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img {
	border: 0px none;
}

.alignleft {
	display: inline;
	float: left;
	margin: 0px 10px 10px 0px;
}

.alignright {
	display: inline;
	float: right;
	margin: 0px 0px 10px 10px;
}

.aligncenter {
	display: inline;
	float: center;
}

/*--------------------------------------------------------------
Typography
--------------------------------------------------------------*/

@font-face {
  font-family: 'Riverside';
  src: url('fonts/riverside-webfont.woff2') format('woff2'),
       url('fonts/riverside-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

a {
    color: #f48a27;
    text-decoration: none;
}

/*--------------------------------------------------------------
Layout
--------------------------------------------------------------*/

.wrapper {
    float: left;
    width: 100%;
}

.layout {
    margin: 0 auto;
    text-align: center;
    width: 1200px;
}

.stars {
    background-image: url(imgs/stars.png);
	background-size: 100vw auto;
	height: 100vh;
	pointer-events: none;
	position: fixed;
	width: 100vw;
	z-index: -1;
}

/*--------------------------------------------------------------
Header
--------------------------------------------------------------*/

/*--------------------------------------------------------------
Hamburger Menu
--------------------------------------------------------------*/

.hamburger-menu {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1000;
    cursor: pointer;
    transition: all 0.3s ease;
}

.hamburger-icon {
    width: 30px;
    height: 24px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.hamburger-icon span {
    display: block;
    width: 100%;
    height: 3px;
    background-color: #f48a27;
    border-radius: 2px;
    transition: all 0.3s ease;
    transform-origin: center;
}

/* Hamburger Animation - Open State */
.hamburger-menu.active .hamburger-icon span:nth-child(1) {
    transform: rotate(45deg) translate(7px, 7px);
}

.hamburger-menu.active .hamburger-icon span:nth-child(2) {
    opacity: 0;
    transform: scale(0);
}

.hamburger-menu.active .hamburger-icon span:nth-child(3) {
    transform: rotate(-45deg) translate(7px, -7px);
}

/* Mobile Menu Overlay */
.mobile-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(42, 31, 62, 0.95);
    backdrop-filter: blur(10px);
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mobile-menu-overlay.active {
    opacity: 1;
    visibility: visible;
}

.mobile-menu-content {
    text-align: center;
    transform: translateY(30px);
    transition: all 0.4s ease;
    opacity: 0;
}

.mobile-menu-overlay.active .mobile-menu-content {
    transform: translateY(0);
    opacity: 1;
}

/* Navigation Menu Styles */
.mobile-menu-content .navigation-menu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mobile-menu-content .navigation-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mobile-menu-content .navigation-menu li {
    margin: 5px 0;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s ease;
    list-style: none;
}

.mobile-menu-overlay.active .mobile-menu-content .navigation-menu li {
    opacity: 1;
    transform: translateY(0);
}

.mobile-menu-content .navigation-menu li:nth-child(1) { transition-delay: 0.1s; }
.mobile-menu-content .navigation-menu li:nth-child(2) { transition-delay: 0.2s; }
.mobile-menu-content .navigation-menu li:nth-child(3) { transition-delay: 0.3s; }
.mobile-menu-content .navigation-menu li:nth-child(4) { transition-delay: 0.4s; }
.mobile-menu-content .navigation-menu li:nth-child(5) { transition-delay: 0.5s; }
.mobile-menu-content .navigation-menu li:nth-child(6) { transition-delay: 0.6s; }

.mobile-menu-content .navigation-menu a {
    color: #f48a27;
    font-size: 140px;
    text-decoration: none;
    transition: all 0.3s ease;
    display: block;
    padding: 10px 20px;
    border-radius: 8px;
    line-height: 0.8;
}

.mobile-menu-content .navigation-menu a:hover {
    transform: scale(1.05);
}

/*--------------------------------------------------------------
WooCommerce Shop Page
--------------------------------------------------------------*/

/* Hide "showing the single result" text and catalog ordering filter */
.woocommerce-result-count,
.woocommerce-ordering {
    display: none !important;
}

/*--------------------------------------------------------------
Footer
--------------------------------------------------------------*/

/* Footer Menu */
.footer-menu {
    text-align: center;
    margin-bottom: 30px;
}

.footer-menu .navigation-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 24px;
    white-space: nowrap;
    overflow-x: auto;
}

.footer-menu .navigation-menu li {
    margin: 0;
    list-style: none;
    display: inline-block;
    float: none;
    text-transform: uppercase;
}

.footer-menu .navigation-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 24px;
}

.footer-menu .navigation-menu ul li {
    display: inline-block;
    float: none;
    margin: 0;
}

.footer-menu .navigation-menu a {
    color: #f48a27;
    font-size: 14px;
    margin-right: 18px;
    text-decoration: none;
    transition: all 0.3s ease;
    display: inline-block;
    white-space: nowrap;
}

.footer-menu .navigation-menu ul li:last-child a {
    margin-right: 0px;
}

.footer-menu .navigation-menu * {
    display: inline-block !important;
    float: none !important;
    clear: none !important;
}

.footer-menu .navigation-menu a:hover {
    color: #fff;
}

/* Footer Credits */
.footer-credits {
    text-align: center;
    font-size: 14px;
    line-height: 1.4;
}

.footer-credits span {
    margin: 0 5px;
}

.logo {
    height: auto;
    margin: 60px 0px 0px 0px;
    width: 60vw;
}

.page-template-default .logo,
.single .logo {
    width: 20vw;
}

/*--------------------------------------------------------------
Content
--------------------------------------------------------------*/

.content,
.content-pages {
    padding: 40px 0px 40px 0px;
}

.content,
.content > div,
.content-pages {
    float: left;
    width: 100%;
}

.dates {
    font-size: 48px;
    margin-bottom: 40px;
}

h1,
.lineup {
    font-size: 100px;
    line-height: 110px;
    margin-bottom: 56px;
    text-shadow: 2px 2px 0 #5a4387;
}

.name-small {
	font-size: 72px;
	line-height: 96px;
}

.passes,
.woocommerce .button,
.wc-block-components-button {
    font-family: 'Riverside';
    font-size: 36px !important;
    font-weight: normal !important;
    text-transform: uppercase !important;
}

.passes a,
.woocommerce .button,
.wc-block-components-button {
    background: #f48a27 !important;
    border-radius: 25px !important;
    color: #5a4387 !important;
    line-height: 36px !important;
    padding: 2px 30px 4px 30px !important;
    transition: 0.3s ease !important;
}

.passes a:hover,
.woocommerce .button:hover {
    background: #5a4387 !important;
    color: #f48a27 !important;
}

.location {
    font-size: 24px;
    line-height: 28px;
    margin-bottom: 56px;
}

.location span {
    display: block;
}

.location img {
    margin-top: 24px;
}

.blaster {
    height: auto;
    margin: 80px 0px 10px 0px;
    width: 50vw;
}

/*--------------------------------------------------------------
Map
--------------------------------------------------------------*/

.map {
    height: auto;
    width: 36vw;
}

/*--------------------------------------------------------------
Astronaut
--------------------------------------------------------------*/

.astronaut {
    height: auto;
    pointer-events: none;
    position: absolute;
    width: 75px;
    animation: floatX 100s ease-in-out infinite,
            floatY 120s linear infinite,
            fade 8s ease-in-out infinite,
            rotate 6s ease-in-out infinite alternate;
}

@keyframes floatX {
    0% { left: 0%; }
    50% { left: 90%; }
    100% { left: 0%; }
}

@keyframes floatY {
    0% { top: 100vh; }
    50% { top: -100px; }
    100% { top: 100vh; }
}

@keyframes fade {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes rotate {
    0% { transform: rotate(-2deg); }
    100% { transform: rotate(2deg); }
}

/*--------------------------------------------------------------
GSAP
--------------------------------------------------------------*/

.scroll-width {
    transform-origin: center center;
    transition: width 0.3s ease;
}

/*--------------------------------------------------------------
Pages
--------------------------------------------------------------*/

.content-pages {
    margin-top: 40px;
    padding: 0px calc(12.5% - 20px) 0px calc(12.5% - 20px);
    text-align: left;
    width: 75%;
}

.content-pages h1 {
    float: left;
    font-size: 72px;
    font-weight: normal;
    line-height: 76px;
    margin: 0px 0px 24px 0px !important;
    width: 100%;
}

.content-pages p,
.custom-description p {
    float: left;
    font-family: "neue-haas-grotesk-text", sans-serif;
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    margin-bottom: 14px;
    width: 100%;
}

.content-pages img {
    float: left;
    height: auto;
    margin: 24px 0px 26px 0px;
    width: 100%;
}

/*--------------------------------------------------------------
WooCommerce single products
--------------------------------------------------------------*/

h1 {
    font-size: 60px !important;
    font-weight: normal !important;
    line-height: 70px !important;
    margin: 48px 0px 56px 0px !important;
    text-shadow: 2px 2px 0 #5a4387;
}

.summary.entry-summary {
    float: left;
    font-family: "neue-haas-grotesk-text", sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    text-align: left;
    width: 100%;
}

.single .woocommerce-Price-amount.amount {
    color: #ffffff;
    display: block;
    font-size: 16px;
    margin: 12px 0px 12px 0px;
}

.wc-box-office-ticket-fields-title {
    font-size: 16px;
    font-weight: normal;
}

.woocommerce input {
    border: 0px !important;
    border-radius: 4px !important;
    color: #000000 !important;
    font-size: 16px !important;
    padding: 8px 6px !important;
    text-align: left !important;
}

.wc-box-office-ticket-fields {
    margin-bottom: 24px;
}

.woocommerce .button,
.wc-block-components-button {
    border-radius: 18px !important;
    font-size: 24px !important;
    padding: 4px 22px 6px 22px !important;
}

.single.woocommerce .button {
    margin-top: -24px !important;
}

.woocommerce .quantity {
    align-items: center;
    display: flex;
    gap: 10px;
    margin-bottom: -10px !important;
}

.quantity .minus,
.quantity .plus {
    background: transparent;
    border: 0px;
    cursor: pointer;
    display: inline-block;
    font-size: 32px;
    height: 30px;
    line-height: 32px;
    text-align: center;
    user-select: none;
    width: auto;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.qty {
    text-align: center !important;
    width: 30px !important;
}

.wc-box-office-ticket-form {
    float: left;
    width: 100%;
}

.woocommerce-product-gallery__wrapper img {
    height: auto;
    width: 100%;
}

.variations_form .variations select {
	background-color: #5a4387;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='20,50 70,100 120,50' stroke='white' stroke-width='15' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  	background-repeat: no-repeat;
  	background-position: right 0.75em center;
  	background-size: 1em;
  	border: 1px solid #ffffff;
	border-radius: 0px;
	color: #ffffff;
  	padding: 10px;
  	appearance: none;
  	-webkit-appearance: none;
  	-moz-appearance: none;
}

.woocommerce div.product form.cart .variations {
	margin-bottom: 36px !important;
}

.woocommerce-variation.single_variation {
	padding-bottom: 6px !important;
}

.wp-singular .summary.entry-summary .price {
 	display: none;
}

.wp-singular .summary.entry-summary .woocommerce-variation-price .price {
 	display: block;
}

.woocommerce div.product form.cart .button {
	float: left;
	margin: -6px 0px 0px 12px !important;
}

.wp-singular .custom-description p {
	margin-bottom: 30px !important;
}

.postid-82 .variations .label {
	display: none !important;
}

.woocommerce-variation-description p {
	margin-top: -10px !important;
}

/*--------------------------------------------------------------
WooCommerce notifications
--------------------------------------------------------------*/

.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
    background-color: transparent !important;
    border: 0px !important;
    color: #f48a27 !important;
    font-family: "neue-haas-grotesk-text", sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    margin: 0px 0px 24px 0px !important;
    padding: 0px !important;
}

.woocommerce-message::before {
    display: none !important;
}

.custom-view-cart {
    font-family: 'Riverside';
}

/*--------------------------------------------------------------
WooCommerce cart
--------------------------------------------------------------*/

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
    background: #5a4387;
    float: left;
    font-family: "neue-haas-grotesk-text", sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    padding: 12px 28px 0px 28px;
    width: 100%;
}

.woocommerce-cart .wc-block-components-product-metadata,
.woocommerce-checkout .wc-block-components-product-metadata,
.woocommerce-checkout .wc-block-components-order-summary-item__quantity {
    display: none !important;
}

.wc-block-components-totals-item.wc-block-components-totals-footer-item,
.wc-block-components-totals-item.wc-block-components-totals-footer-item * {
    font-size: 18px !important;
}

.wc-block-components-button {
    padding: 0px !important;
}

.wc-block-components-button:hover {
    background: #000000 !important;
    color: #f48a27 !important;
}

.wp-block-woocommerce-cart .is-large.wc-block-cart .wc-block-cart-items td,
.wp-block-woocommerce-cart .is-large .wc-block-components-sidebar .wc-block-components-panel,
.wp-block-woocommerce-cart .is-large .wc-block-components-sidebar .wc-block-components-totals-coupon,
.wp-block-woocommerce-cart .is-large .wc-block-components-sidebar .wc-block-components-totals-item {
    padding-left: 0px !important;
}

.wp-block-woocommerce-cart .wc-block-cart-item__wrap {
    padding-left: 24px !important;
}

/*--------------------------------------------------------------
WooCommerce checkout
--------------------------------------------------------------*/

.wp-block-woocommerce-checkout {
    padding-bottom: 20px;
}

.wc-block-components-checkout-step__content,
.woocommerce-checkout .content-pages p,
.wc-block-components-title,
.wc-block-components-checkbox__label,
.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button,
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-formatted-money-amount {
    font-size: 16px !important;
}

.wc-block-components-checkout-step__content > * {
    float: left !important;
    width: 100% !important;
}

.wc-block-components-order-summary .wc-block-components-order-summary-item__image,
.woocommerce-checkout .content-pages img {
    margin: 0px !important;
}

.wc-block-components-button,
.wc-block-components-checkout-place-order-button {
    border: 0px !important;
}

.wc-block-components-checkbox {
    padding-top: 24px;
}

.wc-block-checkout__add-note {
    margin-bottom: 24px !important;
}

.wc-block-components-radio-control-accordion-content {
    height: auto !important;
    margin: 0px !important;
    padding: 0px !important;
}

#radio-control-wc-payment-method-options-stripe__content > .content {
    display: none !important;
}

.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.wc-block-components-radio-control--highlight-checked label.wc-block-components-radio-control__option--checked-option-highlighted {
    border-radius: 0px !important;
    box-shadow: none !important;
}

/*--------------------------------------------------------------
Footer
--------------------------------------------------------------*/

footer {
    float: left;
    font-family: "neue-haas-grotesk-text", sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    padding: 0px 20px 30px 0px;
    text-align: right;
    width: calc(100% - 20px);
}

footer span {
    display: block;
}

.bridge {
    float: left;
    height: auto;
    margin-bottom: -110px;
    width: 100%;
}

.woocommerce .bridge {
    margin-top: 72px;
}