/*--------------------
      CSS RESETS
--------------------*/

html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; padding: 0;
	border: 0; outline: 0;
	text-decoration: none;
}

ol, ul { list-style: none; } /* clear styles of lists, must add back manually */

dd, blockquote {  margin-left: 1em; } /* for indented elements */

blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

form label { cursor: pointer; }
input, select, textarea { font-family: inherit; }

caption, th, td { text-align: left; font-weight: normal; }

.clearfix { clear: both; }
.right { float: right; }
.left { float: left; }
.center { text-align: center; }

.text-left { text-align: left; }
.automargin { margin: 6px auto; }

/*----------------------
		LAYOUT
----------------------*/

body { 
	background: #00ccff url(layout/body-bg.png) repeat-x;
	font-family: Verdana, Geneva, sans-serif;
	text-align: center;		/* centers the wrapper in IE */
}

#wrapper {
	margin: 0 auto;
	overflow: hidden;
	text-align: left;
	width: 960px;
}

#header {
	background: url(layout/header-bg.png) no-repeat;
	height: 243px;
}

#menu-wrapper {
	margin: 0px 18px 0px 13px;
	float: left;
	width: 214px;
}

#content-wrapper {
	float: right;
	overflow: hidden;
	width: 715px;
}

/*----------------------
	   NAVIGATION
----------------------*/

ul.menu, ul.menu ul {
	width: 214px;
	font-size: 14px;
}

ul.menu a {
	display: block;	
}

ul.menu li.level1 {
	background: url(layout/bullet-active.png) 25px 12px no-repeat;
}

ul.menu li a, ul.menu li.topli a, ul.menu li.bottomli a {
	color: #fff;	
	padding: 8px 8px 8px 40px;
}
	
	ul.menu li a { background: url(layout/menu-hr.png) 0 0 no-repeat; }

	ul.menu li.topli a { background: none; }

ul.menu li a:hover {
	color: #015f95;
}

ul.menu li ul li a {
	background: url(layout/bullet-inactive.png) 40px 10px no-repeat;
	font-size: 12px;
	padding-left: 55px;
}

ul.menu li ul li a:hover {
	color: #c6ff01;
}

/*----------------------
	   CONTENT
----------------------*/

#content-top {
	background: url(layout/content-top-bg.png) no-repeat;
	height: 45px;
	width: 715px;
}

