@charset "UTF-8";

/* CSS Document */
/*Last edited 14-01-2010 */

/* CSS General Reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	}
/* define individual focus styles elsewhere */
:focus {outline: 0;}
ol, ul {list-style: none;font-size:12px;}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: separate;border-spacing: 0;}
caption, th, td {text-align: left;font-weight: normal;}
blockquote:before, blockquote:after,
q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
::selection { background: #f8f7cb; color: #333; }
::-moz-selection { background: #f8f7cb; color: #333; }


strong, b {
  font-weight: bold;
}

em, i {
  font-style: italic;
}

.left {float:left}

.right {float:right}

.inline-image {
	margin:6px 10px 10px 0;
	border:solid 3px #c9c9c9;
}
strong.search-excerpt {
  background-color: #f8f7cb; color: #333;
}

#cssAward {
	position:absolute;
	top:15px;
	right:0;
}
#cssAward a{
	width:69px;
	height:105px;
	background:url('images/award_day_black.png') left top no-repeat;
	text-indent:-9000em;
	display:block;
}
#cssAward a:hover{
	opacity:0.8;
}

/*----------------------------------------------------------------
	BASE
---------------------------------------------------------------- */


body {
	font:1em Arial, Helvetica, Sans-serif;
	}

/*//
	LINKS
//*/

a:link, a:visited {
	color: #824e8f;
	text-decoration: none;
	}
	
a:hover {
	color: #3f1e3f;
	text-decoration: underline;
	}
	
a.external {
	background:url('images/external.gif') right 1px no-repeat;
	padding:0 15px 0 0;
}
a.external:hover {
	background:url('images/external.gif') right -19px no-repeat;
	padding:0 15px 0 0;
}

/*//
	SITE STRUCUTRE
//*/

#main {
	min-width:800px;
	height:auto;
	background: #fff url('images/bg-pattern.jpg') right top repeat-y;
}

#wrapper {
	position:relative;
	width:802px;
	margin:0 auto;
}

#sidebar {
	width:204px;
	padding-right:26px;
	float:left;
	min-height:234px;
	position:relative;
	background: #fff url('images/sidebar-bg.gif') right top no-repeat;
}

#content {
	width:572px;
	height:auto;
	position:relative;
	float:left;
	background: #f9f9f9 url('images/bg-content.gif') left top repeat-y;
	padding-top:21px;
	padding-bottom:48px;
}


/*----------------------------------------------------------------
	FOOTER
---------------------------------------------------------------- */

h2.archives {
	font-size:30px;
	margin:20px 0 0px 24px;
	line-height:100%;
	background: url('images/bg-content-colors-gray.gif') left top repeat-y;
	padding:3px 0px 0px 24px;
}

h2.archives a{
	color:#bbb;
}

h2.archives a:hover{
	color:#353535;
	text-decoration:none;
	border-bottom:dotted 1px #aaa;
}

#footer {
	width:538px;
	margin:0 0 0 24px;
	position:absolute;
	bottom:0;
	float:left;
	border-top:solid 1px #e1e1e1;
	padding:0;
	height:48px;
}

#footer p{
	border-top:solid 1px #fff;
	font-size:11px;
	color:#b0b0b0;
	padding:16px 0 18px 20px;
	background:url('images/12px-icons.gif') left -363px no-repeat;
}

#footer a.explore{
	font-size:11px;
	color:#b0b0b0;
	position:absolute;
	right:0;
	top:16px;
	text-decoration:none;
}

#footer a.explore:hover {
	text-decoration:none;
	border-bottom:dotted 1px #aaa;
}



	
/*----------------------------------------------------------------
	SIDEBAR AREA
---------------------------------------------------------------- */

#sidebar #sidebar-side {
	background: #fff url('images/sidebar-bg.gif') left top no-repeat;
	width:66px;
	height:162px;
	position:absolute;
	left:-66px;
	top:0;
}

#sidebar .logo {
	width:109px;
	height:109px;
	display:block;
	text-indent:-9000em;
	background: url('images/name-logo.gif') left top no-repeat;
	margin:20px 0 0 95px;
}

#sidebar a.logo:hover {
	opacity:0.9;
	filter:alpha(opacity=90);
}


