/*
Theme Name: Cool Web Designer.ca
Theme URI: http://www.coolwebdesigner.com/
Description: Design Island Theme.
Version: 1.0
Author: Cool Web Designer
Author URI: http://www.coolwebdesigner.com/
*/

/***RESET***/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

:focus {
	outline: 0;
}

em {
	font-style:italic;
}

/***BASICS***/

body {
	background:url('../images/bg.jpg');
	color: #333333; font-style:normal; font-variant:normal; font-weight:normal; line-height:17px; font-size:12px; font-family:Helvetica, Arial, sans-serif	
}

#container {
	background:url('../images/header-bg.jpg') repeat-x;
	padding-bottom:30px
}

a, a:visited {
	color:#006988;
	text-decoration:none;
}

a:hover {
	color:#5d401b;	
}

strong {
	font-weight:bold;
}

p a, p a:visited {
	text-decoration:underline;
}

p a:hover {
	text-decoration:none;
}


/*** MORE DETAILS ***/

p.button-more a {
	font-weight:bold;
	color:#FFF;
	text-decoration:none;
	background:url('../images/button-more-details.png') no-repeat left top;
	display:block;
	width:83px;
	height:14px;
	line-height:15px; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:5px
}

p.button-more a:hover {
	background-position:bottom;
}

/*** VIEW DETAILS ***/


p.button-view a {
	font-weight:bold;
	color:#FFF;
	text-decoration:none;
	background:url('../images/button-view-details.png') no-repeat left top;
	display:block;
	width:83px;
	height:14px;
	line-height:15px; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:5px
}

p.button-view a:hover {
	background-position:bottom;
}

/***HEADER***/

#header	{
	overflow:hidden;
	background:url('../images/header-inner.jpg');
	margin: 0 auto;
	width:940px;
	height:199px; padding-left:0; padding-right:0; padding-top:50px; padding-bottom:0
}

h2 {
	text-indent:-9999px;
	margin:160px 10px;
}


/* HEADER - LOGO */
		
	#header h1 {
		float:left;
		background:url('../images/Cool Web Designer-logo.png') no-repeat;	
	}
	
	#header h1 a {
		display:block;
		width:188px;
		height:85px;
		text-indent:-9999px;
		outline:none;
	}
		
/* HEADER - MAIN MENU */
		
	#main-menu {
		overflow:hidden;
		float:right;
	}
	
	#main-menu li {
		display:inline;
	}
	
	#main-menu li a {
		display:block;
		float:left;
		text-indent:-9999px;
		background:url('../images/main-menu.jpg') no-repeat;
		width:108px;
		height:70px
	}
	
	#main-menu li a.home {
		background-position:0 0;
	}
	
	#main-menu li a.portfolio {
		background-position:-108px 0;
	}
	
	#main-menu li a.tutorials {
		background-position:-216px 0;
	}
	
	#main-menu li a.about {
		background-position:-324px 0;
	}
	
	#main-menu li a.contacts {
		background-position:-432px 0;
	}
		
/* HEADER - MAIN MENU a:hover */
		
	#main-menu li a.home:hover {
		background-position:0 -70px;
	}
	
	#main-menu li a.portfolio:hover {
		background-position:-108px -70px;
	}
	
	#main-menu li a.tutorials:hover {
		background-position:-216px -70px;
	}
	
	#main-menu li a.about:hover {
		background-position:-324px -70px;
	}
	
	#main-menu li a.contacts:hover {
		background-position:-432px -70px;
	}
	
/* HEADER - MAIN MENU - Current */
		
	#main-menu li.current a.home {
		background-position:0 -140px;
	}
	
	#main-menu li.current a.portfolio {
		background-position:-108px -140px;
	}
	
	#main-menu li.current a.tutorials {
		background-position:-216px -140px;
	}
	
	#main-menu li.current a.about {
		background-position:-324px -140px;
	}
	
	#main-menu li.current a.contacts {
		background-position:-432px -140px;
	}


/***CONTENT - BASICS***/

#content-container {
	margin:0 auto;
	width:950px;
	background: url('../images/content-shadow.png') no-repeat top;
}

div.content-bg {
	margin:0 auto;
	width:940px;
	background:url(../images/bg.jpg);	
}

#content {
	background:url('../images/content-top-shadow.png') no-repeat top;
	overflow:hidden
}

#content #main {
	float:left;
	width:690px;
	padding:0 10px 20px;
}


h3, #home #sidebar h3 {
	margin: 20px 0 15px;
	font-size:24px;
	letter-spacing:-0.03em;
	color: #643700;
	font-weight: normal;
}

#home h3, #home #sidebar h3 {
	margin-top:10px;
}

#content h3 a{
	color: #5d401b;
}

#content h3 a:hover{
	color: #006988;
	text-decoration:underline;
}
	
#main-content {
	overflow:hidden;
	float:left;
	width:460px;
}

small {
	font-size:11px;
	color:#9b8a53;
}

/*** IMAGE CONTAINER ***/

div.image-container {
	background:url('../images/image-container-bg.png');
	padding:9px
}	

div.image-container a{
	background:url('../images/image-container-bg.png');
	display:block;
	padding:9px
}

div.image-container a:hover{
	background:url('../images/image-container-bg-hover.png');
}

div.image-container img, div.image-container a img {
	border:1px solid white;
	vertical-align:bottom;
}

/*** SIDEBAR ***/

#sidebar {
	float:right;
	width:200px;
	background:url('../images/sidebar-background.png') no-repeat top;; padding-left:20px; padding-right:10px; padding-top:0; padding-bottom:30px	
}

#sidebar h3 {
	margin:20px 0 8px;
	font-size: 18px;
	font-weight: bold;
	letter-spacing:-0.03em;
}

#sidebar ul {
	padding-right:10px;
}

#sidebar li a{
	background:url('../images/arrow-sidebar-inner.png') no-repeat left 11px;
	display:block;
	font-size: 14px;
	color: #a28e60;
	line-height:15px; padding-left:10px; padding-right:10px; padding-top:6px; padding-bottom:6px
}

#sidebar li a:hover {
	background-image:url('../images/arrow-sidebar-inner-hover.png');
	background-color:#fdebc1;
	color:#81724e
}


/***FOOTER***/

#footer-container{
	clear:both;
	background:#e1bf86 url('../images/footer-bg.jpg') repeat-x;
}

#footer {
	margin:0 auto;
	overflow:hidden;
	width:940px;
	padding:30px 0;

}
	
/* FOOTER - CONTACT INFO */

	#contact-info {		
		float:left;
		width:460px;
		overflow:hidden;
	}
	
	h4 {		
		background:url('../images/footer-header-bg.gif') repeat-x bottom;
		padding-bottom:7px;
		margin-bottom:15px;
		font-size:21px
	}
	
	#footer h4 a{
		letter-spacing:-0.01em;
		font-size:21px;
		color:#333333;
		
	}
	
	#footer h4 a:hover{
		
		color:#006988;
		text-decoration:underline;
	}
		
/* FOOTER - CONTACT DETAILS */
	
	#contact-details {
		float:left;
		width:200px;
		padding:0 10px;
	}
	
	#contact-details p {
		margin-bottom:25px;
		padding-left:0px;
	}
	
	#contact-details dl dt, #contact-info #contact-details dl dd {
		margin-bottom:4px;
	}
	
	#contact-details dl dt {
		float:left;	
		width:40px;
		font-weight:bold;
		text-align:right;
		margin:0 10px 0 0;

	}
	
	#contact-details dl dd a {
		color:#006988;
		text-decoration:underline;
	}
	
	#contact-details dl dd a:hover {
		color:#5d401b;
		text-decoration:none;
	}
	
