/* _________________________________________________

320 and Up boilerplate extension
Andy Clarke http://about.me/malarkey
Keith Clark
Version: 2
URL: http://stuffandnonsense.co.uk/projects/320andup/
License: http://creativecommons.org/licenses/MIT/
_____________________________________________________

1 ROOT
2 HEADINGS
3 TYPOGRAPHY
4 LINKS
5 FIGURES & IMAGES
6 TABLES
7 FORMS
8 BANNER
9 NAVIGATION
10 CONTENT
11 MAIN
12 COMPLEMENTARY
13 CONTENTINFO
14 GLOBAL OBJECTS
15 VENDOR-SPECIFIC
16 MODERNIZR
17 TEMPLATE SPECIFICS
18 MEDIA QUERIES

COLOURS

body text : rgb(150,150,150)
main nav items : rgb(192,180,169)
section headings : rgb(189,191,193)

*/

/*  TYPE */

/*
@font-face {
    font-family: 'DezenStencil03_Light';
    src: url('http://www.thelighthouse.co.uk/assets/type/1FF010_0_0.eot');
    src: url('http://www.thelighthouse.co.uk/assets/type/1FF010_0_0.eot?#iefix') format('embedded-opentype'),
         url('http://www.thelighthouse.co.uk/assets/type/1FF010_0_0.woff') format('woff'),
         url('http://www.thelighthouse.co.uk/assets/type/1FF010_0_0.ttf') format('truetype'),
         url('http://www.thelighthouse.co.uk/assets/type/dezenstencil03light-webfont.svg#DezenStencil03_Light') format('svg');
    font-weight: normal;
    font-style: normal;
}
*/


@font-face {
    font-family: 'PF-DIN-Stencil-Thin';
    src: url('http://www.thelighthouse.co.uk/assets/type/pfdin/pfdin.eot');
    src: url('http://www.thelighthouse.co.uk/assets/type/pfdin/pfdin.eot?#iefix') format('embedded-opentype'),
         url('http://www.thelighthouse.co.uk/assets/type/pfdin/pfdin.woff') format('woff'),
         url('http://www.thelighthouse.co.uk/assets/type/pfdin/pfdin.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}




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

audio[controls], canvas, video {
display : inline-block;
*display : inline;
*zoom : 1; }

/* 1. ROOT ============================================================================= */

html {
overflow-y : scroll;
background-color : rgb(47,49,49);
/* -webkit-font-smoothing: antialiased;*/
/*background : rgb(128,184,229) url(../img/tmp/grid.png) repeat-y 50% 0;*/ }

body {
margin : 10px auto;
padding : 0;
width : 90%;  /* 252px */
font : 100%/1.5 Arial, Helvetica, sans-serif;
color : rgb(150,150,150);
background-color : transparent;
font-weight: normal;
-webkit-font-smoothing: antialiased;
}

body#lha .loggedin {
  -webkit-font-smoothing: subpixel-antialiased;
}


button,
input,
select,
textarea {
font-family : "Helvetica Neue", Helvetica, Arial, sans-serif;
color : rgb(40,40,40); }

/* 2. HEADINGS (320 and Up typography defaults) ==================================================== */

h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "PF-DIN-Stencil-Thin", Verdana, sans-serif; font-size-adjust:0.5; font-weight:100; font-style:normal;
color: rgb(189,191,193); }

h1 {
margin-bottom : .75em;
font-size : 3em; /* 36 / 12 */
line-height : 1.2;
color: rgb(175,177,175); }

h2 {
margin-bottom : .75em;
font-size : 2.25em; /* 27 / 12 */
line-height : 1.2;
letter-spacing: 1px; }

h3 {
margin-bottom : 1em;
font-size : 1.58333em; /* 19 / 12 */
line-height : 1.3; }

h4 {
margin-bottom : 1.25em;
font-size : 1.25em; /* 15 / 12 */
line-height : 1.25; }

h5 {
margin-bottom : 1.5em;
font-size : 1em; /* 12 / 12 */ }

h6 {
font-size : 1em; /* 12 / 12 */ }



h1#site-name {
  display: block;
  background-size: 145px 69px;
  width: 145px;
  height: 69px;
  text-indent: -3000px;
  background: transparent url(http://www.thelighthouse.co.uk/img/interface/logo-blue-mobile.gif) no-repeat left top;
  margin: 0 0 16px 0;
}

@media only screen and (-Webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {
  h1#site-name {
    background-image: url(http://www.thelighthouse.co.uk/img/interface/logo-blue-mobile-@2x.png);
    background-size: 145px 70px;
  }
}


/* 3. TYPOGRAPHY (320 and Up typography defaults) ============================================================================= */

p,
ol,
ul,
dl,
address {
margin-bottom : 1.5em;
font-size : 0.75em; /* 12 / 16 */ }

p {
hyphens : none;
text-align : left; }

ul,
ol {
margin : 0 0 1.5em -24px;
padding : 0 0 0 24px;
list-style-type: none; }

li {
  margin-bottom: .3em;
}

li ul,
li ol {
margin : 0;
font-size : 1em; /* 12 / 12 */ }

dl,
dd {
margin-bottom : 1.5em; }

dt {
font-weight : normal; }

blockquote  {
margin : 0 0 1.5em -24px;
padding-left : 24px;
border-left : 1px solid rgb(200,200,200);
font-style : italic; }

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

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

b, strong {
font-weight : bold; }

dfn {
font-style : italic; }

hr {
display : block;
margin : 1em 0;
padding : 0;
height : 1px;
border : 0;
border-top : 1px solid rgb(204,204,204); }

ins {
background-color : rgb(240,240,240);
color : rgb(0,0,0);
text-decoration : none; }

mark {
background-color : rgb(240,240,240);
color: rgb(0,0,0);
font-style : italic;
font-weight : bold; }

pre,
code,
kbd,
samp {
font-family : monospace, monospace;
_font-family : 'courier new', monospace;
font-size : .875em;
line-height : 1.5; }

pre {
white-space : pre;
white-space : pre-wrap;
word-wrap : break-word; }

q {
quotes : none; }

q:before,
q:after {
content : "";
content : none; }

small {
font-size : 1em; /* 12 / 12 */ }

sub, sup {
font-size : 75%;
line-height : 0;
position : relative;
vertical-align : baseline; }

sup {
top : -.5em; }

sub {
bottom : -.25em; }

/* Site Typo styles */
.light {
  color: rgb(182,170,159);
}
h2#who {
  display: none;
}

