/* ------------------------------------------------------
Default style document

@project	Webstock
@version	2011
@date		2010-09-13
@author		Darren Wood <darren@dontcom.com>
@media		screen, print

@colordef #93BABE; main nav hover
@colordef #8A6C43; a
@colordef #652627; a hover
@colordef #333; default text colour
@colordef #632324; red heading colour
@colordef #f5f4f1; page colour
@colordef #e5e3da; hr's

File contains the following:
- Global Reset
- Typography
	- Body
	- Paragraphs
	- Links
	- Headings
	- Lists
	- Others
- Helper Styles
	- Forms
	- Notifications and error messages
- Structure
- Components
- Overrides
- Mobile Styles
--------------------------------------------------------- */

#util-links {
	list-style-type: none;
	margin:  0 0 10px 0;
}

#util-links li {
	background: url("/11/images/home-twitter.png") no-repeat 0 .3em;
	margin:  0 0 5px 0;
}

#util-links li.home-mail {
	background-image: url("/11/images/home-mail.png");
}

#util-links a {
	text-transform: uppercase;
	border-bottom: none;
	font-weight: bold;
	padding:  0 0 0 25px;
	display:  block;
	font-size: .9em;
}

/* ------------------------------------------------------
RESET
@section reset
--------------------------------------------------------- */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, img, 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, menu,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	text-rendering: optimizeLegibility;
}                  

article, aside, figure, footer, header, 
hgroup, nav, section { display:block; }

nav ul { list-style:none; }
nav li { margin: 0; }

blockquote, q { quotes:none; }

blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }

a { margin:0; padding:0; border:0; font-size:100%; vertical-align:baseline; background:transparent; }

ins { background-color:#ff9; color:#000; text-decoration:none; }

mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom:1px dotted #000; cursor:help; }

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

hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }

input, select { vertical-align:middle; }


/* ------------------------------------------------------
TYPOGRAPHY
@section typography
--------------------------------------------------------- */

/*
@section Body
*/
html {
	background: #000 url(../images/bg2.jpg) no-repeat fixed 868px 0;
}

body {
	height: 100%;
	background: url(../images/bg.jpg) repeat-y;
	font: normal 16px/1.5 "ff-meta-serif-web-pro-1","ff-meta-serif-web-pro-2",Georgia,serif;
	color: #333;
}


/*
@section paragraphs
*/
p, dl, hr, h1, h2, h3, h4, h5, h6, ol, ul, pre, table, address, fieldset {
    margin-bottom: .5em;
}


/*
@section links
*/
a:active { outline: none; }
a:focus { outline: thin dotted; }

a, a:active, a:visited { color:#8A6C43; text-decoration: none; }
a:hover { color:#652627; text-decoration: none; border-bottom: 1px dotted #8A6C43; }

a:link { -webkit-tap-highlight-color: #FF5E99; } 


/*
@section Headings
*/
h1 { font-size: 2em; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }

h1, h2, h3, h4, h5, h6 {
    line-height: 1.1;
    color:  #652627;
}

.tk-chunk {
	text-transform: uppercase;
	-webkit-text-shadow: 3px 3px 0 #e5e3da;
	-moz-text-shadow: 3px 3px 0 #e5e3da;
	text-shadow: 3px 3px 0 #e5e3da;
	color: #632324;
	font-size: 35px;
	position: relative;
	z-index: 11;
}

.tk-chunk b {
	width: 100%;
	height: 100%;
	background: url(../images/noise.png);
	position: absolute;
	top:0;
	left:0;
}


/*
@section Lists
*/
ol { list-style: decimal; }
ul { list-style: disc; }
li { margin-left: 30px; }


/*
@section Other
*/
small { font-size:85%; }
strong, th { font-weight: bold; }

td, td img { vertical-align:top; } 

sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }

pre { 
  padding: 15px; 
  white-space: pre; /* CSS2 */
  white-space: pre-wrap; /* CSS 2.1 */
  white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word; /* IE */
}

::-moz-selection{ background: #652627; color:#fff; text-shadow: none; }
::selection { background:#652627; color:#fff; text-shadow: none; } 


/* ------------------------------------------------------
HELPER STYLES
@section helper
--------------------------------------------------------- */
#xPageLoader {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 999;
	background: #e5e0d5 url(../images/loader.gif) no-repeat 50% 60px;
}
/*
@section non-semantic helpers
*/
/* for image replacement */
.ir { display:block; text-indent:-999px; overflow:hidden; background-repeat: none; }

.clear { clear: both; }

/* Hide for both screenreaders and browsers */
.hidden { display:none; visibility:hidden; } 

/* Hide only visually, but have it available for screenreaders */
.visuallyhidden { position:absolute !important;    
  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px); }

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

/* >> The Magnificent CLEARFIX << */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; } /* Hides from IE-mac \*/
.clearfix { display: block; }


/*
@section Forms
*/
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie6 input { vertical-align: text-bottom; }
label, input[type=button], input[type=submit], button { cursor: pointer; }


/*
@section Notifications & Errors
*/


/* ------------------------------------------------------
STRUCTURE
@section structure
--------------------------------------------------------- */
#container {
	width: 860px;
	background: url(../images/bg-page.png) no-repeat top left;
}