/* FOOTER - CONTACT FORM */
	
	#contact-form {
		padding:0 10px 20px;
		float:right;
		overflow:hidden;
		width:200px;
	}
	
	#contact-form ul li label {		
		color:#5d401b;
	}
	
	#contact-form input, #contact-form textarea{
		padding:5px;
		color:#7c6445;
		border:medium none;
		outline:0;
		background:url('../images/input-small.png') no-repeat top; 
		width:192px;
		height:17px; font-style:normal; font-variant:normal; font-weight:normal; line-height:16px; font-size:12px; font-family:Helvetica, Arial, sans-serif; margin-left:0; margin-right:0; margin-top:2px; margin-bottom:7px		
	}
	
	#contact-form textarea {
		overflow:auto;
		width:192px;
		height:73px;
		background:url('../images/textarea-small.png') no-repeat top;
	}
	
	#contact-form input:focus, #contact-form textarea:focus, #contact-form input:hover,	#contact-form textarea:hover {
		background-position:bottom;
	}
	
	#contact-form li.submit input {
		background:url('../images/submit-contacts-small.png') top;
		border:medium none;
		text-align:left;
		color:#fff;
		width:65px;
		height:24px;
		margin-left:67px;
		cursor:pointer; font-style:normal; font-variant:normal; font-weight:bold; line-height:24px; font-size:12px; font-family:Helvetica, Arial, sans-serif; padding-left:10px; padding-right:10px; padding-top:0; padding-bottom:1px
	}
	
	#contact-form li.submit input:hover {
		background-position:bottom;		
	}
	
/* FOOTER - ABOUT ME */
	
	div.text-block {
		float:right;
		width:460px;
	}
	
	div.text-block p {
		padding:0 10px 10px;
	}
	
	div.text-block p.button-more {
		padding:0;
		margin-top:10px;
	}
	
/*** SITE INFO ***/
	
#site-info-container {
	background:url('../images/site-info-bg.jpg') repeat-x;
	padding-top:30px;
	height:78px
}

#site-info {
	margin:0 auto;	
	width:940px;
	overflow:hidden;
	color:#81c9e7;
	
}

#site-info a{
	color:#d6eef2;	
}
	
#site-info a:hover{
	color:#05fff6;	
}
	
/* SITE INFO - COPYRIGHTS */
			
	#copyrights {
		float:left;
	}
		
/* SITE INFO - MENU */
	
	#site-info-menu {
		float:right;
	}
	
	#site-info-menu li{
		display:inline;
		
	}
	
	#site-info-menu li a{
		display:block;
		float:left;
		margin-left:10px;
		padding:3px 10px;
		background-color:#006e96;
	}
	
	#site-info-menu li a:hover{
		color:#d6eef2;
		background-color:#2688b6;
	}


/*** HOME ***/

#home #header {
	background:url('../images/header-home.jpg');
	height:377px
}

h2.home {
	margin: 0px;
}

/* HOME - INTRO */
	
	#intro {
		text-indent:-9999px;
		padding-top:167px;
		clear:both;
		float:left;
		width:300px;
	}
	
	#intro ul {
		overflow:hidden;
	}
	
	#intro ul li {
		display:inline;
	}
	
	#intro ul li a {
		display:block;
		float:left;
	}
	
	#intro ul li#view-portfolio a {
		background:url('../images/view-portfolio.png') 0 0;
		width:147px;
		height:39px
	}
	
	#intro ul li#get-quote a {
		background:url('../images/get-quote.png') 0 0;
		margin-left:13px;
		width:130px;
		height:39px
	}
	
	#intro ul li#view-portfolio a:hover, #intro ul li#get-quote a:hover {
		background-position:0 39px;
	}


/* HOME - CONTENT */
		
	#home #content {
		overflow:hidden;
		margin: 0 auto;
		padding:0;
		width:940px;
		background:none;
	}


/* HOME - CONTENT - MAIN */
		
	#home #content #main {
		width:720px;
		padding:0;
	}
		
/* HOME - FEATURED */
			
	ul#featured li{
		margin-right:20px;
		float:left;
		width:220px;
	}
	
	ul#featured li div {
		margin-bottom:10px;
	}
	
	ul#featured li div a img {
		border:1px solid white;
	}
	
	ul#featured li div a{
		background:url('../images/image-container-bg-home.png');
		display:block;
		padding:9px;
		width:202px;
		height:143px
	}
	
	ul#featured li div a:hover{
		background:url('../images/image-container-bg-hover.png');
	}
	
	ul#featured li p {
		padding: 0;
	}
	
	ul#featured li p a{
		padding-left:10px;
		background:url('../images/arrow.png') no-repeat 0 4px;
		font-size: 12px;
		font-weight: bold;
		text-decoration:none;
		color: #006988
	}
	
	ul#featured li p a:hover{
		background:url('../images/arrow-hover.png') no-repeat 0 4px;
		color: #5d401b;
		text-decoration:underline
	}
	
	
/* HOME - SIDEBAR */
			
	#home #sidebar {
		float:left;
		width:210px;
		padding:0;
		background:none;
	}
	
	#home #sidebar li a{
		display:block;
		font-size: 14px;
		line-height:15px;
		margin:0px;
		background:url('../images/arrow-sidebar-home.png') no-repeat 0 9px;
		color: #6f6243; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:10px
	}
	
	#home #sidebar li a:hover {
		background:#eed19f url('../images/arrow-sidebar-home.png') no-repeat 0 9px;
	}
	
	#home #sidebar li{
		border-bottom:1px solid #caae80;
	}
	
	#home #sidebar li:last-child{
		border:none;
	}


/***ABOUT***/

#about h2 {
	background:url('../images/title-about.png') no-repeat;
	width:102px;
	height:28px
}

#content #main-content p {
	margin-bottom:15px;
	padding-left:10px;
}

#content #main-content #contact-details p {
	padding-left:0;
}

/* SUPPLEMENTARY-CONTENT (content subsection) */

	#supp-content {
		color:#5d401b;
		float:right;
		width:200px;
		padding-left:20px;
		background:url('../images/content-vertical-line.png') no-repeat left top;
	}
	
	#supp-content ul {
		margin-bottom:20px;
	}
	
	#supp-content ul li {
		margin-bottom:5px;
		line-height:16px;
		background: url('../images/bullet.png') no-repeat left 5px;
		padding-left:10px
	}

/* ABOUT PAGE - SMALL CONTACT FORM */
	
	#about #contact-form .contacts-input input, #about #contact-form textarea{
		background:url('../images/input-small-innerpage.png') no-repeat top; 
	}
	
	#about #contact-form textarea {
		background:url('../images/textarea-small-innerpage.png') no-repeat top;
	}
	
	#about #contact-form input:focus, #about #contact-form textarea:focus, #about #contact-form input:hover, #about #contact-form textarea:hover {
		background-position:bottom;
	}


/***CONTACTS***/

#contacts h2 {
	background:url('../images/title-contacts.png') no-repeat;
	width:151px;
	height:29px
}

#contacts #main-content {
	width:220px;
	margin-top:10px;
}

