body     { color: black; font-size: 1em; font-family: Verdana, Arial, Helvetica, sans-serif; background-color: white; background-image: url("../images/background.gif"); background-repeat: repeat-x; background-position: 0 0; behavior: url(includes/csshover.htc); }
html, body {height: 100%; }

/* The Page Head graphics and text */
#headBox    { z-index: 80; background-image: url("../images/headerimage.gif"); background-repeat: no-repeat; position: absolute; top: 0; left: 0; width: 427px; height: 165px }
#headBox h1   { color: #006; font-size: 1.5em; font-weight: bold; display: none; margin: 0.67em 0 }

/* The NavBox contains all of the navigation images and links */
#navBox   { z-index: 100; position: absolute; top: 125px; left: 0; width: 192px }
body>#navBox { top:115px;}
#navBox .navtext  { display: none;}

/* The contentBox contains the main text of each page */
#contentBox     { margin: border: 1px red solid; margin: 0 0 0 50px; padding-bottom: 100px; position: relative; top: 220px; left: 200px; width: 500px }
#contentBox h1 { display: none }
#contentBox h2 { color: #600; font-size: 1.25em; font-weight: bold; margin: 1em 0 0.4em; border-bottom: 1px solid #800000 }
#contentBox h3  { color: #000; font-size: 1em; font-weight: bold; margin: 0; padding: 0; }
#contentBox p { font-size: 0.8em }

#contentBox img.right { border: 1px solid; margin:1em; float: right }
#contentBox img.left { border: 1px solid; margin:1em; float: left }

#contentBoxProduct { margin: border: 1px red solid; margin: 0 0 0 50px; padding-bottom: 100px; position: relative; top: 220px; left: 200px; width: 500px }
#contentBoxProduct h1 { display: none }
#contentBoxProduct h2 { color: #600; font-size: 1.25em; font-weight: bold; margin: 1em 0 0.4em; border-bottom: 1px solid #800000 }
#contentBoxProduct h3  { color: #000; font-size: 1em; font-weight: bold; margin: 0; padding: 0; border-bottom: 1px solid gray }
#contentBoxProduct p { font-size: 0.8em }
#contentBoxProduct img.right { float: right }
#contentBoxProduct img.left { float: left }