#content-middle {
	background: url(layout/content-middle-bg.png) repeat-y;
	color: #33466a;
	font-size: 12px;
	height: auto;
	overflow: hidden;
	width: 715px;
}

	#content-middle a {
		font-family: Georgia, "Times New Roman", Times, serif;
		font-style: italic;
		color: #02a9d3;
	}
	
	#content-middle a:hover { color: #e77904; }

	.column1 {
		float: left;
		margin: -8px 0 8px 33px;
		width: 298px;
	}
	
	.column2 {
		float: right;
		margin: -8px 61px 8px 0;
		width: 298px;
	}
	
		#twitter_update_list, #twitter_update_list a {
			background: #b6def8;
			font-size: 11px;
			color: #5b7097;
			list-style: none;
			line-height: 18px;
			margin-top: 8px;
			padding: 20px;
		}
		
			#twitter_update_list a { color: #33466a; }
			#twitter_update_list a:hover { text-decoration: underline; } 
			
		#twitter-bird {
			background: url(layout/twitter-bottom-bg.png) no-repeat;
			font-size: 11px;
			height: 37px;
			margin-bottom: 8px;
			padding: 42px 0 0 87px;
		}
	
	.column-main {
		float: left;
		margin: -8px 61px 0 33px;
		width: 620px;
	}
	
		a.bme {
			background: #b6def8;
			border: 1px solid #02a9d3;
			color: #33466a;
			padding: 2px 4px 2px 4px;
		}
		
		a.bme:hover {
			background: #c7e8fd;
		}
		
		ul.faq { 
			list-style: inside circle;
			line-height: 18px;
			margin-left: 25px;
		}
		
		ul.aftercare {
			list-style: circle;
			line-height: 24px;
			margin-left: 15px;
		}
		
		ul.aftercare li { padding: 6px 0 6px 0; }
		
		table { border: 1px solid #02a9d3; }
		th, td { padding: 6px; text-align: center; border: 1px solid #02a9d3; }
		th { background-color: #02a9d3; }
		
		table.convert1 { 
			margin: 0px 40px 0 80px;
		}
		
		.insertremove {
			margin: 6px auto;
			text-align: center;
		}
		
			.insertremove img, img.artists, img.jewellery { border: 2px solid #59DEFF; }
			
			img.artists { margin: 6px 25px 6px 0px; }
		
			.insertremove-first {
				float: left;
				margin-right: 25px;
				text-align: center;
			}
			
			.insertremove-last {
				float: right;
				text-align: center;
			}

#content-bottom {
	background: #00ccff url(layout/content-bottom-bg.png) no-repeat;
	color: #056a84;
	font-size: 11px;
	height: 30px;
	text-align: center;
	width: 715px;
	padding-top: 40px;
}

	#content-bottom a { color: #014f6c; font-size: 11px; }
	#content-bottom a:hover { color: #e0e2f6; font-size: 11px; }

/*----------------------
	   PORTFOLIO
----------------------*/

.portfolio {
	margin: 0px 37px 0px 37px;
}

.portfolio li {
	float: left;
	margin: 6px;
}

.portfolio li a img {
	background: #a0d2f9;
	border: 1px solid #a0d2f9;
	display: block;
	padding: 3px;
}

.portfolio li a:hover img {
	background: #d8e0f6;
	border: 1px solid #e77904;
	display: block;
	padding: 3px;
}

/*----------------------
	 	TEXT
----------------------*/

p {
	line-height: 24px;
	padding: 8px 0 8px 0;
}

b, strong { color: #0993b7; }
i, em { color: #0993b7; }

h1, h2, h3, h4, h5, h6 {
	color: #02a9d3;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	font-weight: normal;
	padding: 8px 0 8px 0;
}

th { color: #FFF; }

/*----------------------
	 	LIGHTBOX
----------------------*/

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #59DEFF; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #59DEFF; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #4f679e; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

/*---------------------------
		SUY IE OUTDATED
---------------------------*/

.ui-dialog {
  border: 0;
  width: 550px;
  margin: 0px auto;
  font: 12px Arial, Helvetica, sans-serif;
  text-align: center;
  background: transparent;
}
.ui-dialog-container {
  width: 550px;
}
.ui-dialog-titlebar {
  background: url(images/ie6/curve-top.gif) no-repeat;
  border: 0;
  font-size: 0;
  line-height: 0;
  height: 18px;
}
.ui-dialog-titlebar-close {
  position: absolute;
  right: 10px;
  top: 10px;
}
.ui-dialog-buttonpane {
  background: transparent;
  border: 0;
  text-align: right;
  padding: 0 20px 10px 0;
  width: 530px;
  left: 0px;
}
.ui-dialog-buttonpane button {
  padding-left: 10px;
}

.suy {
  background: #1a1a1a;
  padding: 0;
}
.suy_content {
  color: #999;
  position: relative;
  width: 550px;
}
.suy_title {
  background: url(images/ie6/heading-main.gif) no-repeat center bottom;
  font-size: 1px;
  height: 43px;
  margin: 0 auto;
  padding: 0;
  text-indent: -9999px;
  width: 550px;
}
.suy_subtitle {
  font-size: 14px;
  margin: 8px 0 11px;
}
.suy_eightup {
  display: block;
  height: 45px;
  width: 550px;
}
.suy_eightup a {
  background: url(images/ie6/IE.jpg) no-repeat;
  padding: 10px 45px 35px 0;
  font-size: 0;
  line-height: 0;
}
.suy_eightup_label {
  margin: 2px 0 22px;
}
.suy_eightup_label a {
  color: #999;
  text-decoration: none;
}
.suy_upgrade {
  float: left;
  display: inline;
  text-align: left;
  padding-left: 35px;
  width: 270px;
}
.suy_upgrade h3 {
  background: url(images/ie6/heading-upgrade.gif) no-repeat;
  font-size: 0;
  line-height: 0;
  margin: 0;
  height: 13px;
  width: 146px;
}
.suy_upgrade dl {
  line-height: 1.4;
  margin: 7px 0 0 2px;
}
.suy_upgrade dt {
  color:#e6e6e6;
}
.suy_upgrade dd {
  font-size: 11px;
  margin-left: 20px;
}
.suy_browsers {
  float: left;
  font-size: 14px;
  text-align: left;
  width: 220px;
  margin-left: 20px;
}
.suy_browsers h3 {
  background: url(images/ie6/heading-browsers.gif);
  font-size: 0;
  line-height: 0;
  margin: 0;
  height: 13px;
  width: 152px;
}
.suy_browsers a {
  color: #e6e6e6;
  display: block;
  padding: 4px 0 8px 44px;
  text-decoration: none;
  width: 145px;
}
.suy_browsers ul {
  list-style: none;
  margin: 0;
  padding: 9px 0 0 0;
}
.suy_browsers ul li {
  height: 39px;
  margin: 0;
  padding: 0;
}
.suy_chrome {
  background: url(images/ie6/Chrome.jpg) no-repeat;
}
.suy_firefox {
  background: url(images/ie6/Firefox.jpg) no-repeat;
}
.suy_safari {
  background: url(images/ie6/Safari.jpg) no-repeat;
}
.suy_opera {
  background: url(images/ie6/Opera.jpg) no-repeat;
}