/*	ciaunav is standard wide menu
	ciaunav2 alternate narrow main menu similar to nav3
	ciaunav3 is special narrow menu for home page
	ciaunav4 is for push down RV search state selection
*/
.menu_container {
	max-width: 1201px;	/* IYL original menu width */
	margin: 0 auto;
	background-color:#D2E4ED; /* light blue - top level menu background */
	Zbackground-color:#FCC;	/*TESTING*/
	padding-top:20px;

	/* Rounded Corners top left + top right only
	-moz-border-radius: 16px 16px 0 0;
	-webkit-border-radius: 16px 16px 0 0;
	-khtml-border-radius: 16px 16px 0 0;
	border-radius: 16px 16px 0 0 ;
	*/
}

.ciau_row {clear: both;	width: 100%;}

.ciaunav_mtop20 {
 margin-top:-20px; /*pushes menu bar back up page 20px */ }

/* --- Initialisation and bug fixes --- */

/* fix problem that bootstrap causes with box-sizing : border-box on narrow menu */
.ciau_menu_container * { 
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
    box-sizing: content-box;
}
.ciau_menu_container *:before, .ciau_menu_container. :after { 
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

  .ciau_menu_container a { /* !SIZE: set font size for all a tag text in menu (does not affect narrow view top 'Menu' */
    font-size: 14px;
	font-weight:600; /* or bold */
	z-index:1001; /* to fix z-index problem caused by bootstrap and on Chrome */
  }

  /* --- initial padding on all levels within menu else defaults to indenting list items  - required in my TEST pages else idents LI sub items --- */
  .ciau_menu_container ul, .ciau_menu_container ul li, .ciau_menu_container ul li ul, .ciau_menu_container ul li ul li, .ciau_menu_container ul li ul li ul, .ciau_menu_container ul li ul li ul li {
	padding: 0; 
	/* do NOT specify margin here as causes all sorts of issues on lower sub items */
  }

  .ciau_menu_container ul {
	margin: 0px;
  }
	.ciau_menu_container ul li {
	  display:block;	/* overrides dietlicious.css: ul li, ol li, ul.list > li, ol.list > li {display: list-item;}  */
	  margin-bottom: -1px; /* fixes Chrome bug of adding space after 3rd vertical menu item */
	}

	  .ciau_menu_container ul li ul li {border:none;  } /* ? does not work stop borders showing on sub levels */

  #ciaunav ul,#ciaunav li, #ciaunav a, 
  #ciaunav2 ul,#ciaunav2 li, #ciaunav2 a, 
  #ciaunav3 ul,#ciaunav3 li, #ciaunav3 a, 
  #ciaunav4 ul,#ciaunav4 li, #ciaunav4 a {  font-family: 'Open Sans', sans-serif; /* stop iyl.css overriding - Google font for menu items*/
  }

  #ciaunav, #ciaunav2, #ciaunav3, #ciaunav4 {
	overflow: hidden;
	/* this sets font for all items in menu except the narrow view "Menu" button */  
  }

	#ciaunav > a { /* hide hamburger */
	  display: none; 				
	}
	#ciaunav2 > a { /* hide hamburger */
	  display: none; 				
	}

	#ciaunav ul, #ciaunav2 ul, #ciaunav3 ul, #ciaunav4 ul {	/* remove bullets from li items */
	  list-style-type: none;
	}

	#ciaunav li, #ciaunav2 li, #ciaunav3 li, #ciaunav4 li { /* all li items only */
	  position: relative;
	}

	#ciaunav li {
	  zzzline-height:95%;	/* vertical spacing to squeeze 2 lines of text in top menu items */
	  Zborder-bottom: 14px solid #CFDE76;	/* green border under button */
	}
	
	#ciaunav2 >ul >li >ul >li:last-of-type, 
	#ciaunav3 >ul >li >ul >li:last-of-type, 
	#ciaunav4 >ul >li >ul >li:last-of-type { /* last 2nd level item only */
	  border-bottom: 1px solid #999999;	/* grey border under item */
	}

	  #ciaunav li a, #ciaunav2 li a, #ciaunav3 li a, #ciaunav4 li a { /* top level menu items ONLY - background colour (both wide & narrow views)  BISON3 */
		color:#004A6F; /* dark blue - sets font color for all menu items except top 'Menu' in narrow view */
		display: block;			
	    position: relative;
    	padding: .25em;	/* !SIZE: changes padding around all <a> tag text - changes menu box height but not arrow box - top level changed below */
		/* sets top level menu items */

		background-color:#D2E4ED; /* light blue - top level menu background */
		Zheight:25px;	/* force list item height */

		/* Rounded Corners top left + top right only for all levels for all li a tags
		-moz-border-radius: 16px 16px 0 0;
		-webkit-border-radius: 16px 16px 0 0;
		-khtml-border-radius: 16px 16px 0 0;
		border-radius: 16px 16px 0 0 ;
		*/
		border-top:2px solid #999999;
		border-bottom:2px solid #999999;
		border-left:1px solid #999999;
	  }
	#ciaunav > ul > li:last-of-type > a {border-right:1px solid #999999;} /* add right border to last top level item only */
	#ciaunav >ul >li >ul >li a {border-right:1px solid #999999;} /* add right border to 2nd level items */




	  #ciaunav2 li a, 
	  #ciaunav3 li a, 
	  #ciaunav4 li a { /* set top level items always to dark green */
		background-color:#267DA8;
		color: #FFF;
	  }

	#ciaunav2 > ul > li	> a,
	#ciaunav3 > ul > li	> a,
	#ciaunav4 > ul > li > a { /* top level items only */
	border-top: 	2px solid #999999;	/* grey border */
	border-bottom: 	0px solid #000;	/* grey border */
	border-left: 	2px solid #999999;	/* grey border */
	border-right: 	2px solid #999999;	/* grey border */
	}
	#ciaunav2 > ul > li:last-of-type > a, 
	#ciaunav3 > ul > li:last-of-type > a, 
	#ciaunav4 > ul > li:last-of-type > a { /* top level last item only */
	border-bottom: 2px solid #999999;	/* grey border */
	}

	/* 2nd level items only */
	#ciaunav2 > ul > li	> ul > li > a, 
	#ciaunav3 > ul > li	> ul > li > a, 
	#ciaunav4 > ul > li	> ul > li > a { 
	border-top: 	2px solid #999999;	/* grey border */
	border-bottom: 	0px solid #000;	/* grey border */
	border-left: 	2px solid #999999;	/* grey border */
	border-right: 	2px solid #999999;	/* grey border */
	}
	#ciaunav2 > ul > li:last-of-type > ul > li:first-of-type > a,
	#ciaunav3 > ul > li:last-of-type > ul > li:first-of-type > a,
	#ciaunav4 > ul > li:last-of-type > ul > li:first-of-type > a { /* no top border on first 2nd level item of last top */
	border-top: 0px solid #000;
	}
	#ciaunav2 > ul > li:last-of-type > ul > li:last-of-type > a,
	#ciaunav3 > ul > li:last-of-type > ul > li:last-of-type > a,
	#ciaunav4 > ul > li:last-of-type > ul > li:last-of-type > a { /* add bottom border to last 2nd level item of last top */
	border-bottom: 	1px solid #999999;	/* grey border */
	}

	#ciaunav a, #ciaunav2 a, #ciaunav3 a, #ciaunav4 a {  /* set initial properties for all links in menu */	
	  text-decoration: none;
	  text-align:center; /* 140805 tell button text to center align */
	}

	/* first level menu */
	#ciaunav > ul {
	  zbackground: #0f0; /* testing only */
	}
	  #ciaunav > ul > li, #ciaunav2 >ul >li, #ciaunav3 >ul >li, #ciaunav4 >ul >li {
		height: 100%;
		float: left;
	}
		#ciaunav > ul > li > a, #ciaunav2 >ul > li > a, #ciaunav3 >ul > li > a, #ciaunav4 >ul > li > a { /* top level meu items */
		  height: 100%;
		  line-height: 2.5em; /* 60 (24) */
		  text-align: center;
		}
		#ciaunav > ul > li:hover > a,
		#ciaunav > ul:not( :hover ) > li.active > a, 
		#ciaunav2 > ul > li:hover > a,
		#ciaunav2 > ul:not( :hover ) > li.active > a, 
		#ciaunav3 > ul > li:hover > a,
		#ciaunav3 > ul:not( :hover ) > li.active > a, 
		#ciaunav4 > ul > li:hover > a,
		#ciaunav4 > ul:not( :hover ) > li.active > a {
	 	  /* change bg color on all menu items */
		  color: #FFF;	/* set hover font color not arrow */
		  background-color:#267DA8; /* medium blue */				
		}

		/* second level */
		#ciaunav li ul, #ciaunav2 li ul, #ciaunav3 li ul, #ciaunav4 li ul { /* applies to 2nd & 3rd levels */
		  Zbackground-color: #ff0; /* testing YELLOW */
		  display: none;
		  position: absolute;
		}

		#ciaunav li:hover >ul { /* applies to 2nd level only */
		  display: block; /* expands 2nd level menu whilst mouse over 1st level item */
		}
			#ciaunav li ul a, #ciaunav2 li ul a, #ciaunav3 li ul a, #ciaunav4 li ul a {
			  font-size: 13px;
			  padding: 0.75em; /* 15 (20) */
			}
				#ciaunav li ul li a:hover,
				#ciaunav li ul:not( :hover ) li.active a,
				#ciaunav2 li ul li a:hover,
				#ciaunav2 li ul:not( :hover ) li.active a,
				#ciaunav3 li ul li a:hover,
				#ciaunav3 li ul:not( :hover ) li.active a,
				#ciaunav4 li ul li a:hover,
				#ciaunav4 li ul:not( :hover ) li.active a {
				  color: #004A6F;	/* set hover font color not arrow */
				  background-color:#D2E4ED; /* dark blue */
				}
			  #ciaunav li ul li a, #ciaunav2 li ul li a, 
			  #ciaunav3 li ul li a, #ciaunav4 li ul li a {	/* set second level menu - both wide & narrow views */
				display: block;
				background-color:#006699;	/* dark blue */
				color: #FFF;
				text-align:left; /* tell sub menu items to left align */
				font-size: 13px;
				/* remove Rounded Corners on all lower menu items in either view 
				-moz-border-radius: 0;
				-webkit-border-radius: 0;
				-khtml-border-radius: 0;
				border-radius: 0 ;
				*/
			  }

