@charset "utf-8";

@media screen,projection {

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
display: block;
}
audio, canvas, video {
display: -moz-inline-stack;
display: inline-block;
*display: inline;
*zoom: 1;
}
audio:not([controls]) {
display: none;
}

html {
font-size: 100%;
overflow-y: scroll;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
border-top: 5px solid #b52121;
}
body {
width: 960px;
margin: 0 auto;
padding: 0 20px;
color: #404040;
font : 87.5%/1.43 constantia, palatino, 'palatino linotype', georgia,serif; /* 14px/20px */
background: #fff;
}

a {
color: #b52121;
-webkit-transition: color .4s;
}
a:focus {
outline: thin dotted;
}
a:hover, a:active {
color: #222;
outline: 0;
}

h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
font-size: 100%;
}
h1 {
margin-bottom: 1.5em;
text-transform: uppercase;
letter-spacing: 1px;
font-family: 'Open Sans', sans-serif;
}

h2 {
color: #606060;
margin: .72em 0;
}

h3 {
color: #606060;
}

p,ul, ol, dl {
margin: 0 0 1.5em 0;
}
ul, ol {
padding: 0 0 0 25px;
}
dd {
margin: 0 0 0 40px;
}
nav ul, nav ol {
list-style: none;
list-style-image: none;
}

button, input, select, textarea {
font-family: inherit;
}
abbr[title] {
border-bottom: 1px dotted;
}
b, strong { 
font-weight: bold; 
}
blockquote {
margin: 1em 40px;
}
dfn {
font-style: italic;
}
mark {
background: #ff0;
color: #000;
}
pre, code, kbd, samp {
font-family: monospace, monospace;
_font-family: 'courier new', monospace;
font-size: 100%;
}
pre {
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word;
}
q {
quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
content: '';
content: none;
}
small {
font-size: 75%;
}
sub, sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}

img {
border: 0;
-ms-interpolation-mode: bicubic;
}
svg:not(:root) {
overflow: hidden;
}
figure {
margin: 0;
}
form {
margin: 0;
}
fieldset {
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
border : 0;
}
legend {
border: 0;
*margin-left: -7px;
}
button, input, select, textarea {
margin: 0;
font-size: 100%;
vertical-align: baseline;
*vertical-align: middle;
}
button, input {
*overflow: visible;
line-height: inherit;
}
table button, table input {
*overflow: auto;
}
button, html input[type="button"], input[type="reset"], input[type="submit"] {
cursor: pointer;
-webkit-appearance: button;
}
input[type="checkbox"], input[type="radio"] {
box-sizing: border-box;
}
input[type="search"] {
-webkit-appearance: textfield;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
button::-moz-focus-inner, input::-moz-focus-inner {
padding: 0;
border: 0;
}
textarea {
overflow: auto;
vertical-align: top;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
th, td, caption {
vertical-align : top;
text-align : left;
font-weight : normal;
}

hr {
clear: both;
height: 6px;
margin: 18px 20px;
color: #eee;
border: 0;
border-radius: 3px;
background-color: #eee;
}

.clear:before, .clear:after {
content: ".";    
display: block;    
height: 0;    
overflow: hidden;	
}
.clear:after {
clear: both;
}
.clear {
zoom: 1;
}

/* ---   --- */

header {
position: relative;
width: 100%;
height: 180px;
margin: 0;
background: url(/assets/header.png) no-repeat 0 0 #fff;
-webkit-box-shadow: 5px 5px 0 rgba(0,0,0,.1);
-moz-box-shadow: 5px 5px 0 rgba(0,0,0,.1);
box-shadow: 5px 5px 0 rgba(0,0,0,.1);
}
header h1 {
position: absolute;
left: 20px;
top: 14px;
margin: 0;
width: 190px;
height: 120px;
text-indent: -999em;
background: url(/assets/b-story-productions.png) no-repeat 0 0 #fff;
}
header h1 a {
display: block;
width: 92px;
height: 92px;
margin-left: 48px;
border-radius: 50%;
}
header p {
position: absolute;
top: -999em;
left: -999em;
text-indent: -999em;
}

nav, #content, #margin {
display: inline;
float: left;
margin-right: 20px;
padding-bottom: 80px;
}
nav {
font-size: 92%;
font-family: 'Open Sans', sans-serif;
}
#content {
width: 440px;
}
#margin {
width: 300px;
margin-right: 0;
font-size: 92%;
}
footer {
clear: both;
padding: 20px 0;
color: #909090;
font-family: 'Open Sans', sans-serif;
font-size: 85.71%;
text-align: right;
}
#language {
position: absolute;
top: 10px;
left: 920px;
margin: 0;
padding: 0;
list-style: none;
}

/* ---   --- */

nav {
width: 170px;
margin-left: 5px;
font-family: 'Open Sans', sans-serif;
}
nav ul, nav li {
margin: 0;
padding: 0;
list-style: none;
}
nav a {
float: left;
width: 120px;
padding-left: 50px;
margin-bottom: 8px;
color: #101010;
line-height: 42px;
text-decoration: none;
background: url(/assets/arrow.png) no-repeat 0 0 #fff;
border-radius: 4px;
}
nav a:hover, nav .current a {
color: #b52121;
background-position: 0 -46px;
}
nav a:hover {
background-color: #f7f7f7;
background-color: rgba(0,0,0,.02);
}
nav .current li a {
color: #404040;
border-radius: 0;
}
nav .current li.current a {
color: #b52121;
}

