/* background colours in 2 lines below do not affect the background colours */
ul#css3menu2, ul#css3menu2 ul{margin:0;list-style:none;padding:0;background-color:#FFFFFF;border-width:0;border-style:solid;border-color:transparent;}
ul#css3menu2 ul{display:none;position:absolute;left:0;top:100%;background-color:#0161a4;border-width:3px;border-style:solid none none none;border-color:black;padding:0;}
ul#css3menu2 li:hover>*{display:block;}
li.homebutt {background-color:white;}
ul#css3menu2 li{position:relative;display:block;white-space:nowrap;font-size:0;float:left;}
ul#css3menu2 li:hover{z-index:1;}
ul#css3menu2{font-size:0;width:100%;z-index:999;position:relative;display:inline-block;padding:0 0%;margin:0 0%;-moz-border-radius:0px;-webkit-border-radius:0px;border-radius:0px;}	
* html ul#css3menu2 li a{display:inline-block;}
ul#css3menu2>li{margin:0;width:25%;}
body:first-of-type ul#css3menu2{display:inline-table;border-spacing:0px 0;}
body:first-of-type ul#css3menu2>li{display:table-cell;float:none;}
ul#css3menu2 a:active, ul#css3menu2 a:focus{outline-style:none;}
ul#css3menu2 a{display:block;vertical-align:middle;text-align:center;text-decoration:none;font:bold 14px Arial,Helvetica,sans-serif; color:#FFFFFF; cursor:pointer;padding:7px 15px 9px 15px;background-color:transparent;background-repeat:repeat; border-width:0px; border-style:none;border-color:transparent;}

ul#css3menu2 ul li{float:none;margin:0;}

/*line below has 1px right border */
ul#css3menu2 li.topmenu>a{background-color:#0b8ee9;border-width:3px 1px 0 0;border-style:solid;border-color:transparent white transparent transparent;-moz-border-radius:0px;-webkit-border-radius:0px;border-radius:0px;
moz-box-shadow: 0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;
-webkit-box-shadow: 0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;
box-shadow: 0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;
background-image: -o-linear-gradient(-90deg,rgba(44,160,202,0),rgba(0,0,0,0.13));
background-image: -moz-linear-gradient(-90deg,rgba(44,160,202,0),rgba(0,0,0,0.13));
background-image: -webkit-gradient(linear,50% 0%,50% 100%,from(rgba(44,160,202,0)),to(rgba(0,0,0,0.13)));
background-image: -webkit-linear-gradient(-90deg,rgba(44,160,202,0),rgba(0,0,0,0.13));
-moz-transition: all 0.5s;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
overflow: hidden;
}
ul#css3menu2 li.topmenu>a.logop {background-color:white; padding:0;}
ul#css3menu2 li.topmenu:hover>a, ul#css3menu2 li.topmenu a.pressed{/*background-color:#0b8ee9;border-style:solid;border-color:#000000 transparent transparent transparent;*/
 -moz-box-shadow:0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;-webkit-box-shadow:0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;box-shadow:0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;background-color:#ffffff;background-image:-o-linear-gradient(-90deg,rgba(0,0,0,0.13),rgba(44,160,202,0));background-image:-moz-linear-gradient(-90deg,rgba(0,0,0,0.13),rgba(44,160,202,0));background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(0,0,0,0.13)),to(rgba(44,160,202,0)));background-image:-webkit-linear-gradient(-90deg,rgba(0,0,0,0.13),rgba(44,160,202,0));border-style:solid;border-color:#186F8F}
/* line below sets the background colour of the last item in the list */
ul#css3menu2 li.toplast>a{background-color:#0b8ee9;border-width:3px 0 0 0;border-style:solid;border-color:transparent transparent transparent transparent;-moz-border-radius:0px;-webkit-border-radius:0px;border-radius:0px;
moz-box-shadow: 0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;
-webkit-box-shadow: 0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;
box-shadow: 0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;
background-image: -o-linear-gradient(-90deg,rgba(44,160,202,0),rgba(0,0,0,0.13));
background-image: -moz-linear-gradient(-90deg,rgba(44,160,202,0),rgba(0,0,0,0.13));
background-image: -webkit-gradient(linear,50% 0%,50% 100%,from(rgba(44,160,202,0)),to(rgba(0,0,0,0.13)));
background-image: -webkit-linear-gradient(-90deg,rgba(44,160,202,0),rgba(0,0,0,0.13));
-moz-transition: all 0.5s;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
overflow: hidden;
}
ul#css3menu2 li.toplast:hover>a, ul#css3menu2 li.toplast a.pressed{/* OLD 30 Apr 2015 background-color:#0b8ee9;border-style:solid;border-color:#000000 transparent transparent transparent;*/
 -moz-box-shadow:0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;-webkit-box-shadow:0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;box-shadow:0 1px 0 #7FD2F1 inset, 0 1px 0 #FFFFFF;background-color:#ffffff;background-image:-o-linear-gradient(-90deg,rgba(0,0,0,0.13),rgba(44,160,202,0));background-image:-moz-linear-gradient(-90deg,rgba(0,0,0,0.13),rgba(44,160,202,0));background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(0,0,0,0.13)),to(rgba(44,160,202,0)));background-image:-webkit-linear-gradient(-90deg,rgba(0,0,0,0.13),rgba(44,160,202,0));border-style:solid;border-color:#186F8F}
