/*
Gabarit 3 colonnes :
http://css.alsacreations.com/xmedia/exemples/3colonnes/exemple-3.html
*/
body
{
  font-family: Verdana, Arial, Helvetica, sans-serif; 
  font-size: 11px; 
}

ul, ol {
	margin: 0 0 0 20px;
	padding: 0;
	}

li {
   }

input, textarea, select {
  font-family: Verdana, Arial, Helvetica, sans-serif; 
  font-size: 11px; 	
  }

a img,:link img,:visited img { border: none; }

h1 { font-size: 12pt; font-weight: bold; color: red; }
h2 { font-size: 11pt; font-weight: bold; }
h3 { font-size: 10pt; font-weight: bold; }

a {
    color: #AF4A00; /* #D75B00 */
	text-decoration:none;
}

a:hover {
	text-decoration:underline;
}

html, body
{
  padding: 0;
  margin: 0;
  color: black;
  height: 100%;
  font-family: Verdana, Arial, Helvetica, sans-serif; 
  font-size: 11px;
  line-height: normal;
}

label {
  display: block;
}

ul {
margin: 5px 0 5px 20px;
}

address, dl, p {
  padding:10px 0 5px;
  margin: 0;
}

blockquote {
  margin: 0 30px;
}

h1, h2, h3 {
  margin-bottom: 5px;
}

td {
  vertical-align: top;	
}

div.spacer {
 	clear: both;
 	height: 0px;
 	background-color: blue;
 }

#container {
	color:#303030;
	margin:0;
	padding:0;
	min-width:770px;
	text-align:left;
	width:100%;
	background:#f0f0f0 url(/images/11-septembre-body.jpg) repeat-x;
	margin-bottom:auto;
}

#sitename {
  background-color: #000000;
  color:#ffffff;
  height: 100px;
  width: 100%;
  }

#sitename h1 {
  color:#ffffff;
  padding: 10px 0 15px 0;
  margin: 0;
  }
  
#sitename a {
  color:#ffffff;
  }

#intro {
	border: 1px dotted #808080;
	padding: 5px;
	margin-bottom: 15px;
	}

#evenements {
    margin-bottom: 15px;
	}

#wrap {
	clear:both;
/*	font-size:0.9em; */
	padding:0;
	margin-top: 5px;
	margin-bottom:auto;
}


/*** Sidebars ***/

#leftside,#rightside {
	margin:0;
	padding:0 10px 10px;
	width:175px;
}

#leftside {
	float:left;
	margin-right:10px;
}

#rightside {
	float:right;
	margin-left:10px;
}

/*** Sidebar menu ***/

/* obsolete */
#leftside h2, #rightside h2 {
	font-size: 1.2em;
	margin-top: 3px;
	padding: 5px 5px 1px 0;
	border-bottom: 2px solid #BEBFC3;
	margin-bottom: 3px;
}

div.widgettitle {
	font-size: 1.2em;
	margin-top: 3px;
	padding: 5px 5px 1px 0;
	border-bottom: 2px solid #BEBFC3;
	margin-bottom: 3px;
}

#leftside ul, #rightside ul {
	padding: 0px 0px 2px 0;
	margin: 0px;
}

#leftside li, #rightside li {
	list-style-type: none;
	/*margin-left: 10pt;*/
	margin-bottom: 2pt;
}

li#categories li a, li#archives li a, li.pagenav li a {
	background:#e8e9ea;
	border:1px solid #b0b0b0;
	display:block;
	margin-top:3px;
	padding:5px 4px 4px 8px;
	position:relative;
	text-transform: capitalize;
	width:140px;
}

li#categories li a:hover, li#archives li a:hover, li.pagenav li a:hover {
	background:#f8f9fa;
	border:1px solid #909090;
	color:#303030;
	text-decoration:none;
}

li#categories ul.children li a, li#archives ul.children li a, li.pagenav ul.children li a {
	font-size:0.8em;
	letter-spacing:1px;
	margin:3px 0 2px 10px;
	padding:4px 2px 2px 8px;
	width:125px;
}

