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



/*

 * What follows is the result of much research on cross-browser styling.

 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,

 * Kroc Camen, and the H5BP dev community and team.

 */



/* ==========================================================================

   Base styles: opinionated defaults

   ========================================================================== */



html,

button,

input,

select,

textarea {

    color: #222;

}



html {

    font-size: 1em;

    line-height: 1.4;

}



/*

 * Remove text-shadow in selection highlight: h5bp.com/i

 * These selection rule sets have to be separate.

 * Customize the background color to match your design.

 */



::-moz-selection {

    background: #b3d4fc;

    text-shadow: none;

}



::selection {

    background: #b3d4fc;

    text-shadow: none;

}



/*

 * A better looking default horizontal rule

 */



hr {

    display: block;

    height: 1px;

    border: 0;

    border-top: 1px solid #ccc;

    margin: 1em 0;

    padding: 0;

}



/*

 * Remove the gap between images, videos, audio and canvas and the bottom of

 * their containers: h5bp.com/i/440

 */



audio,

canvas,

img,

video {

    vertical-align: middle;

}



/*

 * Remove default fieldset styles.

 */



fieldset {

    border: 0;

    margin: 0;

    padding: 0;

}



/*

 * Allow only vertical resizing of textareas.

 */



textarea {

    resize: vertical;

}



/* ==========================================================================

   Browse Happy prompt

   ========================================================================== */



.browsehappy {

    margin: 0.2em 0;

    background: #ccc;

    color: #000;

    padding: 0.2em 0;

}



/* ==========================================================================

   Author's custom styles

   ========================================================================== */

html {

    font-size: 1em;	

    line-height: 1.4;

	height: 100%;

}

body {

	background-color:#6f6f6e;

	color:#969594;

	font-family: "museo-sans",sans-serif;

	font-weight: 300;

	min-height: 100%;

}



.home-page body {

	font-family: "museo-sans",sans-serif;

	background-color:#333333;
	
	color:#ffffff;
}

.home-page h2 {

	font-family: "museo-sans",sans-serif;
	
	color:#ffffff;
}


.home-page ul, li, a {
	
	color:#ffffff;
}


a, a:link {

	font-family: "museo-sans",sans-serif;

	text-decoration:none;

	color:#ffffff;

}


.details-page a {

	font-family: "museo-sans",sans-serif;

	text-decoration:none;

	color:#e34b60;

}

.home-page h1 {

	font-family: "museo-sans",sans-serif;

	font-size:3.9em;

	font-weight: 900;

	line-height: 1.1;

	margin-bottom:1em;
	
	margin-left:0.6em;
	
	color:#c2c2c2;
	

}

.case-study-page h1  {

	font-family: "museo-sans",sans-serif;

	font-size:2.9em;

	font-weight: 300;

	line-height: 1.1;

	margin-bottom:0em;
	
	margin-left:0em;
	
	color:#cfcfce;
	

}


.exhibition-page h1  {

	font-family: "museo-sans",sans-serif;

	font-size:2.9em;

	font-weight: 300;

	line-height: 1.1;

	margin-bottom:0.4em;
	
	margin-left:0em;
	
	color:#cfcfce;
	

}

.exhibition-page a {

	font-family: "museo-sans",sans-serif;

	color:#e34b60;
	
	text-decoration:none;

}


.details-page h1  {

	font-family: "museo-sans",sans-serif;

	font-size:2.9em;

	font-weight: 300;

	line-height: 1.1;

	margin-bottom:0em;
	
	margin-left:0em;
	
	color:#dfdfde;
	

}


.details-page h3  {

	font-family: "museo-sans",sans-serif;

	color:#363434;
	
	margin-bottom:1em;
	

}

.smallheader {

	font-family: "museo-sans",sans-serif;

	font-size:1.3em;

	font-weight: 900;

	line-height: 0.8em;
	
	color:#969594;
	

}


.smallheadertwo {

	font-family: "museo-sans",sans-serif;

	width:622px;
	
	height:0px;
	
}


h2  {

	font-family: "museo-sans",sans-serif;

	font-size:1.7em;

	font-weight: 100;

	line-height: 1.0;
	
	margin-top:0em;

}

h3, h4 {

	font-family: "museo-sans",sans-serif;

	font-size:1.7em;

	font-weight: 100;

	line-height: 1.0;
	
	margin-bottom:0em;

}


