﻿/* GENERAL */
@font-face {
    font-family: 'CurlyStars';
    src: url('CurlyStars.ttf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'WK';
    src: url('ahellya.ttf');
    font-weight: normal;
    font-style: normal;
}

* {
	box-sizing: border-box;
}
html, body {
	margin: 0px;
	padding: 0px;
	width: 100%;
	font-family: WK;
	
}

a, .lien {
	color: white;
	text-decoration: none;
	cursor: pointer;
	}
	a:hover, .lien:hover {
	color: lightgrey !important;
	
	}

	.sous_lien {
		color: SaddleBrown;
	}
	.sous_lien:hover {
		color: white !important;
	}

.apear_mobile {
	display: none !important;
}

.apear_inline_mobile {
	display: none !important;
}

.lien_barre_navig {
	display: inline-block; margin-right: 2%; padding: 6px; padding-left: 12px; padding-right: 15px;  border: 0px double; display: inline-block;
font-size: 18px; font-variant: small-caps; 
}

.here, .here:hover {
	background-color: #526759 !important;
	border-radius:  30px 0px 30px 0px;
	color: white !important;
	opacity: 0.9;
	border: 1px solid white !important;
	
}




#next:active, #prev:active { background-color: grey;
}
.mois_titre {
	width: 100%; border: 1px solid;  box-sizing: border-box; text-align: center; background-color: lightgrey; color: #000000;
}
.nom_mois {
	width: 14.28%; height: 10%; padding-top: 0.5%; border: 1px solid; box-sizing: border-box; display: inline-block; text-align: center;background-color: lightgrey; color: #000000;
}


.jour {
	width: 14.28%;
	height: 10%; padding-top: 0.5%; border: 1px solid; box-sizing: border-box; display: inline-block; text-align: center; background-color: #000066;
}
.bloc_logo {
	width: 100%;
	height: 35%;
	background-color: #FFFFFF;
	opacity: 1;
	text-align: center;
	position: absolute;
	top: 0%;
	z-index: 2;
	 border-bottom: 1px solid;
	
}
.agenda_date {
width: 14.28%; height: 40px; padding-top: 0.5%; border: 1px solid; box-sizing: border-box; display: inline-block; text-align: center; color: black;
}
.even {
background-color: #685588;
color: #FFFFFF;
cursor: pointer;
}
.open {
background-color: #306889;
color: #FFFFFF;
}
.open_middle {
background-color: darkblue;
color: lightgrey;
}
.resa {
	background-color: #000000;
}
.close {background-color: white;
}
.noexist {
	width: 14.28%; padding-top: 0.5%; display: inline-block; text-align: center;
}

.image_1 {
animation:fade1 15s infinite;
-webkit-animation:fade1 15s infinite;
}
.image_2 {
animation:fade2 15s infinite;
-webkit-animation:fade2 15s infinite;
}
.image_3 {
animation:fade3 15s infinite;
-webkit-animation:fade3 15s infinite;
}
.image_4 {
animation:fade4 15s infinite;
-webkit-animation:fade4 15s infinite;
}
.image_5 {
animation:fade5 15s infinite;
-webkit-animation:fade5 15s infinite;
}

.image_6 {
animation:fade6 15s infinite;
-webkit-animation:fade6 15s infinite;
}
.image_7 {
animation:fade7 15s infinite;
-webkit-animation:fade7 15s infinite;
}
.image_8 {
animation:fade8 15s infinite;
-webkit-animation:fade8 15s infinite;
}
.image_1_at {
animation:fade1at 10s infinite;
-webkit-animation:fade1at 10s infinite;
}
.image_2_at {
animation:fade2at 10s infinite;
-webkit-animation:fade2at 10s infinite;
}
.image_3_at {
animation:fade3at 10s infinite;
-webkit-animation:fade3at 10s infinite;
}
.image_4_at {
animation:fade4at 10s infinite;
-webkit-animation:fade4at 10s infinite;
}
.image_5_at {
animation:fade5at 10s infinite;
-webkit-animation:fade5at 10s infinite;
}
.mob {
letter-spacing: 0.4px;
}
 @keyframes fade1 {
  0%   {opacity:1}
  10% { opacity: 1}
  19% { opacity: 0}
  90% { opacity: 0}
  97% {opacity: 1;}
  100% {opacity: 1;}
}
 @keyframes fade2 {
  0%   {opacity:0}
  10% { opacity: 0}
  19% { opacity: 1}
  25% { opacity: 1}
  34% { opacity: 0}
}
 @keyframes fade3 {
  0%   {opacity:0}
	25% {opacity: 0}
	34% { opacity: 1}
	40% { opacity: 1}
	49% { opacity: 0}
}
 @keyframes fade4 {
  0%   {opacity:0}
	40% { opacity: 0}
	49% { opacity: 1}
	55% {opacity: 1}
	64% {opacity: 0}
}
 @keyframes fade5 {
  0%   {opacity: 0}
  55% { opacity: 0}
  64% { opacity: 1}
  70% { opacity: 1}
  79% { opacity: 0}
}
@keyframes fade6 {
 0%   {opacity: 0}
  70% { opacity: 0}
  79% { opacity: 1}
  85% { opacity: 1}
  94% { opacity: 1}
}
@keyframes fade7 {
  
   0%   {opacity: 0}
  85% { opacity: 0}
  94% { opacity: 1}
  100% { opacity: 1}
}
@keyframes fade1at {
  0%   {opacity:0}
  25% { opacity: 1}
  50% { opacity: 0}
  75% { opacity: 0}
  100% { opacity: 0}
}
@keyframes fade2at {
  0%   {opacity:0}
  25% { opacity: 0}
  50% { opacity: 1}
  75% { opacity: 0}
  100% { opacity: 0}
}
 @keyframes fade3at{
  0%   {opacity:0}
  25% { opacity: 0}
  50% { opacity: 0}
  75% { opacity: 1}
  100% { opacity: 0}
}
 @keyframes fade4at{
  0%   {opacity:0}
  25% { opacity: 0}
  50% { opacity: 0}
  75% { opacity: 0}
  100% { opacity: 1}
}
 @keyframes fade5at{
  0%   {opacity: 1}
  25% { opacity: 0}
  50% { opacity: 0}
  75% { opacity: 0}
  100% { opacity: 0}
}



