/* ### Ville de Lyon - mesdemarches.lyon.fr ### */
/* ### Feuille de styles PRINT ### */
/* ### Esprit Public - 2007 ### */


/*
	Version 1.0
	Dernière modification : 20/07/2007 
	Par : Franck Grenier (f.grenier@esprit-public.fr)
*/


/* ############### SOMMAIRE ############### */
/* 

 $1. Remise à zéro des styles
 $2. Redéfinition des balises de base
 $3. Styles recherches et formulaires
 $4. Blocs de mise en page
 $5. Menus : navigation (1,2,3), pratique, pied de page
 $6. Blocs de contenu principal
 $7. Blocs de contenu contextuel
 $8. Blocs navigation annexe 
 $9. Styles spécifiques "Accueil"
 
*/
/* ######################################## */


/* ###################### $1. Remise à zéro des styles ###################### */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-weight:inherit;
	font-style:inherit;
	font-size:100%;
	font-family:inherit;
	vertical-align:baseline;
	background:transparent;
}

:focus {
	outline:0;
}

body {
	line-height:1;
	color:black;
	background:white;
}

ol, ul {
	list-style:none;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

caption, th, td {
	text-align:left;
	font-weight:normal;
}

blockquote:before, blockquote:after, q:before, q:after {
	content:"";
}

blockquote, q {
	quotes:"" "";
}


/* ###################### $2. Redéfinition des balises de base ###################### */
body {
	font-family:"Verdana", sans-serif;
	font-size:66%;
	line-height:1.5em;
	color:#4e4e4e;
	background:#fff;
}

a {
	color:#4e4e4e;
	text-decoration:underline;
}

a:hover {
	color:#900;
	background:#deded2;
}

strong {
	font-weight:bold;
}

em {
	font-style:italic;
}

sup {
	font-size:0.9em;
	position:relative;
	top:-0.3em;
}

h1,h2,h3,h4,h5,h6 {
	font-family:"Arial";
	font-weight:bold;
}

h1 {
	font-size:1.55em;
	color:#996;
	padding:0 0 3px 22px;
	margin:0 0 10px 0;
	border-bottom:1px solid #996;
	background:#fff url(images/fleche_h1.gif) no-repeat left 1px;
	clear:both;
}

h2 {
	font-size:1.3em;
	color:#369;
	padding:0 0 0 15px;
	margin:40px 0 6px 0;
	background:#fff url(images/fleche_h2.gif) no-repeat left 50%;
	clear:both;
}

h3 {
	font-size:1.1em;
	color:#3b3b3b;
	padding:0 0 0 14px;
	margin:20px 0 10px 20px;
	background:#fff url(images/fleche_h3.gif) no-repeat left 50%;
}

h4 {
	color:#8b8b62;
	padding:0 0 0 13px;
	margin:10px 0 5px 0;
	background:#fff url(images/puce_listes.gif) no-repeat left 50%;
}

p {
	margin:0 0 15px 0;
}

ul {
	padding:0;
	margin:0 20px 20px 20px;
	clear:both;
}

li {
	padding:0 0 0 15px;
	margin:2px 0 2px 0;
	background:url("images/puce_listes.gif") no-repeat 0% 0.5em;
}

ul ul {
	padding:0;
	margin:5px 0 10px 0;
}

ul ul li {
	background:url("images/puce_sous_listes.gif") no-repeat 0% 0.5em;
}

/* hack IE 6 */
* html body ul {
	padding-left:15px;
}

/* table {
	width:100%;
	border-top:1px dashed #422F11;
	border-bottom:1px dashed #422F11;
	border-left:0 #FFFFFF;
	border-right:0 #FFFFFF;
	border-collapse:collapse;
	margin:auto;
	margin-bottom:25px;
}

table td, table th {
	border-bottom:1px dotted #422F11;
	padding:10px;
	vertical-align:top;
}

table th {
	text-align:left;
	font-weight:bold;
	color:#000;
} */

caption {
	display:none;
}

.noDisplay {
	position:absolute;
	left:0;
	top:-5000px;
	width:1px;
	height:1px;
	overflow:hidden;
}

.stopFloat {
	clear:both;
}

.stopFloat:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}


