.pucetop{
	text-align: center;
	top: 0;
	margin: auto;
	width: 48px;
	height:  40px;
	display: block;
	position: relative;
	background-image: url('/CMS/uploads/FR/images/pages/homepage/h_p/h_p_w/puce.png');
	background-size: auto;
	background-repeat: no-repeat;
}

.btnblanc{
	color: #404040;
	background-color:#fff;
}

.btnblanc:hover{
	color: #404040;
	background-color:#fff;
}

html, 
body
{
	height: 100%;
}

section
{
	margin: 0px;
	padding: 0px;
	position: relative;
	overflow: hidden;
	margin-bottom: 0px !important;
}

body
{
	-webkit-overflow-scrolling: none;
}

#blockscroll{
	height: 1000px;
}

#blockscroll{
	height: 1000px;
}

#blockscroll #menu {
	background-color: #272832;
	width: 100%;
	padding: auto;
	display: inline-block;
	text-align: center;
}

#blockscroll #menu  ul {
	padding:0;
	margin:0;
	list-style-type:none;
}

#blockscroll #menu  li {
	margin-left:2px;
	float:left; /*pour IE*/
}

#blockscrollul  #menu  li a {
	background-color: none;
	border-right: 1px #666666 solid;
	height: 50px;
	width: 33%;
	margin-left:-2px;
	margin-right:-2px;
	padding: 15px;
	text-align: center;
	border-bottom: 1px #666666 solid;
	color: #ffffff;
}
 
#blockscroll #menu  ul li a:hover {
	background-color: none;
	border-bottom:5px #ffffff solid;
	color: #ffffff;
}

#blockscroll #menu  ul li a.active {
	background-color: none;
	border-bottom:5px #ffffff solid;
	color: #ffffff;
}

.menu {
	border-top: 0px;
	width: 100%;
	padding: auto;
	text-align: center;
	margin-left: 0;
	background-color: #272832;
}

#blockscroll #pagepiling{
	height: 1000px;
}

#blockscroll #pagepiling #section1,#section2,#section3,#section4{
	height: 1000px;
}

#element1 ,#element2 {
	border-right: 1px #666666 solid;
	height: 50px;

	padding: 15px;
	text-align: center;
	border-bottom: 1px #666666 solid;
	color: #ffffff;
}

#menu1 ,#menu2 {
	border-right: 1px #666666 solid;
	height: 50px;

	padding: 15px;
	text-align: center;
	border-bottom: 1px #666666 solid;
	color: #ffffff;
}

.gifcontent{
	max-width: 384px;
	margin-right:auto;
	margin-left:auto;
	text-align:center;
	float: right;
	padding-top: 5%;
	padding-bottom: 5%;
}

.lcontent{

	padding-right:5%;
	padding-top: 30px;
	padding-bottom:30px;
	position: relative;
	vertical-align: middle;
	text-align: left;
	color:#fff;
}

.lcontent h2{

	position: relative;
	vertical-align: middle;
	text-align: left;
	line-height: 38px;
	color:#fff;
}

.lcontent p{
	margin-left:6%;
	margin-right:6%;
}

.lcontent a{
	margin-left:6%;
	margin-right:6%;
	margin-bottom: 2%;
}

.lcontent h3{
	margin-left:6%;
	margin-right:6%;
	position: relative;
	vertical-align: middle;
	text-align: left;
	line-height: 30px;
	color:#fff;
}

#content1 h3, #content2 h3, #content3  h3{
	color: #fff;
	margin-bottom: 15px;
}

#content1, #content2, #content3  {
	display: none;
}

#content1.active,
#content2.active,
#content3.active  {
	display: block;
	background: none;
}

#mobilecontent1, #mobilecontent2  {
	display: none;

}
#mobilecontent1.active, #mobilecontent2.active  {
	display: block;
	background: none;
    padding-right: 10%;
}

#element1:hover,
#element2:hover,
#element3:hover{
	border-bottom:5px #ffffff solid;
}

#element1.active {
	border-bottom:5px #ffffff solid;
	color: #ffffff;
	background: none;
	text-align: center;
}

#element2.active {
	border-bottom:5px #ffffff solid;
	color: #ffffff;
	background: none;
}

#menu3 {
	height: 50px;
	padding: 15px;
	color: #ffffff;
	border-bottom: 1px #666666 solid;
	text-align: center;
}

#element3 {
	height: 50px;
	padding: 15px;
	color: #ffffff;
	border-bottom: 1px #666666 solid;
	text-align: center;
}

#element3.active {
	border-bottom:5px #ffffff solid;
	color: #ffffff;
	background: none;
}