@media screen and (min-width: 1001px) {
	.panier_ico { display: block;
		position: fixed; right: 50px; top: 50px; width: 50px; z-index: 100;
		height: 50px; background-color: white; z-index: 10; border: 2px solid;
		border-radius: 30em; padding: 10px; box-sizing: border-box; text-align: center;
		z-index: 110;  font-size: 15px; color: black !important;
	}

	.block_titre_plura {
		width: 15%; left: 42.5%; text-align: center; position: fixed; z-index: 110;
		overflow: hidden;
	}
	
	.titre_plura {
		width: 100%; display: inline-block; height: 35px; margin-right: auto; margin-left: auto;
		background-color: rgba(211,211,211,0.9); border-radius: 30em; text-align: center; color: black;
		overflow: hidden; z-index: 2; position: relative; font-size: 25px;line-height: 140%; font-variant: small-caps;
	}

	.logo_haut {
		width: 100%; border: 0px double #439280;
	z-index: 100; text-align: center; color: black; display: inline-block; display: inline-block;
	z-index: 3; position: relative; padding-bottom: 0px;
	}
	
	.logo_haut_in {
		margin-top: 10px; height: 125px; margin-left: 15px;
	}
	
	.slogan_index {
		width: 40%; left: 30%; top: 20px;
		margin-bottom: 10px; position: relative; z-index: 111
	}

	.position_index { 
		width: 100%; padding-top: 80px; position: absolute; padding-left: 10%; 
		padding-right: 10%; top: 140px; overflow-y: auto;
		z-index: 3; box-sizing: border-box; 
				
			}
			.position_index > div { border-radius: 0px !important;}

	/* GLOBAL (grand) */
	.grand_titre {
		font-size: 2vw; color: #000000; font-family: WK; line-height: 100%;
		font-variant: small-caps; display: inline-block; word-spacing: 0px;
		letter-spacing: 1px;
	}
	
	.sous_titre {
		font-family: WK; font-variant: small-caps; font-size: 30px; width: 100%; text-align: center; line-height: 75%; padding-bottom: 0px;
	}
	
	.titre_page {
		font-family: WK; font-variant: small-caps; font-size: 30px; width: 100%; text-align: center; line-height: 75%; padding-bottom: 0px;
	}

	.sous_sous_titre {
		font-size: 15px;
	}
	
	.contact {
		display: inline-block; text-align: right; color: #6C6C6C; margin: 7px; margin-top: 9px;
	}
	
	#slideshow {
	
		text-align: center;
		overflow: hidden;
		box-sizing: border-box;
		width: 60%;
		margin-top: 20px;
		margin-left: 20%;
		padding: 0px;
		
	}
	
	/* INDEX (grand) */
	.index_case_titre {
		 width: 100%; height: 250px; text-align: center; padding: 15px; padding-top: 30px; padding-bottom: 0px; box-sizing: border-box; line-height: 50%; font-size: 1.8vw;
		 border-bottom: 0px; font-variant: small-caps;letter-spacing: 3px; font-family: WK;
	}
	.index_case_sous_titre{
		font-size: 20px; font-variant: normal; letter-spacing: 0.5px;
	}

	.sous_titre_site{
		font-size: 20px; font-variant: normal; letter-spacing: 0.5px;
	}

	.bouton_index {
		font-size: 16px; font-family: WK; letter-spacing: 1px;display: inline-block; margin-right: 2%;
		border: 2px solid #EEFFE8; color: white !important; padding: 6px; padding-left: 15px;
		padding-right: 15px;
	}

	.case {
		background-color: rgba(230,  232, 225, 0.9); border: 1px solid grey;
		 overflow: hidden;  border-bottom: 1px dotted grey; width: 70%;
		 min-width: 800px; margin-bottom: 30px; height: 75vh; margin-left: auto;
		 margin-right: auto;
	}

	
	.block_img_pres {
		width: 60%; margin-left: auto; margin-right: auto; margin-top: 3%; aspect-ratio: 2/1;
				box-sizing: border-box; 
			border-top: 0px; border-bottom: 0px;
	}

	.block_img_rejoindre {
		width: 60%; aspect-ratio: 2/1; margin-left: auto; margin-right: auto;
margin-top: 3%; margin-bottom: 1%;
	}

	.block_img_archives {
		width: 100%; margin-left: auto; margin-right: auto; margin-top: 3%;
aspect-ratio: 1/1;
				box-sizing: border-box; float: left;
			border-top: 0px; border-bottom: 0px;
	}

	.case_left {
		float: left;
	}

	.case_right {
		float: right;
	}
	
	
	.case_trois {
		height: 600px;
}

.case_quatre {

	font-family: WK;
		padding-top: 0px; overflow-y: auto;  font-size: 20px; margin-bottom: 40px;
		height: 600px;
}

.case_cinq { 
	width: 100%; height: 430px;
}

.case_artistes {
	height: 525px; width: 70%; margin-left: auto; margin-right: auto;
	min-width: 800px;
}

.case_artistes_old {
	width: 100%; height: 450px;
}

.second_in_artistes {
	height: 420px; padding-bottom: 30px; overflow: hidden; box-sizing: border-box;
}

.second_in_artistes_old {
	height: 250px; padding-bottom: 30px; overflow: hidden; box-sizing: border-box;
}

.spe_height_artistes {
	height: 90px;
}

.block_img_artiste {
	width: 25%;  float: left; padding: 1%; padding-top: 0px;height: 100%;
	box-sizing: border-box; border-top: 0px; position: relative;
					
}

