/*

  -[ninjagaijin.css]-
 
    Purpose  --  Defines styles for ninjagaijin.net
    Circa    --  31 July 2007
    Author   --  Daniel Carter [ninjagaijin.net, clownba0t.net]
 
    Credits  -- design & CSS heavily based on
                -> Chris Dowling @ rarr.net
                -> Michele Ong @ savethefaeries.net
  
                ~ Cheers, niggas! "You give good CSS." :D ~
 
    Structure --
      1) Generic Styles (Page Wide Styles)
      2) High Level Block Styles (Page Layout)
      3) Menu Styles
      4) Footer Styles
      5) Page specific styles
*/





/*

   -[ 1. Generic Styles ]-

     Set up default styles for basic HTML elements
       -> basic (body) page layout & colours
       -> generic font and link styles
       -> table/image/HTML element styles
*/

body
{

  background-color: #FFFFFF;
  margin-top: 20px;
  padding: 0px;
}


*
{

  font-family: Arial, Verdana, Times;
  font-size: 13px;
  color: #000000;
}


a
{

  text-decoration: underline;
  color: #7c7c7c;
}

a.littlelink
{

  text-decoration: underline;
  color #7c7c7c;
  font-size: 11px;
}

a:hover
{

  text-decoration: none;
}


img
{

  border: 0;
/* Fix Mozilla image_bottom+2px issue; */
  vertical-align: text-bottom;
}






/* 

   -[ 2. High Level Block Styles ]-

     Set up the styles for major page content areas
       -> body, header, menus, content, footer
*/


/* :body:
  
     This div is designed to encapsulate the entire page
     content. I decided to use a div to do this instead of
     centre-ing the page using styles + the body HTML element. 
     Not sure why, not even sure if it's 'good practice'.
     But it works, so I'll keep using it until I hit problems!
*/

div#body
{

  width: 750px;
  margin-left: auto;
  margin-right: auto;

  background-color: #FFFFFF;
}


/* :header:

     Errr yes...empty atm but might be useful for something
     later on. Currently just a container for the top banner.
*/

div#header
{

  padding: 0px;
}


/* :topmenu:

     Contains the top menu with items and a MOTD, perchance.
*/

div#topmenu
{

  line-height: 20px;
  vertical-align: middle;
  width: 746px;
  padding-top: 4px;
  padding-right: 4px;
  padding-bottom: 4px;
  border-bottom: 1px dashed #000000;
  border-bottom: 1px solid #b8b8b8;
}


/* :main:

     Contains the meat of the page, everything between the top
     menu and footer.
*/

div#main
{

  padding-top: 12px;
}


/* :footer:

     Contains the footer, usually used to store contact details,
     and name & version of the site.
*/

div#footer
{

  width: 750px;
  clear: both;
  margin: auto;
  border-top: 1px dashed #000000;
  border-top: 1px solid #b8b8b8;
  text-align: center;
}


/* Element styles that apply within high level blocks */

div#topmenu a
{

  font-weight: bolder;
  font-size: 13pt;
  margin-left: 8px;
  margin-right: 8px;
  text-decoration: none;
}






/* 

   -[ 3. Menu Styles ]-

     Set up the styles for the menus within the page
       -> top navigation menu
*/

/* :menuitems: & :menucomment:

     Provides containers for menu items as well as a
     MOTD on the right hand side of the menu bar.
*/

span.menuitems
{

  float: left;
  position: relative;
  vertical-align: bottom;
}




span.menucomment
{

  float: right;
  padding-right: 2px;
  font-style: italic;
  vertical-align: middle;
}






/* 

   -[ 4. Footer Styles ]-

     Set up the styles for the footer
*/

div.footer_sitename
{

  width: 246px;
  float: left;
  display: inline;
  padding: 2px 2px 2px 2px;
  text-align: left;
}

div.footer_contact
{

  width: 246px;
  float: left;
  display: inline;
  padding: 2px 2px 2px 2px;
  text-align: center;
}

div.footer_version
{

  width: 246px;
  float: left;
  display: inline;
  padding: 2px 2px 2px 2px;
  text-align: right;
}

div.footer_icons
{

}




/***********************************************************
 * 5) Page Specific Styles
 ***********************************************************/

table.dataform
{

}

table.dataform td
{

  padding-left: 0px;
}

/* JOURNAL STYLES */

/* Journal entry title & date styles - be careful with this, it's
 * generic at the moment. Might want to try div.blogentry span.title
 * and span.subtitle later if need spans without these styles*/

div.category_footer
{

  clear: both;
  margin: auto;
}

span.title
{

  font-size: 18px;
  color: #7c7c7c;
}

span.timeinfo
{

  font-size: 12px;
  color: #b8b8b8;
  font-weight: bolder;
}

span.category_left
{

  float: left;
  text-align: left;
}

span.category_right
{

  float: right;
  padding-top: 4px;
  text-align: right;
}

/* Journal entry text styles */
div.blogmenu_top
{

  padding-bottom: 8px;
}

div.blogmenu_bottom
{

  padding-bottom: 8px;
}

span.blogmenuiteml
{

  text-align: left;
}

span.blogmenuitemr
{

  float: right;
  text-align: right;
}
		  
div.blogentry
{

  padding-top: 2px;
  padding-bottom: 2px;
}

div.blogentry p
{

  line-height: 19px;
  text-align: justify;
}


/* For displaying centered images in blog entries. */

div.journal_image
{

  text-align: center;
}

/* Journal table - be careful with this, it's generic at the moment.
 * Might want to try div.blogentry table.indiv later if need tables
 * without this style
 */

table.indiv
{

  border: 1px solid #000000;
  border-collapse: collapse;
}

td
{

  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 6px;
  padding-right: 6px;

  vertical-align: top;
}

td.header
{

  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  border-bottom: 1px solid #000000;
  font-weight: bold;
  text-align: center;

  background-color: #CEE9FF; /*FFF1B8;*/
}

td.center
{

  text-align: center;

  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  text-align: center;
}





/* For displaying centered images in left aligned parent blocks (e.g. blogentries) */

div.image
{

  text-align: center;
}

/* COMMENT STYLES */

/* Comment entry container and name, webpage and date styles */

div.listcomments
{

}

div.itemcomment
{

  padding-left: 10px;
  border-left: 1px solid #7c7c7c; //b8b8b8; //7c7c7c;
  border-collapse: collapse;
}

span.commenttitle
{

  font-size: 16px;
  font-weight: bold;
  color: #7c7c7c;
}

span.commentuser
{

  font-size: 14px;
  font-weight: bold;
  color: #7c7c7c;
}

span.commentwebpage
{

  font-size: 13px;
  color: #7c7c7c;
}

span.commentdate
{

  font-size: 12px;
  color: #b8b8b8;//7c7c7c;
  font-weight: bold;
}

/* For generic text display in the 'content' section of the page. */

div.textarea
{

  padding-top: 4px;
  padding-bottom: 4px;
}

span.pageheader
{

  font-size: 14pt;
  text-align:center;
  margin: 0 auto;
}

span.errormessage
{

  color: #FF0000;
}

/* 'Sub' classes */

div.content p
{

  margin: 8px 8px 8px 8px;
}