/*************/

/*  vcd_grid  stylesheet */

/*************/

/******************/

/* GLOBAL LAYOUT  */

/******************/

body {

font-size:62.5%;

background:#f2f2f2 url(../img/bg.gif) repeat-y center;

font-family:"Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;

}



/*Font-size: 1.0em = 10px when browser default size is 16px*/

.container {

width:978px;

padding-top:0;

background-color:#fff;

margin:0 auto;

font-size:1em;

}



.header {

width:958px;

min-height:/*Non-IE6*/

80px;

height:/*Non-IE6*/

auto!important;

height:/*IE6*/

80px;

background:#e1e1e1 url(../img/narrowheader.jpg) no-repeat;

font-size:1em;

background-color:#FFF;

margin-left:9px;

}



.navbar {

white-space:/*IE hack*/

nowrap;

float:left;

width:958px;

background-color:#fff;

font-family:"Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;

font-size:/*Non-IE6*/

130%!important;

font-size:/*IE6*/

120%;

margin-left:20px;

}



/*Color navigation bar normal mode*/

.main {

clear:both;

width:958px;

padding:10px 10px 20px;

font-size:1em;

background:#fff url(../img/headerbottom.gif) repeat-x;

}



.content {

display:inline;

/*Fix IE floating margin bug*/

float:left;

width:676px;

background-color:#FFF;

font-size:1em;

overflow:/*Non-IE6*/

visible!important;

overflow:/*IE6*/

hidden;

margin-top:10px;

}



.subcontent {

display:/*Fix IE floating margin bug*/

inline;

float:right;

width:270px;

background-color:#fff;

font-size:1em;

overflow:/*Non-IE6*/

visible!important;

overflow:/*IE6*/

hidden;

margin-top:15px;

}



.footer {



clear:both;



width:958px;
margin: 10px 10px 0 10px;



padding:1em 0;



background-color:#fff;
border-top:solid 1px #dcdcdc;


font-size:/*Non-IE6*/1em!important;font-size:/*IE6*/1em;



overflow:/*Non-IE6*/visible!important;



overflow:/*IE6*/hidden;
	float: left;
}




/****************/

/*  HEADER-TOP  */

/****************/

/* SITENAME AND SLOGAN */

.sitename {

width:300px;

height:70px;

position:absolute;

z-index:1;

margin:27px 0 0 95px;

overflow:hidden;

display:none;

}



.sitename h1 {

font-family:"Lucida Grande", Lucida, Verdana, sans-serif;

font-weight:normal;

font-size:/*Non-IE6*/

290%!important;

font-size:/*IE6*/

260%;

display:none;

}



.sitename h2 {

font-family:"Lucida Grande", Lucida, Verdana, sans-serif;

margin-top:-5px;

padding-bottom:2px;

color:#7d7d7d;

height:20px;

font-weight:normal;

font-size:/*Non-IE6*/

130%!important;

font-size:/*IE6*/

120%;

display:none;

}



.sitename a {

text-decoration:none;

color:#fff;

}



.sitename a:hover {

text-decoration:none;

}



/* BUTTON NAVIGATION */

.navbutton {

width:400px;

position:absolute;

z-index:2;

margin-top:26px;

margin-left:/*Non-IE6*/

547px!important;

margin-left:/*IE6*/

550px;

}



.navbutton ul {

float:right;

}



.navbutton li {

display:inline;

list-style:none;

}



.navbutton li a {

padding-left:3px;

}



.navbutton a:hover {

text-decoration:none;

}



.navbutton a img {

height:32px;

}



/*******************/

/*  HEADER BOTTOM  */

/*******************/

/* BREADCRUMB */

.header-bottom ul {

float:left;

width:430px;

list-style:none;

padding:/*Non-IE6*/

8px 0 3px 10px!important;

padding:/*IE6*/

8px 0 3px 10px;

}



.header-bottom ul li {

display:inline;

padding:0 0 0 10px;

background:transparent url(../img/bg_bullet_arrow.gif) no-repeat 0 50%;

font-size:/*Non-IE6*/

110%!important;

font-size:/*IE6*/

100%;

}



.header-bottom ul li.nobullet {

display:inline;

padding:0;

background:none;

color:#4b4b4b;

}