li#categories ul.children li li, li#archives ul.children li li, li.pagenav ul.children li li {
	padding-left: 10px;
}

li#categories ul.children li li a, li#archives ul.children li li a, li.pagenav ul.children li li a {
	width: 115px;
}

li.feed {
	background: url(/images/rss.gif) no-repeat left top;
	padding: 2px 0 8px 20px;
}

#recent-comments ul li {
	padding-bottom: 5px;
}

#recent-posts ul li {
	padding-bottom: 5px;
}

/*** Content ***/

#content,#contentalt {
	background-color:#fafcff;
	border:1px solid #909090;
	color:#2a2a2a;
	padding:15px 20px 5px;
	overflow: hidden;
	_overflow: visible;
	_height: 1%;
}


#content {	
	/*margin:0 200px;*/
}

#contentalt {	
	/*margin:0 200px 0 20px;*/
}

#content h1, #content h2, #contentalt h1,#contentalt h2 {
	background-color:inherit;
	color:#606060;
	font-size: 18px;
	font-weight:bold;
	margin:0 0 15px;
	padding:0;
}

#content h1, #content h2, #contentalt h1 {
	border-bottom: 1px solid #b0b0b0;
}

#content h2 {
	color:#606060;
	margin:0 0 10px;
}

#page {
	border-bottom: 1px solid #b0b0b0;
	padding-bottom: 10px;
	margin-bottom: 10px;
	font-size: 12px;
	line-height: 17px;
}

.category {
	border-bottom: 1px solid #b0b0b0;
}

.date {
	margin-top: 0;
	padding-top: 0px;
	
}

div.post {
	padding-top: 0px;
	padding-bottom: 10px;
	margin: 0px;
}

div.entry {
	font-size: 12px;
	line-height: 17px;
	}

.navigation {
	margin: 0 0 20px 0;
	padding: 0 0 20px 0;
	border-bottom: 1px dashed #b0b0b0;
}

.bottomnavigation {
	margin: 30px 0 0 0;
	padding: 5px 0 30px 0;
	border-top: 1px dashed #b0b0b0;
}

.alignleft {
	float: left;
	text-align: left;
}

.alignright {
	float: right;
	text-align: right;
}


/*** Footer ***/

#footer {
	background:#8b8b8b url(/images/footerbg.jpg) top left repeat-x;
	clear:both;
	font-size: 9pt;
	margin: 0;
	padding: 0;
	width:100%;
	color: #eeeeee;
	text-align: center;
}

#footer-commentaires {
	padding: 10px 0 0 10px;
	text-align: left;
	width: auto;
	margin: auto;
	float:left;
	}

#footer-commentaires ul {
	margin: 0;
	padding: 0;
	}

#footer-commentaires li {
	list-style-type: none;
	width: 250px;
	margin: 5px;
	padding: 5px 0;
	border-top: 1px dotted #B0B0B0;
	}

div#footer-credit {
	text-align:center;
	margin: 10px 10px;
	padding: 10px 0;
	clear: both;
	font-size: 11px;
	border-top: 1px dotted #B0B0B0;
	}

#footer a {
	color: #EFBE68;
}

#footer2 {
  float: left;
}

#footer3 {
  float: left;
  padding: 20px 10px 10px 10px;
  text-align: left;
}

#footer4 {
  padding: 10px;
  text-align: left;
  float: left;
  width: 220px;
}

#footer4 ul {
  padding: 0 0 0 0;
}

/*** comments Form ***/

div.form-row {
  margin: 5px 0;
  clear: both;
}

div.form-field {
  margin: 5px 10px 5px 0;
  float: left;
}

div.form-field-last {
  margin: 5px 0 5px 0;
  float: left;
}

#commentform {
	width: 97%;
}

#commentform label {
	 font-size: 10px;
	 margin-bottom: 1px;
	}

