/* ---------------------------------------------------------------- */
/* ---------------------- styles CSS Fors ---------------------- */
/* --------------------------------------------------------------- */


/* ---------------------- principal ---------------------- */


* {
margin: 0;
border: 0;
padding: 0;
font: normal 100% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
}

body {
text-align: center;
background: #f0f0f0 url(fors_imports/fors_fond3.jpg) center 0 repeat-y; 
}

#global {
position: relative;
margin: 0 auto;
width: 740px;
text-align: left;
}



/* ---------------------- header ---------------------- */


#header {
position: relative;
width: 740px;
height: 130px;
}

#header p.soustitre {
position: absolute;
top: 100px;
left: 15px;
font: bold 70% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
color: #f90;
}

/* ---------------------- menu ---------------------- */

#menu {
position: absolute;
top: 150px;
left: 15px;
width: 155px;
z-index: 100;
	/* border-right: #669acc 10px solid; */
padding-bottom: 70px;
}

#menu ul {
padding-bottom: 30px;
background: url(fors_imports/fors_gouttiere2.jpg) 0 bottom no-repeat;
list-style-type: none;
}

#menu li a {
display: block;
margin-bottom: 1px;
padding-left: 15px;
height: 27px;
font: bold 75% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
line-height: 27px;
letter-spacing: 0.2ex;
color: #fff;
text-decoration: none;
background: url(fors_imports/bt_menu.jpg) 0 0 no-repeat;
}

#menu li a:hover {
display: block;
margin-bottom: 1px;
padding-left: 15px;
height: 27px;
font: bold 75% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
line-height: 27px;
letter-spacing: 0.2ex;
color: #fff;
text-decoration: none;
background: url(fors_imports/bt_menu.jpg) 0 -27px no-repeat;
}

#menu li a.active {
display: block;
margin-bottom: 1px;
padding-left: 15px;
height: 27px;
font: bold 75% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
line-height: 27px;
letter-spacing: 0.2ex;
color: #fff;
text-decoration: none;
background: url(fors_imports/bt_menu2.jpg) 0 0 no-repeat;
}

#menu li a.active:hover {
display: block;
margin-bottom: 1px;
padding-left: 15px;
height: 27px;
font: bold 75% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
line-height: 27px;
letter-spacing: 0.2ex;
color: #fff;
text-decoration: none;
background: url(fors_imports/bt_menu2.jpg) 0 0 no-repeat;
}


/* ---------------------- submenu ---------------------- */


#submenu ul {
margin-top: 10px;
margin-left: 15px;
padding-bottom: 15px;
list-style-type: none;
background-image: none;
}


#submenu li a {
display: inline;
border-left: #f90 4px solid;
margin-bottom: 6px;
padding-left: 10px;
font: normal 65% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
letter-spacing: 0;
line-height: 180%;
color: #666;
text-decoration: none;
background-image: none;
}

#submenu li a:hover {
display: inline;
border-left: #f90 4px solid;
margin-bottom: 6px;
padding-left: 10px;
font: normal 65% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
letter-spacing: 0;
line-height: 180%;
color: #666;
text-decoration: none;
background-image: none;
color: #669acc;
}

#submenu li a.active {
display: inline;
border-left: #f90 4px solid;
margin-bottom: 6px;
padding-left: 10px;
font: normal 65% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
letter-spacing: 0;
line-height: 180%;
color: #666;
text-decoration: none;
background-image: none;
color: #669acc;
}

#submenu li a.active:hover {
display: inline;
border-left: #f90 4px solid;
margin-bottom: 6px;
padding-left: 10px;
font: normal 65% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
letter-spacing: 0;
line-height: 180%;
color: #666;
text-decoration: none;
background-image: none;
color: #669acc;
}

/* ---------------------- contact -- plaquette---------------------- */

#menu #contact, #menu #event {
position: relative;
margin-top: 20px;
padding-bottom: 30px;
background: url(fors_imports/fors_gouttiere2.jpg) 0 bottom no-repeat;
}

#menu #infos {
position: relative;
margin-top: 20px;
padding-bottom: 30px;
}

