/* 
   The below CSS file was built using samples + techniques described by Rachel Andrew in her book:
   The CSS Anthology: 101 Essential Tips, Tricks & Hacks
*/

/* Overall Page */

body {
	margin: 0;
	padding-bottom: 2em;
	background-color: #FFFFFF;
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border-top: 2px solid #0510FF;
}

/* Header Section */

#header {
	border-top: 3px solid #CCFFFF;
	border-bottom: 1px dotted #CCFFFF;
	height: 8em;
    background-color: #fff;
    vertical-align: middle;	
    border-bottom: solid 2px blue;
}
#header .title {
	font: 100% Arial, Helvetica, Georgia, "Times New Roman", Times, serif;
	color: black;
	background-color: transparent;
	float: left;
	margin-right: 2em;
	margin-top: 0.3em;
	margin-left: .8em;
}
#header .breadcrumb {
	font: 90% Arial, Helvetica, Georgia, "Times New Roman", Times, serif;
	color: black;
	background-color: transparent;
	float: right;
	margin-right: 2em;
	margin-top: 0.8em;
	font-weight:bold;
}

#header a:link, a:visited  {
	color: #0510FF;
}

/* Navigation */

#navigation {
	width: 200px;
	top: 10em;
	left: 1em;
	width: 13em;	
	position:absolute;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:90%;
}
#navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
#navigation li {
	border-bottom: 1px solid #0000FF;
}
#navigation li a  {
	display: block;
	padding: 5px 5px 5px 0.5em;
	border-left: 12px solid #FFFFFF;
	border-right: 1px solid #FFFFFF;
	background-color: #FFFFFF;
	color: #0115FF;
	text-decoration: none;
}
#navigation li a:hover {
	background-color: #CFCFCF;
	color: #FFFFFF;
}
#navigation ul ul {
	margin-left: 12px;
}
#navigation ul ul li {
	border-bottom: 1px solid #FFFFFF;
	margin:0;
	background-color: #FFFFFF;
	color: #FFFFFF;
}
#navigation ul ul a:link, #navigation ul ul a:visited {
	background-color: #FFFFFF;
	color: #7115FF;
}
#navigation ul ul a:hover {
	background-color: #CCCCFF;
	color: #FFFFFF;
}

/* Main Content */

#content 
{
	margin-top:1em;
	margin-left: 16em;
	margin-right: 2em;
    padding-left: 10px;
    padding-right: 15px;
    border-left: solid 1px blue;	
	
}
h1 {
	font: 150% Arial, Helvetica, Georgia, "Times New Roman", Times, serif;
}
#content p {
	font-size: 80%;
	line-height: 1.6em; 
}

#content ul {
	font-size: 80%;
	line-height: 1.6em; 
}

#top
{
    width:100%;
    font-size: xx-large;
    font-weight: bold;
    border-bottom: solid 3px black;
    padding-left: 25px;
    background-color: #eee;
    vertical-align: middle;
}

#left
{
    padding-left: 10px;
    padding-top: 8px;
    float: left;
    width: 200px;
}

#right
{
	margin-right: 2em;
	margin-top: 0.8em;
    float: right;
    width: 200px;
}
#main
{
    padding-top: 8px;
    margin-left: 215px;
    padding-left: 10px;
    padding-right: 15px;
    border-left: solid 1px black;
}

#bottom
{
    text-align: center;
    font-size: small;
    padding-top: 0px;
}