.block_img_artiste_old {
	width: 16.6%;  float: left; padding: 1%; padding-top: 0px;height: 100%;
	box-sizing: border-box; border-top: 0px; position: relative;
					
}

.titre_img_artistes {
	font-family: WK; color: white; font-size: 23px; background-color: #526759; position: absolute; z-index: 2;
	width: 92%; padding: 5px; text-align: center; box-sizing: border-box; border: 1px solid grey; border-bottom: 0px;
}

.titre_img_artistes_old {
	font-family: WK; color: white; font-size: 20px; background-color: #526759; position: absolute; z-index: 2;
	width: 88%; padding: 5px; text-align: center; box-sizing: border-box; border: 1px solid grey; border-bottom: 0px;
}


.spe_titre_trois {height: 150px;}

.bottom_block {
	width:100%; background-color:rgba(230, 232, 225, 0.9); z-index: 99; font-family: WK; padding: 20px;
padding-bottom: 0px; line-height: 150%; opacity: 1; border-radius: 30px 30px 30px 30px; box-sizing:
border-box; border: 1px solid grey;
}

.block_general {
	width: 80%; text-align:center; margin-left: 10%; background-color: rgb(255,255,255, 0.8);
}

	.bouton {
			position: relative;
			width: 100%;
			box-sizing: border-box; text-align: left;
			 background-color: #897676; font-size: 20px; height: 50px; padding: 20px; color: #FFFFFF; padding-top: 10px; opacity: 0.9; font-variant: small-caps;
			 font-weight: bold;
	border: 2px solid;
	font-family: WK;
	float: left;
	margin-bottom: 10px;
		}
	/* PARC D'ART (grand) */
	.bouton_petit_gauche_visiter {
		position: relative;	box-sizing: border-box;  text-align: left; padding: 20px; color: #FFFFFF !important; opacity: 0.9; font-variant: small-caps; font-weight: bold; border: 2px solid; font-family: WK;
		float: left; margin-bottom: 10px; display: inline-block; width: 17.5%; float : left;margin-left: 30%;  background-color: #CB1D74;  font-size: 15px; height: 30px; padding-top: 3px;
	}
	
	
	.bouton_petit_droite_scolaires {
			position: relative;
			
			box-sizing: border-box;  text-align: left;
			  padding: 20px; color: #FFFFFF !important; opacity: 0.9; font-variant: small-caps;
			 font-weight: bold;
	border: 2px solid;
	font-family: WK;
	float: left;
	margin-bottom: 10px;
	
	 display: inline-block; width: 17.5%; font-size: 15px; height: 30px; padding-top: 3px;
	 float : right; margin-right: 30%;  background-color: #5771c3;
		}
		
		.video { border: 3px solid #216B5A; width: 80%; height: 30vw; top: -20px;
}
	
		.bouton:hover {
			filter: brightness(110%);
		}
		
		.bouton_petit_gauche_visiter:hover, .bouton_petit_droite_scolaires:hover, .bouton_petit_gauche_actualites:hover, .bouton_petit_droite_newsletter:hover, .bouton_petit_droite_commandes:hover, .bouton_petit_gauche_equipe:hover {
			filter: brightness(110%);
			color: #FFFFFF !important;
		}
		
		.bouton_visiter {
	
	text-align: center;
	padding: 20px;
	color: #FFFFFF;
	font-size: 25px;
	font-variant: small-caps;
	font-weight: bold;
	border: 2px solid;
	font-family: WK;
	opacity: 1;
	float: left;
}
	
	.bouton_video {
	
	text-align: center;
	padding: 20px;
	color:   #FFFFFF ;
	font-size: 25px;
	font-variant: small-caps;
	font-weight: bold;
	border: 2px solid;
	font-family: WK;
	opacity: 1;
	letter-spacing: 0.7px;
	float: right;
	}
	
.bouton_attractions {
	position: absolute;
	left: 70%;
	width: 20%;
	text-align: center;
	bottom: 25%;
	background-color: #ADA3AE;
	padding: 20px;
	color: #FFFFFF;
	font-size: 20px;
	font-variant: small-caps;
	font-weight: bold;
	border: 2px solid;
	font-family: WK;
	opacity: 0.9;
	letter-spacing: 0.7px;
	}
	/* EVENEMENTS ARTISTIQUES (grand) */
	.bouton_petit_gauche_actualites {
		position: relative;	box-sizing: border-box;  text-align: left; padding: 20px; color: #FFFFFF !important; opacity: 0.9; font-variant: small-caps; font-weight: bold; border: 2px solid; font-family: WK;
		float: left; margin-bottom: 10px; display: inline-block; width: 17.5%; float : left;margin-left: 30%; font-size: 15px; height: 30px; padding-top: 3px; background-color: #306889; 
	}
	
	/* VISITER (grand) */
		
		.bloc_calendar {
			display: inline-block; position: relative; width: 60%; text-align: justify; padding: 25px; font-size: 1.2vw; font-family: WK; letter-spacing: 0.7px; box-sizing: border-box; background-color: #E3E0E9; color: #245B79; border: 1px solid;
		}
		
		.calendar_months {
			width: 100%; box-sizing: border-box; display: inline-block;
		}
		
		.calendar {
			display: inline-block; text-align: justify; float: left; box-sizing: border-box; font-family: WK; font-size: 12px; padding-right: 20px; width: 50%; color: #FFFFFF; margin-top: 2%;
		}
	
	
	/* SCOLAIRES (grand) */
	.tableau { position: relative; width: 40%; left: 30%; background-color: #FFFFFF; font-family: WK;
	}
	
	/* NEWSLETTER (grand) */
	.bouton_valider { display: block; background-color: #b2ac75; width: 50%; color: #FFFFFF;
		font-family: WK; margin-top: 10px; font-weight: bold; margin-left: auto; margin-right: auto;
		 font-size: 20px;}
	

	

	
	/* SECTION PARC D'ART */
		
		.grand_cadre {
			display: block; position: relative; width: 80%; min-width: 550px;
			border-radius: 0em !important;
			box-sizing: border-box;
			font-family: WK;
			text-align: justify; padding: 25px;
			
		}
		
		
		
		
		
		.texte {
			display: inline-block; font-size: 19px;
		}
		
	
		.texte_galerie {
			display: inline-block; vertical-align: top; font-size: 1.1vw; width: 80%; left: 10%; position: relative; box-sizing: border-box;
		}
		
	
		
		/* SECTION ATELIER */
		
		.grand_cadre_ateliers {
			display: block; position: relative;  width: 60%; margin-left: 20%;
		}
		
		.texte_ateliers {
			display: inline-block; padding-left: 3.25%; font-size: 1.1vw;
		}
	
