/* Main CSS Document for jeffludwig.com 
   Author: Jeff Ludwig 
   Feel free to glean inspiration, as much inspiration as this document shows
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* Global style declarations
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
	
* { Border: 0; Padding: 0; Margin: 0; }

body { Background: #000000 url(/images/common/col-bg.jpg) repeat;
  Font-Family: Georgia, "Times New Roman", Times, serif; 
  Font-Size: 18px;
  Color: #ffff99;
  Width: 100%; 
  Margin: 0; 
  Min-Width: 1000px;
  }

blockquote {
	margin-right: 0;
	margin-left: 20px;
}

.italicized { Font-Style: italic; }
.makeBold { Font-Weight: bold; }

.Red { Color: #ff0000; }
.Black { Color: #000000; }

.quote { Padding: 0 4em; }

acronym { Background: url(/images/common/acronym.png) repeat-x bottom; }
acronym:hover { Cursor: help; }


.Centered { 
	Margin-Left: auto !important;
	Margin-Right: auto !important;
	Float: none !important; }

.Right { Margin: 5px 10px 5px 15px; Float: right; }
.Left { Margin: 5px 15px 5px 10px; Float: left; }
	
hr { Width: 85%; }
	
a:link, a:visited { Color: #66aaff; Text-Decoration: underline; }
a:hover { Background-Color: #aaddff; Color: #000000; Text-Decoration: underline; }
a:link img, a:visited img, a:hover img { Border: 0px none; }

img.smallPic { Width: 180px; }
img.smallicon { Width: 20px; Height: 20px; Margin: 0 10px 0 4px; }

.centeredImage { Margin-Left: auto; Margin-Right: auto; Text-Align: center; }


.compCommand { Font-Family: "Courier New", Courier, mono; 
  Font-Size: 115%; } 

.clearALL { Clear: both; }
.indent { Margin-Left: 25px; } 

.pagebreak { Display: none; }

#vista  { Width: 100%; Height: 225px; }

#vista img#masthead { Position: fixed;
  Top: 0;
  Left: 0;
  Width: 100%;
  Min-Width: 984px;
  Height: auto;
  Z-Index: -2;
  Background: #000000; }

#the-geek #face { Position: absolute;
  Top: 0;
  Left: 0;
  Width: 305px;
  Height: auto;
  Z-Index: 0; }

#the-geek #geek-info { Position: absolute; Left: 716px; Top: 80px; Right: 0px; }

#the-geek #geek-info #name { Position: absolute; Right: 0;
  Z-Index: 0; }

#main { 
  Min-Width: 984px;
  Margin: 0 2%;
  Width: 96%;
  }

.fontXsmall { Font-Size: 70%; }
.fontSmall { Font-Size: 85%; }
.fontNormal { Font-Size: 100%; }
.fontLarge { Font-Size: 120%; }



/* Masthead declarations
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#masthead { Color: #066611;
  Height: 210px;
  
  Z-Index: 1; 
  Padding: 0; }
#masthead a:hover { Background: none; }
 
	
#masthead h1 { Left: 35%; 
  Font-Size: 200%; }
#masthead h2 { 
  Left: 40%; 
  Font-Size: 160%; }

#fontContainer { Position: absolute;
  Margin-Top: -27px; 
  Margin-Left: 643px; 
  Height: 20px; 
  Width: 148px; 
  Z-Index: 999; }
#fontContainer ul { Display: block; 
  List-Style: none; }
#fontContainer ul li { Display: inline; 
  List-Style: none; 
  Float: left; } 
#fontContainer ul li p { Width: 25px; 
  Height: 20px; 
  Margin: 0 5px; 
  Border: 1px outset #ffffcc; 
  Text-Align: center; }
#fontContainer ul li p a { Color: #ffffcc; }


/* Nav declarations
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#nav ul { Display: block; 
  List-Style: none; 
  Margin-Left: 25px;
  Padding-Top: 8px;
  Z-Index: 10; }
#nav ul li { Float: left;
  Margin: 0 4px; 
  List-Style: none;
  Background-Image: none; }
#nav ul li p { Display: block;
  Width: 108px;
  Line-Height: 1.5;
  Text-Align: center;
  Border: 1px outset #118833; }
#nav ul li p a { Color: #63360b; 
  Font-Variant: small-caps;
  Font-Size: 92%; }
#nav ul li p a:hover { Background-Color: #63360b; Color: #ffffcc; }


/* Main page declarations
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#page { Clear: left; 
  Color: #ffee99;
/* Background-Color: #4b2e0f; */
  Background: url(/images/common/cabin-left.jpg) top left no-repeat;
  Width: 100%;
  
