@charset "utf-8";
/* CSS Document */


body, button
{
	margin:0;
	padding:0;
}

img
{
	border:none;
}

body
{
	font-family: Helvetica, Arial, sans-serif;
	font-size:12px;
}

.ui-page, body
{
	background:url(../img/backgroundGradient.jpg) top center no-repeat #003a71;
	background-size:100% auto;
}

#header
{
	background-color:#fff;
	height:80px;
	width:100%;
	-moz-box-shadow: 0px 2px 2px rgba(0,0,102,0.75);
	-webkit-box-shadow: 0px 2px 2px rgba(0,0,102,0.75);
	box-shadow: 0px 2px 2px rgba(0,0,102,0.75) #006;
}

.container
{
	margin:0 auto;
	max-width:1345px;
}

#headerInner
{
	padding:10px 0;
	position:relative;
}

img #metroLogo
{
	position:absolute;
	left:0;
}

#notices
{
	height:44px;
	position:absolute;
	left:45%;
	top:0;
	width:44px;
}

#notices a:link, #notices a:visited
{
	background:url(../img/metro-icons.png) -44px -176px no-repeat;
	display:block;
	height:44px;
	overflow:visible;
	text-indent:-9999em;
	width:44px;
}

#notices a:hover, #notices a:active, #notices a.newNotice
{
	background:url(../img/metro-icons.png) -88px -176px no-repeat;
}

#noticeInner
{
	background-color:#489ef0;
	color:#fff;
	padding:10px;
	position:absolute;
	width:300px;
	-webkit-transition: all 500ms cubic-bezier(.37,.02,.43,.89);  
    -moz-transition: all 500ms cubic-bezier(.37,.02,.43,.89);  
    -o-transition: all 500ms cubic-bezier(.37,.02,.43,.89);  
    -ms-transition: all 500ms cubic-bezier(.37,.02,.43,.89);  
    transition: all 500ms cubic-bezier(.37,.02,.43,.89);
}

#noticeInner.hide
{
	opacity:0;
}

#noticeInner p
{
	margin:0 0 44px 0;
	z-index:3;
}

#noticeInner a.close:link, #noticeInner a.close:visited
{
	background:url(../img/metro-icons.png) -132px -176px no-repeat;
	bottom:0;
	display:block;
	height:44px;
	position:absolute;
	right:0;
	text-indent:-9999em;
	width:44px;
}

#noticeInner a.close:hover, #noticeInner a.close:visited
{
	background:url(../img/metro-icons.png) -176px -176px no-repeat;
}

#topNav
{
	position:absolute;
	right:0;
	top:-1px;
}

#topNav ul
{
	list-style:none;
	margin:0;
	padding:0;
}

#topNav li
{
	float:left;
	height:50px;
}

#topNav li a:link, #topNav li a:visited
{
	background-color:#489ef0;
	color:#fff;
	display:block;
	line-height:50px;
	padding:0 10px;
	text-decoration:none;
	-webkit-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -moz-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -o-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -ms-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    transition: all 300ms cubic-bezier(.37,.02,.43,.89);
}

#topNav li a:hover, #topNav li a.active:hover { background-color:#2a7bc9; }
#topNav li a:active, #topNav li a.active { background-color:#0055a5; }

/****************************
Filters *******************/

