/**
 * forms stylesheet
 *
 * For images without text use [10/BasePath]
 * For images with text use [10/LanguagePath]  and put the images in "fr" or "en" directories
 */

fieldset{
	border: 0;
	margin: 0;
	padding: 0;
}
legend{
	position: absolute;
	left: -10000px;
	top: auto;
	overflow: hidden;
}
/**
 ***************************************************************************************************************
 * size of the main form block
 *
 * @version 1.0
 * @author Celine Juan <celine.juan@cdiscount.com>
 * @author Jonathan Travens <jonathan.travens@cdiscount.com>
 * @author Nicolas Goueset <nicolas.goueset@cdiscount.com>
 * @package cdiscount-ui
 * @charset utf-8
 */
.formSmall,
.formMedium,
.formLarge{
	border: 1px solid #c4ccd2;
	color: #616161;
	font-family: Arial;
	float: left;
	font-size: 11px;
	margin: 15px 0 0 15px;
	width: 398px;
}
.formSmall{
	width: 300px;
}
.formLarge{
	width: 818px;
}
/* .rightBlock{
	margin: 0 0 0 15px;
}
*/
/**
 ****************************************************************************************************************
 * form header
 *
 * @version 1.0
 * @author Celine Juan <celine.juan@cdiscount.com>
 * @author Jonathan Travens <jonathan.travens@cdiscount.com>
 * @author Nicolas Goueset <nicolas.goueset@cdiscount.com>
 * @package cdiscount-ui
 * @charset utf-8
 */
