* { 
  margin: 0;
  padding: 0;
  list-style:none;
}
body, html {
  margin:0;
  padding:0;
  -webkit-font-smoothing:antialiased;
  font-smooth:always;
  overflow-x:hidden;
  background: url('../images/zigzag.png') repeat;
}
body, html{background-color:#191919;}
a {text-decoration: none;}
p {
  margin: 0;
  padding:0;
}
::-webkit-scrollbar {
    width: 12px;
	height:12px;
}
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
	background-color:rgba(0,0,0,0.2);
}
::-webkit-scrollbar-thumb:hover {
	background-color:rgba(0,0,0,0.4);
}
#birds{position:fixed; width:100%; height:100%; overflow: hidden;background-color:transparent;z-index:1;}
#logo-header, .sub-header-nav li a, #title-home, #subtitle-home, nav li a, .top-bar label a, #mot-artiste p.sign, .bio-texte p, #awards h1, .dem-artistique-box p, #contact-infos h1, .mobile-logo{font-family: 'Oswald', sans-serif;font-weight:400;}
.footer-text, .footer-legal, .credits-box, #mot-artiste p,.awards-list ul li a{font-family: 'Roboto Condensed', sans-serif;}
#awards h1{text-shadow: 3px 3px 3px rgba(255,255,255,0.2);}
#awards h2{font-family: 'Niconne', cursive;font-weight:400;color:#CACACA;}
#menu-toggle ~ #fade{width:0%;}
.menu-toggle {display: none;}
.title-title,#subtitle-home,#mot-artiste p.sign, #awards h1, .copy, .credits, .credits:link, .credits:visited, .credits-title, .credits-author {color:#e6a534;}
.sub-header-nav li a, #title-home, .title-name, #mot-artiste p, .awards-list ul li a, .dem-artistique-box p, .footer-text, .footer-legal, .credits-desc{color:white;}
.bio-text p{color:black;}
#contact-infos h1 a:hover{color:#e6a534;}
.awards-list a:hover{color:#e6a534;cursor:pointer;}
#awards{background-color:rgba(10,10,10,0.80);}
#biographie{background-color:#e6a534;}	
#header, #footer,#showcase,.top-bar label{background-color:black;}
#title-home a, #subtitle-home a, .title-title{text-shadow: 3px 3px 3px rgba(0,0,0,0.6);}
.rot {
	display:none;  
	position: absolute;
	left:0; top:0;
}
#tree{background: url('../images/tree.png') 50% no-repeat;}
#tree_01{background: url('../images/tree_01.png') 50% no-repeat;}
#dem-artistique{
	position:relative;
	display:block;
	}
.dem-artistique-box{
	position:relative;
	background: -webkit-linear-gradient(right, rgba(10, 10, 10, 1), rgba(10, 10, 10, 0));
	background: -o-linear-gradient(left, rgba(10, 10, 10, 1), rgba(10, 10, 10, 0));
	background: -moz-linear-gradient(left, rgba(10, 10, 10, 1), rgba(10, 10, 10, 0));
	background: linear-gradient(to left, rgba(10, 10, 10, 1), rgba(10, 10, 10, 0));
	}
#showcase, #footer{border-top: 2px solid white;}
.credits-box{
	position:relative;
	background-color:rgba(10,10,10,0.80);
	text-align:center;
	-webkit-box-shadow: 0px 0px 40px rgba(0,0,0,0.8);
    -moz-box-shadow: 0px 0px 40px rgba(0,0,0,0.8);
    box-shadow: 0px 0px 40px rgba(0,0,0,0.8);
	}
.credits:hover{text-decoration:underline;}
*.unselectable {
   -moz-user-select: none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -ms-user-select: none;
   user-select: none;
}
.antspa{
	display:none;
}
@media only screen and (min-width: 785px) {
#header{
	position: fixed;
	top: 0; right:0; left:0;
	height: 200px;
	width: 100%;
	z-index:4;
	border-bottom: 2px solid white;
}
#maincontent{
	position:relative;
	width:100%;  
	height:100%;
	margin-top:200px;
	overflow:hidden;
	z-index:3;
}	
#fade, .top-bar, .menu-toggle, nav,.mobile-logo{width:0; height: 0; display:none;}
#chrex-logo{
	position: relative;
	width: 180px;
	height:41px;
	float:right;
	top:140px;
	}
