/* @override http://sdeg.fr/ddcom/css/ddcom.css */

/* 
(c) Sébastien DEGLIAME - ddcom.fr 2008
*/

/* @group Reset CSS */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}
/* @end */

/* @group MEP */

html {
	height: 100%;
}

body {
  height: 100%;
  font-size: 0.92em;
  line-height: 1.3em;
  color: #363636; 
  background: #f5f6ee url(../img/fd_tete.png) repeat-x;
  font-family: georgia, serif;
}

#supcannette {
	width: 600px;
	margin: 0 auto;
}

#cannette {
}

#tete {
	margin-top: 10px;
	height: 187px;
}

#logo {
	width: 169px;
	height: 147px;
	background: url(../img/logo.png) no-repeat;
	margin-left: 5px;
}

#promo {
	width: 299px;
	background-color: transparent;
}

#menu0 {
	font-size: 0.80em;
	height: 20px;
	background: url(../img/menu_g.png) no-repeat;
	margin-top: 21px;
	margin-left: 180px;
}

#lastitem {
	display: block;
	width: 43px;
	background: url(../img/menu_d.png) no-repeat right;
	height: 20px;
	float: left;
}

#contenu {
	margin-top: 15px;
	clear: both;
}

#sup_prestations {
	width: 600px;
	height: 25em;
	text-align: left;
	background: url(../img/fd_sep600.png) no-repeat -60px 14px;
}

.prestation_sepv {
	float: left;
	height: 166px;
	width: 15px;
	background: url(../img/separateur_v.png) no-repeat 50% 15px;
}

div.prestations {
	float: left;
	padding-left: 95px;
	width: 200px;
}

div.apropos {
	float: left;
	width: 241px;
	padding: 18px 25px 10px;
}

#pied {
	height: 53px;
	background: url(../img/fd_pied.png) repeat-x;
	position: relative;
	margin: 2em auto 0;
	
}

.warp {
	margin-right: auto;
	margin-left: auto;
	width: 600px;
}

.gauche {
	float: left;
}

.droite {
	float: right;
}

.pucefin{
	height: 45px;
	width: 600px;
	background: url(../img/puce_fin.png) no-repeat 54% 50%;
	margin-right: auto;
	margin-left: auto;
	clear: both;
	margin-top: 25px;
}

/* @group portfolio */
#sup_portfolio {
	width: 600px;
	text-align: left;
	background: url(../img/fd_sep600.png) no-repeat 50% 20px;
	height: 100%;
}

#portfolio {
	float: left;
	width: 400px;
}

#client {
	width: 200px;
}

#cont_portfolio {
	width: 363px;
}

ul#projets li {
	list-style-type: none;
	position: relative;
		height: 31px;
	background: url(../img/fd_portf.png) no-repeat;
	padding-left: 10px;
	padding-top: 13px;
	cursor: pointer;
}

div.img_projet {
	height: 260px;
	background-image: none;
	position: relative;
	margin-bottom: 13px;
}

p.description {
	height: 52px;
	background: url(../img/fd_description.png) repeat-x;
	color: white;
	width: 343px;
	visibility: hidden;
	overflow: hidden;
	position: absolute;
	bottom: 5px;
	padding: 10px;
}

div.pied_projet {
	height: 20px;
	background: url(../img/fd_pied_projet.png) no-repeat;
	position: relative;
}

a.btn_description {
	display: block;
	height: 13px;
	width: 17px;
	position: absolute;
	top: 2px;
	left: 12px;
	background: url(../img/btn_description.png) no-repeat;
	cursor: pointer;
}

.tt_desc-tip {
	width: 73px;
	height: 22px;
	background: url(../img/tt_description.png) no-repeat;
}



/* @end */
/* @end */

/* @group Typo */

#flash {
	height: 31px;
	margin-top: 6px;
	background: red;
	color: white;
	padding-left: 10px;
	font: bold 12px Verdana, arial, "Lucida Grande";
	text-align: center;
}

#flash a {
	color: white;
	text-decoration: underline;
}

h1,h2,h3,h4,h5,h6 { font-weight: normal; color: #111; }

h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 2em; margin-bottom: 0.55em;
}
h3 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; height: 1.25em; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em;
	height: 10px;
	clear: both;
}
h6 { font-size: 1em; font-weight: bold; }

h1 img, h2 img, h3 img, 
h4 img, h5 img, h6 img {
  margin: 0;
}

