/* Info Menu Tabs */ .topinfomenu { list-style-type: none; display: block; width: 433px; height: 37px; left:369px; top:0px; } .topinfomenu li { float: left; display:block; height:37px;} .topinfomenu li a { display:block; height:37px; text-indent: -9000px; background: url(../images/stgerards-infomenu.jpg) 0 0 no-repeat; margin:0; padding:0; } .topinfomenu li a:hover { background: url(../images/stgerards-infomenu.jpg) 0 0 no-repeat;} /* Info Menu Normal States */ .topinfomenu li#home-nav a { width: 67px; background-position: 0 0 ;} .topinfomenu li#news-nav a { width: 55px; background-position: -67px 0 ;} .topinfomenu li#events-nav a { width: 59px; background-position: -122px 0 ;} .topinfomenu li#contact-nav a { width: 69px; background-position: -181px 0 ;} .topinfomenu li#location-nav a { width: 78px; background-position: -250px 0 ;} .topinfomenu li#partners-nav a { width: 105px; background-position: -328px 0 ;} /* Info Menu On Mouse-Over */ .topinfomenu li#home-nav a:hover { background-position: 0 -37px ;} .topinfomenu li#news-nav a:hover { background-position: -67px -37px ;} .topinfomenu li#events-nav a:hover { background-position: -122px -37px ;} .topinfomenu li#contact-nav a:hover {background-position: -181px -37px ;} .topinfomenu li#location-nav a:hover {background-position: -250px -37px ;} .topinfomenu li#partners-nav a:hover { background-position: -328px -37px ;} /* Info Menu On Page-Highlight */ #home .topinfomenu li#home-nav a { background-position: 0 -74px ;} #news .topinfomenu li#news-nav a { background-position: -67px -74px ;} #events .topinfomenu li#events-nav a { background-position: -122px -74px ;} #contact .topinfomenu li#contact-nav a {background-position: -181px -74px ;} #location .topinfomenu li#location-nav a {background-position: -250px -74px ;} #partners .topinfomenu li#partners-nav a { background-position: -328px -74px ;} /* Main Categories Menu */ #mainmenu { background: #fff; padding: 5px; position: relative; margin-bottom: 10px; font-family: trebuchet ms, verdana, arial, sans-serif;} #mainmenu ul#mainnav {z-index: 20; width: 439px; height: 73px; position: absolute; list-style-type:none; display: block; background: url(../images/mainmenu.jpg) 0 -73px no-repeat; margin-left:1px;} #mainmenu ul#mainnav li {display: block; width: 73px; height: 73px; float:left;} #mainmenu ul#mainnav li a {display: block; width: 73px; height: 73px; font-size: 0.7em; line-height: 1.1em; text-align: center; color: #fff;} #mainmenu ul#mainnav li a:hover , #about #mainmenu ul#mainnav li#about-nav a, #senior #mainmenu ul#mainnav li#senior-nav a, #junior #mainmenu ul#mainnav li#junior-nav a, #performance #mainmenu ul#mainnav li#performance-nav a, #admission #mainmenu ul#mainnav li#admission-nav a, #fees #mainmenu ul#mainnav li#fees-nav a { font-size: 0.9em; font-weight: bold; background: url(../images/mainmenu.jpg) 0 0 no-repeat;} #mainmenu ul#mainnav li a span {display: block; bottom: -1px; left:0; position:absolute; width: 73px; height: 20px; background: url(../images/about-bg.png) top right repeat; padding: 5px 0; } #mainmenu h1 {text-align: right; z-index: 10; background: #002673 url(../images/h1-general.jpg) top right no-repeat; border: 1px solid white; width: 100%; height: 112px;} #mainmenu h1 span { display: block; background: red; width: /*770px*/ 334px; right: 0px; bottom: 0px; position: absolute; padding: 10px; background: url(../images/about-bg.png) top right repeat; color: #fff;} /* Personalised Main Menu */ /* On-page highligh and mouse-over highlight changes background image */ #about #mainmenu ul#mainnav li#about-nav a, #mainmenu ul li#about-nav a:hover {background-position: 0px 0; } #senior #mainmenu ul#mainnav li#senior-nav a, #mainmenu ul li#senior-nav a:hover {background-position: -73px 0;} #junior #mainmenu ul#mainnav li#junior-nav a, #mainmenu ul li#junior-nav a:hover {background-position: -146px 0; color: #002673} #performance #mainmenu ul#mainnav li#performance-nav a, #mainmenu ul li#performance-nav a:hover {background-position: -219px 0} #admission #mainmenu ul#mainnav li#admission-nav a, #mainmenu ul li#admission-nav a:hover {background-position:-292px 0; color: #002673 } #fees #mainmenu ul#mainnav li#fees-nav a, #mainmenu ul li#fees-nav a:hover {background-position:-365px 0 } /* Colour Coding of the transparent panel on Main menu text*/ #mainmenu ul#mainnav li#about-nav a span {background: url(../images/about-bg.png) top right repeat;} #mainmenu ul#mainnav li#senior-nav a span {background: url(../images/senior-bg.png) top right repeat;} #mainmenu ul#mainnav li#junior-nav a span {background: url(../images/junior-bg.png) top right repeat;} #mainmenu ul#mainnav li#performance-nav a span {background: url(../images/performance-bg.png) top right repeat;} #mainmenu ul#mainnav li#admission-nav a span {background: url(../images/admission-bg.png) top right repeat;} #mainmenu ul#mainnav li#fees-nav a span {background: url(../images/fees-bg.png) top right repeat;} /* Personalised Header Background per Category */ #about #mainmenu h1 {background: #002673 url(../images/h1-about.jpg) top right no-repeat;} #senior #mainmenu h1 {background: #005422 url(../images/h1-senior.jpg) top right no-repeat;} #junior #mainmenu h1 {background: #FF7F00 url(../images/h1-junior.jpg) top right no-repeat;} #performance #mainmenu h1 {background: #B30101 url(../images/h1-performance.jpg) top right no-repeat;} #admission #mainmenu h1 {background: #BBB753 url(../images/h1-admission.jpg) top right no-repeat;} #fees #mainmenu h1 {background: #641847 url(../images/h1-fees.jpg) top right no-repeat;} /* Colour Coding of the transparent panel on the title background */ #about #mainmenu h1 span {background: url(../images/about-bg.png) top right repeat;} #senior #mainmenu h1 span {background: url(../images/senior-bg.png) top right repeat;} #junior #mainmenu h1 span {background: url(../images/junior-bg.png) top right repeat;} #performance #mainmenu h1 span {background: url(../images/performance-bg.png) top right repeat;} #admission #mainmenu h1 span {background: url(../images/admission-bg.png) top right repeat;} #fees #mainmenu h1 span {background: url(../images/fees-bg.png) top right repeat;} /* Sub-Menu */ #mainmenu ul#submenu {z-index: 20; width: 439px; height: 73px; top:81px; left:8px; position: absolute; list-style-type:none; display: block; margin-left:1px;} #mainmenu ul#submenu li {display: block; float:left;} #mainmenu ul#submenu li a {display: block; padding: 10px; font-size: 1em; line-height: 1.1em; text-align: center; color: #BEC9DE;} #mainmenu ul#submenu li a:hover { color: #001F61; background: #BEC9DE;} /* Colours for Sub-Menu */ #about #mainmenu ul#submenu li a:hover {color: #BEC9DE; background: #001F61;} #about #mainmenu ul#submenu li a { color: #001F61; background: #BEC9DE;} #senior #mainmenu ul#submenu li a:hover {color: #769984; background: #005422;} #senior #mainmenu ul#submenu li a { color: #005422; background: #769984;} #junior #mainmenu ul#submenu li a:hover {color: #FFE1A0; background: #FF7F00;} #junior #mainmenu ul#submenu li a { color: #FF7F00; background: #FFE1A0;} #performance #mainmenu ul#submenu li a:hover {color: #CB8383; background: #B30101;} #performance #mainmenu ul#submenu li a {color: #B30101; background: #CB8383;} #admission #mainmenu ul#submenu li a:hover {color: #FEFAC8; background: #BBB753;} #admission #mainmenu ul#submenu li a { color: #BBB753; background: #FEFAC8;} #fees #mainmenu ul#submenu li a:hover {color: #B8A1B6; background: #641847;} #fees #mainmenu ul#submenu li a { color: #641847; background: #B8A1B6;}