/*NAVBAR STYLE SHEET FOR WWW.ORIGINTECHNICALPRODUCTIONS.CO.UK */
/* LAST EDITED BY: PETER COX */

/* otp_ddnavbar_rm2.css v23.0 (13.09.23) (Originally based on Suckerfish code) */
/* For use with dbase driven dryhire section */
/* W3C validated 31.08.20 */

/* 20.0 : Development of responsive menu */
/* CReated from otp_ddnavbar_r.css */
/* 20.0 : Trialled in use with flexmenu2.asp */
/* 20.0 : Will need to rename the top level items in line with the mobile styles */
/* 20.1 : Development alongside flexmenu2.asp and otp_dbnavbar_rm2.asp
/* 20.5 : Max width added to stop breaking of bar layout on wider screens, eg HD 1920px (nav)*/
/* 20.7 : Solution to stop 3rd level dryhire items showing under 2nd level dropdown Line 475 */
/* 20.8 : Orange highlight on hover/focus added to match other navigation + improved tabbing behaviours
/* 20.8 : Used for experimenting for OCS menu devlopment 26.03.21 - 08.04.21 */
/* 23.0 : Replace fontawesome navbar fonts with screen shot pngs on toggle + add .toggle.active to clean css validation */


/* ////////////////////////////////////////////////  MOBILE FIRST  ///////////////////////////////////////////////////*/

/* Mobile First styling: All these are BASE (Global starting) STYLES in the CSS so will need to be overridden */

/* Styling for ALL widths unless overidden above 798px */
nav { /* The Containing div of the menu */ 
	order:1; /* As part of the body section */
	position:relative;
	width:80vw; /* Set the width to 70% of the viewport width */ 
	min-height:30px; /* Nominal working height */
	margin:auto; /* Keep the nav div centred horizontally  in the viewport */
	margin-top:0; /* Controls top margin */
	margin-bottom:0; /* Controls bottom margin */
	background-color:transparent;
	z-index:400; /* Lift the menu and dropdowns above everything else */
	/*border:1px solid fuchsia;*/ /* DEV only */
	/*background-color:#99FF99;*/  /* DEV only */
	}
		
@media all and (min-width: 799px) { /* using single break point */
nav { /* Style modifications to the Containing div of the menu at widths above 799px */
	width:78vw; /* .78x 1366 = 1065px */
	width:65vw;
	width:60vw;
	min-width:800px; /* Ensures Menu always fits in the available width before the breakpoint */
	/*background-color:yellow;*/ /* DEV only */
	max-width:1100px;  /* To limit width on wider viewports, eg HD 1920 */
	/*border:1px solid fuchsia;*/ /* DEV only */
	}
}

@media all and (min-width: 1400px) { 
nav {
	max-width:800px;
	/*border:1px dotted yellow;*/  /* DEV only */
	}
}

/* Styling for ALL widths unless overidden above 798px */
.menu { /* The first UL container of the menu system */
	position:relative;
    display:flex;
    flex-wrap:wrap; /* Let the menu form several rows */
    justify-content: space-between;
	flex-direction:row;
	list-style-type:none;
	font-size:1.0em; /* Sets all text within 'menu' to 1.0em */
	font-weight:bold; /* Puts all text within 'menu' as bold */
	letter-spacing:0.05em; /* Spaces the characters out slightly for legibility */
	width:80%; 
	margin:auto;
	margin-top:0; /* Controls top margin */
	margin-bottom:0; /* Controls bottom margin */
	left:20px;
	/*border-left:1px solid #003399;*/ /* dark blue */
	/*border-bottom:1px solid #003399;*/ /* dark blue */
	/*border:1px solid yellow;*/  /* Dev only */
	/*background-color:#000066;*/ /* dev only */	
	}

@media all and (min-width: 799px) { /* styling modifcations for widths above 798px */
.menu { /* Style modifications to the ul object of the navigation listing */
	width:80%;
	flex-wrap:nowrap; /* Prevent the wider menu forming several rows */
	font-size:1.1em;
	background-color:transparent;
	/*border:1px solid yellow;*/ /* Dev only */
	/*background-color:#0066FF;*/ /* blue - Dev only */
    }
}


/* Styling for ALL widths unless overidden above 798px */
.menu li { /* Global styling of ANY LIST ITEMS within the menu */
	position:relative;
    white-space: nowrap; /* Prevents legends from breaking to two lines */
	text-align:left;
	line-height:2.2em; /* Sets the height of the top menu bar above the topLight */
	/*padding-left:10px;*/
	/*border:1px dotted red;*/ /* DEV only */
	}
	
@media all and (min-width: 799px) { /* using single break point */	
.menu li a{ /* Style modifications to the global LIST item styling at widths above 799px  */
	/*border:1px dotted red;*/ /* DEV only */
	padding-right:6px; /* Creates (black) space to the right hand side of legend in hovered items */
	/*padding-left:0;*/
	}
}

/*a { *//* beware this doesn't bleed into other styles ! */ /* Probably wants to be more specific */
    /*color: white;*/
	/*color:#FF9900;*/ /* orange */ /* from flex6 */
    /*text-decoration: none;*/
	/*}*/
	
/*a:hover {
    text-decoration: underline;
	}*/

/* Styling for ALL widths unless overidden above 798px */
.toggle a { /* LINKS within 'toggle' */
    font-size: 20px; /* this is for the 'X' and hamburger used in original */
	line-height:1.6em;
	color:#ffffff; /* override the global 'a' styling above */
	}
	
/*.button.secondary {
    border-bottom: 1px #444 solid;
}*/

/* Styling for ALL widths unless overidden above 798px */
.toggle { /* the hamburger or other menu icon shown at widths less than 799px */
    /*order: 1;*/ /* original */
	order:3; /* from flex6 */
	width:15%; /* from flex6 */
	background-image:url("/images-nav/png/otp_hamburger.png");  /* The 'Open menu' icon */
	background-repeat:no-repeat;
    /*background-color:#00FF00;*/ /* me - dev only  */
}

/* Styling for ALL widths unless overidden above 798px */
.toggle.active { /* the hamburger or other menu icon shown at widths less than 799px */
    /*order: 1;*/ /* original */
	/*order:3;*/ /* from flex6 */
	/*width:15%;*/ /* from flex6 */
	background-image:url("/images-nav/png/otp_close.png");  /* The 'Close menu' icon (X) */
	/*background-repeat:no-repeat;*/
    /*background-color:#00FF00;*/ /* me - dev only  */
}


