@charset "utf-8";
/* CSS Document */
.payment-plugin .stepsForm form {
    font-size: 14px!important;
}
.sf-align-right>.sf-msg-error{
    color:#c00!important;
    font-size: 16px;
}
.payment-plugin ul{
    line-height: 1!important;
}
.payment-plugin .stepsForm input:not(.checkbox), select {
    height: 50px!important;
}
.payment-plugin .stepsForm input[type=checkbox] {
    background: white;
    font-size: 14px!important;
    line-height: inherit;
}
.billing-adress li{
    margin-left: 0px!important;
}
.payment-plugin #chicklet-list{
    margin:0 -0.5em
}
.stepsForm span {
    color: white!important;
}
.sf-check span {
    color:#585353!important;
    line-height: 0px!important;
    font-size: 14px!important;
    vertical-align: baseline!important;
}
.payment-plugin .sf-steps-form ul {
    margin-bottom: auto!important;
    padding: auto!important;
    padding-left: 0!important;
}
.payment-plugin #chicklet-list li{
    float:left!important;
    padding:0 0.5em;
    margin-bottom: 10px!important;
    position:relative;
}
.payment-plugin #chicklet-list li:hover .hover-tooltip{
    display:block;
    opacity:1;
    bottom:130%;}
.payment-plugin #chicklet-list label{
    display:block;
    font-size:1.3em;
    font-weight:600;
    text-transform:uppercase;
    background:#3b7840;
    color:#1b1464;
    padding: 15px!important;
    text-align:center;
    border-radius:0px;
    cursor:pointer;
    -webkit-transition:all 0.1s ease-out;
    transition:all 0.1s ease-out;
    border: #1b1464 solid;
}
.payment-plugin #chicklet-list label:hover,#chicklet-list label:focus{
    background:#48854c;
}
.payment-plugin #chicklet-list label.active{
    background:#e9bd1d;
    color:#fff;
    text-shadow:none;
}
.payment-plugin #chicklet-list input[type=radio]{
    opacity:0;
    position:absolute;
    top:0;
    left:0;
}
.payment-plugin #chicklet-list :checked+label{
    background:#e9bd1d;
    color:#171303;
    text-shadow:none;
}
.payment-plugin #chicklet-list .input-container{
    position:relative;
}
.payment-plugin #chicklet-list .input-container .input-addon{
    position:absolute;
    top:0;
    left:0;
    padding: 19px 8px;
    font-size:1.4em;
    color:#3b7840;
}
.payment-plugin #chicklet-list input{
    font-size:1.4em;
    line-height:1;
    border:2px solid #3b7840;
    padding:0.55em 0.55em 0.55em 0.8em;
    color:#3b7840;
}
.payment-plugin #chicklet-list ::-webkit-input-placeholder{
    line-height:1;
}
.payment-plugin #chicklet-list ::-moz-placeholder{
    line-height:1;
}
.payment-plugin #chicklet-list :-ms-input-placeholder{
    line-height:1;
}