/*  Overflow: auto; */ }

/* Content declarations
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#page #content { Clear: left; 
  Color: #ffee99;
  Padding-Left: 18px;
  Padding-Top: 1em;
  Padding-Bottom: 1em;  
  Overflow: hidden; }
  
#page #content .win-bg { Z-Index: 1; }
#page #content .winContent { Z-Index: 5; 
  Position: absolute; 
  Margin-Top: -0.5em; }

#content h1 { Font-Size: 160%;
  Font-Variant: small-caps; 
  Margin: 1.5em 15px 0 15px; 
  Line-Height: 1.25; }
#content h1#first { Margin: 0.5em 15px; }  

#content h2 { Font-Size: 120%; 
  Margin: 1.5em 25px 0 25px; 
  Line-Height: 1.25; }
#content h3 { Font-Size: 100%;
  Margin: 0.8em 32px 0 32px; 
  Line-Height: 1.5; }
#content h4, #content h4, #content h4 { Font-Size: 92%; 
  Margin: 0.5em 40px 0 40px; 
  Line-Height: 1.5; 
  Font-Weight: bold; }

#content p, #content ul { Font-Size: 92%; 
  Margin: 0.6em 40px 0 40px;
  Line-Height: 1.8; } 
#content p.end { Clear: both; 
  Font-Size: 1px; }
#content li { Margin-Left: 12px; }


#content img { Margin: 2px 5px; Padding: 4px; }
#content a:link > img, #content a:visited > img { Border: 1px solid #66aaff; }
#content a:hover > img { Border: 3px solid #66aaff; Padding: 2px; }

#content img.thisGame { Margin: 5px 5px 10px 20px; Padding: 4px; Border: 1px solid #ffee99; }
#content img.mapImg { Margin: 5px auto; Padding: 4px; Border: 1px solid #ffee99; }

#content img.nav-but, #content img.nav-but-sel { Float: right; Position: absolute; Width: 60px; Height: 72px; Margin: 0 2px; Padding: 0; Border: 0; }
#content a:link > img.nav-but, #content a:visited > img.nav-but { }
#content a:link > img.nav-but-sel, #content a:visited > img.nav-but-sel { }
#content a:hover > img.nav-but { }
#content a:hover > img.nav-but-sel { }



/* Styles specifically for the home page (Featured boxes and game select)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#page #content #chooseGame select { Position: absolute; Left: 20em;
  Padding: 3px;
  Border: 1px inset #888888;
  Background: #111111;
  Color: #99ccff;
  Font-Family: Georgia, "Times New Roman", Times, serif;
  Font-Size: 90%; }

#page #content #chooseGame a { Position: absolute; Left: 45em; 
  Width: 44px; Height: 30px; 
  Padding: 0 18px; 
  Text-Decoration: none; 
  Font-Size: 80%; }
#page #content #chooseGame a:link, #page #content #chooseGame a:visited { Background: url('/images/nav-buttons/button-go-up.gif') top left no-repeat; 
  Color: #bbddff; 
  Padding-Top: 0px; Padding-Left: 18px;
  Font-Style: normal; }

#page #content #chooseGame a:hover { Background: url('/images/nav-buttons/button-go-down.gif') top left no-repeat;
  Color: #ddeeff;
  Padding-Top: 3px; Padding-Left: 20px;
  Font-Style: italic; }


#page #content .feature, #page #content .feature .winContent { Width: 22%;
  Min-Width: 220px; 
  Height: 250px; 
  Overflow: hidden;
  Float: left; }

#page #content .featureWide, #page #content .featureWide .winContent { Width: 46%;
  Min-Width: 460px; 
  Height: 250px; 
  Overflow: hidden;
  Float: left; }

#page #content .feature, #page #content .featureWide { Margin: 0.75em 1%; }

#page #content .feature .winContent { Width: 21%; Min-Width: 210px; }
#page #content .featureWide .winContent { Width: 44%; Min-Width: 445px; Font-Size: 85%; }

#page #content .featureWide .win-bg img { Position: absolute;
  Width: 44%;
  Min-Width: 470px;
  Height: 250px; }

#page #content .feature .win-bg img { Position: absolute;
  Width: 21%;
  Min-Width: 225px;
  Height: 250px; }
  



/* Footer declarations
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#footer { Left: 0px;
  Height: 3.25em; 
  Width: 100%;
  Margin: 0; 
  Border-Top: 1px inset #ffff99; 
/* Background: transparent url(/images/bg/bg-footer-stretchable.jpg) bottom center repeat-x;  */

  Color: #ffffff; }