header[role=banner] {
	background: url(../images/header-8.png) no-repeat bottom left;
	position: relative;
	height: 175px;
}

header[role=banner] h1 {
	position: absolute;
	top: 0; left: 30px;
	width: 340px; height: 115px;
}

header[role=banner] h1 a {
	display: block;
	width: 100%;
	height: 100%;
	text-indent: -999em;
	overflow: hidden;
	border: 0;
}

header[role=banner] h2 {
	position: absolute;
	top: 10px; right: 30px;
	width: 312px; height: 102px;
	background: url(../images/info-8.png) no-repeat;
	text-indent: -9999em;
	overflow: hidden;
}

nav[role=navigation] {
	position: absolute;
	top: 131px;
	left: 34px;
}

nav[role=navigation] li {
	float: left;
	margin: 0;
}

nav[role=navigation] li a {
	float: left;
	background: url(../images/nav.png) no-repeat;
	height: 23px;
	text-indent: -999em;
	overflow: hidden;
	border: 0;
}

nav[role=navigation] #navHome a {
	width: 73px;
	background-position: 0 0;
}

nav[role=navigation] #navHome a:hover,
#pageHome nav[role=navigation] #navHome a {
	background-position: 0px -21px;
}

nav[role=navigation] #navSpeakers a {
	width: 109px;
	background-position: -73px 0;
}

nav[role=navigation] #navSpeakers a:hover,
#pageSpeakers nav[role=navigation] #navSpeakers a {
	background-position: -73px -21px;
}

nav[role=navigation] #navProgramme a {
	width: 133px;
	background-position: -182px 0;
}

nav[role=navigation] #navProgramme a:hover,
#pageProgramme nav[role=navigation] #navProgramme a {
	background-position: -182px -21px;
}

nav[role=navigation] #navVenue a {
	width: 81px;
	background-position: -315px 0;
}

nav[role=navigation] #navVenue a:hover,
#pageVenue nav[role=navigation] #navVenue a {
	background-position: -315px -21px;
}

nav[role=navigation] #navRegister a {
	width: 108px;
	background-position: -396px 0;
}

nav[role=navigation] #navRegister a:hover,
#pageRegister nav[role=navigation] #navRegister a {
	background-position: -396px -21px;
}

nav[role=navigation] #navBlog a {
	width: 68px;
	background-position: -504px 0;
}

nav[role=navigation] #navBlog a:hover,
#pageBlog nav[role=navigation] #navBlog a {
	background-position: -504px -21px;
}

nav[role=navigation] #navSponsors a {
	width: 112px;
	background-position: -572px 0;
}

nav[role=navigation] #navSponsors a:hover,
#pageSponsors nav[role=navigation] #navSponsors a {
	background-position: -572px -21px;
}

nav[role=navigation] #navContact a {
	width: 93px;
	background-position: -684px 0;
}

nav[role=navigation] #navContact a:hover,
#pageContact nav[role=navigation] #navContact a {
	background-position: -684px -21px;
}

#main,
#footer {
	padding: 0 40px;
	overflow: hidden;
}

.content-main {
	float: left;
	width: 533px;
	position: relative;
}

.content-main div {
	font-weight: normal;
	display: block;
	overflow: hidden;
}

