/*
Plugin: jQuery Parallax
Version 1.1
Author: Ian Lunn
Author URL: http://www.ianlunn.co.uk/
Plugin URL: http://www.ianlunn.co.uk/plugins/jquery-parallax/

License: http://creativecommons.org/licenses/by-sa/3.0/ (Attribution Share Alike). Please attribute work to Ian Lunn simply by leaving these comments in the source code or if you'd prefer, place a link on your website to http://www.ianlunn.co.uk/.
*/

/************/

.hidden{
	display: none !important;
}
.hide-980{
	display: block;
}
.hello-980{
	display: none;
}

body{
margin:0;
min-width:980px;
padding:0;
font-family: 'BioRhyme', serif;
font-weight: 300;
font-size:10px;
color:#333;
background-color: rgba(193, 179, 167, 0.5);
}
/*Hack4Chrome*/
	html,body{
width:100%;
height:100%;
}
p{
margin:0 0 20px 0;
font-size:1.4em;
line-height:20px;
}
h1, h2, h3{
font-family: 'Source Sans Pro', sans-serif;
font-weight: 400;
}

a{
color:#ecbb27;
}
/*MENU*/

*,
*:after,
*::before{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
.bt-menu{
position:fixed;
z-index:999;
top:0;
left:0;
width:100%;
height:0;
border-width:0px;
border-style:solid;
border-color:#333;
background-color:rgba(0,0,0,0.0);
/*backface-visibility*/
-webkit-backface-visibility:hidden;
   -moz-backface-visibility:hidden;
    -ms-backface-visibility:hidden;
     -o-backface-visibility:hidden;
        backface-visibility:hidden;
/*transition*/
-webkit-transition:border-width 0.3s, background-color 0.3s, height 0s 0.3s;
   -moz-transition:border-width 0.3s, background-color 0.3s, height 0s 0.3s;
     -o-transition:border-width 0.3s, background-color 0.3s, height 0s 0.3s;
        transition:border-width 0.3s, background-color 0.3s, height 0s 0.3s;
font-family:"FlexoCapsDEMORegular", sans-serif;
}
.bt-menu.bt-menu-open{
height:100%;
border-width:0px 0px 66px 180px;
background-color:rgba(0,0,0,0.3);
/*transition*/
-webkit-transition:border-width 0.3s, background-color 0.3s;
   -moz-transition:border-width 0.3s, background-color 0.3s;
     -o-transition:border-width 0.3s, background-color 0.3s;
        transition:border-width 0.3s, background-color 0.3s;
}
.bt-overlay{
position:absolute;
width:100%;
}
.bt-menu-open .bt-overlay{
height:100%;
}
/*Traits*/
.bt-menu-trigger{
position:fixed;
top:10px;
left:20px;
z-index:100;
display:block;
width:50px;
height:50px;
cursor:pointer;
}
.bt-menu-trigger span{
position:absolute;
top:50%;
left:0;
display:block;
width:100%;
height:8%;
background-color:#ccc;
font-size:0px;
-webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
/*transition*/
-webkit-transition:background-color 0.3s;
   -moz-transition:background-color 0.3s;
     -o-transition:background-color 0.3s;
        transition:background-color 0.3s;
}
.bt-menu-trigger span:before,
.bt-menu-trigger span:after{
position:absolute;
left:0;
width:100%;
height:100%;
background:#ccc;
content:'';
/*transition*/
-webkit-transition:-webkit-transform 0.3s;
   -moz-transition:   -moz-transform 0.3s;
     -o-transition:     -o-transform 0.3s;
        transition:        transform 0.3s;
}
.bt-menu-trigger span:before{
/*transform*/
-webkit-transform:translateY(-250%);
   -moz-transform:translateY(-250%);
    -ms-transform:translateY(-250%);
     -o-transform:translateY(-250%);
        transform:translateY(-250%);
}
.bt-menu-trigger span:after{
/*transform*/
-webkit-transform:translateY(250%);
   -moz-transform:translateY(250%);
    -ms-transform:translateY(250%);
     -o-transform:translateY(250%);
        transform:translateY(250%);
}
.bt-menu-trigger span{
/*transition*/
-webkit-transition:all 0.0s;
   -moz-transition:all 0.0s;
     -o-transition:all 0.0s;
        transition:all 0.0s;
}
.bt-menu-open .bt-menu-trigger span{
background:#b8c3c5;
/*transition*/
-webkit-transition:all 0.0s;
   -moz-transition:all 0.0s;
     -o-transition:all 0.0s;
        transition:all 0.0s;
}
.bt-menu-open .bt-menu-trigger span:before{
background:#b8c3c5;
/*transform*/
-webkit-transform:translateY(-300%);
   -moz-transform:translateY(-300%);
    -ms-transform:translateY(-300%);
     -o-transform:translateY(-300%);
        transform:translateY(-300%);
}
.bt-menu-open .bt-menu-trigger span:after{
/*transform*/
-webkit-transform:translateY(300%);
   -moz-transform:translateY(300%);
    -ms-transform:translateY(300%);
     -o-transform:translateY(300%);
        transform:translateY(300%);
background:#b8c3c5;
}
.bt-menu ul{
position:fixed;
margin:0;
padding:0;
list-style:none;
}
.bt-menu ul:first-of-type{
top:75px;
left:0;
}
.bt-menu ul:nth-of-type(2){
right:0;
bottom:6px;
}
.bt-menu ul li,
.bt-menu ul li a{
display:block;
font-size:1rem;
}
.bt-menu ul:nth-of-type(2) li{
float:left;
font-size:0px;
}
.bt-menu ul li{
visibility:hidden;
opacity:0;
/*transition*/
-webkit-transition:-webkit-transform 0.3s, opacity 0.2s, visibility 0s 0.3s;
   -moz-transition:   -moz-transform 0.3s, opacity 0.2s, visibility 0s 0.3s;
     -o-transition:     -o-transform 0.3s, opacity 0.2s, visibility 0s 0.3s;
        transition:        transform 0.3s, opacity 0.2s, visibility 0s 0.3s;
}
.bt-menu.bt-menu-open ul:first-of-type li,
.bt-menu.bt-menu-open ul:nth-of-type(2) li{
visibility:visible;
opacity:1;
/*transition*/
-webkit-transition:-webkit-transform 0.3s, opacity 0.3s 0.1s;
   -moz-transition:   -moz-transform 0.3s, opacity 0.3s 0.1s;
     -o-transition:     -o-transform 0.3s, opacity 0.3s 0.1s;
        transition:        transform 0.3s, opacity 0.3s 0.1s;
}
/* Left menu */
.bt-menu ul:first-of-type li{
width:180px;
height:50px;
line-height:50px;
/*transform*/
-webkit-transform:translate3d(-100%,50%,0);
   -moz-transform:translate3d(-100%,50%,0);
    -ms-transform:translate3d(-100%,50%,0);
     -o-transform:translate3d(-100%,50%,0);
        transform:translate3d(-100%,50%,0);
}
.bt-menu.bt-menu-open ul:first-of-type li{
/*transform*/
-webkit-transform:translate3d(0,0,0);
   -moz-transform:translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
     -o-transform:translate3d(0,0,0);
        transform:translate3d(0,0,0);
}
.bt-menu ul:first-of-type li a:hover,
.bt-menu ul:first-of-type li a:focus,
.bt-menu ul li a:hover:before,
.bt-menu ul li a:focus:before{
color:#ecbb27;
}
.bt-menu ul li a{
display:block;
outline:none;
text-decoration:none;
}
.bt-menu ul:first-of-type li a{
padding:0 20px;
/*box-shadow*/
-webkit-box-shadow:inset 0 1px rgba(0,0,0,0.2);
   -moz-box-shadow:inset 0 1px rgba(0,0,0,0.2);
        box-shadow:inset 0 1px rgba(0,0,0,0.2);
color:#ffffff;
text-transform:uppercase;
letter-spacing:1px;
/*transition*/
-webkit-transition:color 0.2s;
   -moz-transition:color 0.2s;
     -o-transition:color 0.2s;
        transition:color 0.2s;
}
.bt-menu ul:first-of-type li:last-child a{
/*box-shadow*/
-webkit-box-shadow:inset 0 1px rgba(0,0,0,0.2), inset 0 -1px rgba(0,0,0,0.2);
   -moz-box-shadow:inset 0 1px rgba(0,0,0,0.2), inset 0 -1px rgba(0,0,0,0.2);
        box-shadow:inset 0 1px rgba(0,0,0,0.2), inset 0 -1px rgba(0,0,0,0.2);
}
/* bottom menu */
.bt-menu ul:nth-of-type(2) li{
width:60px;
height:50px;
line-height:50px;
/*transform*/
-webkit-transform:scale(0);
   -moz-transform:scale(0);
    -ms-transform:scale(0);
     -o-transform:scale(0);
        transform:scale(0);
}
.bt-menu.bt-menu-open ul:nth-of-type(2) li:first-child{
/*transition-delay*/
-webkit-transition-delay:0.1s;
   -moz-transition-delay:0.1s;
     -o-transition-delay:0.1s;
        transition-delay:0.1s;
}
.bt-menu.bt-menu-open ul:nth-of-type(2) li:nth-child(2){
/*transition-delay*/
-webkit-transition-delay:0.2s;
   -moz-transition-delay:0.2s;
     -o-transition-delay:0.2s;
        transition-delay:0.2s;
}
.bt-menu.bt-menu-open ul:nth-of-type(2) li:nth-child(3){
/*transition-delay*/
-webkit-transition-delay:0.3s;
   -moz-transition-delay:0.3s;
     -o-transition-delay:0.3s;
        transition-delay:0.3s;
}
.bt-menu.bt-menu-open ul:nth-of-type(2) li{
/*transform*/
-webkit-transform:scale(1);
   -moz-transform:scale(1);
    -ms-transform:scale(1);
     -o-transform:scale(1);
        transform:scale(1);
}
.bt{
height:45px;
width:45px;
margin:0px auto;
text-indent:-5000px;
}
.bt#social1{
display:block;
background:url("../images/sprite-insta.svg") 0 0 no-repeat;
/*background-size*/
-webkit-background-size:100%;
   -moz-background-size:100%;
     -o-background-size:100%;
        background-size:100%;
}
.bt#social2{
display:block;
background:url("../images/sprite-link.svg") 0 0 no-repeat;
/*background-size*/
-webkit-background-size:100%;
   -moz-background-size:100%;
     -o-background-size:100%;
        background-size:100%;
}
.bt#social3{
display:block;
background:url("../images/sprite-twit.svg") 0 0 no-repeat;
/*background-size*/
-webkit-background-size:100%;
   -moz-background-size:100%;
     -o-background-size:100%;
        background-size:100%;
}
.bt#social1:hover,.bt#social1:active,.bt#social1:focus,
.bt#social2:hover,.bt#social2:active,.bt#social2:focus,
.bt#social3:hover,.bt#social3:active,.bt#social3:focus{
background-position:0 -45px;
}
/*************************************/
/*GRILLE*/
#grid{
background:url("../images/•grid.png");
width:100%;
height:5000px;
position:absolute;
margin:0 auto;
}
/*************************************/