/*not sure if this line below is necessary - but it affects the top menu not the drop downs */
ul#css3menu2 li:hover>a, ul#css3menu2 li a.pressed{border-style:none;color:#000000;text-decoration:none;}
/* colours and backgrounds of the drop down menu items */
ul#css3menu2 ul a {text-align:center;padding:9px;background-color:#0161a4;border-width:0 0 1px 0;border-style:solid;border-color:#313030;-moz-border-radius:0px;-webkit-border-radius:0px;border-radius:0px;font:13px Arial,Helvetica,sans-serif;color:white;text-decoration:none;}

ul#css3menu2 li.subtop {display:block;vertical-align:middle;text-align:center;text-decoration:none;font: normal 13px Arial,Helvetica,sans-serif;color:#000000;padding:7px 15px 9px 15px;background-color:white;border-width:0px;border-style:none;}

/* colours and backgrounds of drop down menu item hover pressed behaviour */
ul#css3menu2 ul li:hover>a, ul#css3menu2 ul li a.pressed{background-color:#0161a4;border-style:solid;border-color:#313030;color:#000000;text-decoration:none; background-image: none;box-shadow:none;}
/* line below sets the background colours and other features of the top category menu items except the last item in the list */
/* OLD 30Apr2015 ul#css3menu2 li.topmenu>a{background-color:#0b8ee9;border-width:3px 0 0 0;border-style:solid;border-color:transparent transparent transparent transparent;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;}*/
/* was 20 16 16 16 16 16 */
ul#css3menu2>li:nth-child(1){width:12%}
ul#css3menu2>li:nth-child(2){width:16%}
ul#css3menu2>li:nth-child(3){width:15%}
ul#css3menu2>li:nth-child(4){width:11%}
ul#css3menu2>li:nth-child(5){width:11%}
ul#css3menu2>li:nth-child(6){width:18%}
ul#css3menu2>li:nth-child(7){width:17%}
/* @-moz-document url-prefix(){body:first-of-type ul#css3menu2 {display:inline-block}body:first-of-type ul#css3menu2>li{display:block;float:left !important;}}*/
@media handheld, only screen and  (max-width: 767px) {
ul#css3menu2>li:nth-child(1){width:40%}
ul#css3menu2>li:nth-child(2){width:30%}
ul#css3menu2>li:nth-child(3){width:30%}
	ul#css3menu2>li:nth-child(3) a {border-right-color: #0b8ee9;border-right-width:1px}
ul#css3menu2>li:nth-child(4){width:23%}
ul#css3menu2>li:nth-child(5){width:17%}
ul#css3menu2>li:nth-child(6){width:30%}
ul#css3menu2>li:nth-child(7){width:30%}	
body:first-of-type ul#css3menu2{display:inline-block}
body:first-of-type ul#css3menu2>li{display:block;float:left !important;}	
/*  line below fixes issue with gallery drop down when less than 700px being half hidden */	
ul#css3menu2>li:nth-child(3) ul {left:auto;right:0;}
}	
@media screen and (min-width: 197px) and (max-width: 391px) {
ul#css3menu2>li:nth-child(1){width:50%}
ul#css3menu2>li:nth-child(2){width:50%}
	ul#css3menu2>li:nth-child(2) a {border-right-color: #0161a4;border-right-width:1px}
ul#css3menu2>li:nth-child(3){width:50%}
	ul#css3menu2>li:nth-child(3) a {border-right-color:white;border-right-width:1px }	
		ul#css3menu2>li:nth-child(3) ul li a {border-right-color:#0161a4;border-right-width:1px }	
ul#css3menu2>li:nth-child(4){width:30%}
ul#css3menu2>li:nth-child(5){width:20%}
	ul#css3menu2>li:nth-child(5) a {border-right-color:#0161a4;border-right-width:1px}
ul#css3menu2>li:nth-child(6){width:50%}
ul#css3menu2>li:nth-child(7){width:50%}
 body:first-of-type ul#css3menu2{display:inline-block}
body:first-of-type ul#css3menu2>li{display:block;float:left !important;}
	/*  line below fixes issue with gallery drop down when less than 700px being half hidden */
ul#css3menu2>li:nth-child(3) ul {left:0;right:auto;}
}