/* 4.LINKS ============================================================================= */

a {
color : rgb(182,170,159);
text-decoration: none; }

a:visited {
color : rgb(180,172,162); }

a:focus {
outline :  none; }

a:hover, a:active {
  color: rgb(255,255,255);
}


/* Blue classes */
.blue, a.blue:visited, .blue li a {
  color: rgb(0,174,239);
}
.blue li a:active, .blue li a:hover {
  color: rgb(255,255,255);
}
.blue li, .orange li {
  color: rgb(150,150,150);
}

/* Orange classes */
.orange, a.orange:visited, .orange li a, input.orange {
  color: rgb(246,142,30);
}
.orange li a:active, .orange li a:hover {
  color: rgb(255,255,255);
}


a.white, a.white:visited {
  color: #fff;
}
/* 5.FIGURES & IMAGES ============================================================================= */

figure {
margin-bottom : 1.5em; }

figure img,
figure object,
figure embed {
/* margin-bottom : .75em; */
margin-bottom : 6px;
max-width : 100%; }

figcaption {
display : block;
font-weight : normal; }

img {
border : 0; }

svg:not(:root) {
overflow : hidden; }

.column img {
  max-width: 100%;
}

/* 6.TABLES ============================================================================= */

table {
border-collapse : collapse;
border-spacing : 0;
border: none;
margin-bottom : 1.4em;
width : 100%;
font-size : .875em; /* 14 / 16 = .875 */ }

th, td, caption {
padding : .25em 10px .25em 5px;
border: 1px solid rgb(50,50,50);
background-color: rgb(69,69,69);
font-family: Arial, helvetica, sans-serif;
font-weight: normal;
}

th {
  background-color : transparent;
  border: none;
  text-align: left;
}

tfoot {
font-style : italic; }

caption {
background-color : transparent; }

/* 7.FORMS ============================================================================= */

form {
margin : 0; }

fieldset {
margin-bottom : 10px;
padding : 0;
border-width : 0; }

legend {
*margin-left : -7px;
padding : 0;
border-width : 0; }

label {
font-weight : normal;
font-family: Arial, helvetica, sans-serif;
font-size: 12px;
cursor : pointer;
border-bottom: 1px solid #646464;
display: block;
padding: 4px 0;
color: rgb(192, 180, 169);
}

#lha label {
  margin-top: 8px;
}

button,
input,
select,
textarea {
font-size : 100%;
margin : 0;
vertical-align : baseline;
*vertical-align : middle; }

button, input {
line-height : normal;
*overflow : visible; }

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
cursor : pointer; }

input[type="checkbox"],
input[type="radio"] {
box-sizing : border-box; }

input[type="search"] {
box-sizing : content-box; }

button::-moz-focus-inner,
input::-moz-focus-inner {
padding : 0;
border : 0;  }

textarea {
overflow : auto;
vertical-align : top; }

/* Colors for form validity */
input:valid,
textarea:valid   {
/* Styles */ }


/* Grid System */
.border-top {
  border-top: 1px solid #646464;
  padding: 30px 0;
}
.border-bottom {
  border-bottom: 1px solid #646464;
}

div.column p:first-child {
  margin-top: 0;
}

div.column h2:first-child {
  margin-top: 0;
}

div#tweets-col {
  display: none;
  word-wrap: break-word;
}
div#tweets-col h2 {
  color: #C0B4A9;
  font-family: Arial;
  font-size: 12px;
  letter-spacing: normal;
  margin-top: 0;
  line-height: 1.3;
}
div#tweets-col h2#who {
  color: #969696;
  margin-bottom: 46px;
}
div#tweets-col h2#twit-title {
  font-size: 14px;
  margin-bottom: 19px;
  border-top: 1px solid rgb(81,83,72);
  margin-top: 20px;
  padding-top: 15px;
}
h2#title {
  margin: 17px 0 28px 0;
  font-size: 23px;
  color: rgb(210,202,204);
}
h2#title a {
  color: rgb(210,202,204);
}
h2#title b {
  display: block;
}
h2#title a:hover, h2#title a:active {
  color: rgb(255,255,255);
}

h2#title b {
  font-weight: normal;
  color: #fff;
}

h2 {
  font-size: 27px;
}

h2 b {
  font-weight: normal;
}

/* 8 BANNER     ============================================================================= */
header[role="banner"] {
  margin-bottom: 30px;
}

