@charset "UTF-8";
/* CSS Document */


/* Stylesheet Information Index 
Author: Nadine Lessio
Site: http://nadinelessio.com
Revision: 1.0
Stylesheet Media: Screen
Description: Base stylesheet for Eric Kim / Inkskratch.com (IE6/IE7, Firefox 2/3, and Safari for Mac).*/


/*body and links */


body {
font: .75em Helvetica, "Helvetica", Arial, sans-serif;
color: black;
line-height: 1.3em;
overflow-x: hidden;
}


a {
text-decoration: underline;
color: black;
outline: none;

}

a:hover {
color: #999;
}

h1, h2, h3, h4, h5 {

text-transform: uppercase;
font-weight: bold;
}


h1 {
font-size: 1.7em;
line-height: 1.3em;
}

h2 {
font-size: 1.5em;
}

h3 {
font-size: 1.2em;
line-hegiht: 1.2em;
}

h4 {

}

/* forms */

.booya {
border: 4px solid #999;
background: black;
color: white;
float: left;
margin: 5px 5px 0 0;
}



.btn {
background: url(../img/btn.png) 0 0 no-repeat;
border: none;
color: white;
padding: 3px 10px 10px 5px;
float: left;
margin-top: 5px;
}

.btn:hover {
background: url(../img/btn2.png) 0 0 no-repeat;
}




/*structure */
div#colourWrap {
/*height: 400% !important; */
min-height: 400% !important;
position: absolute; top: 0; left: 210px;
width: 435px;
z-index: -2;
}

div#colourGrime {
position: absolute; top: 50px; left: 160px;
height: 1024px;
width: 500px;
z-index: -3;
}

div#grimeTop {
background: url(../img/grimeUp.png) 0 0 no-repeat;
position: absolute; top: 0; left: 150px;
height: 120px;
width: 600px;
z-index: -1;
}

div#contentWrap {
width: 1300px;
margin: 0 0 0 50px;

}

div#wings {
position: absolute; top: 20px; left: 750px;
width: 49px;
height: 35px;
z-index: 5;
background: url(../img/wings.png) 0 0 no-repeat;
}

div#wings:hover {
background: url(../img/wings2.png) 0 0 no-repeat;
/*opacity:0.50;filter:alpha(opacity=50);*/
z-index: 5;
}






div#leftNav {
background: blue;
float: left;
/*position: absolute; top: 115px; left: 50px;*/
width: 160px;
text-align: right;
margin: 0 15px 0 0;
padding: 5px 0 5px 0;
}

div#leftNav ul {
padding: 10px 0 5px 5px;
}

div#leftNav ul li {
padding: 0 0 3px 0;
}

div#leftNav img {
padding: 5px;
margin: 5px 0px 5px 0;
background: black;
}


/* header */


div#header {
height: 115px;
width: 100%;
}

div#nav {
text-transform: uppercase;
font-weight: bold;
font-size: 1.2em;
position:relative; top: 15px; left: 0;
}

div#barOne, div#barTwo, div#barThree, div#barFour{
text-decoration: none;
background: black;
height: 20px;
margin: 0 0 2px 0;

}

div#nav a {
padding: 0 0 0 50px;
display: block;
width: 100%;
z-index: 2;
text-decoration: none;
}

a#meta {
position: absolute; top: 3px; left: 0;
color: black;
}

a#meta:hover {
color: #ded1f8;
}


a#blog {
position: absolute; top: 25px; left: 0;

}

a#blog:hover {
color: #ead8b8;
}

a#illo {
position: absolute; top: 47px; left: 0;
}

a#illo:hover {
color: #f7d46d;
}


a#comics  {
position: absolute; top: 69px; left: 0;

}

a#comics:hover  {
color: #a2f5fd;
}




div#sideHugger {
/*border: 1px solid black;*/
height: 300px;
position: fixed; top: 300px; left: 0;
width: 30px;
z-index: 3;
}

div#sideHugger img {
padding: 0 0 5px 0;
}

div#sideHugger img:hover {
opacity:0.60;filter:alpha(opacity=60);
}


/*illustration and picture items*/


div#imgHolder  {
background: url(../img/bgIlloBlack.gif) 0 0 repeat-y;
color: #fff;
float: left;
min-width: 440px;
}

div#imgHolderTwo {
background: black;
color: #fff;
float: left;
width: 685px;	
}

div#imgHolderTwo img {
	padding: 0 10px 10px 0;
}

div#imgHolderTwo img:hover {
opacity:0.50;filter:alpha(opacity=50);
}

div#imgHolder, div#imgHolderTwo  {
padding: 20px 0 20px 20px;
}

div#imgHolder p, div#imgHolder h3 {
padding: 5px 0 0 0;
}

div#imgHolderTwo p, div#imgHolderTwo h3 {
padding: 5px 0 0 0;
}


/* stuff for comic holder */

div#comicHolder  {
background: white;
/*margin: 5px 0 30px 225px;*/
padding: 15px 0 30px 15px;
width: 450px;
float: left;
}


div#comicHolder img {
border: 10px solid #dfdfdf;
margin: 0 0 10px 0;
}

p.client {
font-size: .7em;
padding: 0 0 10px 0;
}