@media all and (min-width: 1075px) {	/* --- 1075 Wide view only --- */

  #ciaunav {
    overflow: visible; }
    #ciaunav li {
      position: relative;
      list-style: none;
      float: left;
      display: block;
      ZZbackground-color: #a6a6a2;	/* behind wide top level buttons */
      overflow: visible;
	  }
    #ciaunav li a {
      Qborder-bottom: none; 
	  }
    #ciaunav li > ul {
      position: absolute;
      top: auto;
      left: 0; }
      #ciaunav li > ul li {
        width: 100%; 
		}
/* above no difference ? */
		
  #ciaunav ul li ul li {
	  border:none;  } /* stop border showing on sub levels for wide view only */


  /* !COLUMN WIDTHS: dependent upon number of comumns in menu */
  /* This MUST reside in the Wide View @ media else upsets narrow view */
  /* specify widths of top menu items in wide view - if not specified will default to equal widths if 'calcItemWidths': true in .js file 
  zzznav-ciau ul[role=topmenu] li:nth-child(1){width:9%}	/* note sum of % is less than 100% */
  #ciaunav ul[role=topmenu] li:nth-child(1){width:9%}	/* note sum of % is = 100% */
  #ciaunav ul[role=topmenu] li:nth-child(2){width:19%} 
  #ciaunav ul[role=topmenu] li:nth-child(3){width:12%} 
  #ciaunav ul[role=topmenu] li:nth-child(4){width:12%}
  #ciaunav ul[role=topmenu] li:nth-child(5){width:19%}
  #ciaunav ul[role=topmenu] li:nth-child(6){width:15%} 
  #ciaunav ul[role=topmenu] li:nth-child(7){width:14%}	/* extended width for 'contact us' so dropdown fits */
  /* followng tells sub levels <li> to go back to 100% */
  #ciaunav ul[role=topmenu] li li:nth-child(1){width:100%;
	   padding-top:1px /*push sub list down over top border*/ } 
