/* 
   PULPchat.com 2005 site stylesheet, Copyright Design215 Inc. 
   v02.21.05 
   
   Notes:
   1. Normally, floated elements are supposed to extend past their containers.
      this is "fixed" by using a "clearing" div
   2. DIV centering is done with "margin-left:auto; margin-right:auto;" or 
      shorthand: "margin:0 auto 0 auto;"
   3. There are no horizontal scrollbars in IE5 Mac. This is due to NOT using
      width:100%; anywhere. For example, the #header DIV background fills the 
      width of the browser window as long as no width is defined.
   4. In IE6, in order for a div to be less than 10px in height, the following
      must be used:  line-height:1px; font-size:1px;
      
*/

body {
  font-family:arial,helvetica,sans-serif; font-size:12px; color:#000000;
  text-align:center; margin:0; padding:0;
  background:#000066;
}

/* header and navigation */
#xheader {
  position:relative; height:94px; 
  text-align:center; margin:0; padding:0;
  background:transparent url(images/header.gif) repeat-x;
}
  #xheader div.xnavbar {
    width:780px; 
    text-align:left; margin:0 auto 0 auto; padding:15px 0 0 0;
    font-family:arial,helvetica,sans-serif; font-size:12px; color:#a78300;
  }
  #xheader p {
    display:inline;
    text-align:left;
  }
  #xheader ul {display:none;}
  #xheader a:link,
  #xheader a:visited {text-decoration:none; font-weight:bold; color:#000000;}  
  #xheader a:hover {text-decoration:none; font-weight:bold; color:#0000ff;}
  
    /* right-aligned options and navigation */
    div.rightnav {
      width:120px;
      text-align:right; padding:0; margin:-17px 0 0 660px;
    }

/* content container - background between yellow bars */
#xcontainer {
  position:relative;
  text-align:center; margin:0; padding:6px 0 0 0;
  background:#ffffff url(images/pattern2005b.gif);
}

/* content box titlebar */
#xtitlebar {
  position:relative; width:780px; height:26px; 
  text-align:left; margin:0 auto 0 auto;
  background:transparent url(images/titlebar.gif) no-repeat;
}
  #xtitlebar h1 {
    float:left; margin:0; padding:5px 0 0 12px;
    font-family:arial,helvetica,sans-serif; font-size:14px; font-weight:bold; color:#000000;
  }
  #xtitlebar p.xdate {
    float:right; margin:0; padding:8px 10px 0 0;
    font-family:arial,helvetica,sans-serif; font-size:10px; color:#000000;
  }

