/* @group General styles */
/*
Harmonise v1.3
Resets styles then adds basic typographical styling.
Use as a starting point upon which to build more CSS.
By Clearleft.com
*/

/* @group Reset */

/* Based on http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

a,
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	font-weight: inherit;
	font-style: inherit;
	text-decoration: none;
	letter-spacing: 0.05em;
}

article, aside, figure, footer, header,
hgroup, nav, section {
	display:block;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* tables may still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* @end Reset */

/* @group Font families */

body {
	font-family: Cambria, Georgia, 'Times New Roman', serif;
	line-height: 1.75;
}

pre, code, kbd, tt, samp, tt {
	font-family: Consolas, 'Andale Mono', monospace;
}
abbr[title='and'] {
	font-family: Baskerville, 'Times New Roman', serif;
	font-style: italic;
}
abbr[title~='pounds'] {
	font-family: 'Times New Roman', Cambria, serif;
}
/* @end Font families */

/* @group Font sizes & margins */

p, ul, ol, dl, address, table, pre, form, fieldset {
	font-size: 1em;
	margin: 1em 0 1.5em;
}

/* @end Font sizes & margins*/

/* @group Headings */

h1 {
	font-weight: bold;
	font-size: 4em;
}
h2,
section h1, article h1,aside h1 {
	font-size: 2em;
}
h3,
section h2, article h2, aside h2,
section section h1, article article h1,
section article h1, article section h1 {
	font-size: 1.75em;
}
h4,
section h3, article h3, aside h3,
section section h2, article article h2,
section article h2, article section h2,
section section section h1, article article article h1,
section section article h1, article article section h1,
section article article h1, article section section h1 {
	font-size: 1.5em;
}
h5,
section h4, article h4, aside h4,
section section h3, article article h3,
section article h3, article section h3,
section section section h2, article article article h2,
section section article h2, article article section h2,
section article article h2, article section section h2,
section section section section h1, article article article article h1,
section section section article h1, article article article section h1,
section section article article h1, article article section section h1,
section article article article h1, article section section section h1 {
	font-size: 1.25em;
}
h1,h2,h3,h4,h5,h6 {
	line-height: 1.25;
	margin-bottom: 0.25em;
}
hgroup h1+h2,
hgroup h2+h3,
hgroup h3+h4,
hgroup h4+h5,
hgroup h5+h6 {
	line-height: 1;
	margin-bottom: 0.5em;
}

/* @end Headings */

/* @group Links */

a:link {
	color: #684;
}
a:visited {
	color: #573;
}
a:hover,
a:focus {
	color: #240;
}
a:active {
	color: #684;
}

html > body a:link,
html > body a:visited {
	border-bottom: 1px dotted;
}
html > body a:focus,
html > body a:hover,
html > body a:active {
	border-bottom: 1px solid;
}

html > body h1 a:link, html > body h2 a:link, html > body h3 a:link,
html > body h1 a:visited, html > body h2 a:visited, html > body h3 a:visited,
html > body h1 a:hover, html > body h2 a:hover, html > body h3 a:hover,
html > body h1 a:focus, html > body h2 a:focus, html > body h3 a:focus,
html > body h1 a:active, html > body h2 a:active, html > body h3 a:active {
	border-bottom-width: 0;
}

/* @end Links*/

/* @group Lists */

nav ul {
	list-style:none;
}
ul ul, ol ol, ol ul, ul ol {
	margin-bottom: 0;
}
li {
	margin-bottom: 0.75em;
}

/* @end Lists */

/* @group Forms */


/* @group Labels */

label {
	cursor: pointer;
}

/* @end Labels */

/* @group Form controls */

input, textarea, select, button {
	font-family: inherit;
	font-size: 1em;
	line-height: inherit;
	vertical-align:middle;
}

select {
	background-color: #fff; /* fixes bug in Opera which inherits bgcolor from container */
}
button {
	overflow: visible;
	cursor: pointer;
}
/* accessibility feature, resize check and radio inputs */
input[type='radio'], 
input[type='checkbox'] {
	width: 1em;
	height: 1em;
}

/* @end Form controls*/

/* @end Forms */

/* @group Quotes */

blockquote {
	background-image: url('/img/bg/quote.gif');
	background-position: top left;
	background-repeat: no-repeat;
	padding-left: 23px;
	margin: 1em 0 1em -23px;
	font-style: italic;
}
blockquote p:last-child {
	display: inline;
	background-image: url('/img/bg/quote-close.gif');
	background-position: bottom right;
	background-repeat: no-repeat;
	padding-right: 23px;
}

/* @end  Quotes*/

/* @group Other styling */

address {
	font-style: normal;
}