/*END STYLE PAYMENT***/
.stepsForm {
    width: 100%;
    box-sizing: border-box;
    line-height:1;
}
.stepsForm .sf-error{
    border:solid 1px #C00 !important;
}
.stepsForm .sf-error+span{
    border-color:#C00 !important;
}
.stepsForm #sf-msg{
    display:inline-block;
    padding:1em;
}
.stepsForm .sf-msg-success{
    color:#090;
}
.stepsForm .sf-steps {
    font-family: Futura-BolObl !important;
    width: 100%;
    box-sizing: border-box;
    height: auto;
    padding: 0;
}
.stepsForm .sf-steps .sf-steps-content {
    width: 100%;
    box-sizing: border-box;
    border-bottom: 0;
    font-size:16px;
}
.stepsForm .sf-steps-content>div{
    display:inline-block;
    padding:10px 26px 10px 65px;
    background:#CCC;
    color:#FFF;
    font-weight: 300;
    cursor:pointer;
    position:relative;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    overflow:hidden;
}
.stepsForm .sf-steps-center>div{
    display:block;
    padding:1em 2em 1em 4em;
    background:#CCC;
    color: #848484;
    font-weight: 700;
    cursor:pointer;
    position:relative;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    overflow:hidden;
    box-sizing:border-box;
}
.stepsForm .sf-steps-content>div.sf-active{
    background: transparent;
    color: #ffffff;
    font-weight: 300;
}
.stepsForm .sf-steps-content>div>span{
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    background:#AAA;
    padding:0px 10px 0px 15px;
    font-size:24px;
    display:flex;
    display:-webkit-flex;
    align-items:center;
    -webkit-align-items:center;
}
.stepsForm .sf-steps-content>div>i{
    position:absolute;
    right:0;
    top:0;
    bottom:0;
    background:url(../img/sf-steps-activated.png) center no-repeat;
    padding:1em;
}
.stepsForm .sf-steps-content>div.sf-active>span{
    background:#00355e;
}
.stepsForm .sf-steps-content>div>span:after{
    content: '';
    display: block;
    width: 10px;
    position: absolute;
    right: -10px;
    height: 100%;
    top: 0;
    background: url('data:image/svg+xml; charset=utf-8,<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 20" preserveAspectRatio="none"><path d="m0,0 l10,10 l-10,10 l-0,-20z" stroke-width="1.5" fill="#AAA"/></svg>') 0 0 no-repeat;
}
.stepsForm .sf-steps-content>div.sf-active>span:after{
    background: url('data:image/svg+xml; charset=utf-8,<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 20" preserveAspectRatio="none"><path d="m0,0 l10,10 l-10,10 l-0,-20z" stroke-width="1.5" fill="#00355e"/></svg>') 0 0 no-repeat;
}

.stepsForm .sf-steps-form{
    display:block;
    position:relative;
    margin-left: -5px;
    margin-right: -5px;
}

.stepsForm .sf-steps-navigation{
    padding:0 1em;
    margin: 10px -13px 0px 0px;
}

.stepsForm .sf-button{
    padding: 1em 2em;
    background-color: #2096cd!important;
    color: #FFF;
    border: 1px solid #2096cd;
    outline: none;
    cursor: pointer;
    line-height: 1;
    font-size: 1.2em;
    border-radius: 0;
    font-weight: 700;
    text-transform: uppercase;
    font-family: Futura-BolObl !important;
}

