/*****************************************/
/*                                       */
/*              Layout CSS               */
/*                                       */
/*****************************************/

* {
    margin: 0em;
    padding: 0em;
}
body {
    font-family: Arial, Helvetica, sans-serif;
    color: #000000;
}
a {
    color: #484848;
}

h1 
{
    font:bold 14px Arial, Helvetica, sans-serif;
    }

h2 
{
    font:bold 12px Arial, Helvetica, sans-serif;
    }

h3 
{
    font:bold 12px Arial, Helvetica, sans-serif;
    }

h4 
{
    font:bold 12px Arial, Helvetica, sans-serif;
    }






/* Wrapper */
#wrapper {
    width: 1000px;
    margin: 0 auto;
}


/* Header */
#header {
    height: 55px;
    padding: 15px 30px 10px 30px;
}
#header h1 {
    font-size: 2.5em;
}
#header .search {
    float: right;
    margin-top: -2em;
}
.cartCount {
    float: right;
    margin-top: -2.2em;
    padding-right: 32px;
}


/* Content */
#content {
    padding: 1.5em 15px 1em 15px;
    line-height: 1.8em;
    background: url( '../../Files/images/a4.gif' ) repeat-x top left;
}
#content p {
    margin-bottom: 1.5em;
}
#content h2, h3 {
    margin-bottom: .8em;
}


/* Center Column */
#centerColumn {
    margin: 0em 0 0em 160px;
    padding: 0em 0em 1.5em 0em;
}
#centerColumn h1, #centerColumn h3 {
    color: #5D5F53;
    border-bottom: dotted 1px #ECEEDF;
    padding-bottom: 0.3em;
    margin-bottom: 0.4em;
    font-size: 1.5em;
}


/* Left Column */
#leftColumn {
    float: left;
    width: 135px;
}
#leftColumn h3 {
    font-size: 1.0em;
    font-weight: bold;
    color: #5D5F53;
}


/* Footer */
#footer {
    background: url( '../../Files/images/a4.gif' ) repeat-x top left;
    border-top: solid 1px #D0D4BB;
    padding: 1em 1.5em 1em 1.5em;
    height: 35px;
}
.copyright {
    float: right;
    font-size: 11px;
    color:#000000;
}


/* Misc. */
.clear {
    clear: both;
}

/* Images */
.ThumbImage
{
    width:300px;
    padding-bottom:10px;
	padding-right:10px;
}

.Image
{
    width:300px;
	padding-right:10px;
}

/* New Text CSS */
.Link
{
    font-size:10px;
    color:#2B4F8B;
}


























/*****************************************/
/*                                       */
/*              Controls CSS             */
/*                                       */
/*****************************************/

/*
    "SKU" controls
    --------------
    The following class names are used to style the "SKU" controls.
    Note: some parts of the SKU, for example, the SKU name, may by styled
    using headers (h1, h2, h3, etc). 
*/
.SKUHorizontalRepeater {
    float: left;
    width: 47.5%;
    padding-right: 15px;
}
.SKUImageTD {
    width: 300px;
	padding-right:10px;
}
.OutOfStock {
    font-weight: bold;
    color: Red;
}
.SKUNumber {
    font-size: 11px;
}
.SKUPricing {
    font-weight: bold;
}
.SKUShortDescription {
    font-size: 12px;
}
.SKULongDescription {
    font-size: 12px;
}
.AvailableOptions {
}
.SKUOptions {
}
.SKUQuantityOnHand {
}
.SKUQtyAndAddToCart {
}
.SKUInventoryExceeded {
}
/****************************************************************************/




/*
    "Item" Controls
    ---------------
    The following are class names used to style the "item" controls.
    Note: some parts of the item, for example, the item name, may by styled
    using headers (h1, h2, h3, etc).    
*/
.ItemImageTD {
    width: 120px;
}

.ItemNumber {
    font-size: 11px;
}

.ItemShortDescription {
    font-size: 12px;
    font-weight: bold;
}

.ItemLongDescription {
    font-weight: bold;
}

.ItemPageUpsellRepeater /* "Alternate recommendations" */ {
    float: left;
    padding-right: 40px;
}

.ItemPageCrossSell /* "You may also be interested in" */ {
    float: left;
    padding-right: 40px;
}

/********************************************************/


