/* 
   Theme Name: Stafford Slipknot
   Theme URI: http://www.staffordslipknot.com
   Description: Theme developed for Stafford Manufacturing.
   Updated: 5 SEPTEMBER 2008
   Version: 1.0
   Author: Doc4
   Author URI: http://www.doc4design.com
   
   ----------------------------------------------------*/


#banner {
   width: 276px;
   height: 143px;
   right: 0;
   top: 0;
   position: absolute;
   display: block;
   text-indent: -999em;
   text-decoration: none;
   background: url(images/banner.png) no-repeat;
   z-index: 999;
   }


/* BASIC
   ----------------------------------------------------*/

* {
   margin: 0;
   padding: 0;
   }

html {
   height: 100%;
   }

body {
   height: 100%;
   color: #4D4D4D;
   font: 12px Arial, Helvetica, sans-serif;
   line-height: 150%;
   background: #FFF url(images/bg.png) 0 0 repeat-x;
   }

#content {
   width: 778px;
   margin: 0 auto;
   padding: 10px 0 100px;
   }

#page-group {
   height: 100%;
   }

.copy_halves {
   width: 50%;
   margin: 0 20px 0 0;
   }

.copy_halves-left, .copy_halves-right {
   width: 371px;
   margin-top: 10px;
   float: left;
   display: inline;
   }

.copy_halves-left {
   margin-right: 23px;
   }

.copy_thirds, .copy_thirds-end {
   width: 251px;
   margin-bottom: 30px;
   }

.copy_thirds {
   margin-right: 10px;
   float: left;
   display: inline;
   }

.copy_thirds-end {
   float: right;
   display: inline;
   }

.copy_thirds-wrap {
   width: 258px;
   float: left;
   }

.copy_thirds-stack {
   width: 100%;
   margin: 0 10px 30px 0;
   float: left;
   display: inline;
   }


/* TEXT STLYES
   ----------------------------------------------------*/

a {
   text-decoration: none;
   }

a:link, a:visited {
   color: #178BBF;
   }

a:active, a:hover {
   color: #999;
   }

li {
   margin: 0 0 8px;
   }

h1, h2 {
   padding: 10px 0 8px;
   color: #4D4D4D;
   font: 100 28px Helvetica, Arial, sans-serif;
   }

h1 {
   margin: 11px 0 10px;
   }

h2 {

   }

h3 {
   margin: 20px 0 10px;
   clear: both;
   color: #4D4D4D;
   font: normal 20px Helvetica, Arial, sans-serif;
   }

.headline-red {
   margin: 15px 0 5px;
   color: #CF0000;
   text-transform: uppercase;
   font: normal 13px Helvetica, Arial, sans-serif;
   }

.copy_halves-left h3, .copy_halves-right h3 {
   padding-bottom: 10px;
   }

ul {
   padding: 0 0 0 15px;
   }

ul.xtra {
   margin: 10px 0 0 12px;
   padding: 0;
   }

p {
   margin: 10px 0 0;
   }



/* BODY BACKGROUND  
   ----------------------------------------------------*/

#shadow {
   width: 808px;
   margin: 0 auto;
   background: url(images/bg-shadow.png) 0 0 no-repeat;
   }


/* CONTAINERS  
   ----------------------------------------------------*/

#container-body {
   min-height: 100%;
   _height: 100%; /* IE6 DOES NOT UNDERSTAND MIN-HEIGHT */
   position: relative;
   }

#container-company {
   width: 800px;
   margin: 0 auto;
   }

#container-footer {
   width: 100%;
   height: 45px;
   margin: -51px 0 0;
   padding: 5px 0 0;
   position: relative;
   border-top: 1px solid #CCC;
   clear: both;
   }


/* STAFFORD HEADER   
   ----------------------------------------------------*/

#company, #company-left, #company-right {
   height: 45px;
   display: inline;
   float: left;
   }

#company {
   width: 782px;
   background: url(images/company-mid.gif) 0 0 repeat-x;
   }

#company-left, #company-right {
   width: 9px;
   }

