/* CSS Document */

@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,700,300italic,400italic,700italic);    

* {margin:0; padding:0;}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { border: 0; font-size: 100%; font-family: Verdana, Geneva, sans-serif; vertical-align: baseline; }
body { line-height: 1; }
ol, ul { list-style: none;}

#content ul { padding: .5em 0 1em 0;   }
#content li  {font-family: Verdana, Geneva, sans-serif; font-size: .8em; font-weight:500; color: #DDD; padding-top:1.5em;}
#content a { color: #DBDBDB; }
#content a:hover { color: #00CCFF; }
#content a:visited { color: #cbcbcb; }

 /*espacer éléments liste --- line-height: 5em;   margin-top:2em; padding-top:1.5em; */

#global {margin-left:auto; margin-right:auto; width:65em;}

/*header*/

#plog {margin-top:2em;} 
#plog p {text-align: center;}

#glog {display:none;}

#navig ul { padding-top:.8em;  list-style-type: none; }

#navig li:first-child { padding-left: 0;}
#navig li:last-child { border: none;}
#navig li  { display:inline;  padding-left: 1em; padding-right: 1em; border-right: 1px solid #BBB; font-size:0.7em; font-weight:500; font-family: Verdana, Geneva, sans-serif; font-variant: small-caps; letter-spacing: 0.08em; }
#navig a { color:#DCDCDC; text-decoration: none; }
#navig a:hover { color: #FF0000; }

/*fin header*/

/*content*/
#content {margin-top:2.5em;}

.zoom { 
font-family: Verdana, Geneva, sans-serif; font-size: .6em; line-height: 1.1em; font-weight:300; color: #DDD; font-style: italic 
}

#col-1 { width: 30em; float:left; margin-right:2em; }

#col-1 h1 { font-family: 'Roboto Condensed', serif; font-weight: 700; font-size: 1.1em; color: #EF7000; letter-spacing: 0.15em; margin-bottom: .6em; margin-top:2.5em;}
#col-1 p { font-family: Verdana, Geneva, sans-serif; font-size: .8em; line-height: 1.8em; font-weight:400; color: #DDD; }
#col-1 .zoom { 
font-family: Verdana, Geneva, sans-serif; font-size: .75em; line-height: 1.9em; font-weight:400; color: #ef7000; font-style: italic 
}
#col-1 img {margin-top:1.5em; margin-bottom:1em}

#col-2 {float: left; width: 30em;}
#col-2 h1 { font-family: 'Roboto Condensed', serif; font-weight: 700; font-size: .9em; color: #EF7000;  letter-spacing: 0.15em; margin-bottom: .6em;  margin-top:2em;}
#col-2  p { font-family: Verdana, Geneva, sans-serif; font-size: .8em; line-height: 1.8em; font-weight:400; color: #DDD; }
#col-2 p .zoom { 
font-family: Verdana, Geneva, sans-serif; font-size: .6em; line-height: 1em; font-weight:300; color: #DDD; font-style: italic 
}
#col-2  img {margin-top:1.5em; margin-bottom:1em}



#footer { display:block; }
	
div.clearfloats { clear:both; }
/*fin content grands écrans*/



/*début petits écrans petits écrans*/

@media only screen and (max-device-width: 600px) {

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { border: 0; font-size: 107%; font-family: Verdana, Geneva, sans-serif; vertical-align: baseline; }
body { line-height: 1; }
ol, ul { list-style: none;}


#global {margin-left:auto; margin-right:auto; width:95%;}
#content ul { padding: .5em 0 1em 0; }
#content li  { font-family: Verdana, Geneva, sans-serif; font-size: .65em; font-weight:400; }
#content a { color: #DBDBDB; }
#content a:hover { color: #00CCFF; }
#content a:visited { color: #cbcbcb; }

/*header petits écrans*/
#header {width:93%;}

#glog { margin-top:1em; display:block }
#glog p { text-align: center; } 

#plog {display: none; margin-left:auto; margin-right:auto;}

#navig ul { margin-top:.5em;  list-style-type: none; width: 50%; margin-left:auto; margin-right:auto; opacity:0.80; filter:alpha(opacity=80) }
#navig li  { display:block; font-size:0.7em; font-weight:600; font-family: Verdana, Geneva, sans-serif; font-variant: small-caps; letter-spacing: 0.05em; padding:0.65em; margin-top:.1em; background-color:#321; text-align:center; border-top: 1px solid #EF7000; border-bottom:none; border-left:none; border-right:none; }
#navig a { color:#ccc; text-decoration: none; }
#navig a:hover { color: #FF0000; }
/*fin header petits écrans*/

/*content petits écrans*/
#content {margin-top:.5em;}

.zoom { 
font-family: Verdana, Geneva, sans-serif; font-size: .6em; line-height: 1em; font-weight:300; color: #DDD; font-style: italic 
}


#col-1 { width: 93%; display:block; }
#col-1 h1 { font-family: 'Roboto Condensed', serif; font-weight: 700; font-size: .8em; color: #EF7000; letter-spacing: 0.15em; margin-bottom: .3em; }
#col-1 p { font-family: Verdana, Geneva, sans-serif; font-size: .75em; line-height: 1.8em; font-weight:400; color: #bbb; }
#col-1 p .cites { font-style: italic; padding-top:0.5em; }
#col-1 p .zoom { 
font-family: Verdana, Geneva, sans-serif; font-size: .6em; line-height: 1em; font-weight:300; color: #FF7000; font-style: italic 
}
#col-1 img {margin-top:.5em; margin-bottom:.2em;}

#col-2 { width: 93%; display:block; }
#col-2 h1 { font-family: 'Roboto Condensed', serif; font-weight: 700; font-size: .8em; color: #FF7000; letter-spacing: 0.15em; margin-bottom: .3em; }
#col-2  p { font-family: Verdana, Geneva, sans-serif; font-size: .75em; line-height: 1.8em; font-weight:400; color: #bbb; }
#col-2 p .zoom { 
font-family: Verdana, Geneva, sans-serif; font-size: .6em; line-height: 1em; font-weight:300; color: #FF7000; font-style: italic 
}
#col-2  img {margin-top:.5em; margin-bottom:.2em}


#footer {width:95%, display:block;}
}

/*fin petits écrans fin petits écrans*/