@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/* Mobile Layout: 480px and below. */

.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	padding-left: 0%;
	padding-right: 0%;
}
#background_video {
	width:480px;
	min-width:1334px;
	position:fixed; 
	left:-50%; 
	top:0px; 
	z-index:1;
	overflow:hidden;
	display:none;
}
#mobile_bg { 
	position:fixed;
	width:1360px;
	left:50%;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%); 
	top:0px; 
	z-index:1;
  overflow: hidden;
}
#menu {
	float:right;
	position:absolute;
	left:18px;
	top:18px;
	width:150px;
	z-index:130;
}
.menu {
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	width:100%;
	padding-left:5%;
	padding-bottom:0%;
	padding-right:5%;
	padding-top:0%;
    background:rgba(255,255,255,1);
	color:rgba(0,0,0,1);
	font-size:14px;
	font-family: Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	text-align:left;
	cursor:pointer;
    opacity:1;
}

#language {
	float:left;
	position:absolute;
	left:200px;
	top:18px;
	width:75px;
	z-index:130;
}
.menu_language {
	clear: both;
	float: left;
	width: 100%;
	margin-left: 0;
	display: block;
	padding-left:5%;
	padding-bottom:0%;
	padding-right:5%;
	padding-top:0%;
    background:#FFF;
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	text-align:left;
	cursor:pointer;
    opacity:0.5;
}
.menu_language_solo {
	clear: both;
	float: left;
	width: 100%;
	margin-left: 0;
	display: block;
	padding-left:5%;
	padding-bottom:0%;
	padding-right:5%;
	padding-top:0%;
    background:#FFF;
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	text-align:left;
	cursor:pointer;
    opacity:1;
}
#work_submenu {
	float:right;
	position:absolute;
	left:0px;
	top:160px;
	width:300px;
	z-index:121;
	display:none;
}
.submenu {
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	width:100%;
	padding-left:5%;
	padding-bottom:0%;
	padding-right: 5%;
	padding-top:0%;
    background:rgba(255,255,255,1);
	color:rgba(0,0,0,1);
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	text-align:left
	cursor:pointer;
    opacity:1;
}
#Biography { 
	position:absolute;
	left:0px;
	top:620px;
	width:90%;
	height:auto;
	z-index:122;
	display:none;
	padding-bottom:10px;
	padding-left:5%;
	padding-right:5%;
	padding-top:10px;
    background: rgba(255,255,255,1);
    opacity:1;
}
#bio_blank { 
	position:absolute;
	width:100%;
	height:460px;
	overflow:visible;
	left:0px;
	top:160px;
	z-index:121;
	display:none;
	padding-top:20px;
	padding-bottom:20px;
    background: rgba(255,255,255,1);
    opacity:1;
}
#photo_bella {
	position:absolute;
	width:300px;
	height:420px;
	left:50%;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%);
	z-index:122;
}

h1 {
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:rgba(0,0,0,1);
	line-height:14px;
	max-height:12px;
	text-height:12px;
}
h2 {
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:rgba(0,0,0,1);
	line-height:0px;
	max-height:12px;
	text-height:12px;
}
p3 {
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:rgba(0,0,0,1);
	font-weight:bold;
	text-decoration:none;
	line-height:14px;
	max-height:11px;
	text-height:11px;
}
p {
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:rgba(0,0,0,1);
}
p2 {
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
}
#contact { 
	position:absolute;
	left:0px;
	top:160px;
	width:90%;
	height:200%;
	z-index:122;
	display:none;
	padding-bottom:10px;
	padding-left:5%;
	padding-right:5%;
	padding-top:10px;
    background: rgba(255,255,255,1);
    opacity:1;

}
#work_screen_white {
	position:relative;
	left:0px;
	top:188px;
	width:100%;
	height:200px;
	z-index:100;
    background: rgba(255,255,255,1);
	opacity:1;
}
#work_screen_black {
	position:relative;
	left:0px;
	top:188px;
	width:100%;
	height:200px;
	z-index:100;
	padding-top:20px;
    background: rgba(0,0,0,1);
	opacity:1;
	overflow:hidden;
}
#work_screen_black_leaves_big {
	position:relative;
	left:0px;
	top:188px;
	width:100%;
	height:200px;
	z-index:100;
	padding-top:20px;
    background: rgba(0,0,0,1);
	opacity:1;
	display:none;
}
#work_screen_black_leaves {
	position:relative;
	left:0px;
	top:188px;
	width:100%;
	height:200px;
	z-index:100;
	padding-top:20px;
    background: rgba(0,0,0,1);
	opacity:1;
	display:none;
}
#full_screen_filter {
	position:fixed;
	width:1360px;
	left:50%;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%); 
	top:0px; 
	z-index:2;
  overflow: hidden;
  display:none;
}
	