/* CONTACTS PAGE - LARGE CONTACT FORM */

	#contacts #contact-form {
		float:left;
		width:440px;
		margin: 10px 0 40px 10px;
	}
	
	#contacts label {
		display:block;
	}
	
	#contacts #contact-form .contacts-input input, #contacts #contact-form textarea {	
		background:url('../images/input-large.png') no-repeat top;
		width:222px;
		height:17px;
		color:#5d401b
	}
	
	#contacts #contact-form textarea {
		background:url('../images/textarea-large.png') no-repeat top;
		width:430px;
		height:206px
	}
	
	#contacts #contact-form input:focus, #contacts #contact-form textarea:focus, #contacts #contact-form input:hover, #contacts #contact-form textarea:hover {
		background-position: bottom;
	}
	
	#contacts #contact-form li.submit input {
		background:url('../images/submit-contacts-large.png') top;
		width:72px;
		height:29px;
		margin-left:183px;
		font-size: 14px;
		font-weight: bold;
		letter-spacing:-0.01em;
		line-height: 30px
	}
	
	#contacts #contact-form li.submit input:hover {
		background-position:bottom;
	}

/*** TUTORIALS - LIST ***/


#tutorials h2 {
	background:url('../images/title-tutorials.png') no-repeat;
	width:143px;
	height:28px
}

.tutorials-post {
	overflow:hidden;
	width:670px;
	background: url('../images/post-border.png') no-repeat bottom;
	position:relative; padding-left:10px; padding-right:10px; padding-top:20px; padding-bottom:20px	
}

.tutorials-post:last-child {
	background:none;
}
	

#content .tutorials-post p {
	margin: 10px 0 0 220px;
	padding:0 20px 40px 0;
	line-height:18px;
}

#tutorials div.image-container a{
	width:182px;
	height:152px;
}

#tutorials div.image-container {
	padding:0;
	float:left;
}

.tutorials-post .image-container {
	margin-right:20px;
	background:none;
}

.tutorials-post h3 {
	margin:0 0 3px 0;
	line-height: 24px;
}

#tutorials #content p.button-view {
	position:absolute;
	left: 230px;
	bottom: 20px;
	padding:0;
	margin:0;
}

/*** COMMENTS - NUMBER ***/

	.comments-number {
		position:absolute;
		right: 10px;
		bottom: 11px;		
	}
	
#tutorials #content	p.comments-number {
		padding:0;
		margin:0;
	}
	
	.comments-number a, .comments-number a:visited {
		padding-top:5px;
		background:url('../images/comments-number.png') no-repeat top;
		display:block;
		width:40px;
		height:28px;
		font-size: 16px;
		color: #7a5c36;
		font-weight: bold;
		text-decoration: none;
		text-align:center;
		line-height:16px;
		outline:0
	}
		
	.comments-number a:hover {
		background-position:bottom;
		color: #fff;
	}

/*** RSS - LARGE ***/

.rss-large a {
	background:url('../images/rss-large.png') no-repeat top;
	display:block;
	width:161px;
	height:45px;
	margin-top:20px;
	text-indent:-9999px;
	margin-bottom:10px
}

.rss-large a:hover {
	background-position:bottom;
}
	

/*** TUTORIALS - DETAILS ***/

.tutorials-details {
	overflow:hidden;
	padding:0 10px 30px;
}

.tutorials-details p {
	margin-bottom:10px;
}

#tutorials div.tutorials-details .image-container {
	padding:9px;
	width:652px;
	text-align:center;
	margin:20px 0;
	float:none;	
}

.tutorials-details .image-container img{
	margin:auto;
	border:1px solid #fff;
}

#tutorials .tutorials-details h4 {
	font-weight:bold;
	background-image:none;
	padding:0;
	margin:20px 0 10px 0;
}

.tutorials-details .image-container p {
	font-weight:bold;
	margin:10px auto 5px;
	color:#81724e;
}


/* SOCIAL BAR */
	
	div.social-bar {
		overflow:hidden;
		background:url('../images/tutorials-social-bar.png') no-repeat;
		width:670px;
		height:63px;
		margin-top:40px
	}
	
	.social-bar .rss {
		float:left;
		width:450px;
	}
	
	#tutorials .tutorials-details .social-bar h4 {
		float:left;
		font-weight:normal;
		width:195px;
		margin:23px 0 0 10px;
		background:none;
	}
	
	.social-bar .rss-small, .social-bar .rss-small a {		
		width:141px;
		height:41px;
		float:left;
		margin-top:5px;
	
	}
		
	.social-bar .rss-small a {		
		background:url('../images/rss-small.png') no-repeat top;
		display:block;		
		text-indent:-9999px	
		
	}
	
	.social-bar .rss-small a:hover {
		background-position:bottom;
	}
	
/* SOCIAL MEDIA BUTTONS */

	.social-bar ul {		
		float:right;
		width:130px;
		margin-top:15px;
	}
	
	.social-bar ul li {
		display:inline;
	}
	
	.social-bar ul li a {
		display:block;
		width:30px;
		height:31px;
		float:left;
		text-indent:-9999px;
		margin-left:10px;
		outline:none;
	}

	.social-bar ul li a.delicious {
		background:url('../images/social-del.png') no-repeat top;
	}
	
	.social-bar ul li a.digg {
		background:url('../images/social-digg.png') no-repeat top;
	}
	
	.social-bar ul li a.su {
		background:url('../images/social-su.png') no-repeat top;
	}
	
	.social-bar ul li a.delicious:hover, .social-bar ul li a.digg:hover, .social-bar ul li a.su:hover {
		background-position:bottom;		
	}
	

/*** TUTORIALS COMMENTS SECTION ***/



p.total-comments {
	font-size:14px;	
}

/*** WP COMMENTS STYLES ***/

	  ol.commentlist {
		  list-style:none;
		  margin:0;
		  padding:0;
		  text-indent:0;
	  }
	  ol.commentlist li {
		  border:1px solid #eee0ba;
		  border-radius:5px;
		  -moz-border-radius:5px;
		  -webkit-border-radius:5px;
		  margin:10px 0;
		  padding:10px;
		  position:relative;
	  }

	  ol.commentlist li div.vcard {
		  font-size: 14px;
		  font-weight: bold;
	  }
	  
	  ol.commentlist li em {
		  font-style:italic;
		  color:#765522;
		  margin-left:10px;
	  }
	  
	  ol.commentlist li div.vcard cite.fn {
		  position:absolute;
		  top:24px;
		  left:80px;
		  color:#5d401b;
		  font-weight:bold;
		  
	  }
	  ol.commentlist li div.vcard cite.fn a.url {
		  color:#065d98;
		  text-decoration:none;
	  }
	  ol.commentlist li div.vcard cite.fn a.url:hover {
		  color:#5d401b;
		  text-decoration:underline;
	  }
	  
	  ol.commentlist li div.vcard img.avatar {
		  background:#e5d2a9;
		  padding:7px;
		  float:left;
	  }
	  
	  ol.commentlist li div.vcard span.says {
		  display: none;
	  }
	 
	  ol.commentlist li div.comment-meta {
		  color: #5d401b;
		  font-size: 11px;
		  font-weight: bold;
		  position:absolute;
		  top:39px;
		  left:80px;
	  }
	  ol.commentlist li div.comment-meta a {
		  color:#5d401b;
		  text-decoration:none;
	  }
	  ol.commentlist li div.comment-meta a:hover {
		  color:#065d98;
		  text-decoration:underline;
	  }
	  ol.commentlist li p {
		  clear:both;
		  padding:10px 0;
	  
	  }
	  ol.commentlist li div.reply {
		  width:40px;
	  }
	  
	  ol.commentlist li div.reply span{
		  background:#e1c792;
		  border:1px solid #fff;
		  border-radius:5px;
		  -moz-border-radius:5px;
		  -webkit-border-radius:5px;
		  color:#fff;		  
		  text-align:center;
		  width:40px;
		  font-size: 11px;
		  font-weight: bold;
	  }
	  
	  ol.commentlist li div.reply a span{
		  display:block;
		  color:#fff;
		  text-decoration:none;
		  text-transform:uppercase;
		  padding:3px 10px;	
	  }
	  
	  ol.commentlist li div.reply a span:hover {
		  background:#bd833b;
		  cursor:pointer;
	  }
	  
	  ol.commentlist li ul.children {
		  list-style:none;
		  margin:10px 0 0;
		  text-indent:0;
	  }
	  
	  ol.commentlist li ul.children li.depth-2 {
		  background-color:#fef4d1;			  
	  }

	  ol.commentlist li ul.children li.odd {
		  background: #fffbef;
	  }
	  ol.commentlist li.even {
		  background:#f6e8c2;
	  }
	  ol.commentlist li.odd {
		  background:#f6f6f6;
	  }
	  
	  ol.commentlist li.bypostauthor, ol.commentlist li ul.children li.bypostauthor, ol.commentlist li ul.children li.comment-author-admin {
		  border:2px solid #e1c792;
		  background: #fef4d1;
	  }


