/* Thème Printemps */
/* Avril 2009   */
/* Encodage UTF-8 */

/*==================================================================*/
/* Barre d'accessibilite */
/*==================================================================*/

#accessibilite, #accessibilite a
{
margin-top: 0px;
margin-bottom: 0px;
padding: 2px;
font-size: 80%;
color: #dfdfdf;
}

#accessibilite a:hover
{
color: black;
}

/*==================================================================*/
h1
{
margin: 0px;
padding: 0px;

height: 1px;

text-indent:  -10000px;
}

body
{
background-color: #fffae0;
font-family: Tahoma, Arial, Verdana, Georgia, sans-serif;
font-size: 1em;
margin: 0px;
padding: 0px;
}

strong, em
{
/*On empêche le navigateur d'afficher l'interpretation sémantiques des balises (gras, italique...)*/
font-weight: normal;
font-style: normal;
}

/*=================================================================================================*/
#banniere
{
/*L'épaisseur de la bannière est identique à celle du logo. La taille globale s'additionnant au niveau des marges*/
height: 80px;
width: 100%;
background-color: #6294af;
margin: 0px;

/*Les marges internes permettent de décaller le logo en conservant la couleur de fond*/
background-image: url("../images/Printemps_Nuages_1024x80.jpg");
background-repeat: no-repeat;
background-position: top right;

clear: both;
}

#logo_banniere
{

float: left;
margin: 3px;
/*Epaisseur du logo*/
height: 60px;
width: 195px;
/*Décommenter la ligne adéquate pour passer du logo enneigé au normal: */
background-image: url("../images/Logo_banniere.png");
/*background-image: url("../images/Logo_banniere_sous_la_neige.png");*/
background-repeat: no-repeat;


/*décallage du logo du bord gauche*/
margin-left: 0.8em;
/*la marge basse empêche le menu horizontale de venir se coller au logo*/
}

#texte_logo
{
font-weight: normal;
font-style: normal;

border-left:1px solid white;

margin-left: 30%;
padding: 0px;
padding-left: 2em;

font-family: Arial, Verdana, Georgia, sans-serif;
font-size: 1em;

color: white;
}

/*=================================================================================================*/
#menu_bannniere
{
/*Le menu se colle à gauche et en dessous de la bannière avec son logo, de lui même*/

border-top-style: solid;
border-top-color: #FF6600;
border-top-width: 4px;

border-bottom-style: solid;
border-bottom-color: #FF6600;
border-bottom-width: 4px;

background-color: #d8efff;
width: 100%;
float: left;
}


#menu_bannniere ul
{
/*permet de faire coller la mise en page 'ul' avec la mise en page du conteneur div id=menu_banniere*/
margin: 0px;

border-top-style: solid;
border-top-width: 2px;
border-top-color: #EDAD53;

border-bottom-style: solid;
border-bottom-width: 2px;
border-bottom-color: #EDAD53;


/*décallage du menu marge de gauche alignée avec logo*/
padding-left: 0.8em;
float: left;
}



#menu_bannniere li
{
list-style-type: none;
font-family: Arial, Verdana, Georgia, sans-serif;

text-transform: capitalize;

/*petit trait séparant les mots*/
border-right-style: solid;
border-right-width: 1px;
border-right-color: #EDAD53;
/*Je ne sais pas pourquoi, mais sur la gauche du texte il reste l'emplacement de la puce*/
padding-left: 0px;
/*Il faut donc compenser à droite avec la marge interne pour équilibrer le décallage du texte*/
padding-right: 2px;

/*police du menu*/
font-size: 1em;
/*Changer ici si on veut le menu en gras*/
font-weight: normal;

/*affichage horizontale de la "liste"*/
display: inline;
}

#menu_bannniere li >a
{
/*suppression du soulignement des liens*/
text-decoration: none;
color: navy;
}

