/* Layout: One Column
	Theme: Graphite v.2

The following styles control fonts, colors and background images
===============================================================*/
@import url(https://fonts.googleapis.com/css?family=Oxygen:400,300,700);
@import url(https://fonts.googleapis.com/css?family=Podkova:400,700);
@import url(https://fonts.googleapis.com/css?family=Doppio+One);

body {
	font: 'Oxygen', sans-serif;
	color: #fff;
	background-color:#151515; /*#222;*/
    background-image: url(http://projects.vindicate.us/infusioncart/graphite/images/txture.png);
	}

td {
	font: 'Oxygen', sans-serif;
    color: #222;
	}




/* NAVIGATION
===============================================================*/

#nav {
	background-color: transparent;
	}

#nav li a {
	background-color: #0b0b0b;
    border: 1px solid #292929;
    
	}

#nav li a:hover {
	background-color: #151515;
    border: 1px solid #343434;
	}

#nav a {
	text-decoration: none;
	color: #ddd;
    font-weight: bold;
    font-size: 16px;
    text-transform: uppercase;
	}

#nav a:hover {
	text-decoration: none;
	color: #ddd;
	}

#topNav a {
	background-color: #0b0b0b;
    color: #eee;
    font-size: 14px;
    }



/* CONTENT / PRODUCT
===============================================================*/

#breadcrumbs {
    color: #222;
    }

.subscriptionPrice {
    font: 16px bold Arial, Podkova, Rockwell, Helvetica, sans-serif;
    color: #222;
    }

.productName {
     /* Product name in product grid */
	font-size: 21px;
	font-weight: bold;
	color: #C21A1A;
    text-shadow: 0 1px 1px #000;
    line-height: 1.1;
	}

.productName a:hover {
     /* Product name in product grid */
	font-size: 21px;
	font-weight: bold;
	color: #555; !important
    text-shadow: 0 1px 1px #000;
	}

.priceBold {
    /* Product price in product grid */
	font-weight: bold;
    color: #ddd;
    font-size: 18px;
	}

.product a {
	color: #333;
    text-decoration: none;
	}

#productGridOneCol a:hover {
    color: #fff; !important
	}

.productLarge {
    border: 1px solid #ddd;
    }

.productDescriptionShort {
    /* Paragraph for short product description on product details page */
	color: #222;
	}

#productDescription p {
    color: #222;
    }

.optionLabel {
    color: #222;
    }

#productDetails li {
    color: #222;
    }

#contentProductDetail {
    /* Content wrapper used on product details page */
	background-color: #f5f5f5;
    border: 1px solid #555;
	}

 #contentWide {
    background-color:#151515; /*#EBF2FA;*/
  }



/* CART AND CHECKOUT
===============================================================*/

.cartDiscount {
    /* Discount shown in cart */
	color: #d44;
    }

.cartProduct {
    /* Product name in cart */
    font-weight: bold;
    font-style:italic;
    font-size: 16px;
    color:#fff;
    }

.cartThumb {
    border: 1px solid #ddd;
    }

.removeItem {
    /* Remove item link in cart */
	color: #333;
    padding:10px;
  border:1px solid #fff;
	}

.discountedPrice {
	/* Slashed price in cart */
    text-decoration:line-through;
    }

.search, .promoField {
    /* Text fields for search and promo code */
	font-size: 13px;
	color: #999;
	border: 1px solid #ddd;
	}

.checkout, .checkoutShort, .checkoutShortest, .checkoutBottom, .checkoutTop, .checkoutTopShort, .signinField, .signinTop, .productQty, .qtyField  {
	/* Form fields used in checkout forms */
	border: 1px solid #ddd;
	
	}

.shippingTable {
	border: 1px solid #e0e9ea;
	}

.viewCart, .summaryCart, .payPlan, .paymentInfo, .shippingInfo, .billingInfo, .shippingTable, .signinTable, .paymentMethodTable  {
	border: 1px solid #101010;
    border-bottom: none;
    background-color: #313136;
  color:#fff;
	}
.billingTable  {
	border: none;
    background-color: #313136;
  color:#fff;
	}

.promoCode th {
	border-bottom: 1px solid #e0e9ea;
    border-top: 1px solid #e0e9ea;
	}
   .promoCode td {
  color:#fff;
}
 .viewCartShort th, .payPlan th, .summaryCart th, .shippingInfo th, .billingInfo th, .shippingTable th, .paymentInfo th, .signinTable th {
	border-bottom: 1px solid #101010;
    color: #70b0f3;
    font-size: 15px;
	background-color: transparent;
	}
.paymentMethodTable th {
	border-bottom: none;
    color: #fff;
    font-size: 15px;
	background-color: transparent;
    font-weight:bold;
    font-style:italic;
    
	}