#commentform input.field1 {
 width: 165px;
 font-size: 10pt;
 margin: 0;
 padding: 1px 0;
}

#commentform #comment {
 width: 100%;
 height: 160px;
 font-size: 10pt;
 padding: 1px 0;
}

#commentform #submit {
	background:#f0f0f0;
	border:1px solid #b0b0b0;
}

#submit:hover {
	background: #e8e9ea;
	border: 1px solid #848484;
	cursor: pointer;
}

div.indicator {
  width: 16px;
  height: 16px;
  background: url("/images/indicator.gif") no-repeat 0 0;
}

/*** Comments Display ***/

.postmetadata {
	background:#e8e9ea;
	font-size: 0.9em;
	border: 1px solid #b0b0b0;
	padding: 10px;
	margin: 0px;
}

ol.commentlist li {
	border: 1px solid #b0b0b0;
	padding: 10px;
	margin-bottom: 10px;
}

ol.commentlist li cite {
	text-transform: capitalize;
}


.alt {
	background:#e8e9ea;
}


/*** Various classes ***/

.clearingdiv {
	clear:both;
	height:30px;
	width:1px;
}

.hide {
	display:none;
}

.cleaner {
		clear:both;
		height:1px;
		font-size:1px;
		border:none;
		margin:0; padding:0;
		background:transparent;
		}
		
/****************************************** DOSSIERS ******************************************/

.bloc {
	position: relative;
	margin: 10px 0 0 0;
	border: 1px dotted silver;
	background-color: #f0f1f3;
	background-image: url("/images/bg1.jpg");
	padding: 10px;
	_height: 150px;
	}
	
.bloc .dossier-vignette {
  float:left;
  margin: 0 15px 0 0;
  padding: 0;
}

.bloc h4 {
	font-weight: bold;
	font-size: 12px;
	padding: 0;
	margin: 0;
	}

.categorie {
	margin-bottom: 30px;
	}

.categorie h3 {
	color:#D75B00;
	font-size: 14px;
	border-bottom: 1px solid #D75B00;
	letter-spacing: 1px;
}

/****************************************** LIENS ******************************************/

.categorie-liens li {
  margin-bottom: 5px;
}

.categorie-liens li a {
  font-weight: bold;	
}

.lien-description {
  color: #666666;	
}

/****************************************** TABS ******************************************/


/*--------------------------------------------------
  REQUIRED to hide the non-active tab content.
  But do not hide them in the print stylesheet!
  --------------------------------------------------*/
.tabberlive .tabbertabhide {
 display:none;
}

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {
}
.tabberlive {
}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav
{
 margin:0;
 padding: 3px 0;
 border-bottom: 1px solid #666666;
}

ul.tabbernav li
{
 list-style: none;
 margin: 0;
 display: inline;
}

ul.tabbernav li a
{
 padding: 3px 6px;
 margin-left: 3px;
 border: 1px solid #666666;
 border-bottom: none;
 background-image: url("/images/fond-onglet.gif");
 text-decoration: none;
 color: #eeeeee;
 font-weight: bold;
 font-size: 10pt;
}

ul.tabbernav li a:hover
{
 background: #000000;
 border-color: #666666;
 color: #E8A317;
}

ul.tabbernav li.tabberactive a
{
 background-color: #f0f0f0;
 color: #AF4A00;
 background-image: none;
 border-bottom: 1px solid #f0f0f0;
}

ul.tabbernav li.tabberactive a:hover
{
 background-color: #f4f4f4;
 color: #D75B00;
 background-image: none;
 border-bottom: 1px solid #f0f0f0;
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {
 padding: 10px;
 border:1px solid #666666;
 border-top:0;
 background-color: #ffffff;
 background-image: url("/images/fond-zone-onglet.gif");
 background-repeat: repeat-x;

 /* If you don't want the tab size changing whenever a tab is changed
    you can set a fixed height */

 /* height:200px; */

 /* If you set a fix height set overflow to auto and you will get a
    scrollbar when necessary */

 /* overflow:auto; */
}

/* Example of using an ID to set different styles for the tabs on the page */
.tabberlive#tab1 {
}
.tabberlive#tab2 {
}
.tabberlive#tab2 .tabbertab {
 height:200px;
 overflow:auto;
}

