/* SYN PAYMENT - START */

.syn-form-container .syn-payment {

    display: block;
    
    width: 385px;
    height: auto;
    
    margin: 0 0 0 30px;
    padding: 0 0 0 0;
    
    border: none;

    font-family: "Open Sans", sans-serif;
    color: #000;
    font-size: 14px;
    font-weight: 500;

    text-align: left;
    z-index: 3;
}

.syn-share-container .syn-share-body.content-off .syn-share-body-form .syn-form-container .syn-payment { margin-left: 0px; }

.syn-payment .syn-payment-container {

}

.syn-payment .syn-payment-container .syn-payment-grid {

    display: block;

    width: auto;
    height: auto;
    
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    
    border: 1px solid #c9c9c9;
    border-top: none;

    --box-shadow: -5px 0 12px -8px #000, 5px 0 12px -8px #000;
    box-shadow: -2px 0 12px -8px #000, 2px 0 12px -8px #000;

    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    color: black;
    text-align: left;
    
}

.syn-payment-grid .grid-item {
    display: block;
    
    width: auto;
    height: 85px;
    
    padding: 12px 10px 12px 10px;
    margin: 0 0 0 0;
    
    border-bottom: 1px solid #c9c9c9;
    background: #f2f2f2;
    
    cursor: pointer;
}
.syn-payment-grid .grid-item:last-child { border-bottom: none; }

.syn-share-container.disabled .grid-item { cursor: default; }

