@charset "utf-8";

/* 
	Copyright (C) 2004-2010 Jonathan Wilkes - All Rights Reserved.
	http://www.debugspy.com
*/

/*****************************************************************************
	Main body 
******************************************************************************/

html body 		{ background-color: #333333; font-size: 10pt; font-family: Verdana, Arial, Helvetica, sans-serif; }
img 			{ border-style: none; }
p, div, h1, h2, h3	{ margin: 0px; padding: 0px; } /* Stop <p> and <div> from adding margins and padding */

a:active 		{ outline: none; /* Remove the dotted border when a link is clicked on */ }
a:focus 		{ -moz-outline-style: none; /* Remove the dotted border when a link is clicked on */ }

/******************************************************************************
	The website
******************************************************************************/

/* This website is 960px wide, if this changes then you need to change the following - Take padding into account!
	div#content
	div#client
	div#sidebar
	div#copyright
	div#modified 
*/

	/* Contains header/client area/footer, etc */
#content 		{ width: 960px; margin-left: auto; margin-right: auto; color: #000000; background-color: #ffffff; }

/******************************************************************************
	The Header content
******************************************************************************/

#header
{
	padding: 0px 5px 5px 5px;
	height: 70px;
	
	border-color: #e82c0c;
	border-style: solid;
	border-width: 0px 0px 2px 0px;
	
	color: #d4d4d4;
	background-color: #333333;
}

#logo			{ float: left; width: 120px; }
.logoContainer 		{ display:block; height:115px; overflow:hidden } /* CSS to show the mouse over sprite for the logo */
.logoContainer:hover img { margin-top:-115px }

#siteName		{ float: left; padding-top: 20px; margin-left: -20px; font-family: Georgia, serif; font-size: 30pt; }

#menu			{ float: left; padding-top: 30px; margin-left: -10px; }
#menu ul li 		{ display: inline; margin-right: 10px; }
#menu ul li a 		{ text-decoration: none; color: #d4d4d4; font-size: larger; font-weight: bold; }
#menu ul li a:hover 	{ color: #e82c0c; }
#menu .current a 	{ text-decoration: underline; color: #e82c0c; } /* The current page's menu item */

#signin			{ height: 55px; text-align: right; }

#rss 			{ float: right; }
.rssContainer 		{ display:block; height:16px; overflow:hidden } /* CSS to show the mouse over sprite for the RSS link */
.rssContainer:hover img { margin-top:-17px }

/******************************************************************************
	The Client Area
******************************************************************************/

#clientFrame 		{ padding-top: 45px; padding-left: 10px; }

	/* This added to the width of the "sidebar" should equal the width of the "content" div = 960px - Take padding into account! */
#client 		{ float: left; width: 688px; }
#sidebar 		{ float: right; padding: 0px 5px 5px 15px; width: 237px; }

/******************************************************************************
	General formatting options for text, url links, etc.
******************************************************************************/

h1, h2, h3		{ color: #333333; font-family: "Trebuchet MS", Verdana, Arial, sans-serif; }
h2			{ font-size: 12pt; }
h3			{ font-size: 10pt; }
 
.date			{ font-size: x-small; font-weight: bold; } /* Dates on the Home page */
.newsSeperator		{ padding: 1px 0px 1px 0px; }

	/* A normal web link */
.url a 			{ text-decoration: none; border-bottom: #e82c0c 1px solid; }
.url a:link  		{ color: #0164ff; }
.url a:visited 		{ color: #0164ff; }
.url a:hover 		{ color: #e82c0c; }

	/* Error text */
p.error 		{ color: #e82c0c; font-size: x-small; font-style: italic; }
.error 			{ color: #e82c0c; font-size: x-small; font-style: italic; }

.errorLarge h2		{ color: #e82c0c; font-size: 12pt; font-style: italic; }

	/* IE6 Warning Box */
.ieWarning		{ width: 688px; color: #ffffff; background: #e82c0c; border-color: #e82c0c; border-style: solid; border-width: 1px; position: relative; margin: 10px 0; }
/*
.ieWarning .tl		{ width: 10px; height: 10px; background: url(./_images/box-red-tl.png); position: absolute; top: -1px; left: -1px; }
.ieWarning .tr		{ width: 10px; height: 10px; background: url(./_images/box-red-tr.png); position: absolute; top: -1px; right: -1px; }
.ieWarning .bl		{ width: 10px; height: 10px; background: url(./_images/box-red-bl.png); position: absolute; bottom: -1px; left: -1px; }
.ieWarning .br		{ width: 10px; height: 10px; background: url(./_images/box-red-br.png); position: absolute; bottom: -1px; right: -1px; }
*/
.ieWarning .inside	{ padding: 10px; }
.ieWarning .inside h2	{ color: #ffffff; }
.ieWarning .boxContent	{ font-size: smaller; }

/******************************************************************************
	Freebies page
******************************************************************************/

	/* The "Freebies" index page */
	
/* .freebieType		{ } */
.freebieCategory	{ padding-left: 5px; }
.freebieItem		{ padding-left: 10px; }
.freebieItem img	{ vertical-align: middle; padding-bottom: 2px; }
.freebieItem .downloadCount { font-size: 8pt; color: #6e8b3d; } /* Used to display the download count next to a list item */

.freebieMoreInfo	{ font-size: x-small; }

	/* Used within the sample code pages, e.g. Version History */
.history		{ font-family: "Consolas", "Courier New", monospace; font-size: small; padding-left: 20px; margin-top: 0px; }

.bold			{ font-weight: bold; }
.keyword		{ font-weight: bold; }
.key			{ font-size: 8pt; color: #6e8b3d; } /* Change History Key and Icons */

/*
	[Colour] - Border, Fill

	[Red] 	- ff6500, fff7ef
	[Blue] 	- 0065ff, eff7ff
	[Green] - 00a200, e7ffe7
*/

.redNote /* A Red Coloured Note */
{
	width: 90%; 
	margin-left: auto; 
	margin-right: auto; 

	border-style: solid; 
	border-width: 1px; 
	border-color: #ff6500;
	padding: 5px; font-size: x-small; 
	
	color: #000000;
	background: #fff7ef;
}

/******************************************************************************
	Sidebar specific formatting
******************************************************************************/

#sidebarFrame 		{ width: 197px; margin-left: auto; margin-right: auto; padding: 5px 5px 5px 5px; }

#sidebarBox /* A box in the sidebar area */
{
 	background-color: #eff7ff;
	
	position: relative;
	top: 60px;
	width: 90%;
	
	border: #0065ff 1px solid;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 30px;
	padding: 2px;
}

#sidebarBoxHdr /* The header for the sidebarBox */
{
	text-align: center;
	font-size: smaller;
	
	padding: 2px 0px 2px 0px;
	margin-bottom: 5px;
	color: #ffffff;
	background-color: #333333;
}

.sidebarSmallText	{ font-size: smaller; padding: 2px, 0px, 0px, 2px; }
.left			{ float: left; width: 45%; height:16px; }
.right 			{ float: right; width: 50%; height:16px; }

	/* The Supported Operating System Icons */
.imgYes, .imgNo		{ width: 16px; height: 15px; display: block; background: url(./_images/Yes-No_Sprite.png); overflow: hidden; }
.imgYes			{ background-position: 0px 0px; }
.imgNo			{ background-position: 0px 15px; }

#sidebarBox .downloadButton
{
	padding-left: 5px;
}

/******************************************************************************
	The Footer content
******************************************************************************/

#footer
{
	clear: both;
	padding: 0px 0px 5px 0px;

	border-color: #e82c0c;
	border-style: solid;
	border-width: 2px 0px 0px 0px;

	color: #d4d4d4;
	background-color: #333333;
}

#copyright /* The copyright message */
{
	float: left;
	width: 475px; /* This added to the width of the "modified" should equal the width of the "content" div = 960px - Take padding into account! */
	padding-left: 5px;
	
	font-size: x-small;
	background-color: #333333;
}

#modified /* Date last modified text */
{
	float: right;
	width: 475px; /* This added to the width of the "copyright" should equal the width of the "content" div = 960px - Take padding into account! */
	padding-right: 5px;

	text-align: right;
	font-size: x-small;
	background-color: #333333;	
}