@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
    .step-2-wrapper {
        padding: 0px !important;
    }
    .step-2-wrapper #total-sidebar {
        width: auto !important;
    }
    .filters .text-center {
        font-size: 16px;
        padding-top: 20px;
    }
    .step-2-wrapper .padding-40 {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .summary .col-lg-12 {
        padding-left: 20px !important;
        padding-right: 20px!important;
        padding-top: 20px !important;
    }
    .summary p.font-size-18.important-text.red-text {
        padding-left: 0px !important;
    }
    span.glyphicon.glyphicon-exclamation-sign {
        display: none !important;
    }
    .summary .light-gray-bg {
        margin-right: 0px !important;
        margin-left: 0 !important;
    }
    .summary .payment-block {
        margin-bottom: 20px!important;
    }
    .total-info {
        border-top: 2px solid #eeeeee !important;
    }
    #total-sidebar {
        top: 20px!important;
    }
    .summary .payment-block .popup {
        width: 320px !important;
    }
    .summary .payment-block.selected .popup {
        width: 320px !important;
    }
    .filters .badges-nav>li {
        width: 100% !important;
    }
    .filters .title-filters {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }
    .thanks .col-md-6.share {
        margin-top: 23px !important;
    }
    .thanks hr {
        display: none !important;
    }
    .thanks h3.use-coupon-title {
        line-height: 1.3em !important;
    }
    .thanks .col-md-12.invitation .left-share {
        width: 100% !important;
    }
}

/* CONTENEUR */

.step-2-wrapper .padding-40 {
    background-color: #f4f4f4;
}

.step-2-wrapper #page-content {
    padding: 40px;
}

/* RIGHT SIDEBAR */

#total-sidebar {
    background-color: #FFFFFF;
    width: 293px;
}

.total-info {
    background-color: #FFFFFF;
    padding: 20px;
}

#total-sidebar .total-info {
    font-family: Lato;
    font-size: 13px;
}

.total-info .total-title {
    font-weight: 800;
    font-size: 16px;
    background-image: url('/images/separator-2.png');
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
    padding-bottom: 5px;
    margin-bottom: 10px;
}

.total-info .recapitulatif {
    border-bottom: 0px;
    background-color: #f4f4f4;
    padding-left: 10px;
    padding-right: 10px;
}

.total-info .recapitulatif-block {
    border-bottom: 3px solid #dddddd;
    padding-bottom: 8px;
    padding-top: 8px;
    padding-left: 0px;
}

.total-info .recapitulatif-block.part1 {
    border-bottom: 1px solid #dddddd;
    padding-bottom: 8px;
}

.total-info .recapitulatif-title {
    font-size: 16px;
    font-weight: 800;
    background-image: url('/images/separator-2.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
    padding-bottom: 5px;
    margin-bottom: 10px;
}

.total-info .recapitulatif-price {
    font-weight: bold;
}

.total-info .pre-total-footer.part1 {
    padding-top: 8px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 8px;
}

.total-info .total-summary-amount {
    background-color: #e6e6e6;
    padding: 10px;
    border-top: 4px solid #FFFFFF;
    font-weight: bold;
    font-size: 16px !important;
}

.total-info .joboards-scroll-block.mCustomScrollbar._mCS_1 {
    height: 215px !important;
}

.total-info .jobboard-price-info {
    padding-bottom: 1px;
    padding-top: 7px;
}

.total-info .jobboard-price-info.top {
    background-color: #f5f5f5;
    padding-top: 5px;
    padding-bottom: 5px;
}

.total-info .jobboard-price-info .jobboard-price.green {
    color: #6c6eaf;
}

.total-info .jobboard-price-info.top .col-sidebar.icon {
    width: 3%;
}

.total-info .jobboard-price-info .col-sidebar.price {
    width: 14%;
    max-width: 14%;
}

.total-info .jobboard-price-info .glyphicon.glyphicon-remove {
    border-radius: 50%;
    border: 1px solid #cccccc;
    color: #888888;
    width: 14px;
    height: 14px;
    font-size: 7px;
}

.total-info .total-footer {
    margin-top: 20px;
}

.step-2-wrapper .field .total-info .nextBtn {
    border: 2px solid transparent;
}

.step-2-wrapper .field.complete .total-info .nextBtn {
    background: #7bb521;
    box-shadow: none;
    border-color: #7bb521;
    width: 100%;
}

.step-2-wrapper .field.complete .total-info .nextBtn:hover {
    background: transparent;
    box-shadow: none;
    color: #7bb521;
    width: 100%;
}

.step-2-wrapper .field .nextBtn,
.step-2-wrapper .field .nextBtn {
    display: inline-block;
    position: initial;
}

.total-info .nextBtn.defaultBtn {
    background-color: #c5c5c5;
    box-shadow: none;
    width: 100%;
}

.total-info .total-footer .m-t-20 {
    margin-top: 13px;
}

/* LEFT SIDEBAR */

.step-2-wrapper #sidebar {
    background-color: #e6e6e6;
}

.step-2-wrapper .answers .answer {
    margin-bottom: 10px;
    border-bottom: 1px solid #ccc;
}

.step-2-wrapper .answers {
    top: 0;
}

.step-2-wrapper .answers .answer.job-board {
    padding-top: 20px;
    padding-bottom: 15px;
    background-color: #dddddd;
    margin: 0 -31px 7px -29px;
    padding-left: 27px;
    border-bottom: none !important;
}