.paymentMethodTable {
  background-color: #3379D4;
  background-image: url(images/radial_bg.png);
  background-position: center center;
  background-repeat: no-repeat;
  /*opera safari chrome support*/
  -webkit-border-radius: 15px;
  /*firefox*/
  -moz-border-radius: 15px;
  border-radius: 15px;

  /* Safari 4-5, Chrome 1-9 */
  /* Can't specify a percentage size? Laaaaaame. */
  background: -webkit-gradient(radial, center center, 0, center center, 460, from(#479DE6), to(#3379D4));

  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(circle, #479DE6, #3379D4);

  /* Firefox 3.6+ */
  background: -moz-radial-gradient(circle, #479DE6, #3379D4);

  /* IE 10 */
  background: -ms-radial-gradient(circle, #479DE6, #3379D4);

  /* Opera couldn't do radial gradients, then at some point they started supporting the -webkit- syntax, how it kinda does but it's kinda broken (doesn't do sizing) */
}
 .billingTable th {
	border-bottom: none;
    color: #70b0f3;
    font-size: 15px;
	background-color: transparent;
	}
.viewCart th {
	border-bottom: 1px solid #101010;
    color: #eee;
    font-size: 15px;
	background-color: #2C2C31;
	}
.viewCart td, .viewCartShort td, .payPlan td, .summaryCart td, .shippingInfo td, .billingInfo td, .paymentInfo td {
	border-bottom: 1px solid #101010;
    background-color: #313136;
  color:#fff;
	}

.subtotal td {
	background-color: #F4F7FE;
	font-weight: bold; !important;
    color:#171717
	}

.financeCharge {
    font-size: 12px;
    color: #777;
    }
 input[type="text"], select, .checkoutShort {
    background:#2c2c31;
   /* margin:10px auto 20px auto;*/
   margin:0 auto 20px auto;
    color:#fff;
     -webkit-border-radius: 5px 5px 5px 5px;-moz-border-radius:5px 5px 5px 5px;border-radius: 5px 5px 5px 5px;
  border:1px solid #000;
    
}
  input[type="text"]:focus { 
    background-color: #dcdcdc;
    color:#000;
  border: 5px solid #2874DA;
}
  select#cardType, input#cardNumber, select#expirationMonth, select#expirationYear, input#verificationCode {
  background:#dcdcdc;
    margin:10px auto 20px auto;
    color:#000;
     -webkit-border-radius: 5px 5px 5px 5px;-moz-border-radius:5px 5px 5px 5px;border-radius: 5px 5px 5px 5px;
  border:1px solid #2874DA;
}


.checkoutLabel, .rightAlign {
    color:#70B0F3;
    font-style:italic;
    font-weight:bold;
  }
table.paymentMethodTable span.smallHeader {
  display:none;
}
table.paymentMethodTable img.paymentIcon {
  content: url('https://tk143.files.keap.app/tk143/tk143-cb31c2ec-2a09-4234-bcc8-7a2d6cf79f5e-v2');
  position: absolute;
  top: 184px;
  right: 25px;
  height: 166px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.pay4 .paymentLabel {
  text-indent: -9999px;
  line-height: 0; /* Collapse the original line */
}

.pay4 .paymentLabel::after {
  content: "CVC CODE";
  text-indent: 0;
  display: block;
  line-height: initial; /* New content takes up original line height */
  margin-top:-10px;
}
/* UPSELLS
===============================================================*/

.upsell {
	background-color: #fff;
	border: 1px solid #e0e9ea;
    color: #222;
    line-height: 1.2;
}

#upsellContainer img {
	border: 1px solid #e0e9ea;
	}

.upsellRegPrice {
	font-style: italic;
    margin-bottom: 7px;
	}



/* TYPOGRAPHY
===============================================================*/

h1 {
    /* Used for product and page headers */
	font: 32px 'Doppio One';
    color:#C4C6C8;
    display:block;
    text-align:center;
    font-style: italic; 
    font-weight:bold;
	color: #C4C6C8;
	margin: 0 0 15px 0;
  padding:10px;
	}

h2 {
    /* Used for product description header */
	font: 21px Arial,'Doppio One';
    font-weight: normal;
	color: #c21a1a;
	margin: 0 0 5px 0;
	}

h3 {
    /* Used for product grid headline */
	font: 18px Arial, 'Doppio One';
    font-weight: normal;
	color: #ddd;
	border-bottom: 4px double #292929;
	}

h4 {
	font-size: 15px;
	color: #ec5b5b;
	}

.tableHeader {
	font-size: 15px;
    font-weight: bold;
	color: #222;
	}


.smallHeader {
	font-size: 15px;
	font-weight: bold;
	}



/* LINKS AND BUTTONS
===============================================================*/

a {
	color: #C21A1A;
	}

a:hover {
	color: #C21A1A;
	}

 .newsButton, .formButton, .searchButton, .cartButton, .codeButton, .continueButton {
    display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font-size: 15px;
	color: #fff;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: 4px; 
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
	border: solid 1px #666;
	background: #444;
	background: -webkit-gradient(linear, left top, left bottom, from(#777777), to(#444444));
	background: -moz-linear-gradient(top,  #777777,  #444444);
    background: linear-gradient(to bottom,  #777777,  #444444);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#777777', endColorstr='#444444');
    font-family: Arial, 'Doppio One';
	}

.upsellButton {
    display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font-size: 13px;
	color: #fff;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: 4px; 
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
	border: solid 1px #666;
	background: #444;
	background: -webkit-gradient(linear, left top, left bottom, from(#777777), to(#444444));
	background: -moz-linear-gradient(top,  #777777,  #444444);
    background: linear-gradient(to bottom,  #777777,  #444444);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#777777', endColorstr='#444444');
    font-family: Arial, 'Doppio One';
	}

.searchButton:hover, .cartButton:hover, .codeButton:hover, .continueButton:hover, .upsellButton:hover {
	color: #fff;
    background: #444;
	background: -webkit-gradient(linear, left top, left bottom, from(#888888), to(#555555));
	background: -moz-linear-gradient(top,  #888888,  #555555);
    background: linear-gradient(to bottom,  #888888,  #555555);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#555555');
	text-decoration: none;
	}

.buttonRight a:hover, .buttonLeft a:hover {
	color: #4e6364;
	}
/* gradient buttons start*/
 
  .continueButton {
  background: #52a8e8; /* Old browsers */
  background: -moz-linear-gradient(top, #52a8e8 0%, #377ad0 61%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#52a8e8), color-stop(61%,#377ad0)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #52a8e8 0%,#377ad0 61%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #52a8e8 0%,#377ad0 61%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #52a8e8 0%,#377ad0 61%); /* IE10+ */
  background: linear-gradient(to bottom, #52a8e8 0%,#377ad0 61%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#52a8e8', endColorstr='#377ad0',GradientType=0 ); /* IE6-9 */
  border-top: 1px solid #4081af;
  border-right: 1px solid #2e69a3;
  border-bottom: 1px solid #20559a;
  border-left: 1px solid #2e69a3;
  -moz-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3;
  -webkit-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3;
  text-shadow: 0 -1px 1px #3275bc;
  -webkit-border-radius: 5px 5px 5px 5px;-moz-border-radius: 5px 5px 5px 5px;border-radius: 5px 5px 5px 5px;
}
  .continueButton:hover {
  background: #2a81d7;
  background: -moz-linear-gradient(0% 100% 90deg, #206bcb, #3e9ee5);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#3e9ee5), to(#206bcb));
  border-top: 1px solid #2a73a6;
  border-right: 1px solid #165899;
  border-bottom: 1px solid #07428f;
  border-left: 1px solid #165899;
  -moz-box-shadow: inset 0 1px 0 0 #62b1e9;
  -webkit-box-shadow: inset 0 1px 0 0 #62b1e9;
  cursor: pointer;
  text-shadow: 0 -1px 1px #1d62ab;
  -webkit-border-radius: 5px 5px 5px 5px;-moz-border-radius: 5px 5px 5px 5px;border-radius: 5px 5px 5px 5px;
}
 .continueButton:active {
  background: #3282d3;
  border: 1px solid #154c8c;
  border-bottom: 1px solid #0e408e;
  -moz-box-shadow: inset 0 0 6px 3px #1657b5, 0 1px 0 0 #fff;
  -webkit-box-shadow: inset 0 0 6px 3px #1657b5, 0 1px 0 0 #fff;
  text-shadow: 0 -1px 1px #2361a4;
  -webkit-border-radius: 5px 5px 5px 5px;-moz-border-radius: 5px 5px 5px 5px;border-radius: 5px 5px 5px 5px;
}
  .continueButton[disabled],
.continueButton[disabled]:hover,
.continueButton[disabled]:active {
  background: #999;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#dadada), to(#f3f3f3));
  border-top: 1px solid #c5c5c5;
  border-right: 1px solid #cecece;
  border-bottom: 1px solid #d9d9d9;
  border-left: 1px solid #cecece;
  color: #8f8f8f;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  cursor: not-allowed;
  text-shadow: 0 -1px 1px #ebebeb;
 -webkit-border-radius: 5px 5px 5px 5px;-moz-border-radius: 5px 5px 5px 5px;border-radius: 5px 5px 5px 5px;
}
   .codeButton {
  background: #fff;
  color:#000;
  font-style: italic; 
  font-weight:bold;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #000;
  -webkit-border-radius: 5px 5px 5px 5px;-moz-border-radius: 5px 5px 5px 5px;border-radius: 5px 5px 5px 5px;
}
   #reviewOrderButton {
    background: #ABD001;
  
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #000;
  text-shadow: 0 -1px 1px #3275bc;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
  .subtotal {
    margin-top:3em;
    margin-bottom:2.5em;
    background-color:#F4F7FE;
    color:#1E1F1F;
  }
  
  /*gradient buttons end*/

 


/* FOOTER
===============================================================*/

#footer {
  color:#fff;
  font-size:1em;
  font-style:italic;
	}



/* MISC
===============================================================*/

.errorMessage {
	color: #c21a1a;
	}

.forgotPasswordTable td {
    color: #ddd;
    }