﻿/*#region BANDEAUX*/

	#milieu > div#bandeaux {
		position:relative; display:table;
		width:100%; max-width:1290px; height:450px;
		background:transparent url(/images/academie/ACA-BAN-02_BANNIERE_H450PX.jpg) no-repeat center center;
		background-size:cover;
		text-align:center;
		padding:0px; margin:20px auto 0px;
	}

		#milieu > div#bandeaux .textes {
			position:relative; display:table-cell; content:""; z-index:10;
			width:100%; height:100%;
			left:0px; top:0px;
			text-align:left; vertical-align:middle;
			padding:5% 10% 5% 10%;
		}

			#milieu > div#bandeaux .textes p {
				font-weight:400; color:white;
				margin:0px; padding:0px;
			}

			#milieu > div#bandeaux .textes p,
			#milieu > div#bandeaux .textes p * {
				transition:all 0.25s ease-out;
			}

			#milieu > div#bandeaux .textes p.titre {
				position:absolute; display:block;
				top:180px; left:3.6%;
				font-family:Anton; font-size:4rem; letter-spacing:5px;
				text-transform:uppercase;
				text-shadow:3px 3px 0px #1D3FA0;
			}

			#milieu > div#bandeaux .textes p.contenu {
				position:absolute; bottom:110px; right:5%;
				display:block;
				margin:0px; padding:0;
				width:100%; max-width:560px;
			}

				#milieu > div#bandeaux .textes p span {
					display:block;
					font-size:3.3125rem; font-weight:700; line-height:100%;
					text-shadow:0 0 8px #4776d0;
				}

					#milieu > div#bandeaux .textes p span .padel { display:inline; color:#E85A2C; }

@media all and (max-width:1000px) {
			#milieu > div#bandeaux .textes p.titre {
				top:170px;
			}
			#milieu > div#bandeaux .textes p.contenu {
				bottom:100px;
			}
}

@media all and (max-width:620px) {
			#milieu > div#bandeaux .textes p.titre {
				top:40px;
			}
			#milieu > div#bandeaux .textes p.contenu {
				bottom:40px; left:3.6%; right:auto; max-width:92.8%; text-align:center;
			}
}

/*#endregion BANDEAUX*/

/*#region PREMIERS PAS*/

	#milieu div#premiers {
		position:relative; display:table;
		width:100%; max-width:1070px;
		text-align:center;
		padding:0px; margin:46px auto 0px;
	}

		#milieu div#premiers > div {
			position:relative; display:table-cell;
			text-align:left; vertical-align:top;
		}

		#milieu div#premiers > div,
		#milieu div#premiers > div > * {
			transition:all 0.25s ease-out;
		}


		#milieu div#premiers .textes { width:67%; padding:0px 0px; }
		#milieu div#premiers .photo { text-align:right; vertical-align:bottom; }

			#milieu div#premiers .photo > span { 
				display:inline-block;
				background:url(/medias/academie/coach-victor.png) no-repeat center center; background-size:cover;
				width:100%; max-width:347px; aspect-ratio:347/302;
				border-radius:16px; 
			}


			#milieu div#premiers .textes p {
				display:block;
				font-weight:400; color:#1D3FA0;
				margin:0px; padding:0px;
			}

			#milieu div#premiers .textes p.titre { font-family:Anton; font-size:2.5rem; }

			#milieu div#premiers .textes p.soustitre { font-size:2.3125rem; font-weight:700; color:#E85A2C; }

			#milieu div#premiers .textes p.contenu { font-size:1.4375rem; font-weight:700; margin:20px 0 0 0; padding:0 4.187%; }

				#milieu div#premiers .textes p span { display:block; padding-top:10px; }

				#milieu div#premiers .textes p.contenu .inclut { font-size:2.3125rem; }

			#milieu div#premiers .textes p.note { font-family:Nunito; font-size:1.75rem; font-weight:700; color:#E85A2C; margin:20px 0 0 0; padding:0 4.187%; }

			#milieu div#premiers .textes .vignette { position:absolute; top:30px; right:30px; }


@media all and (max-width:800px) {
	#milieu div#premiers {
		display:block;
	}
		#milieu div#premiers > div {
			display:block;
			width:100%;
		}

		#milieu div#premiers .textes {
			width:100%;
		}
			#milieu div#premiers .textes p.contenu .inclut {
				padding-top:0;
			}

		#milieu div#premiers .photo {
			margin-top:16px;
			text-align:center;
		}
			#milieu div#premiers .photo > span {
				width:100%; max-width:347px;
			}
}

