@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Vollkorn');
@import url('https://fonts.googleapis.com/css?family=Pinyon+Script');
html, body {

	height:100%;
	padding:0;
	margin:0;
	overflow:hidden;
}
.loader {
  color: #79A7AA;
  font-size: 90px;
  text-indent: -9999em;
  overflow: hidden;
  width: 1em;
  height: 1em;
	-moz-border-radius:50%;
  -webkit-border-radius:50%;
  border-radius: 50%;
 top: 45%;
  margin-right:auto;
  margin-left:auto;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load6 1.7s infinite ease, round 1.7s infinite ease;
  animation: load6 1.7s infinite ease, round 1.7s infinite ease;
}

@-webkit-keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}
@keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}
@keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
#logo{
	    min-width: 170px;
    width: 40%;
    max-width: 250px;
    margin-right: auto;
    margin-left: auto;

    height: 24%;
    text-align: center;
    margin-bottom: 7%;
  


}
#fb img {
    width: 50px;
    transition: width .5s;
    padding: 10px;
}
.histoire{display:none;position:relative; margin-top:0%;}
button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}

.pagecontact{
	display:none;
	width:70%;
	  font-family: 'KenyanCoffeeRg';
	text-align:center;
	color:#FFFDEE;
	font-size:30px;
	height:100%;
	position:relative;
float:right;
	z-index:1001;
	background:url("maison-folklore-champagne.jpg");
	overflow-y: scroll;
}
form{
    font-size: 100%;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
    margin: 0;
    padding: 0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: #22839f;
	    
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	    line-height: 1.42857143;

}
.imagesup {
display: block;
margin: 0px;
padding : 0;
}
.boite {
width: 100%;
height: 100%;

line-height: 14px;
position: relative;
overflow: hidden;
}
.texte {
visibility: hidden;	
position: absolute;
padding: 0 0.5em;
}
.contacts {
    font-family: 'KenyanCoffeeRg';
    font-size: 26px;
    line-height: 26px;
}
.contacts a{
    font-family: 'KenyanCoffeeRg';
    display: block;
    margin-bottom: 30px;
    line-height: 32px;
}
iframe {
    width: 100%;
    height: 250px;
    margin-bottom: 20px;
	font-size: 100%;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
    margin: 0;
    padding: 0;
}
element:hover, element:active, element:focus {
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-user-select: none;
-webkit-touch-callout: none /*only to disable context menu on long press*/
}
#mailimg img {
    max-width: 100%;
	height:auto;
	vertical-align: middle;
}
.contacts span {
    font-family: 'KenyanCoffeeRg';
    display: block;
    margin-bottom: 30px;
    line-height: 32px;
	font-size:24px;
	color: #FFFDEE;
}
.contacts span:before {
    font-family: 'icomoon';
    margin-right: 10px;
}
.icon-phone:before {
    content: "\e60d";
}
.icon-location:before {
    content: "\e60c";
}

.label {
    line-height: 0;
    color:transparent;
    opacity: .5;
	    font-size: 100%;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
    margin: 0;
    padding: 0;
		-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	    box-sizing: border-box;
}

.form-text {
    padding-top: 20px;
	 padding-bottom: 20px;
	    padding-right: 0px;
    width: 100%;
	color: #22839f;
 
    border: 0;
	 background: #FFFDEE;
	    border-left: 20px transparent solid;
  
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	 box-sizing: border-box;
}

.form-textarea {
    color: #22839f;
	  border-left: 20px transparent solid;
    
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	box-sizing: border-box;
     background: #FFFDEE;
	   padding-top: 20px;
	 padding-bottom: 20px;
	padding-right: 0px;
    width: 100%;
    margin-bottom: 35px;
    
}
.form-button {
    padding: 18px 30px;
    font-size: 24px;
    margin-bottom: 40px;
    border: 0;
    font-family: 'KenyanCoffeeRg';
	color: #f2eed9;
    background: #e27065;
}
.menu_other {
    height: 50px;
    top: 50%;
    margin-top: -25px;
    position: fixed;
    width: 100%;
    display: none;
    z-index: 1000;
}
.surtitre{
	margin-top: 10px;
	font-size:25px;
}
h4{
	font-size: 45px;
	font-weight: 100;
    line-height:normal;
    margin: 0;
	display:inline;
    padding: 0;
    color: #79A7AA;
    font-family: 'KenyanCoffeeRg';
}
h5{
	font-size: 35px;
    font-weight: 100;
	display:inline;
    line-height: normal;
    margin: 0;
    padding: 0;

    color: #C79859;
    font-family: 'KenyanCoffeeRg';
}
.textuel{
	font-family: 'Vollkorn', serif;
	font-size:16px;
	color:rosybrown;
	font-weight: 400;
	line-height: normal;
}


h7{
	font-size: 50px;
	font-variant-caps: small-caps;
    line-height: 80px;
    margin: 0;
    padding: 0;
   color: #79A7AA;
    font-family: 'KenyanCoffeeRg';
	text-decoration:none;
}
h7:hover, h7:focus{
	text-decoration: underline;
	cursor:pointer;
}

a:hover, a:focus, a:active, a:visited {
      text-decoration: none;
      color: inherit;
	
 }
h7 a{
 color: inherit;
	text-decoration:none;
}
h8{
	font-size: 25px;

    line-height: 50px;
    margin: 0;
    padding: 0;
    color: #C79859;
    font-family: 'KenyanCoffeeRg';
}
.sidepannel{
		width:auto;
	
		height:100%;
		max-width:25%;
		display:none;
			position:relative;
	}
	.sidepannel img{
		width:auto;
		height:100%;
	}
	.left{
		float:left;
		-webkit-box-shadow: 4px 0px 17px 0px rgba(117,89,70,1);
-moz-box-shadow: 4px 0px 17px 0px rgba(117,89,70,1);
box-shadow: 4px 0px 17px 0px rgba(117,89,70,1);
		text-align: right;
	}
	.right{
		float:right;
	-webkit-box-shadow: -4px 0px 17px 0px rgba(117,89,70,1);
-moz-box-shadow: -4px 0px 17px 0px rgba(117,89,70,1);
box-shadow: -4px 0px 17px 0px rgba(117,89,70,1);
		text-align: left;
	}
	.ileft{
		float:right
	
	}

	.iright{
		float:left
		
	}
	#logo img{
		position:relative;
		margin-left:auto;
		margin-right:auto;
		bottom:0px;
	max-width:100%;
		max-height:100%;
	}