/*//
	Sidebar Menu
//*/

#menu {
	margin:28px 0px 0px 0;
}

#menu li {
	text-align:right;
	position:relative;
	margin:0 0 2px 0;
	display:block;
	height:29px;
}

#menu li a {
	font-size:18px;
	color:#888;
	background-color:#f3f3f3;
	text-transform:uppercase;
	padding:3px 10px 2px 10px;
}

#menu li.active a, #menu li a:hover {
	color:#fff;
	background-color:#afd18c;
	text-decoration:none;
}



/*//
	Social Links
//*/

#social-links {
	margin:18px 0 0 0;
}

#social-links .copy {
	float:right;
	width:140px;
	margin:0;
	font-size:11px;
	color:#9f9f9f;
	text-align:right;
}

#social-links ul{
	margin:12px 1px 0 0 ;
	float:right;
	width:140px;
}

#social-links ul li{
	display:inline;
	float:right;
	margin-left:11px;
}

#social-links ul li a{
	width:16px;
	height:16px;
	display:block;
	background:url('images/social-icons.gif') left top no-repeat;
	text-indent:-9000em;
}

#social-links ul li#twitter a{
	background:url('images/social-icons.gif') -55px top no-repeat;
}
#social-links ul li#flickr a{
	background:url('images/social-icons.gif') -27px top no-repeat;
}
#social-links ul li#rss a{
	background:url('images/social-icons.gif') -82px top no-repeat;
}

#social-links ul li a:hover{
	background:url('images/social-icons.gif') left -16px no-repeat;
}
#social-links ul li#twitter a:hover{
	background:url('images/social-icons.gif') -55px -16px no-repeat;
}
#social-links ul li#flickr a:hover{
	background:url('images/social-icons.gif') -27px -16px no-repeat;
}
#social-links ul li#rss a:hover{
	background:url('images/social-icons.gif') -82px -16px no-repeat;
}

/*//
	Search box
//*/

#sidebar #search-form {
	position:relative;
	float:right;
}

#sidebar #search-form #submit-button {
	display:none;
}

.searchbox {
	background-color:#fff;
	border-top:solid 1px #c3c5c9;
	border-right:solid 1px #e9ecf1;
	border-bottom:solid 1px #eff4f8;
	border-left:solid 1px #eeeff5;
	margin:25px 0 0 0;
	color:#737373;
	font-size:12px;
	padding:2px 6px 4px 6px;
	width:173px;
}

#sidebar #search-form label {
	color:#bbb;
	font-size:12px;
	position:absolute;
	top:29px;
	left:7px;
}

#sidebar #search-form label:hover {
	cursor:text;
}

/*//
	Misc page links
//*/

#quicklinks {
	margin:20px 0 0 0;
	width:184px;
	float:right;
}

#quicklinks li {
	margin:0;
	display:inline;
	float:right;
}

#quicklinks li a{
	display:block;
	width:12px;
	height:12px;
	margin:0 0 0 12px;
	text-indent:-9000em;
	background:url('images/12px-icons.gif') left -163px no-repeat;
}

#quicklinks li#ql-mobile a{
	background:url('images/12px-icons.gif') left -218px no-repeat;
}

#quicklinks li#ql-rss a{
	background:url('images/12px-icons.gif') left -272px no-repeat;
}

#quicklinks li a:hover {
	background:url('images/12px-icons.gif') -12px -163px no-repeat;
}
#quicklinks li#ql-mobile a:hover{
	background:url('images/12px-icons.gif') -12px -218px no-repeat;
}
#quicklinks li#ql-rss a:hover{
	background:url('images/12px-icons.gif') -12px -272px no-repeat;
}



.mini-nav-content {
	border-top:dotted 1px #c3c5c9;
	width:187px;
	margin:20px 0 0 0;
}

.mini-nav-content li a{
	color:#888;
	display:block;
	padding:5px 0;
	border-bottom:dotted 1px #ddd;
	font-size:11px;
	background:url('images/arrow-grey.gif') left center no-repeat;
	padding-left:14px;
}

.mini-nav-content li a span{
	color:#ddd;
}

.mini-nav-content li a:hover{
	text-decoration:none;
	color:#66abb4;
}

