/* @import url(debug.css);	*/
* {
	padding: 0px;
	margin: 0px;
	border-color: #888;
	border-style: none;
	border-width: 0px;
	box-sizing: border-box;
}

body {
	color: black;
	background-color: #86b1e7;
	text-align: center;
	font-family: Verdana, sans-serif;
	font-family: Trebuchet MS, sans-serif;
	font-size: 16px;
	background: url(images/CDAMTT_Fond_2025.png) top center repeat-y #FFFFFF;
}

#nationaux {
	position: absolute;
	top: 20px;
	right: 50px;
	visibility: hidden;
	z-index: 1000;
	background-color: #DDF;
	padding: 10px;
	border: 2px #888 solid;
	text-align: left;
	color: black;
}

#nationaux h2 {
	color: #008;
	font-weight: bold;
	font-size: 1em;
	text-align: left;
	text-decoration: underline;
	padding-top: 2em;
}

#nationaux h3 {
	color: #008;
	font-weight: bold;
	font-size: 1em;
	text-align: left;
	text-decoration: underline;
	padding-top: 0.9em;
	padding-left: 1.5em
}

#nationaux p {
	padding-left: 2.5em;
	padding-top: 0.4em;
}

#infotk {
	position: absolute;
	top: 20px;
	right: 50px;
	visibility: hidden;
	z-index: 1000;
	background-color: #DDF;
	padding: 10px;
	border: 2px #888 solid;
	text-align: left;
	color: black;
	width: 500px;
}
#infotk h2 {
	color: #008;
	font-weight: bold;
	font-size: 1em;
	text-align: left;
	text-decoration: underline;
	padding-top: 2em;
}
#infotk p {
	padding-left: 2.5em;
	padding-top: 0.4em;
}

#conteneur1 {
	margin-left: 10%;
	margin-right: 10%;
	text-align: left;
}
/* écran moyen */
@media screen and (max-width: 1024px) {
	#conteneur1 {
		margin-left: 0;
		margin-right: 0;
	}

}



#conteneur {
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	color: black;
	/* permet de fixer une hauteur mini sur les navigateurs modernes */
	min-height: 55em;
	/* pour obtenir le même effet sur IE, sachant que si le contenu dépasse, il
	"poussera" la hauteur en ne respectant pas la norme. On se joue de ses lacunes
	*/
	height: 55em;
	background-color: #F8F8F8;
}

/* pour rétablir le mauvais effet de height sur les nav. modernes */
html>body #conteneur {
	height: auto;
}

.clearboth {
	font-size: 1px;
	clear: both;
}

#bandeau_haut {
	text-align: left;
	color: black;
	height: auto;
}

#bandeau_haut img {
	display: block;
	width: 100%;
	height: auto;
}


/* DEFINITION DU MENU HORIZONTAL 1 */
#menuh_1 {
	text-transform: uppercase;
	text-align: center;
}

#menuh_1 ul { 
	background-color: #163669;
	box-shadow: 0px 3px 0px #aaa;
	border-width: 0px;
	border-style: solid;
	padding: 5px;
	padding-top: 10px;
}

#menuh_1 li { /*	border-bottom: 1px solid #11E;*/
	display: inline;
	list-style: none;
	padding-left: 1em;
	padding-top: 0.4em;
}

#menuh_1 p {
	display: inline;
}

#menuh_1 a {
	text-decoration: none;
	color: #FFF;
	font-size: 1.0em;
	font-weight: bold;
}

#menuh_1 a:hover {
	color: #F3C13E;
	/*	background-color:#8CF;*/
}

#menuh_1 a:active {
	
}

#menuh_1 a:visited {
	
}

#menuh_1 a.sel {
	color: #F3C13E;
}


/* DEFINITION DU MENU HORIZONTAL 2 */
#menuh_2 {
	padding-left: 3%;
	padding-right: 20%;
	padding-top: 2px;
}

#menuh_2 ul { 
/*	border-width: 1px 1px 0px 1px;
	border-style: solid;*/
	background-color: #163669;
	box-shadow: 2px 2px 2px #aaa;
	padding: 3px;
	padding-left: 50px;
}

