body{
    position:absolute;
    left:0;
    right:0;
    width:100%;
    overflow:hidden;

    font-size:15px;
    font-weight:300;

    background:black center/cover no-repeat;
}

*{
    box-sizing:border-box;
}

.containerbis{
    position:relative;
    top:0;
    left:0;
    right:0;
    clear:both;
    width:100%;
    margin:0;
}

.clr{
    clear:both;
    height:0;
    margin:0;
    padding:0;
}

.main{
    position:relative;
    width:90%;
    margin:0 auto;
}

.container > header,
#section-1{
    position:relative;
    width:100%;
    height:auto;
}

#menu{
    position:relative;
    left:0;
    right:0;
    width:100%;

    margin-top:10px;

    color:#fff;
    background:transparent;
    z-index:99999;
}

#menu.fixed{
    position:fixed;
}

.nav{
    position:fixed;

    width:100%;
    margin:0;
    padding:10px 10px 0 0;

    text-align:right;
    list-style:none;

    animation:slide-in 2s forwards;
}

@keyframes slide-in{
    from{
        left:-100%;
    }

    to{
        left:calc(100% - 20px);
        translate:-100%;
    }
}

.nav li{
    position:relative;
    display:inline;
    list-style:none;
}

.nav li a{
    display:inline-block;

    min-width:3em;

    color:#fff;
    text-align:center;
    white-space:nowrap;

    font-family:'helvetica_now_text_black','Raleway',sans-serif;
    font-size:24px;

    opacity:1;
    transform:scale(.8);
    transition:.3s;

    -webkit-text-stroke:.8px black;
}

.nav li a:hover{
    color:#fff;
    opacity:.5;
    transform:scale(1.2);
}

.nav li ul{
    display:none;
}

.nav li:hover ul{
    position:absolute;
    top:100%;
    right:0;

    display:block;
    z-index:99999;
}

.navbar-default{
    background:transparent;
}

.navbar-brand,
.navbar-default .navbar-nav > li > a{
    color:#777;
}

.fa-arrow-circle-up{
    color:#7a6d58;
}

.fa-arrow-circle-up:hover{
    color:#aba69c;
}

.conteneur{
    position:absolute;

    width:100%;
    min-height:100vh;

    color:#000;
    background:#fff;
}

.jefferson{
    display:block;

    width:80%;
    margin:1em auto 0;

    background:transparent;
}

.video-container{
    position:relative;

    margin:1em 0 0;
    padding-bottom:56.25%;
}

.video-container iframe{
    position:absolute;
    inset:0;

    width:100%;
    height:100%;
}

.kern{
    position:relative;

    display:block;

    width:70%;
    height:100%;
    margin:auto;

    overflow:hidden;
    vertical-align:middle;

    border:none;
}

.haut{
    margin:80px 0;
}

.vimeo_slider{
    display:flex;

    width:80%;
    min-height:100vh;
    margin:0 auto;
}

.iframeContainer{
    position:relative;
    flex:1;

    padding-top:56.25%;

    background:#cbb2a3;
}

#vimeo_slider{
    position:absolute;
    inset:0;

    width:100%;
    height:100%;
}


.responsive{
    width:100%;
    height:auto;
}

.space{
    margin-bottom:10px;
}

.video-responsive{
    position:relative;
    display:block;
    overflow:hidden;

    min-width:60%;
    margin:auto;
}

.video-responsive iframe{
    display:block;
    width:100%;
    aspect-ratio:16/9;
}

.folks,
.vignettes{
    width:100%;
}

.image1{
    float:left;
    width:75%;
    margin:-0 30px 10px -18vw;
}

.image2{
    float:right;
    width:35%;
    height:auto;
    margin:0 -18vw 10px 30px;
}

.image2b{
    float:right;
    width:50%;
    height:auto;
    margin:0 -18vw 10px 30px;
}

.image2c{
    float:right;
    width:45%;
    height:auto;
    margin:0 -18vw 10px 30px;
}

.image3{
    float:left;
    width:40%;
    height:auto;
    margin:0 30px 10px -18vw;
}

.image3b{
    float:left;
    width:60%;
    height:auto;
    margin:0 30px 10px -18vw;
}

#fondnoirlast{
    padding:80px 0;
    background:#000;
}