#logo-header{
position:fixed;
left:10px;
top:15px;
width:225px;
line-height:165%;
}
.title-name, .title-title{display:block;}
.title-name{
font-size:30pt;
}
.title-title{
font-size:20pt;
margin-left:20px;
}
.sub-header-nav{
	position:absolute;
	top:80px;
	left:0; right:0;
	width:785px;
	margin: 0 auto;
}
.sub-header-nav li{display:inline-block;}
.sub-header-nav a img{
	width:34px;
	height:31px;
	display:block;
	margin:0 auto;
	background-color:white;
	margin-bottom:5px;
	}
.sub-header-nav li a{
	position:relative;
	display:block;
    padding:15px 30px 15px 30px;
	font-size: 13pt;
	}
.sub-header-nav a:hover{color:#e6a534;}
.sub-header-nav a:hover > .nav-icon{background-color:#e6a534;}
.sub-header{
	position:relative;
	width:900px;
}
#title-home{
	position:relative;
	height:75px;
	width:450px;
	font-size:60pt;
	margin:100px auto 0 auto;
	}
#subtitle-home{
	position:relative;
	height:62px;
	width:415px;
	font-size:42pt;
	margin:0 auto;
	padding-left:15px;
	}
#tree{
	position:fixed;
	width:100px;
	height:124px;
	right:90px;
	top:300px;
	background: url('../images/tree.png') 50% no-repeat;
	}
#tree_01{
	position:fixed;
	width:240px;
	height:547px;
	left:0;
	top:240px;
	background: url('../images/tree_01.png') 50% no-repeat;
	z-index:2;
	}
#showcase{
	position:relative;
	height:400px;
	width:100%;
	margin:180px 0 auto auto;
	}
#rotator{
	position:relative;
	height:400px;
	width:700px;
	float:left;
	}
.loader{
	position:absolute;
	width:100px; height:34px;
	left:0; right:0; 
	margin: 125px auto auto auto;
	background:url('../images/loader-home.gif') 50% 50% no-repeat;	
	}	
#rotator img {
	position:absolute;
	left:0;
	}	
#mot-artiste{
	position:relative;
	float:right;
	right:10px;
	max-width:50%;
	height:auto;
	}
#mot-artiste p{font-size:20pt;line-height:120%;margin:35px 10px 25px 10px;text-align:right;}
#mot-artiste p:first-letter, .bio-texte:first-letter p{font-size:22pt;}
#mot-artiste p.sign{font-size:16pt;text-align:right;}		
#biographie{
	position:relative;
	display:block;
	width:100%  ;
	height:400px;
	}	
.bio-texte{
	position:relative;
	display:block;
	max-width:72%;
	height:auto;
	float:left;
	left:3%;
	top:30px;	
	}	
.bio-texte p{font-size:20pt;line-height:120%;text-align:left;padding:40px 0 0 0;}	
.imgartiste{
	position:relative;
	width:355px;
	height:400px;
	right:2%;
	float:right;
	}
/*/////////////////AWARDS////////////////////////////*/
#awards{
	position:relative;
	display:block;
	width:100%;
	height:650px;
}
#awards h1{
    font-size:36pt;
	padding-top:20px;
	text-align:center;
}
#awards h2{
	font-size:36pt;
	text-align:center;
	padding-top:30px;
}
.awards-list{
	position:relative;
	margin: 0 auto;
	width:800px;
	padding-bottom:10px;
}
.awards-list ul li{
	display:block;
	font-size:16pt;
	text-align:center;
	padding:10px 0 10px 0;
	height:36px;
}
.awards-list li:before{
	padding-right:5px;
	content: url(../images/reward.png);
}
/*//////////////AWARDS END///////////////////////////////*/
#dem-artistique{
	display:block;
	width:100%;
	height:400px;
	background:url('../images/atelier.jpg') 50% 50% no-repeat;	
	}	
.dem-artistique-box{
	position:relative;
	width: 100%;
	top:20px;
	float:right;
	right:0%;
	height:360px;
	}
.dem-artistique-box p{font-size:18pt;line-height:120%;text-align:right;margin:40px 3% 0 5%;}
#contactez{
	position:relative;
	display:block;
	width:100%;
	height:240px;
	}
#contactez-box{
	position:relative;
	width:70%;
	height:100%;
	float:left;
	background-color:rgba(10,10,10,0.80);
	}	