.step-2-wrapper .answers .answer p {
    font-family: lato;
    color: #7d7d7d;
    padding-bottom: 7px;
}

.step-2-wrapper .answers .answer label {
    font-family: Lato;
    color: #666666;
    padding-bottom: 8px;
}

.step-2-wrapper .answers .answer.job-board label.devider {
    background-color: transparent;
    color: #666666;
    padding: 0px;
    background-image: url('/images/separator-2.png');
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 202px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    margin: auto;
}

.step-2-wrapper .answers .job-board p {
    padding-top: 12px;
    padding-bottom: 0px;
}

#sidebar .btn-collapse {
    background-color: #ccc;
    color: #ffffff;
    font-size: 15px;
}

/* FILTERS */

.filters .text-center {
    font-size: 18px;
    font-weight: bold;
    text-align: left;
}

.filters .badges-nav {
    border: none;
    background-color: transparent;
    padding: 0px;
    margin-top: 0px !important;
    margin-bottom: 0px;
}

.filters .active .btn.btn-white.btn-sm {
    background-color: #537ab7;
    color: #ffffff;
    text-transform: uppercase;
    border-radius: 1px !important;
    box-shadow: none;
    padding: 10px;
    border: 1px solid #537ab7;
}

.filters .btn.btn-white.btn-sm {
    background-color: transparent;
    color: #537ab7;
    text-transform: uppercase;
    border-radius: 1px !important;
    box-shadow: none;
    padding: 10px;
    font-size: 12px;
    border: 1px solid #537ab7;
}

.filters .badges-nav>li {
    padding-top: 8px;
}

.filters .checkbox.blue {
    float: left;
    padding-left: 25px;
}

.filters .badges-nav li.filter-checkbox {
    width: 126px !important;
}

.filters .filter-checkbox {
    padding: 0px !important;
}

.filters .title-filters {
    background-color: #ffffff;
    border-radius: 4px;
    padding-top: 15px;
    padding-bottom: 20px;
    padding-left: 15px;
    padding-right: 0px;
    margin-top: 10px !important;
    margin-bottom: 28px;
    display: inline-block;
    width: 100%;
}

.filters .title-filters .text-center {
    display: inline-block;
    font-size: 14px;
}

.filters .checkbox.blue {
    margin-top: 4px;
}

.filters .checkbox label::after, .radio label::after {
    width: 20px;
    height: 20px;
    background-color: #eee !important;
    border: none !important;
    border-radius: 3px;
}

.filters .checkbox.blue label::before {
    width: 13px;
    height: 7px;
    top: 7px;
    left: 4px;
}

.filters .checkbox label, .radio label {
    line-height: 24px;
    padding-left: 15px;
    font-weight: bold;
    font-family: Lato;
    font-size: 14px;
}

.filters .checkbox, .radio {
    padding-left: 0px;
}

.filters .extra-options>li a span {
    border-bottom: none;
    font-family: Lato;
    text-transform: lowercase !important;
    color: #666666;
    font-weight: 600;
}

.filters hr {
    border: 1px solid #ededed;
}

.filters .contact-us-more a span {
    border-bottom: none;
    color: #537ab7;
    font-family: Lato;
    font-weight: 600;
}

.filters .contact-us-more input[type="text"] {
    border: 1px solid #ddd;
    background-color: transparent;
}

.filters .contact-us-more input[type="text"].is-button+button {
    background-color: #ddd;
    border: 1px solid #dddddd;
    color: #333333;
    font-weight: bold;
}

.filters .contact-us-more input[type="text"]:focus {
    border-color: #dddddd;
}

.filters {
    margin-bottom: 5px;
}

/* JOBBOARD */

.jobBoardsForm.ng-valid {
    padding-top: 33px;
}

.jobBoardsForm .formHaveError {
    text-align: left;
    font-family: Lato;
    font-weight: 600;
}

.job-board-notify, .filters .formHaveError {
    text-align: left !important;
    font-family: Lato;
    font-weight: 600;
}

.jobboard-cbx .cbx .cbx_c label::after {
    top: -14px;
    left: -15px;
}

.jobboard-cbx .cbx.disabled .cbx_c::before {
    top: -9px;
    left: -8px;
}

.jobboard-cbx .cbx .cbx_c label {
    padding-bottom: 0px;
    border-bottom: 4px solid #f5f5f5;
}