.syn-payment-grid .grid-item:hover { background: #fff; }

.syn-share-container.disabled .syn-payment-grid .grid-item:hover { background: #f2f2f2; }
.syn-share-container.disabled .syn-payment-grid .grid-item.selected:hover { background: #fff; }


.syn-payment-grid .grid-item[data-payment-type-id="1"] { height: 65px; }
.syn-payment-grid .grid-item[data-payment-type-id="2"] { height: 85px; }
.syn-payment-grid .grid-item[data-payment-type-id="3"] { height: 85px; }

.syn-payment-grid .grid-item.selected[data-payment-type-id="1"] { background: #fff; height: 65px; }
.syn-payment-grid .grid-item.selected[data-payment-type-id="2"] { background: #fff; height: 85px; }
.syn-payment-grid .grid-item.selected[data-payment-type-id="3"] { background: #fff; height: 85px; }

.grid-item .grid-item-radio-container {
    
    display: inline-block;
    
    width: 18px;
    height: auto;
    
    float: left;
    
    margin: 0 10px 0 0;
    padding: 8px 10px 8px 0;

}

.grid-item .grid-item-label-container {
    
    display: inline-block;
    
    width: 90%;
    height: auto;
    
    float: left;
    
    margin: 0 0 0 0;
    padding: 0 0 0 0;

}

.grid-item .grid-item-label-container .label-1 {
    
    font-size: 15px;
    color: #606060;
    font-weight: 600;

    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;

}
.grid-item.selected .grid-item-label-container .label-1 { color: #000; }

.grid-item .grid-item-label-container .label-2 {
    
    min-height: 20px;
    margin: 0 0 5px 0;

    font-size: 14px;
    color: #000;
    font-weight: 600;

    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.grid-item .grid-item-label-container .label-3 {
    
    min-height: 18px;

    font-size: 13px;
    color: #909090;
    font-weight: 500;

    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.grid-item.selected .grid-item-label-container .label-3 { color: #000; }


.grid-item .grid-item-options-container {
    
    display: block;
    
    width: 100%;
    height: auto;
    
    min-height: 35px;

    margin: 5px 0 0 0px;
    padding: 0 0 0 0;
    
    vertical-align: top;
}

.grid-item[data-payment-type-id="1"] .grid-item-options-container.options-draw-days { display: none; }
.grid-item[data-payment-type-id="2"] .grid-item-options-container.options-draw-days { display: none; }
.grid-item[data-payment-type-id="3"] .grid-item-options-container.options-draw-days { display: none; }

.grid-item.selected[data-payment-type-id="1"] .grid-item-options-container.options-draw-days { display: none; margin-left: 27px; margin-top: 10px; }
.grid-item.selected[data-payment-type-id="2"] .grid-item-options-container.options-draw-days { display: none; margin-left: 27px; margin-top: 10px; }
.grid-item.selected[data-payment-type-id="3"] .grid-item-options-container.options-draw-days { display: none; margin-left: 27px; margin-top: 10px; }

.grid-item .grid-item-options-container .item-options-left {
    
    display: inline-block;

    width: 135px;
    height: auto;
    
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis;
    
}

.grid-item .grid-item-options-container .item-options-right {
    
    display: inline-block;
    
    width: 189px;
    height: auto;
    
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis;

}

.grid-item .grid-item-options-container .item-options-left label {
    
    padding-top: 10px;
    
    font-size: 13px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;

}

.grid-item select {
    display: none;

    border: 1px solid #d1d2d3 !important;
    box-shadow: none !important;
}

.grid-item select:focus { outline: none; }

.grid-item .select2-container.select2-container--bootstrap .select2-selection.select2-selection--single {

    width: auto;
    height: 35px !important;

    padding-top: 8px;

    box-shadow: unset;
    -webkit-box-shadow: unset;

    background-color: #fafafa;

    font-size: 13px;
    
}

.grid-item .select2-container.select2-container--bootstrap .select2-selection.select2-selection--single .select2-selection__rendered {
    color: #333;
}

.grid-item.selected .select2-container.select2-container--bootstrap .select2-selection.select2-selection--single,
.grid-item:hover .select2-container.select2-container--bootstrap .select2-selection.select2-selection--single { background-color: unset !important; }
.syn-share-container.disabled .grid-item:hover .select2-container.select2-container--bootstrap .select2-selection.select2-selection--single { background: #fafafa !important; }

.grid-item .select2-container.select2-container--bootstrap.select2-container--focus .select2-selection.select2-selection--single,
.grid-item .select2-container.select2-container--bootstrap.select2-container--open .select2-selection.select2-selection--single {
    
    -webkit-box-shadow: unset;
    box-shadow: unset;
    
    -webkit-transition: unset;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    
    border-color: #d1d2d3;
}

.select2-results { font-size: 13px; }

/* SYN PAYMENT - END */





/* RIBONS - START */

.syn-payment-grid .grid-item .recommend-container {
    
    display: inline-block;
    float: right;

    width: auto;
    height: auto;
        
    text-align: right;
    margin-top: -65px;
    margin-right: -10px;

}

.syn-payment-grid .grid-item .recommend-container .recommend-ribbon {

    display: inline-block;
    float: right;
    
    width: auto;
    height: auto;
    
    margin: 0 0 0 0;
    padding: 2px 10px 1px 10px;
    
    font-family: Arial;
    font-size: 13px;
    color: white;
    letter-spacing: 1px;
    text-transform: capitalize;

}

/* RIBONS - END */





/* SYN COST - START */

.syn-payment .syn-payment-container .syn-payment-money {
    
    display: block;
    
    width: auto;
    height: auto;
    
    margin: 20px 0 0 0;
    padding: 0 0 0 0;
    
    font-family: "Open Sans", sans-serif;
    font-size: 16px;
    color:#888888;
    text-align: left;

}

.syn-payment-money .money-title { float: left;  }
.syn-payment-money .money-value { float: right; }

.syn-payment-money .syn-payment-money-cost { display: block; padding: 4px 0 4px 0; }
.syn-payment-money .syn-payment-money-cost .money-title {}
.syn-payment-money .syn-payment-money-cost .money-value {}

.syn-payment-money .syn-payment-money-discount { display: block; padding: 4px 0 6px 0; color:#05ce05; }
.syn-payment-money .syn-payment-money-discount .money-title {}
.syn-payment-money .syn-payment-money-discount .money-value {}

.syn-payment-money .syn-payment-money-price { display: block; padding: 6px 0 4px 0; border-top: 1px solid #e1e1e1; }
.syn-payment-money .syn-payment-money-price .money-title { color: #333; font-size: 18px; font-weight: 600; }
.syn-payment-money .syn-payment-money-price .money-value { color: #333; font-size: 18px; font-weight: 600; }

.syn-payment-money .syn-payment-money-cost .money-value.line-through {     text-decoration: line-through; text-decoration-color: red; }

.syn-payment .syn-payment-container .syn-payment-command {
    
    display: block;
    
    width: auto;
    height: auto;

    margin: 10px 0 0 0;
    padding: 0 0 0 0;

}

.syn-payment .syn-payment-container .syn-payment-command button.btn-add-to-cart {

    width: 100%;
    height: auto;
    margin: 0 0 15px 0;
    padding: 10px 40px;   
    text-transform: uppercase;
    line-height: 22px;
    cursor: pointer;

}


.syn-payment .syn-payment-container .syn-payment-command button.btn-add-to-cart:disabled {
    background-color: #c4c0be;
    cursor: not-allowed;
}

/* SYN COST - START */

/* PAYMENT METHODS BANNER - START */

.footer-payment-logos.row {
    padding: 10px 12px;
    margin: 0;
    background: #f8f8f8;
    border-radius: 5px;
    margin-bottom: 10px;
}

    .footer-payment-logos.row .payment-logo {
        width: 25%;
        display: inline-block;
        float: left;
        padding: 0 2px;
    }

/* PAYMENT METHODS BANNER - END */