/* Copyright Dynarch.com, 2003-2006.  All Rights Reserved. */

/*
   Note, this file wants to be a sample showing you how to create custom skins.
   Feel free to use it as a starting point. */

@import url("hmenu.css");

/****************************************************
   (1) THE MAIN MENU BAR
*****************************************************/

div.dynarch-horiz-menu {
  /*background-color: #ccc;       */
  background-color: #CAE3C6;
  border: 0px;
}

div.dynarch-horiz-menu table {
  /* A table is used to layout elements in the main menu bar.
     Here is safe to specify fonts. */

 /* set a custom font */
	color:#00f; 
	font-size:10pt;	
}

div.nojsmenu { background-color: #CAE3C6; border: 0px; }
div.nojsmenu table { color:#00f; font-size:10pt; margin-left:3px; }
div.nojsmenu table tr td { padding: 3px 0px 3px 0px; }
div.nojsmenu table tr td a { text-decoration:none; padding:3px 10px 3px 10px; }
div.nojsmenu table tr td a:hover { background-color: #777; color: #eee; }
div.nojsmenu table tr td a:visited { color:#00f; }
div.nojsmenu table tr td a:visited:hover { background-color: #777; color: #eee; }

div.dynarch-horiz-menu table tr td.hover {
  /* Styles for hover items in the main menu bar */
  background-color: #777;
  color: #eee;
  cursor: pointer;
}

div.dynarch-horiz-menu table tr td.active {
  /* Styles for active (pressed) items in the main menu bar */
  background-color: #777;
  color: #fff;
  cursor: pointer;  
  /* Note that setting the font weight to bold will increase the item
     width when it's pressed.  This is normally not desirable. */
}

div.dynarch-horiz-menu table tr td.separator div {
  /* The vertical separator that can be present in the main menu bar.
     This is normally a small DIV, having certain padding and margin set, so that it can look like a separator.
     It is normally comprised of 2 lines (border-left and border-right), so if we want it to be a single-line
     separator then we need to set one of them to "none". */
  border-left: none;            /* no border on the left side */
  border-right-color: #00f;      /* red separator line. */
}

/****************************************************
   (2) THE POPUP MENUS
*****************************************************/

div.dynarch-popup-menu {
  background-color: #CAE3C6;
  padding: 2px;                
  border: 1px solid #4B8743;     
}

div.dynarch-popup-menu table td {
	font-size:10pt; color: #00f;  
}

div.dynarch-popup-menu tr.item.hover td {
  background-color: #777;
  color: #eee;
  cursor: pointer;  
}

div.dynarch-popup-menu tr.item.active td {
  background-color: #000;
  color: white;
}

div.dynarch-popup-menu tr.separator td div {
  /* Here we can configure the horizontal separator style. */
  background-color: red;        /* give it a red background in order to have a red line as separator. */

  /* Let's space it "properly" ;-) */
  margin-top: 10px;
  margin-bottom: 10px;
}

div.dynarch-popup-menu tr.disabled td.label {
  /* Special case: DISABLED menu items */
  color: #fff;                  /* Let's make them hard to see ;-) */
}

/***

   Well, that's what you need to know..  I hope this helps.  Our menu
   can be styled very heavily and nicely, but it's out of the scope of our
   documentation to write a full guide to CSS.

   If you need more than this, please (1) read and understand the CSS
   specification which can be found at www.w3.org, (2) look through our
   default skins and (3) experiment, experiment, test, experiment :-).
   It's not easy to make good looking skins.

***/