/* Kessell Design CSS */

html {
	height:100%;
	width: 100%;
	overflow-y:scroll;
	overflow-x:hidden;
	}
	


body {
	height:100%;
	width: 100%;
	margin:0;
	-webkit-tap-highlight-color: transparent;
	-webkit-overflow-scrolling: touch;
	background-color: #fcfaf6;
	
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;
	font-size : 13pt;
	font-weight: 300;
	line-height: 175%;
	text-align:left;
	color: #1a1a1a;
	letter-spacing: 0px;
	}
	
html, * {
	cursor: none;
	}
	
.cursor {
	position: fixed;
	top: -100px;
	width: 100px;
	height: 100px;
	border-radius: 50px;
	border-radius: 50%;
	background: #ffffff;
	pointer-events: none;
	text-align: center;
	z-index: 10000;
	-webkit-mix-blend-mode: exclusion;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px); 
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
	-webkit-transform: scale(0.1);
	transform: scale(0.1);
	}
	
.cursor_follow {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 60px;
	height: 60px;
	border-radius: 30px;
	border-radius: 50%;
	background: #7caf00;
	pointer-events: none;
	z-index: 9900;
	opacity: 0;
	}
	
	

.cursor_label {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	opacity: 0;
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 10pt;
	font-weight: 400;
	color: #1a1a1a;
	letter-spacing: 6px;
	padding: 36% 0 0 0;
	}	
	
.cursor_label_scroll {
	position: absolute;
	top: -30px;
	left: -30px;
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 9pt;
	font-weight: 400;
	color: #1a1a1a;
	letter-spacing: 2px;
	text-transform: uppercase;
	}
	
.cursor_label_next,
.cursor_label_prev {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	opacity: 0;
	font-family: 'Nunito Sans', sans-serif;	
	font-size : 10pt;
	font-weight: 400;
	color: #ffffff;
	letter-spacing: 6px;
	padding: 36% 0 0 0;
	}

.cursor_thumbnail,
.cursor_thumbnail_word_3,
.cursor_thumbnail_word_1,
.cursor_thumbnail_word_7,
.cursor_thumbnail_word_2,
.cursor_thumbnail_word_5,
.cursor_thumbnail_word_4
 {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 50%;
	height: auto;
	pointer-events: none;
	z-index: 5000;
	opacity: 0;
	-webkit-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
	margin-top: -15%;
	}
	
.cursor_thumbnail_word_6 {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 60%;
	height: auto;
	pointer-events: none;
	z-index: 5000;
	opacity: 0;
	-webkit-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
	margin-top: -15%;
	}
	
.cursor_thumbnail img,
.cursor_thumbnail_word_3 img,
.cursor_thumbnail_word_1 img,
.cursor_thumbnail_word_6 img,
.cursor_thumbnail_word_7 img,
.cursor_thumbnail_word_2 img,
.cursor_thumbnail_word_5 img,
.cursor_thumbnail_word_4 img {
	width: 100%;
	height: auto;
	}
	
.preload {
	position: fixed;
	top: 0;
	left: 0;
	width 10px;
	height: 10px;
	overflow: hidden;
	z-index: -100;
	}
	

	/* common
----------------------------------------------------- */

.footer {
	position: relative;
	width: 100%;
	height: 50px;
	display: block;
	}

p {
	margin: 0; 
	padding-top: 10px; 
	}

a:focus { outline: none;}

a {
	text-decoration: none;
	color: #1a1a1a;
	}
	
ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	}
	
	
.hidden {
	display: none;
	}

	
.transparent {
	opacity: 0;
	}
	
	
hr {
	clear: both;
	height: 0;
	border: none;
	border-width: 0;
	background: transparent;
	margin: 0;
	}
	
.bold {
	font-weight: 500;
	}
	
.bolder {
	font-weight: 700;
	}
	
.float_right {
	float: right;
	}
	
.float_left {
	float: left;
	}
	
.exclusion {
	mix-blend-mode: exclusion;
	}
	
