@charset "utf-8";

html, body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, fieldset, input {
	margin:0pt;
	padding:0pt;
}
.thumbnail-wrap {
	float: left;
	height: 80px;
}
.joinery-thumbs {
	padding: 10px;
	float: left;
}
.imagehold-wrap {
	width: 640px;
	position: relative;
	float: left;
}


body {
	background-color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: 16px;
	font-weight: normal;
	color: #666666;
}

#wrap {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 15px;
}

#header {
	border: 1px solid #1e1e1e;
	height: 70px;
}
#header h1 {
	float: right;
	height: 50px;
	width: 216px;
	display: block;
	background: transparent url(../images/gabriel-joinery-logo.jpg) no-repeat scroll left center;
	padding: 10px;
}
#header h1 a {
	height: 50px;
	width: 216px;
	display: block;
	outline: 0;
}
#header h1 span {
	display: none;
}
#main-content {
	/*height: 540px;*/
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #1e1e1e;
	border-bottom-color: #1e1e1e;
	border-left-color: #1e1e1e;
	float: left;
}
#navigation-wrap {
	height: 50px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #1e1e1e;
	border-bottom-color: #1e1e1e;
	border-left-color: #1e1e1e;
	float: left;
	width: 998px;
}
#footer {
	height: 50px;
	float: left;
	width: 1000px;
	font-size: 9px;
	color: #1e1e1e;
	text-align: center;
	padding-top: 10px;
}
#footerleft {
	float: left;
	width: 250px;
	padding-top: 0px;
	text-align: left;
}
#footer a {
	color: #1e1e1e;
	text-decoration: none;
	outline: 0;
}
#footer a:link {
	color: #1e1e1e;
	text-decoration: none;
	outline: 0;
}
#footer a:hover {
	color: #333333;
	text-decoration: none;
	outline: 0;
}
#footer a:visited {
	text-decoration: none;
	outline: 0;
}
#footerright {
	float: right;
	padding-top: 0px;
}


/* navigation */

#nav {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
}
#navigation {
	padding-left: 50px;
	float: left;
	padding-top: 15px;
}

#nav li {
	display: block;
	float: left;
	padding-right: 28px;
	padding-left: 28px;
	width: 70px;
}

#nav li.button a span {
	display: none;
}

#nav li.buttonoff a span {
	display: none;
}
#nav li.button a {
	display: block;
	height: 20px;
	outline: 0;
}

#nav li.button a:hover {
	background-position: 0pt -20px;
}
#nav li.home a {
	background: transparent url(../images/nav/home.gif) no-repeat scroll 0pt 0%;
	width: 70px;
}
#nav li.aboutus a {
	background: transparent url(../images/nav/aboutus.gif) no-repeat scroll 0pt 0%;
	width: 70px;
}
#nav li.joinery a {
	background: transparent url(../images/nav/joinery.gif) no-repeat scroll 0pt 0%;
	width: 70px;
}
#nav li.portfolio a {
	background: transparent url(../images/nav/portfolio.gif) no-repeat scroll 0pt 0%;
	width: 70px;
}
#nav li.careers a {
	background: transparent url(../images/nav/careers.gif) no-repeat scroll 0pt 0%;
	width: 70px;
}
#nav li.contact a {
	background: transparent url(../images/nav/contact.gif) no-repeat scroll 0pt 0%;
	width: 70px;
}
#nav li.media a {
	background: transparent url(../images/nav/media.gif) no-repeat scroll 0pt 0%;
	width: 70px;
}
#nav li.buttonoff.home {
	display: block;
	height: 20px;
	background: transparent url(../images/nav/home.gif) no-repeat scroll center -20px;
}
#nav li.buttonoff.aboutus {
	display: block;
	height: 20px;
	background: transparent url(../images/nav/aboutus.gif) no-repeat scroll center -20px;
}
#nav li.buttonoff.joinery {
	display: block;
	height: 20px;
	background: transparent url(../images/nav/joinery.gif) no-repeat scroll center -20px;
}
#nav li.buttonoff.portfolio {
	display: block;
	height: 20px;
	background: transparent url(../images/nav/portfolio.gif) no-repeat scroll center -20px;
}
#nav li.buttonoff.careers {
	display: block;
	height: 20px;
	background: transparent url(../images/nav/careers.gif) no-repeat scroll center -20px;
}
#nav li.buttonoff.contact {
	display: block;
	height: 20px;
	background: transparent url(../images/nav/contact.gif) no-repeat scroll center -20px;
}
#nav li.buttonoff.media {
	display: block;
	height: 20px;
	background: transparent url(../images/nav/media.gif) no-repeat scroll center -20px;
}
/* end navigation */
#maincontentwrap {
	width: 998px;
	height: 540px;
	overflow: hidden;
	float: left;
}
#image-holder {
	float: left;
	width: 670px;
	height: 540px;
}
#kitchen-joinery-image-holder {
	float: left;
	width: 670px;
	height: 540px;
	position: absolute;
	left: 0px;
	top: 0px;
}
#joinery-image-holder {
	float: left;
	width: 670px;
	height: 540px;
	position: absolute;
	left: 0px;
	top: 0px;
}
#content-rhs {
	height: 540px;
	width: 328px;
	float: left;
	overflow: hidden;
}
#content-rhs-joinery {
	height: 540px;
	width: 328px;
	float: right;
	overflow: hidden;
}
#copy {
	padding-top: 60px;
	padding-left: 30px;
	padding-right: 30px;
}
#copy h3 {
	color: #999966;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	text-transform: uppercase;
	padding-bottom: 25px;
}
#copy p {
	padding-bottom: 15px;
}
#copy a {
	color: #CCCCCC;
	text-decoration: none;
	outline: 0;/* prevent dotted border in Firefox */
}
.smltitle {
	font-weight: bold;
}