.taille_panneau {height: 30px;}
	


.barre_navig
		{
			z-index: 98; display: inline-block; text-align: center;
box-sizing: border-box; overflow: hidden;
position: fixed;
			  width: 100%;
			 border-bottom: 1px solid #28826D; padding: 5px;
			 padding-right: 0px; padding-bottom: 0px;
			  opacity: 1; background-color: rgba(230,  232, 225, 0.9);
		}
		
.imglog1 {
	height: 42.75px; vertical-align: bottom; margin-right: 20px;
}
.imglog2 {
height: 50px; vertical-align: bottom; margin-left: 20px;
}
.petit_texte {
font-size: 14px;
}

.taille_basique {
	font-size: 20px;
	}
	.efface_petit {
	display: inline-block !important;
	}
	.efface_grand {
	display: none !important;
	}

	
	
	.choix_attract {
	position: relative; width: 100%; height: 10%; left: 0%; font-family: CurlyStars; font-size: 30px; text-align: center; letter-spacing: 0.7px; top: -15px;
	}

	.desc_attra {
	background-color: #FFFFFF; border: 0px solid; font-family: WK;
	padding: 25px; position: absolute; left: 30%; width: 40%; top: 30%; font-size: 17px; line-height: 200%; box-sizing: border-box; opacity: 0.9;
	}
	


	.bloc_general {
		font-family: CurlyStars; font-size: 35px; position: absolute; top: 9%; left: 9%; text-align: center; width: 40%;
	}
	
	.region {
		font-size: 32px; position: relative; width: 100%; text-align: center; display: inline-block; font-weight: normal !important;
			top: -75px;
		}
		
		.balade {
		top: -30px;
		position: relative;
		}
		
		
		.parc_art {
			font-size: 50px; letter-spacing: 2px; font-weight: normal !important; text-align: center; width: 100%; font-family: CurlyStars; position: relative;
		}
		
		.titre_navig {
			font-size: 50px; letter-spacing: 2px; font-weight: normal !important; text-align: center; width: 100%; font-family: CurlyStars; top: -5%; position: relative;
		}
		
		.twitter {
		float: right; height: 70%; top: 17%; position: relative;  border: 1px solid #000000; padding: 5px; box-sizing: border-box; margin-right: 10px;
	}
	.facebook {
	margin-right: 10px; float: right; height: 70%; top: 17%; position: relative;  border: 1px solid #000000; padding: 5px; box-sizing: border-box;
	}
	.logo {
 height: 90%;
 position: relative;
 top: 1px;
 margin-left: 5px;
 float: left;
}

	.auteur {
	 text-align: center; position: absolute; padding-top: 2px;  width: 100%; height: 20px; font-size: 16px; font-family: WK; letter-spacing: 0.7px; opacity: 0; z-index: 20;
	}

	.plus {float: right; margin-right: 10px; font-family: WK; font-size: 13px; margin-top: 12px;
	}

	.bloc_texte {
	position: relative; left: 20%; width: 60%; box-sizing: border-box; font-family: WK; z-index: 0; font-size: 1.2vw; text-align: justify; background-color: #FFFFFF; padding: 25px; opacity: 1; border: 1px solid;
	}