#filtersWrapper
{
	background-color:#393938;
	color:#999;
	min-height:44px;
	-moz-box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.3);
	box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.3);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#484848), to(#282b2e));
	background: -webkit-linear-gradient(top, #484848, #282b2e);
	background: -moz-linear-gradient(top, #484848, #282b2e);
	background: -ms-linear-gradient(top, #484848, #282b2e);
	background: -o-linear-gradient(top, #484848, #282b2e);
}

#filterToggle
{
	height:44px;
}

#filterToggle a:link, #filterToggle a:visited
{
	background:url(../img/metro-icons.png) -264px 0px no-repeat;
	color:#999;
	display:inline-block;
	height:44px;
	line-height:44px;
	padding:0 0 0 50px;
	text-decoration:none;
}

#filterToggle a.hidden:link, #filterToggle a.hidden:visited
{
	background:url(../img/metro-icons.png) -264px -44px no-repeat;
}

#filterSearch
{
	
}

#filtersInner
{
	border-bottom:1px solid #181818;
	max-height:100px;
	min-width:1024px;
	overflow:hidden;
	padding:0 0 10px 0;
	-webkit-transition: all 500ms cubic-bezier(.37,.02,.43,.89);  
    -moz-transition: all 500ms cubic-bezier(.37,.02,.43,.89);  
    -o-transition: all 500ms cubic-bezier(.37,.02,.43,.89);  
    -ms-transition: all 500ms cubic-bezier(.37,.02,.43,.89);  
    transition: all 500ms cubic-bezier(.37,.02,.43,.89);
}

#filtersInner.hide
{
	max-height:0px;
	padding:0;
}

.filterGroup, .filterGroup-dd
{
	display:inline-block;
	margin:0 15px 0 0;
}

.filterGroup:last-of-type { margin:0; }

.filterGroup h2, .filterGroup-dd h2
{
	font-size:14px;
	font-weight:bold;
	margin:10px 0 10px 0;
	padding:0;
}

.filterGroup ul, #bulkActionsBtns ul
{
	list-style:none;
	margin:0;
	padding:0;
}

.filterGroup li, #bulkActionsBtns li
{
	display:inline-block;
	line-height:44px;
}

.filterGroup a:link, .filterGroup a:visited, #bulkActionsBtns a:link, #bulkActionsBtns a:visited
{
	border-right:1px solid #525252;
	display:inline-block;
	color:#999;
	height:44px;
	line-height:44px;
	padding:0 5px;
	text-align:center;
	text-decoration:none;
	min-width:30px;
	-webkit-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -moz-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -o-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -ms-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    transition: all 300ms cubic-bezier(.37,.02,.43,.89);
}

.filterGroup a:hover, .filterGroup a:active, .filterGroup a.active, #bulkActionsBtns a:hover, #bulkActionsBtns a:active
{
	background-color:rgba(0,0,0,.4);
}

.filterGroup select
{
	color:#999;
    background-color: rgba(0, 0, 0, 0.4);
    border: medium none;
    height: 44px;
	padding:5px;
    vertical-align: middle;
	width:85px;
	-webkit-appearance: none;
}

.filterGroup#carFilter select
{
	width:auto;
}

.filterGroup option
{
	background-color:#333;
	border:none;
}

.filterGroup.status a:before
{
	background:url(../img/metro-icons.png) 0 0 no-repeat;
	content:"";
	display:block;
	float:left;
	height:44px;
	width:44px;
}

.filterGroup.status a.statusAny.active:before
{
	background:url(../img/metro-icons.png) 0 -44px no-repeat;
}

.filterGroup.status a.statusUnpublished:before
{
	background:url(../img/metro-icons.png) -264px -88px no-repeat;
}

.filterGroup.status a.statusUnpublished.active:before
{
	background:url(../img/metro-icons.png) -264px -132px no-repeat;
}

.filterGroup.status a.statusAvailable:before
{
	background:url(../img/metro-icons.png) -44px 0 no-repeat;
}

.filterGroup.status a.statusAvailable.active:before
{
	background:url(../img/metro-icons.png) -44px -44px no-repeat;
}

.filterGroup.status a.statusReserved:before
{
	background:url(../img/metro-icons.png) -88px 0 no-repeat;
}

.filterGroup.status a.statusReserved.active:before
{
	background:url(../img/metro-icons.png) -88px -44px no-repeat;
}

.filterGroup.status a.statusUnconditional:before
{
	background:url(../img/metro-icons.png) -132px 0 no-repeat;
}

.filterGroup.status a.statusUnconditional.active:before
{
	background:url(../img/metro-icons.png) -132px -44px no-repeat;
}

.filterGroup.status a.statusSettled:before
{
	background:url(../img/metro-icons.png) -176px 0 no-repeat;
}

.filterGroup.status a.statusSettled.active:before
{
	background:url(../img/metro-icons.png) -176px -44px no-repeat;
}


/*************************
Bulk Actions ************/

#bulkActions
{
	border-top:1px solid #5f5f5f;
	padding:10px 0;
	position:relative;
}


#bulkActions h2
{
	border-right:1px solid #181818;
	float:left;
	font-size:14px;
	height:44px;
	line-height:44px;
	margin:0;
	padding:0 10px 0 0;
}

#bulkActionsBtns
{
	padding: 10px 0;
	position:absolute;
	right:0;
	top:0;
}

#bulkActionsBtns a:link
{
	border-right:none;
}

/**********************
Table ******************/

.table 
{
	border-collapse:collapse;
	width:100%;
}

.table th
{
	background-color:rgba(0,51,100,0.8);
	border:none;
	border-right:1px solid rgba(85,145,200,0.1);
	line-height:44px;
	padding:0 10px;
	text-shadow:none;
}

.table th .colHead-button
{
	background:url(../img/tableHeadArrows.png) center top no-repeat;
	border:none;
	color:#7ebbf5;
	cursor:pointer;
	font-weight:bold;
	height:44px;
	text-align:center;
	width:100%;
}

.table th .colHead-button.sortAsc { background:url(../img/tableHeadArrows.png) center -44px no-repeat; }

.table th .colHead-button.sortDsc { background:url(../img/tableHeadArrows.png) center bottom no-repeat; }

.table td {
	border-top:1px solid rgba(0,51,100,0.1);
	color:#fff;
	text-align:center;
	text-shadow:none;
    vertical-align:middle;
}

td.left, th.left { text-align:left; }
td.center, th.center { text-align:center; }
.table td.center-nopad, .table th.center-nopad { text-align:center; padding:0; }

.table tr td
{
	background:rgba(255,255,255,0.2);
	padding:0 10px;
	-webkit-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -moz-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -o-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -ms-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    transition: all 300ms cubic-bezier(.37,.02,.43,.89); 
}

.table-hover tbody th:hover
{
	background-color: rgba(0,58,113,0.2);
}

.table-hover tbody tr:hover>td {
	background-color: rgba(0,58,113,0.2);
}

span.lotNum
{
	padding:0 0 0 5px;
}

button
{
	border:none;
	cursor:pointer;
	height:44px;
	width:44px;
	margin:0;
}

button.plusBtn
{
	background:url(../img/metro-icons.png) -176px -132px no-repeat;
}

button.flagBtn
{
	background:url(../img/metro-icons.png) 0 -176px no-repeat;
}

button.minusBtn
{
	background:url(../img/metro-icons.png) -132px -132px no-repeat;
}

button.waiting
{
	background:url(../img/waiting.gif) top left no-repeat;
}

button.editBtn
{
	background:url(../img/metro-icons.png) -88px -132px no-repeat;
}

input[type="checkbox"] {
    display:none;
}
input[type="checkbox"] + label span {
    display:inline-block;
    width:44px;
    height:44px;
    margin:-1px 4px 0 0;
    vertical-align:middle;
    background:url(../img/metro-icons.png) -132px -88px no-repeat;
    cursor:pointer;
}
input[type="checkbox"]:checked + label span {
    background:url(../img/metro-icons.png) -176px -88px no-repeat;
}

div.statusIcon
{
	height:44px;
	width:44px;
	margin:auto;
}

div.statusIcon span
{
	display:none;
}

.available { background:url(../img/metro-icons.png) -44px -44px no-repeat; }
.reserved { background:url(../img/metro-icons.png) -88px -44px no-repeat; }
.unconditional { background:url(../img/metro-icons.png) -132px -44px no-repeat; }
.settled { background:url(../img/metro-icons.png) -176px -44px no-repeat; }
.unpublished { background:url(../img/metro-icons.png) 0px -88px no-repeat; }

.flyerY { background:url(../img/metro-icons.png) -44px -132px no-repeat; }
.flyerN { background:url(../img/metro-icons.png) -220px -132px no-repeat; }



/*****************
Reserve ***********/

.table td.reserveRow
{
	border-top:none;
}

.reserve
{
	background-color:rgb(10,66,120);
	color:#91c1e8;
	max-height:800px;
	margin:0 -10px;
	overflow:hidden;
	padding:30px 0;
	text-align:left;
	-webkit-box-shadow: inset 0px 0px 12px -3px black;
	-moz-box-shadow: inset 0px 0px 12px -3px black;
	box-shadow: inset 0px 0px 12px -3px black;
	-webkit-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -moz-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -o-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    -ms-transition: all 300ms cubic-bezier(.37,.02,.43,.89);  
    transition: all 300ms cubic-bezier(.37,.02,.43,.89); 
}

.hideReserve
{
	max-height:0px;
	padding:0;
}

.reserve .loading
{
	text-align:center;
	max-height:0px;
}

.showLoading
{
	max-height:24px;
}

.reserve h2, .loading h2
{
	font-weight:normal;
	font-size:18px;
	line-height:18px;
	margin:0 0 20px 0;
	padding:0;
}

.reserve .container
{
	max-width:772px;
}

.reserve .icons
{
	display:block;
	height:100%;
	padding:0 20px 0 0;
	width:110px;
}

.reserve .form
{
	border-left:1px solid #336a9e;
	border-right:1px solid #336a9e;
	padding:0 20px;
	width:440px;
}


.reserve .form input, #loginForm input, #alertBox input
{
	background-color:#002b55;
	border:none;
	color:#6aa3db;
	font-size:16px;
	height:44px;
	margin:0 0 1px 0;
	padding:0 10px;
	width:420px;
}

.reserve .form select.state
{
	background-color: #002b55;
	border: 0;
	color: #6aa3db;
	height: 44px;
	margin-right: 1px;
	width: 219px;
}

#state
{
	float:left;
	margin-right: 1px;
	width:219px;
}

#state label
{
	float:left;
	font-size:16px;
	margin-top:14px;
	width:50px;
}

#id_state
{
	background-color: #002b55;
	border: 0;
	color: #6aa3db;
	height: 44px;
	width: 169px;
    float:left;
}

.reserve .form input.postcode{ width:200px; }

::-webkit-input-placeholder {
   color:#6aa3db;
   font-style:italic;
}

:-moz-placeholder { /* Firefox 18- */
   color:#6aa3db; 
   font-style:italic;
}

::-moz-placeholder {  /* Firefox 19+ */
   color:#6aa3db;
   font-style:italic;  
}

:-ms-input-placeholder {  
   color:#6aa3db;  
   font-style:italic;
}

.reserve .form input.submitBtn, #loginForm input.submitBtn, #alertBox input {
	background-color: #336a9f;
	color:#fff;
	cursor:pointer;
	float:right;
	padding: 0 20px;
	width: auto;
	margin: 1px 0 0 0;
}

.reserve .form input.submitBtn:hover, #loginForm input.submitBtn:hover, #alertBox input:hover
{
	background-color:#002b55;
}

.reserve .form input.submitBtn.inactive
{
	background-color:#999;
	color:#CCC;
	cursor:default;
}

.reserve .pdfs
{
	border-bottom:1px solid #336a9e;
	width:160px;
}

a.pdfIcons:link, a.pdfIcons:visited
{
	border-top:1px solid #336a9e;
	color:#91c1e8;
	display:block;
	height:44px;
	line-height:44px;
	text-decoration:none;
	width:160px;
}

/*a.pdfIcons.contract { display:none; }*/

a.pdfIcons:hover { background-color:#002b55; }

a.pdfIcons span
{
	display:inline-block;
	height:44px;
	vertical-align:middle;
	width:44px;
}

span.flyer { background:url(../img/metro-icons.png) -44px -132px no-repeat; }
span.contract { background:url(../img/metro-icons.png) 0px -132px no-repeat; }

/******************
Login form ****************/

#loginForm
{
	background-color:rgba(255,255,255,0.4);
	margin:10% auto 0 auto;
	padding:50px;
	width:420px;
}

/******************************
Alert box *********************/

#alertBox
{
	background-color:rgb(10,66,120);
	color: #91c1e8;
	left:50%;
	margin-left:-225px;
	position:fixed;
	top:30%;
	width:450px;
	z-index:100;
	display:none;
}

#alertBox h2
{
	background-color:#489ef0;
	color:#fff;
	font-size:18px;
	line-height:18px;
	margin:0;
	padding:20px;
}

#alertBox p
{
	padding:20px;
}

#alertBox input
{
	margin:0 1px 1px 0;
}

/***** end Alert Box ***********/

#copyright, #printedOn
{
	color:#60a7eb;
	margin:20px 0 0 0;
	text-align:center;
	width:100%;
}

#printedOn
{
	display:none;
}

p.error
{
	background-color:#ed1c24;
	border:2px solid #790000;
	color: #fff;
	clear:left;
	padding: 10px;
}

/******************
Utils ****************/

.floatLeft { float:left; }
.floatRight { float:right; }

.clearfix {
  *zoom: 1;
}

.clearfix:before,
.clearfix:after {
  display: table;
  line-height: 0;
  content: "";
}

.clearfix:after {
  clear: both;
}

div.fixer {
    clear: both;
	height: 500px;
    width: 100%;
	overflow: auto;

}

/* experimental fixed header taken from http://www.imaputz.com/cssStuff/bigFourVersion.html
    use Firebug to add class='fixer' to div#stockList
*/
div.fixer table {width: 100%;}
div.fixer tr {width: 100%}
div.fixer thead {
    display: block;
    background-color: #ffffff;
    width: 100%;
}


div.fixer tbody {
    display: block;
    height:400px;
    overflow: auto;
}