header[role="banner"] div.create {
  clear: both;
}
div#search-form {
  margin-bottom: 14px;
  color: rgb(192,180,169);
  display: none;
}
div#search-form input {
  color: #ccc;
  background-color: #2F3131;
  border: none;
  font-family: Arial, helvetica, sans-serif;
  font-size: 12px;
  color: rgb(192,180,169);
  margin-bottom: 13px;
  display: none;
}
/* 9 NAVIGATION   ============================================================================= */
nav[role="navigation"] {
  width: 130px;
  float: left;
  margin-left: 0;
  margin-right: 10px;
  margin-bottom: 0;
  padding-left: 0;
  border-top: 1px solid rgb(81,83,72);
  border-bottom: 1px solid rgb(81,83,72);

}
nav[role="navigation"] ul {
  display: none;
}
nav[role="navigation"] ul li {
  margin-bottom: 6px;
}
nav[role="navigation"] ul li a {
  font-size: 14px;
}
nav[role="navigation"] h2 {
  margin-top: 0;
  margin-bottom: 0;
  cursor: pointer;
  font-size: 23px;
  padding: 4px 0;
}
nav[role="navigation"] h2 span {
  font-size: 18px;
}
nav[role="navigation"] ul li:first-child {
  display: block;
}
nav li a {
  color: rgb(192,180,169);
}
nav li a:hover, nav li a:active {
  color: rgb(255,255,255);
}

header[role="banner"] div.create nav, header[role="banner"] div.last nav {
  border-top: none;
}

/* 10 CONTENT     ============================================================================= */
article h1, article h2, article h3, article h4, article h5 {
  font-family: Arial, helvetica, sans-serif;
  font-size: 12px;
  color: rgb(192,180,169);
  margin: 0 0 0 0;
  line-height: 1;
  text-transform: uppercase;
  min-height: 25px;
}
article p:first-child {
  color: #C0B4A9;
}
article a, article a:hover, article a:visited {
  color: rgb(0,174,239);
}

article.orange a, article.orange a:hover, article.orange a:visited {
  color: rgb(246,142,30);
}

.grid-1 article, .grid-2 article {
  padding-top: 13px;
}

article p {
  margin-top: 2px;
  margin-bottom: 14px;
  line-height: 1.4;
  font-size: 13px;
  color: rgb(150,150,150);
}

article p.highlight, span.highlight {
  color: rgb(192,180,169);
}

ul.tweets li {
  margin-bottom: 16px;
  line-height: 1.4;
  padding-right: 10px;
  color: #787878;
}
ul.tweets li span {
  display: block;
}

ul.tweets li a {
  color: #787878;
  text-decoration: none;
}

a.follow {
  font-size: 12px;
  margin-top: 32px;
  display: block;
}
a.follow:hover, a.follow:active {
  color: rgb(255,255,255);
}


/* 11 MAIN      ============================================================================= */
video {
  max-width: 100%;
}
iframe {
  max-width: 100%;
}

figure {
  margin: 0;
  padding: 0;
  position: relative;
  max-width: 100%;
}

/* Carousels */
.flexslider ul li {
  padding: 0;
  margin: 0;
  position: relative;
}

ul li figure {
  position: relative;
  margin: 0;
  z-index: 1;
}
.column figcaption {
  position: absolute;
  display: block;
  bottom: 14px;
  background-color: rgba(0,159,238, .88);
  width: 100%;
}
.orange figcaption {
  background-color: rgba(246,142,30, .90);
}
.oldie .column figcaption {
  position: absolute;
  width: 100%;
  display: block;
  bottom: -10px;
  background-color: rgb(0,159,238);
  left: 0;
  /*opacity: .75;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
  filter: alpha(opacity=75);*/
  z-index: 9;
}

.column figcaption h3 {
  margin: 10px 14px 0 14px;
  color: #fff;
  font-size: 21px;
  line-height: .99;
}
.column div#flexslider-1 figcaption h3 {
  font-size: 25px;
}
.column figcaption h3 .date {
  display: block;
  font-size: 17px;
  color: #000;
  margin-top: 5px;
}
.column div#flexslider-1 figcaption .date {
  font-size: 19px;
}
img.skew {
  position: absolute;
  top: 0;
  left: 0;
}
img.skew-bottom {
  position: relative;
  top: 12px;
  right: 0;
}

.grid-2 img.skew-bottom {
  top: 12px;
}

.ie7 img.skew-bottom {
  top: 10px;
}

/* flexslider-1 */
.flexslider {width: 100%; margin: 0; padding: 0;}
.flexslider .slides > li {display: none;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {max-width: 100%; display: block;}



#flexslider-1 {
  /*height: 766px;*/
  height: 1020px;
  width: 270px;
}
#flexslider-1 ul {
  margin: 0;
  padding: 0
}

#flexslider-1 ul li, #flexslider-1 ul li figure {
  height: 255px;
  margin: 0;
}
#flexslider-1 figure figcaption {
  bottom: 0;
}

ul.flex-direction-nav li a {
  width: 12px;
  height: 12px;
  margin: 0;
  display: block;
  background: url(http://www.thelighthouse.co.uk/images/flexslider/Arrow_Up.png) no-repeat 0 0;
  position: absolute;
  top: -1px;
  left: 0;
  cursor: pointer;
  text-indent: -9999px;
  z-index: 100;
  display: none;
}
ul.flex-direction-nav li a:hover {
  background-image: url(http://www.thelighthouse.co.uk/images/flexslider/Arrow_Over.png);
}

ul.flex-direction-nav li a.prev {
  display: none;
}
.ie7 ul.flex-direction-nav {
  display: none;
}
/* flexslider-2 */
div#flexslider-2 {
  height: 1005px;
  margin-top: 16px;
  width: 135px;
  float: left;
  margin-right: 8px;
}
div#flexslider-2 ul {
  margin: -26px 0 0 0;
  padding: 0;
}