.content-main .t {
	width: 100%;
	height: 50px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	background: url(../images/main-top.png) no-repeat top left;
}

.content-main .b {
	width: 100%;
	height: 13px;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 10;
	background: url(../images/main-bottom.png) repeat-x bottom left;
}

.content-main .c {
	-moz-box-shadow: 5px 0 0 rgba(120,120,120,0.1);
	-webkit-box-shadow: 5px 0 0 rgba(120,120,120,0.1);
	box-shadow: 5px 0 0 rgba(120,120,120,0.1);
	padding: 20px 30px;
	background-color: #f5f4f1;
	margin-top: 14px;
}

.content-main header {
	border-bottom: 3px solid #e5e3da;
	margin-bottom: 20px;
	padding-bottom: 10px;
}

.content-main header h1 {
	margin: 0;
	line-height: 1;
}

.content-sub {
	float: right;
	width: 215px;
}


#footer {
	width:  100%;
	clear: both;
}

#footer .hr {
	margin: 36px 0 -4px -5px;
	position: relative;
	z-index: 2;
}

#footer ul {
	width: 707px;
	height: 89px;
	overflow: hidden;
	padding-left: 58px;
	background: url(../images/nav-footer.png) no-repeat;
}

#footer li {
	list-style: none;
	margin: 0;
	float: left;
	overflow: hidden;
	height: 89px;
}

#footer li a {
	background: url(../images/nav-footer.png) no-repeat;
	float: left;
	height: 100%;
	width: 100%;
	text-indent: -999em;
	overflow: hidden;
}

#footer #fnavAbout a {
	width: 170px;
	background-position: -58px 0;
}

#footer #fnavAbout a:hover,
#footer #fnavAbout a:focus {
	background-position: -58px -89px;
}

#footer #fnavPastTalks a {
	width: 133px;
	background-position: -228px 0;
}

#footer #fnavPastTalks a:hover,
#footer #fnavPastTalks a:focus {
	background-position: -228px -89px;
}

#footer #fnavUpcomingEvents a {
	width: 177px;
	background-position: -361px 0;
}

#footer #fnavUpcomingEvents a:hover,
#footer #fnavUpcomingEvents a:focus {
	background-position: -361px -89px;
}

#footer #fnavStore a {
	width: 167px;
	background-position: -538px 0;
}

#footer #fnavStore a:hover,
#footer #fnavStore a:focus {
	background-position: -538px -89px;
}

#footer .meta {
	color: #642425;
	font-size:  .9em;
}

#footer .meta a {
	color: #642425;
}

#footer .meta a:hover {
	text-decoration: underline;
}
/* ------------------------------------------------------
COMPONENTS
@section components
--------------------------------------------------------- */
/* @section breadcrumbs */
#breadcrumbs {
	margin: 5px 0 10px 0;
	overflow: hidden;
	font-size: .9em;
}

#breadcrumbs b {
	font-weight: normal;
}

#breadcrumbs a {
	color: #333 !important;
	text-decoration: underline;
}

#breadcrumbs span {
	font-size: 11px;
	padding: 0 3px;
	font-weight: bold;
}


/* @section back to top link */
.back-to-top,
.view-all {
	background: url(../images/back-to-top.png) no-repeat 0 .2em;
	float: right;
	font-style: italic;
	padding-left: 25px;
}

.view-all {
	background: url(../images/view-all.png) no-repeat 0 .4em;
}

a.back-to-top:hover,
a.back-to-top:focus,
a.view-all:hover,
a.view-all:focus {
	border-bottom: none;
}


/* @section hero elements */
#hero {
	margin: 10px 0;
	position: relative;
	overflow: hidden;
}


/* @section homepage intro text */
#hero .intro {
	float: right;
	width: 300px;
}

#hero .register {
	position: absolute;
	display: block;
	width: 300px;
	height: 191px;
	overflow: hidden;
	text-indent: -999em;
	background: url(../images/button-register-8.png) no-repeat 0 0;
	bottom: 0;
	right: 0;
	border: 0;
}

#hero .register:hover {
	background-position: 0 -192px;
}

