/*  
Theme Name: CSS Catwalk
Theme URI: http://www.csscatwalk.com/
Description: The default theme for v1.0 of CSS Catwalk.
Version: 1.0
Author: XHTML This
Author URI: http://www.xhtmlthis.com/
*/
/**********************************************/
/*  XHTML This ********************************/
/*  @url http://www.xhtmlthis.com *************/
/**********************************************/
/*  Code is not to be redistributed or sold.  */
/**********************************************/

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;
	font: 12px/18px "Lucida Grande", Arial, sans-serif;
}
	body {
		background: url('images/background/background.gif') repeat top left;
	}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
fieldset,img,a 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%;
}
q:before,q:after {
	content: '';
}
abbr,acronym {
	border: 0;
}
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.clearfix {
    display: inline-block;
}
html[xmlns] .clearfix {
    display: block;
}
* html .clearfix {
    height: 1%;
}
a {
	color: #fff;
}

#wrapper {
	width: 728px;
	margin: 0 auto;
}
	#header {
		padding: 27px 0;
	}
		#header h1 {
			background: url('images/header/logo.gif') no-repeat;
			width: 213px; height: 38px; 
		}
			#header h1 a, #header h1 a:hover {
				text-decoration: none;
				float: left;
				text-indent: -1000000px;
				width: 213px; height: 38px;
			}
		#header ul {
			float: right;
			padding: 10px 0 0;
		}
			#header li {
				float: left;
				margin: 0 5px;
			}
				.page_item a {
					text-decoration: none;
					font-size: 11px;
					font-weight: bold;
					text-transform: uppercase;
					padding: 5px;
				}
				.page_item a:hover {
					background: #fff;
					text-decoration: none;
					font-size: 11px;
					color: #000;
					font-weight: bold;
					text-transform: uppercase;
					padding: 5px;
				}
				.current_page_item a {
					background: #fff;
					text-decoration: none;
					font-size: 11px;
					color: #000;
					font-weight: bold;
					text-transform: uppercase;
				}

                                .page_item_feed a {
					text-decoration: none;
					font-size: 11px;
					font-weight: bold;
					text-transform: uppercase;
					padding: 5px;
				}
				.page_item_feed a:hover {
					text-decoration: none;
					font-size: 11px;
					color: #000;
					font-weight: bold;
					text-transform: uppercase;
					padding: 5px;
				}    

	#ad {
		background: url('images/header/ad_bg.gif') no-repeat; 
		width: 705px; height: 99px;
		margin: 0 auto; padding: 12px 0 0 1px;
	}
		#ad img {
			margin: 0 0 0 13px;
		}
		#advertise {
			float: right;
			color: #B1B1B1;
			width: 275px;
			font-size: 11px;
			padding: 10px 22px 0 0;
			text-align: center;
		}
			#advertise a {
				text-decoration: underline;
				color: #94ce0f;
                                text-transform: uppercase;
			}
			#advertise a:hover {
				text-decoration: none;
				color: #94ce0f;
                                text-transform: uppercase;
			}
	#content {
		background: url('images/content/background.gif') repeat-y; 
                color: #ffffff;
	}
		#content_foot {
			background: url('images/content/sites_foot.gif') no-repeat bottom;
			padding: 0 0 30px;
		}
		#top_archive {
			background: url('images/content/archive_top.gif') no-repeat; 
			width: 668px; height: 54px;
			color: #fff;
			font: 18px "Lucida Grande", Arial, sans-serif;
			padding: 20px 30px 0 30px;
		}
		#sites {
			background: url('images/content/fade.gif') no-repeat top;
		}
			.sites_pad {
				padding: 0 30px;
			}
			.site {
				width: 202px;
				padding: 10px;
				float: left;
                                color: #fff;
			}
				.site_preview {
					height: 138px;
				}
					
                                        .site_preview img {
						padding: 1px;
						border: 1px solid #638d00;
					}

                                        .site_preview a img {
						padding: 1px;
						border: 1px solid #638d00;
					}
					.site_preview a:hover img {
						padding: 1px;
						border: 1px solid #314600;
					}
				.title {
					background: #415e00;
					border-top: 2px solid #3c5700;
					border-bottom: 1px solid #364d01;
					padding: 5px;
                                        color: #638D00;
				}

                                        .title-text {
						color: #fff;
						font: bold 10px "Lucida Grande", Arial, sans-serif;
					}
					.title a {
						text-decoration: underline;
						color: #fff;
						font: bold 10px "Lucida Grande", Arial, sans-serif;
					}
					.title a:hover {
						text-decoration: none;
						color: #fff;
						font: bold 10px "Lucida Grande", Arial, sans-serif;
					}
	#bottom_area1 {
		background: url('images/content/sites_foot_other1.gif') no-repeat; 
		width: 647px; height: 145px;
		margin: 0 auto; padding: 25px 20px 0 40px;
	}

        #bottom_area2 {
		background: url('images/content/sites_foot_other.gif') no-repeat; 
		width: 647px; height: 145px;
		margin: 0 auto; padding: 25px 20px 0 40px;
	}
		.column {
			width: 178px;
			float: left;
		}
			.column p {
				padding: 10px 0 0;
				color: #fff;
				line-height: 22px;
			}
 
                                .column p a {
					text-decoration: none;
					color: #fff;
				}
				.column p a:hover {
					text-decoration: underline;
					color: #fff;
				}

			.column ul {
				padding: 10px 0;
			}
			.column li {
				background: url('images/content/arrow.gif') no-repeat left center;
				padding: 2px 0 3px 13px; 
                                color: #fff;
			}
				.column li a {
					text-decoration: none;
					color: #fff;
				}
				.column li a:hover {
					text-decoration: underline;
					color: #fff;
				}

                              
                        .column-mid {
			width: 250px;
			float: left;
		}
			.column-mid p {
				padding: 10px 0 0;
				color: #fff;
				line-height: 22px;
			}
			.column-mid ul {
				padding: 10px 0;
			}
			.column-mid li {
				background: url('images/content/arrow.gif') no-repeat left center;
				padding: 2px 0 3px 13px; 
                                color: #fff;
			}
				.column-mid li a {
					text-decoration: none;
					color: #fff;
				}
				.column-mid li a:hover {
					text-decoration: underline;
					color: #fff;
				}

                                .column-mid p a {
					text-decoration: none;
					color: #fff;
				}
				.column-mid p a:hover {
					text-decoration: underline;
					color: #fff;
				}

                        .column-end {
			width: 202px;
			float: left;
		}
			.column-end p {
				padding: 10px 0 0;
				color: #fff;
				line-height: 22px;
			}
			.column-end ul {
				padding: 10px 0;
			}
			.column-end li {
				background: url('images/content/arrow.gif') no-repeat left center;
				padding: 2px 0 3px 13px; 
                                color: #fff;
			}
				.column-end li a {
					text-decoration: none;
					color: #fff;
				}
				.column-end li a:hover {
					text-decoration: underline;
					color: #fff;
				}

			#archives span, #advertisements span, #about span, #top-com span, #sixteen span, #statsshow span {
				display: none;
			}
			#archives {
				background: url('images/content/monthlyarchives.gif') no-repeat; 
				width: 108px; height: 16px;
			}
			#advertisements {
				background: url('images/content/advertisements.gif') no-repeat; 
				width: 97px; height: 14px;
			}
			#about {
				background: url('images/content/aboutcsscatwalkcom.gif') no-repeat; 
				width: 148px; height: 14px;
			}
                        #top-com {
				background: url('images/content/top-com.gif') no-repeat; 
				width: 121px; height: 15px;
			}
			#sixteen {
				background: url('images/content/tagcloud.gif') no-repeat; 
				width: 163px; height: 14px;
			}
			#statsshow {
				background: url('images/content/statsshow.gif') no-repeat; 
				width: 133px; height: 13px;
			}


	#footer {
		color: #8e8e8e;
		font: 11px "Lucida Grande", Arial, sans-serif;
		text-transform: uppercase;
		padding: 20px;
		line-height: 18px;
	}

        #footer a {
			text-decoration: underline;
			color: #8e8e8e;
		}
		#footer a:hover {
			text-decoration: none;
			color: #8e8e8e;
		}

		#footer span {
			color: #404040;
		}
		#footer span a {
			text-decoration: underline;
			color: #404040;
		}
		#footer span a:hover {
			text-decoration: none;
			color: #404040;
		}
	/* Site Show Page */
	#large_site, #comments-area {
		width: 664px;
		margin: 0 auto;
	}
		#preview {
			width: 664px; height: 194px;
		}
			#preview a img {
				border: 1px solid #2e4100;
			}
		#site_name {
			width: 644px;
			background: #3b5400;
			border-top: 2px solid #2e4100;
			border-bottom: 1px solid #304400;
			padding: 5px 5px 5px 15px;
		}
			#site_name h2 {
				background: url('images/content/arrow_large.gif') no-repeat left center;
				font: bold 12px "Lucida Grande", Arial, sans-serif;
				color: #fff;
				padding: 5px 0 5px 20px;
				text-shadow: #193600 2px 2px 0;
			}
			#site_name ul {
				margin: 3px 3px 0 0;
			}
	#comments-area {
		padding: 15px 0;
	}
		#commentsarea {
			width: 420px;
			float: left;
			padding: 0 14px 0 0;
		}
			#commentsarea h2 {
				font: bold 16px "Lucida Grande", Arial, sans-serif;
				color: #fff;
				padding: 6px 18px 0 18px;
			}
				#commentsarea h2 a {
					text-decoration: underline;
					color: #fff;
					float: right;
					text-transform: uppercase;
					font-size: 11px;
					margin: 4px 0 0;
				}
				#commentsarea h2 a:hover {
					text-decoration: none;
					color: #fff;
					float: right;
					text-transform: uppercase;
					font-size: 11px;
				}
		#postinfo {
			width: 230px;
			float: left;
		}
			#postinfo h2 {
				background: #304400;
				border-bottom: 1px solid #2a3b00;
				font: bold 12px "Lucida Grande", Arial, sans-serif;
				color: #fff;
				padding: 10px;
			}
			#siteinfo {
				background: #456200;
				padding: 10px;
				color: #b1ff00;
			}
				#siteinfo strong {
					color: #fff;
				}

		.dark .content p, .light .content p {
			color: #fff;
			font-size: 12px;
			padding: 5px 0 0;
		}
		.dark .content span, .light .content span {
			color: #71a100;
		}
			.dark .content span a, .light .content span a {
				text-decoration: underline;
				font-style: italic;
				color: #b1ff00;
			}
			.dark .content span a:hover, .light .content span a:hover {
				text-decoration: none;
				font-style: italic;
				color: #b1ff00;
			}
		.dark {
			background: #3b5400;
			margin: 15px 0 0;
		}
			.dark .top {
				background: url('images/content/dark_top.gif') no-repeat; 
				width: 420px; height: 5px;
				font-size: .1em;
			}
			.dark .content {
				background: url('images/content/dark_middle.gif') repeat-y; 
				width: 390px;
				padding: 10px 15px;
			}
			.dark .bottom {
				background: url('images/content/dark_bottom.gif') no-repeat; 
				width: 420px; height: 5px;
				font-size: .1em;
			}
		.light {
			background: #435f01;
			margin: 15px 0 0;
		}
			.light .top {
				background: url('images/content/light_top.gif') no-repeat; 
				width: 420px; height: 5px;
				font-size: .1em;
			}
			.light .content {
				background: url('images/content/light_middle.gif') repeat-y; 
				width: 390px;
				padding: 10px 15px;
			}
			.light .bottom {
				background: url('images/content/light_bottom.gif') no-repeat; 
				width: 420px; height: 5px;
				font-size: .1em;
			}
	.entry {
		padding: 0 30px;
		color: #fff;
	}
		.entry p {
			padding: 10px 0;
		}

                .entry ul {
				padding: 10px 0;
			}
			.entry li {
				background: url('images/content/arrow.gif') no-repeat left center;
				padding: 2px 0 3px 13px; 
			}
				.entry li a {
					text-decoration: underline;
					color: #fff;
				}
				.entry li a:hover {
					text-decoration: none;
					color: #fff;
				}


	#respond {
		margin: 10px 0;
	}
	#commentform p {
		padding: 3px 0;
		color: #fff;
	}
		#commentform p a {
			text-decoration: underline;
			color: #fff;
			font-weight: bold;
		}
		#commentform p a:hover {
			text-decoration: none;
			color: #fff;
			font-weight: bold;
		}
		#commentform label {
			color: #fff;
		}
		#email, #author, #url, #commentform textarea {
			border: 0;
			padding: 1px;
			color: #fff;
			background: #1c1c1c;
			border-top: 1px solid #111;
			border-left: 1px solid #111;
			border-right: 1px solid #5e810d;
			border-bottom: 1px solid #5e810d;
		}

                .comment_button {
				font-size: 12px;
				color: #3B5400;
				padding: 4px;
				background-color: #fff;
				border: solid 2px #577B05;
				}

                .top_search_button {
                                font-size: 12px;
				color: #B1B1B1;
				padding: 4px;
				background-color: #1C1C1C;
				border: solid 2px #242424;
                                margin: 5px;
				}


