.gtf-widget,
.gtf-stage {
	box-sizing: border-box;
	width: 100%;
}

.gtf-stage {
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.gtf-stage > a {
	display: flex;
	max-width: 100%;
	text-decoration: none;
}

.gtf-svg {
	display: block;
	height: auto;
	max-width: 100%;
	overflow: visible;
}

.gtf-text-node {
	font-family: "Oswald", sans-serif;
	font-size: 160px;
	font-weight: 300;
	letter-spacing: 4px;
}

.gtf-css-text {
	display: inline-block;
	max-width: 100%;
	overflow: visible;
	padding: 0.08em 0.15em 0.12em;
	margin: -0.08em -0.15em -0.12em;
	white-space: nowrap;
	font-family: "Oswald", sans-serif;
	font-size: 160px;
	font-weight: 300;
	letter-spacing: 4px;
	line-height: 1;
	color: transparent;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	background-clip: text;
}

.gtf-effect-scrolling-stripes .gtf-css-text {
	background-image: linear-gradient(var(--gtf-stripe-angle, 180deg), var(--gtf-stripe-color-1, #dc143c) 50%, var(--gtf-stripe-color-2, #fff) 50%);
	background-position: 0 0;
	background-size: 100% var(--gtf-stripe-size, 50px);
	background-repeat: repeat;
	animation-name: gtf-stripes-scroll;
	animation-duration: var(--gtf-stripe-speed, 3s);
	animation-timing-function: linear;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-direction, normal);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-effect-image-fill .gtf-image-fill-text {
	background-color: #777;
	background-position: var(--gtf-image-position-x, 50%) var(--gtf-image-position-y, 50%);
	background-repeat: no-repeat;
}

.gtf-image-animation-enabled .gtf-image-fill-text {
	animation-duration: var(--gtf-image-animation-duration, 12s);
	animation-timing-function: ease-in-out;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-image-animation-direction, alternate);
	animation-fill-mode: both;
	animation-play-state: paused;
}

.gtf-widget.gtf-active.gtf-image-animation-enabled .gtf-image-fill-text {
	animation-play-state: running;
}

.gtf-image-animation-slide .gtf-image-fill-text {
	animation-name: gtf-image-slide;
}

.gtf-image-animation-zoom-out .gtf-image-fill-text {
	animation-name: gtf-image-zoom-out;
}

.gtf-image-animation-ken-burns .gtf-image-fill-text {
	animation-name: gtf-image-ken-burns;
}

.gtf-flag-stripe-red {
	fill: #b22234;
}

.gtf-flag-stripe-white,
.gtf-flag-star {
	fill: #fff;
}

.gtf-flag-canton {
	fill: #3c3b6e;
}

.gtf-flag-outline {
	stroke: #111;
	stroke-width: 0;
	stroke-linejoin: round;
	pointer-events: none;
}

.gtf-flag-texture-paper,
.gtf-flag-texture-parchment {
	mix-blend-mode: multiply;
}

.gtf-flag-texture-cloth {
	mix-blend-mode: soft-light;
}

.gtf-flag-art {
	transform-box: fill-box;
	transform-origin: center;
}

.gtf-flag-animation-enabled .gtf-flag-art {
	animation-name: gtf-flag-wave;
	animation-duration: var(--gtf-flag-duration, 8s);
	animation-timing-function: ease-in-out;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-flag-animation-direction, alternate);
	animation-fill-mode: both;
	animation-play-state: paused;
}

.gtf-widget.gtf-active.gtf-flag-animation-enabled .gtf-flag-art {
	animation-play-state: running;
}

@keyframes gtf-image-slide {
	from {
		background-position: calc(var(--gtf-image-position-x, 50%) + var(--gtf-image-animation-amount-neg, -12%)) var(--gtf-image-position-y, 50%);
	}
	to {
		background-position: calc(var(--gtf-image-position-x, 50%) + var(--gtf-image-animation-amount, 12%)) var(--gtf-image-position-y, 50%);
	}
}

@keyframes gtf-image-zoom-out {
	from {
		background-size: calc(100% + var(--gtf-image-animation-amount, 12%)) auto;
	}
	to {
		background-size: 100% auto;
	}
}

@keyframes gtf-image-ken-burns {
	from {
		background-position: calc(var(--gtf-image-position-x, 50%) + var(--gtf-image-animation-amount-neg, -12%)) calc(var(--gtf-image-position-y, 50%) + var(--gtf-image-animation-amount-neg, -12%));
		background-size: calc(100% + var(--gtf-image-animation-amount, 12%)) auto;
	}
	to {
		background-position: calc(var(--gtf-image-position-x, 50%) + var(--gtf-image-animation-amount, 12%)) calc(var(--gtf-image-position-y, 50%) + var(--gtf-image-animation-amount, 12%));
		background-size: 100% auto;
	}
}

@keyframes gtf-flag-wave {
	from {
		transform: translate3d(var(--gtf-flag-wave-neg, -5px), 0, 0) skewY(-0.6deg) scaleX(1.015);
	}
	to {
		transform: translate3d(var(--gtf-flag-wave, 5px), 0, 0) skewY(0.6deg) scaleX(1.015);
	}
}

.gtf-widget.gtf-active .gtf-css-text {
	animation-play-state: running;
}

.gtf-matrix-wrap {
	position: relative;
	display: inline-block;
	max-width: 100%;
	overflow: hidden;
	isolation: isolate;
	padding: 0.08em 0.15em 0.12em;
	margin: -0.08em -0.15em -0.12em;
}

.gtf-matrix-border-off .gtf-matrix-wrap {
	padding: 0;
	margin: 0;
}

.gtf-matrix-field {
	position: absolute;
	inset: -25%;
	opacity: var(--gtf-matrix-opacity, 1);
	filter: blur(var(--gtf-matrix-blur, 35px)) hue-rotate(0deg);
	will-change: transform, filter;
	animation-name: gtf-matrix-shift;
	animation-duration: var(--gtf-matrix-speed, 2.5s);
	animation-timing-function: linear;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-direction, normal);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-matrix-cell {
	position: absolute;
	width: var(--gtf-matrix-cell-size, 100px);
	height: var(--gtf-matrix-cell-size, 100px);
	border-radius: 50%;
	transform: translate(-50%, -50%);
}

.gtf-matrix-cell-1 { background: var(--gtf-matrix-color-1, #800080); }
.gtf-matrix-cell-2 { background: var(--gtf-matrix-color-2, #ee82ee); }
.gtf-matrix-cell-3 { background: var(--gtf-matrix-color-3, #008080); }
.gtf-matrix-cell-4 { background: var(--gtf-matrix-color-4, #ff4500); }
.gtf-matrix-cell-5 { background: var(--gtf-matrix-color-5, #ffff00); }
.gtf-matrix-cell-6 { background: var(--gtf-matrix-color-6, #dc143c); }
.gtf-matrix-cell-7 { background: var(--gtf-matrix-color-7, #9acd32); }
.gtf-matrix-cell-8 { background: var(--gtf-matrix-color-8, #00ced1); }

.gtf-matrix-text {
	position: relative;
	z-index: 1;
	display: block;
	white-space: nowrap;
	font-family: "Oswald", sans-serif;
	font-size: 160px;
	font-weight: 300;
	letter-spacing: 4px;
	line-height: 1;
	background: #000;
	color: #fff;
	mix-blend-mode: darken;
}

.gtf-widget.gtf-active .gtf-matrix-field {
	animation-play-state: running;
}

.gtf-ripple-shape {
	animation-name: gtf-ripple-colors;
	animation-duration: var(--gtf-ripple-speed, 4s);
	animation-timing-function: linear;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-direction, normal);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-ripple-color-1 { fill: var(--gtf-ripple-color-1, #800080); }
.gtf-ripple-color-2 { fill: var(--gtf-ripple-color-2, #dc143c); }
.gtf-ripple-color-3 { fill: var(--gtf-ripple-color-3, #ff4500); }
.gtf-ripple-color-4 { fill: var(--gtf-ripple-color-4, #ffd700); }
.gtf-ripple-color-5 { fill: var(--gtf-ripple-color-5, #9acd32); }
.gtf-ripple-color-6 { fill: var(--gtf-ripple-color-6, #40e0d0); }
.gtf-ripple-color-7 { fill: var(--gtf-ripple-color-7, #4169e1); }
.gtf-ripple-color-8 { fill: var(--gtf-ripple-color-8, #ba55d3); }

.gtf-widget.gtf-active .gtf-ripple-shape {
	animation-play-state: running;
}

.gtf-fire-text {
	stroke: #330000;
	stroke-width: 8;
	stroke-opacity: 0.5;
}

.gtf-fire-image {
	transform-box: fill-box;
	transform-origin: center;
	animation-name: gtf-fire-drift;
	animation-duration: var(--gtf-fire-speed, 2s);
	animation-timing-function: ease-in-out;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-direction, normal);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-widget.gtf-active .gtf-fire-image {
	animation-play-state: running;
}

.gtf-fire-sprite {
	animation-name: gtf-fire-frames;
	animation-duration: var(--gtf-fire-flicker-speed, 3s);
	animation-timing-function: steps(60, end);
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-direction, normal);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-widget.gtf-active .gtf-fire-sprite {
	animation-play-state: running;
}

.gtf-sparkle-text {
	stroke: #551f7a;
	stroke-width: 3;
}

.gtf-sparkle-shape {
	stroke-width: 0;
	animation-name: gtf-sparkle-pulse;
	animation-duration: var(--gtf-sparkle-speed, 2s);
	animation-timing-function: ease-in-out;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-direction, normal);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-sparkle-color-1 { fill: var(--gtf-sparkle-color-1, #551f7a); stroke: var(--gtf-sparkle-color-1, #551f7a); }
.gtf-sparkle-color-2 { fill: var(--gtf-sparkle-color-2, #ba2799); stroke: var(--gtf-sparkle-color-2, #ba2799); }
.gtf-sparkle-color-3 { fill: var(--gtf-sparkle-color-3, #d9587a); stroke: var(--gtf-sparkle-color-3, #d9587a); }
.gtf-sparkle-color-4 { fill: var(--gtf-sparkle-color-4, #ffdd00); stroke: var(--gtf-sparkle-color-4, #ffdd00); }
.gtf-sparkle-color-5 { fill: var(--gtf-sparkle-color-5, #fff3a1); stroke: var(--gtf-sparkle-color-5, #fff3a1); }

.gtf-widget.gtf-active .gtf-sparkle-shape {
	animation-play-state: running;
}

.gtf-measure-layer {
	fill: transparent;
	stroke: transparent;
	pointer-events: none;
}

.gtf-stroke-layer {
	fill: none;
	stroke-linecap: butt;
	stroke-linejoin: round;
	stroke-dasharray: var(--gtf-dash, 70) var(--gtf-space, 330);
	stroke-dashoffset: 0;
	animation-name: gtf-dashed-stroke-travel;
	animation-duration: var(--gtf-speed, 6s);
	animation-timing-function: linear;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-direction, normal);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-widget.gtf-active .gtf-stroke-layer {
	animation-play-state: running;
}

.gtf-pulsing-text {
	fill: none;
	stroke-linejoin: round;
	stroke-width: 8;
}

.gtf-dot {
	stroke-width: 0;
	stroke-opacity: 1;
	animation-name: gtf-dot-pulse;
	animation-duration: var(--gtf-speed, 1.5s);
	animation-timing-function: ease-in-out;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-direction, normal);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-widget.gtf-active .gtf-dot {
	animation-play-state: running;
}

.gtf-effect-rotating-rings .gtf-stage {
	background-image: radial-gradient(var(--gtf-ring-bg-inner, #9b70b6), var(--gtf-ring-bg-outer, #301e3c));
}

.gtf-ring-fill {
	transform-box: fill-box;
	transform-origin: center;
	animation-name: gtf-ring-rotate;
	animation-duration: var(--gtf-ring-rotation-speed, 30s);
	animation-timing-function: linear;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-direction, normal);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-ring-shape {
	fill: none;
	stroke: #fff;
	stroke-width: 2;
}

.gtf-ring-pulse {
	fill: #fff;
	stroke: #fff;
	stroke-width: 0;
	animation-name: gtf-ring-pulse;
	animation-duration: var(--gtf-ring-pulse-speed, 5s);
	animation-timing-function: ease-in-out;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-ring-shadow {
	fill: rgba(0, 0, 0, 0.25);
	stroke: none;
	transform: translate(var(--gtf-ring-shadow-offset, 8px), var(--gtf-ring-shadow-offset, 8px));
}

.gtf-ring-outline {
	fill: transparent;
	stroke: #fff;
	stroke-width: 4;
	stroke-linejoin: round;
}

.gtf-widget.gtf-active .gtf-ring-fill,
.gtf-widget.gtf-active .gtf-ring-pulse {
	animation-play-state: running;
}

.gtf-panel-shape {
	transform-box: fill-box;
	transform-origin: var(--gtf-panel-origin, left center);
	transform: scaleX(0) translateX(0);
	animation-name: gtf-panel-expand;
	animation-duration: var(--gtf-panel-speed, 3s);
	animation-timing-function: ease-in-out;
	animation-iteration-count: var(--gtf-iterations, infinite);
	animation-direction: var(--gtf-panel-direction, alternate);
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.gtf-panel-1 { fill: #0e1826; }
.gtf-panel-2 { fill: #166973; }
.gtf-panel-3 { fill: #65bfa6; }
.gtf-panel-4 { fill: #f2cd5c; }
.gtf-panel-5 { fill: #f26444; }

.gtf-panel-shadow-group {
	transform: translate(var(--gtf-panel-shadow-offset, 10px), var(--gtf-panel-shadow-offset, 10px));
}

.gtf-panel-shadow-shape {
	fill: rgba(0, 0, 0, 0.2);
}

.gtf-widget.gtf-active .gtf-panel-shape {
	animation-play-state: running;
}

.gtf-layer-1 { stroke: #f2385a; }
.gtf-layer-2 { stroke: #f5a503; }
.gtf-layer-3 { stroke: #e9f1df; }
.gtf-layer-4 { stroke: #56d9cd; }
.gtf-layer-5 { stroke: #3aa1bf; }
.gtf-dot-1 { fill: #3f0b1b; stroke: #3f0b1b; }
.gtf-dot-2 { fill: #7a1631; stroke: #7a1631; }
.gtf-dot-3 { fill: #cf423c; stroke: #cf423c; }
.gtf-dot-4 { fill: #fc7d49; stroke: #fc7d49; }
.gtf-dot-5 { fill: #ffd462; stroke: #ffd462; }

.gtf-sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

@keyframes gtf-dashed-stroke-travel {
	to { stroke-dashoffset: var(--gtf-offset, -400); }
}

@keyframes gtf-dot-pulse {
	50% {
		stroke-width: var(--gtf-dot-pulse, 27px);
		stroke-opacity: var(--gtf-dot-opacity, 0.5);
	}
}

@keyframes gtf-ring-pulse {
	50% { stroke-width: var(--gtf-ring-pulse-expansion, 15px); }
}

@keyframes gtf-ring-rotate {
	to { transform: rotate(360deg); }
}

@keyframes gtf-panel-expand {
	to { transform: scaleX(1) translateX(var(--gtf-panel-travel, 20px)); }
}

@keyframes gtf-stripes-scroll {
	to { background-position: 0 var(--gtf-stripe-offset, -50px); }
}

@keyframes gtf-matrix-shift {
	0% { transform: translate(var(--gtf-matrix-motion-neg, -25px), var(--gtf-matrix-motion-neg, -25px)); filter: blur(var(--gtf-matrix-blur, 35px)) hue-rotate(0deg); }
	25% { transform: translate(var(--gtf-matrix-motion, 25px), var(--gtf-matrix-motion-neg, -25px)); filter: blur(var(--gtf-matrix-blur, 35px)) hue-rotate(90deg); }
	50% { transform: translate(var(--gtf-matrix-motion, 25px), var(--gtf-matrix-motion, 25px)); filter: blur(var(--gtf-matrix-blur, 35px)) hue-rotate(180deg); }
	75% { transform: translate(var(--gtf-matrix-motion-neg, -25px), var(--gtf-matrix-motion, 25px)); filter: blur(var(--gtf-matrix-blur, 35px)) hue-rotate(270deg); }
	100% { transform: translate(var(--gtf-matrix-motion-neg, -25px), var(--gtf-matrix-motion-neg, -25px)); filter: blur(var(--gtf-matrix-blur, 35px)) hue-rotate(360deg); }
}

@keyframes gtf-ripple-colors {
	0%, 100% { fill: var(--gtf-ripple-color-1, #800080); }
	12.5% { fill: var(--gtf-ripple-color-2, #dc143c); }
	25% { fill: var(--gtf-ripple-color-3, #ff4500); }
	37.5% { fill: var(--gtf-ripple-color-4, #ffd700); }
	50% { fill: var(--gtf-ripple-color-5, #9acd32); }
	62.5% { fill: var(--gtf-ripple-color-6, #40e0d0); }
	75% { fill: var(--gtf-ripple-color-7, #4169e1); }
	87.5% { fill: var(--gtf-ripple-color-8, #ba55d3); }
}

@keyframes gtf-fire-drift {
	0%, 100% {
		transform: translateY(0) scale(1);
		filter: brightness(1) saturate(1.05);
		opacity: 1;
	}
	45% {
		transform: translateY(var(--gtf-fire-drift, -28px)) scale(1.04, 1.1);
		filter: brightness(var(--gtf-fire-bright, 1.35)) saturate(1.35);
		opacity: var(--gtf-fire-opacity, 0.94);
	}
	70% {
		transform: translateY(var(--gtf-fire-drift-mid, -15px)) scale(0.98, 1.05);
		filter: brightness(var(--gtf-fire-bright-mid, 1.16)) saturate(1.2);
	}
}

@keyframes gtf-fire-frames {
	to { transform: translateX(-15360px); }
}

@keyframes gtf-sparkle-pulse {
	50% { stroke-width: var(--gtf-sparkle-pulse, 8px); }
}