
/*
main body style and background divs
*/

* {
margin:0; padding:0;
}

body {
background: #eff2f1 url(../images/bg-body-tile-y.gif) top center repeat-y;
margin:0px;
font-family: Verdana,Helvetica,Arial,sans-serif;
font-size:11px;
color:#4F4F4F;
}
div#body {
background: url(../images/bg-body-tile-x.gif) top center repeat-x;
line-height:1.4em;
text-align:justify;
}


/*
global styles etc
*/


a:link 		{color:#039bd4; text-decoration:none;}
a:visited {color:#039bd4; text-decoration:none;}
a:hover		{color:#242424; text-decoration:none;}

.inside a:link 		{color:#039bd4; text-decoration:none;}
.inside a:visited {color:#039bd4; text-decoration:none;}
.inside a:hover		{color:#ffffff; text-decoration:none; background:#039bd4;}

a:hover.nobg		{background:none;}

h1 {font-size: 1em; font-weight: bold; padding:0px; margin:0px;}
h2 {font-size: 1em; font-weight: bold; padding:0px; margin:0px;}
h3 {font-size: 1em; font-weight: bold; padding:0px; margin:0px;}


img {border:0px;}
address {font-style: normal;}
acronym {border:none;}

.left {float:left;}
.right {float:right;}
.clear {clear:both;}
.clear-r {clear:right;}
.clear-l {clear:left;}
.margin-r {margin-right:10px;}


.color {color:#039bd4;}
.big   {font-size:1.5em;}
b.big  {font-weight:normal;}

.inside {padding:10px;}

ul {list-style-image: url(../images/li.png);}

p {padding-bottom:10px;}

.thicky {display: none;}


/*
page backgrounds and structure
*/


div#page-wrap {
margin:auto;
}
div.content-wrap {
width:974px;
margin:auto;
position:relative;
}

div#bg-page-top {
background: url(../images/bg-page-top.png) top center no-repeat;
overflow:hidden;
}
div#bg-page-tile {
background: url(../images/bg-page-tile-y.png) top center repeat-y;
}
div#bg-footer {
background: url(../images/bg-footer.png) bottom center no-repeat;
}





/*
content styles and positioning
working from top down
*/


/*
nav and top links
*/

a#bookmark-us {
margin-left: 110px;
}

ul#nav {
list-style-image:none;
list-style-type:none;
display:inline;
position:relative;
z-index:10;
float: right;
}
ul#nav li {
display:block;
float:left;
}

#logo {
margin: -37px 0 0 5px;
}

div#top-links {
margin-top:20px;
width:640px;
margin-bottom:7px;
}
div#top-links b,
div#top-links a {
display:block; width:200px;
position:relative;
bottom:5px;
}

/*
Banner
*/


div#banner {
height:286px;
width:974px;
position: relative;
top: 4px;
position: relative;
z-index: 110;
}
div#banner h1 {
background: url(../images/banner-h1.gif) repeat-x;
color:#fff;
font-size:1.7em;
font-weight:normal;
text-align:center;
margin:246px 4px 0 4px;
height: 44px;
width:966px;
line-height: 44px;
position: absolute;
bottom: 5px;
left: 0;
z-index: 200;
}
div#banner-fade {
width: 974px;
height: 296px;
position: relative;
z-index: 150;
}








/*
Content Area Home Page - left box and buttons
*/


div#bg-left-box-tile {
background: url(../images/bg-left-box-tile.gif) top left repeat-y;
margin-left:3px;
margin-top:4px;
}
div#bg-left-box-top {
background: url(../images/bg-left-box-top.gif) top left no-repeat;
}
div#left-box-wrap {
width:294px;
}
div#bg-left-box-end {
background: url(../images/bg-left-box-end.gif) bottom left no-repeat;
height:45px;
margin-left:3px;
}

div#buttons {
width:642px;
height:150px; /* stops the auto height of this stretching the left box */
overflow: visible;
}








/*
Footer sections
*/