.sharp_img {
	image-rendering: -webkit-optimise-contrast;
	image-rendering: crisp-edges;
	}
	
.social_logo {
	width: 30px;
	height: auto;
	display: block;
	}
	


	/* head area
----------------------------------------------------- */



.page_top_section {
	position: relative;
	width: 100%;
	height: auto;
	z-index: 2000;
	}

.page_top_section_alt {
	position: relative;
	width: 100%;
	height: 30%;
	}
	
.landing_standfirst h1 {
	position: relative;
	margin: 13% 0 70px 10%;
	width: 50%;
	max-width: 900px;
	height: auto;
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 30pt;
	font-weight: 100;
	line-height: 115%;
	text-align:left;
	color: #1a1a1a;
	letter-spacing: 0px;
	}
	

.landing_standfirst .title {
	font-weight: 400;
	}

 
 	
.sub_standfirst {
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 30pt;
	font-weight: 100;
	line-height: 115%;
	text-align:left;
	color: #1a1a1a;
	letter-spacing: 0px;
	}
	
.categories {
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 9pt;
	font-weight: 500;
	line-height: 100%;
	text-align:left;
	color: #1a1a1a;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin: 20px 0 0 0;
	}
	
	
	
.large_cap {
	position: fixed;
		top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	}
	
	
.large_cap img {
	height: 100%;
	width: auto;
	display: block;
	}
	
.large_cap_top {
	opacity: 0.8;
	z-index: 1000;
	}
	
.large_cap_index {
	opacity: 0.5;
	z-index: 1000;
	}
	
.hero_image {
	position: relative;
	width: 94%;
	height: auto;
	margin-left: 3%;
	background: #ccc;
	overflow: hidden;
	}
	
.hero_image_100pc {
	position: relative;
	width: 100%;
	height: auto;
	margin-left: 0;
	overflow: hidden;
	}
	
.hero_image img,
.hero_image_100pc img {
	width: 100%;
	height: auto;
	display: block;
	}	
	
	
	
/* Logo and Navigation */

.logo {
	position: absolute;
	top: 50px;
	left: 10%;
		font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
		font-size : 14pt;
	font-weight: 400;
	text-align:left;
	color: #1a1a1a;
	letter-spacing: 1px;
	text-transform: none;
	margin: 0;
	z-index: 6000;
	}
	
.motif {
	position: absolute;
	top: 30px;
	left: 0;
	width: 10%;
	height: auto;
	z-index: 6000;
	background: transparent;
	}
	
.motif img {
	width: 70px;
	height: auto;
	margin: 0 auto;
	display: block;
	}
	
	
	
/* --- main menu --- */


.main_nav_holder {
	position: fixed;
	top: 0px;
	left: 0px;
	height: 130px;
	width: 100%;
	background-color: transparent;
	z-index: 9500;
	-webkit-transition: top 0.3s ease-out;
	transition: top 0.3s ease-out;
	}

.main_nav {
	position: absolute;
	top: 50px;
	right: 1%;
	height: auto;
	width: auto;
	z-index:9000;
	}
	
	
	
.main_nav li{
	display: inline;
	}
	
	
.mobile_nav {
	display: none;
	}

	
.menu_black,
.menu_black a {
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 13pt;
	font-weight: 300;
	text-align:left;
	text-decoration:none;
	letter-spacing: 1px;
	color: #000000;
	padding: 0 20px 0 0;
	}


	/* end of menu
----------------------------------------------------- */
	
	
.menu_screen {
	position: fixed;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent;
	z-index: 1000;
	}

.menu {
	position: fixed;
	top: 8%;
	left: 10%;
		font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
		font-size : 10pt;
	font-weight: 400;
	line-height: 300%;
	text-align: left;
	color: #1a1a1a;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin: 0;
	display: none;
	z-index: 4000;
	}
	
	
	
/* ---mobile menu---*/	
	
	
	.menu_icon,
.menu_icon_subpage {
	position: absolute;
	top: 28px;
	right: 24px;
	width: 24px;
	height: auto;
	z-index:50000;
	display: none;
	}
	