/*
    "Category" controls
    --------------
    The following class names are used to style the "Category" controls.
    Note: some parts of the Category, for example, the Category name, may by styled
    using headers (h1, h2, h3, etc). 
*/
.CategoryImageTD {
    width: 120px;
}

.CategorySubCategoryRepeater {
    float: left;
    margin: 0px 30px 10px 0px;
    width: 28%;
}

.CategoryItemRepeaterHorizontal {
    float: left;
    width: 46.5%;
    padding-right: 20px;
}

.FeaturedItemsRepeater {
    margin-bottom: 15px;
    padding-left: 20px;
    width: 140px;
}
/***********************************************************************/







/*
    CMS Menu Control
    ----------------
    The CMS menu control is typically located at the top of every page.
    It contains the site's content management menu.
    There are three main elements of this control that need to be styled:
        1) The entire control = .CMSMenuControl (this class is wrapped around the entire control)
        2) The root menu items = .CMSMenuControlRootLevel
        3) The sub menu items (appear when hovering over root items) = .CMSMenuControlSubLevel
    The entire menu, when outputed on the page, is created by an html <table>.
    Each menu item creates a new <tr> and <td>.
    More information on how to use CSS with the Menu Control and be found here:
    http://msdn2.microsoft.com/en-us/library/ms366731.aspx

*/
.CMSMenuControl {
    margin-top:-5px;
}

.CMSMenuControlRootLevel {
    font-size: 12px;
}

.CMSMenuControlRootLevel a {
    font-family: Arial, Helvetica, sans-serif;
    
    color: #464646;

    padding:14px;
}
.CMSMenuControlRootLevel a:hover {
    color: #ccc;

    background-color:#464646;
}

.CMSMenuControlSubLevel {
}




/*
.CMSMenuControl
{
    margin-bottom:10px;
    padding-left:15px
}

.CMSMenuControl li
{
    display:inline;
    padding-right:25px     
}

.CMSMenuControl a
{
    text-decoration:none;
    font-weight:bold
}
*/
/***************************************************************************/




/*
    Category Menu Control
    ---------------------
    The category menu control is located on the left or top of every page.
    It contains the site's categories (catalog).
    there are three main elements of this control that need to be styled:
        1) The entire control = .CategoryMenuControl (this class is wrapped around the entire control)     
        2) The root categories = .CategoryMenuControlRootLevel
        3) The sub-categories = .CategoryMenuControlSecondLevel
    The entire menu, when outputed on the page, is created by an html <table>.
    Each category creates a new <tr> and <td>.
    More information on how to use CSS with the Menu Control and be found here:
    http://msdn2.microsoft.com/en-us/library/ms366731.aspx
*/
.CategoryMenuControl {
}

.CategoryMenuControlRootLevel {
    font-weight: bold;
    margin-top: 10px;
}

.CategoryMenuControlRootLevel a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #000000;
    text-decoration: none;
}

.CategoryMenuControlRootLevel a:hover {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #ce1c2a;
    text-decoration: none;
}


.CategoryMenuControlSubLevel {
    font-size: 12px;
    background-color: inherit;
	margin-bottom:6px;
	margin-left:10px;
}

.CategoryMenuControlSubLevel a:hover {
    color: #ce1c2a;
}

/*
.CategoryMenuControl
{
    margin-top:-15px
}

.CategoryMenuControl ul.AspNet-Menu a
{
    text-decoration:none
}

.CategoryMenuControl ul.AspNet-Menu
{
    font-weight:bold;
    margin-top:10px;
    list-style-type:none;
}

.CategoryMenuControl ul.AspNet-Menu li
{
    padding-top:10px;
}

.CategoryMenuControl ul.AspNet-Menu li a
{
    background:url(../../files/images/arrow.gif) no-repeat left;
    padding-left:17px
}

.CategoryMenuControl ul.AspNet-Menu ul
{
    padding-left:20px;
    list-style-type:none;
    font-weight:normal
}

.CategoryMenuControl ul.AspNet-Menu ul li
{
    padding:0;
    border-bottom:none;
}

.CategoryMenuControl ul.AspNet-Menu ul li a
{
    background:none
}
*/
/***************************************************************************/




/*
    Items In Category
    -----------------
    The items in category control located on the right side of Default.aspx.
    This control generates an html <table> with a new <tr> and <td> created
    for each item.
*/
.ItemsInCategory {
    margin-bottom: 15px;
}
/***************************************************************************/