#footer p { Font-Size: 92%; 
  Text-Align: center;
  Line-Height: 1.5; } 
#footer p a { Color: #ffff66; }
#footer p a:hover { Background-Color: #ffff66; Color: #066611; }

#footer img { Position: fixed;
  Bottom: 0;
  Left: 0;
  Width: 100%;
  Min-Width: 984px;
  Height: 200px;
  Z-Index: -3;
  Background: #000000; }
  



/* base
----------------------------------------------- */

/*
body {
	margin: 0;
	padding: 0;
	font-family: Verdana, "Lucida Grande", Tahoma, Helvetica, sans-serif;
	color: #000;
	background-color: #fff;
}

blockquote, h3, p, li {
	padding-right: 10px;
	padding-left: 10px;
	font-size: 0.9em;
	line-height: 1.6em;
}

h1, h2, h3 {
	margin: 0 0 15px 0;
	padding: 0 10px;
	font-weight: normal;
}

h1, h2 {
	font-family: Georgia, Times, serif;
}

h1 {
	font-size: 1.4em;
}

h2 {
	font-size: 1em;
	font-style: italic;
}

hr {
	margin: 2em auto;
	width: 370px;
	height: 1px;
	color: #7a7e7d;
	background-color: #7a7e7d;
	border: none;
}

small, .small {
	font-size: 0.9em;
}

*/

/* links
----------------------------------------------- */

/*
a {
	text-decoration: none;
	color: #000;
	border-bottom: 1px #000 solid;
}

a img {
	border: none;
}

h1 a, h2 a, h3 a {
	border: none;
}

h3 a {
	font: 1.5em Georgia, Times, serif;
}

#site-name a {
	border: none;
}

#sidebar-2 a, #sidebar-1 a {
	color: #c00;
	border: none;
}
*/

/* layout
----------------------------------------------- */


#accessibility {
	position: absolute;
	top: -10000px;
}

#container {
	margin: 10px auto;
	padding: 10px;
	width: 96%;
}

#head {
  Text-Align: left;

  Padding: 5px;
  Border: 2px outset #99ccff;
  Margin: 0 0 1em 0;
}

#head #search { Float: right; Font-Size: 80%; Margin-Top: -1em; }

#site-name { 
  Font: 3em Georgia, Times, serif;
  Margin-Bottom: 15px;
}
#site-name a { Text-Decoration: none; }
#content #head h1#site-name { Margin: 0 15px 0 5px; }

#site-slogan {
  Font: italic 1em Georgia, Times, serif;
}

#sidebar-1, #sidebar-2 {
	padding-top: 50px;
	width: 150px;
}

#sidebar-1 {
	margin-right: 5px;
	float: left;
	text-align: right;
}

#sidebar-2 {
	margin-left: 5px;
	float: right;
}

.section_list {
	margin: 0 0 10px 0;
	padding: 0;
	list-style-type: none;
}

.section_list ul {
	list-style-type: none;
}

.section_list li {
	margin: 0 10px 2px 0;
	padding: 0;
}

/* box model hacks
http://archivist.incutio.com/viewlist/css-discuss/48386
----------------------------------------------- */

/*
#container {
\width: 770px;
w\idth: 760px;
}

#sidebar-1, #sidebar-2 {
\width: 150px;
w\idth: 150px;
}
*/

/* overrides
----------------------------------------------- */

#sidebar-2 p, #sidebar-1 p {
	font-size: 0.8em;
	line-height: 1.5em;
}

.caps {
	font-size: 0.9em;
	letter-spacing: 0.1em;
}

