@charset "utf-8";
/* CSS Document */

body{
	background: url(../images/bck-clr.jpg) no-repeat;
	
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	color: #363638;
}
.bck_decal{

}

a{
	text-decoration:none;	
}

h1, .h1-like, h3, .header2{
	
	font-family: 'Mr De Haviland', cursive;
	color: #7c3684;
	font-size: 40px;
	line-height: 30px;
	text-align:left;
	padding-top: 10px;
}
h2{
	font-size: 18px;
	color: black;	
	color: #c90d7a;
}
h3{
	font-size: 30px;
	margin-bottom: 10px;
}

.tb_ombre_border{
	-moz-box-shadow: 0 0 5px #ccc;
	-webkit-box-shadow: 0 0 5px #ccc;
	box-shadow: 0 0 5px #ccc;
	border: 6px solid #fff;	
}

.red{
	color: red;	
}
.rose{
	color: #c90d7a;
}
.bck-rose{
	background-color: #c90d7a;
	color: white;
}

/* HEADER */

header{
	overflow:hidden;
	
	position:relative;
}
#header_small{
	overflow:hidden;
	position:relative;
}

#membres{
	width: 179px;
	height: 75px;
	background: url(../images/acces_bck.png) no-repeat;
	position:absolute;
	right: 20px;
	top:0;
	padding-top: 20px;
	text-align:center;
	padding-right: 20px;
}


/* NAV */

#menuBck{
	position:absolute;
	background-color: #c90d7b;
	height: 71px;
	width: 30%;
	z-index: 600;
}

nav{
	position:relative;
	background:url(../images/menu_bck.png) no-repeat right;
	height: 71px;
	width: 950px;
	float:left;
	font-weight: bold;
	padding-top: 20px;
	z-index: 610;
}

nav ul{
	list-style: none;
	margin:0;
	padding:0;
}
nav li{
	float:left;
	margin-right: 20px;
}
nav a{
	color: white;
}
nav a:hover{
	color: #ec56ad;
}

#sidr-menu-bt{
	display:none;
	background: url(../images/bt-sidr.jpg) center no-repeat;
	background-color: #c90d7b;
	padding: 3px;
	width: 50px;
	height: 50px;
}
.sidr ul li.membres{
	background-color:#f5c105;	
}
.sidr ul li.membres a{
  color: #363638;
}

/* /NAV */

/* /HEADER */


/* ZONE LOGO */

#zone_logo,#zone_logo2{
	position:relative;
	width: 1140px;
	margin-left:auto;
	margin-right:auto;
}
#logo2{
	text-align: center;
	padding-top:100px;
	height: 600px;
	z-index: 100;
}
#logo2 img{
	height: 100%;
	padding-bottom: 15px;
}
#logo{
	position:absolute;
	top: 420px;
	z-index: 500;
}
#logo img{
	width: 100%;
}
#logo_haut{
	margin-top: 50px;
	text-align: center;
	background-color: red;
	max-height: 400px;
}
#danse_classique{
	position:absolute;
	left: -150px;
	top: 200px;
	z-index: 1001;
}
#danse_hiphop{
	position:absolute;
	top: 92px;
	center: 0px;
	z-index: 1000;
	
}
#danse_hiphop img{
	height :355px;
	width : 267px;
}
#danse_moderne{
	position:absolute;
	top: 40px;
	right:-40px;
	
}

/* /ZONE LOGO */


/* TEASER */
.teaser{
	background-color: #000;
}
/* /TEASER */


/* CENTRE */

#centre{
	text-align:justify;
	z-index: 200;
	position: relative;
}

.big_bloc_border_top{
	width: 100%;
	height: 50px;
	background:url(../images/border-top-big.png) no-repeat;
	z-index:30;
	margin-top: -40px
}
.big_bloc{
	width: 100%;
	background-color: white;
	padding: 0 30px 0px 30px;
	overflow:hidden;	
}
.big_bloc_border_bottom{
	width: 100%;
	height: 40px;
	background: url(../images/border-bottom-big.png) no-repeat;
	margin-bottom: 50px;
}

.small_bloc_border_top{
	width: 100%;
	height: 28px;
	background:url(../images/border-top-small.png) repeat-x;
}
.small_bloc{
	width: 100%;
	background-color: white;
	padding: 0 30px 10px 30px;
	height: 200px;
	overflow:hidden;
}
.small_bloc_border_bottom{
	width: 100%;
	height: 22px;
	background: url(../images/border-bottom-small.png) repeat-x;	
}
.small_bloc ul{
	list-style:none;
	margin:0;
	padding:0;	
}
.small_bloc.gMap{
	padding: 0 20px 0 20px;
}
.small_bloc_tab, .small_bloc_tab td{
	margin:0 !important;
	padding:0 !important;
	height:auto !important;
}
.small_bloc_tab .logo{
	width: 25px;
	height:20px;
	float:left;
}
.small_bloc_tab .logo img{
	height:100%;	
}