/*** COMMENTS FORM ***/

#respond {
	padding-top:10px;	
}

#respond li {
	margin-bottom:5px;
	list-style:none;
}

#respond label {
	display:block;
	margin-bottom:3px;
	font-size:14px;	
}

#respond input, #respond textarea {
	color:#333333;	
	border:medium none;
	background:url('../images/input-comments.png') no-repeat top;; font-style:normal; font-variant:normal; font-weight:normal; line-height:18px; font-size:14px; font-family:Helvetica, Arial, sans-serif; padding-left:5px; padding-right:5px; padding-top:7px; padding-bottom:7px
}

#respond input {
	width:231px;
	height:17px;
}

#respond textarea {
	overflow:auto;
	background-image:url('../images/textarea-comments.png');
	width:441px;
	height:147px
}

#respond input:hover, #respond textarea:hover, #respond input:focus, #respond textarea:focus {
	background-position:bottom;
}

#respond #submit {
	background:url('../images/add-comment.png') top;	
	text-align:left;
	width:113px;
	height:30px;
	margin-top:10px;
	font-size: 12px;
	color: #FFF;
	font-weight: bold
}

#respond #submit:hover {
	background-position:bottom;
	cursor:pointer;
}


/*** PORTFOLIO - LIST ***/

#portfolio h2 {
	background-image:url('../images/title-portfolio.png');
	width:141px;
	height:28px
}

div.portfolio-post {
	margin-right:10px;
	padding-top:20px;
	margin-bottom:10px;
}

#portfolio #main div.portfolio-post h3 {
	float:left;
	margin:0 0 5px 10px;
	line-height:normal;
}

div.portfolio-post .button-view, div.portfolio-post-details .button-view {
	float:right;	
}

div.portfolio-post .image-container {
	clear:both;
	padding:0;
	background-image:none;
}


/*** PORTFOLIO - DETAILS ***/

div.portfolio-post-details {
	margin-right:10px;
}

div.portfolio-post-details .image-container {
	margin-bottom:10px;
}

div.portfolio-post-details small {
	font-size:12px;
	color:#5d401b;
}

#portfolio #main h3 {
	margin:26px 0 10px 10px;
}

/* HIRE ME BAR */

#hire-me-bar {
	overflow:auto;
	background:url('../images/hire-me-bg.png');
	width:659px;
	height:43px;
	padding:10px;
	margin-top:30px
}

#hire-me-bar h4{
	background:none;
	float:left;
	margin: 12px 15px 0 0;
}

#hire-me-bar .hire-me-button a{
	background:url('../images/hire-me-button.png') top;
	width:106px;
	height:39px;
	display:block	
}

#hire-me-bar .hire-me-button a:hover{
	background-position:bottom;
}

#hire-me-bar p.hire-me-button {
	width:106px;
	float:left;
	text-indent:-9999px;
	margin-top:2px;	
}

#hire-me-bar .back-to-portfolio a{
	background:url('../images/back-to-portfolio.png') top;
	display:block;
	float:right;
	width:117px;
	height:24px;
	font-size: 12px;
	font-weight: bold;
	text-align:right;	
	color: #fff;
	line-height: 24px;
	text-decoration: none;
	padding-right:5px;
	margin-top:9px
}

#hire-me-bar .back-to-portfolio a:hover {
	background-position:bottom;
}

/* 404 PAGE */

#not-found h2 {
	background:url('../images/404.png') no-repeat;
	width:151px;
	height:28px
}
#not-found #content #main {
	text-align:center;
	margin:120px 135px;
	padding:0;
	height:230px;
	width:670px;
}

#not-found #content #main p {
	margin-top:20px;
	font-size:14px;
}

/*** SEARCH FORM ***/

/* SIDEBAR FORM */

	#searchform, #searchform-content {
		background-color:#f9e6be;
		padding:5px;
		border-radius:5px;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
	}
	
	#searchform #s, #searchform-content #s {
		color:#7c6445;
		border:medium none;
		outline:0;
		background:url('../images/input-search.png') no-repeat top; 
		width:95px;
		height:17px; font-style:normal; font-variant:normal; font-weight:normal; line-height:16px; font-size:12px; font-family:Helvetica, Arial, sans-serif; padding-left:25px; padding-right:5px; padding-top:5px; padding-bottom:5px	
	}
	
	#searchform #s:focus, #searchform #s:hover, #searchform-content #s:focus, #searchform-content #s:hover{
		background-position:bottom;	
	}
	
	#searchform #searchsubmit, #searchform-content #searchsubmit{
		background:url('../images/button-search.png') top;
		border:medium none;	
		text-align:left;
		color:#fff;
		width:61px;
		height:26px;
		cursor:pointer; font-style:normal; font-variant:normal; font-weight:bold; line-height:26px; font-size:12px; font-family:Helvetica, Arial, sans-serif; padding-left:10px; padding-right:10px; padding-top:0; padding-bottom:1px
	}
	
	#searchform #searchsubmit:hover, #searchform-content #searchsubmit:hover {
		background-position:bottom;
	}

/* CONTENT FORM */

	
	#searchform-content #s {
		background:url('../images/input-search-big.png') no-repeat top;
		width:285px	
	}


/* SEARCH RESULTS */

#search h2 {
	background:url('../images/title-search.png') no-repeat;
	width:117px;
	height:29px
}
.search-post {
  background:url('../images/post-border.png') no-repeat center bottom;
}

.search-post p{
	padding-left:10px;
	padding-top:10px;
	padding-right:20px;
	padding-bottom:20px;
}

#search .search-post h4 {
	letter-spacing:-0.03em;
	background:none;
	padding:0;
	margin-bottom:3px;;
	margin-top:20px;
	font-size:21px;
}