#flexslider-2 ul li, #flexslider-2 ul li figure {
  height: 335px;
  margin: 0;
  /*width: 99%;*/
}
#flexslider-2 figure figcaption {
  bottom: 0;
}

#flexslider-2 ul.flex-direction-nav li a {
  top: -1px;
}

/* flexslider-3 */
div#flexslider-3 {
  height: 1005px;
  margin-top: 16px;
  margin-bottom: 30px;
  width: 135px;
  float: left;
}
#flexslider-3 ul li, #flexslider-3 ul li figure {
  height: 335px;
  margin: 0;
  padding: 0;
  width: 99%;
}
#flexslider-3 figure figcaption {
  bottom: 0;
}

#flexslider-3 ul.flex-direction-nav li a {
  left: 170px;
}

ul.related li {
  border-bottom: 1px solid rgb(81,83,72);
  padding-bottom: 4px;
}

div.quote {
  border-top: 1px solid rgb(81,83,72);
  border-bottom: 1px solid rgb(81,83,72);
  padding: 12px 0 40px;
  margin-bottom: 25px;
  line-height: 1.15;
  margin-top: 37px;
}
div.quote p {
  font-family: "PF-DIN-Stencil-Thin", Verdana, sans-serif; font-size-adjust:0.5; font-weight:100; font-style:normal;
  font-size: 24px;
  line-height: 1.15;
  color: rgb(192,180,169);
  margin-bottom: 0;
}
div.quote p span {
  display: block;
  font-size: 17px;
  margin-top: 10px;
}
.column article {
  /*padding-top: 12px;*/
}

.column article p strong {
  font-weight: normal;
  color: rgb(192,180,169);
  /*text-transform: uppercase;*/
}

/* 12 COMPLEMENTARY ============================================================================= */
div#related-links {
  width: 50%;
  float: right;
  margin-top: 30px;
}

/* 13 CONTENTINFO   ============================================================================= */
footer[role="contentinfo"] {
  /*margin-left: 20.16210739615%;*/
  background-color: #2F3131;
  clear: both;
}
footer[role="contentinfo"] div.sitemap div {
  float: left;
}
footer[role="contentinfo"] .grid-2 .column {
  width: 47.532467532468%;
  margin-right: 04.761904761905%; /* 18 / 378 */
}
footer[role="contentinfo"] .grid-2 .last {
  margin-right: 0;
}

footer[role="contentinfo"] h4 {
  font : 12px/1.4 "Helvetica Neue", Helvetica, Arial, sans-serif;
  border: 1px solid rgb(81,83,72);
  border-left: none;
  border-right: none;
  padding: 10px 0;
  color: rgb(192,180,169);
  font-style: normal;
  font-weight: normal;
  margin-top: 0;
  cursor: pointer;
  margin-bottom: 12px;
}
footer[role="contentinfo"] .contact ul, footer[role="contentinfo"] .sitemap ul, footer[role="contentinfo"] .find ul {
  display: none;
}
.find ul {
  margin-bottom: 0;
}
footer[role="contentinfo"] li {
  margin-bottom: 19px;
}

footer[role="contentinfo"] li span {
  display: block;
  color: rgb(180,172,162);
}

footer[role="contentinfo"] li a, footer[role="contentinfo"] li a:visited, footer[role="contentinfo"] li a:hover, footer[role="contentinfo"] li a:active {
  color: rgb(150,150,150);
  text-decoration: underline;
}
footer[role="contentinfo"] li a:hover, footer[role="contentinfo"] li a:active {
  color: rgb(255,255,255);
}
a#credit {
  font-family: Arial, helvetica, sans-serif;
  font-size: 12px;
  color: rgb(140,140,140);
  margin-top: 0px;
  display: block;
  line-height: 1;
}
a#credit:hover {
  color: #fff;
}

/* 14 GLOBAL OBJECTS ============================================================================= */

.clearfix:before,
.clearfix:after {
content : "\0020";
display : block;
height : 0;
overflow : hidden; }

.clearfix:after {
clear : both; }

/* 15 VENDOR-SPECIFIC ============================================================================= */

html {
-webkit-overflow-scrolling : touch;
-webkit-tap-highlight-color : rgb(52,158,219);
-webkit-text-size-adjust : 100%;
-ms-text-size-adjust : 100%; }

.clearfix {
zoom : 1; }

::-webkit-selection {
background : rgb(23,119,175);
color : rgb(250,250,250);
text-shadow : none; }

::-moz-selection {
background : rgb(23,119,175);
color : rgb(250,250,250);
text-shadow : none; }

::selection {
background : rgb(23,119,175);
color : rgb(250,250,250);
text-shadow : none; }

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance : button; }

.ie7 img,
.iem7 img {
-ms-interpolation-mode : bicubic; }

input[type="checkbox"],
input[type="radio"] {
box-sizing : border-box; }

input[type="search"] {
-webkit-box-sizing : content-box;
-moz-box-sizing : content-box; }

button::-moz-focus-inner,
input::-moz-focus-inner {
padding : 0;
border : 0; }

p {
/* http://www.w3.org/TR/css3-text/#hyphenation */
-webkit-hyphens : none;
-webkit-hyphenate-character : "\2010";
-webkit-hyphenate-limit-after : 1;
-webkit-hyphenate-limit-before : 3;
-moz-hyphens : none; }



/* 17 TEMPLATE SPECIFICS ============================================================================= */
/*     about/contact list      */
#contact ul.contact-details li {
  margin-bottom: 19px;
}
#contact ul.contact-details li b {
  color: rgb(192,180,169);
}
#contact b {
  font-weight: normal;
}

