/* - - - - - - - - - - - - - - - - - - */
/* Alchemia     	             	    */
/* Design, Development & Maintenance   */
/* Eskymo New Media Design             */
/* http://www.my-igloo.net             */
/* - - - - - - - - - - - - - - - - - - */

/* COLOURS
DARK GREY		#505A63
MID GREY		#808C97
LIGHT GREY	#A0AAB2
*/

/* RESET */
/* -------------------------------------------------------------------------------------------*/
* 			{ margin:0; padding:0 }
body 		{ font-size: small; font-family:Arial, Helvetica, sans-serif; color: #A0AAB2; text-align:left;}
* html body 	{ font-size: x-small; /* for IE5/Win */ f\ont-size: small; /* for other IE versions */ }

/* The below restores some sensible defaults */
strong 	{ font-weight: bold }
em 		{ font-style: italic }
a img 	{ border:none } /* Gets rid of IE's blue borders */


/* TEXT LINKS TO BE BROWN WITHIN THE COPY */
/* -------------------------------------------------------------------------------------------*/
a:link, a:visited { color: #505A63; text-decoration: underline; }
a:hover, a:active { color: #505A63; text-decoration: none; }


/* FLOATED ELEMENTS */
/* -------------------------------------------------------------------------------------------*/
.left 	{ float: left; }
.right 	{ float: right;}

.clearleft 	{ clear: left; }
.clearright 	{ clear: right; }
.clearboth 	{ clear: both; }


/* TYPOGRAPHY */
/* -------------------------------------------------------------------------------------------*/
h1	{font-size: 170%; font-weight:normal; color: #505A63; margin: 0px 0px 20px 0px; }
h2	{font-size: 110%; font-weight: normal; color: #505A63; }
h3 	{font-size: 140%; font-weight:normal; color: #505A63;}
h4	{ font-size: 170%; font-weight:normal; }
p	{ line-height: 1.5em; font-size: 90%; }



/* LANDING PAGE ONLY */
/* -------------------------------------------------------------------------------------------*/
#landingwrapper {
	width: 600px;
	margin: 0 auto;
	padding-bottom: 30px;
}

#landingwrapper a:link, #landingwrapper a:visited { color: #A0AAB2; text-decoration: none; }
#landingwrapper a:hover, #landingwrapper a:active { color: #A0AAB2; text-decoration: underline; }

#landingwrapper h1 {
	margin: 0px 0px 10px 0px;
}

#landingwrapper h2 {
	font-size: 140%;
	padding-bottom: 15px;
}

#landingwrapper h1, #landingwrapper h2, #landingwrapper h3, #landingwrapper p {
	text-align: center;
}

#landingwrapper .left, #landingwrapper .right {
	width: 300px;
	margin: 0 auto;
	padding-top: 8px;
}



/* MAIN WEBSITE ONLY */
/* -------------------------------------------------------------------------------------------*/

/* TOP GREY BAR */
/* -------------------------------------------------------------------------------------------*/
#topstrip {
	background: #f8f8f9;
	padding: 5px 0px;
	margin: 0;
}

#topstripinfo {
	width: 1000px;
	text-align: right;
	margin: 0 auto;
	font-size: 90%;
}

#topstripinfo p em {
	color: #505A63;
	font-style: normal;
}

/* WRAPPER FOR THE WHOLE SITE */
/* -------------------------------------------------------------------------------------------*/
#wrapper {
	width: 1000px;
	margin: 0 auto;
}

/* LEFT AND RIGHT FOR LOGO AND NAVIGATION */
/* -------------------------------------------------------------------------------------------*/
#header .left {
	width: 370px;
}

#header .right {
	width: 630px;
}

/* NAVIGATION SITS WITHIN WRAPPER AND IS 920PX WIDE */
/* -------------------------------------------------------------------------------------------*/
#navigation {
	width: 630px;
	height: 120px;
	margin: 0 auto;
	padding: 0px;
	background: url(assets/primarynav.gif) no-repeat;
}

#nav {
	width: 630px;
	height: 120px;
	background: url(assets/primarynav.gif) no-repeat;
	margin: 0px;
	padding: 0px;
	position: relative;
}

#nav li {
	margin: 0px;
	padding: 0px;
	list-style: none;
	display: block;
	position: absolute;
	text-indent: -3000px;
}

#nav a {
	display: block;
	height:22px;
	text-decoration: none;
}

/* POSITION OF THE NAVIGATION BUTTONS
---------------------------------------------------------------------------------------------------------------*/
#home		{left:0px; top:76px; width:51px; height:22px;}
#about	 	{left:84px; top:76px; width:54px; height:22px;}
#jewellery	{left:168px; top:76px; width:84px; height:22px;}
#bespoke		{left:285px; top:76px; width:149px; height:22px;}
#visitus	 	{left:465px; top:76px; width:65px; height:22px;}
#contact	 	{left:562px; top:76px; width:68px; height:22px;}

#home a, #about a, #jewellery a, #bespoke a, #visitus a, #contact {height:22px;}