/* Just on .active makes the X appear on top of the other menu items */


/* Styling for ALL widths unless overidden above 798px */
.item.home.constant {
	/*margin-left:30px;*/
	padding-left:10px;
	}


/* Styling for ALL widths unless overidden above 798px */
.item.home.constant,
.item.contact.constant { /* This includes 'Home' and 'Contact' - They are always shown in the top menu bar */
    /*order: 2;*/ /* original */
	order:1;
	display:block; /* Added - these items always need to be displayed */
	width:30%; /* Added */
	color:#ffffff;
}
/* Styling for ALL widths unless overidden above 798px */
.item.constant a { /* added */ /* afects colour of 'Home' and 'Contact' top legends */
	color:#ffffff; /* override the added orange above */
	text-decoration:none;
	font-size:1.2em;
	font-size:1.4em;
	line-height:2.0em;
	/*color:#00FF00;*/ /* Dev only */
	}
/* @widths below 799px */
.constant a:hover {
        text-decoration: none;
    }

@media all and (min-width: 799px) { /* Modifications to style at widths above 799px */		
.item.constant { /* Items are still tagged with this style, so it needs to be left in, maybe negated / overridden */
        /*width: auto;*/
        /*order: 1;*/
        /*display: block;*/
		/*padding: 7.5px 15px;*/
		/*background:none;*/
    }
.item.constant a { /* added */ /* afects colour of 'Home' and 'Contact' top legends */
	color:#ffffff; /* override the added orange above */
	font-size:1.0em;
	/*color:#00FF00;*/ /* Dev only */
	}
.constant a:hover {
        text-decoration: none;
    }
}

/* @widths below 799px */
/*.item.active,*/
.item.about.active,
.item.production.active,
.item.staging.active,
.item.structures.active,
.item.dryhire.active,
.item.location.active,
.item.jobs.active {
    display: block;
	order:4;
	width:100%;
	padding-left:10px;
	font-size:1.4em;
	line-height:3.0em;
	background-image:url(/images12/png/navDropBackground.png); /* Do on individual li items to leave top bar clear */
	background-repeat:repeat;
	top:7px;
	border-bottom:2px solid #000000; /* black */
	border-top:1px solid #003399; /* dark blue */
	border-left:1px solid #003399; /* dark blue */
}

.active a {
	color:#ffffff;
	color:#f5a300; /* Orange */
	text-decoration:none;
	width:100%;
	display:block;
	/*padding-left:10px;*/
	/*border:1px solid yellow;*/ /* DEV only */
	}

/* ////////////////////////////////////////  VIEWPORTS WIDER THAN 799px   ////////////////////////////////////////*/
/* ////////////////////////////////////////  VIEWPORTS WIDER THAN 799px   ////////////////////////////////////////*/
/* ////////////////////////////////////////  VIEWPORTS WIDER THAN 799px   ////////////////////////////////////////*/


@media all and (min-width: 799px) { /* using single break point */	
.item { /* A list object.This includes 'About', 'Production', 'Staging', 'Temporary Structures', 'Dryhire', +? 'Location' and 'Jobs'*/
    width: 100%; /* adjust width using the ul width */
	background-image:none; /* Remove the background applied in mobile styling */
	 display: block;

}
.item a {
	/*font-size:1.1em;*/
	color:#ffffff; /* make ALL item links white */
	display:block;
	}
/* Add specific styling to the top row legends for wider viewports (IF REQUIRED) */
.item.home {
	position:relative;
	order:1;
	/*padding-right:6px;*/
	margin-left:30px; /* Controls the spacing to the left side of the Home legend */
	/*border:1px dotted red;*/ /* DEV only */
	/*background-color:#006600;*/ /* DEV only */
	}
}

/*@media all and (min-width: 1299px) {*/ /* using single break point */	
@media all and (min-width: 799px) { /* using single break point */	
.item.home {
	margin-left:100px; /* Controls the spacing to the left side of the Home legend */
	margin-left:0; /* v20.5 to sort issues */
	}
}

/* Styling for ALL widths unless overidden above 799px */
.item.about,
.item.production,
.item.staging,
.item.structures,
.item.dryhire, /* Watch out cap H's in other labels */
.item.location,
.item.jobs { /* Disappears the first drop down UL container listings from the mobile viewport */
	position:relative;
	/*left:-999em;*/ 
	display:none; /* Keeps them hidden - need to return to check the -999em version of this too */
	}

@media all and (min-width: 799px) { /* using single break point */	
.item.about  
/*.item.about a, 
.item.about a:visited,
.item.about a:active*/ { 
	order:2;
	display:block; /* required to counteract 'display:none;' from mobile styling */ 
	/*padding-right:6px;*/ /* matches hover area with base area on rhs */
	/*border:1px solid lime;*/ /* DEV only */
	/*background-color:#990000;*/ /* DEV only */
	}	
li.item.production
/*.item.production a, 
.item.production a:visited,
.item.production a:active*/ {
	order:3;
	display:block; /* required to counteract 'display:none;' from mobile styling */ 
	/*min-width:14.0em;*/ /* adding 'min-' gives numeric width control */
	/*padding-right:6px;*/ /* MAY NEED REMOVED ON ALL BELOW - COVERED BY GLOBAL 'menu li a' ABOVE  */
	/*border:1px dotted yellow;*/ /* DEV only */
	/*background-color:#003399;*/ /* DEV only */
	}	
.item.staging
/*.item.staging a, 
.item.staging a:visited,
.item.staging a:active*/ {
	order:4;
	display:block; /* required to counteract 'display:none;' from mobile styling */ 
	/*padding-right:6px;*/ /* matches hover area with base area on rhs */
	/*border:1px solid yellow;*/ /* DEV only */
	/*background-color:#CC3300;*/ /* DEV only */
	}	
.item.structures
/*.item.structures a,*/ 
/*.item.structures a:visited,*/
/*.item.structures a:active*/ {
	order:5;
	display:block; /* required to counteract 'display:none;' from mobile styling */ 
	/*padding-right:6px;*/ /* matches hover area with base area on rhs */
	/*border:1px dotted fuchsia;*/ /* DEV only */
	/*background-color:#993399;*/ /* DEV only */
	}		
.item.dryhire {
	order:6;
	display:block; /* required to counteract 'display:none;' from mobile styling */ 
	/*padding-right:6px;*/
	/*background-color:#663366;*/
	/*border:1px solid silver;*/
	}	
.item.contact.constant { /* get this in the correct order by being specific */
	order:7;
	/*padding-right:6px;*/
	/*background-color:#CC3366;*/
	/*border:1px dotted red;*/
	}	
.item.location {
	display:none; /* Shouldn't appear on the top line - maybe display:none; ?*/
	}	
.item.jobs {
	display:none; /* Shouldn't appear on the top line - maybe display:none; ?*/
	}	
.toggle { /* this is also not a thing at these widths */
        order: 12;
		display: none;
    }

}



