* {
	margin: 0;
	padding: 0;
}

html {
	min-height:100%;
}

body {
	position: relative;
	background: #123456 url(../image/corner-top.gif) left top no-repeat;
	padding: 170px 0 3em 70px;
	font-size: 13px;
	font-family: Garamond, arial, "sans serif";
	color: #ABCDEF;
	quotes: "\201C" "\201E" "\00AB" "\00BB";
}

acronym, abbr {
	cursor: help;
}

.cite-autor {
	font-style: italic;
}
blockquote {
	position: relative;
	text-align: justify;
	margin: 0 0 1em 1em;
	padding: 1em;
	border-left: .4em solid #789ABC;
	color: #456789;
	background-color: #DEF;
}

p {
	text-indent: 2em;
	text-align: justify;
	margin: 1em 0;
	font-size: 1em;
	line-height: 1.3em;
}

*.inline {
	display: inline;
	line-height: inherit;
	background: none;
}

.int-link {
	font-weight: bold;
	font-style: italic;
	text-decoration: none;
	color: #456789;
}
.int-link:hover {
	text-decoration: underline;
}
.download-link {
	display: block;
	margin: 1em auto;
	padding: 1em 1em 1em 45px;
	color: #9A5678;
	text-decoration: none;
	font-weight: bold;
	background: transparent url(../image/download.gif) left center no-repeat;
}
.download-link:hover {
	color: #CD89AB;
}

#content h1 {
	font-variant: small-caps;
	font-weight: bold;
	font-style: italic;
	font-size: 1.5em;
	font-family: arial, sans-serif;
	color: #900;
	letter-spacing: .2em;
	border-bottom: .1em solid #666;
	margin-bottom: .8em;
}

hr.spacer {
	height: 1px;
	clear: both;
	visibility: hidden;
}

/* ========= */
/* T I T R E */
/* ========= */

/* ------------- */
/* titre du site */
/* ------------- */
h1#site-title {
	position: absolute;
	top: -50px;
	left: 0;
	width: 250px;
	height: 200px;
	font-size: 1pt;
	line-height: 10px;
	overflow: hidden;
	background: transparent url(../image/head-logo.gif) left bottom no-repeat;
}

h1#site-title a {
	display: block;
	text-decoration: none;
	overflow: hidden;
	width: 100%;
	height: 10px;
	padding-bottom: 190px;
}

/* ---------------- */
/* titre de la page */
/* ---------------- */
h2#page-title {
	float: right;
	margin-top: -170px;
	min-height: 170px;
	line-height: 170px;
	font-size: 2em;
	font-style: italic;

	text-align: right;
	padding-right: 170px;
	background-color: transparent;
	background-position: right center;
	background-repeat: no-repeat;
}
#accueil h2#page-title {
	background-image: url(../image/picto-big-accueil.gif);
}

#projet h2#page-title {
	background-image: url(../image/picto-big-projet.gif);
}

#curriculum h2#page-title {
	background-image: url(../image/picto-big-cv.gif);
}

#contact h2#page-title {
	background-image: url(../image/picto-big-contact.gif);
}

/* ========= */
/* M E N U S */
/* ========= */

/* ------------- */
/* version grand */
/* ------------- */
#menu-big {
	list-style-type: none;
	margin: 0 auto;
	width: 30em;
	padding-left: 3em;
}

#menu-big li {
	clear: both;
}
#menu-big a {
	display: block;
	float: left;

	margin-bottom: 1em;
	border-bottom: .2em solid #123456;
	padding-left: 105px;

	font-size: 2em;
	font-weight: bold;
	font-style: italic;
	text-decoration: none;
	color: #89ABCD;

	background-color: transparent;
	background-repeat: no-repeat;
	background-position: left center;
}

#menu-big a:after {
	content: attr(title);
	display: block;
	font-size: .5em;
}

#menu-big a:hover, #menu-big a:focus, #menu-big a:active {
	color: #CDEFFF;
	border-color: #900;
}


#menu-big a:focus, #menu-big a {
	outline: 0;
}

#menu-big #m-accueil {
	background-image: url(../image/picto-accueil.gif);
	margin-left: 2em;
}

#menu-big #m-projet {
	background-image: url(../image/picto-projet.gif);
}

#menu-big #m-curriculum {
	background-image: url(../image/picto-cv.gif);
	margin-left: 1.5em;
}

#menu-big #m-contact {
	background-image: url(../image/picto-contact.gif);
	margin-left: 5em;
}

/* ------------- */
/* version petit */
/* ------------- */
#menu-small {
	list-style-type: none;
	font-weight: bold;
	height: 4em;
	margin: 0 0 2em 100px;
}

#menu-small li {
	float: left;
	position: relative;
	margin: 0 1em;
	width: 12em;
	height: 3em;
	text-align: left;
}

#menu-small li a {
	display: block;
	position: absolute;
	bottom: 0;
	padding: 0 0 15px 30px;
	text-decoration: none;
	color: #6789AB;
	font-size: 2em;
	font-style: italic;
	background: transparent url(../image/nav.gif) left bottom no-repeat;
	min-width: 100px;
}

#menu-small a:hover, #menu-small a:focus, #menu-small a:active {
	outline: 0;
	font-size: 3em;
	color: #ABCDEF;
}


#menu-small .current a {
	font-size: 3em;
	background-image: url(../image/nav-hover.gif);
}
/* ============= */
/* C O N T E N U */
/* ============= */
#content {
	padding: 50px 2em 2em 100px;
	background: #ABCDEF url(../image/content-corner.gif) left top no-repeat;
	font-size: 16px;
	color: #123456;
}

/* ===================== */
/* F O R M U L A I R E S */
/* ===================== */
form label {
	font-weight: bold;
	font-size: .8em;
}

form legend {
	font-weight: bold;
	font-size: 1em;
	margin-bottom: 1em;
}

form input, form textarea {
	display: block;
	margin: 0 -.1em 1.5em -1em;
	padding: .2em .5em;
	line-height: 1.2em;

	border: .1em solid #789ABC;
	border-width: .1em .1em .1em 1em;
	background-color: #DEF;

	color: #789;
	line-height: 1.2em;
}

form input.bouton {
	border: .1em solid #789ABC;
	border-width: 3px 3px 0 0;
	height: 50px;
	line-height: 50px;
	padding: 0 1em 0 20px;
	float: right;
	font-weight: bold;
	background: transparent url(../image/submit-btn.gif) left bottom no-repeat;
}

form input.bouton:hover, form input.bouton:focus, form input.bouton:active {
	outline: 0;
}
form input.bouton:hover {
	color: #900;
}

form p.form-error {
	color: #900;
	position: relative;
	top: -1em;
	clear:both;
	font-style: italic !important;
}
form p.form-error:before {
	content: "* ";
	font-size: 1.5em;
}

/* ======================= */
/* P I E D   D E   P A G E */
/* ======================= */
#footer {
	clear: both;
	font-variant: small-caps;
	font-size: .9em;
	border: .1em solid #345678;
	border-width: .1em 0 0 0;
	text-align: center;
	margin-top: 2em;
}

#phpmyvisites {
	border: 0;
	margin: 0;
	padding: 0;
}

#phpmyvisites img {
	float: right;
	margin-right: 1em;
	height: 1.16em;
}