/*
Theme Name: Jacob's Theme
Theme URI: www.siegelsounds.com
Description: Working with Jacob's Website.
Version: 1.0
Author: Jacob Siegel
Tags: mantle color, variable width, two columns, widgets



Please leave this header as it is; the Wordpress Blog needs it in order to classify this style sheet. 
*/


/* -- Generic -- */
body { font:62.5% 'Arial', Times, serif; margin:0; background-color:#99f; padding:0; }
p, h2, h3, h4, h5, h6, img, form, input { margin:0; padding:0 }
a { text-decoration:none; border:0; outline: none;}
html { height:100%; margin: 0; padding: 0; }


/* Main Content Area - Outer Shell -- */
.jacobsMainContainer { margin:0; padding:0;}
.jacobsMainInnerContainer { margin:0px auto; width:700px; padding:0; background-color:#030;}


/*Top Picture and Navigation*/
.jacobsPictorial { height:100px; border:0; padding:0; background-color:#000; color:#fff; font-size:2.0em;}
.jacobsPictorial img {text-decoration:none; border:0;}
.jacobsNavigation { padding:10px 3px 10px 0; margin:0; background-color:#000; }
.jacobsNavigation h1 {display:inline; padding:4px 5px; border-width:1px; border-style:solid; border-color:#030; margin:0 7px 0 0; text-align:left; font-size:1.0em; font-weight:900; color:#FFF; }
.jacobsNavigation h1:hover     { color:#FFF; background-color:#030; }
.jacobsNavigation h1.now	 { color:#FFF; background-color:#030;}
.jacobsNavigation h1 a {text-decoration:none; color:#FFF;}

/*Index Page*/
.IndexHideNav {visibility:hidden;}
.MainInnerContainerIndex {height:450px; max-height: 100%; background-color:#ccc; background-image:url('MainPagePiano.jpg'); background-repeat:repeat-x; position:relative;}
.MainInnerContainerIndex h2 {display:inline; padding:4px 10px; border-width:1px; border-style:solid; border-color:#999; text-align:left; font-size:1.0em; font-weight:1000; color:#FFF; background-color:#f90; }
.MainInnerContainerIndex.a {text-decoration:none; color:#FFF}
.MainInnerContainerIndex h2:hover     {padding:4px 10px; color:#030; background-color:#CCC; }
.MainInnerContainerIndex h2.LinkAboutMe {position:absolute; left:100px; top:150px}
.MainInnerContainerIndex object.LinkAboutMe {position:absolute; left:100px; top:150px}
.MainInnerContainerIndex h2.LinkMusicSample {position:absolute; left:200px; top:100px}
.MainInnerContainerIndex h2.LinkThoughts {position:absolute; left:50px; top:340px;  }
.MainInnerContainerIndex h2.LinkPhotos {position:absolute; left:390px; top:420px;}
.MainInnerContainerIndex h2.LinkLinks {position:absolute; left:570px; top:150px;}
.MainInnerContainerIndex h2.LinkContact {position:absolute; left:590px; top:350px;}

/*Main Content Area - Actual Content*/
/*Note that the images have to be in the same folder as the CSS file, for some reason*/
.MainInnerContainerText {float:left; color:#fff; font-size:1.2em; margin:0; padding:0; background-color:#030; width:700px; height:525px;overflow:auto; overflow-x:hidden; background-image:url('MainPagePianoBackground.jpg'); background-repeat:no-repeat;}
.MainInnerContainerText a {color:#f90; /*font-weight:bold;*/}
.MainInnerContainerText a:hover {color:#f9c;}
.MainInnerContainerText a:active {color:#999;}
.InnerContainerTextBox {width:500px; margin:0; padding:6px 2px 20px 0;}
.InnerContainerTextBox p { font-size:1.3em; color:#FFF; margin:20px 0 0 10px; padding:2px; border-width:1px; border-style:solid; border-color:#FFF; background-color:#000; opacity:0.8; filter:alpha(opacity=80); scrollbar-base-color:#030;}

/*Citation At Bottom*/
.Citation { width:700px; color:#FFF; font-size:1.3em; background-color:#336;}
.Citation p {text-align:center;}


/*Blog Page*/
/*.BlogLeftNav h3 {background-color:#000; font-size:1.1em; color:#fff; padding:4px 10px; border-width:1px; border-style:solid; border-color:#999; margin:7px 0 0 0; text-align:left;}*/
/*.BlogMainContent h4 {font-size:1.5em;text-align:center;}
.BlogMainContent h5 {font-size:0.8em; }*/
.BlogBox {width:700px; margin:0px auto; }
.BlogBox a {color:#f90;}
.BlogBox a img {border: none;}
.BlogBox a:visited {color: #f9c;}
.BlogBox a:hover {color: #999;}
.BlogLeftNav {float:left; margin:7px 0 0 0;}
.BlogMainContent {float:left; width:500px; font-size:1.1em; color:#FFF; margin:7px 0 0 10px; padding:2px; border-width:1px; border-style:solid; border-color:#FFF; background-color:#000; opacity:0.7; /*IE Browser*/filter:alpha(opacity=70);}
#header {font: italic 1.3em; letter-spacing: 0.2em; margin:7px 0 0 10px; padding: 7px 10px 3px 10px;}
#header a {color: #fff; text-decoration: none;}
#header a:hover {text-decoration: none;}
#menu {border-width:1px; border-style:solid; border-color:#FFF; margin:0 0 250px 3px; padding: 5px 0 10px 5px; width: 13em; /*position:relative;*/}
#menu form {margin: 0 0 0 13px;}
#menu input#s {width: 80%;background: #eee; border: 1px solid #999; color: #000;}
#menu ul {color: #999; font-weight: bold; list-style-type: none; margin: 0; padding-left: 3px; text-transform: lowercase;}
#menu ul li { /*font: italic normal 110% 'Times New Roman', Times, serif; letter-spacing: 0.1em;*/ margin-top: 10px; padding-bottom: 2px; /*border-bottom: dotted 1px #ccc;*/}
#menu ul ul {font-variant: normal; font-weight: normal; line-height: 100%; list-style-type: none; margin: 0; padding: 0; text-align: left;}
#menu ul ul li { border: 0; /*font: normal normal 12px/115% 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif; letter-spacing: 0;*/ margin-top: 0; padding: 0; padding-left: 12px;}
#menu ul ul li a {color: #fff; text-decoration: none;}
#menu ul ul li a:hover {border-bottom: 1px solid #809080;}
#menu ul ul ul.children {font-size: 142%; padding-left: 4px;}
.acronym, abbr {border-bottom: 1px dashed #333;}
.acronym, abbr, span.caps {font-size: 90%;letter-spacing: .07em;}
.acronym, abbr {cursor: help;}
.blockquote {border-left: 5px solid #ccc; margin-left: 1.5em; padding-left: 5px;}
.cite {font-size: 90%; font-style: normal;}
.ol#comments li p {font-size: 100%;}
/*.p, li, .feedback {font: 90%/175% 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;letter-spacing: -1px;}*/
/* classes used by the_meta() */
ul.post-meta {list-style: none;}
ul.post-meta span.post-meta-key {font-weight: bold;}
.credit {background: #90a090; border-top: 3px double #aba; color: #fff; font-size: 11px; margin: 10px 0 0 0; padding: 3px; text-align: center;}
.credit a:link, .credit a:hover {color: #fff;}
.feedback {color: #ccc; text-align: right; clear: both;}
.meta {font-size: .75em;}
.meta li, ul.post-meta li {display: inline;}
.meta ul {display: inline; list-style: none; margin: 0; padding: 0;}
.meta, .meta a {color: #808080; font-weight: normal; letter-spacing: 0;}
.storytitle {margin: 0;}
.storytitle a {text-decoration: none;}
#commentform #author, #commentform #email, #commentform #url, #commentform textarea {background: #fff; border: 1px solid #333; padding: .2em;}
#commentform textarea {width: 100%;}
#commentlist li ul {border-left: 1px solid #ddd; font-size: 110%; list-style-type: none;}
#commentlist li .avatar {float: right; margin-right: 25px; border: 1px dotted #ccc; padding: 2px;}
#content {margin: 5px 1em 0 1em; padding-right: 10px;}
#wp-calendar {border: 1px solid #ddd; empty-cells: show; font-size: 14px; margin: 0; width: 90%;}
#wp-calendar #next a {padding-right: 10px; text-align: right;}
#wp-calendar #prev a {padding-left: 10px; text-align: left;}
#wp-calendar a {display: block; text-decoration: none;}
#wp-calendar a:hover {background: #e0e6e0; color: #333;}
#wp-calendar caption {color: #999; font-size: 16px; text-align: left;}
#wp-calendar td {color: #ccc; font: normal 12px 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif; letter-spacing: normal; padding: 2px 0; text-align: center;}
#wp-calendar td.pad:hover {background: #fff;}
#wp-calendar td:hover, #wp-calendar #today {background: #eee; color: #bbb;}
#wp-calendar th {font-style: normal; text-transform: capitalize;}
/* Captions & aligment */
.aligncenter, div.aligncenter {display: block; margin-left: auto; margin-right: auto;}
.alignleft {float: left;}
.alignright {float: right;}
.wp-caption {border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.wp-caption img {margin: 0; padding: 0; border: 0 none;}
.wp-caption p.wp-caption-text {font-size: 1.1em; line-height: 17px; padding: 0 4px 5px; margin: 0;}
/* End captions & aligment */


/*Photo Gallery CSS*/
/*To be stylized*/
.photogallery {margin:10px 10px 400px 10px; padding:20px 10px 0 10px; /*border-color:#333; border-style:solid; border-width:4px;*/ position:static;}
.galleria {list-style:none;width:650px; height:auto;}
.galleria li{display:block;width:80px;height:80px;overflow:hidden;float:left;margin:0 10px 10px 0;}
.galleria li a{display:none;}
.galleria li div{position:absolute;display:none;top:0;left:180px;}
.galleria li div img{cursor:pointer;}
.galleria li.active div img,.galleria li.active div{margin: 0px auto; display:block; border-width:4px; border-style:solid; border-color:#fff;}
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto;}
.galleria li .caption{display:block;padding-top:.5em}
* html .galleria li div span{height: 300px;} /* MSIE bug */
.galleria_wrapper img {width:auto; height:300px;}


/*Contact Page Form */
.ContactForm {color:#FFF; font-size:1.3em; }
.ContactForm fieldset {width:600px; margin:0;}
.ContactForm legend {padding: 0 2px; font-weight: bold; color:#fff;}
.ContactForm label {display: inline-block; line-height: 1.8; vertical-align: top; color:#FFF }
.ContactForm fieldset ol {margin:0; padding:0;}
.ContactForm fieldset li {list-style: none; padding: 5px 0 0 0; margin:0;}
.ContactForm label {width: 120px; /* Width of labels */}
.ContactForm input, textarea {opacity:0.7; /*IE Browser*/filter:alpha(opacity=70); border-width:0; }
.ContactForm input.submit { padding: 4px 0; width: 100px; margin: 0 15px 1px 0; color: #003300; font-weight:bold; background-color:#fff; border-width:0;}
.ContactForm input.submit:hover {background-color:#ccc; color:#030; font-weight:bold; }
.ContactForm input.submit:active {background-color:#ccc; color:#030; font-weight:bold; }




/* References
- Contact Page Form - Help From http://alistapart.com/articles/prettyaccessibleforms 
Relative positioning help from http://www.barelyfitz.com/screencast/html-training/css/positioning/ 
Maybe in the future I can use http://www.oscaralexander.com/tutorials/how-to-make-sexy-buttons-with-css.html 
http://lorelle.wordpress.com/2007/06/06/blogging-tips-book-best-blog-design-elements/
http://www.alistapart.com/articles/footers
*/