/*  DBS CSS Framework
 *	v 1.0 - April, 2011
 *  Copyright(c) 2011 DeepBlueSky Digital | www.deepbluesky.com
 *
 *  This work is licenced under the Creative Commons Attribution-No Derivative Works 3.0 Unported License. 
 *	http://creativecommons.org/licenses/by-nd/3.0/ 
 *
 *--------------------------------------------------------------------------*/
  
/* DOCUMENT INFORMATION
	- Document: 			"Helpers" CSS
	- Description: 			Set of simple classes to implement common CSS patterns
	- Version:  			1.0
	- Author:   			DeepBlueSky
	- Acknowledgements		HTML5 ✰ Boilerplate 
*/


/* ####################################### */
/* ############## CLEARFIX ############### */
/* ####################################### */

.clear {
	clear: both;
}

.clear-l {
	clear: left;
}

.clear-r {
	clear: right;
}

/* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements in most situations.
nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, 
.clearfix:after { 
	content: ""; 
	display: table; 	
}

.clearfix:after { 
	clear: both; 	
}
.clearfix { 
	zoom: 1; 	
}

.offScreen {
	position: absolute;
	left: -9999px;
}



/* ####################################### */
/* ################ LISTS ################ */
/* ####################################### */

.list-reset {
	margin: 0;
	padding: 0;
	list-style: none;
}

.h-list,
.h-list-alt,
.v-list,
.slash-list,
.pipe-list,
.arrow-list {
	margin: 0 0 1.5em 0;
	padding: 0;
	list-style: none;
}

.slash-list:before, 
.slash-list:after,
.pipe-list:before, 
.pipe-list:after,
.arrow-list:before, 
.arrow-list:after {
	content: ""; 
	display: table; 	
}

.slash-list:after,
.pipe-list:after,
.arrow-list:after {
	clear: both; 	
}

.slash-list,
.pipe-list,
.arrow-list {
	zoom: 1; 	
}

/* HORIZONTAL LIST
------------------------------------------------*/

.h-list li {
	float: left;
	margin-right: 1em;
}

.h-list-alt li {
	float: right;
	margin-left: 1em;
}


/* VERTICAL LIST
------------------------------------------------*/

.v-list li {
	margin-bottom: 1em;
}

/* ARROW LIST
------------------------------------------------*/

.arrow-list {
	margin: 0 0 1.5em 0;
	padding: 0;
	list-style: none;
}

.arrow-list li {
	display:block;
	background: url(/r/i/css_framework/graphics/arrow.gif) no-repeat 0 50%;
	padding: 0.2307692307692308em 12px;
}

/* SLASH LIST (such / as / breadcrumbs / nav)
------------------------------------------------*/

.slash-list {
	margin: 0px;
}

.slash-list li {
	float: left;
	margin-right: 0.5em;
}

.slash-list li:after {
	content: '/';
	pointer-events: none;
	margin: 0px 0px 0px 0.3em;
}

.slash-list li:last-child:after {
	content: '';
	margin: 0px;
}

.start-slash li:first-child:before {
	content: '/';
	pointer-events: none;
	margin: 0px 0.3em 0px 0.5em;
}

/* PIP LIST (such | as | footer | links)
------------------------------------------------*/

.pipe-list {
	margin: 0px;
}

.pipe-list li {
	float: left;
	margin-right: 0.5em;
}

.pipe-list li:after {
	content: '|';
	pointer-events: none;
	margin: 0px 0px 0px 0.3em;
}

.pipe-list li:last-child:after {
	content: '';
	margin: 0px;
}

.start-pipe li:first-child:before {
	content: '/';
	pointer-events: none;
	margin: 0px 0.3em 0px 0.5em;
}


/* ####################################### */
/* ############# POSITIONING ############# */
/* ####################################### */

.fr {
	float: right;
}

.fl {
	float: left;
}



/* ####################################### */
/* ############# ALIGNMENT   ############# */
/* ####################################### */

.right {
	text-align: right;
}

.left {
	text-align: left;
}

.centre,
.center {
	text-align: center;
}




/* ####################################### */
/* ############## IMAGERY ################ */
/* ####################################### */

.img-left,
.img-l {
	float: left;
	margin: 0 20px 1.5em 0;
}

.img-right,
.img-r {
	float: right;
	margin: 0 0 1.5em 20px;
}

.img-replace,
.ir {
	display:block;
	text-indent: 100%;
	overflow:hidden;
	background-repeat:no-repeat;
	text-align:left;
	direction:ltr;
	white-space: nowrap;
}




/* ####################################### */
/* ############ MEDAI BLOCK ############## */
/* ####################################### */



.m-block,
.m-block .m-content {
	overflow:hidden;
	*overflow:visible;
	zoom:1;
	
}

.m-block .m-img {	
	float:left;	
	margin-right: 20px;
}

.m-block .m-img-alt {
	float:right;
	margin-left: 20px;	
}

.m-block .m-img img {
	display:block;	
}

/* ####################################### */
/* ########### HIDDEN CONTENT ############ */
/* ####################################### */

/* HIDE: SCREENREADERS & BROWSERS
------------------------------------------------*/

.hidden { /* css-discuss.incutio.com/wiki/Screenreader_Visibility */
	display:none;
	visibility:hidden;
}

