#content h4.calendar
{
/* Props go to webdesignerwall.com & preloaded.com */
background: url(/files/images/template/calendar_bg.png) no-repeat right center;
color: #fff;
float: left;
height: 75px;
width: 62px;
margin: 0px 5px 0px -93px;
padding: 0px 10px;
}

#content h4.calendar span
{
display: block;
margin-left: 8px;
text-shadow: #8f7b67 -1px -1px 0px;
width: 41px;
}

.month { margin-top: 10px; }

#content h4
{
font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size: 1.3em;
}

.code { max-width: 590px; }

.post-tags { margin-top: 1.75em; }

#social
{
background: #fafcf6;
border: 1px solid #e3ebcb;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
color: #999;
margin: 3em 0em;
padding: 15px 20px;
/*-moz-box-shadow: 3px 3px 10px #ccc;
-webkit-box-shadow: 3px 3px 10px #ccc;
box-shadow: 3px 3px 10px #ccc;*/
}

#social legend
{
font-size: 1.4em;
font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
margin: 0px;
padding: 4px 8px 0px 8px;
}

#social ul
{
overflow: hidden;
margin: 0px 0px 0px 8px;
padding: 0px;
}

	#social li
	{
	float: left;
	list-style-type: none;
	line-height: 16px;
	height: 16px;
	padding-right: 20px;
	}

		.digg, .delicious, .stumbleupon, .dzone, .snipplr, .twitter, .scriptstyle
		{
		background-image: url(/files/images/icons/social_sprite.png);
		background-repeat: no-repeat;
		padding-left: 20px;
		line-height: 16px;
		}

		.digg { background-position: left 0px; }
		.delicious { background-position: left -16px; }
		.stumbleupon { background-position: left -32px; }
		.dzone { background-position: left -48px; }
		.snipplr { background-position: left -64px; }
		.twitter { background-position: left -80px; }
		.scriptstyle { background-position: left -96px; }

		#social .ajax-loading, .ajax-loading
		{
		display: inline;
		float: none;
		margin-top: 0px;
		padding-right: 0px;
		vertical-align: baseline;
		}

#post-extra
{
float: right;
padding: 0px 0px 0px 5%;
width: 25%;
}

#recent
{
list-style-type: none;
margin: 0px;
padding: 0px;
}

	#recent li { margin: 0em 0em 1.75em 0em; }

#rss
{
height: 50px;
position: relative;
}

#content #rss a
{
background: url(/files/images/icons/rss-medium.png) no-repeat left center;
border-bottom-width: 0px;
color: #db5e2a;
display: block;
font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size: 1.7em;
height: 30px;
width: 213px;
position: absolute;
top: 0px;
left: 0px;
text-indent: 38px;
}

	#content #rss a:hover { color: #333; }

	#subscribers
	{
	color: #aaa;
	font-size: 1.5em;
	font-family: Georgia, "Times New Roman", Times, serif;
	position: absolute;
	top: 25px;
	right: 11px;
	}

#me-twitter
{
margin-bottom: 2em;
opacity: .8;
position: relative;
}

#me-twitter:hover { opacity: 1.0; }

	#twitter-followers
	{
	color: #aaa;
	font-size: 1.5em;
	font-family: Georgia, "Times New Roman", Times, serif;
	position: absolute;
	bottom: -30px;
	right: 10px;
	}

.tech-post { margin: 1em 0em; }

.tech-post .hr { width: 570px; clear: none; }

#content .comment .user
{
max-width: 100px;
width: 20%;
}

#content .comment .post { width: 715px; } /* 715px */

a.readmore { width: 605px; }

.frame { margin: 25px 0px; }

.image-caption, #content img { *max-width: 560px; }

/****************************************************************
 Small Screen Layout
****************************************************************/

@media (max-width: 900px) {

#content h2,
#content h3,
#content h4
{ text-align: left }

#post-extra,
#content h4.calendar
{ display: none; }

#content .code { width: 590px; }

#content .comment .user
{
margin-right: 3%;
width: 20%;
}

#content .comment .user img { max-width: 100%; }

#content .comment .post { width: 77%; }

}

@media (max-width: 650px) {

#social li
{
background: none;
float: none;
height: auto;
line-height: 2em;
padding-left: 0px;
}

#content .code { width: 97%; }

#content .article-teaser-container
{
padding: 3%;
width: 93%;
max-width: 93%;
}

#content .article-teaser-overflow,
#content .article-teaser-container img
{
width: 100%;
max-width: 100%;
}

#content a.readmore { width: 99%; }

}

@media (max-width: 630px) {

#content .image-caption img { max-width: 96%; }

#content .image-caption
{
width: 90%;
max-width: 90%;
padding: 5%;
}

}

@media (max-width: 480px) { }
@media (max-width: 320px) { }