ins {
	text-decoration: underline;
}

del {
	text-decoration: line-through;
}
b,strong {
	font-weight: bold;
}
i,em {
	font-style: italic;
}
sup {
	font-size: 0.75em;
	line-height: 1;
	vertical-align: super;
}
sub {
	font-size: 0.75em;
	line-height: 1;
	vertical-align: sub;
}

/* @end Other styling */


/* @end */

/* @group Helper styles */
button,
a.button {
	color: #fff;
	background-color: #246;
	line-height: 1;
	padding: 0.25em .5em;
	font-weight: bold;
	font-family: "Lucida Grande", "Trebuchet MS", "Helvetica Neue", Arial, sans-serif;
	text-shadow: rgba(0,0,0,0.3) 0 0.1em 0.1em;
	-webkit-border-radius: 0.25em;
	-moz-border-radius: 0.25em;
	-o-border-radius: 0.25em;
	border-radius: 0.25em;
	border-color: transparent;
}
a.button:link,
a.button:visited {
	color: #fff;
	background-color: #246;
}
button:hover,
button:focus,
a.button:hover,
a.button:focus {
	color: #fff;
	background-color: #468;
}
button:active,
a.button:active {
	color: #fd9;
	background-color: #024;
}
a.stamp {
	background-position: top left;
	background-repeat: no-repeat;
}
a.stamp:link,
a.stamp:visited,
a.stamp:hover,
a.stamp:focus,
a.stamp:active {
	border: none;
}
a.stamp:link img,
a.stamp:visited img,
a.stamp:hover img,
a.stamp:focus img,
a.stamp:active img {
    transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -webkit-transition: all 0.25s ease-in-out;
}
a.stamp:hover,
a.stamp:focus {
	background-position: bottom left;
}
a.stamp:hover img,
a.stamp:focus img {
	transform: rotate(-10deg);
	-o-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
	-webkit-transform: rotate(-10deg);
}
a[type="text/calendar"],
a[type="application/xml+rss"] {
	background-position: left;
	background-repeat: no-repeat;
	padding-left: 22px;
}
a[type="text/calendar"] {
	background-image: url('/img/icon/calendar.gif');
}
a[type="application/xml+rss"] {
	background-image: url('/img/icon/rss.gif');
}
.photo {
	background-color: #fff;
	padding: 0.25em;
	border: 1px solid #DADAD9;
}

ol.adr li {
	list-style: none;
	margin: 0;
}
ol.adr .locality,
ol.adr .postal-code {
	display: inline;
}

hgroup h1 {
	margin-bottom: 0;
}
hgroup h2 {
	margin-top: 0;
	text-indent: -1.4em;
	margin-left: 1.4em;
	font-style: italic;
	font-family: 'Times New Roman',Cambria,serif;
}
hgroup .vcard .fn {
	font-style: normal;
	font-size: 0.6667em;
}
html>body hgroup .vcard a.url:hover,
html>body hgroup .vcard a.url:focus {
	border-bottom: 1px dotted;
}
.vcard .fn {
	text-transform: uppercase;
	font-family: 'Times New Roman',Cambria,serif;
	letter-spacing: 0.125em;
}

.details .dtstart,
.details .location,
.details .price {
	background-image: url('/img/bg/bullet.gif');
	background-position: left;
	background-repeat: no-repeat;
	padding: 0 20px;
}

/* @end Helper styles*/

/* @group Page structure */

body {
	margin: 0 auto;
	color: #443;
	background-color: #f9f9f8;
	background-image: url('/img/bg/body-steel.gif');
	background-attachment: fixed;
	/*background-color: #f4f4f3;
	background-image: url('/img/bg/body-light.gif');
	background-color: #eeefed;*/
	background-position: top;
	background-repeat: repeat-x;
	border-top: 0.5em solid;
	border-bottom: 0.5em solid;
}

section,
header,
footer {
	clear: both;
}

.content {
	clear: both;
	width: 80%;
	margin: 0 auto;
	padding: 0 2.5%;
	max-width: 72em;
}
.host small {
	font-family: 'Helvetica Neue',Arial,Helvetica,sans-serif;
	font-weight: bold;
	font-size: 0.85em;
	color: #979796;
}
.site {
	padding-bottom: 4em;
}
.site a:link,
.site a:visited,
.site a:focus,
.site a:hover,
.site a:active {
	border-bottom-width: 0;
}
.site h1 {
	font-weight: bold;
	letter-spacing: -0.02em;
	line-height: 1;
	margin-right: 125px;
	padding-top: 25px;
}