#menuh_2 li { 
/*	border-bottom: 1px solid #11E;*/
	display: inline;
	list-style-type: none;
	padding-left: 1em;
	padding-top: 0.1em;
}

#menuh_2 a {
	text-decoration: none;
	font-weight: bold;
	color: #FFF;
}

#menuh_2 a:hover {
	color: #F3C13E;
}

#menuh_2 a:active {
	
}

#menuh_2 a:visited {
	
}

#menuh_2 a.sel {
	color: #F3C13E;
	/*	background-color:#8CF;*/
}

#menuh_2 img {
	float:left;
	margin: 2px;
	margin-left: 15px;
}

/* �cran moyen */
@media screen and (max-width: 1024px) {
	#menuh_2 li { 
		display: block;
	}
	#menuh_2 {
		padding-left: 2%;
		padding-right: 2%;
	}
}


/* DEFINITION DU MENU HORIZONTAL 3 */
#menuh_3 {
	padding-left: 6em;
	padding-right: 20em;
	padding-top: 2px;
}

#menuh_3 ul { /*	border-width: 1px 1px 0px 1px;
	border-style: solid;*/
	background-color: #163669;
	box-shadow: 2px 2px 2px #aaa;
	padding: 3px;
	padding-left: 50px;
}

#menuh_3 li { /*	border-bottom: 1px solid #11E;*/
	display: inline;
	list-style-type: none;
	padding-left: 1em;
	padding-top: 0.1em;
}

#menuh_3 a {
	text-decoration: none;
	font-weight: bold;
	color: #FFF;
}

#menuh_3 a:hover {
	color: #F3C13E;
	/*	background-color:#8CF;*/
}

#menuh_3 a:active {
	
}

#menuh_3 a:visited {
	
}

#menuh_3 a.sel {
	color: #F3C13E;
	/*	background-color:#8CF;*/
}

#menuh_3 img {
	float:left;
	margin: 2px;
	margin-left: 15px;
}

/* écran moyen */
@media screen and (max-width: 1024px) {
	#menuh_3 li { 
		display: block;
	}
	#menuh_3 {
		padding-left: 4%;
		padding-right: 4%;
	}
}


#voir_nat {
	width: 100%;
	margin-top: 20px;
	text-align: center;
	color: blue;
	font-weight: bold;
}

#proa {
	
}

#renc_nat {
	margin-top: 10px;
	text-align: center;
}

#evenements {
	width: 100%;
	margin-top: 20px;
	text-align: center;
	color: blue;
	font-weight: bold;
	margin-bottom: 5px;
}

#mondial {
	text-align: center;
}


#contenu #img_cd06 {
	width: 270px;
/* 	height: 48px; */
	margin: 1em 3em;
}


#contenu #img_msjs {
	width: 225px;
/* 	height: 156px; */
    margin: 1em 3em;
}

#contenu #img_ans {
    width: 225px;
    margin: 1em 3em;
}

#contenu {
	padding: 0px;
	color: black;
	background-color: #F8F8F8;
	/*	border-style: solid;
	border-width: 1px;*/
	min-height: 30em;
	/* pour obtenir le même effet sur IE, sachant que si le contenu dépasse, il
	"poussera" la hauteur en ne respectant pas la norme. On se joue de ses lacunes
	*/
	height: 30em;
}

/* pour rétablir le mauvais effet de height sur les nav. modernes */
html>body #contenu {
	height: auto;
}

#contenu h1 {
	color: #008;
	font-weight: bold;
	font-size: 1.0em;
	text-align: center;
	margin-top: 3px;
	padding-top: 1em;
	padding-bottom: 2em;
	text-transform: uppercase;
	
}

#contenu h2 {
	color: #008;
	font-weight: bold;
	font-size: 1.0em;
	text-align: left;
	padding-top: 2em;
	padding-left: 5%;
	padding-bottom: 0.4em;
	text-transform: uppercase;
	
}


#contenu h1 + h2 {
		padding-top: 0;
}

#contenu h3 {
	color: #008;
	font-weight: bold;
	font-size: 1.0em;
	text-align: left;
	padding-top: 1.2em;
	padding-left: 6%;
	padding-right: 10%;
	padding-bottom: 0.4em;
}
#contenu h2 + h3 {
		padding-top: 0.2em;
}


