/*************************************************************************
	Machine Bidder.com
	HTML/CSS Developed by Matthew Hill (c) 2008 -- http://www.friskdesign.com/
	for Sensible Development -- http://www.sensibledevelopment.com/
	MODULE: 	global.css
	PURPOSE:	all rules for site
*************************************************************************/

/* Auto float clearing for compliant browsers
*************************************************************************/
#skip:after,
#banner:after,
#nav:after,
#nav ul:after,
#wrapper:after,
#finder:after,
.auctionlist li:after,
.auctionlist .itemwrap:after,
#auctionlist-recent:after,
#footer:after {
	content: ".";
	height:0;
	display:block;
	clear:both;
	visibility:hidden;
}

/* General Rules and classes
*************************************************************************/
body {
	color:#666;
	background:#FFF;
	font: normal 0.75em/1.6em Arial,"Helvetica Neue","Helvetica",sans-serif;
	margin:0;
	padding:0;
	min-width:  800px;
}
#skipto {
	position:absolute;
	left:-1000em;
}
.floatright {
	float:right;
	text-align:right;
}
.floatleft {
	float:left;
	text-align:left;
}
.alignright {
	text-align:right;
}
.alignleft {
	text-align:left;
}
img {
	border:none;
}

/* Layout (sizes / floats / positions of main elements)
*************************************************************************/
#wrapper {
	padding:0 20px;
}
#innerwrap {
	padding:20px 0 0 0;
}
/* Specific layout on homepage */
#home #main {
	float:left;
	width:100%;
}
#home #content {
	margin:0 190px;
	min-height:600px;
}
#home #categories {
	float:left;
	margin-left:-100%;
	width:170px;
	min-height:600px;
}
#home #adverts {
	float:right;
	margin-left:-100%;
	width:170px;
	min-height:600px;
}
/* Combined 2/3 column layout for Item page */
#main {
	float:left;
	width:100%;
}
#content {
	margin:0 0 0 190px;
	min-height:600px;
}
#breadcrumbs {
	margin:0 0 0 190px;
}
#categories {
	float:left;
	margin-left:-100%;
	width:170px;
	min-height:600px;
}

/* Content formatting
*************************************************************************/
h1,h2,h3,h4,h5,h6,blockquote {
	font: bold 1em/1 Arial,"Helvetica Neue",Helvetica,sans-serif;
	margin:0 0 10px 0;
	color:#990033;
}
p {
	margin:15px 0;
}
ul,
ol,
dl {
	margin:0 0 20px 30px;
	padding:0;
}
li {
	margin:0 0 0.3em;
}
h1 {
	font-size:2em;
	margin:0;
	padding:10px 0;
	border-bottom:1px solid #CCC;
	color:#990033;
}
h2 {
	font-size:1.2em;
	margin:0;
	padding:10px 0;
	border-bottom:1px solid #CCC;
	color:#990033;
}
h3 {
	font-size:1.5em;
	margin:0;
	padding:10px 0;
	border-bottom:1px solid #CCC;
}
a {
	color:#990033;
	text-decoration:underline;
}
a:visited {
	color:#990033;
}
a:hover {
	color:#669933;
}
h2 a,
h2 a:visited {
	text-align:right;
	display:block;
	font-size:0.7em;
	margin-top:-1em;
	color:#990033;
}
h2 a:hover {
	color:#990033;
}

/* Centering unknown width
*************************************************************************/

.centerall {
	clear:both;
	display: table;
	margin:0 auto;
}
.shrink {
	display: table;
}

/* Forms (General)
*************************************************************************/
form {
	margin:0;
	padding:0;
}
fieldset {
	margin:0;
	padding:0;
	border:none;
}
legend {
	padding:0;
	margin:0;
	line-height:1;
}
input,
select {
	border-top:1px solid #ABADB3;
	border-bottom:1px solid #E3E9EF;
	border-left:1px solid #DBDFE6;
	border-right:1px solid #DBDFE6;
	color:#333;
	padding:3px 2px;
	font: normal 1em/1 Arial,"Helvetica Neue",Helvetica,sans-serif;
}
select {
	padding:0;
	height:22px;
}
button {
	height:22px;
	padding:0 8px;
	font: normal 1em/1 Arial,"Helvetica Neue",Helvetica,sans-serif;
}

