@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:light);

body {
  color: black ;
  background: #abc ;
  font-family: monospace ;
  /* font-family: sans-serif; */
  /* font-family: verdana; */
}

.titlefont { font-family: "Yanone Kaffeesatz" }
h1 { font-family: "Yanone Kaffeesatz" }
h2 { font-family: "Yanone Kaffeesatz" }

.center { display: block ; margin-left: auto ; margin-right:auto }

.linkbox {
  font-family: "Yanone Kaffeesatz" ;
  font-weight: bold;
  font-size: 1.5em;
  line-height: 2em;
  text-align: center;
  margin-top: 2em;
  margin-bottom: 2em
}
.linkbox a {
  margin-left: 1em; margin-right: 1em;
  padding: 0.2em ;
  border: 2px black solid;
  text-decoration: none
}

/* Font, decoration */

img { border-width : 0px 0px }

#menu a:link    { text-decoration: none }
#menu a:visited { text-decoration: none }
#menu a:hover   { text-decoration: underline }

code { font-family: monospace, sans-serif; font-size: 0.8em }
/* #main p:first-letter { font-size: x-large } */
.rem { font-size: 0.7em ; }

/* Color */

b, code, h1, h2, h3, a /*, #main p:first-letter */ { color: #003 }
.highlight { color: #007 }
.verbatim { color: black ; background: #aaa }
.intro, .rem { color: #622 }
.popup { border: solid #003 ; border-width: 0px 0px 0px 1px }

.grayed { color: #666 }
.grayed b { color: #666 }
.grayed a { color: #666 }
.grayed code { color: #666 }

/* Misc */

/* ul { list-style-image: url(dot.gif) } */
#menu ul { list-style: none }

/* Layout */

h1 { margin-top: 50px ; margin-bottom: 30px ; text-align: center }

h2 { margin-top: 1.234cm }
h3 { padding-bottom: 0cm; margin-bottom: 0cm ; font-size: 1em ; }
p { margin-top: 0cm }

.verbatim {
  white-space: pre ;
  border: solid 1px black ;
  font: x-small "Inconsolata", monospace, sans-serif ;
  padding: 10px 10px ; margin: 10px 0px ;
}

#menu, #menu-right { width: 15% }

#main {
  position: relative ;
  text-align: justify ;
  margin-left: auto ;
  margin-right: auto ;
  width: 40em ;
  line-height: 130% ;
  margin-top: 5% ;
}

#menu {
  position: fixed ;
  left: 0px ;
  top: 10% ;
  padding-top: 20px ;
}

.popup {
  padding-right: 6px;
  font-size: 75% ;
}

#menu-right { 
  text-align: right ;
  position: fixed ;
  right: 0px ;
  top: 10% ;
  padding: 20px ;
}

#small-header {
  position: absolute ;
  right: 10px ; bottom: 10px ;
  text-align: right ;
  font-size: x-small ;
  font-family: "Inconsolata", monospace, sans-serif ;
}

#photo { position: absolute; top: 0px; right: 0px ; width: 40%; height: 20em; text-align: right }
#info  { position: absolute; top: 0px; left: 0px ; width: 60%; height: 20em }
#submain { position: relative; top: 20em }

#photo img {
  margin: 5px ;
  height: 80% ;
  border: 2px solid #003;
}
#info h2 { margin-top: 1em }

/* Menus déroulants */

.popup { display: none }
#menu li:hover .popup { display: block }

/* News */

.date { padding-left: 1em ; padding-right: 1em ; text-align: right }