.bloc_recrutement {
		position: relative; height: 65%; box-sizing: border-box; font-family: WK; font-size: 1.2vw; text-align: justify; background-color: #FFFFFF; padding: 25px; border: 1px solid;
width: 80%; left: 10%; opacity: 0.9; overflow-y: scroll; margin-top: -6%;
		}

	.titre {
	font-size: 1.6vw; font-variant: small-caps; font-weight: bold;
	}
	
	
	
	.texte_calendar {
	display: inline-block; font-size: 0.9vw; width: 100%; box-sizing: border-box; text-align: left; box-sizing: border-box; 
	}
	
	.bloc_acces {
		position: relative; left: 20%; width: 60%; text-align: justify; background-color: #E3E0E9; padding: 40px; padding-top: 20px; color: #245B79; font-size: 17px; font-family: WK; opacity: 1; letter-spacing: 0.7px; box-sizing: border-box; overflow: hidden; border: 1px solid;
	
	}
	
	.titre_acces {
		display: inline-block; font-size: 1.6vw; font-variant: small-caps; font-weight: bold; margin-right: 20px; text-align: left;
	}
	
	.bloc_plan {
		width: 100%; font-size: 0.8vw; padding-right: 2.5%; box-sizing: border-box; margin-top: 1%;
	}
	
	.texte_acces {
		width: 100%; font-size: 0.9vw; margin-top: 1%; text-align: left;
	}
	
	
	.adresse {
		font-weight: bold;
	}
	
	.fond_petit {
	display: none;
	}


	
	
	.texte_parc_petit {
		display: none;
	}
	
	.actus {
		width: 70%; box-sizing: border-box; float: left; height: 100%;
	}
	
	.menu_actus {
		width: 20%; float: right; height: 100%; display: block; height: 60%; overflow-y: scroll;
	}
	
	.actus_block {
		width: 80%; left: 10%; display: inline-block; position: relative;  opacity: 0.9; box-sizing: border-box; font-family: WK; text-align: justify;
	}
	
	.text_actus {
		font-size: 15px; line-height: 175%;
	}
	
	.bloc_cata {
		display: inline-block; width: 80%; left: 10%; background-color: #FFFFFF; position: relative;  box-sizing: border-box; border: 1px solid; font-size: 12px;
	}
	
	.cherche_cata {
		width: 100%; font-size: 16px;
	}
	
	.image_cata {
	width: 46%; height: 40%; margin-left: 2%; margin-right: 2%; margin-top: 1%; margin-bottom: 1%; float: left; text-align: right; font-family: WK;
	}

	.text_cata_det {
		float: right; width: 40%; height: 100%; padding: 2%; padding-top: 1%; box-sizing: border-box; overflow: auto;
	}
	
	.image_cata_det {
		float: left; width: 60%; height: 100%; box-sizing: border-box; text-align: center; padding: 1%;
	}
	
}
.bouton_barre {
	border-radius: 30px 30px 30px 30px !important;
}
/* MOBILE */
@media screen and (max-width: 1000px) {
	.block_titre_plura {
		width: 100%; left: 0%; position: fixed; z-index: 110; top: 0px;
		overflow: hidden;  padding-bottom: 0px; margin-bottom: 0px;
	}
	
	.titre_plura {
		width: 100%; display: block;
		background-color: rgba(211,211,211,1); text-align: center; color: black;
		overflow: hidden;
		top: 0px; border-bottom: 1px solid #216B5A;
		height: 100px; width: 100%;
	z-index:12; font-size: 62px; 
	line-height: 150%; font-variant: small-caps;  padding-bottom: 0px; margin-bottom: 0px;
	}
.bouton_barre {
	font-size: 35px; padding: 15px !important; margin-bottom: 10px;  border-radius: 30px !important;
}

.titre_install_mobile {
	font-size: 40px !important;
}

.spe_marge_mobile {
	margin-bottom: 50px !important;
}

.bloc_cent_mobile {
	width: 100% !important;
}

.texte_base_mobile {
	font-size: 30px !important; text-align: justify !important;
	display: inline-block !important;
}

.logo_haut {
	width: 100%; border: 0px double #439280;
z-index: 100; text-align: center; color: black; display: inline-block; display: inline-block;
z-index: 3; position: relative; padding-bottom: 0px;
}

.logo_haut_in {
	margin-top: 175px; height: 300px; margin-left: 15px;
}

.slogan_index {
	width: 95%; left: 2.5%; margin-top: 50px;
	margin-bottom: 50px; position: relative; z-index: 111;
}

.position_index { height: 100% !important; text-align:center; 
	z-index: 2;position: relative; padding-top: 150px !important; padding-bottom: 0px !important;
} 

.position_index > div {
	width: 100% !important; margin-left: 0% !important; 
}

	.grand_titre {
		font-size: 45px; font-variant: small-caps; color: #000000; font-family: WK;
	}
	
	.sous_titre {
		font-family: WK; font-variant: small-caps; font-size: 50px !important; width: 100%;
		text-align: center; line-height: 75%; padding-bottom: 0px;
	}

	.titre_page {
		font-family: WK; font-variant: small-caps; font-size: 50px !important;
		width: 100%; text-align: center; line-height: 75%; padding-bottom: 0px;

	}
	
	.sous_sous_titre {
		display: inline-block;font-size: 30px; padding-top: 10px;
	}
	
	
	
	
	.img_petit {
		width: 50px !important; height: 50px !important;
	}
	
	#slideshow {
    overflow: hidden;
	box-sizing: border-box;
	width: 100%;
	margin: 0px;
	padding: 0px;
}

	
	/* BARRE DE NAVIGATION (petit) */

		.barre_navig {
			z-index: 98; display: inline-block; text-align: center;
box-sizing: border-box; overflow: hidden;
			  width: 100%; height: 180px;
			 border-bottom: 1px solid #28826D; padding: 5px;
			 padding-right: 0px; 
			  opacity: 1; background-color: rgba(230,  232, 225, 0.9);

			position: absolute; 
			 padding-right: 20px; padding-left: 20px;
		}
		.imglog1 {
			height: 47px; vertical-align: center; margin-right: 20px; position: absolute; top: 20px;
			left: 8%;
		}

		.imglog2 {
			height: 60px; vertical-align: center; margin-left: 20px; position: absolute; top: 20px;
		right: 8%;
			}

			.contact {
				display: inline-block; text-align: right; color: #6C6C6C; margin-top: 15px;
			   font-size: 28px;
			}

			

	
	
	/* INDEX */

	.lien_expo_virt {
		width: 80% !important; font-size: 60px !important;
		background-color: rgba(255,  255, 255) !important;
	}

	.cartel {
		font-size: 50px !important; margin-top: 50px;
		padding: 50px !important; border: 3px solid !important;
	}

	.bout_car {
		min-height: 75px !important; min-width: 75px !important;
		border: 3px solid !important; font-size: 50px !important;
	}

	.case {
		background-color: rgba(230,  232, 225, 0.9); border: 1px solid grey;
		 overflow-y: scroll; border-bottom: 1px dotted grey; position: relative;
		 width: 90%; margin-left: 5%; margin-bottom: 75px; z-index: 98; height: auto;
		
	}
	.block_img_pres {
		width: 100%; margin-left: auto; margin-right: auto; margin-top: 3%; aspect-ratio: 2/1;
				box-sizing: border-box; 
			border-top: 0px; border-bottom: 0px;
	}	

	.block_img_rejoindre {
		width: 100%; aspect-ratio: 2/1; margin-left: auto; margin-right: auto;
margin-top: 3%; margin-bottom: 1%;
	}

	.block_img_archives {
		width: 100%; margin-left: auto; margin-right: auto; margin-top: 3%;
aspect-ratio: 1.3/1;
				box-sizing: border-box; float: left;
			border-top: 0px; border-bottom: 0px;
	}

	.case_trois {
		height: 780px;
	}

	.case_quatre {

		font-family: WK;
			padding-top: 0px;  font-size: 30px;
	}

	

	.second_in_artistes {
		overflow: hidden; box-sizing: border-box;
	}

	.block_img_artiste {
		width: 50%;  float: left; padding: 1%; padding-top: 0px;height: 400px; box-sizing:
		border-box; border-top: 0px; position: relative; margin-bottom: 50px;
						
	}

	.block_img_artiste_old {
		width: 33.33%;  float: left; padding: 1%; padding-top: 0px;height: 300px; box-sizing:
		border-box; border-top: 0px; position: relative; margin-bottom: 50px;
						
	}

	.titre_img_artistes {
		font-family: WK; color: white; font-size: 25px; background-color: #526759;
		position: absolute; z-index: 2;
		width: 96%; padding: 5px; text-align: center; box-sizing: border-box; border: 1px solid grey;
		border-bottom: 0px; height: 44px;
		overflow: hidden;
	}

	.titre_img_artistes_old {
		font-family: WK; color: white; font-size: 25px; background-color: #526759;
		position: absolute; z-index: 2;
		width: 94%; padding: 5px; text-align: center; box-sizing: border-box; border: 1px solid grey;
		border-bottom: 0px; height: 44px;
		overflow: hidden;
	}
	

	.block_general {
		width: 80%; text-align:center; margin-left: 10%; background-color: rgb(255,255,255, 0.8);
		
	
	}

		.index_case_titre {
			width: 100%; text-align: center; padding: 30px;
			box-sizing: border-box; line-height: 50%;
		 font-variant: small-caps;letter-spacing: 3px; font-family: WK;

		  font-size: 40px;
		font-variant: small-caps;
	}
	.index_case_sous_titre{
		font-size: 30px; font-variant: normal; letter-spacing: 0.5px; display: block;
		line-height: 150%;
	}

	.sous_titre_site {
		font-size: 35px; font-variant: normal; letter-spacing: 0.5px; display: block;
		line-height: 50%; margin-bottom: -15px;
	}