/* Exhibitions */
#visit #columns .exhib {
  height: 295px;
  overflow: hidden;
  position: relative;
  margin-bottom: 14px;
}
#visit #columns .exhib img {
  margin-bottom: 3px;
}
#visit #columns .exhib p {
  line-height: 16px;
}
#visit #columns .exhib a.more {
  font-size: 12px;
  color: rgb(0,174,239);
  position: absolute;
  bottom: 2px;
  display: none;
}
#visit #columns .grid-2 .column {
  width: 47.532467532468%;
  margin-right: 04.761904761905%; /* 18 / 378 */
  margin-bottom: 0;
}
#visit #columns .grid-2 .last {
  margin-right: 0;
}
#visit .exhib div h3 {
  font-size: 1.1875em;  /* 19 / 16 */
  margin: 0 0 5px 0;
  line-height: 1.1;
}
#visit .exhib span.date {
  display: block;
  margin: 8px 0 0 0;
  color: rgb(192,180,169);
  font-size: .7421em; /* 16  / 19 */
}
/*
#visit .exhibition #columns .first {
  min-height: 1500px;
}*/
#visit .exhibition div#archive {
  padding-top: 0;
  margin-top: 22px;
  margin-left: 0;
}
div#archive ul li {
  margin-bottom: 8px;
}
#visit div#archive h2 {
  font-size: 19px;
  padding: 5px 0 0 0;
  margin-bottom: 10px;
  color: rgb(140,140,140);
}
#visit div#archive h2 span.date {
  display: block;
  margin: 8px 0 0 0;
  color: rgb(192, 180, 169);
  font-size: .8421em;
}
#visit .exhibition div#archive .date {
  display: block;
}
#visit article #details {
  padding-bottom: 24px;
  margin-bottom: 12px;
}
#visit article #details h3 {
  font-family: "PF-DIN-Stencil-Thin", Verdana, sans-serif;
  font-size: 19px;
  text-transform: none;
}
#visit article #details h3 span.date {
  font-family: "PF-DIN-Stencil-Thin", Verdana, sans-serif;
  font-size: 16px;
  display: block;
  margin: 8px 0 0 0;
  color: rgb(192, 180, 169);
  line-height: 1.2;
}

#visit .exhibition div#comments h3 {
  font-family: "PF-DIN-Stencil-Thin", Verdana, sans-serif;
  font-size: 1.1875em;
  margin: 0 0 5px 0;
  line-height: 1.1;
}

#visit .exhibition #comments {
  background-color: #2F3131;
  display: none;
}

#visit .exhibition #comments h2 {
  font-size: 25px;
}

#related li a {
  color: rgb(0,174,239);
}

input, textarea, select {
  width: 100%;
  /*background-color: rgb(58,58,58);*/
  background-color: rgb(58,58,58);
  color: rgb(201,202,204);
  padding: 6px 0;
  border: none;
  font-family: Arial;
  font-size: 12px;
  border-bottom: 1px solid #646464;
}
input[type="checkbox"] {
  border: none;
}
select {
  height: 25px;
  background-color: rgb(58, 58, 58);
  border: 0;
  color: rgb(192, 180, 169);
}
textarea {
  background-color: rgb(58,58,58);
  border-bottom: none;
}
input.submit {
  width: 32%;
  color: rgb(0,174,239);
  float: right;
  text-align: left;
  background-color: transparent;
  display: block;
  border-bottom: 1px solid #646464;
  margin-top: 6px;
}
input.orange {
  color: rgb(246,142,30);
}
#visit .exhibition #comments ul {
  width: 100%;
  clear: both;
  padding-top: 14px;
}
#visit .exhibition #comments ul li {
  border-bottom: 1px solid #646464;
  padding: 10px 0 0 0;
}
#visit .exhibition #comments ul li p {
  font-size: 12px;
  margin-bottom: 8px;
}
#visit .exhibition #comments ul li span {
  display: block;
}



/* Venue */
#venue .column article figure {
  height: 218px;
}
#venue .column h5 {
  font-family: Arial, sans-serif;
  font-size: .75em; /* 12 / 16 */
  margin: 0 0 28px 0;
  padding: 0;
  text-transform: none;
  /*color: rgb(192,180,169);*/
}
#venue .column h5.no-border {
  margin-bottom: 4px;
}
#venue .grid-4 figure {
  max-width: 99%;
}
#venue .column img {
  margin-bottom: 10px;
}
#venue .tour #tweets-col {
  min-height: 1040px;
}
#tour-text p {
  width: 60%;
}
div.no-border {
  border: none;
}
.hire article {
  margin-bottom: 25px;
}
.hire h2#title {
  margin-bottom: 46px;
}
div#pano {
  height: 300px;
}

/* MAKLab */
#maklab ul.related {
  margin-bottom: 30px;
}

#maklab div#twitter-stream {
  width: 183px;
  margin-top: 20px;
}
#maklab article table {
  margin-top: 20px;
}
#maklab article table td {
  width: 12.5%;
}
#maklab div#twitter-stream p {
  background-color: rgb(192,180,169);
}
#maklab td.members {
  background-color: rgb(112,110,100);
}
#maklab td.workshops {
  background-color: rgb(153,222,249);
}
#maklab td.open {
  background-color: rgb(204,239,252);
}
#maklab td.groups {
  background-color: rgb(253,232,210);
}
#maklab td.mentors {
  background-color: rgb(251,204,154);
}

