* { margin: 0; padding: 0; }

html { }

body { color: #000; font: 0.7em/1.4em Arial, Verdana, sans-serif; width: 790px; margin: 0px auto; background: #fff; }

/*style to fit with new cms*/
.left { float: left; }
.right { float: right; }
.clear { clear: both; }

img.left { margin: 0px 10px 10px 0px }
img.right { margin: 0px 0px 10px 10px }
img.center { display: block; margin: 0px auto; }

img.small { width: 75px; }
img.medium { width: 150px; }
img.large { width: 350px; }

a img { border: 0 none; }

/*
colours
========================
orange:  		#eea402
green(dark)		#0b8d60
green(light)	#97d8a2
*/

/* Main Layout */

#header,
#footer,
#container { margin: 0px auto; display: block; width: 790px; }

#container { background: url(/site/images/page-bg-repeat.gif) repeat-y top center; }

/* Header Items */

#header { height: 100px; background: url(/site/images/header-bg.gif) no-repeat top center; xborder: #fcc dotted 1px; }

#header h1 { font-size: 1.8em; padding: 54px 0px 0px 224px; color: #0b8d60; display: block; line-height: 110%; xborder: #fcc dotted 1px; }

/* Central Content */

#container #left { display: block; width: 200px; height: 395px; float: left; background: url(/site/images/menu-bg.gif) no-repeat 20px 0px; padding-left: 20px; }

#container #central { display: block; width: 292px; height: 391px; float: left; background: url(/site/images/content-bg-centre.gif) no-repeat top left; margin-left: 4px; }

#container #central #text { height: 55px; background: none; margin: 80px 0px 0px 0px; }

#container #central #text h1 { font-size: 1.6em; color: #000; text-align: right; padding: 10px 10px 0px 0px; }

#container #central #text p { font-size: 1.3em; color: #000; text-align: right; padding: 5px 10px 0px 0px; } 

#container #central #text p a { text-decoration: none; color: #000; }

#container #central #text p a:hover { color: #eea402; }

#container #central.sml { height: 154px; background: url(/site/images/content-bg-centre-sml.gif) no-repeat top left; }

#container #right { display: block; width: 250px; height: 395px; float: left; background: url(/site/images/content-bg-right.gif) no-repeat top left; margin-left: 4px; }

#container #right h2 { font-size: 1.6em; color: #fff; padding: 15px 20px; }

#container #right p { font-size: 1.3em; color: #fff; padding: 0px 20px 10px 20px; }
#container #right a { text-decoration: underline; color: #000; }

#container #right.menu { height: 158px; background: url(/site/images/content-bg-right-menu.gif) no-repeat top left; }

#container #data { float: left; width: 522px; margin: 0px 4px; xborder: red dashed 1px; }

/* Left Menu Items */

#menu { width: 200px; height: 395px; margin: 0px; }

#menu ul { list-style: none; margin: 0px; }

#menu ul li { display: block; height: 75px; margin-bottom: 4px; float: left; }

#menu ul li.last { margin-bottom: 0px; }

#menu ul li a { display: block; width: 200px; height: 75px; line-height: 75px; text-indent: 20px; font-size: 1.3em; font-weight: bolder; color: #fff; text-decoration: none; float: left; }

#menu ul li a:hover { color: #eea402; }

/* Right Menu Items */

#menuright ul { list-style: none; margin-left: 0px; font-size: 1.1em; }

#menuright ul li { background: url(/site/images/bullet.gif) no-repeat 10px 8px; height: 30px; margin-bottom: 1px; padding-left: 30px; float: left; xfont-weight: bold; }

#menuright ul li.last { margin-bottom: 0px; }

#menuright ul li a { display: block; height: 30px; width: 210px; line-height: 30px; color: #fff; text-decoration: none; float: left; }

#menuright ul li a:hover { color: #eea402; }

/* Footer Items */

#footer { clear: both; text-align: center; background: url(/site/images/footer-bg-content.gif) no-repeat top center; height: 116px; }

#footer.content { background: url(/site/images/footer-bg-content.gif) no-repeat top center; }

#footer p { text-align: right; padding: 70px 40px 0px 0px; }
#footer span { padding-right: 10px; color: #eea402; }
#footer p a { color: #666; text-decoration: none; }
#footer p a:hover { color: #eea402; }

/* Main content layout */

/* Site Styles */

.clearfix { clear: both; height: 1px; overflow: hidden; }
#container #data { line-height: 150%; padding: 10px; }
#container #data h1 { padding: 10px 0px; color: #eea402; font-size: 2.0em; }
#container #data h2 { padding: 10px 0px; color: #000; font-size: 1.6em; }
#container #data p { padding: 10px 0px; }
#container #data ul { margin-left: 40px; }
#container #data a { color: #0b8d60; }
#container #data a:hover { color: #eea402; }


/* Styles for scrolling layers - Specify width and height in hold and wn, and in clip for wn */
#hold { position:relative; overflow:hidden; width: 420px; height: 250px; z-index: 100; xborder: green dashed 1px; float: left; margin-top: 20px; }
#wn	{ position:absolute; left: 0px; top: 0px; width: 420px; height: 250px; clip: rect(0px, 420px, 250px, 0px); overflow: hidden; z-index:1; xborder: blue dashed 1px; }
#lyr1 { position: absolute; xvisibility: hidden; xleft: 0px; xtop: 0px; z-index:1; xborder: red dashed 1px; top: 0px; left: -400px; visibility: visible; }
  
/* table containing images. adjust according to your images' sizes and numbers */
#t1 { xwidth: 3000px; xborder: yellow solid 1px; height: 250px; }
#t1 .book { width: 175px; float: left; xborder: green dashed 1px; text-align: center; }  
#t1 .book img{ xwidth: 150px; border: 0px; }  

.toggle { float: left; height: 100px; width: 47px; margin-top: 20px; }
.toggle a { line-height: 225px; }
.toggle img { border: 0px; }