/* ------------------------------------------------------------------------
CSS sheet for SanSharee Jewelry
Author: Chris Robinson
Date Created: 07-15-08

All inquiries for this document should be directed to information@virtualtech.com.

--------------------------------------------------------------------------

COLORS



------------------------------------------------------------------------ */


/* -----------------------------------------------------------------------
=MAIN DESIGN ELEMENTS
-------------------------------------------------------------------------*/
*{
	margin: 0;
	padding: 0;
}
a{
	outline: none;

}
a img{
	border: 0px;
}
body{
	color: #000;
	font: 12px/1.5em Arial, Helvetica, sans-serif;
	text-align: center;
	background: #C0D9C4;
}
#wrap{
	width: 950px;
	border: 10px solid #B692AE;
	display: block;
	margin: 30px auto 0px auto;
	text-align: left;
	background: url(images/wrapbg.jpg) repeat-y #fff;
	overflow: hidden;
}
p{
	margin: 1.5em 0px;
}
p.thanks{
	margin-left: 35%;
}
/* -----------------------------------------------------------------------
=HEADER ELEMENTS
-------------------------------------------------------------------------*/
#header{
	display: block;
	width: 100%;
	height: 151px;
	background: url(images/headerbg.jpg) repeat-x;
	padding-top: 10px;
}
#header > #wrap{
	background: url(images/headerbg.png) repeat-x;
}
#header a.index{
	display: block;
	background: url(images/logo.png) no-repeat;
	width: 383px;
	height: 100px;
	text-indent: -9999px;
	margin: 20px;
}
#header h3{
	display: block;
	background: url(images/freeshipping.png) no-repeat;
	width: 214px;
	height: 18px;
	text-indent: -9999px;
	margin: 20px;
}
#header h1{
	display: block;
	background: url(images/sterling.png) no-repeat;
	width: 475px;
	height: 80px;
	text-indent: -9999px;
	float: right;
	margin: 20px;
}
/* -----------------------------------------------------------------------
=MAIN NAVIGATION ELEMENTS
-------------------------------------------------------------------------*/
ul.nav{
	display: block;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	height: 30px;
	padding-top: 8px;
	margin-bottom: 20px;
	width: 100%;
	margin-bottom: 50px;
}
ul.nav li{
	display: block;
	float: left;
	list-style-type: none;
	margin: 0 31px;
}
#content > ul.nav li{
	margin: 0px 37px;
}
ul.nav li a{
	display: block;
	float: left;
	text-align: center;
	font: 16px/1.5em "Palatino Linotype", "Times New Roman", serif;
	text-decoration: none;
	color: #000;
	font-weight: bold;
}
ul.nav li a:hover{
	text-decoration: underline;
}
/* -----------------------------------------------------------------------
=LEFT NAVIGATION ELEMENTS
-------------------------------------------------------------------------*/
#left{
	width: 230px;
	margin-left: 10px;
	float: left;
	margin-right: 30px;
}
#wrap > #left{
	margin-right: 40px;
}
#left ul{
	list-style-type: none;
}
#left ul li a{
	font: 16px/1.5em "Palatino Linotype", "Times New Roman", serif;
	font-weight: bold;
	color: #800000;
	text-decoration: none;
}
#left ul li a:hover{
	text-decoration: underline;
}
#left ul li.space{
	border-bottom: 1px solid #800000;
	margin-bottom: 10px;
}
/* -----------------------------------------------------------------------
=MAIN CONTENT ELEMENTS
-------------------------------------------------------------------------*/
#content{
	float: left;
	width: 69%;
	margin-right: 5px;
}
#wrap > #content{
	width: 70%;		
}
#content h3{
	font-size: 15px;
	display: block;
}

ul.classic{
width: 600px;
margin: 30px 0px 0px 30px;
text-align: center;
}

ul.classic li{
display: block;
float: left;
width: 32%;
height: 70px;
}

ul.classic li span{
display: block;
clear: both;
}
.clearfloat{
clear: both;
}


ul.aurora{
width: 600px;
margin: 30px 0px 0px 30px;
text-align: center;
}


ul.aurora li{
display: block;
float: left;
width: 50%;
height: 90px;
}

ul.aurora li span{
display: block;
clear: both;
}