p.soldout {
	position: absolute;
	display: block;
	width: 300px;
	height: 157px;
	overflow: hidden;
	text-indent: -999em;
	background: url(/11/images/sold-out.png) no-repeat 0 0;
	bottom: 0;
	right: 0;
	border: 0;
}

#hero .title {
	padding-top: 3px;
	font-family: "chunk-1","chunk-2",serif;
	text-transform: uppercase;
	line-height: 1;
	color: #97784b;
	font-size: 20px;
	margin: 0;
}

#hero .title strong {
	color: #5e1c1d;
	-moz-text-shadow: 3px 1px 0 #fff;
	-webkit-text-shadow: 3px 1px 0 #fff;
	text-shadow: 3px 1px 0 #fff;
	font-size: 50px;
	display: block;
}

#hero .webstock-fact {
	font-size: 18px;
	line-height: 1.3;
}


/* @section homepage speakers carousel */
#speakers {
	-moz-box-shadow: 5px 5px 0 rgba(120,120,120,0.1);
	-webkit-box-shadow: 5px 5px 0 rgba(120,120,120,0.1);
	box-shadow: 5px 0 0 rgba(120,120,120,0.1);
	background: url(../images/hero.png) no-repeat;
	float: left;
	width: 460px;
	overflow: hidden;
	height: 338px;
	margin-bottom: 7px;
}

#speakers ul {
	overflow: hidden;
	margin: 25px 0 10px 14px;
}

#speakers li {
	list-style: none;
	margin: 0 5px 5px 0;
	float: left;
	width: 215px;
	text-align: right;
	height: 147px;
	background-color: #98794c;
}

#speakers li:nth-child(2n) {
	margin-right: 0;
}

#speakers a {
	color: #fff;
	font-weight: bold;
	font-size: 12px;
	text-transform: uppercase;
}

#speakers strong {
	border-top: 2px solid #fff;
	padding: 0 5px 4px 0;
	display: block;
	background-color: #98794c;
}

.speaker-name img {
	visibility: hidden;
	height: 123px;
	overflow: hidden;
	display: block;
}


/* @section speakers page / presentations */
.bio,
.presentation,
.workshop {
	list-style: none;
	margin: 0 0 15px 0;
	overflow: hidden;
	border-bottom:3px solid #E5E3DA;
	padding-bottom:15px;
}

.bio:last-child,
.presentation:last-child,
.workshop:last-child {
	border-bottom:3px solid #E5E3DA;
	padding-bottom:15px;
}

.bio figure .speaker-name,
.presentation figure .speaker-name,
.workshop figure .speaker-name { 
	float: left;
	width: 125px;
	height: 71px;
	margin-top: 3px;
	background-position: 0 -145px;
	border-bottom: 0;
}

.bio figure img,
.presentation figure img,
.workshop figure img {
	display: block;
}

.presentation figure,
.workshop figure,
figure.single-speaker {
	float: left;
	margin: 0 20px 10px 0;
}

figure.single-speaker {
	height:  123px;
	overflow: hidden;
}

figure.single-speaker img {
	margin-top: -123px;
}

figure.koz {
	height:  215px;
	
}

figure.koz img {
	margin-top: 0;
}

.bio figcaption {
	float: right;
	width: 330px;
	line-height: 1.2;
}

.bio h2 {
	font-size: 16px;
}

.presentation h2,
.workshop h2 {
	margin: 0 0 4px 0;
}

.presentation h2,
.presentation h3,
.workshop h2,
.workshop h3 {
	color: #8A6C43;
}


/*** 
@section speakers 
NOTE: To achieve hover effect you need to assign each speaker their own class name
and apply the correct background image. Each speaker image is a sprite containing
black & white and colour. Check /11/images/speaker.jpg for an example of how to
create the new images. The dimentions HAVE to be the same for the sprites to work
correctly.

css e.g.
.fistname-lastname { background: url(../images/firstname-lastname.jpg) no-repeat }
***/

.speaker-name {	background: url(/11/images/speaker.jpg) no-repeat; }

.boyd { background: url(/11/images/speakers/boyd.jpg) no-repeat  0 -123px; }
.boyd:hover, 
.boyd:focus { background-position: 0 123px; }
#pageSpearkers .boyd { background: url(/11/images/speakers/sm/boyd.jpg) no-repeat  0 -123px; }


