@charset "UTF-8";

@font-face {
 font-family: "Alex";
 src: url("/fonts/Alex.woff2") format("woff2"),
	 url("/fonts/Alex.ttf") format("truetype"),
        url("/fonts/Alex.woff") format("woff");
}
div::-webkit-scrollbar {
  display: none;
}


div {
  -ms-overflow-style: none;  
  scrollbar-width: none;  
}

* {
    position: relative;
    box-sizing: border-box;
    -webkit-user-drag: none;
 
  
    -webkit-overflow-scrolling: touch;


}
html,body {
	
overflow: hidden;
height:100%;
padding:0;
	margin:0;
}


.orientationlock, .orientationlockload{visibility: hidden}
.credit{
	max-width: 90%;
	padding-left:15px;
	padding-right:15px;
	width: 100%;
	text-align:center;
	display: inline-block;
	
}
.orientcontainer img{object-fit: contain;
    width: 100%;
    height: 100%;}
.orientcontainer{
	text-align: center;
	position: relative;
   
    height: 50%;
    padding-top: 50px;
    width: 100%;
}
.orientcontainer span{
	 font-weight: bold;
  word-spacing: 3px;
font-family: 'Reem Kufi', sans-serif;
    font-size: 16px;
    line-height: normal;
    	color:#fff;
	text-transform: uppercase
}
.btnpoitndevente{
	
	width: 100px;
    background-color: #b78d15;
    height: 100px;
   display: inline-block;
    border-radius: 50%;
    text-align: center;
	background-image: url("lingone-point-vente.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 70%;
	    border: 3px solid #fff;
}
.cont-credits{top: 50%;
    position: absolute;
	text-align: center;
    transform: translatey(-50%);
    max-height: 100%;
    overflow-x: hidden;}
.separator{margin-top:5px;margin-bottom:5px;width:60%;height:2px;border-radius: 50%;background:#fff;position: relative;display: inline-block}
.social img{width:50px}
.social{margin-left:20px;margin-right:20px}
.creditp{
	color:#fff;
	font-size: 16px;
	margin-top:0;
	font-weight: normal;
}
.creditp2{
	color:#ACACAC;
	    margin-bottom: 7px;
    margin-top: 0;
	font-size: 14px;
	font-weight: normal;
}

.credit a img{cursor:pointer}
.credit a {cursor:pointer}


.seculayer{position:fixed;width:100%;height: 100%;background-color: rgba(0,0,0,0.7);z-index: 1250;display: none}
.soncontrol{z-index:1000;position:fixed;left:0px;top:0px;height:75px;width:75px;border-radius:0 0 50% 0;background-color: rgba(0,0,0,0.5);display: none}
.rondson{height:60px;width: 60px;border-radius:50%; position: absolute;left:5px;top:5px;background:#055556 no-repeat center center;background-size: 60%;border:2px #b78d15 solid}
.rondsonon{background-image: url("son-on.png");}
.rondsonoff{background-image: url("son-off.png");}
.panelopen{right:0px;transition: right 1s ease-out}
.panelclose{right:-270px;transition: right 1s ease-out}
.menupanel{width:280px;max-width: 90%; background-color: rgba(0,0,0,0.7);position: fixed;height: 100%;z-index:1500}
.contpanel{height:100%;width:100%;position: absolute;display: none}
.contmenu{text-align:center}
.contcredit{}
.conticon{width:70px;height:70px;border-radius:50% 0 0 50%;background-color: rgba(0,0,0,0.5);position: absolute;left:-70px;top:20px;}
.rondicon{cursor: pointer;height:60px;width: 60px;border-radius:50%;background-color: #055556; position: absolute;left:5px;top:5px;}
.rondicon:hover{border:2px #b78d15 solid}
.closepanel{height:60px;width: 60px;border-radius:50%;background-color: #338e94;position: absolute;left:5px;top:5px;background-image: url("close-lingone.png")!important}
.selecticon{background-color:orange}
.secondicon{top:100px;}
.lingoneicon{background-image: url("menu-lingone.png");background-size: 100%;background-position: center center;background-repeat: no-repeat}
.designicon{background-image: url("credits-lingone.png");background-size: 100%;background-position: center center;background-repeat: no-repeat}
.iconbtn{    display: block;
    width: 40px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;}
.zsurlucioles{z-index:100 !important}
.lumieres{width: 100%;
    position: fixed;
    left: 0px;
    z-index: 50;}
/*CUSTOM SCROLL */
.indic-touch {
    width: 70px;
    position: fixed;
    z-index: 10000000;
    height: 160px;
    top: 55px;
  left: -20px;
	visibility: visible;
	display: none;
    opacity: 1;
    transition: opacity 0.5s ease;
    text-align: center;
    background-image: url(touch.gif);
    background-repeat: no-repeat;
    background-position: center top;
}




/**/
.menu-final{border-left:none !important;border-radius: 0 20px 0 0 !important}
.visionneuse{
    border-radius: 25% 25% 0 0;
    margin-right: 2px;
    vertical-align: bottom;
    margin-left: 2px;
    
    width: 70px;
    height: 70px !important;
 
}
.text-para{
	direction: rtl;
	word-spacing: 3px;
	font-family: 'Reem Kufi', sans-serif;
padding :10px;
	 
    position: relative;
    margin-left: auto;
    margin-right: auto;
 color:#fff;
    text-align: left;
    display: flex;
    height: 100%;
    max-width: 400px;
    align-items: center;
    justify-content: center;
  
    flex-wrap: nowrap;
    align-content: space-between;

}
.scrollp{word-spacing: 3px;max-width: 100%;direction: ltr;
	font-family: 'Reem Kufi', sans-serif;

 color:#fff;
    font-weight: normal;
}
#section1_content{text-align: center}
.btnlight{
	background-color:#338e94 !important
}
.btncredit{
	font-size: 14px;
    text-align: center;
	margin-top: 7px !important;
    margin-bottom: 7px;
	letter-spacing: 3px !important;
}
.secondarybtn{
	cursor: pointer;
   letter-spacing: 6px;
    text-transform: uppercase;
    font-weight: 400;
    background: #055556;
    color: #fff;
    /* box-sizing: content-box; */
    padding: 10px;
	padding-right : 30px;
	padding-left: 30px;
	font-family: 'Reem Kufi', sans-serif;
    border-radius: 30px;
    width: fit-content;
    display: inline-block;
    margin-top: 15px;
	margin-left:20px;
	margin-right:20px
  
}
.mentionsbtn{
	cursor: pointer;
	right: 20px;
    position: absolute;
    padding: 3px;
}
.mentionsbtn a{
	   letter-spacing: 2px;
   text-decoration: none;
    font-weight: 400;
 
    color: #53ada0;

	font-family: 'Reem Kufi', sans-serif;
}
.mentionsbtn a:hover{

   text-decoration: underline;
 
 
    color: #53ada0;

}
.mentionsbtn a:focus, .mentionsbtn a:visited{

   text-decoration: none;
 
 
    color: #53ada0;

}
.nbr{width: 120px;
    margin-top: 25px;
    position: absolute;
    margin-left: -60px;
    z-index: 20000;}
.story-para{height: 100%;
  
    max-height: 450px;display: flex; 
    top: 50%;
	left:50%;
    position: absolute;
    transform: translate(-50%,-50%);}

.btndisabled{pointer-events: none}
.btn1disabled{pointer-events: none !important;opacity: 0.5 !important}
.loader {
  color: #575444;
  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;
}
.stage{   top: 30px;
    left: 18px;
    position: absolute;}
@-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;
 
  


}
@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  to {
    -ms-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -webkit-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    transform: rotate(10deg);
  }
}
.finalscreen{height:100%;width:100%;position: absolute;display: none;z-index:100}
.seculayer2{background-color: rgba(5,35,40,0.60);height:100%;width:100%;position: absolute;z-index:40}
.pack{z-index:200 ;height: calc(100% - 120px);width:100%;position: absolute;text-align: center;}


.pack .conticon {
   
    height: auto;
   
    position: relative;
    left:auto;
    top: auto;
}
.paddingp{padding-right: 50px;
    padding-left: 50px;}
.paddings{padding-left: 10px;
   }
.infoorient{
	display: inline-block;
	font-weight: normal;
	margin-bottom:0px;
    word-spacing: 3px;
    font-family: 'Reem Kufi', sans-serif;
    font-size: 16px;
    line-height: normal;
    color: white;
}
.countdown{color:#fff;display: inline-block}
.pack span {
    font-weight: bold;
  word-spacing: 3px;
font-family: 'Reem Kufi', sans-serif;
    font-size: 16px;
    line-height: normal;
    	color:#fff;
    display: block
}
.pfinal{padding-left:5px;padding-right: 5px;margin-top:10px;margin-bottom: 10px; 
    display: block}
.pack .secondarybtn{background-color:#b78d15;font-weight: normal;word-spacing: normal }
.pack2{    position: absolute;
    max-height: 100%;
    min-width: 100%;
   padding-left: 10px;
    padding-right: 10px;
    top: 50%;
  
    left: 50%;
    transform: translate(-50%,-50%);
}
.pack img{max-width: 300px;
    width: 64%;
    padding-top: 20px;}
.finalillu{height:100%}
.finalillu img{height:100%}
.illulingone{top:50%;position: relative}
.rotating{-webkit-animation: rotating 20s ease-in-out infinite alternate ;

  -moz-animation: rotating 30s ease-in-out infinite alternate;
  -ms-animation: rotating 30s ease-in-out infinite alternate;
  -o-animation: rotating 30s ease-in-out infinite alternate;
  animation: rotating 30s ease-in-out infinite alternate;}
.illulingone img{max-width: 80%;
    position: absolute;
    top: 50%;
    left: 50%;
	transform: translate(-50%, -50%);}
#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;
}
.infomenuvid {
    width: 100%;
    height: 25px;
    position: fixed;
    text-align: center;
 
    color: #fff;
    font-size: 20px;
    font-weight: 100;
    bottom: 30px;
   display: none;
    bottom: 0px;
    margin: 0;
    padding: 4px;
    font-family: 'KenyanCoffeeRg';
}
#fondinfos{
	  width: 100%;
    height: 35px;
    bottom: 0px;
	z-index:120;
    position: fixed;
    background-color: #025456;
}
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;
}
.dirmain.initialprev {border-radius:20px 0 0 0}
.dirmain.initialnext {border-radius:0 20px 0 0}
.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;
}
.stricthide{
	opacity: 0 !important;
    visibility: visible !important;
}
h4{
	font-size: 45px;
	font-weight: 100;
    line-height:normal;
    margin: 0;
	display:inline;
    padding: 0;
    color: #79A7AA;
    font-family: 'KenyanCoffeeRg';
}
.cd-transition-layer{position: fixed!important}
.cd-modal{position: fixed !important}
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;
}
.menu-princ{    position: fixed;
    right: 0px;
	z-index: 2000;
    height: 50px;}
.vpict{
	background-image: url("afficher-texte.png");
		background-repeat: no-repeat;
	background-position: center center;
	background-size: contain
}
.vtext{
	background-image: url("afficher-image.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain
}
.btmenu {
  
    text-align: center;
    vertical-align: bottom;
    height: 100%;
    min-width: 50px;
    border: 2px #b78d15 solid;
    cursor: pointer;
    display: inline-block;
    background-color: #025456;
}
.btmenu img{
	max-height:40px;margin-top:5px;
}
.btmenu:hover{
cursor:pointer;
	background-color:#b78d15;

}
.dirmain{
	width:100px;
	height:100%;
	display:inline-block;

	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;
}


.content{
	overflow: auto;
	position: relative;
	padding: 20px;
	background: #333;
	margin: 10px;
	width: 740px;
	max-width: 97%;
	height: 400px;
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}


.bloctxt{

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

    position: absolute;
    bottom: 190px;

}

.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%;
  
}


.slidecontent{
	display:none;
	width:70%;position:relative;margin-left:15%;vertical-align: bottom;
}


.video_logo{
	  width: 9%;

    margin-bottom: 10px;
	    margin-top: 7%;
    display: inline-block;
   
}
.video_logo img{
	  width:100%;
}
.premiereillu{
	width: 100%;
	height: 100%;
		min-width: 100%;
	transition: opacity 1s;
	position: absolute;
	text-align: center;
	
}
.premiereillu img{
object-fit: contain;
	width: 100%;
	max-height: 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;
	
}
.nbrshow{opacity:1; transition: opacity 1s ease}
.nbrhide{opacity:0; transition: opacity 1s ease}
.fond0{background:url("lingone-0.png") no-repeat center center /cover;width:100%;height:100%;position:absolute;}
.fond1{background:url("lingone-1.png") no-repeat center center /cover;width:100%;height:100%;position:absolute;}
.fond2{background:url("lingone-2.png") no-repeat center center /cover;width:100%;height:100%;position:absolute;}
.fond3{background:url("lingone-3.png") no-repeat center center /cover;width:100%;height:100%;position:absolute;}
.fond4{background:url("lingone-4.png") no-repeat center center /cover;width:100%;height:100%;position:absolute;}
.fond5{background:url("lingone-5.png") no-repeat center center /cover;width:100%;height:100%;position:absolute;}
.fond6{background:url("lingone-6.png") no-repeat center center /cover;width:100%;height:100%;position:absolute;}
.fond7{background:url("lingone-7.png") no-repeat center center /cover;width:100%;height:100%;position:absolute;}
.fond8{background:url("lingone-8.png") no-repeat center center /cover;width:100%;height:100%;position:absolute;}
.fond9{background:url("lingone-9.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: #055556;
    font-family: 'Reem Kufi', sans-serif;
    font-weight: normal;
    line-height: 80px;
     margin-bottom: 40px;
	    margin-top: 0;
}
h2{font-size: 40px;
    color: #b78d15;
	word-spacing: 4px;
    font-family: 'Reem Kufi', sans-serif;
    font-weight: normal;
	margin-top:10px;
    /* line-height: 80px; */
    margin-bottom: 0px;
    line-height: 0.4em;}
p{
    font-weight: bold;
  word-spacing: 3px;
font-family: 'Reem Kufi', sans-serif;
    font-size: 19px;
    line-height: normal;
    	color:#055556;

}
#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;
}
.illushow{opacity: 1;left: 0px; transition: none}
.illuhide{opacity: 1;left: 0px; transition: none}
.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 {

}
.loadillu{height:3px;width: 100%;background-color:black}
.loadilluinner{height:3px;width: 100%;background-color:#b78d15; }
.container-chapitre{z-index:10;width:70%;position: relative;margin-left:15%;height:100%}
.boite-illu{ width:100%;height:100%;  position: relative;display: inline-block;float: left}
.boite-texte{ width:0%;height:100%;position: relative;display: inline-block;float: left}
.minimillu{width:50%}
.minimtxt{width:50%}
.maximillu{width:100%}
.maximtxt{width:0%}

.animloadingline{animation: loadingline 8s;}
.animresizeillu{animation: resizeillu 3s;}
.animresizetext{animation: resizetext 3s;}
.reverseresizeillu{animation: deresizeillu 3s;}
.reverseresizetext{animation: deresizetext 3s;}


@keyframes loadingline {
  from {width: 0%;}
  to {width: 100%;}
}
@keyframes resizeillu {
  from {width: 100%;}
  to {width: 50%;}
}

@keyframes resizetext {
  from {width: 0%;}
  to {width: 50%;}
}
@keyframes deresizeillu {
  from {width: 50%;}
  to {width: 100%;}
}

@keyframes deresizetext {
  from {width: 50%;}
  to {width: 0%;}
}
@keyframes resizeillum {
  from {width: 100%;}
  to {width: 0%;}
}

@keyframes resizetextm {
  from {width: 0%;}
  to {width: 100%;}
}
@keyframes deresizeillum {
  from {width: 0%;}
  to {width: 100%;}
}

@keyframes deresizetextm {
  from {width: 100%;}
  to {width: 0%;}
}
.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 {
    bottom: 57px;
    position: fixed;
	height: 50px;
   
   z-index:1000;
    width: 100%;
    text-align: center;
}


.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%;
}

.novideo{
	position:relative;

	display:none;
}
#wait{
	    background: #FFFEF1 url(folklore-champenois.jpg) repeat;
    position : fixed; height:100vh; width:100%; z-index:2000
}
#section1_content{
	width:40%;left:30%;position:absolute;top:5%;z-index: 100;
}
#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; }
.dirmain img{    width: 64px;
    margin: 10px;
   }
