/* Page DNA */

body {padding:0; margin:0; font:1em/1.4 Cambria, Georgia, sans-serif; color:#333; background:#fff;}

a:link,
 a:visited {border-bottom:1px solid #ff9000; color:#ff9000; text-decoration:none;}
a:visited {border-bottom:1px solid #730800; color:#730800;}

a:hover,
 a:focus,
 a:active {border:0; color:#fff; background:#ff9000;}

a:visited:hover,
 a:visited:focus,
 a:visited:active {color:#fff; background:#730800;}

#container {width:500px; padding:0 0 50px; margin:0 auto;}

h1 {margin:1em 0 0; font-size:2.5em; font-weight:normal; line-height:1.2; text-align:center;}
h2 {margin:0.5em 0 1.5em; font-size:1.25em; font-weight:normal; font-style:italic; text-align:center;}
p {margin:1em 0;}

.content h2 {margin:2em 0 0.75em; font-size:2em; font-weight:bold; font-style:normal; text-align:left;}
blockquote {margin:1em 0;}
blockquote p {margin:0; font-size:2em;}

.follow {clear:both; margin-top:2em; font-size:1.125em;}
.follow span {font-weight:bold;}

/* Comment Bubble */

.oval-speech {
	position:relative;
	width:270px;
	padding:50px 40px;
	margin:1em auto 50px;
	text-align:center;
	color:#fff; 
	background:#BB0302;

	/* css3 */
	/* background:#5a8f00; */
	/*
	NOTES:
	-webkit-border-radius:220px 120px; // produces oval in safari 4 and chrome 4
	-webkit-border-radius:220px / 120px; // produces oval in chrome 4 (again!) but not supported in safari 4
	Not correct application of the current spec, therefore, using longhand to avoid future problems with webkit corrects this
	*/
	-webkit-border-top-left-radius:220px 120px;
	-webkit-border-top-right-radius:220px 120px;
	-webkit-border-bottom-right-radius:220px 120px;
	-webkit-border-bottom-left-radius:220px 120px;
	-moz-border-radius:220px / 120px;
	border-radius:220px / 120px;
	/* NOTE: webkit gradient implementation is not as per spec */
	background:-webkit-gradient(linear, left top, left bottom, from(#d82929), to(#BB0302));
	background:-moz-linear-gradient(top, #d82929, #BB0302);
	background:-o-linear-gradient(top, #d82929, #BB0302);
	background:linear-gradient(top, #d82929, #BB0302);
}

.oval-speech p {font-size:1.25em;}

/* creates part of the curve */
.oval-speech:before {
	content:"\00a0";
	position:absolute;
	z-index:-1;
	bottom:-30px;
	right:50%;
	width:0;
	height:30px;
	border-right:60px solid #BB0302;
	background:#BB0302; /* need this for webkit - bug in handling of border-radius */

	/* css3 */
	-moz-border-radius-bottomright:80px 50px;
	-webkit-border-bottom-right-radius:80px 50px;
	border-bottom-right-radius:80px 50px;
	/* using translate to avoid undesired appearance in CSS2.1-capabable but CSS3-incapable browsers */
	-moz-transform:translate(0, -2px);
	-webkit-transform:translate(0, -2px);
	-o-transform:translate(0, -2px);
	transform:translate(0, -2px);
}

/* creates part of the curved pointy bit */
.oval-speech:after {
	content:"\00a0";
	position:absolute;
	z-index:-1;
	bottom:-30px;
	right:50%;
	width:60px;
	height:30px;
	background:#fff;

	/* css3 */
	-moz-border-radius-bottomright:40px 50px; 
	-webkit-border-bottom-right-radius:40px 50px; 
	border-bottom-right-radius:40px 50px; 
	/* using translate to avoid undesired appearance in CSS2.1-capabable but CSS3-incapable browsers */
	-moz-transform:translate(-30px, -2px);
	-webkit-transform:translate(-30px, -2px);
	-o-transform:translate(-30px, -2px);
	transform:translate(-30px, -2px);
}