#menu #download {
position: relative;
margin-top: 20px;
padding-bottom: 30px;
}

#menu img {
margin-bottom: 5px;
}

#menu #contact a.mail {
display: block;
width: 88px;
height: 20px;
margin: 10px 0 0 0;
background: url(fors_imports/bt_email.jpg) 0 0 no-repeat;
}

#menu #contact a.mail:hover {
display: block;
width: 88px;
height: 20px;
background: url(fors_imports/bt_email.jpg) 0 -20px no-repeat;
}
#menu p {
width: 145px;
}

#menu #contact p {
font: bold 68% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
line-height: 130%;
color: #333;
}

#menu #event p.details {
font: normal 68% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
line-height: 130%;
color: #666;
}

#menu #contact p em {
font: bold 100% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
color: #f90;
}

#infos p {
font: bold 68% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
line-height: 130%;
color: #333;
}

#infos p em {
font: bold 100% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
color: #f90;
}

#infos p.light {
font: normal 68% verdana, helvetica, arial, "bitstream vera sans", sans-serif;
color: #666;
}

#infos a.recrute {
position: relative;
display: block;
left: 0;
width: 140px;
height: 30px;
margin-bottom: 20px;
background: url(fors_imports/fors_recrute.gif) 0 0 no-repeat;
}

#infos a.recrute:hover {
position: relative;
display: block;
left: 0;
width: 140px;
height: 30px;
background: url(fors_imports/fors_recrute.gif) 0 -30px no-repeat;
}

a.plaquette {
position: relative;
display: block;
left: -4px;
width: 133px;
height: 50px;
background: url(fors_imports/picto_plaquette2.jpg) 0 0 no-repeat;
}

a.plaquette:hover {
position: relative;
display: block;
left: -4px;
width: 133px;
height: 50px;
background: url(fors_imports/picto_plaquette2.jpg) 0 -50px no-repeat;
}

#download p {
width: 130px;
font-size: 70%;
colors: #333;
line-height: 130%;
letter-spacing: 0.1ex;
margin-bottom: 10px;
}

/* ---------------------- contenu ---------------------- */


#content {
position: relative;
top: 0;
left: 180px;
padding-top: 20px;
margin-top: 0;
margin-bottom: -10px;
width: 520px;
}

#content p, div.homediv p {
padding-left: 15px;
font-size: 70%;
colors: #333;
line-height: 130%;
letter-spacing: 0.1ex;
margin-bottom: 10px;
text-align: justify;
}

#content div.homediv p.gauche, #content div.homediv2 p {
text-align: left;
}

#content p em, div.homediv p em {
font-weight: bold;
color: #f90;
}

h1 {
padding-left: 15px;
font-weight: bold; 
font-size: 100%;
color: #669acc;
text-transform: uppercase;
margin-bottom: 15px;
}

span.legende {
text-transform: none;
font-size: 90%;
}

h2 {
padding-left: 15px;
font-weight: bold; 
font-size: 75%;
color: #666;
text-transform: uppercase;
margin-bottom: 2%;
}

h3 {
padding-left: 15px;
font-weight: bold; 
font-size: 75%;
color: #f90;
margin-bottom: 5px;
}

h4 {
padding-left: 15px;
font-weight: bold; 
font-size: 70%;
color: #999;
text-transform: uppercase;
margin-bottom: 15px;
}

#content ul {
margin-left: 30px;
margin-bottom: 25px;
padding-left: 10px;
font-size: 70%;
list-style-type: none;
border-left: #f90 3px solid;
}

#content li {
margin: 10px 0;
line-height: 120%;
}

#content a, #menu a {
color: #669acc;
text-decoration: underline;
}

#content a:hover, #menu a:hover {
color: #f90;
text-decoration: none;
}

#content div.homediv li {
margin: 5px 0;
line-height: 120%;
}

.homediv {
position: relative;
width: 364px;
padding-bottom: 30px;
margin-bottom: 10px;
border: 0;
background: url(fors_imports/fors_gouttiere1.jpg) 0 bottom no-repeat;
clear: both;
}

