/* ThemeOfficeMenu Style Sheet */
/*
vertical menu:
	cell spacing is set in ozweb_template/js/ThemeOffice/theme.js
	offset of submenus is set in ozweb_template/js/JSCookMenu.js on line 743
	
horizontal menu:
	spacing between menu items
			from memory, set by replacing <img> in template (ozweb_template/index.php) with nbsp:
			also, ozweb_template/js/ThemeOffice/theme.js has before & after html
				- think couldn't get before to affect, but after did something.
*/
/*
to sort out:
	vertical: the grey border on left cell of submenu on rollover is coming from the table bg colour
*/

.ThemeOfficeMenu,.ThemeOfficeSubMenuTable
{
	font-family: verdana, arial, sans-serif;
	font-size: 13px;
	padding: 0;
	white-space: nowrap;
	cursor: default;
	/*border-top:        1px solid #647E00;*/
	/*background-color : #80A100;*/ /*   vertical: table bg colour */
}

.ThemeOfficeSubMenu
{
        position:        absolute;
        visibility:        hidden;

        /*
           Netscape/Mozilla renders borders by increasing
           their z-index.  The following line is necessary
           to cover any borders underneath
        */
        z-index:        100;
        border:                0;
        padding:        0;

        overflow:        visible;
        border:                1px solid #647E00;

        filter:progid:DXImageTransform.Microsoft.Shadow(color=#BDC3BD, Direction=135, Strength=4);
}

.ThemeOfficeSubMenuTable
{
        overflow:        visible;
}

.ThemeOfficeMainItem,.ThemeOfficeMainItemHover,.ThemeOfficeMainItemActive,
.ThemeOfficeMenuItem,.ThemeOfficeMenuItemHover,.ThemeOfficeMenuItemActive
{
        border:                0;
        cursor:                hand;
        white-space:        nowrap;
}

.ThemeOfficeMainItem
{
	/* background-color: #E5E9F2;
	*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #000000; /* changing doesn't do any thing - use line 137 */
	padding: 4px;
	border:0;
}


td.ThemeOfficeMainItemHover,td.ThemeOfficeMainItemActive
{
        padding:        3px;
        border:                1px solid #647E00;
}

.ThemeOfficeMainItemHover,.ThemeOfficeMainItemActive
{
	background-color: #DBC600; /* doesn't work in the cell if bg colour entered in line 122 or 137 or 151 */
	background-image : url(hover.gif); /* this coloured gif allows bg colour to change on hover when bg colour entered in line 122 or 137 or 151 */
	background-repeat : repeat;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	// works color: #000000; /* changing doesn't do any thing - use line 137 */
}

.ThemeOfficeMenuItem
{
        background-color:        #ffffff;
}

.ThemeOfficeMenuItemHover,.ThemeOfficeMenuItemActive
{
        background-color:         #DBCB39; // submenu hover background colour
}


/* horizontal main menu */


.ThemeOfficeMainFolderLeft,.ThemeOfficeMainItemLeft,
.ThemeOfficeMainFolderText,.ThemeOfficeMainItemText,
.ThemeOfficeMainFolderRight,.ThemeOfficeMainItemRight
{
        background-color:        inherit;
}

/* vertical main menu sub components */

td.ThemeOfficeMainFolderLeft,td.ThemeOfficeMainItemLeft
{
        padding-top:        2px;
        padding-bottom:        2px;
        padding-left:        0px;
        padding-right:        0px;
        border-top:        0px solid #647E00;
        border-bottom:        1px solid #647E00;
        border-left:        1px solid #647E00;
        background-color:       inherit; /* putting a colour here gives bgcolour different to page bg & table bg, but stops the rollover effect by ThemeOfficeMainItemHover  - use inherit if want table bg to show through, and rollover to work*/
}

td.ThemeOfficeMainFolderText,td.ThemeOfficeMainItemText
{
        padding-top:        3px;
        padding-bottom:        3px;
        padding-left:        5px;
        padding-right:        5px;

        border-top:        1px solid #647E00;
        border-bottom:        1px solid #647E00;
        border-left:        1px solid #647E00;
        border-right:        1px solid #647E00;

        background-color:       #BEB131; /* putting a colour here gives bgcolour different to page bg & table bg, but stops the rollover effect by ThemeOfficeMainItemHover  - use inherit if want table bg to show through, and rollover to work*/
        white-space:        nowrap;
        color: #4F4E5C; /* I added this - sets top level font color */
}

td.ThemeOfficeMainFolderRight,td.ThemeOfficeMainItemRight
{
        padding-top:        3px;
        padding-bottom:        3px;
        padding-left:        0px;
        padding-right:        0px;
        border-top:        0px solid #647E00;
        border-bottom:        1px solid #647E00;
        border-right:        1px solid #647E00;
        background-color:        inherit; /* putting a colour here gives bgcolour different to page bg & table bg, but stops the rollover effect by ThemeOfficeMainItemHover  - use inherit if want table bg to show through, and rollover to work*/
}

tr.ThemeOfficeMainItem td.ThemeOfficeMainFolderLeft,
tr.ThemeOfficeMainItem td.ThemeOfficeMainItemLeft
{
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 0px;
	padding-right: 0px;
	white-space: nowrap;
	/* border: 0;
	commenting this allows borders around top level menu item*/
	background-color: inherit;
}

tr.ThemeOfficeMainItem td.ThemeOfficeMainFolderText,
tr.ThemeOfficeMainItem td.ThemeOfficeMainItemText
{
        padding-top:        3px;
        padding-bottom:        3px;
        padding-left:        5px;
        padding-right:        5px;

/*
        border:                0; commenting this allows borders around top level menu item*/
        background-color:        inherit;
}

tr.ThemeOfficeMainItem td.ThemeOfficeMainItemRight,
tr.ThemeOfficeMainItem td.ThemeOfficeMainFolderRight
{

        padding-top:        3px;
        padding-bottom:        3px;
        padding-left:        0px;
        padding-right:        0px;

/*
        border:                0; commenting this allows borders around top level menu item*/
        background-color:        inherit;
       
}

/* sub menu sub components */

.ThemeOfficeMenuFolderLeft,.ThemeOfficeMenuItemLeft
{
/* doesn't eliminate hover
        padding-top:        2px;
        padding-bottom:        2px;
        padding-left:        1px;
        padding-right:        3px;
        border-top:        1px solid #647E00;
        border-bottom:        1px solid #647E00;
        border-left:        1px solid #647E00;
        background-color:       inherit;
        white-space:        nowrap;
        */
}

.ThemeOfficeMenuFolderText,.ThemeOfficeMenuItemText
{
        padding-top:        2px;
        padding-bottom:        2px;
        padding-left:        5px;
        padding-right:        5px;
        border-top:        1px solid #647E00;
        border-bottom:        1px solid #647E00;
        background-color:        inherit;
        white-space:        nowrap;
}

.ThemeOfficeMenuFolderRight,.ThemeOfficeMenuItemRight
{
        padding-top:        2px;
        padding-bottom:        2px;
        padding-left:        0px;
        padding-right:        0px;
        border-top:        1px solid #647E00;
        border-bottom:        1px solid #647E00;
        border-right:        1px solid #647E00;
        background-color:        inherit;
        white-space:        nowrap;
}

.ThemeOfficeMenuItem .ThemeOfficeMenuFolderLeft,
.ThemeOfficeMenuItem .ThemeOfficeMenuItemLeft
{
        padding-top:        3px;
        padding-bottom:        3px;
        padding-left:        2px;
        padding-right:        3px;

        white-space:        nowrap;

        border:                0;
        background-color:        #DBCB39; // colour of left cell in submenus
}

.ThemeOfficeMenuItem .ThemeOfficeMenuFolderText,
.ThemeOfficeMenuItem .ThemeOfficeMenuItemText
{
        padding-top:        3px;
        padding-bottom:        3px;
        padding-left:        5px;
        padding-right:        5px;

        border:                0;
        background-color:        inherit;
}

.ThemeOfficeMenuItem .ThemeOfficeMenuFolderRight,
.ThemeOfficeMenuItem .ThemeOfficeMenuItemRight
{
        padding-top:        3px;
        padding-bottom:        3px;
        padding-left:        0px;
        padding-right:        1px;

        border:                0;
        background-color:        inherit;
}

/* menu splits */

.ThemeOfficeMenuSplit
{
        margin:                2px;
        height:                1px;
        overflow:        hidden;
        background-color:        inherit;
        border-top:        1px solid #C6C3BD;
}

/* image shadow animation */

/*
        seq1:        image for normal
        seq2:        image for hover and active

        To use, in the icon field, input the following:
        <img class="seq1" src="normal.gif" /><img class="seq2" src="hover.gif" />
*/

.ThemeOfficeMenuItem img.seq1
{
        display:        inline;
}

.ThemeOfficeMenuItemHover seq2,
.ThemeOfficeMenuItemActive seq2
{
        display:        inline;
}

.ThemeOfficeMenuItem .seq2,
.ThemeOfficeMenuItemHover .seq1,
.ThemeOfficeMenuItemActive .seq1
{
        display:        none;
}