﻿/*#######################################################################################*/
/*####################################          STYLE CTTL HTML5      ###################*/
/*#######################################################################################*/
<style type="text/css">
/*############################################################### */
/*############################    RESET CSS ##################### */
/*############################################################### */
* 
{
	 margin: 0;
	 padding: 0;
}
html 
{
	font-size: 100%; /* -> inutile. Utilisé uniquement pour éviter un bug de redimensionnement du texte dans Internet Explorer */
}
/*############################################################### */
/*############################    BODY     ##################### */
/*############################################################### */
body {
	width:100%;					/* Définition de la page selon la résolution de l'écran visiteur */
	margin: auto; 				/*CENTRE: Marge automatique des 4 côtés avec un centrage du bloc au milieu uniquement à l'horizontale */
	/*border-width:5px; 			Epaisseur de la bordure */
/*	border-style:dotted; 		 Style de la bordure */
/*	border-color: red;			 Couleur de la bordure */
	height:auto;
	
	background-image: url('/photo/cttl_photo/dark_blue_wallpaper.jpg');
	background-size:100% 100%;
	/*background-image: url('../images/images_adherents/fond_raquette.jpg');*/
	background-color:black; 
	font-family:"times new roman", times, serif;		/* Famille à déclarer dans le BODY */
	font-size:100%;										/* Taille des caractères à déclarer de préférence en " % " ou " em " */
	
}
/*########################################################## */
/*############################### EN-TETE ################## */
/*########################################################## */
header 
{
	width: 98%; 				/* réglage en ligne 98% soit une marge extérieure d'1% , de chaque côté et en pleine page en résolution 1024*768 */
	margin:auto;
	
/*	border: 5px solid blue;		 Couleur de la bordure de toute l'entête du CTTL*/
	height: auto;				
}

div, header
{
   	text-align:center;
}
#banniere_infos	
{		
	
	width:auto;				
	/*border: 1px solid blue;		Bordure de la section flash_entete_cttl*/
}
#infos_entete				/*aside*/
{ 				
	margin-top:9%;
	
	/*border-width:1px;
	border-style:solid; 
	border-color:blue;*/
}
#infos_entete div{			/* Pour DATE ANNIVERSAIRE AUTRE */

	display: inline-block; 
	vertical-align:	middle;   
	
	width:auto;
	height:auto;
	color:aliceblue;   	
		
	/*border-width:1px; 
	border-style:dotted; 
	border-color:red;*/
}
#date
{
	margin-right: 1%;
	font-weight: bold;
	font-size: 80%;
}
#autre
{
	margin-left: auto;
}
#anniversaire
{
	font-size:100%;
}
/*########################################################## */
/*############################### NAVIGATION  ############## */
/*########################################################## */
#barre_fixe_haut
{
 /*background-color: black;*/
 height: 79px;
}
.fixbarre_fixe_haut
{
 z-index: 9999;
 position: fixed;
 top: 0;
 /* Mise en forme */
 width: 100%; /* <-- Largeur du site */
}

nav
{
    display: inline-block;
	/*width:35%;*/
    height:auto;
   	position:absolute;
    vertical-align:top;
    /*border-width:3px; 		Epaisseur de la bordure*/
	/*border-style:dotted; 		Style de la bordure */
	/*border-color: aliceblue;	Couleur de la bordure */
}
#accueil
{
    margin-top:-45px;
    width:95px;
    height:683px;
}
#competition
{
    margin-top:-20%;
    width:165px;
    height:495px;
}
#la_vie_du_club
{
    margin-top:-45px;
    margin-left:-30%;
    
    
}
#menu_adherents
{
    margin-top:-18px;
    width:90px;
    height:595px;
}


/*###################################################################### */
/*############################### SECTION MODIFIABLE  ################## */
/*###################################################################### */

#page_salle
{
	background-color:black;
	border-width:5px; 
	border-style:outset; 
	border-color:white;
	font-size:100%;	
	font-weight: bold;
	color:white; 	
}

