/*
Theme Name: MB3 - Computer Age
Theme URI: http://mikebeauchamp.com/
Description: Written in Windsor, Ontario Canada. Uses images from "The Computer Age".
Version: 20110204
Author: Mike Beauchamp
Author URI: http://mikebeauchamp.com
Tags: mikebeauchamp

Rotating images:
990x415 
JPG (94%)
(theme folder)/images
add in CSS below..

COLORS:

logo text: #1b1b1b;
logo orange: #8a572d;
general text color: #444444;
white background: #f3f3f3;
highlight grey: #ececec;
highlight text: #0a0a0a;
highlight grey border: #808080;
dark grey background: #2c2c2c;

*/

/* 
BROWSER RESET
=============
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	/* font-size: 100%; */
	vertical-align: baseline;
	background: transparent;
}

body {
	line-height: 1;
}

del {
	text-decoration: line-through;
}

table { /* tables still need 'cellspacing="0"' in the markup */
	border-collapse: collapse;
	border-spacing: 0;
}






/*
BODY STUFF
==========
*/

body {
    font-size: 62.5%; /* Resets 1em to 10px */
    background-color: #2c2c2c;
}




/*
LAYOUT STUFF
============
*/

#wrapper {
    width:990px;
    margin: 0 auto;
}

#header {
    height:138px;
}

body.home #header { /* home page only */
    height:415px;
}

#sidebar {
    width:200px;
    margin:40px 30px 0 60px;
    float:left;
    display:inline; /* IE5/6 double margin hack */
}

#content {
    width:640px;
    margin:40px 60px 2em 0;
    float:right;
    display:inline; /* IE5/6 double margin hack */
}

#footer {
	padding:6px 60px 10px 60px;
    clear:both;
}



/* 
WRAPPER STUFF
=============
*/

#wrapper {
    font-family: arial, helvetica, sans-serif;
    background:#f3f3f3;
    color: #444444;
	font-size:1.6em;
    font-weight:normal;
    line-height:1.4em;
}




/*
HEADER STUFF
============
*/

#header { /* default */
    background-color: #aaa;
    background-repeat: no-repeat;
    background-position: 0 0;
	background-image: url(images/4.jpg);
	background-position: 0 -255px; } 
}

#header.design0 { 
	background-image: url(images/0.jpg);
	background-position: 0 -277px; }
#header.design1 { 
	background-image: url(images/1.jpg);
	background-position: 0 -124px; }
#header.design2 { 
	background-image: url(images/2.jpg);
	background-position: 0 -265px; }
#header.design3 { 
	background-image: url(images/3.jpg);
	background-position: 0 -262px; }
#header.design4 {
	background-image: url(images/4.jpg);
	background-position: 0 -255px; } 
#header.design5 { 
	background-image: url(images/5.jpg);
	background-position: 0 -141px; }
#header.design6 { 
	background-image: url(images/6.jpg);
	background-position: 0 -250px; }
#header.design7 { 
	background-image: url(images/7.jpg); 
	background-position: 0 -222px; }
#header.design8 { 
	background-image: url(images/8.jpg);
	background-position: 0 -277px; }
#header.design9 { 
	background-image: url(images/9.jpg);
	background-position: 0 -218px; }

img#logo {
    display:inline-block;
    margin:48px 0 0 48px;
    padding:3px;
    border:0px;
    color:#8a572d;
    font-size:28px;
    text-align:center;
}

/* home page only stuffs */

body.home #header { /* home page only */
	background-position:0px 0px;
}

body.home img#logo  { /* home page only */
	margin:325px 0 0 48px;
}

/* hover and focus */

a#logolink:hover img#logo,
a#logolink:focus img#logo {
	padding:0px;
	border:3px #1b1b1b solid;
}

a#logolink:focus { /* override generic a:focus */
	background:none;
}






/* 
NAVIGATION STUFF
================
*/

ul.mainnavigation { /* main nav */
	padding:0;
	margin:0;
	list-style-type:none;
	text-indent:0;
	text-transform:lowercase;
}

ul.mainnavigation a {
	text-decoration:none;
    color: #444444;
}

/* second level - probably isn't right */

ul.mainnavigation li {
	padding:0 0 1em 0;
	margin:0;
}

ul.mainnavigation ul {
	padding:0;
	margin:1em 0 0 1.2em;
	list-style-type:none;
	text-indent:0;
}

ul.mainnavigation ul li {
	padding:0 0 .5em 0;
}

ul.mainnavigation ul a {
	font-size:1.4em;
}

/* current */

ul.mainnavigation li.current_page_item > a {
    color:#8a572d;
}

/* hover and focus */

ul.mainnavigation li a:hover {
    color:#8a572d;
}

ul.mainnavigation li a:focus {
	background: #2c2c2c;
	color:#f3f3f3;
}






/*
CONTENT STUFF
=============
*/

/* HEADINGS */

h1, h2, h3, h4, h5, h6 {
	font-weight:normal;
    margin: 2em 0 1em 0; 
    line-height:1em;
}

h1 { /* should be for page title only */
	font-size:2em;
	margin: 0 0 1.5em 0;
	text-transform:lowercase;
	letter-spacing:-.01em;
}

h2 {
	font-size:1.45em;
}

h3 {
	font-size:1.1em;
}

h4 {
	font-size:.9em;
	font-weight:bold;
}

h5 {
	color: #666666;
	font-size:.8em;
	font-weight:bold;
}

h6 {
	color: #666666;
	font-size:.7em;
	font-weight:bold;
}

/* Headings - special cases */

h1.blogtitle { /* assumes span.postinfo follows */ 
	margin-bottom:.1em;
}

