﻿@font-face {
    font-family: 'jibril';
    src: url('../fonts/jibrilregular-webfont.woff2') format('woff2'),
         url('../fonts/jibrilregular-webfont.woff') format('woff'),
         url('../fonts/JibrilRegular.otf') format('otf');
    font-weight: normal;
    font-style: normal;
}

body {
	margin: 0;
	background: #000 url(../media/bg3_b2.jpg);
	background-size: cover;
	background-attachment: fixed;
	min-width: 300px;
}

.text-plain {
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    font-family: 'Roboto Condensed', sans-serif;
}

a {
	color: inherit;
	text-decoration: none;
}

a:hover {
	color: inherit;
	/* opacity: 0.5; */
}

b { text-decoration: none; text-align: left; font-size: 1em; }

hr { background: none; }

ul {
	 padding-left: 0.3em;
	 font-size: larger;
}

ul:nth-child(1), ul:nth-child(2), ul:nth-child(3) {
	font-size: large;
	padding-left: 1em;
	color: yellow;
	font-weight: 200;
}

li {
	list-style-type: none;
}

#shop { margin-bottom: 5em; }

/* ----- Snack bar for sign-up form START ----- */

#toast {
	visibility: hidden;
	min-width: 250px;
	margin-left: -125px;
	background-color: #333;
	color: #fff;
	text-align: center;
	border-radius: 25px;
	padding: 16px;
	position: fixed;
	z-index: 1;
	left: 50%;
	bottom: 130px;
	font-size: 17px;
}

#toast.show {
  visibility: visible;
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

@-webkit-keyframes fadein {
  from {bottom: 0; opacity: 0;} 
  to {bottom: 130px; opacity: 1;}
}

@keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 130px; opacity: 1;}
}

