
/* 	Chirrup default CSS 

		Colours:
		CYAN: 						#1793C2;
		MAGENTA: 					#EC008C;
		GREEN: 						#5AC000;
		YELLOW:						#F3EEDB;
		BROWN:						#BAAF86;
		RED:							#D70005;
		RED (faded):			#fce7e7;

*/

/* The root wrapper */
.chirrup_root {
	font-size: 1em;
	color: #333;
}

	/* ------------------------------------------------------------------------------------------------ */
	/* Basic block styles for major wrapping elements */
	/* ------------------------------------------------------------------------------------------------ */
	
	.chirrup_root p {
		margin: 0; 
		padding: 0;
	}
	/* 	Rather than being strict about whether or not you want elements to appear, we use the chirrup_active
			and chirrup_inactive classes around blocks that are, by default, hidden (e.g. by default the form is 
			hidden until you switch to posting mode) */
	.chirrup_active {
	}
	.chirrup_inactive {
		display: none;
	}
	li.chirrup_inactive {
		display: block;
	}
	
	/* ------------------------------------------------------------------------------------------------ */
	/* Now for the individual blocks themselves, as we want to style them */
	/* ------------------------------------------------------------------------------------------------ */
	
	/* The loading block */
	p.chirrup_loading {
		padding: 5px 5px 5px 20px;
		background: url('../img/spinner_blue.gif') no-repeat center left;
	}
	
	/* The navigation block */
	.chirrup_navigation {
		margin: 0;
		padding: 0;
		list-style-type: none;
		clear: both;
	}
		.chirrup_navigation li {
			float: left;
			width: 50%;
			text-align: center;
			padding: 0.5em 0;
			background: white;
		}
			.chirrup_navigation li.chirrup_active {
				background: #F3EEDB;
			}
			.chirrup_navigation li.chirrup_comments {
				width: 40%;
			}
			.chirrup_navigation li.chirrup_form {
				width: 60%;
			}
		.chirrup_navigation li a {
			display: block;
			color: #EC008C;
			width: 100%;
			text-decoration: underline;
			font-size: 1em;
		}
			.chirrup_navigation li.chirrup_active a {
				color: #333;
				text-decoration: none;
			}
		
	/* The comment list */
	ol.chirrup_comments {
		list-style-type: none;
		margin: 0;
		padding: 1em 0;
		clear: both;
		background: #F3EEDB;
	}
		ol.chirrup_comments li {
			margin: 0 1em;
			padding-bottom: 1em;
			border-bottom: 1px solid #BAAF86;
		}
			
			ol.chirrup_comments li.chirrup_notification_success, ol.chirrup_comments li.chirrup_no_comments {
				padding: 0.5em 1em;
				color: white;
				border: 0px;
				-webkit-border-radius: 5px;
				background: #333;
			}
			ol.chirrup_comments li.chirrup_no_comments {
			}
		ol.chirrup_comments li.last {
			border: 0;
		}
		ol.chirrup_comments li.alternate_row {
			color: #666;
		}
	.chirrup_avatar_link {
		display: block;
		padding: 0.1em;
		width: 48px;
		height: 48px;
		background: white;
		float: left;
		border: 1px solid #BAAF86;
	}
	.chirrup_avatar {
		width: 48px;
		height: 48px;
		overflow: hidden;
		margin: 0; padding: 0;
		border: 0;
	}
	.chirrup_status blockquote {
		display: block;
		padding: 0;
		padding-top: 0.2em;
		margin-left: 60px;
		margin-bottom: 0.3em;
		border-width: 0;
	}
	.chirrup_status blockquote p {
		font-size: 1.2em;
		line-height: 1.3em;
	}
	.chirrup_status cite {
		display: block;
		font-size: 0.8em;
		margin: 0; padding: 0;
	}
	
	
	/* The posting form */
	form.chirrup_form {
		clear: both;
		margin: 0;
	}
		.chirrup_form fieldset {
			border: 0;
			margin: 0; padding: 1em;
			background: #F3EEDB;
		}
		.chirrup_form legend {
			display: none;
		}
		.chirrup_form dl {
	
		}
			.chirrup_form dt {
				float: left;
				clear: left;
				width: 33%;
				height: 3em;
			}
				.chirrup_form dt label {
					font-size: 1.1em;
					position: relative;
					top: 0.5em;
				}
			.chirrup_form dd {
				float: left;
				clear: right;
				width: 65%;
				padding: 0; margin: 0;
				min-height: 2em;
			}
			.chirrup_meta_label {
				display: none;
			}
			.chirrup_form dd.chirrup_post_explanation_def {
				margin-bottom: 1em;
			}
				dd.chirrup_post_explanation_def p.chirrup_security_note {
					font-size: 0.8em;
					line-height: 1.4em;
					color: #BAAF86;
					padding: 0;
					margin: 0;
				}
				
				/* The post preview */
				dd.chirrup_post_explanation_def .chirrup_preview {
					padding-top: 0.5em;
				}
				.chirrup_preview_body {
					font-family: monospace;
					font-size: 1.1em;
					color: #666;
				}
				/* The character counter */
				dd.chirrup_post_explanation_def p.chirrup_charcounter {
				}
				p.chirrup_charcounter span {
					font-size: 2em;
					position: relative;
					top: 0.2em;
					color: #5AC000;
				}
				p.chirrup_charcounter span.chirrup_no_chars_remain {
					color: #D70005;
				}
			.chirrup_form dd.chirrup_comment_field_wrapper {
				height: 5em;
				min-width: 260px;
			}
			.chirrup_form dl input, .chirrup_form dl textarea {
				border: 1px solid #BAAF86;
				padding: 0.2em;
				font-size: 1.3em;
			}
			
			/* validation */
			.chirrup_validation_error {
				display: inline;
				padding: 0.1em 0.3em;
				background: #D70005;
				color: white;
			}
			.chirrup_form dl input.chirrup_errors, .chirrup_form dl textarea.chirrup_errors {
				border-color: #D70005;
				background: #fce7e7;
			}
				.chirrup_form dl textarea.unaltered {
					color: #999;
				}
				.chirrup_form dl textarea.altered {
					color: #333;
				}
			.chirrup_form dl input {
				width: 100%;
			}
			.chirrup_form dl textarea {
				font-size: 1em;
				width: 101%;
				height: 5em;
			}
		.chirrup_form fieldset.submit {
			clear: both;
		}
		.chirrup_form fieldset.submit input {
			clear: both;
			float: right;
			font-size: 1.5em;
		}
		
	/* The attribution block */
	.chirrup_root p.chirrup_attribution {
		height: 17px;
		padding: 7px 10px;
		border-bottom: 3px solid #539925;
		text-align: right;
		font-size: 0.8em;
		background: white url('/img/chirrup_footer_background.png') no-repeat bottom left;
		color: #4b8c20;
		
	}
	

	
/* I leave these overrides in to make my own life easier when using CSSedit. Yes, that makes me a bad person. */

/* @override 
	http://lamp.dev/?css
	http://chirrup.singlecell.angryamoeba.co.uk/?css
*/