#logo{
height:40px;
width:52px;
position:fixed;
top:20px;
right:20px;
z-index: 999;
}
/*Contenu*/
#titreintro{
color: #fff;
font-size:6em;
line-height:20px;
width:300px;
/*margin:767px 0 0 1100px;*/
margin:22% 0 0 60%;
}
#titreintro h2{
font-family: 'BioRhyme', serif;
font-weight: 300;
}
#titreintro span{
font-size:.45em;
line-height:100px;
}
#intro{
background:url("../images/1first-bg.jpg") 50% -75px no-repeat fixed;
top:0;
/*background-size*/
-webkit-background-size:100%/;
   -moz-background-size:cover;
     -o-background-size:100%/;
        background-size:cover;
height:100vh;
margin:0 auto;
padding:160px 0 0 0;
}
#second{
background:url("../images/2second-bg.jpg") 50% 0 no-repeat fixed;
/*background-size*/
-webkit-background-size:100%/;
   -moz-background-size:cover;
     -o-background-size:100%/;
        background-size:cover;
height:100vh;
margin:0 auto;
overflow:hidden;
padding:0;
}
#second .bg{
background:url("../images/2Art-1.png") 50% 0 no-repeat fixed;
color:#333;
font-size:4rem;
text-align:center;
border:20px solid #333;
margin:15% 0 0 17%;
padding:20px;
position:absolute;
width:65%;
z-index:200;
}
#second .bg p{
font-size:3rem;
text-align:center;
line-height:40px;
}
#third{
background:url("../images/3third-bg.jpg") 50% 0 no-repeat fixed;
/*background-size*/
-webkit-background-size:100%/;
   -moz-background-size:cover;
     -o-background-size:100%/;
        background-size:cover;