#company-left {
   background: url(images/company-left.png) 0 0 no-repeat;
   }

#company-right {
   background: url(images/company-right.png) 0 0 no-repeat;
   }

.company-logo a {
   width: 120px;
   height: 40px;
   margin: 2px 0 0;
   display: inline;
   float: left;
   background: url(images/company-logo.gif) 0 0 no-repeat;
   }

#company-nav {
   padding: 17px 8px 0 0;
   display: inline;
   float: right;
   color: #CCC;
   font: normal 10px Helvetica, Arial, sans-serif;
   }
   
   


/* SLIPKNOT HEADER   
   ----------------------------------------------------*/

#header {
   width: 800px;
   height: 162px;
   margin: 15px auto 0;
   background: url(images/header-bg.png) 0 0 no-repeat;
   }

.slipknot-logo {
   width: 210px;
   height: 95px;
   display: block;
   position: relative;
   top: -1px;
   left: 325px;
   background: url(images/slipknot.png) 0 0 no-repeat;
   }

.innovations-logo a {
   width: 126px;
   height: 38px;
   display: block;
   position: relative;
   top: 14px;
   left: 660px;
   background: url(images/logo-innovations.png) 0 0 no-repeat;
   }



/* NAVIGATION GLOBAL 
   ----------------------------------------------------*/

/* reference: http://www.catswhocode.com/blog/web-design/how-to-recreate-applecom-menubar-38 */

#container-globalnav { 
   width: 527px; 
   height: 27px; 
   margin: 1px 0 0 -15px;
   position: relative; 
   /*z-index: 1000; Keep This For As A Backup */ 
   }

#container-globalnav #globalnav { 
   }

#container-globalnav #globalnav li { 
   display: inline; 
   }

#container-globalnav #globalnav li a { 
   height: 0;
   padding-top: 27px;
   float: left; 
   overflow: hidden; 
   }

#container-globalnav #globalnav li a { 
   background-image: url(images/globalnavbg.jpg);
   background-repeat: no-repeat; 
   }



/* NAVIGATION GLOBAL - STATIC
   ----------------------------------------------------*/

#container-globalnav #globalnav li#gn-home a {
   width: 55px;  
   background-position: 0 0;
   }

#container-globalnav #globalnav li#gn-about a { 
   width: 137px;
   background-position: -55px 0;
   }

#container-globalnav #globalnav li#gn-products a { 
   width: 81px;
   background-position: -192px 0;
   }

#container-globalnav #globalnav li#gn-policies a { 
   width: 70px;
   background-position: -274px 0; 
   }

#container-globalnav #globalnav li#gn-community a { 
   width: 89px;
   background-position: -344px 0; 
   }

#container-globalnav #globalnav li#gn-contact a { 
   width: 76px;
   background-position: -433px 0;
   }


/* NAVIGATION GLOBAL - HOVER
   ----------------------------------------------------*/

#container-globalnav #globalnav li#gn-home a:hover { 
   background-position: 0 -28px; 
   }

#container-globalnav #globalnav li#gn-about a:hover { 
   background-position: -55px -28px; 
   }

#container-globalnav #globalnav li#gn-products a:hover { 
   background-position: -192px -28px;
   }

#container-globalnav #globalnav li#gn-policies a:hover { 
   background-position: -274px -28px; 
   }

#container-globalnav #globalnav li#gn-community a:hover { 
   background-position: -344px -28px; 
   }

#container-globalnav #globalnav li#gn-contact a:hover { 
   background-position: -433px -28px; 
   }


/* NAVIGATION GLOBAL - PAGE
   ----------------------------------------------------*/

#container-globalnav.home #globalnav li#gn-home a {
   width: 55px; 
   background-position: 0 -28px !important; 
   }

#container-globalnav.about #globalnav li#gn-about a {
   width: 137px;  
   background-position: -55px -28px !important; 
   }

#container-globalnav.products #globalnav li#gn-products a { 
   width: 81px; 
   background-position: -192px -28px !important; 
   }

#container-globalnav.policies #globalnav li#gn-policies a { 
   width: 70px; 
   background-position: -274px -28px !important; 
   }