h1 a { /* permalink on blog post title */
	text-decoration:none;
	color: #363636;	    
}

h1 a:hover {
	text-decoration:underline;
}




/* CONTENT ELEMENTS */

a {
	color: #8a572d;
}

a:link {}      
a:visited {}  
a:active {}
a:hover {}
a:focus {
    background: #2c2c2c;
    color:#f3f3f3;
    text-decoration:none;
}

div.post {
	padding-bottom:2em;
	margin-bottom:3em;
	border-bottom: 1px solid #aaa;
}

span.postinfo { 
	display:block;
	font-size:.8em; 
	margin-bottom:2em; 
}

span.tags { 
	font-size:.8em; 
}
	
span.postinfo a, span.tags a {
	text-decoration:none;
}

span.postinfo a:hover, span.tags a:hover {
	text-decoration:underline;
}

div.navigation {
	font-size:1em;
	margin:3em 0; 
}

p {
	margin:1em 0 1.25em 0;
}

ul, ol {
	text-indent:1em;
	margin:1.5em 0 1.75em 34px;
}

li {
	margin: 0 0 .5em 0;
}

ul { list-style-type:disc; }

ul ul { list-style-type:circle; }

ol { list-style-type:decimal; }

blockquote, code {
    background:#ececec;
    color:#0a0a0a;
	padding:12px 34px;
	margin:1.5em 0 1.75em 0;
}

code {
	font-family: 'Courier New', Courier, monospace;
}



/* Tables */

table {
	margin:1.5em 0 1.75em 34px;
}

table caption {
	text-align:left;
	margin-bottom:.5em;
	font-weight:bold;
}

thead { }

thead th {
	font-size:1em;
    font-weight:100;
	color: #040404;
    font-weight:normal;
	text-align:left;
	padding: .8em 1em;
}

td, th {
	border-bottom: 1px solid #808080;
	padding: .4em 1em;
	text-align:left;
	font-weight:normal;
	font-size:.8em;
}

th {
/* font-weight:bold; */
}

td { }

tbody {}

tfoot {}

/* Table hover */

tr:hover {
    background:#ececec;
}

thead tr:hover, tfoot tr:hover { /* no hover effect on thead, tfoot */
	background-color:transparent;
}

/* Forms */

label {
	margin: 0 0 0 5px;
	font-size:1.2em;
}

input,textarea { 
	border: 1px solid #808080;
	margin:2px;
	background-color: #ececec;
	padding:4px 6px;
	font-family: 'Courier New', Courier, monospace;
	font-size:.8em;
	color:#404040;
}

input:focus,
textarea:focus {
	border:3px solid #925819;
	color: #0a0a0a;
	margin:0;
}

input#submit {
	background-color: #2c2c2c;
	color: #f3f3f3;
	margin:3px;
	font-family: arial, helvetica, sans-serif;
	font-size:1.2em;
	cursor:pointer;
	border:0px;
}

input#submit:hover,
input#submit:focus {
	margin:0;
	border:3px solid #925819;
}



/*
FOOTER STUFF 
============
*/

#footer {
    font-size:.8em;
    border-top: 12px solid #8a572d;
	text-align:center;
}




/*
COMMENTS STUFF
==============
*/

ol.commentlist {
	list-style-type:none;
	text-indent:0;
	margin:1em 0 1.75em 0;
    background:#ececec;
    color:#0a0a0a;
	padding:12px 34px;
	margin:1.5em 0 1.75em 0;
}

li.comment {
	border-bottom: 1px solid #aaa;
	margin-bottom:1.5em;
}

div.comment-body {}

div.comment-meta, div.commentmetada {
	font-size:.8em;
}





/*
404 PAGE STUFF
===============
*/

#fourohfour {
	background: url(images/404background.jpg) no-repeat 0 0;
	height:1302px;
}

#fourohfour img#logo {
    margin-top:48px;
}

#fourohfour-text {
	background-color:#f3f3f3;
	margin:150px 500px 0 49px;
	padding:4px 10px;
}



/* 
NGGALLERY STUFF - Disable NGGALLERY style in WP
===============
*/


/* ----------- Single picture -------------*/

.ngg-singlepic {
	display:block;
	background-color:#ffffff;
	padding:10px;
	/* background-color: #2c2c2c; */
        margin:1em 0 1.25em 0;
}

.ngg-singlepic:hover,
a:focus .ngg-singlepic {
	background-color:#8a572d;
}

.ngg-left {
	float: left;
	margin-right:10px;
}

.ngg-right {
	float: right;
	margin-left:10px;
}

.ngg-center {
  	margin-left: auto !important;
    margin-right: auto !important;
}


/* ----------- Gallery style -------------*/

.ngg-galleryoverview {
	overflow: hidden;
	margin:1em 0 0 0;
	clear:both; 
	display:block !important;
	width:100%;

}

.ngg-galleryoverview .desc {
/* required for description */
   margin:0px 10px 10px 0px;
   padding:5px;
}

.ngg-gallery-thumbnail-box {
	float: left;
}

.ngg-gallery-thumbnail {
	float: left;
	text-align: center;
}

.ngg-gallery-thumbnail img {
	background-color:#ffffff;
	display:block;  
	margin:0 16px 16px 0;
	padding:4px;
	position:relative;
	background-color: #2c2c2c;
}

.ngg-gallery-thumbnail img:hover,
.ngg-gallery-thumbnail a:focus img {
	background-color: #8a572d;
} 


.ngg-gallery-thumbnail span { /* Images description */
	font-size:90%;
	padding-left:5px;
	display:block;
}

.ngg-clear {
	clear: both;
}