.jobboard-cbx .cbx .cbx_t {
    position: relative;
    border-bottom: none;
    font-weight: bold;
    font-size: 14px;
    padding-bottom: 10px;
    padding-top: 6px;
    background-image: url('/images/separator-2.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 14px bottom;
    height: 34px;
}

.jobboard-cbx .cbx:hover .cbx_t .j_title {
    position: absolute;
    top: -5px;
    bottom: -12px;
    left: 0;
    right: 0;
    white-space: normal;
    padding: 11px 15px 5px 15px;
    background: #fff;
}

.joboard-amount {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 13px;
    text-align: right;
    padding-right: 14px;
}

.joboard-amount span {
    font-weight: bold;
    font-family: Lato;
    font-size: 14px;
}

.jobboard-cbx .cbx .cbx_t .j_i_c, .jobboard-cbx .cbx .cbx_t .p_i_c {
    top: -36px;
}

.jobboard-cbx .cbx .cbx_t:hover::before, .jobboard-cbx .cbx .cbx_c:hover::before, .jobboard-cbx .cbx.checked .cbx_t:hover::before, .jobboard-cbx .cbx.checked .cbx_c:hover::before {
    border-color: transparent;
}

.joboard-amount-striked {
    color: #999999;
    text-decoration: line-through;
}

.jobboard-price {
    color: #6c6eaf;
}

.field .confirm.step-2 {
    float: right;
}

.step-2-wrapper .field.complete .nextBtn {
    background: #7bb521;
    box-shadow: none;
    border: 1px solid #7bb521;
}

.confirm.step-2 .prevBtn {
    font-size: 19px;
    background: #ffffff;
    box-shadow: none;
    color: #ddd;
    padding: 15px 41px;
}

.jobboard-cbx .cbx {
    box-shadow: 0 0 13px 3.2px rgba(0, 0, 0, 0.03);
}

.jobboard-cbx .cbx.disabled .cbx_j_i_p {
    top: 95px;
    background-color: #dddddd;
    box-shadow: none;
    border-color: #dddddd;
}

.jobboard-cbx .cbx.disabled .cbx_j_i_p:hover {
    border-color: #dddddd;
}

.jobboard-cbx .cbx .cbx_j_i_p {
    text-align: center;
    color: #333333;
    font-family: 'Lato';
}

.confirm.step-2 .nextBtn {
    background-color: #bbb;
    box-shadow: none;
}

/* AJOUT PC */

.jobboard-cbx .cbx .cbx_p_i_c {
    display: none;
    position: absolute;
    left: -1px;
    right: -1px;
    top: 40px;
    padding: 15px 10px;
    text-align: left;
    text-transform: none;
    font-size: 12px;
    line-height: normal;
    color: #808080;
    font-family: 'sanasans';
    background-color: #fff;
    border: 1px solid #ebebeb;
    z-index: 9;
    -webkit-box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.2);
}

.jobboard-cbx .cbx.p_i_active .cbx_p_i_c {
    display: block;
    border-color: #089dcf;
}

.jobboard-cbx .cbx.p_i_active .cbx_p_i_c:before {
    content: "";
    display: block;
    width: 30px;
    height: 3px;
    position: absolute;
    top: -1px;
    right: 41px;
    width: 28px;
    background-color: #fff;
}

.jobboard-cbx .cbx.disabled.p_i_active .cbx_p_i_c:before {
    top: 0;
}

/* ???
.jobboard-cbx .cbx.disabled .cbx_p_i_c {
    left: -1px;
    right: -1px;
    bottom: -1px;
    top: 55px;
    background-color: rgba(252,252,252,0.6);
    border-color: #ebebeb;
} ???
*/

.jobboard-cbx .cbx.disabled:not(.p_i_active) .cbx_p_i_c {
    box-shadow: none;
}

.jobboard-cbx .cbx.disabled .cbx_p_i_c:hover {
    border-color: #089dcf;
}

.jobboard-cbx .cbx .cbx_p_i_c {
    display: none;
    background-color: #ffffff;
    border: none !important;
    position: absolute !important;
    top: auto;
    width: 247px;
    bottom: 120px;
    right: -10px;
    left: auto;
}

.jobboard-cbx .cbx.p_i_active .cbx_p_i_c {
    display: block;
}

.jobboard-cbx .cbx.p_i_active .cbx_p_i_c .name {
    text-transform: uppercase;
    font-weight: bold;
    color: #333333;
    border-bottom: 1px solid #ddd;
    padding-bottom: 8px;
}

.jobboard-cbx .cbx.p_i_active .cbx_p_i_c .summary {
    font-family: "Lato";
    color: #333333;
}

.jobboard-cbx .cbx.p_i_active .cbx_p_i_c p {
    margin: 0 0 10px;
    color: #333333;
    font-family: "Lato";
}

.jobboard-cbx .cbx.p_i_active .cbx_p_i_c p strong {
    color: #0e99cd;
}

.jobboard-cbx .cbx.j_i_active .cbx_j_i_p {
    display: block;
    background-color: #ffffff;
    border: none !important;
    position: absolute !important;
    top: auto;
    width: 247px;
    bottom: 120px;
    right: -10px;
    left: auto;
}

.jobboard-cbx .cbx.disabled.j_i_active .cbx_j_i_p {
    width: 100%;
    right: 0;
    top: 0;
    bottom: 80px;
    /*background: transparent;*/
    opacity: 0.8
}

.jobboard-cbx .cbx.disabled.j_i_active .cbx_j_i_p span {
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    padding: inherit;
}

.jobboard-cbx .cbx .cbx_t:hover:before, .jobboard-cbx .cbx .cbx_c:hover:before, .jobboard-cbx .cbx.checked .cbx_t:hover:before, .jobboard-cbx .cbx.checked .cbx_c:hover:before {
    border-color: transparent;
}

.jobboard-cbx .cbx.disabled.j_i_active .cbx_t:hover:before {
    border-color: transparent;
}

.jobboard-cbx .cbx.j_i_active .j_i_c {
    border-color: transparent;
    box-shadow: none !important;
}

/* SUMMARY */

.summary div#wrapper {
    padding-left: 20px !important;
    padding-right: 310px !important;
}

.summary .unknow-user p {
    text-align: center;
    font-family: "Lato";
    font-weight: bold;
    padding: 0 !important;
    line-height: 1em;
    font-size: 19px;
}

.summary .unknow-user span.link {
    color: #069ed0;
    text-decoration: underline;
}

