/********************

www.philaestheta.com stylesheet
author: Philip Ashlock
created: August 2006
********************/



/*******************

Basics

********************/

/* Forces scrollbars so centered pages don't shift */
html { height: 100%; margin-bottom: 1px; }


body {
margin : 0;
padding : 0;
background : #000041 url(/images/canvas.gif) repeat-x;
font : normal normal normal 12px/19px verdana, arial, sans-serif;
color : #000000;
}

a {
outline: none !important; /* @ Firefox, remove ugly dotted border */
 }

a:hover {
text-decoration : none;
}







/*******************

Page Construction

********************/

#container {
float : left; 
position : absolute;
left : 50%;
margin-left : -381px;
width : 776px;
}	

#page-body {
padding : 0px 0px 0px 13px;
float : left; 
width : 762px; /* 776px after padding */
background : transparent url(/images/bg.png) repeat-y;
}	


#pa-header {
margin : 0;
padding : 0;
line-height : 0;
font-size : 0;
float : left;
width : 627px;
text-indent : -99999em;
overflow : hidden;
height : 36px;
background : transparent url(/images/pa-header.jpg) no-repeat;
}	

#search-box {
float : left;
width : 123px;
height : 36px;
background : transparent url(/images/search-box.jpg) no-repeat;
}		
	
#header-edge {
float : right;
width : 12px;
height : 125px;
background : transparent url(/images/header-edge.gif) no-repeat;
}	

#header-logo {
float : left;
width : 750px;
height : 89px;
background : transparent url(/images/header-logo.jpg) no-repeat;
}










/*******************

Navigation

********************/



#nav-strip {
float : left;
width : 490px;
height : 47px; 
background : transparent url(/images/nav-strip.jpg) no-repeat;
margin : 0;
padding : 0;
list-style-type : none;
}


#nav-strip li {
display : inline;
}

#page-header a, #header-logo, #nav-strip a, #nav-right a {
float : left;
text-indent : -999999em;
float : left;
text-decoration : none;
overflow : hidden;
}







#nav-about {
float : left;
width : 89px;
height : 47px;
margin-left : 25px;
background : transparent url(/images/nav-about.jpg) no-repeat bottom left;
}

a:hover#nav-about {
background : transparent url(/images/nav-about.jpg) no-repeat;
}


#nav-portfolio {
float : left;
width : 126px;
height : 47px;
background : transparent url(/images/nav-portfolio.jpg) no-repeat bottom left;
}

a:hover#nav-portfolio {
background : transparent url(/images/nav-portfolio.jpg) no-repeat;
}

#nav-notebook {
float : left;
width : 117px;
height : 47px;
background : transparent url(/images/nav-notebook.jpg) no-repeat bottom left;
}

a:hover#nav-notebook {
background : transparent url(/images/nav-notebook.jpg) no-repeat;
}


#nav-home {
float : left;
width : 36px;
height : 47px;
background : transparent url(/images/nav-home.jpg) no-repeat bottom left;
}

a:hover#nav-home {
background : transparent url(/images/nav-home.jpg) no-repeat;
}

#nav-outside {
float : left;
width : 97px;
height : 47px;
background : transparent url(/images/nav-outside.jpg) no-repeat bottom left;
}

a:hover#nav-outside {
background : transparent url(/images/nav-outside.jpg) no-repeat;
}

#nav-right {
float : left;
width : 260px;
height : 47px; 
background : transparent url(/images/nav-right.jpg) no-repeat;
}

#nav-right a {
float : right;
}

a#nav-contact {
float : right;
width : 85px;
height : 47px; 
background : transparent url(/images/nav-contact.jpg) no-repeat bottom left;
}

a:hover#nav-contact {
background : transparent url(/images/nav-contact.jpg) no-repeat;
}







/*******************

Content

********************/


#content {
float : left;
width : 750px; 
background : transparent url(/images/cb-body.png) repeat-y;
overflow : hidden;
}






/*******************

Content Top

********************/

#content-top {
color : #ffffff;
float : left;
width : 750px; 
background : #044a7e url(/images/content-top-bg.jpg) no-repeat;
font-size : 1em;
line-height : 1.7em;

}

#content-top a {
color : #ffffff;
display : block;
padding-top : 5px;
}

