﻿/**********************************************************************************
 * General Site Layout                                                            *
 **********************************************************************************/

body
{
	background-color: #010101;
	background-image: url(../Images/MainBackground.jpg);
	background-position:center top;
	background-repeat:no-repeat;
	margin:0;
}

div#MainBody
{
	border:1px #515151 solid;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	
	width:890px;
	margin:50px auto 10px auto;
	background-color:#050505;
	background-position:center top;
	background-repeat:no-repeat;
}

div#MainBody.Background1 { background-image: url(../Images/BodyColumnBackground-1.jpg); }
div#MainBody.Background2 { background-image: url(../Images/BodyColumnBackground-2.jpg); }
div#MainBody.Background3 { background-image: url(../Images/BodyColumnBackground-3.jpg); }
div#MainBody.Background4 { background-image: url(../Images/BodyColumnBackground-4.jpg); }
div#MainBody.Background5 { background-image: url(../Images/BodyColumnBackground-5.jpg); }
div#MainBody.Background6 { background-image: url(../Images/BodyColumnBackground-6.jpg); }
div#MainBody.Background7 { background-image: url(../Images/BodyColumnBackground-7.jpg); }
div#MainBody.Background8 { background-image: url(../Images/BodyColumnBackground-8.jpg); }
div#MainBody.Background9 { background-image: url(../Images/BodyColumnBackground-9.jpg); }
div#MainBody.Background10 { background-image: url(../Images/BodyColumnBackground-10.jpg); }
div#MainBody.Background11 { background-image: url(../Images/BodyColumnBackground-11.jpg); }
div#MainBody.Background12 { background-image: url(../Images/BodyColumnBackground-12.jpg); }

/** 
 * TitleBlock and InnerTitle block is a hack to fix the background from overlapping the curved border corner.
 * A tranparent PNG version of the left 3px of the image is used, then a JPG is used for the rest, since
 * PNG is too big (filesize) to use for the entire image
 **/
 
div#TitleBlock
{
	background-image: url(../Images/TitleBlockBackground-Left.png);
	background-repeat:no-repeat;
}

div#InnerTitleBlock
{
	background-image: url(../Images/TitleBlockBackground.jpg);
	background-repeat:no-repeat;
	background-position:3px top;
	text-align:right;
	color:#88dd34;
	font-size:37px;
	border-bottom:1px #515151 solid;
	padding-right:10px;
	height:55px;
}

div#Menu
{
	font-family: Verdana, Arial, Sans-Serif;
	background-color: #010101;
}

div#Menu ul
{
	margin:0;
	padding:0;
	list-style-type:none;
}

div#Menu li
{
	border-right:1px #515151 solid;
	float:left;
	font-size:15px;
}

div#Menu li:hover
{
	background-color:#141416;
}

div#Menu li a
{
	display:block;
	width:80px;
	text-align:center;
	padding:0.25em 0.4em 0.35em 0.4em;
}

div#Menu li a:link
{
	color:#F2F2F2;
	text-decoration:none;
}

div#Menu li a:visited
{
	color:#F2F2F2;
	text-decoration:none;
}

div#Menu li a:hover
{
	color:#88dd34;
}

div#AuthArea
{
	font-size:13px;
	float:left;
}

div#Menu.SixMenuItems div#AuthArea
{
	width:332px;
}

div#Menu.FiveMenuItems div#AuthArea
{
	width:425px;
}

div#AuthTextContainer
{
	float:right;
	text-align:right;
	overflow:hidden;
	padding:5px;
}

div#Menu.SixMenuItems div#AuthTextContainer
{
	width:303px;
}

div#Menu.FiveMenuItems div#AuthTextContainer
{
	width:396px;
}

p#AuthText
{
	margin:0;
	white-space:nowrap;
	line-height:1.25em;
}

p#AuthText img
{
	vertical-align:text-bottom;
}

p#AuthText a:link, p#AuthText a:visited
{
	color:#F2F2F2;
	text-decoration:none;
}

p#AuthText a:hover
{
	color:#88dd34;
	text-decoration:underline;
}

a#SignOutIcon
{
	float:right;
	height:14px;
	width:14px;
	margin-top:6px;
	margin-right:5px;
	display:block;
	background-image:url(../Images/close.png);
	background-position:left top;
}

a#SignOutIcon:hover
{
	background-position:center top;
	cursor:pointer;
}

a#SignOutIcon:active
{
	background-position:right top;
}

div#SectionTitle, div#MainArea
{
	clear:both;
	border-top:1px #515151 solid;
}

div#SectionTitle
{
	padding:3px 10px 5px 10px;
	color:#88dd34;
	font-size:26px;
}

div.ContentBox
{
	padding:10px;
}