.search-post h4 a:hover {
	text-decoration:underline;
}/*
Theme Name: Cool Web Designer.ca
Theme URI: http://www.coolwebdesigner.com/
Description: Design Island Theme.
Version: 1.0
Author: Cool Web Designer
Author URI: http://www.coolwebdesigner.com/
*/

/***RESET***/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

:focus {
	outline: 0;
}

em {
	font-style:italic;
}

/***BASICS***/

body {
	background:url('../images/bg.jpg');
	color: #333333; font-style:normal; font-variant:normal; font-weight:normal; line-height:17px; font-size:12px; font-family:Helvetica, Arial, sans-serif	
}

#container {
	background:url('../images/header-bg.jpg') repeat-x;
	padding-bottom:30px
}

a, a:visited {
	color:#006988;
	text-decoration:none;
}

a:hover {
	color:#5d401b;	
}

strong {
	font-weight:bold;
}

p a, p a:visited {
	text-decoration:underline;
}

p a:hover {
	text-decoration:none;
}


/*** MORE DETAILS ***/

p.button-more a {
	font-weight:bold;
	color:#FFF;
	text-decoration:none;
	background:url('../images/button-more-details.png') no-repeat left top;
	display:block;
	width:83px;
	height:14px;
	line-height:15px; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:5px
}

p.button-more a:hover {
	background-position:bottom;
}

/*** VIEW DETAILS ***/


p.button-view a {
	font-weight:bold;
	color:#FFF;
	text-decoration:none;
	background:url('../images/button-view-details.png') no-repeat left top;
	display:block;
	width:83px;
	height:14px;
	line-height:15px; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:5px
}

p.button-view a:hover {
	background-position:bottom;
}

/***HEADER***/

#header	{
	overflow:hidden;
	background:url('../images/header-inner.jpg');
	margin: 0 auto;
	width:940px;
	height:199px; padding-left:0; padding-right:0; padding-top:50px; padding-bottom:0
}

h2 {
	text-indent:-9999px;
	margin:160px 10px;
}


/* HEADER - LOGO */
		
	#header h1 {
		float:left;
		background:url('../images/Cool Web Designer-logo.png') no-repeat;	
	}
	
	#header h1 a {
		display:block;
		width:188px;
		height:85px;
		text-indent:-9999px;
		outline:none;
	}
		
/* HEADER - MAIN MENU */
		
	#main-menu {
		overflow:hidden;
		float:right;
	}
	
	#main-menu li {
		display:inline;
	}
	
	#main-menu li a {
		display:block;
		float:left;
		text-indent:-9999px;
		background:url('../images/main-menu.jpg') no-repeat;
		width:90px;
		height:55px
	}
	
	#main-menu li a.home {
		background-position:0 0;
	}
	
	#main-menu li a.about {
		background-position:-90px 0;
	}
	
	#main-menu li a.services {
		background-position:-180px 0;
	}
	
	#main-menu li a.portfolio {
		background-position:-270px 0;
	}
	
	#main-menu li a.testimonials {
		background-position:-360px 0;
	}
	
	#main-menu li a.contacts {
		background-position:-450px 0;
	}

		
/* HEADER - MAIN MENU a:hover */
		
	#main-menu li a.home:hover {
		background-position:0 -55px;
	}
	
	#main-menu li a.about:hover {
		background-position:-90px -55px;
	}
	
	#main-menu li a.services:hover {
		background-position:-180px -55px;
	}
	
	#main-menu li a.portfolio:hover {
		background-position:-270px -55px;
	}
	
	#main-menu li a.testimonials:hover {
		background-position:-360px -55px;
	}

	#main-menu li a.contacts:hover {
		background-position:-450px -55px;
	}
	
/* HEADER - MAIN MENU - Current */
		
	#main-menu li.current a.home {
		background-position:0 -110px;
	}
	
	#main-menu li.current a.about {
		background-position:-90px -110px;
	}
	
	#main-menu li.current a.services {
		background-position:-180px -110px;
	}
	
	#main-menu li.current a.portfolio {
		background-position:-270px -110px;
	}
	
	#main-menu li.current a.testimonials {
		background-position:-360px -110px;
	}
	
	#main-menu li.current a.contacts {
		background-position:-450px -110px;
	}


/***CONTENT - BASICS***/

#content-container {
	margin:0 auto;
	width:950px;
	background: url('../images/content-shadow.png') no-repeat top;
}

div.content-bg {
	margin:0 auto;
	width:940px;
	background:url(../images/bg.jpg);	
}

#content {
	background:url('../images/content-top-shadow.png') no-repeat top;
	overflow:hidden
}

#content #main {
	float:left;
	width:690px;
	padding:0 10px 20px;
}


h3, #home #sidebar h3 {
	margin: 20px 0 15px;
	font-size:24px;
	letter-spacing:-0.03em;
	color: #643700;
	font-weight: normal;
}

#home h3, #home #sidebar h3 {
	margin-top:10px;
}

#content h3 a{
	color: #5d401b;
}

#content h3 a:hover{
	color: #006988;
	text-decoration:underline;
}
	
#main-content {
	overflow:hidden;
	float:left;
	width:460px;
}

small {
	font-size:11px;
	color:#9b8a53;
}

/*** IMAGE CONTAINER ***/

div.image-container {
	background:url('../images/image-container-bg.png');
	padding:9px
}	

div.image-container a{
	background:url('../images/image-container-bg.png');
	display:block;
	padding:9px
}

div.image-container a:hover{
	background:url('../images/image-container-bg-hover.png');
}

div.image-container img, div.image-container a img {
	border:1px solid white;
	vertical-align:bottom;
}

/*** SIDEBAR ***/

#sidebar {
	float:right;
	width:200px;
	background:url('../images/sidebar-background.png') no-repeat top;; padding-left:20px; padding-right:10px; padding-top:0; padding-bottom:30px	
}

#sidebar h3 {
	margin:20px 0 8px;
	font-size: 18px;
	font-weight: bold;
	letter-spacing:-0.03em;
}

#sidebar ul {
	padding-right:10px;
}

#sidebar li a{
	background:url('../images/arrow-sidebar-inner.png') no-repeat left 11px;
	display:block;
	font-size: 14px;
	color: #a28e60;
	line-height:15px; padding-left:10px; padding-right:10px; padding-top:6px; padding-bottom:6px
}

#sidebar li a:hover {
	background-image:url('../images/arrow-sidebar-inner-hover.png');
	background-color:#fdebc1;
	color:#81724e
}


/***FOOTER***/

#footer-container{
	clear: both;
	background: #E3DD87 url('../images/footer-bg.jpg') repeat-x;
}

#footer {
	margin:0 auto;
	overflow:hidden;
	width:940px;
	padding:30px 0;

}
	
/* FOOTER - CONTACT INFO */

	#contact-info {		
		float:right;
		width:460px;
		overflow:hidden;
	}
	
	h4 {		
		background:url('../images/footer-header-bg.gif') repeat-x bottom;
		padding-bottom:7px;
		margin-bottom:15px;
		font-size:21px
	}
	
	#footer h4 a{
		letter-spacing:-0.01em;
		font-size:21px;
		color:#333333;
		
	}
	
	#footer h4 a:hover{
		
		color:#006988;
		text-decoration:underline;
	}
		
