@import url("//fonts.googleapis.com/css?family=Baloo|Francois+One|Source+Sans+Pro&display=swap");

@font-face {
	font-family: "CCHeroSandwichMeatW00-Rg";
	src: url("/wp-content/uploads/dist/fonts/34eda89a2b7de7ff474f7e927661efca.eot");
	/* IE9*/
	src: url("/wp-content/uploads/dist/fonts/34eda89a2b7de7ff474f7e927661efca.eot?#iefix") format("embedded-opentype"),
		/* IE6-IE8 */
		url("/wp-content/uploads/dist/fonts/34eda89a2b7de7ff474f7e927661efca.woff2") format("woff2"),
		/* chrome firefox */
		url("/wp-content/uploads/dist/fonts/34eda89a2b7de7ff474f7e927661efca.woff") format("woff"),
		/* chrome firefox */
		url("/wp-content/uploads/dist/fonts/34eda89a2b7de7ff474f7e927661efca.ttf") format("truetype"),
		/* chrome firefox opera Safari, Android, iOS 4.2+*/
		url("/wp-content/uploads/dist/fonts/34eda89a2b7de7ff474f7e927661efca.svg#CCHeroSandwichMeatW00-Rg") format("svg");
	/* iOS 4.1- */
}

:root {
	--gray-h: 231;
	--gray-s: 13%;
	--gray-l: 22%;
	--yellow-h: 40;
	--yellow-s: 87%;
	--yellow-l: 61%;
	--black-h: 0;
	--black-s: 0%;
	--black-l: 0%;
	--white-h: 0;
	--white-s: 0%;
	--white-l: 100%;
	--columns: 12;
	--col-1: calc((1 / var(--columns)) * 100%);
	--col-2: calc((2 / var(--columns)) * 100%);
	--col-3: calc((3 / var(--columns)) * 100%);
	--col-4: calc((4 / var(--columns)) * 100%);
	--col-5: calc((5 / var(--columns)) * 100%);
	--col-6: calc((6 / var(--columns)) * 100%);
	--col-7: calc((7 / var(--columns)) * 100%);
	--col-8: calc((8 / var(--columns)) * 100%);
	--col-9: calc((9 / var(--columns)) * 100%);
	--col-10: calc((10 / var(--columns)) * 100%);
	--col-11: calc((11 / var(--columns)) * 100%);
	--col-12: calc((12 / var(--columns)) * 100%);
	--text-color: hsl(var(--white-h), var(--white-s), var(--white-l));
	--text-shadow: 0 2px 0 hsla(var(--black-h), var(--black-s), var(--black-l), var(--opacity));
	--text-size: 14px;
	--text-weight: normal;
	--box-width: var(--col-12);
	--image-height: 100%;
	--image-width: 100%;
	--background-repeat: no-repeat;
	--coin-position-vertical: 0;
	--coin-position-horizental: 0;
	--claw-position-vertical: 0;
	--claw-position-horizental: 0;
	--clawee-position-vertical: 0;
	--clawee-position-horizental: 0;
	--logo-height: 0;
	--logo-width: 0;
	--logo-position-vertical: var(--col-6);
	--logo-position-horizental: var(--col-6);
	--align-horizental: center;
	--align-vertical: center;
	--background-repeat: no-repeat;
	--cursor: pointer;
	--display: flex;
	--margin-base: 10px;
	--margin-none: 0;
	--opacity: 0.5;
	--orientation: row;
	--padding-horizental: 0;
	--padding-vertical: 10px;
	--position: relative;
	--space-base: 10px;
	--space-none: 0;
	--text-align: center;
	--text-transform: none;
	--space-input: 0;
	--content-padding-vertical: 0;
	--content-padding-horizental: 30px;
	--screen-h: 100vh;
	--screen-inner-h: 100vh;
	--store-button-height: 40px;
	--store-button-width: calc(var(--store-button-height) * 3);
	--slider-dot-height: 12px;
	--slider-dot-width: 12px;
	--slider-dot-height-icon: 12px;
	--slider-dots-height: 10vh;
	--slider-dots-zindex: 1000;
	--slider-images-min-height: 200px;
	--slider-arrow-height: 47px;
	--slider-arrow-width: 44px;
	--slider-arrow-zindex: 1000;
	--social-max-width: 300px;
	--social-icon-height: 75px;
	--social-icon-width: var(--social-icon-height);
	--links-color: hsl(var(--white-h), var(--white-s), var(--white-l))
}