/* //////////////////////////////////////////////////////////////////////////////////// */

/* Common styling of primary links along the main nav bar */

@media only screen and (min-width: 799px) { /* For screen widths down to 799px wide: desktop screens */
 
.menu a,                       /* is this all duplicating? */
.menu a:visited,
.menu a:active { 
	display: block;
	/*width:100%;*/
	color: #ffffff;
	text-decoration: none;
	background-color:transparent;
	padding-left:28px; /* This moves the legends a further 28px to leav room for the roundel to appear */
	border-top:1px solid transparent;
	border-right:1px solid transparent;
	border-left:1px solid transparent;
	}

/* ///////////////////////// PERSISTENT HOVER STYLE ON THE TOP LEVEL /////////////// */

/* These will have to be specifically targetted as the flexbox nature needs specific min-widths MAYBE NOT!? */
	
.menu li:hover a, 
.menu li:focus a,
.menu li:focus-within a { /*set styles for top level when it or dropdown is hovered / focussed */
/* Works by styling EVERY link inside a list item when that list item is hovered / focused */
	background-image:url(/images12/png/nav/roundel-orange.png);
	background-position:0 -6px; /* ...and -6px y axis centres the roundel vertically */
	background-position:-4px -6px;/* ...and -4px x-axis moves the roundel to left away from the legend */
	background-repeat:no-repeat;
	border-top:1px solid #003399; /* dark blue */
	border-left:1px solid #003399; /* dark blue */
	padding-right:6px;
	}

/* This bit controls the general appearance of the top line menu items when hovered over */
.menu li a:hover, /* This has to over-ride the persistent behaviour, so goes below it */
.menu li a:focus /*,
.menu li a:focus:within*/ {	/* A new pseudo class added - NEEDS TO BE CORRECTED AND PROPAGATED THROUGHOUT */
	display:block;
	border-top:1px solid #3366FF; /* blue */
	border-left:1px solid #3366FF; /* blue */
	padding-right:6px;
	/* Below added v20.8 for focus behaviour to mimick hover */
	color:#f5a300; /* orange */ 
	background-image:url(/images12/png/nav/roundel-orange.png);
	background-position:0 -6px; /* ...and -6px y axis centres the roundel vertically */
	background-position:-4px -6px;/* ...and -4px x-axis moves the roundel to left away from the legend */
	background-repeat:no-repeat;	
	}
		
	
/* PERSISTENT STYLE ON THE SECOND LEVEL?? */

/*#dd_nav li ul li.dd_dryHire2_audio:hover a { */  /* specific */
.menu li ul li:hover a, .menu li ul li:focus a {  /* non-specific */	
	background-color:#000000; /* Causes all items below to go black when Lev-2 is hovered / focussed */
	border-top:1px solid #003399; /* dark blue */ /* gets over-ridden somewhere */
	}

/* 18.02.12 Investigate negating the second-level persistency affecting the third-level lists at another time. Leave third levels as solid when unhovered for now. */
	
}

/* ************************************ SECOND LEVEL / FIRST DROP-DOWNS ********************************************* */	
/* ************************************ SECOND LEVEL / FIRST DROP-DOWNS ********************************************* */
/* ************************************ SECOND LEVEL / FIRST DROP-DOWNS ********************************************* */
/* ************************************ SECOND LEVEL / FIRST DROP-DOWNS ********************************************* */


/* ///////////////// SECOND-LEVEL (FIRST DROPDOWN) LISTS GLOBAL STYLING for widths down to 799px ///////////////////*/	

/* SO THESE WILL BE ULs WITHIN THE FIRST LIST ITEMS */

@media only screen and (min-width: 799px) { /* For screen widths down to 900px wide: desktop screens */

.menu li ul { /* Global / COMMON second-level (first drop downs) styling of UL containers, NOT per item */
	position: absolute;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers ; so the dropdowns are always visible, it's just that they're moved off the screen*/ /* 2020: This needs to be checked */
	margin-left:-25px; /* Not sure why */
	height: auto; /* Not sure why */
	line-height:2.2em; /* Not having any effect here */
	list-style-type:none; /* Removes any form of bullet, in favour of using a background to acheive apparent bullets */
	/*line-height:2.2em;*/ /* may be overridden below */
	/* NOTE: Background images are applied individually, with icons, to get the step at the top*/
	/* For consistency, this is maintained even where several, or all, list items use the same icon */ 
	}

}

/* Styling for ALL widths unless overidden above 798px */
ul.dd_about2,
ul.dd_production2,
ul.dd_stages2,
ul.dd_structures2,
ul.dd_dryHire2,
ul.dd_contact2 { /* Disappears the first drop down UL container listings from the mobile viewport */
	position:absolute;
	left: -999em; 
	}
	
