/* Cascading Style Sheet for the Groomswell.com page              */
/* Version 2.7  19 January 2008                                       */
/* Copyright (c) 2005 - 2008 Groomswell LLP - All Rights Reserved */


/* The main body - define the overall background                  */

body      { font-family:      Verdana, Arial, Helvetica, sans-serif;
            color:            black;
            background-image: none;
            background-color: #ffffb0
          }
          
/* The next two turn off the blue border link images for IE       */
/* Firefox doesn't need them, only needs a:link without the img   */
a:link img,
a:visited img { border-style: none }


/******************************************************************/
/* Introduction section - the top of the page, full width         */

div.intro { font-family:      Verdana, Arial, Helvetica, sans-serif;
            color:            black;
            background-image: none;
            background-color: #ffffb0
          }

h1.intro  { font-family: Verdana, Arial, Helvetica, sans-serif;
            font-size:   300%;
            text-align:  center
          }
h2.intro  { font-family: Verdana, Arial, Helvetica, sans-serif;
            font-size:   150%;
            text-align:  center
          }
h3.intro  { font-family: Verdana, Arial, Helvetica, sans-serif;
            font-size:   120%;
            text-align:  center
          }
          
p.intro   { text-align: center }
          

/******************************************************************/
/* Copyright section - the bottom of the page, full width         */
div.cpyrgt     { font-family:      Verdana, Arial, Helvetica, sans-serif;
                 clear:            both;                 
                 color:            black;
                 background-image: none;
                 background-color: #ffffb0
               }

address.cpyrgt { font-family: Verdana, Arial, Helvetica, sans-serif;
                 font-size:   x-small;
                 border-top:  solid;
                 margin-top:  1em;
                 padding-top: 1em;
                 text-align:  center
               }


/******************************************************************/
/* Navigation bar section - the left of the page                  */

div.navbar     { font-family:      Verdana, Arial, Helvetica, sans-serif;
                 color:            black;
                 background-image: none;
                 background-color: #ffffb0;
                 width:            20%;
                 float:            left
               }

/* The next two don't work on IE for images, they do on Firefox   */
/* For IE we need images specified separately - see top of file   */
a.navbar:link     { color:            #ffffb0;
                    background-color: #ffffb0;
                    text-decoration:  none }
a.navbar:hover    { color:            #ffffb0;
                    background-color: #ffffb0;
                    text-decoration:  none }

ul.navbar a       { color:            blue; 
                    background-color: white; 
                    text-decoration:  none }
ul.navbar a:hover { color: blue; background-color: yellow }


ul.navbar      { list-style-type: none;
                 padding:         0;
                 margin:          0;
                 position:        static;
                 top:             3em;
                 left:            1em;
                 width:           9em
               }
         
ul.navbar li   { background:   white;
                 color:        blue;
                 margin:       0.5em 0;
                 padding:      0.3em;
                 border-right: 1em solid black
               }




/******************************************************************/
/* Main body section - the right of the page                      */

div.main       { font-family:      Verdana, Arial, Helvetica, sans-serif;
                 color:            black;
                 background-image: none;
                 background-color: #ffffb0;
                 width:            78%;
                 padding-left:     2%;
                 float:            right
               }

p.main         { text-align: center }

td.main        { padding-left: 2em;
                 text-align: center
               }

a.main:link     { color: blue; background-color: #ffffb0; text-decoration: none }
a.main:hover    { color: blue; background-color: yellow;  text-decoration: none }
a.main:visited  { color: blue; background-color: #ffffb0; text-decoration: none }





/******************************************************************/
/* Change detection section - at the bottom of the page          */
/* Will move into the Navbar later */

div.changedet { font-family: Verdana, Arial, Helvetica, sans-serif;
                text-align:  center;
                clear:       both;
                font-size:   80%
              }
            
p.changedet   { font-family: Verdana, Arial, Helvetica, sans-serif;
                text-align:  center;
                font-size:   80%;
/*              border-top:  solid; */
                margin-top:  1em;
                padding-top: 1em
              }




/******************************************************************/
/* Tabbed selection box section - embedded within Main            */
/*    **** NOT CSS VALIDATED - BUT ALSO NOT USED YET **** */

/* Container div for the tabs and the overlaid sections giving a  */
/* fixed outer border and claiming the screen space               */
div.tabholder { border-style: solid;
                border-width: thin;
                border-color: black;
                padding: 0.5em;
                margin: 0.5em 0.1em
              }


/* Container div for the tabs and the overlaid sections           */
div.tabs      { min-height  : 7em;		/* Don't fix the height so it can grow if :target doesn't work in this browser */
		position    : relative;		/* To tabholder   */
		line-height : 100%;		/* Keep simple    */
		z-index     : 0}		/* Put it at the front */

/* For divs within the tabs div (i.e. the tabs themselves)        */
div.tabs > div { display : inline }		/* All tab buttons on one line */

		div.tabs > div > a {
		  color: black;			/* Looks more like a button than a link */
		  background: #CCC;		/* Active tabs are light gray */
		  padding: 0.2em;		/* Some breathing space */
		  border: 0.1em outset #BBB;	/* Make it look like a button */
		  border-bottom: 0.1em solid #CCC} /* Visually connect tab and tab body */

		div.tabs > div:not(:target) > a {
		  border-bottom: none;		/* Make the bottom border disappear */
		  background: #999}		/* Inactive tabs are dark gray */

		div.tabs > div:target > a,	/* Apply to the targeted item or... */
		:target #default > a {		/* ... to the default item */
		  border-bottom: 0.1em solid #CCC; /* Visually connect tab and tab body */
		  background: #CCC}		/* Active tab is light gray */

		div.tabs > div > div {
		  background: #CCC;		/* Light gray */
		  z-index: -2;			/* Behind, because the borders overlap */
		  left: 0; top: 1.3em;		/* The top needs some calculation... */
		  bottom: 0; right: 0;		/* Other sides flush with containing block */
		  overflow: auto;		/* Scroll bar if needed */
		  padding: 0.3em;		/* Looks better */
		  border: 0.1em outset #BBB}	/* 3D look */

		div.tabs > div:not(:target) > div { /* Protect CSS1 & CSS2 browsers */
		  position: absolute }		/* All these DIVs overlap */

		div.tabs > div:target > div, :target #default > div {
		  position: absolute;		/* All these DIVs overlap */
		  z-index: -1}			/* Raise it above the others */