a#indextabsnav5 { color: #FFD68F; }
li.tabberactive a#indextabsnav5 { color: #D75B00; }

/****************************************** VIDEO CONTAINER ******************************************/

.video-container-title {
	text-align: center;
	}

/****************************************** TOOLTIP ******************************************/

.tooltipheader {
	display: none;
	}
	
.tooltip {
	 margin: 8px 0 0 0;
   border:1px solid black;
   padding: 2px 4px 2px 4px;
   font-weight: bold;
   _background-color: black;
   background-image: url("/images/noir85.png");
   color: white;
}

* html .tooltip {
   background-image: none;
}



/******************************** ReOpen911 ***********************************/

table.myTable2 {
  border-collapse: collapse;
  padding: 0;
  }
  
.myTable2 th {
    padding: 0px 15px 0 0;
	}

.myTable2 th div {
    border-bottom: 1px solid #999999;
    padding-bottom: 2px;
	}

.myTable2 td {
	padding: 2px 15px 0 0px;
	}

table.myTable {
  border: 1px solid grey;
  border-collapse: collapse;
  }

.myTable th {
  background-color: #000000;
  color: #FFFFFF; 
  padding: 5px 2px;
  }

.myTable td, .myTable th {
  padding: 2px 5px;
  }

.myTable td { 
  border-top: 1px solid silver;
  }

  
.form-errors {
	border: 1px solid #E00000;
	padding: 10px 10px 10px 48px;
	color: #C00000;
	margin-bottom: 10px;
	background-color: #FFE0E0;
	background-image: url("/images/icons/alert-stop-2.png");
	background-repeat: no-repeat;
	background-position: 6px 10px;
	font-weight: bold;
	width: 570px;
	}
	

/* liScroll style declarations */

.tickercontainer { /* the outer div with the black border */
width: 100%; 
height: 26px; 
margin: 0; 
padding: 0;
overflow: hidden; 
}
.tickercontainer .mask { /* that serves as a mask. so you get a sort of padding both left and right */
position: relative;
width: 100%;
overflow: hidden;
}
ul.newsticker { /* that's your list */
position: relative;
left: 450px;
list-style-type: none;
margin: 0;
padding: 0;
}
ul.newsticker li {
float: left; /* important: display inline gives incorrect results when you check for elem's width */
margin: 0;
padding: 0;
}



/************************************************************************/


#ptsessentiels {
  height: 220px;
}

#ptsessentiels .jcarousel-prev, #ptsessentiels .jcarousel-next {
  display: none !important;
}

#ptsessentiels .jcarousel-control {
  left: auto !important;
  right: 5px !important;
  top: 5px !important;
}

#ptsessentiels .jcarousel-skin-tango .jcarousel-container-horizontal {
  width: 760px !important;
}

#ptsessentiels .jcarousel-skin-tango .jcarousel-clip-horizontal {
  width: 760px !important;
}

#ptsessentiels .jcarousel-skin-tango .jcarousel-item-horizontal {
  //margin-right:20px !important;
  margin-left: 5px;
}
 
#ptsessentiels h3 {
  margin-top: 5px !important;
  margin-left: 5px;
  }

#ptsessentiels .bloc {
  padding-bottom: 0 !important;
  height: 165px;
  }

#ptsessentiels .jcarousel-item {
  height: 190px !important;
  }
  
#ptsessentiels .jcarousel-clip-horizontal {
  height: 190px !important;
  padding-bottom: 0;
  }

#ptsessentiels h4 {
  font-size: 13px !important;
  font-weight: bold !important;
  margin-bottom: 5px !important;
}