/* ==|== Main styles =====================================================
   Author: Paul Jansen - www.jantsdesign.co.uk
   ========================================================================== */


/* ==========================================================================
   GENERIC
   ========================================================================== */
h1{
	font-size:1.3em;
	margin-top:0;
}
.green{
	color:#4d4c4c;
	font-weight:bold;
	font-size:1.2em;
}
/* ==========================================================================
   HEADER
   ========================================================================== */
header {
	width:100%;
	height:168px;
	background:url(../images/header-bg.gif) top center no-repeat;
}
.logo{
	float:left;
	padding:30px 0px 0px 0px;
}
/* ==========================================================================
   NAVIGATION
   ========================================================================== */
nav {
	width:515px;
	height:14px;
	float:right;
	padding:65px 10px 0px 0px;
}
#menu {
	list-style:none;
	padding:0;
	margin:0;
	width:515px;
	height:14px;
	position:relative;
}
#menu a {
	display:block;
	text-indent:-2000px;
	position:absolute;
	outline:none;
}
#menu a:hover {
	background-position:left bottom;
}
#menu a.active-page{
	background-position:left bottom;	
}
#menu .nav-home {
	width:51px;
	height:14px;
	background:url(../images/nav-home.gif) no-repeat;
	left:0px;
	top:0px;
}
#menu .nav-meet {
	width:91px;
	height:14px;
	background:url(../images/nav-meet.gif) no-repeat;
	left:92px;
	top:0px;
}
#menu .nav-services {
	width:77px;
	height:14px;
	background:url(../images/nav-services.gif) no-repeat;
	left:218px;
	top:0px;
}
#menu .nav-portfolio {
	width:78px;
	height:14px;
	background:url(../images/nav-portfolio.gif) no-repeat;
	left:331px;
	top:0px;
}
#menu .nav-contact {
	width:68px;
	height:14px;
	background:url(../images/nav-contact.gif) no-repeat;
	left:447px;
	top:0px;
}

/* ==========================================================================
   MAIN LAYOUT 
   ========================================================================== */
#main-home {
	width:100%;
	height:499px;
	background:#a0a690 url(../images/home-top-shadow.gif) top left repeat-x;
	padding-top:3px;
}
#main {
	width:100%;
	height:499px;
	padding-top:3px;
	background:#a0a690;
}
.container{
	width:960px;	
	margin:0 auto;
	clear:both;

}

/* ==========================================================================
   HOME 
   ========================================================================== */
#home-pics {
	width:100%;
	height:499px;
	position:relative;
	overflow:hidden;
} 
#pic-1{
	width:100%;
	height:499px;
	display:none;
	position:relative;
	z-index:7;
	background:url(../images/home-pic-1.jpg) top center no-repeat;
}
#pic-2{
	width:100%;
	height:499px;
	display:none;
	position:relative;
	z-index:5;
	background:url(../images/home-pic-2.jpg) top center no-repeat;
}
#pic-3{
	width:100%;
	height:499px;
	display:none;
	position:relative;
	z-index:3;
	background:url(../images/home-pic-3.jpg) top center no-repeat;
}
#pic-4{
	width:100%;
	height:499px;
	display:none;
	position:relative;
	z-index:1;
	background:url(../images/home-pic-4.jpg) top center no-repeat;
}
#text-1{
	float:left;
	margin:442px 0px 0px 210px;
	display:none;
	position:relative;
	z-index:8;
}
#text-2{
	float:left;
	margin:406px 0px 0px 210px;
	display:none;
	position:relative;
	z-index:6;
}
#text-3{
	float:left;
	margin:442px 0px 0px 210px;
	display:none;
	position:relative;
	z-index:4;
}
#text-4{
	float:left;
	margin:442px 0px 0px 210px;
	display:none;
	position:relative;
	z-index:2;
}
/* ==========================================================================
   MEET PAUL 
   ========================================================================== */
.meet-paul-column{
	width:277px;
	height:334px;
	float:left;
	margin-right:40px;
	background:url(../images/paul-howe.jpg) top left no-repeat;
}
.meet-content{
	width:443px;
	height:334px;
	float:left;
}
.previous-work-heading{
	float:left;
	font-size:16px;
	clear:left;
	margin-top:20px;
}
.previous-work{
	width:960px;
	float:left;
	font-size:0.9em;
}
.previous-work-client{
	float:left;
	margin-right:27px;
}
.previous-work-client p{
	margin-top:2px;
}
/* ==========================================================================
   CONTACT
   ========================================================================== */
.telephone-column{
	width:248px;
	float:left;
	padding-left:64px;
	margin-top:60px;
	font-size:1.4em;
}
.email-column{
	width:370px;
	float:left;
	margin-top:60px;
	font-size:1.4em;
}
.address-column{
	width:278px;
	float:left;
	margin-top:60px;
	font-size:1.4em;
}
.contact-headings{
	color:#4d4c4c;
	font-weight:bold;
	font-size:0.8em;
	margin-top:30px;
}
/* ==========================================================================
   SERVICES
   ========================================================================== */