.site h1 a {
	display: block;
	letter-spacing: inherit;
}
.site h1:first-letter,
.site h1 a:first-letter {
	font-size: 2.5em;
	font-weight: normal;
	float: left;
	display: inline;
	padding-top: .2em;	/* tweak the positioning */
	line-height: .6;	/* this is ignored by Firefox, obeyed by Safari */
	margin-top: -0.125em;
}

.site h1 span {
	display: block;
	font-size: 0.65em;
	font-weight: normal;
	letter-spacing: normal;
	font-style: italic;
}
.site h1 span em {
	font-style: normal;
	font-weight: bold;
	letter-spacing: normal;
}

.site h1 img {
	width: 95%;
	max-width: 366px;
	padding-bottom: 0.125em;
	border-bottom: 0.125em solid;
}

.site hgroup {
	position: relative;
}
.site hgroup h2 {
	position: absolute;
	top: -1em;
	right: 0;
	width: 125px;
	height: 275px;
	margin-left: 0;
	text-indent: -999em;
	background-image: url('/img/logo/ribbon.gif');
	background-position: top left;
	background-repeat: no-repeat;
}

header.vevent {
	clear: both;
	overflow: hidden;
	position: relative;
}
header.vevent hgroup {
	width: 69.5%;
	float: left;
	display: inline;
}
header.vevent .stamp {
	background-image: url('/img/bg/button.png');
	width: 150px;
	height: 150px;
	float: left;
	display: inline;
}
header.vevent strong,
header.vevent .dtstart abbr,
header.vevent .locality {
	display: block;
	font-size: 1.25em;
	font-weight: bold;
}
header.vevent h1 {
	text-shadow: #000 1px 1px 0;
	margin-right: 125px;
}
header.vevent ul {
	clear: both;
	overflow: hidden;
}
header.vevent li {
	width: 30%;
	padding-right: 2.75%;
	float: left;
	display: inline;
	list-style: none;
	margin-top: 1em;
}
header.vevent li:nth-of-type(3n+1) {
	clear: left;
}
header.vevent li:nth-of-type(3n+2) {
	padding-right: 0;
	padding-left: 2.75%;
}
header.vevent li:nth-of-type(3n+3) {
	padding-left: 0;
	padding-right: 0;
	float: right;
	clear: right;
}
header.vevent li h2 {
	border-bottom: 0.25em solid;
}
header.vevent .description small {
	display: block;
	font-size: 0.875em;
}

.next {
	clear: both;
	border-top: 3px double #e1e1df;
	border-bottom: 1px solid #e7e7e3;
	background-color: #f4f4f3;
	background-image: url('/img/bg/next.gif');
	background-repeat: repeat-x;
	background-position: top;
}
.next .vevent {
	padding: 2em 150px 2em 9em;
}
.next h1 {
	font-size: 3em;
}
.next header {
	clear: both;
}
.next header .stamp {
	background-image: url('/img/bg/button-medium.png');
	width: 100px;
	height: 100px;
	float: right;
	display: inline;
	margin: 1.5em 0.75em 0 0;
}
.next .details {
	border-top: 0.25em solid;
	border-bottom: 1px solid;
	padding: 0.25em 0;
}
.next .photo {
	float: right;
	margin: 0.5em 0.5em 1.5em;
	width: 15%;
	max-width: 96px;
}

div.page {
	width: 66%;
	float: left;
	display: inline;
}

div.page p:first-child {
	font-weight: bold;
	font-size: 1.25em;
	margin-top: 0.75em;
	margin-bottom: 1.25em;
}
div.page p:first-child:first-letter {
	font-size: 3.5em;
	font-weight: normal;
	float: left;
	display: inline;
	padding-top: .19em;	/* tweak the positioning */
	line-height: .62;	/* this is ignored by Firefox, obeyed by Safari */
}

aside.page {
	width: 30%;
	float: right;
	display: inline;
}
aside.page #map {
	width: 100%;
	height: 17em;
	margin-top: 1em;
	border: 0.1em solid;
	opacity: 0.8;
}
aside.page #map:hover {
	opacity: 1;
}
aside.page .adr {
	text-align: right;
}
aside.page blockquote {
	font-size: 1.25em;
	margin-top: 0.75em;
}
aside.page small {
	display: block;
	background-color: #fefefe;
	border: 0.125em solid #eed;
	padding: 1em;
	margin: 1em 0;
	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
	-o-border-radius: 1em;
	border-radius: 1em;
}

section ul {
	width: 30%;
	float: left;
	display: inline;
	padding-right: 2.75%;
}
section ul+ul {
	padding-left: 2.75%;
	padding-right: 0;
}
section ul+ul+ul {
	padding-left: 0;
	padding-right: 0;
	float: right;
	clear: right;
}