p, ul {

	margin:0 0 0 0;
	list-style: none;

}


li {

	padding-left: 1.1em;	

}

.pinkbox {
	max-width: 620px;
	margin:0 0 0em 2.5em;
	padding: 30px;
	background-color:#e34b60;
	opacity: .7;
	border-radius:2px;
}

.pinkbox ul, li, a {
	color:#ffffff;
}


.greybox {
	max-width: 620px;
	margin:0 0 0em 2.5em;
	padding: 0px;
	border-radius:2px;
}

input, textarea {

	font-family: "museo-sans",sans-serif;	

	color:#3e3e3e;

	border-radius:none;

}

address {

	margin:0 0 1.8em 0;

	font-style:normal;

}

aside {

	font-size:1.2em;
	color: #5E5249;

}

blockquote {
	line-height:1.2;
	 margin-left:0px;
	 margin-right:0px;
	width:70%;
}

.details-page h1,

.details-page h2 {

	text-transform:lowercase;

}

.details-page h2 {

	margin-bottom:2em;

}

.page-loading {

	position:absolute;

	left:0;

	right:0;

	z-index:100;

	background-color:#fff;

	background-image:url(../img/content/loading_spinner.gif);

	background-position:center center;

	background-repeat:no-repeat;

	width:100%;

	height:100%;

}

.no-js .page-loading {

	display:none;

}

.intro {

	font-size:1.1em;

}

.large-text {

	font-family: "museo-sans",sans-serif;

	font-size:1.2em;	

	font-weight: 200;
	
	color:#363434;
}

.main-cont {

	font-family: "museo-sans",sans-serif;

	color:#363434;

}

.main-cont a {

	font-family: "museo-sans",sans-serif;

	color:#363434;

}

.wrap {

	max-width:100%px;

	margin:0 auto;

	clear:both;

}

.wrap2 {

	max-width:1004px;

	margin:0 auto;

	clear:both;

}

.row {

	background-color:#fcfbfa;	

}

*, input[type="search"] {

    box-sizing: border-box;

}

.banner img,

.case-study-thumbs img,

.media-holder img {

	width:100%;

	height:auto;

	max-width:100%;

}

.media-holdertwo img {

	width:50px;

	height:50px;
	
	margin-right: 20px;

}

.banner {

	padding-bottom: 0px;

}

.banner .wrap {

	position:relative;	

}

.logo-main {

	width:45%;

	max-width:828px;

	position:absolute;

	z-index:2;

	top:80px;

}

nav ul {

	width:100%;

	padding:0;

	margin:0;

}

nav li {

	float:left;

	list-style:none;

}

.main-content {

	padding-top: 40px;

 	padding-bottom: 80px;

}

.main-nav nav ul {

	float:left;

	width: auto;

	margin-right:86px;

}

.main-nav nav li {
	font-family: "museo-sans",sans-serif;

	font-size:1.8em;

	padding-top: 18px;

	padding-bottom: 10px;

	min-height:67px;

	font-weight: 200;

}

.main-nav nav li.current,

.main-nav nav li.current a {

	font-family: "museo-sans",sans-serif;

	color:#e34b60;

}

.main-nav nav li a {

	font-family: "museo-sans",sans-serif;

	color:#3e3e3e;

}

.main-nav nav li:first-child {

	padding-right:300px;
	padding-left:0px;

}




.main-nav nav li:last-child {

	padding-left:20px;
	
	border-left:1px solid #e34b60;

}

.main-nav img {

	float:left;

}

.case-study-thumbs li {

	border-right:1px solid #fff;

	border-bottom:1px solid #fff;

	padding:0;

	margin:0;

	width:12.5%;

}

.case-study-thumbs li a {

	display:block;
	background-color:#f15800;
}

.case-study-thumbs img {

	opacity:0.1;	

}

.no-js .case-study-thumbs img {

	opacity:1;	

}

.contact label {

	display: none;

}

.lt-ie9 .contact label {

	display: block;

	text-transform:lowercase;

}