.services-wrapper{
	width:644px;
	margin:23px auto 0px;
}
.services-thumbs{
	width:644px;
	height:182px;
	float:left;
}
.services-title{
	width:152px;
	float:left;
	margin:0px 9px 20px 0px;
	text-align:center;
	cursor:pointer;
}
.services-content{
	width:516px;
	height:200px;
	padding:55px 60px 0px;
	background:url(../images/services-fade-bg.jpg) top left no-repeat;
}
#services-picture a {
	width:152px;
	height:152px;
	float:left;
	margin-right:9px;
	text-indent:-3000px;
	outline: none;
	cursor:pointer;
}
#services-picture a:hover {
	background-position:left bottom;
}
#services-picture .services-design {
	width:152px;
	height:152px;
	background:url(../images/design-thumb.jpg) no-repeat;
}
#services-picture .services-construction {
	width:152px;
	height:152px;
	background:url(../images/construction-thumb.jpg) no-repeat;
}
#services-picture .services-maintenance {
	width:152px;
	height:152px;
	background:url(../images/maintenance-thumb.jpg) no-repeat;
}
#services-picture .services-finishing {
	width:152px;
	height:152px;
	background:url(../images/finishing-thumb.jpg) no-repeat;
}
.services-column-1{
	width:281px;
	float:left;
	padding-right:54px;
	/*font-size:0.9em;*/
}
.services-column-2{
	width:181px;
	float:left;
	/*font-size:0.9em;*/
}
.services-column-2 ul{
	margin-top:9px;
	margin-left:-22px;
}


/* ==========================================================================
   FOOTER
   ========================================================================== */
footer {
	width:100%;
	height:93px;
	background:url(../images/footer-bg.gif) top center no-repeat;
}
.tel-number{
	float:left;
	padding:20px 0px 0px 0px;
}
.details{
	float:right;
	padding:14px 0px 0px 0px;
	color:#FFF;
	font-size:0.9em;
	text-align:right;
}

/* ==========================================================================
   PORTFOLIO CLIENTS CAROUSEL
   ========================================================================== */

.jcarousel-skin-portfolio .jcarousel-container {
	margin:50px auto 0px;
}
.jcarousel-skin-portfolio .jcarousel-direction-rtl {
	direction: rtl;
}
.jcarousel-skin-portfolio .jcarousel-container-horizontal {
	width: 796px;
	padding: 20px 40px;
}
.jcarousel-skin-portfolio .jcarousel-clip {
	overflow: hidden;
}
.jcarousel-skin-portfolio .jcarousel-clip-horizontal {
	width: 796px;
	height: 320px;
}
.jcarousel-skin-portfolio .jcarousel-item {
	width: 152px;
	height: 320px;
}
.jcarousel-skin-portfolio .jcarousel-item p {
	text-align:center;
	margin:0;
	font-size:0.9em;
}
.jcarousel-skin-portfolio .jcarousel-item-horizontal {
	margin-left: 0px;
	margin-right:9px;
}
.jcarousel-skin-portfolio .jcarousel-direction-rtl .jcarousel-item-horizontal {
	margin-left: 0px;
	margin-right: 0;
}
.jcarousel-skin-portfolio .jcarousel-next-horizontal {
	position: absolute;
	top: 115px;
	right: 0px;
	width: 35px;
	height: 61px;
	cursor: pointer;
	background: transparent url(../images/next-horizontal.gif) no-repeat 0 0;
}
.jcarousel-skin-portfolio .jcarousel-direction-rtl .jcarousel-next-horizontal {
	left: 0px;
	right: auto;
	background-image: url(../images/prev-horizontal.gif);
}
.jcarousel-skin-portfolio .jcarousel-next-horizontal:hover, .jcarousel-skin-portfolio .jcarousel-next-horizontal:focus {
	background-position: -35px 0;
}
.jcarousel-skin-portfolio .jcarousel-next-horizontal:active {
	background-position: -70px 0;
}
.jcarousel-skin-portfolio .jcarousel-next-disabled-horizontal, .jcarousel-skin-portfolio .jcarousel-next-disabled-horizontal:hover, .jcarousel-skin-portfolio .jcarousel-next-disabled-horizontal:focus, .jcarousel-skin-portfolio .jcarousel-next-disabled-horizontal:active {
	cursor: default;
	background-position: -105px 0;
}
.jcarousel-skin-portfolio .jcarousel-prev-horizontal {
	position: absolute;
	top: 115px;
	left: 0px;
	width: 38px;
	height: 61px;
	cursor: pointer;
	background: transparent url(../images/prev-horizontal.gif) no-repeat 0 0;
}
.jcarousel-skin-portfolio .jcarousel-direction-rtl .jcarousel-prev-horizontal {
	left: auto;
	right: 0px;
	background-image: url(../images/next-horizontal.gif);
}
.jcarousel-skin-portfolio .jcarousel-prev-horizontal:hover, .jcarousel-skin-portfolio .jcarousel-prev-horizontal:focus {
	background-position: -38px 0;
}
.jcarousel-skin-portfolio .jcarousel-prev-horizontal:active {
	background-position: -76px 0;
}
.jcarousel-skin-portfolio .jcarousel-prev-disabled-horizontal, .jcarousel-skin-portfolio .jcarousel-prev-disabled-horizontal:hover, .jcarousel-skin-portfolio .jcarousel-prev-disabled-horizontal:focus, .jcarousel-skin-portfolio .jcarousel-prev-disabled-horizontal:active {
	cursor: default;
	background-position: -114px 0;
}
/* ==========================================================================
   PORTFOLIO CAROUSEL
   ========================================================================== */