.formTop{
	background: url(https://i2.cdscdn.com/struct/common/form/repeat_titre.png);
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	height: 28px;
	line-height: 28px;
	margin: 0 0 15px;
	text-indent: 10px;
} 
	.formTop .topLeft{
	  float: left;
	  height: 44px;
	  width: 8px;
	}
	.formTop .topLine{
		float: left;
		height: 44px;
		width: 457px;
	}
	.formTop .topRight{
		float: left;
		height: 44px;
		width: 15px;
	}
	.formTop .titleIco{
		float: left;
		height: 25px;
		margin: 6px 3px 0 5px;
		width: 25px;
	}
	.formTop .titleText{
		font-size: 13px;
		padding: 11px 0 0;
	}
	.formTop .titleText span{ 
		font-weight: bold;
	}
/**
 ****************************************************************************************************************
 * form bottom
 *
 * @version 1.0
 * @author Celine Juan <celine.juan@cdiscount.com>
 * @author Jonathan Travens <jonathan.travens@cdiscount.com>
 * @author Nicolas Goueset <nicolas.goueset@cdiscount.com>
 * @package cdiscount-ui
 * @charset utf-8
 */
.formBottom{
	float: left;
	width: 480px;
}
	.formBottom .bottomLeft{
		float: left;
		height: 13px;
		width: 8px;
	}
	.formBottom .bottomLine{
		float: left;
		height: 13px;
		width: 457px;
	}
	.formBottom .bottomRight{
		float: left;
		height: 13px;
		width: 15px;
	}
.formBottomLeft{
		bottom: 10px;
		left: 10px;
		position: absolute;
}
/**
 *****************************************************************************************************************
 * form content
 *
 * @version 1.0
 * @author Celine Juan <celine.juan@cdiscount.com>
 * @author Jonathan Travens <jonathan.travens@cdiscount.com>
 * @author Nicolas Goueset <nicolas.goueset@cdiscount.com>
 * @package cdiscount-ui
 * @charset utf-8
 */
.formContent{
    padding: 0 0 0 10px;
	position: relative;
	*display: inline; /* for IE7 */
	zoom: 1; /* for IE6 */
}
	.formLine{
	    clear:both;
		position:relative;
	}
	.formLarge .formLineInput{
		*+ margin: 0 0 15px; /* for IE7 */
		position: relative;
		width: 386px;
	}
	.formLarge .formLineFacet{
		*+ margin: 0 0 15px; /* for IE7 */
		width: 329px;
	}
	.formContent .facet-criterion {
		*+ float: left; /* for IE7 */
		margin: 0 0 15px;
	}
/*
 * Form 
 */
.formLabel,
.formInputText{
	color: #3c5a80;
	font-size: 12px;
	font-weight: bold;
}
.formLabel{
	float: left;
	line-height: 25px;
	margin: 0 5px 0 0;
	padding: 0 10px 0 0;
	text-align: right;
	width: 155px;
}

.formLabel2Line { line-height:12px;} /* A rajouter à formLabel pour permettre l'affichage du label du 2 lignes */

.formLine .formLabel{
	line-height: 14px;
}
.formInputText,
.formInputSelect,
.formInputTextExpand{
	border: 1px solid #c4ccd2;
	*+ float: left; /* for IE7 */
	height: 25px;
	*+ line-height: 25px; /* for IE7 */
	margin: 0 2px 15px 0;
	text-indent: 5px;
	width: 190px;
}
.formInputTextExpand{
	width:35%;
}

.formInputSelect{
    height:auto;
    float:left;
    position:relative;
    top:2px;
    text-indent:0;
}
.formInputGroup{
    height:25px;
    float:left;
    margin: 0 2px 15px 0;
    width: 190px;
}
.formTextArea{
	border: 1px solid #c4ccd2;
	font-size: 12px;
	*+ float: left; /* for IE7 */
	height: 150px;
	margin: 0 3px 15px 0;
	padding: 2px 5px 5px 5px;
	width: 597px;
}
.formTextArea.medium{
	width:550px;
}
.formLabelInfo{
	color: #3c5a80;
	font-size: 10px;
	font-style: italic;
    left: 0;
	position: absolute;
	text-align: right;
	top: 14px;
	width: 155px;
}
/**
 * form description
 */
.formDesc{
	float: left;
	margin: 0 0 10px;
	text-align: left;
	width: 440px;
}
/*
 * Form link
 */
.formLink{
	background: url(https://i2.cdscdn.com/struct/common/icon/icone.gif) -4px -7px no-repeat;
	color: #3c5a80;
	font-size: 10px;
	padding: 0 36px 0 10px;
	text-align: right;
}
a.formLink{
	color: #3c5a80;
	text-decoration: none;
}
a.formLink:hover{
	text-decoration: underline;
}
/**
 **************************************************************************************************************
 * Form validation
 *
 * @version 1.0
 * @author Celine Juan <celine.juan@cdiscount.com>
 * @author Jonathan Travens <jonathan.travens@cdiscount.com>
 * @author Nicolas Goueset <nicolas.goueset@cdiscount.com>
 * @package cdiscount-ui
 * @charset utf-8
 */
/**
 * status of the form elements when there is a warning on it
 */
.formInputWarning,
.formTextAreaWarning{
	border-color: #ed0000;
	color: #ed0000;
 }
 /**
  * right validation images
  */
.requiredField,
.inlineRequiredField{
	color: #ed0000;
	float: right;
	font-size: 10px;
	height: 25px;
	margin: 0 10px 0 0;
	width: 11px;
}

.inlineRequiredField{ float:left; margin:0 3px; }  /* A utiliser à la place de requiredField si un élément doit être positionné à droite du requiredField */

	.validatedField{
		background: url(https://i2.cdscdn.com/struct/common/icon/icone.gif) no-repeat scroll 0 -1512px;
	}
	.errorField{
		background: url(https://i2.cdscdn.com/struct/common/icon/icone.gif) no-repeat scroll 0 -1473px;
	}
/**
 * form warning message
 *
 * <code>
 *	<div class="formWarning">
 *		<span class="formWarningTitle">Attention : </span>
 *		<ul>
 *			<li>Entrez un email valide</li>
 * 			<li>Entrez un password</li>
 * 		</ul>
 * 	</div>
 * </code> 
 */
.formWarning{
	color: #ed0000;
	margin: 0 10px 0 0;
	width: 100%;
}
.formWarningTitle{
	font-weight: bold;
	margin: 10px 0 0;
}
    .formWarning ul {
		margin: 0;
		padding: 6px 0 0;
	}
    .formWarning li{
        list-style-type: none;
        margin: 0;
    }
/**
 * legend box at the form bottom
 *
 * <code>
 * 	<ul class="formLegend">
 * 		<li class="requiredField">* Champs obligatoires</li>
 * 		<li class="validatedField">Champ valid&eacute;</li>
 * 		<li class="errorField">Erreur de saisie</li>
 * 	</ul>
 * </code>
 */

.formInfo {
    padding: 0 0 0 15px;
    margin-bottom: 20px;
}

.formLegend{
	margin: 0;
	padding: 0;
	list-style:none;
}

.formLegend .requiredField,
.formLegend .validatedField,
.formLegend .errorField{
	float: left;
	height: 11px;
	margin: 10px 10px 0 0;
	padding: 0;
	text-indent: 15px;
	width: auto;
}
.formLegend .requiredField{
	text-indent: 0;
}
.formLegend .validatedField{
	background-position: 0 -1520px;
}
.formLegend .errorField{
	background-position: 0 -1480px;
}
.formInfos{
	margin: 20px 0 0;
	padding: 0 10px;
	width: 960px;
}
.formButton{
	padding: 0 10px 10px;
	text-align: right;
}

.formWarning .formInputSelect {float:none;}


/**
 * SPECIAL FORMS STYLING FOR Cdiscount PRO Popup
 */
 
 .cdsProPopup {
    font-family:Arial;
    margin:20px auto;
    width:580px; 
 }
 
 .cdsProPopupContainerTop,
 .cdsProPopupContainerBottom {
    background:url(https://i2.cdscdn.com/struct/common/layout/roundedContainer580.gif) no-repeat -580px 0;
    height:16px;
    width:100%;
 }
 
.cdsProPopupContainerBottom { background-position:-580px -17px; }
   
.cdsProPopupContainer {
   background:url(https://i2.cdscdn.com/struct/common/layout/roundedContainer580.gif) -7px 0 no-repeat #f5f5f5;
   background: -moz-linear-gradient(top, #fff 40%, #f5f5f5 100%); /* FF3.6+ */
   background: -webkit-gradient(linear, left top, left bottom, color-stop(40%,#fff), color-stop(100%,#f5f5f5)); /* Chrome,Safari4+ */
   background: -webkit-linear-gradient(top, #fff 40%,#f5f5f5 100%); /* Chrome10+,Safari5.1+ */
   background: -o-linear-gradient(top, #fff 40%,#f5f5f5 100%); /* Opera11.10+ */
   background: -ms-linear-gradient(top, #fff 40%,#f5f5f5 100%); /* IE10+ */
   background: linear-gradient(top, #fff 40%,#f5f5f5 100%); /* W3C */
   border: 1px solid #aaa;
   border-width:0 1px;
   color:#474646;
   margin:0 0 0 7px;
   padding: 15px 30px 0px;
   width:504px;
   /* -moz-box-shadow: 2px 4px 4px #aaa;
   -webkit-box-shadow: 2px 4px 4px #aaa;
   box-shadow: 2px 4px 4px #aaa; */
}

.logoCdsPro {
    display:block;
    margin: 0 auto;
    width:247px;
}

.cdsProPopupIntro {
    font-size:14px;
    text-align:center;
}

.cdsProPopup strong {
    font-weight:normal;
    color:#fd6811;
}

.cdsProPopup .formMedium {
    background:#fff;
    float:none;
    margin:0 auto;
    padding:30px 15px 20px 20px;
}

.cdsProPopup .formLabel {
    color:#474646;
    font-size:12px;
    font-weight:normal;
    text-align:left;
}

.cdsProPopup .formInputText{
    border-color:#e4a484;
    color:474646;
    height:15px;
    font-weight:normal;
}

.cdsProPopup .formButton{
    padding-right:25px;
}

.cdsProPopup .formInfo {
    margin: 0 auto;
    overflow:hidden;
    padding: 0;
    width: 305px;
}

.cdsProPopup .formInfo .requiredField {
    color:#474646;
    height:15px;
}

.cdsProPopup .formMedium .requiredField {
    position:relative;
    bottom:5px;
    left:5px;
}

.legalInformations{
    text-align: center;
}