#maindroite{
	background:url("maindroite.png") left center no-repeat;
	background-size:contain;
	cursor:pointer;
}
#maindroite:hover, #maindroite:focus{
	background:url("maindroitehover.png") left center no-repeat;
	background-size:contain;
	cursor:pointer;
}

#maingauche{
	background:url("maingauche.png") right center no-repeat;
		background-size:contain;
	cursor:pointer;
}
#maingauche:hover,#maingauche:focus{
	background:url("maingauchehover.png") right center no-repeat;
	background-size:contain;
	cursor:pointer;
}
.btmenu{
	width: 40px;
   
    height: 40px;
   cursor:pointer;
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
    background-color: #a0adaa;
	-moz-border-radius:5px;
  -webkit-border-radius:5px;
    border-radius: 5px;
}
.btmenu:hover,.btmenu:focus{
cursor:pointer;
	background-color:#e16860;

}
.dirmain{
	width:100px;
	height:100%;
	display:inline-block;
	margin-left:10px;
	margin-right:10px;
	background-size:contain;
	
}

.gauche{
	float:left;
	margin-left:50px;
	height:50px
}
.droite{
	float:right;
	margin-right:50px;
	height:50px
}
.display{
	display:none;
}
.iplay{
	display:block;
}
.bloctxt{

	 width: 84%;
    left: 8%;
    height: 45%;

    position: absolute;
    bottom: 190px;

}
.infomenuvid {
    width: 100%;
    height: 20px;
    position: fixed;
    text-align: center;
 
    color: #cd7e69;
    font-size: 20px;
    font-weight: 100;
	bottom:30px;
	display:none;
    margin: 0;
    padding: 0;
	 font-family: 'KenyanCoffeeRg';
}
.videocontent{
    width: 46%;
    position: relative;
    display: inline-block;

   
    height: 100%;
}
.video-container {
	 position:relative;
    padding-bottom:56.25%;

    padding-top:30px;
    height:0;
    overflow:hidden;
}
.videoheader{

    width: 100%;
  
}

#section-section5 h2{
	font-size: 32px;
    font-weight: 100;
    line-height: 40px;
    margin: 0;
    display: inline;
    padding: 0;
    position: relative;
    bottom: inherit;
    right: inherit;

    color: #C79859;
    font-family: 'KenyanCoffeeRg';
}
#section-section5 h3{
	    font-size: 39px;
    display: inline;
    font-weight: 100;
    line-height: 66px;
    margin: 0;
    padding: 0;
    position: relative;
    bottom: inherit;
    right: inherit;

    color: #79A7AA;
    font-family: 'KenyanCoffeeRg';
}
h2{
	   font-size: 35px;
    font-weight: 100;
    line-height: initial;
    margin: 0;
    padding: 0;

    color: #C79859;
    font-family: 'KenyanCoffeeRg';
}
#section1_content h2{
	font-family: 'KenyanCoffeeRg';
    line-height: 0px;
    font-size: 36px;
    margin-top: 12%;
    margin-bottom: 20px;
    color: #79A7AA;
}
.slidecontent{
	display:none;
	width:70%;position:relative;margin-left:15%;vertical-align: bottom;
}
h3{	    font-size: 45px;
    font-weight: 100;
    line-height: initial;
    margin: 0;
    padding: 0;

    color: #734D12;
    font-family: 'KenyanCoffeeRg';}

.video_logo{
	  width: 9%;

    margin-bottom: 10px;
	    margin-top: 7%;
    display: inline-block;
   
}
.video_logo img{
	  width:100%;
}
#waitscreen{width:100%;height:100%;position:absolute;left:0px;}
.pressbook{position:relative;width:100%;}
.test{
	font-family: 'Pinyon Script', cursive;
	font-size:24px;
	line-height: 30px;
	color:#8C3704;
}
.blocvid {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 3%;
  
    height: auto;

}
.bloclegend{
	width: 100%;
    margin-top: 3%;
    font-family: 'Vollkorn', serif;
    font-size: 14px;
    color: #987956;
    line-height: normal;

}
.video-container iframe,  
.video-container object,  
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.section{width: 100%;overflow:hidden}
@font-face {
	font-family: 'Beauty_School_Dropout_II';
	src: url('fonts/BEAUTYSC.eot');
	src: local('☺'), url('fonts/BEAUTYSC.woff') format('woff'), url('fonts/BEAUTYSC.ttf') format('truetype'), url('fonts/BEAUTYSC.svg') format('svg');
	font-weight: normal;
	font-style: normal
}