#portfolio-wrapper {
	width:100%;
	height:499px;
	margin:0 auto;
	overflow:hidden;
}
#mycarousel{
	width:960px;
	float:left;
	list-style:none;
	padding:0;
	margin-top:30px;
}
#mycarousel a {
	display:block;
	margin-top:20px;
	outline:none;
}
#mycarousel p {
	text-align:center;
}
#mycarousel a:hover {
	background-position:left bottom;
}
#mycarousel li.portfolio-pad-right{
	width:152px;
	float:left;
	margin-right:9px;
}
#mycarousel li.portfolio-no-pad{
	width:152px;
	float:left;
}
#mycarousel .medburn {
	width:152px;
	height:270px;
	background:url(../images/medburn.jpg) no-repeat;
	left:0px;
	top:0px;
}
#mycarousel .tapereli {
	width:152px;
	height:270px;
	background:url(../images/tapereli.jpg) no-repeat;
	left:161px;
	top:0px;
}
#mycarousel .foxdene {
	width:152px;
	height:270px;
	background:url(../images/foxdene.jpg) no-repeat;
	left:322px;
	top:0px;
}
#mycarousel .sunniside {
	width:152px;
	height:270px;
	background:url(../images/sunniside.jpg) no-repeat;
	left:483px;
	top:0px;
}
#mycarousel .gosforth {
	width:152px;
	height:270px;
	background:url(../images/gosforth.jpg) no-repeat;
	left:644px;
	top:0px;
}
#mycarousel .lowfell {
	width:152px;
	height:270px;
	background:url(../images/lowfell.jpg) no-repeat;
	left:805px;
	top:0px;
}
/* ==========================================================================
   PORTFOLIO
   ========================================================================== */
#portfolio-wrapper{
	width:957px;
	height:499px;
	margin:0 auto;
}
.portfolio-info{
	width:270px;
	float:left;
}
.portfolio-text{
	width:270px;
	height:332px;
	float:left;
}
.portfolio-text-bullets{
	margin-left:-25px;
	font-size:13px;
}
.portfolio-text a:link, .portfolio-text a:visited{
	color:#4d4c4c;
	text-decoration:none;
}
.portfolio-text a:hover{
	text-decoration:underline;
}
.portfolio-thumbs{
	width:270px;
	height:145px;
	float:left;
}
.portfolio-thumbs ul{
	margin:0;
	padding:0;
}
.portfolio-thumbs li{
	list-style:none;
	float:left;
	margin:0px 5px 5px 0px;	
}
.portfolio-thumbs li.no-bottom-pad{
	list-style:none;
	float:left;
	margin:0px 5px 0px 0px;	
}
.testimonial{
	font-size:15px;
	font-style:italic;	
}
#medburn-wrapper {
	width:100%;
	height:499px;
	margin:0 auto;
	overflow:hidden;
	background:url(../images/medburn-bg-pics.jpg) top center no-repeat;
}
#medburn-pics{
	width:667px;
	height:499px;
	float:right;
	background:url(../images/medburn-pic-1.jpg);
}
#tapereli-wrapper {
	width:100%;
	height:499px;
	margin:0 auto;
	overflow:hidden;
	background:url(../images/tapereli-bg-pics.jpg) top center no-repeat;
}
#tapereli-pics{
	width:667px;
	height:499px;
	float:right;
	background:url(../images/tapereli-pic-1.jpg);
}
#foxdene-wrapper {
	width:100%;
	height:499px;
	margin:0 auto;
	overflow:hidden;
	background:url(../images/foxdene-bg-pics.jpg) top center no-repeat;
}
#foxdene-pics{
	width:667px;
	height:499px;
	float:right;
	background:url(../images/foxdene-pic-1.jpg);
}
#sunniside-wrapper {
	width:100%;
	height:499px;
	margin:0 auto;
	overflow:hidden;
	background:url(../images/sunniside-bg-pics.jpg) top center no-repeat;
}
#sunniside-pics{
	width:667px;
	height:499px;
	float:right;
	background:url(../images/sunniside-pic-1.jpg);
}
#gosforth-wrapper {
	width:100%;
	height:499px;
	margin:0 auto;
	overflow:hidden;
	background:url(../images/gosforth-bg-pics.jpg) top center no-repeat;
}
#gosforth-pics{
	width:667px;
	height:499px;
	float:right;
	background:url(../images/gosforth-pic-1.jpg);
}
#lowfell-wrapper {
	width:100%;
	height:499px;
	margin:0 auto;
	overflow:hidden;
	background:url(../images/lowfell-bg-pics.jpg) top center no-repeat;
}
#lowfell-pics{
	width:667px;
	height:499px;
	float:right;
	background:url(../images/lowfell-pic-1.jpg);
}