#menu_bannniere li >a:hover
{
/*Au survol le menu devient gras*/
font-weight: bold;
}

/*#menu_bannniere li >a:visited
{
/*une fois visité le texte est noir
color: black;
text-decoration: none;
}*/



/*=================================================================================================*/

#sommaire
{
float: left;
width: 200px;
margin: 0px;
padding-bottom: 80px;
background-image: url("../images/Printemps_Rocher_Granit_Rose_200x80.jpg");
background-position: bottom;
background-repeat: no-repeat;
background-color: #76c7ff;
}

#sous_sommaire, #evenement, .sous_sommaire, .evenement
{
color: white;
text-decoration: none;
list-style-type: none;
text-align: left;
padding: 0px;
font-size: 0.9em;

background-color: #4d9ace;
background-image: url("../images/Printemps_striage_sommaire_25x25.png");
background-position: bottom right;
background-repeat: no-repeat;

margin-top: 1.2em;
margin-left: auto;
margin-right: auto;
margin-bottom: 1.2em;

width: 80%;

/* Coins arrondis qui ne fonctionnent que sous les navigateur à moteur Gecko (Firefox)*/
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
}

#sous_sommaire ul, #evenement ul, #sous_sommaire p, #evenement p, .sous_sommaire ul, .sous_sommaire p
{
margin: 0px;
/*La valeur ci dessous est identique au padding des #sous_sommaire h? */
padding: 0.4em;
padding-top: 0px;
color: white;
text-decoration: none;
text-align: justify;
list-style-type: none;
font-size: 1em;
}

#sous_sommaire li, #evenement li, .sous_sommaire li
{
padding-left: 0.5em;
padding-right: 0.5em;
text-align: left;
}

#sous_sommaire a, #evenement a, .sous_sommaire a
{
color: white;
text-decoration: none;
list-style-type: none;
}

#sous_sommaire h5, #evenement h5, #sous_sommaire h6, #evenement h6, .sous_sommaire h5, .sous_sommaire h6
{
color: white;
/*text-decoration: none;*/
text-align: center;
margin: 0px;
margin-bottom: 0.4em;

padding: 1px; 

border-bottom-style: solid;
border-bottom-width: 1px;
border-color: #ffde00;

/*Déco du titre*/
background-image: url("../images/Printemps_petit_soleil_25x25.png");
background-repeat: no-repeat;
background-position: top left;
background-repeat: no-repeat;
padding-left: 26px;
padding-right: 1px;
/*Image pour déco de Noël, à commenter une fois inutile 
background-position: top left;
background-repeat: no-repeat;
/*ici on indique la mm taille en px que l'image*/
/*padding-left: 26px;*/

-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
}

#sous_sommaire a:hover, #evenement a:hover, #pied_de_page a:hover, .sous_sommaire a:hover
{
color: white;
text-decoration: none;
border-bottom-style: solid;
border-bottom-width: 1px;
}

#sous_sommaire a:visited, #evenement a:visited, #pied_de_page a:visited, .sous_sommaire a:visited
{
text-decoration: none;
border-bottom-style: dashed;
border-bottom-width: 1px;
}
/*=================================================================================*/
/* CORPS */
/*=================================================================================*/

#corps
{
float: left;

padding-top: 1em;
padding-left: 3em;
padding-right: 3em;
padding-bottom: 1em;

background-color: #fffae0;
background-image: url("../images/Printemps_soleil_100x100.png");
background-repeat: no-repeat;
font-size: 0.9em;
text-align: justify;
width: 50%;
max-width: 1024px;
margin-bottom: 20px;
}


#corps h2
{
margin-top: 15px;
margin-bottom: 15px;
/*La marge basse correspond à la hauteur de l'image de déco + 10px... A commenter pour mettre en place déco de noël*/
padding-bottom: 100px;
background-image: url("../images/Gamme.jpg");
background-repeat: no-repeat;
background-position: bottom;
/* Décoration pour noel à commenter quand inutile
background-image: url("../images/Double_cloches_64x64.png");
background-repeat: no-repeat;
background-position: top right;
padding-right: 70px;
padding-bottom: 30px;*/
/*fin décoration noël*/
color: #FF6600;
font-size: 2em;
text-align: center;

-moz-border-radius-bottomright:10px;
}