/* FOOTER - CONTACT DETAILS */
	
	#contact-details {
		float:left;
		width:200px;
		padding:0 10px;
	}
	
	#contact-details p {
		margin-bottom:25px;
		padding-left:0px;
	}
	
	#contact-details dl dt, #contact-info #contact-details dl dd {
		margin-bottom:4px;
	}
	
	#contact-details dl dt {
		float:left;	
		width:40px;
		font-weight:bold;
		text-align:right;
		margin:0 10px 0 0;

	}
	
	#contact-details dl dd a {
		color:#006988;
		text-decoration:underline;
	}
	
	#contact-details dl dd a:hover {
		color:#5d401b;
		text-decoration:none;
	}
	
/* FOOTER - CONTACT FORM */
	
	#contact-form {
		padding:0 10px 20px;
		float:right;
		overflow:hidden;
		width:200px;
	}
	
	#contact-form ul li label {		
		color:#5d401b;
	}
	
	#contact-form input, #contact-form textarea{
		padding:5px;
		color:#7c6445;
		border:medium none;
		outline:0;
		background:url('../images/input-small.png') no-repeat top; 
		width:192px;
		height:17px; font-style:normal; font-variant:normal; font-weight:normal; line-height:16px; font-size:12px; font-family:Helvetica, Arial, sans-serif; margin-left:0; margin-right:0; margin-top:2px; margin-bottom:7px		
	}
	
	#contact-form textarea {
		overflow:auto;
		width:192px;
		height:73px;
		background:url('../images/textarea-small.png') no-repeat top;
	}
	
	#contact-form input:focus, #contact-form textarea:focus, #contact-form input:hover,	#contact-form textarea:hover {
		background-position:bottom;
	}
	
	#contact-form li.submit input {
		background:url('../images/submit-contacts-small.png') top;
		border:medium none;
		text-align:left;
		color:#fff;
		width:65px;
		height:24px;
		margin-left:67px;
		cursor:pointer; font-style:normal; font-variant:normal; font-weight:bold; line-height:24px; font-size:12px; font-family:Helvetica, Arial, sans-serif; padding-left:10px; padding-right:10px; padding-top:0; padding-bottom:1px
	}
	
	#contact-form li.submit input:hover {
		background-position:bottom;		
	}
	
/* FOOTER - ABOUT ME */
	
	div.text-block {
		float:left;
		width:460px;
	}
	
	div.text-block p {
		padding:0 10px 10px;
	}
	
	div.text-block p.button-more {
		padding:0;
		margin-top:10px;
	}
	
/*** SITE INFO ***/
	
#site-info-container {
	background:url('../images/site-info-bg.jpg') repeat-x;
	padding-top:30px;
	height:78px
}

#site-info {
	margin:0 auto;	
	width:940px;
	overflow:hidden;
	color:#81c9e7;
	
}

#site-info a{
	color:#d6eef2;	
}
	
#site-info a:hover{
	color:#05fff6;	
}
	
/* SITE INFO - COPYRIGHTS */
			
	#copyrights {
		float:left;
	}
		
/* SITE INFO - MENU */
	
	#site-info-menu {
		float:right;
	}
	
	#site-info-menu li{
		display:inline;
		
	}
	
	#site-info-menu li a{
		display:block;
		float:left;
		margin-left:10px;
		padding:3px 10px;
		background-color:#006e96;
	}
	
	#site-info-menu li a:hover{
		color:#d6eef2;
		background-color:#2688b6;
	}


/*** HOME ***/

#home #header {
	background:url('../images/header-home.jpg');
	height:377px
}

h2.home {
	margin: 0px;
}

/* HOME - INTRO */
	
	#intro {
		text-indent:-9999px;
		padding-top:250px;
		clear:both;
		float:right;
		width:300px;
	}
	
	#intro ul {
		overflow:hidden;
	}
	
	#intro ul li {
		display:inline;
	}
	
	#intro ul li a {
		display:block;
		float:left;
	}
	
	#intro ul li#view-portfolio a {
		background:url('../images/view-portfolio.png') 0 0;
		width:147px;
		height:39px
	}
	
	#intro ul li#get-quote a {
		background:url('../images/get-quote.png') 0 0;
		margin-left:13px;
		width:130px;
		height:39px
	}
	
	#intro ul li#view-portfolio a:hover, #intro ul li#get-quote a:hover {
		background-position:0 39px;
	}


/* HOME - CONTENT */
		
	#home #content {
		overflow:hidden;
		margin: 0 auto;
		padding:0;
		width:940px;
		background:none;
	}


/* HOME - CONTENT - MAIN */
		
	#home #content #main {
		width:720px;
		padding:0;
	}
		
/* HOME - FEATURED */
			
	ul#featured li{
		margin-right:20px;
		float:left;
		width:220px;
	}
	
	ul#featured li div {
		margin-bottom:10px;
	}
	
	ul#featured li div a img {
		border:1px solid white;
	}
	
	ul#featured li div a{
		background:url('../images/image-container-bg-home.png');
		display:block;
		padding:9px;
		width:202px;
		height:143px
	}
	
	ul#featured li div a:hover{
		background:url('../images/image-container-bg-hover.png');
	}
	
	ul#featured li p {
		padding: 0;
	}
	
	ul#featured li p a{
		padding-left:10px;
		background:url('../images/arrow.png') no-repeat 0 4px;
		font-size: 12px;
		font-weight: bold;
		text-decoration:none;
		color: #006988
	}
	
	ul#featured li p a:hover{
		background:url('../images/arrow-hover.png') no-repeat 0 4px;
		color: #5d401b;
		text-decoration:underline
	}
	
	
/* HOME - SIDEBAR */
			
	#home #sidebar {
		float:left;
		width:210px;
		padding:0;
		background:none;
	}
	
	#home #sidebar li a{
		display:block;
		font-size: 14px;
		line-height:15px;
		margin:0px;
		background:url('../images/arrow-sidebar-home.png') no-repeat 0 9px;
		color: #6f6243; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:10px
	}
	
	#home #sidebar li a:hover {
		background:#eed19f url('../images/arrow-sidebar-home.png') no-repeat 0 9px;
	}
	
	#home #sidebar li{
		border-bottom:1px solid #caae80;
	}
	
	#home #sidebar li:last-child{
		border:none;
	}


/***ABOUT***/

#about h2 {
	background:url('../images/title-about.png') no-repeat;
	width:102px;
	height:28px
}

#content #main-content p {
	margin-bottom:15px;
	padding-left:10px;
}

#content #main-content #contact-details p {
	padding-left:0;
}

/* SUPPLEMENTARY-CONTENT (content subsection) */

	#supp-content {
		color:#5d401b;
		float:right;
		width:200px;
		padding-left:20px;
		background:url('../images/content-vertical-line.png') no-repeat left top;
	}
	
	#supp-content ul {
		margin-bottom:20px;
	}
	
	#supp-content ul li {
		margin-bottom:5px;
		line-height:16px;
		background: url('../images/bullet.png') no-repeat left 5px;
		padding-left:10px
	}

/* ABOUT PAGE - SMALL CONTACT FORM */
	
	#about #contact-form .contacts-input input, #about #contact-form textarea{
		background:url('../images/input-small-innerpage.png') no-repeat top; 
	}
	
	#about #contact-form textarea {
		background:url('../images/textarea-small-innerpage.png') no-repeat top;
	}
	
	#about #contact-form input:focus, #about #contact-form textarea:focus, #about #contact-form input:hover, #about #contact-form textarea:hover {
		background-position:bottom;
	}


/***CONTACTS***/

