/*--tpss--*/

#checkoutLeft {
    font-size: 14px;
    box-sizing: border-box;
}


#checkoutLeft {
    border-width: 3px;
    margin-top: 0px;
    border-style: dashed;
    border-color: rgb(231, 231, 231);
    background-color: rgb(255, 255, 255);
    box-shadow: rgb(231, 231, 231) 0px 0px 15px 0;
    padding:20px;  
    border-radius: 2px;  
}                    
.checkoutForms select{
} 
         

#payWithCC {
    float: left;
    padding: 18px 0px;
    padding-bottom: 0px;
    width:100%;
}    
  
.outer_forms {
    float: left;
    padding: 0px 0px;
    margin-top: 15px; 
    width:100%; 

}  
#actionButton{
	    float: none;
    display: inline-block;
    text-align: center;
    width:100%!important;

} 
   
#actionButton .update:hover {
    background: #000!important;
    color: #fff!important;
}
     
  
#payWithCC .notes .formLabel{
	margin-top: 12px;  
} 


/*---------/tpssj-------*/ 
  #checkoutWrapper{
    width:600px;
    margin:0 auto;
    font-family:"Franklin Gothic Medium","Franklin Gothic","ITC Franklin Gothic",Arial,sans-serif!important;
    font-size:13px;
    line-height:18px;
    color:#333;
    max-width: 100%;
}
#checkoutWrapper a{
    text-decoration:none
}
#checkoutWrapper a img{
    border:0 none
}
#checkoutLeft{
    width:100%;
    float:left;
    border:1px solid #9DABBD;
    margin-right:18px;
    padding-bottom:7px
}
#checkoutProgress{
    margin:0!important;
    padding:0!important
}
#checkoutProgress .input_outer{
    list-style:none!important;
    position:relative;
    height:35px;
    float:left
}
#checkoutProgress .step1{
    z-index:3;
    background:url(/dap/images/checkout/step1.png) no-repeat 0 0;
    width:175px
}
#checkoutProgress .step1.done{
    background:url(/dap/images/checkout/step1d.png) no-repeat 0 0
}
#checkoutProgress .step2{
    z-index:2;
    background:url(/dap/images/checkout/step2.png) no-repeat 0 0;
    width:210px;
    left:-15px
}
#checkoutProgress .step2.current{
    background:url(/dap/images/checkout/step2c.png) no-repeat 0 0
}
#checkoutProgress .step2.done{
    background:url(/dap/images/checkout/step2d.png) no-repeat 0 0
}
#checkoutProgress .step3{
    z-index:1;
    background:url(/dap/images/checkout/step3.png) no-repeat 0 0;
    width:215px;
    left:-30px
}
#checkoutProgress .step3.current{
    background:url(/dap/images/checkout/step3c.png) no-repeat 0 0
}
#checkoutProgress .step3.done{
    background:url(/dap/images/checkout/step3d.png) no-repeat 0 0
}
#orderWrapper{
    padding:10px;
    padding-top:0;
    clear:both
}
#orderWrapper .orderTitle{
    border-bottom:1px dashed #333;
    font-size: 20px;
    background-color: inherit;
    padding: 10px 0px 10px;
    padding-left:0px;
    color: #555;
    margin-bottom:10px;
    margin-top:10px;
}
#Billing .orderTitle{
}
#paymentInformation .orderTitle{
}
#productInformation{
    margin:10px 0!important;
    padding:0!important
}
#productInformation .input_outer{
    list-style:none!important;
    padding:5px;
    border:1px solid #ddd;
    border-bottom:0 none;
    line-height:23px
}
#productInformation .productHeader{
    background:#eee;
    border:1px solid #ccc;
    color:#000
}
#productInformation .productTotal{
    background:#f9f9f9;
    border-bottom:1px solid #ddd;
    padding:0
}
#productInformation .input_outer div{
    display:inline-table;
    vertical-align:top
}
#productInformation .productName,#productInformation .couponCode{
    width:64%
}
#productInformation .couponCode{
    width:62%;
    color:#000;
    padding:2px 2px 2px 5px;
    vertical-align:middle
}
#productInformation .couponCode input[type="text"]{
    color:#369!important;
    background:#fff!important;
    border:1px solid #999!important;
    font-family:"Franklin Gothic Medium","Franklin Gothic","ITC Franklin Gothic",Arial,sans-serif!important;
    font-size:13px!important;
    padding:3px!important;
    width:135px!important;
    box-shadow:0 0 0 transparent;
    border-radius:0
}
#productInformation .couponCode .couponbtn{
    background:url(/dap/images/checkout/btn_apply.png) no-repeat 0 0!important;
    border:0 none!important;
    padding:0!important;
    width:61px!important;
    height:25px!important;
    text-indent:-9999px;
    cursor:pointer;
    border-radius:0;
    box-shadow:0 0 0 transparent
}
#productInformation .productName a{
    font-weight:700;
    color:#666;
    display:block
}
#productInformation .productAmount,#productInformation .cartTotal{
    width:30%;
    text-align:right;
    color:#000
}
#productInformation .cartTotal{
    width:29.5%;
    font-weight:700;
    vertical-align:middle
}
#productInformation .deleteProduct{
    margin-left:5px
}
#productInformation .deleteProduct img{
    margin-top:3px
}
#orderWrapper .infoBar{
    background:#FFC;
    border:1px dotted #999;
    padding:2px 0 2px 7px;
    color:#000;
    text-align:center
}
#orderWrapper .infoBar img{
    vertical-align:middle;
    margin:0 2px;
    border:0 none!important
}
#billingInfo{
    float:left;
    clear:both;
    margin:10px 0;
    width:100%
}
#Billing.expanded{
    width:100%
}
.orderTitle a{
    float:right;
    font-size:12px;
    color:#333
}
#Billing.expanded .addressConfirmation{
    width:48%;
    float:left
}
#Billing.expanded .addressConfirmation a{
    color:#333
}
#Billing.expanded .infoBar{
    float:right;
    padding:7px
}
#divShippingInformation .infoBar{
    padding:7px 0;
    text-align:center
}

