/* -----------------------------------------------------------------------
   Discover Hertford Online 
   Style Sheet

   Created April 2008 
   by Steve Beeston 
	with modifications through 2009 
   Further modifications November and December 2011 for DHO2012 design review

   © 2008-11 Steve Beeston / hertsWEB Community Network

   -----------------------------------------------------------------------
*/
  



/* ------------
   BASIC STYLES
   ------------ */


   BODY {
      background-color: #DDD; 
      margin: 0px; 
      padding:0px;
      text-align: center; /* Hack to center the wrapper in IE5.x pc */
	}

   H1, H2, H3, H4, H5, P, OL, UL, TD {
      font-family: verdana, arial, "sans serif";
   }

   H1 {
      font-size: 12pt;
      color:#048;
   }

   H2 {
      font-size: 16pt;
      color: #048;
		padding: 0px;
		font-weight: normal;
		margin-top: 3px;
   }

   H3 {
      font-size: 12pt;
      color:#048;
      font-weight: normal;
   }
  
   H4 {
      font-size: 10pt;
      font-weight: bold;
      color: #048;
   }

   H5 {
      font-size: 12pt;
   }

   P {
      font-size: 10pt;
    	color:#333;
   }
    
   OL {
      font-size: 12pt;
   }

   UL {
      font-size: 10pt;
   }

   TD {
      font-size: 10pt;
		color:#333;
   } 


   /* Link appearance */ 
   A:link    {text-decoration: none; color: #048}
   A:visited {text-decoration: none; color: #048}
   A:hover   {text-decoration: underline; color: #048} 
   A:active  {text-decoration: underline; color: #048;}


/* ------
   LAYOUT
   ------ */


/* The WRAPPER encloses everything else */

	div#wrapper {
      width:980px; 
      margin:0px auto; 
      text-align:left; 
      background-color: #fff;
   }
	







/* ----------
   APPEARANCE
   ---------- */


   .small  {font-size: 8pt;}
	.dateline {font-size: 8pt;}

   .footer {
      font-family: arial, "sans serif"; 
      font-size: 8pt; 
      text-decoration: none;
   }

   .bottomnav p         {font-family: Arial; font-size: 10pt; text-decoration: none; color: #0000DD;}
   .bottomnav a:link    {font-family: Verdana; font-size: 8pt; text-decoration: none; color: #FFF;}
   .bottomnav a:visited {font-family: Verdana; font-size: 8pt; text-decoration: none; color: #FFF;}
   .bottomnav a:hover   {font-family: Verdana; font-size: 8pt; text-decoration: underline; color: #FFF;}
   .bottomnav a:active  {font-family: Verdana; font-size: 8pt; text-decoration: underline; color: #FFF;}
  
   .sidenav {background:#eee;}	
	.sidenav a {
      font: 8pt verdana; 
      text-decoration: none; 
      color: #000; 
      display:block; 
      padding: 3px 5px; 
      border-top: 2px solid #fff; 
      width:120px; 
      background:#EEE;
   }
   .sidenav a:hover {
      color: white; 
      background:#89ade8; 
      text-decoration: none;
   }		
	/* star html hack added 18/4/07 */
  * html body div#sidenav a {width:130px;}
	.sidenav a:active {
      color: white; 
      background:#789DE8; 
      text-decoration: none;
   }

	.sidenavhead {
      font: 8pt verdana;
      color: white; 
      background:#678bc6;
      padding: 2px 5px;
   }	

   /* The following controls the sidebar that holds the navigation */
	td.sidebar    {width: 130px; border: 0px; padding: 0px; margin: 0px; vertical-align: top;} 

		
	table.topbar {
      background-color: #678bc6; 
      width: 980px; 
      height: 25px; 
      margin: 0px; 
      padding: 0px; 
      border: 0px; 
      border-spacing: 0px;
   }

   tr.topbar {
      height: 20px; 
      margin: 0; 
      padding: 0;
   }
	
   td.topbar {
      font: 8pt verdana; 
      color: white;
   }
   
   td.topbar {
      margin: 0px; 
      padding-left: 5px; 
      height: 20px;
   }
	
	

/* ---------------
   THE CONTENT BOX 
   --------------- */
	
	/* The following defines the box containing the main content between the headings and footer 
      Note (Dec 2011):  This class handles the legacy pages from the DHO2010 layout, which was 800px wide.
                        The later class below (content1) handles the new 980px wide pages introduced with the DHO2012 layout.
  */
	table.content {
      width: 810px; 
      border: 0px; 
      padding: 2px 0px 0px 0px; 
      cellspacing: 0px; 
      margin: 0px;
      float: left;
   }
    
   /* This controls the TD cellthat holds the article content */	
   td.content {
      padding: 0px 15px 0px 7px; 
      margin: 0px; 
      border-right: 1px solid #ddd; 
      width: 670px;
   }
   
   /* DHO2012 layout for 980px wide pages */
   table.content1 {
      width: 980px; 
      border: 0px; 
      padding: 0px; 
      cellspacing: 0px; 
      margin: 0px; 
      padding-top: 2px;
   }
   
   /* This controls the TD cellthat holds the article content */	
   td.content1 {
      padding: 0px 15px 0px 7px;
   }
   
   

	
   table.storylinksbottom {
      background: #eee;
      border-left: white 0px solid;
      width: 640px;
      padding: 5px;
   }
	

/* --------------------------------
   Business database record display 
   -------------------------------- */
	/* SRB 7/10/11 */ 
	.businessDBentryDisplay {
      background: #c2d5ff; 
      border-radius: 10px;
      padding: 10px;
   }

			
	
/* ---------------------------------------------
   Navigation at the very top of the page header
   --------------------------------------------- */

   ul#topnav {
      margin: 0px;
      padding: 0px;
      list-style-type: none;
      clear: left;
      float: right;
      width: 175px; 
      border: 0px solid red;
      height: 25px;
   }
  
   ul#topnav {
      width: 220px;
   } /* SRB 15/12/11 -dho2010 */
		
   ul#topnav li {
      display: inline;
      height: 25px;
   }
		
	ul#topnav a {
      font-family: verdana;
      font-size: 11px;
      display: block;
      float: left;
		/* width: 33%; */
      padding: 6px 10px;
      margin: 0px;
		text-align: center;
		text-decoration: none;
		color: white;
   }	
		
   ul#topnav a:hover {
      color: #fff;
      background: #789cd7;
   }

	ul#topnav a:active {
      color: #fff;
      background: #326;
   }		
		

/* -------------------------------
   Widget bar (Right-hand sidebar)
   ------------------------------- */

   div#widgetbar {
      float:right; 
      width: 150px; 
      margin: 10px 10px 0px 0px;
   }
   
   div.widget {
      width: 150px; 
      margin-bottom: 30px;
      border: 1px dotted #ddd; 
      border-top: 2px solid #3459a3;
   }
   
   div.widget-head {
      background: #eee; 
      padding: 5px 5px 15px 5px; 
      color: #3459a3; 
      font-family: georgia;
   }
   
   div.widget-head a {
      color: #3459a3; 
      font-family: georgia;
   }
   
   div.widget-text {
      padding: 5px;
   }

   div.widget-text p {
      font-size: 11px; 
      margin: 0px; 
      color: #3459a3;
   }


/* ----------------------------
   Boxes used on listings pages
   ---------------------------- */

   div.thePremises {
      width: 200px; 
      border: 1px dotted #ccc;
      border-top: 2px solid #678bc6; 
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px;
      float: left; 
      padding: 0px; 
      margin-right: 15px; 
      margin-bottom: 15px;
   }
   
   div.thePremisesName {
      font: 17px georgia; 
      color: #048; 
      background: #eee;
      padding: 4px;
   }

   div.thePremisesDetail {
      font: 8pt verdana;
      padding: 4px;
   }
	 
	 
/* --------------------------
   Colours for shopping areas
	 -------------------------- */
	 
	 .shopnav .bircherley-green {background: #B33;}
	 .shopnav .fore-street {background: #393;}
	 .shopnav .maidenhead-street {background: #D82;}
	 .shopnav .railway-street {background: #BB2;}
	 .shopnav .standrew-street {background: #33B;}
	 .shopnav .parliament-square {background: #92B;}
	 .shopnav .market-street {background: #C27;}
	 .shopnav .elsewhere {background: #3BB;}
	 
	 	 	 	 	 	 	 