div#floorplan {
  position: relative;
  z-index: 1;
}
div#floorplan ul#markers {
  z-index: 10;
}
div#floorplan ul#markers li a {
  display: block;
  width: 28px;
  height: 28px;
  position: absolute;
  top: 0;
  left: 0;
  text-indent: -3000px;
  background: transparent url(http://www.thelighthouse.co.uk/images/interface/ViewpointIcon.png) 0 -31px no-repeat;
  z-index: 10;
}
div#floorplan ul#markers li a:hover {
  background-position: 0 -1px;
}
div#floorplan ul#markers li a#mark-platform {
  left: 57.758620689655%; /* 335px / 580px */
    top: 05.295315682281%; /* 78px / 1473px */
}
div#floorplan ul#markers li a#mark-gallery-5 {
  left: 18.965517241379%; /* 110px / 580px */
    top: 10.930074677529%; /* 161px / 1473px */
}
div#floorplan ul#markers li a#mark-doocot {
  left: 51.551724137931%; /* 299px / 580px */
    top: 17.107942973523%; /* 252px / 1473px */
}
div#floorplan ul#markers li a#mark-foundation {
  left: 18.965517241379%; /* 110px / 580px */
    top: 24.847250509165%; /* 366px / 1473px */
}
div#floorplan ul#markers li a#mark-mack {
  left: 18.965517241379%; /* 110px / 580px */
    top: 39.714867617108%; /* 585px / 1473px */
}
div#floorplan ul#markers li a#mark-conference {
  left: 45.689655172414%; /* 265px / 580px */
    top: 45.689069925322%; /* 1673px / 1473px */
}
div#floorplan ul#markers li a#mark-tower {
  left: 10.172413793103%; /* 59px / 580px */
    top: 57.501697216565%; /* 847px / 1473px */
}
div#floorplan ul#markers li a#mark-education {
  left: 45.862068965517%; /* 266px / 580px */
    top: 61.099796334012%; /* 900px / 1473px */
}
div#floorplan ul#markers li a#mark-gallery-1 {
  left: 45.862068965517%; /* 266px / 580px */
    top: 75.695858791582%; /* 1115px / 1473px */
}


/************    Shop          *************/
#shop #buttons input, #shop #buttons a.button {
  display: block;
  width: 35%;
  border: medium none;
  background-color: #3A3A3A;
  color: #C9CACC;
  text-align: center;
    cursor: pointer;
    font-family: Arial,sans-serif;
    font-size: 12px;
    font-style: normal;
    line-height: 1;
    margin: 0 10px 10px 0;
    padding: 8px 10px;
    float: left;
}
#shop #buttons a.button {
  padding-left: 0;
  padding-right: 0;
}
#shop #buttons a.checkout {
  color: #00AEEF;
}


/* Pesky Facebook Like Button! */
div.comment_content, .fb-comments iframe {
  display: none;
}
.fb-like, .fb-like span, .fb-like.fb_iframe_widget span iframe {
    width: 100% !important;

}


/* LHA Section */
#lha div#tweets-col {
  display: block;
}
#lha figure a img {
  margin-bottom: 0;
}
#lha article figure img {
  cursor: pointer;
  width: 185px;
  height: 145px;
}
#lha article h5 {
  text-transform: none;
  padding-bottom: .5em;
  border-bottom: 1px solid rgb(100, 100, 100);
}
#lha article h6 {
  border-bottom: 1px solid rgb(100, 100, 100);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  margin: 0;
  color: rgb(192,180,169);
  padding: .2em 0;
  cursor: pointer;
}
#lha article div.bio {
  padding: 0;
  display: none;
  height: 193px;
}
#lha article div.bio p {
  margin-top: 23px;
}
#lha article .no-border {
  border: none;
}
#lha ul#details {
  margin-top: 53px;
  margin-bottom: 38px;
  color: rgb(192,180,169);
}
#lha ul#details li:first-child {
  text-transform: uppercase;
}
#lha.noticeboard .grid-3 h3 {
  margin: 0;
}
#lha.noticeboard .grid-3 h3 a {
  color: rgb(0,174,239);
}
#lha.noticeboard .notice .column ul li {
  color: rgb(192,180,169);
  padding: 1px 0 2px 0;
}
#lha.noticeboard .notice p strong {
  color: rgb(192,180,169);
}
#lha form textarea {
  width: 97%;
  padding: 5px;
}
body.loggedin {
  background-color: #000;
}
.loggedin div#search-form input {
  background-color: #000;
}



/* Late Event */
#venue .column article.late-2015 figure {
  height: auto;
}
.latelist {
  margin-top: 10px;
}
.latelist ul li {
  margin-bottom: 0;
  line-height: 1.4;
  font-size: 20px;
}
#venue .column .late__heading {
  min-height: 17px;
  margin-top: 1em;
  margin-bottom: 14px;
}
.late__link:hover {
  color: #fff;
}
article.late__details {
  padding-top: 0;
}
.late__schedule td {
  background-color: transparent;
  vertical-align: top;
  font-size: 12px;
  width: 30%;
  padding: 8px 0;
}
.late__schedule td.late__schedule--time {
  width: 12%;
}
.late__schedule td i {
  color: #C8CACC;
  font-style: normal;
}
.late__schedule--gallery {
  margin-bottom: 1.5em;
}
.late__schedule--gallery b {
  font-weight: normal;
  display: block;
  color: #C8CACC;
}
span.late__date {
  font-family: "PF-DIN-Stencil-Thin", Verdana, sans-serif;
  font-size: 16px;
  display: block;
  margin: 8px 0 0 0;
  color: rgb(192, 180, 169);
  line-height: 1.2;
}
/* 18 MEDIA QUERIES ============================================================================= */