.row.unknow-user {
    margin-top: 30px;
}

.summary .light-gray-bg {
    background: #FFFFFF;
    border-radius: 4px;
}

.summary .col-lg-12 .container-fluid {
    padding-left: 0px;
}

.summary .col-lg-12 {
    padding-left: 0;
}

.summary .summary-container .col-lg-12 {
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 15px;
}

.summary .main-summary-info {
    width: 100%;
}

.summary p.font-size-18.important-text {
    font-family: "Lato";
    font-weight: bold;
    font-size: 16px;
    padding-bottom: 10px;
}

.summary p.font-size-18.important-text.red-text {
    display: inline-block;
    padding-left: 8px;
    font-size: 14px;
}

.summary .glyphicon-exclamation-sign:before {
    content: "\e101";
    color: red;
}

.summary h3.color-blue.f-w-700 {
    margin-top: 0;
}

.summary .summary-title-wrapper h3 {
    margin-top: 0;
    font-weight: bold;
    font-size: 30px;
}

.summary ul.button {
    display: inline-block;
    list-style-type: none;
    float: right;
    padding-bottom: 10px;
}

.summary .top-section-title .meta {
    list-style: none;
    margin: 0 0 10px 0;
    padding: 0;
    display: inline-block;
}

.summary .summary-container a {
    border: 1px solid #36a8d4;
    border-radius: 3px;
    padding: 4px 16px;
    text-transform: capitalize;
    font-weight: bold;
    font-size: 11px;
}

.summary .summary-container a:hover {
    border: 1px solid #36a8d4;
    border-radius: 3px;
    background-color: #36a8d4;
    padding: 4px 16px;
    text-transform: capitalize;
    font-weight: bold;
    font-size: 11px;
    color: #ffffff;
}

.summary .summary-container .link a {
    text-transform: none;
}