.mini-nav-content li a:hover span{
	color:#aaa;
}

/*----------------------------------------------------------------
	CONTENT AREA
---------------------------------------------------------------- */

#searchform {
	margin:0 0 20px 0;
}

#searchform div label {
	font-size:12px;
	color:#999;
	display:block;
	margin:0 0 3px 0;
}

#searchform div input {
	margin:0;
	color:#737373;
	font-size:12px;
	padding:2px 6px 4px 6px;
	width:170px;
}

#searchform div input#searchsubmit {
	padding:3px 5px;
	color:#666;
	background-color:#f9f9f9;
	border:solid 1px #d9d9d9;
	border-width:0 1px 1px 0;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	width:auto;
}

#searchform div input#searchsubmit:hover {
	text-decoration:none;
	background-color:#666;
	color:#eee;
	cursor:pointer;
	border-color:#222;
}





/*----------------------------------------------------------------
	POSTS
---------------------------------------------------------------- */

/*//
	Default Post Scheme
//*/

.post {
	width:500px;
	background:#fff url('images/bg-content-colors-gray.gif') left top repeat-y;
	border:solid 1px #d7d7d7;
	border-width:0 1px 1px 0;
	position:relative;
	margin:0px 0 10px 24px;
	padding:18px 18px 3px 24px;
}

.post .awkward-border{
	background:url('images/bg-content-colors-gray.gif') -594px top repeat-y;
	position:absolute;
	left:0;
	bottom:-1px;
	height:10px;
	width:6px;
}

.post .arrow  {
	background:url('images/post-arrows.gif') -21px top no-repeat;
	position:absolute;
	left:-6px;
	top:22px;
	height:13px;
	width:7px;
}	

.post h2, 
.post.single h1{
	font-size:30px;
	margin:1px 0 10px 0;
	color:#353535;
	line-height:96%;
}

.post h2 span, 
.post.single h1 span{
	font-size:22px;
	color:#bbb;
}

.post.single h2 {
	font-size:25px;
	color:#87a74b;
	margin:35px 0 10px 0;
}

.post h2 a, 
.post.single h1 a{
	color:#222;
	text-decoration:none;
}

.post h2 a:hover, 
.post.single h1 a:hover{
	text-decoration:none;
	color:#7d9c42;
}

.post h3 {
	font-size:20px;
	margin:-3px 0 12px 0;
}

.post p {
	font-size:12px;
	color:#444;
	line-height:160%;
	margin:0 0 15px 0;
}

.post p a {
	color:#7d9c42;
	text-decoration:none;
}

.post p a:hover {
	text-decoration:none;
	border-bottom:dotted 1px #aaa;
}

.post p a img {
}

.post p a.imgC:hover {
	border:0;
}

.post p.wp-caption-text {
	background-color:#F9f9f9;
	border-bottom:1px solid #E9E9E9;
	color:#797979;
	font-size:11px;
	padding:3px 6px;
	width:488px;
}

.post ul{
	list-style:circle inside none;
	margin:-10px 0 15px 0;
}

.post ul li {
	font-size:12px;
	color:#444;
	line-height:160%;
	margin:0 0 0px 0px;
	padding:0 0 0 10px;
}

.post .more-link {
	width:89px;
	height:23px;
	position:absolute;
	right:-5px;
	bottom:16px;
	background:#fff url('images/more-buttons-02.gif') left -46px no-repeat;
	text-indent:-9000em;
}

.post a.more-link:hover {
	opacity:0.8;
	filter:alpha(opacity=80);
	border:0;
}

/*//
	Article Post Scheme
//*/

.post.article {
	background:#fff url('images/bg-content-colors-green.gif') left top repeat-y;
}

.post.article  .awkward-border {
	background:url('images/bg-content-colors-green.gif') -594px top repeat-y;
}

.post.article  .arrow  {
	background:url('images/post-arrows.gif') -7px top no-repeat;
}

.post.article  h2 a:hover,
.post.article  p a,
.post.single.article  h2 {
	color:#7d9c42;
}

.post.article  .more-link {
	background:#fff url('images/more-buttons-02.gif') left -46px no-repeat;
}


/*//
	Media Post Scheme
//*/

