/* General */
body {
	font-family: sans-serif;
	background-color: white;
	color: black;
}

h1 {
	text-align: center;
	clear: both;
	background-color: #d3c7e1;
	padding: 1em;
	margin: 0px;
}

h2 {
	text-align: left;
	clear: both;
}

/* All images have border */
img {
	border: solid black 1px;
}

/* "Location bar" in the bottom of each page */
div.path {
	clear: both;
 	background-color: #d3c7e1; /* same as h1 */
 	font-size: smaller;
 	padding: 1em;
 	margin-top: 2em;
 	margin-bottom: 1em; 	
}

/* "Valid-HTML" icons in the "path" box */
div.path img.icon-valid {
	border: 0px;
	padding: 0px;
	margin: 0px;
	float: right;
}

/* "Contents" box in the top (or anywhere else) */
div.contents {
	clear: both;
	text-align: center;
	padding: 1em;
	margin: 1em;
	background-color: #ece4f5;
}

/* Selection of other languages */
div.languages {
	text-align: right;
	padding-right: 3em;
}

/* Various decorations */

div.note {
	color: olive;
	margin-left: 4em;
	margin-right: 4em;
}

span.term {
	color: #004040;
	font-weight: bold;
}

span.update {
	color: red;
	font-weight: bold;
}

div.statement {
	font-weight: bold;
	text-align: center;
	margin: 1ex 5em;
}

/* Figures in trip reports, tech articles, etc; div can contain
 * several images in row, each with caption paragraph */
 
/* Layout idea:
   div.figure (block formatting, content centered)
    + span.image (inline-block formatting)
    + span.image (inline-block formatting)
       + img (inline formatting)
       + span.caption (block formatting)

   http://krijnhoetmer.nl/stuff/css/display-inline-block on bugs.
 */
        
div.figure {
        display: block;
        clear: both;
        text-align: center;
}

div.figure span.image {
	/* Fix for Gecko, which does not know "inline-block" */ 
        display: table-cell; display: inline-table; display: inline-block;
	vertical-align: bottom;
        padding: 1em; /* I prefer margin, but Gecko drops it */
}

span.image img {
        display: inline; /* The only inline element of a parent span */
}


span.image span.caption {
        display: block;
        font-weight: bold;
        text-align: center;
        margin-top: 1ex;
}

/* Smaller images, floating on the left */
img.leftThumb {
      float: left;
      clear: left;
      margin: 0em 1em 1em 0em; /* top right bottom left */
}

p.clearLeft {
      clear: left;
}

/* Small images to the left with captions */
div.leftImg {
	float: left;
	clear: left;
	margin: 0em 1em 1em 0em; /* top right bottom left */
	width: 260px;
	padding: 0.5em;
	background-color: #f0f0f0;
}

/* Heritage in old pages */
p.caption {
	font-weight: bold;
	text-align: center;
}

p.image {
	text-align: center;
}

p.image img {
	margin: 5px;
}