#page_horaires
{
	background-color:rgba(0,0,0,1);
	border-width:5px; 
	border-style:outset; 
	border-color:white;
	font-size:100%;	
	font-weight: bold; 	
}
#page_dates
{
	background-color:rgba(0,0,0,0.9);
	
	border-width:3px; 
	border-style:outset; 
	border-color:white;
	
	font-size:100%;	
	font-weight: bold; 	
}

#page_anniv
{
	background-color:rgba(0,0,128);
	border-width:3px; 
	border-style:outset; 
	border-color:white;
	font-size:100%;	
	font-weight: bold; 	
}

#fond_bleu1
{
	background-color:rgba(0,0,128);
	border-width:3px; 
	border-style:outset; 
	border-color:white;
	font-size:100%;	
	font-weight: bold; 	
}
#page_centrale

{
    display: inline-block;    
    /*border: 5px solid blue;*/
    vertical-align: top;
    color:aliceblue;
    margin:auto;
    width:53%;
    height:auto;
   /* border: 5px solid red;*/
}
article
{   
	margin:auto;
	margin-left:30px;
    height:auto;
    min-height:535px;
   	padding-top:16px;
/*    border: 1px solid	blue;*/
    /*max-width:640px;*/
}
.transparent
{
 background-color: rgba(255, 255, 255, 0.0);
 border-color: rgba(255, 255, 255, 0.0);
}
.fond_article
{
	
	margin-left:85px;
	margin-right:0px;
	border:1.5px aqua	dashed;
	padding:5px;
	margin-bottom:20px;
	background-color:black;

}
.fond_article2
{
	
	margin-left:auto;
	margin-right:auto;
	border:1.5px aqua	dashed;
	padding:5px;
	margin-bottom:20px;
	background-color:black;

}
.fond_article3
{
	
	margin-left:auto;
	margin-right:auto;
	border:1.5px aqua	dashed;
	padding:5px;
	margin-bottom:20px;
	background-color:white;

}
.fond_article_transparent
{
	
	margin-left:85px;
	margin-right:0px;
	border:2.5px aqua	;
	padding:5px;
	margin-bottom:20px;
	

}

.fond_video
{
	overflow:auto;
/*	height:538px;*/
	
	padding:0px;
	margin-bottom:20px;
	background-color:black;

}
.fond_deroul
{
	overflow:auto;
	height:538px;
	
	padding:0px;
	margin-bottom:20px;
	background-color:black;

}
.fond_deroul_fix
{
	overflow:auto;
	height:538px;
	
	
	padding:0px;
	margin-bottom:20px;
	background-color:black;

}


article img
{
	max-width:567px;
	margin-top:10px;
}
article a:hover		 
{
	color:blue; 
	text-decoration:overline;
	
}
article h1 
{
	width:350px;
	font-family:"Times New Roman", Times, serif;
	font-size:26px;
	color:black;
	border:3px solid #FFFFFF;
	padding:1px 4px;
	background-color:aqua;
	margin: auto;
	text-align:center;
	text-decoration:none;
	text-align:center;
}
article h3 {
	width:auto;
	font-family:"Times New Roman", Times, serif;
	font-size:22px;
	color:black;
	border:1px solid aqua;
	padding:1px 4px;
	background-color:yellow;
	margin: auto;
	margin-bottom:10px;
	margin-top:15px;
	margin-left:85px;
	text-align:center;
	text-decoration:none;
	text-align:center;
}
article h5 
{
	font-size:large;
	color:	aliceblue;
	border:1px solid #FFFFFF;
	padding:3px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
	margin-top:5px;
	background-color:#FF0000;
	text-align:center;
	text-decoration:none;
	text-align:center;
}
aticle p {
	width:460px;
	font-family:"Times New Roman", Times, serif;
	font-size:	medium;
	color:black;
	border:1px solid blue;
	padding:0px;
	margin-top:1px;
	margin-left:auto;
	margin-right:auto;
	background-color:white;
	text-align:center;
	text-decoration:none;
	text-align:center;
}
.noir_blanc_bordure
{
	color:black;
	font-weight: normal;
	border: 2px solid #00FFFF;
	padding: 2px 4px;
	background-color: #FFFFFF;
	margin-left: 0px;
}
.blanc_noir_bordure
{
	color: #FFFFFF;
	font-weight: normal;
	border: 2px solid #90C7FE;
	padding: 2px 4px;
	background-color: black;
	margin-left: 0px;
}
.blanc_vert_bordure
{
	color: #212121;
	font-weight: normal;
	border: 2px solid #90C7FE;
	padding: 2px 4px;
	background-color: #f9f9f9;
	margin-left: 0px;
}
.blanc_rouge_bordure
{
	color: white;
	font-weight: normal;
	border: 2px solid #00FFFF;
	padding: 2px 4px;
	background-color: red;
	margin-left: 0px;
}