/*  nav-ciau ul[role=topmenu] li li:nth-child(1){width:100%}*/
  #ciaunav ul[role=topmenu] li li:nth-child(2){width:100%} 
  #ciaunav ul[role=topmenu] li li:nth-child(3){width:100%} 
  #ciaunav ul[role=topmenu] li li:nth-child(4){width:100%}
  #ciaunav ul[role=topmenu] li li:nth-child(5){width:100%}
  #ciaunav ul[role=topmenu] li li:nth-child(6){width:100%} 
  #ciaunav ul[role=topmenu] li li:nth-child(7){width:100%}
  /* sub menus from wide view will configure themselves to widest text in sub menu regardless of parent's width */
  
  
/* set top menu dark green if id = class */
  #HPmenu.HPmenu {color:#FFF; background-color:#267DA8;	/* home page */}
  #RVmenu.RVmenu {color:#FFF; background-color:#267DA8;	/* RV */}
  #HCmenu.HCmenu {color:#FFF; background-color:#267DA8;	/* HC */}
  #ACmenu.ACmenu {color:#FFF; background-color:#267DA8;	/* AC */}
  #PSmenu.PSmenu {color:#FFF; background-color:#267DA8;	/* Products & Services */}
  #LRmenu.LRmenu {color:#FFF; background-color:#267DA8;	/* Links & Resources */}
  #ADmenu.ADmenu {color:#FFF; background-color:#267DA8;	/* Advertise with us */}

