@font-face {
	font-family: 'Racing Sans One';
	font-style: normal;
	font-weight: 400;
	src: url(https://fonts.gstatic.com/l/font?kit=sykr-yRtm7EvTrXNxkv5jfKKyDCwKmLpfPJ60FC-Aex9cpU&skey=c54fc5912484ccc5&v=v15) format('woff2');
	font-display:swap;
  }


k-debugTools {
	xdisplay: none;
	position: absolute;
}

k-debugBox {
	display: block;
	xposition: fixed;
	xtop: 200;
	xleft: 20;
	xright: 20;
	xbottom: 20;
	xvisibility: hidden;
	border: 2px solid green;
	box-shadow: 10px 10px 10px #000;
	margin: 10px;
	xwidth: 900px;
	padding: 5px;
	height: 80%;
	color: lime;
	opacity: 0.8;
	background-color: #000;
	z-index: 10000;
	overflow-y: scroll;
	text-align: left;
}

.navThing { display:none; }
k-tabmenu, k-tabmenu-item { display:none; }
* {
	box-sizing: border-box;
}

body {
	font-family: sans-serif;
	font-size: 13px;
	background-color: #fff;
	line-height: 150%;
}

main {
	width: 100%;
}

/* Forms */
input,
select,
textarea {
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
	background-color: #f9f9f9;
	-webkit-tap-highlight-color: transparent;
}

input:focus,
select:focus,
textarea:focus {
	padding: 10px;
	outline: none;
	box-shadow: none;
	background-color: #fff;
}

input[type="checkbox"] {
	width: 15px;
}

textarea {
	min-width: 300px;
	min-height: 100px;
	resize: none !important;
	width: 100%;
	height: 100px;
}

select {
	min-width: 300px;
	width: 100%;
}
option {
	padding: 6px;
}

fieldset {
	background-color: #eee;
	width: 100%;
	padding: 20px;
}

fieldset legend {
	background-color: #555;
	color: white;
	padding: 4px;
	padding-left: 20px;
	padding-right: 40px;
}

button {
	background-image: linear-gradient(#f7f8fa, #e7e9ec);
	border-color: #adb1b8 #a2a6ac #8d9096;
	border-style: solid;
	border-width: 1px;
	border-radius: 3px;
	box-shadow: rgba(255, 255, 255, 0.6) 0 1px 0 inset;
	box-sizing: border-box;
	color: #0f1111;
	cursor: pointer;
	display: inline-block;
	font-family: sans-serif;
	font-size: 14px;
	font-size: 13px;
	outline: 0;
	overflow: hidden;
	padding: 7px 12px;
	text-align: center;
	text-overflow: ellipsis;
	user-select: none;
	white-space: nowrap;

	&:active {
		border-color: #e77600;
		box-shadow: orange 0 0 2px 1px;
		outline: 0;
	}

	&:not(focus) {
		box-shadow: 0;
		outline: 5;
	}
}

req {
	color: red;
	margin-left: 3px;
}

#contactForm {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

k-title a {
	user-select: none;
	xposition: absolute;
	left: 50px;
	top: 30px;
	text-decoration: none;
	font-family: "Racing Sans One";
	white-space: nowrap;
	font-size: 48px;
	color: white;
	font-weight: 300;
	margin: 0px;
	letter-spacing: 0.04rem;
	padding: 0;
	-webkit-text-stroke-width: 1px;
	-webkit-text-stroke-color: black;
	text-shadow: 2px 3px #000000;
	line-height: 1;
}

k-title-sub {
	position: absolute;
	top: 85px;
	left: 50px;
	color: white;
	font-size: 14px;
	user-select: none;
}
k-main {
	position: relative;
	display: block;
	xborder: 1px solid black;
	padding: 20px;
}
k-content {
	line-height: 160%;
}
k-header {
	position: absolute;
	display: block;
	font-size: 30px;
}

k-bonus {
	display: none;
}



k-menu,
k-footer {
	display: none;
}

burger {
	display: none;
	user-select: none;
}

h1 {
	line-height: 1.2;
	xcolor: cadetblue;
}

h3 {
	margin-bottom: 10px;
}


  

k-form input {
	font-size:22px;
	padding:3px;
	color:#364465;
	width:300px;
	margin-bottom:15px;
}

message {
	display: block;
	margin-bottom: 10px;
	padding: 10px;
	font-size: 12px;
	background-color: #eee;
	border: 1px solid #ccc;
}

message[bad] {
	background-color: #fcc;
	border: 1px solid #f99;
	color: #933;
}

message[good] {
	background-color: #cf9;
	border: 1px solid #9c6;
	color: #393;
}

message[cool] {
	background-color: #cceeff;
	border: 1px solid #99ccff;
	color: #336699;
}

[shadow] {
	box-shadow:5px 5px 5px #333;
	border:1px solid black;
}

[category] {
	font-weight: bold;
	font-size: 18px;
	line-height: 180%;
	margin: 0px;
	padding: 0;
	list-style-type: none;
}
[category] li {
	border: 1px solid #ccc;
	margin-bottom: 10px;
	padding: 35px;
	xpadding-left: 40px;
}

#testMenuBar {
	display:none;
}


#bandTest, #bandTestBottom {
	display:none;

}


	box {
		display:block;
		background-color:#ccc;
		border:1px solid black;
		height:100px;
		width:100px;
		padding:5px;
		margin-bottom:15px;
		margin-right:15px;
	}
	
	box[video] {
		width:700px;
		height:340px;
	}

	box[full] {
		width:100%;

	}
	box[half] {
		width:50%;
	}
	
	
	box[icon] {
	
		background-color:#ccc;
		display:inline-block;
		
	
	}
	box[signal] {
		background-color:#000;
		display:inline-block;
		color:white;

	}
	
	box[signal][eight] {
		width:100px;
		height:100px;
	}
	
	
	box[signal][twelve] {
		width:150px;
		height:150px;
	}	

	box[signal][twenty] {
		width:250px;
		height:250px;
	}
	
	box[right] {
		
		float:right;
		margin-left:20px;
		margin-bottom:20px;
	
	}
	
	box[carousel] {
		height:200px;
	}


	[sub] {
		display:none;
	}
	
	
	#btnLogin {
    margin-top: 15px;
    width: 100%;
    height: 55px;
}