#container-globalnav.community #globalnav li#gn-community a { 
   width: 89px; 
   background-position: -344px -28px !important; 
   }

#container-globalnav.contact #globalnav li#gn-contact a {
   width: 76px;  
   background-position: -433px -28px !important; 
   }



/* NAVIGATION PAGE
   ----------------------------------------------------*/
   
#company-nav a, #footer-nav a {
   color: #CCC;
   }

#company-nav a:hover, #footer-nav a:hover {
   color: #FFC21F;
   }

#page-nav {
   margin: 0 -10px 0 0;
   padding: 10px 0 0;
   float: right;
   }

#page-nav a {
   padding: 0 20px 0 0;
   color: #178BBF;
   font: bold 14px Helvetica, Arial, sans-serif;
   }

#page-nav a:hover, #page-nav a.current {
   color: #6F6F6F;
   }



/* LEGAL   
   ----------------------------------------------------*/

.revisions {
   margin: 10px 0 0;
   color:#4D4D4D;
   font: 100 12px Helvetica, Arial, sans-serif;
   text-transform: uppercase;
   }

.columns {
   column-count: 2;
   column-width: 380px;
   column-gap: 15px;
   }



/* ABOUT THE SLIPKNOT   
   ----------------------------------------------------*/

.info-cube {
   width: 252px;
   margin: 10px 11px 0 0;
   padding: 0 0 6px;
   float: left;
   display: inline;
   background: url(images/info-cube.gif) 0 0 no-repeat;
   }

.info-cube_double {
   width: 515px;
   margin: 10px 0 0;
   padding: 0 0 6px;
   float: left;
   display: inline;
   background: url(images/info-cube_double.gif) 0 0 no-repeat;
   }

.info-cube_inner {
   float: left;
   }

.info-cube_end {
   width: 252px;
   margin: 10px 0 0;
   padding: 0 0 6px;
   float: left;
   display: inline;
   background: url(images/info-cube.gif) 0 0 no-repeat;
   }

.info-cube_body {
   margin: 6px 0 0 4px;
   }

.info-cube img, .info-cube_end img {
   width: 243px;
   height: 178px;
   }

.info-full {
   width: 778px;
   margin: 10px 0 0;
   float: left;
   display: inline;
   background: url(images/info-full_header.gif) 0 0 no-repeat;
   }

.info-full_body {
   width: 770px;
   height: 100%;
   margin: 4px 0 0;
   padding: 0 0 0 4px;
   border-left: 2px solid #7D7D7D;
   border-right: 2px solid #7D7D7D;
   }

.info-full_footer {
   width: 778px;
   height: 40px;
   background: url(images/info-full_footer.gif) 0 0 no-repeat;
   clear: both;
   }

.info-halves_left, .info-halves_right {
   width: 380px;
   margin: 20px 0 0;
   display: inline;
   background: url(images/info-halves_header.gif) 0 0 no-repeat;
   }

.info-halves_imgLeft, .info-halves_imgRight {
   width: 380px;
   margin: 20px 0 0;
   display: inline;
   background: url(images/info-halves_imgheader.gif) 0 0 no-repeat;
   }

.info-halves_left, .info-halves_imgLeft {
   float: left;
   }

.info-halves_right, .info-halves_imgRight {
   float: right;
   }

.info-halves_body {
   width: 371px;
   margin: 4px 0 0;
   padding: 0 0 0 5px;
   border-left: 2px solid #7D7D7D;
   border-right: 2px solid #7D7D7D;
   }

.info-halves_body img {
   width: 366px;
   height: 229px;
   margin: 7px 0 0;
   }

.info-halves_footer {
   width: 380px;
   height: 40px;
   background: url(images/info-halves_footer.gif) 0 0 no-repeat;
   }

.info-header, .info-subheader {
   height: 20px;
   color: #FFF;
   font-weight: 100;
   font-family: Helvetica, Arial, sans-serif;
   }

.info-header {
   width: 221px;
   margin: 9px 0 0 13px;
   font-size: 15px;
   }

