/*   stylesheet for Roy Boyds design website                            */
/*   changed font sizes to be % rather than px to enable resizing       */
/*
-----------------------------------------------------------------------------
Global 
----------------------------------------------------------------------------- */

	h1,h2,h3,h4,h5,h6
{
  font-family: verdana, arial, sans-serif;
 }
 
 a {
      text-decoration: none;
   }
a:link    {color: #000}    /* black  */
a:visited {color: #444444} /* dark grey */
a:active  {color: #ff0000} /* red */
a:hover   {color: #ff0000} /* red */
/*
-----------------------------------------------------------------------------
Layout Structure
----------------------------------------------------------------------------- */



		body
		{
			margin:         0;
			padding:        0;
			font-size:      90%;
			font-family :   "Times New Roman", "Garamond", serif;
			background:     #fff  ;
		}
		

	  #verytop
		{
			/*height:           12px;*/  /*do not define hight so it is flexable with resizing*/
			margin:           0;
      padding:          .1em;
			background-color: #ff0000;  /*red */
      color:            #ffffff;  /* white text */ 
	    text-align:       right;
      font-size:        90%;
	    font-family:      verdana, arial, helvetica, sans-serif;

		}

		#verytop ul
		{
		float:           left;
		text-align:      left;  
		margin:          0 0 0 10px;
		padding:         0;
		list-style-type: none;
		}
		
		#verytop li
	  {
		display:         inline; 
		padding:         0 10px;
		margin:          0;
	  }
		
		#topnav li a
	  {
		text-decoration: none;
		color:           #fff;
	  }
		
		
		#header
		{
			height:           60px;
			margin-bottom:    1em;
			border-bottom:    1px solid #999;
			background-color: #ff0000;  /*red */
      color:            #ffffff;  /* white text */
		}

		
		/* using an image to replace text in an h2  for the wee 
                   image, putting h1 and h2 in a span
                   and floating the h1 and h2 left and right   */
              #header h1 
               {    
                width:        60%;     
                height:       50px;  
                padding-left:  0.9em;  /* 0.9em to line up header and subheader and picture */
                float:        left;
              } 


              #header h2 
              {     
                background:     transparent url(RoyBoydLogo_small.jpg) no-repeat top right ;     
                margin-top:     .5em;  
                margin-bottom:  1px;
                margin-right:   .5em;  
                padding:        1px;
                width:          7%;     
                height:         50px;     
                float:          right;
               }

              #header h2 span {
                display:        none;  
              } 


		
		#gutter
		{
			float:  left;
			width:  3%;
			height: 1px;
		}
		
		#col1
		{
			float:         left;
			width:         44%;
			margin-bottom: 1em;
			padding-right: 3%;
		}
		
		#col2
		{
			float:         left;
			width:         38%;
			margin-left:   3%;
			margin-bottom: 1em;
			text-align:    center;
			padding-right: 3%;
		}
		
		
		
		#footer
		{
			clear:            both;
			height:           30px;
			border-top:       1px solid #999;
			padding:          .5em;
			text-align:       right;
		  background-color: #ff0000;  /*red */
      color:            #ffffff;  /* white text */
			font-family:      verdana, arial, sans-serif;
		}
		/*
-------------------------------------------------------------------------------
Other modifications 
----------------------------------------------------------------------------- */

		h1
		{
			margin:   0;
			padding:  .3em;
		}
		
		h2 { margin-top: 0; }
		/*  for footer */
#footer a:link {
text-decoration: none;
color:           #000;    /* black  */
}
#footer a:visited {
text-decoration: none;
color:           #444444; /* dark grey */
}
#footer a:hover {
text-decoration: underline; 
color:           #ffffff; /* white */
}

#navlist
{
list-style:     none;
font-family:    verdana, arial, sans-serif;
}


#rightlist
{
list-style:     none;
font-family:    verdana, arial, sans-serif;

}


#col1 li.leftstar
{
list-style:             none; 
padding-left:           1em;
padding-right:          1em;
padding-top:            1em;
padding-bottom:         1em;
background-image:       url(NewRBstar.gif);
background-repeat:      no-repeat;
background-position:    0 .5em;
color:                  #000;
font-size:              140%; 
/*font-size:              20px;   */
text-align:             left;  
}

#col1 li a 
{
            text-decoration:    none;
            margin-left:        1em;  /*added */
 }


/*to try and limit width of pargraph */
/*#col1 p {max-width:         360px; }  */  /* does not work in IE */
/* put in class se below */


/* see www.svendtofte.com/code/max_width_in_ie/ for this wee fix 
   to try and limit width of paragraph to that of the image 360 px */
/*#col1 p {
            max-width:  360px;
            width:      expression(document.body.clientWidth > 360? "360px": "auto" );
}*/


#col2 li
{
list-style:             none; 
padding-left:           1em;
padding-right:          1em;
padding-top:            1em;
padding-bottom:         1em;
background-image:       url(NewRBstar.gif);
background-repeat:      no-repeat;
background-position:    0 .5em;
color:                  #000;
font-size:              140%;
text-align:             left;  /*not centre*/
}

#col2 li a 
{
            text-decoration:    none;
            margin-left:        1em;  /*added */
 }


/* for link to home ie royboyd.com*/
#verytop a:link {
text-decoration: none;
color:           #ffffff; /* white */
}
#verytop a:visited {
text-decoration: none;
color:           #ffffff;  /* white */
}
#verytop a:hover {
text-decoration: underline; 
color:             #ffffff;  /* white */
}


/* -----  classes -----     */

.narrow
{max-width:         360px; } 

/*  to use with non nav list on right panel   */
.smallertext
{ /*font-size:          71%;  */  /* 71 %*/
 margin-left:        1.2em; 
 padding-top:        0;
 margin-top:         0;} 

 abbr, acronym, .help {
  border-bottom: 1px dotted #333;
  cursor: help;
  }

/*   end of style stuff   */