/* Skip links
*************************************************************************/
#skip {
	font-size:0.80em;
}
#skip a,#skip a:visited {
	color:#E8E6D4;
	text-decoration:none;
	position:absolute;
	left:-1000em;
	top:0;
}
#skip a:visited:hover,#skip a:hover,#skip a:focus {
	color:#526568;
	text-decoration:underline;
	left:0;
}

/* Banner
*************************************************************************/
#banner {
	padding-top:14px;
	min-height:126px;
	position:relative;
	background:#990033 url(../images/bg-banner-tile.png) left top repeat-x;
}
#banner img {
	float: left;
}
.loginlink {
	float: right;
	width:270px;
	text-align:right;
	text-decoration:none;
	color:#FFF;
	float: right;
	clear: right;
	margin-right: 10px;
	margin-top: 4px;
}
.loginlink:hover {
	color:#ABC9DC;
}
#loginform {
	float: right;
	color:#FFF;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
}
#loginform legend {
	padding:0 0 0 70px;
	margin:0;
}
#loginform input {
	background:#E6EAEE;
	border-top:1px solid #9AA0A9;
	border-bottom:1px solid #CDD6E0;
	border-left:1px solid #CCD0DB;
	border-right:1px solid #CCD0DB;
	width:150px;
	margin:10px 0 0 0;
	display:block;
	float:left;
}
#loginform button {
	border:1px solid #669933;
	background:#669933 url(../images/bg-login.png) top left repeat-x;
	color:#FFF;
	font: bold 1em/1 Arial,"Helvetica Neue",Helvetica,sans-serif;
	height:22px;
	padding:0 8px;
	margin:10px 0 0 8px;
	float:left;
}
#loginform label {
	width:70px;
	display:block;
	margin:10px 0 0 0;
	float:left;
	clear:left;
}
#loginform a,
#loginform a:visited {
	clear:both;
	font-size:0.90em;
	margin:0 0 0 70px;
	line-height:2em;
	color:#ABC9DC;
}
#loginform a:hover {
	color:#FFF;
}

/* Top Navigation
*************************************************************************/
#nav {
	clear:both;
	background:#66ADD9 url(../images/bg-navigation.png) top left repeat-x;
}
#nav ul {
	margin:0;
	padding:0;
}
#nav ul li {
	list-style:none;
	margin:0;
	padding:0;
	float:left;
}
#nav ul a,
#nav ul a:visited {
	font-size:1.25em;
	font-weight:bold;
	line-height:34px;
	text-decoration:none;
	padding:0 15px;
	display:block;
	color:#FFF;
}
#nav ul a:hover,
#nav ul a:focus {
	background:#7D7A71;
}
#nav ul li.selected a,
#nav ul li.selected a:visited {
	color:#7D7A71;
	padding:0 14px;
	background:#FFF url(../images/bg-navtab.png) left top repeat-x;
}
#nav ul li.nav-divider {
	border-left:1px solid #FFFFFF;
	height: 34px;
}

/* Finder (Search / Browse)
*************************************************************************/
#finder {
	background:#EFEFEF url(../images/bg-search.png) repeat-x;
	color:#990033;
	padding:15px 0;
	margin:10px 20px 0;
}
#finder form {
	float:left;
}
#finder legend {
	display:none;
}
#finder label {
	font-weight:bold;
	font-size:1.25em;
	float:left;
	width:auto;
}
#finder select,
#finder input {
	width:200px;
	margin:0 10px;
	float:left;
	background:#FFF;
	color:#990033;
}
#finder select {
	height:20px;
}
#finder button {
	float:left;
	line-height:22px;
}
#searchform {
	margin:0 55px 0 0;
}

/* Breadcrumbs
*************************************************************************/
#breadcrumbs {
	margin:0 0 20px 190px;
}
#breadcrumbs ul {
	list-style:none;
	padding:0;
	margin:0;
}
#breadcrumbs li {
	display:inline;
	font-weight:bold;
	color:#999;
	margin:0 2px 0 0;
	padding:0;
}
#breadcrumbs li a,
#breadcrumbs li a:visited {
	text-decoration:none;
	color:#990033;
	padding:0 12px 0 0;
	background:#FFF url(../images/arrow.png) right center no-repeat;
}
#breadcrumbs li a:hover {
	text-decoration:underline;
}