.stepsForm .sf-button:hover{background-color:#00355e!important;border: 1px solid #00355e!important;}

.stepsForm .sf-content {
    width: 100%;
    box-sizing: border-box;
    display: none;
    overflow: hidden;
    margin: 0;
    list-style-type: none!important;
}
.stepsForm .sf-content>li {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin-bottom: 5px!important;
    padding:0px 0;
    list-style: none!important;
    margin-left: 0px!important;
}
.stepsForm input[type=text],.stepsForm input[type=tel],.stepsForm input[type=email], .stepsForm input[type=password],.stepsForm input[type=number] {
    width: 100%;
    box-sizing: border-box;
    padding:1em!important;
    border: solid 1px #CCC;
    outline: none;
    box-shadow: none!important;
    color: #656565;
}
.stepsForm textarea {
    width: 100%;
    height: 100px;
    box-sizing: border-box;
    padding: 1em;
    border: solid 1px #CCC;
    outline: none;
    overflow: auto;
    box-shadow: none!important;
}
.stepsForm label.sf-select {
    position: relative;
    display: block;
}
.stepsForm label.sf-select>select {
    width: 100%;
    box-shadow: none!important;
    box-sizing: border-box;
    padding: 0.93em;
    border: solid 1px #CCC;
    outline: none;
    color: #656565;
    font-weight: normal!important;
}
.stepsForm label.sf-select>select:focus+span {
    background-color: #2096cd;
}
.stepsForm .sf-check{
 text-align: left;
}
.stepsForm .sf-radio, .stepsForm .sf-check {
    width: 100%;
    height: auto;
}
.stepsForm .sf-radio label, .stepsForm .sf-check label {
    display: inline-block;
    margin-right: 20px;
    font-size: 15px;
}
.sf-check label{
    display:block!important;
}
.stepsForm .sf-radio label input[type=radio] {
    position: absolute;
    pointer-events: none;
    opacity: 0;
    margin: 0;
    padding: 0;
    height: 10px
}
.stepsForm .sf-radio label input[type=radio]+span {
    display: inline-block;
    width: 18px;
    height: 18px;
    background-color: #fff;
    border: 1px solid #cecece;
    text-align: center;
    vertical-align: top;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}
.stepsForm .sf-radio label input[type=radio]+span::after {
    content: "";
    display: inline-block;
    opacity: 0;
    width: 100%;
    height: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 200ms;
    -moz-transition: all 200ms;
    -ms-transition: all 200ms;
    -o-transition: all 200ms;
    transition: all 200ms
}
.stepsForm .sf-radio label input[type=radio]:checked+span::after {
    opacity: 1;
}
.stepsForm .sf-radio label input[type=radio].error+span {
    border-color: #e2513f;
    border-width: 2px;
}
.stepsForm .sf-radio label input[type=radio]+span {
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
    -moz-box-shadow: 0 0 5px #ddd;
    -webkit-box-shadow: 0 0 5px #ddd;
    box-shadow: 0 0 5px #ddd;
}
.stepsForm .sf-radio label input[type=radio]+span::after {
    -webkit-border-radius: 1em;
    -moz-border-radius: 1em;
    border-radius: 1em;
    background-color: #2096cd;
}
.stepsForm .sf-radio label input[type=radio]:checked+span::after {
    border: .2em solid #fff
}
.stepsForm input[type=text]:focus,.stepsForm input[type=tel]:focus, .stepsForm input[type=number]:focus, .stepsForm input[type=password]:focus, .stepsForm input[type=email]:focus,.stepsForm label.sf-select>select:focus, .stepsForm textarea:focus {
    -webkit-box-shadow: 0px 0px 5px 0px rgba(32,150,205,1);
    -moz-box-shadow: 0px 0px 5px 0px rgba(32,150,205,1);
    box-shadow: 0px 0px 5px 0px rgba(32,150,205,1);
}
.stepsForm input, .stepsForm select, .stepsForm textarea, .stepsForm button {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: #9a9a9a;
}
.sf-shadow input, .sf-shadow select, .sf-shadow textarea {
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
}
.stepsForm .sf_columns {
    min-height: 30px;
    display: inline-block;
    padding: 0 6px 0px 6px;
    box-sizing: border-box;
    float: left!important;
    margin-left: 0px!important;
}
.sf-align-right{
    text-align:right;
}

.sf-align-center{
    text-align:center;
}
.sf-align-center>span#sf-msg{
    display:block;
    clear:both;
    margin:0 auto;
    color: red!important;
}
.sf-align-center>button{
    display:block;
    clear:both;
    margin:0 auto;
    margin-bottom:10px;
}

.payment-plugin .stepsForm .column_1 {
    width: 16.666666667%;
}
.payment-plugin .stepsForm .column_2 {
    width: 33.333333334%;
}
.payment-plugin .stepsForm .column_3 {
    width: 50%;
}
.payment-plugin .stepsForm .column_4 {
    width: 66.666666667%;
}
.payment-plugin .stepsForm .column_5 {
    width: 83.333333334%;
}
.payment-plugin .stepsForm .column_6 {
    width: 100%;
}


/*-- BOOTSTRAP ------------*/

.control-group.warning .input-prepend .add-on,
.control-group.warning .input-append .add-on {
    color: #c09853;
    background-color: #fcf8e3;
    border-color: #c09853;
}

.control-group.error .control-label,
.control-group.error .help-block,
.control-group.error .help-inline {
    color: #b94a48;
}

.control-group.error .checkbox,
.control-group.error .radio,
.control-group.error input,
.control-group.error select,
.control-group.error textarea {
    color: #b94a48;
}