.bouton_index {
	font-size: 30px; padding-top: 3px;font-family: WK; letter-spacing: 1px;display: inline-block;
	margin-right: 5%;margin-left: 5%;  height: 50px; margin-bottom: 25px;
	border: 2px solid #EEFFE8; color: white !important; padding-left: 15px;
	padding-right: 15px;
}

		.case1 {
			width: 90%; margin-top: 0px; font-size: 50px; margin-left: 5%; border: 1px solid;
		}

		.case2 {
			width: 90%; margin-top: 4%; font-size: 50px; margin-left: 5%; border: 1px solid;
		}

		.case3 {
			width: 90%; margin-top: 4%; font-size: 60px !important; margin-left: 5%; line-height: 50%;
		} 
		
		.case4 {
			width: 90%; margin-top: 0%; font-size: 50px; margin-left: 5%; line-height: 50%;
					 border: 1px solid #646464;

			position: relative; box-sizing: border-box; margin-left: 5%;
		
		}
		
		.case5 {
						width: 90%; margin-top: 4%; font-size: 50px; margin-left: 5%; line-height: 50%;
					 border: 1px solid #646464;

			position: relative; box-sizing: border-box; margin-left: 5%;
		}
		
		.case6 {
						width: 90%; margin-top: 4%; font-size: 50px; margin-left: 5%; line-height: 50%;
					 border: 1px solid #646464;

			position: relative; box-sizing: border-box; margin-left: 5%;
		
		}
		
		.bouton {
			position: relative;
			width: 100%;
			box-sizing: border-box; text-align: left;
			 background-color: #897676; font-size: 30px !important; height: 50px; padding: 20px; color: #FFFFFF; padding-top: 9px; opacity: 0.9; font-variant: small-caps;
			 font-weight: bold;
	border: 2px solid;
	font-family: WK;
	
	
	
		}

/* PARC D'ART */

	.bouton_petit_gauche_visiter {
		position: relative;	
		box-sizing: border-box;  text-align: center;
		padding: 20px; color: #FFFFFF !important; opacity: 0.9; font-variant: small-caps;
		font-weight: bold;
		border: 2px solid;
		font-family: WK;
		float: left;
		margin-bottom: 10px;
		display: inline-block; width: 49%; margin-left: 0.5% !important; float : left; background-color: #CB1D74;  font-size: 40px; height: 75px; padding-top: 3px; margin-right: 0% !important;
		line-height: 160%;
	}
	
	.bouton_petit_droite_visiter {
		position: relative;	
		box-sizing: border-box;  text-align: center;
		padding: 20px; color: #FFFFFF !important; opacity: 0.9; font-variant: small-caps;
		font-weight: bold;
		border: 2px solid;
		font-family: WK;
		margin-bottom: 10px;
		display: inline-block; width: 49%; float : left; background-color: #CB1D74;  font-size: 40px; height: 75px; padding-top: 3px;
		float: right !important; margin-right: 0.5% !important; margin-left: 0% !important;
		line-height: 160%;
	}
		
		.bouton_petit_droite_scolaires {
			position: relative;
			
			box-sizing: border-box;  text-align: center;
			  padding: 20px; color: #FFFFFF !important; opacity: 0.9; font-variant: small-caps;
			 font-weight: bold;
	border: 2px solid;
	font-family: WK;
	float: left;
	margin-bottom: 10px;
	
	 display: inline-block; width: 49%; margin-right: 0.5%; font-size: 25px; height: 75px; padding-top: 3px;
	 float : right;  background-color: #5771c3;
	 line-height: 250%;
		}		

		
		
		.video { position: relative; height: 70%; width: 100%;
}

	/* EVENEMENTS ARTISTIQUES (PETIT) */
	.bouton_petit_gauche_actualites {
		position: relative;	box-sizing: border-box;  text-align: center; padding: 20px; color: #FFFFFF !important; opacity: 0.9; font-variant: small-caps; font-weight: bold; border: 2px solid;
		font-family: WK; float: left; margin-bottom: 10px; display: inline-block; width: 49%; margin-left: 0.5%; float : left; background-color: #306889;  font-size: 25px; height: 75px; padding-top: 3px;
		line-height: 250%;
	}
	.bouton_petit_droite_newsletter {
		position: relative; box-sizing: border-box;  text-align: center; padding: 10px; color: #FFFFFF !important; opacity: 0.9; font-variant: small-caps; font-weight: bold; border: 2px solid;
		font-family: WK; float: left; margin-bottom: 10px; display: inline-block; width: 49%; margin-right: 0.5%; font-size: 25px; height: 75px; padding-top: 3px; float : right;  background-color: #b2ac75;
		line-height: 250%;
		
	}
	/* VISITER */
	
		.bloc_calendar {
			position: relative; display: inline-block; width: 100%; box-sizing: border-box; border: 1px solid;
			padding: 25px; margin-bottom: 0px; background-color: #E3E0E9;
			font-size: 20px; font-family: WK; letter-spacing: 0.7px; color: #245B79;
		}
