@import url(reset.css);

body {
	text-align: center;
	font-family: arial, verdana, sans-serif;
	font-size: 100%;
	background: #fafafa;
	line-height: 1em;
}

h1  {
	position: absolute;
	left: -9999px;
}

div#container {
	text-align: left;
	position: relative;
	width: 990px;
	margin: 0 auto;
	border: 1px #D0E8D6 solid;
	background: url(/images/site/main_bg.png) top left repeat-y;
}

div#masthead {
	width: 990px;
	height: 80px;
}

div#masthead a {
	width: 230px;
	float: right;
	padding:0;
}

.offleft {
	position: absolute;
	left: -9999px;
}

ul#nav {
	width:100%;
	overflow:hidden;
	background: url(/images/site/nav_bg.png) top left repeat-y;
	font-family: "Century Gothic", arial, verdana, sans-serif; 
	font-size: 0.9em;
}

ul#nav li {
	display: inline;
	line-height:24px;
}

ul#nav a, 
ul#nav a:visited { 
	color: #007926; 
	text-decoration: none;
    position:relative;
	letter-spacing: 1px;
	font-weight: bold;
	padding: 4px 24px;
}

ul#nav li a.current:visited, 
#nav a.current, 
#nav a.current:hover {
	color: #71AE01;
	background: #F9FCF6;
}

ul#nav li a:hover {
	background: #9DC31A; color: #fff;
}


ul#nav li a:active {
	color: #9DC31A;
	background: #71AE01;	
}

div#contentwrap {
	position: relative;
	width: 990px;
}

div#content {
   position: relative;
   width: 760px;
   height: 480px;
   overflow: hidden;
   background: #333;
}

div#mainboxwrap {
	position: relative;
	margin-top:200px;
}

div#mainbox { /* height and margin set in page */
   	position: absolute; 
	top: 50%;  /* vertically centres top edge */ 
	left: 20px;
	width: 590px; /* butting to inset: 600 */
	padding: 0;
	}

/*	Applies the trans background allowing links to work */

/*  html > body hides this rule from IE6 and below, which are served 
	by the ie6.css stylesheet. */

html > body div#mainbox-bg {
	background: url(/images/site/mainbox_bg-trans.png) top left;
	width: 570px;
	height: 100%;
	padding-left: 20px;
	overflow: auto;
}

div#mainbox h2 { 
	font-size: 0.9em;
	line-height:130%;
	/*background: #dedede;*/
	/*letter-spacing: 1px;*/
	color: #222;
	margin-left: -1px;
	padding: 1em 20px 0 0;
	/*text-align: center;*/
}

div.maincol { 
	display: inline; /* IE doubled margin bug */
	float: left;
	width: 256px; /* butting to inset: 272 */
	margin: 0 20px 0 0;
}

div.maincol h2 {
	font-size: 0.92em;
	color: #111;
	margin: 0.1em 0 0 0;
}

div.maincol h3 {
	font-size: 0.82em;
	color: #111;
	margin: 1em 0 -1.2em 0;
	background: url(/images/site/bullet.gif) 0px 3px no-repeat;
	padding-left: 12px;
}

div.maincol p, 
div.maincol ul li, 
div#gallery-index p  {
	font-size: 0.76em;
	line-height: 1.32em; /* Safari no like percentage */
	color: #111;
	margin: 1.3em 0;
	padding-left: 12px;
	background: url(/images/site/bullet.gif) 0px 3px no-repeat;
}

div.about p, 
div .contact p, 
div .contact h3 {
	padding-left: 0px;
	background: none!important;
}

div.maincol.contact ul li {
	font-size: 0.8em;
	font-weight: bold;
	line-height:1.8em;
	list-style: disc; 
	padding-left:0px!important;	
	margin-left:15px!important;
	background: none!important;
}

div .contact ul li a, 
div .contact ul li a:visited {
	text-decoration: none;
	color: #5C1000;
}

div.map a {
	position:absolute; 
	height:203px; 
	width:236px;
	background: url(/images/_contact/map.gif) no-repeat;
	border: 2px #82B187 solid;
}

div.map a:hover {
	border: 2px #1D842D solid;
}

div p.nobull {
	background: none;
}

div.maincol ul {
	margin: 0.99em 0 0.99em 0;
}

div.maincol ul li {
	margin:0;
	margin-left: 0px;
	padding-left: 12px;
	background: url(/images/site/li_bullet.gif) 0px 3px no-repeat;
}

p.moreback a, p.moreback a:visited {
	font-size: 1.2em;
	font-weight: bold;
	text-decoration: none;
	letter-spacing: 1px;
	color: #5C1000;
	margin-top: -5px;
    float: right;
	}

p.moreback a:hover, div .contact ul li a:hover {
	color: #A51700;
	text-decoration: underline;
}

div#inset {
	position: absolute;
	top: 80px;
	right: 0px;
	width: 130px;
	height: 320px;
	overflow: hidden;
}