#contacts h2 {
	background:url('../images/title-contacts.png') no-repeat;
	width:151px;
	height:29px
}

#contacts #main-content {
	width:220px;
	margin-top:10px;
}

/* CONTACTS PAGE - LARGE CONTACT FORM */

	#contacts #contact-form {
		float:left;
		width:440px;
		margin: 10px 0 40px 10px;
	}
	
	#contacts label {
		display:block;
	}
	
	#contacts #contact-form .contacts-input input, #contacts #contact-form textarea {	
		background:url('../images/input-large.png') no-repeat top;
		width:222px;
		height:17px;
		color:#5d401b
	}
	
	#contacts #contact-form textarea {
		background:url('../images/textarea-large.png') no-repeat top;
		width:430px;
		height:206px
	}
	
	#contacts #contact-form input:focus, #contacts #contact-form textarea:focus, #contacts #contact-form input:hover, #contacts #contact-form textarea:hover {
		background-position: bottom;
	}
	
	#contacts #contact-form li.submit input {
		background:url('../images/submit-contacts-large.png') top;
		width:72px;
		height:29px;
		margin-left:183px;
		font-size: 14px;
		font-weight: bold;
		letter-spacing:-0.01em;
		line-height: 30px
	}
	
	#contacts #contact-form li.submit input:hover {
		background-position:bottom;
	}

/*** TUTORIALS - LIST ***/


#services h2 {
	background:url('../images/title-services.png') no-repeat;
	width:143px;
	height:28px
}

.services-post {
	overflow:hidden;
	width:670px;
	background: url('../images/post-border.png') no-repeat bottom;
	position:relative; padding-left:10px; padding-right:10px; padding-top:20px; padding-bottom:20px	
}

.services-post:last-child {
	background:none;
}
	

#content .services-post p {
	margin: 10px 0 0 220px;
	padding:0 20px 40px 0;
	line-height:18px;
}

#services div.image-container a{
	width:182px;
	height:152px;
}

#services div.image-container {
	padding:0;
	float:left;
}

.services-post .image-container {
	margin-right:20px;
	background:none;
}

.services-post h3 {
	margin:0 0 3px 0;
	line-height: 24px;
}

#services #content p.button-view {
	position:absolute;
	left: 230px;
	bottom: 20px;
	padding:0;
	margin:0;
}

/*** COMMENTS - NUMBER ***/

	.comments-number {
		position:absolute;
		right: 10px;
		bottom: 11px;		
	}
	
#services #content	p.comments-number {
		padding:0;
		margin:0;
	}
	
	.comments-number a, .comments-number a:visited {
		padding-top:5px;
		background:url('../images/comments-number.png') no-repeat top;
		display:block;
		width:40px;
		height:28px;
		font-size: 16px;
		color: #7a5c36;
		font-weight: bold;
		text-decoration: none;
		text-align:center;
		line-height:16px;
		outline:0
	}
		
	.comments-number a:hover {
		background-position:bottom;
		color: #fff;
	}

/*** RSS - LARGE ***/

.rss-large a {
	background:url('../images/rss-large.png') no-repeat top;
	display:block;
	width:161px;
	height:45px;
	margin-top:20px;
	text-indent:-9999px;
	margin-bottom:10px
}

.rss-large a:hover {
	background-position:bottom;
}
	

/*** TUTORIALS - DETAILS ***/

.services-details {
	overflow:hidden;
	padding:0 10px 30px;
}

.services-details p {
	margin-bottom:10px;
}

#services div.services-details .image-container {
	padding:9px;
	width:652px;
	text-align:center;
	margin:20px 0;
	float:none;	
}

.services-details .image-container img{
	margin:auto;
	border:1px solid #fff;
}

#services .services-details h4 {
	font-weight:bold;
	background-image:none;
	padding:0;
	margin:20px 0 10px 0;
}

.services-details .image-container p {
	font-weight:bold;
	margin:10px auto 5px;
	color:#81724e;
}


/* SOCIAL BAR */
	
	div.social-bar {
		overflow:hidden;
		background:url('../images/services-social-bar.png') no-repeat;
		width:670px;
		height:63px;
		margin-top:40px
	}
	
	.social-bar .rss {
		float:left;
		width:450px;
	}
	
	#services .services-details .social-bar h4 {
		float:left;
		font-weight:normal;
		width:195px;
		margin:23px 0 0 10px;
		background:none;
	}
	
	.social-bar .rss-small, .social-bar .rss-small a {		
		width:141px;
		height:41px;
		float:left;
		margin-top:5px;
	
	}
		
	.social-bar .rss-small a {		
		background:url('../images/rss-small.png') no-repeat top;
		display:block;		
		text-indent:-9999px	
		
	}
	
	.social-bar .rss-small a:hover {
		background-position:bottom;
	}
	
/* SOCIAL MEDIA BUTTONS */

	.social-bar ul {		
		float:right;
		width:130px;
		margin-top:15px;
	}
	
	.social-bar ul li {
		display:inline;
	}
	
	.social-bar ul li a {
		display:block;
		width:30px;
		height:31px;
		float:left;
		text-indent:-9999px;
		margin-left:10px;
		outline:none;
	}

	.social-bar ul li a.delicious {
		background:url('../images/social-del.png') no-repeat top;
	}
	
	.social-bar ul li a.digg {
		background:url('../images/social-digg.png') no-repeat top;
	}
	
	.social-bar ul li a.su {
		background:url('../images/social-su.png') no-repeat top;
	}
	
	.social-bar ul li a.delicious:hover, .social-bar ul li a.digg:hover, .social-bar ul li a.su:hover {
		background-position:bottom;		
	}
	

/*** TUTORIALS COMMENTS SECTION ***/



p.total-comments {
	font-size:14px;	
}

/*** WP COMMENTS STYLES ***/

	  ol.commentlist {
		  list-style:none;
		  margin:0;
		  padding:0;
		  text-indent:0;
	  }
	  ol.commentlist li {
		  border:1px solid #eee0ba;
		  border-radius:5px;
		  -moz-border-radius:5px;
		  -webkit-border-radius:5px;
		  margin:10px 0;
		  padding:10px;
		  position:relative;
	  }

	  ol.commentlist li div.vcard {
		  font-size: 14px;
		  font-weight: bold;
	  }
	  
	  ol.commentlist li em {
		  font-style:italic;
		  color:#765522;
		  margin-left:10px;
	  }
	  
	  ol.commentlist li div.vcard cite.fn {
		  position:absolute;
		  top:24px;
		  left:80px;
		  color:#5d401b;
		  font-weight:bold;
		  
	  }
	  ol.commentlist li div.vcard cite.fn a.url {
		  color:#065d98;
		  text-decoration:none;
	  }
	  ol.commentlist li div.vcard cite.fn a.url:hover {
		  color:#5d401b;
		  text-decoration:underline;
	  }
	  
	  ol.commentlist li div.vcard img.avatar {
		  background:#e5d2a9;
		  padding:7px;
		  float:left;
	  }
	  
	  ol.commentlist li div.vcard span.says {
		  display: none;
	  }
	 
	  ol.commentlist li div.comment-meta {
		  color: #5d401b;
		  font-size: 11px;
		  font-weight: bold;
		  position:absolute;
		  top:39px;
		  left:80px;
	  }
	  ol.commentlist li div.comment-meta a {
		  color:#5d401b;
		  text-decoration:none;
	  }
	  ol.commentlist li div.comment-meta a:hover {
		  color:#065d98;
		  text-decoration:underline;
	  }
	  ol.commentlist li p {
		  clear:both;
		  padding:10px 0;
	  
	  }
	  ol.commentlist li div.reply {
		  width:40px;
	  }
	  
	  ol.commentlist li div.reply span{
		  background:#e1c792;
		  border:1px solid #fff;
		  border-radius:5px;
		  -moz-border-radius:5px;
		  -webkit-border-radius:5px;
		  color:#fff;		  
		  text-align:center;
		  width:40px;
		  font-size: 11px;
		  font-weight: bold;
	  }
	  
	  ol.commentlist li div.reply a span{
		  display:block;
		  color:#fff;
		  text-decoration:none;
		  text-transform:uppercase;
		  padding:3px 10px;	
	  }
	  
	  ol.commentlist li div.reply a span:hover {
		  background:#bd833b;
		  cursor:pointer;
	  }
	  
	  ol.commentlist li ul.children {
		  list-style:none;
		  margin:10px 0 0;
		  text-indent:0;
	  }
	  
	  ol.commentlist li ul.children li.depth-2 {
		  background-color:#fef4d1;			  
	  }

	  ol.commentlist li ul.children li.odd {
		  background: #fffbef;
	  }
	  ol.commentlist li.even {
		  background:#f6e8c2;
	  }
	  ol.commentlist li.odd {
		  background:#f6f6f6;
	  }
	  
	  ol.commentlist li.bypostauthor, ol.commentlist li ul.children li.bypostauthor, ol.commentlist li ul.children li.comment-author-admin {
		  border:2px solid #e1c792;
		  background: #fef4d1;
	  }