.info-subheader {
   width: 221px;
   margin: 12px 0 0 15px;
   font-size: 12px;
   }

.info-instruction {
   width: 236px
   height: 100px;
   margin: 20px 0 10px;
   padding: 0 10px 10px 10px;
   border-bottom: 1px solid #7D7D7D;
   }



/* TEST DATA   
   ----------------------------------------------------*/

.info-subheader_bore, 
.info-subheader_diameter, 
.info-subheader_style, 
.info-subheader_weight {
   height: 20px;
   margin-top: 15px;
   float: left;
   font: 11px Arial, Helvetica, sans-serif;
   color: #2F2F2F;
   }

.info-subheader_bore {
   position: relative;
   left: 22px;
   }

.info-subheader_diameter {
   position: relative;
   left: 54px;
   }

.info-subheader_style {
   position: relative;
   left: 76px;
   }

.info-subheader_weight {
   position: relative;
   left: 144px;
   }

.info-bore,
.info-diameter,
.info-style,
.info-weight {
   height: 27px;
   padding: 5px 0 0 7px;
   float: left;
   border-right: 1px solid #CCC;
   border-bottom: 1px solid #CCC;
   }

.info-bore,
.info-diameter,
.info-weight {
   text-align: center;
   }

.info-bore {
   width: 69px;
   }

.info-diameter {
   width: 99px;
   }

.info-style {
   width: 101px;
   }

.info-weight {
   width: 66px;
   border-right: none;
   }


/* APPLICATIONS   
   ----------------------------------------------------*/

.photo-frame {
   width: 252px;
   height: 221px;
   margin: 10px 11px 0 0;
   padding: 0 0 6px;
   float: left;
   display: inline;
   background: url(images/photo-frame.jpg) 0 0 no-repeat;
   }

.photo-frame_end {
   width: 252px;
   height: 221px;
   margin: 10px 0 0;
   padding: 0 0 6px;
   float: left;
   display: inline;
   background: url(images/photo-frame.jpg) 0 0 no-repeat;
   }

.photo-frame img, .photo-frame_end img {
   width: 214px;
   height: 163px;
   margin: 14px 0 0 17px;
   border: 0;
   }


/* PRODUCTS  
   ----------------------------------------------------*/

.slipknot1-blueprint,
.slipknot2-blueprint {
   width: 510px;
   height: 536px;
   float: right;
   display: inline;
   position: relative;
   left: 11px;
   }

.slipknot1-blueprint {
   top: 15px;
   background: url(images/blueprint1.jpg) 0 0 no-repeat;
   }

.slipknot2-blueprint {
   padding: 0 0 8px;
   background: url(images/blueprint2.jpg) 0 0 no-repeat;
   }

.slipknot2-blueprint2 {
   width: 275px;
   height: 188px;
   margin: -5px 0 0;
   background: url(images/blueprint3.jpg) 0 0 no-repeat;
   }


/* PRODUCT LIST   
   ----------------------------------------------------*/

.info-subheader_sku, 
.info-subheader_product, 
.info-subheader_description, 
.info-subheader_price, 
.info-subheader_purchase,
.info-subheader_priceeach,
.info-subheader_quantity,
.info-subheader_remove,
.info-subheader_total {
   height: 20px;
   margin-top: 15px;
   float: left;
   font: normal 11px Arial, Helvetica, sans-serif;
   color: #2F2F2F;
   }

.info-subheader_sku {
   position: relative;
   left: 15px;
   }

.info-subheader_product {
   position: relative;
   left: 85px;
   }

.info-subheader_description {
   position: relative;
   left: 216px;
   }

.info-subheader_price {
   position: relative;
   left: 465px;
   }

.info-subheader_purchase {
   position: relative;
   left: 541px;
   }

.info-subheader_priceeach {
   position: relative;
   left: 280px;
   }

.info-subheader_quantity {
   position: relative;
   left: 334px;
   }

.info-subheader_remove {
   position: relative;
   left: 403px;
   }

.info-subheader_total {
    position: relative;
   left: 520px;
   }

