/* v1.0 | 20080212 */
@charset "UTF-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
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;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	background-image:url(../img/bground_home.jpg);
	line-height: 1;
	font-family:Arial, Helvetica, sans-serif;
	
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

<!-- GENERAL STYLES -->

.clear{
	clear:both;
}

h1 {
	color:#363636;
	font-size:1.500em;
	font-weight:bold;
	margin:0px 0px 20px 0px;
}

p {

	color:#666362;
	font-size:0.750em;
	line-height:1.500em;
	margin:0px 0px 20px 0px;
	

}


#wrapper {
	width:950px;
	text-align:center;
	margin:0 auto;
}



/* ************************************* Header Styles ************************************* */



#header{
	width:100%;
	padding:28px 0px;
	height:
	78px;


}

#logo{
float:left;
background-image:url(../img/logo.png);
width:177px;
height:78px;
}

#logo h1{
text-indent:-9999px;
}

#header form{
	float:right;

}



/* ************************************* Nav Styles ************************************* */



#nav {
	float:left;
	width:950px;
	height:41px;

}

#nav ul{
	margin:0px;
	padding:0px; 
	width:100%; 
	height:41px;
}

#nav li{
	text-align:center;
	display:inline;
	line-height:47px;
	float:left;
	background-image:url(../img/tab_off.png);
	width:135px;
	height:41px;
	list-style:none;
	color:#fff;
}

#nav li.active{

	text-align:center;
	display:inline;
	line-height:47px;
	float:left;
	background-image:url(../img/tab_on.png);
	width:135px;
	height:41px;
	list-style:none;
	color:#fff;

}

#nav li a{
	color:#fff;
	font-size:0.750em;
	text-decoration:none;
	
}

#nav li a:hover{
	line-height:45px;
	
	width:135px;
	height:41px;
	list-style:none;
	color:#ffd613;
}



/* ************************************* Content Slider Styles ************************************* */



#content_slider {
	position:relative;
	height: 257px;
	width:950px;
	clear: both;
	margin:0px 0px 20px 0px;
	
}

#content_slider .prev{
	position:absolute;
	top:78px;
	left:0px;
	z-index:5;

}

#content_slider .next{
	position:absolute;
	top:70px;
	right:0px;
	z-index:6;

}

/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 950px;
    height: 257px;
}



/* ************************************* Column Styles ************************************* */


#content_wide {

	float:left;
	color:#666362;
	width:700px;
	height:200px;
	text-align: left;
	padding: 25px 0px 0px 0px;
	margin-bottom:0px;
	line-height:22px;
	font-size:12px;
	
}

.content_col{
	float:left;
	width:296px;
	height:332px;
	margin:20px 30px 0px 0px;
	text-align:left;

}

#match_it{
	position:relative;
	margin:20px 0px 0px 0px;
	width:243px;
	height:130px;
	padding:20px;
	background-color:#fff;
	border: 1px solid #b1b1b5;

}

#match_it h1{
	margin:0px 0px 10px 0px;
	padding:0px 0px 0px 0px; 
}

#match_it a{
	color:#fff;
	font-size:0.750em;
	text-decoration:none;
	padding:8px 5px 8px 5px;
	background:#FF00FF;
	
}

#match_it a:hover{
	padding:8px 5px 8px 5px;
	background:#00adef;
	
}

#match_it .coins{
	position:absolute;
	bottom:2px;
	right:15px;
}


#match_it .dots{
float:right;
margin:5px 5px 0px 0px;
}

.col_right{
	margin:20px 0px 0px 0px;

}

.content_col ul{
	

}

.content_col li{
list-style-position:inside;
list-style-image:url(../img/magenta_bullet.png);
color:#666362;
padding:9px 0px;
}



/* ************************************* Footer Styles ************************************* */



#footer {
	clear:both;
	width:auto;
	background-color:#DD008C;
	border-top:1px solid #BE0070;
	height:70px;
	color:#fff;
	font-size:0.750em;
}

#footer_inset{
	width:950px;
	margin:0 auto;
	padding:20px 0px;
}


#footer_links{
float:left;
}

