/* ==================================================== */
/*														*/
/*					Kensa Theme 1						*/
/*					Light								*/
/*					"Warehouse Kensa"					*/
/*														*/
/* ==================================================== */
@import url("font.ww.css");
:root{
	--ww-blue: #182fbf;
	--ww-indigo: #5418bf;
	--ww-purple: #a418bc;
	--ww-pink: #db1e4d;
	--ww-red: #bf182f;			/*#bf8218*//*#a60000*//*#990000*/
	--ww-orange: #ff8000;		/*#f1b633*/
	--ww-yellow: #dba400;
	--ww-green: #2fbf18;
	--ww-teal: #40aac0;			/*#18c0aa*/
	--ww-cyan: #1be8da;
	--ww-white: #ffffff;
	--ww-black: #000000;
	--ww-gray: #6c757d;
	--ww-gray-dark: #343a40;
	--ww-gray-100: #f0f0f0;
	--ww-gray-200: #e7ebee;
	--ww-gray-300: #e0e0e0;
	--ww-gray-400: #ced4da;
	--ww-gray-500: #adb5bd;
	--ww-gray-600: #6c757d;
	--ww-gray-700: #545454;
	--ww-gray-800: #4A4149;		/*#4a4a4a*/
	--ww-gray-900: #2f2f2f;
	--ww-primary: #dc0034;		/*#dba400*//*#db3600*/
	--ww-secondary: #ececec;
	--ww-tertiary: #323232;
	--ww-success: #36d800;
	--ww-info: #00a2ff;
	--ww-warning: #e8ae00;
	--ww-danger: #f60702;		/*#ff8000*/
	--ww-light: #f0f5fa;
	--ww-dark: #161616;
	--ww-primary-rgb: 220, 0, 52;
	--ww-secondary-rgb: 236, 236, 236;
	--ww-success-rgb: 54, 216, 0;
	--ww-info-rgb: 0, 162, 255;
	--ww-warning-rgb: 232, 174, 0;
	--ww-danger-rgb: 246, 7, 2;
	--ww-light-rgb: 240, 245, 250;
	--ww-dark-rgb: 22, 22, 22;
	--ww-white-rgb: 255, 255, 255;
	--ww-black-rgb: 0, 0, 0;
	--ww-body-color-rgb: 26, 19, 22;
	--ww-body-bg-rgb: 74, 74, 74;
	--ww-font-serif: serif;
	--ww-font-sans-serif: Splatoon2, sans-serif;
	--ww-font-monospace: Consolas, monospace;
	--ww-font-cursive: cursive;
	--ww-font-fantasy: fantasy;
	--ww-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
	--ww-header-font-family: var(--splatoon1);
	--ww-body-font-family: var(--splatoon2);
	--ww-body-font-size: 1rem;
	--ww-body-font-weight: 400;
	--ww-body-line-height: 1;
	--ww-body-color: #1a1316;
	--ww-body-bg: #4a4a4a;

	--ww-shade: rgba(0,0,0,0.2);
	--ww-highlight: rgba(255,255,255,0.2);
	--ww-outset: rgba(255,255,255,0.5);
}


:root{
	--ww-bg-stripes: repeating-linear-gradient(45deg, transparent, transparent 40px, rgba(23,23,23,0.09) 40px, rgba(23,23,23,0.09) 80px);
	--ww-bg-dots: radial-gradient(rgba(208,208,208,0.15) 1px, rgba(208,208,208,0.05) 2px, transparent 3px) 0 0 / 16px 16px, radial-gradient(rgba(208,208,208,0.15) 1px, rgba(208,208,208,0.05) 2px, transparent 3px) 8px 8px / 16px 16px;
		--ww-bg-dots-img: url("../../img/common/bg-paper-spots.png");
		--ww-bg-dots-sharp: radial-gradient(rgba(208,208,208,0.15) 2px, transparent 2px) 0 0 / 16px 16px, radial-gradient(rgba(208,208,208,0.15) 2px, transparent 2px) 8px 8px / 16px 16px;
		--ww-bg-holes: radial-gradient(rgba(208,208,208,0.15) 2px, transparent 2px) 0 0 / 16px 16px, radial-gradient(rgba(208,208,208,0.15) 2px, transparent 2px) 8px 8px / 16px 16px;

	--ww-bg-tiles: repeating-linear-gradient(90deg, rgba(255,255,255,0.25), rgba(255,255,255,0.25) 1px, transparent 1px, transparent 31px, rgba(0,0,0,0.25) 31px, rgba(0,0,0,0.25) 32px), repeating-linear-gradient(rgba(255,255,255,0.25), rgba(255,255,255,0.25) 1px, transparent 1px, transparent 31px, rgba(0,0,0,0.25) 31px, rgba(0,0,0,0.25) 32px);
		--ww-bg-tiles-deep: repeating-linear-gradient(90deg, rgba(255,255,255,0.25), rgba(255,255,255,0.25) 2px, transparent 2px, transparent 30px, rgba(0,0,0,0.25) 30px, rgba(0,0,0,0.25) 32px), repeating-linear-gradient(rgba(255,255,255,0.25), rgba(255,255,255,0.25) 2px, transparent 2px, transparent 30px, rgba(0,0,0,0.25) 30px, rgba(0,0,0,0.25) 32px);
		--ww-bg-tiles-subtle: repeating-linear-gradient(90deg, rgba(255,255,255,0.5), transparent 1px, transparent 31px, rgba(0,0,0,0.5) 32px), repeating-linear-gradient(rgba(255,255,255,0.5), transparent 1px, transparent 31px, rgba(0,0,0,0.5) 32px);
/*
	--ww-bg-bloom-dots: radial-gradient(rgba(255,255,255,0.38) 2px, transparent 4px) 0 0 / 10px 10px;
	--ww-bg-dots: radial-gradient(rgba(255,255,255,0.38) 2px, transparent 2px) 0 0 / 10px 10px, radial-gradient(rgba(255,255,255,0.38) 20%, transparent 20%) 50px 50px / 100px 100px;

TIP:  Use with --ww-gray-100
	--ww-bg-dots-heavy: radial-gradient(rgba(255,255,255,0.38) 2px, transparent 2px) 0 0 / 16px 16px, radial-gradient(rgba(255,255,255,0.38) 2px, transparent 2px) 8px 8px / 16px 16px;
*/
	--dots-white: radial-gradient(circle, var(--ww-gray-800) 8px, transparent 9px) 0 0 / 32px 32px, var(--ww-white);
}


