/* ======================================================================
*  Propriete de MAC - Mobilier Agencement Collectivites
*  Auteur : Marc VARLET - Ste Arilys (http://www.arilys.com)
*  Creer le 22 septembre 2006
*  Modifications :
*
*/

/* === IDS ===*/
*{margin:0px;padding:0px;}
#contactform {
	margin: 0px;
	padding: 0px;
	text-align:center;
	font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
	font-size:x-small; /* for IE5/Win */
	f\ont-size:small; /* for other IE versions */
	background:#fff;
	border: 0px none;
}
#containerForm{
	position:relative;
	margin:0 auto;
	text-align:left;
	border: 0px none;
	/*border: 1px solid #ccc;*/
}

/* === Form ===*/
#containerForm form ul{
	position:relative;
	width:100%;
	list-style-type:none;
}
#containerForm form li{width:62%;}
form li{line-height:2em;margin:0;padding:1px 4px 6px 9px;display: inline-block;}
form li:after{content:".";display:block;height:0; clear:both; visibility:hidden;}

/* Holly Hack Targets IE Win only \*/
/*
* html form li {height: 1%;}
form li {display: block;}
*/
/* End Holly Hack */
form li div{float:left;display:inline;margin-right:5px;}
form li p{line-height:13px;color:#444;}
form li div label{float:left;font-size:9px;color:#444;margin-bottom:3px;}
form li div.left{width:48%;}
form li div.right{width:48%;}
form li div.left .medium, form li div.right .medium{width:100%;}
.clear{clear:both;}
form li div p{margin-bottom:3px;}
form li img.icon{float:left;margin:.35em 5px 0 0;}
form li.focused{background-color:#fff7c0;}
form li:hover .instruct, form li.focused .instruct{
	display:block;
}
.noI form li{width:95% !important;}
.noI .instruct{display:none !important;}


/* ===  Sections ===*/
form li.section{border-top:1px dotted #ccc;margin-top:15px;padding-top:12px;padding-bottom:0px;}
form ul li.first{border-top:none;margin-top:0px;padding-top:1px;}
form .section h3{font-size:110%;line-height:130%;margin:0 0 2px 0;}
form .section p{font-size:85%;margin:0 0 1em 0;}

/* === Info===*/
#containerForm .info{
	display:inline-block;
	/*clear:both;*/
	margin: 0px;
	padding: 5px;
	/*
	background:#f5f5f5;
	border: 1px dotted #ccc;
	*/
}
.info[class]{display:block;}

.info h3, .info h4 {font-family:inherit;}
.info p{
	margin:0 0 8px 0;
	font-family:inherit;
	color:#444444;
}
.error {
	border: 1px solid red;
	background-color: #ffffee;
	color: #660000;
	padding: 5px;
	line-height:1em;
}
.error h4{
	font-family:inherit;
	line-height:1em;
}
.error dl{
	margin:0px;
	padding:5px 5px 5px 15px;
}
form .error dl dt {
	margin:0px;
	padding:5px 0px;
}
form .error dl dd.err {
	padding:2px 0px 2px 15px;
	line-height:1em;
}
form .error dl dd strong{
	font: bolder small;
	color: Red;
}

/* === Instruction ===*/
#contactform .instruct[class]{width:29%}
#containerForm .instruct{
	width:45%;
	left:63%;
	margin-left:25px;
	font-family:inherit;
	font-size:95%;
	color:#444444;
	/*background-color:#fff0f5;*/
	border:1px solid #e6e6e6;
}
.instruct{
	display:none;
	position:absolute;
	left:100%;
	width:45%;
	margin:-1px 0 0 10px;
	padding:8px 10px 9px 10px;
	border:1px solid #e6e6e6;
	background:#f5f5f5;
	line-height:130%;
	font-size:85%;
	color:#444;
}


/* === Elements ===*/
p{color:#222;}

/* === Headings ===*/
h1, h2, h3{font-weight:normal;}
h1{text-indent:-9000px;text-decoration:none;}
h2{font-size:160%;margin:0 0 3px 0;clear:left;}

/* === Links ===*/
#containerForm h1 a{width:100%;}
a{color:blue;outline:none;}
a:hover{cursor:pointer;color:green;}a img{border:0;}

/* === Classes ===*/
.inline{display:inline !important;}
.center{text-align:center !important;}
.left{float:left;}
.right{float:right;}
.hide{display:none !important;}
.strong{font-weight:bold;}

/* ----- Clearfix ===*/
.clearfix:after, #contactform:after{content:"."; display:block; height:0; clear:both; visibility:hidden;}
.clearfix, #contactform{display: inline-block;}
/* Holly Hack Targets IE Win only \*/
* html .clearfix, * html #contactform{height: 1%;}
.clearfix, #contactform{display: block;}
/* End Holly Hack */

/* === Buttons ===*/
.buttons{clear:both;margin:10px 0 20px 7px;}
.buttons .button{font-size:120%;margin:0 5px 0 0;}
.button{cursor:pointer !important;}
.button{padding:0 10px;}
/*
.button{background:#fff;border-top:1px solid #7c7c7c;border-left:1px solid #c3c3c3;border-right:1px solid #c3c3c3;border-bottom:1px solid #ddd;	height:120%}
*/

/* === Form fields ===*/
#containerForm label.desc{
	font-family: inherit;
	color: #006699;
	text-decoration: underline;
	font-weight: bold;
}
#containerForm input.text, #containerForm textarea.textarea{
	font-family:inherit;
	color:#333333;
}

/* === Fields and labels ===*/
label.desc{
	padding:4px 4px 1px 0;
	border:none;color:#444;
	display:block;
}
input.text, textarea.textarea, select.select{
	font-size:100%;
	border-top:1px solid #7c7c7c;
	border-left:1px solid #c3c3c3;
	border-right:1px solid #c3c3c3;
	border-bottom:1px solid #ddd;
	background:#fff url(/images/fieldbg.gif) repeat-x top;
	color:#333;
}
input.text{padding:2px 0 2px 0;}
input.currency{text-align:right;}
input.checkbox, input.radio{display:block;line-height:1.4em;margin:8px 0 0 3px;width:13px;height:13px;}
label.choice{font-size:9px;color:#444;margin-bottom:3px;display:block;line-height:1.4em;}
textarea.textarea{margin-top:1px;font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;}
select.select{margin:1px 0 1px 0;padding:1px 0 0 0;}
select.select[class]{margin:0;padding:1px 0 1px 0;}

/* ===  Sizes ===*/
.third{width:32% !important;}
.half{width:48% !important;}
.full{width:100% !important;}
input.small, select.small{width:25%;}
input.medium, select.medium{width:50%;}
input.large, select.large, textarea.textarea{width:99%;}
input.tags{width:315px;}
textarea.small{height:5.5em;}
textarea.medium{height:10em;}
textarea.large{height:20em;}