div#sidebar {
 	position: absolute;
	top: 80px;
	right: 0px;
	width: 230px;
	height: 320px;
	overflow: hidden;
}

div#brands { /* SGD and other logos */
	position: absolute;
	top: 0;
	right: 10px;
}

div#brands img {
	margin:15px 10px 10px 0px;
	}
	
div#brands div {
	margin:15px 10px 10px 0px;
	}

div#info {
	position: absolute;
	top: 402px;
	right:16px;
	overflow:visible;
	text-align: right;
	 color: #2A9049;
	z-index: 3;
	background: #C9E3CE;
}

div#info h3 {
	font-size: 0.82em;
	margin-top: 2px;
}

div#info p {
	font-size: 0.7em;
	line-height: 1.1em;
	margin-top: 0px;
}

div#info p a, div#info p a:visited {
	margin-top: -1px;
	color: #2A9049;
	text-decoration: none;
}

div#info p a:hover {
	color: #135D22;
}

div#footer {
	clear: both;
	width: 990px;
	height: 10px;
	background: url(/images/site/footer_bg.png) top left repeat-y;
}

#footer ul {
	float: right;
	margin-right: 8px;
}

#footer li {
	display: inline;
}

#footer li a {
	color: #2A9049;
	text-decoration: underline;
	width:100%;
	font-size: 0.7em;
	line-height: 1.5em;
	font-weight: bold;
	padding: 0.35em 0.26em 0.3em 0.26em;
}

#footer li a:hover {
	color: #71AE01;
	background: #F9FCF6;
	text-decoration: none;
}

p#smallprint {
	position: relative;
	bottom: 0px;
	display: block;
	color: #60AC73;
	font-family: verdana, arial, sans-serif;
	font-size: 0.58em;
	text-align: center;
	width: 990px;
	line-height: 1em;
	letter-spacing: 0px;
	margin-top:0.6em;
	height:1.5em;
}

/* Gallery */

/* Gallery Index */

div#gallery-side {
	position: absolute;
	top: 80px;
	right: 0px;
	width: 360px;
	height: 320px;
	overflow: hidden;
}

div#gallery-index {

}

div#gallery-index ul {
    margin: 20px 0;
}

div#gallery-index ul li {
	position: relative;
	height: 96px;
	width: 96px;
    overflow: hidden;
	margin: 0 12px 12px 0;  
	border: 2px #fff solid;
	float: left;
	display: inline;
}

div#gallery-index ul li a:link, 
div#gallery-index ul li a:visited { 
	position: absolute;
	height: 100%;
	width: 100%;
	display: block;
	height: 100%;
	width: 100%;
    background:#ccc;    
}

div#gallery-index ul li a:link img, 
div#gallery-index ul li a:visited img {
	position: relative;
	margin-top: -96px; /* IE7 no like top: */
}

div#gallery-index ul li a:hover img {
	margin-top: 0px; /* ditto */
}


/* Gallery section page */

div#gallery-section {
    /*width: 570px;*/
}

div#gallery-section p {
	font-size: 0.80em;
	line-height: 132%;
	width: 540px;
	margin: 1.3em 0; 
}

div#gallery-section ul {
    margin: 10px 0 0 0;
	width: 550px;
	text-align: center; 
	float: left;
}

div#gallery-section ul li {
	/*position: relative; - Makes IE7 unable to scroll thumbs */
	height: 66px;
	width: 88px;
    overflow: hidden;
	margin: 0 10px 10px 0;
	display: inline; 
}

div#gallery-section ul li a:link, 
div#gallery-section ul li a:visited { 

}

div#gallery-section ul li a img {
	border: 3px #fff solid; 
}

div#gallery-section ul li a:hover img {
	border: 3px #1D842D solid;
}

div#gallery-section ul li a:active img {
	border: 3px #9DC31A solid;
}

div#gallery-section-info {
float: left;
}

div#gallery-section-info p {
	font-size: 0.7em;
	color: #666;
	text-align: center;
	line-height: 150%;
}

div#gallery-section-info p a, 
div#gallery-section-info p a:visited {
	font-size: 1.2em;
	font-weight: bold;
	text-decoration: none;
	letter-spacing: 1px;
	color: #5C1000;
	margin: 8px auto;
	display: block;
	}

div#gallery-section-info p a:hover {
	color: #A51700;
	text-decoration: underline;
}

/* SGD rollover */

#sgd  {
width:55px;
height:60px;
background-image:url(../images/site/sgd-hover.jpg);
background-repeat:no-repeat;
text-indent:-9999px;
float:left;
}

#sgd a {
display:block;
width:55px;
height:60px;
border:0;
}

#sgd a:hover {
background-image:url(../images/site/sgd-hover.jpg);
background-position:bottom;
background-repeat:no-repeat;
width:55px;
height:60px;
}