/* ###################### $3. Styles recherches et formulaires ###################### */
form {
	font-family:"Arial", sans-serif;
	line-height:1.5em;
	margin:0 0 20px 0;
	padding:0;
}

fieldset {
	display:block;
	padding:6px 8px 10px 8px;
	margin:0;
	border:0;
}

legend {
	display:block;
	position:relative;
	font-size:1.3em;
	color:#369;
	margin:15px 0 5px -8px;
	padding:0 0 0 15px;
	background:#fff url(images/fleche_h2.gif) no-repeat left 50%;
	clear:both;
	font-weight:bold;
	
}

fieldset fieldset legend {
	font-size:1em;
	font-weight:normal;
	color:#369;
	padding:0 0 0 15px;
	margin:0 0 3px 0;
	background:url("../images/pictoLabel.gif") no-repeat 5px 50%;
}

label {
	color:#5c5c5c;
	font-size:1.1em;
	padding:0 2px 0 2px;
}

fieldset fieldset label {
	display:inline;
	float:none;
	padding-left:0;
	background:none;
}

input, select, textarea {
	font-family:"Arial", sans-serif;
	font-size:1.1em;
	color:#666;
	padding:2px;
	margin:2px;
	vertical-align:middle;
	border:1px #969696 solid;
}

input:hover, select:hover, textarea:hover {
	border:1px solid #900;
}

input:focus, select:focus, textarea:focus {
	border:1px solid #900;
}

textarea {
	width:240px;
	height:150px;
}

input[type=text], select {
	width:180px;
}

input[type=radio], input[type=checkbox] {
	border:0;
}

input.standalone {
	color:#900;
	font-size:1.1em;
	font-weight:bold;
	padding:4px 15px 4px 15px;
	margin:0;
	background-color:#fff;
	border:1px #900 solid;
}

input.standalone:hover {
	color:#fff;
	background:#900;
}

.boxColonneGeneric {
	float:none;
	width:235px;
	margin:0 10px 15px 0;
}

.champsCol1 {
	width:40%;
	float:none;
}

.champsCol2 {
	width:50%;
	float:none;
}

.submitForm {
	clear:both;
	text-align:right;
	margin:5px 0 0 0;
}

.confirm {
	color:#666666;
	font-weight:bold;
}

.sansBordure {
	border:0;
}

.champRequis {
	color:#900;
}

.submitForm .champRequis {
	width:180px;
	text-align:left;
	font-style:italic;
	float:none;
}

.resultats h2 {
	color:#6e7061;
	border:0;
}

#CPSformulaire label {
	display:block;
	float:none;
	width:100px;
	color:#5c5c5c;
	font-size:1.1em;
	text-align:right;
	padding:2px 10px 0 0;
}

#CPSformulaire input, #CPSformulaire select, #CPSformulaire textarea {
	margin:2px 0 2px 0;
}

#recherche {
	display:none;
}

#deuxColonnes #recherche {
	font-size:0.9em;
	margin:0;
}

#recherche form {
	padding:0;
	margin:0;
	float:none;
}

#recherche legend {
	display:none;
}

#recherche label {
	color:#3b3b3b;
	font-size:1.2em;
	font-weight:bold;
	margin:0;
}

#recherche input {
	border:1px #900 solid;
	background:#fff;
}

#recherche input#keywords {
	width:125px;
	padding:3px 3px 2px 3px;
	margin:0 1px 0 1px;
}

#recherche input#submit {
	color:#900;
	font-size:1.1em;
	font-weight:bold;
	padding:1px;
	margin:0;
}

#recherche input#submit:hover {
	color:#fff;
	background:#900;
}


