/*-----------------------------------------------------------------------------
Base Style Sheet

version:   1.0
author:    Adam Myhre
email:     adam@undergalaxie.com
website:   http://www.jeeps4sale.ca/
-----------------------------------------------------------------------------*/

@import "layout.css";
/* =General
-----------------------------------------------------------------------------*/


/* Remove padding and margin */
* {
  margin: 0;
	padding: 0;
}

/* Class for clearing floats */
.clear {
	clear:both;
}


/* Remove border around linked images */
img {
	display: block;
	border: 0;
}

#wrapper-top	{
	background: #b6b6b6 url('../images/bg.jpg') repeat-x top left;
	}

#wrapper-bottom	{
	background-color: #000;
	}

div.box {
	background: #fff url('../images/bg-box.jpg') repeat-x top left;
	margin-bottom: 10px;
	padding: 9px 0 9px 0;
	border: 1px solid #afafaf;
	}
/* =Footer
-----------------------------------------------------------------------------*/
#footer-right p {
	padding: 2px; margin: 0;
	color: #666;
	}
#footer-right ul {
	color: #ddd;
	font-size: .9em;
	padding: 10px 0;
	}
#footer-right ul li {
	padding: 2px;
	}	
#footer-right ul li a:hover {
	color: #ddd;
	}	
#footer-right ul li a {
	color: #fff;
	text-decoration: none;
	}
	
/* =Mini Ads
-----------------------------------------------------------------------------*/
table.advertisment {
	padding: 10px; margin: 0;
	width: 960px;
	font-size: 1.2em;
	}
table.advertisment tr {
	background:url('../images/bg-advertisment.png') no-repeat bottom;
	height: 100px;
	}
table.advertisment tr td {
	padding: 0px;
	}
table.advertisment tr.odd td {
	background:url('../images/bg-row1.jpg') repeat-x top;
}
table.advertisment tr.even td {
	background:url('../images/bg-row2.jpg') repeat-x top;
}

ul.mini-photos li {
	float: left;
	}

td.mini-photo img, ul.mini-photos li img {
	margin: -5px 0 5px;
	background-color: #fff;
	padding: 2px;
	width: 85px;
	height: 70px;
	vertical-align:text-top;
}
td.mini-photo img {
	margin: -5px 0 5px 7px;
}
.sold {
	margin: -5px 0 5px 7px;
	width: 89px;
	height: 74px;
	position: relative;
	padding: 0; overflow: hidden;
	}
.details li {
	padding-bottom: 10px;
	font-weight: bold;
	}
td.mini-photo div.sold img {
	margin: 0;
}
.sold span {
	background: url('../images/sold.png') no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: pointer;
	}

td.mini-price, td.mini-kms {
	text-align: right;
	}
td.mini-logo img {
	padding: 0 10px 0 20px;
	}

table.advertisment tr.details {
	background: none;
	}

table.advertisment tr.spacer {
	height: 20px;
	background: none;
	}

div#large-photo img {
	margin: 10px 32px 0;
	background-color: #fff;
	padding: 2px;
	width: 300px;
	height: 247px;
	float: left;
}

/* =Typography
-----------------------------------------------------------------------------*/
body {
	font: 67.5% Helvetica,"Helvetica Neue","Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
	color: #000;
}

.content p {
	font-size: 1.15em;
	line-height: 1.7em;
	color: #000;
	margin: 10px 32px 0;
	text-align: justify;
}

.content ul {
	font-size: 1.15em;
	color: #000;
	margin: 10px 32px 0;
	list-style: none;
}

.content ol {
	font-size: 1.15em;
	color: #000;
	margin: 10px 42px 0;
	list-style: none;
}

.content ol li {
	padding-bottom: 10px;
}

.error {
	color: #900;
	}

/* =Headings
-----------------------------------------------------------------------------*/
h1 {
	font-size: 1.5em;
	color: #DDD;
	text-shadow: #d9d9d9 0px 1px 1px;
}

h2 {
	font-size: 2.2em;
	color: #000;
	text-shadow: #d9d9d9 0px 1px 1px;
	padding: 30px 32px 0;
}

div.box h2 {
	padding: 10px 32px 0;
}
h3 {
	font-size: 1.5em;
	color: #000;
	text-shadow: #d9d9d9 0px 1px 1px;
	padding: 30px 32px 0;
}
div.box h3 {
	padding: 10px 32px 0;
}


/* =Links
-----------------------------------------------------------------------------*/
a {
	color: #666;
}
a:hover {
	color: #000;
}
.email {
	padding-left: 21px;
	background: url('../images/mail-sm.png') left no-repeat;
	}
/* =Language Selectors
-----------------------------------------------------------------------------*/
/* =Branding
-----------------------------------------------------------------------------*/
/* =Main Nav
-----------------------------------------------------------------------------*/
#navigation a * {
  display: none;
}

#navigation {
  list-style: none;
  padding: 0 1px; margin: 0 10px 0 0;
	float: right;
	background-color: #afafaf;
}

#navigation li {
  float: left;
}
#navigation a,
#navigation a .hover {
  height: 40px;
  position: relative;
  display: block;
  cursor: pointer;
  background: url('/images/nav-sprite.png') 0 0 no-repeat;
}

#navigation a#account {
  background-position: 0 0;
  width: 112px;
}

#navigation .highlight a#account:hover, 
#navigation a#account .hover {
  background-position: 0 -41px;
  width: 112px;
}

#navigation a#login {
  background-position: -112px 0;
  width: 74px;
}

#navigation .highlight a#login:hover, 
#navigation a#login .hover {
  background-position: -112px -41px;
  width: 74px;
}

#navigation a#logout {
  background-position: -186px 0;
  width: 84px;
}