.summary .top-section-title {
    background-image: url(/images/separator-1.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
}

.summary .link a {
    border: none !important;
    text-align: left !important;
    padding-left: 0px !important;
    font-family: "Lato";
}

.summary .company-data {
    padding-top: 17px;
}

.summary .job-data p {
    line-height: 20px;
    margin-bottom: 0;
    font-family: "Lato";
}

.summary .main-summary-info .modify-section {
    margin: 0px !important;
    padding-top: 10px;
}

.summary .job-data h3 {
    font-size: 16px;
    text-transform: uppercase;
}

.summary span.more {
    color: #8662a6 !important;
    font-family: "Lato" !important;
    font-style: normal !important;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 10px !important;
}

.summary span.less {
    color: #8662a6 !important;
    font-family: "Lato" !important;
    font-style: normal !important;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 10px !important;
}

.summary .col-sm-6.jobAd-item-description {
    padding-bottom: 20px;
}

.summary .row.key-facts {
    background-color: #f4f4f4;
    padding: 23px 21px;
    border-radius: 3px;
    margin-right: 0px;
    margin-left: 0;
    margin-top: 24px;
    font-family: "Lato";
}

.summary .job-data .col-sm-6.col-md-6 {
    padding-bottom: 15px;
}

.summary .summary-container .glyphicon:before {
    color: #8662a6;
}

.summary .row.key-facts strong {
    display: block;
}

.summary .i-block strong {
    display: inline-block !important;
}

.summary span.i-block {
    display: block;
}

.summary .payment .row.user-have-no-credits {
    color: red;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
}

.summary .payment .row.user-have-credits {
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    color: #333333;
}

.summary .payment .row.user-have-subscription {
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    color: #333333;
}

.summary .payment .row.user-have-subscription span.green-subscription {
    color: #1297cc;
}

.summary .payment .row.user-have-credits span.active-credits {
    color: #1297cc;
}

.summary .payment-block {
    background-color: #ffffff;
    border-radius: 6px;
    box-shadow: 1px 1px 14px #ddd;
    padding: 20px 20px;
    height: 535px;
    max-width: 500px;
    margin: 0 auto;
}

.summary .payment-block.selected {
    height: 570px;
}

.summary .payment-block .popup {
    background-color: #ffffff;
    height: 490px;
    position: absolute;
    right: 0;
    left: 15px;
    width: 285px;
    top: 40px;
    opacity: 0.9;
    font-weight: bold;
    text-align: center;
    font-size: 16px;
    padding-top: 14px;
    font-family: "Lato";
    border-radius: 6px;
}

.summary .payment-block.selected .popup {
    height: 526px;
    position: absolute;
    right: 0;
    left: 15px;
    width: 285px;
    top: 44px;
    opacity: 0.9;
    font-weight: bold;
    text-align: center;
    color: #ffffff;
    font-size: 16px;
    padding-top: 20px;
    font-family: "Lato";
    z-index: 1;
    background: linear-gradient(108deg, #8662a6, #5479b7 70%, #1596cb);
    border-radius: 6px;
}

.summary .payment-block.selected {
    background: linear-gradient(108deg, #8662a6, #5479b7 70%, #1596cb);
    border-radius: 6px;
    padding: 26px 20px;
}

.summary .payment-block.selected i.fa.fa-info-circle {
    color: #ffffff;
    float: right;
    font-size: 17px;
}

.summary .payment-block i.fa.fa-info-circle {
    color: #8662a6;
    float: right;
    font-size: 17px;
}

.summary .payment-block.selected h2.title {
    text-align: center;
    color: #ffffff;
    font-weight: bold;
    font-size: 28px;
}

.summary .payment-block.selected h2.title {
    text-align: center;
    color: #ffffff;
    font-weight: bold;
    font-size: 28px;
    background-repeat: no-repeat;
    background-image: url(/images/separator-payment.png);
    background-size: 97px;
    background-position: bottom;
    padding-bottom: 18px;
}

.summary .payment {
    margin-top: 50px;
}

.summary .payment-block.selected h3.price {
    color: #ffffff;
    text-align: center;
    font-weight: bold;
    font-size: 30px;
}

.summary .payment-block.selected h3.price small {
    color: #ffffff;
    text-align: center;
    font-weight: bold;
    font-size: 25px;
}

.summary .payment-block.selected .additional_info {
    text-align: center;
    color: #ffffff;
    font-family: "Lato";
    padding-bottom: 30px;
}

.summary .payment-block.selected hr {
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    max-width: 92%;
    color: #ffffff;
}

.summary .payment-block.selected ul.benefits {
    list-style-type: none;
    color: #ffffff;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 20px;
    padding-bottom: 0px;
}

.summary .payment-block.selected i.fa.fa-check {
    padding-right: 11px;
    color: #ffffff;
}

.summary .payment-block.selected ul hr {
    width: 72%;
}

.summary .payment-block.selected ul li {
    padding-bottom: 15px;
    padding-top: 15px;
    color: #ffffff;
    list-style-type: none;
    font-family: "Lato";
}

.summary .payment-block.selected i.glyphicon.glyphicon-ok-sign.icon-checked {
    text-align: center !important;
    color: #fff;
    font-size: 45px;
    display: block;
}

.summary .payment-block.selected i.glyphicon.glyphicon-ok-sign.package-icon-checked {
    text-align: center !important;
    color: #fff;
    font-size: 45px;
    display: block;
}

.summary .payment-block.selected ul.p-t-30 {
    margin-top: 0px !important;
}

.summary .payment-block.selected a {
    text-align: center !important;
    display: block;
    padding-top: 12px;
    font-family: "Lato";
}

.summary .payment-block.selected .packs-list li {
    padding: 5px !important;
    text-align: center;
}

.summary .payment-block.selected ul.packs-list {
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 0;
}

.summary .payment-block.selected ul li small {
    text-decoration: line-through;
    padding-left: 20px;
    color: #ffffff;
}

.summary .jobAb-description-collapsed {
    height: 60px;
}

.summary .payment-block h2.title {
    text-align: center;
    color: #333333;
    font-weight: bold;
    font-size: 28px;
    background-repeat: no-repeat;
    background-image: url(/images/separator-payment2.png);
    background-size: 97px;
    background-position: bottom;
    padding-bottom: 18px;
}

.summary .payment-block .packs-list li {
    padding: 5px !important;
    text-align: center;
}

.summary .payment-block ul.packs-list {
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 0;
    list-style-type: none;
    margin-bottom: 0;
}

.summary .payment-block ul li small {
    text-decoration: line-through;
    color: #999999;
    padding-left: 20px;
}

.summary .payment-block .packs-list span {
    color: #129ccf;
    font-family: "Lato";
    font-weight: bold;
}

.summary .payment-block span.pack-price {
    color: #333333;
}

.summary .payment-block.selected .packs-list span {
    color: #ffffff;
    font-family: "Lato";
    font-weight: bold;
}

.summary .payment-block.selected span.pack-price {
    color: #ffffff;
}

.summary .payment-block hr {
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    max-width: 92%;
    color: #f7f7f7;
}

.summary .payment-block .additional_info {
    text-align: center;
    color: #333333;
    font-family: "Lato";
    padding-bottom: 30px;
}

.summary .payment-block ul.benefits {
    list-style-type: none;
    color: #333333;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 20px;
    padding-bottom: 0px;
}

.summary .payment-block ul li {
    padding-bottom: 15px;
    padding-top: 15px;
    color: #333333;
    list-style-type: none;
    font-family: "Lato";
}

.summary .payment-block ul.benefits li {
    padding-left: 20px;
    position: relative;
}

.summary .payment-block ul hr {
    width: 72%;
}

.summary .payment-block i.fa.fa-check {
    color: #7bb521;
    position: absolute;
    left: 0;
}

.summary .payment-block h3.price {
    color: #333333;
    text-align: center;
    font-weight: bold;
    font-size: 30px;
}

.summary .payment-block button.btn.btn-primary {
    box-shadow: none;
    margin: 0 auto;
    width: 100%;
}

.summary .payment-block.selected p.credits-info {
    font-size: 15px;
    color: #ffffff;
    font-family: "Lato";
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px;
}

.summary .payment-block p.credits-info {
    font-size: 15px;
    color: #333333;
    font-family: "Lato";
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px;
}

.summary .payment-block.selected p.credits-left {
    border-top: 1px solid #ffffff;
    color: #ffffff;
    text-align: center;
    font-family: "Lato";
    padding-top: 20px;
    padding-bottom: 10px;
}

.summary .payment-block p.credits-left {
    border-top: 1px solid #f5f5f5;
    color: #333333;
    text-align: center;
    font-family: "Lato";
    padding-top: 20px;
    padding-bottom: 10px;
}

.summary .accept-payment {
    background-color: #ffffff;
    border-radius: 4px;
    border-top: 4px solid #eeeeee;
    margin-right: -15px;
    margin-left: -15px;
    margin-top: 20px;
}

.summary .accept-payment .container {
    width: 100%;
}

.summary .accept-payment .accept .btn {
    background-color: #7bb521;
    padding: 15px;
    border: 1px solid #7bb521;
    color: #ffffff;
}

.summary .accept-payment .accept .btn:hover {
    background-color: transparent;
    padding: 15px;
    border: 1px solid #7bb521;
    color: #7bb521;
}

.summary .accept-payment .accept p.margin-10-0 {
    font-family: "Lato";
    font-weight: bold;
}

.summary .accept-payment .form-control {
    background-color: #f7f7f7;
    border-color: #f7f7f7;
    box-shadow: none;
    border-radius: 4px;
    width: 100% !important;
    font-size: 14px;
    font-family: "Lato";
}

.summary .accept-payment .accept .checkbox label {
    font-family: "Lato";
    font-weight: bold;
}

.summary .accept-payment .accept .checkbox label::after, .radio label::after {
    background-color: #cccccc;
    border-radius: 4px;
}

.summary .accept-payment .secure {
    padding: 25px;
}

.summary .accept-payment span.d-inline-block.padding-5-0 {
    font-family: "Lato";
    font-weight: bold;
    font-size: 13px;
}

.summary .accept-payment button.btn.btn-white.btn-sm.pull-right {
    border: 1px solid #0e99cd;
    border-radius: 3px;
    box-shadow: none;
    padding: 6px 10px;
    color: #0e99cd;
}

.summary .accept-payment button.btn.btn-white.btn-sm.pull-right:hover {
    border: 1px solid #0e99cd;
    border-radius: 3px;
    box-shadow: none;
    padding: 6px 10px;
    color: #ffffff;
    background-color: #0e99cd;
}

.summary .accept-payment .fa-check {
    color: #58BE57;
    position: absolute;
    right: 24px;
}

.summary .accept-payment i.fa.fa-spinner.fa-pulse.fa-fw.margin-top-20.hidden {
    position: absolute;
    right: 0px;
}

.summary-container .total-header .customers-counter.pull-right {
    margin-top: 16px;
    background-color: #f7f7f7;
    padding: 0px 10px;
    width: 100%;
}

.summary-container .total-header span.count {
    font-size: 13px !important;
}

.summary-container .total-header .customers-counter.pull-right p {
    font-size: 13px;
    margin-bottom: 0;
}

.summary-container .modify-section {
    margin: 5px 0 0;
}

.summary-container .additional-recapitulatif-info ul {
    padding-left: 0 !important;
    padding-top: 5px;
    color: #8662a6;
    font-weight: bold;
}

.summary-container .total-footer .btn-green {
    background: #7bb521;
    border-color: #7bb521;
    width: 100%;
}

.summary-container .total-footer .btn.btn-green span {
    font-size: 14px;
    text-align: center;
}

/* PACKAGE MODAL */

.modal-title {
    padding: 0 !important;
    font-size: 25px;
    text-align: left !important;
    background-image: url(/images/separator-modal.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom !important;
    line-height: 2em;
    text-transform: none;
    color: #1297cc;
}

.modal-header, #packagesModal .modal-footer {
    padding: 30px 30px;
}

.modal-header button.close {
    border: 2px solid #999999;
    background-color: transparent !important;
    color: #999999 !important;
    width: 25px;
    height: 25px;
    margin-right: 19px;
    margin-top: 10px
}

#packagesModal .tarifPacks .tarifBox {
    margin: 0px 0px;
}

#packagesModal .singlePriceBlock {
    width: 30%;
    box-shadow: 1px 1px 7px #ddd;
}

#packagesModal .singlePriceBlock .priceBlock {
    border-radius: 0px;
}