@font-face {
	font-family: 'KenyanCoffeeRg';
	src: url('fonts/KenyanCoffeeRg-bold.eot');
	src: url('fonts/KenyanCoffeeRg-bold.eot?#iefix') format('embedded-opentype'), url('fonts/KenyanCoffeeRg-bold.woff2') format('woff2'), url('fonts/KenyanCoffeeRg-bold.woff') format('woff'), url('fonts/KenyanCoffeeRg-bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal
}

@font-face {
	font-family: 'KenyanCoffeeRg';
	src: url('fonts/KenyanCoffeeRg-italic.eot');
	src: url('fonts/KenyanCoffeeRg-italic.eot?#iefix') format('embedded-opentype'), url('fonts/KenyanCoffeeRg-italic.woff2') format('woff2'), url('fonts/KenyanCoffeeRg-italic.woff') format('woff'), url('fonts/KenyanCoffeeRg-italic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic
}

@font-face {
	font-family: 'KenyanCoffeeRg';
	src: url('fonts/KenyanCoffeeRg-bold-italic.eot');
	src: url('fonts/KenyanCoffeeRg-bold-italic.eot?#iefix') format('embedded-opentype'), url('fonts/KenyanCoffeeRg-bold-italic.woff2') format('woff2'), url('fonts/KenyanCoffeeRg-bold-italic.woff') format('woff'), url('fonts/KenyanCoffeeRg-bold-italic.ttf') format('truetype');
	font-weight: bold;
	font-style: italic
}

@font-face {
	font-family: 'KenyanCoffeeRg';
	src: url('fonts/KenyanCoffeeRg.eot');
	src: url('fonts/KenyanCoffeeRg.eot?#iefix') format('embedded-opentype'), url('fonts/KenyanCoffeeRg.woff2') format('woff2'), url('fonts/KenyanCoffeeRg.woff') format('woff'), url('fonts/KenyanCoffeeRg.ttf') format('truetype');
	font-weight: normal;
	font-style: normal
}

@font-face {
	font-family: "Lobster1.4";
	src: url("fonts/Lobster_1_4.eot?") format("eot"), url("fonts/Lobster_1_4.woff") format("woff"), url("fonts/Lobster_1_4.ttf") format("truetype"), url("fonts/Lobster_1_4.svg#Lobster1.4") format("svg");
	font-weight: normal;
	font-style: normal
}

@font-face {
	font-family: 'icomoon';
	src: url('fonts/icomoon.eot?9ov3x8');
	src: url('fonts/icomoon.eot?#iefix9ov3x8') format('embedded-opentype'), url('fonts/icomoon.woff?9ov3x8') format('woff'), url('fonts/icomoon.ttf?9ov3x8') format('truetype'), url('fonts/icomoon.svg?9ov3x8#icomoon') format('svg');
	font-weight: normal;
	font-style: normal
}

section {
	float:left;
	display:block;
		text-align:center;
	height:100%;
	padding:0;
	margin:0;
	background-image:url("folklore-champenois.jpg");
	background-repeat:repeat;

		background-color: #ede6d8;
	
}
.vignes{background:url("vignes.png") no-repeat center center /cover;width:100%;height:100%;position:absolute;}
h6{
	font-size: 30px;
	font-weight: 100;
	line-height:50px;
margin:0;
	padding:0;
	color:#F3EED0;
	font-family: 'KenyanCoffeeRg';
}
h1{
	    font-size: 85px;
    color: #79A7AA;
    font-family: 'Beauty_School_Dropout_II';
    font-weight: normal;
    line-height: 80px;
     margin-bottom: 40px;;
	    margin-top: 0;
}
p{
    font-weight: bold;
  
   font-family: 'Vollkorn', serif;
    font-size: 17px;
    line-height: normal;
    	color:rosybrown;

}
#section-section1 {
text-align: center;

}
#section-section2 {
	
}
#section-section3 {
	
}
#section-section4 {
	
}
#section-section5 {
	
}
#section-section6 {
	
}
#section-section7 {
	
}
#section-section8 {
	
}
#section-section9 {
	
}
.col-xs-12{
position:relative;min-height:1px;padding-left:15px;padding-right:15px;float:left;width:100%;margin-top:50px;min-width:300px
}

.col-md-6{
position:relative;min-height:1px;padding-left:15px;padding-right:15px;float:left;width:40%;min-width:300px
}

.rightt{
	float:right;
}
.gallery{
	height:100%;
	border:10px solid #FFF7E2;
	margin-left:-10px;
	-moz-box-shadow:0px 0px 10px 1px #333;
	-webkit-box-shadow:0px 0px 10px 1px #333;
	box-shadow: 0px 0px 10px 1px #333;
	margin-top:-10px;
	cursor:pointer;

	opacity:0;
	animation:photoappear 1s 2.5s ease-out forwards;
}
.legendanim{
	display:none;
	position: relative;
    margin-right: auto;
    margin-left: auto;

    bottom: 20px;
    width: 50%;

}
.hideanim{animation: hideanim 1s ease-out  0.2s forwards;}
.removeanim{animation: removeanim 1s ease-out  0.2s forwards;}
.startsidepannelleft{animation: startsidepannelleft 1s ease-in forwards;}
.startsidepannelright{animation: startsidepannelright 1s ease-in forwards;}
.stopsidepannelleft{animation: stopsidepannelleft 1.5s ease-out ;}
.stopsidepannelright{animation: stopsidepannelright 1.5s ease-out ;}
.sliderappear{animation:sliderappear 0.5s 1.5s ease-in forwards}
.capousse{animation:capousse 3s ease-out forwards}
.cagel{animation:cagel 1s ease-out forwards}

@-webkit-keyframes startsidepannelleft {
  0%   { margin-left: -550px;}

  100% { margin-left: 0px; }
}
@-webkit-keyframes capousse {
  0%   { opacity: 0;}

  100% { opacity: 1; }
}
@-webkit-keyframes cagel {
  0%   { opacity: 1;}
  30%	{ opacity: 0.5; }
  100% { opacity: 0; }
}
@-webkit-keyframes hideanim {
  0%   {top:0%;}
 100%   {top:-100%;}
	}
@-webkit-keyframes removeanim {
  0%   {top:-100%;}
 100%   {top:0%;}
	}
@-webkit-keyframes photoappear {
  0%   {margin-top:400px;opacity:0}
	1%   {margin-top:400px;opacity:1}
 100%   {margin-top:-10px;opacity:1}
	}
@-webkit-keyframes sliderappear {
  0%   { width: 0px;
		height:0px;
		top:200px;
	  
}

	
  100%{
	  -moz-box-shadow:0px 0px 20px 1px #333 inset;
	-webkit-box-shadow:0px 0px 20px 1px #333 inset;
	  box-shadow: 0px 0px 20px 1px #333 inset;
	   
	 border:1px solid #999;
		width: 400px;
		height:400px;
		top:0px;
	 
	}
}
@-webkit-keyframes sliderappear150 {
  0%   { width: 0px;
		height:0px;
		top:0px;
	  
}

	
  100%{

		width: 150px;
		height:150px;
		
	 
	}
}