div#comicRight {
/*position: absolute; top: 190px; left: 690px;*/
width: 280px;
float: left;
margin: 80px 0 0 0;
}

div#comicRight h3 {
padding-left: 10px;
}

div#comicRight div#purDown {
background: #dfdfdf;
padding: 10px 0 5px 0;
margin: 0 0 5px 0;
}

div#purDown form {
float: left;
padding: 0;
}

div#purDown h3 {
float: left;
margin: 10px 5px 0 0;
}

div.previews {
border-top: 1px solid black;
border-bottom: 1px solid black;
margin: 5px 0 2px 10px;
padding: 5px 0 3px 0;
}

div.previews img {
padding: 0 5px 0 0;
}

div.previews img:hover {
opacity:0.50;filter:alpha(opacity=50);
}

div#comicRight ul {
margin: 0 0 5px 0;
}

div.cBody {
margin: 5px 0 10px 10px;
border-bottom: 1px solid black;
}

div.cBody h3 {
margin: 5px 0 5px -10px;

}






/* Linear Nav for under images */

div#linearNav {
margin: 0 0 0 175px;
width: 420px;
}

p.rNext {
float: right;
width: 150px;
text-align: right;
padding: 5px;
}

p.lPrev {
float: left;
width: 150px;
padding: 5px 0 0 0;
}




/* front bits */

div#sideBar {
float: left;
width: 250px;
margin: 0 0 0 15px;
}

div.greyDistress {
margin: 0 0 15px 0;
}

div.greyDistress .innard {
padding: 5px 10px 0 10px;
background: #e9e9e9;
}

h3.distress {
background: url(../img/sideBarTop.png) 0 0 no-repeat;
padding: 15px 10px 0 10px;
margin: 0;

}

.moreLink {
background: url(../img/sideBarBtm.png) left bottom no-repeat;
text-align: right;
padding: 0 10px 10px 10px;
}


/* blog */

div#blogHolder {
padding: 15px 0 30px 0;
width: 675px;
float: left;
}

div#blogHolder div#archive {
background: white;
margin: 0 0 0 175px;
padding: 15px;
}

div#archive h1, div#archive h2  {
margin: 0 0 10px 0;
}

div#archive h2 {
color: #5d0000;
}

div#archive h3 {
padding: 0 0 5px 0;
margin: 0 0 5px 0;
border-bottom: 1px solid #e8e8e8;
order-top: 1px solid #e8e8e8;
}


div.blogMeta {
float: left;
width: 160px;
background: #ead8b8;
margin: 0 15px 0 0;
padding: 5px 0 5px 0;
}

div.blogMeta p {
padding: 0 0 0 5px;
}

p.date {
font-size: 1.5em;
margin-bottom: 5px;
}



div.postBody {
background: url(../img/blogArrow.png) 0 7px no-repeat white;
margin: 0 0 0 175px;
padding: 10px;
}


div.postBody h1 {
padding: 0 0 10px 0;
}

div.postBody h1 a, p#archive a  {
color: #5d0000;
}

div.postBody h1 a:hover, p#archive a:hover {
color: #830000;
}

div.smallPost h1 a, div.smallPost p {
color: white;
}

div.smallPost h1 a:hover {
color: #e8e8e8;
}


div.blogShare {
border-top: 1px solid #e8e8e8;
padding: 5px 0 0 0;
margin: 5px 0 20px 0;
clear: left;
}

.social {
float: left;
margin: 0 10px 0 0;
}

div#smallerPosts {
background: white;
margin: 0 0 0 175px;
padding: 15px 15px 40px 15px;
}

div.smallPost {
background: #9d9d9d;
margin: 0 0 10px 0;
padding: 10px;
}

p#archive {
background: url(../img/archiveBg.png) 0 0 no-repeat white;
width: 90px;
text-align: left;
text-transform: uppercase;
font-weight: bold;
padding: 8px 0 5px 55px;
height: 16px;
position: absolute; top: 101px; left: 535px;
z-index: 0;
}



p.smallMeta {
float: right;
}

/*some clear things */

.clearFix {
clear: both;
}





/* about section */

div#aboutHolder {
background: white;
float: left;
}

div#aboutLeft {
float: left;
width: 280px;
}

div#aboutLeft img {
border: 5px solid #999898;
margin: 15px;
}

div#aboutRight {
float: left;
width: 475px;
margin: 15px 0 0 0;
}

div#aboutRight h1 {
margin: 0 0 10px 0;
}

div#aboutRight h2 {
margin: 10px 0 10px 0;
}

div#aboutRight ul {
float: left;
width: 220px;
margin: 0 10px 0 0;
}

div#aboutRight ul li {
margin: 0 0 3px 0;
}

/*comments */



.comments li {
background: #e9e9e9;
padding: 10px;
margin: 10px 0 0 0;
}


.comments-wrapper {

}

.comments-wrapper div {
margin: 10px 0 10px 0;
}

.small {
padding: 3px 0 0 0;
}

form label {
width: 4em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block

}


#comments-help {

}

/* flickr */

div.innardTwo img {
padding: 20px;
}

.white a {
color: white;
text-decoration: none;
}

.white img {
border: 1px solid black;
}