.josh-clark { background: url(/11/images/speakers/clark.jpg) no-repeat 0 -123px; }
.josh-clark:hover, 
.josh-clark:focus { background-position: 0 123px; }
#pageSpearkers .josh-clark { background: url(/11/images/speakers/sm/clark.jpg) no-repeat 0 -123px; }


.jason-cohen { background: url(/11/images/speakers/cohen.jpg) no-repeat 0 -123px; }
.jason-cohen:hover, 
.jason-cohen:focus { background-position: 0 -123px; }
#pageSpearkers .jason-cohen { background: url(/11/images/speakers/sm/cohen.jpg) no-repeat 0 -123px; }


.kristina-halvorson { background: url(/11/images/speakers/halvorson.jpg) no-repeat 0 -123px; }
.kristina-halvorson:hover, 
.kristina-halvorson:focus { background-position: 0 -123px; }
#pageSpearkers .kristina-halvorson { background: url(/11/images/speakers/sm/halvorson.jpg) no-repeat 0 -123px; }

.mccloud { background: url(/11/images/speakers/mccloud.jpg) no-repeat 0 -123px; }
.mccloud:hover, 
.mccloud:focus { background-position: 0 -123px; }
#pageSpearkers .mccloud { background: url(/11/images/speakers/sm/mccloud.jpg) no-repeat 0 -123px; }

.patterson { background: url(/11/images/speakers/patterson.jpg) no-repeat 0 -123px; }
.patterson:hover, 
.patterson:focus { background-position: 0 -123px; }
#pageSpearkers .patterson { background: url(/11/images/speakers/sm/patterson.jpg) no-repeat 0 -123px; }

.perfetti { background: url(/11/images/speakers/perfetti.jpg) no-repeat 0 -123px; }
.perfetti:hover, 
.perfetti:focus { background-position: 0 -123px; }
#pageSpearkers .perfetti { background: url(/11/images/speakers/sm/perfetti.jpg) no-repeat 0 -123px; }

.lopp { background: url(/11/images/speakers/lopp.jpg) no-repeat 0 -123px; }
.lopp:hover, 
.lopp:focus { background-position: 0 -123px; }
#pageSpearkers .lopp { background: url(/11/images/speakers/sm/lopp.jpg) no-repeat 0 -123px; }

.pilgrim { background: url(/11/images/speakers/pilgrim.jpg) no-repeat 0 -123px; }
.pilgrim:hover, 
.pilgrim:focus { background-position: 0 -123px; }
#pageSpearkers .pilgrim { background: url(/11/images/speakers/sm/pilgrim.jpg) no-repeat 0 -123px; }

.sims { background: url(/11/images/speakers/sims.jpg) no-repeat 0 -123px; }
.sims:hover, 
.sims:focus { background-position: 0 -123px; }
#pageSpearkers .sims { background: url(/11/images/speakers/sm/sims.jpg) no-repeat 0 -123px; }

.souders { background: url(/11/images/speakers/souders.jpg) no-repeat 0 -123px; }
.souders:hover, 
.souders:focus { background-position: 0 -123px; }
#pageSpearkers .souders { background: url(/11/images/speakers/sm/souders.jpg) no-repeat 0 -123px; }

.bowman { background: url(/11/images/speakers/bowman.jpg) no-repeat 0 -123px; }
.bowman:hover, 
.bowman:focus { background-position: 0 -123px; }
#pageSpearkers .bowman { background: url(/11/images/speakers/sm/bowman.jpg) no-repeat 0 -123px; }

.coates { background: url(/11/images/speakers/coates.jpg) no-repeat 0 -123px; }
.coates:hover, 
.coates:focus { background-position: 0 -123px; }
#pageSpearkers .coates { background: url(/11/images/speakers/sm/coates.jpg) no-repeat 0 -123px; }

.sullivan { background: url(/11/images/speakers/sullivan.jpg) no-repeat 0 -123px; }
.sullivan:hover, 
.sullivan:focus { background-position: 0 -123px; }
#pageSpearkers .sullivan { background: url(/11/images/speakers/sm/sullivan.jpg) no-repeat 0 -123px; }

.arment { background: url(/11/images/speakers/arment.jpg) no-repeat 0 -123px; }
.arment:hover, 
.arment:focus { background-position: 0 -123px; }
#pageSpearkers .arment { background: url(/11/images/speakers/sm/arment.jpg) no-repeat 0 -123px; }