.post.media {
	background:#fff url('images/bg-content-colors-blue.gif') left top repeat-y;
}

.post.media .awkward-border {
	background:url('images/bg-content-colors-blue.gif') -594px top repeat-y;
}

.post.media .arrow  {
	background:url('images/post-arrows.gif') -14px top no-repeat;
}

.post.media h2 a:hover,
.post.media p a,
.post.single.media h2 {
	color:#67a8b2;
}

.post.media .more-link {
	background:#fff url('images/more-buttons-02.gif') left top no-repeat;
}

.post.media h2.image-title {
	position:absolute;
	bottom:100px;
	left:20px;
	background:url('images/image-title.png') left top no-repeat;
	height:38px;
	color:#fff;
	padding:7px 15px 0 50px;
}

.post.media h2.image-title a{
	color:#fff;
}

.post.media h2.image-title a:hover{
	color:#9ecbd1;
}

/*//
	Snippet Post Scheme
//*/

.post.snippet {
	background:#fff url('images/bg-content-colors-purple.gif') left top repeat-y;
}

.post.snippet .awkward-border {
	background:url('images/bg-content-colors-purple.gif') -594px top repeat-y;
}

.post.snippet .arrow  {
	background:url('images/post-arrows.gif') 0px top no-repeat;
}

.post.snippet h2 a:hover,
.post.snippet p a,
.post.single.snippet h2  {
	color:#8464ab;
}

.post.snippet .more-link {
	background:#fff url('images/more-buttons-02.gif') left -23px no-repeat;
}

/*//
	Quote Post Scheme
//*/

.post.quote h2, .post.single.quote h1 {
	font-size:20px;
	width:415px;
	margin-bottom:14px;
	padding-left:9px;
	text-indent:-9px;
}

.post.quote h2 a {
	line-height:110%;
	color:#555;
}

.post.quote h2 a span, .post.single.quote h1 span{
	color:#bbb;
	margin:0 2px 0 0;
}

.post.quote h2 a:hover {
	color:#7d9c42;
}

.post.quote p.quoteby {
	position:absolute;
	right:24px;
	bottom:-5px;
	color:#999;
}

/*//
	Meta content
//*/

.post p.meta {
	color:#999;
	overflow:auto;
	margin:0 0 15px 0;
	font-size:11px;
	width:100%;
}

.post p.meta.single {
	margin:0 0 15px 0;
}

.post p.meta a {
	color:#737373 !important;
}

.post p.meta span.post-date,
.post p.meta span.post-count,
.post p.meta span.post-tags{
	background:url('images/12px-icons.gif') left 1px no-repeat;
	padding:0 0 0 16px;
	float:left;
	margin:0 10px 0 0;	
	line-height:150%;
}

.post p.meta span.post-count{
	background:url('images/12px-icons.gif') left -107px no-repeat;
}

.post p.meta span.post-tags{
	background:url('images/12px-icons.gif') left -52px no-repeat;
}

/*//
	BlockQuote
//*/

.post blockquote, .comment blockquote {
	border-left:solid 3px #e1e1da;
	margin:0 0 0 10px;
	padding:0 10px;
}	

.post blockquote p, .comment blockquote p{
	color:#999;
	font:12px Georgia, Times New Roman, Serif;
	font-style:italic;
	line-height:170%;
}

.comment blockquote {
	border-left:solid 3px #e1e1da;
	margin:0 0 10px 0;
}	
	
.post blockquote.bubble {
	background-color:#fcfcfc;
	border:solid 1px #d9d9d9;
	padding:8px 10px;
	margin:0 0 20px 0;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	position:relative;
}

.post blockquote.bubble p{
	padding:0px;
	margin:0px;
	font:12px Arial, helvetica, sans-serif;
	color:#666;
	line-height:150%;
}

.post blockquote.bubble div{
	position:absolute;
	top:-11px;
	left:23px;
	width:19px;
	height:11px;
	background:url('images/up-triangle.gif') left top no-repeat;
}

/*//
	Post details bar
//*/

.post-detail {
	background:#fff url('images/bg-content-colors-gray.gif') left top repeat-y;
	border:solid 1px #d7d7d7;
	border-width:0 1px 1px 0;
	position:relative;
	margin:30px 0 10px 24px;
	padding:10px 10px 10px 24px;
	width:245px;
	z-index:1000;
}