height:100vh;
padding:100px 0 0 0;
}
#third .bg{
background:url("../images/2Art-2.png") 50% 0 no-repeat fixed;
color:#F2F2F2;
font-size:4rem;
text-align:center;
border:20px solid #F2F2F2;
margin:15% 0 0 17%;
padding:20px;
position:absolute;
width:65%;
z-index:200;
}
#third .bg p{
font-size:3rem;
text-align:center;
}
/*Contenu_textes*/
.fifth{
background:#f2f2f2;
margin:0 auto;
padding:40px 0;
}
.fifth h2{
font-family:"FlexoCapsDEMORegular", Verdana, serif;
font-size:1.1rem;
}
.fifth .story{
width:1030px;
padding:0 1px;
margin:0 auto;
}
/*SECTION1*/
.fifth#section1{
margin-top:1px;
font-size: 1.2em;
}
.fifth .story .colonne{
width:450px;
float:left;
margin-right:128px;
padding-left:0px;
margin-top:9px;
}
.fifth .story .colonne p{
	line-height: 150%;
	font-size: 1.4em;
}
.fifth .story .colonne#alt{
margin-right:0;
}
.fifth .story#txtsection1{
height: 250px;
}
/*SECTION2*/
.grid{
padding:20px 20px 100px 20px;
max-width:1024px;
margin:0 auto;
list-style:none;
text-align:center;
}
.grid li{
display:inline-block;
width:440px;
margin:0;
padding:20px;
text-align:left;
position:relative;
}
.grid figure{
margin:0;
position:relative;
}
.grid figure img{
max-width:100%;
display:block;
position:relative;
}
.grid figcaption{
position:absolute;
top:0;
left:0;
padding:20px;
background:#333;
color:#ecbb27;
line-height:20px;
font-size: 1.3em;
}
.grid figcaption h3{
margin:0;
padding:0;
color:#fff;
font-size: 1.2em;
}
.grid figcaption a{
font-family: 'Source Sans Pro', sans-serif;
font-weight: 400;

text-align:center;
padding:5px 10px;
/*border-radius*/
-webkit-border-radius:2px;
   -moz-border-radius:2px;
        border-radius:2px;
display:inline-block;
background:#ecbb27;
color:#fff;
text-decoration:none;
/*transition*/
-webkit-transition:all ease-in-out 0.3s;
   -moz-transition:all ease-in-out 0.3s;
     -o-transition:all ease-in-out 0.3s;
        transition:all ease-in-out 0.3s;
}
.grid figcaption a:hover{
background:#fff;
color:#ecbb27;
/*transition*/
-webkit-transition:all ease-in-out 0.3s;
   -moz-transition:all ease-in-out 0.3s;
     -o-transition:all ease-in-out 0.3s;
        transition:all ease-in-out 0.3s;
}
.art li{
/*perspective*/
-webkit-perspective:1700px;
   -moz-perspective:1700px;
    -ms-perspective:1700px;
     -o-perspective:1700px;
        perspective:1700px;
/*perspective-origin*/
-webkit-perspective-origin:0 50%;
   -moz-perspective-origin:0 50%;
    -ms-perspective-origin:0 50%;
     -o-perspective-origin:0 50%;
        perspective-origin:0 50%;
}
.art figure{
/*transform-style*/
-webkit-transform-style:preserve-3d;
   -moz-transform-style:preserve-3d;
    -ms-transform-style:preserve-3d;
     -o-transform-style:preserve-3d;
        transform-style:preserve-3d;
}
.art figure > div{
overflow:hidden;
}
.art figure img{
/*transition*/
-webkit-transition:-webkit-transform 0.4s;
   -moz-transition:   -moz-transform 0.4s;
     -o-transition:     -o-transform 0.4s;
        transition:        transform 0.4s;
}
.art figure:hover img{
/*transform*/
-webkit-transform:translateX(25%);
   -moz-transform:translateX(25%);
    -ms-transform:translateX(25%);
     -o-transform:translateX(25%);
        transform:translateX(25%);
}
.art figcaption{
height:100%;
width:50%;
opacity:0;
/*backface-visibility*/
-webkit-backface-visibility:hidden;
   -moz-backface-visibility:hidden;
    -ms-backface-visibility:hidden;
     -o-backface-visibility:hidden;
        backface-visibility:hidden;
/*transform-origin*/
-webkit-transform-origin:0 0;
   -moz-transform-origin:0 0;
    -ms-transform-origin:0 0;
     -o-transform-origin:0 0;
        transform-origin:0 0;
/*transform*/
-webkit-transform:rotateY(-90deg);
   -moz-transform:rotateY(-90deg);
    -ms-transform:rotateY(-90deg);
     -o-transform:rotateY(-90deg);
        transform:rotateY(-90deg);
/*transition*/
-webkit-transition:-webkit-transform 0.4s, opacity 0.1s 0.3s;
   -moz-transition:   -moz-transform 0.4s, opacity 0.1s 0.3s;
     -o-transition:     -o-transform 0.4s, opacity 0.1s 0.3s;
        transition:        transform 0.4s, opacity 0.1s 0.3s;
}
.art figure:hover figcaption{
opacity:1;
/*transform*/
-webkit-transform:rotateY(0deg);
   -moz-transform:rotateY(0deg);
    -ms-transform:rotateY(0deg);
     -o-transform:rotateY(0deg);
        transform:rotateY(0deg);
/*transition*/
-webkit-transition:-webkit-transform 0.4s, opacity 0.1s;
   -moz-transition:   -moz-transform 0.4s, opacity 0.1s;
     -o-transition:     -o-transform 0.4s, opacity 0.1s;
        transition:        transform 0.4s, opacity 0.1s;
}
.art figcaption a{
position:absolute;
bottom:20px;
right:20px;
}
/*CONTACT*/
.fifth#con{
	height: 500px;
}
form label{
font-style:normal;
display:none;
margin:0 0 0.5em 0;
font-size:1.3em;
}
input, textarea, select{
color:#858d98;
background:#fff;
font-family:"Museo-300","Helvetica", sans-serif;
font-size:1.4rem;
margin-bottom:1em;
padding:10px;
display:block;
border:1px solid #ddd;
/*border-radius*/
-webkit-border-radius:4px;
   -moz-border-radius:4px;
        border-radius:4px;
/*box-shadow*/
-webkit-box-shadow:0px 2px 2px rgba(0,0,0,0.05),inset 0px 2px 0px rgba(0,0,0,0.03);
   -moz-box-shadow:0px 2px 2px rgba(0,0,0,0.05),inset 0px 2px 0px rgba(0,0,0,0.03);
        box-shadow:0px 2px 2px rgba(0,0,0,0.05),inset 0px 2px 0px rgba(0,0,0,0.03);
box-sizing:border-box;
/* css3 rec */
-moz-box-sizing:border-box;
/* ff2 */
-ms-box-sizing:border-box;
/* ie8 */
-webkit-box-sizing:border-box;
/* safari3 */
-khtml-box-sizing:border-box;
/* konqueror */
width:100%;
resize:none;
}
textarea{
width:100%;
height:100px;
clear:both;
resize:none;
padding-top:11px;
margin-bottom:2.5em;
}
span.button-holder{
display:-moz-inline-stack;
display:inline-block;
vertical-align:top;
zoom:1;
*display:inline;
background:rgba(0,0,0,0.07);
padding:6px 6px 11px 6px;
width:auto;
/*border-radius*/
-webkit-border-radius:3px;
   -moz-border-radius:3px;
        border-radius:3px;
/*box-shadow*/
-webkit-box-shadow:inset 0px 1px 0px rgba(0,0,0,0.1), 0px 1px 0px #fff;
   -moz-box-shadow:inset 0px 1px 0px rgba(0,0,0,0.1), 0px 1px 0px #fff;
        box-shadow:inset 0px 1px 0px rgba(0,0,0,0.1), 0px 1px 0px #fff;
position:relative;
margin-left:41%;
}
span.button-shadow{
display:block;
/*box-shadow*/
-webkit-box-shadow:0px 5px 0px #858d98;
   -moz-box-shadow:0px 5px 0px #858d98;
        box-shadow:0px 5px 0px #858d98;
/*border-radius*/
-webkit-border-radius:3px;
   -moz-border-radius:3px;
        border-radius:3px;
}
.button{
color:#fff;
font-size:1.6rem;
font-family:"Museo-500", sans-serif;
text-decoration:none;
text-align:center;
text-shadow:0px 1px 0px rgba(0,0,0,0.2);
padding:0.5em 1.2em 0.5em 1.2em;
margin:0 auto;
background:rgba(0,0,0,0.2);
background:#b8c3c5;
position:relative;
display:-moz-inline-stack;
display:inline-block;
vertical-align:top;
zoom:1;
*display:inline;
outline:none;
border:none;
border-bottom:1px solid rgba(255,255,255,0.2);
/*border-radius*/
-webkit-border-radius:3px;
   -moz-border-radius:3px;
        border-radius:3px;
/*transition*/
-webkit-transition:all 0.1s;
   -moz-transition:all 0.1s;
     -o-transition:all 0.1s;
        transition:all 0.1s;
}
.button:hover{
top:2px;
background:rgba(236,187,39,0.4);
border-bottom:1px solid rgba(0,0,0,0.2);
}
/*FOOTER*/
footer{
background:#333;
color:#b8c3c5;
height:40px;
width:100%;
}
footer a{
color:#FFF;
text-decoration:none;
/*transition*/
-webkit-transition:all 0.5s;
   -moz-transition:all 0.5s;
     -o-transition:all 0.5s;
        transition:all 0.5s;
}
footer a:hover{
color:#ecbb27;
text-decoration:none;
/*transition*/
-webkit-transition:all 0.5s;
   -moz-transition:all 0.5s;
     -o-transition:all 0.5s;
        transition:all 0.5s;
}
/***********************************/

