/* dropdown nav */

#navigation ul {
font: 0.8em/1.2em Verdana, Arial, Helvetica, sans-serif;
padding: 0px;
margin: 0;
list-style: none;
z-index: 1000;
}

#navigation ul li {
display: block;
width: 225px;
list-style: none;
padding: 0;
margin: 0;
}

#navigation ul li a {
display: block;
padding: 0;
margin: 0;
width: 225px;
height: 30px;
text-decoration: underline;
text-indent: -9000px;
color: #000;
}
#navigation ul a:hover {
background-color: #transparent;
color: #b34800;
text-decoration: none;
}

#sub-navigation ul li{
display: inline;
float: left;
padding: 0;
margin: 0;
width: 100px;
text-decoration: underline;
color: #000;
}

#sub-navigation ul li a {
padding: 0;
margin: 0;
text-decoration: underline;
color: #000;
}
#sub-navigation ul li a:hover {
background-color: #transparent;
color: #b34800;
text-decoration: none;
}

/* ----- splash welcome page----*/
#welcome-nav #navigation ul li.enter a{
background: transparent url(../images/navigation/enter-top.png) left top no-repeat;
}
#welcome-nav #navigation ul li.enter a:hover{
background: transparent url(../images/navigation/enter-bot.png) left top no-repeat;
}

#welcome-nav #navigation ul li.puzzle a{
background: transparent url(../images/navigation/puzzles-top.png) left top no-repeat;
}
#welcome-nav #navigation ul li.puzzle a:hover{
background: transparent url(../images/navigation/puzzles-bot.png) left top no-repeat;
}

#welcome-nav #navigation ul li.email a{
background: transparent url(../images/navigation/email-top.png) left top no-repeat;
}
#welcome-nav #navigation ul li.email a:hover{
background: transparent url(../images/navigation/email-bot.png) left top no-repeat;
}

#welcome-nav #navigation ul li.competition a{
background: transparent url(../images/navigation/competition-top.png) left top no-repeat;
}
#welcome-nav #navigation ul li.competition a:hover{
background: transparent url(../images/navigation/competition-bot.png) left top no-repeat;
}

#welcome-nav #navigation ul li.haveYourSay a{
background: transparent url(../images/navigation/Have-Your-Say-top.png) left top no-repeat;
}
#welcome-nav #navigation ul li.haveYourSay a:hover{
background: transparent url(../images/navigation/Have-Your-Say-bot.png) left top no-repeat;
}

/* ----- splash welcome page----*/




#navigation ul li.home-page-nav a {
background: transparent url(../images/navigation/home-top.png) left top no-repeat;
}
#navigation ul li.home-page-nav a:hover {
background: transparent url(../images/navigation/home-bot.png) left top no-repeat;
}
#home-nav #navigation ul li.home-page-nav a {
background: transparent url(../images/navigation/home-on.png) left top no-repeat;
}


#navigation ul li.at-home-nav a {
background: transparent url(../images/navigation/at-home-top.png) left top no-repeat;
}
#navigation ul li.at-home-nav a:hover {
background: transparent url(../images/navigation/at-home-bot.png) left top no-repeat;
}
#at-home-nav #navigation ul li.at-home-nav a {
background: transparent url(../images/navigation/at-home-on.png) left top no-repeat;
}


#navigation ul li.at-school-nav a {
background: transparent url(../images/navigation/at-school-top.png) left top no-repeat;
}
#navigation ul li.at-school-nav a:hover {
background: transparent url(../images/navigation/at-school-bot.png) left top no-repeat;
}
#at-school #navigation ul li.at-school-nav a {
background: transparent url(../images/navigation/at-school-on.png) left top no-repeat;
}

#navigation ul li.out-about-nav a {
background: transparent url(../images/navigation/out-about-top.png) left top no-repeat;
}
#navigation ul li.out-about-nav a:hover {
background: transparent url(../images/navigation/out-about-bot.png) left top no-repeat;
}
#out-about #navigation ul li.out-about-nav a {
background: transparent url(../images/navigation/out-about-on.png) left top no-repeat;
}

/*out and about navigation*/
#container-out-about-nav {
position: absolute;
top: 20px;
left: 65px;
height: 178px;
}
ul#out-about-nav  {
width: 819px;
display: block;
list-style: none;
padding: 0;
margin: 0;
}
ul#out-about-nav  li{
text-indent: -5000px;
float: right;
height: 178px;
padding: 0;
margin: 0;
}
ul#out-about-nav li.street a{
display: block;
width: 137px;
height: 178px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-top_r1_c1.png) left bottom no-repeat;
}
ul#out-about-nav li.street a:hover{
width:137px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-bot_r1_c1.png) left bottom no-repeat;
}
ul#out-about-nav li.anti a{
display: block;
width: 137px;
height: 178px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-top_r1_c2.png) left bottom no-repeat;
}
ul#out-about-nav li.anti a:hover{
width:137px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-bot_r1_c2.png) left bottom no-repeat;
}
ul#out-about-nav li.lift a{
display: block;
width: 137px;
height: 176px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-top_r1_c3.png) left bottom no-repeat;
}
ul#out-about-nav li.lift a:hover{
width:137px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-bot_r1_c3.png) left bottom no-repeat;
}
ul#out-about-nav li.mobile a{
display: block;
width: 134px;
height: 176px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-top_r1_c4.png) left bottom no-repeat;
}
ul#out-about-nav li.mobile a:hover{
width:134px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-bot_r1_c4.png) left bottom no-repeat;
}
ul#out-about-nav li.public a{
display: block;
width: 136px;
height: 176px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-top_r1_c5.png) left bottom no-repeat;
}
ul#out-about-nav li.public a:hover{
width:136px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-bot_r1_c5.png) left bottom no-repeat;
}
ul#out-about-nav li.taxi a{
display: block;
width: 139px;
height: 176px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-top_r1_c6.png) left bottom no-repeat;
}
ul#out-about-nav li.taxi a:hover{
width:139px;
background: transparent url(../images/navigation/out-about-nav/out-about-nav-bot_r1_c6.png) left bottom no-repeat;
}












