/*############ Master Stylesheet Override ###############*/

H1.moduleTitle {
    margin:0px 25px 0px 25px !important;
}
.moduleContentContainer FORM { display:block !important; margin: 20px 25px;}
.moduleContentContainer FORM INPUT { font-size:11px; padding:2px 5px;}
.moduleContentContainer FORM INPUT.text {border:1px solid #ccc;}
/*#################### Checkout #########################*/


H2.checkoutStep {
    font-weight:normal;
    font-size:16px;
    padding:16px 0px;
    margin:0px 25px 35px 25px;
    border-top:1px solid #c5c5c5;
    border-bottom:1px solid #c5c5c5;
}

.steps {
    position:absolute;
    top:10px;
    right:20px;
    margin:0px;
    zoom:1;
    height:50px;
}
.steps .progressbar {
    position:absolute;
    z-index:1;
    top:25px;
    left:40px;
    right:25px;
    height:3px;
    overflow:hidden;
    background-color:#ccc;
}
.steps .step {float:left;height:50px;position:relative;z-index:2;}
.steps .step .title { text-align: center;}
.steps .step1 { width:90px;}
.steps .step2 { width:100px;}
.steps .step3 { width:100px;}
.steps .step4 { width:100px;}
.steps .step5 { width:100px;}
.steps .step4 { width:100px;}
.steps .step .marker {
    border:2px solid #ccc;
    background-color: #ccc;
    width:10px;
    height:10px;
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-5px;
    margin-top:-5px;
}
.step1 .step1 .marker {background-color:#666;}
.step2 .step2 .marker {background-color:#666;}
.step3 .step3 .marker {background-color:#666;}
.step4 .step4 .marker {background-color:#666;}
.step5 .step5 .marker {background-color:#666;}
.step6 .step6 .marker {background-color:#666;}


.navButtons {margin:30px 25px 30px 25px;position:relative;text-align:center;}
.navButtons .rightBtn {
    position: absolute;
    border:1px solid #aaa;
    padding:3px 5px;
    color:#000;
    top:0px;
    right:0px;
    background-color:#fff;
}
.navButtons .leftBtn {
    position: absolute;
    left:0px;
    border:1px solid #aaa;
    color:#000;
    padding:3px 5px;
    top:0px;
}


/*########## Checkout Step 1 - Shopping Cart ############*/

.shoppingcart TABLE {width:100%;}
.shoppingcart THEAD TH { text-align:left;background-color:#aaa;color:#fff;}
.shoppingcart TFOOT TH { text-align: left;border-top:1px solid #c5c5c5;}
.shoppingcart .total { text-align:right;}

.updateBtn {}
.continueShopping {}
.promoCode {
    position:relative;
    border:1px solid #ccc;
    background:#eee;
    width:340px;
    font-size:11px;
    padding:5px;
    font-weight: normal;
}
.promoCode INPUT {margin:0px 5px;}
.removePromoCode {
    display:block;
    height:16px;
    text-indent:-9999px;
    background:url('../images/clear_promo_bg.png') center top no-repeat;
}
.removePromoCode:hover {background-position:center -16px;}
.promoCodeError {
    margin:3px;
    border:1px solid #FFCCCC;
    background:#FFEEEE;
    font-size:10px;
    font-family: Arial;
}
.promoApplied {
    border:1px solid #afa;
    background:#efe;

}

/*########## Checkout Step 3 - Billing Shipping ############*/

FORM.step3 { margin:0px 20px;}
FORM.step3 TABLE {}
FORM.step3 H3 {
    background-color:#aaa;
    color:#fff;
    padding:5px 2px;
    margin-bottom:5px;
}	
FORM.step3 .formElement LABEL {
    float:left;
    width:90px;
    margin-right:5px;
    text-align:right;
}
FORM.step3 .copyBtns {width:80px;}
FORM.step3 .copyBtns BUTTON {margin-bottom:5px;}

/*########## Checkout Step 4 - Confirmation ############*/


FORM.step4 {}
FORM.step4 TABLE {width:100%;}

.termsandconditions {text-align:center;}


/*########## Checkout Step 5 - Payment ############*/



/*########## Checkout Step 6 - Success / Failure ############*/





FORM .validation-advice {
    font-family: Arial;
    font-size: 10px;
    margin-top:2px;
    margin-left:70px;
    border:1px solid #f00;
    background-color:#fee;
    width:180px;
    padding:2px;
}




.moduleContent {}


.form-field { margin-bottom:5px;}
.form-field LABEL {float:left; width:70px;text-align:right; margin-right:5px; }
.form-field INPUT.text {
    width:150px;
    border:1px solid #ccc;
    font-family: Arial;
    font-size: 11px;
    line-height: 14px;
    padding:2px;
}
TEXTAREA.text {
    padding:2px;
    border:1px solid #ccc;
    font-family: Arial;
    font-size: 11px;
    line-height: 14px;
}
.columns {overflow:auto; margin:0px 30px;}
.billingColumn,
.leftColumn {
    float:left;
    width:48%;
    margin-right:10px;
}
.rightColumn,
.shippingColumn {
    width:48%;
    float:left;
}

.trashHeader {
    background:url(../images/trash.gif) no-repeat 5px center;
}
.noItems {
    text-align: center;
    color:#999;
    font-size:32px;
}

#paymentMethodTabs {
    list-style: none;
    height:30px;
    text-align: center;

}
#paymentMethodTabs LI {
    display:inline;
    margin:0 10px;
}
#paymentMethodTabs LI.active {
}
#paymentMethods {margin: 0 auto 0 auto;}
.paymentMethod {
    height:300px;
    border:1px solid transparent;
}

/* eMatters Credit Card Processing */

FORM.ematters {
    width:450px;
    margin:0px 50px;
    display:block;
}
FORM.ematters .form-field { }
FORM.ematters .form-field LABEL { width:150px;line-height:14px;}
FORM.ematters .form-field INPUT,
FORM.ematters .form-field SELECT,
FORM.ematters .form-field TEXTAREA {
    font-size: 11px;
    font-family: Arial;
}
FORM.ematters .form-field INPUT.text,
FORM.ematters .form-field SELECT.text { border:1px solid #ccc;}
FORM.ematters .validation-advice {margin-left:150px;}
FORM.ematters .paymentAmountNote {
    text-align:center;
    font-size:14px;
    padding:5px;
    font-weight: bold;
    margin-bottom:20px;
}


.paymentError {
    margin:50px 50px;
    width:450px;
    border:1px solid red;
    background:#fee  url(../images/warning.png) 5px 5px no-repeat;
    padding-left:70px;
}

.paymentSuccess {
    margin:50px 50px;
    width:450px;
    padding-top:70px;
    background: url(../images/success.png) center 5px no-repeat;
}
.paymentSuccess H2 { text-align:center;font-size:32px;}
.paymentSuccess DL { margin-left:100px;}
.paymentSuccess DT { font-weight:bold; float:left; width:70px; margin-right:10px;text-align:right;}


/**********************************************************************
	Promo Codes Messages
**********************************************************************/


