/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
    color: #00537a;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
    color: #00537a;
}

::-webkit-input-placeholder {
   color: #407e9b;
}

:-moz-placeholder { /* Firefox 18- */
   color: #407e9b;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #407e9b;  
}

:-ms-input-placeholder {  
   color: #407e9b;  
}

/*
 * A better looking default horizontal rule
 */

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

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

a, a:visited, a:link, a:active { text-decoration: none; -webkit-transition: color 0.1s; -moz-transition: color 0.1s; -ms-transition: color 0.1s; -o-transition: color 0.1s; transition: color 0.1s; }
a:hover { text-decoration: none; }
img, embed, object, video { max-width: 100%; }

/* layout */

body { background-color: #fff; /* bdc9e8 */ font: normal 100%/1.5 "skolar", Constantia, Lucida Bright, LucidaBright, Georgia, serif; font-weight: 400; text-rendering: optimizeLegibility; }
html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
.group:before, .group:after { content: ""; display: table; } 
.group:after { clear: both; }
.group { zoom: 1; /* For IE 6/7 (trigger hasLayout) */ }
.page-wrap { width: 100%; margin: 0 auto; }
.break { width: 100%; float: left; display: inline; margin: 0 0 1.375em 0; border: 0; }
.off { display: inline; } 

/* masthead */

.site-header { width: 100%; float: left; display: inline; margin: 0; padding: 1.375em 0 1.375em 0; background-color: #fff; }
.masthead { width: 90%; max-width: 960px; margin: 0 auto; }
.logo { width: 15%; float: left; display: inline; margin: 0; }
.logo img { width: 100%; display: block; }

/* nav */

.nav { width: 85%; float: left; display: inline; text-align: right; margin: 0; padding: 1.375em 0 0 0; }
.nav ul { float: right; display: inline; padding: 0; margin: 0; }
.nav ul li { display: inline-block; padding: 0; margin: 0; list-style: none; }

.nav ul li a { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.125em; font-weight: 400; color: #999; padding: 0.6875em 0.6875em 0.3875em 0.6875em; display: block; text-decoration: none; margin: 0; white-space: nowrap; }
.nav ul li a:hover { color: #000; text-decoration: none; }

.nav ul li.drop a { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.125em; font-weight: 400; color: #999; padding: 0.6875em 0.6875em 0.3875em 0.6875em; display: block; text-decoration: none; margin: 0; white-space: nowrap; }
.nav ul li.drop a:hover { color: #fff; text-decoration: none; background-color: #00537a; }

.nav ul li.here a { font-weight: 400; color: #000; text-decoration: none; }
.nav ul li.here a:hover { color: #000; }

.nav ul li.drop.here a { font-weight: 400; color: #000; text-decoration: none; }
.nav ul li.drop.here a:hover { color: #fff; }

/* drop downs */

.nav ul li ul { margin: 0; padding: 0 0 0.3875em 0; background-color: #00537a; }
.nav ul li.drop:hover { background-color: #00537a; color: #fff; }
.nav ul li ul li { width: 100%; display: block; margin: 0; padding: 0; text-align: left; }
.nav ul li ul li a:hover { color: #fff; }

.nav ul li.drop.here ul li a { font-weight: 400; color: #999; text-decoration: none; }
.nav ul li.drop.here ul li a:hover { font-weight: 400; color: #fff; text-decoration: none; }
.nav ul li.drop.here:hover a { background-color: #00537a; color: #999; }
.nav ul li.drop.here:hover a:hover { color: #fff; }

/* super_fish */

.sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; z-index: 9999; }
.sf-menu li { position: relative; z-index: 9999; }
.sf-menu ul { width: 15em; position: absolute; display: none; top: 100%; left: 0; z-index: 9999; }
.sf-menu > li { float: left; }
.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul { display: block; cursor: pointer; }
.sf-menu a { display: block; position: relative; }
.sf-menu ul ul { top: 0; left: 100%; }

/* tagline */

.tagline-bg { width: 100%; float: left; display: inline; padding: 1.375em 0 1.375em 0; margin: 0; background: #25aae2 url('../img/brushed_alu_@2X.png') repeat 0 0; }
.tagline { width: 90%; max-width: 960px; margin: 0 auto; text-align: center; }
.tagline header h2 { color: #fff; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 2.25em; line-height: 1.2em; margin: 0 0 0.1875em 0; font-weight: 700; padding: 0; }
.tagline p { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.5em; margin: 0; font-weight: 400; color: #c8eaf8; padding: 0; }
.tagline p a { font-weight: 700; color: #00537a; text-decoration: underline; }
.tagline p a:hover { color: #000; text-decoration: underline; }

/* feature */

.feature-bg { background: #e3ecf0 url('../img/light_brushed_alu_@2X.png') repeat 0 0; width: 100%; float: left; display: inline; padding: 1.375em 0 0 0; margin: 0; }
.feature { width: 90%; max-width: 960px; margin: 0 auto; }
.feature img { display: block; }
.slides { float: left; display: inline; margin: 0 0 1.375em 0; padding: 0; }
.figcaption header { margin: 0; padding: 0; }
.figcaption header h3 { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-weight: 700; color: #000; font-size: 1.125em; line-height: 1.1em; margin: 0 0 0.1875em 0; padding: 0; }
.figcaption p { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; color: #999; margin: 0; padding: 0; }
.figcaption p a { color: #fff; text-decoration: underline; }
.figcaption p a:hover { text-decoration: none; }
.figcaption { right: 0.6875em; bottom: 0.6875em; position: absolute; z-index: 15; background-color: #000; background: rgba(255, 255, 255, 0); padding: 0.3875em 0.6875em 0.3875em 0.6875em; width: 50%; text-align: right; }

/* main */

.section-bg { width: 100%; float: left; display: inline; padding: 1.375em 0 1.375em 0; margin: 0; background: #00547a url('../img/dark_brushed_alu_@2X.png') repeat 0 0; }
.section { width: 90%; max-width: 960px; margin: 0 auto; }
.col-100 { width: 100%; float: left; display: inline; margin: 0; padding: 0; }
.col-20 { width: 16.66666666666667%; float: left; display: inline; margin: 0; padding: 0; }
.col-66 { width: 66.66666666666666%; float: left; display: inline; margin: 0; padding: 0; }
.col-33 { width: 33.33333333333333%; float: left; display: inline; margin: 0; padding: 0; }
.margin-left { float: left; display: inline; margin: 0 0 0 1.375em; }
.margin-right { float: left; display: inline; margin: 0 1.375em 0 0; }
.right { margin: 0 1.375em 0 0; }
.margin-top { margin: 1.375em 0 0 0; }
.block { width: 100%; float: left; display: inline; margin: 0 0 0.6875em 0; padding: 0; }
.main { width: 75%; float: left; display: inline; margin: 0; padding: 0; }
.block-50 { width: 50%; float: left; display: inline; margin: 0 0 0.6875em 0; padding: 0; }
.copy h1 { color: #fff; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 2em; line-height: 1.2em; margin: 0 0 0.6875em 0; font-weight: 700; padding: 0; }
.copy h2 { color: #5cbfe9; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.25em; line-height: 1.2em; margin: 0 0 0.1875em 0; font-weight: 700; }
.copy h3, .copy h4, .copy h5 { color: #fff; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.2em; line-height: 1.2em; margin: 0.9875em 0 0.3875em 0; font-weight: 700; }
.copy p { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.5em; margin: 0 0 0.9875em 0; font-weight: 400; color: #bfd4de; padding: 0; }
.copy p a { color: #92d5f1; text-decoration: underline; }
.copy p a:hover { color: #fff; text-decoration: underline; }
.copy p strong { color: #fff; font-weight: 700; }
.copy ul { display: block; margin: 0 0 0.6875em 0; }
.copy ul li { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.5em; margin: 0 0 0.3875em 0; font-weight: 400; color: #fff; padding: 0; list-style: circle; }
.copy ol { display: block; margin: 0 0 0.6875em 2.75em; }
.copy ol li { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.5em; margin: 0 0 0.3875em 0; font-weight: 400; color: #fff; padding: 0; list-style: circle; }

.copy h6 { color: #fff; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.25em; line-height: 1.2em; margin: 0.9875em 0 0.3875em 0; font-weight: 700; }
.copy h6 a { color: #5cbfe9; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.25em; line-height: 1.2em; margin: 0.9875em 0 0.3875em 0; font-weight: 700; text-decoration: none; }
.copy h6 a:hover { color: #fff; text-decoration: underline; }

/* downloads */

.downloads h1 { color: #fff; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 2em; line-height: 1.2em; margin: 0 0 0.6875em 0; font-weight: 700; padding: 0; }
.downloads h2 { color: #5cbfe9; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.2em; margin: 0 0 0.1875em 0; font-weight: 700; }
.downloads ul { display: block; margin: 0.6875em 0 0 0; padding: 0; }
.downloads ul li { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.8125em; line-height: 1.5em; margin: 0 0 0.3875em 0; font-weight: 400; color: #fff; padding: 0 0 0.3875em 0; list-style: none; border-bottom: 1px solid #00547a; }
.downloads ul li a { color: #bfd4de; text-decoration: none; }
.downloads ul li a:hover { color: #fff; text-decoration: underline; }
.dp { padding: 0 0.6875em 0 0; }

/* images */

.entry-figure { width: 45%; float: right; display: inline; margin: 0.6875em 0 1.375em 1.375em;  }
.entry-figure img { width: 100%; display: block; }
.entry-figure-left { width: 45%; float: left; display: inline; margin: 0.6875em 2.75em 1.375em 0;  }
.entry-figure-left img { width: 100%; display: block; }
.entry-figure-right { width: 45%; float: right; display: inline; margin: 0.6875em 0 1.375em 2.75em;  }
.entry-figure-right img { width: 100%; display: block; }
.entry-video { width: 50%; float: left; display: inline; margin: 0 0 0.6875em 0;  }
.video-padding { margin: 0 1.375em 0.6875em 0; }

/* cta */

.cta { width: 100%; float: left; display: inline; margin: 0 0 1.375em 0; padding: 0; border: 0; }
a.btn { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.125em; font-weight: 700; color: #fff; padding: 0.3875em 0.9875em; display: inline-block; text-decoration: none; background-color: #1f688a; margin: 0.6875em 0 0 0; -o-border-radius: 10px; -ms-border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -webkit-transition: background-color 0.1s; -moz-transition: background-color 0.1s; -ms-transition: background-color 0.1s; -o-transition: background-color 0.1s; transition: background-color 0.1s; }
a.btn:hover { color: #fff; background-color: #1f688a; text-decoration: none; }

/* video */

.video { margin: 0 0 1.375em 0; }
.video p { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; /* 18px / 16px */ line-height: 1.5em; margin: 0.6875em 0 0.6875em 0; /* 24px / 16px */ font-weight: 400; color: #5f6a6f; padding: 0; }
.video p a { color: #e86d1f; text-decoration: underline; }
.video p a:hover { color: #000; text-decoration: underline; }

/* subnav */

.subnav { width: 25%; float: left; display: inline; margin: 0; padding: 0; }
.subnav h3 { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.125em; /* 24px / 16px */ line-height: 1.6em; font-weight: 700; color: #00537c; margin: 0 0 0.3875em 0; }
.subnav ul { margin: 0; padding: 0 0 0.6875em 0; }
.subnav ul li { margin: 0 0 0.3875em 0; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; line-height: 1.5em; font-size: 1em; padding: 0; /* 24px / 16px */ font-weight: 400; color: #fff; list-style: none; }
.subnav ul li a { color: #92d5f1; text-decoration: underline; }
.subnav ul li a:hover { color: #fff; text-decoration: underline; }
.subnav ul li.here a { color: #fff; text-decoration: none; }
.subnav ul li.here a:hover { color: #fff; text-decoration: none; }

/* sidebar */

.sidebar { width: 25%; float: left; display: inline; margin: 0; padding: 0 0 0.6875em 0; }
.sidebar h3 { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.125em; line-height: 1.6em; font-weight: 700; color: #fff; margin: 0 0 0.3875em 0; }
.sidebar p { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.875em; line-height: 1.6em; margin: 0 0 0.6875em 0; font-weight: 400; color: #bfd4de; padding: 0; }
.sidebar p a { color: #92d5f1; text-decoration: underline; }
.sidebar p a:hover { color: #fff; text-decoration: none; }
.border-bottom { border-bottom: 5px solid #25aae2; }

.sidecopy h3 { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.125em; line-height: 1.6em; font-weight: 700; color: #fff; margin: 0 0 0.3875em 0; }
.sidecopy p { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.875em; line-height: 1.6em; margin: 0 0 0.6875em 0; font-weight: 400; color: #bfd4de; padding: 0; }
.sidecopy p a { color: #92d5f1; text-decoration: underline; }
.sidecopy p a:hover { color: #fff; text-decoration: none; }

/* slats */

.slats { width: 100%; float: left; display: inline; margin: 0; padding: 0; }
.slats p { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.5em; margin: 0 0 0.6875em 0; font-weight: 400; color: #444; padding: 0; }
.slats p a { color: #92d5f1; text-decoration: none; }
.slats p a:hover { color: #fff; text-decoration: none; }
.slats ul { margin: 0.6875em 0 1.375em 0; padding: 0 0 0 2.75em; }
.slats ul li { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.5em; margin: 0 0 0.3875em 0; font-weight: 400; color: #fff; padding: 0; list-style: circle; }
.slats ul li a { color: #92d5f1; text-decoration: underline; }
.slats ul li a:hover { color: #fff; text-decoration: none; }

/* pdfs */

.pdfs { width: 25%; float: left; display: inline; margin: 0; padding: 0; }
.pdfs h3 { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.125em; line-height: 1.6em; font-weight: 700; color: #fff; margin: 0 0 0.3875em 0; }
.pdfs ul { margin: 0 0 0.9875em 0; padding: 0 0 0.6875em 0; border-bottom: 5px solid #25aae2; }
.pdfs ul:last-child { border-bottom: 0px; }
.pdfs ul li { margin: 0 0 0.3875em 0; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; line-height: 1.5em; font-size: 1em; padding: 0; font-weight: 400; color: #fff; list-style: none; }
.pdfs ul li a { color: #92d5f1; text-decoration: underline; }
.pdfs ul li a:hover { color: #fff; text-decoration: none; }
.pdfs ul li.here a { color: #fff; text-decoration: none; }
.pdfs ul li.here a:hover { color: #fff; text-decoration: none; }

/* stockists */

.stockists { width: 33.33333333333333%; float: left; display: inline; margin: 0.3875em 0 0 0; padding: 0;  }
.stockists h2 { color: #5cbfe9; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.25em; line-height: 1.2em; margin: 0 0 0.3875em 0; font-weight: 700; }
.stockists p { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.875em; line-height: 1.4em; margin: 0 0 0.3875em 0; font-weight: 400; color: #bfd4de; padding: 0; }
.stockists p strong { color: #fff; }
.stockists p a { color: #fff; text-decoration: underline; }
.stockists p a:hover { color: #fff; text-decoration: none; }
.stockists ul { margin: 0.6875em 0 0 0; padding: 0; }
.stockists li { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.8125em; line-height: 1.4em; margin: 0 0 0.6875em 0; font-weight: 400; color: #bfd4de; padding: 0; list-style: none; }

/* form */

.booking { margin: 1.375em 0 0 0; }
.booking label { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.75em; font-weight: 700; color: #fff; line-height: 1.125em; margin: 0 0 0.6875em 0; display: block; text-transform: uppercase; }
.booking label span { color: #25aae2; }
.text_field { width: 50%; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.875em; font-weight: 400; color: #fff; padding: 0.3875em; margin: 0 0 0.9875em 0; border: 2px solid #407e9b; background: transparent; }
.email_field { width: 75%; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.875em; font-weight: 400; color: #fff; padding: 0.3875em; margin: 0 0 0.9875em 0; border: 2px solid #407e9b; background: transparent; }
.textarea_field { width: 90%; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.875em; font-weight: 400; color: #fff; padding: 0.3875em; margin: 0 0 0.9875em 0; height: 7em; border: 2px solid #407e9b; background: transparent; }
.number_field { width: 25%; font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.875em; font-weight: 400; color: #fff; padding: 0.3875em; margin: 0 0 0.9875em 0; border: 2px solid #407e9b; background: transparent; }
.btn_submit { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.125em; font-weight: 700; color: #fff; padding: 0.3875em 0.9875em; display: inline-block; text-decoration: none; background-color: #1f688a; margin: 0.6875em 0 0 0; -o-border-radius: 10px; -ms-border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -webkit-transition: background-color 0.1s; -moz-transition: background-color 0.1s; -ms-transition: background-color 0.1s; -o-transition: background-color 0.1s; transition: background-color 0.1s; border: 0px; }
.btn_submit:hover { color: #fff; background-color: #1f688a; text-decoration: none; }
.error { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.75em; font-weight: 700; color: #e8860c; margin: 0 0 0.3875em 0; display: block; }

/* assets */

.assets-bg { width: 100%; float: left; display: inline; padding: 1.375em 0 0 0; margin: 0; background-color: #fff; }
.assets { width: 90%; max-width: 960px; margin: 0 auto; }
.assets-right { float: left; display: inline; margin: 0 1.375em 0 0; }
.assets p { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; /* 18px / 16px */ line-height: 1.5em; margin: 0.6875em 0 0.6875em 0; font-weight: 400; color: #666; padding: 0; }
.assets p a { color: #e86d1f; text-decoration: underline; }
.assets p a:hover { color: #000; text-decoration: underline; }

/* footer */

.footer-bg { width: 100%; float: left; display: inline; margin: 0; padding: 1.375em 0; }
.footer { width: 90%; max-width: 960px; margin: 0 auto; }
.footer p { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 0.875em; line-height: 1.6em; font-weight: 400; color: #999; margin: 0 0 0.6875em 0; }
.footer p span { color: #999; }
.footer p a { color: #00537c; text-decoration: underline; }
.footer p a:hover { color: #000; text-decoration: underline; }

/* news */

.col-100 { width: 100%; float: left; display: inline; }
.news { background-color: #fff; }
.entry { width: 85%; float: left; display: inline; margin: 0; padding: 0; }
.back { width: 15%; float: left; display: inline; }
.back a { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.5em; color: #92d5f1; text-decoration: none; }
.back a:hover { color: #fff; text-decoration: underline; }
.pb { padding-bottom: 0.682em; }
.mb { margin-bottom: 0.682em; }
.pt { padding-top: 0; }
.ml { margin-left: 2.75em; }
.copy p.date { color: #406e90; }
.news-figure { width: 50%; float: right; display: inline; margin: 0.6875em 0 1.375em 1.375em; } 
.news-figure img { width: 100%; display: block; }

/* mobile */

.nav ul li.mobile-hide { display: none; }
.nav-hide { display: inline; }
.hide { display: none; }
.mobile_bg { width: 100%; margin: 0; background: #000 url('../img/black_brushed_alu_@2X.png') repeat 0 0; }
.mobile { width: 100%; max-width: 960px; margin: 0 auto; }
.mobile ul li { float: right; display: inline; margin: 0; padding: 0; }
.mobile ul li a { display: block; padding: 0.6875em 0.6875em 0.4875em 0.6875em; margin: 0; outline: 0px; }
#mobile_nav ul { margin: 0; padding: 0; }
#mobile_nav { float: right; display: inline; }
#mobile_nav ul li { width: 100%; list-style: none; float: left; display: block; margin: 0; padding: 0; }
#mobile_nav ul li a { font-family: "jaf-facitweb", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.125em; display: block; padding: 0.3875em 1.375em; text-decoration: none; color: #999; border-bottom: 3px solid #333; }
#mobile_nav ul li a:hover { color: #fff; }
#mobile_nav ul li:last-child a { border-bottom: 0px; }

.mobile-nav { padding: 0 0 0.1875em 0; opacity: .5; }
.nav ul li.mobile-hide a { color: #999; font-weight: 400; }
.nav ul li.mobile-hide a:hover { color: #000; }
.nav ul li.mobile-hide a:hover img { opacity: 1; }

/* responsive */

@media only screen and (max-width: 960px) { 
  .logo { width: 25%; }
  .nav { width: 75%; }
  .nav { padding: 0; }
  .nav ul li.nav-hide { display: none; }
  .nav ul li.mobile-hide { display: inline; }
  .mobile_nav { display: inline; }
}
@media only screen and (max-width: 768px) { 
  .logo { width: 30%; }
  .nav { width: 70%; }
  .col-66 { width: 100%; }
  .col-33 { width: 100%; }
  .off { display: none; }
  .margin-left { margin: 0; }
  .margin-right { margin: 0; }
  .pdfs { width: 100%; }
  .main { width: 100%; margin: 0 0 1.375em 0; }
  .subnav { width: 100%; margin: 0 0 1.375em 0; }
  .col-20 { width: 100%; }
  .downloads ul { margin: 0.6875em 0 1.375em 0; }
}
@media only screen and (max-width: 480px) {
  .logo { width: 50%; }
  .nav { width: 50%; }
  .figcaption { display: none; }
  .tagline header h2 { font-size: 1.5em; }
  .copy h1 { font-size: 1.5em; line-height: 1.4em; }
  .entry-figure-right { width: 100%; }
  .entry-figure-left { width: 100%; }
  .stockists { width: 100%; }
  .break { margin: 0; }
  .stockists h2 { font-size: 1.125em; }
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

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

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

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

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

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

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