#menu1.active {
	border-bottom:5px #ffffff solid;
	color: #ffffff;
	background: none;
	text-align: center;
}

#menu2.active {
	border-bottom:5px #ffffff solid;
	color: #ffffff;
	background: none;
}

#menu3.active {
	border-bottom:5px #ffffff solid;
	color: #ffffff;
	background: none;
}

section:first-child,
section:last-child
{
	color: #fff;
	min-height: 100%;
}

section:first-child article,
section:last-child article
{
	position: absolute;
	top: 50%;
	width: 80%;
	max-width: 80%;
	margin-left: 10%;
	margin-top: -274px;
}

section:nth-child(2)
{
}

section:nth-child(3)
{
	background-image: url("/CMS/uploads/FR/images/pages/homepage/h_p/h_p_w/1.jpg");
	background-position:center;
	background-repeat: no-repeat;
	background-size: cover;
	color: #fff;
}

section:nth-child(4)
{
	background-color: #272832;
}

section:nth-child(5)
{
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

section:nth-child(5) h2
{
	color: #fff;
	text-shadow: 1px 1px 3px rgba( 0, 0, 0, 0.25 );
	font-weight: 400;
}

section:nth-child(5) div
{
	position: absolute;
	top: -25%;
	left: 0px;
	height: 150%;
	width: 150%;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-position: center;
}

section:nth-child(6)
{
	background-image: url("/CMS/uploads/FR/images/pages/homepage/h_p/h_p_w/2.jpg");
	background-repeat: no-repeat;
	background-position: center;
}

section.video
{
	text-transform: uppercase;
	background: none;
	background-color: none !important;
	color: #fff;
}

section.video h2
{
	font-size: 48px;
	line-height: 55px;
	color: #fff;
}

section.video article {
	width: 470px;
	margin: 0 auto;
	margin-right: 0px;
	padding-top: 20%;
	padding-bottom: 44%;
	max-width: 80%;
	text-align: center;
}

.fullscreen-bg {
	position: fixed;
	top: 50px;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	z-index: -1;
}

@media screen and (min-width: 0px) and (max-width: 319px) {
	.fullscreen-bg {
		bottom: 0;
		left: 0;
		overflow: hidden;
		position: fixed;
		right: 0;
		top: 0px;
		z-index: 0;
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.fullscreen-bg {
		bottom: 0;
		left: 0;
		overflow: hidden;
		position: fixed;
		right: 0;
		top:0px;
		z-index: 0;
	}
}

.fullscreen-bg__video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/*	filter: grayscale(1);
		-webkit-filter: grayscale(1);
		-moz-filter: grayscale(1);
		-o-filter: grayscale(1);
		-ms-filter: grayscale(1);*/
}

.inactive {
	filter: brightness(20%) blur(15px);
	-webkit-filter: brightness(20%);
	-webkit-transition: .5s ease-in-out;;
	-moz-filter: brightness(20%);
	-moz-transition: .5s ease-in-out;
	-o-filter: brightness(20%);
	-o-transition: .5s ease-in-out;
	-ms-filter: brightness(20%);
}

/*
.fullscreen-bg__video:hover
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
  	filter: grayscale(0);
  	-webkit-filter: grayscale(0);
  	-moz-filter: grayscale(0);
  	-o-filter: grayscale(0);
  	-ms-filter: grayscale(0);
}*/

@media (min-aspect-ratio: 16/9) {
	section article h2{

		text-transform: uppercase;
		color:#ffffff;
	}

	section article p{
		color:#ffffff;
	}
	section article h1,
	section article h2,
	section article h3
	{
		font-weight: 200;
		font-size: 36px;
		line-height: 40px;
	}

	section article p
	{
		font-family: "Itcavantgardestd-bk", Helvetica, Arial, sans-serif;
		font-weight: 200;
		font-size: 21px;
		line-height: 25px;
	}

	section article strong
	{
		text-transform: uppercase;
		font-weight: 400;
	}

	section article a
	{
		color: #fff;
	}

	section article
	{
		width: 100%;
		margin: 0 auto;
		padding: 180px 0px 180px 0px;
		max-width: 80%;
		text-align: center;
	}

	section.video h2
	{
		font-size: 48px;
		color: #fff;
	}

	.fullscreen-bg__video {
		height: 300%;
	    top: -100%;
	}

	section article div
	{
		font-size: 32px;
		line-height: 49px;
	}

	section article div h2
	{
		font-size: 36px;
		line-height: 40px;
	}

	section article div p
	{
		font-size: 21px;
		line-height: 25px;
	}
}

@media (max-aspect-ratio: 16/9) {
	section article h2{

		text-transform: uppercase;
		color:#ffffff;
	}

	section article p{
		color:#ffffff;
	}

	section article h1,
	section article h2,
	section article h3
	{
		font-weight: 200;
		font-size: 32px;
		line-height: 38px;
	}

	section article p
	{
		font-family: "Itcavantgardestd-bk", Helvetica, Arial, sans-serif;
		font-weight: 200;
		font-size: 21px;
		line-height: 25px;
	}

	section article strong
	{
		text-transform: uppercase;
		font-weight: 400;
	}

	section article a
	{
		color: #fff;
	}

	section article
	{
		width: 100%;
		margin: 0 auto;
		padding: 180px 0px 180px 0px;
		max-width: 80%;
		text-align: center;
	}

	section.video h2
	{
		font-size: 52px;
		color: #fff;
	}

	.fullscreen-bg__video {
    	width: 300%;
    	left: -100%;
  	}
}

/*Grid is 960, consider scrollbars in max-width*/
@media all and (max-width: 999px){
	section.video article{
		width: 260px;
		margin: 0 auto;
		margin-right: 0px;
		padding-top: 14%;
		padding-bottom: 20%;
		max-width: 80%;
		text-align: center;
	}

	section.video h2{
		line-height: 30px;
		font-size: 30px;
	}

	.gifcontent{
		max-width: 384px;
		margin-right:auto;
		text-align:center;
		float: none;
		margin-left: 5%;
		padding-top: 5%;
	}

	#element1:after,
	#element2:after,
	#element3:after {
		content: '\f078';
		font-family:'fontawesome';
		float: right;
	}

	#element1.active:after,
	#element2.active:after,
	#element3.active:after {
		content: '\f077';
		font-family:'fontawesome';
		float: right;
		border-bottom: 0px !important;
	}

	#element1,
	#element2 {
		border-right: 0px #666666 solid;
		height: 50px;
		padding: 15px;
		text-align: left;
		border-bottom: 1px #666666 solid;
		color: #ffffff;
	}

	#menu1,
	#menu2 {
		border-right: 1px #666666 solid;
		height: 50px;

		padding: 15px;
		text-align: left;
		border-bottom: 1px #666666 solid;
		color: #ffffff;
	}

	#element1:hover,
	#element2:hover,
	#element3:hover {
			border-bottom: 1px #666666 solid;
						text-align: left;
	}
	
	#element1.active {
		border-bottom: 0px #666666 solid;
		color: #ffffff;
		background: none;
		text-align: left;
	}

	#element1.active +div+div {
		border-top: 1px #666666 solid;
	}
	
	#element2.active +div+div {
		border-top: 1px #666666 solid;
	}

	#element2.active {
		border-bottom: 0px #666666 solid;
		color: #ffffff;
		text-align: left;
		background: none;
	}

	#menu3 {
		height: 50px;
		padding: 15px;
		color: #ffffff;
		border-bottom: 1px #666666 solid;
		text-align: left;
	}

	#element3 {
		height: 50px;
		padding: 15px;
		color: #ffffff;
		border-bottom: 1px #666666 solid;
		text-align: left;
	}

	#element3.active {
		border-bottom: 0px #666666 solid;
		color: #ffffff;
		text-align: left;
		background: none;
	}

	#menu1.active {
		border-bottom: 1px #666666 solid;
		color: #ffffff;
		background: none;
		text-align: left;
	}
	
	#menu2.active {
		border-bottom: 1px #666666 solid;
		color: #ffffff;
		text-align: left;
		background: none;
	}
	
	#menu3.active {
		border-bottom: 1px #666666 solid;
		color: #ffffff;
		text-align: left;
		background: none;
	}

	section article div h2
	{
		font-size:35px;
		line-height: 50px;
	}

	section article div
	{
		font-size: 32px;
		line-height: 49px;
	}

	section article div h2
	{
		font-size: 36px;
		line-height: 40px;
	}

	section article div p
	{
		font-size: 21px;
		line-height: 25px;
	}
}