@-webkit-keyframes fadeout {
  from {bottom: 130px; opacity: 1;} 
  to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
  from {bottom: 130px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}

/* ----- Snack bar for sign-up form END ----- */


.hero hr { display: none; }

.benefits hr { background: none; }

.jibril { font-family: Jibril; }

.font-display { font-family: Righteous; }

/* Hero: brand → star → H1 → tagline */
.hero-star {
	text-align: center;
	color: #2965ae;
	font-size: 1.35rem;
	line-height: 1;
	margin: 0.35em 0 0.15em;
}

.hero-star .fa-star {
	color: #2965ae;
}

h1,
h1.hero-title {
	color: crimson;
	text-align: center;
	font-family: Righteous, sans-serif;
	font-size: 1.75rem;
	font-weight: normal;
	line-height: 1.25;
	margin: 0.15em 0 0.35em;
	padding: 0;
}

.hero-tagline {
	color: #c62828;
	text-align: center;
	font-family: "Roboto Condensed", system-ui, sans-serif;
	font-size: 1.05rem;
	font-weight: 400;
	line-height: 1.35;
	margin: 0 0 0.5em;
	padding: 0 0.5em;
	opacity: 0.95;
}

h2 { font-weight: normal; font-style: normal; line-height: 1.2em !important; font-size: 1.5em !important; }

.welcome-card {
	padding: 0.5em;
	/* background: rgba(11, 100, 195, 0.5); */
	font-size: 1rem;
	line-height: 2em;
}

h2 {
	/* margin: -0.3em -0.3em 0.5em; */
	padding: 0.5em;
	/* background: rgba(11, 100, 195, 0.5); */
	/* border-top-left-radius: 20px; */
	/* border-top-right-radius: 20px; */
	font-size: 1rem;
	line-height: 2em;
}

.info-meta {}

.info-meta span {
	padding-left: 0.5em;
	display: block;
}

/* FLAG DROPDOWN MENU ---> */

.flag-active {
    width: 1.5em;
    height: 1em;
    border: 0;
}

.flag-fi, .flag-en {
    /* position: absolute; */
    width: 1.5em;
    height: 1em;
    border: 1px solid black;
}

.flag-fi {
    background: url(../media/fi.svg) no-repeat center;
    background-size: 1.5em;
    top: 1.1em;
    left: 1em;
}

.flag-en {
    background: url(../media/en.svg) no-repeat center;
    background-size: 1.5em;
    top: 1.1em;
    left: 3em;
}

.logo-slot {
    margin: 2em 0 0 0;
    padding-bottom: 3.5em;
	display: none; /*temp*/
}

.logo {
    background: url(../media/circle.svg) no-repeat center;
    max-width: 100%;
    height: 7em;
    margin-left: auto;
    margin-right: auto;
    transform: scale(2);
}

.sponsor-logo {
	position: absolute;
	width: 100px;
	right: 20px;
	top: 15px;
	margin-top: 40px;
	background: url(../media/shlogo.svg) no-repeat center;
	background-size: 100px;
	 z-index: -1;
}

.kuumapaino {
	position: absolute;
	width: 125px;
	right: 20px;
	top: 55px;
	background: url(../media/kuumapaino.svg) no-repeat center;
	background-size: 125px;
	z-index: 99;
}

.content-shell {
    border: 0;
    margin: 1em auto;
    width: 100%;
    max-width: 42rem;
    box-sizing: border-box;
    border-radius: 1.25em;
    background: url(../media/head.svg) no-repeat bottom;
    background-clip: content-box;
}

.content-panel {
	padding: 1em;
	margin: 1em auto;
	width: 100%;
	max-width: 42rem;
	box-sizing: border-box;
	border-radius: 1.5em;
	background: rgba(255, 150, 150, 0.3);
	background: rgba(0, 71, 189, 0.3);
	/* Single-column layout (mobile-first, all viewports) */
	display: block;
}

.hero, .content-main, .content-secondary, .content-media {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding-bottom: 0em;
}

.hero {
    width: 100%;
    color: white;
	padding-bottom: 0.5em;
}

.content-main {
    margin: auto;
    font-family: 'Alex', sans-serif;
    font-size: 1em;
    line-height: 2;
    color: #ffc107;
    color: white;
}

.info-meta { color: yellow; }

.info-card { color: gold; }

.info-card div { margin-bottom: 10px; }

.info-card { color: yellow; }

/* Semantic headings — same visual weight as former <b> labels */
.card-heading {
	font-size: 1em;
	font-weight: 700;
	margin: 0 0 0.35em;
	line-height: 1.3;
	color: inherit;
}

.card-heading--sub {
	font-size: 0.95em;
	margin-top: 0.75em;
}

h2.section-label {
	/* reuse .section-label look as real heading */
	display: block;
	margin: 0 0 0.5em;
}

.benefits { color: white; }

.benefits .fas { color: gold; }

.benefits .fa-trophy { color: yellow; }

.content-secondary {
    margin: auto;
    font-family: 'Alex', sans-serif;
    font-size: 1em;
    line-height: 2;
    color: #ffc107;
    color: white;
}

.photo-grid, .photo-grid--gear, .photo-grid--feature {
	text-align: center;
	color: white;
	display: flex;
	width: 100%;
	margin: auto;
}

.section-label {
	color: #ff0279;
	color: #2965ae;
	font-weight: 900;
}

.detail-row {
	padding-left: 10px;
	color: yellow;
}

.photo-grid img, .photo-grid--gear img, .photo-grid--feature img {
	max-width: 100%;
	width: 100%;
	height: auto;
	display: block;
	object-fit: contain;
	/*border: 1px solid white;*/
	margin: auto;
	border-radius: 2em !important;
	border-top-right-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
	border: 3px solid rgba(255, 255, 255, .15);
}

/* Nääshalli floorplan SVG — wide, no forced aspect box */
.venue-floorplan {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	margin: 0.5em auto 0;
	vertical-align: middle;
}

.photo-grid span, .photo-grid--gear span, .photo-grid--feature span {
	background: rgba(255, 255, 255, .15);
	/*border-radius: 1em;*/
	margin: 0.25em 0 2em;
	padding: 0.5em;
	border-radius: 2em !important;
	border-top-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	font-size: 0.75em;
	line-height: 1.5em;
}

.photo-grid div , .photo-grid--gear div, .photo-grid--feature div {
	display: grid;
	margin: auto;
	padding: 0 0.25em 0 0.25em;
}

.photo-grid div:nth-child(1), .photo-grid--gear div:nth-child(1), .photo-grid--feature div:nth-child(1) {
	padding-right: 0.5em;
}

.photo-grid div:nth-child(2), .photo-grid--gear div:nth-child(2), .photo-grid--feature div:nth-child(2) {
	padding-left: 0.5em;
}

.photo-grid img:first-child {
	margin-top: 2em;
}

.photo-grid--gear div:first-child img {
	border-top-left-radius: 2em;
}

.photo-grid--gear div:nth-child(2) img {
	border-top-right-radius: 2em;
}

.training-program {
	background: rgba(16, 110, 22, 0.85);
	margin: 0 0.5em 5em 0.5em;
	border-bottom-left-radius: 2em;
	border-bottom-right-radius: 2em;
	border: 3px solid rgba(255, 255, 255, .15);
}

.training-program i {
	color: yellow;
	font-size: 1.25em;
}

.training-program span:nth-child(1) i, .training-program span:nth-child(2) i {
	font-size: 1.5em;
}

.training-program span:nth-child(3) i, .training-program span:nth-child(5) i {
	font-size: 1em;
}

.training-program div {
	text-align: center;
	border-bottom-left-radius: 2em;
	border-bottom-right-radius: 2em;
	color: white;
	padding: 1em 1em;
}

.training-program span {
	display: block;
	margin: 1em 0 1em;
}

.training-program span:first-child {
	margin: 0 0 1em;
}

.training-program div:nth-child(2)  {
	width: 90%;
	margin: auto;
	text-align: left;
}

.footer-panel {
    padding: 1em;
    margin: 1em auto;
    max-width: 50em;
/* Commented in for XMAS (start)*/
	background: rgb(255, 165, 0, .85);
	border-radius: 1.5em;
/* Commented in for XMAS (end)*/
    /* opacity: 0.85; */
}

.footer-panel__inner {
    margin: auto;
    font-family: 'Alex', sans-serif;
    font-size: 1em;
    line-height: 2;
    color: #ffc107;
    color: white;
}

.footer-panel__inner a {
    color: white;
    text-decoration: none;
    cursor: pointer !important;
}

.hero, .content-main, .content-secondary, .content-media { padding-left: 1em; }

.hero, .content-main, .content-secondary, .footer-panel__inner {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 1.25em;
}

.text_border {
    position: relative;
    left: -55%;
    margin: 1.5em;
    padding: 1em;
    border: 6px solid white;
    border-radius: 1.5em;
    background: url(../media/bg.jpg) no-repeat center;
    background-size: 100%;
    text-align: center;
    color: red;
}

.logo-grid {
	margin: auto;
	margin-top: 2em;
	margin-bottom: 2em;
	padding: 0 2em 0 2em;
	max-width: 30em;
	display: -ms-flexbox; /* IE10 */
	display: flex;
	-ms-flex-wrap: wrap; /* IE10 */
	flex-wrap: wrap;
}

.logo-grid__col {
	-ms-flex: 33%; /* IE10 */
	flex: 33%;
	max-width: 33%;
}

.logo-grid__col img {
	width: 100%;
	height: auto;
	margin-top: 0;
	vertical-align: middle;
	display: block;
	object-fit: contain;
}

.grid2 { padding: 5px; }

.js:hover {
	transform: scale(3.1);
}

@-webkit-keyframes glow {
  from { opacity: 0.1; }
  to { opacity: 0.9 ;}
}

@keyframes glow {
  from { opacity: 0.1; }
  to { opacity: 0.9 ;}
}

[class^="logo-grid__img"]:hover {
	opacity: 1;
	border: 2px solid black;
	transform: scale(1.3);
}

.logo-grid__img--1:nth-child(1) {
	-webkit-animation-name: glow; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	animation-name: glow;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-delay: -0.9s;
}

.logo-grid__img--1:nth-child(2) {
	-webkit-animation-name: glow; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	animation-name: glow;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-delay: -0.8s;
}

.logo-grid__img--1:nth-child(3) {
	-webkit-animation-name: glow; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	animation-name: glow;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-delay: -0.7s;
}

.logo-grid__img--2:nth-child(1) {
	-webkit-animation-name: glow; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	animation-name: glow;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-delay: -0.6s;
}

.logo-grid__img--2:nth-child(2) {
	-webkit-animation-name: glow; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	animation-name: glow;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-delay: -0.5s;
}

.logo-grid__img--2:nth-child(3) {
	-webkit-animation-name: glow; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	animation-name: glow;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-delay: -0.4s;
}

.logo-grid__img--3:nth-child(1) {
	-webkit-animation-name: glow; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	animation-name: glow;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-delay: -0.3s;
}

.logo-grid__img--3:nth-child(2) {
	-webkit-animation-name: glow; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	animation-name: glow;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-delay: -0.2s;
}

.logo-grid__img--3:nth-child(3) {
	-webkit-animation-name: glow; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	animation-name: glow;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-delay: -0.1s;
}

.signup {
	margin: 1em;
	background: #17a2b8;
	background: rgba(23, 162, 184, 0.7);
	padding: 2em 1em 2em 1em;
	overflow: hidden;
}

/* Signup title block — centered stack; Righteous for lines, Jibril for brand bar */
/* Note: global h2 uses font-size !important — override here */
h2.signup__heading,
.signup__heading {
	text-align: center;
	color: #111;
	font-family: Righteous, cursive !important;
	font-weight: normal !important;
	font-size: clamp(2.25rem, 9vw, 3.25rem) !important;
	line-height: 1.05 !important;
	margin: 0 0 1.25em;
	padding: 0.25em 0 0;
}

.signup__heading-line {
	display: block;
	font-family: Righteous, cursive !important;
	font-weight: normal;
	font-size: 1em !important;
}

.signup__brand {
	display: block;
	width: calc(100% + 2em);
	margin: 0.5em -1em;
	padding: 0.55em 0.75em 0.5em;
	background: rgba(220, 53, 69, 0.9);
	color: #fff;
	font-family: Jibril, jibril, sans-serif !important;
	font-weight: normal !important;
	/* Larger brand text in bar (closer to desired mockup) */
	font-size: clamp(2rem, 9vw, 3.1rem) !important;
	line-height: 1.02 !important;
	letter-spacing: 0.01em;
	text-align: center;
	box-sizing: border-box;
}

.signup__brand-line {
	display: block;
	font-family: inherit !important;
	font-size: 1em !important;
}

.signup__inner {
    display: block;
    color: white;
}

.signup__inner .lead {
	color: rgba(255, 255, 255, 0.95);
}

.signup__hint {
	color: #dc3545;
	font-weight: 700;
}

.signup__hint--secondary {
	color: #5132a2;
	font-weight: normal;
}

.reviews {
	
}

.reviews__inner {
	background: rgba(23, 162, 184, 0.13333);
	margin: auto;
	/*width: 800px;*/
	text-align: center;
	padding: 20px 0 20px 0;
	/*transform: scale(0.9);*/
}

.reviews__row {
	transform: scale(0.9);
}

.reviews__img {
	width: 390px;
	border: 1px solid black;
	margin: 3px;
}

.venue-map {
	overflow: hidden;
	border: 1px solid black;
	margin-bottom: 3em;
}

.venue-map__img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	object-fit: contain;
	transform: none;
}

