
*.debug_todo {

    display: none; /* uncomment this line to hide all debug messages */

    margin: 10px;
    padding: 5px;
	text-align: left;
	color: crimson;
	font-size: 150%;
    background-color: #FA8072;
}

*.errorMsg {
    text-align: center;
    color: red;
    font-size: 125%;
    font-weight: bold;
}


abbr {
	border-style: dashed;
	border-width: 0px;
	border-bottom-width: 1px;
	border-color: #0C3A6D;
	cursor: help;
}

abbr:hover {
	border-bottom-width: 2px;
}

body {
	margin: 0px;
	padding: 0px;
	background-color: #0C3A6D;
	color: black;
	font-size: 80%;
	font-family: Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;
}

*.wrapper {
	width: 100%; /* this must be explicit */
	table-layout: fixed; /* doesn't work in firefox (but its ok in this case) */
	margin: 0px;
}

*.leftPanel {
	width: auto;
    padding: 0px;
    overflow: hidden;
	background-image: url("../IMG/bg/blueBG_left.png");
	background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: bottom left;
}

*.rightPanel {
	width: auto;
    padding: 0px;
    overflow: hidden;
	background-image: url("../IMG/bg/blueBG_right.png");
	background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: bottom right;
}

*.mainPanel {
	width: 900px; /* un peu large, mais 800px est trop contraignant */
	padding: 0px;
	background-color: #FF9900;
	background-image: url("../IMG/bg/orangeBG_left.png");
	background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: bottom left;
}

*.mainPanel div.bgHolder {
	background-image: url("../IMG/bg/orangeBG_right.png");
	background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: bottom right;
}


/* HEADER */

*.header {
	position: relative; /* this lets us use absolute positionning inside */
	height: 180px;
	margin: 0px;
	padding: 0px;
	border-style: solid;
	border-width: 0px;
	border-top-width: 20px;
	border-color: #0C3A6D;
	background-color: #00B2EE;
	background-image: url("../IMG/corners/blueCorner_topLeft.png");
	background-repeat: no-repeat;
    background-position: top left;
}

*.header div.cornerHolder {
	position: absolute;
	top: 0px;
	width: 100%;
	height: 20px;
	margin: 0px;
	background-image: url("../IMG/corners/blueCorner_topRight.png");
	background-repeat: no-repeat;
    background-position: top right;
}

*.header h2 {
	position: absolute;
	top: 0px;
	right: 0px;
	margin: 0.3em;
	margin-right : 0.6em;
	color: #FF9900;
	font-style: italic;
	font-size: 160%;
}

*.header img {
	margin: 20px;
	border-style: none;
}

*.header img.logo {
	float: left;
}

*.navHolder {
	position: absolute;
	bottom: 0px;
	right: 0px;
	margin: 0.3em;
}

*.navHolder a {
	float: right;
	margin: 0.3em;
	padding: 0.6em;
	border-style: solid;
	border-width: 2px;
	border-color: #FF9900;
	line-height: 1.0em;
	color: #0C3A6D;
	text-align: center;
	text-decoration: none;
	font-size: 140%;
	font-weight: bold;
	clear: none;
	white-space: nowrap; /* empeche le word-wrap */
}

*.navHolder a:hover {
	background-color: #0C3A6D;
	color: #00B2EE;
}


/* MAIN (affects menu + page content, but specific settings are in separate css files) */

*.outerContainer {
	margin: 20px;
	background-color: #F0F8FF;
	background-image: url("../IMG/bg/whiteBG_left.png");
	background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: bottom left;
}

*.outerContainer div.bgHolder {
	position: relative; /* this lets us use absolute positionning inside */
	background-image: url("../IMG/bg/whiteBG_right.png");
	background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: bottom right;
}

*.outerContainer img.topLeftCorner {
	position: absolute; /* this removes the image from the flow */
	top: 0px;
	left: 0px;
}

*.outerContainer img.topRightCorner {
	position: absolute; /* this removes the image from the flow */
	top: 0px;
	right: 0px;
}

*.outerContainer img.bottomLeftCorner {
	position: absolute; /* this removes the image from the flow */
	bottom: 0px;
	left: 0px;
}

*.outerContainer img.bottomRightCorner {
	position: absolute; /* this removes the image from the flow */
	bottom: 0px;
	right: 0px;
}

*.outerContainer a:link {
	text-decoration: none;
	color: #00B2EE;
}

*.outerContainer a:visited {
	text-decoration: none;
	color: #800080; /* aka "purple" */
}

*.outerContainer a:hover {
	text-decoration: underline;
}

*.outerContainer a:link img {
	border-style: solid;
	border-width: 5px;
	border-color: #00B2EE;
}

*.outerContainer a:visited img {
	border-color: #800080;
}

*.outerContainer a:hover img {
	border-color: #FF9900;
}

/*
#currentLocation {
	color: #FF9900;
	font-style: italic;
}
*/


/* FOOTER */

*.footer {
	position: relative; /* this lets us use absolute positionning inside */
	height: 40px;
	margin: 0px;
	padding: 20px;
	border-style: solid;
	border-width: 0px;
	border-bottom-width: 20px;
	border-color: #0C3A6D;
	background-color: #00B2EE;
	background-image: url("../IMG/corners/blueCorner_bottomLeft.png");
	background-repeat: no-repeat;
    background-position: bottom left;
}

*.footer div.cornerHolder {
	position: absolute;
	bottom: 0px;
	width: 100%;
	height: 20px;
	margin: 0px;
	margin-left: -20px;
	margin-right: -20px;
	background-image: url("../IMG/corners/blueCorner_bottomRight.png");
	background-repeat: no-repeat;
    background-position: bottom right;
}

*.footer a.button {
	float: right;
	margin: 0em;
    margin-left: 0.3em;
	padding: 0.3em;
	border-style: solid;
	border-width: 2px;
	border-color: #FF9900;
    background-color: #0C3A6D;
	color: #00B2EE;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	clear: none;
	white-space: nowrap; /* empeche le word-wrap */
}

*.footer a.button:hover {
	color: #FF9900;
}

/*  Big Button supposé évident */
span#classButton {
    padding: 1em 1em;
    border: 2px solid orange;
    font-weight: bold;
    background-color: rgb(184,216,248);
}

#classButton a:LINK {
	color: #0C3A6D;
}

/* Small button genre précédent et suivant */
span#classSmallButton {
    padding: .5em 1em;
    width: 8em;
    border: 2px solid #D0EFEF;
    font-weight: bold;
    background-color: #A0C0E0;
    cursor: pointer;
}

#classSmallButton a:LINK {
	color: #0C3A6D;
}