.blanc_rose_bordure
{
	color: white;
	font-weight: normal;
	border: 2px solid #00FFFF;
	padding: 2px 4px;
	background-color:rgb(151, 20, 112);
	margin-left: 0px;
}

#estivales  /*image horaires estivales 630x216*/
{
	width:630px;
	height:216px;
	margin-left:0px;
	margin-top:0px;
}
#horaires	/*image horaires générales saison en cours 630x515*/
{
	width:100%;
	height:515px;
	padding-left:5px;
	padding-right:5px;
	margin-top:-13px;
}
/*############################### VIDEO ############# */
.fenetre_video
{
	width:300px;
	height:240px;
	border:	medium;
	border-bottom-color:aqua;
	border-style:groove;
		
}


/*############################### LE TENNIS DE TABLE ############# */
#le_tt {

	font-family:"Times New Roman", Times, serif;
	
	background: -webkit-linear-gradient(top,  rgba(96,108,136,1) 0%,rgba(63,76,107,1) 100%); /* Chrome10+,Safari5.1+ */
	
	overflow:auto;

   	height: 538px;
   	top: 0px;
	margin: 0px 0px 0px 0px;
	text-align: center;
	padding-left:2%;
	padding-right:2%;
	
}
#le_tt p
{
	color:white;
	font-size:12.0pt;
	font-style:italic;
}
#le_tt h2
{
	color:white;
	font-size:110%;
}
/*############################### PARCHEMIN ############# */
#parchemin 
{
	color:black;
	font-style:italic;
	
   	background-image: url('../images/images_logos/parchemin_archives1.gif'); 
   	overflow:auto;
   	height: 350px;
   	top: 0px;
   	margin: 0px 0px 0px 0px;
	text-align: center;
	padding-left:00%;
	padding-right:00%;
	height: 592px; 
}
#parchemin h2 
{
	color:black;
	font-size:24pt;
	
	
}
#parchemin span
{
	color:black;
	font-size:100%;
}

#parchemin p
{
	
	color:black;
	font-size:100%;
}
.sousligne
{
		text-decoration:underline;
}
.italique_soul
{
		font-style:italic;
		text-decoration:underline;
}

/*############################### INSCRIPTION ############# */

