@charset "utf-8";
* {
margin: 0;
padding: 0;
list-style: none;
}
a img {
border: none;
}
a {
color: #fff;
text-decoration: none
}
a:hover {
text-decoration: underline;
}

body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 16px;
color: #FFFFFF;
background-color: #000033;
}
.clear {
display: block;
clear: both;
float: none;
}
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
p {
font-size: 80%;
}
#wrapper {
width: 988px;
min-height: 700px;
margin: 0 auto;
padding: 0 0 10px 0;
}

#header {
position: relative;
height: 85px;

}
#logo {
position: absolute;
top: 5px;
left: 0;
}

#mainnav {
display: block;
margin: 0 auto;
height: 37px;
width: 28.5em;
}

#mainnav li {
float: left;
font-size: 0.85em;
text-align: center;
line-height: 17px;
border-right: 1px solid #003;
}

#mainnav li a {
color: #003;
padding: 10px 14px;
display: block;
height: 17px;
background-color: #fff;
text-decoration: none;
}
#mainnav li a:hover, #about #mainnav li.about a, #services #mainnav li.services a, #work #mainnav li.work a {
background: #ccc;
text-decoration: none;
}

#mainnav li.home a {
background: #fff url('../i/bg/mainnav-bg-left.gif') no-repeat top left;
}
#mainnav li.prices a {
background: #fff url('../i/bg/mainnav-bg-right.gif') no-repeat top right;
}
#mainnav li.home a:hover, #home #mainnav li.home a {
background: #ccc url('../i/bg/mainnav-bg-left-selected.gif') no-repeat top left;
}
#mainnav li.prices a:hover, #prices #mainnav li.prices a {
background: #ccc url('../i/bg/mainnav-bg-right-selected.gif') no-repeat top right;
}



#header h2 {
font-size: 100%;
color: #fff;
text-align: right;
display: block;
clear: both;
margin-bottom: 20px;
padding-top:10px;
}

#main {
border: 4px solid #fff;
background: #fff;
min-height: 450px;
}
h1 {
font-size: 115%;

}

#carousel {
height: 459px;
background: url('../i/car/c1.jpg') no-repeat center;
position: relative;
z-index: 1;
}

/*
#carousel 
*/
.overlay {
position: absolute;
top: 0;
right: 0;
z-index: 2;
width: 289px;
display: block;
}
/*#carousel .overlay h1, #carousel .overlay p {
padding: 10px 10px 0 10px;
}
*/
/*
#carousel
*/
 .overlay h1 {
margin-bottom: 10px;
}
/*
#carousel
*/
 .overlayBg {
background: url('../i/bg/overlaybg.png') repeat-y top right;
height: auto;
padding: 10px;
}
.feat-btn {
background: url('../i/bg/feat-btn-bg-wht.gif') no-repeat center;
width: 284px;
height: 116px;
overflow: hidden;
margin: -40px 20px 10px 25px;
float: left;
position: relative;
z-index: 3;
}
.feat-btn .btn {
height: 108px;
width: 276px;
margin: 4px auto;

}
.feat-btn .btn a.icon {
display: block;
clear: both;
cursor: pointer;
height: 82px;
width: 276px;
position: relative;
z-index: 4;
margin-bottom: -1px;
}
.feat-btn .btn a.icon img {
position: absolute;
bottom: 0;
left: 0;
z-index: 5;
}

.feat-btn #btn1 {
background: url('../i/bg/feat-btn-1.jpg') no-repeat center;
}
.feat-btn #btn2 {
background: url('../i/bg/feat-btn-2.jpg') no-repeat center;
}
.feat-btn #btn3 {
background: url('../i/bg/feat-btn-3.jpg') no-repeat center;
}

.feat-btn .btn-text {
background: url('../i/bg/btn-txt.png') no-repeat bottom left;
height: 27px;
width: 251px;
display: block;
line-height: 27px;
font-weight: bold;
color: #ccc;
font-size: 0.85em;
text-decoration: none;
padding-left: 25px;
/*position: absolute;
bottom: 0;
left: 0;
*/
}

.floatLeft {
float: left;
margin-right: 5px;
color: #003;
}
#mainContent {
float: right;
width: 610px;
color: #003;
}
#mainContent h1 {
margin: 5px 0 0 0;
color: #999;
font-size: 2.2em;
}
#mainContent h2 {
margin: 0 0 10px 30px;
font-weight: normal;
font-size: 2em;
}
#mainContent h3 {
color: #999;
font-size: 2.2em;
margin-top: 10px;
}
#mainContent p {
color: #333;
padding: 0 5px 0 30px;
margin: 0 0 10px 0;
}
#mainContent form {
display: block;
width: 300px;
margin: 5px auto;
text-align: right;
}
#mainContent form label {
display: block;
clear: both;
margin: 8px 0;
font-size: 0.8em;
font-weight: bold;
}
#mainContent form input {
width: 220px;
padding: 2px;
}
#mainContent form input:focus {
background: #FFFF99;
}
#mainContent form span {
clear: both;
text-align: left;
padding-left: 19px;
display: block;
}
#mainContent form textarea {
width: 280px;
height: 130px;
margin: 5px 0 0 20px;
}
#mainContent form textarea:focus {
background: #FFFF99;
}

#footer  {
color: #999;
padding: 15px 0;
margin-top: 10px;
}
#footer .ftr-txt {
width: 550px;
float: left;
}
#footer p {
line-height: 1.4em;
font-size: 0.7em;
}