@-webkit-keyframes sliderappear250 {
  0%   { width: 0px;
		height:0px;
		top:0px;
	  
}

	
  100%{

		width: 250px;
		height:250px;
		
	 
	}
}
 
	  
@-webkit-keyframes startsidepannelright {
  0%   { margin-right: -550px;}

  100% { margin-right: 0px; }
}
@-webkit-keyframes stopsidepannelleft{
  0%   { margin-left: 0px;}

  100% { margin-left: -550px; }
}
@-webkit-keyframes stopsidepannelright {
	 0%   { margin-right: 0px; }

  100% { margin-right: -550px; }
}
.horizon-prev, .horizon-next {

}
.horizon-prev {

}
.horizon-next {

}
.bouton{
	background-color:#bc8f8f;
	-moz-border-radius:50px;
  -webkit-border-radius:50px;
	border-radius:50px;
	width:200px;
	cursor:pointer;
	margin-left:auto;
	position:relative;
	margin-right:auto;
	margin-top:10%;
	transition: background-color 0.3s ease-in;
	
}
.bouton:hover, .bouton:focus{
	cursor:pointer;
	background-color:#e16860;
	transition: background-color 0.3s ease-out;
}
.menu_vid{
	width:100%;
	position:fixed;
z-index:1;
	height:40px;
	bottom:80px;
	text-align:center;
}


.afftxt{
	background: #a0adaa url("afftxt.png") center center no-repeat;
	background-size:80% 80%;
}
.affvid{
	background: #a0adaa url("tradition-de-champagne.png") center center no-repeat;
	background-size:80% 80%;
}
.rockstar{
	height:85%;
	

}
.rockstar2{
	height:85%;

}
.play{
	background: #a0adaa url("jeu-du-toquat.png") center center no-repeat;
	background-size:80% 80%;
}
.pause{
	background: #a0adaa url("question-toquat.png") center center no-repeat;
	background-size:80% 80%;
}
.share{
	
	background: #a0adaa url("facebook.png") center bottom no-repeat;
	background-size:100% 100%;
}
.novideo{
	position:relative;

	display:none;
}
#wait{
	    background: #FFFEF1 url(folklore-champenois.jpg) repeat;
    position : fixed; height:100vh; width:100%; z-index:1000
}
#section1_content{
	width:40%;left:30%;position:absolute;top:10%
}
#slidecontainer{
	
	    margin-left: auto;
    margin-right: auto;
    width: 60%;
    position: relative;
   
}

#slidetop{margin-top:4%;margin-bottom: 2%;}
#slidebottom{
	max-width: 300px;
    margin-top:3%;
  
    position: relative;
    margin-left: auto;
    margin-right: auto;
}
img { border: 0; }


.rotatescroll { position:relative;text-align:left;display:inline-block;width:400px;height:400px; }
.rotatescroll .viewport{
	
background:url("traditionnel-champenois.jpg") center center no-repeat;background-size:400px 400px;
	position: relative;
	margin:0 auto;
	overflow:hidden;

	pointer-events: none;
	 
	-moz-border-radius:50%;
  -webkit-border-radius:50%;
	border-radius:50%;
	
	}
.rotatescroll .overview { height:100%;position: absolute; width: 798px; list-style: none; margin: 0; padding: 0;  left: 0; top: 0; }
.rotatescroll .overview li { height:100%; width:600px; float: left; position: relative;  }
.rotatescroll .overlay {pointer-events: none; position: absolute; left: 0; top: 0; height:400px; width:400px; }
.rotatescroll .thumb { background:url(img-show/bg-thumb.png) no-repeat 50% 50%; touch-action: none; -ms-touch-action: none; position: absolute; top: -3px; cursor: pointer; left: 137px; width: 50px; z-index: 200;  height: 50px; }
.rotatescroll .dot { background:url(img-show/bg-dot.png) no-repeat 0 0; display: none; height: 12px; width: 12px; position: absolute; left: 155px; top: 3px; z-index: 100; }
.rotatescroll .dot span { display: none; }

.cont_logo{
	text-align:center
}

.vertigliss {
    z-index: 100;
    width: 70%;
    height: 200%;
    position: relative;
    margin-left: auto;
    margin-right: auto;
}
.vertipart1{width:100%;height:50%;}
.vertipart2{width:100%;height:50%;}
.txtanim{position:relative;top:20%;width:100%; text-align:center;}
.logomin{width:200px;margin-top:40px;margin-bottom:40px}

@media screen and (orientation:landscape) and (max-width: 1800px) {
	#section1_content {

    top: 10%;
}
}
@media screen and (orientation:landscape) and (max-width: 1500px) {
	#slidebottom {
    max-width: inherit;
}
	#section1_content {

    top: 11%;
}
	.video_logo {
  margin-top: 3%;
    
}
}
@media screen and (min-height:850px) and (max-width: 1500px) {
	.videoheader {
 
    margin-top: 10%;
}
	.bloctxt {
height:40%;
    bottom: 28%;
}
	.infomenuvid {
    bottom: 80px;
}
	.menu_vid {

    bottom: 150px;
    
}
	.blocvid {
		width: 80%;}
}
@media screen and (orientation:landscape) and (max-width: 1400px) {
	.bloctxt {

    bottom: 26%;
}
}
@media screen and (orientation:landscape) and (max-width: 1350px) {
	#slidetop {
    margin-top: 3%;
    margin-bottom: 2%;
}
	#section-section5 h2 {
    font-size: 24px;

    line-height: 0px;
    
}
	#section-section5 h3 {
    font-size: 30px;
   
    
    line-height: 66px;
  
}
	#slidebottom {
   
		margin-top: 2%;}
	
	h2 {
		font-size: 27px;}
	h3 {
		font-size: 36px;}
	.menu_vid {
 
    bottom: 60px;
	}
	.infomenuvid {
		bottom:20px;
	}
	.blocvid {
   
    margin-top: 7%;
   
}
}
@media screen and (orientation:landscape) and (max-width: 1300px) {
	#section1_content {

    top: 12%;
}
	.bouton {

    width: 177px;
 
    margin-top: 7%;
   
}
	.blocvid {
    margin-top: 4%;
		width:80%;
}
.video_logo {
    margin-top: 2%;
	margin-bottom:5px;
}	
.videoheader {
    margin-top:5%;
}
	
	h6 {
    font-size: 26px;
    
    line-height: 43px;
    
}
	#logo {
    margin-bottom: 3%;
}
	p {

    font-size: 14px;
   
}
	h1 {
    font-size: 73px;
 
    line-height: 80px;
    margin-bottom: 14px;
    margin-top: 0;
}
}

