
/* Webfonts (Fonts.com)
=====================================*/
/*
font-family:'Brandon Text W01';
Brandon Text W01 Regular, 400 Normal, normal
Brandon Text W01 Medium Italic,	500 Medium,	italic

font-family:'Proxima Nova W01';
Proxima Nova W01 Regular Italic, 300 Light, italic	
Proxima Nova W01 Semibold

font-family:'Proxima Nova W08';
Proxima Nova W08 Regular, 400 Normal, normal

font-family:'Proxima Nova W07';
Proxima Nova for Avaya W07 Semibold Italic,	400 Normal, normal	
*/

@font-face { font-family: 'GT Sectra'; src: url('webfonts/GT-Sectra-Regular.eot'); /* IE9 Compat Modes */
  src: url('webfonts/GT-Sectra-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	   url('webfonts/GT-Sectra-Regular.woff') format('woff'), /* Pretty Modern Browsers */
	   url('webfonts/GT-Sectra-Regular.ttf')  format('truetype'); /* Safari, Android, iOS */
}




body, #page-exhibition .text-wrapper h2, #page-home #feature h2, #page-home .item-exhibition h2, #page-home .item-exhibition h3, #page-home #welcome .lead h1 { font-family:"proxima-nova", arial, sans-serif;}

h1, h2, h3, #primary, #footer, .list-links, .panel-toggle a, #mobile-primary { font-family:"proxima-nova", arial, sans-serif;  }
h1 { font-weight: 600; }
h3 { text-transform: uppercase; font-size: 14px; }

#primary, .list-links { font-weight: 600; }
.panel-toggle a, strong { font-weight: 600; }

#title h1 { font-family: 'GT Sectra', arial, sans-serif; font-weight: normal;  }

.text-wrapper h1 { font-weight: 600 }

/* General
=====================================*/
body { font-size: 14px; line-height: 1.6em; }

h1, h2, h3, h4, p { margin-top: 0; padding-top: 0; }
h1 { margin: 0px 0 30px; padding: 0; font-size: 20px; }
h2 { font-family: 'GT Sectra'; font-size: 21px; font-weight: 300; margin-bottom: 10px; }
h3 { margin: 0 0 20px; }


.lead { font-size: 20px; line-height: 1.6em  }
p { margin: 0 0 25px; padding-top: 0; }

img { max-width: 100%; height: auto; }

a { color: #048197; text-decoration: none }
a:hover { color: #048197; text-decoration: underline }

h1 a, h2 a, h3 a { color: #333; }


table.table{border-bottom:5px solid #f0f0f0;margin-bottom:30px}
table.table th, table.table td{padding:15px 12px !important;border:0 !important;font-size:14px}
table.table th{background:#e5e5e5;padding:9px 12px !important;vertical-align:top !important; }
table.table tr:nth-child(even) td {background:#fff;border-bottom:5px solid #f1f1f1}
table.table tr:nth-child(odd) td{background:#f1f1f1;border-bottom:5px solid #fff}
table.table tr:nth-child(2) td {padding-top:25px !important}


/* Layout
=====================================*/
html, body { height: 100%; }
body { position: relative; padding: 0; margin: 0; }




#header { padding-top: 20px; }

#header .logo { position: relative; z-index: 9999; }


#primary { line-height: 35px; font-weight: 600; font-size: 12px }
#primary a { color: #000; text-transform: uppercase; padding: 3px 5px;  text-decoration: none; border-bottom: 2px solid #fff }
#primary li { padding-left: 0; }
#primary a:hover, #primary .active a, #primary .parent-active a, .entry-upcoming #primary #nav-23 a, .entry-past #primary #nav-24 a { border-bottom: 2px solid #000;}
.entry-past #primary .parent-active a, .entry-upcoming #primary .parent-active a { border-color: #fff;   } 


.panel-toggle { position: fixed; top:0; width:90px; height: 100%; z-index: 900; text-transform: uppercase; font-size: 16px;    }
#panel-toggle-thelab { background: #dbf3f7; left:0; }
#panel-toggle-artsoffice { background: #ceebcd; right:0; }
#page-home #panel-toggle-artsoffice { background: none }
.panel-toggle a { background: url('../images/home/nav_arrow_down.gif') center right no-repeat; letter-spacing: 1px; padding-right: 20px; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg);  display: block; top:50%; position: fixed; color: #000; text-decoration: none; width:200px; left:-40px; text-align: center }
#panel-toggle-artsoffice a { left:auto; right: -40px; background-position: left center; padding-left:20px; padding-right: 0; -webkit-transform: rotate(-270deg); -moz-transform: rotate(-270deg); -ms-transform: rotate(-270deg); -o-transform: rotate(-270deg); }

.panel-thelab-active #panel-toggle-thelab a { background-image: url('../images/home/nav_arrow_up.gif')}
.panel-artsoffice-active #panel-toggle-artsoffice a { background-image: url('../images/home/nav_arrow_up.gif')}

.panel .container { float: left; }
#panel-thelab .container { float: right; }
#panel-thelab { left:0;  }
#panel-artsoffice { right:0; background: #ceeccd; }
#panel-artsoffice  .container { padding-left: 80px; }

.panel {width: 50%; box-sizing: content-box; background: #dbf3f7; height: 100%; position: fixed; top:0; z-index: 800; }
.panel .prop { min-height: 200px; }
.panel .section-links { margin-bottom: 100px }
.panel .list-links li { text-transform: uppercase; margin-bottom: 10px; }
.panel .list-links li a:hover { color: #000; text-transform: underline }
.panel a { color: #000; }
.panel i { font-size: 25px; margin-right: 10px; }
.panel .contact-info p, .panel .contact-info h3 { margin-bottom: 10px; }
.panel .contact-info ul { margin-top: 30px; }

.panel-thelab-active #logo-thelab { display: block !important; position: fixed  }
.panel-artsoffice-active #logo-artsoffice { display: block !important;  }

#banner, #banner #title { height: 230px; }
#banner { background-position: center center; background-repeat: no-repeat; background-size: cover;  position: relative; max-width: 100%; }
#banner #title { color: #fff;  }
#banner #title h1 { position: absolute; bottom:10px;  }

#title { color: #000; padding-top: 30px; padding-bottom: 10px; }
#title h1 { font-size: 50px; line-height: 1.25em; font-weight: 300}


#main, #sidebar { padding-top: 20px; }

#secondary { margin-bottom: 30px; max-width: 320px; }
#secondary ul, #secondary li { list-style-type: none; margin: 0; padding: 0; }
#secondary a { border-bottom: 1px solid #afc2ca; display: block; color: #000; line-height: 27px; text-decoration: none }
#secondary a:hover, #secondary li.active a, #secondary li.active li a:hover, #secondary li.parent-active > a, #secondary li.parent-active li.active > a, #secondary li.parent-active li.parent-active > a, #secondary li.parent-active li a:hover { color:#5dc4cd  }

#secondary li.parent-active li a, #secondary li.active li a { color: #000; }
#secondary li.parent-active:hover { background: none; }
#secondary li li a { padding-left: 35px; }
#secondary li { background-position:  0 8px; background-repeat: no-repeat; margin-left: -25px; padding-left: 25px;   }
#secondary li:hover, #secondary li.active { background-image:url(../images/general/arrow_subnav.png) }
#secondary li.level-3 a { background: #eee; }

#breadcrumbs { padding: 0 0 5px; margin: 0 0 30px; }
#breadcrumbs a { margin-right: 15px; background:url(../images/general/arrow_breadcrumbs.png) center right no-repeat; padding-right: 20px; color: #000;  }
#breadcrumbs, .section-the-lab #sidebar h3 { border-bottom: 1px solid #000; line-height: 23px; }
.section-the-lab #sidebar h3 { padding-bottom: 5px; }

#footer { font-size: 18px; line-height: 1.4em; padding: 20px 0; position: relative }
#footer a { color: #000; text-decoration: none }
#footer a:hover { color:#666 }
#footer a i { color: #62666d; font-size: 22px; margin-left: 10px; }
#footer a i:hover { opacity: 0.7 }
#footer h4 { margin: 0; padding: 0; }


/* Helpers
=====================================*/
ul.list-unstyled, ul.list-unstyled li, ul.unstyled, ul.unstyled li { margin: 0; padding: 0; list-style-type: none }

.list-inline { padding-left: 0; list-style: none; margin-left: -5px; }
.list-inline > li { display: inline-block; padding-left: 5px; padding-right: 5px; }

.text-wrapper { max-width: 550px; }
.text-wrapper a i { font-size: 20px; margin-right: 10px; width: 20px; text-align: center; }

/* Classes & Ids
=====================================*/
.item-exhibition figure { margin-bottom: 15px; }
.item-exhibition .more a { text-transform: uppercase; color: #4cb549 }
.item-exhibition h2, .item-exhibition h3 { margin-bottom: 10px }
.item-exhibition figure { overflow: hidden }
.item-exhibition figure img { width: 100%; }
.item-exhibition figure a:hover img { opacity: 0.7 }

.date { text-transform: uppercase; color: #666; margin-bottom: 25px; }

.masonry { margin-left: -10px; }
.masonry .item { margin-bottom: 25px; }
.masonry .wrap { padding: 5px 10px 0; }
.masonry .item .inner { max-width: 320px;}

.item-publication figure { margin-bottom: 15px  }
.item-publication figure a:hover img { opacity: 0.7 }
.item-publication a { color: #333; }
.item-publication p { max-width: 80% } 

.item-logo { margin-bottom: 15px; height: 140px; line-height: 120px; display:table-cell; vertical-align:middle; text-align:center }
.item-logo .wrap { border: 5px solid #f5f5f5;  }
.item-logo .wrap img { vertical-align: middle; }
	
#photos .glyphicon i { font-size: 40px; }
#photos { max-width: 660px; }

.download-link:before { font-family: 'FontAwesome'; content: "\f019"; position: relative; left:0px; padding-right:5px; }
.item-publication .download-link:before { content: none !important; padding-right: 0; }

.event-summary { margin-bottom: 40px }
.event-summary p { margin-bottom: 10px; }
.event-summary .date { margin-bottom: 5px; }

.paging a, .paging strong { margin-right: 10px }

/* Specific Pages
=====================================*/
#page-error #breadcrumbs { border: 0;}

#page-exhibition .text-wrapper { line-height: 1.6em; max-width: none  }
#page-exhibition .text-wrapper, #page-exhibition #related-events { border-bottom: 1px solid #000; padding-bottom: 15px; margin-bottom: 15px; }
#page-exhibition .text-wrapper h2 { margin-bottom: 20px; font-size: 24px; }
#page-exhibition .text-wrapper h3 { color: #666; margin-bottom:20px; font-weight: normal; text-transform: none; font-size: 18px; }
#page-exhibition .text-wrapper .date { text-transform: none; color: #000; font-weight: 600 }
#page-exhibition aside { text-align: right; margin-bottom: 15px; }
#page-exhibition h2.section { margin-bottom: 25px; }

#page-exhibition .item-event { margin-bottom: 30px; }
#page-exhibition .item-event h3, #page-exhibition .item-event p { margin-bottom: 5px; }
#page-exhibition .item-event a { color: #666; }

#past-exhibitions .item-exhibition { margin-bottom: 15px; }
#past-exhibitions .item-exhibition .inner { max-width: 320px; border: 1px solid #eee; -moz-box-shadow: 0 0 2px 2px #eee; -webkit-box-shadow: 0 0 2px 2px #eee; box-shadow: 0 0 2px 2px #eee; margin: 0 auto; }
#past-exhibitions .item-exhibition .wrap { padding: 5px 15px 1px; }




/* Homepage
=====================================*/
#page-home #header {  padding-bottom: 30px; }

#slider .container { position: relative }

#slider, #slider .slide { height: 670px; }
#slider {  overflow: hidden }
#slider .slide { background-size: cover; background-position: center center; background-repeat: no-repeat; width: 100%; }
#slider h1 { position: relative; top:30px; left:60px; max-width: 45%; color: #fff; font-size: 24px; line-height: 1.4em;  }
#slider a h1 { text-decoration: none !important }
#slider #next, #slider #prev { position: absolute; top:45%; z-index: 500; background-position: center center; width: 43px; height: 62px; }
#slider #next:hover, #slider #prev:hover { opacity: 0.8; }
#slider #prev { left:30px; background: url('../images/home/slider_arrow_left.png') }
#slider #next { right:30px; background: url('../images/home/slider_arrow_right.png') }
#slider a { display: block; width: 100%; height: 100%; text-decoration: none  }

#page-home #footer { line-height: 2em; font-size: 13px;  }
#page-home #footer .list-links li, #page-home #footer h4 { text-transform: uppercase; font-weight: 600 }
#page-home #content .wrapper { padding-top: 30px; }

#page-home #welcome { font-size: 16px;  }
#page-home #welcome .lead { background: url('../images/home/intro_border.gif') bottom left no-repeat; padding-bottom: 45px; font-size: 24px; line-height: 1.5em; }
#page-home #welcome h1 { font-weight: 600;  }
#page-home #welcome a { color: #333; font-weight: 600; }

#page-home #feature .wrapper { width: 100%; margin: 0 auto; }
#page-home #feature h2.section { text-align: center; font-size: 14px; font-weight: 600; } 

#page-home .item-exhibition { width: 360px; max-width: 80%; margin: 0 auto 15px  }
#page-home .item-exhibition figure { text-align: center; width: 280px; max-width: 80%; margin: 0 auto 15px; }
#page-home .item-exhibition .date { color: #333; }
@media (min-width: 960px) { #page-home .item-exhibition .opening-times { background:url('../images/home/intro_border.gif') 0 5px no-repeat; padding-left: 140px;  } }
#page-home .item-exhibition h2 { text-transform: uppercase; }


/* Responsive
=====================================*/
.navbar, .navbar-header { background: none; border: 0; box-shadow: none; margin: 0; }
.navbar-header { height: 70px; overflow: hidden }
.navbar-toggle { float: none; border: 0; border-radius: 0; background: #daf3f7; margin: 0; padding: 0; line-height: 70px; width: 70px; font-size: 24px; }
.navbar-toggle:hover { background:#9ba2a8 }
.navbar-brand { float: right; padding: 0; }
.navbar-collapse { border: 0; background: #daf3f7; }

#mobile-primary { padding: 0 30px }
#mobile-primary ul.nav { margin: 15px 0; }
#mobile-primary ul, #mobile-primary li, #mobile-primary a { padding: 0; margin: 0; display: block }
#mobile-primary a { color: #000; text-transform: uppercase; border-bottom: 1px solid #888; padding: 15px 10px; font-weight: 600 }
#mobile-primary li li a { padding-left: 40px; color: #4d4d4d; }
#mobile-primary li li li a { padding-left: 60px; }

#mobile-primary li.active > a { background: #9ba2a8; color: #000; }

#mobile-primary li.has-children > a { color: #000; }
#mobile-primary li.has-children .caret { position:relative; top: 5px; }
#mobile-primary li.has-children ul { display: none }
#mobile-primary li.parent-active ul { display: block !important }

/*@include mq($from: tablet){
    #navbar > .dropdown-menu, #navbar .open > .dropdown-menu { display: none; }
    .navbar-default .navbar-nav > li > a { padding: 13px 5px; }
    .navbar-default .navbar-nav > li { padding-left: 20px; padding-right: 20px; }
    .navbar-default .navbar-nav > li:last-child { padding-right: 5px; }
    nav .navbar-nav .active-parent > a { border-bottom: 1px solid $cgrey; }
}*/


/* <= Small Mobile */
@media (max-width: 479px) {
.masonry .col-xs-8 { width: 100%; }
.masonry .col-xs-8 .inner { max-width: none; }
#title { padding-top: 15px; }
#title h1 { font-size: 35px; margin-bottom: 15px; }
.navbar-header { height: 60px; }
.navbar-brand img { position: absolute; top:0; right:0; max-width: 200px; }
}


/* <= Mobile */
@media (max-width: 767px) {
#banner #title, .panel, #slider h1, #slider #prev, #slider #next, .panel { display: none !important }
	
#banner { height: 120px; }
#slider, #slider .slide { height: 250px; }
#page-home #feature { background: #ceebcd }
#page-home #welcome .lead { padding: 0; background: none; }


#footer, #page-home #footer { font-size: 16px; line-height: 1.3em; }
#footer { background: #fff; padding-top: 20px; position: relative;   }
#footer hr { margin: 0; padding: 0px; border-top: 1px solid #999; margin-bottom: 30px; }
#page-home #footer hr { display: none !important }
#footer .col-lg-offset-2 { position: absolute; top:40px; right:10px; }

.item-exhibition { max-width: 320px; float: none; margin-left:auto; margin-right: auto; }

.item-exhibition, #past-exhibitions { max-width: 320px; margin-left:auto; margin-right: auto; }
#past-exhibitions h2.section, #page-exhibition aside figure { text-align: center }
#title { padding-top: 0; padding-bottom: 0; }
#title h1 { margin:0 0 10px; }
}

/* <= Tablet */
@media (max-width: 959px) {
#footer ul.pull-right { float: none !important; margin-left: -10px; }	
#slider h1 { max-width: 80% }
}
	
	


/* > Mobile */
@media (min-width: 768px) {
#page-home { background: linear-gradient(90deg, #dbf3f7 50%, #fff 50%); }
#page-home #content .container { background: linear-gradient(90deg, #fff 50%, #ceebcd 50%); }
#page-home .links-pt2 .wrapper { margin-left: 0;  }
#page-home .wrapper { margin: 0 0 0 40px; max-width: 420px; }
#main { min-height: 500px; }

/* footer at bottom of short pages*/
/*#outer-wrapper { min-height: 100%; position: relative }
#content { padding-bottom: 120px; }
#footer { height: 105px; position: absolute; bottom:0; width: 100%; }	*/

#outer-wrapper { margin-left: 90px; }
#page-home #outer-wrapper { margin-right: 90px; }
.section-the-lab #outer-wrapper { margin-left: 0; margin-right: 90px; }
.container { width: 690px; }
#page-home .container { width: 580px; }
#slider, #slider .slide { height: 350px; }
#page-home .panel .container, .panel .container { width: 280px; }	
}


@media (min-width: 960px) {
.container { width: 850px; }
#page-home .container { width: 760px; }
#slider, #slider .slide { height: 400px; }
.panel-toggle {width:90px; }	
#primary a { margin: 0 0px; }	
#logo-thelab { margin-left: -36px; }
#page-home .panel .container, .panel .container { width: 380px; }	
}


@media (min-width: 1200px) {
.container { width: 1070px; }
#page-home .container { width: 980px; }
#slider, #slider .slide { height: 500px; }
#primary a { margin: 0 10px; }
#footer a i { margin-left: 20px; }
#page-home .panel .container, .panel .container { width: 490px;  }	
}

@media (min-width: 1440px) {
.container { width: 1180px; }
#page-home .container { width: 1200px; }
#slider, #slider .slide { height: 670px; }
#footer a i { margin-left: 30px; }
#page-home .panel .container, .panel .container { width: 600px; }	
#past-exhibitions .item-exhibition .inner { max-width: none }
}





/* Transitions
=====================================*/
#primary a, #secondary a { -webkit-transition: all 0.2s; transition: all 0.2s; }
#next, #prev { -webkit-transition: opacity 0.2s; transition: opacity 0.2s; }
.item-exhibition figure img, .item-publication figure img  { -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
	

