@charset "iso-8859-1";

/*============================================================================================================================*/
body {
	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
	background: #556;
	margin: 0;
	padding: 0;
	color: #000;
}

ul, ol, dl {
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;
	padding-right: 15px;
	padding-left: 15px;
}
a img {
	border: none;
}

a:link {
	color:#445;
	text-decoration: underline;
}
a:visited {
	color: #556;
	text-decoration: underline;
}
a:hover, a:active, a:focus {
	text-decoration: none;
}

.container {
	width: 80%;
	max-width: 1260px;
	min-width: 780px;
	background: #FFF;
	margin: 0 auto;
}

.header {
	background: #678;
}

.sidebar1 {
	float: right;
	width: 20%;
	background: #9AC;
	padding-bottom: 10px;
}
.content {
	padding: 10px 0;
	width: 80%;
		float: right;
}

.content ul, .content ol {
	padding: 0 15px 15px 40px;
}

ul.nav {
	list-style: none;
	border-top: 1px solid #666;
	margin-bottom: 15px;
}
ul.nav li {
	border-bottom: 1px solid #666;
}
ul.nav a, ul.nav a:visited {
	padding: 5px 5px 5px 15px;
	display: block;
	text-decoration: none;
	background: #89A;
	color: #000;
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus {
	background: #678;
	color: #FFF;
}

.footer {
	padding: 10px 0;
	background: #678;
	position: relative;
	clear: both;
}

.fltrt {
	float: right;
	margin-left: 8px;
}
.fltlft {
	float: left;
	margin-right: 8px;
}
.clearfloat {
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0;
}
/*============================================================================================================================*/
/*A FAIRE : REMPLACER .header par .container dans le DIV DU CONTENU*/
/*RESTE PB AVEC container,header,ul #MenuBar1.Menubarhorizonatl et container header a h2*/
/*CSS
	[font-style] [font-variant] [font-weight] font-size[/line height] font-family
	padding, margin TOP, RIGHT, BOTTOM, LEFT
	background:#fff url('img_tree.png') no-repeat right top;}
http://www.yoyodesign.org/doc/w3c/css2/cover.html#minitoc
http://www.yoyodesign.org/doc/w3c/css2/syndata.html#q8
http://www.yoyodesign.org/doc/w3c/css2/selector.html

http://www.w3schools.com/css/css_font.asp
*/

.header,
.container
{
	width: 100%;
	/*une valeur « max-width » pour éviter que la mise en page ne soit trop large sur ecran grande taille. Lisibilité de la longueur de ligne est ainsi améliorée. pas IE6 */
	max-width: 1260px; max-width: none;
	/*min-width:none; NON VALIDE 320 480 960*/
	min-width: 780px;
	/*240x320 petit telephne, 320 x 480 (iPhone), 480 x 640 (petite tablette), 768 x 1024 (iPad - Portrait), 1024 x 768 (iPad - Paysage)*/
	/*600x800 petite tablette, 1200x??? ordi portables et bureau*/
	margin: 0 auto; /*la valeur automatique sur les côtés, associée à la largeur, permet de centrer la mise en page. Elle n'est pas nécessaire si vous fixez la largeur du conteneur à 100%.*/
}

html { font-size: 1em;}

* { line-height:1.4; }

body {/*.875em 14px, 0.85em; 11,6px, .8125em 13 px*/
font-size: 0.84375em; /*13,5 px,	.8375 13.4*/

	font-family: Verdana, Geneva, sans-serif;
/*	margin: 4em; = 64px*/
	margin: 0;
	line-height: 1.4;
}

/* COULEURS DE FOND*/
body,
.container,
.content,
.sidebar1
{background-color: #F2DAC4; /*BEIGE*/ }

/*ON PEUT METTRE UNE COULEUR DIFFERENTE POUR LE SITEBAR POUR FAIRE UNE SEPARATION AVEC LE CONTENU*/
.sidebar1 .nav,
.sidebar1 .nav li,
.sidebar1 .nav li a,
.sidebar1 .nav li a:visited,
.sidebar1 .nav li a:hover ,
ul.MenuBarHorizontal li,
ul.MenuBarHorizontal a
{/*#CD782A; ORANGE MENU*/
	background-color: #EE7F13; /*ORANGE LOGO*/
}

/*On séparer en 2 parce que IE6 ne comprend pas le >*/
.container > p, .header > p { 	background-color: #C43636; /*ESSAI ROUGE */ }

.header,
.sidebar1 .actus li p, /*.sidebar1 .actus *, .sidebar1 .actus li*/
.footer
{/*#A83838; ROUGE ACTIF	#933;*/
 	background-color: #C43636; /*rgb(196, 54, 54) ESSAI ROUGE */
	/*background: url(../images/footer_bottom_right.png) no-repeat right bottom;*/
}



/* COULEURS*/

.content p {
	color: #000; /*NOIR*/
}

.content h1
{
	color: #C43636; /*ESSAI ROUGE */
}

.sidebar1 .nav li ,
.sidebar1 .nav li a,
.sidebar1 .nav li a:visited,
.sidebar1 .nav li a:hover
{/*color: #A83838;*/
color: #933; /*ROUGE FONCE moins que 600*/
}

.sidebar1 .actus li p,
.footer p,
.footer ul.menu_principal a
{	color: #FFF; /*BLANC*/}

.footer .vcard,
.footer .sujet
{ color: #E5E5E5; /*GRIS NON UTILISE*/
}
/*.header*/
.sidebar1 .actus a:link, .footer .vcard a:link {
	color:#000; /*NOIR ACTUS LIEN*/
}
.sidebar1 .actus a:visited, .footer .vcard a:visited {
	color: #C0C0C0; /*GRIS ACTUS LIEN VISITE*/
}
.sidebar1 .actus a:hover, .footer .vcard a:hover {
	color: #EE7F13; /*ORANGE LOGO*/
}
/* Les formulaires */
fieldset  p  { background-color:#EE7F13; }

/*MENU*/
/*COMMENTE
ul.MenuBarHorizontal a 	 { color: #333; /*PRESQUE NOIR	}
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
{ 	background-color: #33C; /*BLEU ASSEZ FONCE jamais vu
	color: #FFF; /*BLANC
}
*/

ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
	{ background-color: white; color: black;}

ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
{	color: #000; /*NOIR ecriture menu*/}

ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
{ 	background-image: url(/SpryAssets/SpryMenuBarDown.gif); /*Conserve la fleche noire au lieu de la blanche car fond blanc*/}

ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
{	background-image: url(/SpryAssets/SpryMenuBarRight.gif); }

ul.MenuBarHorizontal ul li
{ /*width: 8.2em;*/ width: 15em; /*AJOUT largeur des sous menu assez grande*/ }
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
{	/*#C5D293; VERT PALE, #F2DAC4; BEIGE, #FAF0E7; BEIGE ROSE*/
	background-color: #FFF; /*BLANC*/
}



/*LE RESTE*/

.container,
.header {
	position: relative;
	/*background-image: url(../images/header_top_right.png);*/
	background-repeat: no-repeat;
	background-position: right top;
	height: 120px; 	padding-bottom: 0.5em;
}
.header ,
.container
{
	width: 100%;
/*« max-width » utile pour éviter une mise en page trop large sur écran grande taille. La lisibilité de la longueur de ligne est ainsi améliorée. pas IE6*/
	max-width: 1260px; /*UNIV ORLEANS mais bacckground:(url"....") no-repeat scoll center top rgb(96,96,96) */
	max-width:1002px; max-width: none;
/*« min-width »	 960px;	 min-width:none; NON VALIDE*/
	margin: 0 auto; /*la valeur automatique sur les côtés, associée à la largeur, permet de centrer la mise en page. Elle n'est pas nécessaire si vous fixez la largeur du conteneur à 100%.*/
	height: 128px;	padding-bottom: 0;
}
/*COMPLEMENT POUR COHERENCE*/
.container
{	height:inherit; /*background-color: transparent;*/}

/*Indentation generale */
.container p,
.header p {
	text-indent: 3.5714em; /*50 / 14*/
}
.container p
{
	text-indent: 2.1428em; /*30 / 14*/
}

.container h2,
.header h2 {
/*	background-image: url(/images/logoLG.png);
	background-repeat: no-repeat;
	background-size:15%;*/ /*120 / 780	15,3846%*/
	height: 128px; /*heigth: 15,3846%*/
	width: 128px; /*width: 15,3846%*/
	top: auto;
	position: absolute;
	text-align: left;
	text-indent: -1000px;
	left: auto;
}

#MenuBar1
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	position:absolute; padding-top: 0;
	margin-top: -2.50em; top:129px; /*proche du bon pour em~=14px	9.4814  128/13.5 */
}

/*ul.MenuBarHorizontal > li a*/
/*ul.MenuBarHorizontal a, SUPPRIME CAR TROP LARGE POUR IE mais perd le niveau vertical*/
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover,
ul.MenuBarHorizontal > li, ul.MenuBarHorizontal > li > a,
ul.MenuBarHorizontal a:hover,
ul.MenuBarHorizontal li:hover li:hover /*permet de faire fonctionner IE*/
/*,ul.MenuBarHorizontal > li:hover > ul > li:hover a*/ /*OK pour n2 FF mais pas IE*/
{ /*COIN ARRONDI*/
  border-radius: 0.8571em; /*12px / 14 de 0.875 (14/16 px)*/
}


@media screen, projection
{
	ul.MenuBarHorizontal li.MenuBarItemIE
	{ margin-left: .5em; margin-left: 0; margin-right: .5em; font-weight: bold;
	display: inline; f\loat: left; background: #FFF;
	}
}

ul.MenuBarHorizontal li
{/* width: 8em puis 11em;*/
	width: 10.7em; /*reduit la taille des boites du menu*/
	width: auto; /*CELA SUFFIT A REGLER LE PROBLEME*/
	/*.5em;*/ margin-left: 0; margin-right: .5em;
	font-weight: bold;
}

.container h3,
.header h3 {
	text-indent: 10px;
	text-align: center;
}

.content {
	height: auto;
}
.content p {
	text-align: left;
}
/*TITRE DANS CHAQUE PAGE*/
.content h1 {
	font-family: Georgia, "Times New Roman", Times, serif, Verdana,Arial,Helvetica,sans-serif;
	font-size: 2.5em;
	font-style: italic;
}

.ssbord * {border: 1px none; text-align: left;} /*tous les elements dans table*/

.bordint table, .bordint th { border: 1px none; text-align: left;}
.bordint td { border:1px solid black;
	display: table-cell;
	vertical-align: inherit;
	text-align: inherit;
	padding: .5em;}

table, tbody, tr,th {
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	outline: 0 none;
	background: none repeat scroll 0% 0% transparent;
	text-align: left;
}
/*knacss-reset*/
p, li p { margin: 0 0 1em; line-height: 1.4;} /*Coherence entre comportement entre knacss et reset marge basse*/
h5 { margin: 0 0 1.67em; font-size:100%; line-height: 1.4; font-weight:bold; }
h1 { margin: 0 0 .67em 0; line-height: 1.4; font-weight:bold; }
ol, ul { list-style: none outside none; }
table { border-spacing: 1px; }

/*
img,
table, tbody, tr,th,td{
	 padding: 0;
	 font-size: 100%;
	 vertical-align: baseline;
	 outline: 0 none;
	 background: none repeat scroll 0% 0% transparent;
	 text-align: left;
}
*/
/*img { width: auto; height: auto; } A SUPPRIMER DANS knacss*/


/* AJOUT POUR REGLER LES PROBLEMES DANS LES SPRY TABLETS*/
.content table {
	border-collapse: collapse;
	border-spacing: 1px;
	margin-left: .5em; /*conserve un petit espace à gauche dans les tableaux*/
	/*text-align: center;*/
}

/*~~ Ce sélecteur groupé donne de l'espace aux listes dans la zone .content ~~*/
.essai {
	margin-left: -50px; /*Recale tout à gauche*/
}

.sidebar1 .nav li,
.sidebar1 .nav li a,
.sidebar1 .nav li a:visited,
.sidebar1 .nav li a:hover {
	text-decoration: none;
/*	padding-left: 50px;*/
	text-align: left;
}

.sidebar1 .nav {	border-top: 1px solid #C43636; /*bordure sup ul et séparation des boutons li*/ }

.sidebar1 .nav li {
	border-bottom: 1px solid #C43636; /*bordure basse ul et séparation des boutons li*/
	padding-left: 0.5em;
	font-weight: bold; font-size: 0.9629em; /*MENU NAVIG DE DROITE BOITE  13/13.5 px*/
}

.sidebar1 ul.nav a, .sidebar1 ul.nav a:visited {padding-left:0; padding-right: 0.1em; } /*MENU DROITE CONTENU*/

.sidebar1 .nav #expositions a { /*NE SERT PAS*/
	background: url(../images/fruits.png) no-repeat 2px 2px; /*url(../images/legumes.png); */
}

.footer,.arrondi { /*COIN ARRONDI*/
 border-radius: 0.8571em; /*12px / 14  de 0.875 (14/16 px)*/
}

.footer p {
	padding:0;
	margin:0;
	line-height: 1.2em;
}

.footer ul.menu_principal{
	font-size:0.75em;
	width:40%;
	margin:0 auto;
}
.footer ul.menu_principal a{
	text-decoration:none;
}
.footer ul.menu_principal li{
	float:left;
}
.footer .vcard {
	border-left: 1px dotted #666;
	padding: 1em;
	clear:both;
	font-size:0.8em;
	font-family: Georgia, "Times New Roman", Times, serif, Verdana,Arial,Helvetica,sans-serif;
	min-width: 18.5em;
}
 
.footer .vcard p{ font-weight:bold; } 
 
.footer .sujet {
	font-weight:bold;
	font-size: 1.2em;
	font-style: italic;
	margin-bottom: .5em;
}

.sidebar1 ul.actus a:link, .sidebar1 ul.actus a:visited,
.footer .vcard a:link, .footer .vcard a:visited
{
	text-decoration:underline;
}

.sidebar1 ul.actus a:hover, .footer .vcard a:hover {
	text-decoration:none;
}

.sidebar1 .actus li p
{ 
text-indent: 30px; /*12px / 16px*/
  border-radius: 0.8571em;
  font-weight: bold;
 /*margin: 15px 0 0 0;*/
 } /*LES ACTUS EXPOS*/


a#lelogo
{
	background: url(/images/logoLG.png) no-repeat;
	height: 128px;	width: 128px; top: auto; position: absolute; display: block;
}
a#lelogo:hover{ background-color: white; }

#entete_image_droite
{
	background: url(/images/LoiretCA.jpg) no-repeat;
	height:128px;width: 156px;
	top:0;
	position: absolute;
/*	text-align: right; text-indent: -1000px; right: auto; left: 969px; padding-left: 0; padding-right: 0;*/ /*SOIT 969 + 128 = 1097*/
	left:100%;
	margin-left: -156px;
}

#entete_texte
{
text-indent: 110px;
text-align: left;
font: bold 1em/1.4 Verdana,Arial,Helvetica,sans-serif;
color: white;
margin-top : 0;
}

.texte_enplus,
#entete_texte_ajout /*PLUS UTILISE*/
{
position:absolute; top: 3.5714em; top: auto; left: 160px;
margin: auto; padding: .3571em .7143em;
text-indent: .7143em;
text-align: center;
vertical-align:middle;
font: bold 1em/1.4 Verdana,Arial,Helvetica,sans-serif;
/*12px / 14px (c'est déjà 13.6 soit 0.85, 12px / 14  de 0.875 (14/16 px), 12px / 14  de 0.875 (14/16 px)*/
  border-radius: 0.8571em;
	color: #333;
	background-color:#EE7F13; /*ORANGE LOGO*/
}

.texte_enplus { text-indent: 0; display: inline; position: relative; top:.3571em; }

.txt_centre {background-color:#EE7F13;vertical-align:middle;text-align:center; padding-top:1em; }

.MEDIASCREEN {
z-index:10; position: fixed; left: 10px; bottom: 0.5em; width: auto; height: 10px;
color:black;
font-size:0.375em; font-size:0.25em; font-size:4pt; /* 6px 4pt / 16px*/
}
@media only screen and (min-width: 1200px) { /*1200 et au dessous pb em car 20px au lieu de 16px ???*/
	.MEDIASCREEN { color:rgb(196,54,54); } /*W7 bureau*/
}

@media only screen and (max-width: 1200px) { /*1200 et en dessous 68.75em*/
	.MEDIASCREEN { color:orange; } /*XP Bureau 1152*/
}

@media only screen and (max-width: 1100px) { /*1100 et en dessous 50em*/
	.MEDIASCREEN { color:blue; } /*1024x768 Tablette paysage*/
}
@media only screen and (max-width: 800px) { /*800 et en dessous 38.75em*/
	.MEDIASCREEN { color:red; } /*Petite Tablette paysage 800x680*/ /*Petite Tablette portrait 680x800*/ /*768x1024 Tablette portrait*/
}
@media only screen and (max-width: 620px) { /*620 et en dessou 30em*/
	.MEDIASCREEN { color:green; }
}
@media only screen and (max-width: 480px) { /*480 et en dessou 30em*/
	.MEDIASCREEN { color:yellow; } /*Mobile paysage 480x320*/
}
@media only screen and (max-width: 300px) { /*300 et en dessou 18.75em*/
	.MEDIASCREEN { color:black; } /*Mobile portrait 320x480*/
}

.boite { width:400px; margin-right: auto; margin-left: auto; text-align:center; }
.boite div { background-color: #FFF; border: 4px solid #EE7F13; color: #000; font-weight: bold; text-align: center; } 