@media all and (max-width:450px) {
	#milieu div#premiers .textes p.contenu, #milieu div#premiers .textes p.note {
		padding: 0 1.395666666666667%;
	}
}

/*#endregion PREMIERS PAS*/

/*#region JEUNES ADULTES*/

	#academie {
	}

		#academie .titre {
			margin:60px auto 30px auto;
			font-size:2.6875rem; font-weight:700; color:#1D3FA0;
			text-align:center;
		}

	#jeunesadultes {
		position:relative; display:table;
		width:100%; max-width:1070px;
		text-align:center;
		padding:0px; margin:0 auto;
	}

		#jeunesadultes > .onglets {
			position:relative;
			margin-left:8px;
		}

			#jeunesadultes > .onglets .onglet {
				display:inline-block; z-index:2;
				min-width:205px;
				padding:16px 22px 14px 22px; margin:0px 5px 0px 0px;
				border-radius:16px 16px 0 0;
				border:solid 2px #F05A24; border-bottom:none;
				font-size:1.5625rem; font-weight:700; color:#F05A24; line-height:1; text-transform:uppercase;
				text-shadow:2px 2px 0 rgba(0, 0, 0, 0.18);
				text-align:center;
				cursor:pointer;
				transition:all 0.3s ease-in-out;
			}

			#jeunesadultes > .onglets .onglet.sel { 
				border-color:#1D3FA0; border-bottom:none; 
				background-color:#1D3FA0; color:white; 
				transform:translateY(1px); -ms-transform:translateY(1px); -webkit-transform:translateY(1px); 
			}

		#jeunesadultes > .contenu {
			display:none;
			z-index:1;
			padding:2.80373831775701% 1.869158878504673% 1.869158878504673% 1.869158878504673%;
			border:solid 2px #1D3FA0;
			border-radius:16px 16px 10px 10px;
			background-color:#1D3FA0;
			transition:all 0.3s ease-in-out;
		}
		#jeunesadultes > .contenu.sel { display:block; }

			#jeunesadultes > .contenu .intro {
				font-size:1.3125rem; font-weight:400; color:white;
				padding:0px 0px 0px 0px;
			}
				#jeunesadultes > .contenu .intro > p {
					margin-top:15px;
				}

				#jeunesadultes > .contenu .intro .niveau {
					display:inline-block;
					font-weight:700; color:#F05A24;
					margin-top:0px; padding:4px 10px;
					border-radius:12px;
					background-color:white;
				}
				#jeunesadultes > .contenu .intro .referent span { font-weight:700; }
				#jeunesadultes > .contenu .intro .citation { font-size:1.4375rem; font-style:italic; }

			#jeunesadultes > .contenu .tableau {
				padding:10px 0px 0px;
			}

				#jeunesadultes > .contenu .tableau .colonne {
					padding:10px 10px;
					font-size:1.1875rem; font-weight:400; color:white;
				}

				#jeunesadultes > .contenu .tableau .colonne::before {
					display:block;
					font-size:1.3125rem; font-weight:700; color:#F05A24; text-transform:uppercase;
					padding:0px 0px 1px 0px; margin:0px -10px 20px -10px;
					border-bottom:solid 1px #F05A24;
				}
				#jeunesadultes > .contenu .tableau .colonne.cours::before { content:"Cours"; }
				#jeunesadultes > .contenu .tableau .colonne.stages::before { content:"Stages"; }

			#jeunesadultes > .contenu p { margin:0px 0px 10px; padding:0px; }

			#jeunesadultes > .contenu p.cycles { margin-left:30px; line-height:175%; }

					#jeunesadultes > .contenu .tableau ul li {
						display:list-item;
						list-style:disc;
						margin:0px 0px 0px 15px; padding:0px 0px 10px 0px;
					}

				#jeunesadultes > .contenu .tableau .colonne a { font-weight:600; color:#F05A24; }
				#jeunesadultes > .contenu .tableau .colonne a:hover { text-decoration:underline; }



	#jeunesadultes .contenu .contact { /* CONTACT */
		position:relative;
		margin:0;
		transition:all 0.25s ease-out;
	}
		#jeunesadultes .contenu .contact a { /* CONTACT */
			position:absolute; right:0; top:0;
			display:inline-block;
			margin:0; padding:8px 20px;
			border-radius:24px;
			background-color:#E85A2C;
			font-size:1.25rem; font-weight:400; color:#fff;
			text-transform:uppercase;
			transition:all 0.25s ease-out;
		}
		#jeunesadultes .contenu .contact a:hover { /* CONTACT */
			color:#1D3FA0;
		}
		

