/* CSS Document */

/*
	Couleur du fond : 		#fff
	Couleur de la bordure :	#08c
	Couleur texte h3 : 		#06a
	Couleur texte h3 : 		#bed1e5
	Couleur flèche : 		#feb715
*/

/* Simple box */
.simpleBox {border:1px dotted #333;}

/* Snazzy box */
.xsnazzy h1, .xsnazzy h2 {margin:0 10px; letter-spacing:1px;}
.xsnazzy p {margin:0 10px;}
.xsnazzy h3 {margin:0; padding:0 10px; background-color:#bed1e5; }

.xsnazzy h1 {font-size:2.5em; color:#fff;}
.xsnazzy h2 {font-size:2em;color:#06a; border:0;}
.xsnazzy h3 {font-size:1.5em;color:#06a; border:0;border-bottom:#08c 1px dotted;}
.xsnazzy p {padding:0.5em 0;}
.xsnazzy h2 {padding-top:0.5em;}
.xsnazzy h3 {padding-top:0;}
.xsnazzy {background: transparent;}

.xtop, .xbottom {display:block; background:transparent; font-size:1px;}
.xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;}
.xb1, .xb2, .xb3 {height:1px;}
.xb2, .xb3, .xb4 {background:#fff; border-left:1px solid #08c; border-right:1px solid #08c;}

.xtop .xb2, .xtop .xb3, .xtop .xb4 {background:#bed1e5; border-left:1px solid #08c; border-right:1px solid #08c;}

.xb1 {margin:0 5px; background:#08c;}
.xb2 {margin:0 3px; border-width:0 2px;}
.xb3 {margin:0 2px;}
.xb4 {height:2px; margin:0 1px;}

.xb1 {margin:0 2px; background:#08c;}
.xb4 {height:1px;}
.xtop .xb4 {background:#fff;}
.xsnazzy h3 {background: #bed1e5 url(nav_hover.gif) left -5px repeat-x; }
.xboxcontent {display:block; background:#fff; border:0 solid #08c; border-width:0 1px;}

.xsnazzy h3.noback {background: #fff none; }

.gris .xb1{background-color:#ccc;}
.gris .xb2, .gris .xb3, .gris .xb4 {border-color:#ccc; }
.gris .xtop .xb2, .gris xtop .xb3, .gris .xtop .xb4 {border-color:#ccc;}
.gris .xboxcontent {border-color:#ccc;}
.gris .xboxcontent p {margin:0; padding:0;}

/* Le top à un background plein */
/*
.xsnazzy {background: transparent; margin:1em;}
*/
/*
.xsnazzy table {margin: 10px;}
.xsnazzy table td {font-size:11px;}
*/
/* image de fond de h3 */
/* Le coin serré
	<b class="xtop"><b class="xb1"></b><b class="xb2"></b><b class="xb3"></b><b class="xb4"></b></b>
    <b class="xbottom"><b class="xb4"></b><b class="xb3"></b><b class="xb2"></b><b class="xb1"></b></b>
*/


/* CSS original pour les snazzy box */
/*
#xsnazzy h1, #xsnazzy h2, #xsnazzy p {margin:0 10px; letter-spacing:1px;}
#xsnazzy h1 {font-size:2.5em; color:#fff;}
#xsnazzy h2 {font-size:2em;color:#06a; border:0;}
#xsnazzy p {padding-bottom:0.5em;}
#xsnazzy h2 {padding-top:0.5em;}
#xsnazzy {background: transparent; margin:1em;}

.xtop, .xbottom {display:block; background:transparent; font-size:1px;}
.xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;}
.xb1, .xb2, .xb3 {height:1px;}
.xb2, .xb3, .xb4 {background:#fff; border-left:1px solid #08c; border-right:1px solid #08c;}
.xb1 {margin:0 5px; background:#08c;}
.xb2 {margin:0 3px; border-width:0 2px;}
.xb3 {margin:0 2px;}
.xb4 {height:2px; margin:0 1px;}

.xboxcontent {display:block; background:#fff; border:0 solid #08c; border-width:0 1px;}
*/

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

a.boldbuttons{
background: transparent url('rub-left.png') no-repeat top left;
display: block;

margin-left:10px;
float: left;

font-family:"Trebuchet MS", Arial, Tahoma;
font-size: 14px;
font-weight: bold;
text-decoration: none;

height: 117px; /* Height of button background height */
padding-left: 16px; /* Width of left menu image */

cursor:pointer;
/* font: bold 13px Arial; Change 13px as desired */
/* line-height: 109px; */ /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 30px) */
}

a:link.boldbuttons, a:visited.boldbuttons, a:hover.boldbuttons, a:active.boldbuttons{
color: white; /*button text color*/
text-decoration: none;
}

a.boldbuttons span{
font-family:"Trebuchet MS", Arial, Tahoma;
background: transparent url('rub-right.png') no-repeat top right;
display: block;
padding: 0;
/* padding: 4px 16px 4px 0px; */ /*Set 10px to be equal or greater than'padding-left' value above*/
height: 117px;
color: white; /*button text color*/
}

a:hover.boldbuttons{ /* Hover state CSS */
text-decoration: underline;
}


.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
width: 95%;
margin:auto;
}

.btnAssistanceLog {
background: transparent url("../dressing/boutonAssitanceLogiciels.png") no-repeat center;
height: 40px;
border: none;
}

.btnAssistanceLog:hover{
background: transparent url("../dressing/boutonAssitanceLogicielsHover.png") no-repeat center;
height: 40px;
border: none;
}


/*
ex .case_rub
border:1px solid #000;
-background-image: url(rub-Jocatop_03.gif);
vertical-align: top;
font-family:"Arial Black", Arial, Verdana;
*/
/*
.case_rub {
	background: #fff url(rub-Jocatop_03.png) top left no-repeat;
	width: 210px;
	height: 120px;
	padding-top: 0px;
	cursor: pointer;
}
.p_rub {
	font-family:"Trebuchet MS", Arial, Tahoma;
	font-size:14px;
	font-weight:bold;
	color:#FFFFFF;
	margin-top: 0;
}
.rub {
	margin: 0px 35px 0px 7px;
}
*/
	.box_div {
		width:560px;
 		height:450px;
		padding: 5px;
		background: url(css/haut2_h.gif) repeat-x 0 -20px #F9FBFD;
		border:1px solid #ccc;
		/*
		*/
		}
	.box_col {
		width:250px;
		height:120px;
		background: url(../dressing/box-coll_gen.gif) no-repeat #000;
		margin:10px;
		/*
		border:1px solid #888;
		padding:0px;
		width:180px;
		height:100px;
		*/
		}
	.box_content {
		margin: 4px 2px;
		}
	.box_col h3 {
		padding: 2px 4px;
		background: url(foot_h.gif) repeat-x 0 -2px #F9FBFD;
		/*
		background: transparent none;
		border-bottom:1px solid #888;
		background: url(band_h.gif) repeat-x #fff;
		background: url(haut2_h.gif) repeat-x 0 -30px #F9FBFD;
		*/
		}
	.box_col p {
		padding: 10px;
		/*  */
		}


/* 
  -- Even more rounded corners with CSS: Base stylesheet --
*/

.dialog {
 position:relative;
 margin:0px auto;
 min-width:8em;
 max-width:760px; /* based on image dimensions - not quite consistent with drip styles yet */
 color:#333;
 z-index:1;
 margin-left:12px; /* default, width of left corner */
 margin-bottom:0.5em; /* spacing under dialog */
}

.dialog .content,
.dialog .t,
.dialog .b,
.dialog .b div {
 /* background:transparent url(dialog2-blue-800x1600.png) no-repeat top right; */
  background:transparent url(rubrique_fond_3.png) no-repeat top right;
 /* _background-image:url(dialog2-blue.gif); */
  background:transparent url(rub-fond.png) no-repeat top right;
	/* Pour IE6 */
	_background:none;
	_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='css/rub-fond.png', sizingMethod='scale');
}

.dialog .content {
 position:relative;
 zoom:1;
 _overflow-y:hidden;
 /*  */
 padding:0px 12px 0px 0px;
}

.dialog .t {
 /* top+left vertical slice */
 position:absolute;
 left:0px;
 top:0px;
 width:12px; /* top slice width */
 margin-left:-12px;
 height:100%;
 _height:1600px; 
 /* */ /* arbitrary long height, IE 6 */
 background-position:top left;
}

.dialog .b {
 /* bottom */
 position:relative;
 width:100%;
}

.dialog .b,
.dialog .b div {
 height:20px; /* height of bottom cap/shade */
 font-size:1px;
}

.dialog .b {
 background-position:bottom right;
}

/*
.dialog .b div {
 position:relative;
 width:12px; /* bottom corner width **
 margin-left:-12px;
 background-position:bottom left;
}
*/

.dialog .b div {
 /* top+left vertical slice */
 position: absolute;
 left:0px;
 bottom:0px;
 width:12px; /* top slice width */
 margin-left:-12px;
 background-position:bottom left;
}



/* set the image to use and establish the lower-right position */ 
.cssbox, .cssbox_body, .cssbox_head, .cssbox_head h2, .cssbox_head h5 {
    background: transparent url(rubrique_fond_3.png) no-repeat bottom right; 
    background: transparent url(demobox.png) no-repeat bottom right; 
    background: transparent url(box-acc.gif) no-repeat bottom right; 
    
 } 
.cssbox { 
    width: 335px !important; /* intended total box width - padding-right(next) */
    width: 320px; /* IE Win = width - padding */
    padding-right: 15px; /* the gap on the right edge of the image (not content padding) */
    margin: 20px auto; /* use to position the box */ 
} 

/* set the top-right image */ 
.cssbox_head { 
    background-position: top right; margin-right: -15px; /* pull the right image over on top of border */
    padding-right: 40px; /* right-image-gap + right-inside padding */ 
} 

/* set the top-left image */ 
.cssbox_head h2 { 
    background-position: top left; 
    margin: 0; /* reset main site styles*/ 
    border: 0; /* ditto */ 
    padding: 25px 0 15px 40px; /* padding-left = image gap + interior padding ... no padding-right */ 
    height: auto !important; height: 1%; /* IE Holly Hack */ 
} 
/* set the lower-left corner image */ 
.cssbox_body { 
    background-position: bottom left; 
    margin-right: 25px; /* interior-padding right */ 
    padding: 15px 0 15px 40px; /* mirror .cssbox_head right/left */ 
}


.cssbox2, .cssbox2_body, .cssbox2_head, .cssbox2_head h1 {
    background: transparent url(box-acc.gif) no-repeat bottom right;     
} 

.cssbox2 { 
    width: 400px !important; /* intended total box width - padding-right(next) */
    width: 395px; /* IE Win = width - padding */
    padding-right: 5px; /* the gap on the right edge of the image (not content padding) */
    margin: 0 0; /* use to position the box */ 
} 
.cssbox2_head { 
    background-position: top right; margin-right: -5px; /* pull the right image over on top of border */
    padding-right: 30px; /* right-image-gap + right-inside padding */ 
}

.cssbox2_head h1 { 
    background-position: top left; 
    margin: 0; /* reset main site styles*/ 
    border: 0; /* ditto */ 
    padding: 10px 0 0px 20px; /* padding-left = image gap + interior padding ... no padding-right */ 
    height: auto !important; height: 1%; /* IE Holly Hack */ 
} 
/* set the lower-left corner image */ 
.cssbox2_body { 
    background-position: bottom left; 
    margin-right: 20px; /* interior-padding right */ 
    padding: 0 0 15px 20px; /* mirror .cssbox_head right/left */ 
}