/* HOVER AND ACTIVE STATES OF THE NAVIGATION BUTTONS
---------------------------------------------------------------------------------------------------------------*/
#home a:hover, #home .active 			{background:url(assets/primarynav.gif) -0px -197px no-repeat; width:51px; height:22px;}
#about a:hover, #about .active 		{background:url(assets/primarynav.gif) -84px -197px no-repeat; width:54px; height:22px;}
#jewellery a:hover, #jewellery .active 	{background:url(assets/primarynav.gif) -168px -197px no-repeat; width:84px; height:22px;}
#bespoke a:hover, #bespoke .active 	{background:url(assets/primarynav.gif) -285px -197px no-repeat; width:149px; height:22px;}
#visitus a:hover, #visitus .active 	{background:url(assets/primarynav.gif) -465px -197px no-repeat; width:65px; height:22px;}
#contact a:hover, #contact .active 	{background:url(assets/primarynav.gif) -562px -197px no-repeat; width:68px; height:22px;}


/* CONTENT */
/* -------------------------------------------------------------------------------------------*/
#content2column 		{background: url(assets/bgrpt_2columns.gif) repeat-y top left;}
#content2column .left 	{width: 340px;}
#content2column .right 	{width: 630px;}

#content2column .left h1, #content2column .left h2, #content2column .left h3, #content2column .left p {
	padding: 0px 20px;
	margin: 0px;
}
#content2column .right h1, #content2column .right h2, #content2column .right h3, #content2column .right p {
	padding: 0px 20px 0px 0px;
	margin: 0px;
}

#content2column .left h1, #content2column .right h1 	{margin: 20px 0px 10px 0px;}
#content2column .left h2, #content2column .right h2 	{margin: 0px 0px 10px 0px;}
#content2column .left h3, #content2column .right h3  	{margin: 30px 0px 5px 0px;}
#content2column .left p, #content2column .right p 	{margin: 0px 0px 10px 0px;}

#content2column .left ul {
	padding: 0px 20px 15px 35px;
	margin: 0px;
	list-style-image:url(assets/bullet.jpg);
}
#content3column 		{background: url(assets/bgrpt_3columns.gif) repeat-y top left;}
#content3column .left  	{width: 340px;}
#content3column .right  	{width: 630px;}

#left 				{width: 315px; float: left;}
#right 				{width: 285px; float: right;}

#content3column .left h1, #content3column .left h2, #content3column .left h3, #content3column .left p {
	padding: 0px 20px;
	margin: 0px;
}

#content3column .left ul {
	padding: 0px 20px 15px 35px;
	margin: 0px;
	list-style-image:url(assets/bullet.jpg);
}

#content3column .right h1, #content3column .right h2, #content3column .right h3, #content3column .right p {
	padding: 0px 20px 0px 20px;
	margin: 0px;
}

#content3column .left h1, #content3column .right h1 	{margin: 20px 0px 10px 0px;}
#content3column .left h2, #content3column .right h2 	{margin: 0px 0px 10px 0px;}
#content3column .left h3, #content3column .right h3  	{margin: 30px 0px 5px 0px;}
#content3column .left p, #content3column .right p 	{margin: 0px 0px 10px 0px;}


#videobox {
	padding: 20px;
}

#flashboxhome {
	background: url(images/bgrpt_homepageflash.jpg) top left no-repeat;
	width: 630px;
	height: 460px;
}

#flashboxother {
	background: url(images/bgrpt_otherflash.jpg) top left no-repeat;
	width: 285px;
	height: 500px;
}




/* VISIT US */
/* -------------------------------------------------------------------------------------------*/
#edinburgh {
	width: 305px;
	float: right;
}
#standrews {
	width: 305px;
	float: right;
}

.smalltext {
	font-size: 80%;
	line-height: 2em;
}


/* JEWELLERY LIGHTBOX
------------------------------------------------------------------------*/
#lightboxgallery {
	width: 630px;
}

.thumb01, .thumb02, .thumb03 {
	float:left;
	text-align:left;
	width:160px;
}
.thumb04 {
	float:left;
	text-align:left;
	width:150px;
}

.height { height: 140px;}



/* CONTACT FORM
------------------------------------------------------------------------*/
/* outer fieldset - it's common to make this border : 0; */
fieldset#formwrap { 
  background-color : #ffffff; 
  padding: 10px; 
}

/* section fieldsets - it's common to make this border : 0; */
fieldset { 
  padding: 10px;
  margin: 5px 20px 0px 10px;
  border: 0px;
}

/* form legends and dt "heading" */
legend { 
  font-weight : bold; 
  color : #999999;
  margin: 0px 0px 0px 0px;
  padding: 0px;
}

/* form label text */
label { 
  color : #999999;
  font-size: 90%;
}

/* all inputs, select, and textarea */
input.med, input.short, select.med, textarea.textbox { 
  border: 1px solid #999999;
  background-color: #ffffff;
  color: #999999;
  margin: 3px 0px 7px 0px;
  padding: 2px;
  width: 300px;
}



/* FOOTER */
/* -------------------------------------------------------------------------------------------*/
#footer {
	background: url(assets/bgrpt_footer.gif) top left no-repeat;
	margin: 24px 0px 30px 0px;
	padding: 30px 0px 0px 0px;
	font-size: 90%;
}

#footer .right {
	text-align: right;
}

#footer a:link, #footer a:visited { color: #A0AAB2; text-decoration: none; }
#footer a:hover, #footer a:active { color: #505A63; text-decoration: underline; }
#footer ul 						{ list-style-type: none; margin: 0; padding: 0px 0px 5px 0px; font-size: 90%; }
#footer ul li 						{ display: inline; }