/* ###################### $4. Blocs de mise en page ###################### */
#container {
	width:auto;
	margin: 0 5%;
	background:#fff;
	border:0;
}

#header {
	height:85px;
	background:#fff url('images/fond_header_print.gif') left bottom no-repeat;
	border-bottom:2px #666 solid;
}

#header h1 {
	display:none;
}

#header a#lienVilleLyon {
	display:none;
}

#menuNiv1 {
	display:none;
}

#menuGauche {
	display:none;
}

#col2 {
	font-size:1.1em;
	padding:0;
	margin:0;
	float:none;
}

#deuxColonnes #col2 {
	width:auto;
	padding:0;
	margin:0;
}

#col3 {
	width:auto;
	padding:0;
	float:none;
}

#footer {
	display:none;
}


/* ###################### $6. Blocs de contenu principal ###################### */
.alignDroite {
	text-align:right;
}

#col2 img {
	float:none;
	padding:2px;
	margin:0 8px 5px 0;
	/*border:1px #ccc solid;*/
}

#col2 a:hover img {
	border:1px #9595aa solid;
}

#col2 .imageTexte img {
	float:none;
	padding:2px;
	margin:0;
	border:1px #ccc solid;
}

#col2 .imageTexte a {
	display:block;
	text-decoration:none;
}

#col2 .imageTexte a:hover {
	background:none;
}

#col2 .imageTexte a:hover img {
	border:1px #9595aa solid;
}

.imageTexte a:hover .legende {
	color:#4b4b4b;
}

.imageTexte .legende {
	display:block;
	color:#8e8e8e;
	text-align:center;
	font-style:italic;
	font-size:0.8em;
	margin:0 auto;
}

#cheminNav {
	font-size:0.9em;
	margin:15px 0 30px 0;
}

#demarchesSimilaires {
	padding:0 15px 10px 15px;
	margin:45px 0 30px 0;
	background:#f0f2f2;
	border:1px solid #f0f2f2;
	overflow:visible;
}

#demarchesSimilaires h1 {
	position:relative;
	font-size:1.2em;
	line-height:3em;
	padding:0 0 0 25px;
	margin:-30px 0 0 -22px;
	background:url(images/picto_demarches_similaires.gif) no-repeat left 100%;
	border:0;
}

#demarchesSimilaires ul {
	padding:0;
	margin:0 0 0 4px;
}

#demarchesSimilaires li {
	color:#963;
	font-size:0.9em;
	padding:0 0 0 12px;
	margin:0;
	background:url(images/puce_fleche_bleue.gif) no-repeat left 0.4em;
}

#demarchesSimilaires li a {
	color:#369;
	text-decoration:none;
}

#demarchesSimilaires li a:hover {
	color:#369;
	text-decoration:underline;
	background:none;
}

#intro {
	border-bottom:1px solid #996;
}

a.plus {
	display:block;
	font-weight:bold;
	color:#900;
	text-decoration:none;
	line-height:1.5em;
	padding:5px 0 5px 25px;
	background:#fff url(images/picto_demarches.gif) no-repeat 4px 50%;
	clear:both;
}

a.plus:hover {
	text-decoration:underline;
	background:#fff url(images/picto_demarches.gif) no-repeat 4px 50%;
}

.demarches ul {
	padding:0;
	margin:5px 0 30px 0;
}

.demarches li {
	width:40%;
	padding:0 0 0 15px;
	margin:0 15px 0 0;
	background:#fff url(images/puce_etoile_rouge.gif) no-repeat 6px 50%;
	float:none;
}

.demarches li a {
	color:#900;
	text-decoration:none;
	background:none;
}

.demarches li a:hover {
	color:#900;
	text-decoration:underline;
	background:none;
}

.coordonnees {
	padding:8px 0 10px 0;
	margin:30px 0 30px 0;
	border-top:2px solid #900;
	border-bottom:2px solid #900;
}