#corps h3
{
text-align: center;
font-family: Arial, Verdana, Georgia, sans-serif;
font-size: 1.5em;

/*On décore le titre avec la bordure basse (soulignement) et droite*/ 
border-right-style: solid;
border-right-color: #b02e6e;
border-right-width: 3px;

border-bottom-style: solid;
border-bottom-color: #b02e6e;
border-bottom-width: 3px;

color: #FF6600;

margin: 0px;
/*On rajoute une grosse marge au dessus du titre comme ça il se décolle bien du contenu le précédant*/
margin-top: 0.8em;
margin-bottom: 0.3em;
margin-left: 0.3em;
margin-right: 0.3em;
clear: both;

/* Décoration pour les titres (ex:noel) à commenter quand inutile mais laisser le padding à 0px */
background-image: url("../images/40ans_Ami8_61x26.png");
background-repeat: no-repeat;
background-position: top left;
padding-left: 65px;
padding-bottom: 5px;
/*fin décoration noël*/

-moz-border-radius-bottomright:10px;
}

#corps ul
{
margin: auto;
width: 80%;
padding: 0px;
}

#corps p
{
text-indent: 10px;
}
/*Lettrines des paragraphes*/
#corps p:first-letter
{
/*font-weight: bold;*/
font-style: italic;
}

/*=================================================================================================*/
/* Formulaires */
/*=================================================================================================*/
form
{
margin: auto;
width: 95%;
max-width: 600px;
border-style: solid;
border-width: 2px;
border-color: #EDAD53;
/*propriété uniquement interprétée par les navigateurs à meoteur gecko (type firefox) pour arrondir les coins
Futures propriété CSS3*/
-moz-border-radius:10px;
}

label, form
{
padding: 5px;
}

label
{
display: block;
}

textarea
{
margin-bottom: 5px;
}

input, textarea
{
border-style: solid;
border-width: 1px;
border-color: #EEDD81;
}

input:focus, textarea:focus
{
background-color: #EEDD81;
border-style: solid;
border-width: 1px;
border-color: #EDAD53;
}
/*
background-color: #EEDD81;
margin-top: 2em;

border-top-style: solid;
border-top-width: 2px;
border-top-color: #EDAD53;*/


/*=================================================================================================*/
/* Tableau des pièces détachées */
/*=================================================================================================*/
caption
{
color: #FF6600;
text-align: center;
margin-bottom: 3px;
}


table, td, tr, th
{
margin: auto;

border-style: solid;
border-width: 1px;
border-collapse: collapse;

font-size: 95%;
}
/*sections du tableau*/
.section_tableau
{
border-color: black;

padding-left: 3px;
color: white;
font-weight: bold;

background-color: #003399;

}
/*Prix spécial adhérents pour les piéces */
.special_adherent
{
border-color: black;
color: #FF6600;
text-align: center;
background-color: #D3DCE6;
}

thead, tfoot, .cellule_centrer
{
text-align: center;
}
/*================================================================================*/

/*Dans la page du club (club.html), affichage des antennes locales (sections)*/
.sections_amiclub
{
color: #FF6600;
font-style: bold;
}

/*On cache les coordonnées pour le fun*/
.details_sections
{
display: none;
}

/*Pour les faire afficher au survol du curseur il faut jouer sur les 'heritages' des selecteurs*/
.sections_amiclub:hover + .details_sections
{
display: inline;
}

/*pour éviter que les détails disparaissent on laisse l'affichage tant que la souris les survole*/
.details_sections:hover
{
display: inline;
}

