﻿/* COMMUNITY LENDING. Menu design - colours, images */

/* Top
-------------------------------- */

/* Top images - specific */
#mainnav li#mainnav-1 a.top span,
#mainnav li#mainnav-1 strong.top span {
	background-image: url(img/cl-nav01.gif);
	}
#mainnav li#mainnav-2 a.top span,
#mainnav li#mainnav-2 strong.top span {
	background-image: url(img/cl-nav02.gif);
	}
#mainnav li#mainnav-3 a.top span,
#mainnav li#mainnav-3 strong.top span {
	background-image: url(img/cl-nav03.gif);
	}
#mainnav li#mainnav-4 a.top span,
#mainnav li#mainnav-4 strong.top span {
	background-image: url(img/cl-nav04.gif);
	}
#mainnav li#mainnav-5 a.top span,
#mainnav li#mainnav-5 strong.top span {
	background-image: url(img/cl-nav05.gif);
	}
#mainnav li#mainnav-6 a.top span,
#mainnav li#mainnav-6 strong.top span {
	background-image: url(img/cl-nav06.gif);
	}

/* Top image - shared */
/*
#mainnav a {
	background-image: url("img/navshared.gif");
	}
*/

/* Top roll - Colours */
#mainnav a {
	background-color: #003698;
	color: #90b0da;
	}
#mainnav a:link {
	background-color: #003698;
	color: #90b0da;
	}
#mainnav a:visited {
	color: #90b0da;
	}
#mainnav a:focus {
	background-color: #003698;
	color: #fff;
	}
#mainnav a:hover {
	background-color: #003698;
	color: #fff;
	}
#mainnav a:active {
	background-color: #003698;
	color: #fff;
	}

/* Roll hold over - colours */
#mainnav li.over a.over-parent, /* JavaScript reliant */
#mainnav li:hover>a {/* CSS reliant */
	background-color: #003698;
	color: #fff;
	}

/* Current page selected - colour */
#mainnav strong.top {
	background-color: #003698;
	color: #3086c9;
	}


/* Image rollover */
#mainnav a:link span {
	background-position: 0 0;
	}
#mainnav a:focus span {
	background-position: 0 -110px;
	}
#mainnav a:hover span {
	background-position: 0 -110px;
	}
#mainnav a:active span {
	background-position: 0 -110px;
	}

/* Roll hold over - image */
/* JavaScript reliant */
#mainnav li.over a.over-parent span {
	background-position: 0 -110px;
	}
/* CSS reliant */
#mainnav li:hover>a span {
	background-position: 0 -110px;
	}


/* Top image roll - section on */
#mainnav li.active a.top span {
	background-position: 0 -110px;
	}
#mainnav li.active a.top:link span {
	background-position: 0 -110px;
	}
#mainnav li.active a.top:focus span {
	background-position: 0 -110px;
	}
#mainnav li.active a.top:hover span {
	background-position: 0 -110px;
	}
#mainnav li.active a.top:active span {
	background-position: 0 -110px;
	}

/* Hold  roll over - image */
/* JavaScript reliant */
#mainnav li.active a.over-parent span {
	background-position: 0 -110px !important;
	}
/* CSS reliant */
#mainnav li.active:hover>a.top span {
	background-position: 0 -110px;
	}

/* Current page selected - image */
#mainnav strong.top span {
	background-position: 0 -110px;
	}


/* Sub (overrides above)
----------------------------------------- */

/* Roll - section inactive */
#mainnav li li a { 
	border-top: solid 1px #7abcff;
	border-right: solid 1px #2673c0;
	border-bottom: solid 1px #2673c0;
	border-left: solid 1px #7abcff;
	background-color: #3399ff;
	color: #fff;
	background-repeat: no-repeat;
   	background-position: 0px 1px;
	}
#mainnav li li a:link {
	background-position: 0px 1px;
	background-color: #3399ff;
	color: #fff;
	}
#mainnav li li a:visited {
	color: #fff;
	}
#mainnav li li a:focus {
	background-position: -180px 1px;
	background-color: #3399ff;
	color: #fff;
	}
#mainnav li li a:hover {
	background-position: -180px 1px;
	background-color: #0281ff;
	color: #fff;
	}
#mainnav li li a:active {
	background-position: -180px 1px;
	background-color: #0281ff;
	color: #fff;
	}

/* Hold roll */
/* JavaScript reliant */
#mainnav li li.over a.over-parent {
   	background-position: -180px 1px !important;
	background-color: #0281ff !important;
	color: #fff !important;
	}
/* CSS reliant */
#mainnav li li:hover>a {
	background-position: -180px 1px !important;
	background-color: #0281ff !important;
	color: #fff !important;
	}


/* Parent - alt image */
/* JavaScript reliant */
#mainnav li li a.parent {
	background-image: url("img/parent.gif");
	}
/* CSS reliant */
#mainnav li li>a.parent {
	background-image: url("img/parent.gif");
	}


/* Current page selected - alt colour/image */
#mainnav li li strong { 
	background-position: -360px 1px;
/*	background-position: -360px 1; */
	border-bottom: solid 1px #3086c9;
	background-color: #3086c9;
	color: #fff;
	}
/* Current page selected - section active - alt colour */
/*
#mainnav li.active li strong {
	background-image: url("img/sub-selected.gif");
	background-color: #060;
	color: lime;
	}
*/

/* Current page selected - parent - alt image */
/* JavaScript reliant */

#mainnav li li strong.parent {
	background-image: url("img/parent.gif");
	}

/* CSS reliant */

#mainnav li li.parent>strong {
	background-image: url("img/parent.gif");
	}
	
/* level 1 */
#subnav li.parent a.top,
#subnav li.parent strong.top {
	background-image: url("img/parent.gif");
	}	

/* level 2 */
#mainnav li li.parent a,
#mainnav li li.parent strong {
	background-image: url("img/parent.gif");
	}
	#mainnav li li.parent li a,
	#mainnav li li.parent li strong {
	background-image: none;
	}

/* level 3 */
#mainnav li li li.parent a,
#mainnav li li li.parent strong {
	background-image: url("img/parent.gif");
	}
	#mainnav li li li.parent li a,
	#mainnav li li li.parent li strong {
	background-image: none;
	}