section.vcard {
	clear: both;
}
section.vcard h1 {
	border-bottom: 0.125em solid;
}
section.vcard .photo {
	float: right;
	display: inline;
	margin: -2.85em 1em 1em 1em;
}

.workshops {
	clear: both;
	overflow: hidden;
	padding-top: 3em;
	padding-bottom: 3em;
}

.workshops section hgroup {
	border-top: 0.25em solid;
	padding-top: 0.5em;
}

aside.workshops {
	background-color: #EEF0EA;
	border-top: 1px solid #DDDFD8;
}
aside.workshops ul {
	border-top: 0.25em solid;
}
aside.workshops li {
	list-style: none;
	overflow: hidden;
	clear: both;
	border-bottom: 0.125em dotted #ccc;
	margin: 0;
	padding-top: 1.5em;
}
aside.workshops li:hover {
	border-bottom-color: #999;
}
aside.workshops li h2 {
	position: relative;
	clear: left;
	float: left;
	display: inline;
	font-family: Cambria, Georgia, 'Times New Roman', serif;;
	font-style: normal;
	font-weight: bold;
	text-indent: 0;
	margin-left: 0;
}
aside.workshops li h3 {
	position: relative;
	clear: right;
	float: right;
	display: inline;
	font-family: 'Times New Roman', serif;
	margin-top: 0.3em;
}

#contact {
	padding-top: 3em;
	padding-bottom: 6em;
	background-image: url('/img/bg/contact.gif');
	background-repeat: repeat-x;
	background-position: top;
	background-color: #fbfbfa;
}
#contact .card {
	background-color: #fefefe;
	border: 0.125em dashed #eed;
	padding: 3%;
	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
	-o-border-radius: 1em;
	border-radius: 1em;
}
#contact h1 {
	border-bottom: 0.1em solid #eed;
}
#contact form {
	clear: both;
	overflow: hidden;
}
#contact label {
	display: block;
}
#contact label em {
	color: #c30;
	font-style: normal;
	font-weight: bold;
}
#contact textarea {
	width: 50%;
	float: left;
	border-color: #cc9;
	background-color: transparent;
}
#contact fieldset {
	width: 40%;
	float: right;
	margin: 0;
	padding: 0;
}
#contact fieldset p {
	margin-top: 0;
}
#contact fieldset input {
	width: 99%;
	background-color: transparent;
	border: none;
	border-bottom: 1px solid #cc9;
}
#contact button {
	clear: both;
	float: right;
}
footer[role="contentinfo"] {
	background-color: #e5e5e4;
	padding: 1px 0;
}
footer[role="contentinfo"] .content {
	background-image: url('/img/branding/box.png');
	background-position: 3% top;
	background-repeat: no-repeat;
	padding-top: 8px;
	margin-top: -8px;
	overflow: hidden;
}
footer[role="contentinfo"] .blurb {
	margin-left: 145px;
}
footer .blurb {
	font-size: 0.85em;
}
footer .blurb p:first-child {
	font-weight: bold;
}
footer .vcard {
	font-size: 0.85em;
	width: 10em;
	float: right;
	display: inline;
	margin-left: 2.65em;
	margin-top: 1em;
}
footer .vcard ol {
	margin: 0;
}
footer .vcard .tel {
	display: block;
}
/* @end Page structure*/

/* @group Overrides */

.home .dtstart {
	font-weight: bold;
}
.home section.workshops hgroup {
	border-bottom: 1px solid #E7E7E4;
}
.home .workshops footer ul {
	font-size: 0.85em;
	width: 100%;
	float: none;
	clear: both;
	overflow: hidden;
}
.home .workshops footer li:nth-child(odd) {
	list-style: none;
	width: 45%;
	float: left;
}
.home .workshops footer li:nth-child(even) {
	list-style: none;
	width: 45%;
	float: right;
	text-align: right;
}

/* @end Overrides */

@media all and (max-width: 1024px) {
	.content {
		width: 85%;
	}
}

@media all and (max-width: 800px) {
	.content {
		width: auto;
	}
	.next .vevent {
		padding-left: 0;
		padding-right: 0;
	}
	section ul,
	header.vevent hgroup,
	header.vevent li,
	#contact textarea,
	#contact fieldset,
	.home .workshops section,
	.home .workshops section.ux {
		width: 99%;
		clear: both;
		float: none;
		padding-left: 0;
		padding-right: 0;
		margin-left: 0;
		margin-right: 0;
	}
}
@media all and (max-width: 640px) {
	.site h1 {
		font-size: 3em;
	}
}
@media all and (max-width: 480px) {
	.site h1 {
		font-size: 2em;
	}
}