﻿@charset "UTF-8";
/* RESET */
/* A more considered reset; csswizardry.com/2011/10/reset-restarted */
html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,hr,
a,abbr,address,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strong,sub,sup,tt,var,
b,u,i,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
	margin:0;
	padding:0;
}
article,aside,details,figcaption,figure,footer,
header,hgroup,menu,nav,section{
	display:block;
}
h1,h2,h3,h4,h5,h6{
	font-size:1em;
}
table{
	border-collapse:collapse;
	border-spacing:0;
}
strong,b,mark{
	font-weight:bold;
	font-style:inherit;
}
em,i,cite,q,address,dfn,var{
	font-style:italic;
	font-weight:inherit;
}
abbr[title],dfn[title]{
	cursor:help;
	border-bottom:1px dotted;
}
ins{
	border-bottom:1px solid;
}
a,u,ins{
	text-decoration:none;
}
del,s{
	text-decoration:line-through;
}
pre,code,samp,kbd{
	font-family:monospace;
}
small{
	font-size:0.75em;
}
img{
	border:none;
	font-style:italic;
}
input,
select,option,optgroup,
textarea{
	font:inherit;
}


/* SHARED */

h1,h2,h3,h4,h5,h6,
ul,ol,dl,p,address,figure,pre,fieldset,table,hr,
.nav,.island,.media{
	margin-bottom:24px;
	margin-bottom:1.5rem;
}
figcaption,small{
	font-size:12px;
	font-size:0.75rem;
}
ul,ol,dd{
	margin-left:3em;
}
small,code{
	line-height:1;
}
pre,code,
input,textarea{
	font:inherit;
}


/* MAIN */

html{
	overflow-y:scroll; 
	font-size:100%; 
	line-height:1.5; 
	background-color:#fff;
	color:#333;
}
body{
	min-height:100%;
}


/* grid */

.wrapper{
	max-width:920px;
	margin:0 auto;
	padding:0 20px;
	overflow:hidden;
}

.grid{
	clear:both;
	max-width:940px;
	margin:0 0 0 -2.083%;
	list-style:none; 
}

[class^="g-"]{
	float:left;
	margin:0 2.083% 0 0;
}
.grid [class^="g-"]{
	margin:0 0 0 2.083%;
}
.g-1{ width:6.25% }
.g-2{ width:14.583% }
.g-3{ width:22.917% }
.g-4{ width:31.25% }
.g-5{ width:39.583% }
.g-6{ width:47.917% }
.g-7{ width:56.25% }
.g-8{ width:64.583% }
.g-9{ width:72.917% }
.g-10{ width:81.25% }
.g-11{ width:89.583% }
.g-12{ width:97.917%; margin:0 }


/* CLEARFIX */
/*  nicolasgallagher.com/micro-clearfix-hack/ */
.cf,
.grid,
.media{
	zoom:1;
}
.cf:before,
.grid:before,
.media:before,

.cf:after,
.grid:after,
.media:after{
	content:"";
	display:table;
}
.cf:after,
.grid:after,
.media:after{
	clear:both;
}


/* ISLAND */
/* csswizardry.com/2011/10/the-island-object/ */
.island{
	padding:1.5em;
}
	.island > :last-child{
		margin-bottom:0;
	}


/* MEDIA */
/* stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/ */
.media{
	display:block;
}
	.media .img{
		float:left;
		margin-right:10px;
	}
	.media .body{
		overflow:hidden;
		margin-bottom:0;
	}


/* MESSAGES */

.message{
	font-weight:normal;
	display:block;
	padding:10px 10px 10px 36px;
	border:1px solid #ccc;
	margin-left:0;
	
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
	-moz-box-shadow:0 1px 0 rgba(255,255,255,0.5) inset;
	-webkit-box-shadow:0 1px 0 rgba(255,255,255,0.5) inset;
	box-shadow:0 1px 0 rgba(255,255,255,0.5) inset;
}
	ul.message{
		list-style:decimal outside;
		padding:10px 10px 10px 56px;
	}
.error{
	border-color:#fb5766;
	background:url(../img/icons/error.png) 10px center no-repeat #fab;
}
.success{
	border-color:#83ba77;
	background:url(../img/icons/success.png) 10px center no-repeat #d1feba;
}
.info{
	border-color:#85a5be;
	background:url(../img/icons/info.png) 10px center no-repeat #c4dbec;
}
.warning{
	border-color:#d8d566;
	background:url(../img/icons/warning.png) 10px center no-repeat #fef8c4;
}


/* MISC */
.more-link:after{
	/* Too many people use &raquo; in their markup to signify progression/movement, that ain’t cool. Let’s insert that using content:""; */
	content:" »";
}


/* CLASSES */
 
.left	{ float:left; }
.right	{ float:right; }
.clear	{ clear:both; float:none; }

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


/* NARROW */

@media (min-width: 721px) and (max-width: 960px){
}
/*--- END NARROW ---*/



/* MOBILE */
/* Linearise it! */
@media (max-width: 720px){
/* MAIN */
html{
	font-size:110%;
}
body{
	-webkit-text-size-adjust:none;
}
.wrapper{
	width:auto;
	padding:0 10px;
	
}

.grid{
	margin:0;
	width:auto;
}

[class^="g-"],
.grid [class^="g-"]{
	width:auto;
	float:none;
	margin:0;
}


/*--- LISTS ---*/
ul,
ol,
dl{
	margin-left:1.5em;
}

/*--- END MOBILE ---*/


/* PRINT */

@media print{

*{
	background-color:#fff;
	color:#000;
	text-shadow:none!important;
}

body{
	font-size:0.75em; 
}
.wrapper{
	width:75%;
	margin:0 auto;
}

.nav,
.footer{
	display:none;
}

.grid{
	width:auto;
}
[class^="g-"]{
	width:auto;
	float:none;
	clear:both;
}

img{
	max-width:100%;
	height:auto;
}

.message{
	border:none;
	font-weight:bold;
}


object:after{
	content:"Flash/video content.";
	display:block;
	font-weight:bold;
	margin-bottom:1.5em;
}
}
/*--- END PRINT ---*/