﻿* {
	font-family: 'Segoe UI', Arial, sans-serif;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html, body, #form1 {
	height: 100%; width: 100%; 
	margin: 0; padding: 0; 
	color: #2a120b; 
	font-size: 10pt;
	background: url("../../../Images/Background.ashx") no-repeat center center fixed;
	background-size: cover;
}
p {font-size: 1.2em}

A:link, A:visited {text-decoration: none;}
A:hover {text-decoration: underline;}
A:active {text-decoration: none;}

#header #nav { display: inline-block;}
#header #currentUser {display: inline-block; text-align: right;}

#mainContent {height: 100%; width: 100%; overflow-y: auto;}
#mainContent {	margin: auto;	padding: 45px;}

#mainContent {
	/* Creates shadows when content is scrolled out of view */
	background: linear-gradient(white 30%, rgba(255,255,255,0)),
		linear-gradient(rgba(255,255,255,0), white 70%) 0 100%,
		radial-gradient(50% 0, farthest-side, rgba(0,0,0,.2), rgba(0,0,0,0)),
		radial-gradient(50% 100%,farthest-side, rgba(0,0,0,.2), rgba(0,0,0,0)) 0 100%;
    background: linear-gradient(white 30%, rgba(255,255,255,0)),
		linear-gradient(rgba(255,255,255,0), white 70%) 0 100%,
		radial-gradient(farthest-side at 50% 0, rgba(0,0,0,.2), rgba(0,0,0,0)),
		radial-gradient(farthest-side at 50% 100%, rgba(0,0,0,.2), rgba(0,0,0,0)) 0 100%;
    background-repeat: no-repeat;
    background-color: white;
    background-size: 100% 40px, 100% 40px, 100% 14px, 100% 14px;
    background-attachment: local, local, scroll, scroll;

	height: calc(100vh - 64px);
	padding: 10px;
	overflow: auto;
}

.titleScreen {
	position: relative;
	width: 60%;
	height: 20%;
	margin: auto;
	text-align: center;
	color: LightGray;
	top: 200px;
}

.productPanel {width: calc(25% - 10px); max-width: calc(25% - 10px); height: 175px; float: left; margin: 2px; border: Dashed 1px #BCBCBC;}
.productPanel P {font-size: 10pt;}
.productPanel TABLE.productInfo {border: none; border-collapse: collapse; margin: 5px;}
.productPanel TABLE.productInfo TH {text-align:left;}
.productPanel TABLE.productInfo TD {padding: 0 3px 0 3px;}
.productPanel .productCode {font-weight: bold;}
.productPanel .productDescription {	}
.productPanel .RegularPricing {	}
.productPanel .SpecialPricing {	}
.productPanel .Availability { }

.footer {width: 100%; font-size: x-small; line-height: 32px; text-align: center;}
.clear {clear: both;}
.nobr {white-space: nowrap;}
.crudButton {min-width: 75px;}


/*** Footer ***/

P.poweredBy {
	position: absolute;
	bottom: 0;
	color: Silver;
	font-size: xx-small;
	background-color: rgba(0,0,0,.6);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#99000000',endColorstr='#99000000');
	margin: 0;
	padding: 0 8px;
	width: 100%;
	height: 32px;
	line-height: 32px;
}

P.poweredBy A {
	color: Silver;
}

P.welcomeText {
	color: Gray;
	font-size: x-small;
}