.trademark  { font-size: 0.6em; text-transform: capitalize; position: relative; top: -0.7em }
.imagecaption      { color: #930; font-size: 0.75em; font-style: italic }
.toolphotobox     { background-color: #fc9; text-align: center; margin: 2px 0; padding: 0; border: solid 1px #963 }
/* These Images will connect the page headers with their location on the navigation bar */
.CompanyHeaderImage   { z-index: 100; position: absolute; top: -90px; left: -260px }
#contentBox>span.CompanyHeaderImage {left: -258px; top: -115px;}
.ProductHeaderImage   { z-index: 100; position: absolute; top: -74px; left: -68px; }
#contentBoxProduct>span.ProductHeaderImage {left: -66px; top: -82px;}
.ProductHeaderImageSubPage   { z-index: 100; position: absolute; top: -74px; left: -68px; }
#contentBox>span.ProductHeaderImageSubPage {left: -66px; top: -89px;}
.ContactUsHeaderImage   { z-index: 100; position: absolute; top: -74px; left: -68px; }
#contentBox>span.ContactUsHeaderImage { top: -82px; left: -66px;}
.ToolStringHeaderImage   { z-index: 100; position: absolute; top: -77px; left: 82px; }
#AddToolcontentBox>span.ToolStringHeaderImage { top: -80px; left: 84px; }
#AddToolcontentBox2 .ToolStringHeaderImage   { z-index: 100; position: absolute; top: -77px; left: -68px; }
#contentBox>span.ToolStringHeaderImage { top: -59px; left: 84px; }
#AddToolcontentBox2>span.ToolStringHeaderImage { top: -92px; left: -66px; }
/* Error Handling Functions */
#errorbox  { background-color: #fff; margin: 4px; padding: 10px; z-index: 1; width: 80%; border: solid 1px #f30 }
#errorbox .error  { color: #f30; font-weight: bold }
#errorbox .error-message  { color: #000; font-weight: bold }

#AddToolcontentBox { margin: 0 0 0 50px; position: relative; top: 220px; left: 50px; width: 500px }
#AddToolcontentBox h1 { display: none }
#AddToolcontentBox h2  { color: #600; font-size: 1.25em; font-weight: bold; text-decoration: none; margin: 1em 0 0.4em }
#AddToolcontentBox h3  { color: #000; font-size: 1em; font-weight: bold; margin: 0; padding: 0; border-bottom: 1px solid gray }
#AddToolcontentBox p { font-size: 0.8em }
#AddToolcontentBox img.right { float: right }
#AddToolcontentBox img.left { float: left }

#AddToolcontentBox2 { margin: 0 0 0 50px; position: relative; top: 220px; left: 200px; width: 500px }
#AddToolcontentBox2 h1 { display: none }
#AddToolcontentBox2 h2  { color: #600; font-size: 1.25em; font-weight: bold; text-decoration: none; margin: 1em 0 0.4em }
#AddToolcontentBox2 h3  { color: #000; font-size: 1em; font-weight: bold; margin: 0; padding: 0; border-bottom: 1px solid gray }
#AddToolcontentBox2 p { font-size: 0.8em }
#AddToolcontentBox2 img.right { float: right }
#AddToolcontentBox2 img.left { float: left }

/* Add Tool Navigation Items */
/* Add Tool Navigation Items */
#AddToolBox  { position: absolute; left: 180px; top:-260px; font-size: 0.8em; margin: -1px 0 0 -1px; z-index: 100; width: 200px; float: left;}
#AddToolBox .ToolInstructionsBox { border: 1px #C0C0C0 solid; background-color: #F1E6D8; width:200px; position: relative; left: -250px; top: 284px; padding: 1em;}
#AddToolBox .header  { color: #c90; font-size: 1.25em; font-weight: bold }
#AddToolBox .desc  { color: #333; font-size: 1em; font-style: italic; }
#AddToolBox .ToolContinueBox {border: 1px #C0C0C0 solid; background-color: #EEEEF4; width:200px; position: relative; left: -250px; top: 300px; padding: 1em;}
#AddToolBox form { text-align: center;}
#AddToolBox ul     	 { margin: 0; padding: 0; width: 200px }
#AddToolBox li    	  { color: #300; background-color: #ccc; list-style-type: none; margin: 0; padding: 4px 4px 4px 4px; position: relative; border: solid 1px #999; z-index: 100; }
#AddToolBox .parent {background-image: url("../images/icons/arrow.gif"); background-repeat: no-repeat; background-position: 200px 8px;}
#AddToolBox li:hover   { color: #000; background-color: white; z-index: 100; }
#AddToolBox li a     { text-decoration: none; display: block; width: 200px; z-index: 100;    }
#AddToolBox>ul a 	 { width:auto}
#AddToolBox ul ul 	  { display: none; position: absolute; top: -1px; width: 200px; left: 198px }
#AddToolBox>ul ul { left: 208px; top: -1px}
#AddToolBox ul.level1 li:hover ul.level2 {display:block}
#AddToolBox ul li { text-decoration: none; display: block; width: 200px; z-index: 100; }
#AddToolBox ul li ul li:hover    { color: #000; background-color: #999; z-index: 100; }
#AddToolBox ul li ul li   { background-color: #fff }
#AddToolBox ul ul ul	  { display: none; position: absolute; top: -1px; width: 200px; left: 198px }
#AddToolBox>ul ul ul { left: 208px; top: -1px}
#AddToolBox ul.level1 li:hover ul.level2 li:hover ul.level3 {display:block}
#ToolStringBox   { position: relative; left: 300px; width: 400px; float: right; }
#ToolStringBox .imagebox   { height: 180px; margin: 0; padding: 0; position: relative; z-index: 10; height: 197px }
#ToolStringBox .imagebox img  { height: 180px;  }
#ToolStringBox .imagebox .type  { display: block; color: #333; font-size: .9em; font-weight: bold; position: relative;  left: -140px }
#ToolStringBox .imagebox .title  { display: block;color: #300; font-size: 0.8em; font-weight: bold; position: relative;  left: -140px }
#ToolStringBox .imagebox .desc {display: block; font-size: 0.8em;  position: relative;  left: -140px }
#ToolStringBox .imagebox .tool  { margin: 0; padding: 0 }
#ToolStringBox .imagetoolbox {position:relative ; left: -140px; }
#ToolStringBox .imagebox a.tool   { font-size: 0.75em; text-decoration: none; display: block; padding-left: 20px }
#ToolStringBox .imagebox a.tool:hover  { color: #f30; text-decoration: underline }
#ToolStringBox .imagebox a.tool.moveup    { background-image: url("../images/icons/up.gif"); background-repeat: no-repeat }
#ToolStringBox .imagebox a.tool.movedown    { background-image: url("../images/icons/down.gif"); background-repeat: no-repeat }
#ToolStringBox .imagebox a.tool.delete    { background-image: url("../images/icons/delete.gif"); background-repeat: no-repeat }

/* Footer Styles */

#FooterBox   { z-index: 30;  color: #666; font-size: 0.75em; text-align: top; width: auto;  }
#FooterBox .leftline   { background-image: url("../images/leftline.png"); background-repeat: repeat-x; background-position: 0 0; position: relative; z-index: 10; top: -2060px; left: -260px; width: 50px; height:100px;}
#FooterBox>div.leftline { z-index: 10; left: -258px; top: -2050px;} 
#FooterBox img.footerline { z-index: 100; position: relative; left: -260px;}
#FooterBox>img.footerline { left: -258px;}
#FooterBox .footerlinks a { text-decoration: none;}
#FooterBox .footerlinks a:hover {color: #f30; text-decoration: underline }

#AddToolcontentBox #FooterBox   { z-index: 30;  color: #666; font-size: 0.75em; text-align: top; width: auto;  }
#AddToolcontentBox .leftline   { background-image: url("../images/leftline.png"); background-repeat: repeat-x; background-position: 0 0; position: relative; z-index: 10; top: -2060px; left: -110px; width: 50px; height:100px;}
#AddToolcontentBox>#FooterBox>div.leftline {top: -2050px; left: -108px;}
#AddToolcontentBox img.footerline { z-index: 100; position: relative; left: -110px;}
#AddToolcontentBox>#FooterBox>img.footerline { left: -108px;}
#AddToolcontentBox  .footerlinks a { text-decoration: none;}
#AddToolcontentBox  .footerlinks a:hover {color: #f30; text-decoration: underline }

#AddToolcontentBox2 .toolContactInfoForm { border:1px #400000 solid; padding: 2px; background-color: #F1E6D8}
#AddToolcontentBox2 .toolContactInfoForm p { text-style: bold; display: block; border: 1px #C0C0C0 solid; padding:.5em; background-color: white; margin: 2px;}
#AddToolcontentBox2 .toolContactInfoForm input, #AddToolcontentBox2 .toolContactInfoForm select  { position: absolute; left: 175px }
#AddToolcontentBox2 .toolContactInfoForm .continueButton { position: absolute; left: 420px; top:490px; z-index:101; }
#AddToolcontentBox2 .toolContactInfoForm .continueButton3 { position: absolute; left: 420px; top:253px; z-index:101; }

.welcomeBox {text-align: center; border: 1px #FF8080 solid; background-color: #F1E6D8; width:400px;  padding: 1em;}