.control-group.error input,
.control-group.error select,
.control-group.error textarea {
    border-color: #b94a48;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.control-group.error input:focus,
.control-group.error select:focus,
.control-group.error textarea:focus {
    border-color: #953b39;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
}

.control-group.error .input-prepend .add-on,
.control-group.error .input-append .add-on {
    color: #b94a48;
    background-color: #f2dede;
    border-color: #b94a48;
}

.control-group.success .control-label,
.control-group.success .help-block,
.control-group.success .help-inline {
    color: #468847;
}

.control-group.success .checkbox,
.control-group.success .radio,
.control-group.success input,
.control-group.success select,
.control-group.success textarea {
    color: #468847;
}

.control-group.success input,
.control-group.success select,
.control-group.success textarea {
    border-color: #468847;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.control-group.success input:focus,
.control-group.success select:focus,
.control-group.success textarea:focus {
    border-color: #356635;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b;
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b;
}

.control-group.success .input-prepend .add-on,
.control-group.success .input-append .add-on {
    color: #468847;
    background-color: #dff0d8;
    border-color: #468847;
}

.control-group.info .control-label,
.control-group.info .help-block,
.control-group.info .help-inline {
    color: #3a87ad;
}

.control-group.info .checkbox,
.control-group.info .radio,
.control-group.info input,
.control-group.info select,
.control-group.info textarea {
    color: #3a87ad;
}

.control-group.info input,
.control-group.info select,
.control-group.info textarea {
    border-color: #3a87ad;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.control-group.info input:focus,
.control-group.info select:focus,
.control-group.info textarea:focus {
    border-color: #2d6987;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7ab5d3;
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7ab5d3;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7ab5d3;
}

.control-group.info .input-prepend .add-on,
.control-group.info .input-append .add-on {
    color: #3a87ad;
    background-color: #d9edf7;
    border-color: #3a87ad;
}

input:focus:invalid,
textarea:focus:invalid,
select:focus:invalid {
    color: #b94a48;
    border-color: #ee5f5b;
}

input:focus:invalid:focus,
textarea:focus:invalid:focus,
select:focus:invalid:focus {
    border-color: #e9322d;
    -webkit-box-shadow: 0 0 6px #f8b9b7;
    -moz-box-shadow: 0 0 6px #f8b9b7;
    box-shadow: 0 0 6px #f8b9b7;
}

.form-actions {
    padding: 19px 20px 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border-top: 1px solid #e5e5e5;
    *zoom: 1;
}

.form-actions:before,
.form-actions:after {
    display: table;
    line-height: 0;
    content: "";
}

.form-actions:after {
    clear: both;
}

.help-block,
.help-inline {
    color: #595959;
}

.help-block {
    display: block;
    margin-bottom: 10px;
}

.help-inline {
    display: inline-block;
    *display: inline;
    padding-left: 5px;
    vertical-align: middle;
    *zoom: 1;
}

.input-append,
.input-prepend {
    display: flex;
    margin-bottom: 10px;
    font-size: 0;
    white-space: nowrap;
    vertical-align: middle;
}

.input-append input,
.input-prepend input,
.input-append select,
.input-prepend select,
.input-append .uneditable-input,
.input-prepend .uneditable-input,
.input-append .dropdown-menu,
.input-prepend .dropdown-menu,
.input-append .popover,
.input-prepend .popover {
    font-size: 14px;
}

.input-append input,
.input-prepend input,
.input-append select,
.input-prepend select,
.input-append .uneditable-input,
.input-prepend .uneditable-input {
    position: relative;
    margin-bottom: 0;
    *margin-left: 0;
    vertical-align: top;
    -webkit-border-radius: 0 4px 4px 0;
    -moz-border-radius: 0 4px 4px 0;
    border-radius: 0 4px 4px 0;
}

.input-append input:focus,
.input-prepend input:focus,
.input-append select:focus,
.input-prepend select:focus,
.input-append .uneditable-input:focus,
.input-prepend .uneditable-input:focus {
    z-index: 2;
}

.input-append .add-on,
.input-prepend .add-on {
    display: inline-block;
    width: auto;
    height: 40px;
    min-width: 16px;
    padding: 4px 5px;
    font-size: 14px;
    font-weight: normal;
    line-height: 41px;
    text-align: center;
    text-shadow: 0 1px 0 #ffffff;
    background-color: #eeeeee;
    border: 1px solid #ccc;
}

.input-append .add-on,
.input-prepend .add-on,
.input-append .btn,
.input-prepend .btn,
.input-append .btn-group > .dropdown-toggle,
.input-prepend .btn-group > .dropdown-toggle {
    vertical-align: top;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.input-append .active,
.input-prepend .active {
    background-color: #a9dba9;
    border-color: #46a546;
}

.input-prepend .add-on,
.input-prepend .btn {
    margin-right: -1px;
}

.input-prepend .add-on:first-child,
.input-prepend .btn:first-child {
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    border-radius: 4px 0 0 4px;
}

.input-append input,
.input-append select,
.input-append .uneditable-input {
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    border-radius: 4px 0 0 4px;
}

.input-append input + .btn-group .btn:last-child,
.input-append select + .btn-group .btn:last-child,
.input-append .uneditable-input + .btn-group .btn:last-child {
    -webkit-border-radius: 0 4px 4px 0;
    -moz-border-radius: 0 4px 4px 0;
    border-radius: 0 4px 4px 0;
}

.input-append .add-on,
.input-append .btn,
.input-append .btn-group {
    margin-left: -1px;
}

.input-append .add-on:last-child,
.input-append .btn:last-child,
.input-append .btn-group:last-child > .dropdown-toggle {
    -webkit-border-radius: 0 4px 4px 0;
    -moz-border-radius: 0 4px 4px 0;
    border-radius: 0 4px 4px 0;
}

.input-prepend.input-append input,
.input-prepend.input-append select,
.input-prepend.input-append .uneditable-input {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.input-prepend.input-append input + .btn-group .btn,
.input-prepend.input-append select + .btn-group .btn,
.input-prepend.input-append .uneditable-input + .btn-group .btn {
    -webkit-border-radius: 0 4px 4px 0;
    -moz-border-radius: 0 4px 4px 0;
    border-radius: 0 4px 4px 0;
}

.input-prepend.input-append .add-on:first-child,
.input-prepend.input-append .btn:first-child {
    margin-right: -1px;
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    border-radius: 4px 0 0 4px;
}

.input-prepend.input-append .add-on:last-child,
.input-prepend.input-append .btn:last-child {
    margin-left: -1px;
    -webkit-border-radius: 0 4px 4px 0;
    -moz-border-radius: 0 4px 4px 0;
    border-radius: 0 4px 4px 0;
}


/* Payment
.bl {
        padding-bottom: 10px!important;
}*/
.payment-plugin .sf-content>h2{
    text-align: center;
    margin:15px 0px!important;
    color: #3c6857!important;
    font-size:20px!important;
    font-family: 'SF-Pro-Display', Roboto, Sans-Serif;
    font-weight: 400;
    letter-spacing: 0px;

}
.payment-plugin .sf-content>h4{
    padding-left: 14px;
    padding-top: 5px;
    padding-bottom: 10px;
    color: #585353!important;
}

.pbl>p {
    background-color: #f5f5f5;
    text-align: center;
    padding: 20px 0px;
    border-radius: 3px;
    border: 1px solid #e0e0e0;
    color:#848484!important;
}
.payment-plugin p{
    margin:0px!important;
}
.pbl2>p {
    background-color: #f5f5f5;
    text-align: left;
    padding: 20px 20px;
    border-radius: 3px;
    line-height: 1.5;
    border: 1px solid #e0e0e0;
    color:#848484!important;
}

/*** CARD NUMBER ***/

form #card_number {
    background-image: url(../img/images.png);
    background-position: 5px -113px, 707px -45px;
    background-size: 120px 361px, 120px 361px;
    background-repeat: no-repeat;
    padding-left: 60px!important;
}
form #card_number.visa {
    background-position: 5px -155px, 260px -61px;
}
form #card_number.visa_electron {
    background-position: 5px -197px, 260px -61px;
}
form #card_number.mastercard {
    background-position: 5px -239px, 260px -61px;
}
form #card_number.maestro {
    background-position: 5px -281px, 260px -61px;
}
form #card_number.discover {
    background-position: 5px -323px, 260px -61px;
}
.credit-card-input {
    border-radius: 0px 0px 0px 3px!important;
}
@media screen and (max-width: 616px) {
    .credit-input {
        margin-bottom:0px!important;
    }
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

#option-country option {
    height: 10px;
    margin: 0;
    padding: 0;
    color: #656565;
}