/* /CENTRE */

#centre a{
	color: #7c3684;	
}
#centre a:hover{
	color: #66d9fa;	
}

/* DISCIPLINES */
.discipline{
	background-color:#E8E8E8;
	padding: 10px;
	text-align:center;
	margin-bottom: 15px;
}
.discipline .tb{
	height: 150px;
	overflow:hidden;
}
.discipline .tb img{
	width: 100%;
	transition: all .2s ease-in-out;
}
.discipline .tb img:hover{
	transform: scale(1.2);
	opacity:0.8;
}
.discipline h3{
	margin: 10px;
	margin-bottom:0;
	color: #363638;
	font-size: 28px;
}
.discipline .details{
	text-align:justify;
	display:none;	
}
.disciplines_box,
#membres_login{
	background: white;
	padding: 20px 30px;
	text-align: left;
	max-width: 900px;
	margin: 40px auto;
	position: relative;
	text-align:justify;
}
#membres_login{
	max-width: 500px;
	font-size: 1.2em;	
}
#membres_login label{
	width:100%;
	text-align:center;
}
#membres_login input{
	width:100%;
	margin-top: 10px;
	height: 35px;
	padding: 5px;
	border: 1px solid #c90d7a;
}
#membres_login input[type="submit"]{
	border:none;
	background-color: #7c3684;
	color: white;
}



.table_disciplines{
	margin-top: 20px;
}
/* /DISCIPLINES */

/* HORAIRE */

#horaire{
	color: white;
}

tr.rose, tr.rose td.jour {
	background-color:#ffd1ec;
	color: #c90d7a;
}
tr.rose:hover{
	background-color:#c90d7a;
	color:#ffd1ec;
}

tr.bleu, tr.bleu td.jour {
	background-color:#eb98f4;
	color: #7c3684;
}
tr.bleu:hover{
	background-color:#7c3684;
	color: #fff;
}

td{
	border:  2px solid white;	
}

tr.white{
	 background-color:#fff;
	 height: 20px;
}
tr.white td{
	 border-left: 1px solid white;
	 border-right: 1px solid white;
}
/* /HORAIRE */


/* PROFS */
.prof{
	background-color:#E8E8E8;
	padding: 10px;
	margin-bottom: 15px;
	overflow:hidden;
}
.prof .tb{
	height: 220px;
	overflow:hidden;
	float:left;
	width: 50%;
	margin-right: 20px;
}
.prof .tb img{
	width: 100%;
	transition: all .2s ease-in-out;
}
.prof .tb img:hover{
	transform: scale(1.1);
	opacity:0.8;
}
.prof h3{
	margin: 0px;
	margin-bottom:10px;
	color: #363638;
	font-size: 28px;
}
.prof .details{
	text-align:justify;
	float:left;
	width: 45%;
}

/* /DISCIPLINES */

/* STAGES */
.popup-gallery{
	margin-top: 20px;
	overflow:hidden;	
}
.popup-gallery .tb{
	overflow:hidden;
	float:left;
	margin: 10px;
}
.popup-gallery img{
	width: 183px;
	transition: all .2s ease-in-out;
}
.popup-gallery img:hover{
	transform: scale(1.1);
	opacity:0.8;
}
/* / STAGES */

/* AGENDA */
.agenda{
	overflow:hidden;
	margin-bottom: 10px;
	border-bottom: 1px solid #BDBDBD;
	padding : 20px 10px 20px 10px;
}
.agenda .vignette{
	width: 30%;
	max-height: 200px;
	overflow:hidden;
}
.agenda .button, .fiche .button, .btnrose{
	background: #c90d7a;
padding: 10px 20px;
color: #fff !important;
}
.agenda .button:hover, .fiche .button:hover, .btnrose:hover{
	background-color: #7c3684;
}
.btnrose{
	display: flex;
	width: fit-content;
	text-align: center;
}
.h2bouton{
	display: flex;
	justify-content: center;
}
.agenda .image2022{
	width: 200px;
height: 200px;
object-fit: cover;
}
.agenda .image2023{
	width: 200px;
height: 200px;
filter: brightness(0) saturate(100%) invert(19%) sepia(98%) saturate(3312%) hue-rotate(311deg) brightness(78%) contrast(104%);
object-fit: contain;
}
/* /AGENDA */

/* GALERIES */
.galerie{
	margin-top: 20px;	
}