/* Rating */

.ratingblock {
	float: right;
	}

.loading {
	height: 19px;
	background: url('images/working.gif') 50% 50% no-repeat;
	}
	
.unit-rating { /* the UL */
	list-style:none;
	margin: 0px;
	padding:0px;
	height: 19px;
	position: relative;
	background: url('images/starrating.gif') top left repeat-x;		
	}

.unit-rating li{
    text-indent: -90000px;
	padding:0px;
	margin:0px;
	/*\*/
	float: left;
	/* */
	}
	
.unit-rating li a {
	outline: none;
	display:block;
	width: 19px;
	height: 19px;
	text-decoration: none;
	text-indent: -9000px;
	z-index: 20;
	position: absolute;
	padding: 0px;
	}
	
.unit-rating li a:hover{
	background: url('images/starrating.gif') left center;
	z-index: 2;
	left: 0px;
	}

.unit-rating a.r1-unit{left: 0px;}
.unit-rating a.r1-unit:hover{width:19px;}
.unit-rating a.r2-unit{left:19px;}
.unit-rating a.r2-unit:hover{width: 38px;}
.unit-rating a.r3-unit{left: 38px;}
.unit-rating a.r3-unit:hover{width: 57px;}
.unit-rating a.r4-unit{left: 57px;}	
.unit-rating a.r4-unit:hover{width: 76px;}
.unit-rating a.r5-unit{left: 76px;}
.unit-rating a.r5-unit:hover{width: 95px;}
.unit-rating a.r6-unit{left: 95px;}
.unit-rating a.r6-unit:hover{width: 74px;}
.unit-rating a.r7-unit{left: 180px;}
.unit-rating a.r7-unit:hover{width: 210px;}
.unit-rating a.r8-unit{left: 210px;}
.unit-rating a.r8-unit:hover{width: 240px;}
.unit-rating a.r9-unit{left: 240px;}
.unit-rating a.r9-unit:hover{width: 270px;}
.unit-rating a.r10-unit{left: 270px;}
.unit-rating a.r10-unit:hover{width: 300px;}

