/*
   list.css
   List page for all the mobile phones.
   
   Created by Ned Baldessin on 2008-08-25.
   Copyright 2008 Ned Baldessin. All rights reserved.
*/

/* ========================================== */
/* = Left column (reordering and filtering) = */
/* ========================================== */

html, body.list{
    height:100%;
}

body.list #left-col {
	width: 176px;
	float: left;
	background: url('../images/imgsite/list/left-col-bg.png') repeat-y;
}

body.list #left-col #reorder h5 {
	display: block;
	text-indent: -9999px;
	height: 37px;
	background: url('../images/imgsite/list/left-col-trier-la-liste.png') no-repeat;
}

body.list #left-col #reorder ul {
	/*background: url('../images/liste/left-col-bg.png') repeat-y;*/
	padding: 5px 3px 7px 3px;
}

body.list #left-col #reorder li {
	list-style-position: inside;
	list-style-type: square;
	list-style-image: url('../images/imgsite/arrow-marker.png');
	padding-left: 10px;
	_margin-left: -15px;
}

body.list #left-col #reorder li a {
	font-size: 12px;
	line-height: 18px;
	color: #c00;
	_margin-left: 4px;
}

body.list #left-col #filter {
	background: url('../images/imgsite/list/left-col-bottom.png') no-repeat left bottom;
	padding-bottom: 20px;
}


body.list #left-col #filter h5 {
	display: block;
	text-indent: -9999px;
	background: url('../images/imgsite/list/left-col-ma-selection.png') no-repeat;
	height: 34px;
}

/* The "tout décocher" links. */
body.list #left-col #filter a {
	display: block;
	font-size: 11px;
	color: #c00;
	margin: 10px 0 5px 14px;
}
body.list #left-col #filter fieldset {
	margin: 10px 10px 0 14px;
}

body.list #left-col #filter fieldset legend {
	display: block;
	font: bold 12px Arial, sans-serif;
	margin: 0;
	line-height: 24px;
}

body.list #left-col #filter fieldset label {
	display: block;
	font-size: 12px;
	margin-bottom: 5px;
}
body.list #left-col #filter fieldset label input {
	vertical-align: bottom;
	margin-right: 4px;
}

body.list #left-col #filter fieldset label span.shim {
	display: -moz-inline-block;
	display: inline-block;
	width: 20px;
}

body.list #left-col #filter fieldset label span {
	color: #c00;
}

/* The MSN icon. */
body.list #left-col #filter fieldset label img {
	vertical-align: bottom;
}



/* ============================= */
/* = Right column (auto promo) = */
/* ============================= */

body.list #right-col {
	width: 176px;
	float: right;
	margin-top: 27px;
}

body.list #right-col img {
	margin-bottom: 9px;
}



/* ============================================= */
/* = Middle column, with all the mobile phones = */
/* ============================================= */

body.list #middle-col {
	width: 580px;
	margin: 0 203px;
	position: relative;
}

body.list #middle-col h2 {
	text-indent: -9999px;
	background: url('../images/imgsite/list/les-mobiles.png') no-repeat;
	height: 30px;
	width: 143px;
	/*float: left;*/

}

body.list p#breadcrumbs a.choisir-mon-mobile {
	margin-right: 207px;
}

body.list #middle-col span#result-count {
	height: 30px;
	line-height: 30px;
	display: block;
	font-size: 12px;
	color: #333;
	position: absolute;
	top: 0;
	left: 143px;
}

/* This overrides the other styles in widgets.css */
body.list #middle-col p#breadcrumbs {
	width: 580px;
	/*float: right;*/
	height: 35px;
	background: url('../images/imgsite/list/etape-1.png') no-repeat right center;
}

body.list #result-block {
	width: 580px;
	/*overflow: hidden;*/
}

body.list table.mobile-list {
	border-bottom: 1px solid #d3d4d5;
}

body.list table.mobile-list tr.buttons td {
	padding-bottom: 13px;
}

body.list table.mobile-list td {
	width: 130px;
	padding-right: 9px;
	margin-left: 0;
	margin-right: 0;
    height: 100%;
    min-height:100%;
}

body.list table.mobile-list td table {
    
    height:100%;
    vertical-align:bottom;

}

body.list table.mobile-list a.select,
body.list table.mobile-list a.compare {
	width: 130px;
	height: 30px;
	margin-left: 3px;
	margin-bottom: 5px;
}

body.list table.mobile-list a.select { background: url('../images/imgsite/list/select.png') no-repeat;}
body.list table.mobile-list a.compare { background: url('../images/imgsite/list/compare.png') no-repeat;}

body.list table.mobile-list tr.price-row td div {
	width: auto;
	margin-right: 3px;
}

/* ========================================== 	*/
/* PNG reduc Management mobile  - mobile wall*/
/* ========================================== 	*/

body.list table.mobile-list tr.pic-row td a.reducPng{
	position: absolute;
	width: 90px;
	height: 160px;
	margin: 0 0 0 -100px;
}
body.list table.mobile-list tr.pic-row td a.reducPng .reduc-pos-1 {
	float: left;
	width: 35px;
	height:35px;
}
body.list table.mobile-list tr.pic-row td table a.reducPng .reduc-pos-2 {
	float: right;
	width: 35px;
	height:35px;
}
body.list table.mobile-list tr.pic-row td a.reducPng span {
	float: left;
	width: 100%;
	position : absolute;
	bottom: 0;
	left: 0;
}
body.list table.mobile-list tr.pic-row td a.reducPng span .reduc-pos-3{
	width:90px;
	height:37px;
}

/* ============== */
/* = Ajax stuff = */
/* ============== */

#loading-spinner {
	position: absolute;
	top: 250px;
	left: 200px;
	font: bold 22px Arial, sans-serif;
	color: #a3a3a3;;
	background: url('../images/imgsite/spinner.gif') no-repeat;
	background-position: 0px 0px;	
	padding-left: 40px;
	z-index: 999;
}

