﻿/*******************************************************************************************************/
/*   Design by My Arts Desire -- http://www.myartsdesire.com  */
/*******************************************************************************************************/
html {
height: 100%;
margin-bottom: 1px;}

body {
background: #ffffff url('../images/background.jpg') repeat-x;
color: #000000;
font-weight: normal;
font-size: 0.80em;
font-family: Verdana, Geneva, sans-serif;
padding: 0;
margin: 0 auto;}

hr {
background-color: #3f8adf;
color: #3f8adf;
border: none;
height: 3px;
margin-bottom: 20px;}

a {
color: #3f8adf;
text-decoration: underline;
outline: none;
font-weight: bold;}

a:hover {
color: #707070;
text-decoration: underline;
font-weight: bold;}

h1, h2, h3, h4, h5, h6 {
font: bold "Century Gothic", Verdana, Helvetica, sans-serif;
letter-spacing: 2px;
margin: .8em 0;
text-align: left;}

h1 {font-size: 22px; color: #025ec4;}
h2 {font-size: 18px; color: #025ec4;}
h3 {font-size: 16px; color: #444; border-bottom: 1px #444 solid;}
h4 {font-size: 16px; color: #505050;}
h5 {font-size: 14px; color: #025ec4;}
h6 {font-size: 14px; color: #505050;}

table {
padding: 0;
font-size: 100%;
width: 100%;}

/*******************************************************************************************************/
/*                         STYLES USED ON THE FRAME OF THE WEBSITE                                */
/*******************************************************************************************************/
#wrapper {
background-color: #ffffff;
width: 960px;
margin: 0 auto;
text-align: left;}

#header {
position: relative;
width: 960px;
height: 330px;}

#logo {
position: absolute;
top: 0;
left: 0;
z-index: 1;
width: 310px;
height: 100px;}

#global {
position: absolute;
top: 0;
left: 310px;
z-index: 2;
color: #d0d0d0;
width: 640px;
height: 40px;
line-height: 40px;
letter-spacing: 1px;
font-size: 0.85em;
padding: 0;
text-align: center;}

#global a {
color: #e0e0e0;
margin: 0 5px;
text-decoration: none;}

#global a:hover {
color: #ffffff;
text-decoration: underline;}

#global img {
margin-top: 5px;
vertical-align: text-bottom;}

#sliderwrapper {
position: absolute;
bottom: 0px;
left: 355px;
z-index: 3;
background: #ffffff url('../images/banner1.jpg') no-repeat;
width: 605px;
height: 80px;}
  
#slider {
position:relative;}

#slider img {
position:absolute;
top:0px;
left:0px;
display:none;}

#mainnav {
position: absolute;
z-index: 4;
top: 105px;
left: 80px;
width: 260px;
height: 140px;
text-align: left;
color: #ffffff;
letter-spacing: 2px;}

#mainnav a {
background: transparent url('../images/bullet.png') no-repeat left center;
display: block;
color: #d0d0d0;
font-weight: bold;
text-decoration: none;
margin: 0;
padding: 2px 0 2px 10px;}

#mainnav a:hover {
color: #ffffff;
font-weight: bold;
text-decoration: underline;}

#search {
position: absolute;
z-index: 5;
color: #fff;
top: 255px;
left: 80px;
width: 210px;
margin: 0;
text-align: left;}

.search {
height: 20px;
margin: 0;
padding: 0;}

.search .box {
margin: 0;
padding: 2px;
background-color: #303030;
border: 1px #808080 solid;
color: #ffffff;}

#sidebar {
float: left;
width: 260px;
text-align: left;
margin: 0 10px 10px 10px;}

#cart {
color: #000000;
font-size: 0.90em;
margin: 0;
text-transform: uppercase;
text-align: center;}

#cart img {
margin-top: 5px;
vertical-align: text-bottom;}

.categories {margin: 0 0 0 10px;}

.categories a {
background: transparent url('../images/bullet.png') no-repeat left center;
display: block;
color: #3f8adf;
font-weight: bold;
text-decoration: none;
margin: 0;
padding: 2px 0 2px 10px;}

.categories a:hover {
color: #707070;
font-weight: bold;
text-decoration: none;}

.subcategories {margin: 0 0 0 20px;}

.subcategories a {
background: transparent url('../images/bullet.png') no-repeat left center;
display: block;
color: #3f8adf;
font-weight: bold;
text-decoration: none;
margin: 0;
padding: 2px 0 2px 10px;}

.subcategories a:hover {
color: #707070;
font-weight: bold;
text-decoration: none;}

#maincontent {
float: right;
width: 660px;
margin: 0 10px 10px 10px;
text-align: left;}

