/* ---------------------------------------------------------------------------------------------------------- */
/* RESET */
* { margin: 0; padding: 0; text-decoration: none; font-size: 100%; outline: none; }
code, kbd, samp, pre, tt, var, textarea, input, select, isindex { font: inherit; font-size: 1em; }
* html code, * html kbd, * html samp, * html pre, * html tt,
* html textarea, * html input, * html select, * html isindex { font-family: serif; }
dfn, i, cite, var, address, em { font-style: normal; }
th, b, strong, h1, h2, h3, h4, h5, h6 { font-weight: normal; }
a, img, a img, iframe, form, fieldset, abbr, acronym, object, applet { border: none; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th, td, center { text-align: left; vertical-align: top; }
body { line-height: 1em; background: white; }
q { quotes: "" ""; }
ul, ol, dir, menu { list-style: none; }
sub, sup { vertical-align: baseline; }
a { color: inherit; }

/* ---------------------------------------------------------------------------------------------------------- */
/* PAGE WIDE DEFINITIONS */
body			{background-image:url(../site_images/bg_tile.gif); font-size:small; font-family:Arial, sans-serif; padding:20px; line-height:1.5em;}
a				{font-weight:bold; color:black;}
a:hover			{color:#ec008c;}
h2				{font-weight:bold; padding:6px; background-color:#fff200; }
img 			{behavior: url(iepngfix.htc)}
p				{margin-bottom:0.8em;}
ul 				{margin-left:13px; list-style:disc;} 

/* ---------------------------------------------------------------------------------------------------------- */
/* PAGE LAYOUT */
div#container	 {position:relative;}
div#logo 		 {margin-left:3px; width: 213px; height: 65px; background-image: url(../site_images/title_no_crosses.gif); text-indent: -1000px; position:relative; }
div#flash_anim { position:absolute; width:90px; height:20px; left:147px;top:63px;}
/* class for a menu item - small square */
div.menublock	 {position:absolute;width:180px;height:180px; padding:20px; color:white; z-index:3; cursor:pointer;}

/* ids for each of the four squares to give each one abs. positioning and correct colour */
div#menuAbout	 {left:220px;top:124px;background-color:#404041;}
div#menuPrint	 {left:464px;top:124px;background-color:#ec008c;}
div#menuCommerc	 {left:220px;top:368px;background-color:#00aeef;}
div#menuContact	 {left:464px;top:368px;background-color:#fff200; color:black;}

/* The opening button for each menu item */
div.menublock img.menuExpander {position:absolute; left:20px; bottom:20px;}

/* class for page - large square */
div.pageContent {position:absolute;width:424px;height:424px; padding:20px; color:white; left:220px; top:124px; z-index:4}

/* ids for each of the three large pages and five commerce sections- with bg colour */
div#pageAbout					{background-color:#404041;}
div#pagePrint					{background-color:#ec008c;}
div#pageContact					{background-color:#fff200; color:black;}
div#pageCommerc_home			{background-color:#00aeef;}
div#pageCommerc_design			{background-color:#00aeef;}
div#pageCommerc_photography		{background-color:#fff200; color:black;}
div#pageCommerc_visualisation	{background-color:#ec008c;}
div#pageCommerc_brochures		{background-color:#58595b;}

/* Extra id for the contact page - allows us to abs. position contact details */
div#pageContact	div#pageContactContent {
	position:absolute;
	left: 72px;
	top: 170px;
}

/* Login button for brochure page */
div#pageCommerc_brochures a#brochureLogin { position:absolute; right:20px;bottom:20px; }

/* close button holder for large pages */
div.pageContent a.pageCloser { position:absolute; top:20px; right:20px; }

/* a H1 to go inside the menus and the pages */
div.menublock,div.pageContent h1 { font-size:large; }

div.pageCommercContent {
	position:absolute;
	top:104px;
	left:0px;
	width:404px;
}

/* left hand menu for commerce */
div#commerceMenu {
	width:179px;
	height:156px;
	position:absolute;
	top:124px;
	left:200px;
	padding:5px;
	z-index:1;
}

/* right hand panel for commerce */
div#commercePic {
	width:187px;
	height:424px;
	background-color:red;
	position:absolute;
	top:124px;
	left:444px;
	padding:20px;
	z-index:2;	
}

div#commerceMenu div.divider {
	margin:0;
	margin-left:5px;
	padding:0;
	border-top:1px solid white;
}
div#commerceMenu img.menuitem {
	margin-top:10px;
	margin-bottom:10px;
	margin-left:5px;
}

div#footer 		 {position:absolute;left:20px;top:668px;cursor:pointer;}