.iyl_WIDE_SCREEN {display: block;}
.iyl_NARROW_SCREEN {display: none;}

}

@media all and (max-width: 1074px) {	/* 1074 narrow view only  */

.iyl_WIDE_SCREEN {display: none;}
.iyl_NARROW_SCREEN {display: block;}
#ciaunav3 ul {display:block;}

  /* unset top menu dark green if id = class  when in Narrow view */
  Z#HPmenu.HPmenu {background-color:#FFF3CE;	/* home page */}
  Z#RVmenu.RVmenu {background-color:#FFF3CE;	/* RV */}
  Z#HCmenu.HCmenu {background-color:#FFF3CE;	/* HC */}
  Z#ACmenu.ACmenu {background-color:#FFF3CE;	/* AC */}
  Z#PSmenu.PSmenu {background-color:#FFF3CE;	/* Products & Services */}
  Z#LRmenu.LRmenu {background-color:#FFF3CE;	/* Links & Resources */}
  Z#ADmenu.ADmenu {background-color:#FFF3CE;	/* Advertise with us */}

  /* hamburger menu row - not for menu3 */
  #ciaunav > a,#ciaunav2 > a {
	position: relative;
	width:100%;
	height: 38px;	
	padding-top: 18px;	/* affects a tag (both text and icon) */
	/* padding-left:  makes a tag wider than drop downs */
	text-align: left;
	background-color: #e5e5e5; /* light grey */
	font-size:16px; /* size of 'Menu' text button */
	color: #222; /* color of Menu and hamburger button */
	cursor: pointer;
	/* border between Menu row and top level menu buttons */
	border-bottom: 1px solid #bbb;
  }

  .ciaunav_ham1 {	/* settings for 'Menu' word in narrow mode */
	padding-left:8px;	/* push 'Menu' word in from left */
	/*	padding-top: & margin-top: have no affect  */
  }
  #ciaunav > a >i:after, #ciaunav2 > a >i:after { /* like .ciau_hamburger:after - not for menu3 */
	content: "\f0c9";	/*"\f039";=4 bars*/
	font-size: 2em;
	float:right;	/* only works when in inside i tag */
	font-family: FontAwesome;
	font-weight: normal;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	padding-right: 8px; /* push hamburger in from right side */
	margin-top:-10px; /* affects vertical of hamburger icon */
  }

  /* displays button - was initially set display: none above - not for menu3 */
  #ciaunav:not( :target ) > a:first-of-type, #ciaunav:target > a:last-of-type,
  #ciaunav2:not( :target ) > a:first-of-type, #ciaunav2:target > a:last-of-type {
	display: block; /* makes it show */
  }
  /* end hamburger button */
				

  /* first level - not for menu3 */
  #ciaunav > ul, #ciaunav2 > ul {
	height: auto;
	display: none;
  }
	#ciaunav:target > ul, #ciaunav2:target > ul, #ciaunav3:target > ul {
	  display: block;
	}
	  #ciaunav > ul > li, #ciaunav2 > ul > li, #ciaunav3 > ul > li {
		width: 100%;
		float: none; /* ? */
	  }
		#ciaunav > ul > li > a, #ciaunav2 > ul > li > a, #ciaunav3 > ul > li > a {
		  height: auto;
		  text-align: left;
		  padding: 0 0.833em; /* 20 (24) */
		  /* remove Rounded Corners on narrow view top menu items 
		  -moz-border-radius: 0;
		  -webkit-border-radius: 0;
		  -khtml-border-radius: 0;
		  border-radius: 0 ; 
		  */
		}

  /* second level */
  #ciaunav li ul, #ciaunav2 li ul, #ciaunav3 li ul {
	position: static;
  }
  #ciaunav li ul li a, #ciaunav2 li ul li a, #ciaunav3 li ul li a {	/* ident second level menu*/
	text-indent: 1em;  
  }


  #ciaunav2 li ul li a, 
  #ciaunav3 li ul li a, #ciaunav4 li ul li a {	/* set second level menu - narrow view */
	background-color:#D2E4ED; /* light blue - 2nd level menu background */
	color: #004A6F; /* dark blue - text */
  }

	/* third level - NOT in use at present 
	#ciaunav3>ul>li>ul>li:target ul li a,
	#ciaunav3>ul>li>ul>li:hover ul li a {	  
	Zbackground-color:#F00;  TESTING changes 3rd when 2nd hovered 	}
	#ciaunav3 li ul  li ul {
		position: static;	}
	#ciaunav3 li ul li ul li a {	 ident third level menu
		text-indent: 3em;  	}
	*/



	/* highlight 2nd level narrow screen on hover/active */
				#ciaunav li ul li a:hover,
				#ciaunav li ul:not( :hover ) li.active a,
				#ciaunav2 li ul li a:hover,
				#ciaunav2 li ul:not( :hover ) li.active a,
				#ciaunav3 li ul li a:hover,
				#ciaunav3 li ul:not( :hover ) li.active a,
				#ciaunav4 li ul li a:hover,
				#ciaunav4 li ul:not( :hover ) li.active a {
				  color: #FFF;	/* set hover font color not arrow */
				  background-color:#006699; /* dark blue */	
				}









}	/* --- END NARROW VIEW MEDIA --- */