.coordonnees h1 {
	color:#900;
	font-size:1.2em;
	padding:0 0 0 10px;
	margin:0 0 10px 0;
	border:0;
	background:#fff url(images/puce_coordonnees.gif) no-repeat 0% 50%;
}

.coordonnees h2 {
	color:#3b3b3b;
	font-size:1em;
	padding:0;
	margin:15px 0 0 0;
	border:0;
	background:none;
}

div.coordonnees .etablissement {
	margin:0 0 20px 0;
}

div.coordonnees p {
	margin:0 0 5px 0;
}

#pagination {
	font-family:"Arial", sans-serif;
	padding:4px 0 4px 0;
	border-top:1px dotted #999999;
	border-bottom:1px dotted #999999;
}

#pagination a {text-decoration:none; color:#66c;}
#pagination a:hover {color:#d62f7f;	background:none;}
#pagination li.actif a {color:#8F7A22;	background:none;}

a#paginationPrecedent {
	float:none;
	padding:0 0 0 15px;
	background:url("images/picto_pag_precedent.gif") no-repeat 0% 50%;
}
a#paginationPrecedent:hover {background:url("images/picto_pag_precedent_over.gif") no-repeat 0% 50%;}

a#paginationSuivant {
	float:none;
	padding:0 15px 0 0;
	background:url("images/picto_pag_suivant.gif") no-repeat 100% 50%;
}
a#paginationSuivant:hover {background:url("images/picto_pag_suivant_over.gif") no-repeat 100% 50%;}


/* ###################### $7. Blocs de contenu contextuel ###################### */
#listeDemarches {
	padding:0 0 20px 0;
	margin:0 0 20px 0;
	background:#fff;
	border:1px solid #999966;
}

#listeDemarches h1 {
	height:20px;
	color:#900;
	font-size:1.1em;
	text-transform:uppercase;
	padding:18px 0 2px 10px;
	margin:0;
	background:none;
	border:0;
}

#listeDemarches ul {
	padding:10px 10px 0 15px;
	margin:0;
}

#listeDemarches li {
	padding:0 0 0 10px;
	margin:0 0 1px 0;
	background:#fff url(images/puce_etoile_rouge.gif) no-repeat left 50%;
}

#listeDemarches a {
	text-decoration:none;
}

#col3 div.coordonnees {
	padding:0 10px 10px 10px;
	margin:0 0 10px 0;
	background:#edf2f4;
	border:1px solid #ced9e2;
}

#col3 div.coordonnees h1 {
	padding:8px 0 0 10px;
	margin:0 -10px 15px -10px;
	background:none;
}

#col3 div.coordonnees h2 {
	font-size:1.1em;
	margin:0;
}


/* ###################### $8. Blocs navigation annexe ###################### */
#demarchesFrequentes {
	padding:0;
	margin:0 -10px 20px 0;
}

#demarchesFrequentes ul {
	padding:10px 10px 10px 10px;
	margin:0;
	background:#e6e6cd url(images/bas_box_frequentes.gif) no-repeat left bottom;
}

#demarchesFrequentes ul ul {
	padding:0 0 10px 0;
	margin:0 0 5px 0;
	background:none;
}

#demarchesFrequentes ul li {
	font-weight:bold;
	margin:0 0 1px 0;
}

#demarchesFrequentes ul ul li {
	font-weight:normal;
	padding:0 0 0 10px;
	margin:2px 0 2px 0;
	background:url(images/puce_etoile_noire.gif) no-repeat left 0.5em;
}

#demarchesFrequentes h1 {
	height:30px;
	color:#369;
	font-size:1.2em;
	text-transform:uppercase;
	padding:30px 0 2px 50px;
	margin:0;
	background:url(images/fond_h1_frequentes.gif) no-repeat left top;
	border:0;
}

#demarchesFrequentes a {
	text-decoration:none;
}

#accesRapide {
	width:187px;
	padding:0 0 20px 0;
	background:url(images/bas_box_accesRapide.gif) no-repeat left bottom;;
}