.post-detail:first-child {margin:0px 0 10px 24px;}

.post-detail.top {
	margin:0px 0 24px 24px;
}

.post-detail h3{
	font-size:18px;
	color:#999;
	display:inline;
}

.post-detail h3 span{
	color:#72a140;
}

/*//
	Archives
//*/

.post.archive h2{
	margin:4px 0;
}

.post.archive.quote h2 {
	margin-bottom:14px;
}

.post.archive a img{
	float:left;
	display:block;
	margin:0 15px 0 0;
}

.post.archive.media p.meta{
	width:380px;
}

#filter {
	margin:1px 0 0 0;
	float:right;
	position:relative;
}

#filter li{
	margin:0;
	padding:0;
	display:inline;
	width:58px;
	height:22px;
}

#filter li a{
	color:#aaaaaa;
	font-size:10px;
	background:url(images/small-down-arrow.gif) 5px 7px no-repeat;
	text-transform:uppercase;
	border:solid 1px #fff;
	padding:3px 5px 4px 15px;
	background-color:#fff;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	display: block;
	position:absolute;
	top:0;
	right:0;
	z-index:85;
}

#filter li a:hover, #filter li.active a{
	border:solid 1px #d7d7d7;
	border-width:1px 1px 0px 1px;
	text-decoration:none;
	color:#888;
}

#filter li #filter-menu {
	position: absolute;
	right:0;
	top: 20px;
	z-index:80;
	display:none;
	background-color:#fff;
	border:solid 1px #d7d7d7;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-moz-border-radius-topright:0px;
	-webkit-border-top-right-radius:0px;
}

#filter li #filter-menu li a{
	padding:7px 12px 7px 7px;
	background-image:none;
	margin:0;
	color:#878787;
	border:none;
	width:auto;
	white-space:nowrap;
	border-bottom:solid 1px #ebebeb;
	margin:0 1px;
	position:relative;
	border-left:solid 2px #bbb;
}

#filter li #filter-menu li a.last{
	border-bottom:solid 0px #ebebeb;
}

#filter li #filter-menu li a:hover{
	border:none;
	border-bottom:solid 1px #ebebeb;
	border-width:0px 0px 1px 2px;
	background-color:#f9f9f9;
	color:#666;
}

#filter li #filter-menu li a:active{
	color:#85b256;
	background-color:#fff;
}

#filter li #filter-menu li a.last:hover{
	border-bottom:solid 0px #ebebeb;
}

#filter li:hover #filter-menu{
	display:block;
}

#filter #filter-menu li#archive-all a {
	border-left:solid 2px #999;
}
#filter #filter-menu li#archive-article a {
	border-left:solid 2px #9ec873;
}
#filter #filter-menu li#archive-code a {
	border-left:solid 2px #ad91cf;
}
#filter #filter-menu li#archive-visual a {
	border-left:solid 2px #89c0c8;
}
#filter #filter-menu li#archive-quote a {
	border-left:solid 2px #ccc;
}

p.article-count, p.search-count {
	float:right;
	font-size:.625em;
	text-transform:uppercase;
	color:#aaa;
	margin:15px 7px 0 0;
}

#article-count {
	display:none;
}

/*//
	Projects Page
//*/

.post.project h2{
	font-size:24px;
	margin:0 0 5px 0;
}

.post.project a.visit{
	font-size:10px;
	text-transform:uppercase;
	color:#999;
	float:right;
	margin:0;
	padding:3px 5px;
	border:solid 1px #eee;
	background-color:#f9f9f9;
}

.post.project a.visit:hover{
	color:#fff;
	background-color:#afd18c;
	text-decoration:none;
}

.post.project img{
	margin:0 0 15px 0;
	border:solid 4px #eee;
}

/*----------------------------------------------------------------
	SEARCH
---------------------------------------------------------------- */

.search-page h2{
	font-size:22px;
}


/*----------------------------------------------------------------
	NAVIGATION
---------------------------------------------------------------- */

.navigation-post {
	position:absolute;
	bottom:2px;
	right:-34px;
	width:16px;
}

