/* ==============================================
   FEUILLE DE STYLES DES GABARITS HTML/CSS --- 10
   © Elephorm & Alsacreations.com
   Conditions d'utilisation:
   http://creativecommons.org/licenses/by/2.0/fr/
   ============================================== */


/* --- COULEURS --- */

/* Note: vous pouvez modifier simplement l'aspect de ce gabarit en modifiant
   uniquement les couleurs de fond (propriétés background) et les couleurs
   du texte (propriété color).
   Pour modifier la disposition des blocs, voir plus bas dans la feuille de
   styles la partie «positionnement». */

/* Général */
body   {
	color: #4a4a4a;
	font-family: Verdana, Georgia;
	font-weight: normal;
	font-style: normal;
	   }

A:link {
	   font-weight: bold;
	   text-decoration: none;
       color: #a16d22;
	   }
A:visited {
	   font-weight: bold;
	   text-decoration: none;
	   font-size: {SIZE1};
	   color: #a16d22;
	   }
A:active {
	   font-weight: bold;
	   text-decoration: none;
	   font-size: {SIZE1};
	   color: #a16d22;
	   }
A:hover {
 	   font-weight: bold;
       text-decoration: underline;
       color: #a16d22;
       }

.title {
       font-family: Georgia;
	   font-size: 18px;
	   font-weight: bold;
	   color: #124f72;
	   	   }

/* --- POSITIONNEMENT --- */

/* Page */
body {
margin:0;
	padding: 0px 0px;
}

/* En-tête */
#header  {
	color: #FFFFFF;
	background :#00254c;
	padding:10px;
	font-size: 14px;
	width: 100%;
	margin-top: 0px;
	   }
	   
@media (max-width: 799px)
{
#global {
	min-height: 100%; /* -> 1 */
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

#date  {
	   width: 200px;
	   float:left;
	   margin-left: 10px;
 	   }
#blog  {
	   width: 200px;
	   float:left;
 	   }
#connexion  { 
	   width: 200px;
	   margin-left: 400px;
	   } 
}

@media (min-width: 800px) and (max-width: 999px)
{
#global {
	min-height: 100%; /* -> 1 */
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

#date  {
	   width: 200px;
	   float:left;
	   margin-left: 10px;
 	   }
	   
#blog  {
	   width: 200px;
	   float:left;
 	   }
	   
#connexion  { 
	   width: 200px;
	   margin-left: 700x;
	   } 
}

@media (min-width: 1000px) and (max-width: 1299px)
{
#global {
	min-height: 100%; /* -> 1 */
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

#date  {
	   width: 200px;
	   float:left;
	   margin-left: 200px;
 	   }
#blog  {
	   width: 200px;
	   float:left;
 	   }
#connexion  { 
	   width: 200px;
	   margin-left: 1000px;
	   } 
}

@media (min-width: 1300px)
{
#global {
	min-height: 100%; /* -> 1 */
	margin-left: auto;
	margin-right: auto;
	width: 1200px;
}

#date  {
	   width: 200px;
	   float:left;
	   margin-left: 200px;
 	   }
#blog  {
	   width: 200px;
	   float:left;
 	   }
#connexion  { 
	   width: 200px;
	   margin-left: 1000px;
	   } 
}

#header a{
       color: white;
	   }

/* Bloc central */
#centre {
	   float: left;
	   width: 990px;
	   overflow: hidden;
	   font-size: 0.9em;
}

/* Menu de navigation */
#navigation {
	   float: left;
	   width: 200px;
	   padding: 20px 10px 20px 10px;
	   background: url(../../images/fonds/equerre_compas.gif) no-repeat bottom left;
}

#compteur {
	   width: 160px;
	   text-align:center;
	   float: right;
	   background: #00254c;
       margin-top: 14px;
       font-size: 15px;
	   color: white;
	   padding:5px;
	}
	
#accueil {
	   width: 160px;
	   text-align:right;
	   float: right;
       font-size: 12px;
       background: #b9dff5; 
       -moz-border-radius:10px 0;
       -webkit-border-radius:10px 0;
       border-radius:10px 10px;
}

#accueil a {
       font-size: inherit;}

/* Contenu principal */
#principal {
	   width: 687px;
       padding: 10px 20px;
	   border-right: 3px solid #87AFBF;
	   margin: 10px 0px 0px 220px;
	   }
	   
#principal > :first-child {
	   margin-top: 10px;
}
#principal p, #principal li {
	   line-height: 1.5;
}
#banniere {
	   width: 950px;
       margin_bottom:10px ;
}
/* Contenu secondaire */
#secondaire {
	   margin-right: 0px;
	   padding-top: 10px;
   	   text-align:center;
	   margin-left: 990px;
	   width: 220px;
	   font-size: 12px;
}
#secondaire .title {
       font-family: Georgia;
	   font-size: 16px;
	   font-weight: bold;
	   color: #a16d22;
}
.conference {
	   border: 1px solid #87AFBF;
	   background-color:#E4EFFF;
       border:1px solid #9FC6FF;
       padding: 5px;
	   margin : 20px;
       width: 640px;
       /*arrondir les coins en haut à gauche et en bas à droite*/
       -moz-border-radius:10px 0;
       -webkit-border-radius:10px 0;
       border-radius:10px 10px;
}

.conf_gauche {
	float: left;
	width: 200px;
}

.conf_droite {
	width: 410px;
	margin-left: 230px;
	}


.texte_gauche {
	float: left;
	width: 400px;
}

.texte_droite {
	width: 200px;
	margin-left: 430px;
	}

/* Pied de page */
#footer  {
	float:left;
	width:100%;
	color: #FFFFFF;
	font-size: 14px;
	text-align:center;
	padding:10px;
	background: #00254c;
	margin-top: 10px;
	clear:both;
	   }