@media all and (max-width:560px) {
	#jeunesadultes > .contenu {
		position:relative;
		padding-bottom:calc(1.869158878504673% + 60px);
	}

	#jeunesadultes > .contenu .contact {
		position:absolute; left:50%; bottom:2.80373831775701%;
		transform:translateX(-50%); -ms-transform:translateX(-50%); -webkit-transform:translateX(-50%);
		margin:0;
		text-align:center;
	}

	#jeunesadultes .contenu .contact a {
		position:relative; right:auto; top:auto;
		margin:0;
		white-space:nowrap;
	}
}

@media all and (max-width:450px) {
	#jeunesadultes > .onglets {
		display:flex;
		margin:0 0 -2px 0;
		gap:2px;
	}

	#jeunesadultes > .onglets .onglet {
		flex:1 1 0;
		margin:0; padding:10px 6px 9px;
		min-width:0;
		letter-spacing:0;
	}

	/* option visuelle identique à la page centres */
	#jeunesadultes > .contenu {
		border-radius:0;
	}
}

/*#endregion JEUNES ADULTES*/

/*#region PONCTUELS*/

	#ponctuels {
		position:relative; display:table;
		width:100%; max-width:1070px;
		text-align:center;
		padding:0px; margin:60px auto 0px;
	}

		#ponctuels .titre {
			font-size:2.6875rem; font-weight:700; color:#1D3FA0;
			padding-bottom:20px;
			text-align:center;
		}

		#ponctuels .tableau {
			display:table; table-layout:fixed;
			width:100%;
			background-color:#1D3FA0;
			border-radius:16px;
			border-spacing:30px;
			transition:all 0.25s ease-out;
		}

			#ponctuels .tableau > div {
				display:table-cell;
				background-color:white;
				padding:10px;
				width:25%;
				border-radius:10px;
				transition:all 0.25s ease-out;
			}

				#ponctuels .tableau > div .libelle {
					font-size:1.1875rem; font-weight:600; color:#1D3FA0;
					text-align:center;
					white-space:nowrap;
				}

				#ponctuels .tableau > div .prix {
					margin-top:10px;
					font-size:1.1875rem; font-weight:700; color:#F05A24;
					text-align:center;
				}

@media all and (max-width:700px) {
	#ponctuels .tableau {
		display:grid;
		grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px;
		padding:16px;
		background-color:#1D3FA0;
		border-spacing:0;
	}
		#ponctuels .tableau > div {
			display:block;
			width:100%;
		}
}

/*#endregion PONCTUELS*/

/*#region CENTRES*/

	#centres {
		position:relative; display:table;
		width:100%; max-width:1070px;
		text-align:center;
		padding:0px; margin:60px auto 0px;
	}

		#centres .titre {
			font-size:2.6875rem; font-weight:700; color:#1D3FA0;
			padding-bottom:20px;
			text-align:center;
		}

		#centres .tableau {
			display:table; table-layout:fixed;
			width:100%;
			background-color:#1D3FA0;
			border-radius:16px;
			border-spacing:30px;
			transition:all 0.25s ease-out;
		}

			#centres .tableau > div {
				display:table-cell;
				background-color:white;
				padding:10px;
				border-radius:10px;
				width:calc(100% / 3);
				transition:all 0.25s ease-out;
			}

				#centres .tableau > div .libelle {
					font-size:1.1875rem; font-weight:600; color:#1D3FA0;
					text-align:center;
				}

@media all and (max-width:700px) {
	#centres .tableau {
		display:grid;
		grid-template-columns:1fr; gap:16px;
		padding:16px;
		background-color:#1D3FA0;
		border-spacing:0;
	}

	#centres .tableau > div {
		display:block;
		width:100%;
	}
}

/*#endregion CENTRES*/



