/* This is Basic stylesheet here, parsed before the Complex stylesheet by embedding an @import to Complex in each HTML file after the LINK to Basic. Basic stylesheet includes stuff that NN4.x can handle. Complex adds to that and overrides some of it.  */

DIV.stats { visibility: hidden; margin-top: 300px; } /* hide HitBox web stats ad */

DIV.real { display: none; } /*  text preceding browser warning, so Yahoo indexes and displays this content rather than the browser warning */

BODY {background: black;  margin: 55px 25px 20px 162px; padding: 0;}

BODY.index {margin: 95px 25px 20px 25px; }
.index DIV.content {padding: 0.1em 5% 15px 5% ; }

/* Must use Tantek Hack to get widths right in IE */
DIV.box { margin: 1.5em 0 20px 0; padding: 10px; border: 1px dashed black;}
#wide  {margin: 1.5em 15px 20px 15px; padding-left: 190px;
           background: url(Images/WorkLight.jpg) no-repeat;}
/* Tell NN4 to ignore the following styles. This gives correct path to bg image, relative to CSS file, for other browsers. */
/*/*/
#wide { background: url(../Images/WorkLight.jpg) no-repeat; }
/* This comment line stops the hiding from NN4. NN4 can see styles after this.  */
.index H1, .index H2, .index H3 {margin-bottom: 0; margin-top: 0em; }
.index H1.header { padding: 20px 0 10px 0; font-size: 22px;  letter-spacing: 1px;  font-weight: lighter; }

BODY { font-family: Verdana, Geneva, Helvetica, Arial, sans-serif;
	font-style: normal;  color: #AAA;  }

IMG { border: none; }
.center { margin: 1em auto 1.7em auto; display: block; text-align: center;}
DIV.logo { position: absolute; top: 0px; left: 4%;  z-index: 5; }
IMG.tight {    margin: 1em 0 .8em 0; }
IMG.tightrt {     margin: 1em 0 .8em auto; text-align: right; display: block; }
IMG.left { float: left; } /*  position: relative; */
IMG.right { float: left;  }
IMG.lefttight { float: left; }
IMG.righttight { float: left; }
BR.clear { clear: both; line-height: 0px; display: block;  position: relative;}

/* Tell NN4 to ignore the following styles. NN4 leaves gap between border and outerborder, so hide outerborder from NN4  */
/*/*/
DIV.outerborder {border: 1px solid red; padding: 0px; }
/* This comment line stops the hiding from NN4. NN4 can see styles after this.  */

DIV.border {border: 5px solid maroon;  } /*  position: relative;  */

/* that "jumping links guillotine bug" appears in IE6 (when hovering over links in content) if percentage % units are used for padding on DIV.content. It doesn't seem to appear if fixed units such as em or px are used. *Although the bug still happened on the home page (.index) even when I changed its DIV.content to fixed units. */
DIV.content {padding: 0.1em 45px 15px 50px; background: #222329 url(Images/bkgdBlueGreyTerrazzo.gif);}
/*  bg image has "wrong" path, relative to HTML file for benefit of NN4.  */

/* Tell NN4 to ignore the following styles. This gives correct path to bg image, relative to CSS file, for other browsers. */
/*/*/
DIV.content { background: #222329 url(../Images/bkgdBlueGreyTerrazzo.gif); }
/* This comment line stops the hiding from NN4. NN4 can see styles after this.  */

DIV.wrapper { width: 100%; position: relative; } /* needed so IE5.5 can correctly calculate widths of floated columns, such as on Clients page  */

/* Clients page, Services page, Disclaimer,  */
DIV.leftcol { float: left; width: 45%;  }
DIV.rightcol { margin-left: 60px;  text-align: right; }

H1.header {margin: 1px; padding: 15px 0 5px 0;  font-size: 30px; letter-spacing: 5px;
  background: #333;  }
H1, H2, H3, H4 {text-align: right; margin: 2.7em 0 0 0; }
.firsthead { margin-top: 1.3em; } /* first heading per page, or first after a project title */
H2 SPAN {font-size: 115%; }   /* for project titles */
H2 {font-weight: lighter; }

DIV.rulewrapIE5 { text-align: right; }   /* To make IE5.x place DIV.rule on right-hand side. */
DIV.rule {background: red; width: 200px; height: 1px; font-size: 1px; margin-left: auto; }

UL {list-style-type: circle;}

#navside { position: absolute; top: 118px; left: 0px; width: 166px;
     font: bold 16px Verdana,Geneva,sans-serif;   z-index: 10; }

#navside A {display: block; text-align: center;
   padding: 5px 10px; margin: 0 0 1px 0; border-width: 0;
   text-decoration: none; color: #B0B0B0; background: #333;
   border-left: 5px solid #623333;}
#navside A:hover, A#linkon:link, A#linkon:visited {
   color: #AA0000; background: #AAA;  border-left: 5px double white;}

/* For the rollover text info. on hovering over Navside links  */
#navside A SPAN {display: none; }
#navside A:hover SPAN {display: block;  position: absolute;
   top: 250px; left: 14px; width: 125px;  padding: 5px;
   color: #AAA; background: transparent;
   font-size: 14px; font-weight: normal; text-align: center; }

/* Popup menu of individual projects */
#popmenu { position: absolute; top: 125px; left: 169px; width: 210px;
     font: bold 14px Verdana,Geneva,sans-serif; background: black; padding: 3px;
     z-index: 15;  visibility: hidden;  }

#popmenu A {display: block; text-align: center; position: relative;
   padding: 4px 5px; margin: 0 0 1px 0; border-width: 0;
   text-decoration: none; color: #B0B0B0; background: #333;
   border-right: 2px solid #333; border-left: 2px solid #333;}
#popmenu A:hover {color: #AA0000; background: #AAA;
   border-right: 2px solid white; border-left: 2px solid white;}

/* For the rollover text info. on hovering over project links */
#popmenu A SPAN {display: none; }
#popmenu A:hover SPAN {display: block;  position: absolute;
   top: -10px; left: 220px; width: 195px;  padding: 10px;
   color: #AAA; background: black;
   font-size: 14px; font-weight: normal; text-align: center; }

/*

 DIV.content a:link {color: #AAA; background: black;  }
 DIV.content a:visited {color: #AAA;  }
 DIV.content a:hover {color: #AA0000; background: #AAA; }
 DIV.content a:active {color: #FF0; background: #AAA; }

  */

/* Definitions for quotes/testimonials */
BLOCKQUOTE   {margin-top: 2em;}
BLOCKQUOTE P {margin: 0.4em 0 0.4em 0;}  /* total 0.4em between paras */
P.said {color: #F5F5F5;}  /* Name of client who wrote quote */
BLOCKQUOTE.color, BLOCKQUOTE.color P {color: #F5F5F5;}
BLOCKQUOTE.color P.said {color: #AAA;}   /* Name of client who wrote quote */

/* Warn NN4 users (and other poor-CSS browsers) of bad browser.  Only in Basic stylesheet. */
DIV.warn, DIV.info { color: black; background: #FFEDA3; border: 2px solid red; padding: 20px; }
DIV.warn P, DIV.info P { color: black; background: #FFEDA3; }
DIV.warn H1, DIV.warn H2, DIV.info H1, DIV.info H2, DIV.info H3 { color: maroon; margin-top: 1em; }