#content-top .stretcher a {
display : inline;
}

#content-top .stretcher {
background : transparent url(/images/content-top-bg.jpg) no-repeat 0 -25px;
}


#content-top #tag-cloud {
padding : 10px 40px;
}







/*******************

Content Bottom

********************/


#content-bottom {
overflow : hidden;
float : left;
width : 710px; /* 750px after padding */
margin-top : -18px;
padding : 0 20px 38px 20px;
background : transparent url(/images/cb-foot.jpg) no-repeat bottom left;
}


#content-bottom a {
color : #000000;
}

#content-bottom h3 {
color : #771d0c;
font : normal normal normal 1.45em/1.6em Georgia, Sans-Serif;
margin : 0 0 .5em 0;
}






#content-bottom p {

margin : 0 0 1.2em 0;
}

#content-bottom h4 {
font-size : 1em;
margin : 0 0 .1em 0;
}








/*******************

Front page

********************/

#intro-box, #featured-box {
float : left;
width : 335px; /* 375px after padding */
padding : 10px 20px 20px 20px;
margin-top : .7em;
}

#intro-box p {
font-size : 1.09em;
line-height : 2.1em;
margin : 0 0 1em 0;
}

#intro-box h2, #featured-box h2 {
font : normal normal normal 1.6em/1.6em Georgia, Sans-Serif;
margin : 0 0 .2em 0;
padding : 0;
text-decoration : none;
}

#intro-box h2 a {
text-decoration : none;
padding : 0;
margin : 0;
}

#featured-box p {
margin : 0 0 .5em 0;
}



#featured-box p {
font-size : .92em;
line-height : 1.5em;
}


#featured-box img {
margin : .7em 0 .1em 0;
display : block;
border : 1px solid black;
}

#featured-box .image-caption {
display : block;
font-size : .87em;
margin-bottom : .7em;
}












#content-bottom #cb-photos h3 {
font-size : 1.45em;
margin : 0 0 .1em 0;
}


#cb-notebook {
float : left;
width : 305px;
}

#cb-notebook p {
font-size : .99em;
line-height : 1.6em;
text-align : justify;
margin : .3em .8em 1em 0;

}

#cb-notebook h3 a {
display : block;
margin : 1em 0 0 0;
padding : 0;
font : normal normal bold .7em/1.4em verdana, sans-serif;
}




#cb-photos {
float : left;
text-align : center;
width : 100px; /* 100px after padding */
}

#cb-photos #flower-box {
width : 75px;
height : 80px;
margin : 0 13px 10px 11px;
background : transparent url(/images/flower.png) no-repeat;
}

#cb-photos img {
margin : 5px;
border-color : black;
}

#cb-photos img a {
border-color : black;
}




#cb-outside {

float : left;
width : 305px; 
}

#cb-outside p {
width : 100%;
font-size : .95em;
line-height : 1.3em;


margin : .1em .8em 2em 0;
}

#cb-outside h4 {
margin : 1em 0 0 0;
padding : 0;
font : normal normal bold .99em/1.4em verdana, sans-serif;
}




#cb-head {
float : left;
width : 750px; 
height : 54px;
background : transparent url(/images/cb-head.png) no-repeat;
}








/*******************

Content Footer
********************/



#content-footer {

overflow : hidden;
float : left; 
width : 750px;
background : #014a7a url(/images/content-footer.jpg) no-repeat bottom;
}	

#content-footer, #content-footer a {
color : #cbf3ff;
text-decoration : none;
font-size : .97em;
}

#content-footer a:hover {
color : #ffffff;
text-decoration : underline;
}


#cf-left {
margin : 0;
padding : 20px 0 0 15px;
float : left;
width : 185px; /* 200px after padding */
}

#cf-left li {
display : inline;
text-align : right;
}

#cf-right {
margin : 0;
padding : 20px 15px 0 0;
float : right;
width : 200px;
text-align : right;
width : 185px; /* 200px after padding */
}

#cf-right li {
display : inline;
text-align : right;
}

#cf-mid {
float : right;
height : 30px; /* 50px after padding */
padding : 20px 25px 0 25px;
width : 300px; /* 350px after padding */
}

#cf-mid a {
color : #93c5e1;
}

