﻿html
{
	height: 100%;
	font-family: Arial;
}

body
{
	height: 100%;
	margin: 0;
	padding: 0;
	background-color: #d1d2d4;
	color: White;
	background-repeat: repeat-x;
	background-image: url(Images/BackgroundMain.png);
	background-position: -200px 0px;
	text-align: center;
	min-width: 840px;
	font-family: Arial;
}

td
{
	vertical-align: top;
	color: #000000;
	font-family: Arial;
}


/* Styles for layout of main screen content */

div
{
	vertical-align: top;
	text-align: left;
	color: #000000;
	background-color: Transparent;
	font-family: Arial;
}

#CentredDiv
{
	position: relative;
	width: 840px;
	height: 800px;
	margin-left: auto;
	margin-right: auto;
}

#LeftMenuArea
{
	width: 175px;
	height: 400px;
	position: absolute;
	left: 0px;
	top: 125px;
}

#PageTitle
{
	position: absolute;
	left: 0px;
	top: 0px;
}

#PageSubTitle
{
	position: absolute;
	left: 340px;
	top: 25px;
}

#Cartoon
{
	position: absolute;
	left: 160px;
	top: 360px;
}

#MainContentAreaFrame /* div containing frame around content */
{
	position: absolute;
	left: 175px;
	top: 90px;
	width: 500px;
	height: 265px;
	background-repeat: no-repeat;
	background-image: url(Images/ContentBorder.png);
}

#MainContentArea /* div containing content */
{
	position: absolute;
	left: 9px;
	top: 10px;
	width: 480px;
	height: 240px;
	text-align: left;
	z-index: 1;
 }

#AdvertisingIFrame
{
	position: absolute;
	left: 1px;
	top: 2px;
	width: 480px;
	height: 240px;
	vertical-align: middle;
	text-align: center;
	background-color: Transparent;
	padding: 0px 0px 0px 0px;
}

#AdvertisingIFrame2
{
	position: relative;
	width: 141px;
	height: 160px;
	vertical-align: middle;
	text-align: center;
	background-color: Transparent;
	padding: 0px 0px 0px 0px;
}

.ContentControl /* Style to make each content control the same size */
{
	position:relative;
	width: 480px;
	height: 240px;
}

#RightMenuArea
{
	position: absolute;
	left: 683px;
	top: 30px;
	width: 150px;
}

#FooterMenuArea
{
	position: absolute;
	left: 0px;
	top: 754px;
	width: 850px;
	font-family: Arial;
	font-size: 8pt;
	color: Black;
	text-align: center;
}

.Hover
{
	z-index: 100;
	background-color: White;
	width:150px;
	margin: 2px 2px 2px 2px;
}

/* Styles for form guide selection */
 
.ContentSelector_RightList
{
	position: absolute; 
	top: 30px; 
	left: 280px;
	width:190px;
	height:200px;
	font-family: Arial;
	font-size: 10pt;
	color: white;
	background-color: #9999cc;
	padding: 4px 4px 4px 4px;
}
 
.ContentSelector_LeftList
{
	position:absolute;
	top: 48px; 
	left: 5px;
	width:276px;
	height:196px;
	font-family: Arial;
	font-size: 10pt;
	text-align:left;
	overflow: auto;
}
 
.ContentSelector_LeftListNormal
{
	color: white;
}
.ContentSelector_LeftListNormal input
{
	color: white;
}
.ContentSelector_LeftListNormal:hover
{
 	background-color: #aaaadd;
}
.ContentSelector_LeftListNormal:hover  input
{
  	color:Black;
}

.ContentSelector_LeftListSelected
{
 	background-color: #9999cc;
}
.ContentSelector_LeftListSelected input
{
 	color: black;
 	font-weight:bold;
 }


/* Styles for other meet selectors - eg basic form */

.MeetSelector
{
	position:absolute;
	top: 40px; 
	left: 0px;
	width:480px;
	height:200px;
	font-family: Arial;
	font-size: 10pt;
	text-align:left;
	overflow:auto;
}

.MeetSelectorRow
{
 	font-family: Arial;
	font-size: 10pt;
	color: white;
}
.MeetSelectorRow input
{
	color: white;
}
.MeetSelectorRow a
{
	color: white;
}

.MeetSelectorRow:hover
{
	background-color: #aaaadd;
	color: black;
}
.MeetSelectorRow:hover input
{
	color: black;
}
.MeetSelectorRow:hover a
{
	color: black;
}


/* Styles for left menu buttons */

.LeftMenuHeaderDiv
{
	overflow: hidden;
}

.LeftMenuContentDiv
{
	overflow: hidden;
}

.LeftMenuButton
{
	position: relative;
 	margin-bottom: 1px;
 	margin-top: 2px;
 	padding: 0 0 0 0;
}

.LeftMenuSubButton
{
	border: solid 1px white;
	background-color: #9999cc;
	color: Black;
	font: 9pt verdana;
	width: 153px;
	height: 22px;
	position: relative;
	left: 9px;
 	margin-bottom: 1px;
 	padding: 0 0 0 0;
 	cursor: pointer;
 }

.LeftMenuSubButton:hover
{
	border: solid 1px white;
	background-color: red;
	color: white;
	font: 9pt verdana;
}


/* Styles for right menu */

