﻿/*************************************
                Reset
*************************************/

html {
	margin:0;
	padding:0;	
	outline:0;
	vertical-align:baseline;	
	overflow-y: scroll;
}

body {
    /*overflow-x:hidden;*/
}
ol, ul {
    list-style: none;
}

table {
	border-collapse:separate;
	border-spacing:0;
}
* { 
    padding:0; 
    margin:0; 
}

/*************************************
        GENERAL DECLARATIONS
*************************************/

body {
	font-size:100.01%;
	font-family:Tahoma,times,serif;
	background: #000000 url(../images/bg.jpg) no-repeat top center;
}
a
{
	text-decoration:none;
	color: #cc9933;
}
a:hover
{
	text-decoration:none;
	color: #ffffff;
	background: #cc9933;
}
a:active { 
    outline:none; 
}
a:focus {
    -moz-outline-style:none;
}

.floatRight {
    float: right;
    width: 100%;
    text-align: right;
}

.floatLeft {
    float: left;
    width: 100%;
    position: relative;
}

.floatLeftP {
    float: left;
    width: 100%;
    position: relative;
    padding: 0 0 10px 0;
}

.floatLeft .r {
    right: 0px;
}

img {
    border:0px;
}

.input {
    padding: 1px 5px;
}

.red {
    color: #ff0000;
}

.linkClean {
    color: #333333;
    text-decoration: underline;
}

.imgRight {
    float: right;
    padding: 0 0 15px 15px;
}

.imgLeft {
    float: left;
    padding: 0 15px 15px 0;
}

.imgProdLeft {
    float: left;
    padding: 0 15px 25px 0;
    background: transparent url(../images/img_footer.jpg) no-repeat center bottom;
}

#wrapper {
    width: 990px;
    margin: 20px auto 0 auto;
    padding: 0;
}

#header {
    float: left;
    width: 990px;
    height: 148px;
    background: transparent url(../images/banner.jpg) no-repeat;
    position: relative;
}

#header .nav {
    position: absolute;
    top: 120px;
    left: 0px;
    font-size: 0.85em;
    font-weight: bold;
    color: #ffffff;
}

#header .nav a{
    color: #ffffff;
}

#header a.logo, #header a.logo:hover {
    width: 423px;
    height: 88px;
    position: absolute;
    top: 10px;
    left: 0px;
    background: transparent;
}

#header .nav li{
    display: inline;
}

#header .nav li a:hover{
    color: #ffffff;
    background: transparent;
}

#header .extra {
    position: absolute;
    top: 85px;
    right: 10px;
    font-weight: bold;
    text-transform: uppercase; 
}

#header .extra a{
    color: #ffffff;
}

#header .search {
    position: absolute;
    bottom: 49px;
    right: 20px;
    width: 208px;
    height: 20px;
    padding: 6px;
    background: #000000;
}

#header .search .input
{
    position: absolute;
    top: 6px;
    left: 6px;
    background: #fff;
    font-size: 0.9em;
}

#header .search .btn
{
    position: absolute;
    top: 6px;
    right: 6px;
}

#content {
    float: left;
    width: 990px;
    padding: 20px 0 0 0;
    background: #ffffff url(../images/bg_content.jpg) no-repeat 0 0;
}

#wrapperFooter {
    float: left;
    width: 100%;
    height: 299px;
    background: #000000 url(../images/bg_footer.jpg) no-repeat top center;
}

#wrapperFooter #footer {
    width: 990px;
    height: 229px;
    margin: 0 auto;    
    position: relative;
    font-size: 0.9em;
}

#wrapperFooter #footer #about{
    position: absolute;
    top: 145px;
    left: 15px;
    width: 360px;
    height: 120px;
    overflow: hidden;
    line-height: 1.3em;
}

#wrapperFooter #footer #sitemap1{
    position: absolute;
    top: 145px;
    left: 430px;
    width: 112px;
    height: 120px;
    line-height: 1.5em;
}

#wrapperFooter #footer #sitemap2{
    position: absolute;
    top: 145px;
    left: 545px;
    width: 125px;
    height: 120px;
    line-height: 1.5em;
}

#wrapperFooter #footer #sitemap1 a, #wrapperFooter #footer #sitemap2 a {
    color: #333333;
}

#wrapperFooter #footer #sitemap1 a:hover, #wrapperFooter #footer #sitemap2 a:hover {
    color: #ffffff;
}