#accesRapide h1 {
	height:30px;
	color:#369;
	font-size:1.2em;
	text-transform:uppercase;
	padding:52px 0 5px 50px;
	margin:0;
	background:url(images/fond_h1_accesRapide.gif) no-repeat left top;
	border:0;
}

#accesRapide ul {
	width:167px;
	padding:5px 10px 0 10px;
	margin:0;
	background:url(images/fond_accesRapide.gif) repeat-y;
}

#accesRapide li {
	padding:0 0 0 15px;
	margin:0 0 1px 0;
}

#accesRapide a {
	text-decoration:none;
}


/* ###################### $9. Styles spécifiques "Accueil" ###################### */
#accueil #menuNiv1 {
	background:#fff url('images/fond_menuNiv1.jpg') left bottom no-repeat;
}

#accueil #menuPratique {
	margin:0;
	float:none;
}

#edito {
	width:565px;
	font-size:1.1em;
	padding:0 0 10px 15px;
	margin:20px 20px 0 20px;
	background:#fff url(images/fond_edito.jpg) repeat-y;
	float:none;
}

* html body #edito {
	margin:20px 20px 0 10px;
}

.chapeau {
	color:#369;
	font-weight:bold;
	margin:0;
}

#edito h1 {
	color:#369;
	font-size:1.5em;
	text-transform:uppercase;
	line-height:1.6em;
	padding:0 0 0 35px;
	margin:0 0 8px -10px;
	background:transparent url(images/fleche_h1_edito.gif) no-repeat left top;
	border:0;
}

#edito h2 {
	color:#4b4b4b;
	font-size:1.1em;
	line-height:1.6em;
	padding:10px 0 10px 15px;
	margin:0;
	background:transparent url(images/fleche_rouge.gif) no-repeat left 50%;
	border-top:1px dashed #369;;
}

#edito ul {
	padding:0;
	margin:0;
}

#edito li {
	width:23%;
	font-size:0.8em;
	padding:0 0 0 5px;
	margin:0 5px 2px 0;
	background:none;
	border-left:1px #4e4e4e solid;
	float:none;
}

#accueil #intro {
	width:310px;
	font-size:1.1em;
	padding:0 0 8px 0;
	margin:0 20px 0 0;
	float:none;
}

* html body#accueil #intro {
	margin:0 10px 0 0;
}

#accueil #intro img {
	float:none;
	padding:2px;
	margin:0 8px 5px 0;
	/*border:1px #ccc solid;*/
}

#accueil #demarchesFrequentes {
	width:620px;
	padding:0 20px 10px 20px;
	margin:30px 20px 20px 20px;
	background:transparent url(images/fond_box_demarches_accueil.gif) no-repeat left bottom;
	float:none;
}

* html body#accueil #demarchesFrequentes {
	margin:30px 10px 20px 10px;
}

#accueil #demarchesFrequentes h1 {
	color:#900;
	padding:6px 0 0 40px;
	margin:0 -20px 0 -20px;
	background:transparent url(images/fond_h1_demarches_accueil.gif) no-repeat left top;
}

#accueil #demarchesFrequentes ul {
	background:none;
}

#accueil #demarchesFrequentes ul li {
	width:250px;
	margin:0 30px 0 0;
	background:transparent url(images/puce_listes_demarches.gif) no-repeat left 0.5em;
	float:none;
}

#accueil #demarchesFrequentes ul li a {
	color:#900;
}

#accueil #demarchesFrequentes ul ul li {
	margin:0;
	background:transparent url(images/puce_etoile_noire.gif) no-repeat left 50%;
	float:none;
}

#accueil #demarchesFrequentes ul ul li a {
	color:#4b4b4b;
}

#accueil #demarchesFrequentes ul ul li a:hover {
	color:#900;
}

#accueil #accesRapide {
	margin:0 20px 0 0;
	float:none;
}

* html body#accueil #accesRapide {
	margin:0 10px 0 0;
}