/* no coding required to display toggled items (eg:toggleRV > ul {display:block;} */


/* -- specials for nav4 push down menu - ie not nav1 or 2 or 3 --- */  

/* things similar to used for .ciau_menu_container */
#ciaunav4 * { 
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
    box-sizing: content-box;
}
#ciaunav4 *:before, #ciaunav4 :after { 
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

  #ciaunav4 a { /* !SIZE: set font size for all a tag text in menu (does not affect narrow view top 'Menu' */
    font-size: 14px;
	font-weight:600; /* or bold */
  }
   #ciaunav4 ul,  #ciaunav4 ul li,  #ciaunav4 ul li ul,  #ciaunav4 ul li ul li,  #ciaunav4 ul li ul li ul,  #ciaunav4 ul li ul li ul li {
	padding: 0; 
	/* do NOT specify margin here as causes all sorts of issues on lower sub items */
  }
   #ciaunav4 ul {
	margin: 0px;
  }
	 #ciaunav4 ul li {
	  display:block;	/* overrides dietlicious.css: ul li, ol li, ul.list > li, ol.list > li {display: list-item;}  */
	  margin-bottom: -1px; /* fixes Chrome bug of adding space after 3rd vertical menu item */
	}
	   #ciaunav4 ul li ul li {border:none;  } /* ? does not work stop borders showing on sub levels */


  #ciaunav4 ul {display:block;}
	#ciaunav4:target > ul {
	  display: block;
	}
	  #ciaunav4 > ul > li {
		width: 100%;
		float: none; /* ? */
	  }
		#ciaunav4 > ul > li > a {
		  height: auto;
		  text-align: left;
		  padding: 0 0.833em; /* 20 (24) */
		  /* remove Rounded Corners on narrow view top menu items */
		  -moz-border-radius: 0;
		  -webkit-border-radius: 0;
		  -khtml-border-radius: 0;
		  border-radius: 0 ; 
		}

  /* second level */
  #ciaunav4 li ul {
	position: static;
  }
  #ciaunav4 li ul li a {	/* ident second level menu*/
	text-indent: 1em;  
  }
/* -- END of specials for nav4 push down menu --- */  

.test-colours {  
background-color: #D2E4ED; /* light blue - top level menu background */
background-color: #267DA8; /* medium blue - top level menu background */
background-color: #006699; /* dark blue - 2nd level menu background */
background-color: #999999; /* grey border */
background-color: #004A6F; /* dark blue - text */
}
