/* body ensemble écran, image de fond
-------------------------------------------------------------- */

body {text-align:center; vertical-align:middle; background:url(./images/fond.jpg) no-repeat fixed center;}
h1 {font-size:22px; font-weight:blod; color:red;}
h3 {font-size:18px; font-weight:blod; color:red;}
p {padding:8px; font-size:20px; text-align:justify;}
ol,ul{ list-style:none; margin:auto; padding:0; text-align:center; vertical-align:middle;}
td {text-align:center; vertical-align:middle;}

		/* Pour mes formulaires
		-------------------------------------------------------------- */
input[type=text], input[type=email], input[type=tel], input[type=url] , input[type=password]
	{width:200px; height:30px; border-radius:10px; padding:5px; border:none;}
label {margin-top:10px; margin-bottom:-5px; font-weight:blod; display:block;}
label.inline {display:inline;}
fieldset {padding:0 20px 20px 20px; margin-bottom:10px; border:1px solid #000000; background-color:#b7d052;}
.field_minichat {width:400px;}
.field_updater {background-color:#cc85d6;}
.field_calendrier {background-color:#64A6D1;}
legend {color:#DF3F3F; font-weight:bold;}
.legend_uptader {color:#000000;}
.legend_calendrier {color:#000000;}
input[type=submit] {width:250px; height:25px; border-radius:10px; cursor:pointer;}
input[type=submit]:hover {}
.gauche{display:block; float:left; width:230px;}
.droite {display:block; float:right;}

/* tout mon espace 1200px de large
-------------------------------------------------------------- */

#container {display:block; width:1200px; position:relative; float:none; clear:both; margin-left:auto; margin-right:auto; 
			font-family:"Comic Sans Ms", Arial, sans-serif;}

/* mon en tete a voir pour 300 ou 350px de  hauteur
-------------------------------------------------------------- */

#header {height:80px; background-color:#FFFFFF; opacity:0.8; width:600px; text-align:center; vertical-align:middle; margin-left:400px; display:block;}

/* mon corp de page avec le menu de nav et le contenu
-------------------------------------------------------------- */

#content {padding:20px 20px 20px 20px;}
#page {}
.onglet {clear:both; float:left; height:75px; width:250px; margin-bottom:10px; padding:10px; border:1px solid black; border-radius:20px;
					cursor:pointer; position:relative; font-weight:bold; font-size:30px; text-align:center; background-color:#FFFFFF; opacity:0.8;}
.contenu_onglet {display:none; float:right; width:850px; min-height:500px; margin-top:-535px; border:1px solid black; border-radius:20px;
						padding:5px; overflow:hidden; position:relative; background-color:#9cbc2c; opacity:0.85;}
						
.contenu_index {width:600px; height:400px; text-align:center; vertical-align:middle; background-color:#FFFFFF; opacity:0.9; display:block; 
					margin:auto; margin-top:15%;}
						
.contenu_connexion {width:400px; text-align:center; vertical-align:middle; margin:auto; display:block;}
.contenu_consulter{width:730px; text-align:center; vertical-align:middle; margin:auto; display:block;}
.contenu_updater {width:730px; text-align:center; vertical-align:middle; margin:auto; display:block;}
.contenu_onglet_updater {background-color:#9e44a1; color:#000000;}
.titre_updater {color:#000000;}
.contenu_changer_mdp {width:400px; text-align:center; vertical-align:middle; margin:auto; display:block;}

.page_consulter {width:100%; height:90%; text-align:center; vertical-align:middle; overflow:scroll; background-color:#FFFFFF; opacity:0.9;}
.page_consulter th {width:180px; background-color:orange;}
.page_consulter td {border-width:1px; border-style:solid; border-color:black; width:180px;}
.page_consulter tr:hover {border-color:white; background-color:red;}

.page_event {width:100%; height:90%; text-align:center; vertical-align:middle; overflow:scroll; background-color:#FFFFFF; opacity:0.9;}
.page_event th {width:180px; background-color:orange;}
.page_event td {border-width:1px; border-style:solid; border-color:black; width:180px;}
.page_event tr:hover {border-color:white; background-color:red;}

.page_modifier {width:850px !important; background-color:#9cbc2c; opacity:0.9;}
.page_modifier form {width:750px !important; text-align:center; vertical-align:middle; margin:auto; display:block;}

.page_modifier_event {width:850px !important; background-color:#168CDB; opacity:0.9;}
.page_modifier_event form {width:750px !important; text-align:center; vertical-align:middle; margin:auto; display:block;}
.page_modifier_event h1 {color:#000000;}

.contenu_deconnexion {display:block; position:relative; margin-top:240px;}

/* Le calendrier
-------------------------------------------------------------- */

.contenu_onglet_calendrier {background-color:#168CDB; opacity:0.9;}
.contenu_onglet_calendrier h1 {color:#000000;}

.contenu_onglet_calendrier table {text-align:center; vertical-align:middle; margin:auto;}
.tableau_calendrier {opacity:1.0;}
td.nom_mois  {font-size:18px; font-style:normal; font-weight:bold; border-color:#000000; background-color:#b5db50;}
td.fleches  {font-size:16px; font-style:normal; font-weight:bold;}
tr.noms_jours  {width:100px; height:100px; font-size:16px; border-color:#000000; background-color:#b5db50; font-weight:bold;}
td.jours  {width:100px; height:100px; border-color:#33CCCC; font-size:12px; background-color:#CCFFFF;}
td.aujourdhui  {border-color:#000000; background-color:#ffc020;}
td.cases_vides  {width:100px; height:100px; border-color:#F5F5F5; font-size:12px; color:#C0C0C0; background-color:#FFFFFF;}

.cal_date {height:30px; text-align:center; vertical-align:middle; font-size:18px; border:1px solid #000000;}
.cal_event {height:70px; text-align:center; vertical-align:middle; font-size:14px;}
  
a:link  {text-decoration:none;}
a:visited  {text-decoration:none;}
a:active  {text-decoration:none;}

.contenu_add_event {width:720px; text-align:center; vertical-align:middle; margin:auto;}

/* Le chat
-------------------------------------------------------------- */

.chat {width:550px; text-align:left; margin:auto;}
		
/* ma barre laterale absente pour le moment
-------------------------------------------------------------- */
			
#sidebar {}

/* mon petit pied
-------------------------------------------------------------- */

#footer {clear:both; height:35px; padding:5px;}