/* content box */
#xcontent {
  position:relative; width:780px;
  font-family:verdana,helvetica,sans-serif; font-size:10px; color:#222222; line-height:130%;
  text-align:left; margin:0 auto 0 auto;
  background:transparent url(images/content_bg.gif) repeat-y;
}
  #xcontent pre {font-size:12px; margin:0 0 0 12px;}
  #xcontent form {margin:0; padding:0; display:inline;}
  #xcontent label.noshow {display:none;}
  #xcontent acronym {border-bottom:dashed 1px #000000; cursor:help; font-weight:bold; color:#0000aa;}
  #xcontent p {
    font-family:verdana,helvetica,sans-serif; font-size:10px; color:#222222; line-height:150%;
    margin:0 15px 0 12px; padding:0;
  }
  #xcontent p.xpic {
    margin:0 3px 0 1px; padding:0;
    border-bottom:solid 1px #444444;
  }
  /* completed form messages */
  #xcontent p.xmsg {
    text-align:center; padding:60px 0 160px 0;
  }
  /* yellow alert messages */
  #xcontent p.xmsg2 {
    width:90%; text-align:center; padding:4px 8px 4px 8px; border:solid 1px #000000;
    font-family:arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#000000;
    background:#ffe347;  
  }
  #xcontent a:link,
  #xcontent a:visited {text-decoration:none; font-weight:bold; color:#5400bd;}
  #xcontent a:hover {text-decoration:underline; font-weight:bold; color:#7200ff;}

  #xcontent a.a1 {padding-left:14px; background:transparent url(images/bt1.gif) no-repeat;} 

  /* tables within content */
  div.xtable {
    font-family:verdana,helvetica,sans-serif; font-size:10px; color:#000000; line-height:130%;
    margin:4px 0 0 0; padding:0 0 4px 12px;
  }
    div.xtable h1 {
      font-family:arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#000000;
      margin:0; padding:0 0 4px 0; 
    }
    div.xtable table {background:#555555;}
    div.xtable td {
      font-family:verdana,helvetica,sans-serif; font-size:10px; color:#000000; line-height:130%;
      background:#eeeeee;
    }
    div.xtable td.c1 {font-family:arial,helvetica,sans-serif; font-size:12px; color:#ffbf11; background:#000000;}
    div.xtable td.c2 {font-family:arial,helvetica,sans-serif; font-size:12px; color:#000000; background:#ffffff;}
    div.xtable td.c3 {font-family:arial,helvetica,sans-serif; font-size:12px; color:#000000; background:#ffbf11;}
    div.xtable td.c5 {font-family:arial,helvetica,sans-serif; font-size:12px; color:#000000; background:#ffe347;}

  /* forms boxes */
  div.xbox1 {
    width:90%; padding:4px 8px 4px 8px; border:solid 1px #000000;
    background:#eeeeee;
  }
    
  /* right column picture box */
  div.xpicbox {
    font-family:verdana,helvetica,sans-serif; font-size:10px; color:#000000; line-height:120%;
    margin:8px 0 0 0; padding:4px 0 4px 4px;
    background:#eeeeee url(images/gray_bg3.gif) no-repeat left bottom;
    border-bottom:solid 1px #aaaaaa; border-top:solid 1px #aaaaaa;
  }
    div.xpicbox img {float:right; margin:0 4px 0 4px; border:1px solid #444444;}
    div.xpicbox h1 {
      margin:0 0 4px 0; padding:0;
      font-family:arial,helvetica,sans-serif; font-size:14px; font-weight:bold; color:#000000;
    }
    div.xpicbox h2 {
      margin:0 0 4px 0; padding:0;
      font-family:arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#000000;
      background:transparent;
    }

  /* separators to clear column floats */
  div.xclear {clear:right; height:1px; line-height:1px; margin:0; padding:0;}
  div.xclearline {
    clear:both; height:1px; line-height:1px;
    margin:0 3px 0 1px; padding:0;
  }
  div.xmedline {
    clear:both; height:1px; line-height:1px;
    margin:0 3px 0 1px;
    border-bottom:solid 1px #aaaaaa;
  }

  /* accent line */
  div.xline {
    height:1px; line-height:1px;
    margin:3px; padding:0 0 3px 0;
    border-top:solid 1px #aaaaaa;
  }

  /* left column lists */
  ul.alist {margin:4px 0 0 12px; padding:0; list-style:none;}
  ul.alist li {
    margin-bottom:6px; padding:0 0 0 16px;  
    background:transparent url(images/bt5.gif) no-repeat;
  }
  /* right column lists */
  ul.xlist {margin:0; padding:0; list-style:none;}
  ul.xlist li {
    margin-bottom:2px; padding:0 0 0 16px;  
    background:transparent url(images/bt5.gif) no-repeat;
  }
  /* faq lists */
  ul.flist {margin:0; margin-left:12px; padding:0; list-style:none;}
  ul.flist li {
    margin-bottom:4px; padding:0 0 0 16px;  
    background:transparent url(images/bt1.gif) no-repeat;
  }
  
  /* columns, set 1: 320/430 */
  #xcol1 {float:left; width:320px; margin:0; padding:0;}
  #xcol2 {width:430px; margin:0 0 0 330px; padding:0;}

  /* columns, set 2: 500/250 */
  #xcol3 {float:left; width:500px; margin:0; padding:0;}
  #xcol4 {width:250px; margin:0 0 0 510px; padding:0;}

  /* columns, set 3: 430/320 */
  #xcol5 {float:left; width:430px; margin:0; padding:0;}
  #xcol6 {width:320px; margin:0 0 0 440px; padding:0;}

    /* left column styles, xcol1 and xcol3 */
    #xcol1 p,
    #xcol3 p {
      font-family:verdana,helvetica,sans-serif; font-size:10px; color:#222222; line-height:150%;
      margin:0; padding:4px 10px 0 12px;
    }
    #xcol1 h2,
    #xcol3 h2 {
      margin:0 0 0 12px; padding:2px 0 2px 22px;
      font-family:arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#0000aa;
      background:transparent url(images/bubble.gif) no-repeat;
    }
    #xcol1 h2.xbar,
    #xcol3 h2.xbar {
      margin:0 0 0 12px; padding:2px 0 2px 26px;
      font-family:arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#0000aa;
      background:#eeeeee url(images/bubble.gif) no-repeat 4px;
      border-bottom:solid 1px #aaaaaa; border-top:solid 1px #aaaaaa;
    }
    #xcol1 h3,
    #xcol3 h3 {
      margin:0 0 0 12px; padding:2px 0 2px 0;
      font-family:arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#0000aa;
    }
    #xcol1 h4,
    #xcol3 h4 {
      text-align:right;
      margin:-18px 0 0 12px; padding:2px 4px 2px 0; 
      font-family:verdana,helvetica,sans-serif; font-size:10px; font-weight:bold; color:#000000;
    }

    /* right column styles, xcol2 and xcol4 */
    #xcol2 p,
    #xcol4 p {
      font-family:verdana,helvetica,sans-serif; font-size:10px; color:#000000; line-height:130%;
      margin:0; padding:4px 0 0 0;
    }
    #xcol2 p.p2,
    #xcol4 p.p2 {
      font-family:verdana,helvetica,sans-serif; font-size:10px; color:#000000; line-height:150%;
      margin:0; padding:0;
    }
    #xcol2 h2,
    #xcol4 h2 {
      margin:0; padding:2px 0 2px 22px;
      font-family:arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#0000aa;
      background:transparent url(images/bubble.gif) no-repeat;
    }

