/* ==========================================================
Master Stylesheet

website:   Brian de Staic
version:   V017 Restart
updated:   July 28 - August 4 2010
author:    Duncan Marshall
email:     dm@chromadesign.co.uk
url:       http://www.chromadesign.co.uk

============================================================ FancyZoom and Form styling are on separate sheets */

/* Reset and General Architecture */
blockquote,body,caption,div,dl,dt,dd,form,fieldset,h1,h2,h3,h4,h5,h6,html,li,ul,ol,p,pre,textarea,table,td,th {margin:0; padding:0;}
a{outline: none; text-decoration: none;}
a IMG{border: none;}
html{height: 101%;}
ul{list-style-type: none; margin: 0px 0px 24px 0px;}
ul span{position: relative; left: -5000px;}
.clearfix:after{content: "."; display: block; height: 0px; clear: both; visibility: hidden;}
body{color: #000; background: #939c99; font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 8pt; line-height: 24px; text-align: center;}

#wrapper{width: 1000px; margin: auto; position: relative;}

#sidebar{float: left; width: 220px; height: 550px; margin-top: 30px;}

/* Accordion Navigation */
ul.navigation, ul.navigation ul{list-style-type: none; margin: 0; padding: 0; width: 210px; font-size: 12px; text-align: center; font-variant: small-caps;}
ul.navigation a{display: block; text-decoration: none;}
ul.navigation li{line-height: 18px; border-bottom: 1px solid #7E8683;}
ul.navigation li a{padding: 4px 0px 4px 0px; font-weight: 600;}
ul.navigation li a, a:link a:visited a:active{color: #e0e1ec;}
ul.navigation li a:hover{color: #fff;}
ul.navigation li.category a{color: #000;}
ul.navigation li.category ul li a, a:link a:visited a:active{color: #e0e1ec;}
ul.navigation li.category ul li a:hover{color: #fff;}
ul.navigation li ul{font-variant: normal; font-size: 10px;}
ul.navigation li ul li{border-bottom: none; line-height: 12px;}
ul.navigation li ul li.final{padding-bottom: 10px;}
ul.menu li ul li a.current{font-weight: 600; color: #fff;}


/* Address line beneath navigation */
#fixed{position: absolute; top: 530px; left: 0px; width: 210px; height: 70px;}
#fixed p{padding: 0px; margin-left: 0px;}

/* Content - contains the gallery thumbs */
#content{float: left; margin: 30px 0px 0px 10px; width: 760px; height: 500px; text-align: left;}
body.aboutpage #content{width: 640px; height: auto; padding-bottom: 100px;}

/* Special treatement for home page */
body.homepage #content{width: 620px; height: 430px; background: url(../i/str/contentsbg_home.jpg) 0px 0px no-repeat; padding-top: 35px; line-height: 18px; font-size: 11px; text-align: justify; font-family: "Lucida Grande", "Lucida Sans Unicode", verdana, sans-serif; }
body.homepage #content IMG{float: left; clear: left; margin: 0px;}
/* Home page highlights */
#highlights{width: 560px; height: 102px; position: absolute; top: 375px; margin-left: 70px; z-index: 99;}
.minithb{width: 100px; height: 100px; display: block; float: left; background: #fff; margin-left: 10px;}
.minithb a IMG{width: 100px; height: 100px; -ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling - thanks Martin! */}
.minithb a IMG,
a:link
a:visited
a:active{border: 1px solid gray;}
.minithb a:hover IMG{border: 1px solid #D9E4E7;}


/* Wrappers for the thumbnails, with bg shadows, etc */
.wrp{float: left; width: 250px; height: 250px; margin-bottom: 0px; background: url(../i/str/wrp.png) no-repeat; text-align: left;}
.wrp:hover{background: url(../i/str/wrphover.png) no-repeat;}
.wrp a IMG{width: 238px; height: 238px; border: 1px solid #ddd;}
h4{position: relative; top: -22px; margin: 0px 10px 0px 0px; font-weight: 500; font-size: 9pt; letter-spacing: 0px; color: #60110F; font-variant: small-caps; text-align: center;}

/* Gallery page numbers */
ul#pages{clear: both; line-height: 14px; text-align: center;}
ul#pages li{float: left; margin-right: 1px;}
ul#pages li#page{padding-top: 1px;}
ul#pages li a{display: block; width: 15px; height: 14px; padding: 0px 1px 1px 1px; border: 1px solid gray; text-decoration: none; color: #fff; font-size: 10px;}
ul#pages li a:hover{display: block; width: 15px; height: 14px; background: #fff; color: #000;}
ul#pages li a.currentpage{display: block; width: 15px; height: 14px; background: #454946; color: #fff;}

/* About Us page */
#intro{margin-bottom: 36px;}
#video-container, #history{margin-bottom: 24px;}
#history p{width: auto; position: relative; left: 50px; padding-right: 50px; margin-bottom: 12px;}
#history p strong{left: 0px; margin: 0px 14px 0px -50px}
#history IMG.float{float: right; clear: left; margin-left: 60px;}
h3{font-size: 12px;}

/* Contact page */
a.email, a:link a:visited a:active{color: #fff;}
a.email:hover{color: #660000; border-bottom: 1px solid #660000;}
.warning{color: #fff;}

/* Special Order form page */
body.specialorder p a, a:link a:visited a:active{color: #fff; text-decoration: none;}
body.specialorder p a:hover{color: #660000; border-bottom: 1px solid #660000;}
p#back{margin-left: 150px;}
#footer{}

/* Facebook Icon */
#facebook{float: right; width: 540px; height: 40px; clear: left; text-align: left; margin-top: 176px;}
body.contactpage #facebook{margin-top: 0px; width: 750px;}
#facebook p a{display: inline-block; height: 40px; width: 40px; margin-right: 2px; position: relative; top: 15px;}