.dirmain.initialprev img{ transform: rotate(180deg);}
.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;
}
.blue{color:#025456 !important}
.majority{
	background-image:url("folklore-champenois.jpg");
	background-repeat:repeat;

		background-color: #ede6d8;
	position: fixed;
	height: 100%;
	width: 100%;
	z-index: 100000000;
	
}
.orientationlock{
	
	background-color: #025456;
	position: fixed;
	height: 100%;
	width: 100%;
	z-index: 1000000000;
}
.orientationlockload{
	
	background-color: #025456;
	position: fixed;
	height: 100%;
	width: 100%;
	z-index: 1000000000;
}
.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 (max-width: 1024px) {
	.illulingone img{max-width: inherit;
}
	.illushow{opacity: 1;left: 0px; transition: opacity 1s ease, left 1s ease}
.illuhide{opacity: 0;left: -300px; transition: opacity 1s ease, left 1s ease}
	.story-para{
  height:inherit;
    max-height: 400px;
    overflow: scroll;
		max-width: 90%;

    
}
	.mCSB_inside>.mCSB_container {
    margin-right: 50px !important;
}
	.indic-touch{
	top: 25px;
    left: auto;
    right: -10px;
}
	.text-para {
		max-width:100%;
	direction:ltr;
text-align: right;
     padding-right: inherit;
		 padding-left: inherit;
		padding-top:0px;
    align-items:flex-start; 
   
}
	.container-chapitre{margin-left:inherit;width: 100%}
.animresizeillu{animation: resizeillum 3s;}
.animresizetext{animation: resizetextm 3s;}
	.reverseresizeillu{animation: deresizeillum 3s;}
.reverseresizetext{animation: deresizetextm 3s;}
	.minimillu{width:0%}
.minimtxt{width:100%}
	.maximillu{width:100%}
.maximtxt{width:0%}
}



@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%;
}
	
	
	
	.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 h3 {
    font-size: 30px;
   
    
    line-height: 66px;
  
}
	#slidebottom {
   
		margin-top: 2%;}
	
	
	h3 {
		font-size: 36px;}
	
	
	
	
	.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;
    
}
	
	
	
}