.info-sku,
.info-product,
.info-product_cart, 
.info-description, 
.info-price, 
.info-purchase,
.info-priceeach,
.info-quantity,
.info-remove,
.info-total {
   height: 45px;
   padding: 5px 0 0 9px;
   float: left;
   border-right: 1px solid #CCC;
   border-bottom: 1px solid #CCC;
   }

.info-sku {
   width: 85px;
   }

.info-product {
   width: 159px;
   }

.info-product_cart {
   width: 212px;
   }

.info-description {
   width: 255px;
   padding-right: 9px;
   }

.info-description p {
   margin: 0; /* necessary */
   }

.info-price {
   width: 97px;
   }

.info-purchase {
   width: 112px;
   border-right: none;
   }

.info-priceeach {
   width: 100px;
   }

.info-quantity {
   width: 100px;
   }

.info-quantity input {
   width: 40px;
   height: 20px;
   margin: 0 0 0 20px;
   padding: 4px; 
   border: 2px solid #FFE1A3;
   text-align: center;
   }

.info-remove {
   width: 100px;
   }

.info-total {
   width: 109px;
   text-align: right;
   border-right: none;
   }

.info-total_text {
   margin-right: 14px;
   }

.info-subtotal, 
.info-postage,
.info-expense {
   float: left;
   font-weight: bold;
   }

.info-amount,
.info-expense_amount {
   float: right;
   padding: 0 20px 0 0;
   }

.info-subtotal {
   padding: 0 0 0 626px;
   font-size: 13px;
   }

.info-postage {
   padding: 0 0 0 628px;
   font-size: 13px;
   clear: both;
   }

.info-expense {
   padding: 15px 0 0 567px;
   font-size: 20px;
   clear: both;
   }

.info-expense_amount {
   margin: 15px 0 0 0;
   font-size: 20px;
   font-weight: bold;
   }

.price-tag, .price-tag-cart {
   height: 36px;
   margin: 0 25px 0 0;
   padding: 8px 0 0 5px;
   color: #555;
   text-align: right;
   font: bold 20px Helvetica, Arial, sans-serif;
   /*background: url(images/price-tag.jpg) 0 0 no-repeat;*/
   }

input.btn-remove {
   height: 34px;
   margin: 0 0 0 28px;
   background: url(images/btn-remove.jpg) 0 0 no-repeat;
   }

input.btn-remove:hover {
   background: url(images/btn-remove.jpg) 0 -33px no-repeat;
   }

.btn-cart {
   width: 93px;
   height: 30px;
   margin: 5px 0 0 5px;
   background: url(images/btn-cart.jpg) 0 0 no-repeat;
   }

.btn-cart:hover {
   background: url(images/btn-cart.jpg) 0 -29px no-repeat;
   }



/* COMMUNITY   
   ----------------------------------------------------*/

.photo-stack {
   float: right;
   display: inline;
   position: relative;
   top: 9px;
   left: 11px;
   }

.photo-stack img {
   width: 368px;
   height: 332px;
   }

.btn-gallery {
   margin: 20px 0 0;
   position: relative;
   left: -5px;
   }

.btn-gallery img {
   width: 88px;
   height: 30px;
   background: url(images/btn-gallery.jpg) 0 0 no-repeat;
   text-decoration: none;
   }

.btn-gallery img:hover {
   background: url(images/btn-gallery.jpg) 0 -30px no-repeat;
   }




/* CONTACT   
   ----------------------------------------------------*/

#contact_left, #contact_right {
   width: 350px;
   display: inline;
   }

#contact_left {
   float: left;
   }

#contact_right {
   float: right;
   }

.alert {
   width: 13px;
   height: 15px;
   padding: 0 8px 0 0;
   float: left;
   background: url(images/icon-alert.gif) 0 2px no-repeat;
   }

.success-msg {
   margin: 10px 0 0;
   padding: 20px 0 20px 10px;
   border-bottom: 1px solid #CCC;
   border-top: 1px solid #CCC;
   }

#btn-contact_submit {
   margin: 5px 0 30px 283px;
   }