@media only screen and (min-width: 799px) { /* For screen widths down to 900px wide: desktop screens */

/* /////////////////////// MAKING THE DROPDOWNS APPEAR //////////////////////////// */
/* /////////////////////// MAKING THE DROPDOWNS APPEAR //////////////////////////// */
/* /////////////////////// MAKING THE DROPDOWNS APPEAR //////////////////////////// */
/* /////////////////////// MAKING THE DROPDOWNS APPEAR //////////////////////////// */

/* The crucial bit to make the dropdowns appear... */
.menu li:hover ul  /* This line controls the display of the first drop-down containers */
/*.menu li a:focus ul*/ {  /* Added v20.8 */
/*.menu li:hover ul li:hover ul */   /*Third-level, Second drop-down containers should not appear at the same time*/
	left:0; /* Make them appear back where they should do, from their -999em displacement */
	}


/* Adding below acheives visible tabbing but looses position and persistent style on top row */	
.menu li:focus-within > ul {   /* Need to place this in appropriate place to pick up specific positions */
	left:0px;
	margin-top:-4px;
	left:25px; /* Bring it back to a zero position from -999em plus the added offset for the bullet backgrounds */
	/*margin-left:28px;*/
	/*background-color:#00FF00;*/
	}

/* Specific first drop-down container positions: */
	
.menu li:hover ul.dd_production2,
.menu li:focus ul.dd_production2 {
	margin-top:-4px;
	left:25px; /* Bring it back to a zero position from -999em plus the added offset for the bullet backgrounds */
	/*margin-left:28px;*/
	}
	
	
	
.menu li:hover ul.dd_stages2,
.menu li:focus ul.dd_stages2 { /* Specifics = Line 700 below */
	margin-top:-4px;
	left:25px;
	}
	
.menu li:hover ul.dd_structures2,
.menu li:focus ul.dd_structures2 {  /* Specifics = Line 950 below */
	margin-top:-4px;
	left:25px;
	}
	
.menu li:hover ul.dd_dryHire2,
.menu li:focus ul.dd_dryHire2 {
	margin-top:-4px;
	left:25px;
	}
	
.menu li:hover ul.dd_contact2,
.menu li:focus ul.dd_contact2 {	
	margin-top:-4px;
	left:25px;
	}
	
.menu li:hover ul.dd_dryhire3,
.menu li:focus ul.dd_dryhire3 {
	left:-999em; /* This stops spurious display of 3rd level Dryhire menus */
	}  /* 31.08.20 Never found the cause */

	
.menu li ul li { /* global COMMON second level (first dropdown) LIST items eg. 'Festivals & Concerts' */
	left:0px; /* Sets the drop-down position laterally wrt the primary menu item*/
	margin-left:0;
	padding-left:0;
	/*line-height:2.45em;*/
	border-top:1px solid #000000; /* black */
	border-left:1px solid #003399; /* dark blue */
	}

.menu li ul li a:hover,
.menu li ul li a:focus { /* global / COMMON link behaviours */
	background-color:#000000; /* Helps to highlight the selection */	
	border-top:1px solid #3366FF; /* blue */
	border-left:1px solid #3366FF; /* blue */	
	}
	
/* ////////// SECOND-LEVEL (FIRST DROPDOWN) LISTS & SPECIFIC STYLING /////////////*/

/* /////////////////////////////////////////////////////////////////////////////// */
             /* ABOUT MENU */ /* NONE CURRENTLY ACTIVE JULY 2020 */
			 
			 /* //////////// IGNORE FOR NOW ////////////////////*/
/* /////////////////////////////////////////////////////////////////////////////// */	
	
#dd_nav li ul li.dd_about2_jobs a, 
#dd_nav li ul li.dd_about2_jobs a:visited,
#dd_nav li ul li.dd_about2_jobs a:active { 
	width: 6.0em; /* Set the width indendently to fit within the list container */
	color:#ffffff; /* Must be something above that is making this blue by default */
	font-weight:bold;
	background-image:url(/images12/png/nav/roundel-blue.png);
	padding-left:28px;
	background-position:-4px -6px;
	background-repeat:no-repeat;
	border-top:1px solid #000000; /* black */
	border-left:1px solid #003399; /* dark blue */
	}
	
#dd_nav li ul li.dd_about2_jobs a:hover, 
#dd_nav li ul li.dd_about2_jobs a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/roundel-orange.png);
	background-repeat:no-repeat;
	color:#f5a300; /* Orange */
	background-position:-4px -6px;
	background-repeat:no-repeat;
	border-top:1px solid #3366FF; /* blue */
	border-left:1px solid #3366FF; /* blue */		
	}		
}

	
/* /////////////////////////////////////////////////////////////////////////////// */
                            /* PRODUCTION MENU - 	1st DROP DOWM */
							/* PRODUCTION MENU - 	1st DROP DOWM */
							/* PRODUCTION MENU - 	1st DROP DOWM */
/* /////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 799px) { /* For screen widths down to 900px wide: desktop screens */	

ul.dd_production2 { /* Controls the first Production drop down UL container position and styling */
	position:absolute;
	position:relative;
	display:block;
	min-width:22.0em; /* Set the width of this dropdown list container independently */
	/*margin-top:-28px;*/ /* Controls vertical alignment with the navbar */
	top:2.45em; /* Move the ul container down the same height as the menu bar */
	/*margin-left:-40px;*/ /* no effect */
	/*margin-right:30px;*/ /* no effect */
	font-weight:bold; /* To set all text in here */
	/*border:1px solid #ffffff;*/ /* DEV only. Shows the level 2 production list container */
	}
	


/* ////////// THEN COME THE ITEMS IN THE MENU: ////////// */


/* 16.07.20 Not sure what the padding-left:28px is all about on some of the below */
	
/* ////////// Festivals ///////////////*/
/* .menu li ul li */
.menu li ul li.dd_production2_festivals a, 
.menu li ul li.dd_production2_festivals a:visited,
.menu li ul li.dd_production2_festivals a:active { /* second-level (first dropdown) sound list */
	background-image:url(/images-nav/png/navbg-roundel-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	position:relative;
	display:block;
	}
	
.menu li ul li.dd_production2_festivals a:hover, 
.menu li ul li.dd_production2_festivals a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-roundel-orange.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;	
	}	
	
/* ////////// Corporate //////////////////*/