.koziarski { background: url(/11/images/speakers/koziarski.jpg) no-repeat 0 -123px; }
.koziarski:hover, 
.koziarski:focus { background-position: 0 -123px; }
#pageSpearkers .koziarski { background: url(/11/images/speakers/sm/koziarski.jpg) no-repeat 0 -123px; }

.mann { background: url(/11/images/speakers/mann.jpg) no-repeat 0 -123px; }
.mann:hover, 
.mann:focus { background-position: 0 -123px; }
#pageSpearkers .mann { background: url(/11/images/speakers/sm/mann.jpg) no-repeat 0 -123px; }

.santamaria { background: url(/11/images/speakers/santamaria.jpg) no-repeat 0 -123px; }
.santamaria:hover, 
.santamaria:focus { background-position: 0 -123px; }
#pageSpearkers .santamaria { background: url(/11/images/speakers/sm/santamaria.jpg) no-repeat 0 -123px; }

.mccandless { background: url(/11/images/speakers/mccandless.jpg) no-repeat 0 -123px; }
.mccandless:hover, 
.mccandless:focus { background-position: 0 -123px; }
#pageSpearkers .mccandless { background: url(/11/images/speakers/sm/mccandless.jpg) no-repeat 0 -123px; }

.sunde { background: url(/11/images/speakers/sunde.jpg) no-repeat 0 -123px; }
.sunde:hover, 
.sunde:focus { background-position: 0 -123px; }
#pageSpearkers .sunde { background: url(/11/images/speakers/sm/sunde.jpg) no-repeat 0 -123px; }

.gruber { background: url(/11/images/speakers/gruber.jpg) no-repeat 0 -123px; }
.gruber:hover, 
.gruber:focus { background-position: 0 -123px; }
#pageSpearkers .gruber { background: url(/11/images/speakers/sm/gruber.jpg) no-repeat 0 -123px; }

.palmer { background: url(/11/images/speakers/palmer.jpg) no-repeat 0 -123px; }
.palmer:hover, 
.palmer:focus { background-position: 0 -123px; }
#pageSpearkers .palmer { background: url(/11/images/speakers/sm/palmer.jpg) no-repeat 0 -123px; }

.webley { background: url(/11/images/speakers/webley.jpg) no-repeat 0 -123px; }
.webley:hover, 
.webley:focus { background-position: 0 -123px; }
#pageSpearkers .webley { background: url(/11/images/speakers/sm/webley.jpg) no-repeat 0 -123px; }

.recordon { background: url(/11/images/speakers/recordon.jpg) no-repeat 0 -123px; }
.recordon:hover, 
.recordon:focus { background-position: 0 -123px; }
#pageSpearkers .recordon { background: url(/11/images/speakers/sm/recordon.jpg) no-repeat 0 -123px; }

.chimero { background: url(/11/images/speakers/chimero.jpg) no-repeat 0 -123px; }
.chimero:hover, 
.chimero:focus { background-position: 0 -123px; }
#pageSpearkers .recordon { background: url(/11/images/speakers/sm/chimero.jpg) no-repeat 0 -123px; }

/* sprite hover */
.speaker-name:hover, 
.speaker-name:focus { background-position: 0 0; }

.bio .speaker-name:hover, 
.bio .speaker-name:focus, 
.presentation .speaker-name:hover, 
.presentation .speaker-name:focus { background-position: 0 -145px; }




.scrollable {
	position:relative;
	overflow:hidden;
	height: 322px;
	width: 456px;
}

.scrollable .items {
	position:absolute;
	height:20000em;
}


/* @section twitter badge */
.twitter {
	display: block;
	width: 208px;
	height: 53px;
	background: url(../images/twitter-8.png) no-repeat 0 0;
	text-indent: -999em;
	overflow: hidden;
	margin-bottom: 20px;
	border: 0 !important;
}

.twitter:hover {
	background-position: 0 -53px;
}


/* @section horizontal rules */
.hr {
	display: block;
	height:30px;
	background: url(../images/hr-full.png) no-repeat;
	border: none !important;
	clear: both;
	margin: 10px 0;
}



