/*
      Created by Keith Donegan of Code-Sucks.com
*/


/* ----------------------------------------------------------- */
/* Reset Styles */
* { padding: 0; margin: 0; }
li { list-style: none; }
img { border: none; }


/* ----------------------------------------------------------- */
/* Clearfix */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html .clearfix {height: 1%;}


/* ----------------------------------------------------------- */
/* General */
body {
	background: url(../images/headerbg2.gif) repeat-x;
	font: 12px Verdana, Arial, Helvetica, sans-serif;
}
#wrapper {
	width: 603px;
	margin: 0 auto;
	padding-bottom: 20px;
}
.clear {
	clear: both;
}
.pinkborder {
	border-top: 1px solid #FFB6B8;
	padding-bottom: 10px;
}
.email {
	background: url(../images/general/email.gif) no-repeat left center;
	padding-left: 15px;
}
.graph {
	background: url(../images/general/graph.gif) no-repeat left center;
	padding-left: 15px;	
}


/* ----------------------------------------------------------- */
/* Headings */
h1, h2, h3, h4, h5, h6, p {
	margin-bottom: 10px;
	font-weight: normal;
}
h1 {
	font: 32px Georgia, "Times New Roman", Times, serif;
}
h2 {
	font-size: 20px;
}
p {
	color: #666666;
	word-spacing: 2px;
}
p.last {
	margin: 0;
}


/* ----------------------------------------------------------- */
/* Links */
a, a:visited, a:hover {
	text-decoration: none;
	color: #CF6D73;
}


/* ----------------------------------------------------------- */
/* Header */
#header {
	height: 99px;
	margin: 0px 0px 0px 0px;
	margin-top: 12px;
	float: left;
	width: 603px;
}
#header h1#logo {
	width: 413px;
	height: 99px;
	float: left;
	margin-bottom: 0px;
}
#header h1#logo a {
	background: url(../images/logo.jpg) no-repeat;
	display: block;
	text-indent: -9999px;
	width: 413px;
	height: 99px;
}
#header h1#logo a:hover {
	background: url(../images/logo.jpg) 0 -99px no-repeat;
	display: block;
	text-indent: -9999px;
	width: 413px;
	height: 99px;
}
#header #searchbox {
	float: right;
	border: 1px solid red;
	margin-top: 10px;
	font-style: italic;
}


/* ----------------------------------------------------------- */
/* Main Nav */
#mainnav {
	height: 31px;
	font: 14px Verdana, Arial, Helvetica, sans-serif;
	float: left;
}
#mainnav ul li {
	display: inline;
	float: left;
	list-style: none;
	height: 31px;
	text-align: center;
	line-height: 31px;
	margin-right: 2px;
}
#mainnav ul li a {
	color: #C03F45;
	text-decoration: none;
}
#mainnav ul li a:hover {
	color: #fff;
}

/* Home */
#mainnav ul li#home {
	width: 65px;
}
#mainnav ul li#home a {
	background: url(../images/mainnav/home.jpg) no-repeat;
	display: block;
	height: 31px;
}
#mainnav ul li#home a:hover {
	background: url(../images/mainnav/home.jpg) 0 -31px no-repeat;
}
#mainnav ul li#homeactive a {
	background: url(../images/mainnav/home.jpg) 0 -31px no-repeat;
	display: block;
	width: 65px;
	color: #fff;
}


/* ----------------------------------------------------------- */
/* CSS Layouts */
#mainnav ul li#css {
	width: 102px;
}
#mainnav ul li#css a {
	background: url(../images/mainnav/csslayouts.jpg) no-repeat;
	display: block;
	height: 31px;
}
#mainnav ul li#css a:hover {
	background: url(../images/mainnav/csslayouts.jpg) 0 -31px no-repeat;
}
#mainnav ul li#cssactive a {
	background: url(../images/mainnav/csslayouts.jpg) 0 -31px no-repeat;
	display: block;
	width: 102px;
	color: #fff;
}


/* ----------------------------------------------------------- */
/* Web Templates */
#mainnav ul li#web {
	width: 133px;
}
#mainnav ul li#web a {
	background: url(../images/mainnav/webtemplates.jpg) no-repeat;
	display: block;
	height: 31px;
}
#mainnav ul li#web a:hover {
	background: url(../images/mainnav/webtemplates.jpg) 0 -31px no-repeat;
}
#mainnav ul li#webactive a {
	background: url(../images/mainnav/webtemplates.jpg) 0 -31px no-repeat;
	display: block;
	width: 133px;
	color: #fff;
}

