/* =General
--------------------*/


/* Remove padding and margin */
* {
margin: 0;
padding: 0;
}

/* Class for clearing floats */
.clear {
clear:both;
}

/* Remove border around linked images */
img {
border: 0;
}
body {
background-color: #ffffff;
}





/* =Typography
-----------------------------------------------------------------------------*/

body {
font: 90%/1.6 "Verdana", "Lucida Sans", "Trebuchet MS", sans-serif;
color: #668187;
}

p.p1 {
font: 80%/1.5 "Verdana", "Lucida Sans", "Trebuchet MS", sans-serif;
color: #668187;
}
p.spaceafter {
height: .7em;
}
a:link{
color: #43bad4;
text-decoration: none;
}
a:visited{
color: #98b1b8;
text-decoration: none;
}


/* = masthead
-----------------------------------------------------------------------------*/

#container {
position: static;
width: 918px;
height: auto;
margin: 0 auto;
background-color: #ffffff;
padding: 0;
}

#header {
position: relative;
width: 918px;
height: 132px;
background: transparent url(images/khHead.gif) no-repeat top left;
border-bottom: 1px solid #668187;
}


/* = main nav 
---------------------------------------------------------------------*/
#nav{
position: absolute;
left: 758px;
top: 50px;
width: 160px;
margin: 0px;
padding: 0px;
border: 0px;
}

#nav li{
margin: 0; 
padding: 0;
background: transparent;
list-style: none;
}

#nav li a:link,
#nav li a:visited,
#nav li a:hover{
display: block;
height: 18px;
line-height: 18px;
text-indent: -9999px;
border: none;
}

#nav li.btnHome a{ 
background: url(images/btnHome.gif) 0 0 no-repeat; 
}
#nav li.btnHomeOn a{
background: url(images/btnHomeOn.gif) 0 0 no-repeat;
}     	

#nav li.btnColl a{ 
background: url(images/btnColl.gif) 0 0 no-repeat; 
}
#nav li.btnCollOn a{ 
background: url(images/btnCollOn.gif) 0 0 no-repeat; 
}

#nav li.btnAbout a{ 
background: url(images/btnAbout.gif) 0 0 no-repeat; 
}
#nav li.btnAboutOn a{ 
background: url(images/btnAboutOn.gif) 0 0 no-repeat; 
}

#nav li.btnNew a{ 
background: url(images/btnNew.gif) 0 0 no-repeat; 
}
#nav li.btnNewOn a{ 
background: url(images/btnNewOn.gif) 0 0 no-repeat; 
}


#nav li.btnHome a:hover,
#nav li.btnColl a:hover,
#nav li.btnAbout a:hover,
#nav li.btnNew a:hover {
background-position: 0 -18px;
height: 18px;
}

/* = subnav 
-----------------------------------------------------------------------------*/

#subnav {
position: relative;
width: 918px;
height: 2.1em;
margin: 0;
padding: 0;
background: #fff;
font: 90%/1.6 Tahoma, Verdana, sans-serif;
}

#subnav ul {
list-style: none;
margin: 0;
padding: 0;
height: 1.6em;
border-bottom: 1px dotted #668187;
}

#subnav ul li {
float: right;
}

#subnav ul a {
display: block;
color: #668187;
line-height: 1.6em;
text-decoration: none;
background: #fff;
margin: 0;
padding: 0 4px 0 28px;
}

#subnav ul a:hover {
background: #d3dbdc;
}

body.about #subnav a#about:hover,
body.locations #subnav a#locations:hover,
body.contact #subnav a#contact:hover,
body.birthstones #subnav a#birthstones:hover
body.other #subnav a#other:hover,
body.bridal #subnav a#bridal:hover,
body.bracelets #subnav a#bracelets:hover,
body.rings #subnav a#rings:hover,
body.earrings #subnav a#earrings:hover,
body.necklaces #subnav a#necklaces:hover  {
background: #fff;
}
body.about #subnav a#about,
body.locations #subnav a#locations,
body.contact #subnav a#contact,
body.birthstones #subnav a#birthstones 
body.other #subnav a#other,
body.bridal #subnav a#bridal,
body.bracelets #subnav a#bracelets,
body.rings #subnav a#rings,
body.earrings #subnav a#earrings,
body.necklaces #subnav a#necklaces  {
color: #ccc;
}


/* = main window 
-----------------------------------------------------------------------------*/
#aboutContent {
position: relative;
left: 0px;
top: 0px;
width: 918px;
height:	500px;
margin: 0;
padding: 0;
border: 0;
background: transparent url(images/back_about.jpg) no-repeat top left;
}

#aboutContent #subtitle{
position: relative;
display: block;
left: 62px;
top: 62px;
height: 28px;
margin: 0px;
padding: 0px;
border: 0px;
background: url(images/sbtl_about.gif) no-repeat;
}

#contactContent {
position: relative;
left: 0px;
top: 0px;
width: 918px;
height:	500px;
margin: 0;
padding: 0;
border: 0;
background: transparent url(images/back_contact.jpg) no-repeat top left;
}