k-mark {
	
		color:#09f;
		padding:3px;
		border:1px solid #ccc;
		background-color:#eee;
		padding-left:10px;
	
}

/* @media  (min-width: 701px) and  (hover: hover) */
@media (hover:hover)
{


	#boxflex {
		column-count:2;
	}

		button {
			padding: 5px;
			min-width: 100px;
		}

	* {
		box-sizing: border-box;
	}

	body {
		font-family:sans-serif;
		font-size:13px;
		background-color:#ddd;
	}

	video {
		width:700px;
	}

	k-tabmenu {

		xtext-align:center;xborder:1px solid orange;display:block;font-size:14px;color:#9cb7d3;padding:0;padding-left:15px;margin:0;margin-left:2px;
		margin-right:12px;width:98%;position:absolute;bottom:0;xborder-top:1px solid #5e7a99;height:30px;
	}
	k-tabmenu-item {
			color:#b2cde8;
			padding-left:20px;
			padding-right:20px;
			display:inline-block;
			xborder:1px solid orange;
			xfloat:left;
			min-width:100px;
			height:100%;
			padding-top:6px;
			background-color:#89A5C2;
			border-top-left-radius:6px;
			border-top-right-radius:6px;
			text-align:center;
			xborder:2px solid #5D7B9B;
			border-bottom:0;	
	
	}
	k-tabmenu-item a {
		xcolor:#b2cde8;
		color:#eff;
	}

	k-tabmenu-item a:hover {
		xcolor:#b2cde8;
		color:orange;
	}

	a:hover {
		color:#f39;
	}
	
	k-title a:hover {
		color:white;
	}
		k-menu a:hover {
		color:red;
	}
		
	#bandTest {
		
		display:block;box-shadow:0px 5px 5px #555;border-bottom:1px solid black;position:absolute;left:0px;
		right:0px;top:0px;height:200px;
		xbackground-color:#89A5C2;
		xbackground-color:#6C8EB3;
		background-color:#5d7b9b;
	}

	#bandTestBottom {
		display:block;
		
			
	z-index:-10;xbox-shadow:0px 5px 5px #fff;border-top:1px solid black;position:absolute;left:0px;
		right:0px;bottom:0px;height:250px;
		xbackground-color:#89A5C2;
		background-color:#6C8EB3;
		background-color:#fff;	
		
	}

	button {
		padding:5px;
		min-width:100px;
	}




	k-layout {
		display:block;
	}
	k-page {

		display:block;
		margin:auto;
		width:800px;	


	}


	k-footer {
		display:block;
		text-align:center;
		margin-top:10px;
		margin-bottom:50px;
		xborder:3px solid yellow;

		
	}
	k-footer k-menu {
		display:block;
	}

	k-plate
	 {	display:block;
		  border-top-left-radius:16px;
		  border-top-right-radius:16px;
		  border:8px solid #999;
		  min-height:500px;

		  background-color:white;

		  overflow:hidden;
		position:relative;
		box-shadow:0px 0px 15px #000;
		min-height:1400px;

	}



	k-header {
		display:block;
		height: 150px;
		position: relative;
		background-color:#6C8EB3;
		border-top-left-radius:7px;
		border-top-right-radius:7px;
		border-bottom:1px solid black;	
		xborder:4px solid orange;	
		border:1px solid white;
		border-bottom:0;
		
	}


	k-title a {
		user-select: none;
		position:absolute;
		left:30px;
		top:20px;
		text-decoration: none;
		font-family: "Racing Sans One";
		white-space: nowrap;
		font-size: 48px;
		color: white;
		font-weight: 300;
		margin: 0px;
		letter-spacing: 0.04rem;
		padding: 0;
		-webkit-text-stroke-width: 1px;
		-webkit-text-stroke-color: black;
		text-shadow: 2px 3px #000000;
		line-height: 1;
		
	}

	k-main {
		
		border:0;
		display:block;
		padding:20px;
		padding-top:0px;
		line-height:1.5;
		margin-left:200px;
		xmargin-right:100px;
		min-height:900px;
		margin-bottom:0;
		xborder:1px solid black; /* this one doesn't reach the bottom */
		border-top:0;
		position:relative;
		
	}
	k-content {
		float:left;
		display:block;
		xborder:3px solid green;
		width:475px;
		position:absolute;
		padding-bottom:30px;
		position:relative;
		line-height:165%;



	}

	k-content p {
			width:420px;
			xmin-height:1200px;
			xborder:1px solid orange;
			xdisplay:block;
	}



	k-bonus {
		position:absolute;
		right:0px;
		margin-right:50px;
		width:400px;
		background-color:#eee;
		padding:30px;
		display:none;
		
	}

	k-breadcrumbs {
		display:block;
		margin-top:10px;
		margin-bottom:10px;
		
	}

	h1 {
		margin:0;
		margin-bottom:10px;
		color:#777;
		font-size:23px;
		line-height:150%;
	}


	h2 {
			margin-top:25px;
			margin-bottom:0px;
			font-size:18px;
	}


	k-sidebar {
		position:absolute;
		display:block;
		height:100%;
		width:200px;
		Xborder:1px solid red;
		background-color:#f6f6f6;

	}

	k-menu[desktop] {
		display:block;
		overflow:hidden;
		float:left;
		background-color:#f6f6f6;
		width:100%;
		xheight:100%;
		Xborder:1px solid blue;
	}

	k-menu[desktop] k-menu-item {
		display:block;
		margin:0; 
		padding:10px;
		width:100%;
		border-bottom:1px solid #ddd;
	}

	k-menu[desktop] k-menu-item[highlight] {

		font-weight:bold;
		background-color:#e9e9e9;
		border-bottom:1px solid #ccc;
		border-right:1px solid #ccc;

	}
	k-menu[desktop] k-menu-item[green] {
		text-decoration:none;
		color:green;

	}

	k-menu[desktop] k-menu-item[sub] {
		padding-left:20px;
		background-color:#fff;

	}

	k-menu[desktop] k-menu-item[copy] {
		line-height:150%;
		font-size:11px;

	}

	k-menu[footer] {
		
		xborder:1px solid red;	
	}

	k-menu[footer] k-menu-item {
		padding:10px;
		xborder:1px solid orange;
	}
	k-menu[footer] k-menu-item[sub] {
		display:none;
	}

	k-menu[footer] k-menu-item[hide] {
		display:none;
	}


	k-title-sub {
		/* background-color:white; background color likely opaque white when videos return */
		background-color:#afc6e0;
		
		color:black;
		padding:4px;
		opacity:.8;
		padding-left:20px;
		padding-right:35px;
		left:30px;
		top:77px;


	}
	k-title-sub span {
		color:black;
		text-decoration:none;

	}