@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) {

	
	
	
	
	.videoheader {
    margin-top: 8%;
}
}
@media screen and (min-height:900px) and (max-width: 1300px) {
	.videoheader {
 
    margin-top: 16%;
}
	
	
	
	
	.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%;
}
	
	
	
	
}
@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%;
}
	
	
.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%;
}
	}

	
#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 {

    vertical-align: top;
   
    
}
#section1_content {

    top: 13%;
}
	
	#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;
}
	
	
	.videoheader {
    display: none;
}
	.blocvid {
    margin-top: 16%;
    width: 95%;
}
	.bloctxt{
		height: 65%;
    bottom: 26%;
	}
}
@media screen and (max-height: 720px) {
	
	.iconbtn{display: none}
}
@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%;
}
	
	#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;
   
}
	
	
	.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;
}
	
	
	.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;
}
	
	
	.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%;
}
	
	#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;
}
		
	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;
   
}
	.videocontent {
    width: 90%;
}
	
	.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%;
}

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

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%;
}
	
	
	.dirmain {
    width: 130px;
    height: 50px;
    display: inline-block;
 
		
    background-size: contain;
}
	.blocvid {
    width: 100%;
  
}
	.btmenu {

		
    vertical-align: top;

    display: inline-block;
 
   
	
		
}
	.bloclegend {
  
    font-size: 20px;
  
}

	
	.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;
  
}
	
	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%;
}
	
	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;
   
}
	
	
	.dirmain {
    width: 150px;
    height: 60px;
    display: inline-block;

    background-size: contain;
}
	.btmenu {

		
    display: inline-block;

		
 

}
	.video_logo {
    width: 17%;
   
    margin-bottom: 29px;
    margin-top: 12%;
    display: inline-block;
}
	
	.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;
}
	
	
	.bloclegend {
    font-size: 15px;
}
	
}
@media screen and (orientation:portrait) and (max-width: 420px) {


 .indic-touch {
    right: -10px;
    left: auto;
    top: 80px;
   
}
	.text-para {
   
}
	.story-para {
   padding-top: 55px;
}
	

}
@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;
   
}
	
	
}
@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;
   
}
	
	
}
@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%;
}
	
	.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 (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%;
}
	
	.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%;
}
	
	
}