#RightMenuBackground
{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 140px;
	height: 600px;
	font: normal 10pt Arial;
	padding: 0px;
	margin: 0px;
	background-image: url(images/RightMenu_TodaysRacingHeading.png);
	background-repeat:no-repeat;
 }

#RightMenuRacingAndLinks
{
	position: absolute;
	left: 0px;
	top: 25px;
	width: 140px;
	height: 350px;
 }

#RightMenuTodaysRacingList
{
	width: 138px;
	height: 265px;
	position: relative;
	left: 1px;
	top: 1px;
}

.RightMenuTodaysRacingItem
{
	position: relative;
	font: bold 8pt Arial;
	width: 134px;
	height: 20px;
	margin-left: 2px;
	margin-right: 2px;
	margin-top: 1px;
	margin-bottom: 0px;
	padding-left: 3px;
	background-color: #8cb5d3;
	vertical-align: middle;
	border: none;
	text-align: left;
}

.RightMenuTodaysRacingItemNormal:hover
{
}

.RightMenuTodaysRacingItemActive:hover
{
	background-color: #1b2777;
	color: White;
}

#RightMenuPopularLinks
{
	position: absolute;
	left: 4px;
	top: 245px;
	width: 132px;
	height: 120px;
	background-repeat: repeat;
	background-image: url(Images/RightMenu_PopularLinksBackground.png);
}

#RightMenuPopularLinksItemList
{
	position: relative;
	left: 0px;
	top: 0px;
	width: 130px;
	font: normal 8pt Arial;
}

#RightMenuPopularLinksItemList div
{
	position: relative;
	left: 1px;
	top: 0px;
	margin-bottom:2px;
 	white-space:nowrap;
}

.RightMenuPopularLinksItem
{
}
  
#RightMenuAdvertising
{
	position: absolute;
	left: 0px;
	top: 400px;
	width: 160px;
	height: 160px;
	background-color: Transparent;
}

/* Styles for cartoon & speech bubble */

.CartoonArea
{
	position: relative;
	height: 350px;
	width: 510px;
 }

.SpeechBubbleArea
{
	left: 193px;
	top: 22px;
	width: 293px;
	height: 148px;
	position: relative;
	z-index: 1;
 }
 
#ManImage
{
	top: 5px;
	left: 20px;
	position: absolute;
}

#SpeechImage
{
	top: 10px;
	left: 113px;
	position: absolute;
	z-index: 0;
}

.Link
{
	color: #000000;
	font-family: Verdana;
	font-size: 9pt;
	font-weight: normal;
	height:20px;
  }

.Link a
{
	text-decoration: none;
	color: #000000;
}

.Link a:hover
{
	text-decoration: underline;
	color: #000000;
}

.LinkText
{
	position:relative;
	top:-3px;
	left:2px;
	color: #000000;
}

.SpeechBubbleItem /* Style for table cell containing each item of text */
{
	width: 142px;
	height: 148px;
	color: Black;
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 3px;
 	border-right-color: Gray;
	border-right-width: 1px;
	position: absolute;
	z-index: 2;
	text-align: center;
}

.SpeechBubbleTrack /* Style for speech bubble content text */
{
	color: #000000;
	font-family: Arial;
	font-size: 11pt;
	font-weight: bold;
	position: relative;
	z-index: 3;
	padding-bottom:6px;
	text-align: center;
	width: 142px;
}

.SpeechBubbleRace /* Style for speech bubble content text */
{
	color: #000000;
	font-family: Arial;
	font-size: 11pt;
	font-weight: bold;
	position: relative;
	z-index: 3;
	padding-bottom:6px;
	text-align: center;
	width: 142px;
}

.SpeechBubbleBet /* Style for speech bubble content text */
{
	color: #000000;
	font-family: Verdana;
	font-size: 9pt;
	font-weight: normal;
	position: relative;
	z-index: 3;
	padding-bottom:5px;
	text-align: center;
	width: 142px;
}

.SpeechBubbleComment /* Style for speech bubble content text */
{
	color: #000000;
	font-family: Arial;
	font-size: 8pt;
	font-weight: normal;
	font-style: italic;
	position: relative;
	z-index: 3;
	text-align: center;
	width: 142px;
}

/* Styles for statistics table */

.StatisticsTable
{
	width: 100%;
	border: solid 1px black;
	margin-left: 1px;
}

.StatisticsTableHeader td
{
	background-color: #161f60;
	color: White;
	font-family: Arial;
	font-size: 9pt;
	font-weight: bold;
	text-align: center;
}

.StatisticsTableRow td
{
	background-color: white;
	color: Black;
	font-family: Arial;
	font-size: 9pt;
	font-weight: normal;
	text-align: center;
}


/* Styles for chart data table */

.ChartDataTable
{
	width: 100px;
	border: solid 1px black;
	margin-left: 1px;
}

.ChartDataTableHeader td
{
	background-color: #161f60;
	color: White;
	font-family: Arial;
	font-size: 9pt;
	font-weight: bold;
	text-align: center;
}

.ChartDataTableRow td
{
	background-color: white;
	color: Black;
	font-family: Arial;
	font-size: 9pt;
	font-weight: normal;
	width: 50px;
	text-align: center;
}


/* Styles for login control */

#login1
{
	color: White;
}