#content{
    position:relative;
    overflow:hidden;

    width:100%;
    height:100vh;
    margin:0 auto;
    padding-top:0;

    text-decoration:none;
    background:#cab2a3;
}

#slide{
    display:flex;
    justify-content:center;
    align-items:center;

    text-align:center;
    vertical-align:middle;
}

.article{
    display:block;
}

.fleche{
    position:absolute;
    top:50%;

    z-index:99999999;

    font-size:8em;
    line-height:1;
    color:#fff;

    cursor:pointer;
}

.fleche:hover{
    color:#7a6d58;
}

.droite{
    right:0;
}

.gauche{
    left:0;
}

#sliderNoSmoking{
    max-height:100vh;
    z-index:9999;
    text-decoration:none;
}

ul{
    list-style:none;
}

#textasiat{
    position:absolute;

    margin-top:50px;
    margin-left:50px;
    padding:0;

    float:left;

    height:auto;
    bottom:auto;

    z-index:99999;

    text-align:left;
    text-decoration:none;

    font:8vw/8vw Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black",sans-serif;
}

#textasiat li a{
    color:#fff;
    text-decoration:none;
    text-shadow:2px 2px 4px #000;
    z-index:99;
}

#textasiat li a:hover{
    color:#cecece;
}

#textasiat2{
    position:absolute;

    margin:50px 0 0 50px;
    padding:0;

    float:left;

    z-index:99999;

    text-align:left;

    font:6vw/6vw Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black",sans-serif;
}

#textasiat2 li{
    color:#fff;
    text-shadow:2px 2px 4px #000;
    font-size:8vw;
    line-height:6vw;
}

#textasiat2 li a{
    color:#fff;
    text-shadow:2px 2px 4px #000;

    font-size:8vw;
    line-height:8vw;

    transition:color 2s,font-size 2s;

}

#textasiat2 li a:hover{
    color:#cecece;
    font-size:20vw;
}

#textasiat2 li.designer{
    color:#fff;
    font-size:4vw;
    line-height:4vw;
    transition:color 2s,font-size 2s;
}

#textasiat2 li.designer:hover{
    color:#cecece;
    font-size:10vw;
}

#textasiat3 li a{
    position:absolute;

    margin-top:50px;
    margin-left:50px;
    padding:0;

    float:left;

    height:auto;
    bottom:auto;

    z-index:99999;

    color:#fff;
    text-align:left;
    text-decoration:none;
    text-shadow:2px 2px 4px #000;

    font-family:Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black",sans-serif;
    font-size:8vw;
    line-height:8vw;
}

#textasiat3 li a:hover{
    color:#cecece;
}

.blackie{
    text-align:left;
}

#imagasiat{
    position:absolute;
    bottom:0;

    z-index:999;

    vertical-align:middle;

    transition:transform .3s ease-out;
}

.imagasiat{
    position:relative;

    float:right;

    top:0!important;
    bottom:0!important;

    max-width:100%;
    max-height:100vh;

    margin-right:5em;

    z-index:9999;

    border:1vw solid #000;

    vertical-align:middle!important;

    transition:transform .3s ease-out;
}

.imagasiat2{
    position:relative;

    float:right;

    top:0!important;
    bottom:0!important;

    max-width:100%;
    max-height:100vh;

    margin-right:5em;

    z-index:9999;

    border:1vw solid #000;

    text-align:center;
    vertical-align:middle!important;

    opacity:0;

    transition:opacity 3s,visibility 0s .5s;
}

.niveau1:hover + .niveau2{
    transform:scale(2.5);
}

.niveau3:hover + .niveau4{
    opacity:1;
    transition:all 2s ease-in-out;
}

.animClass{
    position:relative;

    top:0;
    right:0;
    left:auto;
    bottom:auto;

    float:right;

    margin:0;

    backface-visibility:hidden;
}

.amber{
    position:relative;
    top:0;
    left:0;
    display:block;
}

.amber img{
    display:block;

    max-width:90vw;
    height:100vh;

    margin:-100px 0 0;

    object-fit:cover;

    border:1vw solid #000;

    text-align:center;

    box-shadow:10px 15px 25px 0 rgba(0,0,0,.2);

    transition:all .5s cubic-bezier(.645,.045,.355,1);
}