#visual_diary {
	float:right;
	position:fixed;
	left:0px;
	bottom:0px;
	width:100%;
	z-index:121;
}
.visual_diary {
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	line-height:14px;
	max-height:12px;
	text-height:12px;
	padding-bottom:10px;
	padding-top:10px;
    background:rgba(214,214,214,1);
	color:rgba(0,0,0,1);
	box-shadow:rgba(0,0,0,1); 
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	text-align:center;
	cursor:pointer;
	opacity:1;
}
#gen_iframe {
	position:absolute;
	width:98.5%;
	min-height:100px;
	left:0px;
	top:160px;
	border:0px;
	z-index:100;
}
#gen_iframe_basic {
	position:absolute;
	width:100%;
	min-height:100px;
	left:0px;
	top:160px;
	border:0px;
	z-index:100;
}
#gen_iframe_leaves {
	position:absolute;
	width:70%;
	max-width: 100%;
	min-height:100px;
	left:50%;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%);
	border:0px;
	z-index:100;
	border-left:54px solid rgba(0,0,0,1);
	border-right:54px solid rgba(0,0,0,1);
}
#timelapse {
	width: 100%;
	height: auto;
	z-index: 100;
	border-bottom: 40px solid rgba(0,0,0,1);
	border-top: 20px solid rgba(0,0,0,1);
}
#missing_vid {
	width: 100%;
	height: auto;
	z-index: 100;
	border-top:10px solid rgba(0,0,0,1);
}
#timelapse_maman {
	width: 100%;
	height: auto;
	z-index: 100;
}
#gen_iframe_video {
	position:absolute;
	width:100%;
	left:0px;
	top:160px;
	border:0px;
	z-index:100;
}
#text { 
	position:relative;
	width:90%;
	height:auto;
	z-index:100;
	padding-bottom:50px;
	padding-left:5%;
	padding-right:5%;
	padding-top:60px;
    background: rgba(255,255,255,1);
	opacity:1;
}
#text_leaves { 
	position:relative;
	width:90%;
	height:auto;
	z-index:100;
	margin-top:30px;
	padding-bottom:50px;
	padding-left:5%;
	padding-right:5%;
	padding-top:60px;
    background: rgba(255,255,255,1);
	opacity:1;
}
#text_living {
	position:relative;
	width:90%;
	height:auto;
	z-index:100;
	padding-bottom:50px;
	padding-left:5%;
	padding-right:5%;
	padding-top:60px;
    background: rgba(255,255,255,1);
	opacity:1;
}
}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {

}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 1150px) {
.gridContainer {
	width: 100%;
	max-width: 1232px;
	padding-left: 0%;
	padding-right: 0%;
	margin: auto;
}
#background_video { 
  position: fixed;
  top: 50%; 
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  min-width: 100%;
  width:100%;
  height:auto;
  overflow: hidden;
  z-index: 1;
  
}
#mobile_bg { 
  position: absolute;
  top: 50%; 
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  min-height: 100%;
  width:auto;
  height:auto;
  z-index: 1; 
  overflow: hidden;
  display:none;
}

#menu {
	float:right;
	position:fixed;
	left:0.5%;
	top:0px;
	width:12.9%;
	z-index:130;
}
.menu {
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	padding-left:5%;
	padding-bottom:0%;
	padding-right:5%;
	padding-top:0%;
    background:rgba(255,255,255,1);
	color:rgba(0,0,0,1);
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	text-align:left;
	cursor:pointer;
    opacity:1;
     -webkit-transition: background .5s ease-in-out;
     -moz-transition: background .5s ease-in-out;
     -o-transition: background .5s ease-in-out;
     transition: background .5s ease-in-out;
}
.menu:hover {
	background:rgba(240,240,240,1)

}
#language {
	float:right;
	position:fixed;
	left:1%;
	top:45%;
	width:12.6%;
	z-index:130;
}