@media screen and (orientation:landscape) and (max-width: 1200px) {
	#slidetop {
    margin-top: 5%;
    margin-bottom: 2%;
}
	#slidebottom {
    max-width: 333px;
    margin-top: 4%;
}
	.rotatescroll {
    width: 250px;
    height: 250px;
	top:11%;
}
	.rotatescroll .viewport {

    background-size: 250px 250px;
 
}
	.rotatescroll .overlay {

    height: 250px;
    width: 250px;
}
	.sliderappear{animation:sliderappear250 0.5s 1.5s ease-in forwards}
	.rotatescroll .thumb {
		-moz-border-radius:50%;
  -webkit-border-radius:50%;
		border-radius:50%;
		
    background: url(img-show/bg-thumb2.png) no-repeat 50% 50%;
		border:1px solid #fff;

background-size:contain;
    width: 30px;

    height: 30px;
}

	#section1_content {

    top: 5%;
}
	.blocvid {
    margin-top: 2%;
}
	
.videoheader {
    margin-top:0%;
}
}
@media screen and (orientation:landscape) and (max-width: 1150px) {
		.video_logo {
    display:none;

}
.blocvid {
	width: 90%;
    margin-top: 6%;
}
	.videoheader {
    margin-top: 5%;
}
	.bloctxt {

		height: 51%;}
}

@media screen and (min-height:650px) and (max-width: 1150px) {

	.video_logo {
    display:inline-block;
	width: 13%;
}
	
}
@media screen and (min-height:800px) and (max-width: 1280px) {

	.menu_vid {
    bottom: 100px;
}
	.infomenuvid {
    bottom: 50px;
}
	.videoheader {
    margin-top: 8%;
}
}
@media screen and (min-height:900px) and (max-width: 1300px) {
	.videoheader {
 
    margin-top: 16%;
}
	.infomenuvid {
    bottom: 80px;
}
	.menu_vid {

    bottom: 150px;
    
}
	.blocvid {
		width: 80%;}
}
@media screen and (orientation:landscape) and (max-width: 1075px) {
.video_logo {
    display:none;

}	
.blocvid {
	width: 90%;
    margin-top: 6%;
}
	#slidebottom {
    max-width: 410px;
    margin-top: 3%;
}
	.bloctxt {

    bottom: 17%;
}
	.blocvid {
    margin-top: 4%;
}
	.bloclegend {

    font-size: 13px;
 
}
	.videoheader {
    margin-top: 3%;
}
	#section1_content {
width: 60%;
		left:20%;
    top: 10%;
}
	#section1_content h2 {
display:none;
}
	h1 {
    display:none;
}
	
	#logo {
		    width: 30%;
    margin-bottom: 5%;
}
}
@media screen and (min-height:550px) and (max-width: 1075px) {
	.bloctxt {
    height: 57%;
		bottom:23%;
}
	
}
@media screen and (min-height:650px) and (max-width: 1075px) {
	.bloctxt {
    height: 45%;
    bottom: 21%;
}
	#section1_content h2 {
display:block;
}
	h1 {
    display:block;
}
.videoheader {
    margin-top: 12%;
}
	.video_logo {
    display:inline-block;
	width: 13%;
}
	
}
@media screen and (orientation:landscape) and (max-width: 1000px) {
	.bloclegend{display:none}
	.videoheader {
    margin-top: 12%;
}
	.bloctxt {
  bottom: 27%;
    height: 43%;
   
}
}
@media screen and (orientation:landscape) and (max-width: 980px) {
	.txtanim {
 
    top: 8%;
  
}
	h4 {
		font-size: 37px;}
	
	h5 {
		font-size: 25px;}
	.logomin {
    width: 200px;
    margin-top: 20px;
    margin-bottom: 20px;
}
	h7 {
		font-size: 45px;}
	#titreslider{display:none}
	#slidecontainer {
		margin-top: 10%;}
}
@media screen and (orientation:landscape) and (max-width: 850px) {
	.txtanim {
   
    top: 8%;
   
}
	.logomin {
    width: 160px;
    margin-top: 20px;
    margin-bottom: 0px;
}
	#slidecontainer {
		margin-top: 5%;}
	.videoheader {
    margin-top: 5%;
}
	.bloctxt {
    height: 45%;
    bottom: 22%;
}
	.dirmain {
    width: 70px;
}
	#maingauche {
    background: url(maingauche.png) right top no-repeat;
		    background-size: contain;
	}
	
	#maindroite{
	background: url(maindroite.png) left top no-repeat;
		    background-size: contain;
}
	#maindroite:hover,#maindroite:focus{
	background:url("maindroitehover.png") left top no-repeat;
	background-size:contain;
}

.blocvid {
    margin-top: 4%;
	width:84%;
}
.videoheader {
    margin-top: 11%;
}
	@media screen and (min-width: 800px) and (max-height: 400px) {
		.videoheader {
    margin-top: 1%;
}
	}
.menu_vid {
    bottom: 20px;
}
#maingauche:hover,#maingauche:focus{
	background:url("maingauchehover.png") right top no-repeat;
	background-size:contain;
}
		#infobtdroit{display:none;visibility: hidden;width:0px;height:0px}
	#infobtgauche{display:none;visibility: hidden;width:0px;height:0px}
	.btmenu {
    width: 30px;
    vertical-align: top;
    height: 30px;
    
}
#section1_content {

    top: 13%;
}
	#section1_content p{display:none}
	#logo {
   width:46%;
}
	.textuel{display:none}
		#slidecontainer {
    margin-top: 8%;
}
}

