body {
background: #235b00;
font-family: "Lucida Grande", "Lucida Sans Unicode", Tahoma, Arial, Serif;
color: #111;
}

#container {
position: relative;
z-index: 6000;
}

.bg {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 5000;
}


/* general stuff */

img {
border: none;
}

a {
color:#fff;
text-decoration: none;
border-bottom: 1px dashed #fff;
}

a:visited {
color:#fff;
text-decoration: none;
border-bottom: 1px dashed #fff;
}

a:hover {
text-decoration: none;
border-bottom: 1px solid #fff;
}


/* rollover buttons bit */

#twit-nav {
width: 250px;
height: 75px;
background: #fff;
border: 3px solid #ccc;
-moz-border-radius: 20px;
border-radius: 20px;
border-top: 0;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
margin-right: 10px;
float: right;
display: inline;
}

#twit-nav ul {
padding: 10px 0 0 10px;
}

#twit-nav ul li {
display: inline;
}

#twit-nav a#nav-cycling {
background: url(../images/nav-cycling.gif) no-repeat top left;
}

#twit-nav a#nav-motor {
background: url(../images/nav-motor.gif) no-repeat top left;
}

#twit-nav a#nav-cricket {
background: url(../images/nav-cricket.gif) no-repeat top left;
}

#twit-nav a#nav-strictly {
background: url(../images/nav-strictly.gif) no-repeat top left;
}

#twit-nav a {
position:relative; /*this is the key*/
z-index:24; 
color:#000;
text-decoration:none;
width: 50px;
height: 50px;
display: block;
float: left;
display: inline;
margin-right: 10px;
font-size: 70%;
line-height: 1.4em;
}

#twit-nav a:hover{ 
z-index:25; 
background-color:#ff0;
}

#twit-nav a span{
display: none;
}

#twit-nav a:hover span { /*the span will display just on :hover state*/
display:block;
position:absolute;
top:50px; 
left:0; 
width:120px;
padding: 10px;
background:#fff;
border: 3px solid #ccc;
-moz-border-radius: 10px;
border-radius: 10px; 
color:#000;
text-align: center;
}


/* header */

#header {
padding-top: 100px;
}

#header, #nav {
height: 100px;
color: #000;
}

#header p {
font-size: 80%;
margin-top: 5px;
padding-left: 40px;
text-transform: uppercase;
}

h1 {
font-size: 330%;
font-weight: normal;
font-family: Georgia, "Times New Roman", serif;
margin-left: 10px;
}

#nav {
padding-top: 25px;
text-align: right;
line-height: 160%;
font-size: 90%;
font-family: Georgia, "Times New Roman", serif;
}

#nav p {
margin: 15px 20px 0 0;
}

#nav a, #header a {
color:#000;
text-decoration: none;
border: 0;
}

#nav a:visited, #header a:visited {
color:#000;
text-decoration: none;
border: 0;
}

#nav a:hover, #header a:hover {
color:#000;
text-decoration: underline;
border: 0;
}


/* content */

.info {
-moz-border-radius: 20px;
border-radius: 20px;
padding-top: 20px;
background: #0f3100;
color: #fff;
}

.info h2, .info h3, .info h4, .info p {
padding: 0 20px;
}

.info img {
padding: 0 0 20px 20px;
}

.info h2 {
font-family: Georgia, "Times New Roman", serif;
font-size: 165%;
font-weight: normal;
margin-bottom: 20px;
color: #fff;
}

.info h3 {
font-family: Georgia, "Times New Roman", serif;
font-size: 140%;
font-weight: normal;
margin-bottom: 5px;
color: #fff;
}

.info p {
font-size: 80%;
margin-bottom: 20px;
line-height: 150%;
}

.info p.small {
font-size: 60%;
}

.info ul {
list-style: none;
font-size: 80%;
padding: 0 20px 20px 20px;
}

.info li {
line-height: 160%;
white-space: nowrap;
}

.info li.au {
padding-left: 22px;
background: url(../images/au.gif) no-repeat 0 6px;
}

.info li.gb {
padding-left: 22px;
background: url(../images/gb.gif) no-repeat 0 6px;
}

.info li.nl {
padding-left: 22px;
background: url(../images/nl.gif) no-repeat 0 6px;
}

.info li.nz {
padding-left: 22px;
background: url(../images/nz.gif) no-repeat 0 6px;
}

.info li.za {
padding-left: 22px;
background: url(../images/za.gif) no-repeat 0 6px;
}


/* footer */

#footer {
margin: 30px 10px;
font-size: 80%;
}