/* Reset */
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { margin:0; padding:0;}
ul, ol {list-style:none}
/* ------------------------------ */

/* ================ */
/* = The 1Kb Grid = */     /* 12 columns, 60 pixels each, with 20 pixel gutter */
/* ================ */

.grid_1 { width:60px; }
.grid_2 { width:140px; }
.grid_3 { width:220px; }
.grid_4 { width:300px; }
.grid_5 { width:380px; }
.grid_6 { width:460px; }
.grid_7 { width:540px; }
.grid_8 { width:620px; }
.grid_9 { width:700px; }
.grid_10 { width:780px; }
.grid_11 { width:860px; }
.grid_12 { width:940px; }

.column {
	margin: 0 10px;
	overflow: hidden;
	float: left;
	display: inline;
}
.row {
	width: 960px;
	margin: 0 auto;
overflow: hidden;
	position:relative;
}
.row .row {
	margin: 0 -10px;
	width: auto;
	display: inline-block;
}

/* Image hover */
a img{border: 1px solid #087D81;padding:0px;margin:3px}
a:hover img{border: 1px solid #F60;padding:0px;}
a:hover{color: #f60;border: 0px ;} /* Dummy definition to overcome IE bug */

/* Type */
a {color:#087D81;}
a:hover{color:#F60}
#footer a {text-decoration:none}
body {font-size: 62.5%;color:#333;font-family:"Lucida Sans Unicode","Trebuchet MS", Verdana, Arial, Helvectica;background:#FFF} /* 1em = 12 pixels */
h1 {font-size:3em;color:#087D81;margin-top:30px;font-weight:normal;border-bottom:#666;padding-bottom:15px;margin-bottom:15px;
text-shadow:0px 1px 0px #b3dbde}
h1 span#name {display:block;font-size:3.2em;color:#F60;position:absolute;bottom:-37px;left:44px;text-shadow:0px 1px 0px #FC9,0px 2px 0px #FC9}
h1 {font-family:"corner-store-1","corner-store-2",Georgia, Times New Roman, Times, serif}
p, li {font-size:1.2em;line-height:150%;margin:0 0 10px}

h2, h3, h4, h5 {font-family:"museo-sans-1","museo-sans-2", Arial, Helvetica, sans-serif;text-transform:uppercase;color:#490A1E}
h2, h3 {margin-bottom:10px;padding-bottom:10px;border-bottom:1px #CCC dotted;font-size:1.4em}

#footer {color:#666}
.note {color:#999;font-size:1em}
.note a {text-decoration:none;}


/* Layout */
body{margin-bottom:30px}
#header {margin-bottom:30px;padding-bottom:20px;border-bottom:1px #CCC solid;overflow:visible}
#content {}
#intro {margin-bottom:30px;padding:20px 0;border-bottom:1px #eaeaea solid;background:#f9f9f9}
#intro p {padding:0 15px 0 15px;}
#portfolio, #elsewhere, #cv {margin-bottom:50px}
#project-list {margin:25px 0}
#footer {padding:30px 0;margin-top:30px;border-top:1px #CCC solid;clear:both}
/* Icons */
.icon {padding-left:20px;background-repeat: no-repeat;background-position: left center;}

.linkedin {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/linkedin-16x16.png);}
.flickr {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/flickr-16x16.png);}
.lastfm {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/lastfm-16x16.png);}
.twitter {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/twitter-16x16.png);}
.ffffound {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/ffffound-16x16.png);}
.vimeo {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/vimeo-16x16.png);}
.huffduffer {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/huffduffer-16x16.png);}
.gowalla {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/gowalla-16x16.png);}
.msn {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/messenger-16x16.png);}
.gtalk {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/google-talk-16x16.png);}
.delicious {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/delicious-16x16.png);}
.facebook {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/facebook-16x16.png);}
.ember {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/ember-16x16.png);}
.spotify {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/spotify.png);}
.web {background-image: url(http://cdn.iampaulburgess.co.uk/gfx/website-16x16.gif);}
.skype {background-image: url(http://mystatus.skype.com/smallicon/iampaulburgess);}
.print {background-image:url(http://v1.iampaulburgess.co.uk/gfx/icon_printer.png);}
.pdf {background-image:url(http://v1.iampaulburgess.co.uk/gfx/icon_pdf.gif);}
.behance {background-image:url(http://v1.iampaulburgess.co.uk/gfx/icon_behance.png);}
/* http://cdn.iampaulburgess.co.uk/gfx/skype-16x16.png */
#skype {margin:10px 0}

/* CV bits */
body.hresume h3 {margin-top:35px}
.experience, .education {margin-bottom:30px;position:relative}

.title {font-weight:bold}
.date_duration {position:absolute;right:0;top:1.8em;color:#666}
.date_duration p {font-size:1em}
.date_duration abbr {border-bottom:1px #e4e3e3 dotted}
#tools a {text-decoration:none;}


/* I like */
#like {background:#f9f9f9;border-top:1px #EEE solid;border-bottom:1px #EEE solid;margin:30px 0;padding-bottom:15px}
#like p.note {float:right;}

/* Last FM */
#lastfmrecords {margin-top:30px}
#lastfmrecords img {width:80px;height:80px; margin:0}
#lastfmrecords li {margin:8px 13px 8px 0}
#lastfmrecords li.last {margin-right:0} 
#lastfmrecords ol {position:relative;padding-bottom:20px}
#lastfmrecords li a em {position:absolute;left:-2px;bottom:-10px;z-index:9999;width:auto;padding:5px;color:#333;font-size:0.9em;font-style:normal}

/* FFFFOUND */
#images {overflow:hidden;}
#images ul {padding-bottom:20px;position:relative;overflow:hidden;height:102px}
#images li {float:left;margin:8px 13px 8px 0}
#images li.last {margin-right:0} 
#images li a:hover {border: 1px solid #F60;padding:0px;}
#images li a {border: 1px solid #087D81;padding:0px;display:block;width:80px;height:80px;background-position:center center;background-repeat:no-repeat}
#images li a span {display:none}
#images li a em {position:absolute;left:-2px;bottom:0px;z-index:9999;width:auto;padding:5px;color:#333;font-size:0.9em;font-style:normal}

/* @media */

/*layouts smaller than 600px, iPhone and mobiles*/
@media handheld and (max-width: 480px), screen and (max-device-width: 480px), screen and (max-width: 600px)  {
@import url("kill-grid.css");

#header {padding-bottom:5px}

h1 {font-size: 1.8em;margin:0 0 0 15px;}
h1 span#name {font-size:2em;position:absolute;bottom:-10px;left:50px;width:275px}	
.column {width:290px;clear:both;}
.row {width:320px}

#like p.note {float:none}
#lastfmrecords ol li img{margin:8px 3px 0px 0}
#lastfmrecords ol li:last-child {display:none !important} /* 10 images by default  - but grid of 9 looks much neater */
#lastfmrecords em {display:none !important} /* hide jquery rollover fade - partly as there is no rollover on a phone/handheld */ 
/* disable lightbox for phones - so actually hide the ffffound stuff */
#images {display:none}

}

/* iPhone only */
/*
@media only screen and (max-device-width: 480px) {

}
*/