div#Footer
{
	text-align:center;
	font-size:12px;
	margin-bottom:50px;
}

div.FloatClearer
{
	clear:both;
}

a.Permalink
{
	background-image: url(../Images/PermalinkIcon.png);
	background-repeat:no-repeat;
	background-position: left center;
	padding-left:20px;
}

/**********************************************************************************
 * General Typography                                                             *
 **********************************************************************************/

body
{
	color:#e5e5e5;
	font-family: "Segoe UI", Tahoma, Geneva, sans-serif;
	font-size:10pt;
}

span.Link
{
	cursor:pointer;
}

a:link, a:visited, span.Link
{
	color:#88dd34;
	text-decoration:none;
}

a:link img, a:hover img, a:visited img
{
	border:0;
	text-decoration:none;
}

a:hover, span.Link:hover
{
	text-decoration:underline;
}

a.UnobtrusiveLink:link, a.UnobtrusiveLink:visited, a.UnobtrusiveLink:hover
{
	color:#F2F2F2;
}

p
{
	line-height:1.5em;
	margin:0;
	margin-bottom:1em;
}

p.NoSpacing, ul.NoSpacing
{
	margin:0;
}

h1, h2, h3, h4, h5
{
	color:#88dd34;
	margin:0;
	font-weight:bold;
}

h1 { font-size:1.8em; }
h2 { font-size:1.4em; }
h3 { font-size:1.15em; }
h4 { font-size:1em; }
h5 { font-size:1em; font-style:italic; }

.field-validation-error
{
    color: #ff0000;
}

ul
{
	padding-left:15px;
	list-style-position:outside;
	margin-top:0;
}

pre
{
	font-family: Consolas, Courier New, Monospace;
	font-size:10pt;
	clear:both;
}

blockquote, pre
{
	background-image: url(../Images/VeryTransparentGreyBackground.png);
	background-repeat:repeat;
	
	padding:5px;
	margin:0;
	margin-bottom:1em;
	
	border: 1px #515151 solid;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
}

blockquote > p:last-child
{
	margin-bottom:0;
}


/**********************************************************************************
 * Form Element Styling                                                           *
 **********************************************************************************/

form
{
	margin:0; /*Removes IE7's default margin*/
}

input[type="submit"]
{
	border: 2px #CDCDCD solid;
	background-color:#1E1E1E;
	padding:2px;
	color:#F2F2F2;
}

input[type="submit"]:hover
{
	background-color:#353535;
	cursor:pointer;
}

input[type="submit"]:active
{
	background-color:#282828;
	cursor:pointer;
}

textarea
{
	font-family: Consolas, Courier New, Monospace;
	font-size:11pt;
}

textarea, input, select
{
	padding:0.2em;
}

input[type="password"], input[type="text"]
{
	width:200px;
}

textarea, input[type="password"], input[type="text"], select
{
	background-color:White;
	border: 2px #CDCDCD solid;
}

fieldset
{
	border:2px #CDCDCD solid;
	width:600px;
	margin:0;
	margin-bottom:1em;
	padding:10px;
}

fieldset.MaxWide
{
	width:auto;
}

legend
{
	color:#F2F2F2;
	font-weight:bold;
}

input.input-validation-error, textarea.input-validation-error
{
    border-color: Red;
    background-color: #ffeeee;
}

.validation-summary-errors
{
    font-weight: bold;
    color: #ff0000;
}

span.field-validation-error
{
	display:block;
}


/**********************************************************************************
 * Standard Table Styling                                                         *
 **********************************************************************************/

table, table.Standard
{
	border-collapse:collapse;
	margin-bottom:1em;
}

table td, table th, table.Standard td, table.Standard th
{
	border: 1px #515151 solid;
}

table td, table th, table.Standard td, table.Standard th
{
	vertical-align:top;
	padding:5px;
}

table th, table.Standard th
{
	font-weight:bold;
	text-align:left;
}


/**********************************************************************************
 * Layout Table Styling                                                           *
 **********************************************************************************/
 
table.LayoutTable
{
	margin:0;
	border:0;
}

table.LayoutTable, table.LayoutTable td, table.LayoutTable th
{
	background-color:Transparent;
	padding:0;
	vertical-align:top;
	font-weight:normal;
	border:0;
}

table.LayoutTable td, table.LayoutTable th
{
	padding:0.2em;
}

table.LayoutTable tbody th
{
	text-align:right;
}

table.LayoutTable td.HelpIcon
{
	padding-top:7px;
}

/*****************************************************************************
 * TempInfoBox Styling                                                       *
 *****************************************************************************/

div.TempInfoBox
{
	padding:5px;
	padding-left: 25px;
	background-position: 5px center; 
	background-repeat: no-repeat;
	margin-bottom: 1em;
	color:Black;
}

