/* Ceci le fichier CSS pour la page d'accueil des membres */

/*------------------------------------------------------------------------------------------*/
/* appliqués à toute la page*/
body
{
    width: 98%; /* taille en largeur de ma page*/
    margin: auto; /* sert à centre ma page */
    margin: 2%; /* permet d'avoir une marge de 2% de l'écran entre le bord de la page et celui du navigateur */   
}

/*------------------------------------------------------------------------------------------*/
/* le corps de la page*/
#corps /* le corps de la page*/
{
    float: left;
    margin: 10px;
    margin-left: 20px; /* empèche que le corps ne passe sous le menu */
    width: 79%;
    height : auto;
    font-family: "Comic Sans MS", "Times New Roman", serif; /* police de caractères */
    font-size:13px;
}

#corps h1 /*tous les titres du corps*/
{
    font-family: "Comic Sans MS", "Book Antiqua", "Times New Roman", serif; /* police de caractères */
}

#corps .signe/*ce div sert à positionner le signe soit masculin soit feminin dans la page profil*/
{
    float: right;
}

.garcon img /* permet de centrer la photo par rapport au cadre*/
{
    margin-top: 10px;
}

.fille img
{
    margin-top: 10px;
}

/* pour la page resultat_recherche.php et accueil_membre.php */
#corps .garcon/*pour le div des membres de sexe masculin */
{   
    float: left;
    border: 10px solid rgb(50,122,255); /* permet d'afficher un cadre d'1 pixel d'épaisseur, d'un trait simple et noir */
    width: 150px;
    height: 200px;
    margin: 10px;
    text-align: center;
}

#corps .fille /*pareil que garcon mais pour les membres de sexe feminin */
{ 
    float: left;
    border: 10px solid rgb(255,96,117); /*permet d'affichier un cadre de 10pixels d'épaisseur, d'un trait simple et rose*/
    width: 150px;
    height: 200px;
    margin: 10px;
    text-align: center;
}

#corps .photo_vide/*pareil que garcon ou fille*/
{
    margin-top: 168px;
}

#corps .photo_accueil /*pour avoir la photo centrée */
{
    height: 180px;
    width: 150px;
    margin-top: 10px;
}

#corps .photo_utilisateur/*ce div sert dans profil.php pour la photo sélectionnée par l'utilisateur*/
{
    height: 210px;
    float: left;
}

#corps .photo_profil/*le div des photos autre que la photo sélectionnée par l'utilisateur pour profil.php */
{
    height: 150px;
    width : 110px;
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

#corps .photo /*le div des photos pour profil_modif */
{
    height: 110px;
    float: left;
    margin-top: 10px; 
    margin-right: 10px;
    margin-left: 10px;
    width: 270px;
    height: 200px;
    float: left;
}

#corps .liste_recherche/* ce div sert à aligner verticalement les listes de choix dans la page recherche.php*/
{
    float: left;
    width : 25%;
    margin-bottom : 15px;
}

#corps .liste_recherche_fin/*ce div sert à annuler l'alignement à gauche dans la page recherche.php*/
{
    clear: both;
}

#corps .bouton/* sert à centrer les boutons*/
{
      text-align: center;
}

#corps .phrase, .recherche
{
    clear: both;
}

#corps .p_membre{
    text-align: center;
}

#corps a /* tous les liens se trouvant dans le corps */
{
    text-decoration: none; /* les liens ne sont plus soulignés */
    color: black;
}

#corps a:hover /* qd on pointe sur un lien du corps */
{
    text-decoration: none; /*le lien n'est pas souligné lorsqu'on le pointe grâce à la souris*/
    color: black;
}

#corps a:visited /* quand on a déjà cliqué sur le lien */
{
    text-decoration: none; /*les liens ne sont pas soulignés */
    color: black;
}
/*------------------------------------------------------------------------------------------*/
/* Le menu */
#menu
{
    float: left; /* le menu flottera à gauche */
    width: 150px;  /* donne la taille en largeur du menu */
   /* border: 1px solid rgb(50,122,255);*/ /* donne l'épaisseur des bordures, en trait simple, et la couleur blue */
    margin-bottom: 5%; /* marge du bas */
    margin-top: 20px;
    padding-bottom: 2%;
    /*background-color: rgb(50,122,255);*/
    /*background-image: url('../images/cub.jpg');*/
}

#menu .element_menu /* pour les div du menu*/
{
 margin-bottom: 15px;
}

#menu li
{
    margin-bottom: 5px;
}

#menu h3 /* tous les titres des menus */
{
	font-family: "Comic Sans MS", "Book Antiqua", "Times New Roman", serif; /* d�finit les caract�res de police du titre du menu */
	text-align : center; /* centre les titres */
}

#menu ul /* toutes les listes � puce se trouvant dans un menu */ 
{
	list-style-position: inside; /* le texte n'est pas mis en retrait au retour � la ligne */
	list-style-type: none; /* enl�ve les points mis par d�faut */
	padding: 0%; /* tous les c�t�s ont une marge int�rieur de 0pixels */
	padding-left: 5%; /* mais la marge de gauche aura une taille de 20pixels */
	margin: 0%; /* idem que padding mais en marge ext�rieur */
	margin-left: 5%; /*idem que padding-left mais en marge ext�rieur */
}

#menu a /*tous les liens se trouvant dans un menu */
{
	font-family: "Comic Sans MS", "Book Antiqua", "Times New Roman", serif; /* d�finit les caract�res de police des liens se trouvant dans un menu */
	font-size:14px;
	text-decoration: none; /* les liens ne sont plus soulign�s */
	color: blue;
}

#menu a:hover /* quand on pointe sur un lien du menu*/
{
	text-decoration: underline; /* souligne le lien sur lequel on pointe grace � la souris */
	color: blue;
}

#menu a:visited /* quand on a deja cliqu� sur un lien */
{
	text-decoration: none; /*les liens ne sont pas soulign�s*/ 
	color: blue;
}