.navigation-post .next-post a, .navigation-post .prev-post a{
	display:block;
	width:16px;
	height:16px;
	text-indent:-900em;
	background:url('images/next-arrows.gif') left top no-repeat;
	margin:0 0 10px 0;
}

.navigation-post .prev-post a{
	background:url('images/next-arrows.gif') left -16px no-repeat;
}

.navigation-post .next-post a:hover, .navigation-post .prev-post a:hover{
	opacity:0.7;
	filter:alpha(opacity=70);
}
	
/*----------------------------------------------------------------
	COMMENTS
---------------------------------------------------------------- */


#comments {
	margin:20px 4px 0 24px;
	position:relative;
	background: url('images/bg-content-colors-gray.gif') left top repeat-y;
	padding-left:24px;
}

#comments h2 {
	font-size:30px;
	margin:0 0 16px 0;
	color:#3c3c3c
}

#comments p.comment-meta {
	font-size:.625em;
	text-transform:uppercase;
	color:#aaa;
	position:absolute;
	right:0;
	top:16px;
}

#comments p.comment-meta a{
	color:#aaa;
	border-bottom:dotted 1px #bbb;
}

#comments p.comment-meta a:hover{
	color:#888;
	border-bottom:dotted 1px #999;
	text-decoration:none;
}

#comments li.comment {
	background-color:#fff;
	border:solid 1px #d9d9d9;
	border-width:0 1px 1px 0;
	padding:15px 15px 10px 15px;
	margin:0 0 20px 0;
	color:#555;
	position:relative;
	line-height:150%;
}

.comment .comment-author {
	margin:12px 0 0 0;
	padding:10px 0 0 0;
	border-top:dotted 1px #c9c9c9;
}

.comment-author cite{
	font-size:12px;
	display:inline;
	background:url('images/12px-icons.gif') left -325px no-repeat;
	padding-left:16px;
	color:#777;
	font-weight:bold;
}

.comment-author cite a{
	color:#93b358;
}

.comment-author cite a:hover{
	text-decoration:none;
	border-bottom:dotted 1px #aaa;
}

.comment-author p.meta {
	display:inline;
	background:url('images/12px-icons.gif') left top no-repeat;
	padding-left:16px;
	margin-left:12px;
	color:#999;
	font-size:11px;
}

.comment-author a.meta {
	float:right;
	color:#c9c9c9;
}

.comment-author a.meta:hover {
	float:right;
	color:#93b358;
	text-decoration:none;
}

.comment .author-admin {
	display:none;
}

.comment.comment-author-admin .author-admin {
	display:block;
	background:url('images/author-comment-tag.gif') left top no-repeat;
	width:38px;
	height:39px;
	text-indent:-900em;
	position:absolute;
	top:-2px;
	right:-3px;
}

.comment p a {
	color:#7d9c42;
	text-decoration:none;
}

.comment p a:hover {
	text-decoration:none;
	border-bottom:dotted 1px #aaa;
}

/*//
	Image Post Scheme
//*/

.image .comment-author cite a{
	color:#67a8b2;
}

.image .comment p a {
	color:#67a8b2;
	text-decoration:none;
}

/*//
	Snippet Comment Scheme
//*/

.snippet .comment-author cite a{
	color:#8464ab;
}

.snippet .comment p a {
	color:#8464ab;
	text-decoration:none;
}

/*//
	Alerts & Messages
//*/

p.nocomments {
	font-size:.75em;
	background-color:#f6f6dd;
	padding:15px;
	border:1px #e8e8ba solid;
	border-width:0 1px 1px 0;
}

#comments p.loggedin {
	margin:0px 0 0 0 !important;
	display:block;
	padding:3px 5px 0 5px !important;
}

#comments p.moderate {
	color:#963131;
	margin:0 0 6px 0;
	font-weight:bold;
}

/*----------------------------------------------------------------
	COMMENT FORMS
---------------------------------------------------------------- */

#comments #respond {
	margin:0 0 0 0;
	width:518px;
}

#comments #respond  p{
	margin:15px 0 0 0;
	padding:0;
	display:inline;
	float:left;
}

#comments #respond  p label{
	font-size:11px;
	font-family:arial, helvetica, sans-serif;
	color:#969696;
	font-style:italic;
	margin:0 0px 3px 0px;
	float:left;
}

#comments #respond  p.form-input {
	width:165px;
	margin:0 10px 0 0;
	position:relative;
}

#comments #respond  p.form-input.last {
	margin:0 0 0 0;
}

#comments #respond  p.form-input input{
	width:155px;
}

#comments #respond  p textarea, #comments #respond  p.form-input input{
	padding:5px;
	background-color:#fff;
	font:12px Arial, helvetica, sans-serif;
	color:#333333;
	border:solid 1px #d9d9d9;
	border-width:1px 0 0 1px;
	float:left;
}

#comments #respond  p textarea:focus, #comments #respond  p.form-input input:focus{
	border-color:#bbb;
}

#comments #respond  p textarea {
	height:120px;
	width:507px;
}

#comments #respond  p.submit-input {
	margin:20px 0 10px 0;
}

#comments #respond  p.submit-input input{
	padding:3px 5px;
	color:#666;
	background-color:#fff;
	border:solid 1px #d9d9d9;
	border-width:0 1px 1px 0;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}

#comments #respond  p.submit-input input:hover {
	text-decoration:none;
	background-color:#666;
	color:#eee;
	cursor:pointer;
	border-color:#222;
}

#comments #respond p.form-input span.web-label {
	position:absolute;
	top:23px;
	left:6px;
	color:#aaa;
	font:12px Arial, helvetica, sans-serif;
}


/*errors*/

#comments #respond p.error1, #comments #respond p.error2 {
	color:#da1d1d;
	font-size:12px;
	margin-top:25px;
	float:right;
	padding-left:20px;
	background:url('images/tick-of-disapproval.gif') left 2px no-repeat;
	display:none;
}

#comments #respond  p.error textarea, #comments #respond  p.form-input.error input{
	outline:dotted 1px red;
}

#comments #respond p.sent-message {
	font-size:13px;
	margin:3px 0 1px 0;
	color:#777;
}

/*----------------------------------------------------------------
	CODE
---------------------------------------------------------------- */

pre {
	padding:0;
	margin:0 0 20px 0px;
	font-size:12px;
}
code {
	color: #444;
	font-family: "Courier New", Courier, monospace;
	white-space: nowrap;
	border-bottom:dashed 1px #dbdbdb;
	}
pre code {
	display: block;
	clear: both;
	padding: 8px 0 8px 10px;
	color: #542354;
	border: solid 3px #f0f0f0;
	background-color:#fcfcfc;
	border-width:0px 0 0 3px;
	overflow: auto;
	line-height: 140%;
	white-space: pre;
	}
code .comment {
	color: #83a760;
	}
code .class, code .rules {
	color: #bb49bd;
	font-size: 100%;
	}
code .value,  code .title, code .string {
	color: #417fbe;
	}
code .tag {
	color: #151415;
	}
code .keyword {
	color: #273a89;
	}
.html .attribute {
	color: #538123;
	}

#comments li.comment pre {
	margin:10px 0 15px 0;
}
	
#comments li.comment p code {
	color: #444;
	font-family: "Courier New", Courier, monospace;
	white-space: nowrap;
	background-color:#fff;
	border-bottom:dashed 1px #dbdbdb;
	border: solid 3px #f0f0f0;
	border-width:0px 0 0 3px;
	background-color:#fcfcfc;
	padding: 5px 0 5px 10px;
	display:block;
	margin:15px 0 15px 0px;
}


/*----------------------------------------------------------------
	Portfolio Pages
---------------------------------------------------------------- */

.portfolio-container {
	margin:0 0 25px 24px;
	width:550px;
	overflow: hidden;
}

.portfolio h2{
	color:#505050;
	font-size:18px;
	text-transform:uppercase;
	margin:0 0 15px 24px;
}

.portfolio h3{
	font-size:11px;
	color:#7d9c42;
	text-transform:uppercase;
	font-weight:bold;
	margin:7px 0 0 1px;
}

.portfolio h4{
	font-size:10px;
	font-style:italic;
	color:#999;
	margin:0 0 0 1px;
}

