-------------------------------------------------
	Author	:	Brenda Brudet for Tremani	
	Email	:	info@tremani.nl
	Website	:	http://www.tremani.nl
---------------------------------------------------- */
/*

INDEX:

1. SETUP
-1.1 Reset --- deactivated?
-1.2 Base typography
-1.3 General

2. SITE STRUCTURE & APPEARANCE
-2.1 Header
-2.2 Nav
-2.3 Search
-2.4 Content
-2.5 Sidebar
-2.6 Footer
-2.7 Older Posts
-2.7 Content
-2.8 Sidebar
-2.9 Footer

3. OVER ONS
-3.1 Thumbnail gallery

4. OUR WORK

5. CONTACT

-5.1 Contact data
-5.2 Contact Form

6. MISC
-6.1 404 pagina
-6.2 Extras
-6.3 Image mosaic
-6.4 Image mosaic - fluid grid
-6.5 bootstrap fixes
-6.6 Sitemap
-6.7 Search results page 
 
7. MEDIA QUERIES 

*/

/*-----  1.1 Reset  ------------------------------------------------------------------------------
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}
a {text-decoration:none;}*/

/*----- 1.2 Base typography ------------------------------------------------------------- */

body { } /* Do not delete this empty body tag !!!! or else webfont won't work. I don't know why. It just doesn't */
body {  font-family: 'Gotham SSm A', 'Gotham SSm B', Arial, Helvetica, sans-serif; font-weight: 400; font-style: normal; font-size:0.875em; line-height: 1.571em; }
p { margin-bottom:1em;}