.boxText { font-family: Verdana, Arial, sans-serif; font-size: 10px; }
.errorBox { font-family : Verdana, Arial, sans-serif; font-size : 10px; background: #ffb3b5; font-weight: bold; }
.stockWarning { font-family : Verdana, Arial, sans-serif; font-size : 10px; color: #cc0033; }
.productsNotifications { background: #f2fff7; }
.orderEdit { font-family : Verdana, Arial, sans-serif; font-size : 10px; color: #70d250; text-decoration: underline; }

BODY {
  background: #ffffff;
  color: #000000;
  margin: 0px;
}

A {
  color: #000000;
  text-decoration: none;
}

A:hover {
  color: #AABBDD;
  text-decoration: underline;
}

FORM {
	display: inline;
}

TR.header {
  background: #ffffff;
}

TR.headerNavigation {
  background: #bbc3d3;
}

TD.headerNavigation {
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
  background: #bbc3d3;
  color: #ffffff;
  font-weight : bold;
}

TR.smallStyle {
  font-family:Verdana, Arial, Helvetica, sans-serif; font-size:x-small;
}

A.headerNavigation { 
  color: #FFFFFF; 
}

A.headerNavigation:hover {
  color: #ffffff;
}

TR.headerError {
  background: #ff0000;
}

TD.headerError {
  font-family: Tahoma, Verdana, Arial, sans-serif;
  font-size: 12px;
  background: #ff0000;
  color: #ffffff;
  font-weight : bold;
  text-align : center;
}

TR.headerInfo {
  background: #00ff00;
}

TD.headerInfo {
  font-family: Tahoma, Verdana, Arial, sans-serif;
  font-size: 12px;
  background: #00ff00;
  color: #ffffff;
  font-weight: bold;
  text-align: center;
}

TR.footer {
  background: #bbc3d3;
}

TD.footer {
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
  background: #bbc3d3;
  color: #ffffff;
  font-weight: bold;
}

.infoBox {
  background: #b6b7cb;
}

.infoBoxContents {
  background: #f8f8f9;
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
}

.infoBoxNotice {
  background: #FF8E90;
}

.infoBoxNoticeContents {
  background: #FFE6E6;
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
}

TD.infoBoxHeading {
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
  font-weight: bold;
  background: #bbc3d3;
  color: #ffffff;
}

TD.infoBox, SPAN.infoBox {
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
}

TR.accountHistory-odd, TR.addressBook-odd, TR.alsoPurchased-odd, TR.payment-odd, TR.productListing-odd, TR.productReviews-odd, TR.upcomingProducts-odd, TR.shippingOptions-odd {
  background: #f8f8f9;
}

TR.accountHistory-even, TR.addressBook-even, TR.alsoPurchased-even, TR.payment-even, TR.productListing-even, TR.productReviews-even, TR.upcomingProducts-even, TR.shippingOptions-even {
  background: #f8f8f9;
}

TABLE.productListing {
  border: 1px;
  border-style: solid;
  border-color: #b6b7cb;
  border-spacing: 1px;
}

.productListing-heading {
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
  background: #b6b7cb;
  color: #FFFFFF;
  font-weight: bold;
}

TD.productListing-data {
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
}

A.pageResults {
  color: #0000FF;
}

A.pageResults:hover {
  color: #0000FF;
  background: #FFFF33;
}

TD.pageHeading, DIV.pageHeading {
  font-family: Verdana, Arial, sans-serif;
  font-size: 20px;
  font-weight: bold;
  color: #9a9a9a;
}

TR.subBar {
  background: #f4f7fd;
}

TD.subBar {
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
  color: #000000;
}

TD.main, P.main {
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
  line-height: 1.5;
}

TD.smallText, SPAN.smallText, P.smallText {
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
}

TD.accountCategory {
  font-family: Verdana, Arial, sans-serif;
  font-size: 13px;
  color: #aabbdd;
}

TD.fieldKey {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
}

TD.fieldValue {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
}

TD.tableHeading {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
}

SPAN.newItemInCart {
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
  color: #ff0000;
}

CHECKBOX, INPUT, RADIO, SELECT {
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
}

TEXTAREA {
  width: 100%;
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
}

SPAN.greetUser {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  color: #f0a480;
  font-weight: bold;
}

TABLE.formArea {
  background: #f1f9fe;
  border-color: #7b9ebd;
  border-style: solid;
  border-width: 1px;
}

TD.formAreaTitle {
  font-family: Tahoma, Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
}

SPAN.markProductOutOfStock {
  font-family: Tahoma, Verdana, Arial, sans-serif;
  font-size: 12px;
  color: #c76170;
  font-weight: bold;
}

SPAN.productSpecialPrice {
  font-family: Verdana, Arial, sans-serif;
  color: #ff0000;
}

SPAN.errorText {
  font-family: Verdana, Arial, sans-serif;
  color: #ff0000;
}

.moduleRow { }
.moduleRowOver { background-color: #D7E9F7; cursor: pointer; cursor: hand; }
.moduleRowSelected { background-color: #E9F4FC; }

.checkoutBarFrom, .checkoutBarTo { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #8c8c8c; }
.checkoutBarCurrent { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #000000; }

/* message box */

.messageBox { font-family: Verdana, Arial, sans-serif; font-size: 10px; }
.messageStackError, .messageStackWarning { font-family: Verdana, Arial, sans-serif; font-size: 10px; background-color: #ffb3b5; }
.messageStackSuccess { font-family: Verdana, Arial, sans-serif; font-size: 10px; background-color: #99ff00; }

/* input requirement */

.inputRequirement { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #ff0000; }

.TopLogo
{
    float: right;
}
.TopLogoLeft
{
    float: left;
}


/* -- Stylesheet for http://www.mathertel.de and AJAX Engine Example WebSite -- */


/* input fields lign up with images with class=INPUTFUNC */
input {height:16px;border:solid 1px #203050;vertical-align:middle;padding:0px 2px 1px 2px}

button, img.INPUTFUNC { padding:1px;border:solid 1px #203050;vertical-align:middle;margin:0px;background-color:#acc1e4;cursor:pointer;}
  img.INPUTFUNC { margin-left:-1px;}

/* buttons etc.:active, passive, disabled layout */
.activ { background-color:#acc1e4!important;border:solid 1px #203050!important;}
.passiv {background-color:#dddddd!important }
.disabled { background-color:#eeeeee!important;filter:alpha(opacity=25);-moz-opacity:0.25;opacity:0.25;}

/* -- Visual Effects -- */

.VESimpleShadow {
  filter:progid:DXImageTransform.Microsoft.dropShadow(Color=AAAAAA,offX=8,offY=8,positive=true);}

.VEShadow {
  position:absolute;left:8px;top:8px;width:100%;height:100%;
  background-color:black;border:solid 1px #666666;filter:alpha(opacity=25);-moz-opacity:0.25;opacity:0.25;}

.VEKeyword {font-weight:bold;color:#203050;cursor:pointer}

/* --- rounded corners --- */
div.VERound {overflow:hidden;height:1px;font-size:1px }

/* --- Parts inc. Mover and Buttons --- */

.VEPart {position:relative;border:2px solid #203050;}

.VETitle, .VEMover, .DIALOGHEADER {
  position:relative;
  padding:3px;background-color:#203050;color:white;font-weight:bold}

.VEMover { cursor:move;}
.VETitle { cursor:default;}

.VEFull,.VEMini,.VEClose {
  cursor:pointer;
  border:1px solid white;width:14px;height:14px;
}

.VEFull,.VEMini {
  position:absolute;text-align:center;
  right:23px;top:2px;
}

.VEClose {
  position:absolute;text-align:center;
  right:4px;top:2px;
}

.VEPopUpDialog {
  position:absolute;z-index:98;top:200px;left:100px;
  margin-bottom:12px;margin-right:12px;
}

.VEPopUpDialog.Error {
  z-index:99;top:390px;left:60px;
}

.VEContent {
  position:relative;
  padding:3px;
  background-color:#f8f8f8;
  }

.VEPopUpDialog.Error .VEContent{
  border:2px solid #b40a0a;
  background-color:white;
  padding:8px 8px 8px 6px;
}

.LIGHTBOXDIALOG {
  border:2px solid #b40a0a;
  background-color:white;
  padding:1px 1px 1px 1px;
}
   

/* --- buttons+hover --- */

.VEButton, .VEButtonHover, .VEButtonPushed {
  display:-moz-inline-box;display:inline-block;cursor:pointer;padding:2px 6px 2px 6px;
  color:white;font-weight:bold
  }  

.VEButton { 
  background-image:url(controls/images/buttonback.png);background-color:#eaeef7;
  background-position:bottom;background-repeat:repeat-x;
  border:solid 1px #517dc7;
  }

.VEButtonHover {
  background-image:url(controls/images/buttonbackhover.png);background-color:#eaf7ee;
  background-position:bottom;background-repeat:repeat-x;
  border:solid 1px #51c77d;
  }

.VEButtonPushed {
  background-image:url(controls/images/buttonbackpushed.png);background-color:#eaeef7;
  background-position:top;background-repeat:repeat-x;
  border:solid 1px #517dc7;
  }

.VEButton.selected { 
  background-image:url(controls/images/buttonbackselected.png);background-color:#eaeef7;
  background-position:bottom;background-repeat:repeat-x;
  border:solid 1px red;
  }

/* --- menu --- */

.VEMenuBar { background-color:#eeeeee;padding:2px 8px 2px 8px;height:20px;overflow:hidden;}
.VEMenuBar * { vertical-align:top;}
.VEMenuBar span, .VEMenuBar a {display:-moz-inline-box;display:inline-block;}
.VEMenuBar label {display:-moz-inline-box;display:inline-block;border:0px;padding:2px;cursor:default}

.VEMenu { border:0px;padding:2px;cursor:pointer}
.VEMenuHover { border-style:solid;border-width:1px;border-color:#acc1e4 #203050 #203050 #acc1e4;padding:1px;cursor:pointer}
.VEMenuPushed { border-style:solid;border-width:1px;border-color:#203050 #acc1e4 #acc1e4 #203050;padding:1px;cursor:pointer}
.VEMenuSeparator { height:20px;width:1px;border-left:solid 1px #203050}

.VEColorPicker { border:solid 2px #203050; 
                 moz-user-select:none; background-color: yellow; position:absolute; width: 161px }
.VEColorPicker table { background-color: white; }
.VEColorPicker td { border: 0px; width: 15px; height: 15px; }

/* --- overlay tabs and panels+hover --- */

.VEOverlayPanel .VEPart { border-top:none}
.VETabStart, .VETabGap, .VETabEnd { display:inline-block;overflow:hidden;border-bottom:solid 1px #203050 }
.VETabGap, .VETabEnd { height:8px;width:4px;
  background-color:black;filter:alpha(opacity=20);-moz-opacity:0.2;opacity:0.2;}
.VETabStart, .VETabEnd { width:8px;}

.VETab, .VETabSel, .VETabSelHover, .VETabSelPushed, .VETabHover, .VETabPushed {
  display:inline-block;height:16px;padding:1px 8px 1px 8px;cursor:pointer;
  border-left:solid 1px #517dc7;border-top:solid 1px #517dc7;
  border-right:solid 1px #203050;}  
.VETab { 
  background-color:#bbbbbb;border-bottom:solid 2px #203050;
  }
.VETabHover, .VETabPushed {
  background-color:#dddddd;border-bottom:solid 2px #203050 }
.VETabSel, .VETabSelHover, .VETabSelPushed {
  background-color:#eeeeee;padding-bottom:3px;border-bottom:0px }
      
/* -- calendar -- */

.VECalendar {border-collapse:collapse}
.VECalendar td {
  cursor:default;white-space:pre;
  font-family:Tahoma,Helvetica,Arial;font-size:12px;text-align:right;
  width:20px;height:14px;border:solid 1px #203050;background-color:#eeeeee;
}
.VECalendar td.f { color:#203050;background-color:#acc1e4;text-align:center;border:solid 1px white;}
.VECalendar td.h { color:#203050;background-color:transparent;width:62px;text-align:center;border:solid 1px white;}
.VECalendar td.w { color:#203050;background-color:transparent;
  border-left:solid 1px white;border-top:solid 1px white;border-right:solid 1px white;
  text-align:center;}
.VECalendar td.m { color:#203050;cursor:pointer;}
.VECalendar td.p { color:#808080;cursor:pointer;}
.VECalendar td.sel { color:black;background-color:yellow;cursor:pointer;}

/* -- dialogs, lightbox -- */

.DIALOGFUNCTIONBAR { height:22px;border-top:solid 1px white;background-image:url(controls/images/FunctionBar.png);background-repeat:repeat-x;
  text-align:right;}
  
.DIALOGFUNCTION { display:inline-block;padding:2px 10px 2px 10px;height:18px;
  cursor:pointer;font-weight:bold;color:white;text-align:left;
  background-image:url(controls/images/Function.png);background-repeat:repeat-x;border-left:solid 1px white;}

.DATAINPUT {}
.DATAINPUT.EMPTY { color:silver }

/* -- content area style -- */
.box {
  background-color:#dddddd;
  background-image:url(line.png);
  background-position:left top;
  background-repeat:repeat-x;
  padding:6px;margin-bottom:12px;
  border-top:solid 1px #203050;
  border-right:dotted 1px #203050;
  border-bottom:dotted 1px #203050;
  border-left:dotted 1px #203050;
}

/* -- block for source code formatting -- */
pre.code {display:block;margin:2px;border:solid 1px black;font-family:Monospace;font-size:8pt;color:black;background-color:#ffff99;overflow:hidden}

/* -- View Selector classes -- */
a.activ, a.passiv, a.disabled { border:solid 1px #203050;padding:1px 4px;}

/* -- TableData controls -- */
.TableDataPager { background-color:#dddddd;border:solid 1px #203050;padding:2px;}
.TableDataPager A {display:-moz-inline-box;display:inline-block;text-align:center;width:16px;font-weight:bold;text-decoration:
 none;padding:1px 3px 1px 3px;border:solid 1px white;height:15px;vertical-align:middle;}
  
.TableData { background-color:#dddddd;border:dotted 1px #203050;padding:0px;}
.TableData thead tr { position:relative;top:0px;background-color:#dddddd}
.TableData table {border-collapse:collapse}
.TableData th {border-bottom:solid 1px #203050}
.TableData td {border-bottom:solid 1px #203050;}
  
/* -- TreeView controls -- */
div.TreeView .du {height:18px;overflow:hidden;cursor:hand;background-image:url(controls/images/dc.png);background-repeat:no-repeat}
div.TreeView .do {height:18px;overflow:hidden;cursor:hand;background-image:url(controls/images/do.png);background-repeat:no-repeat}
div.TreeView .dc {height:18px;overflow:hidden;cursor:hand;background-image:url(controls/images/dc.png);background-repeat:no-repeat}
div.TreeView .de {height:18px;overflow:hidden;background-image:url(controls/images/de.png);background-repeat:no-repeat}
div.TreeView .fl {height:18px;overflow:hidden;background-image:url(controls/images/file.png);background-repeat:no-repeat}
div.TreeView .ft {padding-left:40px}
div.TreeView .subframe {margin-left:18px;}


/* -- more... controls -- */

@media print {
  #sidebarZone {display:none !important;}
  #main {width:auto;}
  
  div.VETitle, div.VEMover {
    border:1px solid black !important;
    padding:1px;background-color:white !important;color:black !important;}

  .VEShadow {display:none !important;}
}