.menu_language {
	clear: both;
	float: left;
	width:50%;
	margin-left: 0;
	display: block;
	padding-left:5%;
	padding-bottom:0%;
	padding-right:5%;
	padding-top:0%;
    background:#FFF;
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	text-align:right;
	cursor:pointer;
    opacity:0.5;
     -webkit-transition: opacity .5s ease-in-out;
     -moz-transition: opacity .5s ease-in-out;
     -o-transition: opacity .5s ease-in-out;
     transition: opacity .5s ease-in-out;
}
.menu_language:hover {
	opacity: 1;

}


.menu_language_solo {
	clear: both;
	float: left;
	width:50%;
	margin-left: 0;
	display: block;
	padding-left:5%;
	padding-bottom:0%;
	padding-right:5%;
	padding-top:0%;
    background:#FFF;
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	text-align:right;
	cursor:pointer;
    opacity:1;
}
#work_submenu {
	float:right;
	position:fixed;
	left:14.9%;
	top:7.65%;
	width:300px;
	z-index:121;
	display:none;
}
.submenu {
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	padding-left:5%;
	padding-bottom:0%;
	padding-right: 5%;
	padding-top:0%;
    background:rgba(255,255,255,1);
	color:rgba(0,0,0,1);
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	text-align: left;
	cursor:pointer;
    opacity:1;
     -webkit-transition: background .5s ease-in-out;
     -moz-transition: background .5s ease-in-out;
     -o-transition: background .5s ease-in-out;
     transition: background .5s ease-in-out;
}
.submenu:hover {
	background:rgba(240,240,240,1)

}
#visual_diary {
	float:right;
	position:fixed;
	left:15.6%;
	top:95%;
	width:auto;
	z-index:121;
}
.visual_diary {
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	padding-left:10px;
	padding-bottom:10px;
	padding-right: 10px;
	padding-top:10px;
	line-height:14px;
	max-height:12px;
	text-height:12px;
    background:rgba(214,214,214,1);
	color:rgba(0,0,0,1);
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	text-align:left;
	cursor:pointer;
	opacity:1;
     -webkit-transition: background .5s ease-in-out;
     -moz-transition: background .5s ease-in-out;
     -o-transition: background .5s ease-in-out;
     transition: background .5s ease-in-out;
}
.visual_diary:hover {
	background:rgba(255,255,255,1);

}
#Biography { 
	position:absolute;
	width:19%;
	height:100%;
	overflow:visible;
	left:15%;
	top:0px;
	z-index:122;
	display:none;
	padding-left:0.7%;
	padding-bottom:0.7%;
	padding-right: 0.7%;
	padding-top:0.7%;
    background: rgba(255,255,255,1);
    opacity:1;
}
#bio_blank { 
	position:fixed;
	width:85%;
	height:100%;
	overflow:visible;
	left:15%;
	top:0px;
	z-index:121;
	display:none;
	padding-left:0.7%;
	padding-bottom:0.7%;
	padding-right: 0.7%;
	padding-top:0.7%;
    background: rgba(255,255,255,1);
    opacity:1;
}
#photo_bella {
	position:fixed;
	width:33%;
	height:auto;
	left:73%;
	bottom:5%;
	transform:translateX(-27%);
	-webkit-transform:translateX(-27%);
	z-index:122;
}
#contact_blank { 
	position:fixed;
	width:85%;
	height:100%;
	overflow:visible;
	left:15%;
	top:0px;
	z-index:121;
	display:none;
	padding-left:0.7%;
	padding-bottom:0.7%;
	padding-right: 0.7%;
	padding-top:0.7%;
    background: rgba(255,255,255,1);
    opacity:1;
}
#contact { 
-webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
	-webkit-column-width: 200px;
    column-width: 200px;
	position:fixed;
	width:38%;
	height:100%;
	overflow:visible;
	left:15%;
	top:0px;
	z-index:122;
	display:none;
	padding-left:0.7%;
	padding-bottom:0.7%;
	padding-right: 0.7%;
	padding-top:0.7%;
    background: rgba(255,255,255,1);
    opacity:1;
}
#leaves {
	position:fixed;
	width:65%;
	height:100%;
	left:35%;
	top:0px;
	padding-top:0px;
	border:0px;
	z-index:120;
	overflow:hidden;
}
#gen_iframe {
	position:fixed;
	top: 50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	left: 35%;
	width: 65%;
	height: auto;
	z-index: 100;
	overflow:hidden;
}
#gen_iframe_basic {
	position:fixed;
	top: 50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	left: 35%;
	width: 65%;
	height: auto;
	z-index: 100;
	overflow:hidden;
}
#gen_iframe_leaves {
	position:fixed;
	top: 50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	left: 35%;
	width: 65%;
	height: auto;
	z-index: 100;
	overflow:hidden;
	display:none;
}
#gen_iframe_video {
	position:fixed;
	top: 50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	left: 35%;
	width: 65%;
	height: auto;
	z-index: 100;
	overflow:hidden;
}
#timelapse {
	width: 100%;
	height: auto;
	z-index: 100;
	overflow:hidden;
}
#missing_vid {
	width: 100%;
	height: auto;
	z-index: 100;
	overflow:hidden;
}
#timelapse_maman {
	width: 100%;
	height: auto;
	z-index: 100;
	overflow:hidden;
}