@media screen and (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) {
	:root {
		--store-button-height: 70px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) and (orientation: landscape) {
	:root {
		--store-button-height: 50px
	}
}

@media screen and (min-width: 1024px) {
	:root {
		--store-button-height: 90px
	}
}

*,
*::before,
*::after {
	background-repeat: var(--background-repeat);
	box-sizing: border-box;
	outline: none
}

ul[class],
ol[class] {
	list-style: none;
	padding: 0
}

ul {
	text-align: left
}

h1,
h2,
h3,
h4,
p,
ul[class],
ol[class],
li,
figure,
figcaption,
blockquote,
dl,
dd {
	margin: var(--space-none)
}

html,
body {
	display: var(--display)
}

body {
	--orientation: column;
	background-color: hsl(var(--gray-h), var(--gray-s), var(--gray-l));
	background-image: url("/wp-content/uploads/dist/images/footer.jpg");
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: var(--col-12) auto;
	flex-direction: var(--orientation);
	line-height: 1.5;
	margin: var(--space-none);
	min-height: 100vh;
	overflow-x: hidden;
	overflow-y: auto;
	padding: var(--space-none);
	scroll-behavior: smooth;
	text-rendering: optimizeSpeed;
	height: auto;
	width: 100vw
}

a:not([class]) {
	text-decoration-skip-ink: auto
}

img {
	--display: block;
	max-width: var(--col-12);
	display: var(--display)
}

article>*+* {
	margin-top: 1em
}

input,
button,
textarea,
select {
	font: inherit;
	padding: var(--space-input)
}

@media (prefers-reduced-motion: reduce) {
	* {
		animation-play-state: paused !important;
		transition: none !important;
		scroll-behavior: auto !important
	}
}

blockquote[class],
q[class] {
	quotes: none
}

blockquote[class]:before,
blockquote[class]:after,
q[class]:before,
q[class]:after {
	content: ''
}

table[class] {
	border-collapse: collapse;
	border-spacing: 0
}

.ip-wrapper {
	display: var(--display);
	flex-direction: var(--orientation);
	width: var(--col-12)
}

.ip-section {
	display: var(--display);
	height: var(--screen-h);
	justify-content: var(--align-horizental)
}

@media screen and (max-width: 1023px) {
	@supports (-webkit-appearance: none) and (orientation: portrait) {
		.ip-section {
			--screen-h: calc(100vh - 56px)
		}
	}
}

@media screen and (max-width: 1023px) {
	.ip-section.about {
		--screen-h: var(--col-12);
		/* min-height: var(--screen-h) */
	}
}

.ip-section.video {
	--screen-h: 50vh;
	--align-vertical: flex-start
}

@media screen and (min-width: 480px) and (orientation: landscape) {
	.ip-section.video {
		--screen-h: 100vh
	}

	.ip-section.gallery {
		--screen-h: 80vh
	}
}

.about {
	--display: grid;
	--space-base: 30px;
	align-items: var(--align-horizental);
	grid-gap: var(--space-base);
	justify-items: var(--align-horizental);
	padding-top: var(--padding-vertical);
	padding-right: var(--padding-horizental);
	padding-bottom: var(--padding-vertical);
	padding-left: var(--padding-horizental);
	text-align: var(--text-align)
}

@media screen and (orientation: landscape) {
	.about {
		--text-align: left
	}
}

@media screen and (min-width: 480px) and (orientation: portrait) {
	.about .ip-box {
		grid-template-rows: 1fr 2fr
	}
}

@media screen and (min-width: 480px) and (orientation: landscape) {
	.about .ip-box {
		grid-template-columns: 2fr 1fr
	}
}

.about .ip-box__content {
	--space-base: 10px
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .ip-box__content {
		--space-base: 15px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
	.about .ip-box__content {
		--space-base: 20px
	}
}

.about .ip-title {
	--text-size: 20px
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .ip-title {
		--text-size: 20px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
	.about .ip-title {
		--text-size: 36px
	}
}

@media screen and (min-width: 1024px) and (max-width: 1139px) {
	.about .ip-title {
		--text-size: 42px
	}
}

@media screen and (min-width: 1140px) {
	.about .ip-title {
		--text-size: 52px
	}
}

.about .ip-content {
	--text-size: 14px
}

@media screen and (min-width: 768px) {
	.about .ip-content {
		--text-size: 16px
	}
}

.about .ip-image {
	align-items: var(--align-vertical);
	align-content: var(--align-vertical);
	justify-items: var(--align-horizental);
	justify-content: var(--align-horizental);
	height: var(--col-12)
}

@media (orientation: portrait) {
	.about .ip-image .ip-media {
		--image-height: 40vh;
		height: var(--image-height)
	}
}

@media (orientation: landscape) {
	.about .ip-image .ip-media {
		--image-width: 25vw;
		width: var(--image-width)
	}
}

.video {
	--slider-dots-height: 30vh;
	--display: grid;
	--space-base: 30px;
	align-items: var(--align-horizental);
	grid-gap: var(--space-base);
	justify-items: var(--align-horizental);
	padding-top: var(--padding-vertical);
	padding-right: var(--padding-horizental);
	padding-bottom: var(--padding-vertical);
	padding-left: var(--padding-horizental);
	text-align: var(--text-align)
}

.video .ip-slider__item {
	--slider-video-height: calc(var(--slider-video-width) * 0.56);
	--slider-video-width: 300px;
	height: var(--slider-video-height);
	width: var(--slider-video-width)
}

@media screen and (min-width: 480px) and (max-width: 767px) and (orientation: portrait) {
	.video .ip-slider__item {
		--slider-video-width: 300px
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) and (orientation: landscape) {
	.video .ip-slider__item {
		--slider-video-width: 460px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) {
	.video .ip-slider__item {
		--slider-video-width: 720px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) and (orientation: landscape) {
	.video .ip-slider__item {
		--slider-video-width: 570px
	}
}

@media screen and (min-width: 1024px) and (max-width: 1139px) and (orientation: portrait) {
	.video .ip-slider__item {
		--slider-video-width: 850px
	}
}

@media screen and (min-width: 1024px) and (max-width: 1139px) and (orientation: landscape) {
	.video .ip-slider__item {
		--slider-video-width: 850px
	}
}

@media screen and (min-width: 1140px) and (orientation: landscape) {
	.video .ip-slider__item {
		--slider-video-width: 850px
	}
}

.video .ip-slider__item .ip-video__player {
	height: var(--slider-video-height);
	width: var(--slider-video-width)
}

.video .ip-box .ip-title {
	--text-size: 20px;
	--display: none
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.video .ip-box .ip-title {
		--text-size: 20px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
	.video .ip-box .ip-title {
		--text-size: 36px
	}
}

@media screen and (min-width: 1024px) and (max-width: 1139px) {
	.video .ip-box .ip-title {
		--display: grid;
		--text-size: 42px
	}
}

@media screen and (min-width: 1140px) {
	.video .ip-box .ip-title {
		--display: grid;
		--text-size: 52px
	}
}

.ip-box {
	align-items: var(--align-horizental);
	display: var(--display);
	height: var(--screen-h);
	max-width: var(--box-width);
	position: var(--position);
	width: var(--col-12)
}

@media screen and (min-width: 1024px) {
	.ip-box {
		--box-width: 1000px
	}
}

@media screen and (orientation: portrait) {
	.video .ip-box {
		--screen-h: calc(50vh - 20px)
	}
}

@media screen and (orientation: landscape) {
	.video .ip-box {
		--space-base: 10px;
		margin-top: calc(var(--space-base) * -1);
		padding-top: var(--space-base);
		padding-bottom: var(--space-base)
	}
}

.splash .ip-box {
	--box-width: var(--col-12)
}

.ip-box__content {
	--display: grid;
	display: var(--display);
	grid-gap: var(--space-base)
}

@media screen and (max-width: 479px) and (orientation: portrait) {
	.ip-box {
		flex-direction: var(--orientation);
		justify-items: var(--align-horizental)
	}
}

.ip-content {
	--text-size: 16px;
	color: hsl(var(--white-h), var(--white-s), var(--white-l));
	font-family: 'CCHeroSandwichMeatW00-Rg', sans-serif;
	font-size: var(--text-size);
	font-weight: var(--text-weight);
	padding-top: var(--content-padding-vertical);
	padding-right: var(--content-padding-horizental);
	padding-bottom: var(--content-padding-vertical);
	padding-left: var(--content-padding-horizental)
}

.ip-footer {
	--screen-h: 50vh;
	height: var(--screen-h)
}

@media (orientation: portrait) {
	.ip-footer {
		--screen-h: 50vh
	}
}

.ip-footer .ip-box {
	--screen-h: var(--col-6)
}

@media (orientation: portrait) {
	.ip-footer .ip-box {
		--screen-h: var(--col-4)
	}
}

.ip-footer .ip-box.social {
	--display: flex;
	display: var(--display);
	justify-content: space-between;
	flex-direction: row;
	max-width: var(--social-max-width);
	margin-right: auto;
	margin-left: auto;
	padding-right: var(--space-base);
	padding-left: var(--space-base)
}

.ip-footer .ip-box.social .ip-social--icon {
	background-position: center center;
	background-repeat: norepeat;
	background-size: cover;
	border-radius: var(--col-12);
	cursor: pointer;
	display: block;
	overflow: hidden;
	height: var(--social-icon-height);
	width: var(--social-icon-height)
}

.ip-footer .ip-box.social .ip-social--icon.facebook {
	background-image: url("/wp-content/uploads/dist/images/icon__social-facebook.png")
}

.ip-footer .ip-box.social .ip-social--icon.instagram {
	background-image: url("/wp-content/uploads/dist/images/icon__social-instagram.png")
}

.ip-footer .ip-box.social .ip-social--icon.youtube {
	background-image: url("/wp-content/uploads/dist/images/icon__social-youtube.png")
}

.ip-footer .ip-box.links {
	--display: grid;
	--social-max-width: 500px;
	display: var(--display);
	grid-gap: var(--space-base);
	grid-template-rows: 40px 40px;
	max-width: var(--social-max-width);
	margin-right: auto;
	margin-left: auto
}

.ip-footer .ip-box.links .ip-links {
	text-align: center;
	display: var(--display);
	grid-gap: var(--space-base);
	grid-template-columns: repeat(3, 1fr);
	justify-content: space-around;
	font-family: 'Baloo', cursive;
	font-size: var(--text-size);
	font-weight: var(--text-weight)
}

.ip-footer .ip-box.links .ip-links .ip-btn__link {
	color: var(--links-color);
	text-decoration: none
}

.ip-footer .ip-box.links .ip-links:last-child {
	--links-color: hsl(var(--yellow-h), var(--yellow-s), var(--yellow-l));
	grid-template-columns: 1fr
}

.gallery {
	background-repeat: var(--background-repeat);
	background-position: center center;
	background-size: var(--col-12) var(--col-12)
}

@media screen and (orientation: portrait) {
	.gallery {
		background-image: url("/wp-content/uploads/dist/images/slide-background-mobile.jpg")
	}

	.gallery .ip-slider__item {
		grid-template-areas: 'title''art'
	}
}

@media screen and (orientation: landscape) {
	.gallery {
		background-image: url("/wp-content/uploads/dist/images/slide-background.jpg")
	}

	.gallery .ip-slider__item {
		grid-template-areas: 'art title';
		grid-template-columns: repeat(2, 1fr)
	}
}

.gallery .title {
	grid-area: title
}

.gallery .title .ip-media {
	--image-width: var(--col-12);
	max-width: 200px
}

.gallery .art {
	grid-area: art
}

@media screen and (orientation: landscape) {
	.gallery .art .ip-media {
		--image-width: var(--col-9);
		max-width: var(--image-width)
	}
}

.gallery .ip-image {
	align-content: var(--align-horizental);
	align-items: var(--align-horizental);
	justify-content: var(--align-horizental);
	justify-items: var(--align-horizental);
	min-height: var(--slider-images-min-height)
}

@media (orientation: landscape) {
	.gallery .ip-image {
		height: 50vh;
		width: var(--col-12)
	}
}

@media (orientation: portrait) {
	.gallery .ip-image .ip-media {
		--image-height: 40vh;
		max-height: var(--image-height)
	}
}

@media screen and (min-width: 480px) and (orientation: landscape) {
	.art .gallery .ip-image .ip-media {
		--image-width: 20vw;
		width: var(--image-width)
	}
}

.ip-image {
	--display: flex;
	display: var(--display)
}

.ip-link {
	cursor: var(--cursor)
}

.ip-slider {
	height: var(--col-12)
}

.ip-slider__item {
	--display: grid;
	align-content: var(--align-horizental);
	justify-items: var(--align-horizental);
	width: var(--col-12)
}

.slick-initialized.slick-slider {
	--display: grid;
	display: var(--display)
}

@media screen and (orientation: portrait) {
	.slick-initialized.slick-slider {
		--align-vertical: flex-start
	}

	.gallery .slick-initialized.slick-slider {
		grid-template-rows: 90vh var(--slider-dots-height)
	}

	.video .slick-initialized.slick-slider {
		grid-template-rows: var(--col-10) var(--col-2)
	}
}

@media screen and (orientation: landscape) {
	.slick-initialized.slick-slider {
		--align-vertical: center
	}

	.gallery .slick-initialized.slick-slider {
		padding-top: var(--space-base);
		padding-bottom: var(--space-base)
	}

	.video .slick-initialized.slick-slider {
		grid-template-rows: 70vh var(--slider-dots-height)
	}
}

.slick-initialized.slick-slider .slick-list {
	display: var(--display)
}

.video .slick-initialized.slick-slider .slick-list {
	align-items: var(--align-vertical)
}

.slick-initialized .slick-slide {
	--display: grid;
	display: var(--display)
}

.slick-initialized .slick-prev,
.slick-initialized .slick-next {
	position: absolute;
	z-index: var(--slider-arrow-zindex);
	height: var(--slider-arrow-height);
	width: var(--slider-arrow-width)
}

.slick-initialized .slick-prev.slick-arrow,
.slick-initialized .slick-next.slick-arrow {
	background-color: transparent;
	background-repeat: no-repeat;
	background-size: cover;
	border-color: transparent;
	border-width: 0;
	overflow: hidden;
	text-indent: -9999em
}

.slick-initialized .slick-prev {
	left: calc(var(--col-1) * -.1)
}

.slick-initialized .slick-next {
	right: calc(var(--col-1) * -0.1)
}

.gallery .slick-initialized .slick-prev,
.gallery .slick-initialized .slick-next {
	top: var(--col-6);
	transform: translateY(calc(var(--col-6) * -1))
}

.gallery .slick-initialized .slick-prev.slick-arrow {
	background-image: url("/wp-content/uploads/dist/images/gallery__left.png")
}

.gallery .slick-initialized .slick-prev.slick-arrow:active {
	background-image: url("/wp-content/uploads/dist/images/gallery__left-down.png")
}

.gallery .slick-initialized .slick-next.slick-arrow {
	background-image: url("/wp-content/uploads/dist/images/gallery__right.png")
}

.gallery .slick-initialized .slick-next.slick-arrow:active {
	background-image: url("/wp-content/uploads/dist/images/gallery__right-down.png")
}

.video .slick-initialized .slick-prev,
.video .slick-initialized .slick-next {
	top: var(--col-5);
	transform: translateY(calc(var(--col-6) * -1 - var(--slider-arrow-height)))
}

.video .slick-initialized .slick-prev.slick-arrow {
	background-image: url("/wp-content/uploads/dist/images/video__left.png")
}

.video .slick-initialized .slick-prev.slick-arrow:active {
	background-image: url("/wp-content/uploads/dist/images/video__left-down.png")
}

.video .slick-initialized .slick-next.slick-arrow {
	background-image: url("/wp-content/uploads/dist/images/video__right.png")
}

.video .slick-initialized .slick-next.slick-arrow:active {
	background-image: url("/wp-content/uploads/dist/images/video__right-down.png")
}

.slick-initialized .slick-dots {
	--display: flex;
	align-items: var(--align-vertical);
	align-content: var(--align-vertical);
	display: var(--display);
	justify-content: var(--align-horizental);
	justify-items: var(--align-horizental);
	position: var(--position);
	z-index: var(--slider-dots-zindex)
}

.slick-initialized .slick-dots [role='presentation'] {
	--display: flex;
	--space-base: 5px;
	align-items: var(--align-horizental);
	display: var(--display);
	justify-content: var(--align-horizental);
	margin-right: var(--space-base);
	height: var(--slider-dot-height);
	width: var(--slider-dot-height)
}

.slick-initialized .slick-dots [role='presentation'] button {
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: var(--slider-dot-height-icon) var(--slider-dot-height-icon);
	border-width: 0;
	text-indent: -9999em;
	height: var(--slider-dot-height);
	width: var(--slider-dot-height)
}

.gallery .slick-initialized .slick-dots [role='presentation'] button {
	background-image: url("/wp-content/uploads/dist/images/gallery__dots.png")
}

.video .slick-initialized .slick-dots [role='presentation'] button {
	background-image: url("/wp-content/uploads/dist/images/video__dots.png")
}

.gallery .slick-initialized .slick-dots .slick-active button {
	background-image: url("/wp-content/uploads/dist/images/gallery__dots-selected.png")
}

.video .slick-initialized .slick-dots .slick-active button {
	background-image: url("/wp-content/uploads/dist/images/video__dots-selected.png")
}

.gallery .slick-initialized .slick-dots {
	--position: absolute;
	bottom: calc(var(--col-1) * 0.5)
}

@media screen and (orientation: portrait) {
	.gallery .slick-initialized .slick-dots {
		left: var(--col-6);
		transform: translateX(calc(var(--col-6) * -1))
	}
}

@media screen and (orientation: landscape) {
	.gallery .slick-initialized .slick-dots {
		left: var(--col-6);
		transform: translateX(calc(var(--col-6) * -1))
	}
}

.video .slick-initialized .slick-dots {
	align-items: flex-start
}

:root {
	--logo-height: calc(var(--logo-width) * 0.46)
}

@media screen and (max-width: 479px) {
	:root {
		--logo-width: 300px
	}
}

@media screen and (min-width: 480px) and (max-width: 599px) {
	:root {
		--logo-width: 350px
	}
}

@media screen and (min-width: 600px) and (max-width: 767px) {
	:root {
		--logo-width: 400px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
	:root {
		--logo-width: 450px
	}
}

@media screen and (min-width: 1024px) and (max-width: 1139px) {
	:root {
		--logo-width: 600px
	}
}

@media screen and (min-width: 1140px) {
	:root {
		--logo-width: 700px
	}
}

.splash {
	--gray-h: 0;
	--gray-s: 0%;
	--gray-l: 100%;
	background-position: bottom right;
	background-repeat: no-repeat;
	/* overflow: hidden */
}

@media screen and (orientation: portrait) {
	.splash {
		background-image: url("/wp-content/uploads/dist/images/splash.jpg");
		background-size: var(--col-12) var(--col-12)
	}
}

@media screen and (orientation: landscape) {
	.splash {
		background-image: url("/wp-content/uploads/dist/images/splash-background.jpg");
		background-size: cover
	}
}

.splash__content {
	--position: absolute;
	position: var(--position);
	top: var(--col-5);
	left: var(--col-6);
	transform: translate(calc(var(--col-6) * -1), calc(var(--col-6) * -1));
	height: var(--logo-height);
	width: var(--logo-width)
}

.splash .ip-logo {
	--position: absolute;
	align-content: var(--align-horizental);
	align-items: var(--align-horizental);
	justify-content: var(--align-horizental);
	justify-items: var(--align-horizental);
	left: var(--logo-position-horizental);
	position: var(--position);
	top: var(--logo-position-vertical);
	height: var(--logo-height);
	width: var(--logo-width)
}

.splash .ip-logo .ip-media {
	width: var(--col-12)
}

@media (orientation: portrait) {
	.splash .ip-logo {
		--logo-position-vertical: -35px;
		transform: translate(calc(var(--logo-position-horizental) * -1), calc(var(--logo-position-vertical) * 1))
	}
}

@media (orientation: landscape) {
	.splash .ip-logo {
		transform: translate(calc(var(--logo-position-horizental) * -1), calc(var(--logo-position-vertical) * -1))
	}
}

.splash .ip-coins {
	--position: absolute;
	position: var(--position)
}

@media screen and (max-width: 1024px) and (orientation: portrait) {
	.splash .ip-coins {
		--display: none
	}
}

.splash .ip-coins.top {
	--coin-position-horizental: calc(var(--col-12) - var(--image-width) + (var(--col-1) / 2));
	--image-height: calc(var(--image-width) * 0.6);
	height: var(--image-height);
	left: var(--coin-position-horizental);
	top: var(--coin-position-vertical);
	width: var(--image-width)
}

@media screen and (min-width: 480px) and (max-width: 767px) and (orientation: landscape) {
	.splash .ip-coins.top {
		--image-width: 150px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) and (orientation: landscape) {
	.splash .ip-coins.top {
		--image-width: 200px
	}
}

@media screen and (min-width: 1024px) and (max-width: 1139px) and (orientation: landscape) {
	.splash .ip-coins.top {
		--image-width: 300px
	}
}

@media screen and (min-width: 1140px) and (orientation: landscape) {
	.splash .ip-coins.top {
		--image-width: 350px
	}
}

.splash .ip-coins.bottom {
	--coin-position-horizental: calc(var(--col-1) * -1);
	--coin-position-vertical: calc(var(--image-height) * -0.1);
	--image-height: calc(var(--image-width) * 0.7);
	bottom: var(--coin-position-vertical);
	height: var(--image-height);
	left: var(--coin-position-horizental);
	width: var(--image-width)
}

@media screen and (min-width: 480px) and (max-width: 767px) and (orientation: landscape) {
	.splash .ip-coins.bottom {
		--image-width: 200px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) and (orientation: landscape) {
	.splash .ip-coins.bottom {
		--image-width: 250px
	}
}

@media screen and (min-width: 1024px) and (max-width: 1139px) and (orientation: landscape) {
	.splash .ip-coins.bottom {
		--image-width: 350px
	}
}

@media screen and (min-width: 1140px) and (orientation: landscape) {
	.splash .ip-coins.bottom {
		--image-width: 550px
	}
}

.splash .ip-claw {
	--position: absolute;
	--image-height: calc(var(--image-width) * 0.6);
	--claw-position-horizental: var(--col-7);
	position: var(--position);
	height: var(--image-height);
	left: var(--claw-position-horizental);
	top: var(--claw-position-vertical);
	width: var(--image-width)
}

@media screen and (max-width: 1024px) and (orientation: portrait) {
	.splash .ip-claw {
		--display: none
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) and (orientation: landscape) {
	.splash .ip-claw {
		--image-width: 200px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) and (orientation: landscape) {
	.splash .ip-claw {
		--image-width: 250px
	}
}

@media screen and (min-width: 1024px) and (max-width: 1139px) and (orientation: landscape) {
	.splash .ip-claw {
		--image-width: 350px
	}
}

@media screen and (min-width: 1140px) and (orientation: landscape) {
	.splash .ip-claw {
		--image-width: 350px
	}
}

.splash .ip-clawee {
	--position: absolute;
	--image-height: var(--image-width);
	--clawee-position-horizental: calc(var(--image-height) * -0.35);
	--clawee-position-vertical: calc(var(--image-width) * -0.15);
	position: var(--position);
	height: var(--image-height);
	left: var(--clawee-position-horizental);
	top: var(--clawee-position-vertical);
	width: var(--image-width)
}

@media screen and (max-width: 1024px) and (orientation: portrait) {
	.splash .ip-clawee {
		--display: none
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.splash .ip-clawee {
		--image-width: 150px
	}
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
	.splash .ip-clawee {
		--image-width: 200px
	}
}

@media screen and (min-width: 1024px) and (max-width: 1139px) {
	.splash .ip-clawee {
		--image-width: 250px
	}
}

@media screen and (min-width: 1140px) {
	.splash .ip-clawee {
		--image-width: 300px
	}
}

.splash .ip-actions {
	--display: grid;
	--position: absolute;
	bottom: var(--col-1);
	position: var(--position);
	display: var(--display);
	grid-gap: var(--space-base);
	left: var(--col-6);
	transform: translateX(calc(var(--col-6) * -1));
	width: 30%;
}

@media screen and (orientation: landscape) {
	.splash .ip-actions {
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-areas: "main main main"
			"item1 item2 item";
	}
}

@media screen and (max-width: 1140px) {
	.splash .ip-actions {
		width: 40%;
		grid-template-columns: 1fr 1fr 1fr;
    	grid-template-areas:
        "main main main"
        "item1 item2 item";
	}
}

@media screen and (max-width: 768px) {
	.splash .ip-actions {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-areas: 'main main main''item1 item2 item3';
		left: var(--col-6);
		transform: translateX(calc(var(--col-6) * -1));
		width: 50%;
	}
}

@media screen and (max-width: 500px) {
	.splash .ip-actions {
		width: 70%;
		bottom: var(--col-3);
	}
}

.splash .ip-actions .ip-image {
	--display: block;
	display: var(--display);
	margin: auto;
	height: var(--store-button-height);
	width: var(--store-button-width);
	width: 100%;
	height: auto
}

.ip-actions .main:first-child {
	grid-area: main;
}

@media screen and (orientation: portrait) {
	.splash .ip-actions .ip-image {
		margin-bottom: var(--space-base)
	}
}

@media screen and (max-width: 479px) {
	.splash .ip-actions .ip-image:first-child {
		margin-right: var(--space-base)
	}
}

.splash .ip-actions .ip-media {
	display: var(--display);
	height: var(--col-12);
	width: var(--col-12)
}

.ip-title {
	--text-size: 30px;
	--text-weight: bold;
	--text-transform: uppercase;
	--orientation: column;
	color: hsl(var(--yellow-h), var(--yellow-s), var(--yellow-l));
	display: var(--display);
	flex-direction: var(--orientation);
	font-family: 'CCHeroSandwichMeatW00-Rg', sans-serif;
	font-size: var(--text-size);
	font-weight: var(--text-weight);
	text-shadow: var(--text-shadow);
	text-transform: var(--text-transform)
}

@media (orientation: landscape) {

	.about .ip-title,
	.video .ip-title {
		padding-left: var(--content-padding-horizental)
	}
}

.ip-popup {
	--opacity: 0.9;
	--visibility: hidden;
	--sacle: 0;
	--popup-size-h: 0;
	--popup-size-w: 0;
	align-items: center;
	background-color: hsla(var(--gray-h), var(--gray-s), var(--gray-l), 0.9);
	bottom: 0;
	display: flex;
	height: var(--popup-size-h);
	justify-content: center;
	left: 0;
	opacity: var(--opacity);
	position: fixed;
	right: 0;
	top: 0;
	transform-origin: center center;
	transform: scale(var(--sacle));
	transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
	visibility: var(--visibility);
	width: var(--popup-size-w);
	z-index: 10000;
}

.ip-popup.active {
	--visibility: visible;
	--popup-size-h: 100vh;
	--popup-size-w: 100vw;
	--sacle: 1;
	--opacity: 1;
}

.ip-popup--inner {
	position: relative;
}

.ip-popup__close {
	background-color: transparent;
	border: solid 1px #fff;
	color: #fff;
	cursor: pointer;
	font-family: 'Source Sans Pro', sans-serif;
	height: 40px;
	position: absolute;
	right: 10px;
	top: 10px;
	width: 40px;
}

.ip-popup .wpcf7 {
	background-color: hsl(var(--black-h), var(--black-s), var(--black-l));
	background-image: url(//www.clawee.com/wp-content/uploads/2019/11/clawee.png);
	background-repeat: no-repeat;
	background-position: 10%;
	background-size: 40%;
	border: solid 1px #fff;
	color: hsl(var(--white-h), var(--white-s), var(--white-l));
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: normal;
	padding: 10vh 20vw;
	width: 75vw;
}

.ip-popup .wpcf7 label {
	display: block;
	width: var(--col-12);
}

.ip-popup .wpcf7-form-control-wrap,
.ip-popup .wpcf7-form-control {
	resize: none;
	width: var(--col-12);
}

.ip-popup .wpcf7-submit {
	width: auto;
}

/*# sourceMappingURL=style.css.map */