/* @section news */
.hfeed .hentry {
	border-bottom:3px solid #E5E3DA;
	margin-bottom:15px;
	overflow:hidden;
	padding-bottom:15px;
}

.hfeed .entry-title {
	font-size: 16px;
	font-size: 1.1em;
}

.hfeed .entry-title a {
	color: #97784b;
}

.hfeed article div {
	float: right;
	width: 410px;
}

.hfeed footer {
	float: left;
	width: 60px;
}

.hfeed time {
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 2px 2px 2px #e5e3da;
	-moz-box-shadow: 2px 2px 2px #e5e3da;
	box-shadow: 2px 2px 2px #e5e3da;
	border: 1px solid #e5e3da;
	display: block;
	width: 40px;
	height: 50px;
	position: relative;
}

.hfeed time b {
	position: absolute;
	width: 100%;
	text-align: center;
	font-weight: bold;
}

.hfeed time .month {
	top: 0;
	color: #666;
	text-transform: uppercase;
	font-size: 12px;
}

.hfeed time .day {
	top: 10px;
	color: #7a2029;
	font-size: 20px;
}

.hfeed time .year {
	bottom: 0;
	text-transform: uppercase;
	font-size: 12px;
	color: #8a6c43;
}


/* @section side bar stuff */
/* @section sidebar double borders */
.box-rounded {
	display: block;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	border: 2px solid;
}

.box-rounded.red {
	border-color: #a58a5c;
	margin: 0 0 -3px -2px;
	font-weight: normal;
}

.box-rounded.white {
	border:4px solid #f5f4f1;
	margin: 0 4px 20px 4px;
	font-weight: normal;
}

.box-rounded h2 {
	margin: 10px;
	-webkit-text-shadow: 3px 3px 0 #f5f4f1;
	-moz-text-shadow: 3px 3px 0 #f5f4f1;
	text-shadow: 3px 3px 0 #f5f4f1;
	font-size: 28px;
	line-height: 0.9;
}

.box-rounded h2 strong {
	display: block;
	font-size: 40px;
}

.box-rounded h3 {
	margin: 10px;
	border-top: 1px dotted #9c8153;
	border-bottom: 1px dotted #9c8153;
	color: #9c8153;
	text-transform: uppercase;
	font-size: 14px;
	line-height: 1;
	padding: 5px 0;
}

.box-rounded img {
	/*margin: 10px 0;*/
}

.box-rounded p {
	text-align: center;
}

.box-rounded a {
	border:  none;
}

.box-rounded nav {
	margin: 10px 0;
}

.content-sub .speaker-header {
	background: url(../images/header-speakers-8.png) no-repeat;
	width: 209px;
	height: 151px;
	margin: 0 0 -12px 0;
	position: relative;
	z-index: 2;
	text-indent: -999em;
}

.box-rounded .speakers li {
	text-align: center;
	margin: 2px 0;
}

.box-rounded .speakers li a {
	display: block;
	padding: 5px 0;
	line-height: 1;
	color: #8A6C43;
	border: 0;
}

.box-rounded .speakers li a:hover,
.box-rounded .speakers li a:focus,
.box-rounded .speakers a.on {
	background: #fff;
	color: #632324;
}


/* @section inline nav */
.inline-nav {
	float: left;
	margin: -10px 20px 40px 0;
	width: 220px;
}

.inline-nav .bird {
	background: url(../images/header-speakers-8.png) no-repeat 50% -111px;	
	height: 40px;
	width: 60px;
	display: block;
	position: relative;
	z-index: 10;
	margin: 0 auto -12px auto;
}

.inline-nav .box-rounded.white {
	border-color: #e5e3da;
}

.inline-nav div {
	overflow: visible;
}

.inline-nav ul {
	margin: 20px 10px;
}

.inline-nav li {
	padding-left: 25px;
	margin: 5px 0;
	font-size: 17px;
}

.inline-nav .on {
	background: url(../images/on.png) no-repeat 0 55%;
}

.inline-nav a {
	font-weight: bold;
	text-transform: uppercase;
	border-bottom: 1px dotted #f5f4f1;
	letter-spacing: 1px;
}

.inline-nav .on a {
	color: #652627;
	border-color: #8A6C43;
}