.homediv2 {
position: relative;
width: 364px;
padding-bottom: 30px;
margin-bottom: 10px;
border: 0;
background: url(fors_imports/fors_gouttiere1.jpg) 0 bottom no-repeat;
}

#content .homediv2 div.float {
float: left;
width: 170px;
background-color: #356;
}

#content .homediv2 a img {
float: left;
padding-right: 15px;
padding-left: 15px;
margin-bottom: 10px;
}

#content .homediv2 p {
padding-left: 15px;
font-size: 70%;
colors: #333;
line-height: 130%;
letter-spacing: 0.1ex;
margin-bottom: 10px;
text-align: left;
}

#content .homediv2 p em {
font: normal 100% georgia, "times new roman", serif;
line-height: 140%;
font-style: italic;
color: #999;
}

hr {
clear: both;
margin: 4% 0;
visibility: hidden;
}

input.mots {
border: 1px solid #333;
margin-left: 15px;
margin-bottom: 5px;
width: 300px;
font-size: 70%;
colors: #333;
}

input {
border: 1px solid #333;
colors: #333;
}

select.deroulant {
border: 1px solid #333;
margin-left: 15px;
margin-bottom: 5px;
width: 100%;
font-size: 70%;
colors: #333;
}

input.bouton {
width: 100px;
margin: 10px;
font-size: 70%;
colors: #333;
}

#content p.legende {
font-size: 60%;
color: #666;
}

#content span.legende {
color: #666;
font-style: italic;
}

#content p.legende1 {
margin-bottom: 0;
width: 100px;
height: 13px;
font: normal 70% georgia, "times new roman", serif;
font-style: italic;
color: #333;
text-align: left;
}

#content p.legende2 {
margin-bottom: 0;
width: 100px;
height: 100px;
font: normal 60% georgia, "times new roman", serif;
font-style: italic;
color: #666;
text-align: left;
}

#content a.lettre {
display: block;
padding-left: 15px;
margin-top: 15px;
margin-bottom: 15px;
width: 100px;
height: 150px;
}

#content div.lettre1 {
float: right;
width: 130px;
}

strong {
color: #444;
font-style: italic;
}

#content em.key {
color: #666;
}

#content em.type {
color: #669acc;
}

p.space {
margin: 15px 0;
}

img.id {
float: left;
padding-left: 15px;
margin-bottom: 20px;
}

img.id2 {
float: left;
margin: 0 10px 20px 15px;
}

img.id3 {
margin: 0 10px 5px 15px;
}

#content ul.id {
margin-left: 135px;
}

/* ---------------------- publications ---------------------- */


#publications {
position: absolute;
top: 150px;
left: 560px;
width: 155px;
padding-bottom: 50px;
border-left: 1px #ccc solid;
z-index: 100;
}

#publications p {
padding-left: 15px;
font-size: 70%;
colors: #333;
line-height: 130%;
letter-spacing: 0.1ex;
margin-bottom: 10px;
text-align: left;
}

#publications p em {
font: normal 100% georgia, "times new roman", serif;
line-height: 140%;
font-style: italic;
color: #999;
}

#publications p.light {
color: #999;
}

#publications img {
padding-left: 15px;
margin-bottom: 15px;
}

#publications a {
color: #669acc;
text-decoration: underline;
}

#publications a:hover {
color: #f90;
text-decoration: none;
}

hr.publi {
clear: both;
margin: 4% 0;
width: 95%;
border: 0;
border-bottom: 1px #ccc solid;
height: 1px;
visibility: visible;
}

hr.publi2 {
clear: both;
margin: 4% 3%;
width: 100%;
border: 0;
border-bottom: 2px #669acc solid;
height: 1px;
visibility: visible;
}

hr.id {
clear: both;
margin: 5px 15px 20px 15px;
width: 100%;
border: 0;
border-bottom: 1px #ccc solid;
height: 1px;
visibility: visible;
}


/* ---------------------- footer ---------------------- */

#footer {
position: relative;
clear: both;
margin: 0 auto;
width: 740px;
height: 110px;
background: url(fors_imports/fors_footer.jpg) 0 0 no-repeat;
z-index: 50;
}