#btn-contact_submit input.btn-contact {
   width: 70px;
   height: 30px;
   background: url(images/btn-contact.jpg) 0 0 no-repeat;
   text-decoration: none;
   }

#btn-contact_submit input.btn-contact:hover {
   background: url(images/btn-contact.jpg) 0 -29px no-repeat;
   }




/* SHOPPING CART  
   ----------------------------------------------------*/
#cart-note_placeholder {
   width: 180px;
   height: 92px;
   margin-bottom: -90px;
   position: relative;
   top: -64px;
   left: 626px;
   /* IE6 ISSUE DISPLAYING LINKS OVER BACKGROUND IMAGES */
   }


#cart-note_positioner {
   position: absolute;
   top: 0;
   left: 0;
   /* IE6 ISSUE DISPLAYING LINKS OVER BACKGROUND IMAGES */
   }

#cart-note_wrap {
   width: 180px;
   height: 92px;
   background: url(images/cart-note.png) 0 0 no-repeat;
   }

.cart-note, .cart-note_links {
   width: 180px;
   position: relative;
   text-align: right;
   }

.cart-note {
   top: 22px;
   right: 30px;
   color: #00ADEE;
   font: bold 24px Helvetica, Arial, sans-serif;
   }

.cart-note_links {
   top: 22px;
   right: 30px;
   }

.cart-note_links a:link, .cart-note_links a:visited {
   color: #000;
   font-size: 12px;
   position: relative;
   }
 
.cart-note_links a:hover, .cart-note_links a:active {
   color: #00ADEE;
   position: relative;
   }

#button-wrap {
   height: 69px;
   width: 120px;
   clear: both;
   position: relative;
   top: -21px;
   left: 10px;
   }

.btn-continue {
   margin-bottom: 39px;
   }

.btn-continue img {
   height: 30px;
   background: url(images/btn-continue.jpg) 0 0 no-repeat;
   }

.btn-continue img:hover {
   background: url(images/btn-continue.jpg) 0 -29px no-repeat;
   }

#sidebar-btn {
   position: relative;
   top: -30px;
   }
 
input.btn-checkout {
   height: 30px;
   background: url(images/btn-checkout.jpg) 0 0 no-repeat;
   }

input.btn-checkout:hover {
   background: url(images/btn-checkout.jpg) 0 -30px no-repeat;
   }

#pinfo {
   margin: 0 0 30px;
   padding: 10px 0 10px 20px;
   color: #D03C0A;
   font: bold 11px Helvetica, Arial, sans-serif;
   text-transform: uppercase; 
   border-bottom: 1px solid #CCC;
   border-top: 1px solid #CCC;
   }

.emptycart {
   padding: 38px 0 29px 232px;
   text-transform: uppercase;
   font: 100 16px Helvetica, Arial, sans-serif;
   }



/* FOOTER   
   ----------------------------------------------------*/

#footer {
   background-color: #333;
   }

#footer .inset {
   width: 800px;
   height: 45px;
   margin: 0 auto;
   background-color: #434343;
   }

#footer-credits, #footer-nav {
   display: inline;
   color: #CCC;
   font: normal 10px Helvetica, Arial, sans-serif;
   }

#footer-credits {
   padding: 17px 0 0 13px;
   float: left;
   }

#footer-nav {
   padding: 17px 13px 0 0;
   float: right;
   }




/* MISC 
   ----------------------------------------------------*/

.clearfix:after {
   content: "."; 
   display: block; 
   height: 0; 
   clear: both; 
   visibility: hidden;
   }

.clearfix {display:inline-block;}
   /* Hide from IE Mac \*/

.clearfix {display:block;}
   /* End hide from IE Mac */

.invisible {
   visibility: hidden;
   }




/* IE6 PNG TRANSPARENCY
   ----------------------------------------------------*/

body, #banner, #shadow, #company-left, #company-right, #header, .slipknot-logo, .innovations-logo a, #cart-note_wrap,  { behavior: url(http://www.staffordslipknot.com/wp-content/themes/default/iepngfix/iepngfix.htc) }