/* Categories
*************************************************************************/
#categories {
	background:url(../images/bg-categories.png) repeat-x;
}
#categories h3 {
	margin:10px;
	color:#990033;
	font-size:1.2em;
}
#categories ul {
	list-style:none;
	margin:0;
	padding:0;
}
#categories ul li {
	margin:0;
	vertical-align:top;
}
#categories ul li a,
#categories ul li a:visited {
	color:#333;
	text-decoration:none;
	font-weight:bold;
	line-height:normal;
	padding:5px 10px;
	display:block;
	vertical-align:top;
	height:1%;
}
#categories ul li a:hover {
	background:#FFF;
	color:#990033;
	padding:4px 10px;
	border-bottom:1px solid #CCC;
	border-top:1px solid #CCC;
}
#categories ul li.selected a,
#categories ul li.selected a:visited,
#categories ul li.selected a:hover {
	background:#FFF url(../images/arrow.png) 10px 8px no-repeat;
	padding:4px 10px 4px 20px;
	border-bottom:1px solid #CCC;
	border-top:1px solid #CCC;
}


/* Adverts
*************************************************************************/
#adverts {

}
#adverts .advert {
	margin:0 0 20px 0;
}
#adverts .advert img {
	display:block;
}

/* Homepage overrides
*************************************************************************/
#home h1 {
	color:#990033;
	margin:0;
	padding:0 0 20px 0;
	border-bottom:1px solid #CCC;
	font-size:2em;
}
#home h2 {
	margin:20px 0 0 0;
	padding:0 0 10px 0;
	font-size:1.5em;
	border:none;
	color:#990033;
}
#home h3 {
	padding:0;
	border:none;
}


/* Auction listings (homepage)
*************************************************************************/
.auctionlist {
	list-style:none;
	margin:0;
	padding:0;
	border-bottom:1px solid #CCC;
}
.auctionlist li {
	margin:0;
	padding:0 0 10px 0;
	border-top:1px solid #CCC;
}
.auctionlist h3 {
	line-height:2.3em;
	margin:0;
	font-size:1.2em;
	color:#333;
}
.auctionlist .itemwrap {
	clear:both;
	position:relative;
	min-height:180px;
	padding:10px 0 10px 0;
	border-top:1px solid #CCC;
}
.auctionlist .itemwrap .itemend {
    clear: both;
}
.auctionlist .description {
	margin-left: 150px;
	margin-right: 230px;
}
.auctionlist img {
	float: left;
	padding:3px;
	background:#FFF;
	border:1px solid #CCC;
}
.biddingStatus {
	width: 156px;
    height: 27px;
    float: right;
    margin-top: 3px;
}
.biddingStatus span {
    display: none;
}
.biddingStatus.noBid {
    visibility: hidden;
}
.winning {
    background: url(../images/button-winning.png) top right no-repeat;
}
.losing {
    background: url(../images/button-losing.png) top right no-repeat;
}
.belowReserve {
    background: url(../images/button-below-reserve.png) top right no-repeat;
}
.won {
    background: url(../images/button-won.png) top right no-repeat;
}
.lost {
    background: url(../images/button-lost.png) top right no-repeat;
}