#contenu h4 {
	font-weight: bold;
	font-size: 1em;
	text-align: left;
	text-decoration: underline;
	padding-top: 1em;
	padding-left: 7%;
	padding-right: 10%;
}
#contenu h3 + h4 {
		padding-top: 0.2em;
}

#contenu p.std {
	padding-top: 0.4em;
	padding-left: 7%;
	padding-right: 5%;
}

#contenu img {
    box-shadow: 5px 5px 10px #666666;
    margin: 5px;
}
#voeux {
    text-align: center;
    margin: 30px auto 0px;
}
#voeux img{
    width: 40%;
}
/* écran moyen */
@media screen and (max-width: 1024px) {
    #voeux img{
        width: 40%;
    }
}
/* petit écran */
@media screen and (max-width: 750px) {
    #voeux img{
        width: 90%;
    }
}


#contenu p.der_modif {
	padding-top: 2em;
	padding-bottom: 2em;
	font-style: italic;
	font-size: 1em;
	visibility: hidden;
}

#contenu table {
	border-style: solid;
	border-width: 1px;
	border-collapse: collapse;
}

#contenu table.forme {
	border-width: 0px;
}

#contenu caption {
	color: #12E;
	font-weight: bold;
	font-size: 1em;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 10px;
	margin: 1px;
	text-decoration: underline;
}

#contenu td {
	border-style: solid;
	border-width: 1px;
	padding: 2px 2px;
	font-size: 1em;
}

#contenu td.forme {
	border-width: 0px;
}

#contenu thead,th {
	border-style: solid;
	border-width: 1px;
	padding: 2px;
	font-weight: bold;
	text-align: center;
	color: black;
	background-color: #F0F0FF;
}

#contenu iframe {
	border: solid 1px #888;
	width: 90%;
	height: 1100px;
	margin-left: 5%;
}

#contenu ul.stdniv1 {
	padding-top: 0.2em;
	padding-left: 10%;
	padding-right: 5%;
}

#contenu ul.stdniv2 {
	padding-top: 0.2em;
	padding-left: 3%;
}

#contenu ul.stdniv3 {
	padding-top: 0.2em;
	padding-left: 3%;
}

#contenu li.stdniv1 {
	padding-top: 0.2em;
}

#bas {
	background-color: #F8F8F8;
	text-align: center;
	padding: 50px 0px 20px 0px;
	margin: auto;
}
#bas .modif {
	font-style: italic;
	font-size: 0.9em;
}

fieldset {
	margin-top: 20px;
	margin-left: 10%;
}

legend {
	border-style: solid;
	font-weight: bold;
	margin-bottom: 5px;
}

select {
	border-style: solid;
	border-width: 1px;
	margin-left: 20px;
}

/* petit écran */
@media screen and (max-width: 750px) {
    select {
        font-size: 0.8em;
    }
}
input {
	margin-left: 20px;
}

input.bouton {
	padding: 5px;
	border-style: outset;
	border-width: 1px;
}

dl {
	padding-left: 4em;
}

dd {
	padding-left: 4.5em;
}

.info_centre {
	padding-top: 0.5em;
	text-align: center;
}

.italic {
	font-style: italic;
}

.gras {
	font-weight: bold;
}
strong {
	font-weight: bold;
}

/* STYLES SPECIFIQUES AUX PAGES */ /* page d'accueil */
.datemaj {
	font-weight: bold;
	font-size: 0.8em;
	color: blue;
}

#info_inscriptions {
	background-color: #1E3E89;
	padding: 10px;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	width: 40%;
	color: #FFFFFF;
	font-weight: bold;
	border-radius: 10px;
}
#info_inscriptions a {
	color: #FFF;
}
#info_inscriptions a:hover {
	color: #CCC;
}

/* petit écran */
@media screen and (max-width: 750px) {
	#info_inscriptions {
		width: 90%;
	}
}

#facebook {
	background-color: #E8E8E8;
	width: 300px; 
	float: right; 
	border-radius: 10px;
	padding-bottom: 5px; 
	margin: 5px;
	text-align: center;
}
#facebook h2 {
	padding: 5px; 
	text-align: center;
}
#facebook iframe {
	margin: auto;
}