#footer ul {
float: right;
display: block;
width: 18em;
padding-top: 1em;
}
#footer ul li {
float: left;
padding: 0 5px 2px 5px;
text-align: center;
height: 1em;
font-size: 0.70em;
/*text-transform: uppercase;*/
border-right: 1px solid #999;

}
#footer ul li.last {
border: none;
}
#mainContent p a {
color: #333;
font-weight: bold;
}
/* Projects page - Recent Work */
#projects {
height: 459px;
background: url('../i/car/c3.jpg') no-repeat center;
position: relative;
z-index: 1;
}
#projects .overlay {
position: absolute;
top: 0;
right: 0;
z-index: 2;
width: 289px;
display: block;
}
#projects .overlay h2, #projects .overlay p {
margin: 0 0 10px 0;
line-height: 1.2em;
}
#projects .overlayBg {
background: url('../i/bg/overlaybg.png') repeat-y top right;
height: 439px;
padding: 5px 10px 15px 10px;
overflow: visible;
}
#projects h1 {
font-size: 1.20em;
margin:0;
}
#projects h2 {
font-size: 0.85em;
color: #CCCCCC;
}
#projects .overlayBg ol {
padding-left: 30px;
margin: 10px 0;
}
#projects .overlayBg ol li  {
font-size: 0.75em;
list-style: square;
}

#projects .subNav {
float: left;
}
#projects .subNav li {
float: left;
height: 459px;
width: 26px;
display: block;
border-right: 1px solid #fff;
}
#projects .subNav li span {
display: none;
}
#projects .subNav li a {
height: 459px;
width: 26px;
display: block;
background: #7070a7 no-repeat left bottom;
}

#projects .subNav li#limore a {
background: #7070a7 url(../i/nav/more.png) no-repeat 50% 99%;
}
#projects.project-more .subNav li#limore a, #projects .subNav li#limore a:hover {
background: #003 url(../i/nav/project-more-selected.jpg) no-repeat left bottom;
}

#projects .subNav li#li2 a {
background: #7070a7 url(../i/nav/project-2.png) no-repeat center bottom;
}
#projects.project-2 .subNav li#li2 a, #projects .subNav li#li2 a:hover {
background: #003 url(../i/nav/project-2-selected.jpg) no-repeat left bottom;
}

#projects .subNav li#li1 a {
background: #7070a7 url(../i/nav/project-theride.png) no-repeat center bottom;
}
#projects.project-1 .subNav li#li1 a, #projects .subNav li#li1 a:hover {
background: #003 url(../i/nav/project-ride-selected.jpg) no-repeat left bottom;
}

#projects.project-1 {
background: url(../i/car/c1.jpg);
}
#projects.project-2 {
background: url(../i/car/c8.jpg);
}
#projects.project-more {
background: url(../i/car/c3.jpg);
}
#projects.project-3 {
height: 459px;
background: url('../i/car/c2.jpg') no-repeat center;
position: relative;
z-index: 1;
}
#projects.project-4 {
background: url(../i/car/c7.jpg);
}


#projects #gallery {
width: 620px;
float: left;
margin: 0 0 0 20px;
padding: 10px;
display: none;
}
#projects #gallery h2 {
color: #fff;
padding: 3px 5px;
margin-bottom: 10px;
background: url('../i/bg/overlaybg.png') repeat left top;
}

/* External links */
a[href^="http:"] {
	background:url(../i/ico/icon-external-link.gif) no-repeat right top;
	padding-right:14px;
}

a[href^="http://www.xpert-renovations.co.uk"] {
	background-image: none;
	padding-right: 0;
}
.vcard a[href^="http:"] {
padding-right: 0;
background-image: none;
color: #000;
}
.vcard em {
position: absolute;
left: -3000px;

}
.vcard a {
color: #000;
}
.preload {
display: none;
}

/* Services */
#services #mainContent h2 {
display: block;
width: auto;
clear: both;
padding-top: 20px;
}

.servicelist {
display: block;
width: 150px;
float: left;
padding-left: 40px;
}
.servicelist li {
font-size: 0.85em;
line-height: 1.4em;
color: #666;
list-style: outside disc;
}
.servicelist li ul {
padding-left: 20px;
}

.servicelist li ul li {
font-size: 1em;
list-style-type: circle;
line-height: 1.2em;
}

.closebutton {
border:1px solid #CCCCCC;
color:#CCCCCC;
float:right;
font-size:0.5em;
font-weight:bold;
margin-right:5px;
margin-top:-29px;
padding:2px 4px;

}
.overlay .closebutton {
margin-top: -15px;
}
.overlay li a {
color: #ccc;
}
.overlay li a:visited {
/* color: #999; */
color: #fff;
}
.overlay li, .overlay li strong a, .overlay li a strong {
color: #fff;
}

#projects .overlay p.button {
	margin: 0;
}
.overlay .button a {
padding: 4px 2px;
border: 1px solid #fff;
margin: 5px auto;
float: none;
display: block;
clear: both;
text-align: center;


}
.overlay .button a:hover {
background: #fff;
color: #333;
text-decoration:none;
}
.overlay .button a:active {
background: #fff;
color: #FF0000;
text-decoration:none;
}

/* contact page */
#contact h1 {
margin-bottom: 10px;
}

#main {
	position: relative;
}
.overlay {

	z-index: 99;
}