/* HIDE: VISUALLY FOR BROWSERS
------------------------------------------------*/

/* Hide only visually, but have it available for screenreaders: by Jon Neal.
  www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden */
.vh,
.v-hidden {
	position: absolute !important;
	clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
}

.vh.focusable:active,
.vh.focusable:focus
.v-hidden.focusable:active,
.v-hidden.focusable:focus {
	clip:auto;
	height:auto;
	overflow:visible;
	position:static;
	width:auto;
	margin:0;
}


/* HIDE: VISUALLY FROM ALL + MAINTAIN LAYOUT
------------------------------------------------*/

/* Hide visually and from screenreaders, but maintain layout */
.invisible {
	visibility:hidden;
}



/* ####################################### */
/* ############### =SPACING ############## */
/* ####################################### */
 
/* spacing helpers
p,m = padding,margin
a,t,r,b,l,h,v = all,top,right,bottom,left,horizontal,vertical
s,m,l,n = small(5px),medium(10px),large(20px),none(0px)
*/

.ptn,.pvn,.pan		{padding-top:0px !important}
.pts,.pvs,.pas		{padding-top:5px !important}
.ptm,.pvm,.pam		{padding-top:10px !important}
.ptl,.pvl,.pal		{padding-top:20px !important}
.pt30,.pv30,.pa30	{padding-top:30px !important}
.pt40,.pv40,.pa40	{padding-top:40px !important}
.prn,.phn,.pan		{padding-right:0px !important}
.prs,.phs,.pas		{padding-right:5px !important}
.prm,.phm,.pam		{padding-right:10px !important}
.prl,.phl,.pal		{padding-right:20px !important}
.pr30,.ph30,.pa30	{padding-right:30px !important}
.pr40,.ph40,.pa40	{padding-right:40px !important}
.pbn,.pvn,.pan		{padding-bottom:0px !important}  
.pbs,.pvs,.pas		{padding-bottom:5px !important}
.pbm,.pvm,.pam		{padding-bottom:10px !important}
.pbl,.pvl,.pal		{padding-bottom:20px !important}
.pb30,.pv30,.pa30	{padding-bottom:30px !important}
.pb40,.pv40,.pa40	{padding-bottom:40px !important}
.pln,.phn,.pan		{padding-left:0px !important}
.pls,.phs,.pas		{padding-left:5px !important}
.plm,.phm,.pam		{padding-left:10px !important}
.pll,.phl,.pal		{padding-left:20px !important}
.pl30,.ph30,.pa30	{padding-left:30px !important}
.pl40,.ph40,.pa40	{padding-left:40px !important}
.mtn,.mvn,.man		{margin-top:0px !important}
.mts,.mvs,.mas		{margin-top:5px !important}
.mtm,.mvm,.mam		{margin-top:10px !important}
.mtl,.mvl,.mal		{margin-top:20px !important}
.mt30,.mv30,.ma30	{margin-top:30px !important}
.mt40,.mv40,.ma40	{margin-top:40px !important}
.mrn,.mhn,.man		{margin-right:0px !important}
.mrs,.mhs,.mas		{margin-right:5px !important}
.mrm,.mhm,.mam		{margin-right:10px !important}
.mrl,.mhl,.mal		{margin-right:20px !important}
.mr30,.mh30,.ma30	{margin-right:30px !important}
.mr40,.mh40,.ma40	{margin-right:40px !important}
.mbn,.mvn,.man		{margin-bottom:0px !important}  
.mbs,.mvs,.mas		{margin-bottom:5px !important}
.mbm,.mvm,.mam		{margin-bottom:10px !important}
.mbl,.mvl,.mal		{margin-bottom:20px !important}
.mb30,.mv30,.ma30	{margin-bottom:30px !important}
.mb40,.mv40,.ma40	{margin-bottom:40px !important}
.mln,.mhn,.man		{margin-left:0px !important}
.mls,.mhs,.mas		{margin-left:5px !important}
.mlm,.mhm,.mam		{margin-left:10px !important}
.mll,.mhl,.mal		{margin-left:20px !important}
.ml30,.mh30,.ma30	{margin-left:30px !important}
.ml40,.mh40,.ma40	{margin-left:40px !important}

/**
 * Absolutes
 */

.at, .atr, .atl {
	position: absolute;
	top: 0px;
}

.ab, .abr, .abl {
	position: absolute;
	bottom: 0px;
}

.al, .atl, .abl {
	position: absolute;
	left: 0px;
}

.ar, .atr, .abr {
	position: absolute;
	right: 0px;
}


/**
 * PDF CSS
 */

.pdf-heading {
	overflow: hidden;
	height: 40px;
	width: 100%;
}

.pdf-heading-primary {
	float:left;
	text-align: left;
	width: 45%;
	display: inline;
}

.pdf-heading-secondary {
	float:right;
	text-align: right;
	width: 45%;
	display: inline;
	color: #999999;
}


.pdf-footer {
	color: #999999;
}

.pdf-footer-left {
	float:left;
	text-align: left;
	width: 45%;
	display: inline;
}

.pdf-footer-right {
	float:right;
	text-align: right;
	width: 45%;
	display: inline;
}