.texte_calendar {
			display: inline-block; width: 100%; box-sizing: border-box;
			padding-left: 10px;
			font-size: 30px; text-align: left;
		}
		.calendar_months {
			display: inline-block; width: 100%; float: left; box-sizing: border-box; overflow: auto;
		}
		
		.calendar {
			display: inline-block; text-align: justify; float: left; box-sizing: border-box; font-family: WK; font-size: 25px; padding-right: 20px; width: 100%; color: #FFFFFF; margin-top: 5%;
		}
		
		
		
		.bloc_acces {
			position: relative; width: 100%; box-sizing: border-box;
			padding: 40px; padding-top: 20px; overflow: hidden;
			text-align: left;  color: #245B79; font-size: 30px; font-family: WK; letter-spacing: 0.7px; 
			background-color: #E3E0E9; border: 1px solid;
		}
		
		.titre {
	font-size: 35px; font-variant: small-caps; font-weight: bold;

	}
	
	.titre_acces {
	display: inline-block; font-size: 35px; font-variant: small-caps; font-weight: bold; margin-right: 20px; text-align: left;
	}
		
		/* SCOLAIRES (petit) */
		
		.tableau { position: relative; width: 100%; background-color: #FFFFFF; font-family: WK; font-size: 40px;
	}
	
		/* NEWSLETTER (petit) */
	.bouton_valider { display: block; background-color: #b2ac75; width: 50%; color: #FFFFFF;
		font-family: WK; margin-top: 10px; font-weight: bold; margin-left: auto; margin-right: auto;
		height: 50px; font-size: 25px;}
	
	
/* VENTE D'OBJETS D'ART (petit) */
	.bouton_petit_droite_commandes {
		position: relative; box-sizing: border-box;  padding: 20px; color: #FFFFFF !important; opacity: 0.9; font-variant: small-caps; font-weight: bold; border: 2px solid;
		font-family: WK; margin-bottom: 10px; display: inline-block; padding-top: 3px; float : right; background-color: #897676;
		background-color: #897676;
		text-align: center; 
		width: 49%; font-size: 25px; height: 75px; margin-right: 0.5%;
		line-height: 250%;
	}
	
	/* COMMANDES */
	
	.bouton_petit_gauche_equipe {
		position: relative; box-sizing: border-box;  text-align: left; padding: 20px; color: #FFFFFF !important; opacity: 0.9; font-variant: small-caps; font-weight: bold; border: 2px solid;
		font-family: WK; float: left; margin-bottom: 10px; display: inline-block; padding-top: 3px; background-color: #897676;
		width: 49%; font-size: 25px; height: 75px; margin-left: 0.5%;
		line-height: 250%;
	}

	
	/* SECTION PARC D'ART */
	
		.parc_art {
			width: 100%; display: inline-block; position: relative; padding-bottom: 30px;
			font-size: 60px; letter-spacing: 2px; font-family: CurlyStars;  text-align: center; 
		}
		
		.titre_navig {
width: 100%; display: inline-block; position: relative; padding-bottom: 30px;
			font-size: 70px; letter-spacing: 2px; font-family: CurlyStars;  text-align: center; 		
}
		
		
		
		.grand_cadre {
			display: inline-block; position: relative; width: 90% !important; 
			box-sizing: border-box; font-family: WK; text-align: justify; padding: 25px;
			border-radius: 0em !important;
		}
		