#footerCopyright {
    float: left;
    width: 100%;
    margin: 10px 0 0 0;
    padding: 0 0 100px 0;
    text-align: center;
    font-size: 0.8em;
    color: #828181;    
}

#footerCopyright a{
    color: #828181;    
}

#contentLeft {
    float: left;
    width: 222px;
    margin: 0;
    padding: 0;
}

#contentLeft #nav{
    float: left;
    width: 215px;
    margin: 0;
    padding: 15px 0px;
    background: transparent url(../images/bg_nav.jpg) repeat-y;
    color: #ffffff;
    font-weight: bold;
    font-size: 0.9em;
}

#contentLeft #nav li{
    padding: 3px 10px 5px 10px;
}

#contentLeft #nav li.selected{
    width: 202px;
    height: 35px;
    margin: 4px 0 0 0;
    padding: 10px 10px 0px 10px;
    background: transparent url(../images/bg_navSelected.jpg) no-repeat -10px 0;
}

#contentLeft #nav li.sub{
    padding: 0px 0px 5px 10px;
    font-size: 0.9em;
}

#contentLeft #nav li a, #contentLeft #nav li a:hover{
    color: #ffffff;
}

#contentRight {
    float: right;
    width: 740px;
    margin: 0;
    padding: 0 20px 0 0;
}

.contHeader {
    float: left;
    width: 738px;
    margin: 0 0 2px 0;
    position: relative;
    font-weight: bold;
}

.contHeader .right{
    position: absolute;
    right: 0px;
    top: 0px;
    font-weight: normal;
}

.contFull {
    float: left;
    width: 706px;
    border: solid 1px #cccccc;
    margin: 0 0 15px 0;
    padding: 15px;
    position: relative;
}

.contFull .buttonR, .floatLeft .buttonR {
    float: right;
}

.contFull .buttonL, .floatLeft .buttonL {
    float: left;   
}

.contFull .buttonL1 {
    position: absolute;
    left: 103px;
}

.contFull .item {
    float: left;
    width: 145px;
    height: 27px;
}

.contFull .field {
    float: right;
    width: 556px;
    height: 27px;
}

.contFull .c34 {
    float: left;
    width: 526px;
}

.contFull .c14 {
    float: right;
    width: 175px;
    text-align: right;
}

.breadCrumb {
    float: left;
    width: 735px;
    margin: 0 0 15px 0;
    padding: 0 0 0 3px;
    font-weight: bold;
    font-size: 1.0em;
}

/*************************************
             TYPOGRAPHY
*************************************/

body {
    font-family: Verdana, Arial, sans-serif;
    font-size:.8em;
    line-height: 1.4em;
    color:#333333;
}   /* IE */
h1,h2,h3,h4,h5,h6 {
    font-family:Tahoma;
    clear:both;
}
h1 { font-size: 1.2em; font-weight: bold; color: #cc9933;}
h2 { font-size:1.4em; line-height:1.0em; font-weight: bolder; font-family:Sans-serif; letter-spacing:-0.045em; margin-bottom:7px; color:#333333;}
h2 a { margin-bottom:7px; color:#ffffff;}
h3 { font-size:1.1em; line-height:1.0em; font-weight: bolder; font-family:Sans-serif; letter-spacing:-0.045em; margin-bottom:7px; color:#ffffff;}
h3 a { margin-bottom:7px; color:#ffffff;}
h4 { font-size:0.85em; line-height:1.0; font-weight:normal;}
h5 { font-size:1em; font-weight:bold; }
h6 { font-size:2.1em; line-height:1.0em; font-weight:bolder; font-family:Helvetica, Arial, sans-serif; letter-spacing:-0.04em;}
p {
    margin:0px 0px 13px 0px;
}

.small {
    font-size:0.85em; line-height:1.0; font-weight:normal;
}

.lightGray, .lightGray a
{
    color: #a09e9e;
}

/*************************************
             MESSAGE BOXES
*************************************/

.errormsg
{
	float: left;
	width: 666px;
	margin: 0 0 15px 0;
	padding: 20px 10px 20px 60px;
	background: transparent url(../images/btn_error.png) no-repeat;
	background-position: 15px 15px;
	background-color: #eed4cb;
	border: solid 1px #fc0101;
}

.errormsg ul, .successmsg ul
{
	padding: 8px 0 0 20px;
}

.errormsg li, .successmsg li
{
	list-style-type: disc;
	font-weight: normal;
}

.successmsg
{
	float: left;
	width: 666px;
	margin: 0 0 15px 0;
	padding: 20px 10px 20px 60px;
	background: transparent url(../images/btn_success.png) no-repeat;
	background-position: 15px 15px;
	background-color: #d4efc6;
	border: solid 1px #4acf02;
}

/*************************************
             NAVIGATION
*************************************/

ul#navmenu li a span .h
{
    display: none;
}
ul#navmenu {
    width:600px;
    height:36px;
    margin:0;
    padding: 0;
    list-style:none;
    position: absolute;
    top: 70px;
    left: 100px;
    background:url(../images/bg_nav.jpg) no-repeat 0 0;
}
ul#navmenu li {
    float:left;
}
ul#navmenu li a {
    background:url(../images/nav_sprite.jpg) no-repeat scroll bottom left;
    display:block;
    height:36px;
    position:relative;
}
ul#navmenu li a.navHome {
    width:96px;
    background-position: 0px -2px;
}
ul#navmenu li a.navContests {
    width:129px;
    background-position: -96px -2px;
}
ul#navmenu li a.navProfiles {
    width:129px;
    background-position:-225px -2px;
}
ul#navmenu li a.navAbout {
    width:129px;
    background-position:-354px -2px;
}
ul#navmenu li a.navRegister {
    width:114px;
    background-position:-483px -2px;
}
ul#navmenu li a span {
    background:url(../images/nav_sprite.jpg) no-repeat scroll bottom left;
    display:block;
    position:absolute;
    top:0;
    left:0px;
    height:36px;
    width:100%;
    z-index:200;
}
ul#navmenu li a.navHome span {
    background-position:0px -38px;
    cursor: hand;
}
ul#navmenu li a.navContests span {
    background-position:-96px -38px;
    cursor: hand;
}
ul#navmenu li a.navProfiles span {
    background-position:-225px -38px;
    cursor: hand;
}
ul#navmenu li a.navAbout span {
    background-position:-354px -38px;
    cursor: hand;
}
ul#navmenu li a.navRegister span {
    background-position:-483px -38px;
    cursor: hand;
}