/** Form Placeholder **/
.field-container {
    position: relative;
    margin-top:5px;
}
.field {
    display:block;
    width:100%;
    padding:15px 10px 0;
    border:none;
    font-size:14px;
}
.field:focus {
    outline: 0;
}
.floating-label {
    position:absolute;
    pointer-events:none;
    top: 5px;
    left:10px;
    font-size: 10px;
    opacity:0;
    background-color: white;
    padding: 0 2px;
    -webkit-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
    margin-bottom: 0px!important;
}
.field:focus + .floating-label {
    opacity:1;
    top:-5px;
    color: #9e9e9e;
}
.field:focus + .floating-label {
    color: #03a9f4;
}

.field-underline {
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:-5px;
    z-index: -1;
    padding:10px 10px 0;
}
.field:focus + .floating-label + .field-underline {
    border-color:#03a9f4;
}
:focus::-webkit-input-placeholder {color: transparent}
:focus::-moz-placeholder          {color: transparent}
:focus:-moz-placeholder           {color: transparent}
:focus:-ms-input-placeholder      {color: transparent}

/*****CVC******/
.cvc-info {
    position: absolute;
    display:none;
    left: -200px;
    top: -90px;
    border: 1px solid #c3c3c3;
    border-radius:3px;
    background-color: #f3f3f3;
    padding: 6px 3px 3px 6px;
    -webkit-box-shadow: 10px 15px 47px 3px rgba(186,186,186,0.44);
    -moz-box-shadow: 10px 15px 47px 3px rgba(186,186,186,0.44);
    box-shadow: 10px 15px 47px 3px rgba(186,186,186,0.44);
    background-image: url(../img/cvc.png);
    background-repeat: no-repeat;
    width: 190px;
    height: 267px;
    z-index: 99999999999999999999999999999;
}
.cvc-info::after {
    content: '';
    position: absolute;
    right: -20px;
    bottom: 140px;
    border: 10px solid transparent;
    border-left: 10px solid #c3c3c3;
}