a 			{color:#990077;}
a:hover 	{transition:All 0.2s ease-in-out;-webkit-transition:All 0.2s ease-in-out;-moz-transition:All 0.2s ease-in-out; -o-transition:All 0.2s ease-in-out; color:#990077; }
a:active 	{color:#000d61;}

.alt-c {color:#000d61;}
h1, h2, h3, h4, h5 { font-family:'Gotham A', 'Gotham B', 'Gotham SSm A', 'Gotham SSm B', Arial, Helvetica, sans-serif; font-weight:700; font-style:normal; margin:22px 0; }
.article-content h3, .article-content h4 { margin-bottom: 5px;}
h2 .alt-c{font-weight: bold;}

ol, ul {margin-bottom:22px;}

/*----- 1.3 General---------------------------------------------------------------------*/

.btn { background:#e6e6e6; border-radius:4px; border:0; box-shadow:0; text-shadow:none; color:#8d8d8d; transition:All 0.4s ease;-webkit-transition:All 0.4s ease;-moz-transition:All 0.4s ease; -o-transition:All 0.4s ease; color:#990077;}
.btn:hover { background:#990077;color:#fff; transition:All 0.4s ease;-webkit-transition:All 0.4s ease;-moz-transition:All 0.4s ease; -o-transition:All 0.4s ease;}
.btn:active { background:#000d61;color:#fff;}
.btn-primary {background:#990077; color:#fff;}
.btn-primary:hover { background:#000d61;}
.btn-primary:active { background:#9A9B9B;}
.btn-large .icon-angle-left { margin-right:10px;}
.btn-roomy {padding:19px 28px;}

textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus {
	 border-color: rgb(153, 0, 119);
	 border-color: rgba(153, 0, 119, 0.4);
    box-shadow: 0 1px 1px rgb(0, 0, 0) inset, 0 0 8px rgb(153, 0, 119);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(153, 0, 119, 0.3);
}
blockquote { color:#000D61; border:0; padding-left:20px; padding-top:4em; margin:1em 0 4em; position:relative;}
blockquote .author { font-style:italic; font-weight:bold; margin-top:1.2em; display:block;}
blockquote .quote-mark { font-size:120px; line-height:0; display:inline-block; position:absolute; top:0; color:#e2e2e2;}

.article-content iframe { width: 100% !important;}

/*----- 2. SITE STRUCTURE
--------------------------------------------------------------------------- */

body, html { height:100%; }

.content { background-color:#fff; padding:35px 0 0px;}
.content-page header {background-color:transparent; }
#top {background: url("../img/bg-dots.png") repeat scroll left top rgba(0, 0, 0, 0);}
.big-view .content-page header { height:92.5%;}
.content-page .content {  margin-top:-150px; position:relative; background-color:transparent;}
.individual-post.content-page .content {padding:0 20px;}
.content-page .content .content-inner { background-color:#fff; border-radius:8px 8px 0 0; padding:3em 20px 0 20px; margin:0 auto;}
.individual-post.content-page .content .content-inner {padding-left:40px; padding-right:40px;/* 4.2553% */ max-width:900px; width:auto;}
.content-page #supersized, .content-page #supersized a { height:505px; position:absolute;}

/*----- 2.1 header----------------------------------------------------------------------*/
header{ padding:0 15px;}
.big-view header.large { height:92.5%; }
.big-view #w-app-container{ height:92.5%; }

.content-page .header-contentwrapper {height:100%; margin:0 -15px;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; 
}
/*.content-page header { height:100%;}*/
header.large .header-contentwrapper { position:relative; padding-top:150px; /* padding-top:15%; */ padding-bottom:80px; }
header .header-contentwrapper { padding-top:110px; padding-bottom:150px;}
.header-contentwrapper .row { margin-left:0;}

#tagline { background-color:rgb(0, 25, 121); background-color:rgba(0, 25, 121, 0.7); /*width:40%;*/ margin:0 auto; text-align:center; border-radius:5px; padding:5% 2%/*50px 26px*/; float:none; max-width:100%;
	-moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box;
}
.lt-ie9 #tagline, .lt-ie9 .page-title { background:transparent url(../img/bg-transp-blue.png) 0 0 repeat;}
#tagline h1 { color:#fff; margin: 0 0 0.5em 0; font-size:4em; line-height:1em;  
-webkit-text-stroke-width: 0.8px;
-webkit-text-stroke-color: rgba(255,255,255,0.35);
-webkit-font-smoothing:antialiased;
 }
#tagline h2  { color:#fff; font-size:1.8em; line-height:1.2em; margin-bottom:0;
 -webkit-text-stroke-width: 0.8px;
-webkit-text-stroke-color: rgba(255,255,255,0.35);
-webkit-font-smoothing:antialiased;
}
.about-us #tagline h2 { font-size:1.4em;}
#tagline a { color:#fff; background-color:rgb(113, 117, 166); background-color:rgba(255, 255, 255, 0.25); padding:0 4px 1px 5px; display:inline-block; margin-bottom:5px; text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	-moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; 
 -webkit-text-stroke-width: 0.8px;
-webkit-text-stroke-color: rgba(255,255,255,0.35);
-webkit-font-smoothing:antialiased;
}

#tagline.transparent{background:transparent;}

.lt-ie9 #tagline a { background-color:#464c83;}

header ul.cta-group.span8 { overflow:hidden; margin:2.5em auto !important; text-align:center; float:none; /* max-width:100%; */ }
/* header ul.cta-group.span8 .span4 { margin:0 !important; } */
header ul.cta-group li { overflow:hidden; list-style:none; display:inline; }
header ul.cta-group li:first-child { margin-left:0;}

a.header-cta {background-color:rgb(153, 0, 119); background-color:rgba(153, 0, 119, 0.7); border:0; border-radius:5px; padding:15px; color:#fff; display:block; overflow:hidden;-moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; height:92px; }
.lt-ie9 a.header-cta { background:transparent url(../img/bg-transp-purple.png) 0 0 repeat;}
.lt-ie9 a.header-cta:hover { background-color:#990077;}
a.header-cta.btn:hover, a.header-cta.btn:hover span {background-color:rgb(153, 0, 119); background-color:rgba(153, 0, 119, 1); color:#fff; -webkit-transition:All 0.2s ease-in-out;-moz-transition:All 0.2s ease-in-out; -o-transition:All 0.2s ease-in-out; transition:All 0.2s ease-in-out;}
a.header-cta i { float:left; width:15%; height:65%; display:block; border:2px solid white; border-radius:4px; margin-right:8%;}
a.header-cta div { float:left; width:74%; font-size:1.125em;  }
a.header-cta  span { display:block; color:#e7cade;}
a.header-cta .icon { background-position:center center; background-repeat:no-repeat;}
a.header-cta .video { background-image:url(../img/icon-triangle.png);}  
a.header-cta .coffee { background-image:url(../img/icon-coffee.png);}

.row.scrollto { position:relative; text-align:center; margin:-80px 0 0 0;}
.scrollto  a {background-color:#fff; line-height:1.2; vertical-align:middle; padding:22px 30px; display:block; width:620px; margin:0 auto; border-radius: 5px 5px 0 0; color:#000d61; font-weight:bold; font-size:2.000em; position:relative;
	-moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; 
}
.scrollto  a:hover { color:#990077; text-decoration:none; }
.scrollto  a i { font-size:1.6em; margin:0em -0.3em 0 0.2em; line-height:0.7; position:relative; top:0.08em; vertical-align:top; display:inline-block;}
.down { display:inline-block; width:26px; height:13px; background:transparent url(../img/icon-arrow-down.png) center 0 no-repeat; margin:0px 0 3px 10px; }
.scrollto  a:hover .down { background-position:center -30px;  }
.navbar .brand { padding:0; margin: 0 0 0.6em 0;}

.language { display:inline-block; float:right; padding:10px 10px; margin:0 10px 0 0px; border-left:1px dotted #dbdbdb; border-right:1px dotted #dbdbdb; color:#7d7d7d;}
.language:hover { text-decoration:none;}
.language .name {display:inline-block;}
.language .intitial {display:none;}

.page-title-wrapper { text-align:center; padding:4em 0; overflow:hidden;}
.page-title {background-color:rgb(0, 25, 121); background-color:rgba(0, 25, 121, 0.8); display:inline-block; margin:0 auto; color:#fff; border-radius:4px; padding: 0.6em 20px; font-size:4.5em; line-height:1.1;}
.page-title.entry-title { margin:0 0; float:left; font-size:2em; width:41%; text-align:left;}

/*-----  2.2 Main nav ----------------------------------------------------------------- */
.navbar .nav { float:right; left:auto; margin-right:0;}
.navbar-wrapper { position:absolute; z-index:1000; top:20px; right:0; left:0; /* width:100%; replaced by right so content longer protrudes */ background-color:rgb(255, 255, 255);background-color:rgba(255, 255, 255, 0.9); padding:25px 0 10px 0; font-size:97%;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}
.lt-ie9 .navbar-wrapper { background:transparent url(../img/bg-transp-white.png) 0 0 repeat;}
.navbar-inner { padding:0; }
.navbar-inverse .navbar-inner { background:transparent; background:none; filter:none; border:0; box-shadow:none; }
.navbar { margin-bottom:0;}
.navbar-inverse .brand, .navbar-inverse .nav > li > a { color:#000d61; text-shadow:none;}
.navbar-inverse .nav .active > a, .navbar-inverse .nav .active > a:hover, .navbar-inverse .nav .active > a:focus { color:#990077; background:transparent; box-shadow:none;}
.navbar-inverse .nav > li > a:focus, .navbar-inverse .nav > li > a:hover {color:#990077;}
.navbar-inverse .nav > li > a:active, .navbar-inverse .nav > li > a:active {color:#7d7d7d;}

.navbar-inverse .btn-navbar { background:#7d7d7d;}
.navbar-inverse .btn-navbar:hover { background:#990077;}
.navbar-inverse .btn-navbar:active { background:#000d61;}
.branding .nav-collapse {overflow:hidden; float:right;
-webkit-transition: all 0.001s ease-in-out;
}

/*----- 2.3 Search ------------------------------------------------------------------- */
.form-search { float:right; margin:5px 5px 0; position:relative; width:125px;/* width:176px; */}
input.search-query { border-radius:4px; border-color:#d8d4d2; background-color:#f7f5f4; display:inline-block; font-size:0.7em; padding-right:20px; padding-left:8px;
-webkit-box-sizing: border-box; -o-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height:25px; }
.form-search input[type="submit"] { background: url("../img/icon-search.png") no-repeat scroll center 4px rgba(0, 0, 0, 0); border:0 none; display:inline-block; height:20px; margin:0; position:absolute; right:1px; top:2px; width:20px;}
.form-search input[type=submit]:hover { background-position:center -26px;}
.form-search input[type=submit]:active { background-position:center -56px;}

.team-search-function {font-size:80%;font-weight:normal;}

.search-field-function{font-size:100%;font-weight:bold;text-transform:capitalize;padding-bottom:20px;}
.search-form .wrap { clear:both; margin-top: 25px; }
.filter-wrap { text-align: left; width: 49%; float: left; margin-left: 2%;  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; }
.filter-wrap:first-of-type { margin-left: 0; }
.search-form .search-filter { padding: 10px 5px 10px 10px; background-color: #E6E6E6; border-radius:4px; display: block; margin-bottom: 5px; }
.search-form .search-filter input {background: none; border: 0; width: 5%;}
.search-form .search-filter label { margin: 0 0 5px 5px; color:#990077; font-weight: normal; width: 85%; }
.search-form .hint { font-style: italic; color: #888; font-size: 0.85em;}
.search-form .wrap + .row.buttons { display: block; clear:both; overflow:hidden; padding-top: 10px;  }
.search-form-box .row.buttons input[type=submit] { border-radius:4px; background: #990077; color: #fff; border: 0; padding: 10px 20px; -webkit-transition:All 0.2s ease; -moz-transition:All 0.2s ease; -o-transition:All 0.2s ease; transition:All 0.2s ease;  }
.search-form-box .row.buttons input[type=submit]:hover{ background: #000D61; -webkit-transition:All 0.2s ease; -moz-transition:All 0.2s ease; -o-transition:All 0.2s ease; transition:All 0.2s ease;  }

/*----- 2.4 Content ------------------------------------------------------------------- */
.article-list ul { margin:0 auto; list-style:none; overflow:hidden; padding-top:20px; }
.article-list ul li {float:left; margin-bottom:40px;}
.article-list .gallery {margin-left:-10px; margin-right:-10px; position:relative;}
.article-list .gallery [class*="span"] {margin-left:10px; margin-right:10px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box;}
/* .article-list ul li.span4:nth-child(4), .article-list ul li.span4:first-child { margin-left:0; } */


.ie8 .article-list ul li { margin-left:13px;}
.article-list .article-image, article .main-image , article.article img{ width:100%;-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;}
article.article .element img{width:auto;height:auto;}
article img.nofloat { margin:1.5em 0;}
.article-list h2.entry-title { font-size:1.438em; line-height:1.2; margin:11px 0;}
.article-list .meta, .article .meta, .aside .meta { text-transform:uppercase; letter-spacing:1px; font-weight:bold; color:#000; display:block; font-size:81.2%; margin-top:1em;}
.aside .meta { margin-top:0; }
.article .meta { margin-bottom:2em; }
.article-list .published, .article .published, .portlet-news .published, .aside .meta .published { color:#9a9b9b;}
.article-list .category, .article .category, .portlet-news .category, .aside .meta .category{ color:#990077;}
.archive.btn { clear:both; margin:0 auto 75px; display:block; width:200px; height: 35px; line-height: 35px;}
.contact .archive.btn { margin-bottom: 0;}
.team-archive.btn {width:160px;}
.article { margin-left:0; padding-right:30px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box;}
.individual-post .article { padding-right:0; -moz-box-sizing:none; -webkit-box-sizing: none; -o-box-sizing: none; box-sizing: none; margin-left:0; width:65.9575%;}
.individual-post .aside { float:right; margin-left:0;}
.article  .intro, .content p, .content li {line-height: 1.571em;}
.article  .intro { /* margin-bottom:2em;  */display:block; font-weight:700; font-size:1.214em;}
.article-footer { margin:4em 0;}
.article-footer .btn-large { font-size:13.5px;}
.article-footer .btn-large i { font-size:16px; }
.content .container, .content .row { /*width:85%;*/ margin:0 auto; /*border:1px solid green;*/ padding:0;}
.content .row.cta-newsletter { text-align:center; border-top:1px solid #d6d7d4; padding:80px 0; margin-top:4em;}
.cta-newsletter p { font-size:1.565em; color:#454546; font-weight:bold; margin-bottom:40px;}
.cta-newsletter input[type="text"] { background-color:#e5e1e1; text-align:center; font-weight:bold; padding:10px 45px 10px 10px;}
.cta-newsletter #newsletter-subscribe .row.buttons input[type="submit"] { background:#f3f2f2 url(../img/icon-arrow-small.png) 12px 7px no-repeat; border-radius:3px; border:0; display:inline-block; width:30px; height:30px; margin: -86px 0 0 221px; text-align:center; text-indent:-99999px;}
.cta-newsletter #newsletter-subscribe .row.buttons input[type="submit"]:hover { background-position:12px -43px; }
.cta-newsletter #newsletter-subscribe .row.buttons input[type="submit"]:active { background-position:12px -93px;}

#newsletter-subscribe div {margin:0; padding:0; display:inline; border:0;}
#newsletter-subscribe label {display:none;visibility:none;}
#newsletter-subscribe .errorSummary p {font-size:16px;padding:0;margin-bottom:0px;} 
#newsletterform ul {margin:5px 0 10px;} 
#newsletterform li {list-style:none;} 
#newsletter-subscribe .row.buttons { display:block;}

.filter, .article-list .filter { text-align:center; margin-bottom:2em;}
.filter a.btn.active {background:#990077;color:#fff;}
.filter li, .article-list .filter li { float:none; display:inline-block; margin:0 6px;}
.filter + p { text-align:center;max-width:80%; margin:3em auto}

.portlet-news a:hover { text-decoration:none;} 
.portlet-news .category a:hover { text-decoration:underline;} 
.portlet-news a .entry-title { color:#000; transition:All 0.4s ease;-webkit-transition:All 0.4s ease;-moz-transition:All 0.4s ease; -o-transition:All 0.4s ease; }
.portlet-news a:hover .entry-title { color:#990077; transition:All 0.4s ease;-webkit-transition:All 0.4s ease;-moz-transition:All 0.4s ease; -o-transition:All 0.4s ease;}
.portlet-news .meta { color:#333333;}
.portlet-news img { width:100%;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}

.article-image-content {/* float:right; margin-left:10px; margin-bottom:10px; */ display:block; margin-bottom:1.5em;
	-moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; 
}
.article-subtitle{margin-top:0;margin-bottom:20px;line-height:36px;}

article .main-image{margin-bottom:10px;}

/*----- -2.5 Sidebar ------------------------------------------------------------------- */

aside .widget { border-bottom:4px solid #e6e6e6; padding-bottom:1em;}
aside .widget.vcard { margin:0;}
aside .contact p { font-size:1em;}
aside .contact img { border:1px solid #e6e6e6; border-radius:4px; width:100%; margin-bottom:1em;}
aside .contact .name { margin-bottom:0.4em; display:block; color:#000;}
aside .contact .email { color:#000;}
aside .contact .email:hover { color:#990077; text-decoration:none;}
aside .contact .email:active { color:#000d61; }
aside  h2 { color:#9a9b9b; text-transform: uppercase; font-size:0.875em; letter-spacing:1px; margin-bottom:0;}
aside .project-meta h2 {line-height:30px; margin-bottom:0; margin-top:15px;}
aside .widget:first-of-type h2 { margin-top:0; line-height:1.3em;}

aside .portlet-news ul { margin:0; list-style:none;}
aside .portlet-news li { margin-bottom:3em;}
aside .portlet-news .entry-title { color:#000; font-size:1.063em; line-height:1.5; margin-bottom:0.4em;}
aside .portlet-news .meta{ font-size:0.813em; font-weight:bold; text-transform:uppercase;}

/*----- 2.6 Footer ------------------------------------------------------------------- */
#site-footer { background-color:#f9f9fa; color:#757575;}
#site-footer a {color:#757575;}
#site-footer a:hover { text-decoration:none; color:#000;}
#site-footer .container{ border-top:5px solid #e6e6e6; padding:100px 0 30px;}
#site-footer .row {margin-left:0;}
#site-footer .span4:first-child { margin-left:0;}
#site-footer ul { margin:0; list-style:none;}
#site-footer .social i { margin-right:10px;}
.copyright { margin-left:0;}
.copyright, .wabbit {  padding:80px 0 20px; font-size:0.813em; letter-spacing:1px; text-transform:uppercase; color:#b3b3b3; /*overflow:hidden*/}
.wabbit span { float:left;}
.wabbit .wabbit-logo { width:119px; height:30px; display:inline-block; float:left; margin:-8px 0 0 10px; background:#F9F9FA url(../img/logo-wabbit.png) 0 0 no-repeat; text-indent:-99999px; overflow:hidden;}
#site-footer .logo { /*width:150px; */margin-bottom:60px;}


/* 3. OVER ONS 
--------------------------------------------------------------------------- */

/*----- 3.1 OVER ONS - THUMBNAIL GALLERY  ----------------------------------------------------------- */

#team ul { position:relative; overflow:visible; margin-bottom:80px;}
#team .figcaption { background-color:#e6e3e3; display:block; padding:30px; position:absolute; /* width:940px; */ width:98%; left:0; display:none; margin:0 1%; 
	-moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; 
	-moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; 
}
.figcaption-contact{font-weight:bold;}
#team li .indicator { display:none; left:45%; margin-top:5px; position:relative; width: 0px; height: 0px; border-style: solid; border-width: 0 12.5px 15px 12.5px; border-color: transparent transparent #e6e3e3 transparent;} 
#team figure:hover {cursor:pointer;}
#team .vcard { width:30%; float:left; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; }
#team .vcard h2.n { font-size:1.5em; color:#000d61; margin-top:0;}
#team .vcard .function { text-transform: uppercase; color:#9a9b9b; border-bottom:3px solid #cecbcb; display:block; padding:0 0 20px 30px; margin:0 0 20px -30px;}
#team .vcard .social-media {  display:inline-block;}
#team .vcard .tel, #team .vcard .email { display:block;}
#team .vcard .email { padding-bottom:20px;}
#team .personal-details{ width:67.6%; margin-right:-1%; float:right; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; padding-top:10px;}

#team .figcaption.visible {display:block;}
#team .indicator.visible {display:block;}

.team-name{text-align:center;}


.thumbnail { border: none;border-radius: 6px; line-height:normal; padding:0; display: block; padding: 54% 0 0 0; position:relative; 
	-webkit-box-shadow:none;
	box-shadow: none;
}
a.thumbnail:hover, 
a.thumbnail:focus {
    border-color:transparent;
	-webkit-box-shadow: none;
	box-shadow: none;
}
.thumbnail-wrp {position:relative; margin-top: -54% }

.thumbnail .thumbnail-wrp:after { padding-top:54%; /* background-color:red; */ overflow:hidden; display: block; width:100%;  z-index:100; top:0; position:absolute; border-radius:6px;  
    content: ""; 
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
	-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
	box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);


}





/* 4. OUR WORK
--------------------------------------------------------------------------- */

.main-image-wrp {position:relative; margin-bottom: 1.5em; margin-top:1.5em;}
.aside-image-wrp {position:relative; }
.main-image-wrp:after,
.aside-image-wrp:after { display: block;  z-index:100; position:absolute; top:0; right:0; bottom:0; left:0; width:100%; border-radius:6px;  
    content: ""; 
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
	-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
	box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
}
.main-image-wrp .main-image {margin-bottom:0;}
.article-content img,
.image-mosaic-container .element-wrapper {
	border:1px solid rgba(0,0,0,0.1);
	-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box;  
}
.article-content img.no-border { border: 0;}
.article-content img {width: 100% !important; height: auto !important; }


/* 5. CONTACT
--------------------------------------------------------------------------- */
.contact header { /* background-image: url(../img/bg-contact-med.jpg); */}
.contact-people {text-align:center; display:block; margin:5em 0 2em 0;}
.row.row-contact-cta {text-align:center; margin:1em 0 4em 0;}
.row.row-contact-cta .tel {display:block; margin-top:1em;}
.contact-people li {display:inline-block; float:none;}
.contact-people figure {position:relative; text-align:center; display:block; margin-bottom: 4em;}
.contact-people figcaption {display:block; position:absolute; bottom:-30px; width: 100%;}
a.contact-e-mail, a.contact-e-mail :hover{text-decoration:none;}
.row.row-vcard .vcard {font-family: 'Gotham SSm A', 'Gotham SSm B', Arial, Helvetica, sans-serif; margin:3em 0 2em; font-size:0.875em; text-align:center; color:#000;} 
.vcard .span3 {width:20%; vertical-align:top; text-align:left;}
.vcard [class*="span"] {margin:0 0 0 2em; float:none; display:inline-block;}
.vcard [class*="span"]:first-child {margin-left:0;}
.vcard h4, .vcard h5 {font-size:0.938em !important; margin:0;}
.box {border:1px solid #e6e6e6;}
.row-google-map {margin:3em 0 5em 0; position:relative;}
#map-canvas {height:508px; margin:3em 0 5em 0;}

.r4 {-moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; }
.r5 {-moz-border-radius:5px; -webkit-border-radius:6px; border-radius:5px; }
.r6 {-moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; }
.r8 {-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; }


/* 6. MISC
--------------------------------------------------------------------------- */
.pagination { clear:left; margin:0; font-size:11px;}
.pagination ul {-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; margin:0; padding:0; vertical-align:middle; padding-left:6px;}
.pagination ul li { margin:0;}
.pagination ul li a { background-color:#e6e6e6; margin-right:5px; margin-bottom:10px; border-radius:4px; border:0; color:#990077; min-width:10px; text-align:center; }
.pagination ul > li > a:hover, 
.pagination ul > li > a:focus, 
.pagination ul > .active > a, 
.pagination ul > .active > span { background-color:#990077; color:#fff;}
.pagination ul li.selected a , .pagination ul li.selected a:visited { background-color:#000d61; color:#fff;}
.pagination ul li.hidden {display: none;}
.pagination ul li a:visited {background-color:#e6e6e6; color:#000;}

.scroll-to-top { display:inline-block; text-align:center; color:#000D61; padding:5px 10px; font-size:1.5em;background-color:#e6e6e6; border-radius:4px; float:right;}
.scroll-to-top:hover { background-color:#990077; color:#e6e6e6; text-decoration:none;}
.scroll-to-top:active, .scroll-to-top:focus { background-color:#000d61; color:#e6e6e6; text-decoration:none;}

.share { background-color:#e6e6e6;  color:#990077; border-radius:4px; padding:0 15px 0 0; float:right; position:relative; overflow:hidden; }
.share span:first-of-type {padding:10px 15px; display:inline-block; position:relative; z-index:5; width:90px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; float:left; font-size:13.5px; }
.share ul { display:inline-block; padding:0; float:right; margin:0;  }
.share-wrapper .share { float: none; width: 224px; margin: 0px auto 75px; height: 42px; }
.share-wrapper .share li { width: 18px; }
.border-triangle { width:2px; height:41px; background-color:#fff; display:inline-block; float:left;}
.border-triangle:after {content:""; display:block; position:absolute; top:16px;  left:87px; z-index:100;width: 0px;
height: 0px;
border-style: solid;
border-width: 5px 5px 5px 0;
border-color: transparent #e6e6e6 transparent transparent;}
.border-triangle:before {content:""; display:block; position:absolute; top:13px;  left:84px; z-index:50;width: 0px;
height: 0px;
border-style: solid;
border-width: 8px 8px 8px 0;
border-color: transparent #fff transparent transparent;}

.article .share li { margin:12px 0 0 15px; float:left; list-style:none;}
.article .share li a, .social-media { color:#E6E6E6; background-color:#757575; border-radius:3px; text-align:center;display:block; font-size:12px; width:18px; height:18px;}
.article .share li a:hover, .social-media:hover { text-decoration:none; background-color:#990077;  color:#E6E6E6;}
.article .share li a:active, .social-media:active { text-decoration:none; background-color:#000D61;  color:#E6E6E6;}
.share-wrapper .share li { margin:12px 0 0 15px; float:left; list-style:none;}
.share-wrapper .share li a, .social-media { color:#E6E6E6; background-color:#757575; border-radius:3px; text-align:center;display:block; font-size:12px; width:18px; height:18px;}
.share-wrapper .share li a:hover, .social-media:hover { text-decoration:none; background-color:#990077;  color:#E6E6E6;}
.share-wrapper .share li a:active, .social-media:active { text-decoration:none; background-color:#000D61;  color:#E6E6E6;}


/*----- 6.1 404 ----------------------------------------------------------- */
.error404 header { background-image: url(../img/bg-404-med.jpg);}
.row-contact-cta .btn-large {margin-top:0.5em;}
.row-contact-cta a {font-weight:normal; margin:0; line-height:normal;}
.row-contact-cta h3 {font-weight:normal; margin:0;}





/*----- 6.2 Extras ----------------------------------------------------------- */

.accessibility, .seo {position:absolute; left:-5000px; top:-5000px}
.clear {clear:both;}
.clear-left{clear:left;}
* html .clear {clear:both; height:0; font-size:0px; line-height:0px;}
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.roomy2 {margin:0 0 2em 0;}
.roomy3 {margin:0 0 3em 0;}
.roomy4 {margin:0 0 4em 0;}
.roomy5 {margin:0 0 5em 0;}

.no-transition, .no-transition:hover, .no-transition:active, #supersized img, .scrollto a .down, .scrollto a:hover .down, .scrollto a:active .down, .form-search input[type="submit"], .form-search input[type="submit"]:hover, .form-search input[type="submit"]:active, .cta-newsletter input[type="submit"], .cta-newsletter input[type="submit"]:hover, .cta-newsletter input[type="submit"]:active
 {
-webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -ms-transition: none !important;
  transition: none !important;	
	}	
	
	object, embed { width:100% !important; height:200% !important; }	
    
/* -----  6.3 Image mosaic   --------------------------------------------------------------------------------------------------------*/
.image-mosaic-container {margin:1em -10px; position:relative;}
.element { /* width:200px; */ height:170px; float:left; position:relative; }
.element.height2 { height: 340px; }
.element.height3, .image-mosaic-container { height: 510px; }
.element-wrapper {margin:0px; height:150px; overflow:hidden; background:#fff; background-color:#eee; overflow:hidden;
	-moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; 
}
/* .element-wrapper:after { display:block;  z-index:100; position:absolute; top:0; right:0; bottom:0; left:0; width:100%; 
    content: ""; 
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
	-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
	box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
} */
.element.height2 .element-wrapper { height: 320px; }
.element.height3 .element-wrapper { height: 490px; }

.element * {position:absolute; margin: 0;}
.element img {max-width:none;} /* fix bootstrap conflict */
.element-border {margin:10px; position:relative;}
.up1 {margin-top:-170px;} /* layout2 fix */    
/* -----  6.4 Image mosaic - fluid grid   ------------------------------------------------------------------------------*/
.fluid .column-x4 { width:100%;  }/* 78% */
.fluid .column-x4 .element { width:25%;}
.fluid .column-x4 .element.width2 { width:50%; }
.fluid .column-x4 .element.width3 { width:75%; }
.fluid .column-x4 .element.width4 { width:100%; }
.fluid .column-x4 .element-wrapper {width:100%; }
.fluid .first { margin-left:0;}
.fluid .last { margin-right:0;}
.pull-right.element {float:right;}
.pull-left.element {float:left;}

/* -----  6.5 bootstrap fixes   ------------------------------------------------------------------------------*/
#supersized img {max-width:none!important; } 

/* -----  6.6 Sitemap  ------------------------------------------------------------------------------*/
.sitemap {margin:1em 12.5%;}
.sitemap a { background:#e6e6e6; border-radius:4px; border:0; box-shadow:0; text-shadow:none; color:#8d8d8d; display:block; padding:8px 10px; text-decoration:none; margin:0.5em 0; font-size:1.15em; text-align:center;  }
.sitemap a:hover { background:#990077;color:#fff; text-decoration:none;}
.sitemap a:active { background:#000d61;color:#fff;}

/* -----  6.7 Search results page   ------------------------------------------------------------------------------*/
.search-form-box {text-align:center; background-color:#f9f9fa; /* border:1px solid #f3f3f2;  */margin-bottom:3em; padding:2em 1em; vertical-align:middle; margin-top:-28px;
	-moz-border-radius:6px 6px 0 0; -webkit-border-radius:6px 6px 0 0; border-radius:6px 6px 0 0; 
}
.search-form-box label {font-weight:bold; margin:0.4em 0; text-align:left; display:inline-block; vertical-align:top; padding-right:6px; color:#666;}
.search-form.search-form-box .row {display:inline; text-align:center; position:relative; /*left:-9px;*/ padding:0; width:auto;}
.search-form-box .row:before, .search-form-box .row:after {display:inline;}
.search-form-box input {display:inline-block; border:1px solid #aecb50; vertical-align:top; text-align:left; text-align:left; margin:0; background-color:#c6e466; color:#333; font-weight:bold; }
form .row.buttons input {background-color:#E6E6E6; color:#8D8D8D; color:#555; border:1px solid #ccc; padding: 5px 10px 5px 10px; margin-left:0px; margin-top:5px; position:relative; z-index:5; text-align:center; line-height: 18px;
    -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; 
}
.search-form-box .row.buttons input {background-color:#E6E6E6; color:#8D8D8D; color:#555; border:1px solid #ccc; border-left:1px solid #aecb50; padding: 5px 10px 6px 10px; margin-left:-7px; margin-top:0px; position:relative; z-index:5; text-align:center; line-height: 18px;
    -moz-border-radius:0 4px 4px 0; -webkit-border-radius:0 4px 4px 0; border-radius:0 4px 4px 0; 
}

.errorMessage{color:#990077;}

.w-search-highlight {background-color:#c6e466; color:#000000; font-weight:bold; padding:0 2px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; display:inline-block; margin:0 -2px; }
    
#search-results .summary {margin-top:-2.2em;}
#search-results .items {margin-top:2em; list-style:none; margin:2em 0 0 0; padding:0; }
.search-result {margin-bottom:2em; border-bottom:1px dotted #e6e6e6; padding-bottom:1em;}


/*----- 7. MEDIA QUERIES ----------------------------------------------------------- */

@media only screen and (min-width:768px )and (max-width:980px ) {
	.form-search { width:auto; }
	input.search-query { padding-right:2em; padding-left:1em;}
	.form-search input[type="submit"] { margin-left:-2em;}
}
    
@media (max-width: 979px) {
  
    .nav-collapse.in {overflow:hidden;}
    /* .in .form-search {margin-left:0;} */
    .language { float:right;
    	-moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;
   }

	#site-footer .row { margin-left:0; width:100%; }
	#site-footer .container {width:100%; padding-left:15px; padding-right:15px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; } 
	#site-footer .span4,
	.article-list .span4 { width:31%; }
	.article-list .gallery {margin-left:-1.16666666666666%; margin-right:-1.16666666666666%;}
	.article-list .gallery [class*="span"] {margin-left:1.16666666666666%; margin-right:1.16666666666666%;}
	/* header.large .header-contentwrapper {padding-top:150px;}  *//* padding-top:25%; causes issues on DKN screen where content to long is */
    #tagline {font-size:75%;}
	#site-footer .span8 { width:31%;}
	#site-footer .wabbit.span4 { width:50%;}
    a.header-cta {font-size:75%;}
	.container, .row {width:100%; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; }
	.row, .content .row { /* padding:0 15px; */ padding:0 20px;}
    .row.buttons, .content .row.buttons { padding:0;}
	.row.scrollto { left:0; right:0; margin-left:0;}
	.content-page .content .content-inner { -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; width:95%;}
    .individual-post.content-page .content .content-inner { width:auto; padding-right:0; padding-left:0;}
	.page-title-wrapper { padding:4em 20px;}
	article.span9 { width:70%;}
    .individual-post article.span8 { width:69%;/* 65.9575% */}
	.individual-post aside.span3 { width:24.5%;/* 23.40% */}
	.contact-people .span4 { width:45%; margin-left:0;}
    
    .navbar .nav > li > a { padding: 10px 13px;}

		
	/*---------RESPONSIVE NAVBAR---------------*/
	.navbar-wrapper .container { width:100%; padding-left:15px; padding-right:15px;  
 		-moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box;
  	}
	.navbar-fixed-top,
	.navbar-fixed-bottom { position: static; }
	.navbar-fixed-top { margin-bottom: 20px; }
	.navbar-fixed-bottom { margin-top: 20px; }
	.navbar-fixed-top .navbar-inner,
	.navbar-fixed-bottom .navbar-inner { padding: 5px; }
	.navbar .container { width: auto; padding: 0;  }
	.navbar .brand { padding-right: 10px; padding-left: 10px; }
  /*
.nav-collapse {
    clear: both;
  }
*/
  .nav-collapse .nav { float: none; margin: 15px 0px 10px; }
  .nav-collapse .nav > li {float: none; }
  .nav-collapse .nav > li > a { margin-bottom: 2px; }
  .nav-collapse .nav > .divider-vertical { display: none; }
  .nav-collapse .nav .nav-header { color: #777777; text-shadow: none; }
  .nav-collapse .nav > li > a,
  .nav-collapse .dropdown-menu a { padding: 9px 15px; font-weight: bold; color: #777777;
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
            border-radius: 3px;
  }
  .nav-collapse .btn { padding: 4px 10px 4px; font-weight: normal;
    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
  }
  .nav-collapse .dropdown-menu li + li a { margin-bottom: 2px; }
  .nav-collapse .nav > li > a:hover,
  .nav-collapse .nav > li > a:focus,
  .nav-collapse .dropdown-menu a:hover,
  .nav-collapse .dropdown-menu a:focus { background-color: #f2f2f2; }
  .navbar-inverse .nav-collapse .nav > li > a,
  .navbar-inverse .nav-collapse .dropdown-menu a { color: #000d61; }
  .navbar-inverse .nav-collapse .nav > li > a:hover,
  .navbar-inverse .nav-collapse .nav > li > a:focus,
  .navbar-inverse .nav-collapse .dropdown-menu a:hover,
  .navbar-inverse .nav-collapse .dropdown-menu a:focus { background-color: #e6e6e6; color:#990077; }
  .navbar-inverse .nav-collapse .nav li a:active,
  .navbar-inverse .nav-collapse .nav li a:focus, .navbar-inverse .nav-collapse .nav li.active a {
	 background-color:#000d61; color:#fff; 
	  }
      
  /* .nav-collapse.in {padding-bottom:20px;} */
  .nav-collapse.in .btn-group { padding: 0; margin-top: 5px; }
  .nav-collapse .dropdown-menu {
    position: static;
    top: auto;
    left: auto;
    display: none;
    float: none;
    max-width: none;
    padding: 0;
    margin: 0 15px;
    background-color: transparent;
    border: none;
    -webkit-border-radius: 0;
       -moz-border-radius: 0;
            border-radius: 0;
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }
  .nav-collapse .open > .dropdown-menu { display: block; }
  .nav-collapse .dropdown-menu:before,
  .nav-collapse .dropdown-menu:after { display: none; }
  .nav-collapse .dropdown-menu .divider { display: none; }
  .nav-collapse .nav > li > .dropdown-menu:before,
  .nav-collapse .nav > li > .dropdown-menu:after { display: none; }
  .nav-collapse .navbar-form,
  .nav-collapse .navbar-search {float: none; padding: 10px 15px; margin: 10px 0; border-top: 1px solid #f2f2f2; border-bottom: 1px solid #f2f2f2;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
       -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
  }
  .navbar-inverse .nav-collapse .navbar-form,
  .navbar-inverse .nav-collapse .navbar-search { border-top-color: #111111; border-bottom-color: #111111; }
  .navbar .nav-collapse .nav.pull-right {float: none; margin-left: 0;}
  .nav-collapse,
  .nav-collapse.collapse { height: 0; overflow: hidden;}
  .navbar .btn-navbar { display: block;}
  .navbar-static .navbar-inner { padding-right: 10px; padding-left: 10px; }
  
  
  	/* -----  6.3 Image mosaic  -----*/
	.element { height:120px;}
	.element.height2 { height: 290px; }
	.element.height3 { height: 410px; } /* this height is the issue if floated elememts don't occupy correct postion */
	.image-mosaic-container { height: 430px; }
	.element-wrapper {height:100px;}
	.element.height2 .element-wrapper { height: 270px; }
	.element.height3 .element-wrapper { height: 390px; }
	.up1 {margin-top:-120px;} 
  
  
}

@media only screen and (max-width:768px ){
    .content-page header {position:relative; }
    input.search-query {height:25px;}
	article.span9 {float:none; width:100%; padding-right:0;}
	aside.span3 {float:none; width:100%;}
	.row.row-vcard {padding:0;}
	.row.row-google-map {padding:0;}
	/* .section-gallery {margin:0 -20px;} */
	.row.row-vcard .vcard {margin: 2em 0;}
	.vcard .span3 {width:25%; text-align:left; margin-left:0.5em; font-size:90%;}
	.vcard .span3:first-child {width:15%;}
	
	/* -----  6.3 Image mosaic  -----*/
	/* .element { height:140px;}
	.element.height2 { height: 310px; }
	.element.height3 { height: 450px; }
	.image-mosaic-container { height: 480px; }
	.element-wrapper {height:120px;}
	.element.height2 .element-wrapper { height: 290px; }
	.element.height3 .element-wrapper { height: 430px; }
	.up1 {margin-top:-140px;}  */
	#tagline, 
	.cta-group.span8,
	.scrollto a {max-width:100%}
	header ul.cta-group .span4 {width:48%;}
	header ul.cta-group .span4:nth-child(2) {float:right; margin-left:2%;}
    .sitemap {margin:1em 1em;}
    /*.share span:first-of-type {display:none;}
    .border-triangle {width:0;}
    .border-triangle:before,
    .border-triangle:after {display:none;}*/
	

	}
    

@media only screen and (max-width:767px ){
    .navbar-wrapper {top:-5px; padding:12px 0;}
    .branding {border-bottom:1px dotted #DBDBDB; overflow:hidden; padding-top:3px;}
    .navbar .nav {float:none; overflow:hidden; margin:0 0 0 0px;}
    .navbar .nav > li {margin-top:0.5em;}
    .language .name {display:none;}
	.language .intitial {display:inline-block; }
    .content .search-form-box .row {padding:0; left:0;}
    .search-form-box label {display:block; text-align:center;}
     .search-form-box .search-filter label { display: inline-block;}
    #search-results .summary {margin-top:-0.5em; float:none; text-align:left;}
    .individual-post.content-page .article { width:auto;}
    .individual-post.content-page .aside { width:auto; margin:auto; float:none;}
    .individual-post.content-page .aside .widget {}
    .page-title.entry-title {width:auto;}




}

@media only screen and (max-width:725px ){
#team .vcard { float: none; width: auto;}
#team .personal-details { float: none; width: auto;}
#team .vcard .function { padding-left: 0; margin-left: 0; }
.search-form .wrap { padding-top: 20px;}
.search-form .filter-wrap { width: 100%; float: none; margin-left: 0;  }
.search-filter { overflow: hidden;}
.search-form.search-form-box .search-filter input{ float: left; width: 8%;}
.search-form.search-form-box .search-filter label {text-align: left; float: left; width: 80%}
.search-form .hint { margin-bottom: 10px;}
.search-form-box .row.buttons input[type=submit] { margin-left: 0;}
	}
    


@media only screen and (max-width: 480px) {
	#site-footer .container { max-width:90%;}
	body { font-size:75%;}
	#tagline { font-size:75%;}
	#tagline h1 { font-size:3em;}
	.brand { width:100px;}
    .language {padding-top:0; padding-bottom:0;}
	.content-page .content {  margin-top:-300px; }
	.page-title { font-size:90%;}
	/*.header-contentwrapper { font-size:75%;}*/
	#tagline, .cta-group.span8 { width:85%;}
	header ul.cta-group .span4 { margin-left:0; margin-bottom:6px; width:100%; display:block; float:none; }
	a.header-cta { padding:10px 15px; height:auto;}
	a.header-cta div {font-size:12px; line-height:16px;}
	.scrollto { font-size:65%;}
	.scrollto a { width:85%; padding:15px 15px;}
	a.header-cta i { height:40px;}
	.navbar-wrapper .container { padding-left:10px; padding-right:10px;}
    .navbar .nav {float:none; overflow:hidden; margin-left:-10px;}

	.navbar .btn-navbar { padding:5px 6px; margin-right:0;}
	.navbar .btn-navbar .icon-bar { width:14px;}
	.navbar .nav > li { margin-top:0;}
	.navbar .nav > li > a { padding:5px 10px;}
	.form-search { width:100px;}
	input.search-query, 
	.page-title.entry-title { width:100%; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box;}
	.page-title { font-size:200%; line-height:1.2em;}
	.language { margin:10px 0 10px 0; bottom:-20px;}
	.navbar-wrapper { padding:0px 0 5px; top:0px;}
	.navbar .brand { padding-top:8px; margin-left:0; padding-left:0;}
	.article-list .gallery {margin-left:0; margin-right:0;}
	.article-list .gallery [class*="span"] {margin-left:0; margin-right:0;}
	#site-footer .row .span4 { margin-bottom:20px;}
	.header-contentwrapper .row { margin:0 auto;}
	.content-page .content { margin-top:-100px;}
	.filter + p { max-width:95%;}
	.article-footer  { text-align:center;}
	.share { margin:30px 0; float:none;}
	.article .share li { margin-left:10px;}
	.copyright { padding-top:40px;}
	#site-footer .logo { max-width:60%; margin-bottom:40px;}
	.wabbit .wabbit-logo { max-width:35%; background-size:cover; height:22px; margin-top:-2px;}
	.scroll-to-top { margin-bottom: 15px;}
	
	.span4, .article-list ul li, #team .personal-details, #team .card{ float:none;}
	.article-list ul li, .article-list .span4, #site-footer .span4{ width:100%; margin-left:0;}
	.container, .row, #site-footer .wabbit.span4, #site-footer .span8, article.span9, aside.span3 { width:100%;}
	.filter li, .article-list .filter li { display:inline-block; margin-bottom:8px; width: auto;}
	article.span9 { padding:0;}
	aside.span3 { margin:30px 0;}
	#team .figcaption {margin:0;}
	#team .figcaption, #team .personal-details, #team .vcard { width:100%;}
	#team .vcard { margin-bottom:20px;}
	#team .vcard h2.n { line-height: 1.5em;}
	.contact-people figcaption { bottom: auto;}
	.contact-people .span4 { width: 100%; float: none;}
	.row-contact-cta h2 { font-size: 22px; line-height: 30px;  }
	.row-vcard .span3, .vcard .span3:first-child { width:45%; margin-left: 2.5% }
	.row-vcard .span3 h5 { line-height: 15px;}
	
	.section-gallery {margin:0 -25px}
    .search-form-box input { width: 80%; }
    .search-form-box .buttons input {width:auto;} 
	


	/* -----  6.3 Image mosaic  -----*/
	.element { height:100px;}
	.element.height2 { height: 270px; }
	.element.height3 { height: 370px; } /* this height is the issue if floated elememts don't occupy correct postion */
	.image-mosaic-container { height: 390px; }
	.element-wrapper {height:80px;}
	.element.height2 .element-wrapper { height: 250px; }
	.element.height3 .element-wrapper { height: 350px; }
	.up1 {margin-top:-100px;} 
	.animated {
		   -o-transition-property: none !important;
		   -moz-transition-property: none !important;
		   -ms-transition-property: none !important;
		   -webkit-transition-property: none !important;
		   transition-property: none !important;
		   -o-transform: none !important;
		   -moz-transform: none !important;
		   -ms-transform: none !important;
		   -webkit-transform: none !important;
		   transform: none !important;
		   -webkit-animation: none !important;
		   -moz-animation: none !important;
		   -o-animation: none !important;
		   -ms-animation: none !important;
		   animation: none !important;
		}
}
	@media only screen and (max-width: 385px) {
	.navbar .nav > li:first-child {display:none;} 

/*----- 8. debugging ----------------------------------------------------------- */
/* body {background-color:red; border: 10px solid red;}