.amber:hover img{
    margin-top:20px;
    margin-left:20%;

    box-shadow:1px 1px 10px 0 rgba(0,0,0,.1);
}

.amber h1{
    position:absolute;

    margin:20%;

    transform:translate(10%,-600%);

    z-index:99999;

    color:#fff;

    text-decoration:none;
    text-shadow:2px 2px 4px #000;

    font-family:Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black",sans-serif;
    font-size:8vw;
    line-height:8vw;
}

.amber h1:hover{
    color:#cecece;
}

.a-img-txt{
    display:grid;
}

/* Les enfants se superposent */
.a-img-txt>*{
    grid-area:1 / 1 / -1 / -1;
}

.a-img{
    display:block;

    max-width:100%;
    max-height:100vh;

    margin:auto;

    top:0!important;

    border:1vw solid #000;

    z-index:9999;
}

.a-txt{
    display:flex;
    justify-content:center;
    align-items:center;

    padding:0;

    color:#fff;

    font-family:Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black",sans-serif;
    font-size:8vw;
    line-height:8vw;

    opacity:0;
    filter:invert(0);

    transition:opacity .8s;

    z-index:99999;
}

.c1{
    background:#ff6600cc;
}

.c2{
    background:#6600ffcc;
}

.a-txt:hover{
    opacity:1;
    text-shadow:2px 2px 4px #000;
}

.a-img-txt:hover .a-img{
    filter:invert(0);
}

#fondnoir{
    padding-bottom:80px;
    background:#000;
}

.rotate-cadre{
    position:relative;

    display:flex;
    align-items:center;
    justify-content:center;

    float:left;

    width:100%;

    margin:0 30px 2em auto;

    overflow:hidden;
}

.static-element{
    position:relative;

    margin:0;

    text-align:center;
}

.rotate-img{
    position:absolute;

    width:300%;

    animation:rotate 4s linear infinite;
}

@keyframes rotate{
    to{
        transform:rotate(360deg);
    }
}

figure{
    position:relative;
    display:inline-block;

    overflow:hidden;

    margin:0;
}

figcaption{
    position:absolute;
    inset:0;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0 1em;

    color:#fff;

    background:rgba(0,0,0,.5);

    font-family:'ralewayblack',Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black",sans-serif;
    font-size:1.5vw;
    line-height:1.2em;

    text-align:center;

    opacity:0;

    transition:.3s ease-in;

    pointer-events:none;
}

figure:hover figcaption{
    opacity:1;
}

*,
*:before,
*:after{
    box-sizing:border-box;
    margin:0;
    padding:0;
}

.clearfix::after{
    content:"";
    display:table;
    clear:both;
}

#green{
    width:100vw;
    height:100vh!important;

    overflow:hidden;

    background:#ff0590;

    text-align:center;
}

#green p{
    margin-left:-.18em;

    color:#ffce21;

    font-family:Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black",sans-serif;
    font-size:80vw;

    text-align:center;

    transform:rotate(-90deg);
}

#rocknroll{
    height:100vh;

    overflow:hidden;

    background:red;

    text-align:center;
}

#rocknroll p{
    position:relative;

    margin:0;
    padding:0;

    color:#000;

    font-family:Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black",sans-serif;
    font-size:142vh;
    line-height:103vh;
    font-weight:600;

    transform:rotate(0);
}

#jaune{
    height:100vh;

    margin-top:10px;

    overflow:hidden;

    background:#cab2a3;

    text-align:center;
}

#jaune p{
    position:relative;

    margin:0;
    padding:0;

    color:#cecece;

    font-family:Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black",sans-serif;
    font-size:142vh;
    line-height:0;
    font-weight:600;

    transform:rotate(30deg);
}

/* Déplacement vertical et horizontal */

.vertical{
    position:absolute;
    inset:0;
    height:100%;
}

.vertical > h2{
    grid-column:1;

    margin:0;

    overflow:hidden;

    color:ivory;

    font-size:110vw;
    line-height:95vw;

    text-align:center;

    transform:scale(-1);
}

.vertical > h2 > up-text{
    display:block;

    height:100%;
    margin:auto 0;
    padding:0;

    z-index:10;

    writing-mode:vertical-rl;

    animation:slide 10s linear infinite;
}

@keyframes slide{
    from{
        transform:translateY(16.5em);
    }

    to{
        transform:translateY(-16.5em);
    }
}