/*
    Items In Category (With Image)
    -----------------
    The items in category control located on the right side of Default.aspx.
    This control generates an html <table> with a new <tr> and <td> created
    for each item.
*/
.ItemInCategoryWithImageRepeater {
    float: left;
    width: 25%;
    text-align: center;
    padding: 15px;
    border: 1px solid #ccc;
    margin: 0 10px 15px 0;
}
/***************************************************************************/


/*
    Mailing List
    -----------------
    The mailing list control is located on Default.aspx
*/
.MailingListControl {
}
/***************************************************************************/


/*
    Footer Menu Control
    ---------------------
    The footer menu control is located in the footer of every page.
    It contains links to pages such as privacy policy and return policy.
    there are three main elements of this control that need to be styled:
        1) The entire control = .FooterMenuControl (this class is wrapped around the entire control)     
        2) The root pages = .FooterMenuControlRootLevel
        3) The sub pages (appear when hovering over root pages) = .FooterMenuControlSubLevel 
    The entire menu, when outputed on the page, is created by an html <table>.
    Each category creates a new <tr> and <td>.
    More information on how to use CSS with the Menu Control and be found here:
    http://msdn2.microsoft.com/en-us/library/ms366731.aspx
*/
.FooterMenuControl {
    float: left;
}

.FooterMenuControlRootLevel {
    padding-right: 10px;
    font-size: 0.8em;
}

.FooterMenuControlRootLevel a:hover {
    color:#333;
}

.FooterMenuControlSubLevel {
}
/*
.FooterMenuControl li
{
    display:inline;
    padding-right:15px     
}

.FooterMenuControl a
{
    text-decoration:none;
    font-size:11px
}
*/
/*******************************************************************************/



/*
    Shop By Category
    ---------------
    The following class names are used by the Shop By Category control located
    in ShopByCat.aspx
*/
.ShopByCategory {
    width: 33%;
    float: left;
    height: 200px;
}

.ShopByCategoryRoot a {
    font-weight: bold;
    text-decoration: none;
    font-size: 11pt;
}
.ShopByCategorySub a {
    font-size: 8pt;
}
/*******************************************************************************/



/*
    Misc.
    -----
*/
.ViewAdditionalImages {
    font-size: 11px;
}

.ProcessingOrder /* DO NOT EDIT! */ {
    background: url(../../files/images/ball.gif) right no-repeat #FFF;
    border: none;
    font-weight: bold;
    cursor: wait;
}




/*===========================================================*/
/*                     NEW CSS                               */
/*===========================================================*/



body {
    background-image: url(../../files/images/img_bgn.jpg);
    background-repeat: repeat-x;
    margin: 0;
    padding: 0px;
    background-color: #C1D9FF;
}
.main {
    width: 779px;
    height: auto;
    margin: 0 auto 0 auto;
}
.top_blackrow {
    width: 779px;
    height: 28px;
    float: left;
}
.top_space
{
    width:779;
    height:15px;
    font-size:12pc;
    color:#C1D9FF;
}
.logo {
    background-image: url(../../files/images/img_logo.gif);
    width: 779px;
    height: 88px;
    float: left;
    background-repeat: no-repeat;
    background-position: 14px 36px;
}
.top_links {
    width: 773px;
    float: left;
    border-left: 3px #FFFFFF solid;
    border-right: 3px #FFFFFF solid;
    border-top: 3px #FFFFFF solid;
    background-color: #DCDCDC;
    height: 44px;
}

