/*
Created by Charl van Jaarsveldt.
*/

/** Basic overrides */
  body
  {
    /*background-color: #000000;
    color: #FFFFFF;*/
    background-image: url('images/background.gif');
  }
  /* Customized paragraph class to add a little bit padding to the
     left and right. */
  p
  {
    color: #000000;
    font-size: medium;
    text-align: justify;
    padding-left: 4px;
    padding-right: 4px;
    margin-top: 1px;
    margin-bottom: 1em;
    line-height: 100%;
  }
  h1,h2,h3,h4
  {
    margin-top: 10px;
    margin-bottom: 5px;
    color: #005555;
  }
  ul
  {
    margin-top: 2px;
    font-size: medium;
    line-height: 100%;
  }
  ol
  {
    margin-top: 2px;
    font-size: medium;
    line-height: 100%;
  }
  dl
  {
    font-size: medium;
    line-height: 100%;
  }
  li
  {
    margin-bottom: 4px;
  }
  a
  {
    text-decoration: none;
    color: blue;

  }
  blockquote
  {
    font-style: italic;
    line-height: 100%;
  }
  
/* Container classes */
  /* Main container - create the rest in this */
  div.container
    {
    width:100%;
    margin:0px;
    border:1px solid gray;
    background-color: #D3D3D3;
    line-height:150%;
    }
    
  /* header and footer boxes */
  div.header,div.footer
    {
    padding:0.5em;
    padding-bottom: 0px;
    color:black;
    background-color: #D3D3D3;
    clear:both;
    text-align: center;
	  font-size: smaller;
    }
  div.header
  {
    border-bottom: 1px solid gray;
  }
  div.footer
  {
    line-height: 100%;
    border-top: 1px solid gray;
    border-bottom: 1px solid gray;
  }
  img.headerpics
    {
    padding-left: 1.5em;
  	padding-right: 1.5em;
  	background-color: black;
  	margin-left: 10;
  	margin-right: 10;
  	}

  /* Creates a left colomn */
  div.left
    {
    float:left;
    width:180px;
    margin:0;
    padding:5px;
    height:100%;
    background-color: #D3D3D3;
    }
    
  /*Creates a center content/client area */
  div.content
    {
    height: 100%;
    margin: 0;
    padding: 5px;
    margin-left: 185px;
    /*margin-right: 175px;*/  /*Uncomment this line if you want to use div.right*/
    background-color: ##D3D3D3;
    }
    
  /* Creates a right colomn */
  div.right
    {
    float:right;
    width:170px;
    margin:0;
    padding: 5px;
    height:100%;
    background-color: #D3D3D3;
    }
    
  /* Creates a bordered section or frame. Use with sectHx (x = 1,2,3,4) to
     get the desired effect for a caption. */
  div.section
  {
    /*border: 2px solid gray;*/
    /*border-top: 2px ridge black;*/
    /*border-left: 2px ridge black;*/
    margin-top: 10px;
	  margin-bottom: 10px;
    background-color: white;
    border: 2px solid gray;
  }
  div.sectionbody
  {
    background-color: white;
    border: 2px solid gray;
  }
    
  table.image
  {
    border: 2px solid gray;
    margin: 10px;
    padding: 10px;
    width: 300px;
    line-height: 100%
/*    text-align: center;*/
  }
  td.imagecaption
  {
    font-size: small;
    border-top: 2px solid gray;
  }
  div.image
    {
    border: 2px solid gray;
    margin: 10px;
    padding: 10px;
    text-align: center;
    }
  p.imagecaption
    {
    font-size: small;
    border-top: 2px solid gray;
    }

  div.secttopleftcorner
  {
    float: left;
    width: 20px;
    background-image: url('images/top_left_corner.gif');
    background-position: center;
  }
  img.secttopleftcorner
  {
    float: left;
    width: 20px;
    background-image: url('images/top_left_corner.gif');
    background-position: center;
  }
  div.secttoprightcorner
  {
    float: right;
    width: 20px;
    background-image: url('images/top_right_corner.gif');
    background-position: center;
  }
  div.sectbottomleftcorner
  {
    float: left;
    width: 20px;
    background-image: url('images/bottom_left_corner.gif');
    background-position: center;
  }
  div.sectbottomrightcorner
  {
    float: right;
    width: 20px;
    background-image: url('images/bottom_right_corner.gif');
    background-position: center;
  }
  div.secttopbar
  {
    background-image: url('images/top_bar.gif');
    background-position: center;
    background-repeat: repeat;
  }
  div.sectbottombar
  {
    background-image: url('images/bottom_bar.gif');
    background-position: center;
    background-repeat: repeat;
  }
  

  /* Special h1 class for the header box div.header */
  h1.header
    {
    color: black;
    font-size: larger;
    line-height: 100%;
    padding:0;
    margin:0;
    }

  /* Header classes for div.section. These headers has a different
     background to give the effect of a caption, or title for the section
     frame. */
  h1.sectH1, h2.sectH2, h3.sectH3, h4.sectH4
    {
    padding: 2;
    margin: 0;
    /*border: 1px solid black;*/
  	background-color: #005555;
    /*background-image: url('images/top_bar.gif');*/
  	/*background-repeat: repeat;*/
  	/*background-position: center;*/
    color: white;
    }
  div.sectheader
  {
    padding: 2;
    margin: 0;
    background-color: white;
    color: white;
    font-weight: bold;
    font-size: larger;
    width: 100%;
    height: 26px;
  }

  h5.hmenu
  {
    /*background-color: gray;*/
    border-bottom: 1px solid black;
    margin: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
  }
  table.tmenu
  {
    margin-bottom: 5px;
  }
  th.thmenu
  {
    font-size: smaller;
    font-weight: bold;
    padding-left: 1px;
    border-bottom: 1px solid gray;
    text-align: left;
  }
  td.tdmenu
  {
    width: 100%;
    text-align: left;
  }
  td.tdmenu:hover
  {
    /*background-color: #D3D3D3;*/
  }
    
  th.thtop
    {
    padding: 2;
    margin: 0;
    background-color: #8470FF;
    color: white;
	}
	td
	{
    font-size: medium;
    text-align: justify;
    padding-left: 2px;
    padding-right: 2px;
    line-height: 100%;
  }
    
  /* Creates a horizontal navigation bar. This uses the file topnav-bg.gif
     to create a fancy background effect for the bar. Use together with
     a.navbarentry to create links in this bar. */
  .navbar
    {
    text-align: center;
    /*height: 22px;*/
    /*background-image: url('images/topnav-bg.gif');*/
    /*background-image: url(images/bluefadevert.jpg);*/
    /*background-color: #ccccff;
    background-position: bottom;
    background-repeat: repeat;
    border: 1px ridge gray;*/
    padding-bottom: 0px;
    margin-bottom: 0px;
    border-top: 1px solid black;
    width:100%;
    text-align: left;
    }
  /* Creates a link for the div.navbar */
  a.navbarentry
    {
    color: #005555;
    font-weight: bold;
    font-size: small;
    text-decoration: none;
    padding:2px;
    margin-left: 2px;
    margin-right: 2px;
    }
    
  /* Creates a navigation type link. This is different from a normal link
     in that it doesn't have a special decoration  or anything. */
  a.nav, a.subnav
  {
    color: #000080;
    font-weight: bold;
    width: 100%;
    margin:1px;
    text-decoration: none;
    font-size: small;
    display: block;
    cursor: default;
  }
  a.subnav
  {
	  margin-left: 5px;
	}
  a.nav:hover, a.subnav:hover
  {
    text-decoration: underline;
    background-color: #D3D3D3;
  }
  /* Paragraph class specifically for the left and right column sections.
     It is essentially the same as the normal paragraph except that the 
     font is smaller. */
  p.sidesection
    {
    font-size: small;
    margin-top: 2px;
    padding-left: 2px;
    padding-right: 2px;
    line-height: 100%;
    color: #000000;
    text-align: left;
    }
    
  /* Special class for a news headline. Use with p.sidesection 
     for news summary. */
  .newsheadline
  {
    margin-bottom: 0px;
    /*font-size: small;*/
    font-weight: bold;
    line-height: normal;
  }

  /*  Same as .newsheadline, except that this is a link. */
  a.newsheadline
  {
    margin: 0px;
    font-size: normal;
    font-weight: bold;
    line-height: normal;
  }
  p.newsshorttext
  {
    margin-top: 0px;
    margin-left: 10px;
    margin-right: 10px;
    /*font-style: italic;*/
  }
  p.newstext
  {
    margin-top: 0px;
    padding-left: 10px;
  }

  /* Styles for the table used for theme sub projects */
  table.projects
  {
    border: 1px solid gray;
  }
  
  th.thprojects
  {
    padding: 4px;
    background-color: #006699;
    color: white;
    font-size: medium;
    font-weight: bold;
  }
  td.tdseparator
  {
    border-bottom: 1px solid gray;
  }
  tr.trprojrow
  {
    border-bottom: 1px solid gray;
  }
  td.tdprojname
  {
    padding: 2px;
    background-color: #98AAB1;
    white-space: nowrap;
  }
  td.tdprojheadings
  {
    background-color: #98AAB1;
  }
  td.tdprojtext
  {
    background-color: #EFEFEF;
  }
  img.leftlogo
  {
    float:left;
    /*background-color: black;*/
    /*background-image: url('images/logo1.jpg');*/
    width: 130px;
  }
  img.centerlogo
  {
    background-color: black;
    /*background-image: url('images/logo1.jpg');*/
    width: 70%;
    height: 100px;
  }
  img.rightlogo
  {
    float: right;
    background-color: black;
    /*background-image: url('images/logo1.jpg');*/
    width: 130px;
  }