.auctionlist form {
	padding:10px;
	background:url(../images/bg-bidbox.png) repeat-x;
	float: right;
	width: 200px;
}
.auctionlist form table {
    width: 100%;
}
.auctionlist form table th,
.auctionlist form table td {
	margin:0;
	padding:0;
	font-size:0.90em;
	line-height:1.2;
	padding-bottom: 5px;
	width: 50%;
}
.auctionlist form table th {
    font-weight: normal;
    text-align: left;
}
.auctionlist form table td {
    font-weight: bold;
}
.auctionlist input {
	width:60px;
}
.auctionlist button {
	border:none;
	color:#FFF;
	padding:0;
	margin-left: 3px;
	width:75px;
	font-weight:bold;
	line-height:22px;
	background:#3B581E url(../images/button-green.png) left top repeat-x;
}
.auctionlist .buynow {
	clear:both;
	float:right;
	color:#FFF;
	background:#8EBBD8 url(../images/button-blue-left.png) left top no-repeat;
	line-height:22px;
	margin:10px 0 0 0;
}
.auctionlist .buynow a,
.auctionlist .buynow a:visited {
	color:#FFF;
	display:block;
	line-height:22px;
	text-decoration:none;
	font-weight:bold;
	padding:0 8px;
	background:url(../images/button-blue-right.png) right top no-repeat;
}

.auctionlist .endDate td * {
   display: none;
}
.auctionlist .endDate td .remaining {
   display: inline;
}

/* Item Details & Images
*************************************************************************/
#itemdetails {
	float:left;
	width:100%;
}
#itemdetails .wrap {
	margin:0 334px 0 0;
}
#itemimages {
	float:right;
	margin:3.1em 0 0 10px;
	width:324px;
	margin-left:-100%;
}
#itemimages img {
	margin:10px 0 0 10px;
	max-width:90px;
	border:1px solid #CCC;
	padding:3px;
	background:#FFF;
	float:left
}
#itemimages img#itemenlargement {
	max-width:314px;
	margin-top:0;
}


/* Item Details Bidding form
*************************************************************************/

/* Ordinarily, we'd make both sets of forms (this one and the ones on the home page)
share the same CSS, but to allow for specific future tailoring, I've duplicated the
styles here for the item description page */

#itemdetails form {
	padding:20px;
	color:#333;
	background:url(../images/bg-bidbox.png) repeat-x;
}
#itemdetails form big {
	font-size:1.5em;
}
#itemdetails form input {
	width:80px;
}
#itemdetails form button {
	border:none;
	color:#FFF;
	margin-left: 10px;
	padding-left: 10px;
	padding-right: 10px;
	font-weight:bold;
	line-height:22px;
	background:#3B581E url(../images/button-green.png) left top repeat-x;
	display: inline;
}
#itemdetails form label.buynow {
	margin:10px 0 0 0;
	width:100px;
}
#itemdetails form p.buynow {
	float:left;
	color:#FFF;
	background:#8EBBD8 url(../images/button-blue-left.png) left top no-repeat;
	line-height:22px;
	margin:10px 0 0 0;
}
#itemdetails form p.buynow a,
#itemdetails form p.buynow a:visited {
	color:#FFF;
	display:block;
	line-height:22px;
	text-decoration:none;
	font-weight:bold;
	padding:0 8px;
	background:url(../images/button-blue-right.png) right top no-repeat;
}
#itemdetails form table th {
	text-align: left;
	font-weight: normal;
	padding-right: 10px;
}
#itemdetails form table td {
	font-weight: bold;
}
#itemdetails form table tr.endDate td {
    font-weight: normal;
}
#itemdetails form table tr.endDate td .value {
	font-weight: bold;
}
#itemdetails form table th,
#itemdetails form table td {
    vertical-align: bottom;
    padding-bottom: 5px;
}
#itemdetails form {
    position: relative;
}
#itemdetails form .biddingStatus {
    width: 156px;
    height: 27px;
    position: absolute;
    right: 0;
    top: -30px;
}
#itemdetails form .biddingStatus span {
    display: none;
}
#itemdetails form .winning {
    background: url(../images/button-winning.png) top right no-repeat;
}
#itemdetails form .losing {
    background: url(../images/button-losing.png) top right no-repeat;
}
#itemdetails form .belowReserve {
    background: url(../images/button-below-reserve.png) top right no-repeat;
}
#itemdetails form .won {
    background: url(../images/button-won.png) top right no-repeat;
}
#itemdetails form .lost {
    background: url(../images/button-lost.png) top right no-repeat;
}

#itemdetails h3 {
    padding-right: 156px;
}
#itemdetails form .errors {
	color: red;
	font-weight: bold;
}



/* Footer
*************************************************************************/
#footer {
	clear:both;
	height:40px;
	border-top:1px solid #CCC;
	margin-left:20px;
	margin-right:20px;
}