/* TEST CONTAINER GRID */


	#testContainer {
	width:550px;
	xcolumn-count:2;
	xdisplay:grid;
	xgrid-template-columns: 50% 50%;


	}

	#testMenuBar {
		display:block;
	}

	ul[hello] {

		xborder:1px solid red;
		list-style-type:none;
		padding:0;
		margin:0;
	}

	ul[hello] li {
		float:left;
		width:45%;
		border:1px solid black;
		background-color:#ccc;
		padding:10px;
		margin-right:20px;
		margin-bottom:20px;
		box-shadow:5px 5px 5px #666;
		height:175px; /* should be half of the width or even PHI !!!! */
		background-image:url('/assets/img/blank-999.png');
		background-size: cover;
		background-repeat: no-repeat;
		box-sizing: border-box;
		color:white;	
	}



/* was in large.css */

	k-page {
			width:1100px;
			
		
	}

	k-content {
			width:600px;
	}

	k-content p {
		width:600px;
	}

	k-bonus {
		display:none;
		margin-top:30px;
		position:absolute;
		xdisplay:block;
		min-height:500px;
	}

}


@media (pointer:coarse) 

/* @media (max-width:700px) or  (pointer: coarse) */
/* @media (pointer:coarse) */

{
	
	
	#triseq {
		
		display:none;
	}
	
	a:visited { color:blue; }
	
	body {
		background-color: #bbb;
		padding-bottom: 20px;
	}
	video {
		width:100%;
	}
	burger {
		display: inline;
		position: fixed;
		xborder: 1px solid #666;
		xbackground-color: yellow;
		xborder-bottom: 2px solid #000;
		xborder-right: 2px solid #666;
		xheight: 65px;
		xwidth: 65px;
		xfont-size: 50px;
		xtext-align: center;
		xline-height: 1;
		top: 10px;
		left: 10px;
		z-index: 200;
		xbackground-color: #bbb;
		xborder-radius: 6px;
	}

	k-header {
		position: fixed;
		background-color: #bbb;
		height: 90px;
		left: 0px;
		top: 0px;
		width: 100%;
		border-bottom: 1px solid #555;
		z-index: 100;
		opacity: 0.9;
		box-shadow: 0px 5px 15px #000;
	}
	k-title a {
		position: absolute;
		xborder: 1px solid blue;
		font-size: 35px;
		left: 90px;
		top: 10px;
		color:white;
	}
	k-title a:visited {
		color:white;
	}
	k-title-sub {
		position: absolute;
		top: 55px;
		left: 85px;
		color: black;
		font-size: 12px;
	}
	k-main {
		display: block;
		width: 100%;
		xborder: 2px solid green;
		margin-top: 75px;
		padding-top: 0;
		position: relative;
		padding: 10px;
		min-height: 600px;
	}
	k-content {
		display: block;
		xpadding: 30px;
		width: 100%;
		font-size: 18px;
		line-height: 160%;
		xborder: 1px solid green;
		position: relative;
	}
	k-menu[desktop] {
		display: none;
	}

	k-menu[mobile] k-menu-item {
		margin-left: 20px;
		margin-right: 20px;
	}

	k-menu[footer] {
		xdisplay: none;
		display: block;
		xborder: 2px solid blue;
	}

	k-menu[footer] k-menu-item {
		display: block;
		border: 1px solid black;
		padding: 15px;
		text-align: center;
		margin-top: 10px;
		background-color: #666;
		color: white;
		font-size: 18px;
		margin-left: 10px;
		margin-right: 10px;
	}

	k-menu[footer] a {
		text-decoration: none;
		color: white;
	}

	k-menu[footer] k-menu-item[sub] {
		display: none;
	}

	k-menu[footer] k-menu-item[hide] {
		display: none;
	}

	k-bonus {
		display: none;
	}

	h1 {
		font-size: 30px;
		line-height: 135%;
		color: #555;
		margin-top: 0px;
	}
	
	h2 { 
		line-height:130%; 
		font-size:23px;
	}

	k-title-sub span {
		color: blue;
		text-decoration: underline;
	}
	k-footer {
		display: block;
	}

	/* FORMS */

	input,
	textarea,
	select,
	fieldset,
	option {
		font-size: 25px;
		line-height: 150%;
		color: black;
	}

	input,
	textarea,
	select {
		background-color: #ccc;
	}

	legend {
		font-size: 20px;
		color: cyan;
	}
	button {
		font-size: 25px;
		border-radius: 0;
		color: black;
	}
	textarea {
		height: 200px;
	}

	/* TEST CONTAINER GRID */

	#testContainer {
		xwidth: 550px;
		xcolumn-count: 2;
		xdisplay: grid;
		xgrid-template-columns: 50% 50%;
	}

	ul[hello] {
		xborder: 1px solid red;
		list-style-type: none;
		padding: 0;
		margin: 0;
	}

	ul[hello] li {
		xfloat: left;
		xwidth: 45%;
		border: 1px solid black;
		background-color: #ccc;
		padding: 10px;
		margin-right: 20px;
		margin-bottom: 20px;
		box-shadow: 5px 5px 5px #666;
		height: 250px; /* should be half of the width or even PHI !!!! */
		background-image: url("/assets/img/blank-999.png");
		background-size: cover;
		background-repeat: no-repeat;
		box-sizing: border-box;
		color: white;
	}

	ul[hello] a {
		text-decoration: none;
	}

	input[type="checkbox"] {
		width: 20px;
		height: 20px;
	}

	k-widget-text {
		flex: 1 1 auto;
		overflow: hidden;
		line-height: 140%;
		xfont-size: min(2vw, 14px);
		font-size: 20px;
		padding: 10px;
		color: red;
		background-color: white;
		opacity: 0.7;
	}
	
	
	[category] {
	}
	[category] li {
		border: 4px solid #999;
		background-color:#bbb;
	}	


	k-sidebar-supplement {
		position:absolute;
		display:none;
		border:2px solid green;
			visibility:hidden;
	}
	
	#boxflex {
		column-count:1;
		max-width:95%;
	}

	
	
	k-mark {
	
		color:#06c;
		padding:5px;
		border:1px solid #999;
		background-color:#ccc;
		padding-left:14px;
	
	}
	
}