.checkoutForms{
    margin:0!important;
    padding:0!important
}
.checkoutForms ..input_outer{
    list-style:none!important;
    border:0px solid #ddd;
    margin:8px 0;
    line-height:normal;
    float:left;
    width:100%
}
.checkoutForms .formLabel{
    display:inline-table;
    vertical-align:middle;
    padding:10px;
    border-right:0px solid #ddd;
    text-align:left;
    font-size: 14px;
}


.checkBillingAddress{
    margin-top:5px
}
#additionalInfo{
    float:left;
    width:100%;
    clear:both
}
#additionalInfo .textarea{
    font:inherit!important;
    padding:0!important
}
#additionalInfo .textarea .formLabel{
    height:60px;
    float:left
}


#comments{
    clear:both;
    margin:0;
    padding:0;
    background:transparent;
    border:0 none
}
#comments textarea{
    color:#000!important;
    background:#fff url(/dap/images/checkout/bg_textbox.png) repeat-x 100% 0!important;
    border:1px solid #999!important;
    font-family:"Franklin Gothic Medium","Franklin Gothic","ITC Franklin Gothic",Arial,sans-serif!important;
    font-size:13px!important;
    padding:4px!important;
    min-width:465px;
    height:65px;
    box-shadow:0 0 0 transparent;
    border-radius:0
}
#termsConditions{
    float:left;
    width:100%;
    clear:both;
    margin:10px 0
}
#termsConditions textarea{
    float:left;
    clear:both;
    position:relative;
    color:#333!important;
    background:#f1f1f1!important;
    border:1px solid #999!important;
    font-family:"Franklin Gothic Medium","Franklin Gothic","ITC Franklin Gothic",Arial,sans-serif!important;
    font-size:13px!important;
    padding:4px!important;
    min-width:465px;
    height:70px;
    box-shadow:0 0 0 transparent;
    border-radius:0
}
#termsConditions label{
    margin-top:5px;
    float:left;
    width:100%;
    clear:both
}
#termsConditions #tandc{
    vertical-align:middle
}
.colorGray{
    color:#999
}
#paymentInformation{
    float:left;
    width:100%;
    clear:both
}
#paymentInformation img{
    border:0 none;
    margin-bottom:0
}