#cf-mid #cr-link {
float : left;
}

#cf-mid #pa-link {
float : right;
}



#page-footer {
margin : 0;
float : left; 
width : 776px; /* 776px after padding */
height : 40px;
background : transparent url(/images/page-footer.png) no-repeat;
overflow : hidden;
}	













	
	
#gallery-categories a {
float : left;
width : 128px;
height : 128px;
margin : 10px;
background : transparent url(/images/thumb-large.gif) no-repeat;
}
	
#gallery-categories a:hover {
background : #ffffff;
}	





/*******************

Subnav

********************/



#subnav {
font-size : 1em;
padding : 8px 0 0 32px;
}

#subnav a {
display : inline;
padding : 4px 8px;
text-decoration : none;
}

#subnav a:hover {
text-decoration : underline;
}

.drawer {
padding-bottom : 2em;

}





/*******************

Search Styles

********************/




#searchform {
float : left;
margin : 0;
padding : 0;
border-width : 0;
}

#searchform fieldset {
float : left;
padding : 0;
border : 0;
margin : 0;
width : 130px;
position : absolute;
z-index : 10;
}

#searchform label {
display : none;
}


#livesearch {
float : left;
clear : none;
width : 90px; /* 104px after padding */
height : 16px; /* 24px after padding */
border : 0;
background : transparent;
padding : 3px 3px 2px 4px;

margin : 2px 0 0 0;
color : #2e3a00;
font-family : 'Lucida Grande', Verdana, Arial, Sans-Serif;
font-size : 1em;

}

#livesearchsubmit {
float : right;
height : 25px;
width : 30px;
border : 0;
font-size : 0;
text-indent : -1000px;
overflow : hidden;
background-color : transparent;
}

#LSResult { 
position: absolute; 
background-color: #eff68c; 
width: 350px; 
margin-left : -225px; 
top : 25px; 
}



#LSShadow { padding: 5px; }



.LSRow { 
padding: 0 5px; 
margin : 2px 0;
}

#LSResult .LSRow a:link, #LSResult .LSRow a:visited {
color : #2C5F00;
text-indent : 0;
padding : .5em 0 .5em .3em;

border-bottom : 1px solid #DBDF9B;
display : block;
width : 100%;
}

#LSResult .LSRow a:hover {
background-color : #F1F6B0;
border-bottom : 1px solid #DBDF9B;
}


#LSHeader {
border-bottom : 1px solid #C5C98C;
}


#LSHeader a {
text-indent : 0;
color : #771D0C;
}

#LSHighlight { background-color: #aaa; }

#LSHeader { padding: 0; }
.lsDate { display: block; color: #555; }


#rssLiveArchive { margin: 10px 0 0; }
#rssLiveArchive ul { padding: 0; list-style-type: none; }
#rssLiveArchive ul li { text-align: left; padding: 1px 8px; }
#rssLiveArchive-year { float: left; width: 100px; margin: 0; padding: 0; }
#rssLiveArchive-year li { position: relative; font-weight: bold; }
#rssLiveArchive-month { float: left; width: 100px; margin: 0; font-weight: bold; }
#rssLiveArchive-month li { position: relative; }
#rssLiveArchive-post { float: left; width: 250px; margin: 0; }
#rssLiveArchive-post li { position: relative; font-weight: bold; }
#rssLiveArchive ul li span { position: absolute; right: 8px; font-weight: normal; color: #333; }
*html #rssLiveArchive ul li span { top: -4px; }
#rssLiveArchive .selected { background: #eee; padding-top: 0; padding-bottom: 0; }










/*******************

Portfolio List & Page

********************/



.portfolio-list {
margin-top : -30px;
float : left;
width : 100%;
}


#content-bottom .portfolio-list { 
float : left;
padding : 3em 0;
}

#content-bottom .portfolio-list div {
float : left;
margin : 0 0 2em 0;

} 


.portfolio-list h3 a {
text-decoration : none;
}

#content-bottom  .portfolio-list h3 a:hover {
text-decoration : none;
color : #802A0D;
}


#content-bottom .portfolio-list h3, 
#content-bottom .portfolio-page h3 {
margin : .5em 0 .5em 0;
padding : 0;
line-height : 1em;
width : 100%;
text-decoration : none;
float : left;
border-bottom : 1px solid black;
}

