/* Layout Stylesheet */ 


body
{  padding:0; margin: 0; } 
 

#lh-col

{  position: absolute; top: 0px;
 left: 0px;  width: 20%;
 border: 0px solid;
/* <!-- background: color: #333333; */
 /* margin: 1; padding: 0; */
/*  height: 500px; --> */
 /* <!--z-index: 1;--> */
}


#rh-col
{ position: absolute;  top: 0px;
 right: 5px;  width: 20%;
/* <!-- border: 1px solid ;-->
<!-- background: color: #333333;--> */
 margin: 1px;
 padding: 1px;
 height: 900px;
 z-index: 1;  }

#hdr
{ height:160px;
 /* <!-- background: color:#333333;--> */
 margin:0;
 padding:0;
 /* <!--border: solid #333333;-->
<!--border-width: 1px 1px 0 1px;--> */
} 
      
#c-col
{ position: relative; margin: 0 150px  150px;
 border: 0px solid 
/* <!-- background:; color: #333333;--> */
 padding: 20px;
 z-index: 3; }

A:link     {
             text-decoration       : none;
             font-weight           : normal; 
             /*color                 : blue;*/
             /* background		   : transparent;*/
             }

A:hover  {
             text-decoration        : underline;
             font-weight            : bold;
            /* color                  : black;  /*hover print color*/
            /* background             : red;    /*hover background color*/
             }

.navigation 


{
font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color:teal;           /* text color of right panel */      
	text-decoration: none;
	background-color:blue;     /* ??? I'm REALLY confused here */
	
	background:gold;    /* background of right panel*/
	
	display: block;
	padding: 6px;
	width: 150px;
	border: thin InactiveBorder;
	border-style: solid;
}
<!--LH panal background and print color-->


.navigation:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color:yellow;
	text-decoration: none;
	background-color:yellow;
	display: block;
	padding: 6px;
	width: 150px;
	border: thin ActiveBorder;
	border-style: solid;
}
<!--LH panel hover background-->


.navigation2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color:black;
	text-decoration: none;
	background-color:pink;                 /* I'm confused as to what this is for*/
	background:purple;
	display: block;
	padding: 6px;
	width: 150px;
	border: thin InactiveBorder;
	border-style: solid;
}
.navigation2:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color:yellow;             /* rh panel text color*/
	text-decoration: none;
	background-color:green;  /* rh panel hover color */
	display: block;
	padding: 6px;
	width: 150px;
	border: thin ActiveBorder;
	border-style: solid;
}



<!-- position: relative;
 margin: 0 181px 20px 181px;
 border: 1px solid #333333;
 background: #ffffff;
 color:#000000;
 padding: 20px;
 z-index: 3;-->