/* Code Snippets */
#mainnav ul li#code {
	width: 125px;
}
#mainnav ul li#code a {
	background: url(../images/mainnav/codesnippets.jpg) no-repeat;
	display: block;
	height: 31px;
}
#mainnav ul li#code a:hover {
	background: url(../images/mainnav/codesnippets.jpg) 0 -31px no-repeat;
}
#mainnav ul li#codeactive a {
	background: url(../images/mainnav/codesnippets.jpg) 0 -31px no-repeat;
	display: block;
	width: 125px;
	color: #fff;
}

/* Web Directory */
#mainnav ul li#directory, #mainnav ul li#directoryactive {
	width: 170px;
	margin-right: 0;
}
#mainnav ul li#directory a {
	background: url(../images/mainnav/directory.jpg) no-repeat;
	display: block;
	height: 31px;
}
#mainnav ul li#directory a:hover {
	background: url(../images/mainnav/directory.jpg) 0 -31px no-repeat;
}
#mainnav ul li#directoryactive a {
	background: url(../images/mainnav/directory.jpg) 0 -31px no-repeat;
	display: block;
	width: 170px;
	color: #fff;
}


/* ----------------------------------------------------------- */
/* Link Unit */
#linkunit {
	height: 24px;
	padding: 7px 0px 0px 0px;
	margin-bottom: 20px;
	float: left;
}


/* ----------------------------------------------------------- */
/* Left Column */
#leftcolumn {
 	margin: 0px 19px 0px 0px;
 	padding: 5px 10px 5px 0px;
 	float: left;
	border: 1px solid #fff;
	width: 170px;
}
#codecontent {
	clear: both;
}
#faux {
	background: url(../images/general/faux.gif) repeat-y;
	float: left;
	padding-bottom: 20px;
}


/* ----------------------------------------------------------- */
/* Right Column */
#rightcolumn {
 	float: right;
	background: #fff;
 	margin: 0px 0px 0px 0px;
	padding: 0;
 	width: 400px;
 	display: inline;
}
#rightcolumn #breadcrumb {
	color: #CF6D73;
	margin-bottom: 10px;
	text-align: right;
	font-size: 13px;
	font-family: Georgia, "Times New Roman", Times, serif;
}
#rightcolumn #breadcrumb a {
	background: url(../images/general/doublearrow.gif) no-repeat left;
	padding-left: 13px;
}
#rightcolumn #content {
	margin-bottom: 20px;
}
#rightcolumn #contentnomargin {
	margin-bottom: 0px;
}
#rightcolumn #contentcode {
	background: #FFF4CE;
}



/* ----------------------------------------------------------- */
/* Code Snippets Section */
#rightcolumn .codesnippets {
	font-size: 11px;
}
#rightcolumn .codesnippets ul li a {
	display: block;
	color: #000;
	padding: 4px;
	border-bottom: 1px solid #FFD2D3;
}
#rightcolumn .codesnippets ul li.first {
	border-top: 1px solid #FFD2D3;
}
#rightcolumn .codesnippets ul li.odd {
	background: #F8F8F8;
}
#rightcolumn .codesnippets ul li a:hover {
	background: #FFE8E9;
	
}

/* Code Snippets */
.codesnippetsboxing {
	border: 1px solid #FFB6B8;
	padding: 8px;
	margin-bottom: 20px;
}
.codesnippetsboxing h1#snipcss { width: 345px; height: 96px; text-indent: -9999px; }	
.codesnippetsboxing h1#snipcss a {
	background: url(../images/general/snips-css.jpg) no-repeat;
	width: 345px;
	height: 96px;
	display: block;
}
.codesnippetsboxing h1#snipjs { width: 345px; height: 96px; text-indent: -9999px; }	
.codesnippetsboxing h1#snipjs a {
	background: url(../images/general/snips-javascript.jpg) no-repeat;
	width: 345px;
	height: 96px;
	display: block;
}
.codesnippetsboxing h1#snipphp { width: 345px; height: 96px; text-indent: -9999px; }	
.codesnippetsboxing h1#snipphp a {
	background: url(../images/general/snips-php.jpg) no-repeat;
	width: 345px;
	height: 96px;
	display: block;
}