#footer_links .horizontalrule{
	color:#666362;
}

#footer_links a{
color:#fff;
text-decoration:none;

}

#footer_contactinfo {
	float:right;
	text-align:right;
}

#footer_contactinfo img{
	padding:0px 0px 0px 10px;
}

#footer_contactinfo h1{
	padding:7px 0px 20px 0px;
	font-size:2.000em;
	font-weight:bold;
	color:#fff;
}



/* ************************************* contact modalBox Styles ************************************* */



#modalHeader{
	height:80px;
	border-bottom:1px solid #D5D5CD;
	padding:10px 0px 0px;
}

#modalHeader .modalEnvelope{
	position:absolute;
	top:55px;
	right:50px;
}

#modalHeader .closeModal{
	position:absolute;
	top:10px;
	right:10px;
}


#modalHeader h1{
	font-size:2.275em;
	font-weight:bold;
	color:#999999;
}

#modalHeader p, #modalMain p, #modalFooter p {
	font-size:0.875em;
}

#modalMain{
	padding:20px 10px;
	background-color:#E9E9DF;
	border-bottom:1px solid #D5D5CD;
	height:320px;
}

#modalMain label{
	color:#FF00FF;
	display:block;
	float:left;
	font-family:Arial,Tahoma,Sans-serif;
	font-size:10px;
	margin:10px 0 0;
	padding:0 0px 0 0;
	text-transform:uppercase;
	width:150px;
}

#modalMain input, textarea {
	margin:10px 0px 0px 0px;
	width:300px;
}

#modalMain .submit_but {
	color:#fff;
	font-size:0.750em;
	text-decoration:none;
	padding:8px 5px 8px 5px;
	background:#FF00FF;
	width:50px;
	float:right;
	border:0px;
	margin:20px 78px 0px 0px;	
	
}

#modalMain .submit_but:hover{
	padding:8px 5px 8px 5px;
	background:#00adef;
	
	}


#modalFooter{
	height:60px;
	padding:20px 0px 0px 0px;

}


/* ************************************* Swatch modalBox Styles ************************************* */




#modalHeader .swatchimg {
	position:absolute;
	top:45px;
	right:50px;
	
}



#left_colm{
	float:left;
	width:368px;
	
	}

#right_colm{
	float:right;
	width:582px;
	
	}

#content_left1{
	float:left;
	color:#666362;
	width:300px;
	height:332px;
	text-align: left;
	padding: 25px 0px 0px 0px;
	line-height:22px;
	font-size:12px;
	
	
}

.product_item {
	float:left; 
	width:950px; 
	height:331px; 	
	background-color:gray;
}

.product_content_left {
	position:relative;
	float:left;
	color:#666362;
	width:368px;
	height:331px;
	text-align: left;
	padding: 22px 0px 0px 0px;
	
	

}

.product_content_left img.product_img {
	border:1px solid #e3e20b;
	}

.bespoke_tab {
	position:absolute; 
	top:21px; 
	left:-2px;
}

.img_thumb1{
	position:absolute;
	bottom:60px;
	left:10px;
	}
	
.img_thumb2{
	position:absolute;
	bottom:60px;
	left:70px;
	}


.prod_desc {
	position:relative;
	float:left;
	color:#666362;
	width:557px;
	height:331px;
	text-align: left;
	padding: 25px 0px 0px 25px;
	
}

.prod_desc h2{
	padding:20px 0px 10px 0px;
}

.prod_desc p{
	margin:0px;
	padding:0px 0px 10px 0px;
}

.prod_desc.ref {
	position:absolute; 
	top:45px; 
	left:25px; 
	font:Helvetica, 
	sans-serif; 
	font-style:italic; 
	color:#00a7ee;
}

.prod_desc a {
	color:#ee018d;
	}

.prod_desc a:hover {
	color:#ffd512; 
	text-decoration:underline;
}


.prod_desc span {
	color:#FF00FF; 
	font-weight:bold; 
	font-size:13px;
}

.swatch_folder {
	position:absolute; 
	top:23px; 
	right:-19px;
}

.get_quote_button {
	position:absolute; 
	bottom:23px; 
	right:-5px;
}