@media
only screen and (max-width: 1920px),
only screen and (max-device-width: 1920px){
#titreintro{
	margin:20% 0 0 62%;
}
}

@media
only screen and (max-width: 1680px),
only screen and (max-device-width: 1680px){
/*MBP 15"2011*/
	#intro,#second,#third{
/*Hack4Chrome*/
/*background-size*/
-webkit-background-size:auto;
   -moz-background-size:auto;
     -o-background-size:auto;
        background-size:auto;
left:0;
/* Preserve aspet ratio */
min-width:100%;
min-height:100%;
}
h2{
margin-top:0.64em;
margin-bottom:0.78em;
}
#second .bg, #third .bg{
margin:14% 0 0 18%;
}
#second .bg p{
line-height:50px;
}
}

@media
only screen and (max-width: 1366px),
only screen and (max-device-width: 1366px),
only screen and (max-height: 1050px){
/*MBA 11"*/
	
/*Hack4Chrome*/
#intro,#second,#third{
/*background-size:auto;*/
left:0;
/* Preserve aspet ratio */
min-width:100%;
min-height:100%;
}
#titreintro{
font-size:52px;
line-height:20px;
width:300px;
/*margin:150px 0 0 710px;*/
margin:15% 0 0 73%;
}
#titreintro span{
font-size:21px;
line-height:100px;
}
.fifth{
padding:40px 0 45px 0;
}
.fifth#section1{
margin-top:2px;
}
/*.fifth .story#txtsection1{
height:155px;
}*/
.fifth#art{
margin-bottom:0;
padding-bottom:0;
}
/*.fifth#con{
height:100vh;
}*/
.fifth .story{
width:800px;
padding:0 14px 10px 0;
}
.fifth .story .colonne{
width:355px;
float:left;
margin-right:60px;
padding-left:0px;
margin-top:9px;
}
#second .bg{
font-size:3.5rem;
margin:8% 0 0 20%;
width:62%;
}
#second .bg p{
font-size:2.2rem;
line-height:40px;
}
.grid{
max-width:800px;
padding:0;
}
.grid li{
width:520px;
margin:0;
padding:20px;
}
.grid figcaption{
font-size:1rem;
line-height:30px;
}
#third{
/*background-size*/
-webkit-background-size:198%;
   -moz-background-size:198%;
     -o-background-size:198%;
        background-size:198%;
