/*

Simon O'Shea
Web Design Folio
Stylesheet

*/

@import url(reset.css);
@import url(colorbox.css);

* {
	margin: 0;
	padding: 0;
	outline: none;
}
body {
	background: #fff;
	font: 12px/21px "Lucida Grande", Verdana, sans-serif;
	color: #999;
}
#container {
	width: 1000px;
	margin: 0 auto;
}
#container_single {
	width: 980px;
	margin: 0 auto;
}
p {
	margin: 0 0 24px 0;
}
blockquote {
	color: #666;
	font-size: 18px;
	line-height: 28px;
}
.source {
	color: #666;
	line-height: 30px;
	margin: 0 0 20px 0;
	display: block;
}
.credits {
	color: #ccc;
	font-size: 10px;
	line-height: 21px;
}
a {
	color: #000;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}


/* Main */

h1,
#thumbs {
	text-indent: -9999px;
}
h1 {
	background: url(../images/title_webfolio.png);
	width: 400px;
	height: 180px;
	margin-top: 60px;
}
#thumbs li {
	float: left;
}
#thumbs a * {
	display: none;
}
#thumbs a,
#thumbs a .hover {
	width: 200px;
	height: 200px;
	display: block;
}

li.ghi a, li.ghi a .hover { background-image: url(../images/thumb_ghibli.jpg); }
li.bdd a, li.bdd a .hover { background-image: url(../images/thumb_bustin.jpg); }
li.ble a, li.ble a .hover { background-image: url(../images/thumb_bleach.jpg); }
li.qsb a, li.qsb a .hover { background-image: url(../images/thumb_quicksmart.jpg); }
li.ski a, li.ski a .hover { background-image: url(../images/thumb_skins.jpg); }
li.ses a, li.ses a .hover { background-image: url(../images/thumb_sesame.jpg); }
li.lrm a, li.lrm a .hover { background-image: url(../images/thumb_lastride.jpg); }
li.ree a, li.ree a .hover { background-image: url(../images/thumb_reelanime.jpg); }
li.nqh a, li.nqh a .hover { background-image: url(../images/thumb_nqh.jpg); }
li.sep a, li.sep a .hover { background-image: url(../images/thumb_septemberissue.jpg); }
li.dbz a, li.dbz a .hover { background-image: url(../images/thumb_dbz.jpg); }
li.dna a, li.dna a .hover { background-image: url(../images/thumb_deathnote.jpg); }
li.cga a, li.cga a .hover { background-image: url(../images/thumb_codegeass.jpg); }
li.gen a, li.gen a .hover { background-image: url(../images/thumb_genova.jpg); }
li.coc a, li.coc a .hover { background-image: url(../images/thumb_cocoigor.jpg); }
li.mat a, li.mat a .hover { background-image: url(../images/thumb_matik.jpg); }
li.mcd a, li.mcd a .hover { background-image: url(../images/thumb_marcus.jpg); }

#thumbs a {
	background-position: 0 0;
}
#thumbs .highlight a:hover,
#thumbs a .hover {
	background-position: 0 -200px;
}

#footer {
	color: #bbb;
	font-size: 10px;
	line-height: 15px;
	padding: 40px 0;
	display: block;
	clear: both;
}
#footer p {
	margin: 0 0 10px 0;
	width: 400px;
}


/* Site Pages / Pop-ups */

h2 {
	margin: 44px 0 36px 0;
	float: left;
}
.nolaunch {
	width: 152px;
	height: 29px;
	display: block;
	float: right;
	margin: 44px 12px 36px 0;
}
.launch a {
	background: url(../images/button_launch.png) 0 0 no-repeat;
	width: 152px;
	height: 29px;
	display: block;
	float: right;
	text-indent: -9999px;
	margin: 44px 12px 36px 0;
}
.launch a:hover {
	background-position: 0 -29px;
}
.launch a:active {
	background-position: 0 -58px;
}
.description {
	width: 400px;
	margin: 4px 26px 0 0;
	float: left;
}
.preview {
	float: left;
}
#cboxCurrent {
	font-size: 13px;
	line-height: 17px;
}