.galerie .galTitle{
	cursor:pointer;
	width: 100%;
	background-color:#E8E8E8;
	padding:5px;
	clear:both;
}
.galContenu{
	display:none;
}
.galerie .tb{
	overflow:hidden;
	float:left;
	margin: 10px;
}
.galerie img{
	width: 100px;
	transition: all .2s ease-in-out;
}
.galerie img:hover{
	transform: scale(1.1);
	opacity:0.8;
}
/* /GALERIES */

/* FORMULAIRE CONTACT */

.contact{
	margin-left:2px;
}
.contact input, .contact textarea{
	height: 30px;
	width: 100%;
	border: 1px solid #B1B1B1;
	margin-top: 5px;
	padding: 6px 6px 0 6px;
}
.contact textarea{
	height: 100px;
}

.contact input[type="submit"]{
	background-color:#c90d7a;
	border: none;
	color: white;
	font-weight: bold;
	padding-top: 2px;
	height: 38px;
}
.contact input[type="submit"]:hover{
	background-color:#7c3684;
}

/* /FORMULAIRE CONTACT */


/* FOOTER */

footer{
	background: url(../images/footer_bck.png) no-repeat;
	background-size:cover;
	margin-top: 40px;
	color: white;
	padding-top:100px;
}
footer a, footer a:hover{
	color:white;	
}
footer a:hover{
	text-decoration:underline;
}
footer h3{
	color: white;	
}
footer .col_{
	margin-bottom: 10px;
	padding-bottom: 15px;	
}

/* /FOOTER */


/* MOD NEWS */
.nouvelle{
	
}
.nouvelle .tb{
	width: 20%;
	
}
/* /MOD NEWS */



/* RESPONSIVE */

@media (min-width: 769px) and (max-width: 1024px) {
  #zone_logo {
    width: 100%;
  	}
  	#danse_classique{
		display:none;	
	}
	.small_bloc{
		height:auto;	
	}
}


@media (min-width: 481px) and (max-width: 768px) {
  /* quick reset in small resolution and less */
 	#zone_logo {
   		width: 100%;
  	}
  	#danse_classique{
		display:none;	
	}
	.small_bloc{
		height:auto;	
	}
	footer{
		padding: 120px 10px 10px 10px;
	}
	footer .col_{
		border-bottom: 1px dotted #fff;
	}

	.prof .tb{
		height:150px;
		width: 100%;
	}
	.prof .tb img{
		width: 100%;
	}
	.prof .details{
		float: none;
		width: 100%
	}
	
	.agenda .vignette, .agenda .vignette img{
		width: 100%;	
	}
	.agenda .details{
		clear:both;
		float:left;
		margin-top: 10px;
	}
	

}

@media (max-width: 480px) {
   /* quick reset in small resolution and less */
	#zone_logo {
    	width: 100%;
  	}
	#danse_moderne, #danse_classique{
		display:none;	
	}
	.small_bloc{
		height:auto;	
	}
	footer{
		padding: 150px 10px 10px 10px;
	}
	footer .col_{
		border-bottom: 1px dotted #fff;
	}
	.popup-gallery img{
		width: 100%;
	}
	
	.prof .tb{
		height:150px;
		width: 100%;
	}
	.prof .tb img{
		width: 100%;
	}
	.prof .details{
		float: none;
		width: 100%
	}
	
	td, table{
		border:none !important;
		height:auto;
		margin:0;
	}
	 tr.rose, tr.bleu{
		border-top: 2px solid white;
	}
	td.jour{
		border-bottom: 2px solid white !important;
		text-align:center;
	}
	td.nomCours{
		font-weight: bold;
		text-transform: uppercase;	
	}
	
	.agenda .vignette, .agenda .vignette img{
		width: 100%;	
	}
	.agenda .details{
		clear:both;
		float:left;
		margin-top: 10px;
	}
	
	.contact{
		margin-top: 30px;
		background-color: #E8E8E8;
		padding: 5px;
	}
}

/* MENU SLIDE */
#sidr{
	display: none;
}
@media (max-width: 1150px) {
	#sidr-menu-bt{
		display: block !important;
	}
	#sidr{
		display: block;
	}
	#menu, #menuBck, #membres{
		display:none;	
	}
}



/* /MENU SLIDE */


/* /RESPONSIVE */


/*NEW GUI*/
.pt1{
	padding-top: 20px;
}
/*Renseignement*/
.rens .gal{
	display: grid;
}
.rens a{
	color: #c90d7a !important;
}
.rens a:hover{
	color : #7c3684 !important;
}
/*Footer*/
footer p a .icon{
	width: 30px;
	height: auto;
	filter: invert(1);
}
footer .col_{
	display: grid;
}
footer .col_ .icones{
	display: flex;	
} 
footer .col_ .icones p{
	margin-top: 0px;
	margin-right: 5px;
}
footer .copyright{
	text-align: center;
	padding-bottom: 10px;
}