.modal-footer {
    margin: 0px;
    padding-top: 0 !important;
}

.modal-dialog {
    width: 60%;
}

.modal-footer .accept p.margin-10-0 {
    font-family: "Lato";
    font-weight: bold;
    padding-bottom: 2px;
}

.modal-footer div#package_coupon {
    padding: 0;
}

input#promoCode {
    border: none;
    background-color: #f7f7f7;
    border-radius: 4px;
    width: 100% !important;
    box-shadow: none;
    font-family: "Lato";
    font-size: 13px;
    text-transform: uppercase;
}

#packagesModal .packagesBtn {
    padding: 12px;
    background: #7bb521;
    border-color: #7bb521;
    width: 97%;
}

#packagesModal .packagesBtn:hover, #packagesModal .packagesBtn:focus {
    background: #7bb521;
}

.checkbox label::after, .radio label::after {
    background-color: #cccccc;
    border-radius: 4px;
}

.checkbox label, .radio label {
    line-height: 19px;
    font-family: "lato";
}

#packagesModal .tarifPacks .tarifBox .singlePriceBlock h3 span {
    display: inline-block;
    font-size: 18px;
    color: #333333;
}

#packagesModal .tarifPacks .priceTable .fixedPrice h3 {
    color: #53bbe5 !important;
    margin-top: 13px !important;
    margin-bottom: 13px !important;
}

#packagesModal .tarifPacks .priceTable .lowPrice h3 {
    color: #1297cc !important;
    margin-top: 13px !important;
    margin-bottom: 13px !important;
}

#packagesModal .tarifPacks .priceTable .midPrice h3 {
    color: #517ab8 !important;
    margin-top: 13px !important;
    margin-bottom: 13px !important;
}