#last_link {
    background-image: none;
}
.main_img {
    float: left;
    background: url(../../files/images/naturalgemsheader.jpg) no-repeat top left;
    border: 3px #FFFFFF solid;
    width: 773px;
    height: 209px;
}
.banner_img {
    float: left;
    width: 773px;
    height: 209px;
    background-image: url(../../files/images/img_banner.jpg);
    background-repeat: no-repeat;
    background-color: #080000;
}
.img_heading {
    width: 420px;
    height: 29px;
    float: left;
    background-image: url(../../files/images/img_text.gif);
    background-repeat: no-repeat;
    margin-left: 319px;
    margin-top: 110px;
    display: inline;
}
.main_content {
    width: 773px;
    border-left: 3px #FFFFFF solid;
    border-right: 3px #FFFFFF solid;
    float: left;
    background-color: #FFFFFF;
}
.left_nav {
    width: 205px;
    float: left;
}
.body_text {
    width: 538px;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
}
.left_search {
    width: 203px;
    border: 1px #bbb solid;
    background-color: #DCDCDC;
    float: left;
    height: 40px;
    text-align: center;
    padding-top: 15px;
}
.search_text {
    float: left;
    margin-top: 14px;
    margin-left: 13px;
    display: inline;
}
.form_filed {
    width: 192px;
    float: left;
    background-image: url(../../files/images/btn_search.gif);
    background-position: 168px 4px;
    background-repeat: no-repeat;
    padding-left: 11px;
    padding-top: 4px;
}
.form_filed a {
    width: 22px;
    height: 22px;
    float: left;
    position: absolute;
    margin-left: 157px;
}
.left_catalog {
    width: 203px;
    border: 1px #bbbbbb solid;
    background-color: #DCDCDC;
    float: left;
    margin-top: 2px;
}
.catalog_text {
    width:189px;
    height: 22px;
    float: left;
    background-color: #464646;
    margin-top: 12px;
    padding-left: 14px;
    padding-top: 4px;
    display: inline;
}
.left_links {
    float: left;
    margin-top: 2px;
    width: 200px;
	padding-left:10px
}

.inner_body_text {
    margin-left: 19px;
    margin-top: 18px;
    margin-right: 35px;
    float: left;
    display: inline;
}
.separator {
    width: 178px;
    background-image: url(../../files/images/img_dotted_line.gif);
    height: 1px;
    margin-top: 1px;
    background-repeat: no-repeat;
}
.img_ssl {
    width: 185px;
    height: 80px;
    float: left;
    /*border: #bbb solid 1px;*/
    margin-left: 7px;
    margin-top: 5px;
    display: inline;
    text-align: center;
    padding-top: 15px;
    background-color:#ccc;
}
.spacer {
    float: left;
    height: 20px;
    width: 180px;
}
.bottom_spacing {
    width: 773px;
    float: left;
    height: 20px;
    background-color: #FFFFFF;
}
.bottom_link_holder {
    width: 770px;
    float: left;
    height: 26px;
    background-color: #DCDCDC;
    padding-top: 9px;
    padding-bottom:5px;
    padding-right:5px;
	padding-left:5px;
}
.top_right_nav {
    width: 220px;
    float: right;
    height: 23px;
    background-image: url(../../files/images/img_cart.gif);
    background-repeat: no-repeat;
    background-position: 44px 0px;
    margin-top: 5px;
}

#left_links_none {
    float: left;
    background-image: url(../../files/images/img_arrow.gif);
    width: 155px;
    height: 23px;
    margin-top: 3px;
    padding-left: 23px;
    background-position: bottom;
    background-repeat: no-repeat;
}
.top_right_nav_inner {
    float: left;
    width: 160px;
    margin-left: 10px;
}
.top_right_nav_inner1 {
    float: left;
    width: 50px;
}





/*===========================================================*/
/*                     FONTS                                 */
/*===========================================================*/


.arial11add
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color:#000000;
}
.arial12b590209 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #590209;
    text-decoration: none;
}
a.arial12b590209:hover {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #ce1c2a;
    text-decoration: none;
}
.arial13bce1c2a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #ce1c2a;
    text-decoration: none;
}
.arial16bffffff {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #ffffff;
    text-decoration: none;
}
.arial12r000000 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #000000;
    text-decoration: none;
}
.arial12r000000:hover {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #ce1c2a;
    text-decoration: none;
}
.arial11rffffff {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #ffffff;
    text-decoration: none;
}
.arial12rffffff {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #ffffff;
    text-decoration: none;
}
a.arial12rffffff:hover {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    text-transform: none;
    color: #DCDCDC;
    text-decoration: none;
}
.arial12rlh000000 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    line-height: 16px;
    font-variant: normal;
    text-transform: none;
    color: #000000;
    text-decoration: none;
}
.arial18rce1c2a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: bold;
    font-style: normal;
    line-height: 16px;
    font-variant: normal;
    text-transform: none;
    color: #ce1c2a;
    text-decoration: none;
}
.arial18r000000 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: bold;
    font-style: normal;
    line-height: 16px;
    font-variant: normal;
    text-transform: none;
    color: #000000;
    text-decoration: none;
}