/* Défilement horizontal */

.marquee-rtl{
    position:absolute;
    inset:0;

    width:100vw;
    height:100%;

    overflow:hidden;

    z-index:10;
}

.marquee-rtl > :first-child{
    position:absolute;
    top:50%;

    padding-left:100vw;

    white-space:nowrap;

    transform:translateY(-50%);

    animation:defilement-rtl 8s linear infinite;
}

@keyframes defilement-rtl{
    from{
        transform:translate(0,-50%);
    }

    to{
        transform:translate(-100%,-50%);
    }
}

/* Défilement vertical */

.marque-ver{
    position:relative;

    max-width:100%;
    height:50em;

    overflow:hidden;

    font-size:14vw;
}

.marque-ver > div{
    position:relative;

    padding:50em 2em 2em;

    cursor:pointer;

    animation:defilement-ver 10s linear infinite;
}

@keyframes defilement-ver{
    from{
        transform:translate3d(0,0,0);
    }

    to{
        transform:translate3d(0,-100%,0);
    }
}



/* ---------------- */
/* ---------------- */
/* Back to top */
#scrollUp
{
	position: fixed;
	bottom : 10px;
	right: -100px;
	opacity: 1;
	z-index: 999999999999999;
}

/* Répétition des titres */
p
{
	width: max-content;
	text-shadow: calc(var(--offsetText) * 1px + 0.5em) 0,calc(var(--offsetText) * -1px - 0.5em) 0,calc(var(--offsetText) * 2 * 1px + 1em) 0,calc(var(--offsetText) * 2 * -1px - 1em) 0,calc(var(--offsetText) * 3 * 1px + 1.5em) 0,calc(var(--offsetText) * 3 * -1px - 1.5em) 0,calc(var(--offsetText) * 4 * 1px + 2em) 0,calc(var(--offsetText) * 4 * -1px - 2em) 0,calc(var(--offsetText) * 5 * 1px + 2.5em) 0,calc(var(--offsetText) * 5 * -1px - 2.5em) 0,calc(var(--offsetText) * 6 * 1px + 3em) 0,calc(var(--offsetText) * 6 * -1px - 3em) 0,calc(var(--offsetText) * 7 * 1px + 3.5em) 0,calc(var(--offsetText) * 7 * -1px - 3.5em) 0,calc(var(--offsetText) * 8 * 1px + 4em) 0,calc(var(--offsetText) * 8 * -1px - 4em) 0,calc(var(--offsetText) * 9 * 1px + 4.5em) 0,calc(var(--offsetText) * 9 * -1px - 4.5em) 0,calc(var(--offsetText) * 10 * 1px + 5em) 0,calc(var(--offsetText) * 10 * -1px - 5em) 0;
	min-width: calc(var(--offsetText) * 1px + 0.5em);
	animation: slide 20s infinite linear;
	position:relative;
}

p:nth-child(odd),p:nth-child(even):before
{
	animation-direction: reverse;
	color: lime;
	transform: rotate(-90deg);
	margin-left:-7% ;
	transform-origin:0% 0;
}

@keyframes slide
{
	to
	{
		text-indent: calc(var(--offsetText) * -10px - 0.5em);
	}
}

/*photo ROCK fullscreen et titre + audio*/
#musette
{
	min-height: 100vh;
}

.musette
{
	position: relative;
	overflow : hidden;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width:100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url("../images/musette.jpg");
	background-color: black;
}

.musette h1
{
	margin-left: 0.5em;
}

.presley
{
	color: red;
	font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
	font-size: 6vw;
	line-height: 6.2vw;
	width: 50vw;
	margin-bottom:0.2em;
}

audio
{
	z-index: 999;
	position: relative;
	margin-top: 1.5em;
	margin-left: 5em;
}

.fb-video
{
	text-align:center;
	display: block;
	position: relative;
	min-width: 100%;
	padding-top: 15%;
	min-height: 100vh;
	z-index: 9999;
	background-size: 200%;
}