/* Mention de copyright */
#copyright {
	   margin: 8px 0 0 0;
	   font-size: 1em;
	   text-align: left;
}

#warningText{
       text-align: center;
       font-size: 12pt;
       font-weight: bold;
	   color: #B40404;
  }
  
/* précedent pour texte */
#actualite {
	   margin-top : 15px;
	   padding : 5px;
	   width: 180px;
       font-size: 12px;
       border-style: dashed;
       border-width: 2px;
	   }

/* précedent pour texte */
#precedent {
	   font-size: 12px;
	   text-align: left;
       color: #a16d22;
       font-weight: bold;
}

#precedent a{
       text-decoration: none;
}

#precedent a:hover {
       text-decoration: underline;
}

/* précedent pour texte */
#suivant {
       float:right;
	   font-size: 12px;
	   text-align: right;
       color: #a16d22;
       font-weight: bold;
}

#suivant a{
	   text-decoration: none;
}

#suivant a:hover {
       text-decoration: underline;
}
	   
#sommaire {
       background-color: #EFEFEF;
       float: right;
       width: 140px;
       margin-left: 10px;
       border: 1px solid #666666;
       padding: 10px;
   	   font-size: 12px;
}
#content {
       background-color: #ffffff;
       text-align:justify;
}

#onglet  {
	   width: 200px;
	   float:left;
	   margin-left: 200px;
	   text-align:left;
}

.spacer {
       clear: both;
}

#coin {
    background-color:#E4EFFF;
    border:1px solid #9FC6FF;
    padding:5px;
    /*arrondir les coins en haut à gauche et en bas à droite*/
    -moz-border-radius:10px 0;
    -webkit-border-radius:10px 0;
    border-radius:10px 10px;
}

#login {
    text-align:center;
	width: 650px;
    background-color:#E4EFFF;
    border:1px solid #9FC6FF;
    padding:5px;
    /*arrondir les coins en haut à gauche et en bas à droite*/
    -moz-border-radius:10px 0;
    -webkit-border-radius:10px 0;
    border-radius:10px 10px;
}

#membre {
    background-color:#E4EFFF;
    border:1px solid #9FC6FF;
	height:700px;
    padding:10px;
	margin:auto;
	/*arrondir les coins en haut à gauche et en bas à droite*/
    -moz-border-radius:10px 0;
    -webkit-border-radius:10px 0;
    border-radius:10px 10px;
}

.ligne_impaire {
    width:100%;
	background-color: #ffffff;
    text-align:justify;
	overflow:hidden
}
.ligne_paire {
    width:100%;
    background-color: #CCCCCC;
    text-align:justify;
	overflow:hidden
}
	
#onglets
{
    font : bold 11px ;
    list-style-type : none;
    padding-bottom : 10px; /* à modifier suivant la taille de la police ET de la hauteur de l'onglet dans #onglets li */
    margin-left : 0;}

#onglets li
{
    float : left;
    height : 21px; /* à modifier suivant la taille de la police pour centrer le texte dans l'onglet */
    background-color: #E4EFFF;
    margin : 2px 2px 0 2px !important;  /* Pour les navigateurs autre que IE */
    margin : 1px 2px 0 2px;  /* Pour IE  */
    border : 1px solid #9EA0A1;
	/*arrondir les coins en haut à gauche et en bas à droite*/
    -moz-border-radius:10px 0;
    -webkit-border-radius:10px 0;
    border-radius:10px 10px 0 0;

}
#onglets li.active
{
    border-bottom: 1px solid #fff;
    background-color: #fff;
	/*arrondir les coins en haut à gauche et en bas à droite*/
    -moz-border-radius:10px 0;
    -webkit-border-radius:10px 0;
    border-radius:10px 10px 0 0;
}

#onglets a
{
    display : block;
    color : #666;
    text-decoration : none;
    padding : 2px 15px 0 15px;
    -moz-border-radius:10px 0;
    -webkit-border-radius:10px 0;
    border-radius:10px 10px 0 0;
}

#onglets a:hover
{
    background : #fff;
    text-decoration : none;
}

#boite_onglet
{
        padding-bottom : 0px;
}


/* --- FORMULAIRES --- */
input {
    border:solid 1px black;
    border-radius:5px;
    text-align:left;
    box-shadow:0 0 6px;
   }
   
label
{
    display: block;
    width: 180px;
	font-weight: bold;
	float:left
}

#siimage
{
    style="border: 1px solid #000;
    margin-right: 15px;
	float:none
 }

.titre1 {
    float: left;
    width: 50%;
    text-align: center;
	padding-right: 10px;
	} 
.auteur {
    float: left;
    width: 20%;
    text-align: left;
}
.titre {
    float: left;
    width: 50%;
    text-align: left;
	padding-right: 10px;
	} 
.image {
    text-align: center;
	}

.flottante {
    float: left;
    width: 20%;
    text-align: center;
}

div.colonnes {

    display: table;
    border-collapse: separate; /* Pour s'assurer que les cellules ne sont pas collées */
    border-spacing: 5px; /* 5 pixels d'écartement entre les colonnes */

}

span.col_titre, 
{
    display: table-cell;
    padding: 5px;
    border: 0px solid ;
    width: 250px;
	}

span.col_auteur,
{
    display: table-cell;
    padding: 5px;
    border: 0px solid ;
    width: 100px;
}

span.col_annee,
 {
    display: table-cell;
    padding: 5px;
    border: 0px solid ;
    width: 100px;
}

span.col_image
 {
    display: table-cell;
    padding: 5px;
    border: 0px solid ;
    width: 20px;
}

IMG.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto }