@font-face {
    font-family: 'ico';
    src: url(fonts/ico.eot?53671323);
    src: url(fonts/ico.eot?53671323#iefix) format('embedded-opentype'), url(fonts/ico.woff?10079768) format('woff'), url(fonts/ico.ttf?53671323) format('truetype'), url(fonts/ico.svg?53671323#ico) format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'picto';
    src: url(fonts/picto.eot);
    src: url(fonts/picto.eot#iefix) format('embedded-opentype'), url(fonts/picto.woff) format('woff'), url(fonts/picto.ttf) format('truetype'), url(fonts/picto.svg#ico) format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansextrabold';
    src: url(fonts/opensans-extrabold-webfont.eot);
    src: url(fonts/opensans-extrabold-webfont.eot?#iefix) format("embedded-opentype"), url(fonts/opensans-extrabold-webfont.woff) format("woff"), url(fonts/opensans-extrabold-webfont.ttf) format("truetype"), url(fonts/opensans-extrabold-webfont.svg#open_sansextrabold) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'DIN-EQP-Regular';
    src: url(fonts/DIN-EQP-Regular.woff) format("woff"), url(fonts/DIN-EQP-Regular.ttf) format("truetype"), url(fonts/DIN-EQP-Regular.svg#DIN-EQP-Regular) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'DIN-EQP-Bold';
    src: url(fonts/DIN-EQP-Bold.woff) format("woff"), url(fonts/DIN-EQP-Bold.ttf) format("truetype"), url(fonts/DIN-EQP-Bold.svg#DIN-EQP-Bold) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'DIN-EQP-Condensed';
    src: url(fonts/DIN-EQP-Condensed.woff) format("woff"), url(fonts/DIN-EQP-Condensed.ttf) format("truetype"), url(fonts/DIN-EQP-Condensed.svg#DIN-EQP-Condensed) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'DIN-EQP-MediumCondensed';
    src: url(fonts/DIN-EQP-MediumCondensed.woff) format("woff"), url(fonts/DIN-EQP-MediumCondensed.ttf) format("truetype"), url(fonts/DIN-EQP-MediumCondensed.svg#DIN-EQP-MediumCondensed) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'DIN-EQP-BoldCondensed';
    src: url(fonts/DIN-EQP-BoldCondensed.woff) format("woff"), url(fonts/DIN-EQP-BoldCondensed.ttf) format("truetype"), url(fonts/DIN-EQP-BoldCondensed.svg#DIN-EQP-BoldCondensed) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'DIN-EQP-Heavy';
    src: url(fonts/DIN-EQP-Heavy.woff) format("woff"), url(fonts/DIN-EQP-Heavy.ttf) format("truetype"), url(fonts/DIN-EQP-Heavy.svg#DIN-EQP-Heavy) format("svg");
    font-weight: 400;
    font-style: normal
}

/* reset START */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline;
}

html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a:active, a:hover {
    outline: 0;
}

sub, sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}

sup {
    top: -.5em;
}

sub {
    bottom: -.25em;
}

hr {
    height: 0;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

button, input, optgroup, select, textarea {
    margin: 0;
    font: inherit;
    color: inherit;
    font-size: 14px;
}

button {
    overflow: visible;
}

button, select {
    text-transform: none;
}

button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}

button[disabled], html input[disabled] {
    cursor: default;
}

button::-moz-focus-inner, input::-moz-focus-inner {
    padding: 0;
    border: 0;
}

input {
    line-height: normal;
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

input[type="search"] {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

img {
    max-width: 100%;
    height: auto;
}

/* reset END */

body {
    background-color: #f6f5f1;
    font-size: 14px;
    color: #282c38;
}

.container-global {
    width: 100%;
    margin: 0 auto;
}

.layout {
    width: auto;
    margin: auto;
    max-width: 944px;
}

.mm {
    margin: 5px 15px 10px 15px;
    position: relative;
}

.header__bar {
    text-align: center;
    width: 100%;
    position: relative;
    background: #FFF;
    border-bottom: 1px solid #dedede;
}

.header__bar .layout {
    max-width: inherit;
    padding: 0 15px;
    height: 84px;
    background-color: #d60000;
}

.header__logo {
    margin: 0 auto;
    height: 35px;
    float: left;
}

.header__logo img {
    width: 272px;
    margin: 12px 0px 12px 40px;
}

.header__picture {
    width: 100%;
    height: 150px;
    border-top: #d61e00 5px solid;
    text-align: center;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(https://medias.lequipe.fr/img-photo-jpg/ff/1500000000913886/0-0-0-70/d9fc3.jpg);
}

@media (max-width: 768px) {
    .header__bar .layout {
        height: 80px;
    }

    .header__logo img {
        width: 180px;
        margin: 19px 0px 0px 20px;
    }
}

.main {
    text-align: center;
}

.main__left {
    text-align: left;
    margin-top: 30px;
    width: 31.5%;
    display: inline-block;
    vertical-align: top;
    margin-right: 1.5%;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition: margin-top .5s ease;
}

.main__right {
    text-align: left;
    margin-top: 30px;
    width: 66%;
    display: inline-block;
    vertical-align: top;
}

.main__center {
    margin: 30px auto 0 auto;
    display: inline-block;
    vertical-align: top;
    width: 90%;
    max-width: 624px;
    background: #fff;
    padding: 60px;
}

.main__form {
    background: #fff;
    padding: 40px 60px 30px 60px;
    position: relative;
}

.main__form--gift {
    padding-bottom: 40px;
}

.main__form + .main__form {
    margin-top: 20px;
}

.main__paragraphe {
    display: block;
    font-size: 16px;
    line-height: 18px;
    margin: 10px 0px 20px 0px;
    font-family: 'DIN-EQP-Regular', Arial;
}

.main__form--grey {
    background: #eee;
    padding: 20px 30px;
    margin-top: 20px;
    text-align: center;
}

@media (max-width: 768px) {
    .main__left {
        margin-top: 20px;
        width: 100%;
    }

    .main__right {
        margin-top: 20px;
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        display: block;
    }

    .main__center {
        padding: 20px;
        margin-top: 20px;
    }

    .main__form {
        position: relative;
        padding: 20px;
    }

    .main__form--grey {
        padding: 10px 20px;
    }

}

.secureSpace, .secureSpace:before {
    font-weight: 400;
    letter-spacing: -.2px;
}

.secureSpace {
    display: inline-block;
    padding: 20px;
    background-color: #fff9c0;
    box-sizing: border-box;
    font-family: DIN-EQP-Regular;
    font-size: 16px;
    line-height: 20px;
    color: #202020;
    position: absolute;
    top: 0;
    right: 0;
}

.secureSpace:before {
    content: "\e906";
    font-family: picto;
    font-size: 24px;
    line-height: 24px;
    position: absolute;
    top: 50%;
    left: 25%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

@media (max-width: 768px) {
    .secureSpace {
        margin: 0 auto;
    }

    .secureSpace:before {
        font-size: 24px;
        -webkit-transform: translateY(calc(-50% - 2px));
        transform: translateY(calc(-50% - 2px));
    }
}

.form__textfield {
    position: relative;
}

.form__textfield--half {
    width: 49%;
    display: inline-block;
}

@media (max-width: 768px) {
    .form__textfield--half {
        width: 100%;
        display: block;
    }
}

.form__row {
    display: block;
}

.form__radio {
    display: block;
    padding-bottom: 20px;
    font-family: DIN-EQP-Regular;
    font-size: 16px;
    line-height: 18px;
    font-weight: 400;
    color: #808080;
}

.form__radioButton {
    display: none;
}

.form__radioButton--checked + .form__radioText:after {
    opacity: 1;
}

.form__radioText {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    padding-left: 25px;
}

.form__radioText--checked {
    color: #202020;
}

.form__radioText:before, .form__radioText:after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.form__radioText:before {
    left: 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 1px solid gray;
    vertical-align: top;
}

.form__radioText:after {
    background-color: #202020;
    left: 2px;
    height: 8px;
    width: 8px;
    border-radius: 50%;
    opacity: 0;
    transition: opacity .25s ease;
}

.form__mentionsLegales {
    max-width: 944px;
    margin: 0 auto;
    margin-bottom: -56px;
    margin-top: 80px;
    text-align: center;
    color: gray;
    font-family: DIN-EQP-Regular;
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
    letter-spacing: -.2px;
}

.form__voucherState {
    position: absolute;
    right: 0px;
    top: 34px;
    font-size: 12px;
}

.form__formVoucher {
    margin-top: 30px;
    position: relative;
}

.form__formVoucher .textfield {
    padding-top: 0;
    margin-top: 10px;
}

.form__row--oneClick {
    padding-top: 10px;
}

.form__row--oneClick input {
    vertical-align: middle;
    width: 20px;
    height: 20px;
}

.form__row--oneClick .form__label {
    padding-left: 6px;
}

.footer__content {
    background: #101010;
    text-align: center;
    padding: 34px 0 34px 0;
    margin-top: 80px;
}

.footer__CGV li {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: top;
    display: inline-block;
    list-style: none;
    position: relative;
    cursor: pointer;
}

.footer__CGV li a {
    color: #808080;
    font-family: "DIN-EQP-Regular";
    text-decoration: none;
    font-weight: normal;
    letter-spacing: -0.2px;
    width: 70px;
    padding-top: 60px;
    display: block;
    margin: 0 10px;
}

.footer__CGV li a:before {
    font-family: "picto";
    font-size: 24px;
    line-height: 24px;
    color: #808080;
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-font-smoothing: antialiased;
}

.footer__CGV li.CGV--accueil a:before {
    content: "\e903";
}

.footer__CGV li.CGV--mentions a:before {
    content: "\e905";
}

.footer__CGV li.CGV--conditions a:before {
    content: "\e907";
}

.footer__CGV li.CGV--contact a:before {
    content: "\e900";
}

@media (max-width: 624px) {
    .footer__content {
        padding: 14px 0 14px 0;
    }

    .footer__content li a:before {
        display: none;
    }

    .footer__content li a {
        width: inherit;
        padding: 0;
        margin: 0 8px 0 0;
    }
}

.legal {
    color: #596374;
    font-size: 12px;
    background-color: #282c38;
    text-align: center;
    padding: 10px;
}

h1.message--error {
    margin: 20px 0 0;
}

a, a:visited, a:active {
    text-decoration: none;
    cursor: pointer;
}

a.button, a.button:visited, a.button:active {
    text-decoration: none;
}

.message {
    padding: 10px 0px 0px 0px;
    font-family: DIN-EQP-Regular;
    font-size: 14px;
    line-height: 20px;
    color: #202020;
}

.main__center .message {
    font-size: 16px;
}

.button {
    display: inline-block;
    background-color: #222;
    color: #fff;
    margin: 10px auto;
    height: 40px;
    line-height: 40px;
    padding: 0 20px;
    max-width: 400px;
    font-family: 'DIN-EQP-Bold', Arial;
    text-align: center;
    text-decoration: none;
    border: 0;
}

.button--submit {
    margin-top: 20px;
}

.button--yellow {
    background-color: #fff482;
    color: #202020 !important;
}

.button--light {
    background-color: grey;
    display: inline-block;
    margin-top: 30px
}

.button.btnS {
    display: inline-block;
    width: inherit;
}

.title {
    color: #202020;
    font-family: DIN-EQP-MediumCondensed;
    font-size: 30px;
    line-height: 20px;
    font-weight: 400;
    letter-spacing: -.2px;
}

.subtitle {
    color: #202020;

    font-size: 16px;
    line-height: 18px;
    font-weight: 400;
    letter-spacing: -.2px;
    display: block;
}

.heading {
    display: block;
    font-size: 22px;
    margin: 0 0px 20px 0px;
    font-family: 'DIN-EQP-Bold', Arial;
}

.heading--1 {
    font-size: 24px;
    text-transform: none;
}

.heading--gift {
    margin: 40px 0 10px 0;
}

.lesCartes {
    table-layout: fixed;
    width: 100%;
    margin: 20px 0;
}

.form__block {
    display: inline-block;
    width: 120px;
    vertical-align: top;
    text-align: center;
    padding: 5px;
}

.apply_code {
    float: right;
    color: #000;
    cursor: pointer;
    font-family: 'DIN-EQP-Condensed', Arial;
    font-size: 14px;
    margin-top: -16px;
}

span.bord {
    display: block;
    width: 100%;
    height: 100%;
    margin-left: -20px;
}

.form__block img {
    width: 100%;
    max-width: 34px;
    display: inline-block;
}

.form__blockx2 img {
    width: 48%;
}

.form__block input[type='radio'] {
    display: inline-block;
    vertical-align: initial;
    height: initial;
    width: 30px;
    height: 22px;
}

.form__label {
    font-family: DIN-EQP-Regular;
    color: gray;
    font-size: 16px;
    line-height: 24px;
    left: 0;
    right: 0;
    pointer-events: auto;
    display: block;
    top: 24px;
    width: 100%;
    overflow: hidden;
}

.form__label input[type=checkbox] {
    vertical-align: middle;
    margin-top: -1px;
}

.form__label--tooltip {
    display: inline-block;
    width: inherit;
    vertical-align: middle;
    margin-right: 4px;
}

.form__label a {
    text-decoration: none;
    cursor: pointer;
}

.form__input {
    width: 100%;
    padding: 0 15px;
    line-height: 35px;
    height: 35px;
    border: 1px solid #dedede;
    font-size: 16px;
    color: #666;
}

.dateExpire {
    margin-top: 20px;
}

.dateExpire label,
.dateExpire select {
    display: table-cell;
}

.dateExpire label:first-child {
    text-align: left;
    color: gray;
    width: 144px;
}

.dateExpire select.form__input {
    width: 45%;
    margin-right: 1.5%;
    background: white;
    border: none;
    border-bottom: 2px solid #ddd;
    padding: 0;

}

.dateExpire select.form__input:focus {
    outline: none;
}

.mt10 {
    margin-top: 24px;
}

.crypto {
    display: block;
}

.crypto input {
    width: 60%;
    display: inline-block;
}

.avecCheck {
    display: table;
    width: 100%;
    margin: 7px 0;
}

.avecCheck span {
    display: table-cell;
}

.avecCheck span:first-child {
    width: 27px;
}

.codesecu {
    font-size: 85%;
    line-height: 1.36;
    color: #7c8699;
    font-style: italic;
    margin-bottom: 10px;
}

.btnGris {
    background-color: grey;
    color: #fff;
    margin-right: 0;
}

.promocode {
    background: #eee;
    padding: 10px 20px 20px 20px;
    margin: 0 auto 0 auto;
}

.promoWrap {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.promoWrap .form__label {
    color: #7C8699;
}

.promoWrap div {
    display: table-cell;
    vertical-align: top;
    width: 40%;
}

.promoWrap div:first-child {
    padding-right: 10px;
    width: 60%
}

.promoWrap .button.btnGris {
    margin: 0;
    height: 35px;
    line-height: 35px;
    width: 100%;
}

.promocode .form__label {
    margin: 5px 5px 5px 0px;
    color: grey;
    font-size: 18px;
    font-family: 'DIN-EQP-MediumCondensed'
}

.promocode .form__label--error {
    color: red;
}

.promocode .form__label--success {
    color: green;
}

.promocode .form__input {
    height: 35px;
    line-height: 35px;
    border: none;
    font-size: 14px
}

body.is-loading .container-main, body.is-loading .footer, body.is-loading .header__picture {
    display: none;
}

body.is-loading::before {
    content: '';
    position: fixed;
    top: 50%;
    left: 50%;
    box-sizing: border-box;
    height: 40px;
    width: 60px;
    background-color: #d61e00;;
    animation: loader 1.5s infinite ease;
    z-index: 1001;
    border: 30px solid #d61e00;
    border-width: 20px 30px;
    transform: translate(-50%, -50%) skewX(-22.5deg);
}

@keyframes loader {
    0% {
        height: 40px;
        width: 60px;
    }

    25% {
        height: 40px;
        width: 80px;
    }

    50% {
        height: 40px;
        width: 60px;
    }

    75% {
        height: 60px;
        width: 60px;
    }

    100% {
        height: 40px;
        width: 60px;
    }
}

/***** SKEW *****/
.skew {
    display: inline-block;
    position: relative;
    z-index: 1;
    padding-right: 16px;
    background-color: #202020;
    color: #fff;
    font-size: 22px;
    line-height: 41px;
    font-weight: normal;
    letter-spacing: -0.2px;
    padding-left: 12px;
}

.navtabs__item:not(:first-child)::before, .navtabs__item:not(:first-child)::after {
    content: '';
    width: calc(100% - 2px);
    height: 8px;
    background: #fff;
    display: block;
    position: absolute;
    right: 4px;
}

.navtabs__item::after {
    bottom: 0px;
    left: -3px;
}

.navtabs {
    position: relative;
    margin: -20px 0px 30px 0px;
}

@media (max-width: 768px) {
    .navtabs, .header__picture {
        display: none;
    }

    .dateExpire label {
        display: block;
    }
}

.breadcrumb {
    max-width: inherit;
    width: 100%;
    text-align: right;
}

.skew + .skew {
    margin-left: -4px;
}

.navtabs__list {
    width: 100%;
    height: 40px;
    max-width: 940px;
    margin: 0 auto;
}

.navtabs__item {
    height: 40px;
    font-size: 14px;
    line-height: 40px;
    font-weight: normal;
    letter-spacing: -0.2px;
    font-family: Georgia, serif;
    background: #fff;
    border: 1px solid #e3e3e3;
    border-right-width: 0;
    width: 140px;
    text-align: center;
    color: rgba(32, 32, 32, 0.4);

}

.navtabs__item:last-child {
    border-right-width: 1px;
}

.navtabs__item.is-active {
    color: #202020;
}

.navtabs__item .num {
    margin-right: 8px;
}

.sumValid {
    display: table;
    width: 100%;
    margin-top: 15px;
}

.sumValid div {
    display: table-cell;
    vertical-align: middle;
}

.sumValid div:first-child {
    padding-right: 10px;
    text-align: right;
}

.sumValid div + div {
    width: 40%;
    max-width: 300px;
}

.recap p.message {
    padding-top: 0;
}

.message strong {
    font-family: "DIN-EQP-Bold", arial;
}

.paragraph em {
    font-style: italic;
}

.paragraph {
    margin-bottom: 10px;
}

.form__note {
    font-family: DIN-EQP-Regular;
    display: block;
    color: #202020;
    float: right;
    margin-top: -14px;
    font-size: 12px;;
}

.form__note--textArea {
    margin-top: 0;
}

.form__note--reginfo {
    display: none;
}

.form__note--reginfo.is-failing {
    font-family: DIN-EQP-Regular;
    display: block;
    color: #d60000;
    float: right;
    font-size: 12px;;
    margin: 0 0 20px 0;
}

.form__note--reginfo.is-failing:before {
    content: "\e908";
    display: inline-block;
    font-family: picto;
    font-size: 15px;
    line-height: 15px;
    font-weight: 400;
    letter-spacing: -.2px;
    margin: -2px 6px 0 0;
    vertical-align: middle;
    left: 0;
}

.form__note--reginfo.form__note--expiryDateValid {
    float: none;
    margin-top: 8px;
}

.form__note--reginfo.form__note--left {
    float: none;
}

.hideS {
    display: none;
}

.dateChoix {
    text-align: center;
}

#datepicker {
    display: inline-block;
}

ul.navtabs__list li span i {
    display: none;
}

textarea.form__input {
    min-height: 100px;
    margin: 0 0 30px 0;
}

textarea#message + p {
    margin: -25px 0 25px 0;
    font-style: italic;
    font-size: 85%;
}

.ui-state-active {
    background-color: #596374;
    color: #fff !important;
    border-radius: 3px;
}

p.giftMentions {
    text-align: left;
    color: #101010;
    font-family: DIN-EQP-Regular;
    font-size: 16px;
    line-height: 22px;
}

p.giftMentions strong {
    font-family: 'DIN-EQP-Bold', Arial;
    font-weight: normal;
}

.makeYourChoice {
    width: 100%;
    text-align: center;
}

.makeYourChoice .blocChoice {
    display: inline-block;
    vertical-align: middle;
    padding: 0px 5px 15px 20px;
    width: 290px;
    height: 95px;
    line-height: 95px;
    background-color: #fff;
    border: 1px solid #dedede;
    cursor: pointer;
    text-align: left;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    text-align: center;
}

.makeYourChoice .blocChoice span {
    display: inline-block;
    vertical-align: middle;
    color: #222222;
    font-size: 14px;
    line-height: 18px;
    max-width: 193px;
    text-align: left;
}

.makeYourChoice .blocChoice span strong {
    color: #596374;
    font-size: 16px;
    font-family: 'open_sansextrabold';
    text-transform: uppercase;
}

.makeYourChoice .blocChoice img {
    display: inline-block;
    vertical-align: middle;
    margin: 0 15px 0 0;
}

.ouuu {
    display: inline-block;
    position: absolute;
    left: 50%;
    margin-left: -25px;
    font-size: 16px;
    font-family: 'open_sansextrabold';
    margin-top: 87px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 50%;
    background-color: #596374;
    color: #fff;
    text-align: center;
}

.makeYourChoice .blocChoice:last-child {
    margin-top: 30px;
}

.makeYourChoice .blocChoice:hover {
    border-width: 5px;
    padding: 0px 5px 15px 20px;
}

@media (min-width: 400px) {
    .hideS {
        display: inline-block;
    }

    ul.navtabs__list li span i {
        display: inline;
    }
}

@media (min-width: 642px) {
    .makeYourChoice {
        text-align: left;
    }

    .ouuu {
        margin-top: 23px;
        margin-left: -28px;
        left: none;
    }

    .makeYourChoice .blocChoice:last-child {
        margin-left: 8px;
        margin-top: 0;
    }

    .dateChoix {
        text-align: left;
    }
}

/*
.blocDateEnvoie{display: none;}
.blocVotreMsg{display: none;}
.blocVotreBenef{display: none;}
.blocVotreBenef .infoMail{display: none;}


.voiMail .blocDateEnvoie{display: block;}
.voiMail .blocVotreMsg{display: block;}
.voiMail .blocVotreBenef{display: block;}
.voiMail .blocVotreBenef .infoMail{display: block;}

.voirPrint .blocVotreMsg{display: block;}
.voirPrint .blocVotreBenef{display: block;}
*/
.offer {
    width: 100%;
    text-align: center;
    max-width: 298px
}

@media (max-width: 768px) {
    .offer {
        max-width: inherit
    }
}

.offer:nth-child(2) .offer__bloc {
    border-left-color: #fff482
}

@media (max-width: 768px) {
    .offer:nth-child(2) .offer__bloc {
        border-left-color: #fff482
    }
}

.offer:nth-child(2) .offer__border {
    background: #fff482
}

@media (max-width: 768px) {
    .offer:nth-child(2) .offer__border {
        left: -5px
    }
}

.offer:first-child {
    margin: 0 2.5% 0 0
}

@media (max-width: 768px) {
    .offer:first-child {
        margin: auto
    }
}

.offer:last-child .offer__border {
    background: #f0f0f0;
    left: -8px
}

@media (max-width: 768px) {
    .offer:last-child .offer__border {
        left: -5px
    }
}

.offer .button--last {
    display: none
}

@media (max-width: 768px) {
    .offer .button--last {
        display: inline-block
    }
}

.offer:first-child:last-child .offer__border {
    background: #fff482
}

@media (max-width: 768px) {
    .offer:first-child:last-child .offer__border {
        left: -5px
    }
}

@media (max-width: 768px) {
    .offer {
        width: 90%;
        text-align: left;
        margin: auto
    }
}

@media (max-width: 768px) {
    .offer:last-child {
        margin: auto
    }
}

.offer__bloc {
    background: #fff;
    position: relative;
    padding: 30px 8%;
    border: 1px solid #303030;
    box-shadow: 15px 15px 0 -7px #303030;
}

@media (max-width: 768px) {
    .offer__bloc {
        text-align: center;
        padding: 24px;
        margin-bottom: 30px;
    }
}

.offer__type {
    color: #909090;
    font-family: DIN-EQP-Regular;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    letter-spacing: -.2px;
    margin-top: 10px;
    min-height: 16px
}

.offer__title {
    line-height: 28px
}

.offer__subtitle {
    color: grey;
}

.offer__descText {
    display: block
}

.offer__price {
    margin: 20px 0;
    color: #202020;
    font-family: DIN-EQP-MediumCondensed;
    font-size: 24px;
    line-height: 24px;
    font-weight: 400;
    letter-spacing: -.2px
}

.offer__price--old {
    font-size: 18px;
    text-decoration: line-through
}

.offer__price--yellow {
    background-color: #fff482;
    display: inline-block;
    padding: 11px 20px;
    font-size: 20px;
    margin: 10px 0;
}

.offer__price--big {
    font-family: 'DIN-EQP-Heavy';
    font-size: 34px;
    line-height: 40px;
    letter-spacing: -0.2px;
    margin: 0;
    margin-bottom: -10px;
}

.offer__price--small {
    font-family: 'DIN-EQP-Bold';
    font-size: 18px;
    letter-spacing: -0.2px;
}

.offer__price--medium {
    font-family: 'DIN-EQP-Bold';
    font-size: 14px;
    letter-spacing: -0.2px;
    margin: 10px 0
}

.offer__button {
    width: 150px
}

.confirm__button {
    margin-top: 40px;
}

.offer__button.button--last {
    display: none
}

.offer__gift .offer__price {
    margin-top: 10px;
}

.offer__gift .offer__subtitle {
    font-size: 20px;
    margin-top: 10px;
}

@media (max-width: 768px) {
    .offer__button.button--last {
        display: inline-block;
        margin-top: 20px
    }

    .offer__button.button--first {
        display: none
    }
}

.offer__lien {
    text-decoration: none;
    margin-top: 20px;
    display: block;
    color: #202020;
    font-family: DIN-EQP-MediumCondensed;
    font-size: 16px;
    line-height: 16px;
    font-weight: 400;
    letter-spacing: -.2px;
    cursor: pointer;
    transition: color .25s ease
}

.pg-homeVEM .offer__lien {
    display: none
}

.offer__lien:hover {
    color: #606060
}

@media (max-width: 768px) {
    .offer__lien {
        display: none
    }
}

.offer__message {
    font-family: DIN-EQP-Regular;
    margin: 10px 0;
    font-size: 16px;
    line-height: 20px;
}

.offer__message--small {
    font-size: 14px;
    line-height: 16px;
    margin: 20px 0 0 0;
}

@media (max-width: 768px) {
    .offer__paragraph {
        display: none;
    }
}

.offer__secure {
    margin-top: 20px;
    background: #fff482;
    padding: 20px;
    color: #202020;
    font-family: DIN-EQP-Regular;
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    letter-spacing: -.2px
}

.offer__subtitle {
    font-family: DIN-EQP-MediumCondensed;
    margin-bottom: 10px;
}

.offer__border--bottom {
    top: auto;
    bottom: -8px;
    width: 25%
}

@media (max-width: 768px) {
    .offer__border--bottom {
        bottom: -5px
    }
}

.offer--yellow .offer__bloc {
    border-left-color: #fff482
}

@media (max-width: 768px) {
    .offer--yellow .offer__bloc {
        border-left-color: #fff482
    }
}

.offer--yellow .offer__border {
    background: #fff482
}

@media (max-width: 768px) {
    .offer--yellow .offer__border {
        left: -5px
    }
}

.offer--black .offer__bloc {
    border-left: 10px solid #000
}

@media (max-width: 768px) {
    .offer--black .offer__bloc {
        border-left: 5px solid #000
    }
}

.offer--black .offer__border {
    background: #000;
    left: -10px
}

@media (max-width: 768px) {
    .offer--black .offer__border {
        left: -5px
    }
}

.is-selected .offer .offer__button {
    display: none !important
}

.is-selected .offer .offer__price {
    font-family: DIN-EQP-MediumCondensed;
    font-size: 30px;
    line-height: 30px;
    font-weight: 400;
    letter-spacing: -.2px
}

.is-selected .offer .offer__price span {
    display: block;
    font-size: 24px;
    color: #909090
}

@media (max-width: 768px) {
    .is-selected .offer .offer__paragraph {
        display: none
    }

    .is-selected .offer .offer__price {
        float: right
    }

    .is-selected .offer .offer__title,
    .is-selected .offer .offer__type {
        display: block;
        width: 100%
    }

    .is-selected .offer .offer__title {
        line-height: 26px
    }

    .is-selected .offer .offer__type {
        margin-top: 10px
    }

    .is-selected .offer .offer__price {
        font-family: DIN-EQP-MediumCondensed;
        font-size: 26px;
        line-height: 26px;
        font-weight: 400;
        letter-spacing: -.2px;
        text-align: right;
        margin-top: -50px
    }

    .is-selected .offer .offer__price span {
        display: block;
        font-size: 24px;
        color: #202020
    }

    .is-selected .offer .offer__price--old {
        display: inline
    }
}

.adresses__paragraph, .offer__paragraph, .paragraph, .subscription .subscription__paragraph {
    color: #202020;
    font-family: DIN-EQP-Regular;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    letter-spacing: -.2px;
}

.is-selected .offer .offer__price {
    font-family: DIN-EQP-MediumCondensed;
    font-size: 30px;
    line-height: 30px;
    font-weight: 400;
    letter-spacing: -.2px;
}

.offer__price.button {
    line-height: 40px;
    font-size: 18px;
}

.highlight {
    font-family: DIN-EQP-MediumCondensed;
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    display: inline-block;
    padding: 2px 10px 0;
    background-color: #fff482;
    margin-top: 8px;
}

.highlight, .price__info {
    color: #202020;
    letter-spacing: -.2px;
}

.textfield {
    position: relative;
    width: 100%;
    display: inline-block;
    box-sizing: border-box;
    max-width: 100%;
    margin: 0;
    padding: 20px 0 0;
    margin-bottom: 10px;
    font-family: DIN-EQP-Regular;
    font-size: 16px;
    line-height: 16px;
    font-weight: 400;
    letter-spacing: -.2px;
    color: #202020;
    -webkit-appearance: none;
    border-radius: 0;
}

.textfield__input {
    -webkit-appearance: none;
}

.input {
    font-family: DIN-EQP-Regular;
    border: none;
    border-bottom: 2px solid #ddd;
    display: block;
    margin: 0;
    padding: 4px 0;
    width: 100%;
    background: #fff;
    text-align: left;
    color: #202020;
}

.input--hidden {
    display: none;
}

.input--date {
    font-size: 16px;
    color: #808080;
    width: 150px;
    border: solid #ddd;
    text-align: center;
}

.textfield__label {
    color: gray;
    font-size: 16px;
    pointer-events: none;
    display: block;
    width: 100%;
    text-align: left;
    padding-bottom: 5px;
}

.textfield__floatingLabel {
    color: gray;
    font-size: 16px;
    left: 0;
    right: 0;
    pointer-events: none;
    display: block;
    top: 24px;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-align: left;
}

.textfield__floatingLabel:after {
    background-color: gray;
    content: "";
    height: 2px;
    left: 45%;
    visibility: hidden;
    width: 10px;
}

.textfield__input:focus,
.textfield__input.ng-not-empty,
.textfield__input#mois {
    outline: none;
    transition-duration: 0.2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.textfield__input:focus ~ .textfield__floatingLabel, .textfield__input:not(.ng-empty).ng-valid ~ .textfield__floatingLabel, .textfield__input:not(.ng-empty).ng-dirty ~ .textfield__floatingLabel, .textfield__input.ng-empty.ng-invalid ~ .textfield__floatingLabel {
    color: gray;
    top: 0;
    font-size: 16px;
    visibility: visible;
}

.textfield__input:focus ~ .textfield__floatingLabel:after {
    left: 0;
    visibility: visible;
    width: 100%;
}

.textfield__input--date:focus ~ .textfield__floatingLabel:after {
    visibility: hidden;
}

.textfield__floatingLabel, .textfield__floatingLabel:after {
    bottom: 0;
    position: absolute;
    transition-duration: .2s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
}

.textfield--md {
    width: 50%;
    margin-top: 20px;
}

.is-hidden {
    display: none;
}

.offer__paragraph {
    margin: 20px 0 0 0;
    font-size: 15px;
    line-height: 20px;
}

.offer__paragraph strong {
    font-family: "DIN-EQP-Bold", arial;
}

/* Tooltip container */
.tooltip {
    position: absolute;
    border: 1px solid #858484;
    border-radius: 28px;
    width: 14px;
    text-align: center;
    color: #858484;
    padding-top: 1px;
    height: 14px;
    font-size: 12px;
    line-height: 12px;
    bottom: 8px;
    right: 0;
}

/* Tooltip text */
.tooltip .tooltiptext {
    visibility: hidden;
    width: 125px;
    background-color: #f6f2f2;
    color: #282c38;
    text-align: left;
    padding: 10px;
    border-radius: 0px;
    height: 56px;
    /* Position the tooltip text */
    position: absolute;
    z-index: 1;
    bottom: 125%;
    top: -15px;
    left: 105%;
    font-style: normal;
    /* Fade in tooltip */
    opacity: 0;
    transition: opacity 1s;
}

/* Tooltip arrow */
.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 37%;
    right: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent #f6f2f2 transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

.visible_sm {
    display: none;

}

/* confirmation */

.form__label--checkBox {
    margin: -20px 0 0 20px;
}

.form__link {
    color: #202020;
}

@media (max-width: 768px) {

    .textfield--md {
        width: 100%;
        margin-top: 10px;
    }

    .form__note--reginfo.is-failing {
        float: none;
    }

    .tooltip {
        display: none;
    }

    .visible_sm {
        display: block !important;
        font-size: 11px;
        padding-bottom: 10px;
        color: grey;
        margin: -10px 0 0 0;
    }
}

/********** PIKADAY **********/
/*!
 * Pikaday
 * Copyright © 2014 David Bushell | BSD & MIT license | http://dbushell.com/
 */

.pika-single {
    z-index: 9999;
    display: block;
    position: relative;
    color: #333;
    background: #eee;
    border-bottom-color: #bbb;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.pika-single.is-hidden {
    display: none;
}

.pika-single.is-bound {
    position: absolute;
}

@media (max-width: 768px) {
    .pika-single.is-bound {
        left: 50% !important;
        position: absolute !important;
        transform: translateX(-50%);
        width: 90%;
    }
}

/*// clear child float (pika-lendar), using the famous micro clearfix hack*/
/*// http://nicolasgallagher.com/micro-clearfix-hack/*/
.pika-single {
    *zoom: 1;
}

.pika-single::before, .pika-single::after {
    content: " ";
    display: table;
}

.pika-single::after {
    clear: both
}

.pika-lendar {
    float: left;
    width: 100%;
    overflow: hidden;
}

.pika-title {
    position: relative;
    text-align: center;
    background-color: #303030;
}

.pika-title select {
    cursor: pointer;
    position: absolute;
    z-index: 9998;
    margin: 0;
    left: 0;
    top: 5px;
    filter: alpha(opacity=0);
    opacity: 0;
}

.pika-title select option {
    color: #202020;
}

.pika-title select option:disabled {
    color: #aaa;
}

.pika-label {
    display: inline-block;
    *display: inline;
    position: relative;
    z-index: 9999;
    overflow: hidden;
    margin: 0;
    padding: 3px 3px 0;
    font-size: 14px;
    line-height: 23px;
    color: #fff;
    background-color: #303030;
}

@media (max-width: 768px) {
    .pika-label {
        font-weight: normal;
        font-size: 18px;
        padding: 11px 3px;
    }
}

.pika-prev, .pika-next {
    display: block;
    background: transparent;
    cursor: pointer;
    position: relative;
    outline: none;
    border: 0;
    padding: 0;
    width: 40px;
    height: 30px;
    opacity: 1;
    font-size: 0;
    *position: absolute;
    *top: 0;
}

@media (max-width: 768px) {
    .pika-prev, .pika-next {
        height: 50px;
    }
}

.pika-prev.is-disabled, .pika-next.is-disabled {
    cursor: default;
    opacity: .2;
}

.pika-prev::before, .pika-next::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    border-left: 1px solid #bbb;
    border-bottom: 1px solid #bbb;
    display: inline-block;
    width: 10px;
    height: 10px;
    text-decoration: none;
}

.pika-prev, .is-rtl .pika-next {
    float: left;
    *left: 0;
}

.pika-next, .is-rtl .pika-prev {
    float: right;
    *right: 0;
}

.pika-next::before, .is-rtl .pika-prev::before {
    transform: translate(-50%, -50%) rotate(-135deg);
}

.pika-select {
    display: inline-block;
    *display: inline;
}

.pika-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 0;
}

.pika-table th, .pika-table td {
    width: 14.285714285714286%;
    padding: 0;
    text-align: center;
}

.pika-table th {
    font-family: DIN-EQP-Regular;
    font-size: 12px;
    line-height: 30px;
    color: #808080;
    background-color: #ddd;
}

@media (max-width: 768px) {
    .pika-table th {
        line-height: 45px;
        font-size: 14px;
        color: #404040;
    }
}

.pika-table th:nth-child(6), .pika-table th:nth-child(7) {
    color: #bbb;
}

.pika-table abbr {
    border-bottom: none;
    cursor: help;
}

.pika-button {
    cursor: pointer;
    display: block;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
    border: 0;
    margin: 0;
    width: 100%;
    padding: 7px 6px 4px;
    color: #666;
    background: transparent;
    font-family: DIN-EQP-Regular;
    font-size: 16px;
    line-height: 15px;
}

@media (max-width: 768px) {
    .pika-button {
        line-height: 28px;
    }
}

.is-today .pika-button {
    color: #000;
    border: 1px solid #000;
}

.is-selected .pika-button {
    color: #fff;
    background: #303030;
}

.is-disabled .pika-button, .is-outside-current-month .pika-button {
    pointer-events: none;
    cursor: default;
    color: #999;
    opacity: .3;
}

.pika-button:hover {
    color: #fff;
    background: #303030;
    box-shadow: none;
}

.pika-week {
    font-size: 11px;
    color: #999;
}

.is-inrange .pika-button {
    background: #D5E9F7;
}

.is-startrange .pika-button {
    color: #fff;
    background: #6CB31D;
    box-shadow: none;
    border-radius: 3px;
}

.is-endrange .pika-button {
    color: #fff;
    background: #33aaff;
    box-shadow: none;
    border-radius: 3px;
}
