body          { font-size: .76em; font-family:Helvetica, Arial, Verdana, sans-serif;}   /* IE */
html > body   { font-size: 13px; }  /* Other browsers */

body {
margin: 0 ;
padding: 0;
line-height: 1.7em;
text-align: center;
color: #dddddd;
background-color: #2a2a2a;
}

#center {
position: relative;
margin:10px auto 0 auto;
padding: 0 25px;
max-width: 1200px;
min-width: 970px;
text-align: left;
background-color: #333;
}

p {margin: 0 0 .8em 0; padding:0;}

/*Links*/
p a:link,
.right li a:link,
h1 a:link,h2 a:link,h4 a:link,
p a:visited,
.right li a:visited,
h1 a:visited,h2 a:visited,h4 a:visited{ color: #ddd; text-decoration: none; border-bottom: 1px dotted #6f6;}

.right li a:link,
.right li a:visited,
.right li a:hover {padding-bottom: 2px;}

p a:hover,
.right li a:hover,
h1 a:hover, h4 a:hover {color: #fff; text-decoration: none; border-bottom: 1px dotted #6f6;}

h1 a { line-height: 1.5em;}

img, img a, p img, p img a { border: none; text-decoration: none; padding: 0; background-color: transparent;}

ol, ul {margin: 0 25px 0 .5em; padding: 0 0 20px 20px; list-style-image: url(images/bullet.gif);}
li {margin: 3px 0 0 10px; text-align:left; }

h1, h2, h3, h4, h5 ,h6 {font-weight:normal;  margin: 0; padding: .4em 0 .1em 0; line-height: 1.2em; color: #cfc;}
h1 { font-size: 1.5em; line-height: 20px; padding-top: 0;}
h2 { font-size: 1.3em;}
h3 { font-size: 1.2em;}
h4 { font-size: 1.1em;}
h4 a:link, h4 a:visited{ color: #dfd;}
h4 a:hover { color: #efe;} 
h5 { font-size: 1.1em;}
h6 { font-size: 1em;}


div#header { margin: 0; padding: 0;}
div#logo{ margin: 0; padding: 0;} 

div#content { margin: 0; padding: 0; clear:both; min-height: 600px;}

div#flashcontent{ float:right; width: 655px; margin: 0 0 0 25px; padding: 0; overflow:hidden; border-left: 5px solid #333; border-bottom: 5px solid #333;}
div#sixboxes {float: right; margin: 30px 0 15px 25px; padding: 0; width: 650px; height: 450px; overflow:hidden;}
.clear {clear:both; }

/*Left column*/
.left { margin-right: 45%; padding-right: 20px;}

/*Right column*/
.right { position:absolute; right:20px; top:610px; width: 40%; margin: 0 0 15px 4%; padding: 0; background-color: #333333; }
.rightbox {margin: 0 0 20px 0; padding: 15px; border: 1px solid #464; background-color:#363936;}
.right ol, .right ul {margin: 0 25px 0 .5em; padding: 0 0 0 20px;}
.right li {padding-top: 3px; text-align:left; list-style-image: url(images/bullet.gif);}
.enquiryform { float:right; width: 50%; margin: 15px 0 15px 4%; padding: 15px; }
/*--------------------------*/

.horizontal { clear:both; margin: 20px 0; border-top:1px solid #353;}



/*Inline quotations*/
.quote{ width: 75%; margin:15px 0 15px 0; padding: 10px 15px; border:1px solid #353; background-color: #2a2a2a; font-family: Palatino, Georgia, serif;  color:#cec;font-size: 1.1em;}
.name { text-align: right; margin:0; padding: 0 20px 0 0;}
.eventbox{  float:left; width: 200px; margin:15px 75px 15px 0; padding: 10px 15px; border:1px solid #353; background-color: #2a2a2a; font-size: 1.1em;}
.eventbrightfloat {float:right; width: 300px; margin: 50px -400px 1px 4%; padding: 15px; }
div#flashcontent .quote { width: 85%; margin: 0; padding: 5px 150px 0 25px; border: none; background-color: #cec; font-size: 1.3em; color: #2a2a2a; }
div#flashcontent .name { margin: 0; padding: 0 45px 0 15px; border: none; }
/*--------------------------*/

.shopinfo{ position:absolute; top: 110px; right: 1%; width: 20%; margin: 15px 0 15px 4%; padding: 15px; font-size:.9em; background-color:#333}
.shopinfo .border img { border: 1px solid #aba; margin: 40px 20px 0 0; }
.shop { width: 700px; padding-right: 20px; margin: 25px 0 0 50px;}
.shopping{ margin: 15px 0 15px 0; padding: 15px 15px  0 15px; border: 1px solid #464; background-color:#363936; }
.shopping img, .shop img{ border: 1px solid #aaa; float: left; margin: 0 20px 10px 0; }
.shoptext { float:right; width:40%; min-height: 130px;}
.shoptext p { margin: 5px 0 0 20px; line-height: 1.6em; font-size:.9em; color:#ccc;}
.shoptext li { line-height: 1.4em; padding-top: 5px;font-size:.9em; color:#ccc;}
.price { font-size:1.3em; margin: 0; padding: .4em; color: #cfc;}
.strike { font-size:.75em; color:#9a9;text-decoration: line-through;}
.paypalfloat {float: right; margin: 0 90px 9px 0;}
.clear{clear:both;}
.outofstock {margin-left: 70px; background-color: #9a9; padding: 1px 10px; color: white;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;-webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg);}

div#footerpic{ clear: both; margin: 25px 0; padding: 15px 0 0 0; border-top:1px solid #353; color: #666; }


#tool1,
#tool2,
#tool3,
#tool4,
#tool5,
#tool6 { margin:0; padding:0; height: 200px; width:200px;}

#tool1 ul,
#tool2 ul,
#tool3 ul,
#tool4 ul,
#tool5 ul,
#tool6 ul { margin:0; padding: 0; width:200px; list-style-type: none;}

#tool1 li,
#tool2 li,
#tool3 li,
#tool4 li,
#tool5 li,
#tool6 li { height: 200px; list-style-image: none;}

#tool1 ul li a,
#tool2 ul li a,
#tool3 ul li a,
#tool4 ul li a,
#tool5 ul li a,
#tool6 ul li a {margin:0; padding: 0; display: block; height: 200px;  border: 2px solid #444; -webkit-transition: border 2s;}

#tool1 ul li a:hover,
#tool2 ul li a:hover,
#tool3 ul li a:hover,
#tool4 ul li a:hover,
#tool5 ul li a:hover,
#tool6 ul li a:hover {border: 2px solid #6a6; -webkit-transition: border 1s;}

div#tool1 { position: relative; top:0; left:0;}
#tool1 ul li a {background: #444 url("images/tools/glasspot.jpg") no-repeat 0 0;}
#tool1 ul li a:hover {background: #555 url("images/tools/glasspot.jpg") no-repeat 0 -200px;}

div#tool2 { position: relative; top:-200px; right:-225px; }
#tool2 ul li a {background: #444 url("images/tools/claypot.jpg") no-repeat 0 0;}
#tool2 ul li a:hover {background: #555 url("images/tools/claypot.jpg") no-repeat 0 -200px;}

div#tool3 { position: relative; top:-400px; right:-450px; }
#tool3 ul li a {background: #444 url("images/tools/cups.jpg") no-repeat 0 0;}
#tool3 ul li a:hover {background: #555 url("images/tools/cups.jpg") no-repeat 0 -200px;}

div#tool4 { position: relative; top:-375px; right:0px; }
#tool4 ul li a {background: #444 url("images/tools/smellingcups.jpg") no-repeat 0 0;}
#tool4 ul li a:hover {background: #555 url("images/tools/smellingcups.jpg") no-repeat 0 -200px;}

div#tool5 { position: relative; top:-575px; right:-225px; }
#tool5 ul li a {background: #444 url("images/tools/tool.jpg") no-repeat 0 0;}
#tool5 ul li a:hover {background: #555 url("images/tools/tool.jpg") no-repeat 0 -200px;}

div#tool6 { position: relative; top:-775px; right:-450px; }
#tool6 ul li a {background: #444 url("images/tools/tool.jpg") no-repeat 0 0;}
#tool6 ul li a:hover {background: #555 url("images/tools/tool.jpg") no-repeat 0 -200px;}

/* /Navigation*/
div#navigation{ position: absolute; top:40px; right:2px; padding:0; font-family: Century Gothic, Arial, Verdana, sans-serif;font-size: 14px; color: #cfc;z-index: 100;}
ul.nav {display:block;}
ul.nav ul{display:none; position: absolute;left:-1px;top:98%; width:170px;}
ul.nav li:hover ul{display:block}
ul.nav ul ul{position: absolute;left:98%;top:-2px;}
ul.nav, ul.nav ul {margin:0px;list-style:none;padding:0px 3px 3px 0px;background-color:transparent; background-image:url(images/semitransparent.png);background-repeat:repeat;}
ul.nav li{display:block; margin:3px 0px 0px 10px;}
ul.nav a:active, ul.nav a:focus {outline-style:none;}
ul.nav a {display:block;vertical-align:middle; text-align:left; text-decoration:none; padding:4px 20px; color: white; text-decoration:none; cursor:pointer;-webkit-transition: color .5s;}
ul.nav span{overflow:hidden;}
ul.nav li {float:left;}
ul.nav ul li {float:none;}
ul.nav ul a {text-align:left;white-space:nowrap;}
ul.nav li:hover{position:relative;}
ul.nav li:hover>a{color: #aaffaa;text-decoration:none;-webkit-transition: color .3s;}
ul.nav li a:hover{position:relative;color: #aaffaa;text-decoration:none;-webkit-transition: color .3s;}
ul.nav ul img {width:16px;height:16px;}
ul.nav a:hover ul{display:block}
ul.nav span{display:block;background-image:url(images/arrow.gif); background-position:right center; background-repeat: no-repeat; padding-right:30px;}
ul.nav ul span, ul.nav a:hover table span,
ul.nav ul li:hover > a span,
ul.nav table a:hover span {background-image:url(images/arrow.gif);}

/* Temporarily closed */
.semitransparent {z-index: 100; background-color: rgba(0,0,0,.7); position: absolute; left: 0; top: 0; width: 100%;height: 100%; }
#center .semitransparent  {position: fixed; overflow: hidden}
.closed { position: fixed; width: 500px; margin:200px 24% 0 25%; padding: 25px 40px; background-color: #aacc99; border: 5px solid white;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.closed p{font-size: 18px; color: #335511;}
.closed p a:link, .closed p a:visited{ color: #224400; text-decoration: none; background-color: #ddffcc; padding: 0 5px}
.closed p a:hover {color: #000000; text-decoration: none;background-color: #fffffe;  padding: 0 5px}



/* Footer */
div#footer{ clear: both; margin: 25px 0; padding: 10px 25px; text-align: left; border-top:1px solid #353; color: #666; font-size: 12px; }
div#footer a {color: #666; text-decoration: none; border-bottom: 1px dotted #666; margin: 0 5px; padding: 1px;  -webkit-transition: color .3s;}
div#footer a:hover {color: #afa; text-decoration: none; border-bottom: 1px dotted #9a9;  -webkit-transition: color .3s;}

/* New site */
.semitransparent {z-index: 999; background-color: rgba(0,0,0,.6); position: absolute; left: 0; top: 0; width: 100%;height: 100%; }
#center .semitransparent  {position: fixed; overflow: hidden}
.closed { position: fixed; width: 40%; margin:20% 30% 0 30%; padding: 25px 40px; background-color: #000; border: 5px solid white;-webkit-border-radius: 5px;-moz-border-radius: 5px; border-radius: 5px;}
.closed p{font-size: 15px; color: #eee; line-height: 1.4em}
.closed p a:link, .closed p a:visited{ color: #eee; text-decoration: none; background-color: #222; padding: 0 5px; border:none;}
.closed p a:hover {color: #fff; text-decoration: none;background-color: #444;  padding: 0 5px;border:none;}
body {height: 90%; overflow-y: hidden;}