/**
 * 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, Helvetica, sans-serif;
	font-size: 10pt;
	text-align: justify;
}
.typography.small * {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
}
.typeography li {
	padding: 1em;	
}

/* 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%;
}
	.typography strong {
		font-weight: bolder;
	}
	.typography a {
		text-decoration: underline;
	}

/* 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;
}

/* Generic styling across multiple typography elements */
.typography address,
.typography p,
.typography ul li,
.typography ol li {
	color: #000018;
}
	/* Paragraph and list items style */
	.typography p,
	.typography ul li,
	.typography ol li {
		line-height: 1.3;
	}
		.typography p {
			margin-bottom: 10px;
		}
		/* Lists specific styling */
		.typography ul,
		.typography ol {
			margin-bottom: 20px;
		}
			.typography ul li,
			.typography ol li {
				margin: 4px 10px;
				line-height: 1.4;
				list-style-position: outside;
			}
				.typography ul li {
					list-style-type: disc;
					padding-left: 3px;
					margin-left: 12px;
				}
				.typography ol li {
					list-style-type: decimal;
					padding-left: 10px;
					margin-left: 33px;
				}

/* Comments styles */
#PageComments li {
	list-style-type: none;
	padding: 10px 0 0 10px;
}
	#PageComments p {
		color: #5D5D5D;
	}
	#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: #000018;
	font-weight: normal;
}
	.typography h1 {
		font-size: 12pt;
		font-weight: bold;
	}
	.typography h2 {
		font-size: 22px;
	}
	.typography h3 {
		font-size: 16px;
	}
	.typography h4 {
		font-size: 14px;
		padding-bottom: 5px;
		border-bottom: 1px solid #666;
	}

/* 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;
	margin-left: 5px;
}
.typography img.left {
	float: left;
	margin-right: 5px;
}