.portfolio-list h3, 
.portfolio-page h3 {

}

#content-bottom .portfolio-page h4.view-project {
font-size : 1.2em;
margin-bottom : 1.2em;
}



.portfolio-list img, 
.portfolio-page img {
border : 1px solid #8b4d0b;
margin-top : 0;
float : left;
}


#content-bottom .portfolio-page {
line-height : 1em;
font-size : 1em;
padding-bottom : 1em;
}

#content-bottom .portfolio-page p {
float : none;
padding : 0;

margin : .6em 0 1.8em 0;
line-height : 1.6em;
font-size : 1em;
text-align : justify;
}




#content-bottom .portfolio-page .rightside img {
float : right;
margin : 0 0 3em 3.5em;
clear : both;
}

#content-bottom .portfolio-heading {
margin-bottom : 2em;
float : left;
}


.portfolio-list a.web-design, .portfolio-page a.web-design,
.portfolio-list a.print-media, .portfolio-page a.print-media, 
.portfolio-list a.code, .portfolio-page a.code {
float : left;
width : 98px;
height : 116px;
border : 1px solid black;
margin-right : 7px;
text-indent : -1500px;
overflow : hidden;

}




.portfolio-list .web-design, .portfolio-page .web-design {
background : transparent url(/images/symbol-webdesign.png) no-repeat;
}

.portfolio-list .code, .portfolio-page .code {
background : transparent url(/images/symbol-code.png) no-repeat;
}


.project-details {
font-size : .91em;
line-height : 1.5em;
float : right;
width : 250px;
padding : 5px;
border : 1px solid #feeed0;
margin : 0 0 5em 3.5em;
}

.project-details tr {
background-color : #fffff5;
padding : 1ex 1em;
}

.project-details th {
text-align : left;
vertical-align: top;
padding : 1ex 1em;
}









/*******************

Contact Page

********************/


#email-form form label, #email-form form input, #email-form form textarea {
float : left;
clear : both;
}

#email-form form label {
margin-top : 1.5em;
font-size : 1em;
color : #51411d;
}

#email-form form textarea {
margin-bottom : 2ex;
}

#email-form form input, #email-form form textarea {
border : 1px solid #caae6b;
background : #fffffb url(/images/form-field-bg.gif) repeat-x;
padding : .5ex;
color : #231d0d;
font-family : verdana, arial, sans-serif;
font-size : 1.2em
}

#email-form form #contact-submit {
background : #fffffb url(/images/form-submit-bg.gif) repeat-x;
}

#contact-details {
margin : 2ex;
font-size : .96em;
line-height : 1.4em;
}

#hcard a {
display : inline;
}

#hcard #hcard-main img {
padding : 4px;
margin : 0 2ex 0 0;
background-color : #7ca1c8;
}

#hcard #hcard-main img, #hcard #hcard-main a img {
border : 1px solid #a1bbd7;
}

#hcard ul {
margin : .8em 0;
}


#hcard ul li {
list-style-type : none;
}

#hcard #hcard-links {
float : left;
}

#hcard #hcard-links ul, #hcard #hcard-links ul li {
margin : 0 0 0 2em;
padding : 0;
}

#hcard #hcard-main {
float : left;
width : 50%;
padding : 1ex;
margin-bottom : .05em;
}

#hcard ul#create-hcard {
margin-top : 2em;
}

#hcard ul#create-hcard li {
margin-bottom : 0.5ex;
}



















/*******************

Notebook List

********************/

#content-bottom .notebook-lead {

float : left;
width : 100%;
margin-bottom : 3em;


}


.notebook-lead h3 span { 
color : #3F0F0C
}

.notebook-lead p {
text-align : justify;
}






/*******************

Notebook Page

********************/


.notebook-details {
padding : .5em;

display : block;
clear : both;
border : none;
background-color : #F2F2DF;
}

.notebook-tags {
color : #726C64;
padding-left : 2em;
}

#content-bottom .notebook-tags a {
color : #605B54
}

#content-bottom .notebook-tags a:hover {
color : #161514;
text-decoration : underline;
}


#txpCommentInputForm {
float : left;
margin-bottom : 2em;
}