.menu li.dd_production2_corporate a,  
.menu li.dd_production2_corporate a:visited,
.menu li.dd_production2_corporate a:active { 
	background-image:url(/images-nav/png/navbg-roundel-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}
	
.menu li.dd_production2_corporate a:hover, 
.menu li.dd_production2_corporate a:focus { /* link behaviours)*/
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-roundel-orange.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;	
	}

/* ////////// Celebrations ////////////////////*/

.menu li.dd_production2_celebrations a, 
.menu li.dd_production2_celebrations a:visited,
.menu li.dd_production2_celebrations a:active { 
	background-image:url(/images-nav/png/navbg-roundel-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}
	
.menu li.dd_production2_celebrations a:hover, 
.menu li.dd_production2_celebrations a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-roundel-orange.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	}

/* ////////// AV and LED screens  /////////////////*/

.menu li ul li.dd_production2_audiovisual a, 
.menu li ul li.dd_production2_audiovisual a:visited,
.menu li ul li.dd_production2_audiovisual a:active { 
	background-image:url(/images-nav/png/navbg-roundel-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}
	
.menu li ul li.dd_production2_audiovisual a:hover, 
.menu li ul li.dd_production2_audiovisual a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-roundel-orange.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;	
	}



/* ////////// Sound /////////////////// */

.menu li.dd_production2_sound a, 
.menu li.dd_production2_sound a:visited,
.menu li.dd_production2_sound a:active { 
	background-image:url(/images-nav/png/navbg-roundel-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}
	
.menu li ul li.dd_production2_sound a:hover, 
.menu li ul li.dd_production2_sound a:focus { /* link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-roundel-orange.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	}
	
/* //////////  Lighting ///////////////*/

.menu li ul li.dd_production2_lighting a, 
.menu li ul li.dd_production2_lighting a:visited,
.menu li ul li.dd_production2_lighting a:active { 
	background-image:url(/images-nav/png/navbg-roundel-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}
	
.menu li ul li.dd_production2_lighting a:hover, 
.menu li ul li.dd_production2_lighting a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-roundel-orange.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;	
	}
	
	
/* ////////// Power & Distribution /////////////////*/

.menu li ul li.dd_production2_power a, 
.menu li ul li.dd_production2_power a:visited,
.menu li ul li.dd_production2_power a:active { 
	background-image:url(/images-nav/png/navbg-roundel-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}
	
.menu li ul li.dd_production2_power a:hover, 
.menu li ul li.dd_production2_power a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-roundel-orange.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;	
	}
	
	
/* ////////// Special Projects ////////////////*/

.menu li ul li.dd_production2_specials a, 
.menu li ul li.dd_production2_specials a:visited,
.menu li ul li.dd_production2_specials a:active { 
	background-image:url(/images-nav/png/navbg-roundel-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}
	
.menu li ul li.dd_production2_specials a:hover, 
.menu li ul li.dd_production2_specials a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-roundel-orange.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;	
	}
	
}
/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
                            /* STAGES MENU SECOND LEVEL (FIRST DROP-DOWN) */
							/* STAGES MENU SECOND LEVEL (FIRST DROP-DOWN) */
							/* STAGES MENU SECOND LEVEL (FIRST DROP-DOWN) */
/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////// */


/* /////////////////////////////////////////////////////////////////////////////// */
                            /* STAGES MENU COMMON STYLING*/
/* /////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 799px) { /* For screen widths down to 900px wide: desktop screens */	

/*.menu li ul.dd_stages2*/	
ul.dd_stages2 { /* Controls the Stages drop down ul container */
	min-width:24.0em; /* Set the width of this dropdown list container independently - See note on line 914 below */
	top:2.45em; /* Move the ul container down the same height as the menu bar */
	/*border:1px solid #ffffff;*/ /* DEV only. Shows the level 2 production list container */
	}


/* ************** Flat & Tiered Staging **************** */
	
.menu li ul li.dd_stages2_flat a, 
.menu li ul li.dd_stages2_flat a:visited, 
.menu li ul li.dd_stages2_flat a:active { /* second-level (first dropdown) lighting list */
	/*width:34.0em;*/ /* Set the width indendently to fit within the list container */
	/*line-height:2.45em;*/
	background-image:url(/images-nav/png/navbg-litedeck-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}
		
.menu li ul li.dd_stages2_flat a:hover, 
.menu li ul li.dd_stages2_flat a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-litedeck-orange.png);
	/*background-position:-4px -6px;*/
	background-repeat:no-repeat;
	/*border-top:1px solid #3366FF;*/ /* blue */
	/*border-left:1px solid #3366FF;*/ /* blue */
	/*margin-left:-40px;*/	 /* No movement on hover */
	}
	
/*************** OUTDOOR COVERED STAGES *****************/
	
.menu li ul li.dd_stages2_covered a, 
.menu li ul li.dd_stages2_covered a:visited, 
.menu li ul li.dd_stages2_covered a:active { /* second-level (first dropdown) lighting list */
	/*width: 24.0em;*/ /* Set the width indendently to fit within the list container */
	/*line-height:2.45em;*/
	background-image:url(/images-nav/png/navbg-MR1-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}	
.menu li ul li.dd_stages2_covered a:hover, 
.menu li ul li.dd_stages2_covered a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-MR1-orange.png);
	/*background-position:-4px -6px;*/
	background-repeat:no-repeat;
	/*border-top:1px solid #3366FF;*/ /* blue */
	/*border-left:1px solid #3366FF;*/ /* blue */
	/*margin-left:-40px;*/ /* No movement on hover */		
	}
	
/***************  MINI APEX ****************/

.menu li ul li.dd_stages2_MA1 a, 
.menu li ul li.dd_stages2_MA1 a:visited,
.menu li ul li.dd_stages2_MA1 a:active { /* second-level (first dropdown) sound list */
	position:relative;
	/*width: 24.0em;*/ /* Set the width indendently to fit within the list container */
	/*line-height:2.45em;*/
	background-image:url(/images-nav/png/MA1-blue.png); /* Note icons are part of background tint strip */
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}
	
.menu li ul li.dd_stages2_MA1 a:hover, 
.menu li ul li.dd_stages2_MA1 a:focus { /* second-level (first dropdown)*/
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/MA1-orange.png);
	/*background-color:#000000;*/
	background-repeat:no-repeat;
	/*border-top:1px solid #3366FF;*/ /* blue */
	/*border-left:1px solid #3366FF;*/ /* blue */
	/*margin-left:-40px;*/	/* Make it jump left to highlight selection */	
	}
		
/* ////////// MINI CURVE ///////////////*/