@media screen and (orientation:landscape) and (max-width: 780px) {
	.txtanim {
    top: 9%;
}
	.logomin {
    width: 150px;
    margin-top: 10px;
    margin-bottom: 10px;
}
	h7 {
    font-size: 40px;
    line-height: 59px;
   
}
	h4 {
    font-size: 29px;
}
	.menu_vid {
    bottom: 30px;
}
	.videoheader {
    display: none;
}
	.blocvid {
    margin-top: 16%;
    width: 95%;
}
	.bloctxt{
		height: 65%;
    bottom: 26%;
	}
}
@media screen and (min-width:600px) and (max-height: 375px) {
	.menu_vid {
    bottom: 10px;
}
}
@media screen and (orientation:landscape) and (max-width: 650px) {
	.txtanim {
    top: 10%;
}
	h5 {
    font-size: 25px;
   
}
	.logomin {
    width: 150px;
    margin-top: 10px;
    margin-bottom: 10px;
}
	h7 {
    font-size: 40px;
    line-height: 59px;
   
}
	h4 {
    font-size: 29px;
}
	
	.rotatescroll {
    width: 150px;
    height: 150px;
	top:11%;
}
	.rotatescroll .viewport {

    background-size: 150px 150px;
 
}
	.rotatescroll .overlay {

    height: 150px;
    width: 150px;
}
	.sliderappear{animation:sliderappear150 0.5s 1.5s ease-in forwards}
	#slidebottom p{display:none}
	#slidecontainer {
    height: 100%;
    padding-top: inherit;
    padding-bottom:inherit;
   
}
	.rotatescroll .thumb {
		-moz-border-radius:50%;
  -webkit-border-radius:50%;
		border-radius:50%;
    background: url(img-show/bg-thumb2.png) no-repeat 50% 50%;
		border:1px solid #fff;

background-size:contain;
    width: 20px;

    height: 20px;
}

	.bloctxt{
		height: 60%;
    bottom: 30%;
	}
	#section1_content {

    top: 11%;
}
	#section1_content p{display:none}
	#logo {
   min-width: 130px;
}
	h6 {
    font-size: 23px;
    line-height: 38px;
}
	.bouton {
    width: 158px;
  
}
}
@media screen and (orientation:landscape) and (max-width: 580px) {
	.logomin {
    width: 130px;
    margin-top: 10px;
    margin-bottom: 10px;
}
	h4 {
    font-size: 30px;
}
	h5 {
		font-size: 25px;}
	h4 {
    font-size: 30px;
}
	#slidecontainer {
    margin-top: 0%;
}
	#sidepannel1-left{width:0px;}
	#sidepannel1-right{width:0px;}
	#sidepannel2-left{width:0px;}
	#sidepannel2-right{width:0px;}
	#sidepannel3-left{width:0px;}
	#sidepannel3-right{width:0px;}
	#sidepannel4-left{width:0px;}
	#sidepannel4-right{width:0px;}
	.ileft{display:none;}
	.iright{display:none;}
	.btmenu{display:none}
	.dirmain {
    position: absolute;
    
}
	#maindroite{
    
    right: 0px;
   
}
	#maingauche {
    
   left: 0px;
   
}
	.menu_vid {
    top: 45%;
}
	.blocvid {
    margin-top: 20%;
    width: 90%;
}
	.videocontent {
		width: 58%;}
}
@media screen and (orientation:landscape) and (max-width: 500px) {
	#logo {
   min-width: 110px;
}
	.bouton {
   width: 158px;
    margin-top: 0%;
}
	h6 {
    font-size: 20px;
    line-height: 33px;
}
}
@media screen and (orientation:portrait) and (max-width: 2000px) {
	.form-text {
    margin-bottom: 0px;
}
	.col-xs-12 {
   margin-top: 0px;
    min-width: 175px;
}
	.col-md-6 {
    padding-left: 10%;
    padding-right: 10%;
    width: 80%;
  
}
	.rightt {
    float: left;
}
	.infomenuvid {
		opacity:0;
		width:0px;
	}
	.test {
    line-height: normal;
    font-size: 40px;

}
	.bloctxt {
  
    width: 90%;
    left: 5%;
    height: 55%;
    position: absolute;
    bottom: 19%;
}
	#section1_content{
		width:80%;
		left:10%;
	}
	
	#sidepannel1-left{width:0px;}
	#sidepannel1-right{width:0px;}
	#sidepannel2-left{width:0px;}
	#sidepannel2-right{width:0px;}
	#sidepannel3-left{width:0px;}
	#sidepannel3-right{width:0px;}
	#sidepannel4-left{width:0px;}
	#sidepannel4-right{width:0px;}
	.ileft{display:none;}
	.iright{display:none;}
	.video_logo {
    width: 15%;

    margin-bottom: 10px;
    margin-top: 19%;
    display: inline-block;
}
	.blocvid {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 12%;
    height: auto;
}
	.menu_vid {
    width: 100%;
    position: fixed;
    z-index: 1;
    height: 40px;
    bottom: 40px;
    text-align: center;
}
	.videocontent {
    width: 60%;
  
}
}
@media screen and (orientation:portrait) and (max-width: 730px) {
	#slidetop {
    margin-top: 14%;
  
}
	#slidecontainer {

    margin-top: 13%;
    width: 100%;
  
}
	#slidebottom {

    margin-top: 11%;
  
}
	.videocontent {
    width: 80%;
    position: relative;
    display: inline-block;

    height: 100%;
}
	.video_logo {
    width: 8%;
 
    margin-bottom: 10px;
    margin-top: 9%;
    display: inline-block;
}
}

@media screen and (max-width: 800px) and (min-height: 1000px) {
	#slidetop {
    margin-top: 15%;
    margin-bottom: 2%;
}
	#section-section5 h2 {
    font-size: 46px;
    line-height: normal;
   
}
	#section-section5 h3 {
    font-size: 50px;

    line-height: normal;
    
}
	#slidecontainer {
    margin-left: auto;
    margin-right: auto;
    margin-top: 12%;
    width: 100%;
    position: relative;
}
	#slidebottom {
    max-width: 400px;
    margin-top: 13%;
 
    position: relative;
    margin-left: auto;
    margin-right: auto;
}
	.txtanim {
  
    top: 20%;
  
}
	.vertigliss {

    width: 90%;
  
}
	.rockstar {
    height: auto;
    width: 80%;
		max-width:780px;
}
	.legendanim {

    bottom: 0%;

}
	.textuel {
  
    font-size: 20px;
   
}
	.menu_other {
    top: inherit;
    bottom: 14%;
 
}
	
	.rockstar2 {
    height: auto;
    width: 80%;
		max-width:780px;
}
		h1 {
		font-size: 100px;margin-bottom: 70px;}
	p {
	font-size: 19px;
    display:block;
  
}
	
	#logo {
    min-width: 188px;
    width: 35%;
    max-width: 317px;
    margin-right: auto;
    margin-left: auto;
    height: 55%;
    text-align: center;
    margin-bottom: 9%;
}
	.videocontent {
    width: 90%;
}
	.menu_vid {
    width: 100%;
    position: fixed;
    z-index: 1;
    height: 40px;
    bottom: 80px;
    text-align: center;
}
	.bloclegend {
  
    font-size: 20px;
  
}
	.video_logo {
    width: 10%;

    margin-bottom: 10px;
    margin-top: 4%;
    display: inline-block;
}
}