#contact-infos{
	position: relative;
	width:300px;
	height:90px;
	float:right;
	margin-top:20px;
	}	
#contact-infos h1{
	color:#fff;
	font-size:20pt;
	text-align:right;
	line-height:150%;
	padding-bottom:10px;
	}
#contact-infos h1 img{
	position:relative;
	width:40px;
	height:40px;
	display:block;
	float:right;
	clear:both;
	vertical-align:bottom;
	margin:0 0 0 10px;
	}
#contact-infos h1 a{
	color:#fff;
	font-size: 20pt;
	text-align:right;
	}
#contact-infos h1 a:link{color:#fff;}
#contact-infos h1 a:visited{color:#fff;}
#contact-infos h1 a:hover{color:#e6a534;}
#footer{
	position:relative;
	width:100%;
	height:300px;
	}
.footer-text{
	position:relative;
	max-width:1200px;
	margin: 75px auto 0 auto;
	text-align:center;
	font-size:12pt;
	}
.footer-legal{
	position:relative;
	width:215px;
	margin: 20px auto 0 auto;
	font-size:11pt;
	}
.copy{padding-right:10px;}
.credits{
	padding-left:10px;
	text-decoration:none;
	}
.credits-box{
	width:500px;
	height:380px;
	margin: 5% auto 100px auto;
	}
.credits-title{
	position:relative;
	top:20px;
	font-size:18pt;
	margin: 0 auto 60px auto;
	}
.credits-desc{
	position:relative;
	font-size:12pt;
	margin:20px 15px 0 15px;
	}
.credits-author{
	position:relative;
	font-size:13pt;
	}
}
@media only screen and (min-width: 785px) and (max-width: 1411px){
#maincontent{
	position:relative;
	margin-top:200px;
}	
#title-home{
	position:relative;
	width:375px;
	font-size:50pt;
	margin:40px auto 0 auto;
	}
#subtitle-home{
	position:relative;
	width:325px;
	font-size:32pt;
	margin:0 auto;
	padding-left:0;
	line-height:100%;
	}
#tree{
	position:fixed;
	top:220px;
	right:180px;
	}
#tree_01{
	position:fixed;
	left:0;
	top:170px;
	}	
#showcase{
	position:relative;
	height:400px;
	width:100%;
	margin:40px auto 0 auto;
	}	
#rotator{
	position:relative;
	height:400px;
	width:700px;
	float:left;
	margin-left:-100px;
	}
#chrex-logo{
	position: relative;
	width: 180px;
	height:41px;
	float:right;
	top:0px;
	}
#mot-artiste{
	position:relative;
	float:right;
	right:10px;
	max-width:600px;
	height:400px;
	}
#mot-artiste p{font-size:18pt;line-height:110%;margin:45px 10px 25px 10px;}
#mot-artiste p:first-letter, .bio-texte:first-letter p{font-size:20pt;}	
#mot-artiste p.sign{font-size:14pt;}
.dem-artistique-box{
	position:relative;
	width: 100%;
	top:20px;
	float:right;
	right:0%;
	height:355px;
}	
.dem-artistique-box p{font-size:18pt;line-height:120%;margin:30px 3% 0 5%;}
#contactez-box{
	position:relative;
	width:85%;
	}
.credits-box{margin: 5% auto 13px auto;}
}
@media only screen and (min-width: 785px) and (max-width: 1311px){
#rotator{
	position:relative;
	margin-left:-100px;
	}
#mot-artiste{
	position:relative;
	right:10px;
	top:10px;
	max-width:500px;
	}
#mot-artiste p{font-size:18pt;line-height:110%;margin:25px 5px 15px 5px;}
#mot-artiste p:first-letter, .bio-texte:first-letter p{font-size:20pt;}	
#mot-artiste p.sign{font-size:14pt;}
.bio-texte{
	position:relative;
	display:block;
	max-width:62%;
	height:auto;
	float:left;
	left:1%;
	top:10px;	
	}
.dem-artistique-box p{font-size:18pt;line-height:120%;text-align:right;margin:25px 1% 0 3%;}
#footer{
	position:relative;
	width:100%;
	height:200px;
	}
.footer-text{
	position:relative;
	max-width:90%;
	margin: 50px auto 0 auto;
	text-align:center;
	font-size:12pt;
	}
}
@media only screen and (min-width: 785px) and (max-width: 1211px){
#mot-artiste{
	position:relative;
	float:right;
	right:10px;
	top:10px;
	max-width:480px;
	height:400px;
	}