.menu li ul li.dd_stages2_MC1 a, 
.menu li ul li.dd_stages2_MC1 a:visited,
.menu li ul li.dd_stages2_MC1 a:active { /* second-level (first dropdown) sound list */
	position:relative;
	/*width: 24.0em;*/ /* Set the width indendently to fit within the list container */
	/*line-height:2.45em;*/
	background-image:url(/images-nav/png/MC1-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}
	
.menu li ul li.dd_stages2_MC1 a:hover, 
.menu li ul li.dd_stages2_MC1 a:focus { /* second-level (first dropdown)*/
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/MC1-orange.png);
	/*background-color:#000000;*/
	background-repeat:no-repeat;
	/*border-top:1px solid #3366FF;*/ /* blue */
	/*border-left:1px solid #3366FF;*/ /* blue */
	/*margin-left:-40px;*/ /* No movement on hover */	
	}
		
/* /////////////// 6M WIDE MR1 ///////////////////// */	
	
.menu li ul li.dd_stages2_MR1 a, 
.menu li ul li.dd_stages2_MR1 a:visited,
.menu li ul li.dd_stages2_MR1 a:active { /* second-level (first dropdown) sound list */
	position:relative;
	/*width: 24.0em;*/ /* Set the width indendently to fit within the list container */
	/*line-height:2.45em;*/
	background-image:url(/images-nav/png/navbg-MR1-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}
	
.menu li ul li.dd_stages2_MR1 a:hover, 
.menu li ul li.dd_stages2_MR1 a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/MR1-orange.png);
	/*background-color:#000000;*/
	background-repeat:no-repeat;
	/*border-top:1px solid #3366FF;*/ /* blue */
	/*border-left:1px solid #3366FF;*/ /* blue */
	/*margin-left:-40px;*/	 /* This moves the item to the left on hover */
	}
	
/* ////////////////// 8m arc //////////////////////*/	
	
.menu li ul li.dd_stages2_8m_arc a, 
.menu li ul li.dd_stages2_8m_arc a:visited,
.menu li ul li.dd_stages2_8m_arc a:active { /* second-level (first dropdown) sound list */
	position:relative;
	/*width: 24.0em; *//* Set the width indendently to fit within the list container */
	/*line-height:2.45em;*/
	background-image:url(/images-nav/png/10m-arc-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;	
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}
	
.menu li ul li.dd_stages2_8m_arc a:hover, 
.menu li ul li.dd_stages2_8m_arc a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/10m-arc-orange.png);
	/*background-color:#000000;*/
	background-repeat:no-repeat;
	/*border-top:1px solid #3366FF;*/ /* blue */
	/*border-left:1px solid #3366FF;*/ /* blue */
	/*margin-left:-40px;/* /* No movement on hover */		
	}

/* ////////////////// 10m arc ////////////////////////*/	
	
.menu li ul li.dd_stages2_10m_arc a, 
.menu li ul li.dd_stages2_10m_arc a:visited,
.menu li ul li.dd_stages2_10m_arc a:active { /* second-level (first dropdown) sound list */
	position:relative;
	/*width: 24.0em;*/ /* Set the width indendently to fit within the list container */
	/*line-height:2.45em;*/
	background-image:url(/images-nav/png/10m-arc-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}
	
.menu li ul li.dd_stages2_10m_arc a:hover, 
.menu li ul li.dd_stages2_10m_arc a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/10m-arc-orange.png);
	/*background-color:#000000;*/
	background-repeat:no-repeat;
	/*border-top:1px solid #3366FF;*/ /* blue */
	/*border-left:1px solid #3366FF;*/ /* blue */
	/*margin-left:-40px;*/ /* No movement on hover */		
	}

/* ////////////////// 10m bandstand /////////////////////////////*/	
	
.menu li ul li.dd_stages2_10m_bandstand a, 
.menu li ul li.dd_stages2_10m_bandstand a:visited,
.menu li ul li.dd_stages2_10m_bandstand a:active { /* second-level (first dropdown) sound list */
	position:relative;
	/*width: 24.0em; /* Set the width indendently to fit within the list container */
	/*line-height:2.45em;*/
	background-image:url(/images-nav/png/10m-bandstand-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}
	
.menu li ul li.dd_stages2_10m_bandstand a:hover, 
.menu li ul li.dd_stages2_10m_bandstand a:focus { /* Link behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/10m-bandstand-orange.png);
	background-color:#000000;
	background-repeat:no-repeat;
	/*border-top:1px solid #3366FF;*/ /* blue */
	/*border-left:1px solid #3366FF;*/ /* blue */	
	/*margin-left:-40px;*/ /* No movement on hover */	
	}

	
/* ////////////////////// Saddlespans //////////////////////////*/

/* NOTE; SADDLESPAN BACKGROUND GRAPHICS ARE ONLY OK FOR WIDTHS UP TO ABOUT 24EM - NEED REMADE AT SOME POINT! */

.menu li ul li.dd_stages2_saddlespans a, 
.menu li ul li.dd_stages2_saddlespans a:visited,
.menu li ul li.dd_stages2_saddlespans a:active { /* second-level (first dropdown) sound list */
	position:relative;
	/*width:28.0em;*/ /* Set the width indendently to fit within the list container */
	/*line-height:2.45em;*/
	background-image:url(/images-nav/png/navbg-saddlespans-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}
	
.menu li ul li.dd_stages2_saddlespans a:hover, 
.menu li ul li.dd_stages2_saddlespans a:focus { /* second-level (first dropdown)*/
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/navbg-saddlespans-orange.png);
	/*background-color:#000000;*/
	background-repeat:no-repeat;
	/*border-top:1px solid #3366FF;*/ /* blue */
	/*border-left:1px solid #3366FF;*/ /* blue */
	/*margin-left:-40px;*/ /* No movement on hover */		
	}

}
/* ////////////////////////// END OF NEW SECOND LEVEL COVERED STAGES SECTION //////////////////////////////////// */	
/* ////////////////////////// END OF NEW SECOND LEVEL COVERED STAGES SECTION //////////////////////////////////// */	


/* ////////////////////////// TEMPORARY STRUCTURES SECTION //////////////////////////////////// */
/* ////////////////////////// TEMPORARY STRUCTURES SECTION //////////////////////////////////// */
/* ////////////////////////// TEMPORARY STRUCTURES SECTION //////////////////////////////////// */
	


/* /////////////////////////////////////////////////////////////////////////////// */
                            /* STRUCTURES MENU COMMON STYLING*/