#payWithCC{
    float:left
}
#payPal{
    width:27.5%;
    float:left
}
#payPal img{
    width:95%
}
#textOr{
    float:left;
    width:5%;
    text-align:center;
    padding:90px 0
}
#textOr.Confirmation{
    padding:79px 0
}
#payPal{
    float:right;
    text-align:center;
    border:1px dashed #bbb;
    padding:77px 0;
    margin-top:2px
}

#payPal.Confirmation{
    padding:61px 0;
    margin-top:2px
}
#payWithCC .formLabel{
    width:120px
}
#payWithCC .notes .formLabel{
    width:120px;
    position:relative;
    margin-bottom:-12px;
    float:left;
    margin-right:3px
}

#payWithCC .notes.expirationDate .formLabel{
    height:auto;
    margin-bottom:0
}

#payWithCC .cardCode input[type="text"]{
    vertical-align:middle
}
#payWithCC .cardCode img{
    vertical-align:middle
}
#payWithCC .ccImages{
    float:right;
    margin:1px 7px 0 0;
    min-width:168px
}

#payWithCC .checkoutNotes{
    font-size:11px;
    color:#777;
    padding:0 5px 3px 0;
    margin-top:10px;
    float:right
}

#payWithCC .actionButton{
    background:#9DABBD;
    border:0 none;
    text-align:center;
    padding:4px 1px 0
}

#checkoutRight{
    float:left;
    width:350px
}
#orderFeatures{
    border:1px solid #ddd;
    padding-bottom:10px
}
.checkoutTitle{
    font-size:17px;
    padding:10px;
    border-bottom:1px dashed #ddd
}
#orderFeatures ul{
    margin:0!important;
    padding:10px 0 0!important
}
#orderFeatures ul .input_outer{
    list-style:none!important;
    color:#369;
    background:url(/dap/images/checkout/icon_check.png) no-repeat 10px 50%;
    padding:5px 0 5px 30px
}
#orderTestimonials{
    margin:0 0 10px!important;
    padding:0!important
}
#orderTestimonials .input_outer{
    list-style:none!important;
    border-bottom:1px solid #eee;
    margin-top:10px
}
#orderTestimonials .testimonialTitle{
    font-size:17px;
    color:#369;
    padding:10px 0 5px 25px;
    margin-bottom:5px;
    background:url(/dap/images/checkout/quote_top.png) no-repeat 0 50%
}
#orderTestimonials .testimonialUser{
    font-size:14px;
    padding:5px 0;
    background:url(/dap/images/checkout/quote_bottom.png) no-repeat 100% 50%
}
#accessConfirmatoin{
    float:left;
    clear:both;
    width:100%;
    margin:0 0 30px
}
#accessConfirmatoin a{
    color:#000
}
#orderImage{
    text-align:center
}
#userLogin{
    float:left;
    width:96%;
    margin-bottom:10px;
    padding:10px;
    background:#9DABBD
}
#userLogin input[type="text"],#userLogin input[type="password"]{
    color:#000!important;
    background:#fff!important;
    border:1px solid #999!important;
    font-family:"Franklin Gothic Medium","Franklin Gothic","ITC Franklin Gothic",Arial,sans-serif!important;
    font-size:13px!important;
    padding:3px!important;
    width:198px!important;
    box-shadow:0 0 0 transparent;
    border-radius:0
}
#userLogin input[type="submit"]{
    background:#369;
    border:0 none!important;
    padding:2px 8px!important;
    cursor:pointer;
    border-radius:0;
    box-shadow:0 0 0 transparent;
    color:#fff!important;
    font-weight:700;
    font:inherit!important
}