@media print {

/* 1 ROOT ============================================================================= */

* {
background : transparent !important;
color : black !important;
text-shadow : none !important;
filter : none !important;
-ms-filter : none !important; }

@page {
margin : 0.5cm; }

/* 2 HEADINGS ============================================================================= */

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

/* 3 TYPOGRAPHY ============================================================================= */

p {
orphans : 3;
widows : 3; }

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

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

/* 4 LINKS ============================================================================= */

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

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

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

/* 5 FIGURES & IMAGES ============================================================================= */

img {
max-width : 100% !important;
page-break-inside : avoid; }

/* 6 TABLES ============================================================================= */

thead {
display : table-header-group; }

tr {
page-break-inside : avoid; }

/* 7 FORMS ============================================================================= */
/* 8 BANNER ============================================================================= */
/* 9 NAVIGATION ============================================================================= */
/* 10 CONTENT ============================================================================= */
/* 11 MAIN ============================================================================= */
/* 12 COMPLEMENTARY ============================================================================= */
/* 13 CONTENTINFO ============================================================================= */
/* 14 GLOBAL OBJECTS ============================================================================= */

.ir a:after {
content : ""; }

/* 15 VENDOR-SPECIFIC ============================================================================= */
/* 16 MODERNIZR ============================================================================= */
/* 17 TEMPLATE SPECIFICS ============================================================================= */

}

/* 480px */
@media only screen and (min-width: 480px) {

/* 1 ROOT           ============================================================================= */
/* 2 HEADINGS         ============================================================================= */
/* 3 TYPOGRAPHY       ============================================================================= */
/* 4 LINKS          ============================================================================= */
/* 5 FIGURES & IMAGES     ============================================================================= */
/* 6 TABLES         ============================================================================= */
/* 7 FORMS          ============================================================================= */
/* 8 BANNER         ============================================================================= */
/* 9 NAVIGATION       ============================================================================= */
/* 10 CONTENT         ============================================================================= */
/* 11 MAIN          ============================================================================= */
/* 12 COMPLEMENTARY     ============================================================================= */
/* 13 CONTENTINFO       ============================================================================= */
/* 14 GLOBAL OBJECTS    ============================================================================= */
/* 15 VENDOR-SPECIFIC     ============================================================================= */
/* 16 MODERNIZR       ============================================================================= */
/* 17 TEMPLATE SPECIFICS  ============================================================================= */

}

/* 600px */
@media only screen and (min-width: 600px) {

/* 1 ROOT           ============================================================================= */
/* 2 HEADINGS         ============================================================================= */
/* 3 TYPOGRAPHY       ============================================================================= */
/* 4 LINKS          ============================================================================= */
/* 5 FIGURES & IMAGES     ============================================================================= */
/* 6 TABLES         ============================================================================= */
/* 7 FORMS          ============================================================================= */
/* 8 BANNER         ============================================================================= */
/* 9 NAVIGATION       ============================================================================= */
/* 10 CONTENT         ============================================================================= */
/* 11 MAIN          ============================================================================= */
/* 12 COMPLEMENTARY     ============================================================================= */
/* 13 CONTENTINFO       ============================================================================= */
/* 14 GLOBAL OBJECTS    ============================================================================= */
/* 15 VENDOR-SPECIFIC     ============================================================================= */
/* 16 MODERNIZR       ============================================================================= */
/* 17 TEMPLATE SPECIFICS  ============================================================================= */

}

/* 768px */
@media only screen and (min-width: 768px) {
/* 1 ROOT           ============================================================================= */
body {
  width: 100%;
  margin : 0 auto;
}
div#wrapper {
  max-width: 987px;
  margin: 20px auto 60px auto;
}
div#columns {
  overflow: auto;
  padding-top: 8px;
  position: relative;
  margin-bottom: 88px;
}
div.column {
  width: 18.439716312057%; /* 182px / 987px */
  float: left;
  margin: 0 01.722391084093% 0 0; /* 17px / 987px */
}
div.grid-2 {
  width: 38.601823708207%; /* 381px / 987px */
  margin: 0 1.823708206687% 0 0; /* 18px / 987px */
}
div.grid-3 {
  width: 58.763931104357%; /* 580px / 987px */
}
div.grid-4 {
  width: 78.824721377913%; /* 778px / 987px */
  margin-right: 0;
}

div.grid-4 .column {
  width: 23.264781491003%; /* 181px / 778px */
  margin-right: 02.313624678663%; /* 18px / 778px */
}

div.first {
  border: none;
  margin-right: 18px;
}
div.last, div#archive .last {
  margin-right: 0;
}
/* 2 HEADINGS         ============================================================================= */
h1#site-name {
  width: 158px;
  height: 75px;
  background: transparent url(http://www.thelighthouse.co.uk/img/interface/logo-blue.gif) no-repeat left top;
  /* background: transparent url(http://www.thelighthouse.co.uk/img/interface/logo-ps.png) no-repeat left top; */
}

/*TEMP PS STYLE*/
/* header h2.blue {
  color: #e782a9;
} */

/* 3 TYPOGRAPHY       ============================================================================= */
h2#title {
  font-size: 25px;
}
h2#title b {
  display: inline;
}
/* 4 LINKS          ============================================================================= */
/* 5 FIGURES & IMAGES     ============================================================================= */
/* 6 TABLES         ============================================================================= */
/* 7 FORMS          ============================================================================= */
/* 8 BANNER         ============================================================================= */
div#search-form {
  display: block;
}
div#search-form input {
  display: block;
  margin-bottom: 0;
  padding-bottom: 4px;
  margin-left: -2px;
}
div#search-form input:focus {
  outline: none;
}
header[role="banner"] div.column {
  border-top: 1px solid rgb(81,83,72);
  padding-top: 42px;
}