/* tablet.css */

@media only screen and (pointer:coarse) and (min-width: 600px) {
	
	
	
		k-title a {
			display:block;
			xborder:1px solid red;
			xbackground-color:white;
			height:50px;
			font-size:140%;
		}
	
	
		k-title-sub {
			margin-top:4px;
			font-size:15px;
		}
	
	
	
		burger {
			line-height:1.3;
		}
	
	
}

/* POPUP.CSS */



k-menu[mobile] {
    display:block;
	margin-top:20px;
}

k-menu[mobile] k-menu-item {

    display:block;
    border:1px solid black;
    font-size:1.1em;
    padding:8px;
    text-align:center;
    margin-bottom:6px;
	xbackground-color:white;
	background-color:#6C8EB3;
}

k-menu[mobile] a {

	text-decoration:none;
	color:white;
}


/* WIDGET.CSS */

k-widget {
	display: block;
	width: 100%;
	overflow: hidden;
	border: 1px solid black;
	position: relative;
	font-family: sans-serif;
	background-size: cover;
	background-repeat: no-repeat;
	box-sizing: border-box;
}

k-widget img {
	visibility: hidden;
	width: 100%;
}

k-widget-body {
	width: 100%;
	padding: 10px;
	position: absolute;
	height: 100%;
	box-sizing: border-box;
}
k-widget-stub {
	height: 100%;
	display: flex;
	flex-flow: column;
	align-items: stretch;
	box-sizing: border-box;
}
k-widget-title {
	flex: 0 1 auto;
	margin-bottom: 10px;
	background-color: #36c;
	opacity: 0.85;
	padding: 10px;
	color: white;
	overflow:hidden;
	text-wrap: nowrap;
	white-space: nowrap;
}
k-widget-text {
	flex: 1 1 auto;
	overflow: hidden;
	line-height: 140%;
	xfont-size: min(2vw, 14px);
	font-size:inherit;
	padding: 10px;
	color: black;
	background-color: white;
	opacity: 0.7;
}



/* KIOSK */

@media all and (display-mode: fullscreen) {
	html { 
		background-color:#000;
		border:10px solid #222;
		height:100%;
		margin:0;
		padding:0;
		position:relative;
		overflow:hidden;

	}

	body  { 
		visibility:hidden;

	
	}

	k-title {
		width:100%;
		margin:auto;
		padding:0;
		height:100%;
		display:block;
		visibility:visible;
		xborder:10px solid blue;
		position:absolute;
		top:40vh;

	}
	k-page {
		display:auto;
		width:100%;
		text-align:center;
		margin:auto;
	}
	k-plate {
		overflow:auto;
		//display:auto;
		xborder:1px solid red;
	}
	k-title a {
		font-size:8vw;
		position:relative;
	}
	

	
} 