div.TempInfoBox p
{
	margin:0;
	font-weight: bold;
}

div.WarningBox
{
	border:1px solid #F9F948;
	background-color: #FFFFCE;
	background-image: url(../Images/TempInfoBoxWarningIcon.gif);
}

div.SuccessBox
{
	border:1px solid #66CC33;
	background-color: #DDFFDD;
	background-image: url(../Images/TempInfoBoxSuccessIcon.gif);
}

div.InfoBox
{
	border:1px solid #75AFEA;
	background-color: #D8E4F1;
	background-image: url(../Images/TempInfoBoxInfoIcon.gif);
}

div.ErrorBox
{
	border:1px solid #FF3D3D;
	background-color: #FFCCCC;
	background-image: url(../Images/TempInfoBoxErrorIcon.gif);
}


/*****************************************************************************
 * Collapsible Fieldset Styling                                              *
 *****************************************************************************/

fieldset.Collapsible legend
{
	background-repeat:no-repeat;
	background-position:left center;
	padding-left: 12px;
	cursor:pointer;
}

fieldset.Collapsible legend.Expand
{
	background-image: url(../Images/Expand.png);
}

fieldset.Collapsible legend.Collapse
{
	background-image: url(../Images/Collapse.png);
}


/*****************************************************************************
 * Blog Styling                                                              *
 *****************************************************************************/

p#BlogListFilterText
{
	border: 2px #515151 solid;
	background-image: url(../Images/TransparentHighlightBackground.png);
	background-repeat:repeat;
	padding:5px;
}

div.BlogPost
{
	margin-bottom:1em;
}

div.BlogPost div.HeaderMetadata
{
	font-style:italic;
	font-size:12px;
}

div.BlogPost div.FooterMetadata, div#BlogComments div.Comment
{
	background-image: url(../Images/TransparentGreyBackground.png);
	background-repeat:repeat;
	
	border: 1px #515151 solid;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
}

div.BlogPost div.FooterMetadata
{
	padding: 5px;
}

div.BlogPost div.FooterMetadata div.OtherMetadata
{
	float:right;
}

div#BlogPagingControls a
{
	font-weight: bold;
	font-size:1.1em;
	margin-bottom: 1em;
}

div#BlogPagingControls a#BlogOlderPostsLink
{
	float:right;
}

div#BlogPagingControls a#BlogNewerPostsLink
{
	float:left;
}

div#BlogComments a.SubmitCommentLink, div.BlogPost a.CommentsIcon
{
	background-image: url(../Images/PostCommentIcon.gif);
	background-repeat:no-repeat;
	background-position: left center;
	padding-left:20px;
}

div#BlogComments a.RssLink
{
	background-image: url(../Images/RssFeedIcon.png);
	background-repeat:no-repeat;
	background-position: left center;
	padding-left:20px;
}


div#BlogComments div.Comment
{
	margin-bottom: 1em;
}

div#BlogComments div.Comment div.CommentMetadata
{
	float:left;
	width:110px;
	border-right: 1px solid #515151;
	padding: 8px 5px;
	text-align:center;
}

div#BlogComments div.Comment div.CommentMetadata p
{
	margin:0;
}

div#BlogComments div.Comment div.CommentMetadata p.CommentDate
{
	font-style:italic;
	font-size:12px;
}

div#BlogComments div.Comment div.CommentContent
{
	float:left;
	border-left: 1px solid #515151;
	position:relative;
	left: -1px;
	width:746px;
}

div#BlogComments div.Comment div.CommentContent p
{
	margin: 5px 8px;
}

div#BlogComments div.ByPostAuthor
{
	background-image: url(../Images/TransparentHighlightBackground.png);
}

div#BlogComments div.CommentPermalink
{
	float:right;
	position: relative;
	top: -1px;
	left: 2px;
	
	border: 1px solid #515151;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	
	padding: 5px;
}

div#SubmitComment p#CommentTextAreaLabel img
{
	vertical-align:text-bottom;
}

/*****************************************************************************
 * Generic Reusable Styling                                                  *
 *****************************************************************************/

div.ImageBox
{
	border: 1px solid #515151;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	padding:5px;
	margin-bottom: 1em;
}

div.ImageBox p.ImageCaption
{
	font-style:italic;
	font-size:12px;
	margin:0;
}

.CentredContentBox
{
	margin-left:auto;
	margin-right:auto;
}

.FloatRightContentBox p.ImageCaption
{
	text-align:right;
}

.FloatRightContentBox
{
	float:right;
	margin:10px;
	margin-right: 0;
	margin-top:0;
}

.FloatLeftContentBox
{
	float:left;
	margin:10px;
	margin-left: 0px;
	margin-top:0;
}