.clearfloat{
clear: both;
}


ul.effect{
width: 600px;
margin: 30px 0px 0px 30px;
text-align: center;
}


ul.effect li{
display: block;
float: left;
width: 50%;
height: 90px;
}

ul.effect li span{
display: block;
clear: both;
}
.clearfloat{
clear: both;
}


ul.pearls{
width: 600px;
margin: 30px 0px 0px 30px;
text-align: center;
}



ul.pearls li{
display: block;
float: left;
width: 20%;
height: 140px;
}


ul.pearls li span{
display: block;
clear: both;
}

hr{
margin: 10px 0px 10px 0px;
}




/* -----------------------------------------------------------------------
=GALLERY ELEMENTS
-------------------------------------------------------------------------*/
dl.gallery{
	display: block;
	margin-top: 50px;
	background: url(images/gallerybg.jpg) repeat;
	border: 3px solid #ACCDB2;
	overflow: hidden;
	height: auto;
}
#content > dl.gallery{
	
}
dl.gallery dt{
	font-weight: bold;
	padding: 10px 5px 0 5px;
	font-size: 15px;
	color: #9F0200;
}
dl.gallery dd{
	float: left;
	list-style-type: none;
	margin: 8px 15px;
	width: 127px;
	height: 140px;
	text-align: center;
}
dl.gallery dd img{
	border: 2px solid #9F0200;
	display: block;
	margin: 0 auto 5px auto;
}
dl.gallery > dd{
	margin: 8px 18px;
}
dl.gallery a{
	font-weight: bold;
	text-decoration: none;
	color: #9F0200;
}
/* -----------------------------------------------------------------------
=RIGHT ELEMENTS
-------------------------------------------------------------------------*/
#newsletter {
	float: right;
	width: 300px;
	margin-left: 20px;
	background: url(images/newsletterMid.jpg) repeat-y;
}
#newsletter #top {
	text-align: center;
	font-size: 16px;
	line-height: 40px;
	font-weight: bold;
	background: url(images/newsletterTop.jpg) no-repeat;
	height: 40px;
}
#newsletter form {
	text-align: center;
	height: 100px;
}
#newsletter input[type="text"] {
	width: 90%;
}
#newsletter #bottom {
	text-align: center;
	height: 30px;
	background: url(images/newsletterBtm.jpg) center bottom no-repeat;
}
#newsletter input.btn {
	width: auto;
}

/* -----------------------------------------------------------------------
=FOOTER ELEMENTS
-------------------------------------------------------------------------*/
ul.cards{
	list-style-type: none;
	padding-top: 30px;
}
ul.cards li{
	float: left;
	margin: 10px;
}
#footer{
	display: block;
	clear: both;
	width: 950px;
	margin: 0 auto;
}
#footer ul{
	margin: 0px;
}
#footer ul li{
	float: left;
	list-style-type: none;
	margin: 20px;
}
#footer ul li a{
	color: #000;
}

/* -----------------------------------------------------------------------
=FORM ELEMENTS
-------------------------------------------------------------------------*/
form br{
	clear: left;
}

form label {
	margin-bottom: 10px;
	display: block;
	float: left;
	width: 250px;
}

input[type="text"] {
	margin: 0px 10px 10px 10px;
	padding: 3px;
	float: left;
	display: block;
	border: 1px solid #ccc;
}
select {
	margin: 0px 10px 10px 10px;
	padding: 3px;
	width: 200px;
	float: left;
	display: block;
	border: 1px solid #ccc;
}
textarea {
	width: 500px;
	height: 200px;
	border: 1px solid #ccc;
	margin: 0px 10px 10px 10px;
}
input[type="submit"] {
	padding: 5px 20px ;
	border: 1px solid #003366;
	color: #003366;
}
input[type="submit"] {
	cursor: pointer;
}

#options h3{
	margin-top: 10px;
}

span.classic{
	float: left;
	display: block;
	width: 175px;
	margin-bottom: 10px;
	margin-top: 5px;
	margin-left: 20px;
}
span.classic input{
	margin-right: 5px;
}
.clearboth{
	display: block;
	clear: both;
}
#slide {
	width: 258px;
	height: 309px;
	display: block;
	float: right;
}