@font-face {
	font-display: swap;
	font-family: 'Marvin Visions';
	font-style: normal;
	src: local('MarvinVisions-Variable'), url('../webfonts/MarvinVisions-Variable.woff2') format('woff2');
}

/**
 * logomarks
**************************/
.running-head .logomark ul {
	width: 36px; height: 36px;
}

.running-head .logomark--theturninggate div {
	color: #ffffff;
  font-size: 1.125rem;
}

@media screen and ( max-width: 614px ) {
  .running-head .logomark--theturninggate div::before {
    content: "TTG";
    display: block;
    font-weight: 600;
    letter-spacing: 0.075rem;
  }

  .running-head .logomark--theturninggate div span {
    display: none;
  }
}

.header-primary .logomark--backlight ul {
	width: 64px; height: 64px;
}

.header-primary .logomark--backlight div {
	color: #ffffff;
	font-family: 'Marvin Visions', sans-serif;
	font-size: 3rem;
	text-shadow: rgba(0, 0, 0, 0.5) 0px 1px 3px;
}

@media screen and ( max-width: 1024px ) {
	.header-primary .logomark--backlight ul {
		width: 48px; height: 48px;
	}

	.header-primary .logomark--backlight div {
		font-size: 2rem;
	}
}




/*
.logomark,
.logomark * {
	all: unset;
}

.logomark a {
	align-items: center;
	cursor: pointer;
	display: flex;
	gap: 8px;
}

.logomark a:hover {
	text-decoration: none;
}

.logomark ul {
	box-sizing: border-box;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	width: 36px; height: 36px;
}

.logomark .col_x2 {
	grid-column: span 2;
}

.logomark .row_x2 {
	grid-row: auto / span 2;
}

.logomark--theturninggate li.color_999999 { background-color: #9E9E9E; }
.logomark--theturninggate li.color_66ccff { background-color: #90CAF9; }
.logomark--theturninggate li.color_0099cc { background-color: #2196F3; }
.logomark--theturninggate li.color_99cc66 { background-color: #B2FF59; }
.logomark--theturninggate li.color_66cc33 { background-color: #8BC34A; }
.logomark--theturninggate li.color_ff9933 { background-color: #FF9800; }

.logomark--theturninggate ul {
	background-color: #fff;
	border: 2px solid transparent;
	gap: 2px;
}

.logomark--theturninggate div {
	color: #ffffff;
}

@media screen and ( max-width: 614px ) {
.logomark--theturninggate div::before {
		content: "TTG";
		display: block;
	}

.logomark--theturninggate div span {
		display: none;
	}
}

.logomark--backlight ul {
	background-color: rgba(255, 255, 255, 0.25);
	background-color: rgba(0, 0, 0, 0.25);
	border: 2px solid transparent;
	width: 64px; height: 64px;
}

.logomark--backlight li {
	background-color: #ffffff;
}

.logomark--backlight div {
	color: #ffffff;
	font-family: 'Marvin Visions', sans-serif;
	font-size: 3rem;
	text-shadow: rgba(0, 0, 0, 0.5) 0px 1px 3px;
}

@media screen and ( max-width: 1024px ) {
	.logomark--backlight ul {
		width: 48px; height: 48px;
	}

	.logomark--backlight div {
		font-size: 2rem;
	}
}
/** */

/**
 * shopping buttons
**************************/
#backlight-shopping-buttons {
	align-items: center;
	display: flex;
	gap: 8px;
}

#backlight-shopping-buttons a {
	border-radius: 8px;
	color: #fff;
	display: block;
	font-size: 0.875rem;
	line-height: 36px;
	padding: 0 12px;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.75);
}

.button--get-backlight {
	background-color: #2196f3;
}

.button--view-cart {
	background-color: #8BC34A;
}

@media screen and ( max-width: 1024px ) {
	#backlight-shopping-buttons {
		margin-right: 9px;
	}

	#backlight-shopping-buttons a {
		font-size: 0.75rem;
		font-weight: 600;
		line-height: 28px;
		padding: 0 8px;
	}
}