nav ul ul a {
width: 120px;
margin-left: 50px;
padding-left: 0;
line-height: 30px;
padding-bottom: 14px;
background : none;
border-top: 1px dotted #404040;
}

#elsewhere {
margin: 8px 2px 8px;
height: 24px;
text-align: right;
}
#elsewhere li {
display: inline;
list-style: none;
}
.icon {
display: inline-block;
width: 24px;
height: 0;
padding-top: 24px;
overflow: hidden;
margin-left: 24px;
text-indent: -999em;
background-repeat : none;
background-position: 0 0;
background-image : url(/assets/icons.png);
}
.facebook:hover {
background-position: 0 -24px;
}
.twitter {
background-position: -48px 0;
}
.twitter:hover {
background-position: -48px -24px;
}
.vimeo {
background-position: -96px 0;
}
.vimeo:hover {
background-position: -96px -24px;
}
.rss {
background-position: -144px 0;
}
.rss:hover {
background-position: -144px -24px;
}

/* -- */
footer li {
list-style: none;
}

#sponsors {
width: 100%;
overflow: hidden;
margin: 0 0 40px;
padding: 20px 0 0;
border-top: 3px double #ccc;
}
#sponsors li {
float: left;
margin: 0;
padding: 0;
}
footer a, footer a:visited {
color: #909090;
text-decoration: none;
}

/* ---   --- */

#content ul {
padding-left: 0;
line-height: 2.14;
list-style-image: url(/assets/dot.png);
}
#content li:before {
}

.side {
position: relative;
max-width: 300px;
*width: 300px;
float: right;
margin-right: -320px;
}
.aside {
float: right;
width: 300px;
margin-right: -320px;
*margin-left: 20px;
}
.aside .side {
zoom: 1;
float: none;
margin: 0;
}

.news {
padding: 0 0 1.5em 0;
margin: 1.5em 0;
border-bottom: 1px double #ccc;
}
.meta {
margin: 0;
padding: 0 4px;
color: #909090;
text-align: right;
background-color: #f9f9f9;
background-color: rgba(0,0,0,.02);
border-radius: 4px;
}
#content .meta {
list-style: none;
}
.meta li {
display: inline-block;
margin-right: 1em;
}
.meta a {
color: #666;
text-shadow : 0 1px 1px rgba(255,255,255,1);
text-decoration: none;
}
.button {
display: inline-block;
padding: 0 2em;
line-height: 2.31; /* 30px */
color: #fff;
font-size: 92.8%;
font-family: 'Open Sans', sans-serif;
text-decoration: none;
text-transform: uppercase;
text-shadow: 0px 1px 0 #000;
background: #b52121;
border-radius: 4px;
box-shadow: 1px 1px 1px rgba(0,0,0,.4);
}
.back a {
display: block;
width: 42px;
height: 42px;
margin-top: 38px;
text-indent: -999em;
background: url(/assets/arrow_left.png) no-repeat 0 0 #fff;
}

#margin img, img.side, .side img {
display: block;
max-width: 300px;
border: 1px solid #909090;
-webkit-box-shadow: 5px 5px 0 rgba(0,0,0,.1);
-moz-box-shadow: 5px 5px 0 rgba(0,0,0,.1);
box-shadow: 5px 5px 0 rgba(0,0,0,.1);
}
#content iframe {
border: 1px solid #909090;
box-shadow: 4px 4px 1px rgba(0,0,0,.15);
}
.caption {
float: right;
position: relative;
top: -1px;
right: -1px;
margin-top: -1.43em;
padding: 0 20px;
font-family: 'Open Sans', sans-serif;
background: #f9f9f9;
background: rgba(255,255,255,.9);
}
#margin a  {
text-decoration: none;
}

/* ---   --- */

}	/* end media screen,projection */

@media print {

* { background: transparent !important; color: #000 !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; }
@page { margin: 1cm; }
body { font : 10pt/1.2 'Helvetica Neue',sans-serif; }
h1 { font-size : 140%; }
h2 { font-size : 120%; margin : 0 0 1em; }
h3, h4, h5, h6 { font-size : 100%; margin : 0; }
h2, h3 { page-break-after: avoid; }
p, h2, h3 { orphans: 3; widows: 3; }
p { margin : 0 0 1em; }
ul, ol { margin : 1em 0; }
li { margin : 0 0 0 1em; padding : 0; }
a, a:visited { text-decoration: underline; }
img { max-width: 100% !important; }
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; } /* h5bp.com/t */
tr, img { page-break-inside: avoid; }
hr { margin : 2em 0; border : 0; border-bottom : 1px solid #000;}


}

/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#fff;}
#colorbox{}
    #cboxContent{margin-top:32px; overflow:visible;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{background:#000; padding:1px;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
        #cboxLoadingOverlay{background:#000;}
        #cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}
        #cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose{text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(images/controls.png) no-repeat 0 0;}
        #cboxPrevious{background-position:0px 0px; right:44px;}
        #cboxPrevious.hover{background-position:0px -25px;}
        #cboxNext{background-position:-25px 0px; right:22px;}
        #cboxNext.hover{background-position:-25px -25px;}
        #cboxClose{background-position:-50px 0px; right:0;}
        #cboxClose.hover{background-position:-50px -25px;}
        .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
        .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
        .cboxSlideshow_on #cboxSlideshow.hover{background-position:-100px -25px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
        .cboxSlideshow_off #cboxSlideshow.hover{background-position:-75px -25px;}