/* Home Links */
.codesnippetsboxing h1#csslayouts { width: 314px; height: 94px; text-indent: -9999px; }	
.codesnippetsboxing h1#csslayouts a {
	background: url(../images/general/csslayoutsboxing.jpg) no-repeat;
	width: 314px;
	height: 94px;
	display: block;
}
.codesnippetsboxing h1#codesnippets { width: 328px; height: 94px; text-indent: -9999px; }	
.codesnippetsboxing h1#codesnippets a {
	background: url(../images/general/codesnippets.jpg) no-repeat;
	width: 328px;
	height: 94px;
	display: block;
}
.codesnippetsboxing h1#websitetemplates { width: 350px; height: 94px; text-indent: -9999px; }	
.codesnippetsboxing h1#websitetemplates a {
	background: url(../images/general/websitetemplates.jpg) no-repeat;
	width: 350px;
	height: 94px;
	display: block;
}
.codesnippetsboxinglast {
	border: 1px solid #FFB6B8;
	padding: 8px;
	margin-bottom: 20px;
}
.codesnippetsboxinglast { margin-bottom: 0; }
.codesnippetsboxinglast h1#websitedirectory { width: 350px; height: 94px; text-indent: -9999px; }	
.codesnippetsboxinglast h1#websitedirectory a {
	background: url(../images/general/websitedirectory.jpg) no-repeat;
	width: 350px;
	height: 94px;
	display: block;
}








/* Code Snippets Index Section */
.codesnippetsbox {
	margin-bottom: 20px;
}
.codesnippetsbox h3 {
	padding-bottom: 0px !important;
	margin-bottom: 0px !important;
}
.codesnippetsbox h3 a {
	color: #CF6D73;
	font: bold 11px arial, sans-serif;
	text-decoration: underline; 
	padding-bottom: 0px !important;
	margin-bottom: 0px !important;
}
.codesnippetsbox p {
	font: normal 11px/14px arial, sans-serif; 
}


/* ----------------------------------------------------------- */
/* Footer */
#footer {
	clear: both;
	border-top: 10px solid #FFF4CE;
	background: #FFB6B8;
}
#footer #footerinner {
	width: 603px;
	margin: 0 auto;
	padding: 20px 0px;
	border: 1px solid red;
}
#footer #footerinner .box1 {
	width: 187px;
	float: left;
	margin: 0px 20px 0px 0px;
}
#footer #footerinner  ul li {
	font-size: 11px;
	margin: 0;
	padding: 0;
	display: block;
}
#footer li.heading {
	color: #BB3E44;
	padding: 1px 0px 5px 5px;
	font-size: 14px !important;
}
#footer #footerinner  ul li a {
	display: block;
	padding: 4px 4px 0px 12px;
	color: #fff;
	background: none;
	background: url(../images/general/bullet-yellow.gif) no-repeat left;
	font-size: 11px;
}
#footer #footerinner  ul li a:hover {
	background: #FFF4CE;
	color: #CF6D73;
}

#footer #footerinner .box2 {
	width: 187px;
	float: left;
	margin: 0px 0px 0px 0px;
}
#footer #footerinner .box2 img {
	float: left;
	padding-right: 10px;
}
#footer #footerinner .box2 p {
	color: #fff;
	font-size: 11px;
}
#footer #footerinner .box2 p.icons {
	margin: 0px 0px 3px 0px;
}
#footer #footerinner .box2 p.icons a {
	color: #fff;
}
#footer #footerinner .box2 p.icons a:hover {
	color: #fff;
	border-bottom: 1px dashed #CF6D73;
}


/* ----------------------------------------------------------- */
/* Copyright Information */
#copyright {
	padding: 20px 0px;
	background: #FFF4CE;
}
#copyright #copyrightinner {
	width: 603px;
	margin: 0 auto;
}
#copyright #copyrightinner p {
	font-size: 10px;
	color: #BB3E44;
}
#copyright #copyrightinner p.last {
	margin: 0;
}


/* ----------------------------------------------------------- */
/* Advertising */
.adyellowbig {
	border: 1px solid #FFB6B8;
	background: #FFF4CE;
	padding: 15px;
	text-align: center;
}
.big-space {
	padding: 0 0 0 400px;
}

.top-ientry-bar {
	margin: 0px 0px 15px 0px;
	padding: 0px;
	width: 100%;
	height: 35px;
	font-size: 12px;
	background-color: #FFF4CE;
}
.top-ientry-bar a {
	margin: 0px;
	padding: 7px 15px 11px 10px;
	float: left;
	color: #C03F45;
	display: block;
	font-weight: bold;
	text-decoration: none;
}
.top-ientry-bar a:hover {
	margin: 0px;
	padding: 7px 15px 11px 10px;
	float: left;
	color: #C03F45;
	display: block;
	font-weight: bold;
	text-decoration: none;
	background-color: #FFB6B8;
}
.top-ientry-bar a img {
	margin: -5px 5px -6px 0px;
	z-index: 2;
}
#ientry-bar-right {
	float: right;
	border-right: none;
}
.ientry-bar-clear {
	clear: both;
}

#sponsoredlinks li a {
	color: #afafaf;
	font-weight: bold;
	size: 20px;
}

#sponsoredlinks li a:hover {
	color: #d2767b;
	text-decoration: underline;
}