.ddpanel .ddpanelcontent{ /*CSS for "content" DIV of Drop Down Panel*/
color: #333333 ; /* orig=white; - text color of what is in the panel*/
background: IndianRed;  /*orig=black; - background of Drop Down Panel*/
/*Do NOT add any "padding" or "margin" properties here! Any padding/margin should be added to your content's container within this DIV instead */
}

.ddpanel .ddpaneltab{ /*CSS for tab DIV of Drop Down Panel */
margin-left: 20px; /* orig=margin-right: 20px;  moves the tab in from the edge */
font: normal 10px Arial; /* orig=font: normal 10px Arial; - Does ??? */
}

.ddpanel .ddpaneltab a{ /* tab related CSS */
float: left; /* orig=right; */
color: navy;;
background: IndianRed url(toggleleft.gif) no-repeat left bottom; /* orig=black... background of the tab */
text-decoration: none;
letter-spacing: 1px;
}

.ddpanel .ddpaneltab a span{ /* tab related CSS */
float: left; /* orig=left - right will extend the tab all across the page */
display: block;
background: transparent url(toggleright.gif) no-repeat right bottom; /* "toggleright.gif" is the right hand corner of the tab */
padding: 1px 12px 4px 13px; /* padding: 1px 12px 4px 13px; - This is the padding around the text in the tab */
cursor: pointer;
/* font-size:9px; */ /* aml added - changes the font size of the text in the tab */
/* width:200px; */ /* aml added - this can set the width of the tab */
}

.ddpanel .ddpaneltab a span img.pointerimage{ /*CSS for pointer image within  tab */
margin-top: 2px;
margin-left: 5px; /* moves the down/up arrow image farther to the right from the left end of the text in the tab */
}

.ddpanel .ddpaneltab a:hover{ /* tab related CSS*/
background-color:#a09fa2; /* orig=navy; - background of  tab onMouseover */
}

.ddpanel .ddpaneltab a:active, .ddpanel .ddpaneltab a:focus{ /* tab related CSS */
outline: 0; /* does ??? */
}

.ddpanel .ddpaneltab a:hover span{ /* tab related CSS*/
background-color: transparent;
}