#inscription {
   	overflow:auto;
	height: 538px;
	
   	top: 0px;
   	border: 1px dashed #669966;
   	background: rgb(41,137,216); /* Old browsers */
	background: -moz-linear-gradient(-45deg,  rgba(41,137,216,1) 11%, rgba(30,87,153,1) 52%, rgba(125,185,232,1) 84%, rgba(125,185,232,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right bottom, color-stop(11%,rgba(41,137,216,1)), color-stop(52%,rgba(30,87,153,1)), color-stop(84%,rgba(125,185,232,1)), color-stop(100%,rgba(125,185,232,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(-45deg,  rgba(41,137,216,1) 11%,rgba(30,87,153,1) 52%,rgba(125,185,232,1) 84%,rgba(125,185,232,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(-45deg,  rgba(41,137,216,1) 11%,rgba(30,87,153,1) 52%,rgba(125,185,232,1) 84%,rgba(125,185,232,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(-45deg,  rgba(41,137,216,1) 11%,rgba(30,87,153,1) 52%,rgba(125,185,232,1) 84%,rgba(125,185,232,1) 100%); /* IE10+ */
	background: linear-gradient(135deg,  rgba(41,137,216,1) 11%,rgba(30,87,153,1) 52%,rgba(125,185,232,1) 84%,rgba(125,185,232,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2989d8', endColorstr='#7db9e8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	;
	padding-left:2%;
	padding-right:2%;
	font-family:Arial, Geneva, sans-serif;

}
/*############################### IMPRIMER ENREGISTRER ############# */


/*############################### TABLEAUX GENERAUX ############# */
table
{
	border-collapse:collapse;
	width:auto;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:5px;
	margin-top:20px;
}
caption
{
	color:white;
	padding-top:5px;
	padding-bottom:10px;
}
tr
{
	height:12pt;
	border: 1px solid black;
	border-radius:5px;

}
td
{	
	border: 1px solid black;
	background-color: #FFFFFF;
	height:10pt;
	padding-top:1px;
	padding-right:1px;
	padding-left:1px;
	color:windowtext;
	font-size:9pt;
	font-weight:400;
	font-style:normal;
	text-decoration:none;
	font-family:Arial;
	text-align:general;
	vertical-align:bottom;
	white-space:nowrap;
}
th
{
	color: windowtext;
	font-size: 11pt;
	font-weight: 700;
	font-style: normal;
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	white-space: nowrap;
	border-left-style: none;
	border-left-color: inherit;
	border-left-width: medium;
	border-right: 1.0pt solid windowtext;
	border-top: 1.0pt solid windowtext;
	border-bottom: 1.0pt solid windowtext;
	padding-left: 1px;
	padding-right: 1px;
	padding-top: 1px;
	background: lime;
}
.blanc_rouge
{
	color: white;
	font-size: 10.0pt;
	font-weight: 400;
	font-style: normal;
	text-decoration: none;
	font-family: Arial;
	text-align: center;
	vertical-align: middle;
	white-space: nowrap;
	border-style: none;
	border-color: inherit;
	background-color: #FF0000;
}
.noir_jaune
{
		color:black;
		background-color:yellow;
}
.sans_fond
{
		width:30px;
		background-color:black;
}
.sans_fond_departementale
{
		width:1px;
		background-color:black;
}
/*############################### TABLEAUX API ############# */
.api td, .api tr	/* cache la bordure noir */ 
{
	border:1px;
	background:white;	
	font-family:"times new roman", times, serif;	
	font-size:85%;	
	color:blue;
}
.api th
{
	background-color: black;
	font-family:"times new roman", times, serif;	
	font-size:100%;	
	font-weight:bold;
	color:white;
}
/*############################### TABLEAUX INSCRITS TOURNOI REGIONAL ############# */
.tournoi table
{
	border-collapse:collapse;
	width:auto;
	margin-left:auto;
	margin-right:auto;
	
}
.tournoi tr				
{
	height:12pt;
	border: 1px solid black;
	border-radius:5px;
	
	
}
.tournoi td  /*Données, participants et restantes*/
{
	font-size:71%;
	border: 1px solid black;
	background-color: #FFFFFF;
	height:10pt;
	padding-top:1px;
	padding-right:1px;
	padding-left:1px;
	color:black;
	font-weight:400;
	font-style:normal;
	text-decoration:none;
	font-family:Arial;
	text-align:general;
	vertical-align:bottom;
	white-space:nowrap;
	
}
.tournoi th /*Titres*/
{
	color: white;
	font-size:73%;
	font-weight: 700;
	font-style: normal;
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	white-space: nowrap;
	border-left-style: none;
	border-left-color: inherit;
	border-left-width: medium;
	border-right: 1.0pt solid black;
	border-top: 1.0pt solid black;
	border-bottom: 1.0pt solid black;
	padding-left: 1px;
	padding-right: 1px;
	padding-top: 1px;
	background: #2E96FE;
}
/*############################### TABLEAUX TOURNOIS EXTERNES ############# */
.noir_mauve
{
	color: black;
	font-size: 8.0pt;
	font-weight: 400;
	font-style: normal;
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	white-space: normal;
	border: .5pt solid black;
	padding-left: 1px;
	padding-right: 1px;
	padding-top: 1px;
	background: plum;
}

.noir_blanc
{
	color: black;
	font-size: 8.0pt;
	font-weight: 400;
	font-style: normal;
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	white-space: normal;
	border: .5pt solid black;
	padding-left: 1px;
	padding-right: 1px;
	padding-top: 1px;
	background: white;
}
.noir_bleu
{
	color: black;
	font-size: 8.0pt;
	font-weight: 400;
	font-style: normal;
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	white-space: normal;
	border-left: .5pt solid black;
	border-right: .5pt solid black;
	border-top: .5pt solid black;
	border-bottom-style: none;
	border-bottom-color: inherit;
	border-bottom-width: medium;
	padding-left: 1px;
	padding-right: 1px;
	padding-top: 1px;
	background: lightblue;
}
.noir_bleu_titre
{
	color: black;
	font-size: 12.0pt;
	font-weight: 400;
	font-style: normal;
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	white-space: normal;
	border-left: .5pt solid black;
	border-right: .5pt solid black;
	border-top: .5pt solid black;
	border-bottom-style: none;
	border-bottom-color: inherit;
	border-bottom-width: medium;
	padding-left: 1px;
	padding-right: 1px;
	padding-top: 1px;
	background: lightblue;
}

	
/*########################################################## */
/*############################### PIED DE PAGE ############# */
/*########################################################## */

#banniere_contact
{
	width:90%;
	margin-left:7%;
	margin-right:3%;
		
	background-color:white;
	border-width:3px; 
	border-style:outset; 
	border-color:white;
	font-size:75%;
	text-align:center;	
	font-weight: bold;
	color:black; 	
}

footer {
	height:auto;
	text-align:center;
	/*border: 1px solid blue;*/
}
footer p, footer a, img {
	
	margin:auto;	/* Marge automatique des 4 côtés avec un centrage du bloc au milieu uniquement à l'horizontale */
}
footer p
{
	width:auto; 
	height:auto;
}
.foot /*  Via css adherent connexion*/
{
	text-align:center;
	background:rgba(250, 2500, 2500, 0.9);
	width:60%;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
	margin:auto;
	padding:10px;
	margin-top:20px;
	color : black;
}
.foot a
{
	text-decoration:none;
	color:#00FF00;
}
.foot a:hover
{
	color:#000000;
}

/*############################################################################# */
/*##############################  COLONNE LATERALE GAUCHE    ################## */
/*############################################################################# */
#cadre_fond_vert
{
	background-color:rgb(250,250,250);
	border-width:7px; 
	border-style:outset; 
	border-color:white;
	font-size:100%;	
	font-weight: bold; 	
}
#gauche
{
   	display: inline-block;    
    /*border: 2px solid blue;*/
    vertical-align: top;
		
	width:22%;
    height:auto;
}
#flash_info_gauche
{
    width:auto;
    height:auto;
   /*border: 1px solid blue;*/
}
#news_partenaires
{
	display: inline-block;
    width:65%;
    border: 1px solid rgb(0,0,255);
    vertical-align: top;
    height:auto;
    background-color:black;
}
#partenaires 
{
	width:auto;
	height:auto;
}
#gauche h4, #gauche_admin h4
{
	color:yellow; 
	margin-bottom:5px;
	margin-top:0px;
	
	border-bottom:2px;
	border-bottom-color:bisque;
	border-bottom-style:dashed;

}
#partenaires h4
{
	border-top:3px;
	border-top-color:bisque;
	border-top-style:double;
}

/*############################################################################# */
/*##############################  COLONNE LATERALE DROITE    ################## */
/*############################################################################# */
#droit
{
    display: inline-block;    
    /*border: 10px solid orange;*/
    vertical-align: top;
    
   
   	max-width:19%;
   	height:auto;
}
#flash_info_droit
{
   	
	width:auto;
    height:auto;
    /*border: 1px solid blue;*/
	
}
/*#################################################################### */
/*############################### ZOOM SUR IMAGE ##################### */
/*#################################################################### */
/*Brdure des images : */
.cliches img 
{
 border:0px;
 border-style: solid;
 border-color:white;
} 
/*Dimension du div incluant des images*/
.cliches 
{
 width:182px;
 height:126px; 
 margin:0px;
 
 background-image:url('../images/images_cttl/CTTL_nv_logo_2016 [Largeur max. 1024 Hauteur max. 768].jpg');
 background-repeat:no-repeat;
 background-position:center;
 display:block;
 
} 
.cliches a 
{
 display:block;
}
.cliches a:hover 
{
 position:relative;
 color:black;
}	 
.cliches a img 
{ 
 margin:0px;
 padding:0px;
 width:169px;
 height:126px; 
}
/*Taille et position au passage de la souris sur l'image : */
.cliches a:hover img, .cliches a:focus img 
{
 position: relative;
 left:0px;
 top:-100px;
 width:670px;
 height:500px; 
 margin-top:-250px;  
 margin-left:-500%;
}


/*########################################################## */
/*############################### POLICE ################### */
/*########################################################## */
.blanc-centre {
	margin-top: 4px; /* Marge éxtérieure HAUT de 4 pixels */
	text-align: center; /* Aligne le texte au CENTRE */
	color: #FFFFFF; /* Couleur du texte en BLANC */
	font-family: "times new roman", "Arial Black", Arial, Verdana, sans-serif; /* Définition de la police avec guillemets si espace dans le nom, ET, classé par ordre de choix si le visiteur ne dispose pas de la première etc...*/
}
.deroul {
	height:100px;
	margin-top: 4px; /* Marge éxtérieure HAUT de 4 pixels */
	margin-right: 0,2cm; /* Marge éxtérieure DROIT de 0.2 centimètres */
	margin-left: 0,3cm; /* Marge éxtérieure GAUCHE de 0.3 centimètres */
	text-align: center; /* Aligne le texte au CENTRE */
	color: aqua; /* Couleur du texte en AQUA */
	font-family: "Times New Roman", "Arial Black", Arial, Verdana, sans-serif; /* Définition de la police (avec guillemets si espace dans le nom), ET, classé par ordre de choix si le visiteur ne dispose pas de la première etc...*/
}
.deroul_colonne_d {
	height:150px;
	margin-top: 4px; /* Marge éxtérieure HAUT de 4 pixels */
	margin-right: 0,2cm; /* Marge éxtérieure DROIT de 0.2 centimètres */
	margin-left: 0,3cm; /* Marge éxtérieure GAUCHE de 0.3 centimètres */
	text-align: center; /* Aligne le texte au CENTRE */
	color: aqua; /* Couleur du texte en AQUA */
	font-family: "Times New Roman", "Arial Black", Arial, Verdana, sans-serif; /* Définition de la police (avec guillemets si espace dans le nom), ET, classé par ordre de choix si le visiteur ne dispose pas de la première etc...*/
}

.vert
{
	color:aqua;
	font-size:	large;
}
.rouge
{
	color:red;
	font-size:large;
}
.rouge_jaune
{
		color:red;
		background-color:yellow;
		font-size:large;
		font-weight:bold;
}
.center /*VIA style connexion_adherent.css */
{
	text-align:center;
	font-size:80%;
}
.titre_tableau /*VIA style connexion_adherent.css */
{
	text-align:center;
	font-size:98%;
}
.comptage_tableau /*VIA style connexion_adherent.css */
{
	text-align:center;
	font-size:110%;
}
/*###################################################################### */
/*###############################      BALISES        ################## */
/*###################################################################### */
.lien_blanc_rouge
{
	color:white;
	background-color:#FF0000;
}
.lien_vert
{
	color:lime;
}
.lien_jaune
{
	color:yellow;
}
.lien_bleu
{
	color:aqua;
}
.lien_blanc
{
	color:white;
}
.lien_blanc_sans
{
	color:white;
	text-decoration:none;
	/*background:url('../images/images_adherents/bluec_30p.png');*/
	 
}

#btn_tournoi
{
	height:80px;
	width:80px;
	position:relative;
	right:-43%;	
}
.btn_centre
{
	height:80px;
	width:80px;
	margin:auto;
}
.btn_droit
{
	height:80px;
	width:80px;
	position:relative;
	right:-43%;	
}
.tableaux
{
	width:100%;
	position: relative;

}
/*###################################################################### */
/*######################      ENCADREMENT FENETRE     ################## */
/*###################################################################### */

#cadre_fond_bleu_foot
{
	width:90%;
	margin-left:7%;
	margin-right:3%;
	
	background-color:rgb(0,0,0);
	border-width:1px; 
	border-style:outset; 
	border-color:white;
	font-size:90%;	
	font-weight: bold;
	color: white; 	
}
.titre_b /*VIA style connexion_adherent.css pour pages admin*/
{
	text-align:center;
	
	background-color:rgba(0, 0, 0, 0.9);
	width:auto;
	
	border-radius:55px;
	margin:auto;
	padding:3px;
	color: white;
	
}
.titre_rouge /*By Ludo*/
{
	text-align:center;
	background-color:rgba(123, 168, 206, 0.5);
	
	width:60%;
	
	border-radius:55px;
	margin:auto;
	padding:3px;
	color: rgb(255, 255, 255);
	
}
.titre_bulle_bleu /*By Ludo*/
{
	text-align:center;
	background-color:rgba(0, 0, 255, 1);
	
	/*width:60%;*/
	
	border-radius:55px;
	margin:auto;
	padding:3px;
	color: white;
	
}
.titre_bulle_jaune /*By Ludo*/
{
	text-align:center;
	background-color:rgba(255, 255, 255, 0.5);
	
	/*width:60%;*/
	
	border-radius:55px;
	margin:auto;
	padding:3px;
	color: black;
	
}
.titre_bulle_blanc /*By Ludo*/
{
	text-align:center;
	background-color:rgba(255, 255, 255, 1);
	
	width:70%;
	
	border-radius:55px;
	margin:auto;
	padding:3px;
	color: red;
	
}
.bouton_centrer /*VIA style connexion_adherent.css pour pages admin*/
{
	text-align:center;
	background:url('../images/images_adherents/bluec_30p.png');
	width:15%;
	
	border-radius:55px;
	margin:auto;
	padding:3px;
	color: white;
	
}

.header2 /**ajouté*/
{
	width: 98%; /*ajouté*/
	margin-right: auto; /*ajouté*/
	margin-left: auto; /*ajouté*/
	/**margin:auto;*/
	margin-top:10px;
	/*padding:15px;*/
	/*****background:url('../images/images_adherents/bluec_30p.png');****/
	/*width:70%;*/
	/**-moz-border-radius:20px;*/
	/**-webkit-border-radius:20px;**/
	/**border-radius:20px;**/
	text-align:center;
}
/*###################################################################### */
/*######################      CSS ADMIN               ################## */
/*###################################################################### */
#gauche_admin
{
   	display: inline-block;    
    /*border: 5px solid blue;*/
    vertical-align: top;
	width:12%;
    height:auto;
}
#page_centrale_haut_admin
{
    display: inline-block;    
    /*border: 5px solid blue;*/
    vertical-align: top;
		
    color:aliceblue;
    height:auto;
   /* border: 5px solid red;*/
}
#page_centrale_admin
{
      /*border: 3px solid blue;*/
    vertical-align: top;
    margin:auto;
    width:80%;
    height:auto;
   /* border: 5px solid red;*/
}
#droit_admin
{
    display: inline-block;    
    /*border: 10px solid orange;*/
    vertical-align: top;
   	height:auto;
	
}
.fond_deroul_admin
{
	overflow:auto;
	border-radius:30px;
	
	width:auto;
	height:auto;
	max-height:530px;
	margin-bottom:15px;
	margin-top:3px;
	background:url('../images/images_adherents/bluec_30p.png');	
	
	text-align:center;
}

#news_partenaires_admin
{
	display: inline-block;
    width:99%;
    border: 1px double white;
    vertical-align: top;
    height:22%;
    background-color:black;
}

.api /*VIA style connexion_adherent.css */
{
	
	border-radius:10px;
	padding:0px;
	width:100%;
	margin:5px auto 5px auto;
	
	
}
.api td, .api tr	/* cache la bordure noir */ 
{
	border:1px;
	background:white;	
	font-family:"times new roman", times, serif;	
	font-size:85%;	
	color:blue;
}
.api th
{
	background-color: black;
	font-family:"times new roman", times, serif;	
	font-size:100%;	
	font-weight:bold;
	color:white;
}

/*###################################################################### */
/*######################      COMPTE A REBOURS        ################## */
/*###################################################################### */

.compte-rebours {
    font-size: 48px;
    font-weight: bold;
    text-align: center;
}

.heures, .minutes, .secondes {
    display: inline-block;
    width: 100px;
    height: 100px;
    line-height: 100px;
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    border-radius: 10px;
    margin: 20px;
}

.heures {
    background-color: #ff9900;
}

.minutes {
    background-color: #66cc00;
}

.secondes {
    background-color: #0066cc;
}
/*###################################################################### */
/*######################      COMPTE A REBOURS   ChatGGPT  ############# */
/*###################################################################### */
.countdown1 {
	font-size: 3rem;
	font-weight: bold;
	margin-top: 50px;
	color: #333;
}

.countdown {
	font-size: 30px;
	font-weight: bold;
	padding: 10px;
}

#countdown2 {
	display: none;
}

.countdown-container {
	background-color: #fff;
	border-radius: 10px;
	padding: 30px;
	display: inline-block;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
	margin-bottom: 30px;
}

.label {
	font-size: 1.5rem;
	color: #666;
}

.time {
	font-size: 3rem;
	font-weight: bold;
	color: #ff5733;
}

.end-date {
	font-size: 1.2rem;
	color: #888;
	margin-top: 10px;
}

.date-selector {
	font-size: 1rem;
	padding: 8px;
	margin-top: 20px;
}


@media (max-width: 600px) {
	.countdown {
		font-size: 2rem;
	}

	.label {
		font-size: 1.2rem;
	}

	.time {


		font-size: 2rem;
	}
}
/*###################################################################### */
/*######################  COMPTE A REBOURS  4eme ChatGGPT  ############# */
/*###################################################################### */


#compteRebours {
	font-size: 1.9em;
	font-weight: bold;
	margin-bottom: 33px;
}

.invisible {
	display: none;
}

.visible {
	display: block;
	opacity: 1;
	transition: opacity 1s ease-in-out;
}

.zone-action {
	margin-top: 13px;
	
	
	border-radius: 10px;
	
	text-align: center;
}

.btn-ouvert {
	background-color: red;
	color: white;
	font-weight: bold;
	padding: 12px 24px;
	font-size: 1em;
	text-decoration: none;
	border-radius: 8px;
	border: none;
	cursor: pointer;
}
#btn-ouvert-2 {
	margin-top:1%; 
	border-width:5px; 
	border-color:white; 
	background-color:red;
}


.ferme {
	font-size: 1.2em;
	color: #c00;
	font-weight: bold;
}
</style>