﻿@import url(http://fonts.googleapis.com/css?family=Oxygen:400,300,700);

html, body, #aspnetForm {
	height: 100%; width: 100%;
	margin: 0; padding: 0;
	font-family: Oxygen, Sans-Serif;
}

a:link, a:visited, a:active {color: #4D5A0B; text-decoration: none;}
a:hover {text-decoration: underline;}

DIV.center {width: 85%; height: 100%; margin: auto}

DIV {}

.productPanel {
	float: left;
	width: 30%; min-width: 175px; max-width: 350px;
	height: 175px;
	/*border: dashed 1px silver;*/
	margin: 1%; 
	background-color: White;
	overflow: auto;
}
.productPanel TABLE {border-collapse: collapse; width: 100%;}
.productPanel TABLE TD {padding: 5px; margin: 0;}
.productPanel TABLE TD.productImage {width: 45%; min-width: 75px; max-width: 128px;}
.productPanel TABLE TD.productImage IMG {max-width: 100%;}
.productPanel TABLE .productItemNumber {font-weight: bold}
.productPanel TABLE .productDescription {font-size: 0.8em; color: Gray}
.productPanel INPUT {font-size: 0.8em; padding: 3px;}

.categoryPanel {
	float: left;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	margin: 1%;
	aspect-ratio: 1 / 1;
	width: 31%;
	min-width: 300px;
	max-width: 490px;
	height: 100%;
	border: solid 1px #818181;
}
	.categoryPanel IMG {
		object-fit: cover;
		flex-shrink: 0;
		min-width: 100%;
		min-height: 100%;
		opacity: 1;
		filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	}
.categoryPanel DIV {position: relative; line-height: 32px; background-color: #818181; padding: 0 15px;}
.categoryPanel A {color: white; text-decoration: none}

.categoryPanel:hover {border-color: Black;}
.categoryPanel:hover IMG {
	opacity: 0.65;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=65);
}
.categoryPanel:hover DIV {background-color: Black;}

#header {margin: 10px auto;}
#header TABLE {width: 100%; border-collapse: collapse;}
#header TABLE TD A {font-size: small; font-weight: bold; color: White; text-decoration: none; padding: 5px 15px}
#header TABLE TD:last-child {text-align: right;}
#header TABLE TD:first-child {text-align: left;}

#mainContent { /*box-shadow: 0 0 15px #888888; border-radius: 5px; padding: 5px 25px;*/}

#footer {font-size: small; font-weight: bold; margin: 10px auto;}
#footer TABLE {width: 100%;}
#footer TABLE TD:last-child {text-align: right;}
#footer TABLE TD:first-child {text-align: left;}
#footer A:link {text-decoration: none;}
#footer A:hover {text-decoration: underline;}

.clear {clear: both;}

P.pageNotice {background-color : #fafad2; border: dashed 1px #008000; padding: 10px 15px; margin: 15px 5px;}

.AspNet-FormView P {font-size: 0.8em;}
.AspNet-FormView TABLE TR TD {vertical-align: top;}
.AspNet-FormView TABLE TR TD:first-child {padding-right: 10px;}

.globalSearch * {font-size: 8pt}
.globalSearch INPUT {padding: 3px;}
.globalSearch INPUT:last-child {margin-right: 5px}

::-webkit-input-placeholder {font-style: italic;}
:-moz-placeholder {font-style: italic;} /* Firefox 18- */
::-moz-placeholder {font-style: italic;} /* Firefox 19+ */
:-ms-input-placeholder {font-style: italic;}