#footer {
position: relative;
clear: both;
color: #444;
text-align: center;
font-size: 12px;
padding: 0 0 10px 0;
line-height: 1.5em;
text-align: center;
margin: 0 auto;
font-size: 0.90em;
border-top: 3px #025ec4 solid;
width: 960px;}

#footer p {
margin: 0;
padding: 0;}

.footerblock {
float: left;
text-align: left;
margin: 10px 20px 10px 20px;
width: 200px;}

.footerblock a {
padding: 0;
text-decoration: none;}

.footerblock a:hover {
padding: 0;
text-decoration: underline;}

.imageleft-border {margin: 0 10px 0 0; padding: 5px; float: left; border: 3px #a0a0a0 double;}
.imageleft-noborder {margin: 0 10px 0 0; padding: 5px; float: left;}
.imageright-border {margin: 0 0 0 10px; padding: 5px; float: right; border: 3px #a0a0a0 double;}
.imageright-noborder {margin: 0 0 0 10px; padding: 5px; float: right;}

.center {text-align: center;}
.right {text-align: right;}
.clear {clear: both;}

/*new-releases:: Controls the length of the item name of the New Releases section.*/
.new-releases {
white-space: nowrap;
width: 150px;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;}

/*best-sellers:: Controls the length of the item name of the Top Sellers section.*/
.top-sellers {
white-space: nowrap;
width: 70px;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;}

/*menu-headers:: Controls the way the menu titles look. For example: Categories, Browse By Price, Top Sellers, etc.*/
.menu-headers { color: #333;
font: bold 16px "Century Gothic", Verdana, Helvetica, sans-serif;
letter-spacing: 2px;
border-bottom: 1px solid #444;
margin: .8em 0;
text-align: left;}

/*menu-text:: Controls the way the menu (mailing list) text look on the frame*/
.menu-text {
color: #000;}

/*price2:: Controls the way the product's price display in the top sellers and new releases sections*/
.price2 {
font-size: 13px;
color: #000;
font-weight: bold;}

/*******************************************************************************************************/
/*   STYLES USED THROUGHOUT THE WEBSITE  */
/*******************************************************************************************************/
/*data:: Controls the font style of your content on all the pages.*/
.data {
background-color: #fff;
color: #222;
text-decoration: none;
word-spacing: normal;
letter-spacing: 0;
line-height: 1.5em !important;
font-size: 12px;
text-align: left;}

/*alternative:: Controls the background color of the boxes used throughout the site*/
.alternative {
background-color: #f0f0f0;
padding: 2px !important;
border: 1px solid #d0d0d0;
line-height: 1.5em;}

/*page_headers:: Controls the title of all your pages.*/
.page_headers {
color: #025ec4;
font: bold 20px "Century Gothic", Verdana, Helvetica, sans-serif;
letter-spacing: 2px;
margin: .8em 0;
text-align: left;}

/*titles:: Controls the Body Tiles such as (Specials, Feature Items, Items, Related Items)*/
.titles {
font-family: "Century Gothic", Verdana, Helvetica, sans-serif;
font-size: 16px;
line-height: 20px;
color: #444;
margin: 10px 0;
padding: 0 0 0 0;
font-weight: bold;
border-top: none;
border-bottom: 1px solid #444;
border-left: none;
border-right: none;
background-color: #FFF;
text-align: left;}

/*price:: Controls the way the product's final price display throughout the site*/
.price {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 13px;
color: #025ec4;
font-weight: bold;
letter-spacing: 0px;}

/*error:: Controls the error messages*/
.error {
font-size: 12px;
font-weight: normal;
color: #e10e04;
text-decoration: none;}

/*borders:: Controls the color of the line dividers used throughout the site */
.borders {
color: #585C5F;
border: 1px dotted #cccccc;
border-style: none none dotted;}

/*borders2:: Controls the color of the dotted line dividers used throughout the site*/
.borders2 {
border: 1px dotted #cccccc;
border-style: none none dotted;}

/*******************************************************************************************************/
/* STYLES ONLY USED ON VIEW CART AND CHECKOUT PAGES  */
/*******************************************************************************************************/
/*checkout-headers:: Controls the titles on the checkout pages (Billing Information, Shipping Information etc)*/
.checkout-headers {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 13px;
color: #000;
font-weight: bold;
text-align: left;}

/*steps:: Controls the way the steps on the checkout pages display*/
.steps {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;
color: #cccccc;}

/*steps_on:: Controls the way the steps on the checkout [ages display*/
.steps_on {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;
color: #025ec4;}

/*titles2:: Controls the titles on the view cart page*/
.titles2 {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
background-color: #eeeeee;
color: #025ec4;
padding: 4px;
text-align: left;}

/*******************************************************************************************************/
/* STYLES ONLY USED ON PRODUCT PAGES  */
/*******************************************************************************************************/
/*options-titles:: Controls the way the option titles display on the product page*/
.options-titles {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #505050;
border: 1px dotted #cccccc;
border-style: none none dotted;}

/*item:: Controls the item description and item details text*/
.item {
font-size: 12px;
color: #505050;}

/*itemTitle:: Controls the Item Description font style*/
.itemTitle {
font-size: 16px;
color: #404040;
font-weight: bold;}

/*price-info:: controls the way the sub-prices display on the product page, the final price is controlled by the style called "price"*/
.price-info {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: Normal;
color: #444;}

/*smallTX:: controls the way the sub-prices display on the product page, the final price is controlled by the style called "price"*/
.smallTX {
color: #909090;
text-decoration: none;
text-align: left;
letter-spacing: 0;
font-size: 10px;
vertical-align: bottom;}

/*availabilitytx:: controls the way the sub-prices display on the product page, the final price is controlled by the style called "price"*/
.availabilitytx {
color: #333;
text-decoration: none;
text-align: left;
line-height: 1.2em;
font-size: 11px;}

/*rewardtl:: controls the way the sub-prices display on the product page, the final price is controlled by the style called "price"*/
.rewardtl {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
color: #333;
text-decoration: none;
text-align: left;
line-height: 10px;
font-size: 16px;}

/*******************************************************************************************************/
/*  FORM FIELDS & BUTTONS THROUGHOUT THE WEBSITE  */
/*******************************************************************************************************/
/*btn:: Controls the buttons*/
.btn {
border: 1px #000000 solid;
background-color: #202020;
background: -webkit-gradient(linear, left top, left bottom, from(#505050), to(#000000));
background: -moz-linear-gradient(top,  #505050,  #000000);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#505050', endColorstr='#000000');
font-weight: bold;
font-size: 12px;
color: #ffffff;
cursor: pointer;
margin: 1px;
padding: 2px 6px 2px 6px;}

/*btn_over:: Controls the buttons*/
.btn_over {
border: 1px #444 solid;
background-color: #404040;
background: -webkit-gradient(linear, left top, left bottom, from(#808080), to(#404040));
background: -moz-linear-gradient(top,  #808080,  #404040);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#808080', endColorstr='#404040');
font-weight: bold;
font-size: 12px;
color: #ffffff;
cursor: pointer;
margin: 1px;
padding: 2px 6px 2px 6px;}

/*btn2:: Controls the buttons*/
.btn2 {
border-top: 1px solid #FFF;
border-bottom: 1px solid #FFF;
border-left: 1px solid #FFF;
border-right: 1px solid #FFF;
background-color: #FFF;
font-weight: bold;
font-size: 12px;
color: #3f8adf;
cursor: pointer;
margin: 1px;
padding: 2px 6px 2px 6px;}

/*txtBoxStyle:: Controls the text boxes*/
.txtBoxStyle {
border-top: 1px solid #b0b0b0;
border-bottom: 1px solid #b0b0b0;
border-left: 1px solid #b0b0b0;
border-right: 1px solid #b0b0b0;
background-color: #f0f0f0;
font-weight: normal;
font-size: 11px;
color: #333;
margin: 2px 2px;}

/*txtareaStyle:: Controls the text areas*/
.txtareaStyle {
border-top: 1px solid #c0c0c0;
border-bottom: 1px solid #c0c0c0;
border-left: 1px solid #c0c0c0;
border-right: 1px solid #c0c0c0;
background-color: #f0f0f0;
font-weight: normal;
font-size: 11px;
color: #333;
margin: 2px 2px;}

/*txSearch:: Controls the style of the search box, if different than txtBoxStyle.*/
.txtBoxSearch {
height: 20px;
color: #505050;
font-size: 12px;
border: none;
padding: 3px 0px 0px 0px;
margin: 0;}

/*******************************************************************************************************/
/* STYLES USED ONLY ON THE INVOICE  */
/*******************************************************************************************************/
/*invoice_table:: Controls the background color on your invoices*/
.invoice_table {
background-color: #f0f0f0;}

/*invoice_title:: Controls the way the title of the invoices look */
.invoice_title {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
background-color: #d0d0d0;
color: #505050;}

img {
border: none;}

/*******************************************************************************************************/
/* STYLES USED ONLY ON THE BLOG  */
/*******************************************************************************************************/
.frame {
padding-left: 10px;}

/*************************************************************/
/*   LEGACY STYLES: STYLES USED PRIOR TO v3.2   */
/*************************************************************/
/*font1:: Primary Screen Font */
.font1 {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #000000;}

/*font2:: Secondary Screen Font */
.font2 {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #b0adad;}

.font3 {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #FFF;}

.font4 {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #c32519;}}