padding:110px 0 0 0;
}
#third .bg{
background:url("../images/2Art-2.png") 50% 0 no-repeat fixed;
margin:5% 0 0 20%;
padding:0px;
width:62%;
}
}


@media
only screen and (max-width: 1024px),
only screen and (max-device-width: 1024px){
/*non-retina */
#intro,#second,#third{
background-size:auto;
}
#titreintro{
/*margin:145px 0 0 400px;*/
margin:31% 0 0 74%;
line-height:25px;
}
#titreintro span{
font-size:21px;
line-height:100px;
}
h2{
margin-top:0.64em;
margin-bottom:0.78em;
}
.fifth{
padding:40px 0 45px 0;
}
.fifth#section1{
margin-top:2px;
}
.fifth .story#txtsection1{
height:155px;
}
.fifth#art{
margin-bottom:0;
padding-bottom:0;
}
/*.fifth#con{
height:100vh;
}*/
.fifth .story{
width:800px;
padding:0 14px 10px 0;
}
.fifth .story .colonne{
width:355px;
float:left;
margin-right:60px;
padding-left:0px;
margin-top:9px;
}
#second .bg{
font-size:3.5rem;
margin:8% 0 0 20%;
width:62%;
}
#second .bg p{
font-size:2.2rem;
}
.grid{
max-width:800px;
padding:0;
}
.grid li{
width:520px;
margin:0;
padding:20px;
}
.grid figcaption{
font-size:1rem;
line-height:30px;
}
#third{
/*background-size*/
-webkit-background-size:108%;
   -moz-background-size:108%;
     -o-background-size:108%;
        background-size:108%;