@media all and (min-width: 0px) and (max-width: 630px){
	section.video article {
	    width: 215px !important;

	    padding-bottom: 9% !important;

	}
}

/*Hide for mobile*/
@media all and (max-width: 768px){
	.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, 
	.col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, 
	.col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, 
	.col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, 
	.col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, 
	.col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, 
	.col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, 
	.col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, 
	.col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, 
	.col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, 
	.col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, 
	.col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
		padding:0px;
	}

	section.video article{
		width: 250px;
		margin: 0 auto;
		margin-right: 0px;
		padding-top: 27%;
		padding-bottom: 24%;
		max-width: 80%;
		text-align: center;
	}

	.gifcontent{
		max-width: 300px;
		margin-right:auto;
		margin-left: 9%;
		text-align:center;
		float: none;
		padding-top: 5%;
	}

	section.video h2
	{
		font-size: 20px;
		color: #fff;
	}

	section.video h2{
		line-height: 24px;
		font-size: 24px;
	}

	.fullscreen-bg {
		background: url('/CMS/uploads/FR/images/pages/homepage/h_p/h_p_w/video2.png');
		background-size:contain;
		background-color:#000;
		background-repeat: no-repeat;
	}

	.fullscreen-bg__video {
		display: none;
	}

	section article div
	{
		font-size: 32px;
		line-height: 49px;
	}

	section article div h2
	{
		font-size: 36px;
		line-height: 40px;
	}

	section article div p
	{
		font-size: 21px;
		line-height: 25px;
	}

	section.video article{
		width: 250px;
		margin: 0 auto;
		margin-right: 0px;
		padding-top: 27%;
		padding-bottom: 20%;
		max-width: 80%;
		text-align: center;
	}

	section.video h2{
		line-height: 24px;
		font-size: 25px;
	}

	#mobilelcontent1{
		margin: 6%;
	}

	#mobilercontent1{
		margin: 6%;
	}

	#mobilelcontent2{
		margin: 6%;
	}

	#mobilercontent2{
		margin: 6%;
	}

	section article h2{

		text-transform: uppercase;
		color:#ffffff;
	}

	section article p{
		color:#ffffff;
	}

	section article h1,
	section article h2,
	section article h3
	{
		font-weight: 200;
		font-size: 24px;
		line-height: 28px;
	}

	section article p
	{
		font-family: "Itcavantgardestd-bk", Helvetica, Arial, sans-serif;
		font-weight: 200;
		font-size: 15px;
		line-height: 17px;
	}

	section article strong
	{
		text-transform: uppercase;
		font-weight: 400;
	}

	section article a
	{
		color: #fff;
	}

	section article
	{
		padding:0px;
		padding-top: 100px;
		padding-bottom: 120px;
	}

	section article div h2
	{
		font-size: 24px;
		line-height: 28px;
		padding-bottom: 10px;
	}

	section article div p
	{
		font-size: 15px;
		line-height: 17px;
	}

	section:first-child,
	section:last-child
	{
		color: #fff;
		min-height: 100%;
	}

	section:first-child article,
	section:last-child article
	{
		position: absolute;
		top: 50%;
		width: 80%;
		max-width: 80%;
		margin-left: 10%;
		margin-top: -274px;
	}

	section:nth-child(2)
	{
	}

	section:nth-child(3)
	{
		background-image: url("/CMS/uploads/FR/images/pages/homepage/h_p/h_p_w/1.jpg");
		background-position:center;
		background-repeat: no-repeat;
		background-size: cover;
		color: #fff;
	}

	section:nth-child(4)
	{
		background-color: #272832;
	}

	section:nth-child(5)
	{
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}

	section:nth-child(5) h2
	{
		color: #fff;
		text-shadow: 1px 1px 3px rgba( 0, 0, 0, 0.25 );
		font-weight: 400;
	}

	section:nth-child(5) div
	{
		position: absolute;
		top: -25%;
		left: 0px;
		height: 150%;
		width: 150%;
		background-repeat: no-repeat;
		background-size: 100% 100%;
		background-size: cover;
		background-position: center;
	}

	section:nth-child(6)
	{
		background-image: url("/CMS/uploads/FR/images/pages/homepage/h_p/h_p_w/2.jpg");
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}
}

/* Gestures empty layer to trigger video gestures */
#contentspots_1_AnchorDiv{
	position:relative;
	width:100%;
}

/* background setup */
.background {
	background-repeat:no-repeat;
	/* custom background-position */
	background-position:50% 50%;
	/* ie8- graceful degradation */
	background-position:50% 50%\9 !important;
}

.fullscreen,
.content-a {
	width: 100%;
	min-height:100%;
}

.not-fullscreen,
.not-fullscreen .content-a,
.fullscreen.not-overflow,
.fullscreen.not-overflow .content-a {
	height:100%;
	overflow:hidden;
}

/* content centering styles */
.content-a {
	padding-left:50%;
	display:table;
}
.content-b {
	background-color: #fff;
	height: 100%;
	display:table-cell;
	padding: 10%;
	position:relative;
	padding-right: 20%;
	vertical-align:middle;
	text-align:left;
}

.content-b h2 {
	text-transform: uppercase;
}

.not-fullscreen {
	height:50%;
}