.image_droite
{
float: right;
margin-left: 0.5em;
}

.image_gauche
{
float:left;
margin-right: 0.5em;
}

/*Image nécessaire aux boutons spéciaux pour la page des 40 ans de l'Ami 8 et du M35 se basant sur les classes d'image_droite et images_gauche. Le but est de mettre ces image dans une balise <a> en display: block et de cacher le texte necessaire aux navigateur vocaux et texte.*/

.bouton_40ans_forum, .bouton_40ans_wiki, .bouton_40ans_contact, .bouton_40ans_presse
{
float: right;
margin-left: 0.5em;
display: block;
width: 200px;
height: 50px;
background-repeat: no-repeat;
}

/*On planque le texte pour pas qu'il vienne par dessus l'image, et on le sort de la zone lisible puisque la propriete display:none n'est pas correctement gérer par cette merde d'IE...*/
.cache
{
position: absolute;
left: -5000px;
top: -5000px;
tex-indent: -5000px;
}

.bouton_40ans_forum
{
background-image: url("../images/40ans_Boutons_Forum_200x50.jpg");
}

.bouton_40ans_wiki
{
background-image: url("../images/40ans_Boutons_Wiki_200x50.jpg");
}

.bouton_40ans_contact
{
background-image: url("../images/40ans_Boutons_Contact_200x50.jpg");
}

.bouton_40ans_presse
{
background-image: url("../images/40ans_Boutons_Presse_200x50.jpg");
}
/*=================fin des boutons spéciaux 40 ans.=============================*/

.back_top
{
font-size: 0.7em;
float: right;
color: navy;
background-color: #EEDD81;
margin-top: 1.5em;
margin-bottom: 1.5em;
}

/*=================================================================================================*/
/*Pied de page*/
/*=================================================================================================*/

#pied_de_page
{
clear: both;
text-align: center;
background-color: #76c7ff;
margin-top: 2em;

border-top-style: solid;
border-top-width: 2px;
border-top-color: #4d9ace;
}

#pied_de_page a, #pied_de_page p
{
color: #ffde00;
padding: 0px;
margin: 0px;
text-decoration: none;
}
/* Bloquer l'aspect des liens visités qui se forme sur les page du site pour éviter l'apparition des traits pointillés sous les vignettes*/
#pied_de_page img, #pied_de_page a:hover, #pied_de_page a:visited
{
border-style: none;
text-decoration: none;
}
/*=================================================================================================*/
/*Page Manifestation*/
/*=================================================================================================*/

/*Chaque sortie peut se voir attribuer une liste à puce avec bulletin et programme à télécharger.*/
#telechargement_docs_sorties
{
list-style-type: none;
font-size: 0.75em;

background-color: #d8efff;
padding: 0px;
margin: 5px;

border-color: #4d9ace;
border-width: 1px;
border-style: dashed;
}

#telechargement_docs_sorties li
{
padding: 3px;
}


/*Permet de travailler sur les dates des sorties - Ajout d'un fond color et position gauche...*/
.journee
{
text-align: left;
color: #003399;
background-color: #D3DCE6;
}


/*pour configurer la liste à puce permettant d'afficher une adresse postale*/
.adresse
{
list-style-type: none;
text-align: center;
background-color:#fff6c6;
/*propriété uniquement interprétée par les navigateurs à moteur gecko (type firefox) pour arrondir les coins
Futures propriété CSS3*/
-moz-border-radius:10px;
}

/*=================================================================================================*/
/*Page Publication*/
/*=================================================================================================*/

/*le corps comporte les 'cartouches' des publications 'LigneZ, Aminews, Podcasts*/
/*generique*/
.cartouche_publication, .cartouche_publication_ligne_z
{
background-color: #EEDD81;
/*background-image: url("../images/Double_cloches_128x128.png");*/

background-repeat: no-repeat;
background-position: top -60px;
padding: 1em;
margin: 1em;

border-color: #edad53;
border-width: 2px;
border-style: solid;

-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
}