#mot-artiste p{font-size:17pt;line-height:110%;margin:25px 5px 15px 5px;}
#mot-artiste p:first-letter, .bio-texte:first-letter p{font-size:19pt;}
#contactez-box{
	position:relative;
	width:100%;
	height:100%;
	}
.bio-texte{
	position:relative;
	max-width:62%;
	height:auto;
	float:left;
	left:1%;
	top:30px;	
	}
.bio-texte p{font-size:18pt;line-height:120%;text-align:left;padding:30px 0 0 0;}
#awards h1{font-size:28pt;}
#awards h2{font-size:28pt;}
.awards-list ul li a{font-size:14pt;}
.dem-artistique-box p{font-size:17pt;line-height:110%;text-align:right;margin:40px 1% 0 3%;}
}
@media only screen and (min-width: 785px) and (max-width: 1111px){
#rotator{
	position:relative;
	margin-left:-132px;
	}
#mot-artiste{
	position:relative;
	max-width:400px;
	}
.imgartiste{top:-20px;}	
.bio-texte{
	position:relative;
	max-width:62%;
	height:auto;
	top:30px;	
	}
.bio-texte p{font-size:17pt;line-height:120%;text-align:left;padding:30px 0 0 0;}
#awards{
	position:relative;
	display:block;
	width:100%;
	height:550px;
}
.awards-list ul li{
	display:block;
	padding:5px 0 5px 0;
	height:36px;
}
.awards-list li:before{
	padding-right:3px;
	content: url(../images/reward-sm.png);
}
.dem-artistique-box p{font-size:16pt;line-height:110%;text-align:right;margin:35px 1% 0 3%;}
.credits-box{margin: 5% auto 30px auto;}
}
@media only screen and (min-width: 785px) and (max-width: 980px){
#rotator{
	position:relative;
	margin-left:-200px;
	}
#mot-artiste{
	position:relative;
	max-width:350px;
	}
#mot-artiste p{line-height:105%;margin:20px 5px 15px 5px;}
#mot-artiste p:first-letter, .bio-texte:first-letter p{font-size:19pt;}
.bio-texte{
	position:relative;
	max-width:55%;
	height:auto;
	top:20px;	
	}
.bio-texte p{font-size:16pt;line-height:115%;text-align:left;padding:20px 0 0 0;}
.dem-artistique-box p{font-size:16pt;line-height:110%;text-align:right;margin:25px 1% 0 3%;}
#contactez-box{
	position:relative;
	width:100%;
	height:100%;
	padding-bottom:10px;
	}
}
@media only screen and (min-width: 785px) and (max-width: 861px){
#tree{
	position:fixed;
	right:120px;
	}
#rotator{
	position:relative;
	margin-left:-286px;
	}
.bio-texte{
	position:relative;
	max-width:50%;
	height:auto;
	top:20px;	
	}
.dem-artistique-box p{font-size:15pt;line-height:110%;text-align:right;margin:30px 1% 0 3%;}
}
@media only screen and (max-width: 784px) {
#birds{display:none;}
#header{display:none;height:40px;} 
#title-header{display:none;}
#maincontent{
	position:relative;
	width:100%; 
	height:100%;
	margin-top:40px;
	z-index:3;
}
.mobile-logo{
	position:fixed;
	width:40px;
	height:40px;
	left:5px;
	top:0;
	z-index:5;
	color:#e6a534;
	font-size:23pt;
	line-height:130%;
	}