.brand-title {
	font-family: Jibril;
	font-size: 2em;
	line-height: 1;
	color: white;
	text-align: center;
	padding-top: 0.2em;
}

.brand-banner {
	font-family: Jibril;
	color: white;
	background: rgba(220, 53, 69, 0.9);
	margin: 0 -0.4em 0;
	padding: 0.2em 0 0.2em 0;
}

.surface-red {
	background: rgba(220, 53, 69, 0.9);
	background: rgba(23, 162, 184, 0.7);
	background: crimson;
	opacity: 0.85;
}

.surface-blue {
	background: rgba(11, 100, 195, 0.5);
}

.surface-rounded {
	border-radius: 20px;
	border-bottom-left-radius: 0;
}

.bg-head {
    display: none; /* block */
    position: fixed;
    left: calc(50% - 260px);
    bottom: -4px;
    width: 520px;
    height: 300px;
    /* background-color: powderblue; */
    background: url(../media/head.svg) no-repeat;
    /* border: 0px solid black; */
    z-index: -1;
}

.social-bar {
	position: fixed;
	bottom: 0;
	width: 100%;
}

.social-bar__inner {
	padding-top: 0.5em;
	position: relative;
	margin: auto;
	height: 4em;
	/* max-width: 50em; */
	background: white;
	vertical-align: middle;
	text-align: center;
	z-index: 1;
}