.inline-nav a:hover {
	border-color: #8A6C43;
}

.intro {
	clear: both;
	overflow: visible !important;
	padding-bottom: 20px;
	margin-bottom: 20px;
	font-size: 15px;
}

/* @section programme tables */
.schedule {
	clear: both;
	margin: 10px 0 20px 0;
	width: 100%;
	border-bottom: 3px solid #e5e3da;
}

.schedule caption {
	font-weight: bold;
	font-size: 16px;
	text-align: left;
}

.schedule th,
.schedule td {
	padding: 4px;
	vertical-align: top;
}

.schedule tr:last-child td {
	padding-bottom: 20px;
}

.schedule th {
	text-align: left;
}

.schedule .title {
	width: 450px;
}

.schedule tbody td {
	border-bottom: 1px solid #e5e3da;
	padding: 4px 10px;
}

.schedule th {
	font-weight: normal;
}

.schedule th.prog-time {
	width: 80px;
	font-weight: normal;
}

.schedule .stream {
	width:  300px;
}

/*.schedule td a {
	display: block;
}*/


/* ------------------------------------------------------
OVERRIDES
@section overrides
--------------------------------------------------------- */
#pageContact .content-main,
#pageSponsors .content-main,
#pageRegister .content-main,
#pageVenue .content-main,
#pageProgramme .content-main {
	width: 763px;
}

#pageContact .content-main .t,
#pageSponsors .content-main .t,
#pageRegister .content-main .t,
#pageVenue .content-main .t,
#pageProgramme .content-main .t {
	background: url(../images/main-top-lg.png) no-repeat;
}

.indent-left {
	margin-left: 235px;
}

.lilregie a {
	width: 300px;
	height: 191px;
	overflow: hidden;
	text-indent: -999em;
	background: url(../images/button-register-8.png) no-repeat 0 0;
	bottom: 0;
	right: 0;
	border: 0;
	display: block;
}

.lilregie a:hover {
	background-position: 0 -192px;
}

.sponsorblurb {
	overflow: hidden;
	border-bottom:3px solid #E5E3DA;
	padding-bottom:15px;
	margin-bottom: 30px;
}

.sponsorblurb img {
	float: left;
	margin: 10px 30px 25px 0;
}

.sponsorblurb p {
	margin-left: 230px;
}

#upcoming {
	list-style-type: none;
	border-top: 1px dotted #9c8153;
	margin: 0 10px 10px 10px;
}

#upcoming li {
	border-bottom: 1px dotted #9c8153;
	margin-left: 0; 
	padding: 3px 0;
}

#upcoming a {
	font-weight: bold;
	dsiplay: block;
}


/* ------------------------------------------------------
PRINT
@section print
--------------------------------------------------------- */
/* 
inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/ 
*/
@media print {
	* { background: transparent !important; color: #444 !important; text-shadow: none; } 

	a, a:visited { color: #444 !important; text-decoration: underline; }

	abbr:after { content: " (" attr(title) ")"; }

	.ir a:after { content: ""; }  /* Don't show links for images */

	pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }

	img { page-break-inside: avoid; }

	@page { margin: 0.5cm; }

	p, h2, h3 { orphans: 3; widows: 3; }

	h2, h3{ page-break-after: avoid; }

	nav[role="navigation"],
	#speakers,
	#hero .register,
	.hr,
	.content-sub,
	.typekit-badge,
	.inline-nav,.bio figure .speaker-name, .presentation figure .speaker-name, .workshop figure .speaker-name {
		display: none !important;
	}
	
	#container,
	#hero .intro,
	.content-main,
	header[role="banner"] h1,
	header[role="banner"] h2,
	#main,
	.content-main .c {
		float: none;
		width: 100%;
		padding: 0;
		margin: 0;
		overflow: visible;
		top: auto;
		left: auto;
		right: auto;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
	}
	
	.hfeed article div,
	.bio figcaption {
		float: left;
		width: 90%;
	}
	
	header[role="banner"] h1,
	header[role="banner"] h2,
	header[role="banner"] h1 a,
	#hero .register {
		position: static;
		height: auto;
		text-indent: 0;
		background: none;
	}
	
	.speaker-name img {
		visibility: visible;
		float: left;
	}
	
	
}