.block_in_page {
	width: 90% !important; margin-left: 5% !important;
}

		.grand_cadre_ateliers {
			display: table; height: 60%; position: relative; width: 100%; top: 80px;
		}
		
		.auteur {
			display: inline-block; position: relative; width: 60%; height: 40px; float: left;
			margin-left: -60%;  
			text-align: left; font-size: 15px; font-family: WK; letter-spacing: 0.7px; 
		}
		
		.images_parc_art {
			position: relative; width: 100%;
		}
		
		.texte {
			width: 100%; position: relative; font-size: 40px;
		}
		
		.images_galerie {
			display: none; position: relative; width: 100%;
		}
		
		.texte_galerie {
			width: 100%; left: 0%; position: relative; font-size: 40px;
		}
		
		.images_ateliers {
			position: relative; width: 100%;
		}
		
		.texte_ateliers {
			width: 100%; left: 0%; position: relative; font-size: 40px;
		}
	
	.taille_panneau {height: 90px;}
	
		.efface_grand {
	display: inline-block !important;
	}
	.efface_petit {
	display: none !important;
	}
	


	.petit_texte {
font-size: 30px;
}
	
	.taille_basique {
	font-size: 40px;
	}
	
	
	.bloc_general {
		font-family: CurlyStars; font-size: 50px; position: relative; top: 150px; left: 10%; text-align: center; width: 80%; box-sizing: border-box;
		}

		.bouton_video {
	position: relative;
	margin-top: 50px;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	background-color: #4C9ECA;
	padding: 20px;
	color: #FFFFFF;
	font-size: 40px;
	font-variant: small-caps;
	font-weight: bold;
	border: 2px solid;
	font-family: WK;
	opacity: 0.9;
	letter-spacing: 0.7px;
	}
		
	.bouton_attractions {
	position: relative;
		margin-top: 5%;
		width: 100%;
		box-sizing: border-box;
		text-align: center;
		background-color: #ADA3AE;
		padding: 20px;
		color: #FFFFFF;
		font-size: 40px;
		font-variant: small-caps;
		font-weight: bold;
		border: 2px solid;
		font-family: WK;
		opacity: 0.9;
	}
		
		.choix_attract {
	position: absolute; width: 100%; left: 0%; top: 0%; padding-top: 120px; padding-bottom: 50px; font-family: CurlyStars; font-size: 50px; text-align: center; letter-spacing: 0.7px; background-color: #FFFFFF; opacity: 0.9;
	}
		
		.desc_attra {
	background-color: #FFFFFF; border: 0px solid; font-family: WK;
	padding: 25px; position: absolute; left: 0%; width: 100%; top: 450px; font-size: 40px; line-height: 200%; box-sizing: border-box; opacity: 0.9;
	}
		
	.bouton_visiter {
	position: relative;
		margin-top: 50px;
		width: 100%;
		box-sizing: border-box;
		text-align: center;
		background-color: #CB1D74;
		padding: 20px;
		color: #FFFFFF;
		font-size: 40px;
		font-variant: small-caps;
		font-weight: bold;
		border: 2px solid;
		font-family: WK;
		opacity: 0.9;
	}
		
		
		
		
		.region {
		font-size: 40px; position: relative; width: 100%; text-align: center; display: inline-block; font-weight: normal !important;
			top: -75px;
		}

		
		.balade {
		top: -20px;
		position: relative;
		}
		
		
	
	.twitter {
		float: right; height: 70%; top: 17%; position: relative;  border: 2px solid #000000; padding: 5px; box-sizing: border-box;
	}
	
	.facebook {
	margin-right: 10px; float: right; height: 70%; top: 17%; position: relative;  border: 2px solid #000000; padding: 5px; box-sizing: border-box;
	}
	
	.logo {
 height: 80%;
 position: relative;
 top: 10%;
 margin-left: 5px;
 float: left;
}







.bloc_texte {
	position: relative; top: 100px; width: 100%; box-sizing: border-box; font-family: WK; z-index: 0; font-size: 30px; color: #245B79; padding: 25px; padding-top: 50px; padding-bottom: 50px;
	}
	
	.bloc_recrutement {
		position: relative; top: 100px; width: 100%; box-sizing: border-box; font-family: WK; z-index: 0; font-size: 30px; text-align: justify; color: #245B79; padding: 50px; padding-bottom: 50px; opacity: 1; border: 1px solid;
opacity: 0.9;
		}
	

	
	
	
	

	
	
	
	
	
	.bloc_plan {
	width: 100%; box-sizing: border-box;
	}
	
	.texte_acces {
		display: inline-block; width: 100%; font-size: 30px; text-align: justify; margin-top: 20px;
	}
	
	



.adresse {
		display: inline-block; font-weight: bold; font-size: 30px;
	}
	

	
	.fond_petit {
	background-color: #E3E0E9; opacity: 0.7; position: fixed; top: 0px; left: 0px; width: 100%; height: 100%;
	}
	
	


	
	.texte_parc_petit {
		display: block;
		margin-bottom: 50px;
	}
	
	.actus_block {
		opacity: 0.9; font-family: WK; text-align: justify;
	}
	
	.actus {
		width: 100%; border-right: 1px solid; box-sizing: border-box; float: left; padding-bottom: 1%; padding-left: 4%; padding-right: 4%; height: 100%;
	}
	
	.menu_actus {
		width: 30%; float: right; height: 100%; display: none;
	}


	
	.text_actus {
		font-size: 30px; line-height: 175%;
	}

	.bloc_cata {
		width: 100%; display: inline-block; background-color: #FFFFFF; position: relative; box-sizing: border-box; border: 1px solid; font-size: 25px; padding: 1%;
	}
	
	.cherche_cata {
		width: 100%; font-size: 30px !important;
	}
	
	select {
		font-size: 30px;
	}
	
	.image_cata {
	width: 48%; height: 60%; margin-left: 1%; margin-right: 1%; margin-top: 1%; margin-bottom: 1%; float: left; cursor: pointer; text-align: right; box-sizing: border-box; font-family: WK;
	}
	
	.text_cata_det {
		width: 100%; height: 100%; padding: 2%; box-sizing: border-box; text-align: center; font-size: 25px;
	}
	
	.item_petit {
		max-height: 80%;
	}
	
	.image_cata_det {
		display: inline-block; width: 100%; max-height: 100%; box-sizing: border-box; text-align: center; padding: 2%;
	}
	
	.itemimgpetit {
		height: 300px !important;
	}

	.bouton_mobile {
		height: 100px !important; padding: 40px !important;
		width: 92% !important; box-sizing: border-box; font-size: 40px !important;
	}

	.apear_mobile {
		display: block !important;
	}

	.apear_inline_mobile {
		display: inline-block !important;
	}

	.disapear_mobile { display: none !important;}

	.title_cat_mobile {
		font-size: 1em !important; padding-top: 30px !important; padding-bottom: 30px !important;
		 line-height: 125%;
	}

	.bottom_page_text_mobile {
		font-size: 35px !important; padding-left: 20px; padding-right: 20px;line-height: 150%;
	}
	.panier_ico {
		position: fixed; right: 25px; top: 25px; width: 90px; z-index: 100;
		height: 90px; background-color: white; z-index: 10; border: 1px solid;
		border-radius: 30em;padding: 20px; padding-top: 13px;  box-sizing: border-box; text-align: center;
		z-index: 110;  font-size: 30px; color: black !important; display: block;
	}
}