/* /////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 799px) { /* For screen widths down to 900px wide: desktop screens */		
.menu li ul.dd_structures2 { /* Controls the first Structures drop down ul container */
	min-width:30.0em; /* Set the width of this dropdown list container independently */
	top:2.45em; /* Move the ul container down the same height as the menu bar */
	margin-left:-25px;
	/*border:1px solid #ffffff;*/ /* DEV only. Shows the level 2 production list container */
	}


/* ////////// THEN COME THE ITEMS IN THE MENU: ////////// */

/***************  ALL LAYHER-BASED STRUCTURES  **********/
	
.menu li ul li.dd_structures2_layher a, 
.menu li ul li.dd_structures2_layher a:visited, 
.menu li ul li.dd_structures2_layher a:active { /* second-level (first dropdown) structures list item link */
	/*width: 24.0em;*/ /* Set the width indendently to fit within the list container */
	background-image:url(/images-nav/png/layher-logo-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}	
.menu li ul li.dd_structures2_layher a:hover, 
.menu li ul li.dd_structures2_layher a:focus { /* List item behaviours */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/layher-logo-orange.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	/*border-top:1px solid #3366FF;*/ /* blue */
	/*border-left:1px solid #3366FF;*/ /* blue */
	}
		
/*************** GROUND SUPPORT **********/
	
.menu li ul li.dd_structures2_GS a, 
.menu li ul li.dd_structures2_GS a:visited, 
.menu li ul li.dd_structures2_GS a:active { /* second-level (first dropdown) lighting list */
	/*width: 24.0em;*/ /* Set the width indendently to fit within the list container */
	background-image:url(/images-nav/png/grndspprt-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*border-top:1px solid #000000;*/ /* black */
	/*border-left:1px solid #003399;*/ /* dark blue */
	}	
.menu li ul li.dd_structures2_GS a:hover, 
.menu li ul li.dd_structures2_GS a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/grndspprt-orange.png);
	}
	
/*************** PA TOWERS **********/
	
.menu li ul li.dd_structures2_PAT a, 
.menu li ul li.dd_structures2_PAT a:visited, 
.menu li ul li.dd_stuctures2_PAT a:active { /* second-level (first dropdown) lighting list */
	/*width: 24.0em;*/ /* Set the width indendently to fit within the list container */
	background-image:url(/images-nav/png/PAtowers-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}	
.menu li ul li.dd_strutures2_PAT a:hover, 
.menu li ul li.dd_structures2_PAT a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images-nav/png/PAtowers-orange.png);
	border-top:1px solid #3366FF; /* blue */
	border-left:1px solid #3366FF; /* blue */	
	}

/***************  DISABLED VIEWING PLATFORMS *********************/
	
.menu li ul li.dd_structures2_DVP a, 
.menu li ul li.dd_structures2_DVP a:visited, 
.menu li ul li.dd_structures2_DVP a:active { /* second-level (first dropdown) lighting list */
	background-image:url(/images12/png/nav/disabled-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}	
.menu li ul li.dd_structures2_DVP a:hover, 
.menu li ul li.dd_structures2_DVP a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/disabled-orange.png);
	border-top:1px solid #3366FF; /* blue */
	border-left:1px solid #3366FF; /* blue */	
	}
}	

/* /////////////////////////////////////////////////////////////////////////////// */
                            /* DRYHIRE MENU */
							 /* DRYHIRE MENU */
							  /* DRYHIRE MENU */
/* /////////////////////////////////////////////////////////////////////////////// */

/* COMMON STYLING: */

@media only screen and (min-width: 799px) { /* For screen widths down to 900px wide: desktop screens */	
ul.dd_dryHire2 { /* The containing ul for the first drop-down Dryhire listing (Top Level Categories) */
	min-width:20.0em; /* Set the width of this dropdown list container independently */
	top:2.45em; /* Move the ul container down the same height as the menu bar */
	/*color:#026DFC;*/ /* Bright blue  : DEV only */
	/*background-color:#026dfc;*/ /* bright blue : DEV only */
	}
	
ul li.dd_dryHire2 a,
ul li.dd_dryHire2 a:visited,
ul li.dd_dryHire2 a:active {
	font-weight:bold;
	color:#026DFC; /* Bright blue */
	}
ul li.dd_dryHire2 a:hover,
ul li.dd_dryHire2 a:focus {
	color:#f5a300; /* Orange */	
	}

/* ////////// DRYHIRE: AUDIO / SOUND //////////////// */

	
.menu li ul li.dd_dryHire2_audio a,
.menu li ul li.dd_dryHire2_sound a, 
.menu li ul li.dd_dryHire2_audio a:visited, 
.menu li ul li.dd_dryHire2_sound a:visited,
.menu li ul li.dd_dryHire2_audio a:active,
.menu li ul li.dd_dryHire2_sound a:active { /* second-level (first dropdown) lighting list */
	background-image:url(/images12/png/nav/sound-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}
		
.menu li ul li.dd_dryHire2_audio a:hover, 
.menu li ul li.dd_dryHire2_sound a:hover,
.menu li ul li.dd_dryHire2_audio a:focus,
.menu li ul li.dd_dryHire2_sound a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/sound-orange.png);	
	}	


/* ////////// DRYHIRE: LIGHTING //////////////////*/


.menu li ul li.dd_dryHire2_lighting a, 
.menu li ul li.dd_dryHire2_lighting a:visited, 
.menu li ul li.dd_dryHire2_lighting a:active { /* second-level (first dropdown) lighting list */
	background-image:url(/images12/png/nav/lx-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}	
.menu li ul li.dd_dryHire2_lighting a:hover, 
.menu li ul li.dd_dryHire2_lighting a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/lx-orange.png);
	background-color:#000000;
	}

/* ////////// */

.menu li ul li.dd_dryHire2_av a, 
.menu li ul li.dd_dryHire2_audio-visual a,
.menu li ul li.dd_dryHire2_av a:visited,
.menu li ul li.dd_dryHire2_audio-visual a:visited, 
.menu li ul li.dd_dryHire2_av a:active,
.menu li ul li.dd_dryHire2_audio-visual a:active { /* second-level (first dropdown) lighting list */
	background-image:url(/images12/png/nav/av-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}	
.menu li ul li.dd_dryHire2_av a:hover, 
.menu li ul li.dd_dryHire2_audio-visual a:hover,
.menu li ul li.dd_dryHire2_av a:focus,
.menu li ul li.dd_dryHire2_audio-visual a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/av-orange.png);
	background-color:#000000;	
	}

