/* RESET by Eric Meyer */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {outline: 0;}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {list-style: none;}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
/*Remove button padding in FF*/
input::-moz-focus-inner {
border: 0;
padding: 0;
}
/* general */
html * {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
min-width: 420px;
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
-ms-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
a {
color: #000;
text-decoration: none;
}
/* page */
.wrap {
max-width: 980px;
margin: 0 auto;
position: relative;
header {
.dealer-logo {
border: solid 1px #d9e2ea;
margin: 10px 0 10px 0;
padding: 7px;
}
.dealer-info {
left: 130px;
position: absolute;
top: 10px;
h2 {
font-size: 17px;
font-weight: 600;
text-transform: uppercase;
}
p {
line-height: 18px;
}
}
}
.category, .sort {
background: #efefef;
height: 40px;
margin-top: 10px;
width: 100%;
p {padding: 5px;}
a:link, a:visited {
padding: 5px;
text-decoration: underline;
}
a:hover {
color: #09f;
text-decoration: none;
}
a.cur_ {
color: #999;
cursor: text;
text-decoration: none;
}
}
.sort {
background: #fff;
p {font-size: 11px;}
}
.pager {
.pager__title {
border-bottom: solid 3px #09f;
font-size: 16px;
font-weight: 600;
padding: 5px 0;
}
.pager__description {
padding: 10px 0;
.pager__left {
border: solid 1px #b3b3b3;
clear: right;
display: inline-block;
max-width: 110px;
padding: 5px;
text-align: center;
}
.pager__right {
display: inline-block;
margin-left: 400px;
p {
border: solid 1px #ddd;
display: inline-block;
color: #ccc;
padding: 5px;
text-align: center;
&:first-child, &:last-child {
width: 60px;
}
&:nth-child(2) {width: 11px;}
}
}
}
}
.vehicle {
border-top: solid 1px #09f;
height: 140px;
margin-bottom: 10px;
position: relative;
width: 680px;
a:link {display: inline-block;}
.vehicle__preview {
position: absolute;
left: 0;
top: 10px;
img {
border: solid 1px #d9e2ea;
padding: 5px;
&:hover {border-color: #09f;}
}
}
.vehicle__title {
font-size: 15px;
font-weight: 600;
overflow: hidden;
position: absolute;
top: 10px;
left: 160px;
text-overflow: ellipsis;
white-space: nowrap;
width: 190px;
}
.vehicle__price {
color: red;
font-size: 16px;
font-weight: 600;
position: absolute;
top: 10px;
left: 400px;
}
.vehicle__description-short {
position: absolute;
top: 50px;
left: 160px;
}
.vehicle__description-long {
position: absolute;
top: 80px;
left: 160px;
}
.vehicle__description-link {
text-decoration: underline;
position: absolute;
bottom: 5px;
left: 0;
}
.vehicle__logo {
position: absolute;
top: 10px;
right: 0;
img {
border: solid 1px #d9e2ea;
padding: 5px;
&:hover {border-color: #09f;}
}
}
}
footer {
border-top: solid 1px #09f;
color: #999;
font-size: 13px;
margin-top: 20px;
text-align: right;
p {
padding: 5px;
}
}
}
/* item */
.vehicle-write-up {
font-size: 11px;
width: 680px;
.vehicle-write-up__title {
border-bottom: solid 3px #09f;
font-size: 14px;
font-weight: bold;
padding: 5px 0;
}
.vehicle-write-up__images {
background: #efefef;
display: inline-block;
margin-top: 10px;
width: 286px;
img {margin: 3px;}
}
.vehicle-write-up__description {
display: inline-block;
float: right;
margin-top: 10px;
margin-right: 70px;
width: 300px;
> p {
font-size: 16px;
font-weight: bold;
margin-bottom: 20px;
}
table {
tr {
td {
border: solid 2px transparent;
border-right: solid 5px transparent;
.vehicle-write-up__price {
font-size: 20px;
}
}
}
}
.vehicle-write-up__date {
background: #eaeaea;
margin-top: 60px;
width: 100%;
p {
padding: 10px;
}
}
}
.vehicle-write-up__features, .vehicle-write-up__add, .vehicle-write-up__contact {
> p {
border-bottom: solid 1px #999;
font-size: 16px;
font-weight: bold;
margin-bottom: 20px;
padding: 10px 0;
}
table {
tr {
td {
border: solid 2px transparent;
border-right: solid 100px transparent;
}
}
}
}
}