@media screen and (orientation:portrait) and (max-width: 670px) {
	h4 {
		font-size: 30px;}
	.txtanim {
   
    top: 8%;
   
}
	h7 {
		font-size: 43px;}
	.video_title {
    margin-top: 0%;
}
	.bloctxt {

    width: 80%;
    left: 10%;
    height: 44%;
    position: absolute;
    bottom: 24%;
}
.menu_vid {
    width: 100%;
    position: fixed;
    z-index: 1;
    height: 40px;
    bottom: 10%;
    text-align: center;
}
	.video_logo {
    width: 8%;
 
    margin-bottom: 10px;
    margin-top: 9%;
    display: inline-block;
}
h2 {
    font-size: 28px;
 
}	
h3 {
    font-size: 34px;
  
}
	.vertigliss {

    width: 90%;
  
}
	.rockstar {
    height: auto;
    width: 100%;
		max-width:780px;
}
	.legendanim {

    bottom: 4%;

}
	
.legendanim {
 
    width: 90%;
}
	.textuel {
  
    font-size: 16px;
   
}
	.menu_other {
    top: inherit;
    bottom: 2%;
 
}
	
	.rockstar2 {
    height: auto;
    width: 100%;
		max-width:780px;
}
	.blocvid {
    width: 80%;
        margin-top: 6%;
}
	.bloclegend {

    font-size: 13px;
    
}
}
@media screen and (max-width: 800px) and (min-height: 1200px) {
.test {
    line-height: normal;
    font-size: 40px;

}
	.videocontent {
    width: 90%;
}
	.menu_vid {
    width: 100%;
    position: fixed;
    z-index: 1;
    height: 100px;
    bottom: 8%;
    text-align: center;
}
	.dirmain {
    width: 130px;
    height: 50px;
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
    background-size: contain;
}
	.blocvid {
    width: 100%;
  
}
	.btmenu {
    width: 50px;
    vertical-align: top;
    height: 50px;
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
    background-color: #a0adaa;
		-moz-border-radius:5px;
  -webkit-border-radius:5px;
    border-radius: 5px;
}
	.bloclegend {
  
    font-size: 20px;
  
}
	h2 {
    font-size: 55px;
  
}
	h2 {
    font-size: 68px;
  
}
	.video_logo {
    width: 13%;

    margin-bottom: 10px;
    margin-top: 10%;
    display: inline-block;
}
}
@media screen and (max-width: 1100px) and (min-height: 1200px) {
	#slidebottom {
    max-width: 500px;
    margin-top: 9%;

}
	#slidetop {
    margin-top: 16%;
    margin-bottom: 2%;
}
	#slidecontainer {
  
    margin-top: 13%;
  
}
	#section-section5 h3 {
    font-size: 58px;

    line-height: normal;
  
}
	#section-section5 h2 {
    font-size: 51px;

    line-height: normal;
    
}
	h4 {
		font-size: 60px;}
	
	h7 {
		font-size: 65px;}
	.video_title {
    margin-top: 0%;
}
	.vertigliss {

    width: 90%;
  
}
	.rockstar {
    height: auto;
    width: 100%;
		max-width:780px;
}
	.legendanim {

    bottom: 2%;

}
	.textuel {
  
    font-size: 25px;
   
}
	.menu_other {
    top: inherit;
    bottom: 14%;
 
}
	
	.rockstar2 {
    height: auto;
    width: 100%;
		max-width:780px;
}
	.test {
    line-height: normal;
    font-size: 50px;

}
	.bloctxt {

    width: 90%;
    left: 5%;
    height: 45%;
    position: absolute;
    bottom: 19%;
}
	h1 {
		font-size: 135px;margin-bottom: 70px;}
	p {
	font-size: 25px;
    display:block;
  
}
	h6 {
    font-size: 45px;
    font-weight: 100;
    line-height: 50px;
    margin: 0;
    padding: 13px;
    color: #F3EED0;
    font-family: 'KenyanCoffeeRg';
}
	.bouton {
    background-color: #bc8f8f;
		-moz-border-radius:50px;
  -webkit-border-radius:50px;
    border-radius: 50px;
		
    width: 270px;
    cursor: pointer;
    margin-left: auto;
    position: relative;
    margin-right: auto;
    margin-top: 10%;
    transition: background-color 0.3s ease-in;
}
	#logo {
    min-width: 188px;
    width: 40%;
    max-width: 317px;
    margin-right: auto;
    margin-left: auto;
    height: 55%;
    text-align: center;
    margin-bottom: 9%;
}
	.menu_vid {
    width: 100%;
    position: fixed;
    z-index: 1;
    height: 60px;
    bottom: 10%;
    text-align: center;
}
	.dirmain {
    width: 150px;
    height: 60px;
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
    background-size: contain;
}
	.btmenu {
    width: 60px;
  
    height: 60px;
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
    background-color: #a0adaa;
		-moz-border-radius:5px;
  -webkit-border-radius:5px;
    border-radius: 5px;
}
	.video_logo {
    width: 17%;
   
    margin-bottom: 29px;
    margin-top: 12%;
    display: inline-block;
}
	h2 {
    font-size: 56px;
   
}
	#section1_content h2 {
    font-family: 'KenyanCoffeeRg';
    line-height: 0px;
    font-size: 54px;
    margin-top: 17%;
    margin-bottom: 40px;
    color: #79A7AA;
}
	h3 {
    font-size: 68px;
  
}
	.videocontent {
    width: 70%;
}
	.blocvid {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 8%;
    height: auto;
}
	.bloclegend {
    width: 100%;
    margin-top: 3%;
    font-family: 'Vollkorn', serif;
    font-size: 26px;
    color: #987956;
    line-height: normal;
}
}
@media screen and (orientation:portrait) and (max-width: 510px) {
	.bloctxt {
  
    width: 90%;
    left: 5%;
    height: 49%;
    position: absolute;
    bottom: 21%;
}
	.test {
    line-height: normal;
    font-size: 32px;
}
	.video_title{margin-top:10%}
	.video_logo {

    display: none;
}
	.videocontent {
		width: 94%;}
	#titreslider{display:none;}
	#slidecontainer {
width:100%;
    margin-top: 26%;
  
}
	#slidebottom {
 
    margin-top: 13%;
 
}
	.rotatescroll {
    width: 250px;
    height: 250px;
	top:11%;
}
	.rotatescroll .viewport {

    background-size: 250px 250px;
 
}
	.rotatescroll .overlay {

    height: 250px;
    width: 250px;
}
	.sliderappear{animation:sliderappear250 0.5s 1.5s ease-in forwards}
	.rotatescroll .thumb {
		-moz-border-radius:50%;
  -webkit-border-radius:50%;
		border-radius:50%;
    background: url(img-show/bg-thumb2.png) no-repeat 50% 50%;
		border:1px solid #fff;

background-size:contain;
    width: 30px;

    height: 30px;
}
}
@media screen and (max-width: 600px) and (min-height: 740px) {
	.video_title {
    margin-top: 3%;
}
	.video_logo {
    width: 15%;
  
    margin-bottom: 10px;
    margin-top: 9%;
    display: inline-block;
}
	.menu_vid {

    bottom: 10%;
  
}
	.bloclegend {
    font-size: 15px;
}
	h2 {
    font-size: 34px;
}
	#section1_content h2 {
    font-family: 'KenyanCoffeeRg';
    line-height: 0px;
    font-size: 43px;
    margin-top: 12%;
    margin-bottom: 33px;
    color: #79A7AA;
}
	h3 {
    font-size: 43px;
}
}
@media screen and (orientation:portrait) and (max-width: 450px) {
.video_logo {
    width: 8%;
   
    margin-bottom: 0px;
    margin-top: 5%;
    display: inline-block;
}
	.video_title {
    margin-top: 12%;
}
	.menu_vid {
    width: 100%;
    position: fixed;
    z-index: 1;
    height: 40px;
    bottom: 22px;
    text-align: center;
}
	.dirmain {
    width: 80px;
    height: 30px;
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px;
    background-size: contain;
}
	.btmenu {
    width: 30px;
    vertical-align: top;
    height: 30px;
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px;
    background-color: #a0adaa;
		-moz-border-radius:5px;
  -webkit-border-radius:5px;
    border-radius: 5px;
}
}
@media screen and (max-width: 450px) and (min-height: 700px) {
	.video_logo {
    width: 15%;

    display: inline-block;
}
	.video_title {
    margin-top: 6%;
}
	.bloclegend {
    display:block;
    font-size: 14px;
   
}
	.menu_vid {

    bottom: 60px;
    
}
}
@media screen and (max-width: 450px) and (min-height: 600px) {
	.video_logo {
    width: 15%;

    display: inline-block;
}
	.video_title {
    margin-top: 6%;
}
	.bloclegend {
    display:block;
    font-size: 14px;
   
}
	.menu_vid {

    bottom: 60px;
    
}
}
@media screen and (max-width: 450px) and (min-height: 500px) {
	.video_title {
    margin-top: 2%;
}
}
@media screen and (max-width: 360px) and (min-height: 481px) {
	#titreslider{display:none;}
	#slidecontainer {
width:90%;
    margin-top: 22%;
  
}
	#slidebottom {
 
    margin-top: 13%;
 
}
	.rotatescroll {
    width: 250px;
    height: 250px;
	top:11%;
}
	.rotatescroll .viewport {

    background-size: 250px 250px;
 
}
	.rotatescroll .overlay {

    height: 250px;
    width: 250px;
}
	.sliderappear{animation:sliderappear250 0.5s 1.5s ease-in forwards}
	.rotatescroll .thumb {
		-moz-border-radius:50%;
  -webkit-border-radius:50%;
		border-radius:50%;
    background: url(img-show/bg-thumb2.png) no-repeat 50% 50%;
		border:1px solid #fff;

background-size:contain;
    width: 30px;

    height: 30px;
}
	h4 {
		font-size: 34px;}
	.txtanim {
   
    top: 8%;
   
}
	h7 {
		font-size: 43px;}
	.video_title {
    margin-top: 0%;
}
	h1{
		font-size: 65px;
	}
	.video_logo {
    width: 13%;
margin-top:5%;
		margin-bottom:3px;
    display: inline-block;
}
	.bloclegend {
    display:block;
    font-size: 13px;
   
}
	.menu_other {
		top:inherit;
    bottom: 1%;
  
}
	.rockstar {
    height: auto;
    width: 100%;
}
	.logomin {
    width: 200px;
    margin-top: 10px;
    margin-bottom: 10px;
}
	.legendanim {
bottom: 30px;
    width: 90%;
}
	.textuel {

    font-size: 14px;
  
}
	.rockstar2 {
    height: auto;
    width: 100%;
}
	.vertigliss {

    width: 90%;
  
}

}