div#footer {
height:190px;
}
div#footer div.left {
width:270px;
text-align:left;
margin-left:25px;
margin-top:40px;
color:#242424;
}
div#footer div.left p:first-line {
line-height:3em;
}
div#footer div#quick-links.left,
div#footer div#info.left {
margin-left:57px;
}
div#footer div#quick-links.left p {
padding-bottom:0px;
}
div#quick-links a {
display:block;
}










/*
Contact page - will change this to a better default style
*/

#form_div {
width: 360px;
color: #555;
font-weight: bold;
margin: 15px 0 50px 0;
}

.form {
background: url(../images/formgradient.jpg) repeat-x #ffffff;
border: 1px solid #bfc6ca;
padding: 10px;
height: 400px;
}

.input {
width: 200px;
height: 15px;
font-size: 12px;
border: 1px solid #cccccc;
background: url(../images/formgradient.jpg) repeat-x #ffffff;
margin-bottom: 15px;
padding: 5px;
float: right;
}

.input:hover {
border: 1px solid #aaaaaa;
}

.input:focus {
border: 1px solid #aaaaaa;
background: #fffbdf;
}

.textarea {
font-family:Verdana, Arial, Helvetica, sans-serif;
padding: 0px; line-height: 14px; margin: 0px;
width: 200px;
height: 150px;
line-height: 18px;
font-size: 12px;
border: 1px solid #cccccc;
background: url(../images/formgradient.jpg) repeat-x #ffffff;
margin-bottom: 10px;
padding: 5px;
float: right;
}

.textarea:hover {
border: 1px solid #aaaaaa;
}

.textarea:focus {
border: 1px solid #aaaaaa;
background: #fffbdf;
}

.submit {
float: right;
padding: 2px 10px;
clear: both;
}

label {
width: 150px;
float: left;
font-size: 12px;
margin: 10px 0 -18px 0;
}

.enquiry {
margin: 10px 0 -10px !important;
}




/* Content Area styling */

#content {
margin: 20px 30px 50px 30px;
}

#content li {
list-style-position: inside;
}

#content h1 {
font-size: 22px;
margin: 20px 0 15px 0;
font-weight: normal;
color: #0085ab;
}

h2 {
font-size: 18px;
margin: 20px 0 15px 0;
font-weight: normal;
color: #0085ab;
}

h3 {
font-size: 16px;
margin: 20px 0 15px 0;
font-weight: normal;
color: #0085ab;
}

#contact-left {
float: left;
width: 500px;
}

#about-left {
float: left;
width: 580px;
}

.photo {
padding: 4px;
border: 1px solid #bfc6ca;
background: #dedede;
}

.bmargin {
margin: 0 0 60px 0;
}

.blue {
color: #0085AB;
}

#phone {
margin: 20px auto;
text-align: center;
}

#customer-testimonials {
display: none;
}

blockquote {
width: 760px;
margin: 10px auto 20px;
background: #eee;
border: 1px solid #ddd;
color: #666;
padding: 10px 10px 40px;
}

blockquote small {
float: right;
clear: both;
margin: 20px 0px 0 0;
font-style: italic;
}



/*******************/
/**** GALLERY *****/
/*****************/

.stepcarousel{
position: relative; /*leave this value alone*/
border: 0px solid black;
overflow: scroll; /*leave this value alone*/
width: 480px; /*Width of Carousel Viewer itself*/
height: 640px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 4px; /*margin around each panel*/
width: 480px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}

#mygallery {
float: left;
padding: 4px;
background: #ddd;
border: 1px solid #bbb;
margin-bottom: 60px;
}

.belt {

}

#miniGallery {
float: left;
margin: 0 0 0 50px;
width: 360px;
}

#miniGallery img {
margin: 0 2px 3px 0;
padding: 3px;
background: #ddd;
border: 1px solid #bbb;
}

#miniGallery img:hover {
background: #bbb;
border: 1px solid #999;
}

#kitchen1 {
margin: 74px 0 0 0;
}

#kitchen2 {
margin: 0px 0 0 0;
}

.contained {
background: #ececec;
border: 1px solid #ccc;
padding: 20px;
}

#back-to-top {
float: right;
margin: 20px 10px 0;
}

#home-content {
display: none; 
}

#video {
position: absolute;
top: 108px;
left: 6px;
z-index: 199;
}

object { outline: none; }