.menu_icon img,
menu_icon_subpage img {
	width: 100%;
	height: 100%;
	}
	
.list {
	display: block;
	}
	


.work_title {
	position: relative;
	margin: 0 0 0 9.5%;
	width: auto;
	height: auto;
	z-index: 500;
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 70pt;
	font-size : 8vw;
	font-weight: 400;
	line-height: 90%;
	text-align: left;
	color: #1f1f1f;
	letter-spacing: 0;
	}
	
.work_title_subpage {
	position: relative;
	margin: 0 0 0 0;
	width: auto;
	height: auto;
	z-index: 4000;
	}
	
.work_menu_screen {
	position: fixed;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent;
	z-index: -1;
	opacity: 1;
	transition: all 500ms;
	-webkit-transition: all 500ms;
	background: url('../images/CG/fade_bg.jpg') no-repeat center center; 
	-webkit-background-size: cover; 
	background-size: cover;
	}
	
.work_menu {
	position: relative;
	margin: 0 0 0 0;
	padding-left: 9.5%;
	width: auto;
	height: auto;
	z-index: 2000;
	opacity: 0.5;
	-webkit-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
	}
	
	
.work_title_subpage,
.work_menu,
.work_menu a {
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;
		font-size : 100pt;
		font-size : 9.5vw;
	font-weight: 400;
	line-height: 100%;
	text-align: left;
	color: #1a1a1a;
	letter-spacing: 0px;
	}
	
	
.work_menu:hover {
	color: #ffffff;
	opacity: 1;
	z-index: 6000;
	-webkit-transform: scale(1.10);
	transform: scale(1.10);
	}
	
.li_keep_as_black:hover {
		color: #000000;
		}	
		
.list:hover .work_title {
		opacity: 0;
		}	
	
/* colour backgrounds */

.word_1 {
	opacity: 1;
	background-color: transparent;
	}


.word_2 {
	background-color: #9db0c1;
	opacity: 0.5;
	}
	
.word_7 {
	background-color: #dde1b5;
	opacity: 1;
	}
	
.word_5 {
	background-color: #867149;
	opacity: 0.5;
	}
	
.blue_grey {
	background-color: #859dc1;
	opacity: 0.7;
	}
	

	

	
.word_6 {
	background-color: #993326;
	background: url('../images/CG/304a-London-Road-garden-4.jpg') no-repeat center center; 
	-webkit-background-size: cover; 
	background-size: cover;
	}
	
.green {
	background-color: #8cb48f;
	background: url('../images/CG/green_bg.jpg') no-repeat center center; 
	-webkit-background-size: cover; 
	background-size: cover;
	}
	
.functionality {
	background-color: #8cb48f;
	background: url('../images/landing/001-20-Church-Avenue.jpg') no-repeat center center; 
	-webkit-background-size: cover; 
	background-size: cover;
	}
	
.beauty {
	background-color: #8cb48f;
	background: url('../images/landing/002-304a-London-Road.jpg') no-repeat center center; 
	-webkit-background-size: cover; 
	background-size: cover;
	}
	
.practice_thumb {
	background: url('../images/CG/community_bg.jpg') no-repeat center center; 
	-webkit-background-size: cover; 
	background-size: cover;
	}
	
.gardens_thumb {
	background: url('../images/CG/connection_bg.jpg') no-repeat center center; 
	-webkit-background-size: cover; 
	background-size: cover;
	}
	
.values_thumb {
	background: url('../images/CG/biodiversity_bg.jpg') no-repeat center center; 
	-webkit-background-size: cover; 
	background-size: cover;
	}
	
.grey {
	background-color: #c7a975;
	background: url('../images/CG/gold_bg.jpg') no-repeat center center; 
	-webkit-background-size: cover; 
	background-size: cover;
	}
	
.grey_flat {
	background-color: #c7a975;
	}
	
	
.word_3 {
	background-color: #9db0c1;
	background: url('../images/landing/003-304a-London-Road.jpg') no-repeat bottom left; 
	-webkit-background-size: cover; 
	background-size: cover;
	}	

	