#packagesModal .tarifPacks .priceTable .bestPrice h3 {
    color: #8264a8 !important;
    margin-top: 13px !important;
    margin-bottom: 13px !important;
}

#packagesModal .singlePriceBlock.fixedPrice .priceBlock {
    background: #53bbe5;
}

#packagesModal .singlePriceBlock .priceAdvice {
    background: transparent;
    font-size: 10px;
    font-family: "Lato";
    color: #ffffff;
    padding: 5px 3px;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    padding-top: 10px;
    padding-bottom: 10px;
}

#packagesModal .singlePriceBlock .selected i {
    font-size: 47px;
    margin-top: 29px;
    margin-left: 78px;
    color: #ffffff;
}

#packagesModal .singlePriceBlock .selected {
    background: rgba(0, 0, 0, 0.2);
}

#packagesModal .selected h2 {
    color: rgba(255, 255, 255, 0.1) !important;
}

#packagesModal .selected p {
    color: rgba(255, 255, 255, 0.1) !important;
}

#packagesModal .fixedPrice.singlePriceBlock:hover {
    box-shadow: 0px 1px 10px #53bbe5 !important;
}

#packagesModal .lowPrice.singlePriceBlock:hover {
    box-shadow: 0px 1px 10px #1297cc !important;
}

#packagesModal .midPrice.singlePriceBlock:hover {
    box-shadow: 0px 1px 10px #517ab8 !important;
}

#packagesModal .bestPrice.singlePriceBlock:hover {
    box-shadow: 0px 1px 10px #8264a8 !important;
}

/* PAYMENT SUCCESS */

.thanks h3 {
    font-size: 26px;
    font-weight: 900;
    margin: 0 0 10px 0;
    color: #1297cc;
}

.thanks p {
    margin-bottom: 0;
    font-family: "Lato";
    padding-bottom: 14px;
    line-height: 1.5em;
}

