﻿body {
}
@import url("//fonts.googleapis.com/css?family=Open+Sans");



/* Center the loader */
#loader-container {
    position: absolute;
    width:100%;
    height:100%;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 99999;
    display: none;
}

#loader-holder {
    position: absolute;
    left: 50%;
    top: 50%;
    text-align:center;
    margin: 50px 0 0 50px;  
    width: 110px; 
}


#loader-capt{
   
    color:#fff ;
    text-transform: uppercase;
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 20px;

}

#loader {
    /*margin: 40px 0 0 40px;*/
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #3498db;
    -webkit-animation: spin 0.8s linear infinite;
    animation: spin 0.8s linear infinite;
    width: 110px;
    height: 110px;
    margin-bottom: 20px;
}

#loader-text{
    color:#fff ;
   
}





#loader-holder {
    position: absolute;
    left: 50%;
    top: 30%;
    text-align:center;
    margin: -50px 0 0 -50px;  
}

@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Add animation to "page content" */
.animate-bottom {
    position: relative;
    -webkit-animation-name: animatebottom;
    -webkit-animation-duration: 1s;
    animation-name: animatebottom;
    animation-duration: 1s
}

@-webkit-keyframes animatebottom {
    from { bottom:-100px; opacity:0 } 
    to { bottom:0px; opacity:1 }
}

@keyframes animatebottom { 
    from{ bottom:-100px; opacity:0 } 
    to{ bottom:0; opacity:1 }
}

#myDiv {
    display: block;
    text-align: center;
}





#errorPanelHolder {
    display: none;
   
    margin: 0;
}






.container {
    margin:0 auto;
    /*padding-top: 20px;*/
    width: 1188px;
    position: relative;
}






#buttons {
    height:45px;
    margin-top:5px;
    padding-left: 9px;
    padding-right: 9px;
}

.tab-button {
    display: inline-block;
    color: #0286ce;
    width: 285px;
    height: 45px;
    text-align: center;
    display:table-cell;
    vertical-align:middle;
    cursor: pointer;
    border-style: solid;
    border-color: #0286ce #949494 #0286ce #949494;
    border-width: 3px 1px 0 1px;
    
}

.tab-button[d="true"] {
    
    color: #777;
    background-color: #f1f1f1;
    border-style: solid;
    border-color: #949494 #949494 #0286ce #949494;
    border-width: 1px 1px 1px 1px;
    
}



.tab-button[d="true"] div {
    background-color: #777;
}

.tab-button div {
    
    display: inline-block;
    border-radius: 100px; 
    color: white; 
    background-color: #0286ce;
    width: 22px; 
    height: 22px; 
    font-weight: bold;
    text-align: center;
}



.col-checkout {
    width:25%;
    height:40px;
    float:left;
    display:inline-block;
    /*margin-top:;*/

}
.tab-checkout {
    margin:0 5px;	
    /*cursor:pointer;*/
    height:40px;
}
.content-checkout {
    width:100%;
    height:1200px;

}

.checkout-group-capt {
    text-decoration: underline;
    text-transform: uppercase;
    font-size: 1.3em;
    font-weight: bold;
    color: #777;
    margin-bottom: 20px;
}

.blue-text {
    color: #008aca;
}

.checkout-controls-mb input {
    margin-bottom: 15px;
}

.checkout-group-border {
    border-style: solid;
    border-color: #0286ce #949494 #949494 #949494 !important;
    border-width: 3px 1px 1px 1px !important;
    border-radius: 10px !important;
}

.checkout-login-v4 {
    float:left;
    display:inline;
    background-color:#f2f9fe;
    -webkit-border-radius: 5px;
    border-radius: 10px !important;
    text-align:left;
    padding:15px 26px;
}

.tab-content-root {
    display: block;
    position: relative;
    overflow: hidden;
    padding: 0 24px 0 24px;
   
}

.tab-content-x {
    border: 1px solid;
    padding: 30px;
    border-radius: 0 0 5px 5px;
    border-width: 0 1px 1px 1px;
    border-color: #777;
}

.controls-in-group {
    padding-left : 20px;
    padding-right : 20px;
}

.checkout-subgroup-capt {
    text-decoration: underline;
    text-transform: uppercase;
    font-size: 1.05em;
    font-weight: bold;
    color: #777;
    margin-bottom: 20px;
}

.checkout-tip {
    color: #008aca;
    font-size: 1.2em;
}

.bgm div input {
    margin-bottom: 6px;
}

td.Caption {
    padding-bottom:15px;
}

h3.checkout-confirm-title {
    font-size:1em;
    color:#0286ce;
    font-weight:bold;
    text-transform:none;
}

@media (max-width: 1200px) {
    .container {
        width:100%;
    }
}

@media (max-width: 600px) {
    .tab-content-x {
        padding:30px 0;
    }
    #step3addresscontainer {
        padding:15px 0;
    }
    span.checkout-group-capt.blue-text {
        padding:0px;
        font-size:1.1em;
    }
    .controls-in-group {
        padding-left:0px;
        padding-right:0px;
    }
    .checkout-controls-mb {
        margin-bottom:15px;
    }
    .checkout-tip {
        font-size:1.15em;
    }
    #PaymentDetailsContent {
        padding:30px 15px;
    }
    #PaymentDetailsContent .controls-in-group,
    #PT_PP_WP1_WPT_WPCC_FinancePaymentDetailsContentPart .tab-content-x {
        padding-left:15px;
        padding-right:15px;
    }

    #PT_PP_WP1_WPT_WPCC_FinancePaymentDetailsContentPart #Div3 {
        padding:30px 0px!important;
    }
}