/****END CVC*****/
.input-group-addon {
    font-size: 17px;
    font-weight: 400;
    line-height: 1;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 3px 0px 0px 3px;
    z-index: 2;
    position: absolute;
    height: 50px;
    width: 30px;
    padding: 15px 1px;
}
.amount-container input[type=number]{
    text-align: left;
    padding-left: 40px!important;
}
.amount-container1 input[type=number]{
    text-align: left;
    padding-left: 40px!important;
}
.amount-container span {
    color:#585353!important;
    line-height: 15px!important;
}
.amount-container1 span {
    color:#585353!important;
    line-height: 15px!important;
}
.other-label {
    left: 30px!important;
}
.show-cvc-info .cvc-info {
    display: none;
}
.show-cvc-info:hover .cvc-info {
    display: block;
}
/****Billing Adress****/
.payment-plugin .billing-adress h2{
    padding-bottom: 15px;
    text-align: center;
    color: #3b7840!important;
    margin-top: 15px!important;
    font-size:20px!important;
    font-family: 'SF-Pro-Display', Roboto, Sans-Serif;
    font-weight: 400;
    letter-spacing: 0px;
}
.billing-adress li {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin-bottom: 10px!important;
    padding: 0px 0;
}
@media (max-width: 556px) {
    .bl {
        margin-bottom: 1em!important;
    }
    .stepsForm .sf-content>li{
        margin-bottom: 0px!important;
    }
}
.wait {
    position: fixed;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    display:none;
    justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -webkit-align-items: center;
    background-color: rgba(0,0,0,0.5);
    z-index:999999999999;

}
.button-popup {
    display: inline-block;
    padding: 5px 25px 5px 25px;
    background-color: #ccc;
    margin-top: 25px;
    transition:all ease-in-out 0.4s;
}
.button-popup:hover {
    background-color: #b9b9b9;
    transition:all ease-in-out 0.1s;
    cursor:pointer;
}
.info-box {
    background-color: #fff;
    padding: 30px;
    text-align: center;
}