.dark_grey {
	color: #8a8a8a;
	}
	
	
/* Below the fold */

.below_the_fold_wrapper {
	position: relative;
	padding: 0 0 80px 0;
	}




/* Text areas */
	
.text_area {
	position: relative;
	margin: 0% 0% 0 10%;
	width: 35%;
	max-width: 500px;
	padding-bottom: 50px;
	z-index: 2000;
	}
	
.text_area_left {
	position: relative;
	margin: 0 0% 0 22%;
	width: 35%;
	max-width: 550px;
	padding-bottom: 50px;
	}
	
.text_area h2,
.text_area_left h2 {
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	margin: 0 0 10px 0;
	font-size: 22pt;
	font-weight: 400;
	line-height: 130%;
	letter-spacing: 0px;
	}
	
.text_area h3,
.text_area_left h3 {
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	margin: 30px 0 10px 0;
	font-size: 18pt;
	font-weight: 300;
	line-height: 130%;
	letter-spacing: 0px;
	}
	
.call_to_action_button {
	width: 30px;
	height: 30px;
	border-radius: 15px;
	margin: 30px 10px -8px -5px;
	background-color: #768626;
	display: inline-block;
	-ms-transition: all 0.3s ease-out; 
	-webkit-transition: all 0.3s ease-out; 
	transition: height all 0.3s ease-out; 
	color: #1a1a1a;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	}
	

.call_to_action_button:hover {
	-ms-transform: scale(0.7); 
    -webkit-transform: scale(0.7); 
    transform: scale(0.7);
    color: #b37d24;
	}
    
.call_to_action_submenu {
	margin-top: 30px;
	font-size: 13pt;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 3px;
	}
	
.call_to_action_submenu a {
	font-size: 13pt;
	font-weight: 600;
	letter-spacing: 3px;
	text-transform: uppercase;
	}
	

	
/* images */

	
.w30 {
	position: relative;
	width: 30%;
	}
	
.w35 {
	position: relative;
	width: 35%;
	}
	
.w40 {
	position: relative;
	width: 40%;
	}
	
.w45 {
	position: relative;
	width: 45%;
	}
	
.w50 {
	position: relative;
	width: 50%;
	height: auto;
	}
	
.w55 {
	position: relative;
	width: 55%;
	height: auto;
	}
	
	
.w60 {
	position: relative;
	width: 60%;
	height: auto;
	}
	
.w70 {
	position: relative;
	width: 70%;
	height: auto;
	}
	
.w80 {
	position: relative;
	width: 80%;
	height: auto;
	}
	
.w90 {
	position: relative;
	width: 90%;
	height: auto;
	}
	
.w100 {
	position: relative;
	width: 100%;
	height: auto;
	overflow: hidden;
	}
	
.w30 img,
.w35 img,
.w40 img,
.w45 img,
.w50 img,
.w55 img,
.w60 img,
.w70 img,
.w80 img,
.w90 img,
.w100 img {
	width: 100%;
	height: auto;
	display: block;
	}
	
	
.centered {
	margin: 0 auto;
	}
	
	
	
/* quote */

.quote {
	position: relative;
	margin: 0% 0% 0 50%;
	width: 40%;
	padding-bottom: 50px;
	z-index: 2000;
	
	font-family: 'Nunito Sans', sans-serif;	
	font-size: 26pt;
	font-weight: 200;
	line-height: 130%;
	letter-spacing: 0px;
	}
	
.quote::before {
    content: "";
    position: absolute;
    top: -100px;
    left: -220px;
    width: 350px;
    height: 350px; /* set explicitly */
    background: url('../images/quote/quotes-2.png') no-repeat;
    background-size: contain; /* or cover */
    opacity: 0.8;
    z-index: -1;
	}
	


	
.quote_attribution {
	font-family: 'Nunito Sans', sans-serif;	
	font-size: 18pt;
	font-weight: 200;
	line-height: 130%;
	letter-spacing: 0px;
	}

/* captions */
	
.caption_holder {
	position: relative;
	height: auto;
	margin: 0 0 5% 10%;
	padding: 0;
	width: 20%;
	font-family: 'Nunito Sans', sans-serif;	
	font-size : 12pt;
	font-weight: 600;
	line-height: 130%;
	text-align:left;
	color: #1a1a1a;
	letter-spacing: 0px;
	}	
	
	
.margin_top_15pc {
	margin-top: 15%;
	}
	
.margin_top_10pc {
	margin-top: 10%;
	}
	
.margin_top_5pc {
	margin-top: 5%;
	}
	
.margin_top_3pc {
	margin-top: 3%;
	}
	
.margin_left_5pc {
	margin-left: 5%;
	}
	
.margin_left_10pc {
	margin-left: 10%;
	}
	
.margin_left_15pc {
	margin-left: 15%;
	}
	
.margin_right_5pc {
	margin-right: 5%;
	}
	
.margin_right_10pc {
	margin-right: 10%;
	}
	
.margin_right_15pc {
	margin-right: 15%;
	}
	

/* slideshow */

.slideshow_holder {
	position: relative;
	height: 80%;
	height: 80vh;
	width: auto;
	margin: 5% 0 0 0;
	}
	
.slideshow {
	position: relative;
	height: 100%;
	width: 80%;
	margin-left: 10%;
	}
	
.slideshow img {
	height: 100%;
	width: auto;
	}
	
.slideshow_cursor_right {
	position: absolute;
	top: 0;
	left: 50%;
	width: 50%;
	height:100%;
	z-index:1000;
	}
	
.slideshow_cursor_left {
	position: absolute;
	top: 0;
	left: 0px;
	width: 50%;
	height:100%;
	z-index:1000;
	}
	
/* pager */


.cycle-pager { 
    text-align: left; 
    width: 100%; 
    z-index: 500; 
    position: absolute; 
    margin-top: 10px;
    }
	
.cycle-pager span { 
    font-family: 'Open Sans', sans-serif;
    font-size: 50px; 
    width: 16px; 
    display: inline-block; 
    color: #dddddd; 
    margin: 0 4px 0 4px;
   }
	
.cycle-pager span.cycle-pager-active { 
color: #000000;
	}
	
.cycle-pager > * { cursor: pointer;}

	
	
	
/* --------- project thumbnails section --------- */	

	
.thumbnails_wrapper  {
	position: relative;
	width: 90%;
	height: auto;
	font-size: 0;
	line-height: 0;
	margin: 0px auto 0 auto;
	background: transparent;
	list-style-type: none;
	padding: 0;
	}
	



.thumbnails_wrapper li {
	position: relative;
	width: 49%;
	height: auto;
	margin: 0.5%;
	display: inline-block;
	}
	


.thumbnails_wrapper li img {
	width: 100%;
	height: auto;
	display: block;
	}
	



/* --- overlay captions --- */
		
.project_title {
	position: absolute;
	bottom: 15%;
	left:10%;
	width: auto;
	height: auto;
	opacity: 1;
	-webkit-transition: all 500ms ease-out; 
	transition: height all 500ms ease-out; 
	pointer-events: none;
	}
	
.project_title h2 {
	text-transform: none;	
	font-family: 'Nunito', sans-serif;
	font-size : 20pt;
	font-weight: 300;
	color : #fff;
	letter-spacing: 10px;
	line-height: 100%;
	text-decoration: none;
	text-transform: uppercase;
	margin: 0;
	}
	
.project_title .indent {
	padding-left: 40px;
	}

.thumb {
	overflow: hidden;
	}	




.thumb img {
	width: 100%;
	height: auto;
	display: block;
	}

.image_wrapper {
	overflow: hidden;
}

/* Apply the blur effect to this wrapper, not the image */
.image_blur_layer  {
	-webkit-transform: scale(1); /* Default state for Safari */
	transform: scale(1);
	-webkit-transition: -webkit-filter 0.5s ease, -webkit-transform 0.5s ease;
	transition: filter 0.5s ease, transform 0.5s ease;
	will-change: filter, transform;
}

/* On hover: blur, darken, and scale the image layer */
.image_wrapper:hover .image_blur_layer {
	-webkit-filter: blur(4px) brightness(0.8);
	filter: blur(4px) brightness(0.8);
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}

	
.thumb:hover .project_title {
	opacity: 1;
	bottom: 20%;
	}	
	
.overlay {
	position: absolute;
	bottom: 0%;
	left: 0;
	width: 100%;
	height: 60%;
	background: url(../images/masks/thumbnail_mask.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	opacity: 0;
	
	-ms-transition: all 0.3s ease-out; 
	-webkit-transition: all 0.3s ease-out; 
	transition: height all 0.3s ease-out; 
	}




	
	
/* disable custom cursor for touch devices */

@media (hover: none), (pointer: coarse) {
  html, * {
    cursor: auto !important;
  }

  .cursor,
  .cursor_follow {
    display: none !important;
  }
}


.mobile_break {
	display: inline-block;
	}



/* Small screen and tablet media queries
--------------------------------------------------*/

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



.landing_standfirst h1 {
	position: relative;
	margin: 13% 0 70px 10%;
	width: 50%;
	max-width: 900px;
	height: auto;
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 24pt;
	font-weight: 100;
	line-height: 115%;
	text-align:left;
	color: #1a1a1a;
	letter-spacing: 0px;
	}
	









}


/* Mobile Media Queries
-----------------------------------------------------*/

@media only screen  and (max-width: 768px) 
	{	
	
	
body {
	font-size : 12pt;
	font-weight: 300;
	line-height: 155%;
	}
	
.float_left,
.float_right {
	float: none;
	}
	
	
	/* head area
----------------------------------------------------- */

.large_cap img,
.large_cap_top img,
.large_cap_index img {
	display: none;
	}

.page_top_section {
	position: relative;
	margin-top: 30%;
	width: 100%;
	height: auto;
	z-index: 2000;
	}

.page_top_section_alt {
	position: relative;
	width: 100%;
	height: 30%;
	}
	
.landing_standfirst h1 {
	position: relative;
	margin: 0 0 30px 10%;
	width: 80%;
	max-width: auto;
	height: auto;
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 18pt;
	font-weight: 100;
	line-height: 115%;
	text-align:left;
	color: #1a1a1a;
	letter-spacing: 0px;
	}
	

.landing_standfirst .title {
	font-weight: 400;
	}

 
 	
.sub_standfirst {
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 30pt;
	font-weight: 100;
	line-height: 115%;
	text-align:left;
	color: #1a1a1a;
	letter-spacing: 0px;
	}
	
	
/* Logo and Navigation */

.logo {
	position: absolute;
	top: 20px;
	left: 80px;
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 14pt;
	font-weight: 400;
	text-align:left;
	color: #1a1a1a;
	letter-spacing: 1px;
	text-transform: none;
	margin: 0;
	line-height: 120%;
	z-index: 6000;
	background: transparent;
	}
	
.mobile_break {
	display: block;
	}

	
.motif {
	position: absolute;
	top: 10px;
	left: 0;
	width: 80px;
	height: auto;
	z-index: 6000;
	background: transparent;
	}
	
.motif img {
	width: 60px;
	height: auto;
	margin: 0 auto;
	display: block;
	}
		
.menu_icon_subpage {
	display: block;
	}
		
	
.main_nav_holder {
	position: fixed;
	top: 0px;
	left: 0px;
	height: 80px;
	width: 100%;
	background-color: transparent;
	z-index: 9500;
	-webkit-transition: top 0.3s ease-out;
	transition: top 0.3s ease-out;
	}
	
.mobile_nav {
	position: fixed;
	top: 100px;
	left: 80px;
	display: none;
	z-index: 10000;
	}

	
.menu_black,
.menu_black a {
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	font-size : 22pt;
	font-weight: 300;
	text-align:left;
	text-decoration:none;
	letter-spacing: 0px;
	color: #000000;
	padding: 0 20px 0 0;
	line-height: 200%;
	}

.desktop {
	display: none;
	}
	
.below_the_fold_wrapper {
	position: relative;
	padding: 0 0 40px 0;
	}
	
	
	

/* images */

	
.w30,
.w35,
.w40,
.w45,
.w50,
.w55,
.w60,
.w70,
.w80,
.w90 {
	position: relative;
	width: 90%;
	height: auto;
	margin: 16px 0 0 5%;
	}
	
.w100 {
	position: relative;
	width: 100%;
	height: auto;
	overflow: hidden;
	}


.text_area {
	position: relative;
	margin: 10% 0% 0 10%;
	width: 80%;
	max-width: auto;
	padding-bottom: 20px;
	z-index: 2000;
	}

.text_area h2,
.text_area_left h2 {
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	margin: 0 0 10px 0;
	font-size: 18pt;
	font-weight: 400;
	line-height: 130%;
	letter-spacing: 0px;
	}
	
.text_area h3,
.text_area_left h3 {
	font-family: 'Nunito Sans', Myriad Pro, sans-serif;	
	margin: 30px 0 10px 0;
	font-size: 14pt;
	font-weight: 300;
	line-height: 130%;
	letter-spacing: 0px;
	}

.call_to_action_submenu {
	margin-top: 5px;
	font-size: 13pt;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 3px;
	}
	
.call_to_action_submenu a {
	font-size: 10pt;
	font-weight: 600;
	letter-spacing: 3px;
	text-transform: uppercase;
	}

.thumb {
	margin-top: 20px
}

.project_title {
	position: absolute;
	bottom: 15%;
	left:10%;
	width: auto;
	height: auto;
	opacity: 1;
	-webkit-transition: all 500ms ease-out; 
	transition: height all 500ms ease-out; 
	pointer-events: none;
	}
		
	
.project_title h2 {
	text-transform: none;	
	font-family: 'Nunito', sans-serif;
	font-size : 14pt;
	font-weight: 500;
	color : #fff;
	letter-spacing: 5px;
	line-height: 100%;
	text-decoration: none;
	text-transform: uppercase;
	margin: 0;
	}
	
/* quote */

.quote {
	position: relative;
	margin: 10% 0% 0 10%;
	width: 80%;
	padding-bottom: 20px;
	z-index: 2000;
	
	font-family: 'Nunito Sans', sans-serif;	
	font-size: 18pt;
	font-weight: 200;
	line-height: 130%;
	letter-spacing: 0px;
	}
	
.quote::before {
    content: "";
    position: absolute;
    top: -50px;
    left: -20px;
    width: 150px;
    height: 150px; /* set explicitly */
    background: url('../images/quote/quotes-2.png') no-repeat;
    background-size: contain; /* or cover */
    opacity: 0.8;
    z-index: -1;
	}
	


	
.quote_attribution {
	font-family: 'Nunito Sans', sans-serif;	
	font-size: 12pt;
	font-weight: 200;
	line-height: 130%;
	letter-spacing: 0px;
	}

/* captions */
	
.caption_holder {
	display: none;
	}
	
.slideshow_holder {
	position: relative;
	width: 90%;
	height: auto;
	margin: 20px 0 0 5%;
	}
	
.slideshow {
	position: relative;
	width: 100%;
	height: auto;
	margin-left: auto;
	}
	
.slideshow img {
	width: 100%;
	height: auto;
	margin-top: 15px;
	display: block;
	}


 .cycle-slideshow img {
    display: block !important;   /* show all */
    position: static !important; /* prevent absolute positioning */
    opacity: 1 !important;       /* undo fade effect */
    width: 100%;                 /* make them responsive */
    height: auto;
  }

  .cycle-slideshow > * {
    display: block !important;
  }
	

/* Optional: hide Cycle2 controls/pager on mobile */
  .cycle-pager,
  .next,
  .prev {
    display: none !important;
  }


.social_logo {
	width: 25px;
	height: auto;
	margin-top: 16px;
	display: block;
	}


	
}