#contactContent #subtitle{
position: relative;
display: block;
left: 62px;
top: 62px;
height: 28px;
margin: 0px;
padding: 0px;
border: 0px;
background: url(images/sbtl_contact.gif) no-repeat;
}

#locationsContent {
position: relative;
left: 0px;
top: 0px;
width: 918px;
height:	500px;
margin: 0;
padding: 0;
border: 0;
background: transparent url(images/back_locations.jpg) no-repeat top left;
}

#locationsContent #subtitle{
position: relative;
display: block;
left: 62px;
top: 62px;
height: 28px;
margin: 0px;
padding: 0px;
border: 0px;
background: url(images/sbtl_inny.gif) no-repeat;
}

#locationsContent #subtitle2{
position: relative;
display: block;
left: 62px;
top: 112px;
height: 28px;
margin: 0px;
padding: 0px;
border: 0px;
background: url(images/sbtl_injapan.gif) no-repeat;
}

#textBox{
position: relative;
left: 66px;
top: 72px;
width: 300px;
}

#textBox2{
position: relative;
left: 66px;
top: 120px;
width: 300px;
}

#birthstonesContent {
position: relative;
left: 0px;
top: 0px;
width: 918px;
height:	500px;
margin: 0;
padding: 0;
border: 0;
background: url(images/back_birthstones.jpg) no-repeat top left;
}


/* collections Main 
-----------------------------------------------------------------------------*/

#collIntro {
position: relative;
float: left;
left: 62px;
top: 60px;
width: 180px;
margin: 0;
padding: 0;
border: 0;
background: transparent;
}

#collIntro #subtitle{
position: relative;
display: block;
left: 0;
top: -32px;
height: 28px;
margin: 0px;
padding: 0px;
border: 0px;
background: url(images/sbtl_collections.gif) no-repeat;
}

#collIntro #textBox{
position: relative;
left: 4px;
top: -22px;
width: 180px;
}

#collButtons {
display: block;
position: relative;
float: right;
top: 60px;
width: 660px;
height: 360px;
margin: 0;
padding: 0;
border: 0;
background: #fff;
font: 90%/1.6 Tahoma, Verdana, sans-serif;
color: #668187;
}

#collButtons ul {
list-style: none;
position: relative;
left: 0;
top: 0;
margin: 0;
padding: 0;
}

#collButtons li {
float: right;
width: 210px;
height: 158px;
margin: 0 0 6px 6px;
}

#collButtons a{
display: block;
line-height: 158px;
text-indent: -9999px;
border: none;
}

#collButtons li.btnNecklaces a{ 
background: url(images/collNecklaces.jpg) 0 0 no-repeat; 
}
#collButtons li.btnEarrings a{ 
background: url(images/collEarrings.jpg) 0 0 no-repeat; 
}
#collButtons li.btnRings a{ 
background: url(images/collRings.jpg) 0 0 no-repeat; 
}
#collButtons li.btnBracelets a{ 
background: url(images/collBracelets.jpg) 0 0 no-repeat; 
}
#collButtons li.btnBridal a{ 
background: url(images/collBridal.jpg) 0 0 no-repeat; 
}
#collButtons li.btnOther a{ 
background: url(images/collOther.jpg) 0 0 no-repeat; 
}

#collButtons li.btnNecklaces a:hover,
#collButtons li.btnEarrings a:hover,
#collButtons li.btnRings a:hover,
#collButtons li.btnBracelets a:hover,
#collButtons li.btnBridal a:hover,
#collButtons li.btnOther a:hover{ 
background-position: 0 -158px;
height: 158px;
}


/* galleries 
-----------------------------------------------------------------------------*/


#gallery {
position: relative;
left: 0px;
top: 0px;
width: 918px;
height:	500px;
margin: 0;
padding: 0;
border: 0;
background: #fff;
}

#thumbs {
position: relative;
float: left;
left: 62px;
top: 60px;
width: 210px;
margin: 0;
padding: 0;
border: 0;
background: transparent;
}

#thumbs #subtitle{
position: relative;
display: block;
left: -4px;
top: -32px;
height: 28px;
margin: 0px;
padding: 0px;
border: 0px;
}
body.necklaces #subtitle{
background: url(images/sbtl_necklaces.gif) no-repeat;
}
body.earrings #subtitle{
background: url(images/sbtl_earrings.gif) no-repeat;
}
body.rings #subtitle{
background: url(images/sbtl_rings.gif) no-repeat;
}
body.bracelets #subtitle{
background: url(images/sbtl_bracelets.gif) no-repeat;
}
body.bridal #subtitle{
background: url(images/sbtl_bridal.gif) no-repeat;
}
body.other #subtitle{
background: url(images/sbtl_other.gif) no-repeat;
}

#thumbs ul {
list-style: none;
position: relative;
left: 0;
top: -28px;
margin: 0;
padding: 0;
}

#thumbs ul li {
float: left;
margin: 0 4px 0 0;
}

#mainImg {
display: block;
position: relative;
float: right;
top: 60px;
width: 556px;
height: 360px;
margin: 0;
padding: 0;
border: 0;
background: #fff;
font: 90%/1.6 Tahoma, Verdana, sans-serif;
color: #668187;
}