p { margin: 0 0 1.5em; }
p img { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; }
a:focus, a:hover { color: #000; text-decoration: underline;}
a { color: #000; text-decoration: none;}

.petit {
	font-size: x-small;
}

.lettrine {
	display: block;
	font-size: 35px;
	float: left;
	margin: 10px 4px 0px 0px;
	height: 23px;
}

#contenu h2.titre {
	background: url(../img/sep_hr.png) repeat-x 0 36px;
	height: 36px;
	clear: both;
	display: block;
	margin-bottom: 5px;
	padding-top: 10px;
	padding-bottom: 10px;
}

/* @group Menu 0 */

#menu0 ul {
	float: left;
	color: #c9c9c9;
	list-style-type: none;
	padding-left: 44px;
	background: url(../img/menu_g.png) no-repeat;
}

#menu0 ul li {
	float: left;
	background-color: #363636;
	line-height: 20px;
	padding-left: 7px;
	padding-right: 6px;
	font-size: 0.85em;
}

li.menuitem a {
	font-family: verdana,helvetica,arial,sans-serif;
	color: #aeaeae;
}

li.menuitem a:hover {
	color: #ddd;
}



/* @end */

/* @group Prestations */

.prestations h4 {
	color: #863635;
	font-weight: bold;
	font-variant: small-caps;
	margin-bottom: 10px;
	text-align: left;
	font-size: 1.4em;
}

.prestations ul li {
	font-size: 0.90em;
	list-style-position: outside;
	list-style-type: circle;
	line-height: 1.5em;
	cursor: pointer;
	padding: 0.2em 0;
	background-color: #f5f6ee;
}

.desc_presta {
	color: #7c7c7c;
	background-color: #f5f6ee;
	font: 0.75em Verdana, arial, "Lucida Grande";
}


/* @end */

/* @group a propos */

.sup_apropos h3 {
	font-variant: small-caps;
	text-align: center;
	margin-bottom: 2px;
	color: #863635;
	font-weight: bold;
	border-bottom: 1px dotted #913b39;
	margin-right: 80px;
	margin-left: 80px;
}

.sup_apropos h4 {
	text-align: center;
	font-size: 1em;
	color: #737373;
}

.sup_apropos a {
	color: #632d33;
}

.sup_apropos ul {
	margin-top: -14px;
}

.sup_apropos ul li{
	list-style-type: circle;
	margin-left: 8px;
	margin-top: 4px;
	list-style-position: inside;
}

.sup_apropos {
	background: url(../img/fd_sep600.png) no-repeat -90px 74px;
	height: 29em;
}

.sup_outils {

}



/* @end */
/* @group Pied */

#pied p,a {
	color: #aeaeae;
	list-style-type: circle;
}

#pied p, pied div#fabrik {
	vertical-align: middle;
	font: 0.5em Verdana, arial, "Lucida Grande";
	margin-top: 15px;
	margin-left: 44px;
	margin-right: 13px;;
}

#pied p a:hover {
	color: #ddd;
}


/* @end */

/* @group portfolio */
h2.portf {
	background: url(../img/sep_hr.png) repeat-x 0 28px;
	height: 33px;
	margin-right: 37px;
	margin-top: 6px;
}

h2.portc {
	line-height: 1em;
	background: url(../img/sep_hr.png) repeat-x 0 63px;
	margin-left: 400px;
	height: 72px;
}

ul#projets li{
	padding-left: 9px;
}

p.description {
	font: 0.65em Verdana, arial, "Lucida Grande";
}



/* @end */
/* @end */

/* @group Contact */
#petitlogo {
	width: 98px;
	height: 150px;
	background: url(../img/petitlogo.png) no-repeat 0 top;
	float: left;
	margin-right: 16px;
}

#adresse p {
	line-height: 1.5em;
}

#contact {
	clear: both;
}

.form {
	margin-left: 114px;
	margin-bottom: 9px;
	width: 19em;
	background-color: #f5f6ee;
}

.form label {
	display: block;
	color: #7b7b7b;
	font-variant: small-caps;
	font-size: 0.9em;
}

.inputxt, .inputnum, .inputarea  {
	background-color: #fff;
	border: 1px solid #a4a4a4;
	font: 0.92em "Courier New", Courier, mono;
}
.inputxt, .inputarea {
	width: 20em;
}
.inputnum {
	width: 7em;
}
.inputarea {
	height: 10em;
}

.confirm {
	padding-left: 115px;
}

/* @end */