/* bottom of content box */
#xendcap {
  position:relative; width:780px; height:12px;
  clear:both; margin:0 auto 0 auto;
  background:transparent url(images/content_end.gif) no-repeat;
}
  
/* footer div */
#xfooter {
  position:relative;
  margin:0; padding:0; text-align:center;
  background:#000066 url(images/footer.gif) repeat-x;
}
  #xfooter p {
    position:relative; width:760px;
    text-align:left; margin:0 auto 0 auto; padding:8px 0 0 0;
    font-family:arial,helvetica,sans-serif; font-size:10px; color:#a78300;
  }
  #xfooter p.xnav {
    position:relative; width:780px;
    text-align:center; margin:0 auto 0 auto; padding:10px 0 0 0;
    font-family:arial,helvetica,sans-serif; font-size:10px; color:#ffffff;
  }
  
  #xfooter a:link,
  #xfooter a:visited {text-decoration:none; color:#ffbf11;}
  #xfooter a:hover {text-decoration:underline; color:#ffe347;}
  
  #xfooter a.w3 {font-family:verdana,helvetica,sans-serif; font-size:12px; font-weight:bold;}
  #xfooter a.w3:link,
  #xfooter a.w3:visited {text-decoration:none; color:#0000aa;}
  #xfooter a.w3:hover {text-decoration:none; color:#0000ff;}

/* extra styles */
.xcode {
  font-family:courier new,courier,monospace; font-size:12px; color:#000000;
  background:#ffffcc; padding:0 2px 0 2px;
}
.xmoney {
  font-family:courier new,courier,monospace; font-size:12px; color:#000000;
  padding:0 2px 0 2px;
}

.xdialog {
  width:450px; display:block;
  font-family:courier new,courier,monospace; font-size:12px; color:#000000;
  margin:0; padding:1px 4px 2px 24px; border:solid 1px #000000;
  background:#ffffff url(images/bubble.gif) no-repeat 2px;
}
.xquot1 {
  width:400px; display:block;
  font-family:verdana,helvetica,sans-serif; font-size:12px;
  margin:8px 0 0 12px; padding:10px 32px 2px 28px;
  background:transparent url(images/quot1.gif) no-repeat;
}
.xquot2 {
  width:400px; display:block;
  margin:0 0 0 12px; padding:6px 32px 2px 28px;
}
.c1h1 {font-family:arial,helvetica,sans-serif; font-size:18px; font-weight:bold;}
.c2h3 {
  display:block; margin:0; padding:2px 0 2px 0;
  font-family:arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#000000;
}
.c2s2 {font-family:arial,helvetica,sans-serif; font-size:10px;}
.c3h1 {font-family:arial,helvetica,sans-serif; font-size:14px; font-weight:bold;}
.xred {font-family:arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#de0000;}
.xf0 {font-size:10px;}
.xf1 {font-size:12px;}
.xf2 {font-size:18px;}
.xf3 {font-size:24px;}
/* code examples */
.xtextarea {
  border:1px solid #aaaaaa; font-family:courier new,courier,monospace; font-size:12px; width:100%;
  background:#ffffcc;
}
/* user form comments, etc */
.xtextarea2 {
  border:1px solid #aaaaaa; font-family:courier new,courier,monospace; font-size:12px;
  padding:0 0 0 4px;
}
.boxBlur {border:1px solid #aaaaaa; color:#000000; background-color:#ffffff; padding:0 0 0 4px; margin:2px;}
.boxFocus {border:1px solid #aaaaaa; color:#000000; background-color:#ffffcc; padding:0 0 0 4px; margin:2px;}

/* Design215 Dropmenu */
td.tt1 {font-family:verdana,helvetica,sans-serif; font-size:10px; color:#000099; background:#eeeeee;}
td.tt2 {font-family:arial,helvetica,sans-serif; font-size:12px; color:#000000; background:#ffffff;}
td.tt3 {font-family:verdana,helvetica,sans-serif; font-size:10px; font-weight:bold; color:#000000; cursor:pointer;}
td.ttd {font-family:verdana,helvetica,sans-serif; font-size:10px; font-weight:bold; color:#666666;}
.ttbg1 {background:#000000;}
.ttbg2 {background:#000000;}
.ttbg3 {background:#000000;}
a.tt3:link    {text-decoration:none; font-weight:bold; color:#000000;}
a.tt3:visited {text-decoration:none; font-weight:bold; color:#000000;}
a.tt3:hover   {text-decoration:none; font-weight:bold; color:#000000;}