#calendrier_pg {
	margin: 0px; 
	width: 100%;
}
#calendrier_pg h2 {
	padding-top: 5px; 
}
#calendrier_pg iframe{
	width: 48%; 
	height: 200px;
	margin: 1%;
	margin-left: 7%;
}

/* petit écran */
@media screen and (max-width: 750px) {
	#facebook {
		display: none;
	}
	#calendrier_pg iframe{
	width: 90%; 
	}
	
}



/* Calendrier */
#cal_mois {
	margin: 20px auto;
	width: 95%;
}

#cal_mois  td {
	text-align: center;
}

#calendrier {
	margin: auto;
	width: 95%;
}

#calendrier  td {
	text-align: center;
}

#calendrier .titreweek {
	color: #990000;
	background: #FFCC99;
}

#calendrier .titrejoursferie {
	color: #000000;
	background-color: #FF8E1E;
}

#calendrier .titrevac {
	color: #990000;
	background-color: #FF9966;
}

#calendrier .champ {
	background-color: #FFFF00;
}

#calendrier .critfed {
	background-color: #CCFFCC;
}

#calendrier .stage {
	background-color: #FFCC99;
}

#calendrier .reunion {
	background-color: #99CC00;
}

#calendrier .jeunes {
	background-color: #FF6600;
}

#calendrier .tj {
	background-color: #CC99FF;
}

#calendrier .tvar {
	background-color: #FF9900;
}

#calendrier .detect {
	background-color: #CC99FF;
}

#calendrier .vet {
	background-color: #99CCFF;
}

#calendrier .intclub {
	background-color: #00CCFF;
}

#calendrier .corpo {
	background-color: #FF99CC;
}

#calendrier .bjeu {
	background-color: #FF9900;
}

#calendrier .france {
	background-color: #FF99CC;
}

#calendrier .mixte {
	background-color: #FF6600;
}

#calendrier .coupe {
	background-color: #CCFFCC;
}

#calendrier .feminin {
	background-color: #99CCFF;
}

/* statistiques */
#stat {
	margin: auto;
	width: 80%;
}

#stat td {
	text-align: center;
	font-size: 0.9em;
}

#stat .total_partiel {
	color: #008000;
}

#stat .total {
	color: #00F;
}

#stat .valeurs_totaux {
	font-weight: bold;
}

#stat caption {
	text-decoration: none;
}

.tabbord-tot {
	width: 60%; 
	margin: 2% auto; 
	height: 400px;
	border: solid black 1px
}

.tabbord-detail {
	border: solid black 1px;
	width: 46%;
	margin: 2% 2%;
	height: 400px;
	float: left;
}

/* petit écran */
@media screen and (max-width: 750px) {
	.tabbord-tot {
	    width: 96%; 
	}
	.tabbord-detail {
	border: solid black 1px;
	width: 96%;
	margin: 2% 2%;
	height: 400px;
	float: none;
}
	
}


#tbord_tot {
	margin: auto;
}

#tbord_tot td {
	text-align: left;
}

#tbord_detail {
	margin: auto;
}

#tbord_detail td {
	text-align: center;
}

#tbord_detail td.titretab {
	color: black;
	background-color: #cccccc;
	font-weight: bold;
}

#tbord_detail td.w100 {
	width: 100px;
}

#tbord_detail td.w250 {
	width: 250px;
}

#tbord_detail td.fondtab {
	color: black;
	background-color: #eeeeee;
	text-align: left;
}

#tbord_detail .separe {
	font-size: 2px
}

#tbord_detail td.forme {
	text-align: left;
	font-size: 0.9em;
}

#tbord_detail td.forme1 {
	text-align: center;
	border-width: 0px;
	font-size: 1.2em;
	width: 30px;
}

/* tableau de bord clubs */
table.tabbord {
	margin: auto;
}

table.tabbord td{
    text-align: center;
    padding: 2px;
}
table.tabbord th{
    padding: 2px 10px;
}



/* Résultats Compétitions individuelles */
table.rescf {
	margin: auto;
}

table.rescf td {
	text-align: center;
}