padding:110px 0 0 0;
}
#third .bg{
background:url("../images/2Art-2.png") 50% 0 no-repeat fixed;
margin:5% 0 0 20%;
padding:0px;
width:62%;
}
}

@media
only screen and (min-width: 980px) and (max-width: 1366px),
only screen and (min-device-width: 980px) and (max-device-width: 1366px){
	#intro,
	#second,
	#third{
		background-size: 204%;
	}
	.fifth .story#txtsection1{
		height: auto !important;
	}
	.fifth .story .colonne,
	.fifth .story .colonne#alt{
		float: none !important;
		width: 100% !important;
		margin: 0 auto !important;
	}
	.fifth .story .colonne#alt{
		margin: -0.7em auto !important;
	}
}


@media
only screen and (max-width: 980px),
only screen and (max-device-width: 980px){
	#titreintro{
		width: auto;
	}
	#titreintro h2{
		margin: 0;
	}
	.fifth{
		padding: 1.2em;
		margin: 0;
	}
	.fifth .story,
	.fifth .story#txtsection1,
	.fifth .story#txtsection2,
	.fifth .story#txtsection3{
		height: auto;
		width: auto;
		padding: 0;
	}
	.fifth .story .colonne{
		height: auto;
		width: auto;
		padding: 0;
		margin: 0;
		float: none;
	}

	body{
		min-width: auto;
	}
}

