﻿html {
	--xcolor: red;
	--xbreakpoint: 1101px;
}


.vartest {
	background-color: var(--xcolor);
	/*This works.*/
}

* {
	border-width: 0;
	padding: 0;
	margin: 0;
}

.zoom2 {
	/*transition-delay: 1s;*/
	transition: transform 1s;
	/* Animation */
	margin: 0 auto;
	z-index: 999;
}

.zoom2:hover {
	z-index: 999;
	transition-delay: 1s;
	transform: scale(1.75);
	/* (Note: if the zoom is too large, it will go outside of the viewport) */
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.zoom5 {
	/*transition-delay: 1s;*/
	transition: transform .8s;
	/* Animation */
	margin: 0 auto;
	z-index: 999;
}

.zoom5:hover {
	z-index: 999;
	transition-delay: 1s;
	transform: scale(5.0);
	/* (Note: if the zoom is too large, it will go outside of the viewport) */
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

body {
	margin: 0;
	font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
	font-size: small;
	color: #000;
	background-color: #fff;
	min-width: 500px;
}

h1,
h2,
h3,
h4 {
	color: #000;
	font-weight: 700;
	border-style: none;
	padding: 0;
	margin: 0;
}

h1 {
	font-size: large;
}

h2 {
	font-size: medium;
}

h3 {
	font-size: small;
}

h4 {
	font-size: x-small;
}

.hovershadow:hover {
	box-shadow: 0 0 10px gray;
}

.xtooltip {
	position: relative;
	display: inline-block;
	border-bottom: 1px dotted #000;
}

.xtooltip .xtooltiptext {
	visibility: hidden;
	width: 300px;
	background-color: #ffffe0;
	border: 1px solid gray;
	color: #000;
	text-align: justify;
	border-radius: 6px;
	padding: 1em;
	position: absolute;
	left: 20px;
	z-index: 1;
	box-shadow: 0 0 20px gray;
}

.xtooltip:hover .xtooltiptext {
	visibility: visible;
}

.groupcard {
	border: 1px solid #c8c8c8;
	border-radius: 4px 4px;
	transition: all 1s;
}

.groupcard:hover {
	box-shadow: 0 0 10px gray;
}

.statusDiv {
	width: 95%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	/*background-color:red;*/
	font-size: medium;
}

.pagetitle {
	max-width: 95%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	font-size: x-large;
	/*color:red !important;*/
	/*font-weight: 700;*/
	/*background-color: yellow;*/
	font-variant: small-caps;
}
.pagesubtitle {
	max-width: 95%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	font-size: medium;
	/*color:red !important;*/
	/*font-weight: 700;*/
	/*background-color: yellow;*/
	font-variant: small-caps;
}


.almostblack {
	color: #202020;
}

.almostblackbg {
	background: #202020;
}

.fallpromo {
	background-color: #CC5500;
	font-size: larger;
	color: #ff0;
}

.bestseller {
	background-color: green;
	color: #ff0;
}

.quickship {
	background-color: red;
	color: #ff0;
}

.quickship2 {
	background-color: #8a2be2;
	color: #ff0;
}

.quickship1 {
	background-color: #1e90ff;
	color: #fff;
	font-weight: 700;
}

.usa {
	background-color: #00f;
	color: #fff;
}

a.miniLink:active,
a.miniLink:link,
a.miniLink:visited {
	all: unset;
	color: gray;
	text-decoration: underline;
	font-size: xx-small !important;
	text-transform: uppercase;
	font-variant: small-caps;
}

a.miniLink:hover {
	color: red;
	font-size: xx-small;
}

.rowStyleBrowser {
	border-bottom-style: solid;
	border-bottom-width: thin;
	border-bottom-color: silver;
	padding-bottom: 5px;
}

.divDataForm {
	padding: 5px;
}

.rowStyleCART {
	border: 1px solid silver;
	padding-bottom: 5px;
}

.customerHomeButton {
	border: thin double silver;
}

.loginButton {
	border: 1px solid silver;
	padding: 3px;
	margin: 3px;
	vertical-align: middle;
	text-align: center;
}

.divSOLDToSHIPTo {
	padding: 4px;
	border: 1px solid silver;
	border-radius: 5px;
}

.searchBox {
	background-color: #ffc;
	border: 1px solid silver;
	width: 100%;
}

.aspxTextBox {
	background-color: #ffc;
	border: 1px solid silver;
	border-radius: 3px;
	opacity: 0.7;
	font-size: large;
}

.aspxButton {
	border: 1px solid silver;
}

.anybutton {
	transition: border 1s, color 1s;
	color: #666;
	border: 1px solid #666;
	font-size: small;
	font-weight: 400;
	height: 2em;
	transition: border 2s;
	border-radius: 4px;
	font-variant: small-caps;
	flex: 1 0 100px;
	margin-left: 3px;
	margin-right: 3px;
	margin-bottom: 3px;
}

.toupper {
	text-transform: uppercase;
}

@media only screen and (max-width: 992px) {
	.desktoponly {
		display: none;
	}
}

/*#txtSearch {
	max-width: 200px;
	min-width: 100px;
}

@media (max-width: 992px) {
	#txtSearch {
		max-width: 100%;
	}
}*/



.pagelinks a {
	margin-bottom: 10px;
}

.sitebg {
	background-color: #000066;
}



.standardwidthflex {
	width: 100%;
	max-width: 1250px;
	margin-left: auto;
	margin-right: auto;
}

#outerGrayband {
	width: 100%;
	min-height: .5em;
	border: none;
	background-color: lightgray;
	color: black;
	/*background: linear-gradient(#E0E0E0,#F0F0F0 );*/
	text-align: right;
	font-size: x-small;
	font-weight: bold;
}

#outerGrayband a:link {
	font-size: x-small !important;
	color: black !important;
}