#checkoutWrapper #paymentInformation .checkoutForms .expirationDate select, #checkoutWrapper #billingInfo select{
    -webkit-appearance: none;    -moz-appearance: none;    -ms-appearance: none;    -o-appearance: none;
    background-color: #fff;
    background-image: url(../images/down-arrow.png);
    background-repeat: no-repeat;
    background-position: 95%;
    background-size: 15px;  
}
#checkoutWrapper #billingInfo select {
    background-position: 98%; 
}
#userLogin a{
    font-size:14px;
    color:#fff;
    text-decoration:none
}
.terms{
    border-bottom:1px dashed #369;
    margin-bottom:35px;
    width:100%
}
.ordertermsTitle{
    width:452px;
    padding:8px 0 5px 25px;
    font-size:17px;
    color:#369;
    text-align:left
}
form#formPayment{
    padding:0!important;
    margin:0!important;
    width:auto!important
}
#errortext {
    border: 1px solid #9DABBD;
    margin-bottom: 14px;
    padding: 10px 8px;
    width: 100%;
    color: red;
    margin: 15px 0;
    font-size: 16px;
    font-weight: 600;
    box-sizing: border-box;
}
.actionButton{
    border:none!important;
    padding-right:13px;
    padding-top:13px;
    text-align:right;
    width:50%!important
}
#please{
    background:url(/dap/images/blueimages.png) no-repeat 10%;
    text-indent:-1000em;
    width:124px;
    height:26px;
    border:none;
    float:right
}
.formError{
    z-index:990
}
.formError .formErrorContent{
    z-index:991
}
.formError .formErrorArrow{
    z-index:996
}
.ui-dialog .formError{
    z-index:5000
}
.ui-dialog .formError .formErrorContent{
    z-index:5001
}
.ui-dialog .formError .formErrorArrow{
    z-index:5006
}
.inputContainer{
    position:relative;
    float:left
}
.formError{
    position:absolute;
    top:300px;
    left:300px;
    display:block;
    cursor:pointer;
    text-align:left
}
.formError.inline{
    position:relative;
    top:0;
    left:0;
    display:inline-block
}
.ajaxSubmit{
    padding:20px;
    background:#55ea55;
    border:1px solid #999;
    display:none
}
.formError .formErrorContent{
    width:100%;
    background:#ee0101;
    position:relative;
    color:#000;
    min-width:120px;
    font-size:11px;
    border:2px solid #ddd;
    box-shadow:0 0 6px #000;
    -moz-box-shadow:0 0 6px #000;
    -webkit-box-shadow:0 0 6px #000;
    -o-box-shadow:0 0 6px #000;
    padding:4px 10px;
    border-radius:6px;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    -o-border-radius:6px
}
.formError.inline .formErrorContent{
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    -o-box-shadow:none;
    border:none;
    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    -o-border-radius:0
}
.greenPopup .formErrorContent{
    background:#33be40
}
.blackPopup .formErrorContent{
    background:#393939;
    color:#FFF
}
.formError .formErrorArrow{
    width:15px;
    margin:-2px 0 0 13px;
    position:relative
}
body[dir='rtl'] .formError .formErrorArrow,body.rtl .formError .formErrorArrow{
    margin:-2px 13px 0 0
}
.formError .formErrorArrowBottom{
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    -o-box-shadow:none;
    margin:0 0 0 12px;
    top:2px
}
.formError .formErrorArrow div{
    border-left:2px solid #ddd;
    border-right:2px solid #ddd;
    box-shadow:0 2px 3px #444;
    -moz-box-shadow:0 2px 3px #444;
    -webkit-box-shadow:0 2px 3px #444;
    -o-box-shadow:0 2px 3px #444;
    font-size:0;
    height:1px;
    background:#ee0101;
    margin:0 auto;
    line-height:0;
    font-size:0;
    display:block
}
.formError .formErrorArrowBottom div{
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    -o-box-shadow:none
}
.greenPopup .formErrorArrow div{
    background:#33be40
}
.blackPopup .formErrorArrow div{
    background:#393939;
    color:#FFF
}
.formError .formErrorArrow .line10{
    width:15px;
    border:none
}
.formError .formErrorArrow .line9{
    width:13px;
    border:none
}
.formError .formErrorArrow .line8{
    width:11px
}
.formError .formErrorArrow .line7{
    width:9px
}
.formError .formErrorArrow .line6{
    width:7px
}
.formError .formErrorArrow .line5{
    width:5px
}
.formError .formErrorArrow .line4{
    width:3px
}
.formError .formErrorArrow .line3{
    width:1px;
    border-left:2px solid #ddd;
    border-right:2px solid #ddd;
    border-bottom:0 solid #ddd
}
.formError .formErrorArrow .line2{
    width:3px;
    border:none;
    background:#ddd
}
.formError .formErrorArrow .line1{
    width:1px;
    border:none;
    background:#ddd
}
#main .fullwidth-box .fusion-row{
    float:left
}
 .form-outer *{
    box-sizing: border-box;
 }

 .actionButton .btn_Update{
    border-radius: 0;
    padding: 22px 80px 22px;
    position: relative;
    text-align: center;
    min-height: auto;
    text-transform: capitalize;
    font-size: 20px;
    background-image:none;
    background: #e57e1e;
    color: #FFF;
    box-shadow: none;
    border: 0;
    font-weight: 400;
    border-radius: 4px;
    width: auto;
    min-width: 70%;
    max-width: 100%;
    margin-bottom: 15px;
    display: inline-block;
    cursor:pointer;
    box-sizing: border-box;
 }

 .checkoutForms .notes select {
    margin-top: 5px;
    margin-left: 0;
    margin-right: 10px;
}