form #mmyy {
    background-image: url(../img/calendar.ico);
    background-repeat: no-repeat;
    padding-left: 40px!important;
    background-size: 25px 25px;
    background-position:8px 10px;
}
form #cvc {
    background-image: url(../img/open.ico);
    background-repeat: no-repeat;
    padding-left: 40px!important;
    background-size: 25px 25px;
    background-position:8px 10px;
}
.payment-plugin h2 {
    margin-bottom: 0px;
    font-size: 30px!important;
}
.sf-theme-green .sf-steps .sf-steps-content > div {
    margin-bottom: 1px;
}

@media (min-width:1200px) {

}
@media (min-width:992px) and (max-width:1199px){

}
@media (min-width:768px) and (max-width:991px){
    .stepsForm .sf_columns {
        margin-bottom: 10px!important;
    }
}
@media (min-width:554px) {
    .sf-theme-green .sf-steps .sf-steps-content {
        display:flex;
        display:-webkit-flex;
        font-size:0.95em;
    }
    .sf-theme-green .sf-steps .sf-steps-content > div {
        flex-grow:1;
        -webkit-flex-grow:1;
        display:flex;
        display:-webkit-flex;
        align-items:center;
        -webkit-align-items:center;
    }
    .sf-theme-green .sf-steps .sf-steps-content > div:not(:last-child) {
        margin-right: 4px;
    }
}
@media (min-width:670px) {
    .sf-theme-green .sf-steps .sf-steps-content {
        font-size:1.1em;
    }

}
@media (min-width:800px) {
    .sf-theme-green .sf-steps .sf-steps-content {
        font-size:1.1em;    font-weight: 300;
    }

}
@media (max-width:554px) {
    .sf-steps .steps-style{
        width:100%;
    }
}
@media (max-width:767px){
    .sf-theme-green .sf-steps .sf-steps-content > div > div {
        padding-left: 15px;
    }
    .chicklet-list li {
        margin-bottom: 0px!important;

    }
    .stepsForm .sf_columns {
        margin-bottom: 10px!important;
    }
    .stepsForm label {
        padding-right: 0px!important;
    }
}

/*****Card Detect****/
ul.card_logos {
    display: inline-block;
    margin: 0;
    padding: 0;
    line-height: 45px;
    float: right;
    margin-top: 10px;
}

.card_visa, .card_mastercard, .card_amex, .card_discover, .card_diners, .card_jcb {
    display: inline-block;
    width: 50px;
    height: 30px;
    overflow: hidden;
    text-align: left;
    text-indent: -999px;
    background: url(../img/card_sprite.png) 0 0 no-repeat;
    margin-left: 0px!important;
}

.card_mastercard {
    background-position: -55px 0;
}

.card_amex {
    background-position: -110px 0;
}

.card_discover {
    background-position: -165px 0;
}

.card_diners {
    background-position: -220px 0;
}

.card_jcb {
    background-position: -660px 0;
}

.is_visa li, .is_mastercard li, .is_amex li, .is_discover li, .is_diners li, .is_jcb li, .is_nothing li {
    opacity: .2;
}

.is_visa li.card_visa, .is_mastercard li.card_mastercard, .is_amex li.card_amex, .is_discover li.card_discover, .is_diners li.card_diners, .is_jcb li.card_jcb {
    opacity: 1;
}