#text { 
	position:absolute;
	left:14.9%;
	top:0.01px;
	width:19%;
	height:100%;
	min-height:1080px;
	overflow:scroll;
	z-index:100;
	padding-left:0.7%;
	padding-bottom:0%;
	padding-right:0.7%;
	padding-top:0%;
	text-align:left;
    background: rgba(255,255,255,1);
}

#text_leaves { 
	position:absolute;
	left:14.9%;
	top:0.01px;
	width:19%;
	height:100%;
	min-height:1080px;
	overflow:scroll;
	z-index:100;
	padding-left:0.7%;
	padding-bottom:0%;
	padding-right:0.7%;
	padding-top:0%;
	margin-bottom:100px;
	margin-top:0px;
	text-align:left;
    background: rgba(255,255,255,1);
}

#text_living { 
	position:absolute;
	left:14.9%;
	top:0.01px;
	width:19%;
	height:100%;
	min-height:1080px;
	overflow:scroll;
	z-index:100;
	padding-left:0.7%;
	padding-bottom:0%;
	padding-right:0.7%;
	padding-top:0%;
	margin-bottom:100px;
	text-align:left;
    background: rgba(255,255,255,1);
}
#work_screen_white {
	position:fixed;
	width:65%;
	height:100%;
	min-height:1080px;
	overflow:hidden;
	left:35%;
	top:0px;
	border:0px;
	background-color:rgba(255,255,255,1);
	z-index:99;
}
#work_screen_black {
	position:fixed;
	width:65%;
	height:100%;
	min-height:1080px;
	overflow:hidden;
	left:35%;
	top:0px;
	border:0px;
	background-color:rgba(0,0,0,1);
	z-index:99;
}
#work_screen_black_leaves_big {
	position:fixed;
	width:65%;
	height:100%;
	min-height:1080px;
	overflow:hidden;
	left:35%;
	top:0px;
	border:0px;
	background-color:rgba(0,0,0,1);
	z-index:99;
}

#work_screen_black_leaves {
	position:fixed;
	width:65%;
	height:100%;
	min-height:1080px;
	overflow:hidden;
	left:35%;
	top:0px;
	border:0px;
	background-color:rgba(0,0,0,1);
	z-index:99;
	display:none;
}
#full_screen_filter {
	position:fixed;
	width:100%;
	height:auto;
	overflow:hidden;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	z-index:2;
	display:block;
}
.gif {
	display:none;
}
h1 {
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:rgba(0,0,0,1);
	line-height:14px;
	max-height:12px;
	text-height:12px;
}
h2 {
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:rgba(0,0,0,1);
	line-height:0px;
	max-height:12px;
	text-height:12px;
}
p3 {
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:rgba(0,0,0,1);
	font-weight:bold;
	text-decoration:none;
	line-height:14px;
	max-height:11px;
	text-height:11px;
}
p {
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:rgba(0,0,0,1);
}
p2 {
	font-family:Arial, Helvetica, sans-serif;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:rgba(0,0,0,1);
}
video#bgvid { 
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background: url(mobile_bg.jpg) no-repeat;
}
}
	
