@import url('reset.css');
@import url('typography.css');
@import url('grid.css');
@import url('menus.css');

body, html {
	background-color: #F9F9F9;
}

a:focus {
	outline: none;
}

a {
color: #666;
}

a:hover {
	color: #333;
}

#logo_home {
	background-image: url(images/butter-logo_s1.jpg);
	background-repeat: no-repeat;
	background-position: bottom left;
	width: 127px;
	height: 120px;
	text-indent: -9999px;
	display: block;
	float: right;
}

#logo_home_2 {
	background-image: url(images/welcome_s1.jpg);
	background-repeat: no-repeat;
	background-position: bottom left;
	width: 679px;
	height: 150px;
	text-indent: -9999px;
	display: block;
}

#main {
}

#left_column {
	background: #ffffff url(images/shadow_s1.jpg) top right repeat-y;
	padding-bottom: 40px;
}

/* Navigation */ 

#navigator li {
	list-style-type: none;
}

#navigator li h2 {
	margin: 0px;
}

#navigator li h2 a {
	background-repeat: no-repeat;
	display: block;
	height: 40px;
	width: 147px;
	background-position: top right;
	text-indent: -9999px;
}

#navigator li h2 a:hover {
	background-repeat: no-repeat;
	display: block;
	height: 40px;
	width: 147px;
	background-position: top left;
	text-indent: -9999px;
}

#home h2 a {
	background-image: url(images/home-menu.png);
}

#archives h2 a {
	background-image: url(images/archives-menu.png);
}

#tags h2 a {
	background-image: url(images/tags-menu.png);
}


#search-results h2 a {
	background-image: url(images/search-menu.png);
}

#about h2 a {
	background-image: url(images/about-menu.png);
}

#we-follow h2 a {
	background-image: url(images/we-follow-menu.png);
}

#contact h2 a {
	background-image: url(images/contact-menu.png);
}

#navigator, #blog_listing  {
	padding-top: 10px;
}

.mega div {
	display: none;
}



/* Blog Listing for Home, Archives */ 

#blog_listing {
	float: right;
	position: relative;
	z-index: 10;
}

#right_column {
	position: relative;
	z-index: 1;
}


#blog_listing hr {
	margin: 3em 0;
}

.readmore {
	background-image: url(images/read-more.png);
	background-repeat: no-repeat;
	background-position: top left;
	width: 66px;
	height: 19px;
	text-indent: -9999px;
	display: block;
	margin-bottom: 1em;
	float: right;
}

.date {
margin-top: 1em;
margin-bottom: 2em;
line-height: 18px;
text-align: right;
}

/* Results Listing for Tags, Search */ 

.results .date {
margin-top: 4px;
margin-bottom: 2em;
line-height: 18px;
text-align: right;
}


/* Breadcrumbs */ 

#breadcrumbs {
padding-top: 20px;
margin-bottom: 10px;
height: 20px;
}

#breadcrumbs a:hover {
color: #333
}

.B_crumbBox a {
	color:#999999;
	text-decoration: none;
	font-size: 11px;
	font-family: Arial;

}


.B_lastCrumb a {
	color:#333333;

}

#breadcrumbs span.rss {
	float:right; 
	margin-right:180px;
}

/* Main content */

.main_content {
margin-top: 1em;
margin-bottom: 1em;
}



/* Full Blog Posts */ 

.blog_post img {
	width:70%;
	height:70%;
}




/* Team member page */ 
.author_grid {
float: right;
margin-bottom: 2em;
line-height: 0.8em;
}

.team_member {
clear: both;
}

.team_member h3 {
margin-top: 80px;
}
#author_profile_pic_med {
	float: left;
	margin: 0px 20px 0 0;
}



/* Author profile pic */ 

#author_profile_pic {
	float: left;
	margin: 0px 20px 10px 0;
}



.really {
	display: none;
}

.buttery {
display: block;
}

a:hover .really {
	display: block;
}

a:hover .buttery {
	display: none;
}


.author_bio {
	float: left;
}



#authored_pages {
margin-top: 2em;
}

/* Pagination */

.pagination{
	float:right;
}


.pagination li{
	float:left;
	margin-right: 15px;
	list-style-type: none;
	font-size: 0.9em;	
}


#pagination_bottom a {
	color:#999999;
	text-decoration:none;
}



.demo_link {
	background: url(images/view_demo_s1.jpg) top left no-repeat;
	display: block;
	height: 19px;
	width: 67px;
	float: left;
	text-indent: -9999px;
	margin-top: 10px;
}

.demo_link:hover {
	background: url(images/view_demo_s1.jpg) top left no-repeat;
}





.review {
	background: url(images/box_s1.jpg) top left no-repeat;
	display: block;
	height: 12px;
	width: 100px;
	float: left;
	text-indent: 20px;
	margin-top: 10px;
}




/* Right sidebar tabs */ 

#who_we_are,#recent_comment,#most_read,#most_commented,#live_demo,#related_post {
	float:left;
	display: block;
	height: 16px;
	width: 121px;
	float: left;
	text-indent: -9999px;
	margin-bottom: 3px;
}

#recent_comment {
	background: url(images/recent-comments.png) top left no-repeat;
}

