html { height: 100%; }

body { font-family: Verdana,Arial,sans-serif; font-size: 13px; padding:0; margin: 0; height:100%; background: #070a0f url(./images/main/bgimage.jpg) no-repeat fixed 50% 0; color: #ffffff; }

a { color: #21BDDF; text-decoration: none; }
a:hover { color: #FFFFFF; }
label { color: #21BDDF; }

th { color: #21BDDF; }

#mainbody { height: 100%; width: 100%;  }

#header-overlay { height: 109px; background: transparent url(./images/main/header-overlay.png) repeat-x scroll 0 0; z-index: 400;}

#showcase-section { position: relative; }
#showcase-panel { position: absolute; left: 0; top: 98px; width: 100%; background: #000000 none repeat scroll 0 0; }

#mainbody-overlay { padding-top: 1px; background: transparent url(./images/main/overlay-divider.png) no-repeat scroll 50% 0; height: 100%; }
#main-body { color: #FFFFFF; padding-top: 15px; }
#main-body-surround { }
#main-content { overflow: hidden; }

.colmask { clear: both; float: left; overflow: hidden; position: relative; width: 100%; }
.colright { float: left; left: 250px; position: relative; width: 200%; }
.col1wrap { float: right; padding-bottom: 1em; position: relative; right: 250px; width: 50%; }
.col1 { margin: 0 0 0 250px; overflow: hidden; position: relative; right: 100%; padding: 0; }

#newsflash-bar { background: transparent url(./images/main/newsflash-overlay.png) no-repeat scroll 50% 0; font-size: 14px; overflow: hidden; }
#featuremodules { background: transparent url(./images/main/featuremod-bg.png) repeat-x scroll 0 0; font-size: 110%; margin-bottom: 15px; padding: 20px 0; overflow: hidden; }

.main-header { background: transparent url(./images/main/sidemod-h3-m.png) repeat-x scroll 0 0; float: left; display: inline-block; margin: 0 10px 1px; }
.main-header2 { background: transparent url(./images/main/sidemod-h3-l.png) no-repeat scroll 0 0; float: left; display: inline-block; margin-left: -10px; }
.main-header3 { background: transparent url(./images/main/sidemod-h3-r.png) no-repeat scroll 100% 0; float: left; display: inline-block; margin-right: -10px; }
.main-title { padding: 0 10px; }
.main-title span { color: #21BDDF; }

#maincontent-tm { background: transparent url(./images/main/maincontent-tm.png) repeat-x scroll 0 0; margin: 0 12px; clear: left; }
#maincontent-tl { background: transparent url(./images/main/maincontent-tl.png) no-repeat scroll 0 0; margin-left: -12px; }
#maincontent-tr { background: transparent url(./images/main/maincontent-tr.png) no-repeat scroll 100% 0; height: 20px; margin-right: -12px; }
#maincontent-m { background: transparent url(./images/main/maincontent-m.png) repeat scroll 0 0; margin: 0 12px; }
#maincontent-l { background: transparent url(./images/main/maincontent-l.png) repeat-y scroll 0 0; margin-left: -12px; }
#maincontent-r { background: transparent url(./images/main/maincontent-r.png) repeat-y scroll 100% 0; padding: 0 12px; margin-right: -12px; }
#maincontent-surround { background: transparent url(./images/main/maincontent-bg.png) repeat-x scroll 0 0; overflow: hidden; }
#maincontent-bm { background: transparent url(./images/main/maincontent-bm.png) repeat-x scroll 0 0; margin: 0 12px; }
#maincontent-bl { background: transparent url(./images/main/maincontent-bl.png) no-repeat scroll 0 0; margin-left: -12px; }
#maincontent-br { background: transparent url(./images/main/maincontent-br.png) no-repeat scroll 100% 0; height: 12px; margin-right: -12px; }

#footer-tm { background: transparent url(./images/main/maincontent-tm.png) repeat-x scroll 0 0; margin: 20px 12px 0 12px; clear: left; }
#footer-tl { background: transparent url(./images/main/maincontent-tl.png) no-repeat scroll 0 0; margin-left: -12px; }
#footer-tr { background: transparent url(./images/main/maincontent-tr.png) no-repeat scroll 100% 0; height: 20px; margin-right: -12px; }
#footer-m { background: transparent url(./images/main/maincontent-m.png) repeat scroll 0 0; margin: 0 12px; }
#footer-l { background: transparent url(./images/main/maincontent-l.png) repeat-y scroll 0 0; margin-left: -12px; }
#footer-r { background: transparent url(./images/main/maincontent-r.png) repeat-y scroll 100% 0; padding: 0 12px; margin-right: -12px; }
#footer-surround { background: transparent url(./images/main/maincontent-bg.png) repeat-x scroll 0 0; overflow: hidden; }
#footer-bm { background: transparent url(./images/main/maincontent-bm.png) repeat-x scroll 0 0; margin: 0 12px; }
#footer-bl { background: transparent url(./images/main/maincontent-bl.png) no-repeat scroll 0 0; margin-left: -12px; }
#footer-br { background: transparent url(./images/main/maincontent-br.png) no-repeat scroll 100% 0; height: 12px; margin-right: -12px; }

.bodycontent { margin-left: 0; margin-right: 0; padding: 0 15px 15px; }

/*Items */
.item { position: relative; height: 20px; margin: 2px 0; padding: 3px 10px 0px 10px; color: #fff; }
.item2 { position: relative; height: 20px; margin: 2px 0; padding: 3px 10px 0px 10px; color: #fff; background: transparent url(./images/main/white-overlay.png) repeat 0 0; }
.item-name { float: left; }
.item-price { float: right; }
.white-overlay { background: transparent url(../images/main/white-overlay.png) repeat 0 0; }

/* Products */
#productFrame { background: transparent url(./images/products/productFrame.png) no-repeat scroll 50% 0; height: 175px; padding: 12px 0 0 0; }
#productFrame div { width: 210px; overflow: hidden; margin: 0 auto; text-align: center; }

#productFrame-sml { background: transparent url(./images/products/productFrame-sml.png) no-repeat scroll 50% 0; height: 125px; padding: 12px 0 0 0; }
#productFrame-sml div { width: 165px; overflow: hidden; margin: 0 auto; text-align: center; }

#products { margin-left: 15px; }
#products li { display: inline; float: left; margin: 15px 15px 0 0; text-align: center; }
#products a { color: #21BDDF; text-decoration: none; }
#products a:hover { color: #FFFFFF; text-decoration: none; }
#products img { border: none; }
#products img:hover { margin: -10px 0 10px 0; }

.bodycontent-divider { background: transparent url(./images/main/module-div.png) no-repeat scroll 50% 100%; margin-bottom: 10px; padding-top: 15px; height: 10px; clear: both; }

.bodycontent h1 { color: #21BDDF; font-size: 15px; text-align: center; }
.bodycontent span { color: #21BDDF; }

.block-divider { background: transparent url(./images/main/featuremod-div.png) no-repeat scroll 100% 50%; }

.bodycontent .special { height: 100%; }
.special img { float: left; margin-right: 15px; }
.special .product-heading { float: left; color: #21BDDF; font-size: 14px; font-weight: bold; margin: 0; padding: 0; }
.special .product-price { margin: 0; padding: 0; padding-left: 10px; color: #FFFFFF; font-size: 16px; font-weight: bold; }

/* Tooltip */
.tooltip a { position: relative; cursor: pointer; color: #FFF; }
.tooltip a span { color: #FFF; display: none; }
.tooltip a:hover span { background: #000; border: 1px solid #21BDDF; display: block; position: absolute; left: 230px; padding: 5px; top: 0px; white-space:normal; width: 300px; z-index: 200; } 

/* System Specs */
#systemSpec { text-align: center; }
#systemSpec ul { padding-left: 0px; }
#systemSpec li { list-style-type: none; }
#systemSpec span { color: #21BDDF; }

/* Block */
.bodycontent .block { font-size: 13px; text-align: center; padding: 0 70px; }
.bodycontent .block ul { padding: 0; margin: 0; }
.bodycontent .block ul li { list-style-type: none; }

.col2 { float: left; position: relative; right: 250px; width: 250px; }
#leftcol-padding { padding-right: 15px; }

/* Module */
.side-mod { margin-bottom: 20px; }

.module-header { background: transparent url(./images/main/sidemod-h3-m.png) repeat-x scroll 0 0; float: left; display: inline-block; margin: 0 10px 1px; }
.module-header2 { background: transparent url(./images/main/sidemod-h3-l.png) no-repeat scroll 0 0; float: left; display: inline-block; margin-left: -10px; }
.module-header3 { background: transparent url(./images/main/sidemod-h3-r.png) no-repeat scroll 100% 0; float: left; display: inline-block; margin-right: -10px; }

h3 { display: inline; line-height: 28px; margin: 0; padding: 0 10px 5px 0; color: #DDDDDD; font-weight: normal; font-size: 14px; }

.module-title { padding: 0 10px; }
.module-title span { color: #21BDDF; }
.module-tm { background: transparent url(./images/main/sidemod-tm.png) repeat-x scroll 0 0; clear: left; margin: 0 10px; }
.module-t1 { background: transparent url(./images/main/sidemod-tl.png) no-repeat scroll 0 0; margin-left: -10px; }
.module-tr { background: transparent url(./images/main/sidemod-tr.png) no-repeat scroll 100% 0; margin-right: -10px; padding: 10px; }
.module { background: transparent url(./images/main/sidemod-bg.png) repeat scroll 0 0; overflow: hidden; padding: 10px; }

.module a { color: #21BDDF; text-decoration: none; }
.module a:hover { color: #FFFFFF; text-decoration: none; }

.module #menu a{ padding-left: 15px; background: transparent url(./App_Themes/TreeView/images/bullets/right2.gif) no-repeat scroll 0 1px; }
.module #menu a:hover{ background: transparent url(./App_Themes/TreeView/images/bullets/right2white.gif) no-repeat scroll 0 1px; }

.module h1 { font-size: 14px; color: #21BDDF; }
.module ul { list-style-type: none; padding-left: 0px; }
.module span { color: #21BDDF; }
.module-divider { background: transparent url(./images/main/module-div.png) repeat-x scroll 50% 100%; height: 3px; width: 100px; padding: 5px 0 5px 0; }

/* Header CSS */

#logo { position: absolute; margin-top: 5px; text-decoration: none; }
img { border-style: none; }

#hor-menu-surround { float: right; }
#hor-menu { background: transparent url(./images/main/horizmenu-bg.png) no-repeat scroll 50% 0; display: block; height: 77px; margin-top: 15px; }
#hor-menu ul { list-style-image: none; list-style-position: outside; list-style-type: none; }
#hor-menu li { background: transparent url(./images/main/horizmenu-div.png) no-repeat scroll 100% 50%; display: block; float: left; font-size: 14px; font-weight: normal; margin: 0; height: 65px; line-height: 65px; position: relative; color: #21BDDF; }

.menutop { cursor: pointer; margin: 0; padding: 0; position: relative; float: left; margin-bottom: 1.5em; }
.menutop a { position: relative; display: block; color: #21BDDF; line-height: 65px; height: 65px; white-space: nowrap; text-decoration: none; padding: 0 20px 0 20px; }
.menutop a.current { background: transparent url(./images/main/horizmenu-active.png) no-repeat scroll 50% 0; white-space: nowrap; text-decoration: none; color: #FFFFFF; }
.menutop a:hover { background: transparent url(./images/main/horizmenu-active.png) no-repeat scroll 50% 0; white-space: nowrap; text-decoration: none; color: #FFFFFF; }

.footer-text { padding-top: 20px; text-align: center; font-size: 9px; }

#bgfiller { position: relative; background: transparent url(./images/main/bg-overlay.png) repeat scroll 0 0; height: 100%; width: 100%; }

/* Drop Down menu */ 
#menu-1 { position: absolute; visibility: hidden; background: transparent url(./images/main/drop-bg-1.png) no-repeat 0 100%; margin-top: 16px; width: 170px; padding: 0 10px 15px 10px; overflow: hidden; z-index: 120; }
#menu-1 a { height: 24px; line-height: 24px; background: transparent url(./images/main/module-div.png) repeat-x scroll 50% 100%; overflow: hidden; padding: 0 5px 0 5px; z-index: 120; }
#menu-1 a:hover { height: 24px; line-height: 24px; background: transparent url(./images/main/module-div.png) repeat-x scroll 50% 100%; z-index: 120; }

#menu-2 { position: absolute; visibility: hidden; background: transparent url(./images/main/drop-bg-1.png) no-repeat scroll 0 100%; margin-top: 16px; width: 170px; padding: 0 10px 15px 10px; overflow: hidden; z-index: 120; }
#menu-2 a { height: 24px; line-height: 24px; background: transparent url(./images/main/module-div.png) repeat-x scroll 50% 100%; overflow: hidden; padding: 0 5px 0 5px; z-index: 120; }
#menu-2 a:hover { height: 24px; line-height: 24px; background: transparent url(./images/main/module-div.png) repeat-x scroll 50% 100%; z-index: 120; }

#menu-3 { position: absolute; visibility: hidden; background: transparent url(./images/main/drop-bg-1.png) no-repeat scroll 0 100%; margin-top: 16px; width: 170px; padding: 0 10px 15px 10px; overflow: hidden; z-index: 120; }
#menu-3 a { height: 24px; line-height: 24px; background: transparent url(./images/main/module-div.png) repeat-x scroll 50% 100%; overflow: hidden; padding: 0 5px 0 5px; z-index: 120; }
#menu-3 a:hover { height: 24px; line-height: 24px; background: transparent url(./images/main/module-div.png) repeat-x scroll 50% 100%; z-index: 120; }

#menu-4 { position: absolute; visibility: hidden; background: transparent url(./images/main/drop-bg-1.png) no-repeat scroll 0 100%; margin-top: 16px; width: 170px; padding: 0 10px 15px 10px; overflow: hidden; z-index: 120; } 
#menu-4 a { height: 24px; line-height: 24px; background: transparent url(./images/main/module-div.png) repeat-x scroll 50% 100%; overflow: hidden; padding: 0 5px 0 5px; z-index: 120; }
#menu-4 a:hover { height: 24px; line-height: 24px; background: transparent url(./images/main/module-div.png) repeat-x scroll 50% 100%; z-index: 120; }

.menu-item { color: White; height: 20px; z-index: 200px;}

/* Misc CSS */

.wrapper { position: relative; background-repeat: no-repeat; }
div.wrapper { margin: 0 auto; padding: 0; width: 979px; }
.container { margin: 0 auto; text-align: center; font-family: Verdana; width: 958px; height: 100%; }
.center { text-align: center; }
.msg { color: #00FF00; text-align: center; font-weight: bold; }

/* Data Pager */
#DataPager .selectedItem { color: #FFF; text-decoration: none; }
#DataPager a { text-decoration: underline; }

/* Message Board */
.messageBoard tr { background: transparent url(./images/main/messageBoard-overlay.png) repeat 0 0; }
.messageBoard td { padding: 2px 5px; }

/* Update Panel Loader */
.AJAX_Progress { position: absolute; text-align: center; top: 0px; left: 0px; right: 0px; bottom: 0px; width: auto; height: auto; z-index: 300; }

.AJAX_Progress .Progress { position: absolute; text-align: center; top: 0px; left: 0px; right: 0px; bottom: 0px; width: auto; height: auto; z-index: 302; }

.AJAX_Progress .Backing { position: absolute; text-align: center; top: 0px; left: 0px; right: 0px; bottom: 0px; width: auto; height: auto; background-color: #C0C0C0; filter: alpha(opacity=75); -moz-opacity: 0.75; -khtml-opacity: 0.75; opacity: 0.75; z-index: 301; }


/* AUTO COMPLETE - Customer */
.AutoExtender { font-family: Verdana, Helvetica, sans-serif; font-size: .8em; font-weight: normal; border:solid 1px #006699; line-height:20px; padding:2px; background-color:White; }
.AutoExtenderList { border-bottom:dotted 1px #006699; cursor:pointer; color:#21BDDF; }
.AutoExtenderHighlight { color:White; background-color:#006699; cursor:pointer; }

/*Customer Repairs Form */
.CustomerFields { padding: 5px 0 5px 0; text-align: center; }
.CustomerFieldsLeft { padding: 5px 0 5px 0; text-align: left; }
.Customer-divider { background: transparent url(./images/main/module-div.png) no-repeat scroll 50% 100%; margin-bottom: 10px; padding-top: 0px; height: 10px; clear: both; }

/*Repairs Pending */
.repairsListItem { width: 400px; height: 16px; font-size: 11px; }
.repairsListImage { float: left; width:16px; height: 16px; }
.repairsListName { float: left; text-align: left; padding: 0 3px; vertical-align: middle; margin: 0; height: 16px; width:300px; }

/* Lightbox Sample */
.black_overlay{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	bottom: 0%;
	background-color: black;
	z-index:1001!important;
	-moz-opacity: 0.8;
	opacity:.80;
	filter: alpha(opacity=80);
}
.white_content {
	display: none;
	position: absolute;
	top: 5%;
	width: 700px;
	left: 50%;
	margin: 0 0 0 -250px;
	background-color: #FFF;
	height: 80%;
	padding: 16px;
	border: 1px solid white;
	z-index:1002;
	overflow: auto;
	font-size: 12px;
	color: #000;
}
.white_content a { text-decoration: underline; }
.white_content a:hover { color: #21BDDF; }