#checkoutLeft .formFields {
    float: left;
    width: 100%;
}
#checkoutLeft .formFields input, #checkoutLeft .formFields select{
    width: 100%;
    float: left;
     max-width: 100%;
}

.checkoutForms input[type="text"], .checkoutForms input[type="email"], .checkoutForms textarea, .checkoutForms select {
    color: #333;
    background: #fff;
    border: 1px solid #999;
    font-family:Arial,sans-serif;
    font-size: 14px;
    padding: 5px;
    box-shadow: 0 0 0 transparent;
    border-radius: 2px;
    height:55px;
    width:100%;
    font-weight: normal;
}


.checkoutForms .expirationDate select{
    width: 35%;
    float: left;
}
/*.checkoutForms .expirationDate #exp_date {
    float: left;
}
.checkoutForms .expirationDate #exp_date_year {
    float: right;
}*/

.form-wrapper{
    width:600px; float:none; margin: auto;
}
.form-outer{
    border-width:0px; margin-top:0;border-style:none;border-top-style:none;
     border-top-width:0px;border-top-color:#eeeeee;  background-color:#ffffff; 
     box-shadow:rgb(204, 204, 204) 0px 0px 23px 0px
}
.form-control:focus {
    border: 2px solid #66afe9;
    border-color: #66afe9;
}
.form-outer .input_outer {
    margin-bottom: 15px;
    width: 100%;
    float: left;
}

.common_visibilitiy{
    display:none;
}

.common_nonvisibility{
    display:block;
}


.updatecc_outer #checkoutWrapper .common_visibilitiy {
    display: none !important;
}

.form-outer .form-control:focus {
    border: 2px solid #66afe9 !important;
    border-color: #66afe9;
}