@media
only screen and (min-width: 750px) and (max-width: 980px){
	#titreintro{
		margin: 44% 0 0 74%;
	}
}
@media
only screen and (max-width: 750px),
only screen and (max-device-width: 750px){
	#intro{
		 background-size: 200%;
	}
	#titreintro{
		margin: 35% 0 0 48%;
	}
}

@media
only screen and (max-width: 540px),
only screen and (max-device-width: 540px){
	.grid li{
		width: 100%;
		padding: 10px 0;
	}
}
@media
only screen and (max-width: 414px),
only screen and (max-device-width: 414px){
	#intro{
		background-size: 333%;
	}
	#second .bg{
		border: 0;
		border-top: 10px solid #333;
		border-bottom: 10px solid #333;
		width: 85%;
		margin: 20% 7.5%;
	}
	.art figcaption{
		width: 80%;
	}
	#third .bg{
		border: 0;
		border-top: 10px solid #f2f2f2;
		border-bottom: 10px solid #f2f2f2;
		width: 85%;
		margin: 20% 7.5%;
	}
	#third{
		background-size: 380%;
	}
}
@media (max-device-width : 667px)
and (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
	#logo{
		height: 4em;
		width: 4em;
		margin-top: .2em;
	}
	#logo img{
		height: 4em;
		width: 4em;
	}
	
	.bt-menu{
		width: 100%;
		height: 5.5em;
		background: rgba(85, 85, 85, 0.66);
		transition: 0.1s ease-in-out;
	}
	.bt-menu-trigger{
		width: 4em;
		height: 5em;
	}
	.bt-menu.bt-menu-open{
		border-width: 0px 0px 5em 15em;
		transition: 0.2s ease-in-out;
	}
	.bt-menu ul:first-of-type{
		top: 6em;
	}
	.bt-menu.bt-menu-open ul:first-of-type li{
		width: 100%;
		height: 10em;
	}
	.bt-menu ul:first-of-type li a{
		font-size: 4em;
		line-height: 400%;
		box-shadow: none;
	}
	.bt-menu ul:nth-of-type(2){
		bottom: .2em;
	}
	.bt-menu ul:nth-of-type(2) li{
		height: 160px;
		width: 33.33vw;
	}
	.bt{
		height: 10em;
		width: 10em;
	}
	.bt#social1:hover, .bt#social1:active, .bt#social1:focus, .bt#social2:hover, .bt#social2:active, .bt#social2:focus, .bt#social3:hover, .bt#social3:active, .bt#social3:focus{
		background-position: 0 100%;
	}
	
    body,
    .fifth h2{
	    font-size: 2.2em;
    }
    #titreintro{
	    margin: 94% 0 0 64%;
		width: auto;
		font-size: 2em;
	}
	#titreintro span{
		font-size: .6em;
	}
	#second{
		background-size: 320%;
		background-position-y: 35%
	}
	#second .bg{
		font-size: 3.5em;
		margin: 40% 7.5%;
	}
	#second .bg p{
		font-size: .5em;
		line-height: 120%;
	}
	.grid figcaption{
		font-size: 1.5em;
		line-height: 140%;
	}
	#third{
		background-size: 325%;
		background-position-y: 91%
	}
	#third .bg{
		font-size: 3.5em;
		margin: 40% 7.5%;
	}
	.fifth#con{
		height: auto;
	}
	form input,
	form textarea{
		font-size: 1.5em;
	}
	form textarea{
		line-height: 150%;
		height: auto;
	}
	span.button-holder{
		margin: 0 auto;
		display: block;
		width: 50%;
	}
	.button{
		font-size: 2em;
		width: 100%;
	}
	footer{
		font-size: .6em;
	}
}