.unit-rating li.current-rating {
	background: url('images/starrating.gif') left bottom;
	position: absolute;
	height: 19px;
	display: block;
	text-indent: -9000px;
	z-index: 1;
	}

.voted {color:#999;}
.thanks {color:#36AA3D;}
.static {color:#5D3126;}

.navigation {
    clear: both;
    padding: 5px;
}

.alignleft {
float: left;
}

.alignright {
float: right;
}
#searchsubmit{
line-height: 18px;
height: 26px;
padding: 0 4px;
}

#login ul {margin:0;padding:0;}
#login ul li {display:inline;margin-left:10px;}

#topbar {
	text-align: center;
	margin: 0;
	background: #151515;
        border-top: 2px solid #151515;
	border-bottom: 2px solid #404040;
	color: #8E8E8E;
	padding: 7px;
        letter-spacing: 1px;
	font-size: 12px; 
	font-family: Arial, Tahoma, 'Trebuchet MS', Verdana, 'Times New Roman';
}

#topbar a {
	color: #8E8E8E;
	text-decoration: underline;
}

#topbar a:hover {
	color: #8E8E8E;
	text-decoration: none;
}

.cloud {
width: 230px;
float: left;
text-transform: lowercase;
}

.left {
float: left;
}

.right {
float: right;
}