.mobile-logo:first-letter{color:white;}
nav, .icon {
  -webkit-transition: -webkit-transform 0.2s linear;
  -moz-transition: -moz-transform 0.2s linear;
  -o-transition: -o-transform 0.2s linear;
  -ms-transition: -ms-transform 0.2s linear;
  transition: transform 0.2s linear;
}
nav {
  position: fixed;
  display:block;
  top: 42px;
  right: -270px;
  height:240px;
  width: 250px;
  z-index: 10;
  -webkit-box-shadow: 0px 0px 40px rgba(0,0,0,0.9);
    -moz-box-shadow: 0px 0px 40px rgba(0,0,0,0.9);
    box-shadow: 0px 0px 40px rgba(0,0,0,0.9);
}
nav ul {
  margin: 0;
  padding: 0;
}
#fade{
  position: fixed;
  display:block;
  top: 0;
  left: 0;
  overflow-y: auto;
  height:100%;
  background-color:rgba(0,0,0,0.55);
  z-index: 9;
  width: 0%;
  -webkit-box-shadow: 0px 0px 40px rgba(0,0,0,0.8);
  -moz-box-shadow: 0px 0px 40px rgba(0,0,0,0.8);
  box-shadow: 0px 0px 40px rgba(0,0,0,0.8);
  -webkit-transition: width 0.1s ease;
  -moz-transition: width 0.1s ease;
  -o-transition: width 0.1s ease;
  -ms-transition: width 0.1s ease;
  transition: width 0.1s ease;
  -webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
}
.top-bar{
  position: fixed;
  top:0;
  width: 100%;
  z-index: 10;
}
.top-bar label {
  display: block;
  width: 100%;
  height:40px;
  position: inherit;
  border-bottom: 2px solid white;
}
.top-bar label a{
	margin-right: 42px;
	font-size: 1.6em;
	display: block;
	position:absolute;
	color:white;
	line-height:100%;
	font-weight:400;
	top: 5px; right:0;}
.icon{
	position:absolute;
	width:20px;
	height:19px;
	right:5px;
	top:5px;
	padding: 4px;	
	border: 1px solid #000000;
	}
.icon:hover{border: 1px solid #e6a534;}
#menu-toggle ~ nav, .top-bar img.icon{
  -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);
}
#menu-toggle:checked ~ nav {
  -webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
  -webkit-transform: translate3d(-270px,0,0);
  -moz-transform: translate3d(-270px,0,0);
  -ms-transform: translate3d(-270px,0,0);
  -o-transform: translate3d(-270px,0,0);
  transform: translate3d(-270px,0,0);
}
#menu-toggle:checked ~ #fade {width:100%;}
#menu-toggle ~ #fade{width:0%;}
#menu-toggle:checked ~ .top-bar img.icon{
	-webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
  -webkit-transform: translate3d(16px,0,0);
  -moz-transform: translate3d(16px,0,0);
  -ms-transform: translate3d(16px,0,0);
  -o-transform: translate3d(16px,0,0);
  transform: translate3d(16px,0,0);
}
nav li{ background-color:rgba(0,0,0,0.90);}
nav li a {
  font-weight:400;
  color: #fff;
  display: block;
  padding: 10px 10px 10px 25px;
  text-decoration: none;
  line-height: 1.5em;
  overflow: hidden;
  border-bottom: 1px solid #2d333d;
  font-size: 1.4em;
}
nav ul li:hover a{
  cursor: pointer;
 background-color:rgba(230,165,52,0.90);
}
#chrex-logo{display:none;}
#tree{
	position:fixed;
	width:100px;
	height:124px;
	right:-35px;
	top:50px;
	}
#tree_01{
	position:fixed;
	width:240px;
	height:547px;
	left:-40px;
	top:50px;
	}
#title-home{
	position:relative;
	width:300px;
	font-size:40pt;
	margin:80px auto 0 auto;
	line-height:100%;
	}
#subtitle-home{
	position:relative;
	width:325px;
	font-size:26pt;
	margin:0 auto;
	padding-left:65px;
	line-height:70%;
	}
#showcase{
	position:relative;
	height:auto;
	width:100%;
	margin:80px auto 0 auto;
	}	
#rotator{
	position:relative;
	height:auto;
	width:100%;
	float:none;
	}
#rotator img {
	position:absolute;
	left:0;
	width:100%;
	height:auto;
	}
#mot-artiste{
	position:relative;
	float:none;
	right:0;
	width:100%;
	height:auto;
	margin-top:43%;
	padding-top:5px;
	background-color:black;
	}
#mot-artiste p{font-size:15pt;line-height:110%;margin:15px 10px 0px 10px;text-align:right;}
#mot-artiste p:first-letter, .bio-texte:first-letter p{font-size:17pt;}
#mot-artiste p.sign{font-size:14pt;text-align:right;padding-bottom:10px;line-height:100%;}		
#biographie{
	position:relative;
	display:block;
	width:100%;
	height:338px;
	}	
.bio-texte{
	position:relative;
	display:block;
	max-width:50%;
	height:auto;
	float:left;
	left:3%;
	top:0;	
	}	