/* ////////// */

.menu li ul li.dd_dryHire2_power-distro a, 
.menu li ul li.dd_dryHire2_power-distro a:visited, 
.menu li ul li.dd_dryHire2_power-distro a:active { /* second-level (first dropdown) lighting list */
	background-image:url(/images12/png/nav/power-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}	
.menu li ul li.dd_dryHire2_power-distro a:hover, 
.menu li ul li.dd_dryHire2_power-distro a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/power-orange.png);
	background-color:#000000;	
	}

/* ////////// TRUSS & RIGGING ///////////////// */
	
.menu li ul li.dd_dryHire2_truss a, 
.menu li ul li.dd_dryHire2_rigging a, 
.menu li ul li.dd_dryHire2_truss a:visited,
.menu li ul li.dd_dryHire2_rigging a:visited,  
.menu li ul li.dd_dryHire2_truss a:active,
.menu li ul li.dd_dryHire2_rigging a:active { /* second-level (first dropdown) lighting list */
	background-image:url(/images12/png/nav/truss-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}	
.menu li ul li.dd_dryHire2_truss a:hover,
.menu li ul li.dd_dryHire2_rigging a:hover,  
.menu li ul li.dd_dryHire2_truss a:focus,
.menu li ul li.dd_dryHire2_rigging a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/truss-orange.png);
	background-color:#000000;
	border-top:1px solid #3366FF; /* blue */
	border-left:1px solid #3366FF; /* blue */	
	}	
	 


/* ////////// LITEDECK STAGING ///////////////////*/

	

.menu li ul li.dd_dryHire2_litedeck a,
.menu li ul li.dd_dryHire2_litedeck-staging a, 
.menu li ul li.dd_dryHire2_litedeck a:visited,
.menu li ul li.dd_dryHire2_litedeck-staging a:visited,  
.menu li ul li.dd_dryHire2_litedeck a:active,
.menu li ul li.dd_dryHire2_litedeck-staging a:active { /* second-level (first dropdown) lighting list */
	background-image:url(/images12/png/nav/litedeck-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	}	
.menu li ul li.dd_dryHire2_litedeck a:hover,
.menu li ul li.dd_dryHire2_litedeck-staging a:hover, 
.menu li ul li.dd_dryHire2_litedeck a:focus,
.menu li ul li.dd_dryHire2_litedeck-staging a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/litedeck-orange.png);
	background-color:#000000;	
	}
	
		
/* ////////// */	

.menu li ul li.dd_dryHire2_roundel a, /* BEING USED AS DEFAULT ICON UNTIL SPECIALS DESIGNED FOR OTHER CATEGORIES */
.menu li ul li.dd_dryHire2_dressing a, 
.menu li ul li.dd_dryHire2_drapes a,
.menu li ul li.dd_dryHire2_set a,
.menu li ul li.dd_dryHire2_temporary-bars a,
.menu li ul li.dd_dryHire2_roundel a:visited,
.menu li ul li.dd_dryHire2_dressing a:visited, 
.menu li ul li.dd_dryHire2_drapes a:visited,
.menu li ul li.dd_dryHire2_set a:visited, 
.menu li ul li.dd_dryHire2_temporary-bars a:visited,
.menu li ul li.dd_dryHire2_roundel a:active,
.menu li ul li.dd_dryHire2_dressing a:active,
.menu li ul li.dd_dryHire2_drapes a:active,
.menu li ul li.dd_dryHire2_set a:active,
.menu li ul li.dd_dryHire2_temporary-bars a:active { /* second-level (first dropdown) lighting list */
	background-image:url(/images12/png/nav/roundel-blue.png);
	background-position:-4px -6px;
	background-repeat:no-repeat;
	padding-left:28px;
	/*color:#33FF00;*/ /* DEV only */
	}

.menu li ul li.dd_dryHire2_roundel a:hover,	
.menu li ul li.dd_dryHire2_dressing a:hover,
.menu li ul li.dd_dryHire2_drapes a:hover,
.menu li ul li.dd_dryHire2_set a:hover, 
.menu li ul li.dd_dryHire2_temporary-bars a:hover,
.menu li ul li.dd_dryHire2_roundel a:focus,
.menu li ul li.dd_dryHire2_dressing a:focus,
.menu li ul li.dd_dryHire2_drapes a:focus,
.menu li ul li.dd_dryHire2_set a:focus,
.menu li ul li.dd_dryHire2_temporary-bars a:focus { /* second-level (first dropdown) stage hire list */
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/roundel-orange.png);
	background-color:#000000;
	} 
	 
}	 
	 


/* /////////////////////////////////////////////////////////////////////////////// */
                            /* CONTACT MENU */
/* /////////////////////////////////////////////////////////////////////////////// */

/* COMMON STYLING: */

@media only screen and (min-width: 799px) { /* For screen widths down to 900px wide: desktop screens */	

ul.dd_contact2 { /* The containing ul for the first drop-down Contact listing (Top Level Categories) */
	min-width:10.0em; /* Set the width of this dropdown list container independently */
	top:2.45em; /* Move the ul container down the same height as the menu bar */
	}

/* ////////// THEN COME THE ITEMS IN THE MENU: ////////// */
	
.menu li ul li.dd_contact2_location a, 
.menu li ul li.dd_contact2_location a:visited,
.menu li ul li.dd_contact2_location a:active { /* second-level (first dropdown) sound list */
	color:#ffffff; /* Must be something above that is making this blue by default */
	background-image:url(/images12/png/nav/roundel-blue.png);
	padding-left:28px;
	background-position:-4px -6px;
	background-repeat:no-repeat;
	}
	
.menu li ul li.dd_contact2_location a:hover, 
.menu li ul li.dd_contact2_location a:focus { /* second-level (first dropdown)*/
	color:#f5a300; /* Orange */
	background-image:url(/images12/png/nav/roundel-orange.png);
	background-repeat:no-repeat;
	color:#f5a300; /* Orange */
	background-color:#000000;
	background-position:-4px -6px;
	background-repeat:no-repeat;	
	}
}