#most_read {
	background: url(images/most-read.png) top left no-repeat;

}

#who_we_are {
	background: url(images/who-we-are.png) top left no-repeat;
}

#most_commented {
	background: url(images/most-commented.png) top left no-repeat;
}

#related_post {
	background: url(images/related-posts.png) top left no-repeat;
}

.sidebox_inner hr,.sidebox_tabpane hr {
	background-color:#FDDB00;

}

.sidebox_inner hr,.sidebox_tabpane hr {
	margin-bottom: 0px;
}



.open_close_arrow {
	background: url(images/about_us_arrow_s1.jpg) top left no-repeat;
	display: block;
	height: 13px;
	width: 15px;
	float: right;
	text-indent: -9999px;
	margin-left: 20px;
}

.closed {
	background: url(images/about_us_arrow_s2.jpg) top left no-repeat;
}

.show_hide {
	width: 175px !important;
	padding-top: 15px;
}

.show_hide_comment {
	width: 450px !important;
	padding-top: 15px;
	display:none;
}



#view_our_site {
	background: url(images/view-our-site.png) top center no-repeat;
	display: block;
	height: 19px;
	width: 100%;
	float: left;
	text-indent: -9999px;
	margin-left: 10px;
	padding-bottom: 5px;

}


#right_column_bottom {
	background: url(images/who_we_are_bottom_s1.jpg) top left no-repeat;
	display: block;
	height: 8px;
	width: 208px;
	float: left;
	text-indent: -9999px;
	margin-bottom: 20px;

}



#widget_most_read a {
	color:#999999;
	text-decoration: none;
}





#block_title {
float:left;

}


#interactive_block_button {
	background: url(images/interactive_block_button_s1.jpg) top left no-repeat;
	display: block;
	height: 30px;
	width: 172px;
	float: right;
	text-indent: 7px;
	color:#999999;
	text-decoration: none;
	font-size: 10px;

}

#submit_revision {
	background: url(images/submit_revision_s1.jpg) top left no-repeat;
	display: block;
	height: 18px;
	width: 105px;
	float: left;
	text-indent: -9999px;
	margin-left: 295px;



}


#view_demo {

	float:right;
	margin-top: 0px;

}



#code_block {
	background-color: white;
	border-color: grey;
	border: 1px solid;
	display: block;
	height: 255px;
	width: 400px;
	margin-bottom: 10px;
	


}


#revision_block {
	background-color: white;
	border-color: grey;
	border: 1px solid;
	display: block;
	height: 175px;
	width: 400px;
	margin-bottom: 10px;
	margin-top: 10px;
	
}



.crumb_separator {
	background: url(images/crumb_separator_s1.jpg) top left no-repeat;
	display: block;
	height: 10px;
	width: 150px;
	float: left;
	text-indent: 20px;
	padding-bottom: 8px;
}


#get_the_code {
	background: url(images/get_the_code_s1.jpg) top left no-repeat;
	display: block;
	height: 19px;
	width: 93px;
	float: left;
	text-indent: -9999px;
	margin-top: 10px;
	padding-bottom: 5px;
}


#live_demo_content li{
	color:#999999;
	list-style-type: none;
	text-decoration: none;

}

#live_demo_content a{
	color:#999999;
	text-decoration: none;

}


#comment_form {
	padding-top: 10px;

}

#comment_thread {
	padding-top: 50px;

}

#right_column li {
	list-style-type: none;
	background: url(images/yellow-arrow.png) 0 2px no-repeat;
	padding: 0 0 6px 14px;
}

#right_column li a {
	display: block;
}

pre {
	background: #eee;
	overflow: hidden;
}

#footer {

}

#butter_icon {
background:url("images/butter_icon.png") no-repeat scroll left top transparent;
display:block;
float:right;
height:28px;
margin:10px 0;
text-indent:-9999px;
width:60px;
}

#butter_icon:hover {
background:url("images/butter_icon.png") no-repeat scroll left bottom transparent;
}

#modx_icon {
background:url("images/modx_icon.png") no-repeat scroll left top transparent;
display:block;
float:right;
height:26px;
margin:10px 0;
text-indent:-9999px;
width:100px;
}

#modx_icon:hover {
background:url("images/modx_icon.png") no-repeat scroll left bottom transparent;
}

#right_column li.quip-latest-comment {
background: none;
padding:0 0 15px 0;
}

#right_column li.quip-latest-comment a {
display: inline;
color: #666;
}

#right_column li.quip-latest-comment a:hover {
color: #333;
}

.quip-avatar {
float: left;
margin: 0 8px 2px 0}

.captionedImage img {
	padding: 5px;
	border-top: 1px solid #eee;
}

#blog_listing .gal-item {
	float: left;
	border: none;
	margin: 1px;
}

.gal-item-0 {
	clear: both;
}

		a.toc-top-link {
			padding: 4px;
			background: #eee;
			float: right;
			font-size: 10px;
			text-align: center;
			clear: both;
		}
		
		#toc {
			padding-left: 30px;
		}
		#toc ol { list-style: upper-alpha;}
		#toc ol ol { list-style: decimal;}
		#toc ol ol ol { list-style: lower-roman;}
		#toc ol ol ol ol { list-style: lower-alpha;}