#outerGrayband a:hover {
	font-size: x-small !important;
	color: black !important;
}

#outerGrayband a:visited {
	font-size: x-small !important;
	color: black !important;
}

#innerGrayband {
	background-color: transparent;
	color: black;
	font-size: x-small;
	font-weight: bold;
	padding-top: 1px;
	width: 85%;
	padding-right: 16px;
	padding-left: 16px;
	margin-left: auto;
	margin-right: auto;
}

.outerfooter {
	border-top: 1px solid lightgray;
	width: 90%;
	max-width: 1400px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
	align-items: center;
	font-size: small;
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.innerfooter {
	width: 90%;
	margin: 0 auto;
	padding-left: 1em;
	padding-right: 1em;
	max-width: 1250px;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-content: center;
}



.categorytitle {
	font-size: large;
}

.notvisible {
	display: none !important;
}

.isvisible {
	display: inline !important;
}

body {
	overflow-x: hidden;
	width: 100vw;
}

.googleicons {
	font-size: 1em;
	margin-right: .5em;
}

.menuicon {
	font-size: 1em;
	color: gray;
	margin-right: .3em;
}

@media (min-width: 992px) {
	.menuicon {
		display: none;
	}
}

h2 {
	font-size: medium;
	font-weight: bold;
}

.navbar {
	font-size: small !important;
	font-weight: bold !important;
}

@media print {
	.navbar-brand {
		margin-left: auto;
		margin-right: auto;
	}
}

#navmain {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	z-index: 9999 !important;
}

#xheader {
	background-color: white;
	border-bottom: 1px solid lightgray;
	margin-bottom: 100px;
	margin-left: auto;
	margin-right: auto;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9999;
}

.nowrap {
	white-space: nowrap;
}

@media only screen and (min-width: 1000px) {
	.colorfade {
		filter: grayscale(1.0);
		transition: filter 2s ease-out;
	}

	.colorfade:hover {
		filter: grayscale(0.0);
		transition: filter 1s ease-in;
	}

	.colorfadefast {
		filter: grayscale(1.0);
		transition: filter .25s ease-out;
	}

	.colorfadefast:hover {
		filter: grayscale(0.0);
		transition: filter .25s ease-in;
	}
}