.sweet-alert button:hover{
      background-image: none!important;
}
.sweet-alert .sa-button-container{
    margin-top: 20px;
    margin-bottom: 12px;
}
.sweet-alert button {
    background-image: none!important;
    margin: 0px 4px 0 4px!important;
    font-weight: 600!important;
}
.sweet-alert p {
    font-weight: 400!important;
    color: #333 !important;
     font-size: 16px!important;
}
.sweet-alert h2 {
    margin: 10px 0 0!important;
    color: #333 !important;
    font-size: 17px!important;
    padding: 0 !important;
    line-height: 28px !important;
}
.updatecc_outer{
    float: left;
    width: 100%;
    margin: 10px 0;
        position: relative;
    z-index: 99;
}

.checkoutForms .bemail_div input {
    background: #f4f4f4;
}

.checkoutForms select:focus, .checkoutForms option:focus, .checkoutForms select::-moz-focus-inner, .checkoutForms option::-moz-focus-inner {
    outline: none;
    border: none;
}

.checkoutForms input::-moz-placeholder, .checkoutForms textarea::-moz-placeholder, .checkoutForms select::-moz-placeholder {
    font-family: "Franklin Gothic Medium","Franklin Gothic","ITC Franklin Gothic",Arial,sans-serif;
}

.checkoutForms input::-webkit-placeholder, .checkoutForms textarea::-webkit-placeholder, .checkoutForms select::-webkit-placeholder {
    font-family: "Franklin Gothic Medium","Franklin Gothic","ITC Franklin Gothic",Arial,sans-serif;
}

.checkoutForms input::-ms-placeholder, .checkoutForms textarea::-ms-placeholder, .checkoutForms select::-ms-placeholder {
    font-family: "Franklin Gothic Medium","Franklin Gothic","ITC Franklin Gothic",Arial,sans-serif;
}

#errortextouter{
    display: none;
    float: left;
    width: 100%;
}
#checkoutLeft .formFields, .input_outer {  position:relative;}
.required_class1 {background: #fff;width: auto;clear: both;position: absolute;text-align: center;padding: 7px 10px;z-index: 99;border-radius: 3px;border: 1px solid red;color: red;right: 15px;top: 58px;	font-size: 13px;font-weight: normal;line-height: normal;}
.required_class1:after {content:"";width: 0;height: 0;border-left: 7px solid transparent;border-right: 7px solid transparent;border-bottom: 7px solid red;position: absolute;top: -7px;left: 5px;}.expirationDate .required_class1.month_req {    right: auto;  left: 0;}.expirationDate .required_class1.year_req { right: 55px;} 

@media screen and (-webkit-min-device-pixel-ratio:0){
    #userLogin input[type="submit"]{
        padding:4px 10px 3px!important
    }
}
@media screen and (max-width: 767px) {
    #checkoutLeft{
        padding:0;
        margin:0;
    }
    #orderWrapper {
        padding: 15px;
    }

}

@media screen and (max-width: 380px) {
    .outer_forms {
        width:100%;

    }
    #billingInfo .checkoutForms select {
      width: 100% !important;
    }   

    #checkoutWrapper #paymentInformation .checkoutForms .expirationDate select, #checkoutWrapper #billingInfo select {
        background-position: 98%;
    }
    .checkoutForms .expirationDate #exp_date {
        width: 47%;
        float: left;
    }
    .checkoutForms .expirationDate #exp_date_year {
        width: 47%;
        float: right;
        margin-right: 0px;
    }

}

@media screen and (max-width: 320px) {
    .outer_forms {
        width:100%;

    }
    .checkoutForms .expirationDate #exp_date {
       width: 100%;
        float: left;
        margin-right: 0px;
    }
    .checkoutForms .expirationDate #exp_date_year {
        width: 100%;
        float: left;
        margin-right: 0px;
    }
    #billingInfo .checkoutForms select {
      width: 100% !important;
    }   
}