.logo-top {

	display: block;

	float: left;

	width: auto;

}
.footer-container {
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	text-align:right;
}
.showFooter {
	background-color: #e34b60;
	display: inline-block;
	color: #FFF;
	padding: 3px 40px;
	margin-right: 10px;
	cursor:pointer;
	background-image: url(../img/backgrounds/arrow-1.png);
	background-repeat: no-repeat;
	background-position: center center;
}
.footer {
	background-color:#e34b60;
	padding: 30px 0px 26px;
	display:none;
	font-size:0.9em;
	text-align: left;
}
.no-js .footer {
	display:block;
}
.footer p,

.footer ul {

	font-family: "museo-sans",sans-serif;

	margin:0;

	color:#fff;

	line-height:1.1;

}

.footer li {

	padding:0 15px;

}

.footer li:first-child {

	border-right:1px solid #fff;

	padding-left: 0;

}

.footer li:last-child {

	margin-right:0;

}

.footer a {

	font-family: "museo-sans",sans-serif;

	color:#fff;

}
#footer-content h2 {

	font-family: "museo-sans",sans-serif;

	margin: -0.4em 0 .5em 0;
	color: #666;
}
.pinIt {

	position:fixed;

	left:0;

	bottom:0;

	width:100%;

}

.col-2 {

	float:left;

	width:60%;

}

.col-1 {

	width:35%;

	float:right;

	margin-left:5%;

}

.col-3 {

	width:80%;	

}

.col-4 {

	width:50%;

	float:left;

}
.col-5 {
	width:100%;
	clear:both;
}
.col-6 {
	width:50%;
	float:right;
	margin-bottom:20px;
}
.contact ul {

	margin:0;

	padding:0;

}

.contact li {

	margin:0 0 16px 0;

	padding:0;

	list-style:none;

}

.contact input[type=text],

.contact input[type=email],

textarea {

	width:313px;

	border:1px solid #d5d2d0;

	  padding: 10px 8px;

}

textarea {

	min-height:120px;

}

input[type=submit] {
	
	font-family: "museo-sans",sans-serif;

	border:none;

	padding:15px 40px;

	font-size: 1.5em;

	font-weight: 200;

	

}

.btn {
	
	font-family: "museo-sans",sans-serif;

	color:#fff;

	background-color:#f15800;

}

.pinkstrong {
	color:#969594;
	font-weight: 700;
}

.media-holder {

	display:inline-block;

	width:auto;

}

.quote-source {

	font-style:italic;	

}
#form1 {
	position:relative;	
}
.form-message {
	position:absolute;
	top:-2em;
	left:auto;
	color:#093;
}
.next-prev {
	position:fixed;
	top:50%;
	display:inline-block;
}
.next-prev a {

	font-size:3.1em;
	color:#e34b60;
	display:inline-block;
	min-width:40px;
	text-align:center;
}
.next-prev a:hover {
	background-color:#eee;
}
.next {
	right:20px;
}
.prev {
	left:20px;
}



























/* ==========================================================================

   Helper classes

   ========================================================================== */



/*

 * Image replacement

 */



.ir {

    background-color: transparent;

    border: 0;

    overflow: hidden;

    /* IE 6/7 fallback */

    *text-indent: -9999px;

}



.ir:before {

    content: "";

    display: block;

    width: 0;

    height: 150%;

}



/*

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

 */



.hidden {

    display: none !important;

    visibility: hidden;

}



/*

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

 */



.visuallyhidden {

    border: 0;

    clip: rect(0 0 0 0);

    height: 1px;

    margin: -1px;

    overflow: hidden;

    padding: 0;

    position: absolute;

    width: 1px;

}



/*

 * Extends the .visuallyhidden class to allow the element to be focusable

 * when navigated to via the keyboard: h5bp.com/p

 */



.visuallyhidden.focusable:active,

.visuallyhidden.focusable:focus {

    clip: auto;

    height: auto;

    margin: 0;

    overflow: visible;

    position: static;

    width: auto;

}



/*

 * Hide visually and from screenreaders, but maintain layout

 */



.invisible {

    visibility: hidden;

}



/*

 * Clearfix: contain floats

 *

 * For modern browsers

 * 1. The space content is one way to avoid an Opera bug when the

 *    `contenteditable` attribute is included anywhere else in the document.

 *    Otherwise it causes space to appear at the top and bottom of elements

 *    that receive the `clearfix` class.

 * 2. The use of `table` rather than `block` is only necessary if using

 *    `:before` to contain the top-margins of child elements.

 */



.clearfix:before,