.payment {
    border: 1px solid #e0e0e0;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
    padding-top: 15px;
    margin-bottom: 20px!important;
    margin: 0px 7px;
    background-color: #f5f5f5;
}
.payment .interior {
    padding: 20px;
    padding-top: 10px;
}
.payment .strip {
    background-color: #FFF;
    height: 50px;
    width: 100%;
}
.payment .strip .cards {
    padding-left: 20px;
    padding-right: 20px;
}
.payment .strip .cards img {
    float: right;
}
.input-payment {
    margin-bottom:10px;
}
.expirymonth {
    margin-right: 10px;
}
.CVC {
    width:75px!important;
    float:right;
    margin-top: 0px!important;
}
.checkbox-label  {
    display: inline-block!important;
    height:auto!important;
    color:#777;
}
.checkbox {
    display: inline-block!important;
    /*height:auto!important;*/
}
.loader-wrap {
    height:50px;
    position:relative;
}
.loader {
  height: 20px;
  width: 250px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.loader--dot {
  animation-name: loader;
  animation-timing-function: ease-in-out;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  height: 20px;
  width: 20px;
  border-radius: 100%;
  background-color: black;
  position: absolute;
  border: 2px solid white;
}
.loader--dot:first-child {
  background-color: #8cc759;
  animation-delay: 0.5s;
}
.loader--dot:nth-child(2) {
  background-color: #8c6daf;
  animation-delay: 0.4s;
}
.loader--dot:nth-child(3) {
  background-color: #ef5d74;
  animation-delay: 0.3s;
}
.loader--dot:nth-child(4) {
  background-color: #f9a74b;
  animation-delay: 0.2s;
}
.loader--dot:nth-child(5) {
  background-color: #60beeb;
  animation-delay: 0.1s;
}
.loader--dot:nth-child(6) {
  background-color: #fbef5a;
  animation-delay: 0s;
}
.loader--text {
  position: absolute;
  top: 200%;
  left: 0;
  right: 0;
  width: 4rem;
  margin: auto;
}
.loader--text:after {
  content: "Loading";
  font-weight: bold;
  animation-name: loading-text;
  animation-duration: 3s;
  animation-iteration-count: infinite;
}

@keyframes loader {
  15% {
    transform: translateX(0);
  }
  45% {
    transform: translateX(230px);
  }
  65% {
    transform: translateX(230px);
  }
  95% {
    transform: translateX(0);
  }
}
@keyframes loading-text {
  0% {
    content: "Loading";
  }
  25% {
    content: "Loading.";
  }
  50% {
    content: "Loading..";
  }
  75% {
    content: "Loading...";
  }
}


.alert {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px;
}
.alert h4 {
  margin-top: 0;
  color: inherit;
}
.alert .alert-link {
  font-weight: bold;
}
.alert > p,
.alert > ul {
  margin-bottom: 0;
}
.alert > p + p {
  margin-top: 5px;
}
.alert-dismissable,
.alert-dismissible {
  padding-right: 35px;
}
.alert-dismissable .close,
.alert-dismissible .close {
  position: relative;
  top: -2px;
  right: -21px;
  color: inherit;
}
.alert-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}
.alert-success hr {
  border-top-color: #c9e2b3;
}
.alert-success .alert-link {
  color: #2b542c;
}
.alert-info {
  background-color: #d9edf7;
  border-color: #bce8f1;
  color: #31708f;
}
.alert-info hr {
  border-top-color: #a6e1ec;
}
.alert-info .alert-link {
  color: #245269;
}
.alert-warning {
  background-color: #fcf8e3;
  border-color: #faebcc;
  color: #8a6d3b;
}
.alert-warning hr {
  border-top-color: #f7e1b5;
}
.alert-warning .alert-link {
  color: #66512c;
}
.alert-danger {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}
.alert-danger hr {
  border-top-color: #e4b9c0;
}
.alert-danger .alert-link {
  color: #843534;
}
.text-center {
    text-align: center;
}
input:disabled {
    border-color: #f00;
    opacity: .5;
}
button[disabled] {
    color:#EEEEEE!important;
    cursor: default!important;
    background-color: #BDBDBD!important;
}
.select-date select{
    width: 90px!important;
    font-size: 14px;
    padding: 0px;
}
.expirymonth select{
    padding-left: 10px;
}
.expiryyear select{
    padding-left: 5px;
}