/*#region VIVEZ*/

	#milieu div#vivez {
		position:relative; 
		width:100%;
		text-align:center;
		padding:0px; margin:60px auto 0px;
	}

		#milieu div#vivez > img { width:100%; }


/*#endregion VIVEZ*/

/*#region TOURNOIS*/

	#milieu div#tournois {
		position:relative; display:table;
		width:100%;
		text-align:center;
		padding:0px; margin:46px auto 0px;
	}

		#milieu div#tournois > .tournoi {}

			#milieu div#tournois > .tournoi .titre {
				font-size:2.6875rem; font-weight:700; color:#1D3FA0;
				text-shadow:-4px 2px 5px rgba(0,0,0,0.4);
			}

			#milieu div#tournois > .tournoi .images { display:table; width:100%; margin-top:50px; }

				#milieu div#tournois > .tournoi .images .image { display:table-cell; vertical-align:top; }
				#milieu div#tournois > .tournoi .images .image:first-child { text-align:right; }
				#milieu div#tournois > .tournoi .images .image:last-child { text-align:left; }

/*#endregion TOURNOIS*/

/*#region STAGES*/

	#milieu div#stages {
		position:relative;
		width:100%; 
		padding:50px 40px; margin:46px auto 0px;
		background-color:#1D3FA0;
	}

		#milieu div#stages .titre { 
			position:relative; display:inline-block;
			font-size:2.6875rem; font-weight:700; color:white;
			text-transform:uppercase;
		}
			#milieu div#stages .titre::after { 
				position:absolute; display:block;
				content:url(/images/academie/raquette.png);
				top:-7px; right:-71px;
			}

		#milieu div#stages .contenu {
			position:relative; display:table;
			width:100%; margin-top:30px;
		}

		#milieu div#stages .contenu > div {
			position:relative; display:table-cell;
			text-align:left; vertical-align:top;
		}

		#milieu div#stages .contenu .photo { text-align:left; vertical-align:middle; padding-left:55px; }
			#milieu div#stages .contenu .photo img { border-radius:22px; }

		#milieu div#stages .contenu .textes { width:55%; padding:0px 0px; }

			#milieu div#stages .contenu .textes p {
				display:block;
				font-weight:400; color:white;
				margin:0px; padding:0px;
			}


			#milieu div#stages .contenu .textes p { text-align:center; }

				#milieu div#stages .contenu .textes p > span { display:block; padding-top:10px; }

				#milieu div#stages .textes p .part1 { font-weight:700; font-size:2.6875rem; }
				#milieu div#stages .textes p .part2 { font-family:Nunito; font-weight:400; font-size:2.3125rem; text-transform:uppercase; }

				#milieu div#stages .textes p .padel { display:inline; font-weight:700; color:#E85A2C; text-transform:uppercase; }

				#milieu div#stages .liens { 
					text-align:center; 
					padding:90px 0px 0px;
				}

					#milieu div#stages .liens a {
						font-family:Nunito; font-weight:700; font-size:1.375rem; color:white; 
						background-color:#E85A2C;
						padding:4px 20px 2px;
						border-radius:23px;
						text-transform:uppercase;
					}
					#milieu div#stages .liens a:hover { color:#1D3FA0; }

/*#endregion STAGES*/


/*#region PROGRAMMES*/

	#milieu div#programmes {
		position:relative;
		width:100%; max-width:1200px;
		padding:0px 0px; margin:46px auto 0px;
	}

		#milieu div#programmes .titre { 
			display:block;
			font-size:2.6875rem; font-weight:700; color:#E85A2C;
			text-transform:uppercase;
			text-align:center;
		}

		#milieu div#programmes .soustitre { 
			display:block;
			font-size:1.5625rem; font-weight:700; color:#1D3FA0;
			text-align:center;
			padding-top:40px;
		}

/*#endregion PROGRAMMES*/






/*#region RESPONSIVE*/

@media all and (max-width:929px) {

				#raccourcis > ul > li:not(.comptoir) > a::after { top:30%; }
				#raccourcis > ul > li:not(.comptoir) > a:hover::after { top:calc(-30%); }

}

@media all and (max-width:751px) {

				#raccourcis > ul > li.bar > a::after { top:70%; }
				#raccourcis > ul > li.bar > a:hover::after { top:calc(100%); }

}

@media all and (max-width:573px) {

	#raccourcis { display:none; }

}

/*#endregion RESPONSIVE*/