.clearfix:after {

    content: " "; /* 1 */

    display: table; /* 2 */

}



.clearfix:after {

    clear: both;

}



/*

 * For IE 6/7 only

 * Include this rule to trigger hasLayout and contain floats.

 */



.clearfix {

    *zoom: 1;

}



/* ==========================================================================

   EXAMPLE Media Queries for Responsive Design.

   These examples override the primary ('mobile first') styles.

   Modify as content requires.

   ========================================================================== */
@media only screen and (max-width: 1115px) {
	.next-prev {
		display:none;	
	}
}
 

@media only screen and (max-width: 1024px) {



	.wrap2 {

		margin:0 20px;

	}
	
	.greybox {
	background-color:#6f6f6e;
	padding: 30px;
}



li {

	padding-left: 0em;	

}



.main-nav nav li:first-child {

	padding-right:40px;
	padding-left:0px;

}



.smallheader {

	font-size:1em;

	font-weight: 900;

	line-height: 0.8em;
	
	color:#969594;
	

}

.smallheadertwo {

	width:0px;
	
	height:0px;
	
}

blockquote {
	line-height:1.2;
	 margin-left:0;
	 margin-right:0;
	width:100%;
}

}



@media only screen and (max-width: 768px) and (orientation: portrait)  {

   .case-study-thumbs li {

  width: 25%;

}

.col-3 {

	width:100%;

}

.pinkbox {
	padding:10px;
	margin-top:6.2em;

}

}

@media only screen and (max-width: 700px) {

	ul, ol {

  padding: 0 0 0 20px;

}

	li {

  padding-left: 0;

}

blockquote {
	line-height:1.2;
	 margin-left:0;
	 margin-right:0;
	width:100%;
}

	.col-2,

	.col-1,

	.col-3,

	.col-4,
	.col-6 {

	float:none;

	width:100%;

	margin-left:0;

	margin-right:0;

	}

	h1,

	h2,

	.details-page h2 {

	margin-bottom:1.27em;

}

.contact input[type=text],

.contact input[type=email],

textarea {

	width:95%;

}

.main-nav nav ul {

    margin-right: 0;

}

	.main-nav nav {

	/*text-align:center;*/

}


.main-nav nav li {

  font-size: 1.2em;

}

.main-nav nav li:first-child {

  text-align:right;

}

.main-nav nav li:last-child {

  text-align:left;

}

.main-content {

  margin-top: 0px;

}

.logo-main {

	width:60%;


}





.greybox {
	padding: 10px;
}


@media only screen and (max-width: 600px) {

	.main-nav img {

  width: 90px;

  height: auto;

}

.main-nav nav li {

  padding-top: 10px;

  padding-bottom: 5px;

  min-height: 37px;

  font-size:1em;

}

.main-nav nav li:first-child {

  padding-right: 20px;

}

.main-nav nav li:last-child {

  padding-left: 10px;

}

.main-content {

    padding-top: 20px;

}

.footer p {

	clear:both;

	padding-top:1em;

}



}





@media print,

       (-o-min-device-pixel-ratio: 5/4),

       (-webkit-min-device-pixel-ratio: 1.25),

       (min-resolution: 120dpi) {

    /* Style adjustments for high resolution devices */

}



/* ==========================================================================

   Print styles.

   Inlined to avoid required HTTP connection: h5bp.com/r

   ========================================================================== */



@media print {

    * {

        background: transparent !important;

        color: #000 !important; /* Black prints faster: h5bp.com/s */

        box-shadow: none !important;

        text-shadow: none !important;

    }



    a,

    a:visited {

        text-decoration: underline;

    }



    a[href]:after {

        content: " (" attr(href) ")";

    }



    abbr[title]:after {

        content: " (" attr(title) ")";

    }



    /*

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

     */



    .ir a:after,

    a[href^="javascript:"]:after,

    a[href^="#"]:after {

        content: "";

    }



    pre,

    blockquote {

        border: 1px solid #999;

        page-break-inside: avoid;

    }



    thead {

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

    }



    tr,

    img {

        page-break-inside: avoid;

    }



    img {

        max-width: 100% !important;

    }



    @page {

        margin: 0.5cm;

    }



    p,

    h2,

    h3 {

        orphans: 3;

        widows: 3;

    }



    h2,

    h3 {

        page-break-after: avoid;

    }

}