/*** COMMENTS FORM ***/

#respond {
	padding-top:10px;	
}

#respond li {
	margin-bottom:5px;
	list-style:none;
}

#respond label {
	display:block;
	margin-bottom:3px;
	font-size:14px;	
}

#respond input, #respond textarea {
	color:#333333;	
	border:medium none;
	background:url('../images/input-comments.png') no-repeat top;; font-style:normal; font-variant:normal; font-weight:normal; line-height:18px; font-size:14px; font-family:Helvetica, Arial, sans-serif; padding-left:5px; padding-right:5px; padding-top:7px; padding-bottom:7px
}

#respond input {
	width:231px;
	height:17px;
}

#respond textarea {
	overflow:auto;
	background-image:url('../images/textarea-comments.png');
	width:441px;
	height:147px
}

#respond input:hover, #respond textarea:hover, #respond input:focus, #respond textarea:focus {
	background-position:bottom;
}

#respond #submit {
	background:url('../images/add-comment.png') top;	
	text-align:left;
	width:113px;
	height:30px;
	margin-top:10px;
	font-size: 12px;
	color: #FFF;
	font-weight: bold
}

#respond #submit:hover {
	background-position:bottom;
	cursor:pointer;
}


/*** PORTFOLIO - LIST ***/

#portfolio h2 {
	background-image:url('../images/title-portfolio.png');
	width:141px;
	height:28px
}

div.portfolio-post {
	margin-right:10px;
	padding-top:20px;
	margin-bottom:10px;
}

#portfolio #main div.portfolio-post h3 {
	float:left;
	margin:0 0 5px 10px;
	line-height:normal;
}

div.portfolio-post .button-view, div.portfolio-post-details .button-view {
	float:right;	
}

div.portfolio-post .image-container {
	clear:both;
	padding:0;
	background-image:none;
}


/*** PORTFOLIO - DETAILS ***/

div.portfolio-post-details {
	margin-right:10px;
}

div.portfolio-post-details .image-container {
	margin-bottom:10px;
}

div.portfolio-post-details small {
	font-size:12px;
	color:#5d401b;
}

#portfolio #main h3 {
	margin:26px 0 10px 10px;
}

/* HIRE ME BAR */

#hire-me-bar {
	overflow:auto;
	background:url('../images/hire-me-bg.png');
	width:659px;
	height:43px;
	padding:10px;
	margin-top:30px
}

#hire-me-bar h4{
	background:none;
	float:left;
	margin: 12px 15px 0 0;
}

#hire-me-bar .hire-me-button a{
	background:url('../images/hire-me-button.png') top;
	width:106px;
	height:39px;
	display:block	
}

#hire-me-bar .hire-me-button a:hover{
	background-position:bottom;
}

#hire-me-bar p.hire-me-button {
	width:106px;
	float:left;
	text-indent:-9999px;
	margin-top:2px;	
}

#hire-me-bar .back-to-portfolio a{
	background:url('../images/back-to-portfolio.png') top;
	display:block;
	float:right;
	width:117px;
	height:24px;
	font-size: 12px;
	font-weight: bold;
	text-align:right;	
	color: #fff;
	line-height: 24px;
	text-decoration: none;
	padding-right:5px;
	margin-top:9px
}

#hire-me-bar .back-to-portfolio a:hover {
	background-position:bottom;
}

/* 404 PAGE */

#not-found h2 {
	background:url('../images/404.png') no-repeat;
	width:151px;
	height:28px
}
#not-found #content #main {
	text-align:center;
	margin:120px 135px;
	padding:0;
	height:230px;
	width:670px;
}

#not-found #content #main p {
	margin-top:20px;
	font-size:14px;
}

/*** SEARCH FORM ***/

/* SIDEBAR FORM */

	#searchform, #searchform-content {
		background-color:#f9e6be;
		padding:5px;
		border-radius:5px;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
	}
	
	#searchform #s, #searchform-content #s {
		color:#7c6445;
		border:medium none;
		outline:0;
		background:url('../images/input-search.png') no-repeat top; 
		width:95px;
		height:17px; font-style:normal; font-variant:normal; font-weight:normal; line-height:16px; font-size:12px; font-family:Helvetica, Arial, sans-serif; padding-left:25px; padding-right:5px; padding-top:5px; padding-bottom:5px	
	}
	
	#searchform #s:focus, #searchform #s:hover, #searchform-content #s:focus, #searchform-content #s:hover{
		background-position:bottom;	
	}
	
	#searchform #searchsubmit, #searchform-content #searchsubmit{
		background:url('../images/button-search.png') top;
		border:medium none;	
		text-align:left;
		color:#fff;
		width:61px;
		height:26px;
		cursor:pointer; font-style:normal; font-variant:normal; font-weight:bold; line-height:26px; font-size:12px; font-family:Helvetica, Arial, sans-serif; padding-left:10px; padding-right:10px; padding-top:0; padding-bottom:1px
	}
	
	#searchform #searchsubmit:hover, #searchform-content #searchsubmit:hover {
		background-position:bottom;
	}

/* CONTENT FORM */

	
	#searchform-content #s {
		background:url('../images/input-search-big.png') no-repeat top;
		width:285px	
	}


/* SEARCH RESULTS */

#search h2 {
	background:url('../images/title-search.png') no-repeat;
	width:117px;
	height:29px
}
.search-post {
  background:url('../images/post-border.png') no-repeat center bottom;
}

.search-post p{
	padding-left:10px;
	padding-top:10px;
	padding-right:20px;
	padding-bottom:20px;
}

#search .search-post h4 {
	letter-spacing:-0.03em;
	background:none;
	padding:0;
	margin-bottom:3px;;
	margin-top:20px;
	font-size:21px;
}

.search-post h4 a:hover {
	text-decoration:underline;
}