.bio-texte p{font-size:14pt;line-height:110%;text-align:left;padding:25px 0 0 0;}	
#biographie img{
	position:absolute;
	top:0;
	width:300px;
	height:338px;
	}
.imgartiste{
	position:relative;
	width:300px;
	height:338px;
	right:0;
	top:-20px;
	float:right;
	}
#awards{
	position:relative;
	display:block;
	width:100%;
	height:470px;
}
#awards h1{
	font-size:22pt;
	padding-top:10px;
	text-align:center;
}
#awards h2{
	font-size:22pt;
	text-align:center;
	padding-top:20px;
}
.awards-list{
	position:relative;
	margin: 0 auto;
	width:100%;
	padding-bottom:10px;
}
.awards-list ul li{
	display:block;
	text-align:center;
	padding:3px 0 3px 0;
	height:36px;
}
.awards-list li:before{
	padding-right:3px;
	content: url(../images/reward-sm.png);
}
#dem-artistique{
	width:100%;
	height:400px;
	background:url('../images/atelier.jpg') 50% 50% no-repeat;	
	}	
.dem-artistique-box{
	position:relative;
	width: 100%;
	top:20px;
	float:right;
	right:0%;
	height:360px;
	}
.dem-artistique-box p{font-size:14pt;line-height:110%;text-align:right;margin:15px 3% 0 5%;}
#contactez{
	position:relative;
	display:block;
	width:100%;
	height:240px;
	}
#contactez-box{
	position:relative;
	width:100%;
	height:100%;
	float:left;
	background-color:rgba(10,10,10,0.80);
	}	
#contact-infos{
	position: relative;
	width:230px;
	height:65px;
	left:5px;
	float:right;
	margin:35px 0 0 0;
	}	
#contact-infos h1{
	color:#fff;
	font-size:16pt;
	text-align:right;
	line-height:1.3;
	padding-bottom:5px;
	}
#contact-infos h1 img{
	position:relative;
	width:30px;
	height:30px;
	display:block;
	float:right;
	margin:0 0 0 6px;
	}
#contact-infos h1 a{
	color:#fff;
	font-size: 16pt;
	text-align:right;
	}
#contact-infos h1 a:link{color:#fff;}
#contact-infos h1 a:visited{color:#fff;}
#contact-infos h1 a:hover{color:#e6a534;}
#footer{
	position:relative;
	width:100%;
	height:200px;
	}
.footer-text{
	position:relative;
	max-width:90%;
	margin: 50px auto 0 auto;
	text-align:center;
	font-size:11pt;
	line-height:105%;
	}
.footer-legal{
	position:relative;
	width:195px;
	margin: 20px auto 0 auto;
	font-size:10pt;
	}
.copy{padding-right:10px;}
.credits{
	padding-left:10px;
	text-decoration:none;
	}
.credits-box{
	width:500px;
	height:380px;
	margin: 10% auto 160px auto;
	}
.credits-title{
	position:relative;
	top:20px;
	font-size:18pt;
	margin: 0 auto 60px auto;
	}
.credits-desc{
	position:relative;
	font-size:12pt;
	margin:20px 15px 0 15px;
	}
.credits-author{
	position:relative;
	font-size:13pt;
	}
}
@media only screen and (max-width: 684px) {
#mot-artiste{padding-top:2px;}
#contactez{
	position:relative;
	display:block;
	width:100%;
	height:240px;
	}
#contact-infos{
	position: relative;
	width:230px;
	height:65px;
	float:right;
	left:0;
	margin:0 30px 0 0;
	}*		
#biographie{height:338px;}	
.bio-texte{
	position:relative;
	max-width:45%;
	float:left;
	}	
.bio-texte p{font-size:14pt;line-height:110%;padding:15px 0 0 0;}	
#biographie img{
	position:absolute;
	top:0;
	width:300px;
	height:338px;
	}
.imgartiste{
	position:relative;
	width:300px;
	height:338px;
	right:0;
	top:-10px;
	float:right;
	}	