/*************************************
             PAGING
*************************************/

.paging{float:left; padding: 4px 0 4px 0; margin: 15px 0 2px 0; height:100%; width:100%; font-size:0.9em; font-weight:bolder; text-decoration: none; color:#dddddd;}
.paging a{padding:6px; margin:0 1px; border: solid 1px #d6d5d5; background: #f5f4f4; text-decoration: none; color:#838282}
.paging a:visited {padding:6px; margin:0 1px; border: solid 1px #d6d5d5; background: #f5f4f4; text-decoration: none; color:#838282}
.paging a:link {padding:6px; margin:0 1px; border: solid 1px #d6d5d5; background: #f5f4f4; text-decoration: none; color:#838282}
.paging a:hover {color: #333333; background: #f5f4f4; border-color: #cccccc; text-decoration: none;}
.pagingcurrent{color:#ffffff; padding:6px; margin:0 1px; border: solid 1px #d6d5d5; background: #cccccc;}

/*************************************
          PRODUCT CONTAINER
*************************************/

.pageHeading {
    float: left;
    width: 738px;
    height: 22px;
    margin: 0 0 15px 0;
    padding: 0;
    font-family: Verdana, Arial, sans-serif;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: -2px;
    line-height: 0.9em;
    text-transform: uppercase;
    color: #333333;
    background: #cc9933;
    position: relative;
}

.pageHeading .text {
    color: #333333;
    background: #ffffff;
    padding: 0 10px 0 0;
}

.pageHeading .grid {
    position: absolute;
    top: 4px;
    right: 15px;
    background: #ffffff url(../images/hdr_grid.jpg) no-repeat 0 0;
}

.pageHeading .grid a:hover
{
    background: transparent;
}

.pageHeading .grid .b {
    float: left;
    width: 29px;
    height: 18px;
}

.pageContent {
    float: left;
    width: 738px;
    margin: 0 0 25px 0;
    position: relative;
}

.catCont {
    float: left;
    width: 184px;
    height: 153px;
    text-align: center;
}

.vertProdCont 
{
    float: left;
    background: #ffffff;
    width: 158px;
    height: 260px;
    margin: 0 0 10px 0;
    padding: 0 12px 0 12px;
    background: transparent url(../images/BGverticalProdCont.jpg) no-repeat bottom center;
    text-align: left;
}

.vertProdCont a:hover
{
    background: transparent;
}

.vertProdCont .image
{
    width: 160px;
    height: 128px;
}

.vertProdCont .text
{
    width: 160px;
    height: 85px;
}

.vertProdCont .text a
{
    color: #cc9933;
}

.vertProdCont .text a:hover
{
    color: #FFFFFF;
    background-color: #cc9933;
}

.vertProdCont .buy
{
    width: 160px;
    height: 20px;
    text-align: center;
}

.horProdCont 
{
    float: left;
    width: 738px;
    height: 144px;
    margin: 0 0 10px 0;
    padding: 0;
    background: transparent url(../images/BGproductsep.jpg) no-repeat bottom center;
    text-align: left;
}

.horProdContHeader
{
    float: left;
    width: 738px;
    margin: 0 0 10px 0;
    padding: 0;
    text-align: left;
}

.horProdCont .image, .horProdContHeader .image {
    float: left;
    width: 171px;
}

.horProdCont .text, .horProdContHeader .text {
    float: left;
    width: 397px;
}

.horProdCont .price, .horProdContHeader .price {
    float: left;
    width: 80px;
    text-align: right;
}

.horProdCont .buy, .horProdContHeader .buy {
    float: right;
    width: 90px;
    text-align: right;
}

/*************************************
             LOGIN
*************************************/

.cont_new {
    float: left;
    width: 370px;
}

.cont_return {
    float: right;
    width: 362px;
    padding: 0 0 0 8px;
}

.cont_new .login_new {
    float: left;
    width: 328px;
    height: 200px;
    border: solid 1px #cccccc;
    margin: 0;
    padding: 15px;
    position: relative;
}

.cont_return .login_return {
    float: left;
    width: 328px;
    height: 200px;
    border: solid 1px #cccccc;
    margin: 0;
    padding: 15px;
    position: relative;
}

.cont_return .login_return .field {
    float: left;
    width: 100%;
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
}

.login_new .button, .login_return .button {
    position: absolute;
    top: 193px;
    right: 15px;
}

/*************************************
           FORGOT PASSWORD
*************************************/

.cont_forgotPassword {
    float: left;
    width: 706px;
    height: 200px;
    border: solid 1px #cccccc;
    margin: 0;
    padding: 15px;
    position: relative;
}

.cont_forgotPassword .buttonR {
    position: absolute;
    top: 193px;
    right: 15px;
}

.cont_forgotPassword .buttonL {
    position: absolute;
    top: 193px;
    left: 15px;    
}

/*************************************
           SHOPPING CART
*************************************/

.shoppingCart {
    float: left;
    width: 738px;
}

.shoppingCart .header {
    float: left;
    width: 738px;
    padding: 0 0 5px 0;
    font-weight: bold;
    color: #666666;
}

.shoppingCart .header .action {
    float: left;
    width: 68px;
    text-align: center;
}

.shoppingCart .header .product {
    float: left;
    width: 500px;
    text-align: left;
}

.shoppingCart .header .qty {
    float: left;
    width: 50px;
    text-align: center;
}

.shoppingCart .header .price {
    float: right;
    width: 110px;
    text-align: right;
}

.shoppingCart .container {
    float: left;
    width: 738px;
    margin: 5px 0 5px 0;
    padding: 0 0 25px 0;
    background: transparent url(../images/BGproductsep.jpg) no-repeat bottom center;
}

.shoppingCart .container .action {
    float: left;
    width: 68px;
    text-align: center;
}

.shoppingCart .container .product {
    float: left;
    width: 490px;
    text-align: left;
    padding: 0 10px 0 0;
}

.shoppingCart .container .product .img {
    float: left;
    width: 170px;
    text-align: left;
}

.shoppingCart .container .product .text {
    float: right;
    width: 320px;
    text-align: left;
    line-height: 1.2em;
}

.shoppingCart .container .product .text .options{
    font-size: 0.8em;
    font-style: italic;
    line-height: 1.2em;
}

.shoppingCart .container .qty {
    float: left;
    width: 50px;
    text-align: center;
}

.shoppingCart .container .price {
    float: right;
    width: 110px;
    text-align: right;
    padding: 0 0 0 10px;
}

.shoppingCart .subTotal {
    float: left;
    width: 738px;
    text-align: right;
    font-weight: bold;
    padding: 0 0 10px 0;
}

/*************************************
           PRODUCT
*************************************/

.cont_product {
    float: left;
    width: 738px;
    margin: 0;
    padding: 0;
    position: relative;
}

.cont_product .name {
    float: left;
    width: 608px;
    font-size: 1.5em;
    font-weight: bold;
}

.cont_product .model {
    font-size: 0.6em;
    font-weight: bold;
}

.cont_product .price {
    float: right;
    width: 130px;
    text-align: right;
    font-size: 1.5em;
    font-weight: bold;
    color: #cc9933;
}

.cont_product .description{
    float: left;
    width: 738px;
    margin: 15px 0 15px 0;
    padding: 0;
    position: relative;
}

.cont_product .description .prodImage  
{
    cursor: pointer;
    color: #999999;
}

.cont_product .cont_images{
    float: left;
    width: 738px;
    margin: 0 0 15px 0;
    padding: 0;
    position: relative;
    display: none;
}

.cont_product .cont_images .image{
    float: left;
    width: 738px;
    margin: 0 0 15px 0;
    padding: 0;
    text-align: center;
}

.cont_product .cont_images .image .stepcarousel
{
    position: relative; /*leave this value alone*/
    border: 0;
    overflow: hidden; /*leave this value alone*/
    width: 738px; /*Width of Carousel Viewer itself*/
    height: 448px; /*Height should enough to fit largest content's height*/
    background: #ffffff;
}

.cont_product .cont_images .image .stepcarousel .belt
{
    position: absolute; /*leave this value alone*/
    left: 0;
    top: 0;
}

.cont_product .cont_images .image .stepcarousel .panel
{
    float: left; /*leave this value alone*/
    overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
    margin: 0; /*margin around each panel*/
    width: 738px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}

.cont_product .cont_images .thumbs{
    float: left;
    width: 708px;
    margin: 0;
    padding: 15px;
    background: #e0e0e0;
    text-align: center;
}

.cont_product .cont_images .thumbs .thumb{
    float: left;
    width: 141px;
    height: 90px;
    margin: 0;
    padding: 0;
}

.cont_product .cont_images .thumbs .thumb img{
    width: 130px;
}

.btnMoreImages:hover {
    cursor: pointer;
    background: transparent;
}

.cont_product .buyNow {
    float: right;
    margin: 10px 0 0 0;
}

.prodOptions {
    float: left;
    width: 100%;
    line-height: 2.0em;
}

/*************************************
           ABOUT US
*************************************/

.aboutUs, .aboutCustomers
{
    font-size: 13px;
}

.aboutUs img
{
    float: left;
    margin: 10px;
}

.aboutWholesale
{
    float: left;
    font-size: 13px;
}

.aboutCustomers ul li
{
    padding: 0 0 0 13px;
    background: transparent url(../images/bullet.jpg) no-repeat 0px 6px;
}

.aboutWholesale img
{
    float: left;
    margin: 10px;
}

.aboutWholesale .info
{
    width: 738px;
    height: 110px;
    padding: 0 0 15px 0;
}

.aboutWholesale ul
{
    float: left;
    width: 245px;
}

.aboutWholesale ul li
{
    padding: 0 0 0 13px;
    background: transparent url(../images/bullet.jpg) no-repeat 0px 6px;
}

/*************************************
           CHECKOUT SHIPPING
*************************************/

.checkoutStatus {
    float: left;
    width: 100%;
}

.checkoutStatus a{
    color: #333333;
}

.checkoutStatus a:hover{
    color: #ffffff;
}

.cont_shippingPrice {
    float: left;
    width: 688px;
    margin: 3px 0 0 0;
    padding: 5px 10px;
    position: relative;
    background: #f2f1f1;
}

.cont_shippingPrice .right {
    position: absolute;
    top: 5px;
    right: 10px;
}

.checkoutProgress {
    float: left;
    margin: 20px 0 5px 0;
    padding: 0;
    width: 738px;
    height: 20px;
    background: #f2f1f1;
    position: relative;
}

.checkoutProgress .arrow {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 20px;
    background: #999999 url(../images/progress_arrow.jpg) no-repeat top right;
}

.checkoutPaymentProd {
    float: left;
    width: 548px;
    margin: 5px 0 0 0;
}

.checkoutPaymentProd .options {
    font-size: 0.8em;
    font-style: italic;
    line-height: 1.2em;
}

.checkoutPaymentPrice {
    float: right;
    width: 158px;
    text-align: right;
    margin: 5px 0 0 0;
}

.checkoutPaymentTotals {
    float: left;
    width: 598px;
    margin: 5px 0 0 0;
    text-align: right;
}

.checkoutPaymentPriceTotals {
    float: right;
    width: 108px;
    text-align: right;
    margin: 5px 0 0 0;
}