.thanks .col-md-6 .card {
    background-color: transparent;
    border: none;
    color: #ffffff;
    background: linear-gradient(108deg, #8662a6, #5479b7 70%, #1596cb);
}

.thanks .col-md-6.felicitation a {
    text-decoration: underline;
    border: 1px solid #0b9bce;
    text-decoration: none;
    font-weight: bold;
    padding: 3px 19px;
    border-radius: 4px;
}

.thanks {
    background-color: #f7f7f7;
    margin-top: 0;
}

.thanks .col-md-6.share .card p {
    padding-bottom: 0;
}

.thanks .col-md-6.felicitation p {
    padding-bottom: 15px !important;
}

.thanks ul.social-list.vv {
    border-top: 1px solid #ffffff;
    padding-top: 15px;
    margin-top: 15px;
}

.thanks .col-md-6.share strong {
    font-size: 21px;
}

.thanks .col-md-6.share .social-list li a {
    background-color: #ffffff !important;
    border-radius: 50%;
}

.thanks .col-md-6.share .social-list i.fa {
    color: #8662a6;
}

.thanks .col-md-6.share span.glyphicon.glyphicon-share {
    padding-right: 8px;
    font-size: 19px;
}

.thanks .col-md-6.share p.follow {
    padding-left: 27px;
}

.thanks .col-md-6.share .social-list span {
    float: left;
    padding-right: 11px;
    padding-top: 4px;
}

.thanks .col-md-6.share .social-list>li {
    padding-right: 5px;
    padding-left: 5px;
}

.thanks hr {
    margin-top: 30px;
    margin-bottom: 20px;
}

.thanks .col-md-12.invitation {
    background-color: #ffffff;
    border-radius: 6px;
    padding: 20px 30px;
}

.thanks .col-md-12.invitation .use-coupon-title span {
    color: #1297cc;
    text-decoration: none;
}

.thanks .col-md-12.invitation h3.use-coupon-title {
    color: #333333;
}

.thanks h3.use-coupon-title {
    color: #333333;
    background-repeat: no-repeat;
    background-image: url(/images/separator-1.jpg);
    background-size: contain;
    background-position: bottom;
    line-height: 2em;
}

.thanks .col-md-12.invitation ul.social-list.vv.share-coupon-btn {
    display: inline-block;
}

.thanks .col-md-12.invitation span.coupon-small-share {
    font-family: "Lato";
    font-weight: bold;
    padding-right: 10px;
    vertical-align: top;
    padding-top: 10px;
    display: inline-block;
}

.thanks .col-md-12.invitation .pull-left {
    float: none !important;
}

.thanks .col-md-12.invitation span.coupon-small-info {
    font-family: "Lato";
    font-weight: bold;
}

.thanks .col-md-12.invitation .pull-left b {
    color: #119acd;
}

.thanks .col-md-12.invitation .left-share {
    background-color: #f7f7f7;
    border-radius: 4px;
    padding: 10px 16px;
    width: 50%;
    margin-top: 16px;
}

.thanks .col-md-12.invitation .left-share ul.social-list.vv.share-coupon-btn {
    margin-top: 0;
    padding-top: 6px;
    border-top: none;
}

.thanks .col-md-12.invitation .left-share .social-list.vv.share-coupon-btn li a {
    background-color: #333333;
    border-radius: 50%;
    width: 32px;
    height: 32px;
}

.thanks .col-md-12.invitation .left-share .social-list.vv.share-coupon-btn li a.twitter:hover {
    background-color: #1DA1F2 !important;
}

.thanks .col-md-12.invitation .left-share .social-list.vv.share-coupon-btn li a.google-plus:hover {
    background-color: #DB4437 !important;
}

.thanks .col-md-12.invitation .left-share .social-list.vv.share-coupon-btn li a.facebook:hover {
    background-color: #3B5998 !important;
}

.thanks .col-md-12.invitation .left-share .social-list.vv.share-coupon-btn li a.linkedin:hover {
    background-color: #1D87BD !important;
}

.thanks .col-md-12.invitation .left-share .social-list.vv.share-coupon-btn li a.viadeo:hover {
    background-color: #D64928 !important;
}

.thanks .col-md-12.invitation .left-share .social-list.vv.share-coupon-btn li a.email:hover {
    background-color: #3B5998 !important;
}

.thanks .col-md-6.share .social-list i.fa:hover {
    color: #ffffff !important;
}

.thanks .col-md-6.share .social-list li a:hover {
    background-color: transparent !important;
    border-radius: 50%;
    border: 1px solid #FFFFFF;
}

.thanks .col-md-12.invitation .left-share .social-list.vv.share-coupon-btn li {
    padding-left: 5px;
    padding-right: 5px;
}

.social-btns-wrapper ul.social-list.vv {
    margin: 0;
    padding: 0
}

.clickable {
    cursor: pointer;
}

/* VHARITON: >>> TARIF MODAL INFO POPIN */

.summary .payment-block {
    position: relative;
}

.summary .payment-block .info-tip .tip-icon {
    position: absolute;
    display: block;
    width: 24px;
    height: 24px;
    overflow: hidden;
    border-radius: 50%;
    right: 15px;
    top: 15px;
    z-index: 10;
    color: #8662a6;
    background: transparent;
    transition: all ease-in-out .3s;
    cursor: pointer;
}

.summary .payment-block .info-tip .tip-icon:after {
    content: "\e00c";
    font-family: 'chaze-icons';
    font-size: 24px;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.summary .payment-block .info-tip .tip-icon:hover {
    color: #8662a6;
}

.summary .payment-block .info-tip .tip-data {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    border-radius: 4px;
    padding: 20px;
    z-index: 9;
}

.summary .payment-block .info-tip .tip-data:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #ffffff;
    opacity: 0;
    border-radius: inherit;
    z-index: -1;
}

.summary .payment-block .info-tip .tip-data .tip-data-description {
    display: none;
    padding-top: 20px;
    line-height: 1.6;
    font-size: 14px;
}

.summary .payment-block .info-tip .tip-icon:hover+.tip-data:after {
    opacity: 1;
}

.summary .payment-block .info-tip .tip-icon:hover+.tip-data .tip-data-description {
    display: block;
}

.summary .payment-block .info-tip .tip-icon:hover+.tip-data .tip-data-extra {
    display: none;
}

.summary .payment-block .info-tip .tip-icon:hover+.tip-data .tip-data-main h2.title {
    color: #333333;
    background-image: url(/images/separator-payment2.png);
}

.summary .payment-block .info-tip .tip-icon:hover+.tip-data .tip-data-main h3.price, .summary .payment-block .info-tip .tip-icon:hover+.tip-data .tip-data-main .additional_info {
    color: #333333;
}

.summary .payment-block .info-tip .tip-icon:hover+.tip-data .tip-data-main h3.price small {
    color: #777777;
    font-weight: 400;
}

.summary .payment-block.selected .info-tip .tip-icon {
    color: white;
}

.summary .payment-block.selected .info-tip .tip-icon:hover {
    color: #8662a6;
}

/* VHARITON: <<< TARIF MODAL INFO POPIN */

@media (min-width: 769px) and (max-width: 991px) {
    .step-2-wrapper.collapsed #sidebar {
        left: -190px;
    }
    #total-sidebar {
        width: 250px;
    }
    .summary div#wrapper {
        padding-right: 260px !important;
    }
}

@media (max-width: 768px) {
    #total-sidebar {
        width: 100%;
    }
    #wrapper.step-2-wrapper.collapsed {
        padding-left: 0px;
    }
    .summary div#wrapper {
        padding-right: 20px !important;
    }
}

@media (max-width: 1200px) {
    .jobboard-cbx .cbx.disabled .cbx_c::before {
        top: -10px;
        left: -9px;
        font-size: 17px;
    }
}

@media (max-width: 1500px) {
    .summary .payment-block .info-tip .tip-data {
        padding: 15px;
    }
    .step-2-wrapper #page-content {
        padding: 40px 20px;
    }
    .summary .payment .row.payment-methods {
        margin-top: 30px -25px 0 -25px;
    }
    .summary .payment .row.payment-methods>div {
        padding-left: 10px;
        padding-right: 10px;
        margin-bottom: 20px;
    }
    .summary .payment-block ul li {
        padding-bottom: 10px;
        padding-top: 10px;
    }
    .summary .payment-block ul.benefits {
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 10px;
    }
    .summary .payment-block ul hr {
        width: 90% !important;
    }
    .summary .payment-block h2.title, .summary .payment-block.selected h2.title {
        font-size: 22px;
    }
    .summary .payment-block h3.price, .summary .payment-block.selected h3.price {
        font-size: 24px;
    }
}

@media (max-width: 1700px) {
    .summary .payment-block .info-tip .tip-data .tip-data-description {
        font-size: 12px;
    }
}