/*deux classes permettant d'ajouter des images à gauche ou droite dans les cartouches*/
.image_cartouche_gauche
{
float: left;
margin: 1em;
margin-left: 0px;
border-style: none;
}

.image_cartouche_droite
{
float: right;
margin: 1em;
margin-right: 0px;
border-style: none;
}

/*ligne_z*/
/*Type par défaut avec couleur bleu turquoise en fond et encadrement orange*/
/*====DESACTIVE POUR LE DESIGN 40 ANS Ami 8, pensez à retirer la classe
sur le cartouche publication générique plus haut si utilisé===
.cartouche_publication_ligne_z
{
background-color: #D3DCE6;
padding: 1em;
margin: 1em;

border-color: #FF6600;
border-width: 2px;
border-style: solid;
}
=====*/

/*Dans la page qui liste les n° des Ligne Z parus, au survol de la souris
 la couverture apparait en haut à droite de l'écran*/
.post-it
{
display: none;
}
 a:hover span.post-it
{
display: block;
position: fixed;
top: 150px;
rigth: 1em;
left: 75%;
}

/*On corrige un bug IE, comme d'hab' quoi !...*/
a:hover span.post_it
{
background: none;
}
/*fin de l'eefet d'apparition des couvertures*/
/*====================*/

/*Aminews*/
.cartouche_publication_aminews
{
background-color: #D3DCE6;
padding: 1em;
margin: 1em;

border-color: #FF6600;
border-width: 2px;
border-style: solid;
}

/*podcast*/
.cartouche_publication_podcast
{
background-color: #D3DCE6;
padding: 1em;
margin: 1em;

border-color: #FF6600;
border-width: 2px;
border-style: solid;
}

/*supprime toutes les puces dans les cartouches spécifiques*/
.cartouche_publication, .cartouche_publication_podcast ul, .cartouche_publication_aminews ul, .cartouche_publication_ligne_z ul
{
list-style-type: none;
clear: both;
}


.titre_cartouche_publication
{
/*On annule l'héritage des bordure des titres du corps*/
border-style: none;
border-width: 0px;
}

/*=================================================================================================*/
/*Applications Flash et logo creative common*/
/*=================================================================================================*/

.cartouche_publication object
{
display: block;
margin: auto;
margin-top: 1em;
margin-bottom: 1em;
}

#creative_common
{
text-align: center;
margin: 0.5em;
padding: 0.2em;
}

#creative_common a
{
color: #FF6600;
font-size: 1em;
font-style: italic;
padding-right: 85px;
background-image: url("../images/mini_cc_by_nc_nd.png");
background-repeat: no-repeat;
background-position: right;
}

/* diaporama reprend le même design que le corps mais en taille fixe pour intégrer le dewslider*/
#diaporama
{
float: left;

padding-top: 1em;
padding-left: 3em;
padding-right: 3em;
padding-bottom: 1em;

background-color: white;

font-size: 0.9em;
text-align: justify;
width: 448px;
margin-bottom: 20px;
}

#diaporama h3
{
text-align: center;
font-family: Arial, Verdana, Georgia, sans-serif;
font-size: 1.5em;

/*On décore le titre avec la bordure basse (soulignement) et droite*/ 
border-right-style: solid;
border-right-color: #D3DCE6;
border-right-width: 3px;

border-bottom-style: solid;
border-bottom-color: #D3DCE6;
border-bottom-width: 3px;

color: #FF6600;

margin: 0px;
/*On rajoute une grosse marge au dessus du titre comme ça il se décolle bien du contenu le précédant*/
margin-top: 0.8em;
margin-bottom: 1em;
margin-left: 0.3em;
margin-right: 0.3em;
padding: 0px;
clear: both;
}

#diaporama object
{
width: 448px;
margin: auto;
clear: both;
}