#copy a:link {
	color: #CCCCCC;
	text-decoration: none;
	outline: 0;/* prevent dotted border in Firefox */
}
#copy a:hover {
	color: #999966;
	text-decoration: none;
	outline: 0;/* prevent dotted border in Firefox */
}
#copy a:visited {
	text-decoration: none;
	outline: 0;/* prevent dotted border in Firefox */
}
#accordion h4 {
	font-size: 11px;
	font-weight: normal;
	padding-bottom: 5px;
	outline: 0;
}
#portfolio-wrap {
	padding-top: 30px;
	padding-right: 0px;
	padding-left: 30px;
	float: left;
}
#portfolio h3 {
	color: #999966;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	text-transform: uppercase;
	padding-bottom: 25px;
	padding-top: 5px;
}
.projects {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	float: left;
	width: 960px;
}
.projects1 {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	float: left;
	width: 480px;
}
.recent-project {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	float: left;
	width: 480px;
}
.recent-project li {
	display: block;
	float: left;
	width: 450px;
	height: 400px;
	padding-right: 30px;
	overflow: hidden;
	padding-bottom: 20px;
}
.recent-project li a {
	display: block;
	height: 380px;
	width: 450px;
	outline: 0px;
	/*border: 1px solid #000000;*/
}
.projects li {
	display: block;
	float: left;
	width: 210px;
	height: 120px;
	padding-right: 30px;
	overflow: hidden;
	padding-bottom: 20px;
}

.projects li a {
	display: block;
	height: 100px;
	width: 210px;
	outline: 0px;
	/*border: 1px solid #000000;*/
}
.projects1 li {
	display: block;
	float: left;
	width: 210px;
	height: 120px;
	padding-right: 30px;
	overflow: hidden;
	padding-bottom: 20px;
}

.projects1 li a {
	display: block;
	height: 100px;
	width: 210px;
	outline: 0px;
	/*border: 1px solid #000000;*/
}
.project-text {
	text-indent: 1px;
	padding-top: 5px;
}
#portfolio {
	float: left;
}


.projects li a:hover {
	/*display: block;
	height: 120px;
	width: 210px;
	border: 1px dashed #999966;*/
}
#page-number {
	float: left;
	width: 930px;
	height: 21px;
}
#page-number #text {
	float: left;
	width: 880px;
}

#pagebuttons {
	float: right;
	width: 50px;
	height: 21px;
}
.page1 {
	background-image: url(../images/page1_on.png);
	background-repeat: no-repeat;
	background-position: left center;
	display: block;
	height: 21px;
	width: 21px;
	float: left;
	padding-right: 8px;
}
.page1 span {
	display: none;
	top: 1px;
}
.page2 span {
	display: none;
	top: 1px;
}
.page2 {
	background-image: url(../images/page2_on.png);
	background-repeat: no-repeat;
	background-position: left center;
	display: block;
	height: 21px;
	width: 21px;
	float: right;
}
.page1 a {
	background-image: url(../images/page1_off.png);
	background-repeat: no-repeat;
	background-position: left center;
	display: block;
	height: 21px;
	width: 21px;
	float: left;
	outline: 0;
}
.page2 a {
	background-image: url(../images/page2_off.png);
	background-repeat: no-repeat;
	background-position: left center;
	display: block;
	height: 21px;
	width: 21px;
	float: right;
	outline: 0;
}
.page1 a:hover {
	background-image: url(../images/page1_on.png);
}
.page2 a:hover {
	background-image: url(../images/page2_on.png);
}