#navigation .highlight a#logout:hover, 
#navigation a#logout .hover {
  background-position: -186px -41px;
  width: 84px;
}

#navigation a#place {
  background-position: -270px 0;
  width: 111px;
}

#navigation .highlight a#place:hover, 
#navigation a#place .hover {
  background-position: -270px -41px;
  width: 111px;
}

#navigation a#browse {
  background-position: -381px 0;
  width: 120px;
}

#navigation .highlight a#browse:hover, 
#navigation a#browse .hover {
  background-position: -381px -41px;
  width: 120px;
}

#navigation a#accessories {
  background-position: -501px 0;
  width: 154px;
}

#navigation .highlight a#accessories:hover, 
#navigation a#accessories .hover {
  background-position: -501px -41px;
  width: 154px;
}

#navigation a#financing {
  background-position: -655px 0;
  width: 166px;
}

#navigation .highlight a#financing:hover, 
#navigation a#financing .hover {
  background-position: -655px -41px;
  width: 166px;
}

#navigation a#contact {
  background-position: -821px 0;
  width: 88px;
}

#navigation .highlight a#contact:hover, 
#navigation a#contact .hover {
  background-position: -821px -41px;
  width: 88px;
}

/* =Sub Nav
-----------------------------------------------------------------------------*/
/* =Search Box and Ads/Logo
-----------------------------------------------------------------------------*/
/* =Main Content */
/*---------------------------------------------------------------------------*/
#mainContent {
	padding-bottom: 20px;
	}
/* =Secondary Content
-----------------------------------------------------------------------------*/
/* =Footer
-----------------------------------------------------------------------------*/
/* =Forms
-----------------------------------------------------------------------------*/

div.searchbox form {
	margin: 20px 0;
	}
form p {
	text-align: left;
	}
label {
	display: block;
	float: left;
	width: 100px;
	text-align: left;
	}
.searchbox {
	text-align: right;
}
.searchbox p {
	margin: 0; padding: 0;
	}
.small {
	width: 313px;
	}
.searchbox input {
	float: right;
}
label {
	display: block;
	float: left;
	text-align: left;
	padding-right: 10px;
	}
select {
	font: 1em "Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
	padding: 4px 2px;
	border: 1px solid #a09e9f;	
	background: #fff url('/images/bg-search.jpg') repeat top;
	}
textarea {
	font: 1em "Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
	width: 605px;
	padding: 5px;
	border: 1px solid #a09e9f;	
	background: #fff url('/images/bg-search.jpg') repeat top;
	}
input[type="text"], input[type="password"] {
	font: 1em "Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
	width: 190px;
	padding: 5px;
	height: 16px;
	border: 1px solid #a09e9f;	
	background: #fff url('/images/bg-search.jpg') repeat top;
	}
input[type="checkbox"] {
	margin-right: 10px;
	background: #fff url('/images/bg-search.jpg') repeat top;
	}
input.long {
	width: 300px;
}
input.med {
	width: 190px;
}
input.short {
	width: 100px;
}
input.vshort {
	width: 40px;
}
.searchbox input[type="text"] {
	width: 190px;
	margin-right: 10px;
	}
.newsletter input[type="text"] {
	width: 170px;
	margin-bottom: 10px;
	}
input[type="image"] {
  height: 27px;
  width: 88px;
  padding: 0;
  position: relative;
  display: block;
  cursor: pointer;
  background: url('/images/small-sprite.png') 0 0 no-repeat;
	clear: both;
}
input[type="image"]:hover {
  background-position: 0 -27px;
  width: 88px;
}
span#alert-box1, span#alert-box2 {
	padding-left: 20px;
	width: 200px;
	color: #000;
}
span.alert {
	background: url('/images/cross.png') no-repeat left bottom;
	margin-left: 10px;
}
span.boxok {
	background: url('/images/tick.png') no-repeat left bottom;
	margin-left: 10px;
}
#price, #kms {
	text-align:right;
}

/* =Tables
-----------------------------------------------------------------------------*/
/* =Misc 1
-----------------------------------------------------------------------------*/
ul.photos {
	padding: 10px 32px 10px 27px;
	list-style: none;

}

ul.photos li {
	float: left;
	padding: 0 10px 0 0;
}

ul.photos img {
	border: 5px solid #fff;
	width: 85px;
	height: 70px;
	}
/* =Misc 2
-----------------------------------------------------------------------------*/
#program-selector {
	background: url('../images/pricing.jpg') no-repeat bottom;
	height: 154px;
	margin: 20px 10px 0 10px;
  padding: 0;
  list-style: none;
	}
#program-selector li.link {
	float: left;
	margin: 91px 205px 0 20px;
	width: 88px;
	height: 27px;
}

#program-selector img {
  height: 27px;
  width: 88px;
  padding: 0;
  position: relative;
  display: block;
  cursor: pointer;
  background: url(../images/small-sprite.png) 0 0 no-repeat;
}
#program-selector img:hover {
  background-position: 0 -27px;
  width: 88px;
}

#edit-menu {
  list-style: none;
	}
#edit-menu li.link {
	float: left;
	margin: 0 20px 0 0;
	width: 88px;
	height: 27px;
}

#edit-menu img {
  height: 27px;
  width: 88px;
  padding: 0;
  position: relative;
  display: block;
  cursor: pointer;
  background: url(../images/small-sprite.png) 0 0 no-repeat;
}
#edit-menu img:hover {
  background-position: 0 -27px;
  width: 88px;
}
/* Image Replacement
-----------------------------------------------------------------------------*/
#title {
	width: 940px;
	height: 105px;
	position: relative;
	margin: 0; padding: 0; overflow: hidden;
	}
#title span {
	background: url('/images/logo.png') no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: pointer;
	}


/* Tooltips
-----------------------------------------------------------------------------*/