.header-bottom ul a {

color:#7d7d7d;

font-weight:bold;

text-decoration:none;

}



.header-bottom ul a:hover {

color:#fff;

}



/* SEARCH FORM */

.header-bottom .searchform {

float:right;

width:430px;

}



.header-bottom .searchform form fieldset {

float:right;

border:none;

padding-top:5px;

padding-right:10px;

}



.header-bottom .searchform input.field {

width:15em;

height:1.2em;

padding:/*Non-IE6*/

1px!important;

padding:/*IE6*/

2px;

border:solid 1px #c8c8c8;

background-color:#fff;

font-size:/*Non-IE6*/

110%!important;

font-size:/*IE6*/

100%;

}



.header-bottom .searchform input.button {

width:4.5em;

height:1.6em;

background-color:#f0f0f0;

border:solid 1px #969696;

text-align:center;

color:#646464;

font-size:/*Non-IE6*/

110%!important;

font-size:/*IE6*/

100%;

}



.header-bottom .searchform input.button:hover {

cursor:pointer;

border:solid 1px #505050;

background-color:#dcdcdc;

color:#505050;

}

/********************/



/*  NAVIGATION BAR  */



/********************/



/* MAIN MENU */



.navbar ul {



list-style-type:none;



}







.navbar ul li {



float:left;



z-index:/*Non-IE6*/



auto!important;



z-index:/*IE6*/



1000;



background-color:#fff;



}







.navbar ul li a {



float:/*Non-IE6*/



none!important;



float:/*IE-6*/



left;



display:block;



height:3.1em;



line-height:3.1em;



padding:0 16px;



text-decoration:none;



font-weight:bold;



color:#3a4d80;



border-right:solid 0 #d7d7d7;



}







.navbar ul li ul {



display:none;



border:none;



}







/* SUBMENU (Non-IE6 hovering) */



.navbar ul li:hover {



position:relative;



}







/*Sylvain IE hack*/



.navbar ul li:hover a {



background-color:#fdc565;



text-decoration:none;



}







/*Color main cells hovering mode*/



.navbar ul li:hover ul {



display:block;



width:10em;



position:absolute;



z-index:1000;



top:3em;



margin-top:.1em;



left:0;



padding:0 16px;



border-top:solid 1px #d7d7d7;



}







.navbar ul li:hover ul li a {



white-space:normal;



display:block;



width:10em;



height:auto;



line-height:1.3em;



margin-left:-17px;



padding:4px 16px;



border-right:solid 1px #d7d7d7;



border-left:solid 1px #d7d7d7;



border-bottom:solid 1px #d7d7d7;



background-color:#e7e9f0;



font-weight:normal;



color:#3a4d80;



}







/*Color subcells normal mode*/



.navbar ul li:hover ul li a:hover {



background-color:#fdc565;



text-decoration:none;



}







/*Color subcells hovering mode*/



/* SUBMENU (IE6 hovering) */



.navbar table {



position:absolute;



z-index:1000;



top:0;



left:-1px;



border-collapse:collapse;



}







.navbar ul li a:hover {



position:/*Sylvain IE hack*/



relative;



z-index:/*Sylvain IE hack*/



1000;



background-color:#fdc565;



text-decoration:none;



}







/*Color main cells hovering mode*/



.navbar ul li a:hover ul {



display:block;



width:10em;



position:absolute;



z-index:1000;



top:3.1em;



t\op:3em;



left:0;



marg\in-top:.1em;



border-top:solid 1px #d7d7d7;



}







.navbar ul li a:hover ul li a {



white-space:normal;



display:block;



w\idth:10em;



height:1px;



line-height:1.3em;



padding:4px 16px;



border-right:solid 1px #d7d7d7;



border-left:solid 1px #d7d7d7;



border-bottom:solid 1px #d7d7d7;



background-color:#e7e9f0;



font-weight:normal;



color:#646464;



}







/*Color subcells normal mode*/



.navbar ul li a:hover ul li a:hover {



background-color:#fdc565;



text-decoration:none;



}




/************/

/*  CONTENT */

/************/

/* CONTAINER (NO BOXES) */