/* ipad */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
	#logo{
		top: 10px;
	}
	.bt-menu{
		width: 100%;
		height: 7em;
		background: rgba(85, 85, 85, 0.66);
		transition: 0.1s ease-in-out;
	}
	.bt-menu.bt-menu-open{
		transition: 0.2s ease-in-out;
	}
	
	#titreintro{
		margin: 33% 0 0 70%;
	}
	.fifth{
		padding: 1.2em 6em;
	}
	.fifth#section1{
		padding: 4em 6em;
	}
	.fifth .story .colonne#alt{
		margin: -1.5em auto !important;
	}
	#second{
		background-position-y: 16%;
	}
	#second .bg,
	#third .bg{
		border: 0;
		border-top: 10px solid #333;
		border-bottom: 10px solid #333;
		width: 85%;
		margin: 15% 7.5%;
	}
	#third{
		background-position-y: 96%;
	}
	#third .bg{
		border-top: 10px solid #f2f2f2;
		border-bottom: 10px solid #f2f2f2;
		margin: 12% 7.5%;
	}
}

/* ipad portrait */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
	body,
    .fifth h2{
	    font-size: 1em;
    }
    .bt-menu{
	    height: 5em;
    }
    .bt-menu.bt-menu-open{
	    border-width: 0px 0px 80px 240px;
    }
    .bt-menu ul:first-of-type{
	    width: 240px;
		top: 6em;
    }
    .bt-menu ul:first-of-type li{
	    width: 100%;
		height: 4em;
		line-height: 150%;
    }
    .bt-menu ul:first-of-type li a,
    .bt-menu ul:first-of-type li:last-child a{
	    box-shadow: none;
		font-size: 1.5em;
    }
	.bt-menu ul:nth-of-type(2){
		bottom: .2em;
	}
	.bt-menu ul:nth-of-type(2) li{
		height: 70px;
		width: 245px;
	}
	.bt{
		height: 4em;
		width: 4em;
	}
	.bt#social1:hover, .bt#social1:active, .bt#social1:focus, .bt#social2:hover, .bt#social2:active, .bt#social2:focus, .bt#social3:hover, .bt#social3:active, .bt#social3:focus{
		background-position: 0 100%;
	}
    
	#intro, #second, #third{
		height: 60vh;
		min-height: 60vh;
	}
	#second{
		background-position-y: 22%;
	}

	.fifth .story .colonne#alt{
		margin: -1em auto !important;
	}
}


/* iphone landscape */
@media only screen
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : landscape)
and (min-device-width : 320px) 
and (max-device-width : 480px) 
and (orientation : landscape) {
	.bt-menu{
		height: 3.5em;
	}
	.bt-menu-trigger{
		width: 3em;
		height: 3em;
	}
	.bt-menu.bt-menu-open{
		border-width: 0px 0px 3.3em 50vw;
	}
	.bt-menu ul:first-of-type{
		top: 3.6em;
	}
	.bt-menu.bt-menu-open ul:first-of-type li{
		height: 5em;
	}
	.bt-menu ul:first-of-type li a{
		font-size: 2.5em;
		line-height: 200%;
	}
	.bt-menu ul:nth-of-type(2) li{
		height: 90px;
		width: 15.5vw;
	}
	.bt{
		height: 5em;
		width: 5em;
	}
	#logo{
		height: 2.5em;
		width: 2.5em;
		margin-top: 0;
	}
	#logo img{
		height: 2.5em;
		width: 2.5em;
	}
	
	#intro{
		background-size: 110%;
	}
	#titreintro{
		margin: 9% 0 0 64%;
		font-size: 1.2em;
	}
	.fifth#section1{
		font-size: .8em;
	}
	#second,
	#third{
		background-size: 110%;
		background-position-y: 42%;
	}
	#second .bg{
		font-size: 1.8em;
		margin: 7% 7.5%;
	}
	#second .bg h2{
		margin-bottom: 0.5em;
	}
	#second .bg p{
		font-size: .8em;
	}
	.grid li{
		width: 49%;
	}
	.grid figcaption{
		font-size: .7em;
	}
	#third{
		background-position-y: 89%;
	}
	#third .bg{
		font-size: 1.8em;
		margin: 6% 7.5%;
	}
	.fifth#con{
		font-size: .6em;
	}
}


/*Hack4FireFox*/
@-moz-document url-prefix(){
html { height:100%;
}
body{
min-height:100%;
height:100%;
}
#intro,#second, #third{
height:100%;
min-height:100%;
max-height:100%;
}