p.retour_haut {
	text-align: center;
	margin-bottom: 20px;
}

/* Résultats Championnat par équipes */

#champ_sel_div {
	margin: auto;
	margin-top: 20px;
	width: 70%;
}
#champ_sel_div td {
	text-align: center;
	text-decoration: underline;
	color: blue;
}

table.journee_cheq {
	float: left;
	width: 48%;
	margin: 5px;
	text-align: center;
}

#class_cheq {
	margin: auto;
	width: 60%;
}

#class_cheq td {
	text-align: center;
	padding-left: 5px;
	padding-right: 5px;
}

#class_cheq  td.col_tot {
	width: 5%;
}

/* petit écran */
@media screen and (max-width: 750px) {
	table.journee_cheq {
		float: none;
		width: 90%;
		margin: auto;
		text-align: center;
	}
	#class_cheq {
		width: 90%;
	}
	
}


/* Résultats challenge Jeunes */
table.reschj {
	margin: auto;
}

table.reschj td {
	padding: 0px 5px;
	text-align: center;
}

table.reschj th {
	padding: 0px 10px;
}

/* Cat�gories d'�ge */
#categ {
    margin: 20px auto;
    width: 60%;
}

#categ td {
	text-align: center;
}

/* Comité directeur */
table.membres {
	margin: 20px auto;
	width: 90%;
}

#commiss {
	margin: 20px auto;
	width: 90%;
}

#respepr {
	margin: 20px auto;
	width: 60%;
}

#reglements {
	margin: 20px auto;
	width: 40%;
}
/* petit écran */
@media screen and (max-width: 750px) {
	#respepr {
		margin: 20px auto;
		width: 90%;
	}

	#reglements {
		margin: 20px auto;
		width: 90%;
	}
	#categ {
	    margin: 20px auto;
	    width: 90%;
}
	
}


/* cr.php */
p.para1 {
	margin-bottom: 3px;
	margin-left: 7%;
	margin-top: 10px;
}

p.para1_fort {
	margin-bottom: 3px;
	margin-left: 7%;
	margin-top: 10px;
	font-weight: bold;
}

p.para2 {
	margin-bottom: 3px;
	margin-left: 10%;
	margin-top: 3px;
}

/* localisation_clubs.php */
#message_survol {
	text-align: center;
	font-weight: bold;
	font-style: italic;
}

.visu_club {
	font-weight: bold;
	font-size: 12px;
	color: #FF0000;
}

#divmessage_club {
	width: 40%;
	margin: 2% auto;
	text-align: center;
}



#divmessage_club .nomclub {
	color: red;
	font-weight: bold;
}

#divmessage_club .typeinfo {
	font-weight: bold;
}

#carte_club {
	margin: 2% auto;
	width: 50%;
	text-align: center;
}

/* visubdlic.php */
#visubdlic {
	width: 90%;
	margin: auto;
}

#visubdlic td {
	text-align: center;
}

/* petit écran */
@media screen and (max-width: 750px) {
	#visubdlic td, tr, th {
    font-size: 0.8em;
}

}

#visubdlic td.mute {
	color: red;
	background-color: #F8F8F8;
	font-style: italic;
}

p.debug {
	color: #FF9900
}

ul {
	
}

/* Page de suivi d'évolution de licences evol.php */

#tab_evol {
    margin: auto;
    width: 80%;
}

#tab_evol td {
    text-align: center;
}

#tab_evol caption {
    text-decoration: none;
}

.tab_recap tr:nth-child(3){
	font-weight: bold;
	color: #12E;
}
.tab_recap tr:nth-child(4){
    font-weight: bold;
    color: #12E;
}

.tab_recap1 tr:nth-child(3){
	font-weight: bold;
	color: #12E;
}

#tab_evol th.col_nom {
    width: 40%;
}

/* petit écran */
@media screen and (max-width: 750px) {
	#tab_evol {
	    width: 100%;
	}
	
	#tab_evol td, th{
	    font-size: 0.8em;
	}

}


.clignote {
  animation: clignote 1s step-start infinite;
}
/* Fait on/off net. Change 1s pour accélérer/ralentir */
@keyframes clignote {
  30% { opacity: 0; }
}