/*Media queries */
@media only screen and (max-width: 960px)
{
	figcaption
	{
		font-size: 1.2em;
	}
		.texte h1
{
	font-family: 'chunkfive', Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
	font-weight: lighter;
	letter-spacing: -3px;
	font-size: 20vw;
	line-height:10vw;
	text-align: center;
	color: blue;
}
	.texte h4
{
	font-family: 'ralewaybold', 'Impact', 'Haettenschweiler', "Franklin Gothic Bold", "Arial Black", sans-serif;
	margin-top:30px;
	margin-bottom: 20px;
	font-size:1em;
	line-height: 1em;
	text-align: center;
	text-transform: uppercase;
}
}

/* Lettrine */
.texte h2::first-letter
{
	float: left;
	font-size:6em;
	font-weight:bold;
	line-height:0.7em;
	font-family: 'chunkfive', Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
	margin-left: -10px;
	padding-left: 8px;
	margin-right: 10px;
}
	
@media only screen and (max-width: 960px)
{
.texte h2::first-letter
{

	font-size:4em;

}

}

.lettrine_beige:first-letter
{color: #cab2a3;}
.lettrine_rouge:first-letter
{color: red;}


/* textes */
.texte
{
	color: black;
	min-width: 100%;
	padding-left: 21vw;
	padding-right:21vw;
	padding-top:0vh;
	padding-bottom: 50px;
}

.contour
{
	background-image: url("../images/contour_rock.gif");
	object-fit: fill;
	background-attachment: fixed;
	background-size: 100% 100%;
	padding-bottom: 50px;
}

.texte_a
{
	width: 100vw;
	padding-top:10vh;
	padding-bottom: 10vh;
	background-image: url("../images/fond_psyche.gif");
	text-align: center;
	background-attachment: fixed;
	background-size: cover;
	background-position: center;
	font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
}

.texte h1
{
	font-family: 'chunkfive', Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
	font-weight: lighter;
	letter-spacing: -3px;
	font-size: 12vw;
	line-height:10vw;
	text-align: center;
	color: #a98d7b;
}

.texte h2
{
	font-family: 'ralewayextralight', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
	line-height: 1.5em;
	font-size: 1.5em;
}

.texte h2 span
{
	font-family: 'ralewaysemibold', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
}

.texte h2 strong
{
	font-family: 'ralewayblack', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
}

.texte_a h1
{
	font-family:"retro_coolregular";
	color: white;
	opacity: 0.7;
	text-shadow: 1px 1px 2px black;
	font-size: 15vw;
	line-height:12vw;
}

.texte_a h2
{
	font-family:"retro_coolregular";
	color: white;
	opacity: 1;
	text-shadow: 1px 1px 2px black;
	font-size: 8vw;
	line-height: 5vw;
	margin-bottom: 0.5em;
}

.blue
{
	font-size: 3.5vw;
	/* ou 5vw comme dans l'attribut "style" de votre balise <h3> */
	line-height:100% !important;
	color: yellow;
	/* ou white comme dans l'attribut "style" de votre balise <h3> */
	font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif !important;
	letter-spacing: 1px;
	text-align: center;
	text-shadow:0px 0px 10px black;
	margin-bottom: 0.5em;
	margin-top:1em;
	padding-left: 20vw;
	padding-right: 20vw;
}

.bluefr
{
	text-align: center;
	font-size:4.5vw;
	letter-spacing: 1px;
	color: white;
	line-height:110%;
	text-shadow:0px 0px 10px black;
	padding-left: 20vw;
	padding-right: 20vw;
}

.beige
{
	color: #cab2a3;
}

.texte h3
{
	font-family: 'ralewayextralight', 'Impact', 'Haettenschweiler', "Franklin Gothic Bold", "Arial Black", sans-serif;
	line-height: 1em;
	font-size: 1.7em;
}

.red
{
	color: red;
}

.strong
{
	font-family: 'ralewaybold', 'Impact', 'Haettenschweiler', "Franklin Gothic Bold", "Arial Black", sans-serif;
}

.texte h4
{
	font-family: 'ralewaybold', 'Impact', 'Haettenschweiler', "Franklin Gothic Bold", "Arial Black", sans-serif;
	margin-top:30px;
	margin-bottom: 10px;
	font-size:2em;
	line-height: 1.2em;
	text-align: center;
	text-transform: uppercase;
	color: black;
}

h5
{
	font-family: 'black_clouds_white_skyregular', 'Impact', 'Haettenschweiler', "Franklin Gothic Bold", "Arial Black", 'sans-serif';
	padding-right: 40px;
	background-color : black;
	color : #00BFFF;
	padding-top: 40px;
	margin-top:0px;
	font-size: 15vw;
	text-align: center;
	top: 0;
	padding-bottom : 50px;
}

/* Images dans textes */
/* FOOTER */
.reseaux
{
	display:flex;
	justify-content:center;
	align-items:center;
	text-align: center;
	padding-bottom: 10px;
	padding-top: 10px;
	background-color: #fff;
}

.reseaux a, .reseaux button
{
	font-size: 1em;
	display: inline-block;
	padding:0;
	margin: 0 0.5em;
}

.reseaux a .fab, fa-brands, .reseaux button .fa
{
	color: #7a6d58;
	/* BEIGE foncé */
}

.reseaux a:hover .fab, .reseaux button:hover .fa
{
	color: #aba69c;
	/* BEIGE clair */
}

.reseaux a, fa-brands, .fab
{
	color: #7a6d58;
	/* BEIGE foncé */
}

.reseaux a:hover, fa-brands a:hover, .fab
{
	color: #aba69c;
	/* BEIGE clair */
}

#credits
{
	text-align:center;
	background-color: #fff;
	font-size: 12px;
	height: auto;
	padding-bottom: 10px;
}
@media only screen and (max-width: 767px)
{
	


	.texte h2
	{
		font-family: 'ralewayextralight', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
		line-height: 1.5em !important;
		font-size: 1.3em !important;
	}

	.texte h4
	{
		font-size: 1.1em!important;
	}

	.musette
	{
		/* On stylise notre élément pour qu'il prenne toute la largeur et 100px de haut. On lui affecte une image de fond que l'on répète de gauche à droite */
		width: 100%;
		height: 100%;
		background-image: url('../images/musette.jpg');
		background-repeat: repeat-x;
		background-position-x: 0%;
		margin-top:0px;
		/* On définit les comportements de l'animation : sa durée (3 secondes), le nombre d’exécution (à l'infini), la fonction de "mouvement" (début et fin "amortis"), le sens du mouvement (en alternance), le nom de l'animation qui va être définit ci dessous */
		animation-duration: 10s;
		animation-iteration-count: infinite;
		animation-timing-function: ease-in-out;
		animation-direction: alternate;
		animation-name: musetteAnimation;
	}


	.texte_a .blue
	{
		font-size: 5.5vw;
		line-height:100% !important;
	}

	.texte_a .bluefr
	{
		font-size:7vw;
	}

	.image1
	{
		float:left;
		margin-left:0vw;
		width:100%;
		margin-right: 0px;
	}

	.image2
	{
		float:right;
		margin-right:0vw;
		margin-left: 0;
		width:100%;
		height:auto;
	}

	.image2b
	{
		float:right;
		margin-right:0vw;
		margin-left: 0px;
		width:100%;
		height:auto;
	}

	.image3
	{
		float:left;
		margin-left:0vw;
		margin-right: 0px;
		width:100%;
		height:auto;
	}

	.image3b
	{
		float:left;
		margin-left:0vw;
		margin-right: 0px;
		width:100%;
		height:auto;
	}

	.imagasiat
	{
		width:auto;
		height: 100%;
		margin-right: 0;
		display:block;
		margin:auto;
		text-align:center;
		float:none;
		clear:both;
	}

	.imagasiat2
	{
		width:auto;
		padding-right: 0;
		display:block;
		margin:auto;
		text-align:center;
		float:none;
		clear:both;
	}

	.fb-video
	{
		padding-top: 40%;
	}

	.lddc .sl-slider h3
	{
		bottom: 20px;
	}

	.musette h1
	{
		color: red;
		font-size: 8vw;
		line-height:8vw;
		margin-left:1em;
	}
	


}

.logo_gauche
{
	float:left;
}
	@keyframes musetteAnimation
	{
		from
		{
			background-position-x: 2048px;
		}

		to
		{
			background-position-x: 0px;
		}
}
html, body {
    height: 100%;
    margin: 0;
	    overflow-x: hidden;

}
#jaune {
    position: relative;
}
#jaune .pelvis {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
	    z-index: 1;

}

#jaune p {
    font-size: 140vmin;
    line-height: 0.8;
    white-space: nowrap;

    transform: rotate(30deg);
    transform-origin: center;
}