@charset "UTF-8";
:root {}
::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}
::-webkit-scrollbar-track {
	background-color: transparent;
	cursor: pointer;
}
::-webkit-scrollbar-thumb {
	background-color: #E10600;
	border-radius: 5px;
	cursor: grab;
}
::-webkit-scrollbar-thumb:hover {
	background-color: #BF0300;
}
::-webkit-scrollbar-thumb:active {
	cursor: grabbing;
}
::selection {}
*:not(:where(#map *)):not(:where(.pac-container *)) {
	-webkit-overflow-scrolling: touch;
	-webkit-tap-highlight-color: transparent;
	font-display: swap;
	font-family: "Barlow Condensed", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 20px;
	-line-height: 1;
	font-optical-sizing: auto;
	color: #FFF;
	caret-color: auto;
	box-sizing: border-box;
	padding: 0;
	margin: 0;
	backface-visibility: hidden;
	user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	scroll-behavior: smooth;
}
.selection {
	user-select: text;
	-webkit-user-select: text;
	-ms-user-select: text;
}
.material-symbols-outlined {
    font-display: swap;
	font-family: 'Material Symbols Outlined';
	font-weight: normal;
	font-style: normal;
	font-size: 16px;
	display: inline-block;
	line-height: 1;
	text-transform: none;
	letter-spacing: normal;
	word-wrap: normal;
	white-space: nowrap;
	direction: ltr;
	font-variation-settings:
		'FILL' 0,
		'wght' 400,
		'GRAD' 0,
		'opsz' 16;
	&.fill {
		font-variation-settings:
			'FILL' 1;
	}
}
html {
	background-color: #000;
}
body {
	display: block;
	background-color: #111;
	overflow: hidden;
	overflow-y: auto;
	& *:not(:where(#map *)):not(:where(.pac-container *)) {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 20px;
	}
	&.app {
	    background-color: #000;
	    overflow: hidden;
	}
}
nav {
	display: flex;
	height: 60px;
	flex-direction: row;
	justify-content: space-between;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	padding: 10px 10%;
	gap: 20px;
	z-index: 100;
	&::before {
		content: '';
		inset: 0;
		position: absolute;
		background-color: rgba(0, 0, 0, .25);
        backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
		transition: all 0.25s ease;
		z-index: -1;
	}
	&.min {
	    & button#menu,
	    & div#menu {
	        opacity: 0;
	        pointer-events: none
	    }
	    &::before {
	        display: none;
	    }
	}
	&.mini {
	    & button#menu,
	    & div#menu {
	        opacity: 0;
	        pointer-events: none
	    }
	}
	& section {
		flex: 1;
		width: 100%;
		display: flex;
		flex-direction: row;
		gap: 10px;
		&:first-child {
			justify-content: flex-start;
			& a {
				cursor: pointer;
				text-decoration: none;
				transition: all 0.25s ease-in-out;
				&:hover {
					transform: scale(1.1) rotate(-10deg);
				}
			}
		}
		&:nth-child(2) {
			flex-shrink: 0 !important;
		}
		&:last-child {
			flex-shrink: 0 !important;
			justify-content: flex-end;
		}
	}
	& img {
		width: 100px;
		pointer-events: none;
	}
	& a {
	    text-decoration: none;
	}
	& button#start {
		display: flex;
		background-color: #E10600;
		border: none;
		border-radius: 20px;
		cursor: pointer;
		padding: 10px 20px;
		transition: all .25s ease;
		overflow: hidden;
		&:hover {
			background-color: #BF0300;
		}
	}
	& button#menu {
		width: 30px;
		height: 30px;
		display: none;
		position: relative;
		background-color: transparent;
		border: none;
		outline: none;
		cursor: pointer;
		transition: all 0.25s ease;
		overflow: hidden;
		&.open {
			& i {
				width: 100%;
				&:first-child {
					top: 50%;
					transform: translate(-50%, -50%) rotateZ(-45deg);
				}
				&:nth-child(2) {
					transform: translateX(50%);
				}
				&:last-child {
					top: 50%;
					transform: translate(-50%, -50%) rotateZ(45deg);
					
				}
			}
		}
		& i {
			width: 100%;
			height: 4px;
			position: absolute;
			background-color: #FFF;
			border-radius: 3px;
			transition: all 0.25s ease-in-out;
			transform: translate(-50%, -50%);
			&:first-child {
				top: 3px;
			}
			&:nth-child(2) {
				top: 50%;
			}
			&:last-child {
				top: calc(100% - 3px);
			}
		}
	}
}
div#menu {
	display: flex;
	flex-direction: row;
	& a {
		flex-shrink: 0;
		position: relative;
		color: #FFF;
		text-align: center;
		text-decoration: none;
		transition: all .25s ease;
		&::before {
			content: '• ';
			opacity: 0;
			transition: all .25s ease;
		}
		&::after {
			width: 100%;
			height: 2px;
			position: absolute;
			left: 0;
			bottom: -5px;
			content: '';
			background-color: #E10600;
			transform: scaleX(0);
			transform-origin: bottom left;
			transition: transform 0.25s ease-out;
		}
		&:hover:not(.selected) {
			transform: scale(1.05);
			&::before {
				opacity: 1;
			}
			&::after {
				transform: scaleX(1);
			}
		}
		&.selected {
			font-weight: 700;
			pointer-events: none;
		}
	}
}
div#overlay {
    opacity: 0;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    backdrop-filter: blur(1px )brightness(50%);
    pointer-events: none;
    transition: all 0.25s ease-in-out;
    z-index: 200;
    &.open {
        opacity: 1;
        pointer-events: auto;
    }
}
#pc-overlay {
    opacity: 0;
    inset: 0;
    position: fixed;
    display: flex;
    background: #000;
    transition: all .25s ease-in-out;
    z-index: 10;
    pointer-events: none;
    & #pc-overlay-content {
        display: flex;
        color: #FFF;
        gap: 20px;
        & .material-symbols-outlined {
        	font-size: 100px;
        	color: #FFF;
        	font-variation-settings:
        		'wght' 100,
        		'opsz' 100;
        }
    }
}
#landscape-overlay {
    opacity: 0;
    inset: 0;
    position: fixed;
    display: flex;
    background: #000;
    transition: all .25s ease-in-out;
    z-index: 10;
    pointer-events: none;
    & #landscape-overlay-content {
        display: flex;
        color: #FFF;
        gap: 20px;
        & .material-symbols-outlined {
        	font-size: 100px;
        	color: #FFF;
        	font-variation-settings:
        		'wght' 100,
        		'opsz' 100;
        	transform: rotateZ(180deg);
        }
    }
}
div#cookies {
    max-width: 40%;
    max-height: 75vh;
    display: flex;
    gap: 20px;
    position: fixed;
    bottom: calc(env(safe-area-inset-bottom) + 20px);
    left: 20px;
    background-color: #FFF;
    border-radius: 30px;
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
    padding: 20px;
    overflow: hidden;
    transform: translateY(150vh);
    transition: all .5s ease;
    z-index: 300;
    &.open {
        transform: translateY(0);
    }
    & ::-webkit-scrollbar {
    	width: 5px;
    	height: 5px;
    }
    & ::-webkit-scrollbar-track {
    	background-color: transparent;
    	cursor: pointer;
    }
    & ::-webkit-scrollbar-thumb {
    	background-color: rgba(0, 0, 0, 0.1);
    	border-radius: 5px;
    	cursor: grab;
    }
    & ::-webkit-scrollbar-thumb:hover {
    	background-color: rgba(0, 0, 0, 0.2);
    }
    ::-webkit-scrollbar-thumb:active {
    	cursor: grabbing;
    }
    & * {
        color: #000;
    }
    & div {
        width: 100%;
        display: flex;
        gap: 20px;
    }
    & #details {
        display: none;
        justify-content: flex-start;
        overflow-y: hidden;
        &> div {
            justify-content: flex-start;
            overflow-y: auto;
        }
    }
    & span.background {
        opacity: 0;
        position: absolute;
        top: 50%;
        left: 50%;
		font-size: 300px;
		font-variation-settings:
			'wght' 900,
			'opsz' 300;
		color: rgba(0, 0, 0, 0.025);
		transform: translate(-50%, -50%);
		z-index: -1;
    }
    & span.left {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
    }
    & span.title {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        gap: 0;
    	& .material-symbols-outlined {
    		font-size: 40px;
    		font-variation-settings:
    			'opsz' 40,
    			'wght' 600;
    		color: #000;
    		transform: translateY(1px);
    	}
    }
    & h3 {
        width: auto;
		text-align: left;
		font-size: 2rem;
		font-weight: 600;
		letter-spacing: -0.025em;
	}
    & span.close {
        position: absolute;
        top: 20px;
        right: 20px;
		font-size: 30px;
		font-variation-settings:
			'wght' 300,
			'opsz' 30;
		cursor: pointer;
		transition: all 0.25s ease;
		&:hover {
            transform: scale(1.05);
        }
	}
	p {
	    width: 100%;
	    text-align: left;
	}
	button {
	    min-height: 40px;
		display: inline-flex;
		flex-direction: row;
		position: relative;
		background-color: rgba(0, 0, 0, 0.1);
		border: none;
		border-radius: 20px;
		font-size: 1rem;
		color: #000;
		cursor: pointer;
		padding: 10px 20px !important;
		transition: all 0.25s ease;
		overflow: hidden;
		&:hover {
			background-color: rgba(0, 0, 0, 0.2);
		}
		& * {
			font-size: 2rem;
			color: #000;
		}
		&.primary {
		    outline: 1px solid #000;
		    outline-offset: 5px;
		    &:hover {
		        outline-offset: 0;
		    }
		}
	}
	a,
	i {
	    text-decoration: underline;
	    cursor: pointer;
	    &.x {
	        display: flex;
	        flex-direction: row;
	        gap: 0;
	        text-decoration: none;
	    }
	}
	& h4 {
        width: 100%;
		text-align: left;
		font-size: 1.25rem;
		letter-spacing: -0.025em;
		font-weight: 500;
	}
    & span.switch {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        gap: 10px;
        & p {
            transform: translateY(-2.5px);
        }
    }
    & label.switch {
        width: 50px;
        height: 25px;
        flex-shrink: 0;
        display: inline-flex;
        position: relative;
        & input {
            display: none;
            &:checked + span {
                background: #00FF73;
                border-color: #00FF73;
                &::before {
                    transform: translateX(25px);
                }
            }
        }
        & span {
            width: 100%;
            height: 100%;
            position: relative;
            background: #1A1A1A;
            background-color: rgba(0, 0, 0, 0.1);
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 999px;
            cursor: pointer;
            transition: all .25s ease;
            &::before {
                content: "";
                width: 19px;
                height: 19px;
                position: absolute;
                top: 2px;
                left: 2px;
                background: #FFF;
                border-radius: 50%;
                box-shadow:
                    0 2px 6px rgba(0,0,0,.35);
                transition: all .25s ease;
            }
        }
    }
	& table {
    	width: 100%;
    	table-layout: fixed;
    	border-collapse: separate;
    	border: 1px solid #CCC;
    	border-radius: 20px;
    	border-spacing: 0;
    	overflow: hidden;
    	& tr:first-child td {
	    	text-align: center;
	        font-weight: 450;
	    }
    	& tr:last-child td {
	    	border-bottom: 0;
	    }
	    & td {
	        border-right: 1px solid #CCC;
            border-bottom: 1px solid #CCC;
            hyphens: auto;
            overflow-wrap: break-word;
	        padding: 5px;
	        &:last-child {
	            border-right: 0;
	        }
	    }
	}
}
div#discount {
    opacity: 0;
    max-width: 50%;
    display: flex;
    align-items: center;
    gap: 10px;
    position: fixed;
    top: 50%;
    left: 50%;
    background-color: rgba(0, 0, 0, .75);
    box-shadow:
        0 24px 70px rgba(0, 0, 0, 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(22px) saturate(140%);
    -webkit-backdrop-filter: blur(22px) saturate(140%);
    border-radius: 30px;
    padding: 20px;
    overflow: hidden;
    transition: all .5s ease;
    transform: translate(-50%, -25%) scale(.8);
    z-index: 190;
    pointer-events: none;
    &.show {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
        pointer-events: auto;
    }
    & > span {
        width: 100%;
        display: flex;
        gap: 5px;
    }
    & h4 {
        text-align: center;
        font-weight: 600;
    }
    & h3 {
        width: 100%;
        line-height: 1;
        text-align: center;
        font-size: 3rem;
        font-weight: 900;
        color: #E10600;
        text-shadow: 0 0 10px #E10600;
    }
    & h2 {
        width: 100%;
        line-height: .75;
        text-align: center;
        font-size: 9rem;
        font-weight: 900;
        color: #E10600;
        text-shadow: 0 0 10px #E10600;
    }
    & img {
        width: 100px;
        pointer-events: none;
        transform: translateY(11px);
    }
    & i {
        width: 100%;
        position: relative;
        background-color: rgba(255, 255, 255, .25);
        box-shadow:
            0 24px 70px rgba(0, 0, 0, 0.55),
            inset 0 1px 0 rgba(255, 255, 255, 0.08);
        border: 1px solid #FFF;
        border-radius: 10px;
        cursor: pointer;
        overflow: hidden;
        & div {
            width: 100%;
            height: 100%;
            position: relative;
            font-weight: 600;
            padding: 10px;
            transition: transform .35s cubic-bezier(.22, 1, .36, 1);
            &:last-child {
                position: absolute;
                top: 0;
                color: #00ff73;
                font-weight: 600;
                transform: translateX(100%);
            }
        }
        &.copy {
            & div:first-child {
                transform: translateX(-100%);
            }
            & div:last-child {
                transform: translateX(0);
            }
        }
		& .material-symbols-outlined {
		    position: absolute;
		    top: 50%;
		    right: 5px;
			font-size: 30px;
			font-variation-settings:
				'FILL' 0,
				'wght' 200,
				'opsz' 30;
			transform: translateY(calc(-50% + 2px));
		}
    }
    & b {
        color: #E10600;
        font-weight: 600;
    }
    & a {
        width: 100%;
        text-decoration: none;
    }
    & button {
        width: 100%;
        background: #FFF;
        border: none;
        border-radius: 30px;
        color: #111;
        cursor: pointer;
        padding: 10px;
        transition: 0.25s ease;
        &:hover {
            background: #CCCCCC;
        }
        &.secondary {
            background: #111;
            color: #FFF;
            &:hover {
                background: #282828;
            }
        }
    }
}
#permissions-modal {
    inset: 0;
    display: none;
    position: fixed;
    background: transparent;
    backdrop-filter: blur(3px);
    padding: 20px;
    transition: all .25s ease-in-out;
    z-index: 5;
    &.open {
        display: flex;
    }
    & #permissions-content {
        width: 100%;
        max-height: 100%;
        display: flex;
        background: #FFF;
        border: 1px solid rgba(255, 255, 255, 0.10);
        border-radius: 30px;
        box-shadow:
            0 24px 70px rgba(0, 0, 0, 0.55),
            inset 0 1px 0 rgba(255, 255, 255, 0.08);
        color: #000;
        padding: 20px;
        gap: 20px;
        animation: modalIn 0.5s ease-out;
        overflow: hidden;
        & #permissions-header {
            width: 100%;
            display: flex;
            align-items: flex-start;
            gap: 0;
            & h2 {
                font-size: 22px;
                font-weight: 700;
                color: #000;
            }
            & p {
                color: #000;
            }
        }
        & #close-permissions {
            width: 100%;
            min-height: 46px;
            background: #111;
            border: none;
            border-radius: 30px;
            font-weight: 700;
            color: #FFF;
            cursor: pointer;
            padding: 15px;
            margin-top: 20px !important;
            transition: all .25s ease;
            &:disabled {
                opacity: .7;
                cursor: not-allowed;
            }
            &:hover {
                background: #222;
            }
        }
        & #refresh-button {
            width: 100%;
            min-height: 46px;
            max-height: 54px;
            background: transparent;
            border: 1px solid #111;
            border-radius: 30px;
            font-weight: 700;
            color: #111;
            cursor: pointer;
            padding: 15px;
        }
        & #permissions-entries {
            width: 100%;
            display: flex;
            justify-content: flex-start;
            gap: 10px;
            overflow: hidden;
            overflow-y: auto;
            scrollbar-width: none;
            -ms-overflow-style: none;
            &::-webkit-scrollbar {
                display: none;
            }
            & .permission-row {
                width: 100%;
                min-width: 100%;
                display: flex;
                align-items: flex-start;
                border-radius: 10px;
                padding: 10px 0;
                gap: 10px;
                & i {
                    width: 100%;
                    display: flex;
                    flex-direction: row;
                    justify-content: space-between;
                    gap: 10px;
                    & > div {
                        display: flex;
                        flex-direction: row;
                        gap: 10px;
                        & span.dot {
                            width: 20px;
                            height: 20px;
                            min-width: 20px;
                            min-height: 20px;
                            display: inline-block;
                            border-radius: 50%;
                            margin-left: 10px;
                            &.success {
                                background: #00FF73;
                                box-shadow: 0 0 10px rgba(0, 255, 115, 1);
                            }
                            &.error {
                                background: #FF4D4D;
                                box-shadow: 0 0 10px rgba(255, 77, 77, 1);
                            }
                        }
                        & h3 {
                            font-weight: 700;
                            color: #000;
                        }
                    }
                    & button {
                        background: #111;
                        border: none;
                        border-radius: 30px;
                        font-weight: 700;
                        color: #FFF;
                        cursor: pointer;
                        padding: 5px 15px;
                        transition: all .25s ease;
                        &:disabled {
                            cursor: not-allowed;
                        }
                        &:hover {
                            background: #222;
                        }
                    }
                }
                & p {
                    color: #000;
                    & a {
                        color: #000;
                    }
                }
            }
        }
    }
}
div#locationfilter {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    position: fixed;
    top: 60px;
	background-color: #000;
	padding: 10px 10%;
    gap: 10px;
    transition: all .25s ease;
    transform: translateY(calc(-100% - 60px));
    z-index: 10;
    &.int {
        transform: translateY(0);
    }
    & > button {
		display: flex;
		flex-shrink: 0;
		background-color: #E10600;
		border: none;
		border-radius: 20px;
		color: #FFF;
		cursor: pointer;
		padding: 11px 25px;
		transition: all .25s ease;
		overflow: hidden;
		&:hover {
			background-color: #BF0300;
		}
    }
	& hr {
		width: 1px;
		min-width: 1px;
		height: 40px;
		flex-shhrink: 0;
		background: #E10600;
		border: none;
	}
	& > div {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        overflow: hidden;
        overflow-x: auto;
        scrollbar-width: none;
        -ms-overflow-style: none;
        &::-webkit-scrollbar {
        	display: none;
        }
		& > div {
	        width: auto;
	        display: flex;
	        flex-direction: row;
	        flex-wrap: nowrap;
	        gap: 10px;
	        & > button {
        		display: flex;
        		flex-direction: column;
        		align-items: flex-start;
        		background-color: rgba(0, 0, 0, .75);
        		border: 1px solid rgba(255, 255, 255, .5);
        		border-radius: 999px;
        		cursor: pointer;
        		padding: 1px 25px 5px 25px;
        		gap: 0;
        		transition: all .25s ease;
        		overflow: hidden;
        		&:disabled {
        		    cursor: not-allowed;
		        }
        		&:hover:not(:disabled):not(.active) {
        			background-color: #000;
        			border: 1px solid #FFF;
        			transform: scale(.95);
        		}
        		&.active {
        		    border: 1px solid #E10600;
        		    pointer-events: none !important;
            		 & p {
            		    color: #E10600;
            		}
            		&:hover {
            			background-color: #000;
            			transform: scale(.95);
            		}
        		}
        		& p {
        		    font-size: 1rem;
        		    color: #FFF;
        		    white-space: nowrap;
        		}
        		& b {
        		    font-size: 12px;
        		    color: #999;
        		    white-space: nowrap;
        		}
	        }
		}
	}
}
main {
	width: 100%;
	display: flex;
	align-items: flex-start;
	position: relative;
	background-color: #000;
	gap: 0;
	transition: all .25s ease-in-out;
	overflow-x: hidden;
	&.open {
		box-shadow: 10px 10px 10px 10px rgba(0, 0, 0, .25);
		transform: translateX(-70%);
	}
}
canvas {
	opacity: .75;
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    display: block;
	z-index: 0;
}
div.top {
	--progress: 0deg;
	opacity: 0;
	display: flex;
	position: fixed;
	bottom: 50px;
	right: 50px;
	border-radius: 50%;
	background-color: #E10600;
	background:
		conic-gradient(
			from 0deg,
			#E10600 var(--progress),
			rgba(0, 0, 0, .5) 0deg
		);
	cursor: pointer;
	padding: 5px;
	z-index: 20;
	overflow: hidden;
	/* -webkit-box-reflect : below 1px linear-gradient(transparent, #0002); */
	transition:
		opacity 0.25s ease,
	    transform 0.25s ease;
	pointer-events: none;
	&:hover {
		transform: scale(1.05);
	}
	&.show {
		opacity: 1;
		pointer-events: auto;
	}
	& .material-symbols-outlined {
		border-radius: 50%;
		background-color: #FFF;
		font-size: 35px;
		font-variation-settings:
			'opsz' 35;
		color: #000;
		transform: translateX(-.5px);
	}
}
img.bg {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    display: block;
    object-fit: cover;
    filter: blur(5px);
    -webkit-filter: blur(5px);
	pointer-events: none;
	z-index: 0;
}
div.hero {
	width: 100%;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	overflow: hidden;
	padding: 0 10%;
	gap: 40px;
	z-index: 1;
	&.min {
		height: 40vh;
		-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: 100% 100%;
        mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%);
        mask-repeat: no-repeat;
        mask-size: 100% 100%;
		& img.h {
		    width: 100%;
			top: auto;
			bottom: 0;
		}
	}
	&.l {
		height: 70vh;
        &.h {
    		-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%);
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-size: 100% 100%;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%);
            mask-repeat: no-repeat;
            mask-size: 100% 100%;
	    }
		& img.h {
		    width: 100%;
			top: auto;
			bottom: 0;
		}
	}
	&.story {
		height: 75vh;
		-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: 100% 100%;
        mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%);
        mask-repeat: no-repeat;
        mask-size: 100% 100%;
        gap: 0;
		& img.h {
		    width: 100%;
			top: auto;
			bottom: 0;
		}
	}
	&.spacer {
	    height: 60px;
	}
	& img.h {
		inset: 0;
		width: 100%;
		height: 100%;
		position: absolute;
		object-fit: cover;
		pointer-events: none;
		z-index: -1;
	}
    & video {
        opacity: 0;
        inset: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        object-fit: cover;
        object-position: center;
        transition: all .25s ease;
        filter: brightness(0.5);
        -webkit-filter: brightness(0.5);
        pointer-events: none;
        z-index: -1;
        &.ready {
            opacity: 1;
        }
    }
    & picture {
        inset: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        pointer-events: none;
        z-index: -1;
        & img {
            width: 100% !important;
            height: 100% !important;
            object-fit: cover;
            object-position: center;
            filter: brightness(0.5);
            -webkit-filter: brightness(0.5);
            pointer-events: none;
        }
    }
	& > div {
		display: flex;
		gap: 20px;
		opacity: 0;
		transform: scale(10);
		transition: all .75s cubic-bezier(.75, 0, 1, 1);
		&.int {
			opacity: 1;
			transform: scale(1);
		}
	}
	& img:not(.h) {
		width: 200px;
		pointer-events: none;
	}
	& h1 {
		width: 100%;
		text-align: center;
		font-size: 5rem;
		font-weight: 900;
		color: white;
		/* text-shadow: */
			/* -1px -1px 0 rgba(255,255,255,0.5), */
			/* -2px -2px 0 rgba(255,255,255,0.25), */
			/* 1px 1px 0 rgba(0,0,0,0.5), */
			/* 2px 2px 0 rgba(0,0,0,0.25); */
		text-transform: uppercase;
		z-index: 1;
	}
	& h2 {
	    opacity: 0;
		width: 100%;
		text-align: center;
		font-size: 2.5rem;
		color: white;
		letter-spacing: -0.025em;
		transition: all .5s ease;
		&.int {
	        opacity: 1;
	    }
	}
	& h3 {
		width: 100%;
		text-align: center;
		font-size: 2rem;
		color: white;
		letter-spacing: -0.025em;
	}
	& p {
	    width: 100%;
	    text-align: center;
	}
	& > span {
		display: flex;
		flex-direction: row;
		gap: 20px;
	}
	& a {
		text-decoration: none;
	}
	& button {
	    opacity: 0;
		height: 60px;
		display: inline-flex;
		flex-direction: row;
		position: relative;
		background-color: #E10600;
		border: none;
		border-radius: 10px;
		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
		font-size: 2rem;
		color: #FFF;
		cursor: pointer;
		padding: 10px 30px;
		transition: all .25s ease, transform .5s ease-out;
		transform: translateY(100%);
		overflow: hidden;
		&:hover {
			background-color: #BF0300;
		}
		&.int {
		    opacity: 1;
		    transform: translateY(0);
		}
		& .material-symbols-outlined {
			font-size: 2rem;
			font-variation-settings:
				'opsz' 32;
		}
		&.secondary {
			background-color: rgba(0, 0, 0, .75);
			border: none;
			color: #FFF;
			&:hover {
				background-color: #000;
			}
			& * {
				color: #FFF;
			}
		}
		& span {
			transform: rotate(-45deg);
		}
		&.shiny {
			&::before {
				content: '';
				position: absolute;
				top: 0;
				left: -100px;
				width: 100px;
				height: 100%;
				background-image: linear-gradient(
					120deg,
					rgba(255, 255, 255, 0) 30%,
					rgba(255, 255, 255, 0.25),
					rgba(255, 255, 255, 0) 70%
				);
				animation: shine 3s infinite linear;
				z-index: 10;
			}
		}
	}
	& > div.s {
		opacity: 0;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		gap: 20px;
		transition: all .25s ease-out;
		transform: translateY(100%);
		&.int {
		    opacity: 1;
	        transform: translateY(0);
	    }
		& > span {
			display: flex;
			flex-direction: row;
			gap: 5px;
			& p {
				transform: translateY(-1px);
			}
		}
	}
}
main > section {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	padding: 20px 10%;
	gap: 20px;
	z-index: 1;
	&.s {
		background-color: rgba(0, 0, 0, .5);
		padding: 20px 0;
		padding-bottom: 0;
		& > div {
			padding: 20px 10% !important;
		}
	}
	&.weekly {
	    height: 50px;
	    min-height: 50px;
	    max-height: 50px;
	    overflow: visible;
	    z-index: 2;
	}
	&.sb {
	    min-height: calc(100vh - 60px);
	}
	&.center {
	    justify-content: center;
	}
	& > div:not(:where(.pin-spacer)) {
	    opacity: 0;
		width: 100%;
		display: flex;
		justify-content: flex-start;
		position: relative;
		background: #000;
		border: 1px solid rgba(255, 255, 255, .5);
		border-radius: 20px;
		padding: 20px;
		overflow: hidden;
		filter: blur(10px);
		-webkit-filter: blur(10px);
		transition: all .5s ease-in-out;
		transform: translateY(-25px);
		z-index: 1;
    	&.int {
            opacity: 1;
            transform: translateY(0);
            filter: none;
            -webkit-filter: none;
        }
        &.min {
            background-color: transparent;
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
            border: 0;
            border-radius: 0;
            padding: 0;
            &::before {
                display: none;
            }
            &::after {
                display: none;
            }
        }
	}
	& h2 {
		text-align: center;
		font-size: 3rem;
		color: #FFF;
		letter-spacing: -0.025em;
		backface-visibility: visible;
		&.left {
			width: 100%;
			text-align: left;
		}
		&.color {
			color: #B36BFF;
		}
		&.auto {
		    text-align: start;
		}
	}
	& h3 {
		text-align: center;
		font-size: 2rem;
		color: #FFF;
		letter-spacing: -0.025em;
		&.center {
	        width: 100%;
	    }
		&.left {
			width: 100%;
			text-align: left;
			& i {
				text-align: left;
			}
		}
		& i {
			text-align: center;
			font-size: 2rem;
			font-weight: 100;
			font-style: italic;
			color: #FFF;
		}
	}
	& h4 {
		text-align: center;
		font-size: 1.5rem;
		color: #FFF;
		letter-spacing: -0.025em;
		&.left {
			width: 100%;
			text-align: left;
			& i {
				text-align: left;
			}
		}
	}
	span.title {
		width: 100%;
		display: flex;
		gap: 10px;
		& > div {
			width: 100%;
			display: flex;
			flex-direction: row;
			gap: 10px;
			& hr {
				width: 5%;
				height: 1px;
				min-height: 1px;
				background: #E10600;
				border: none;
			}
			& h3 {
				white-space: nowrap;
				color: #E10600;
			}
		}
		& h2 {
			text-align: center;
			text-transform: uppercase;
		}
		& p {
			text-align: center;
		}
	}
	& button:not(:where(#map *)) {
		display: inline-flex;
		flex-direction: row;
		position: relative;
		background-color: #FFF;
		border: none;
		border-radius: 10px;
		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
		font-size: 1rem;
		color: #000;
		cursor: pointer;
		padding: 10px 20px;
		transition: all 0.25s ease;
		overflow: hidden;
		&:hover {
			background-color: rgba(255, 255, 255, 0.75);
		}
		& * {
			font-size: 2rem;
			color: #000;
		}
		&.secondary {
			background-color: rgba(255, 255, 255, 0.25);
			border: 1px solid #FFF;
			color: #FFF;
			&:hover {
				background-color: rgba(255, 255, 255, 0.5);
			}
			& * {
				color: #FFF;
			}
		}
		&.shiny {
			&::before {
				content: '';
				position: absolute;
				top: 0;
				left: -100px;
				width: 100px;
				height: 100%;
				background-image: linear-gradient(
					120deg,
					rgba(255, 255, 255, 0) 30%,
					rgba(255, 255, 255, 0.25),
					rgba(255, 255, 255, 0) 70%
				);
				animation: shine 3s infinite linear;
				z-index: 10;
			}
		}
	}
	& div.whatis {
		flex-direction: row;
		& div {
			flex: 1;
			display: flex;
			&:first-child {
				justify-content: flex-start;
			}
			& p {
				width: 100%;
				text-align: left;
				color: #DDD;
			}
			& b {
				font-weight: 700;
			}
			& img {
			    opacity: 0;
				width: auto;
				height: 300px;
				transition: all .5s ease-out;
				transform: translateY(100%);
				pointer-events: none;
				&.int {
			        opacity: 1;
			        transform: translateY(0);
			    }
			}
		}
	}
	& swiper-container.services {
		width: 100%;
		/* -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%); */
		/* -webkit-mask-repeat: no-repeat; */
		/* -webkit-mask-size: 100% 100%; */
		/* mask-image: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%); */
		/* mask-repeat: no-repeat; */
		/* mask-size: 100% 100%; */
		& swiper-slide {
			flex: 1;
			width: 400px;
			height: 500px;
			display: flex;
			justify-content: flex-start;
			position: relative;
			background-color: #000;
			border: 1px solid rgba(255, 255, 255, .5);
			border-radius: 20px;
			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
			margin-right: 20px;
			gap: 0;
			transition: all .25s ease;
			overflow: hidden;
			&:last-child {
	            margin: 0;
	        }
			&:hover {
				transform: scale(.95);
				border: 1px solid #FFF;
			}
			& img {
				width: 100%;
				height: 50%;
				object-fit: cover;
				pointer-events: none;
			}
			& h3 {
				max-width: 75%;
				position: absolute;
				top: 10px;
				left: 10px;
				text-align: left;
				font-size: 2rem;
				font-weight: 700;
				color: #E10600;
				text-shadow:
				    1px 1px 1px #000,
				    2.5px 2.5px 5px #000,
				    -2.5px -2.5px 5px #000;
				transition: all 0.25s ease;
				z-index: 1;
			}
			& .material-symbols-outlined {
				position: absolute;
				top: 50%;
				left: 50%;
				background-color: rgba(0, 0, 0, .5);
				border: 1px solid rgba(255, 255, 255, .5);
				border-radius: 50%;
				font-size: 50px;
				padding: 20px;
				backdrop-filter: blur(5px);
				-webkit-backdrop-filter: blur(5px);
				transform: translate(-50%, -50%);
				font-variation-settings:
					'wght' 400,
					'opsz' 50;
				transition: all .25s ease;
			}
			& h2 {
				font-size: 1.5rem;
				font-weight: 700;
				padding: 20px;
				padding-top: 60px;
			}
			& hr {
				width: 33%;
				height: 2px;
				min-height: 2px;
				background: #E10600;
				border: none;
			}
			& p {
				text-align: center;
				color: #DDD;
				padding: 20px;
			}
		}
	}
	& swiper-container.weekly {
		width: 100%;
		transform: scale(.9) translateY(-150px) translateX(-20%) rotateZ(-15deg);
		pointer-events: none !important;
		& swiper-slide {
            width: 100%;
            display: flex;
			& img {
				width: 400px;
				pointer-events: none;
			}
			& div {
			    max-width: 300px;
			    position: absolute;
			    top: calc(50% + 15px);
			    left: calc(50% + 20px);
			    transform: translate(-50%, -50%);
			}
			& p {
			    text-align: center;
			    color: #111;
			    font-size: 1.25rem;
			    font-weight: 600;
			    text-transform: uppercase;
			}
			& b {
			    color: #111;
			    font-size: 1.25rem;
			    font-weight: 200;
			}
		}
	}
	& swiper-container.galery {
		width: 100%;
		& swiper-slide {
			aspect-ratio: 3/2;
			width: 500px;
			height: auto;
			display: flex;
			border-radius: 20px;
			overflow: hidden;
			& img {
				width: 100%;
				object-fit: cover;
				pointer-events: none;
			}
		}
	}
	& div.whatsinstoreforyou {
		background-color: #000;
		& > span {
			width: 100%;
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			gap: 0;
			& .material-symbols-outlined {
				font-size: 40px;
				font-variation-settings:
					'FILL' 0,
					'wght' 400,
					'opsz' 40;
				color: #E10600;
			}
			& hr {
				width: 1px;
				height: 40px;
				background: #E10600;
				border: none;
				margin-left: 10px;
			}
			& > div {
				display: flex;
				align-items: flex-start;
				gap: 0px;
				padding-left: 20px;
			}
			& h3 {
				text-align: left;
				font-size: 1.5rem;
				font-weight: 700;
				text-transform: uppercase;
			}
			& p {
				color: #DDD;
			}
		}
		& > hr {
			width: 100%;
			height: 1px;
			min-height: 1px;
			background: rgba(255, 255, 255, .5);
			border: none;
		}
	}
	& div.whoscalling {
		& > span {
		    opacity: 0;
			width: 100%;
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			gap: 0;
			transition: all .25s ease;
			transform: translateX(-90%);
			&:hover {
    			& .material-symbols-outlined {
    				border: 1px solid #000;
    				box-shadow: 1px 1px 10px 1px #E10600;
    				transform: scale(.9);
    			}
	        }
	        &.int {
	            opacity: 1;
	            transform: translateX(0);
	        }
			& .material-symbols-outlined {
				background-color: #000;
				border: 1px solid rgba(255, 255, 255, .5);
				border-radius: 50%;
				font-size: 50px;
				padding: 20px;
				font-variation-settings:
					'wght' 400,
					'opsz' 50;
				color: #E10600;
				transition: all .25s ease;
			}
			& > div {
				display: flex;
				align-items: flex-start;
				gap: 0px;
				padding-left: 20px;
			}
			& h3 {
				text-align: left;
				font-size: 1.5rem;
				font-weight: 700;
				text-transform: uppercase;
			}
			& p {
				color: #DDD;
			}
		}
	}
	& div.locationfilter {
	    gap: 10px;
	    & > span {
	        width: 100%;
	        display: flex;
	        flex-direction: row;
	        justify-content: flex-start;
	        gap: 5px;
	        & .material-symbols-outlined {
	            font-size: 2rem;
            	font-variation-settings:
            		'opsz' 32;
	            color: #E10600;
	        }
	        & h4 {
	            white-space: nowrap;
	        }
	    }
	    & > div {
	        width: 100%;
	        display: flex;
	        flex-direction: row;
	        justify-content: flex-start;
	        gap: 10px;
	        & > button {
        		display: flex;
        		flex-shrink: 0;
        		background-color: #E10600;
        		border: none;
        		border-radius: 20px;
        		color: #FFF;
        		cursor: pointer;
        		padding: 11px 25px;
        		transition: all .25s ease;
        		overflow: hidden;
        		&:hover {
        			background-color: #BF0300;
        		}
	        }
			& hr {
				width: 1px;
				min-width: 1px;
				height: 40px;
				flex-shhrink: 0;
				background: #E10600;
				border: none;
			}
        	& > div {
    	        width: 100%;
    	        display: flex;
    	        flex-direction: row;
    	        justify-content: flex-start;
    	        overflow: hidden;
    	        overflow-x: auto;
    	        scrollbar-width: none;
	            -ms-overflow-style: none;
                &::-webkit-scrollbar {
                	display: none;
                }
        		& > div {
        	        width: auto;
        	        display: flex;
        	        flex-direction: row;
        	        flex-wrap: nowrap;
        	        gap: 10px;
        	        & > button {
                		display: flex;
                		flex-direction: column;
                		align-items: flex-start;
                		background-color: rgba(0, 0, 0, .75);
                		border: 1px solid rgba(255, 255, 255, .5);
                		border-radius: 999px;
                		cursor: pointer;
                		padding: 1px 25px 5px 25px;
                		gap: 0;
                		transition: all .25s ease;
                		overflow: hidden;
                		&:disabled {
                		    cursor: not-allowed;
        		        }
                		&:hover:not(:disabled):not(.active) {
                			background-color: #000;
                			border: 1px solid #FFF;
                			transform: scale(.95);
                		}
                		&.active {
                		    border: 1px solid #E10600;
                    		 & p {
                    		    color: #E10600;
                    		}
                    		&:hover {
                    			background-color: #000;
                    			transform: scale(.95);
                    		}
                		}
                		& p {
                		    font-size: 1rem;
                		    color: #FFF;
                		    white-space: nowrap;
                		}
                		& b {
                		    font-size: 12px;
                		    color: #999;
                		    white-space: nowrap;
                		}
        	        }
        		}
        	}
	    }
	}
	& div.story {
		display: flex;
		& > div {
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			flex-direction: row;
			justify-content: flex-start;
			align-items: stretch;
			& > div {
			    opacity: 0;
				width: calc((100% - 40px) / 3);
				display: flex;
				position: relative;
				background-color: #000;
				border: 1px solid rgba(255, 255, 255, .5);
				border-radius: 20px;
				gap: 0;
				transition: all .25s ease;
				transform: translateX(90%);
				overflow: hidden;
				&.int {
	                opacity: 1;
	                transform: translateX(0);
	            }
				& * {
					z-index: 1;
				}
				&:hover {
				    border: 1px solid #FFF;
					& img {
						transform: scale(1.25);
					}
				}
				& img {
					inset: 0;
					width: 100%;
					height: 100%;
					position: absolute;
					object-fit: cover;
					transition: all .25s ease;
					z-index: 0;
					pointer-events: none;
				}
				& > i {
				    display: flex;
					position: absolute;
					top: -1px;
					left: 20px;
					background-color: #E10600;
					font-size: 1.5rem;
					font-weight: 900;
					color: #FFF;
					padding: 10px;
					padding-bottom: 30px;
					text-transform: uppercase;
					box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
					clip-path: polygon(
                        0 0,
                        100% 0,
                        100% 100%,
                        50% calc(100% - 20px),
                        0 100%
                    );
				}
				& > span {
					display: flex;
					align-items: flex-end;
					position: absolute;
					top: 20px;
					right: 20px;
					gap: 0;
					& i {
						display: flex;
						flex-direction: row;
						background-color: rgba(0, 0, 0, .5);
						border: 1px solid rgba(255, 255, 255, .5);
						border-radius: 20px;
						padding: 5px 10px;
						gap: 5px;
						backdrop-filter: blur(10px);
						-webkit-backdrop-filter: blur(10px);
						& .material-symbols-outlined {
							color: #E10600;
						}
						& p {
							text-transform: uppercase;
						}
					}
					& h3 {
						font-weight: 700;
						text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
					}
				}
				& > div {
					height: 100%;
					width: 100%;
					display: flex;
					justify-content: space-between;
					background: linear-gradient(
						to bottom,
						transparent 0%,
						rgba(0, 0, 0, 1) 50%,
						rgba(0, 0, 0, 1) 100%
					);
					padding: 20px;
					padding-top: 50%;
					gap: 20px;
					& > div {
						width: 100%;
						display: flex;
						gap: 20px;
						& > h2,
						& > p {
							width: 100%;
							text-align: left;
						}
						& > h2 {
							font-weight: 700;
							text-transform: uppercase;
							text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
						}
						& > p {
							color: #DDD;
						}
						& > span {
							width: 100%;
							display: grid;
							grid-template-columns: repeat(3, 1fr);
							gap: 10px;
							& i {
								display: flex;
								flex-direction: row;
								gap: 5px;
								& .material-symbols-outlined {
									color: #E10600;
								}
								& p {
									transform: translateY(-1px);
								}
							}
						}
						& button {
							width: 100%;
							display: inline-flex;
							flex-direction: row;
							position: relative;
							background-color: #FFF;
							border: none;
							border-radius: 10px;
							box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
							color: #111;
							cursor: pointer;
							padding: 10px 30px;
							transition: all 0.25s ease;
							overflow: hidden;
							&:disabled {
						        background-color: rgba(255, 255, 255, .5);
						        cursor: not-allowed;
						    }
							&:hover:not(:disabled) {
								background-color: rgba(255, 255, 255, .75);
							}
						}
					}
				}
			}	
		}
		& > a {
		    text-decoration: none;
		}
		& > a > button,
		& > button {
			display: inline-flex;
			flex-direction: row;
			position: relative;
			background-color: #E10600;
			border: none;
			border-radius: 10px;
			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
			color: #FFF;
			text-transform: uppercase;
			cursor: pointer;
			padding: 10px 30px;
			transition: all 0.25s ease;
			overflow: hidden;
			&:hover {
				background-color: #BF0300;
			}
		}
	}
	& div.storypage {
	    display: flex;
		background-color: #000;
		border-radius: 20px;
		padding: 20px;
		& > i {
			display: flex;
			flex-direction: row;
			background-color: rgba(0, 0, 0, .5);
			border: 1px solid rgba(255, 255, 255, .5);
			border-radius: 20px;
			padding: 5px 10px;
			gap: 5px;
			backdrop-filter: blur(10px);
			-webkit-backdrop-filter: blur(10px);
			& .material-symbols-outlined {
				color: #E10600;
			}
			& p {
				text-transform: uppercase;
			}
		}
		& > span {
			width: 100%;
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 10px;
			& i {
				display: flex;
				flex-direction: row;
				gap: 5px;
				& .material-symbols-outlined {
					color: #E10600;
				}
				& p {
					transform: translateY(-1px);
				}
			}
		}
		& > h3 {
			font-weight: 700;
			text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
		}
        & > button {
			display: inline-flex;
			flex-direction: row;
			position: relative;
			background-color: #E10600;
			border: none;
			border-radius: 10px;
			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
			color: #FFF;
			text-transform: uppercase;
			cursor: pointer;
			padding: 10px 30px;
			transition: all 0.25s ease;
			overflow: hidden;
			&:hover {
				background-color: #BF0300;
			}
		}
		& > h4 {
		    width: 100%;
		    text-align: left;
		}
		& > p {
		    width: 100%;
		    text-align: left;
		    color: #DDD;
		}
	}
	& div.storymap {
	    & > p {
	        width: 100%;
	        text-align: left;
	        color: #E10600;
	    }
    	& div#map {
    	    aspect-ratio: 16/9;
    	    width: 100%;
    	    border-radius: 20px;
            & .gm-style,
            & .gm-style > div,
            & .gm-style-pbc {
                background: #000 !important;
            }
    	    & .gm-style-iw-d * {
    	        color: #E10600 !important;
    	    }
    	}
    	& > span {
    	    display: flex;
    	    flex-direction: row;
    	}
	}
	& div.pay {
	    width: 100%;
	    display: flex;
	    background-color: #000;
	    border: 1px solid rgba(255, 255, 255, .5);
	    border-radius: 20px;
	    padding: 20px;
	    transition: all .25s ease;
	    &:hover {
	        border: 1px solid #FFF;
	    }
	    & form {
    	    width: 100%;
    	    display: flex;
    	    & > b {
    	        width: 100%;
    			text-align: left;
    			font-weight: 700;
    			color: #E10600;
    			text-transform: uppercase;
    			white-space: nowrap;
    	    }
    	    & > p {
    	        width: 100%;
    	        text-align: left;
    	        &.info {
    	            text-transform: uppercase;
    	            color: #DDD;
    	        }
    	        & > b {
    	            font-weight: 700;
    	        }
    	    }
    	    & > div {
    	        width: 100%;
    	        display: flex;
    	        background-color: rgba(255, 255, 255, .1);
    	        border: 1px solid rgba(255, 255, 255, .5);
    	        border-radius: 10px;
    	        gap: 10px;
    	        &.total {
    	            width: 100%;
    	            padding: 10px;
    	            & span {
    	                width: 100%;
    	                display: flex;
    	                align-items: flex-start;
    	                gap: 0;
    	            }
    	            & i {
    	                width: 100%;
    	                display: flex;
    	                flex-direction: row;
    	                gap: 5px;
    	                align-items: flex-end;
            			& hr {
            				width: 100%;
            				height: 1px;
            				min-height: 1px;
            				background: transparent;
            				border: none;
            				border-bottom: 1px dotted #DDD;
            			}
            			& p {
            			    font-weight: 700;
            			    white-space: nowrap;
            			}
    	            }
    	        }
    	        &.headcount {
    	            background: transparent;
    	            border: none;
    	            & > div {
            	        width: 100%;
            	        display: flex;
            	        flex-direction: row;
            	        justify-content: space-between;
            	        background-color: rgba(255, 255, 255, .1);
            	        border: 1px solid rgba(255, 255, 255, .5);
            	        border-radius: 10px;
            	        cursor: pointer;
            	        padding: 10px;
            	        gap: 10px;
            	        transition: all .25s ease;
            	        overflow: hidden;
            	        &:hover {
    	                    border: 1px solid #E10600;
    	                }
    	                &.active {
    	                    border: 1px solid #E10600;
    	                    & h4 {
    	                        color: #E10600;
    	                    }
    	                }
				        & h4 {
							font-weight: 700;
							text-transform: uppercase;
							transition: all .25s ease;
	                    }
                        & h3 {
                            font-weight: 700;
                			text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
                        }
                        & span {
                            display: flex;
                            gap: 0;
                            & p {
                                color: #999;
                            }
                        }
    	            }
    	        }
    	    }
    		fieldset {
    			width: 100%;
    			position: relative;
    			border: none;
    			outline: none;
    			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
    			overflow: hidden;
    			& input {
    				width: 100%;
    				background-color: rgba(255, 255, 255, .1);
    				border: 1px solid rgba(255, 255, 255, .5);
    				border-radius: 10px;
    				outline: none;
    				padding: 10px;
    				transition: all 0.25s ease;
    				&::placeholder {
    					color: rgba(255, 255, 255, 0.5);
    				}
    				&:hover {
    				    border: 1px solid #FFF;
    				    & ~ label {
        					color: #FFF;
        				}
    				}
    				&:focus {
    					border: 1px solid #FFF;
    				}
    				&:focus + label, &:not(:placeholder-shown) + label {
    					top: 10px;
    					font-size: 10px;
    					color: #E10600;
    				}
    				&:-webkit-autofill {
    					-webkit-text-fill-color: #FFF !important;
    					transition: background-color 9999s ease-in-out 0s;
    				}
    				&.pac {
    				    border-radius: 10px 10px 0 0;
    				}
    			}
    			& label {
    				position: absolute;
    				top: 50%;
    				left: 10px;
    				color: rgba(255, 255, 255, 0.5);
    				transition: all 0.25s ease;
    				transform: translateY(-50%);
    				pointer-events: none;
    			}
    		}
        	& label.checkbox {
        	    width: 100%;
        		display: flex;
        		flex-direction: row;
        		justify-content: flex-start;
        		align-items: flex-start;
        		cursor: pointer;
                &:not(:has(input[name="vat"])) p {
                    transform: translateY(-5px);
                }
        		& input {
        			display: none;
        			&:checked + span {
        				background-color: #E10600;
        				border: 1px solid #E10600;
        			}
        			&:checked +span::after {
        				opacity: 1;
        			}
        		}
        		& span {
        			width: 25px;
        			height: 25px;
        			min-width: 25px;
        			min-height: 25px;
        			display: inline-block;
        			position: relative;
        			background-color: rgba(255, 255, 255, .1);
        			border: 1px solid rgba(255, 255, 255, .5);
        			border-radius: 5px;
        			transition: all 0.25s ease;
        			&::after {
        				content: '';
        				opacity: 0;
        				width: 5px;
        				height: 10px;
        				display: block;
        				position: absolute;
        				top: calc(50% - 1px);
        				left: 50%;
        				box-sizing: border-box;
        				border: solid #FFF;
        				border-width: 0 2px 2px 0;
        				transition: all 0.25s ease;
        				transform: translate(-50%, -50%) rotate(45deg);
        				transform-origin: center;
        			}
        			&:hover {
        			    border: 1px solid #FFF;
        				transform: scale(1.05);
        			}
        		}
        	}
            & i#form-message {
                width: 100%;
                position: relative;
                text-align: left;
                color: #FFF;
                padding: 10px;
                &::before {
                    content: '';
                    inset: 0;
                    position: absolute;
                    background-color: rgba(255, 255, 255, .1);
                    border-left: 3px solid #FFF;
                    border-radius: 10px;
                    box-shadow:
                        0 24px 70px rgba(0, 0, 0, 0.55),
                        inset 0 1px 0 rgba(255, 255, 255, 0.08);
                    backdrop-filter: blur(22px) saturate(140%);
                    -webkit-backdrop-filter: blur(22px) saturate(140%);
                    z-index: -1;
                }
                &.success {
                    color: #00FF73;
                    &::before {
                        border-color: #00FF73;
                        background-color: rgba(0, 255, 115, .1);
                    }
                }
                &.error {
                    color: #FF4D4D;
                    &::before {
                        border-color: #FF4D4D;
                        background-color: rgba(255, 77, 77, .1);
                    }
                }
            }
            & i#voucher-message {
                width: 100%;
                position: relative;
                text-align: left;
                color: #FFF;
                padding: 10px;
                &::before {
                    content: '';
                    inset: 0;
                    position: absolute;
                    background-color: rgba(255, 255, 255, .1);
                    border-left: 3px solid #FFF;
                    border-radius: 10px;
                    box-shadow:
                        0 24px 70px rgba(0, 0, 0, 0.55),
                        inset 0 1px 0 rgba(255, 255, 255, 0.08);
                    backdrop-filter: blur(22px) saturate(140%);
                    -webkit-backdrop-filter: blur(22px) saturate(140%);
                    z-index: -1;
                }
                &.success {
                    color: #00FF73;
                    &::before {
                        border-color: #00FF73;
                        background-color: rgba(0, 255, 115, .1);
                    }
                }
                &.error {
                    color: #FF4D4D;
                    &::before {
                        border-color: #FF4D4D;
                        background-color: rgba(255, 77, 77, .1);
                    }
                }
            }
	    }
    	& button {
    	    width: auto;
    	    height: 100%;
    		display: inline-flex;
    		flex-direction: row;
    		background-color: #E10600;
    		border: none;
    		border-radius: 10px;
    		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
    		font-size: 1rem;
    		color: #FFF;
    		cursor: pointer;
    		padding: 10px 20px;
    		transition: all 0.25s ease;
    		overflow: hidden;
    		&:hover:not(:disabled) {
    			background-color: #BF0300;
    		}
    		&.szep {
    		    background-color: #111;
    		    & img {
    		        width: 40px;
    		        pointer-events: none;
    		    }
        		&:hover:not(:disabled) {
        			background-color: #222;
        		}
    		}
    		&:disabled {
    		    opacity: .5;
    		    cursor: not-allowed;
    		}
    	}
    	& button[type="submit"] {
    	    min-width: 286px;
    	}
    	& i.securepay {
    	    width: auto;
    	    display: flex;
    	    flex-direction: row;
    	    position: relative;
            background: linear-gradient(
                to bottom,
                #6a6a6a 0%,
                #2f2f2f 10%,
                #050505 38%,
                #000000 100%
            );
    	    border: 1px solid rgba(255, 255, 255, .5);
    	    border-radius: 5px;
            box-shadow:
                0 0 10px rgba(255, 255, 255, .1),
                inset 0 2px 2px rgba(255, 255, 255, .35),
                inset 0 -10px 18px rgba(0, 0, 0, .75),
                0 8px 20px rgba(0, 0, 0, .45);
    	    padding: 10px 20px;
    	    gap: 10px;
    	    overflow: hidden;
            &::before {
                content: "";
                height: calc(100% - 5px);
                position: absolute;
                left: 7.5px;
                right: 7.5px;
                top: 5px;
                background: linear-gradient(
                    to bottom,
                    rgba(255, 255, 255, .075) 0%,
                    rgba(255, 255, 255, .035) 50%,
                    rgba(255, 255, 255, 0) 100%
                );
                border-radius: 999px;
                pointer-events: none;
    	    }
    	    & .material-symbols-outlined {
				font-size: 50px;
				font-variation-settings:
					'opsz' 50;
                color: #00FF73;
			}
    	    & div {
    	        display: flex;
    	        align-items: flex-start;
    	        gap: 0;
    	        &:last-child {
    	            align-items: center;
    	            gap: 5px;
    	        }
        	    & b {
        	        width: auto;
        	        text-align: left;
        	        font-size: .5rem;
        	        font-weight: 600;
        	        text-transform: uppercase;
        	        white-space: nowrap;
        	    }
        	    & p {
        	        width: auto;
        	        text-align: left;
        	        font-size: .5rem;
        	        color: #DDD;
        	    }
    	        & img {
    	            height: 10px;
    	            pointer-events: none;
    	        }
    	    }
        	& hr {
        		width: 1px;
        		min-width: 1px;
        		height: 50px;
        		background: #FFF;
        		border: none;
        	}
    	}
	}
	& div.calculator {
	    width: 100%;
	    display: flex;
	    position: relative;
	    background-color: #000;
	    border: 1px solid rgba(255, 255, 255, .5);
	    border-radius: 20px;
	    padding: 20px;
	    transition: all .25s ease;
	    &:hover {
	        border: 1px solid #FFF;
	    }
	    & form {
    	    width: 100%;
    	    display: flex;
            &:not(.show-more) .customnext ~ * {
                display: none !important;
            }
            &.show-more .customnext {
                display: none !important;
            }
    	    & > b {
    	        width: 100%;
    			text-align: left;
    			font-weight: 700;
    			color: #E10600;
    			text-transform: uppercase;
    			white-space: nowrap;
    	    }
    	    & > p {
    	        width: 100%;
    	        text-align: left;
    	        &.info {
    	            text-transform: uppercase;
    	            color: #DDD;
    	        }
    	        & > b {
    	            font-weight: 700;
    	        }
    	    }
    	    & > div {
    	        width: 100%;
    	        display: flex;
    	        background-color: rgba(255, 255, 255, .1);
    	        border: 1px solid rgba(255, 255, 255, .5);
    	        border-radius: 10px;
    	        gap: 10px;
    	        &.customselector {
    	            display: flex;
    	            flex-direction: row;
    	            padding: 10px;
    	            position: relative;
    	            cursor: pointer;
    	            transition: border-color .25s ease, box-shadow .25s ease;
    	            z-index: 100;
    	            &:hover {
    	                border-color: #FFF;
    	            }
    	            & > div {
    	                width: calc(100% - 20px);
    	                display: flex;
    	                & > div {
    	                    width: 100%;
    	                    display: flex;
    	                    flex-direction: row;
    	                    justify-content: flex-start;
    	                    gap: 10px;
    	                    & img {
                                width: 70px;
                                height: 70px;
                                object-fit: cover;
                                border-radius: 28%;
                                corner-shape: squircle;
    	                    }
    	                    & span {
    	                        display: flex;
    	                        align-items: flex-start;
    	                        gap: 0;
    	                        & h4 {
    	                            font-size: 1rem;
    	                            font-weight: 600;
    	                            text-transform: uppercase;
    	                            text-align: left;
    	                        }
    	                        & p {
    	                            text-align: left;
    	                            color: #DDD;
    	                        }
    	                    }
    	                }
                        & > i {
                            width: calc(100% + 2px);
                            display: none;
                            flex-direction: column;
                            position: absolute;
                            top: 100%;
                            left: -1px;
                            background-color: #1A1A1A;
    	                    border: 1px solid #FFF;
                            border-radius: 0 0 10px 10px;
                            border-top-color: rgba(255, 255, 255, .5);
                            gap: 0;
                            overflow: hidden;
        	                & > div {
        	                    width: 100%;
        	                    display: flex;
        	                    flex-direction: row;
        	                    justify-content: flex-start;
        	                    cursor: pointer;
        	                    padding: 10px;
        	                    gap: 10px;
        	                    transition: all .25s ease;
        	                    &:hover {
                                    background-color: #000;
                                }
        	                    & img {
                                    width: 70px;
                                    height: 70px;
                                    object-fit: cover;
                                    border-radius: 28%;
                                    corner-shape: squircle;
        	                    }
        	                    & span {
        	                        display: flex;
        	                        align-items: flex-start;
        	                        gap: 0;
        	                        & h4 {
        	                            font-size: 1rem;
        	                            font-weight: 600;
        	                            text-transform: uppercase;
        	                            text-align: left;
        	                        }
        	                        & p {
        	                            text-align: left;
        	                            color: #DDD;
        	                        }
        	                    }
        	                }
                        }
    	            }
            	    & .material-symbols-outlined {
        				font-size: 40px;
        				font-variation-settings:
        					'wght' 100,
        					'opsz' 40;
        				transition: all .25s ease;
        			}
                    &.open {
                        border-bottom: 0;
                        border-color: #FFF;
                        border-radius: 10px 10px 0 0;
                        box-shadow: 0 0 0 9999px rgba(0, 0, 0, .75);
                        & > div > i {
                            display: flex;
                        }
                        & > .material-symbols-outlined {
                            transform: rotate(180deg);
                        }
                    }
    	        }
    	        &.custommap {
    	            display: flex;
    	            flex-direction: row;
    	            justify-content: space-between;
    	            background-color: #000;
    	            padding: 10px;
    	            & > div {
    	                display: flex;
    	                align-items: flex-start;
    	                gap: 0;
    	            }
    	        }
    	        &.customquant {
    	            width: auto;
    	            display: flex;
    	            background-color: rgba(255, 255, 255, .1);
    	            padding: 0;
    	            gap: 0;
    	            transition: all .25s ease;
    	            overflow: hidden;
    	            &:hover,
    	            &:focus-within {
    	                border-color: #FFF;
    	            }
    	            & input {
        			    width: 100px;
        				background-color: transparent;
        				border: none;
        				outline: none;
        				box-shadow: none;
        				text-align: center;
        				font-weight: 700;
        				padding: 10px;
        				transition: all 0.25s ease;
        				overflow: hidden;
    	            }
    	            & button {
    	                border: 0;
    	                border-radius: 0;
    	            }
    	        }
    	        &.customprices {
    	            display: flex;
    	            flex-direction: row;
    	            position: relative;
    	            background-color: #000;
    	            border: none;
    	            overflow: hidden;
    	            gap: 5px;
    	            & > div {
    	                flex: 1;
    	                width: 100%;
    	                display: flex;
    	                border: 1px solid rgba(255, 255, 255, .5);
    	                border-radius: 10px;
    	                padding: 10px;
    	                gap: 0;
    	                &:first-child {
    	                    border-radius: 10px 30px 30px 10px;
    	                }
    	                &:last-child {
    	                    border-radius: 30px 10px 10px 30px;
    	                }
    	                & span {
    	                    display: flex;
    	                    flex-direction: row;
    	                    gap: 0;
    	                }
    	                & h3 {
                            font-size: 1rem;
                            font-weight: 700;
                            text-transform: uppercase;
                            text-align: center;
                            transition: all .25s ease;
                        }
                        & h4 {
                            font-size: 1rem;
                            text-transform: uppercase;
                            text-align: center;
                            transition: all .25s ease;
                        }
                        & p {
                            text-align: center;
                            color: #DDD;
                        }
    	            }
    	            & > i {
    	                width: 40px;
    	                aspect-ratio: 1/1;
    	                display: flex;
    	                position: absolute;
    	                top: 50%;
    	                left: 50%;
    	                background-color: #000;
    	                border: 1px solid rgba(255, 255, 255, .5);
    	                border-radius: 50%;
    	                box-shadow: 1px 1px 10px 1px rgba(255, 255, 255, 0.25);
    	                transform: translate(-50%, -50%);
    	                z-index: 2;
    	                & p {
    	                    transform: translateY(-1px);
    	                }
    	            }
    	        }
    	        &.customdiscount {
    	            display: flex;
    	            flex-direction: row;
    	            background-color: #000;
    	            overflow: hidden;
    	            gap: 0;
    	            & > div {
    	                flex: 1;
    	                width: 100%;
    	                display: flex;
    	                border-right: 1px solid rgba(255, 255, 255, .5);
    	                padding: 5px;
    	                gap: 0;
    	                transition: all .25s ease;
    	                overflow: hidden;
    	                &:last-child {
    	                    border: none;
    	                }
    	                &.active {
                            background: radial-gradient(
                                circle at center,
                                #000 0%,
                                #000 35%,
                                rgba(255, 6, 0, .5) 100%
                            );
    	                    & h4 {
    	                        color: #E10600;
    	                    }
    	                }
                        & h4 {
                            font-size: 1rem;
                            font-weight: 600;
                            text-transform: uppercase;
                            text-align: center;
                            transition: all .25s ease;
                        }
                        & p {
                            text-align: center;
                            color: #DDD;
                        }
    	            }
    	        }
    	        &.customquant2 {
    	            width: auto;
    	            display: flex;
    	            background-color: rgba(255, 255, 255, .1);
    	            padding: 0;
    	            gap: 0;
    	            transition: all .25s ease;
    	            overflow: hidden;
    	            &:hover,
    	            &:focus-within {
    	                border-color: #FFF;
    	            }
    	            & input {
        			    width: 100px;
        				background-color: transparent;
        				border: none;
        				outline: none;
        				box-shadow: none;
        				text-align: center;
        				font-weight: 700;
        				padding: 10px;
        				transition: all 0.25s ease;
        				overflow: hidden;
                        appearance: textfield;
                        -moz-appearance: textfield;
                        &::-webkit-inner-spin-button,
                        &::-webkit-outer-spin-button {
                            -webkit-appearance: none;
                            margin: 0;
                        }
    	            }
    	            & button {
    	                border: 0;
    	                border-radius: 0;
    	            }
    	        }
    	        &.customgroup {
    	            display: lfex;
    	            flex-direction: row;
    	            justify-content: flex-start;
    	            background-color: #000;
    	            border-color: #E10600;
    	            padding: 10px;
            	    & .material-symbols-outlined {
        				font-size: 60px;
        				font-variation-settings:
        					'wght' 300,
        					'opsz' 60;
        				color: #E10600;
        			}
        			& > div {
        			    display: flex;
        			    align-items: flex-start;
        			    gap: 0;
                        & h4 {
                            font-size: 1rem;
                            font-weight: 700;
                            text-transform: uppercase;
                            text-align: left;
                            color: #E10600;
                            transition: all .25s ease;
                        }
                        & p {
                            text-align: left;
                            color: #DDD;
                        }
        			}
    	        }
    	        &.customprice {
    	            display: flex;
    	            background-color: transparent;
    	            border: none;
    	            gap: 0;
                    & h3 {
                        font-weight: 600;
                        text-align: center;
                        color: #E10600;
                    }
                    & p {
                        text-align: center;
                        color: #DDD;
                    }
    	        }
    	        &.customnext {
    	            background-color: transparent;
    	            border: none;
    	        }
    	        &.total {
    	            width: 100%;
    	            padding: 10px;
    	            & span {
    	                width: 100%;
    	                display: flex;
    	                align-items: flex-start;
    	                gap: 0;
    	            }
    	            & i {
    	                width: 100%;
    	                display: flex;
    	                flex-direction: row;
    	                gap: 5px;
    	                align-items: flex-end;
            			& hr {
            				width: 100%;
            				height: 1px;
            				min-height: 1px;
            				background: transparent;
            				border: none;
            				border-bottom: 1px dotted #DDD;
            			}
            			& p {
            			    font-weight: 700;
            			    white-space: nowrap;
            			}
    	            }
    	        }
    	    }
			& > hr {
				width: 100%;
				height: 1px;
				min-height: 1px;
				background: transparent;
				border: none;
				border-bottom: 1px solid rgba(255, 255, 255, .5);
			}
    		fieldset {
    			width: 100%;
    			position: relative;
    			border: none;
    			outline: none;
    			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
    			overflow: hidden;
    			& input {
    				width: 100%;
    				background-color: rgba(255, 255, 255, .1);
    				border: 1px solid rgba(255, 255, 255, .5);
    				border-radius: 10px;
    				outline: none;
    				padding: 10px;
    				transition: all 0.25s ease;
    				&::placeholder {
    					color: rgba(255, 255, 255, 0.5);
    				}
    				&:hover {
    				    border: 1px solid #FFF;
    				    & ~ label {
        					color: #FFF;
        				}
    				}
    				&:focus {
    					border: 1px solid #FFF;
    				}
    				&:focus + label, &:not(:placeholder-shown) + label {
    					top: 10px;
    					font-size: 10px;
    					color: #E10600;
    				}
    				&:-webkit-autofill {
    					-webkit-text-fill-color: #FFF !important;
    					transition: background-color 9999s ease-in-out 0s;
    				}
    				&.pac {
    				    border-radius: 10px 10px 0 0;
    				}
    			}
    			& label {
    				position: absolute;
    				top: 50%;
    				left: 10px;
    				color: rgba(255, 255, 255, 0.5);
    				transition: all 0.25s ease;
    				transform: translateY(-50%);
    				pointer-events: none;
    			}
    		}
        	& label.checkbox {
        	    width: 100%;
        		display: flex;
        		flex-direction: row;
        		justify-content: flex-start;
        		align-items: flex-start;
        		cursor: pointer;
                &:not(:has(input[name="vat"])) p {
                    transform: translateY(-5px);
                }
        		& input {
        			display: none;
        			&:checked + span {
        				background-color: #E10600;
        				border: 1px solid #E10600;
        			}
        			&:checked +span::after {
        				opacity: 1;
        			}
        		}
        		& span {
        			width: 25px;
        			height: 25px;
        			min-width: 25px;
        			min-height: 25px;
        			display: inline-block;
        			position: relative;
        			background-color: rgba(255, 255, 255, .1);
        			border: 1px solid rgba(255, 255, 255, .5);
        			border-radius: 5px;
        			transition: all 0.25s ease;
        			&::after {
        				content: '';
        				opacity: 0;
        				width: 5px;
        				height: 10px;
        				display: block;
        				position: absolute;
        				top: calc(50% - 1px);
        				left: 50%;
        				box-sizing: border-box;
        				border: solid #FFF;
        				border-width: 0 2px 2px 0;
        				transition: all 0.25s ease;
        				transform: translate(-50%, -50%) rotate(45deg);
        				transform-origin: center;
        			}
        			&:hover {
        			    border: 1px solid #FFF;
        				transform: scale(1.05);
        			}
        		}
        	}
            & i#form-message {
                width: 100%;
                position: relative;
                text-align: left;
                color: #FFF;
                padding: 10px;
                &::before {
                    content: '';
                    inset: 0;
                    position: absolute;
                    background-color: rgba(255, 255, 255, .1);
                    border-left: 3px solid #FFF;
                    border-radius: 10px;
                    box-shadow:
                        0 24px 70px rgba(0, 0, 0, 0.55),
                        inset 0 1px 0 rgba(255, 255, 255, 0.08);
                    backdrop-filter: blur(22px) saturate(140%);
                    -webkit-backdrop-filter: blur(22px) saturate(140%);
                    z-index: -1;
                }
                &.success {
                    color: #00FF73;
                    &::before {
                        border-color: #00FF73;
                        background-color: rgba(0, 255, 115, .1);
                    }
                }
                &.error {
                    color: #FF4D4D;
                    &::before {
                        border-color: #FF4D4D;
                        background-color: rgba(255, 77, 77, .1);
                    }
                }
            }
	    }
    	& button {
    	    width: auto;
    	    height: 100%;
    		display: inline-flex;
    		flex-direction: row;
    		background-color: #E10600;
    		border: none;
    		border-radius: 10px;
    		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
    		font-size: 1rem;
    		color: #FFF;
    		cursor: pointer;
    		padding: 10px 20px;
    		transition: all 0.25s ease;
    		overflow: hidden;
    		&:hover:not(:disabled) {
    			background-color: #BF0300;
    		}
    		&:disabled {
    		    opacity: .5;
    		    cursor: not-allowed;
    		}
    	}
	}
	& div.reviews {
    	& span.totalReviews {
    	    width: auto;
    	    display: flex;
    	    flex-direction: row;
    	    & > span {
    	        width: auto;
    	        display: flex;
    	        flex-direction: row;
    	        gap: 0;
    	    }
    	    & .material-symbols-outlined {
    	        width: auto;
            	font-size: 40px;
            	font-variation-settings:
            		'FILL' 1,
            		'opsz' 40;
            	color: gold;
            	transform: translateY(2px);
            }
        }
    	& swiper-container.reviews {
    		width: 100%;
    		& .swiper-wrapper {
                pointer-events: none !important;
                z-index: 0;
            }
    		& swiper-slide {
    			width: 50%;
    			display: flex;
    			background-color: #000;
    			border: 1px solid #E10600;
    			border: 1px solid rgba(255, 255, 255, .5);
    			border-radius: 20px;
    			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
    			gap: 20px;
    			padding: 20px;
    			transition: all .25s ease;
    			overflow: hidden;
    	        & div.stars {
    	            width: auto;
    	            display: flex;
    	            flex-direction: row;
    	            gap: 5px;
    	            & .material-symbols-outlined {
    	                width: auto;
                    	font-size: 30px;
                    	font-variation-settings:
                    		'FILL' 1,
                    		'opsz' 30;
                    	color: #E10600;
                    }
    	        }
    	        & > p {
    			    width: auto;
    			    max-width: 100%;
    			    display: -webkit-box;
    			    color: #DDD;
                    -webkit-line-clamp: 3;
                    -webkit-box-orient: vertical;
                    white-space: normal;
                    word-break: break-word;
                    overflow: hidden;
                    text-overflow: ellipsis;
    	        }
    	        & div.details {
    	            width: 100%;
    	            display: flex;
    	            flex-direction: row;
    	            justify-content: flex-start;
    	            & img {
    	                aspect-ratio: 1/1;
    	                width: 50px;
    	            }
    	            & span {
    	                display: flex;
    	                align-items: flex-start;
    	                gap: 0;
    	                & b {
    	                    font-weight: 700;
    	                    color: #E10600;
    	                }
    	            }
    	        }
    		}
    	}
		& > button {
			display: inline-flex;
			flex-direction: row;
			position: relative;
			background-color: #FFF;
			border: none;
			border-radius: 10px;
			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
			font-size: 1rem !important;
			color: #111;
			text-transform: uppercase;
			cursor: pointer;
			padding: 10px 30px;
			gap: 10px;
			transition: all 0.25s ease;
			overflow: hidden;
			&:hover {
				background-color: rgba(255, 255, 255, .75);
			}
			& img {
			    width: 16px;
			    pointer-events: none;
			}
		}
		& > p {
		    width: 100%;
		    text-align: left;
		    color: #999;
		    & a {
		        color: #999;
		    }
		}
	}
	& div.newsletter {
	    width: auto;
	    display: flex;
	    flex-direction: row;
	    background-color: #000;
	    border: 1px solid #E10600;
	    border-radius: 20px;
	    padding: 20px;
	    & > div {
	        display: flex;
	        flex-direction: row;
	        &:first-child {
    			& .material-symbols-outlined {
    				font-size: 50px;
    				font-variation-settings:
    					'opsz' 50;
    				color: #E10600;
    			}
	            & i {
            	    display: flex;
            	    align-items: flex-start;
            	    gap: 0;
            	    & h4 {
	                    text-align: left;
	                    white-space: nowrap;
	                }
            	    & p {
            	        text-align: left;
	                    color: #DDD;
	                }
            	}
	        }
	        &:last-child {
	            flex-direction: column;
	            gap: 10px;
        		fieldset {
        			width: 100%;
        			position: relative;
        			border: none;
        			outline: none;
        			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
        			overflow: hidden;
        			& input {
        				width: 100%;
        				background-color: rgba(255, 255, 255, .1);
        				border: 1px solid rgba(255, 255, 255, .5);
        				border-radius: 10px;
        				outline: none;
        				padding: 10px;
        				transition: all 0.25s ease;
        				&::placeholder {
        					color: rgba(255, 255, 255, 0.5);
        				}
        				&:hover {
        				    border: 1px solid #FFF;
        				    & ~ label {
            					color: #FFF;
            				}
        				}
        				&:focus {
        					border: 1px solid #FFF;
        				}
        				&:focus + label, &:not(:placeholder-shown) + label {
        					top: 10px;
        					font-size: 10px;
        					color: #E10600;
        				}
        				&:-webkit-autofill {
        					-webkit-text-fill-color: #FFF !important;
        					transition: background-color 9999s ease-in-out 0s;
        				}
        			}
        			& label {
        				position: absolute;
        				top: 50%;
        				left: 10px;
        				color: rgba(255, 255, 255, 0.5);
        				transition: all 0.25s ease;
        				transform: translateY(-50%);
        				pointer-events: none;
        			}
        		}
            	& button {
            	    width: 100%;
            		display: inline-flex;
            		flex-direction: row;
            		position: relative;
            		background-color: #E10600;
            		border: none;
            		border-radius: 10px;
            		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
            		font-size: 1rem;
            		color: #FFF;
            		cursor: pointer;
            		padding: 10px 30px;
            		transition: all 0.25s ease;
            		overflow: hidden;
            		&:hover {
            			background-color: #BF0300;
            		}
            	}
	        }
            & label.checkbox {
                width: 100%;
            	display: flex;
            	flex-direction: row;
            	justify-content: flex-start;
            	cursor: pointer;
            	gap: 10px;
            	& input {
            		display: none;
            		&:checked + span {
            			background-color: #E10600;
            			border: 1px solid #E10600;
            		}
            		&:checked +span::after {
            			opacity: 1;
            		}
            	}
            	& span {
            		width: 25px;
            		height: 25px;
            		min-width: 25px;
            		min-height: 25px;
            		display: inline-block;
            		position: relative;
            		background-color: rgba(255, 255, 255, .1);
            		border: 1px solid rgba(255, 255, 255, .5);
            		border-radius: 5px;
            		transition: all 0.25s ease;
            		&::after {
            			content: '';
            			opacity: 0;
            			width: 5px;
            			height: 10px;
            			display: block;
            			position: absolute;
            			top: calc(50% - 1px);
            			left: 50%;
            			box-sizing: border-box;
            			border: solid #FFF;
            			border-width: 0 2px 2px 0;
            			transition: all 0.25s ease;
            			transform: translate(-50%, -50%) rotate(45deg);
            			transform-origin: center;
            		}
            		&:hover {
            		    border: 1px solid #FFF;
            			transform: scale(1.05);
            		}
            	}
            }
	    }
	}
    & i#newsletter-message {
        width: 100%;
        max-width: 1101px;
        position: relative;
        text-align: left;
        color: #FFF;
        padding: 10px;
        &::before {
            content: '';
            inset: 0;
            position: absolute;
            background-color: rgba(255, 255, 255, .1);
            border-left: 3px solid #FFF;
            border-radius: 10px;
            box-shadow:
                0 24px 70px rgba(0, 0, 0, 0.55),
                inset 0 1px 0 rgba(255, 255, 255, 0.08);
            backdrop-filter: blur(22px) saturate(140%);
            -webkit-backdrop-filter: blur(22px) saturate(140%);
            z-index: -1;
        }
        &.success {
            color: #00FF73;
            &::before {
                border-color: #00FF73;
                background-color: rgba(0, 255, 115, .1);
            }
        }
        &.error {
            color: #FF4D4D;
            &::before {
                border-color: #FF4D4D;
                background-color: rgba(255, 77, 77, .1);
            }
        }
    }
	& div.importantinformations {
	    position: relative;
    	& hr {
    		width: 1px;
    		min-width: 1px;
    		height: calc(100% - 92px);
    		position: absolute;
    		top: 46px;
    		left: 46px;
    		background: #E10600;
    		border: none;
    		z-index: -1;
    	}
		& > span {
			width: 100%;
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			gap: 0;
			&:hover {
    			& .material-symbols-outlined {
    				border: 1px solid #000;
    				box-shadow: 1px 1px 10px 1px #E10600;
    				transform: scale(.9);
    			}
	        }
			& .material-symbols-outlined {
				background-color: #000;
				border: 1px solid rgba(255, 255, 255, .5);
				border-radius: 50%;
				font-size: 50px;
				padding: 20px;
				font-variation-settings:
					'wght' 400,
					'opsz' 50;
				color: #E10600;
				transition: all .25s ease;
			}
			& > div {
				display: flex;
				align-items: flex-start;
				gap: 0px;
				padding-left: 20px;
			}
			& h3 {
				text-align: left;
				font-size: 1.5rem;
				font-weight: 700;
				text-transform: uppercase;
			}
			& p {
				color: #DDD;
			}
		}
	}
	& div.gameplay {
		& > span {
			width: 100%;
			display: flex;
			flex-direction: row;
			align-items: flex-start;
			justify-content: flex-start;
			background-color: #000;
			border-radius: 20px;
			padding: 20px;
			gap: 0;
			transition: all .25s ease;
			&:hover:not(.active) {}
	        &.active {
	            transform: scale(1.05);
	        }
			& h2 {
				font-weight: 900;
				color: #E10600;
				text-transform: uppercase;
			}
			& > div {
				display: flex;
				align-items: flex-start;
				gap: 0px;
				padding-left: 20px;
			}
			& h3 {
				text-align: left;
				font-size: 1.5rem;
				font-weight: 700;
				text-transform: uppercase;
			}
			& p {
				color: #DDD;
			}
		}
		& > hr {
			width: 100%;
			height: 1px;
			min-height: 1px;
			background: rgba(255, 255, 255, .5);
			border: none;
		}
	}
	& div.playarea {
	    width: 100%;
	    display: flex;
	    position: relative;
	    padding-top: 20px !important;
	    & h4,
	    & p {
	        width: 100%;
	        display: none;
	        text-align: center;
	    }
	    & p {
	        height: 1px;
	        overflow: visible;
	    }
        & div.phone {
        	aspect-ratio: 1316 / 2674;
        	width: 25%;
        	position: relative;
        	z-index: 3;
            & img.frame {
                inset: 0;
                width: 100%;
                height: 100%;
                position :absolute;
                object-fit: contain;
                z-index: 16;
                pointer-events: none;
            }
            & img.screen {
                position:absolute;
            	border-radius: 0 0 20px 20px;
                left: 5.3%;
                top: 9.1%;
                width: 89.6%;
                height: auto;
                &.a1 { z-index: 15; }
                &.a2 { z-index: 14; }
                &.a3 { z-index: 13; }
                &.a4 { z-index: 12; }
                &.a5 { z-index: 11; }
                &.a6 { z-index: 10; }
                &.a7 { z-index: 9; }
                &.a8 { z-index: 8; }
                &.a9 { z-index: 7; }
                &.a10 { z-index: 6; }
                &.a11 { z-index: 5; }
                &.a12 { z-index: 4; }
                &.a12 { z-index: 3; }
                &.a13 { z-index: 2; }
                &.a14 { z-index: 1; }
                &.a15 { z-index: 0; }
            }
        }
        & img.a16l {
        	aspect-ratio: 1316 / 2674;
        	width: 20%;
        	position: absolute;
        	top: 50%;
        	left: -100%;
        	transform: translate(-50%, -50%);
        	z-index: 2;
        }
        & img.a16r {
        	aspect-ratio: 1316 / 2674;
        	width: 20%;
        	position: absolute;
        	top: 50%;
        	right: -100%;
        	transform: translate(50%, -50%);
        	z-index: 2;
        }
        & img.a17l {
        	aspect-ratio: 1316 / 2674;
        	width: 20%;
        	position: absolute;
        	top: 50%;
        	left: -100%;
        	transform: translate(-50%, -50%);
        }
        & img.a17r {
        	aspect-ratio: 1316 / 2674;
        	width: 20%;
        	position: absolute;
        	top: 50%;
        	right: -100%;
        	transform: translate(50%, -50%);
        }
	}
	& div.ranking {
	    width: 100%;
	    display: flex;
	    & table {
	        width: 100%;
	        table-layout: fixed;
	        border: none;
	        border-collapse: separate;
	        border-spacing: 0 10px;
	        & * {
	            text-align: center;
	        }
	        & tbody tr {
	            &:hover td {
	                background-color: rgba(255, 255, 255, .1);
	            }
	            &:nth-child(1) td:not([colspan]) {
	                &:first-child {
	                    font-size: 25px;
	                    color: gold;
	                    border-left: 1px solid gold;
                        & .material-symbols-outlined {
                        	color: gold;
                        }
	                }
	                &:last-child {
	                    border-right: 1px solid gold;
	                }
	                border-top: 1px solid gold;
	                border-bottom: 1px solid gold;
	            }
	            &:nth-child(2) td {
	                &:first-child {
	                    font-size: 25px;
	                    color: silver;
	                    border-left: 1px solid silver;
                        & .material-symbols-outlined {
                        	color: silver;
                        }
	                }
	                &:last-child {
	                    border-right: 1px solid silver;
	                }
	                border-top: 1px solid silver;
	                border-bottom: 1px solid silver;
	            }
                &:nth-child(3) td {
	                &:first-child {
	                    font-size: 25px;
	                    color: #CD7F32;
	                    border-left: 1px solid #CD7F32;
                        & .material-symbols-outlined {
                        	color: #CD7F32;
                        }
	                }
	                &:last-child {
	                    border-right: 1px solid #CD7F32;
	                }
	                border-top: 1px solid #CD7F32;
	                border-bottom: 1px solid #CD7F32;
	            }
                & .material-symbols-outlined {
                	font-size: 25px;
                	font-variation-settings:
                	    'FILL' 1,
                		'opsz' 25;
                	transform: translateY(3px);
                }
	        }
	        & th {
	            font-weight: 700;
	        }
	        & td {
	            align-self: center;
	            background-color: #000;
	            padding: 10px;
	            transition: all .25s ease;
	            &:first-child {
	                font-weight: 900;
	                border-radius: 20px 0 0 20px;
	            }
                &:nth-child(2) {
                    white-space: normal;
                    overflow-wrap: anywhere;
                    word-break: break-word;
                }
	            &:last-child {
	                border-radius: 0 20px 20px 0;
	            }
	            &[colspan] {
	                text-align: center;
                    font-weight: 400;
                    color: #DDD;
	                border-radius: 20px; 
	            }
	        }
	    }
	}
	& div.giftcard {
	    width: 100%;
	    display: flex;
	    background-color: #000;
	    border: 1px solid rgba(255, 255, 255, .5);
	    border-radius: 20px;
	    padding: 20px;
	    transition: all .25s ease;
	    &:hover {
	        border: 1px solid #FFF;
	    }
	    & form {
    	    width: 100%;
    	    display: flex;
    	    & > b {
    	        width: 100%;
    			text-align: left;
    			font-weight: 700;
    			color: #E10600;
    			text-transform: uppercase;
    			white-space: nowrap;
    	    }
    	    & > p {
    	        width: 100%;
    	        text-align: left;
    	        & > b {
    	            font-weight: 700;
    	        }
    	    }
    	    & > div {
    	        width: 100%;
    	        display: flex;
    	        background-color: rgba(255, 255, 255, .1);
    	        border: 1px solid rgba(255, 255, 255, .5);
    	        border-radius: 10px;
    	        gap: 10px;
    	        &.gift {
    	            flex-direction: row;
    	            justify-content: space-between;
    	            padding: 10px;
    	            &.active {
    	                border: 1px solid #E10600;
    	            }
    				& > span {
    				    width: auto;
    					display: flex;
    					&:first-child {
    				        flex-direction: column;
    				        align-items: flex-start;
    				        gap: 0;
    				        & h4 {
    				            text-align: left;
    							font-weight: 700;
    							text-transform: uppercase;
    							text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
    	                    }
    	                    & p {
    	                        color: #DDD;
    	                    }
    				    }
    					&:last-child {
    				        flex-direction: row;
    				        gap: 10px;
        					& h3 {
        						font-weight: 700;
        						text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
        					}
                			& .material-symbols-outlined {
                				font-size: 2rem;
                				font-variation-settings:
                					'opsz' 32;
                				color: #E10600;
                			}
    				    }
    				}
    	        }
    	        &.total {
    	            width: 100%;
    	            padding: 10px;
    	            & span {
    	                width: 100%;
    	                display: flex;
    	                align-items: flex-start;
    	                gap: 0;
    	            }
    	            & i {
    	                width: 100%;
    	                display: flex;
    	                flex-direction: row;
    	                gap: 5px;
    	                align-items: flex-end;
            			& hr {
            				width: 100%;
            				height: 1px;
            				min-height: 1px;
            				background: transparent;
            				border: none;
            				border-bottom: 1px dotted #DDD;
            			}
            			& p {
            			    font-weight: 700;
            			    white-space: nowrap;
            			}
    	            }
    	        }
    	        &.games {
    	            background: transparent;
    	            border: none;
    	            & > div {
            	        width: 100%;
            	        display: flex;
            	        position: relative;
            	        background-color: rgba(255, 255, 255, .1);
            	        border: 1px solid rgba(255, 255, 255, .5);
            	        border-radius: 10px;
            	        cursor: pointer;
            	        padding: 10px;
            	        gap: 0;
            	        transition: all .25s ease;
            	        overflow: hidden;
            	        &:hover {
    	                    border: 1px solid #E10600;
    	                    & img {
    	                        transform: scale(1.1);
    	                    }
    	                }
    	                &.active {
    	                    border: 1px solid #E10600;
    	                    & h4 {
    	                        color: #E10600;
    	                    }
    	                }
                    	& img {
                    		inset: 0;
                    		width: 100%;
                    		height: 100%;
                    		position: absolute;
                    		object-fit: cover;
                    		pointer-events: none;
                    		transition: all .25s ease;
                    		z-index: -1;
                    	}
				        & h4 {
				            width: 100%;
				            text-align: left;
							font-weight: 700;
							text-transform: uppercase;
							text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
							transition: all .25s ease;
	                    }
                        & p {
                            width: 100%;
				            text-align: left;
                            color: #DDD;
                        }
    	            }
    	        }
    	    }
    		fieldset {
    			width: 100%;
    			position: relative;
    			border: none;
    			outline: none;
    			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
    			overflow: hidden;
    			& input {
    				width: 100%;
    				background-color: rgba(255, 255, 255, .1);
    				border: 1px solid rgba(255, 255, 255, .5);
    				border-radius: 10px;
    				outline: none;
    				padding: 10px;
    				transition: all 0.25s ease;
    				&::placeholder {
    					color: rgba(255, 255, 255, 0.5);
    				}
    				&:hover {
    				    border: 1px solid #FFF;
    				    & ~ label {
        					color: #FFF;
        				}
    				}
    				&:focus {
    					border: 1px solid #FFF;
    				}
    				&:focus + label, &:not(:placeholder-shown) + label {
    					top: 10px;
    					font-size: 10px;
    					color: #E10600;
    				}
    				&:-webkit-autofill {
    					-webkit-text-fill-color: #FFF !important;
    					transition: background-color 9999s ease-in-out 0s;
    				}
    				&.pac {
    				    border-radius: 10px 10px 0 0;
    				}
    			}
    			textarea {
    				width: 100%;
    				min-height: 200px;
    				background-color: rgba(255, 255, 255, 0.1);
    				border: 1px solid rgba(255, 255, 255, 0.5);
    				border-radius: 10px;
    				outline: none;
    				padding: 15px 10px;
    				resize: vertical;
    				transition: all 0.25s ease;
    				scrollbar-width: none;
    				-ms-overflow-style: none;
    				&::-webkit-scrollbar {
    					display: none;
    				}
    				&::placeholder {
    					color: rgba(255, 255, 255, 0.5);
    				}
    				&:hover {
    				    border: 1px solid #FFF;
    				    & ~ label {
        					color: #FFF;
        				}
    				}
    				&:focus {
    					border: 1px solid #FFF;
    				}
    				&:focus + label, &:not(:placeholder-shown) + label {
    					top: 10px;
    					font-size: 10px;
    					color: #E10600;
    				}
    				&:-webkit-autofill {
    					-webkit-box-shadow: 0 0 0px 1000px white inset !important;
    					box-shadow: 0 0 0px 1000px white inset !important;
    					-webkit-text-fill-color: #000 !important;
    					transition: background-color 9999s ease-in-out 0s;
    				}
    			}
    			& label {
    				position: absolute;
    				top: 50%;
    				left: 10px;
    				color: rgba(255, 255, 255, 0.5);
    				transition: all 0.25s ease;
    				transform: translateY(-50%);
    				pointer-events: none;
    			}
    		}
        	& label.checkbox {
        	    width: 100%;
        		display: flex;
        		flex-direction: row;
        		justify-content: flex-start;
        		align-items: flex-start;
        		cursor: pointer;
                &:not(:has(input[name="vat"])) p {
                    transform: translateY(-5px);
                }
        		& input {
        			display: none;
        			&:checked + span {
        				background-color: #E10600;
        				border: 1px solid #E10600;
        			}
        			&:checked +span::after {
        				opacity: 1;
        			}
        		}
        		& span {
        			width: 25px;
        			height: 25px;
        			min-width: 25px;
        			min-height: 25px;
        			display: inline-block;
        			position: relative;
        			background-color: rgba(255, 255, 255, .1);
        			border: 1px solid rgba(255, 255, 255, .5);
        			border-radius: 5px;
        			transition: all 0.25s ease;
        			&::after {
        				content: '';
        				opacity: 0;
        				width: 5px;
        				height: 10px;
        				display: block;
        				position: absolute;
        				top: calc(50% - 1px);
        				left: 50%;
        				box-sizing: border-box;
        				border: solid #FFF;
        				border-width: 0 2px 2px 0;
        				transition: all 0.25s ease;
        				transform: translate(-50%, -50%) rotate(45deg);
        				transform-origin: center;
        			}
        			&:hover {
        			    border: 1px solid #FFF;
        				transform: scale(1.05);
        			}
        		}
        	}
	    }
    	& button {
    	    width: auto;
    	    height: 100%;
    		display: inline-flex;
    		flex-direction: row;
    		background-color: #E10600;
    		border: none;
    		border-radius: 10px;
    		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
    		font-size: 1rem;
    		color: #FFF;
    		cursor: pointer;
    		padding: 10px 20px;
    		transition: all 0.25s ease;
    		overflow: hidden;
    		&:hover:not(:disabled) {
    			background-color: #BF0300;
    		}
    		&:disabled {
    		    opacity: .5;
    		    cursor: not-allowed;
    		}
    	}
	}
	& div.redeem {
    	& div.text {
    	    width: 100%;
    	    display: flex;
    		flex-direction: row;
    		align-items: stretch;
    		& div {
    			flex: 1;
    			display: flex;
    			&:first-child {
    				justify-content: flex-start;
    			}
    			& p {
    				width: 100%;
    				text-align: left;
    				color: #DDD;
    			}
    			& b {
    				font-weight: 700;
    			}
    			& img {
    			    opacity: 0;
    				width: 100%;
                    mask-image:
                        linear-gradient(to right,
                            transparent 0%,
                            black 15%,
                            black 85%,
                            transparent 100%
                        ),
                        linear-gradient(to bottom,
                            transparent 0%,
                            black 15%,
                            black 85%,
                            transparent 100%
                        );
                    mask-composite: intersect;
                    transition: all .5s ease;
                    transform: scale(0);
    				pointer-events: none;
    				&.int {
    			        opacity: 1;
    			        transform: scale(1);
    			    }
    			}
    		}
    	}
    	& button {
    	    width: auto;
    	    height: 100%;
    		display: inline-flex;
    		flex-direction: row;
    		background-color: #E10600;
    		border: none;
    		border-radius: 10px;
    		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
    		font-size: 1rem;
    		text-transform: uppercase;
    		color: #FFF;
    		cursor: pointer;
    		padding: 10px 20px;
    		transition: all 0.25s ease;
    		overflow: hidden;
    		&:hover:not(:disabled) {
    			background-color: #BF0300;
    		}
    	}
	}
    & div.accordion {
    	width: 100%;
    	height: calc(100% - 20px);
    	display: flex;
    	justify-content: flex-start;
    	position: relative;
    	background-color: rgba(0, 0, 0, 1);
    	border: 1px solid rgba(255, 255, 255, .5);
    	border-radius: 20px;
    	padding: 20px;
    	overflow: hidden;
    	gap: 0;
    	cursor: pointer;
    	transition: all .25s ease;
    	z-index: 1;
    	&:hover {
            border: 1px solid #FFF;
        }
    	& > div:first-child {
    	    width: 100%;
    	    display: flex;
    	    flex-direction: row;
    	    justify-content: flex-start;
    	    gap: 20px;
    	    & .material-symbols-outlined {
    	        width: auto;
    	        min-width: 40px;
    	        position: relative;
    	        font-size: 40px;
            	font-variation-settings:
            		'opsz' 40;
            	border-radius: 50%;
            	transition: all .25s ease;
            	overflow: visible;
            	&::after,
            	&::before {
                    content: '';
                    position: absolute;
                    inset: 0;
                    border-radius: 50%;
                    outline: 1px solid #E10600;
                    animation: pulse 2.5s ease-out infinite;
                    transition: all .25s ease;
    	        }
    	        &::after {
    	            animation-delay: .5s;
    	        }
    	    }
    	    & h4 {
    	       text-align: left; 
    	    }
    	}
    	& > div:last-child {
    	    width: 100%;
    	    display: flex;
    	    max-height: 0;
    	    /*transition: max-height 0.25s ease-in-out;*/
    	    will-change: max-height;
    	    overflow: hidden;
    		& > hr {
    			width: 100%;
    			height: 1px;
    			min-height: 1px;
    			background: rgba(255, 255, 255, .5);
    			border: none;
    			&:first-child {
            	    opacity: 0;
            	    pointer-events: none;
            	}
    		}
    		& > p {
    		    width: 100%;
    		    text-align: left;
    		} 
    	}
    	&.open {
    	    border: 1px solid #E10600;
    	    & > div:first-child {
                & .material-symbols-outlined {
                	font-variation-settings:
                	    'FILL' 1;
                	transform: rotateZ(135deg);
                	&::after,
            	    &::before {
    	                outline: none;
    	            }
        	    }
    	    }
    	    & > div:last-child {
    	        max-height: 350px;
    	    }
    	}
    	&:hover {
    	    & > div:first-child {
                & .material-symbols-outlined {
                	background-color: rgba(255, 255, 255, 0.5);
        	    }
    	    }
    	}
    }
    & div.support {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: stretch;
        background-color: #000;
        border: 1px solid rgba(255, 255, 255, .5);
        border-radius: 20px;
        padding: 20px;
        transition: all .25 ease;
        &:hover {
            border: 1px solid #FFF;
        }
        & > div {
            flex: 1;
            width: 100%;
            display: flex;
            justify-content: space-between;
            gap: 10px;
            & > div {
                width: 100%;
                display: flex;
                gap: 10px;
                & * {
                    text-align: center;
                }
    			& .material-symbols-outlined {
    				background-color: #000;
    				border: 1px solid rgba(255, 255, 255, .5);
    				border-radius: 50%;
    				font-size: 50px;
    				padding: 20px;
    				font-variation-settings:
    					'wght' 400,
    					'opsz' 50;
    				color: #E10600;
    				transition: all .25s ease;
    			}
        		& h4 {
    				font-weight: 700;
    				text-transform: uppercase;
    			}
                & p {
                    color: #DDD;
                }
                & b {
                    font-weight: 700;
                }
            }
        	& a {
        	    width: auto;
        	    height: auto;
        		display: inline-flex;
        		flex-direction: row;
        		background-color: #E10600;
        		border: none;
        		border-radius: 999px;
        		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
        		text-decoration: none;
        		font-size: 1rem;
        		color: #FFF;
        		cursor: pointer;
        		padding: 10px 20px;
        		transition: all 0.25s ease;
        		overflow: hidden;
        		&:hover {
        			background-color: #BF0300;
        		}
        	}
        }
        & > span {
            display: flex;
            & hr {
    			width: 1px;
    			min-width: 1px;
    			height: 100px;
    			flex-shrink: 0;
    			background: #E10600;
    			border: none;
    		}
        }
    }
	& div.contact {
	    width: 100%;
	    display: flex;
	    position: relative;
    	& .material-symbols-outlined {
    		width: auto;
    		position: absolute;
    		top: 50%;
    		right: 100px;
    		text-align: center;
    		font-size: 200px;
    		font-variation-settings:
    		    'FILL' 0,
    			'opsz' 200;
    		color: #E10600;
    		transition: all .25s ease;
    		transform-style: preserve-3d;
    		animation: spin 6s linear infinite;
    		backface-visibility: visible;
    		text-shadow: 0px 0px 10px #E10600;
    		z-index: -1 !important;
    	}
	    & form {
    	    width: 50%;
    	    display: flex;
    		& fieldset {
    			width: 100%;
    			position: relative;
    			border: none;
    			outline: none;
    			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
    			overflow: hidden;
    			& input {
    				width: 100%;
    				background-color: rgba(255, 255, 255, .1);
    				border: 1px solid rgba(255, 255, 255, .5);
    				border-radius: 10px;
    				outline: none;
    				padding: 10px;
    				transition: all 0.25s ease;
    				&::placeholder {
    					color: rgba(255, 255, 255, 0.5);
    				}
    				&:hover {
    				    border: 1px solid #FFF;
    				    & ~ label {
        					color: #FFF;
        				}
    				}
    				&:focus {
    					border: 1px solid #FFF;
    				}
    				&:focus + label, &:not(:placeholder-shown) + label {
    					top: 10px;
    					font-size: 10px;
    					color: #E10600;
    				}
    				&:-webkit-autofill {
    					-webkit-text-fill-color: #FFF !important;
    					transition: background-color 9999s ease-in-out 0s;
    				}
    			}
    			textarea {
    				width: 100%;
    				min-height: 200px;
    				background-color: rgba(255, 255, 255, 0.1);
    				border: 1px solid rgba(255, 255, 255, 0.5);
    				border-radius: 10px;
    				outline: none;
    				padding: 15px 10px;
    				resize: vertical;
    				transition: all 0.25s ease;
    				scrollbar-width: none;
    				-ms-overflow-style: none;
    				&::-webkit-scrollbar {
    					display: none;
    				}
    				&::placeholder {
    					color: rgba(255, 255, 255, 0.5);
    				}
    				&:hover {
    				    border: 1px solid #FFF;
    				    & ~ label {
        					color: #FFF;
        				}
    				}
    				&:focus {
    					border: 1px solid #FFF;
    				}
    				&:focus + label, &:not(:placeholder-shown) + label {
    					top: 10px;
    					font-size: 10px;
    					color: #E10600;
    				}
    				&:-webkit-autofill {
    					-webkit-box-shadow: 0 0 0px 1000px white inset !important;
    					box-shadow: 0 0 0px 1000px white inset !important;
    					-webkit-text-fill-color: #000 !important;
    					transition: background-color 9999s ease-in-out 0s;
    				}
    			}
    			& label {
    				position: absolute;
    				top: 50%;
    				left: 10px;
    				color: rgba(255, 255, 255, 0.5);
    				transition: all 0.25s ease;
    				transform: translateY(-50%);
    				pointer-events: none;
    			}
    		}
        	& label.checkbox {
        	    width: 100%;
        		display: flex;
        		flex-direction: row;
        		justify-content: flex-start;
        		cursor: pointer;
        		& input {
        			display: none;
        			&:checked + span {
        				background-color: #E10600;
        				border: 1px solid #E10600;
        			}
        			&:checked +span::after {
        				opacity: 1;
        			}
        		}
        		& span {
        			width: 25px;
        			height: 25px;
        			min-width: 25px;
        			min-height: 25px;
        			display: inline-block;
        			position: relative;
        			background-color: rgba(255, 255, 255, .1);
        			border: 1px solid rgba(255, 255, 255, .5);
        			border-radius: 5px;
        			transition: all 0.25s ease;
        			&::after {
        				content: '';
        				opacity: 0;
        				width: 5px;
        				height: 10px;
        				display: block;
        				position: absolute;
        				top: calc(50% - 1px);
        				left: 50%;
        				box-sizing: border-box;
        				border: solid #FFF;
        				border-width: 0 2px 2px 0;
        				transition: all 0.25s ease;
        				transform: translate(-50%, -50%) rotate(45deg);
        				transform-origin: center;
        			}
        			&:hover {
        			    border: 1px solid #FFF;
        				transform: scale(1.05);
        			}
        		}
        	}
	    }
    	& button {
    	    width: auto;
    	    height: 100%;
    		display: inline-flex;
    		flex-direction: row;
    		background-color: #E10600;
    		border: none;
    		border-radius: 10px;
    		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
    		font-size: 1rem;
    		color: #FFF;
    		cursor: pointer;
    		padding: 10px 20px;
    		transition: all 0.25s ease;
    		overflow: hidden;
    		&:hover {
    			background-color: #BF0300;
    		}
    	}
	}
	& div.wearehere {
	    width: auto;
	    display: flex;
	    flex-direction: row;
	    background-color: #000;
	    border: 1px solid #E10600;
	    border-radius: 20px;
	    padding: 20px;
	    & > div {
	        display: flex;
	        flex-direction: row;
			& .material-symbols-outlined {
				font-size: 50px;
				font-variation-settings:
					'opsz' 50;
				color: #E10600;
			}
            & i {
        	    display: flex;
        	    align-items: flex-start;
        	    gap: 0;
        	    & h4 {
                    text-align: left;
                    white-space: nowrap;
                }
        	    & p {
        	        text-align: left;
                    color: #DDD;
                }
        	}
        }
    }
    div.paystatus {
		& .material-symbols-outlined {
			font-size: 100px;
			font-variation-settings:
				'opsz' 100px;
			&.success {
		        color: #00FF73;
		    }
		    &.error {
		        color: #FF4D4D;
		    }
		}
        & p {
            width: 100%;
            text-align: center;
        }
        & b {
            width: 100%;
            text-align: center;
            color: #DDD;
        }
    }
    div.countdown {
        & > p {
            text-align: center;
            color: #E10600;
        }
        & > i { 
        	--progress: 0deg;
        	aspect-ratio: 1/1;
        	width: 100px;
        	display: flex;
        	border-radius: 50%;
        	background-color: #FFF;
            background:
            	conic-gradient(
            		from 0deg,
            		rgba(0, 0, 0, .5) 0deg,
            		rgba(0, 0, 0, .5) calc(360deg - var(--progress)),
            		#FFF 0deg
            	);
        	padding: 1px;
        	transition: --progress 1s linear;
        	overflow: hidden;
        	& span {
        	    width: 100%;
        	    height: 100%;
        	    display: flex;
                background-color: #000;
                border-radius: inherit;
                & p {
                    font-size: 50px;
                    font-weight: 100;
                    z-index: 2;
                }
            }
        }
    }
    div.helpcenter {
        align-items: flex-start;
        & h4 {
            width: 100%;
            text-align: center;
        }
        & hr {
            opacity: .5;
			width: 100%;
			height: 1px;
			min-height: 1px;
			background: #FFF;
			border: none;
		}
		& iframe {
		    aspect-ratio: 16/9;
		    width: 100%;
		    border-radius: 20px;
		}
    }
    div.start {
        padding: 0 20px;
        & h2 {
            font-weight: 700;
            text-transform: uppercase;
        }
        & > p {
            width: 100%;
            text-align: center;
        }
        & i {
            width: 100%;
            max-width: 600px;
            position: relative;
            text-align: left;
            color: #FFF;
            padding: 10px;
            &::before {
                content: '';
                inset: 0;
                position: absolute;
                background-color: rgba(255, 255, 255, .1);
                border-left: 3px solid #FFF;
                border-radius: 10px;
                box-shadow:
                    0 24px 70px rgba(0, 0, 0, 0.55),
                    inset 0 1px 0 rgba(255, 255, 255, 0.08);
                backdrop-filter: blur(22px) saturate(140%);
                -webkit-backdrop-filter: blur(22px) saturate(140%);
                z-index: -1;
            }
            &.success {
                color: #00FF73;
                &::before {
                    border-color: #00FF73;
                    background-color: rgba(0, 255, 115, .1);
                }
            }
            &.error {
                color: #FF4D4D;
                &::before {
                    border-color: #FF4D4D;
                    background-color: rgba(255, 77, 77, .1);
                }
            }
        }
        & fieldset {
            width: 100%;
            max-width: 600px;
            display: flex;
            flex-direction: row;
            border: none;
            outline: none;
            gap: 10px;
            margin-bottom: 10px;
            & input {
                flex: 1;
                aspect-ratio: 1;
                width: 0;
                background: transparent;
                border: none;
                border-bottom: 3px solid #E10600;
                outline: none;
                caret-color: #E10600;
                text-align: center;
                font-size: 8vw;
                font-size: clamp(24px, 8vw, 42px);
                font-weight: 700;
                color: #E10600;
                padding-bottom: 10px;
            }
        }
        & > button {
            width: 100%;
            max-width: 600px;
			display: inline-flex;
			flex-direction: row;
			position: relative;
			background-color: #E10600;
			border: none;
			border-radius: 10px;
			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
			color: #FFF;
			text-transform: uppercase;
			cursor: pointer;
			padding: 10px 30px;
			transition: all 0.25s ease;
			overflow: hidden;
			&:hover {
				background-color: #BF0300;
			}
		}
		& span {
		    width: 100%;
		    max-width: 600px;
		    display: flex;
		    flex-direction: row;
		    gap: 20px;
		    & > button {
		        flex: 1;
		    }
		}
		& > b {
		    width: 100%;
		    text-align: center;
		    color: #DDD;
		}
    }
    div.abandoned {
        perspective: 500px;
        & > h2 {
            font-weight: 700;
            text-transform: uppercase;
            line-height: 1;
            & b {
                all: inherit;
                display: inline;
                color: #E10600;
            }
        }
        & > p {
            width: 100%;
            text-align: center;
        }
        & > hr {
			width: 50%;
			height: 1px;
			min-height: 1px;
			background: #E10600;
			border: none;
		}
		& > .material-symbols-outlined {
			background-color: #000;
			border: 1px solid #000;
			border-radius: 50%;
			box-shadow: 1px 1px 10px 1px #E10600;
			font-size: 50px;
			padding: 20px;
			font-variation-settings:
				'wght' 400,
				'opsz' 50;
			color: #E10600;
			transition: all .25s ease;
			transform-style: preserve-3d;
			animation: spin2 4s linear infinite;
    		backface-visibility: visible;
		}
		& div.total {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: stretch;
            background-color: #000;
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 20px;
            padding: 20px;
            & > span {
                flex: 1;
                min-width: 0;
		        display: flex;
		        justify-content: space-between;
		        flex-shrink: 0;
		        gap: 10px;
		        & i {
		            display: flex;
		            gap: 0;
		        }
            	& .material-symbols-outlined {
            		font-size: 50px;
            		font-variation-settings:
            			'opsz' 50;
            		color: #E10600;
            	}
            	& p {
            	    width: 100%;
            	    text-align: center;
            	    color: #E10600;
            	    text-transform: uppercase;
            	}
		    }
			& > hr {
				width: 1px;
				min-width: 1px;
				height: auto;
				background: rgba(255, 255, 255, .5);
				border: none;
			}
		}
		& div.thankyou {
            width: 100%;
            display: flex;
            background-color: #000;
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 20px;
            padding: 20px;
            & p {
		        width: 100%;
		        text-align: center;
		    }
            & hr {
    			width: 50%;
    			height: 1px;
    			min-height: 1px;
    			background: #E10600;
    			border: none;
    		}
    		& b {
    		    width: 100%;
    		    text-align: center;
    		    color: #E10600;
    		}
		}
		& div.feedback {
            width: 100%;
            display: flex;
            background-color: #000;
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 20px;
            padding: 20px;
    	    & form {
        	    width: 100%;
        	    display: flex;
        	    & > b {
        	        width: 100%;
        			text-align: left;
        			font-weight: 700;
        			color: #E10600;
        			text-transform: uppercase;
        			white-space: nowrap;
        	    }
        	    & > p {
        	        width: 100%;
        	        text-align: left;
        	        & > b {
        	            font-weight: 700;
        	        }
        	    }
        		& fieldset {
        			width: 100%;
        			position: relative;
        			border: none;
        			outline: none;
        			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
        			overflow: hidden;
        			textarea {
        				width: 100%;
        				min-height: 200px;
        				background-color: rgba(255, 255, 255, 0.1);
        				border: 1px solid rgba(255, 255, 255, 0.5);
        				border-radius: 10px;
        				outline: none;
        				padding: 15px 10px;
        				resize: vertical;
        				transition: all 0.25s ease;
        				scrollbar-width: none;
        				-ms-overflow-style: none;
        				&::-webkit-scrollbar {
        					display: none;
        				}
        				&::placeholder {
        					color: rgba(255, 255, 255, 0.5);
        				}
        				&:hover {
        				    border: 1px solid #FFF;
        				    & ~ label {
            					color: #FFF;
            				}
        				}
        				&:focus {
        					border: 1px solid #FFF;
        				}
        				&:focus + label, &:not(:placeholder-shown) + label {
        					top: 10px;
        					font-size: 10px;
        					color: #E10600;
        				}
        				&:-webkit-autofill {
        					-webkit-box-shadow: 0 0 0px 1000px white inset !important;
        					box-shadow: 0 0 0px 1000px white inset !important;
        					-webkit-text-fill-color: #000 !important;
        					transition: background-color 9999s ease-in-out 0s;
        				}
        			}
        			& label {
        				position: absolute;
        				top: 50%;
        				left: 10px;
        				color: rgba(255, 255, 255, 0.5);
        				transition: all 0.25s ease;
        				transform: translateY(-50%);
        				pointer-events: none;
        			}
        		}
            	& label.checkbox {
            	    width: 100%;
            		display: flex;
            		flex-direction: row;
            		justify-content: flex-start;
            		cursor: pointer;
            		& input {
            			display: none;
            			&:checked + span {
            				background-color: #E10600;
            				border: 1px solid #E10600;
            			}
            			&:checked +span::after {
            				opacity: 1;
            			}
            		}
            		& span {
            			width: 25px;
            			height: 25px;
            			min-width: 25px;
            			min-height: 25px;
            			display: inline-block;
            			position: relative;
            			background-color: rgba(255, 255, 255, .1);
            			border: 1px solid rgba(255, 255, 255, .5);
            			border-radius: 5px;
            			transition: all 0.25s ease;
            			&::after {
            				content: '';
            				opacity: 0;
            				width: 5px;
            				height: 10px;
            				display: block;
            				position: absolute;
            				top: calc(50% - 1px);
            				left: 50%;
            				box-sizing: border-box;
            				border: solid #FFF;
            				border-width: 0 2px 2px 0;
            				transition: all 0.25s ease;
            				transform: translate(-50%, -50%) rotate(45deg);
            				transform-origin: center;
            			}
            			&:hover {
            			    border: 1px solid #FFF;
            				transform: scale(1.05);
            			}
            		}
            	}
    	    }
        	& button {
        	    width: auto;
        	    height: 100%;
        		display: inline-flex;
        		flex-direction: row;
        		background-color: #E10600;
        		border: none;
        		border-radius: 10px;
        		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
        		font-size: 1rem;
        		color: #FFF;
        		cursor: pointer;
        		padding: 10px 20px;
        		transition: all 0.25s ease;
        		overflow: hidden;
        		&:hover:not(:disabled) {
        			background-color: #BF0300;
        		}
        		&:disabled {
        		    opacity: .5;
        		    cursor: not-allowed;
        		}
        	}
		}
    }
    div.expired {
        perspective: 500px;
        & > h2 {
            font-weight: 700;
            text-transform: uppercase;
            line-height: 1;
            & b {
                all: inherit;
                display: inline;
                color: #E10600;
            }
        }
        & > p {
            width: 100%;
            text-align: center;
        }
        & > hr {
			width: 50%;
			height: 1px;
			min-height: 1px;
			background: #E10600;
			border: none;
		}
		& > .material-symbols-outlined {
			background-color: #000;
			border: 1px solid #000;
			border-radius: 50%;
			box-shadow: 1px 1px 10px 1px #E10600;
			font-size: 50px;
			padding: 20px;
			font-variation-settings:
				'wght' 400,
				'opsz' 50;
			color: #E10600;
			transition: all .25s ease;
			transform-style: preserve-3d;
			animation: spin2 4s linear infinite;
    		backface-visibility: visible;
		}
		& div.total {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: stretch;
            background-color: #000;
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 20px;
            padding: 20px;
            & > span {
                flex: 1;
                min-width: 0;
		        display: flex;
		        justify-content: space-between;
		        flex-shrink: 0;
		        gap: 10px;
		        & i {
		            display: flex;
		            gap: 0;
		        }
            	& .material-symbols-outlined {
            		font-size: 50px;
            		font-variation-settings:
            			'opsz' 50;
            		color: #E10600;
            	}
            	& p {
            	    width: 100%;
            	    text-align: center;
            	    color: #E10600;
            	    text-transform: uppercase;
            	}
		    }
			& > hr {
				width: 1px;
				min-width: 1px;
				height: auto;
				background: rgba(255, 255, 255, .5);
				border: none;
			}
		}
		& div.thankyou {
            width: 100%;
            display: flex;
            background-color: #000;
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 20px;
            padding: 20px;
            & p {
		        width: 100%;
		        text-align: center;
		    }
            & hr {
    			width: 50%;
    			height: 1px;
    			min-height: 1px;
    			background: #E10600;
    			border: none;
    		}
    		& b {
    		    width: 100%;
    		    text-align: center;
    		    color: #E10600;
    		}
		}
		& div.feedback {
            width: 100%;
            display: flex;
            background-color: #000;
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 20px;
            padding: 20px;
    	    & form {
        	    width: 100%;
        	    display: flex;
        	    & > b {
        	        width: 100%;
        			text-align: left;
        			font-weight: 700;
        			color: #E10600;
        			text-transform: uppercase;
        	    }
        	    & > p {
        	        width: 100%;
        	        text-align: left;
        	        & > b {
        	            font-weight: 700;
        	        }
        	    }
        		& fieldset {
        			width: 100%;
        			position: relative;
        			border: none;
        			outline: none;
        			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
        			overflow: hidden;
        			textarea {
        				width: 100%;
        				min-height: 200px;
        				background-color: rgba(255, 255, 255, 0.1);
        				border: 1px solid rgba(255, 255, 255, 0.5);
        				border-radius: 10px;
        				outline: none;
        				padding: 15px 10px;
        				resize: vertical;
        				transition: all 0.25s ease;
        				scrollbar-width: none;
        				-ms-overflow-style: none;
        				&::-webkit-scrollbar {
        					display: none;
        				}
        				&::placeholder {
        					color: rgba(255, 255, 255, 0.5);
        				}
        				&:hover {
        				    border: 1px solid #FFF;
        				    & ~ label {
            					color: #FFF;
            				}
        				}
        				&:focus {
        					border: 1px solid #FFF;
        				}
        				&:focus + label, &:not(:placeholder-shown) + label {
        					top: 10px;
        					font-size: 10px;
        					color: #E10600;
        				}
        				&:-webkit-autofill {
        					-webkit-box-shadow: 0 0 0px 1000px white inset !important;
        					box-shadow: 0 0 0px 1000px white inset !important;
        					-webkit-text-fill-color: #000 !important;
        					transition: background-color 9999s ease-in-out 0s;
        				}
        			}
        			& label {
        				position: absolute;
        				top: 50%;
        				left: 10px;
        				color: rgba(255, 255, 255, 0.5);
        				transition: all 0.25s ease;
        				transform: translateY(-50%);
        				pointer-events: none;
        			}
        		}
            	& label.checkbox {
            	    width: 100%;
            		display: flex;
            		flex-direction: row;
            		justify-content: flex-start;
            		cursor: pointer;
            		& input {
            			display: none;
            			&:checked + span {
            				background-color: #E10600;
            				border: 1px solid #E10600;
            			}
            			&:checked +span::after {
            				opacity: 1;
            			}
            		}
            		& span {
            			width: 25px;
            			height: 25px;
            			min-width: 25px;
            			min-height: 25px;
            			display: inline-block;
            			position: relative;
            			background-color: rgba(255, 255, 255, .1);
            			border: 1px solid rgba(255, 255, 255, .5);
            			border-radius: 5px;
            			transition: all 0.25s ease;
            			&::after {
            				content: '';
            				opacity: 0;
            				width: 5px;
            				height: 10px;
            				display: block;
            				position: absolute;
            				top: calc(50% - 1px);
            				left: 50%;
            				box-sizing: border-box;
            				border: solid #FFF;
            				border-width: 0 2px 2px 0;
            				transition: all 0.25s ease;
            				transform: translate(-50%, -50%) rotate(45deg);
            				transform-origin: center;
            			}
            			&:hover {
            			    border: 1px solid #FFF;
            				transform: scale(1.05);
            			}
            		}
            	}
    	    }
        	& button {
        	    width: auto;
        	    height: 100%;
        		display: inline-flex;
        		flex-direction: row;
        		background-color: #E10600;
        		border: none;
        		border-radius: 10px;
        		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
        		font-size: 1rem;
        		color: #FFF;
        		cursor: pointer;
        		padding: 10px 20px;
        		transition: all 0.25s ease;
        		overflow: hidden;
        		&:hover:not(:disabled) {
        			background-color: #BF0300;
        		}
        		&:disabled {
        		    opacity: .5;
        		    cursor: not-allowed;
        		}
        	}
		}
    }
    div.end {
        perspective: 500px;
        & > h2 {
            font-weight: 700;
            text-transform: uppercase;
            line-height: 1;
            & b {
                all: inherit;
                display: inline;
                color: #E10600;
            }
        }
        & > p {
            width: 100%;
            text-align: center;
        }
        & > hr {
			width: 50%;
			height: 1px;
			min-height: 1px;
			background: #E10600;
			border: none;
		}
		& > .material-symbols-outlined {
			background-color: #000;
			border: 1px solid #000;
			border-radius: 50%;
			box-shadow: 1px 1px 10px 1px #E10600;
			font-size: 50px;
			padding: 20px;
			font-variation-settings:
			    'FILL' 1,
				'wght' 400,
				'opsz' 50;
			color: #E10600;
			transition: all .25s ease;
			transform-style: preserve-3d;
			animation: spin2 4s linear infinite;
    		backface-visibility: visible;
		}
		& div.total {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: stretch;
            background-color: #000;
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 20px;
            padding: 20px;
            & > span {
                flex: 1;
                min-width: 0;
		        display: flex;
		        justify-content: space-between;
		        flex-shrink: 0;
		        gap: 10px;
		        & i {
		            display: flex;
		            gap: 0;
		        }
            	& .material-symbols-outlined {
            		font-size: 50px;
            		font-variation-settings:
            			'opsz' 50;
            		color: #E10600;
            	}
            	& p {
            	    width: 100%;
            	    text-align: center;
            	    color: #E10600;
            	    text-transform: uppercase;
            	}
		    }
			& > hr {
				width: 1px;
				min-width: 1px;
				height: auto;
				background: rgba(255, 255, 255, .5);
				border: none;
			}
		}
		& div.thankyou {
            width: 100%;
            display: flex;
            background-color: #000;
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 20px;
            padding: 20px;
            & p {
		        width: 100%;
		        text-align: center;
		    }
            & hr {
    			width: 50%;
    			height: 1px;
    			min-height: 1px;
    			background: #E10600;
    			border: none;
    		}
    		& b {
    		    width: 100%;
    		    text-align: center;
    		    color: #E10600;
    		}
		}
		& div.feedback {
    		& button {
    			display: inline-flex;
    			flex-direction: row;
    			position: relative;
    			background-color: #FFF;
    			border: none;
    			border-radius: 10px;
    			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
    			font-size: 1rem !important;
    			color: #111;
    			text-transform: uppercase;
    			cursor: pointer;
    			padding: 10px 30px;
    			gap: 10px;
    			transition: all 0.25s ease;
    			overflow: hidden;
    			&:hover {
    				background-color: rgba(255, 255, 255, .75);
    			}
    			& img {
    			    width: 16px;
    			    pointer-events: none;
    			}
    		}
		}
		& div.scoreboard {
            width: 100%;
            display: flex;
            background-color: #000;
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 20px;
            padding: 20px;
    	    & form {
        	    width: 100%;
        	    display: flex;
        	    & > b {
        	        width: 100%;
        			text-align: left;
        			font-weight: 700;
        			color: #E10600;
        			text-transform: uppercase;
        	    }
        	    & > p {
        	        width: 100%;
        	        text-align: left;
        	        & > b {
        	            font-weight: 700;
        	        }
        	    }
        		& fieldset {
        			width: 100%;
        			position: relative;
        			border: none;
        			outline: none;
        			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
        			overflow: hidden;
        			& input {
        				width: 100%;
        				background-color: rgba(255, 255, 255, .1);
        				border: 1px solid rgba(255, 255, 255, .5);
        				border-radius: 10px;
        				outline: none;
        				padding: 10px;
        				transition: all 0.25s ease;
        				&::placeholder {
        					color: rgba(255, 255, 255, 0.5);
        				}
        				&:hover {
        				    border: 1px solid #FFF;
        				    & ~ label {
            					color: #FFF;
            				}
        				}
        				&:focus {
        					border: 1px solid #FFF;
        				}
        				&:focus + label, &:not(:placeholder-shown) + label {
        					top: 10px;
        					font-size: 10px;
        					color: #E10600;
        				}
        				&:-webkit-autofill {
        					-webkit-text-fill-color: #FFF !important;
        					transition: background-color 9999s ease-in-out 0s;
        				}
        			}
        			& label {
        				position: absolute;
        				top: 50%;
        				left: 10px;
        				color: rgba(255, 255, 255, 0.5);
        				transition: all 0.25s ease;
        				transform: translateY(-50%);
        				pointer-events: none;
        			}
        		}
            	& label.checkbox {
            	    width: 100%;
            		display: flex;
            		flex-direction: row;
            		justify-content: flex-start;
            		cursor: pointer;
            		& input {
            			display: none;
            			&:checked + span {
            				background-color: #E10600;
            				border: 1px solid #E10600;
            			}
            			&:checked +span::after {
            				opacity: 1;
            			}
            		}
            		& span {
            			width: 25px;
            			height: 25px;
            			min-width: 25px;
            			min-height: 25px;
            			display: inline-block;
            			position: relative;
            			background-color: rgba(255, 255, 255, .1);
            			border: 1px solid rgba(255, 255, 255, .5);
            			border-radius: 5px;
            			transition: all 0.25s ease;
            			&::after {
            				content: '';
            				opacity: 0;
            				width: 5px;
            				height: 10px;
            				display: block;
            				position: absolute;
            				top: calc(50% - 1px);
            				left: 50%;
            				box-sizing: border-box;
            				border: solid #FFF;
            				border-width: 0 2px 2px 0;
            				transition: all 0.25s ease;
            				transform: translate(-50%, -50%) rotate(45deg);
            				transform-origin: center;
            			}
            			&:hover {
            			    border: 1px solid #FFF;
            				transform: scale(1.05);
            			}
            		}
            	}
    	    }
        	& button {
        	    width: auto;
        	    height: 100%;
        		display: inline-flex;
        		flex-direction: row;
        		background-color: #E10600;
        		border: none;
        		border-radius: 10px;
        		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
        		font-size: 1rem;
        		color: #FFF;
        		cursor: pointer;
        		padding: 10px 20px;
        		transition: all 0.25s ease;
        		overflow: hidden;
        		&:hover:not(:disabled) {
        			background-color: #BF0300;
        		}
        		&:disabled {
        		    opacity: .5;
        		    cursor: not-allowed;
        		}
        	}
		}
        & i#scoreboard-message {
            width: 100%;
            max-width: 764px;
            position: relative;
            text-align: left;
            color: #FFF;
            padding: 10px;
            &::before {
                content: '';
                inset: 0;
                position: absolute;
                background-color: rgba(255, 255, 255, .1);
                border-left: 3px solid #FFF;
                border-radius: 10px;
                box-shadow:
                    0 24px 70px rgba(0, 0, 0, 0.55),
                    inset 0 1px 0 rgba(255, 255, 255, 0.08);
                backdrop-filter: blur(22px) saturate(140%);
                -webkit-backdrop-filter: blur(22px) saturate(140%);
                z-index: -1;
            }
            &.success {
                color: #00FF73;
                &::before {
                    border-color: #00FF73;
                    background-color: rgba(0, 255, 115, .1);
                }
            }
            &.error {
                color: #FF4D4D;
                &::before {
                    border-color: #FF4D4D;
                    background-color: rgba(255, 77, 77, .1);
                }
            }
        }
    }
    & div.impress {
        width: 100%;
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding-top: 20px;
        & * {
        	user-select: text;
        	-webkit-user-select: text;
        	-ms-user-select: text;
        }
        & div {
            display: flex;
            flex-direction: row;
            justify-content: flex-start;
            flex-wrap: wrap;
            gap: 0 5px;
            & b {
                font-weight: 600;
            }
        }
    }
    & div.privacypolicy,
    & div.tandc,
    & div.cookiepolicy {
        width: 100%;
        display: flex;
        align-items: flex-start;
        gap: 20px;
        padding: 20px 0;
        & * {
        	user-select: text;
        	-webkit-user-select: text;
        	-ms-user-select: text;
        }
        & h2 {
            width: 100%;
            text-align: left;
            font-size: 1.5rem;
            font-weight: 600;
            padding: 20px 0;
        }
        & h3 {
            width: 100%;
            text-align: left;
            font-size: 1.25rem;
            font-weight: 600;
            color: #DDD;
            padding: 10px 0;
        }
        & h4 {
            width: 100%;
            text-align: left;
            font-size: 1.1rem;
            font-weight: 600;
            color: #DDD;
            padding: 5px 0;
        }
        & > p {
            text-align: justify;
        }
        & strong {
            font-weight: 600;
        }
        & table {
            width: 100%;
            display: block;
            border-collapse: collapse;
            border-spacing: 0;
            overflow-x: auto;
            &:not(.s) td:last-child {
                font-weight: 600;
            }
            & tbody {
                width: 100%;
                display: table;
            }
            & th {
                border: 1px solid rgba(255, 255, 255, .5);
                padding: 10px;
                vertical-align: middle;
                text-align: center;
                font-weight: 600;
            }
            & td {
                border: 1px solid rgba(255, 255, 255, .5);
                padding: 10px;
                vertical-align: top;
                text-align: left;
            }
        }
        & ul {
            list-style: disc;
            padding-left: 20px;
        }
        & ol {
            list-style: lower-alpha;
            padding-left: 20px;
        }
        & li {
            display: list-item;
            &::marker {
                font-weight: 600;
            }
        }
    }
}
footer {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	background-color: #000;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 5%);
	padding: 10px;
	padding-bottom: 200px;
	z-index: 10;
	& section {
    	width: 100%;
    	display: flex;
    	flex-direction: row;
    	align-items: flex-start;
    	justify-content: space-between;
    	gap: 20px;
    	& > div {
    		display: flex;
    		align-items: flex-start;
    		justify-content: flex-start;
    		gap: 10px;
    		&.logos {
                align-items: flex-end;
                gap: 20px;
                & div {
                    display: flex;
                    flex-direction: row;
                    position: relative;
                    border: 1px solid #FFF;
                    border-radius: 10px;
                    padding: 10px 7.5px;
                    padding-top: 15px;
                    gap: 7.5px;
                    & p {
                        position: absolute;
                        top: 0;
                        left: 5px;
                        line-height: 1;
                        background: #000;
                        padding: 0 5px;
                        transform: translateY(calc(-50% - 2px));
                    }
                }
            }
    	}
    	span {
    		justify-content: flex-start;
    		gap: 10px;
    	}
    	h4 {
    		font-weight: 700;
    	}
    	a,
    	i {
    	    text-decoration: underline;
    	    cursor: pointer;
    	}
    	img.logo {
    		width: 300px;
    		pointer-events: none;
    	}
    	img.icon {
    		aspect-ratio: 1/1;
    		width: 40px;
    		pointer-events: none;
    	}
    	img.watermark {
    		width: 200px;
    		pointer-events: none;
    	}
    	img.watermark2 {
    		height: 20px;
    		pointer-events: none;
    	}
    	div.mobile {
    		display: flex;
    		flex-direction: row;
    		gap: 10px;
    	}
		fieldset {
			width: 100%;
			min-width: 350px;
			position: relative;
			border: none;
			outline: none;
			box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.25);
			overflow: hidden;
			& input {
				width: 100%;
				background-color: rgba(255, 255, 255, .1);
				border: 1px solid #E10600;
				border-radius: 10px;
				outline: none;
				padding: 10px;
				transition: all 0.25s ease;
				&::placeholder {
					color: rgba(255, 255, 255, 0.5);
				}
				&:hover {
				    & ~ label {
    					color: #FFF;
    				}
				}
				&:focus + label, &:not(:placeholder-shown) + label {
					top: 10px;
					font-size: 10px;
					color: #E10600;
				}
				&:-webkit-autofill {
					-webkit-text-fill-color: #FFF !important;
					transition: background-color 9999s ease-in-out 0s;
				}
			}
			& label {
				position: absolute;
				top: 50%;
				left: 10px;
				color: rgba(255, 255, 255, 0.5);
				transition: all 0.25s ease;
				transform: translateY(-50%);
				pointer-events: none;
			}
        	& button {
        	    width: auto;
        	    height: 100%;
        		display: inline-flex;
        		flex-direction: row;
        		position: absolute;
        		right: 0px;
        		background-color: #E10600;
        		border: none;
        		border-radius: 10px;
        		box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .25);
        		font-size: 1rem;
        		color: #FFF;
        		cursor: pointer;
        		padding: 10px;
        		transition: all 0.25s ease;
        		overflow: hidden;
        		&:hover {
        			background-color: #BF0300;
        		}
        	}
		}
        & i#footer-newsletter-message {
            width: 100%;
            max-width: 600px;
            position: relative;
            text-align: left;
            color: #FFF;
            text-decoration: none;
            padding: 10px;
            &::before {
                content: '';
                inset: 0;
                position: absolute;
                background-color: rgba(255, 255, 255, .1);
                border-left: 3px solid #FFF;
                border-radius: 10px;
                box-shadow:
                    0 24px 70px rgba(0, 0, 0, 0.55),
                    inset 0 1px 0 rgba(255, 255, 255, 0.08);
                backdrop-filter: blur(22px) saturate(140%);
                -webkit-backdrop-filter: blur(22px) saturate(140%);
                z-index: -1;
            }
            &.success {
                color: #00FF73;
                &::before {
                    border-color: #00FF73;
                    background-color: rgba(0, 255, 115, .1);
                }
            }
            &.error {
                color: #FF4D4D;
                &::before {
                    border-color: #FF4D4D;
                    background-color: rgba(255, 77, 77, .1);
                }
            }
        }
        & label.checkbox {
            width: 100%;
        	display: flex;
        	flex-direction: row;
        	justify-content: flex-start;
        	cursor: pointer;
        	gap: 10px;
        	& input {
        		display: none;
        		&:checked + span {
        			background-color: #E10600;
        			border: 1px solid #E10600;
        		}
        		&:checked +span::after {
        			opacity: 1;
        		}
        	}
        	& span {
        		width: 25px;
        		height: 25px;
        		min-width: 25px;
        		min-height: 25px;
        		display: inline-block;
        		position: relative;
        		background-color: rgba(255, 255, 255, .1);
        		border: 1px solid rgba(255, 255, 255, .5);
        		border-radius: 5px;
        		transition: all 0.25s ease;
        		&::after {
        			content: '';
        			opacity: 0;
        			width: 5px;
        			height: 10px;
        			display: block;
        			position: absolute;
        			top: calc(50% - 1px);
        			left: 50%;
        			box-sizing: border-box;
        			border: solid #FFF;
        			border-width: 0 2px 2px 0;
        			transition: all 0.25s ease;
        			transform: translate(-50%, -50%) rotate(45deg);
        			transform-origin: center;
        		}
        		&:hover {
        		    border: 1px solid #FFF;
        			transform: scale(1.05);
        		}
        	}
        }
    }
}
.pac-container {
    background-color: #FFF;
    border-radius: 0 0 10px 10px;
    border-top: 1px solid rgba(255, 255, 255, .5);
    padding: 10px;
    z-index: 100 !important;
    & * {
        color: auto;
    }
}
@media (max-width: 1250px) {
	nav {
		padding: 10px;
		& section:first-child {
			flex: 0;
		}
		& section:nth-child(2) {
			max-width: 0px !important;
		}
		& button#menu {
			display: inline !important;
		}
	}
	div#menu {
		width: 70%;
		height: auto ! important;
		display: flex !important;
		flex-direction: column;
		align-items: flex-start;
		justify-content: space-between;
		position: fixed;
		top: 60px;
		right: 0;
		background-color: transparent;
		border: none;
		border-radius: 0;
		padding: 0;
		transition: all 0.25s ease-in-out;
		transform: translateX(100%);
		overflow: hidden;
		&:hover {
			background-color: transparent;
		}
		&.open {
			transform: translateX(0);
		}
		& a {
			width: 100%;
			text-align: left;
			border-top: 1px solid #FFF;
			padding-top: 20px;
			padding-left: 20px;
			&::before {
				content: '';
			}
			&::after {
				display: none;
			}
			&:hover:not(.selected) {
				transform: none;
			}
			&:last-child {
				border-bottom: 1px solid #FFF;
				padding-bottom: 20px;
			}
			&.selected {
				font-weight: 900;
				pointer-events: none;
			}
		}
	}
	div.top {
		bottom: 20px;
		right: 20px;
	}
	div#cookies {
	    max-width: 100%;
	    top: 50%;
	    right: 20px;
	    bottom: auto;
	    transform: translateY(-150vh);
        &.open {
            transform: translateY(-50%);
        }
	    & span.left {
	        flex-direction: column;
	        & button {
	            width: 100%;
	        }
	    }
	}
    div#discount {
        max-width: 100%;
    }
	div#locationfilter {
	    padding: 10px;
	}
	div.hero {
		height: 100vh;
		padding: 0 10px;
		& h1 {
			font-size: 1.75rem;
		}
		& h2 {
			top: 60%;
			font-size: 1.5rem;
		}
		& h3 {
			top: 80%;
			font-size: 1rem;
		}
		& button {
			height: 42px;
			border-radius: 10px;
			font-size: 1rem;
			padding: 5px 20px;
			gap: 10px;
    		& .material-symbols-outlined {
    			font-size: 1.5rem;
    			font-variation-settings:
    				'opsz' 24;
    		}
		}
		& div.s {
			& .material-symbols-outlined {
				font-size: 12px;
				font-variation-settings:
					'opsz' 12;
			}
			& p {
				font-size: 12px;
			}
		}
	}
	main > section {
		padding: 20px 10px;
		&.s > div {
			padding: 20px 10px !important;
		}
		& span.title {
			& h3 {
				font-size: 1.5rem;
			}
			& h2 {
				font-size: 2rem;
			}
		}
		& div.whatis {
			flex-direction: column;
			& img {
				width: 100% !important;
				height: auto !important;
				max-height: 500px;
			}
		}
		& swiper-container.services {
            & swiper-slide {
				flex: 0 0 auto !important;
			    width: 75%;
				height: 450px;
				& h2 {
					font-size: 1.25rem;
				}
			}
		}
    	& swiper-container.weekly {
    	    transform: translateY(-150px) rotateZ(-5deg) scale(.8);
    		& swiper-slide {
    			& img {
    			    max-width: 380px;
    				width: 100%;
    			}
    			& div {
    			    max-width: 300px;
    			    width: 300px;
    			}
    			& p {
    			    font-size: 1.25rem;
    			}
    			& b {
    			    font-size: 1.25rem;
    			}
    		}
    	}
    	& swiper-container.galery {
    		& swiper-slide {
    			width: 100%;
    		}
    	}
		& div.story {
			& > div {
				flex-direction: column;
				& > div {
		            width: 100% !important;
		        }
			}
		}
		& div.storymap {
		    & > span {
		        flex-direction: column;
		    }
		    & div#map {
    	        aspect-ratio: 16/18;
		    }
		}
        & div.pay {
            & form {
                & button {
                   width: 100%; 
                }
            }
        }
        & div.calculator {
            & form {
                & > div.custommap {
    	            flex-direction: column;
    	        }
    	        & > div.customprices {
    	            & > i {
    	                width: 30px;
    	            }
    	        }
    	        & > button {
                   width: 100%; 
                }
            }   
        }
    	& swiper-container.reviews {
    		& swiper-slide {
    		    width: 80% !important;
    	    }
        }
        & div.newsletter {
            flex-direction: column;
            & > div:last-child {
                width: 100%;
            }
        }
        & div.playarea {
    		& div.phone {
    			width: 50%;
    		}
            & img.a16l {
            	width: 40%;
            }
            & img.a16r {
            	width: 40%;
            }
            & img.a17l {
            	width: 40%;
            }
            & img.a17r {
            	width: 40%;
            }
        }
        & div.giftcard {
            & form {
                & > div {
                    &.gift {
                        flex-direction: column;
                        & > span:first-child {
                            width: 100%;
                            & h4,
                            & p {
                                width: 100%;
                                text-align: center;
                            }
                        }
                    }
                }
                & button {
                   width: 100%; 
                }
            }
        }
		& div.redeem {
		    & div.text {
    			flex-direction: column;
    		}
		}
        & div.abandoned {
            & div.feedback {
                & button {
                    width: 100%;
                }
            }
        }
        & div.expired {
            & div.feedback {
                & button {
                    width: 100%;
                }
            }
        }
        & div.end {
            & div.scoreboard {
                & button {
                    width: 100%;
                }
            }
        }
        & div.support {
            flex-direction: column;
            & > span {
                display: flex;
                & hr {
        			width: 60%;
        			height: 1px;
        			min-height: 1px;
        		}
            }
        }
        & div.contact {
    		& .material-symbols-outlined {
    			top: 50px;
    			right: -50px;
    			font-size: 100px;
    			font-variation-settings:
    				'OPSZ' 100;
    		}
            & form {
                width: 100%;
            }
        }
        & div.wearehere > div {
            flex-direction: column;
        }
	}
	footer {
		height: auto;
		flex-direction: column !important;
		gap: 40px;
		background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 10%);
		& > section {
		    flex-direction: column !important;
		    gap: 40px;
    		& div.mobile {
    			flex-direction: row;
    		}
    		& div.logos {
    		    align-items: flex-start;
    		}
	    }
	}
	canvas {
		opacity: 1;
	}
}
@media (max-width: 420px) {
	div.hero {
		& h1 {
			font-size: 1.5rem;
		}
		& > span {
			width: 100% !important;
			flex-direction: column;
		}
	}
	swiper-container.services {
		& swiper-slide {
			& h2 {
				font-size: 1.1rem !important;
			}
		}
	}
}
@media (max-height: 500px) {
	div.hero {
    	&.min,
    	&.story {
    		height: 100vh;
    	}
    }
}
@media (orientation: landscape) and (pointer: coarse) {
    #landscape-overlay {
        opacity: 1 !important;
        pointer-events: auto;
    }
}
@media (pointer: fine) {
    #pc-overlay {
        opacity: 1 !important;
        pointer-events: auto;
    }
}
@property --progress {
    syntax: '<angle>';
    inherits: false;
    initial-value: 0deg;
}
@keyframes shine {
    0% {
		left: -100px
	}
    20% {
		left: 100%
	}
    100% {
		left: 100%
	}
}
@keyframes pulse {
    0% {
        transform: scale(1);
        opacity: .75;
    }
    100% {
        transform: scale(2.5);
        opacity: 0;
    }
}
@keyframes spin {
	0% {
		transform: translate(-50%, -50%) rotateZ(15deg) rotateY(0deg);
	}
	100% {
		transform: translate(-50%, -50%) rotateZ(15deg) rotateY(360deg);
	}
}
@keyframes spin2 {
	0% {
		transform: scale(.9) rotateY(0deg);
	}
	100% {
		transform: scale(.9) rotateY(360deg);
	}
}
@keyframes ripple {
	to {
		transform: scale(2.5);
		opacity: 0;
	}
}
@keyframes modalIn {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
[data-clarity-id]#landscape-overlay,
[data-clarity-id]#pc-overlay {
    display: none !important;
}