.dem-artistique-box p{font-size:14pt;line-height:110%;margin:15px 3% 0 5%;}
}
@media only screen and (max-width: 600px) {
#mot-artiste p{font-size:14pt;line-height:110%;margin:10px 10px 0px 10px;}
#mot-artiste p:first-letter, .bio-texte:first-letter p{font-size:16pt;}
#mot-artiste p.sign{font-size:13pt;padding-bottom:10px;}	
.imgartiste{top:-15px;}	
.bio-texte{
	position:relative;
	max-width:42%;
	float:left;
	left:2%;
	}	
.bio-texte p{font-size:13pt;line-height:105%;padding:15px 0 0 0;}	
#awards{
	position:relative;
	display:block;
	width:100%;
	height:470px;
}
#awards h1{
	font-size:22pt;
	padding-top:10px;
	text-align:center;
}
#awards h2{
	font-size:22pt;
	text-align:center;
	padding-top:20px;
}
.awards-list{
	position:relative;
	margin: 0 auto;
	width:100%;
	padding-bottom:10px;
}
.awards-list ul li{
	display:block;
	text-align:center;
	padding:3px 0 3px 0;
	height:32px;
}
.awards-list ul li a{font-size:12pt;}
.dem-artistique-box{
	top:10px;
	height:380px;
	}
.dem-artistique-box p{font-size:14pt;line-height:105%;margin:15px 2% 0 5%;}
#contactez{
	position:relative;
	display:block;
	width:100%;
	height:240px;
	}
}
@media only screen and (max-width: 563px) {
#biographie{height:400px;}
.imgartiste{top:20px;}
.bio-texte{
	position:relative;
	max-width:37%;
	float:left;
	left:2%;
	}	
.bio-texte p{font-size:13pt;line-height:100%;padding:10px 0 0 0;}
#awards{
	position:relative;
	display:block;
	width:100%;
	height:550px;
}
.awards-list ul li{
	display:block;
	text-align:center;
	padding:8px 0 8px 0;
	height:32px;
}	
.dem-artistique-box{
	top:0;
	height:100%;
	}
.dem-artistique-box p{font-size:14pt;line-height:105%;margin:10px 2% 0 4%;}
.credits-box{
	width:100%;
	height:480px;
	margin: 0;
	}
}
@media only screen and (max-width: 499px) {
#title-home{
	width:240px;
	font-size:32pt;
	margin:80px auto 0 auto;
	line-height:100%;
	}
#subtitle-home{
	width:205px;
	font-size:20pt;
	margin:0 auto;
	padding-left:0;
	line-height:70%;
	}
#tree{
	right:-40px;
	top:45px;
	}
#tree_01{
	left:-55px;
	top:30px;
	}
#mot-artiste p.sign{font-size:13pt;padding-bottom:5px;}	
#biographie{height:600px;}
#biographie img{
	position:absolute;
	top:0;
	width:355px;
	height:400px;
	}
.imgartiste{
	top:0;
	float:none;
	margin:0 auto;
	width:355px;
	height:400px;
	}
.bio-texte{
	position:relative;
	max-width:100%;
	float:none;
	left:2%;
	}
.bio-texte p{font-size:13pt;line-height:100%;padding:10px 1% 0 1%;}
.dem-artistique-box p{font-size:13pt;line-height:100%;margin:8px 2% 0 4%;}
}
@media only screen and (max-width: 399px) {
#mot-artiste p{font-size:12pt;line-height:105%;margin:10px 10px 0px 10px;}
#mot-artiste p:first-letter, .bio-texte:first-letter p{font-size:13pt;}
#mot-artiste p.sign{font-size:11pt;padding-bottom:5px;}	
#biographie{height:575px;}
#biographie img{
	position:absolute;
	top:0;
	width:300px;
	height:338px;	
	}
.imgartiste{
	position:relative;
	top:0;
	float:none;
	width:300px;
	height:338px;
	margin: 0 auto;
	}
.bio-texte{
	position:relative;
	max-width:100%;
	float:left;
	left:1%;
	}	
.bio-texte p{font-size:13pt;line-height:105%;padding:5px 1% 0 1%;}	
.dem-artistique-box p{font-size:13pt;line-height:105%;margin:5px 1% 0 5%;}
#dem-artistique{
	position:relative;
	width:100%;
	height:493px;
	background:url('../images/atelier_399.jpg') 50% 50% no-repeat;	
	}		
}
@media only screen and (max-width: 350px) {
.bio-texte p{font-size:12pt;}	

.dem-artistique-box p{font-size:12pt;}
}
/*animate.css*/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}        
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
@-webkit-keyframes slideInLeft {
0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes slideInLeft {
0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}
.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes slideInRight {
0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}
.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}