.content-1col-nobox {

width:676px;

background-color:#fff;

}



.content-2col-nobox-leftcolumn {

display:inline;

float:left;

width:337px;

background-color:#fff;

}



.content-2col-nobox-rightcolumn {

display:inline;

float:right;

width:337px;

background-color:#fff;

}



/* CONTAINER (BOXES) */

.content-1col-box {

width:676px;

background-color:transparent;

}



.content-2col-box-leftcolumn {

display:inline;

float:left;

width:333px;

background-color:#fff;

}



.content-2col-box-rightcolumn {

display:inline;

float:right;

width:333px;

background-color:#fff;

}



.content-2col-box {

width:333px;

background-color:#fcb131;

}



/***************/

/* SUBCONTENT  */

/***************/

.subcontent-box {

width:266px;

float:right;

background-color:#fdc565;
	border-left: 2px solid #fcb131;
	border-right: 2px solid #fcb131;}



/************/

/*  FOOTER  */

/************/

.footer p {

clear:both;

line-height:1.3em;

text-align:center;

color:#7d7d7d;

font-weight:bold;

font-size:110%;

}



.footer p.credits {

clear:both;

font-weight:normal;
color: #808080;

font-size:10px;

text-align: right;
margin-top:10px;
margin-right:10px;
}



.footer a,.footer a:visited {

text-decoration:underline;

color:#7d7d7d;

}



.footer a:hover {

text-decoration:none;

color:#333;

}



/*********************/

/*  ROUNDED CORNERS  */

/*********************/

/* CONTENT */

.corner-content-1col-top {

clear:both;

width:676px;

height:7px;

background:#FFF;

overflow:hidden;

}



.corner-content-1col-bottom {

clear:both;

width:676px;

height:7px;

margin-bottom:10px;

background:transparent;

overflow:hidden;

}



.corner-content-2col-top {

width:333px;

height:10px;

background:transparent url(../img/bg_corner_content_2col_top.gif) no-repeat;

overflow:hidden;

}



.corner-content-2col-bottom {

width:333px;

height:10px;

margin-bottom:10px;

background:transparent url(../img/bg_corner_content_2col_bottom.gif) no-repeat;

overflow:hidden;

}



/* SUBCONTENT */

.corner-subcontent-top {

clear:both;

width:270px;

height:10px;

background:transparent url(../img/bg_corner_subcontent_top.gif) no-repeat;

overflow:hidden;

}



.corner-subcontent-bottom {

clear:both;

width:270px;

height:20px;

margin-bottom:10px;

background:transparent url(../img/bg_corner_sub_bottom.gif) no-repeat;

overflow:hidden;

}



/******************/

/*  CLEAR FLOATS  */

/******************/

.container:after,.header:after,.header-top:after,.header-bottom:after,.navbar:after,.main:after,.content:after,.content div:after,.subcontent:after,.subcontent div:after,.footer:after {

content:".";

display:block;

height:0;

clear:both;

visibility:hidden;

}



.content-1col-nobox:after,.content-2col-nobox-leftcolumn:after,.content-2col-nobox-rightcolumn:after,.content-1col-box:after,.content-2col-box-leftcolumn:after,.content-2col-box-rightcolumn:after,.content-2col-box:after,.subcontent-box:after {

content:".";

display:block;

height:0;

clear:both;

visibility:hidden;

}



.corner-content-1col-top:after,.corner-content-1col-bottom:after,.corner-content-2col-top:after,.corner-content-2col-bottom:after,.corner-subcontent-top:after,.corner-subcontent-bottom:after {

content:".";

display:block;

height:0;

clear:both;

visibility:hidden;

}



p:after {

content:".";

display:block;

height:0;

/*clear:both Do not use here to avoid paragraphs clearing next to images;*/

visibility:hidden;

}



.slideshowvols {

width:650px;

margin-left:10px;

margin-bottom:10px;

float:left;

height:154px;

}



/**************/

/*  PRINTING  */

/**************/

/* To avoid that some layouts may break during printing */

/* we remove one vertical border-line for the columns  */

@media print {

.content-2col-nobox-rightcolumn {

display:inline;

float:right;

width:337px;

border-left:none;

background-color:#fff;

}

}

