:root{
	--logo-black: url("/img/common/logo.black.svg");
}



*{
	font-family: var(--splatoon2);
	border-color: var(--ww-shade);
	/*caret-color: var(--ww-red);*/
}





.bg-primary{	background-color: var(--ww-primary) !important;	}
.bg-secondary{	background-color: var(--ww-secondary) !important;	}
.bg-tertiary{	background-color: var(--ww-tertiary) !important;	}
.bg-success{	background-color: var(--ww-success) !important;	}
.bg-info{		background-color: var(--ww-info) !important;		}
.bg-warning{	background-color: var(--ww-warning) !important;	}
.bg-danger{		background-color: var(--ww-danger) !important;		}
.bg-white{		background-color: var(--ww-white) !important;		}
.bg-black{		background-color: var(--ww-black) !important;		}
.bg-light{		background-color: var(--ww-light) !important;		}
.bg-dark{		background-color: var(--ww-dark) !important;		}

.bg-blue{		background-color: var(--ww-blue) !important;	}
.bg-indigo{		background-color: var(--ww-indigo) !important;	}
.bg-purple{		background-color: var(--ww-purple) !important;	}
.bg-pink{		background-color: var(--ww-pink) !important;	}
.bg-red{		background-color: var(--ww-red) !important;	}
.bg-orange{		background-color: var(--ww-orange) !important;	}
.bg-yellow{		background-color: var(--ww-yellow) !important;	}
.bg-green{		background-color: var(--ww-green) !important;	}
.bg-teal{		background-color: var(--ww-teal) !important;	}
.bg-cyan{		background-color: var(--ww-cyan) !important;	}

.bg-shade{		background-color: var(--ww-shade) !important;		}
.bg-highlight{	background-color: var(--ww-highlight) !important;	}
.bg-outset{		background-color: var(--ww-outset) !important;	}
.bg-transparent{background-color: transparent !important;			}


.text-primary{	color: var(--ww-primary) !important;	}
.text-secondary{color: var(--ww-secondary) !important;	}
.text-tertiary{	color: var(--ww-tertiary) !important;	}
.text-success{	color: var(--ww-success) !important;	}
.text-info{		color: var(--ww-info) !important;		}
.text-warning{	color: var(--ww-warning) !important;	}
.text-danger{	color: var(--ww-danger) !important;	}
.text-white{	color: var(--ww-white) !important;		}
.text-black{	color: var(--ww-black) !important;		}
.text-light{	color: var(--ww-light) !important;		}
.text-dark{		color: var(--ww-dark) !important;		}

.text-blue{		color: var(--ww-blue) !important;	}
.text-indigo{	color: var(--ww-indigo) !important;	}
.text-purple{	color: var(--ww-purple) !important;	}
.text-pink{		color: var(--ww-pink) !important;	}
.text-red{		color: var(--ww-red) !important;	}
.text-orange{	color: var(--ww-orange) !important;	}
.text-yellow{	color: var(--ww-yellow) !important;	}
.text-green{	color: var(--ww-green) !important;	}
.text-teal{		color: var(--ww-teal) !important;	}
.text-cyan{		color: var(--ww-cyan) !important;	}

.text-shade{	color: var(--ww-shade) !important;		}
.text-highlight{color: var(--ww-highlight) !important;	}
.text-outset{	color: var(--ww-outset) !important;	}




.bg-stripes{	background-image: var(--ww-bg-stripes);	}
.bg-dots{		background: var(--ww-bg-dots);	}
.bg-tiles{
	background-image: var(--ww-bg-tiles);
	background-position: center;
}



.filter-dc0034{filter: invert(18%) sepia(49%) saturate(5678%) hue-rotate(333deg) brightness(85%) contrast(119%);}
.filter-ffffff{filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(170deg) brightness(108%) contrast(101%);}




nav.topnav *{font-family: "Splatoon1";}