/** Typography and editor CSS - Baldwins (sean@silverstripe.com) **/

/**
 * This file is used for the typography on the site
 * as well as the WYSIWYG editor for SilverStripe
 */

/* Global resets */
.typography * {
	font-family: Verdana, Arial, sans-serif;
	font-size: 11px;
}

/* Inline elements don't inherit the font-size attribute as a block
   element would, so we give it 100% to take the parent font size */
.typography a,
.typography strong,
.typography em,
.typography span {
	font-size: 100%;
}

/* Various styling */
.typography blockquote {
	padding: 5px;
	padding-left: 20px;
	margin-left: 0;
	margin-bottom: 20px;
}
	.typography blockquote * {
		margin-bottom: 0 !important;
	}
	.typography pre {	
		font-family: "Courier New", Courier, monospace;
		padding: 10px;
		margin: 20px 0;
}
.typography hr {
	margin: 10px 0;
}
	/* Paragraph and list items style */
	.typography p,
	.typography ul li,
	.typography ol li {
		line-height: 2;
	}
	.typography p {
		font-size: 11px;
		color: #363b3c;
	}
		.typography p,
		.typography .vcard {
			margin-bottom: 16px;
		}
		/* Lists specific styling */
		.typography ul,
		.typography ol {
			margin-left: 12px;
			margin-bottom: 18px;
		}
			.typography li {
				margin: 10px 0 0 0;
				line-height: 1.4;
				list-style-position: inside;
				padding: 0 0 4px 8px;
				color: #626262;
			}
				.typography ul li {
					list-style-type: disc;
				}
				.typography ol li {
					list-style-type: decimal;
				}

/* Comments styles */
#PageComments li {
	list-style-type: none;
	background: #eee;
	padding: 10px 0 0 10px;
}
	#PageComments .info {
		padding-bottom: 10px;
		color: #666;
	}
		#PageComments .info * {
			font-size: 11px;
		}
			#PageComments .info a {
				font-size: inherit;
			}
  
/* Header styles */
.typography h1,
.typography h2,
.typography h3,
.typography h4,
.typography h5,
.typography h6 {
	margin-bottom: 10px;
	color: #000;
	font-weight: normal;
}
	.typography h1 {
		font-size: 24px;
	}
	.typography h2 {
		font-size: 20px;
		color: #000;
	}
	.typography h3 {
		font-size: 16px;
		color: #A68622;
		display: block;
	}
	.typography h4 {
		font-size: 14px;
		color: #000;
		font-weight: bold;
	}

/* Table styling */  
.typography table tr td {
	padding: 3px 5px;
}

/* Override to get the tab strip div showing fields properly */
.tab div.field {
	width: auto;
}
  
/* Alignment styles */
.typography .left {
	text-align: left;
}
.typography .center {
	text-align: center;
}
.typography .right {
	text-align: right;
}
.typography img.right {
	float: right;
}
.typography img.left {
	float: left;
}