header[role="banner"] div.first {
  border-top: none;
  padding-top: 0;
}

header[role="banner"] div.last {
  padding-top: 6px;
}

header[role="banner"] {
  margin-bottom: 0;
}
header[role="banner"] div.create {
  clear: none;
}
header[role=banner] {
  width: 100%;
}
header[role=banner] div.first {
  /*margin-right: 218px;*/
  margin-right: 21.985815602837%; /* 217px / 987px */
  margin-top: 0;
}
/* 9 NAVIGATION       ============================================================================= */
nav[role="navigation"] {
  border-top: none;
  border-bottom: none;
  margin-bottom: 1.5em;
  width: 180px;
}
nav[role="navigation"] ul {
  display: block;
}
nav[role="navigation"] ul li {
  margin-bottom: 3px;
}
nav[role="navigation"] ul li a {
  font-size: 14px;
  line-height: 18px;
}
nav[role="navigation"] h2 {
  margin-bottom: 0.75em;
  font-size: 25px;
  padding: 0;
  cursor: auto;
}
nav[role="navigation"] h2.about {
  display: none;
}
/* 10 CONTENT         ============================================================================= */
div#flexslider-1 {
  width: 381px;
}
div#flexslider-2, div#flexslider-3 {
  width: 182px;
}
div#tweets-col {
  display: block;
  margin-top: 14px;
}
h2#who {
  display: block;
  color: rgb(150,150,150);
  font : 0.75em/1.5 Arial, sans-serif;
  margin: 0 0 35px 0;
  letter-spacing: normal;
}
/* 11 MAIN          ============================================================================= */
/* 12 COMPLEMENTARY     ============================================================================= */
/* 13 CONTENTINFO       ============================================================================= */
footer[role="contentinfo"] .contact ul, footer[role="contentinfo"] .sitemap ul {
  /* display: block;  TEMP DISABLED - TEST COLLAPSE DESKTOP */
}
/* 14 GLOBAL OBJECTS    ============================================================================= */
/* 15 VENDOR-SPECIFIC     ============================================================================= */
/* 16 MODERNIZR       ============================================================================= */
/* 17 TEMPLATE SPECIFICS  ============================================================================= */
div#flexslider-2 {
  float: none;
  margin-right: 0;
}
div#flexslider-3 {
  margin-top: 0;
  float: none;
}
ul.flex-direction-nav li a {
  display: block;
}
div#pano {
  height: 600px;
}

#visit .exhibition #comments {
  display: block;
}
#visit .exhibition div#archive {
  margin-left: 200px;
}
#visit #columns .exhib a.more {
  display: block;
}
#visit #columns .exhib {
  height: 380px;
}
article p {
  font-size: 12px;
}

/* LHA Noticeboard */
#lha.noticeboard .grid-3 .column {
  margin-bottom: 12px;
  width: 32%;
}
#lha.noticeboard .grid-3 .grid-3 {
  width: 65.51724137931%;
  margin-bottom: 12px;
}

/* Blog/Press Nested columns */
.blog .grid-3 .column {
  margin-bottom: 12px;
  width: 32%;
}
.blog .grid-3 .grid-2 {
  width: 65.51724137931%;
  margin-bottom: 12px;
}

.loggedin #tweets-col #twit-title, .loggedin #tweets-col  ul.tweets, .loggedin a.follow {
  display: none;
}

.column article.late {
  min-height: 610px;
}
.column article.late__medium {
  min-height: 450px;
}
.column article.late__small {
  min-height: 190px;
}
article.late__details {
  min-height: 610px;
}



}

/* 992px */
@media only screen and (min-width: 992px) {

/* 1 ROOT           ============================================================================= */
/* 2 HEADINGS         ============================================================================= */
/* 3 TYPOGRAPHY       ============================================================================= */
/* 4 LINKS          ============================================================================= */
/* 5 FIGURES & IMAGES     ============================================================================= */
/* 6 TABLES         ============================================================================= */
/* 7 FORMS          ============================================================================= */
/* 8 BANNER         ============================================================================= */
/* 9 NAVIGATION       ============================================================================= */
/* 10 CONTENT         ============================================================================= */
/*
div#wrapper {
  background: url(/img/interface/bg-dots.gif) left top repeat-y;
}
*/
/* 11 MAIN          ============================================================================= */
/* 12 COMPLEMENTARY     ============================================================================= */
/* 13 CONTENTINFO       ============================================================================= */
/* 14 GLOBAL OBJECTS    ============================================================================= */
/* 15 VENDOR-SPECIFIC     ============================================================================= */
/* 16 MODERNIZR       ============================================================================= */
/* 17 TEMPLATE SPECIFICS  ============================================================================= */

}


 /* 2x Logo for Retina */
@media only screen and (min-width: 768px) and (-webkit-min-device-pixel-ratio: 1.5 ),
only screen and (min-width: 768px) and (-moz-min-device-pixel-ratio: 1.5),
only screen and (min-width: 768px) and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-width: 768px) and (min-device-pixel-ratio: 1.5) {
  h1#site-name {
    background-image: url(http://www.thelighthouse.co.uk/img/interface/logo-blue-@2x.png);
    background-size: 158px 75px;
  }
}

.oldie h1#site-name {
    background-image: url(http://www.thelighthouse.co.uk/img/interface/logo-blue.gif);
  }

.sm--img {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  margin-right: 4px;
}