.social-bar__link {
	font-size: 2em;
	padding: 0 0.3em 0 0.3em;
	cursor: pointer;
	/** ANIMATION BOUNCE **/	
	display: inline-block;
	animation: 1s bounce infinite;
}

.social-bar span:nth-child(2) {
  animation-delay: 0.30s;
}

.social-bar span:last-child {
  animation-delay: 0.60s;
}

@keyframes bounce {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}

@keyframes link {
  from { opacity: 0.1; }
  to { opacity: 0.9 ;}
}

.social-bar__link a:hover {
	-webkit-animation-name: link;
	-webkit-animation-duration: 1.5s;
	animation-name: link;
	animation-duration: 1.5s;
	animation-iteration-count: 1;
}

.social-bar__link--em {
	color: #4779ad; /* blue */
	color: #ed74ff; /* pink */
	color: #d39e00; /* orange */
}

.social-bar__link--ig { color: #dc3545; }

.social-bar__link--fb { color: #235693; }

.page-ears {
	display: none;
	position: absolute;
	width: 100%;
	height: 4em;
	top: 0;
	left: 0;
}

.page-ears__left-wrap, .page-ears__right-wrap {
	position: relative;
	top: 30.30em;
	width: 49em;
	margin: auto;
}

.page-ears__left, .page-ears__right {
	position: absolute;
	margin: auto;
	width: 10em;
	height: 4em;
	background: #003580;
	/* opacity: 0.85; */
}

.page-ears__left {
	border-top-right-radius: 2em;
	left: 0;
	/* background: crimson; */
}

.page-ears__right {
	border-top-left-radius: 2em;
	right: 0em;
	/* background: black; */
}

.status-chip {
	margin: 3px;
	width: 50%;
	padding: 3px;
	border: 1px solid white;
	text-align: center;
	font-weight: 700;
}

.status-chip--active {
	background: limegreen;
	color: white;
}

.status-chip--break {
	text-decoration: none;
	background: grey;
	border-color: lightgrey;
	color: lightgrey;
}

.section-advanced { display: block; }
.section-experienced { display: none; }

/* ——— Responsive (single-column polish only) ——— */

/* Very small phones */
@media screen and (max-width: 359px) {
	.brand-title {
		font-size: 1.6em;
	}
	h1.hero-title {
		font-size: 1.35rem;
	}
	.hero-tagline {
		font-size: 0.95rem;
	}
}

/* Tablet / desktop: same layout, slightly larger type & chrome */
@media screen and (min-width: 768px) {
	.brand-title {
		font-size: 3.2em;
	}
	h1.hero-title {
		font-size: 2rem;
	}
	.hero-tagline {
		font-size: 1.15rem;
	}
	.hero {
		padding-top: 0.75em;
	}
	.content-panel {
		background: rgba(11, 100, 195, 0.5);
		border-radius: 2em;
	}
	.content-shell__bg {
		max-width: 42rem;
		margin: 0 auto;
		border-bottom-left-radius: 2em;
		border-bottom-right-radius: 2em;
	}
	.signup {
		max-width: 42rem;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 1.5em;
	}
	.signup__inner {
		max-width: 100%;
	}
	.social-bar__inner {
		height: 5em;
	}
	.social-bar__link {
		font-size: 2.5em;
		padding: 0 1.5em;
	}
	.sponsor-logo {
		width: 140px;
		background-size: 140px;
		right: 24px;
		top: 12px;
	}
	.venue-map {
		border: 3px solid crimson;
		margin-bottom: 3em;
	}
	[class^="logo-grid__img"]:hover {
		border: 5px solid white;
		transform: scale(1.15);
	}
	/* nav-ticker stays visible (same UI as mobile) */
}

@media screen and (min-width: 1024px) {
	.brand-title {
		font-size: 4em;
	}
	.sponsor-logo {
		width: 180px;
		background-size: 180px;
	}
	.social-bar__link {
		font-size: 3em;
		padding: 0 2em;
	}
}

.fa-chevron-right { display: inline-block; }
.list-unstyled { color: white; background: #dc3545; padding-left: 0.5em; }

.bg {
	position: fixed;
	top: -50%;
	left: -50%;
	width: 200%;
	height: 200%;
	z-index: -9999;
}

.bg img {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	min-width: 50%;
	min-height: 50%;
}

/* Hamburger menu — same on all viewports (mobile-first) */
.site-header { position: sticky; top: 0; z-index: 1; }
#site-nav {
	width: 100%;
	background: #ff004f;
}

#nav-toggle { display: none; }

#site-nav label {
	display: inline-block;
	color: #dc143c;
	background: #fff;
	font-size: 1.2em;
	font-style: normal;
	padding: 10px;
	margin-bottom: 0;
	cursor: pointer;
}

#site-nav-menu {
	display: none;
	z-index: 9999;
}

#site-nav-menu a {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 10px;
	color: #fff;
	text-decoration: none;
	text-align: center;
	border-top: 1px solid #ca0000;
}

#site-nav-menu a:hover { background: #8a0000; }

#site-nav input:checked ~ #site-nav-menu { display: block; }


/* VERTICAL NEWS TICKER — 2 lines only */
.nav-ticker {
	display: inline-block;
	vertical-align: middle;
	padding-left: 5px;
	height: 30px;
	line-height: 30px;
	overflow: hidden;
	text-align: left;
	color: white;
}

.nav-ticker__track {
	position: relative;
	animation: tickerv 8s infinite cubic-bezier(1, 0, 0.5, 0);
}

.nav-ticker__item {
	height: 30px;
	line-height: 30px;
	white-space: nowrap;
}

/* Hold each of the 2 items, then loop (no empty slide) */
@keyframes tickerv {
	0%, 40% { transform: translateY(0); }
	50%, 90% { transform: translateY(-30px); }
	100% { transform: translateY(0); }
}

.nav-ticker__track:hover {
	animation-play-state: paused;
}