@media screen and (orientation:portrait) and (max-height: 740px) {
	#section1_content {
 
    top: 14%;
}
	p{display:none}
	.textuel{display:block}
}


@media screen and (max-width: 360px) and (max-height: 480px) {
	#section1_content {
    top: 6%;
}
	.logomin {
    width: 150px;
    margin-top: 20px;
    margin-bottom: 0px;
}
		.video_title {
    margin-top: 9%;
}
	h1{
		font-size: 65px;
	}
	.video_logo {
    width: 13%;
margin-top:5%;
		margin-bottom:3px;
    display: none;
}
	.bloclegend {
    display:block;
    font-size: 13px;
   
}
	.menu_other {
		top:inherit;
    bottom: 1%;
  
}
	.rockstar {
    height: auto;
    width: 100%;
}
	.legendanim {
bottom: 45px;
    width: 90%;
}
	.textuel {

    font-size: 15px;
  
}
	.rockstar2 {
    height: auto;
    width: 100%;
}
	.vertigliss {

    width: 90%;
  
}
	.textuel{display:none}	
}

@media screen and (max-width: 360px) and (max-height: 460px) {
	#section1_content {
    top: 6%;
}
	.bloclegend {
    display: none;
	}
	.video_title {
    margin-top: 16%;
}
	.menu_vid {

    bottom: 53px;

}
}