.image-container {
	background-color:#fff;
	padding:10px;
	float:left;
	display:inline;
	border:solid 1px #d7d7d7;
	border-width:0 1px 1px 0;
	margin:0 5px 5px 0;
	position:relative;
}

.image-container.end {
	margin:0;
}

.image-container a.image{
	display: block; 
	margin:0;
	position:absolute;
	top:10px;
	left:10px;
	bottom: 40px;
	right: 10px;
	text-indent:-9000em;
	z-index:50;
	background: url('images/blank.png') 0px 0px repeat;
}

.image-container .image-hover {
	position:absolute;
	top:10px;
	left:10px;
	right:10px;
	bottom:40px;
	background: url('images/magnifier.png') center repeat;
	z-index:4;
	display:none;
}

.image-container .dark {
	background: url('images/magnifier-dark.png') center repeat;
}

.image-container img{
	margin:0;
	padding:0;
	display:block;
}

.image-container h3 a {
	color:#7d9c42;
	text-decoration:none;
}

.image-container h3 a:hover {
	text-decoration:none;
	color:#555;
}



/*----------------------------------------------------------------
	Lightbox
---------------------------------------------------------------- */


#loader, #throbber{
	position:fixed;
	left:50%;
	top:25%;
	background:url('images/loading_circle.gif') left top no-repeat;
	width:31px;
	height:31px;
	z-index:2000;
	display: none;
}
.hide{
	display:none;
}
#lightbox{
	background-color:#fff;
	padding:4px;
	border:solid 1px #d7d7d7;
	border-width:0 1px 1px 0;
}
#lightboxDetails{

}	
#lightboxCaption{
	float: left; 
}
#keyboardMsg{ 
	float: right; 
	font-size:11px;
	color:#999;
}
#lightbox img{
	display:block;
} 
#overlay img{ 
	border: none; 
}
#overlay{
	background-color:#f0f0f0;
	filter:alpha(opacity=90);
	opacity:.9;
}
#overlay-archive{
	background-color:#f0f0f0;
	filter:alpha(opacity=75);
	opacity:0.75;
	position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    display: none;
	z-index:1800;
}
#credit{
	padding-bottom:30px;
	font-family:Helvetica, Arial;
	font-size:13px;
	color:#bbbbbb;
	padding-left:70px;
}
#credit a{
	font-weight:bold;
	color:#aaaaaa;
}
/* END LIGHTBOX */


/*----------------------------------------------------------------
	DEMOS
---------------------------------------------------------------- */
.demoGradientBox {
	width:500px;
	height:80px;
	margin:0 0 15px 0;
	-moz-border-radius:7px;
	
	background-color: #62a3ac; /* Fallback Color */
    background-image: url(images/gradient.png); /* Fallback Image */
    /*Firefox Linear Gradients*/
    background-image: -moz-linear-gradient(100% 100% 90deg, #73b1ba, #add4da);
    /*Safari, Chrome Linear Gradients*/
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#add4da), to(#73b1ba));
	}
	
	.demoGradientBox02,
	.demoGradientBox03,
	.demoGradientBox04 {
	width:80px;
	margin:0 20px 5px 0;
	float:left;
	height:80px;
	-moz-border-radius:7px;
	
	background-color: #62a3ac; /* Fallback Color */
    background-image: url(images/gradient.png); /* Fallback Image */
    /*Firefox Linear Gradients*/
    background-image: -moz-linear-gradient(left top 45deg, #62a3ac, #cbe5e8);
    /*Safari, Chrome Linear Gradients*/
    background-image: -webkit-gradient(linear, left bottom, right top, from(#62a3ac), to(#cbe5e8));
	}
	
	.demoGradientBox03 {
    /*Firefox Linear Gradients*/
    background-image: -moz-linear-gradient(10% 100% 0deg, #62a3ac, #add4da);
    /*Safari, Chrome Linear Gradients*/
    background-image: -webkit-gradient(linear, left, right, from(#add4da), to(#62a3ac));
	}
	
	.demoGradientBox04 {
    /*Firefox Linear Gradients*/
    background-image: -moz-linear-gradient(0% 50% 0deg, #9dc672, #add4da);
    /*Safari, Chrome Linear Gradients*/
    background-image: -webkit-gradient(linear, left center, right center, from(#9dc672), to(#add4da));
	}