div.divider {
	margin: 2em 0;
	text-align: center;
}

/* articles
----------------------------------------------- */

.directory {
	list-style-type: circle;
}

.author {
  Font-Style: normal;
  Font-Size: 0.8em;
  Margin: 0.75em 0 0.75em 50px; 
}

.published {
	font-size: 0.8em;
}

.hfeed { Margin-Left: 20px; }

.entry-title { Margin-Left: 0px; }
.published { Margin-Left: 5px; }
.entry-content { Margin-Left: 15px; }


/* comments
----------------------------------------------- */

.comments_error {
	color: #000;
	background-color: #fff4f4;
}

ul.comments_error {
	padding : 0.3em;
	list-style-type: circle;
	list-style-position: inside;
	border: 2px solid #fdd;
}

div#cpreview {
	color: #000;
	background-color: #f1f1f1;
	border: 2px solid #ddd;
}

#comments-help {
	margin: 2px 0 15px 0;
	font-size: 0.7em;
}



#content form#txpCommentInputForm { 
  Width: 800px;
  Margin: 0px auto 10px auto; }

#content form#txpCommentInputForm tr {
  Height: 1.6em; }

#content form#txpCommentInputForm td {
  Vertical-Align: top;
  Padding: 3px;
}


		
form#txpCommentInputForm td.comLeft { 
	Padding: 0px 15px 0px 0px;
	Text-Align: right;
	Width: 200px;
	Min-Width: 200px;
	Font-Size: 92%; }

form#txpCommentInputForm td.comRight { 
	Padding: 0px 0px 0px 15px;
	Text-Align: left;
	Width: 450px;
	Min-Width: 450px;
	Font-Size: 92%; }

form#txpCommentInputForm select {
	Background-Color: #111111; 
	Color: #99ccff;
	Font-Family: Georgia, "Times New Roman", Times, serif;

	Padding: 0.25em;

	Border: 1px solid #cccccc;
	Border-Right: 1px solid #888888;
	Border-Bottom: 1px solid #888888;
			
	Font-Size: 92%; }
			
form#txpCommentInputForm select:focus { Background-Color: #333333; Color: #ccddff; }

form#txpCommentInputForm input, #search form input {
	Background-Color: #000000; 
	Color: #99ccff;
	Font-Family: Georgia, "Times New Roman", Times, serif;

	Padding: 0.25em;
	Border: 1px solid #cccccc;
	Border-Right: 1px solid #888888;
	Border-Bottom: 1px solid #888888;
			
	Font-Size: 92%; }
			
form#txpCommentInputForm input:focus, #search form input { Background-Color: #333333; Color: #ccddff; }

form#txpCommentInputForm textarea {
	Background-Color: #000000; 
	Color: #99ccff;
	Font-Family: Verdana, Arial, Helvetica, sans-serif;

	Padding: 0.25em;
	Line-Height: 1.25;
	
	Border: 1px solid #cccccc;
	Border-Right: 1px solid #888888;
	Border-Bottom: 1px solid #888888;
			
	Font-Size: 92%; }
			
form#txpCommentInputForm textarea:focus { Background-Color: #333333; Color: #ccddff; }

form#txpCommentInputForm .required, form#txpCommentInputForm input.required { 
	Background-Color: #111111; 
	Color: #99ccff;
	Border: 1px solid #11cc33; 
	Border-Right: 1px solid #008811;
	Border-Bottom: 1px solid #008811; }

form#txpCommentInputForm input.button { 
  Background: url('/images/nav-buttons/button-go-up.gif') 0px 3px no-repeat; 
  Color: #bbddff; 
  Text-Align: center;
  Padding-Top: 0px;
  Font-Style: normal; 
  Height: 33px;
  Width: 80px; 
  Border: none; }

form#txpCommentInputForm input.button:hover { 
  Background: url('/images/nav-buttons/button-go-down.gif') 0px 0px no-repeat;
  Color: #ddeeff;
/*  Padding-Top: 3px; Padding-Left: 20px; */
  Font-Style: italic; 
  Height: 30px;
  Width: 80px; 
  Border: none; }


/* error page
----------------------------------------------- */

.error-status {
	font: 1.3em Georgia, Times, serif;
}