/* EXTRA (GK)
*************************************************************************/

#footer-right {
	float:right;
	text-align:right;
}

#footer-left {
	float:left;
	text-align:left;
}

#itemdetails form input[type="hidden"] {
	display:none;
}

#banner form input[type="hidden"] {
	display:none;
}

input.error {
    color: red;
    background: yellow;
}
#error-messages,
.error {
    color: red;
    font-weight: bold;
}

/*
 * Generic form is used for registration,
 */

#generic-form {
	padding:10px;
}

#generic-form tr {
	padding:5px;
}

#generic-form th {
	padding:5px;
	text-align: left;
	font-weight:normal;
}

#generic-form td {
	padding:5px;
}

.pagination {
    text-align: right;
}
.pagination ul,
.pagination ul li {
    list-style: none;
    padding: 0;
    margin: 0;
    display: inline;
}

.pagination ul li {
	padding-left: 5px;
}
.pagination ul li a.current {
    font-weight: bold;
    color: black;
    text-decoration: none;
}

#message {
    font-weight: bold;
    background:#FFFF99;
    padding: 10px;
    margin: 10px;
    text-align: center;
}


#content .featured .featuredLot {
    font-size: 9pt;
    font-weight: bold;
    float: left;
    width: 122px;
    height: 114px;
    overflow: hidden;
    margin: 5px;
    padding: 4px;
    background: #fff;
}
#content .featured .featuredLot .featuredLotName {
    height: 1em;
    padding-bottom: 5px;
    max-height: 1em;
    overflow: hidden;
}
#content .featured .featuredLot .featuredLotImage {
    margin: 0 auto 0 auto;
    padding: 0;
    width: 120px;
}
#content .featured .featuredLot img {
    width: 120px;
    height: 90px;
    margin: 5px auto 0 auto;
    -ms-interpolation-mode: bicubic;
}


/*
 * user_lot
 */
#edit_user_lot table th {
    text-align: left;
}
#edit_user_lot table th,
#edit_user_lot table td {
    padding-bottom: 0.5em;
}

#edit_user_lot table td input,
#edit_user_lot table td label {
    float: left;
}

#edit_user_lot .message {
    background: #ffc;
    border: 1px solid #cc9;
    padding: 0.5em;
    margin: 1em;
    text-align: center;
}

#edit_user_lot .explanation {
    padding: 0.5em;
    margin: 1em;
}

#edit_user_lot .help_text {
	font-size: 0.8em;
	font-style: italic;
}

#edit_user_lot select {
	width:100px;
	height:50px
}


/*
 * Buy Now
 */
.buyNowBoxText {
	padding:3px;
	float:left;
}

.buyNowBox {
	float:left;
	border:1px solid #669933;
	background:#669933 url(../images/bg-login.png) top left repeat-x;
	color:#FFF;
	font: bold 1em/1 Arial,"Helvetica Neue",Helvetica,sans-serif;
	padding:4px 8px 4px 8px;
	text-align: center;
	vertical-align: middle;
}

.buyNowBox a:link {
	text-decoration: none;
	color:#FFF;
}
.buyNowBox a:visited {
	text-decoration: none;
	color:#FFF;
}
.buyNowBox a:active {
	text-decoration: none;
	color:#FFF;
}
.buyNowBox a:hover {
	text-decoration: none;
	color:#FFF;
}

#social_network li {
    float: left;
	list-style: none;
}

#social_network li img {
    float: left;
    margin-right: 0.5em;
}

#social_network li .link {
    margin-top: 8px;
    display: block;
    float: left;
    font-weight: bold;
}

.bidButtons {
	white-space: nowrap;
	float: left;
	width: 180px;
}

.poundBidButtons {
	white-space: nowrap;
	float: left;
}

.buyNowBidButtons {
	white-space: nowrap;
}

.afterBidding {
	clear:right;
}

.auctionlist .itemBidding {
    position: absolute;
    top: 0;
    right: 0;
    max-width: 200px;
}

.bidForm .sealedBid span {
    display: block; /* This makes the sealed bid indicator appear below the bidding area */
}