.text-blue, .text-blue h1, .text-blue h2, .text-blue h3 {
    color: #003c57 !important
}

.text-white, .text-white h1, .text-white h2, .text-white h3 {
    color: #fff
}

#offre-speciale {
    transition: background 1s ease-in-out;
    margin-bottom: 3rem
}

#offre-speciale .logo {
    background-color: #fff
}

#offre-speciale .section {
    height: auto;
    padding: 10rem 3rem;
    margin-bottom: 0rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: auto;
    font-family: "MultipleSans Pro", arial;
    font-weight: 600
}

#offre-speciale .section h1, #offre-speciale .section h2, #offre-speciale .section h3, #offre-speciale .section .titre-offre {
    font-family: "Buffalo"
}

#offre-speciale .section .titre-offre {
    margin-block-start: .67em;
    margin-block-end: .67em
}

#offre-speciale .section h2 {
    font-size: 6rem;
    max-width: 900px;
    margin-block-start: 0rem;
    margin-block-end: 0rem;
    line-height: .8
}

#offre-speciale .section h3 {
    font-size: 2rem
}

#offre-speciale .section ul {
    padding-inline-start: 20px
}

#offre-speciale .section .row {
    max-width: 1800px;
    margin: auto
}

#offre-speciale .section .box-image img {
    width: 35vw;
    height: 80vh;
    object-fit: cover
}

#offre-speciale .section .big-titre {
    font-size: 7rem
}

#offre-speciale .section .description {
    font-family: "MultipleSans Pro", arial;
    font-size: 1.3rem;
    text-transform: normal;
    font-weight: 400;
    margin-top: 4rem
}

#offre-speciale .section.section-right .box-image {
    margin-top: -10rem;
    margin-right: 5rem
}

#offre-speciale .section.section-right .description {
    margin-top: 4rem
}

#offre-speciale .section.section-right .button-action {
    margin-left: 1rem;
    margin-top: 3rem;
    margin-bottom: 3rem
}

#offre-speciale .section.section-left .bloc-left {
    margin-top: 5rem
}

#offre-speciale .section.section-triptyque {
    color: #000
}

#offre-speciale .section.section-triptyque h2 {
    padding: 0 1rem
}

#offre-speciale .section.section-triptyque img {
    height: 400px
}

#offre-speciale .section.section-triptyque .box-image {
    margin-right: 5rem
}

#offre-speciale .section a.button-action {
    transform: skewX(-10deg);
    padding: 10px 15px 12px;
    text-transform: uppercase;
    text-decoration: none;
    font-family: "Buffalo", arial;
    font-weight: 700;
    position: relative;
    z-index: 1;
    display: inline-block;
    font-size: 78px;
    white-space: nowrap;
    color: #003C57
}

#offre-speciale .section .number {
    font-size: 10rem;
    font-family: "Buffalo";
    display: block;
    color: #41C4C8;
    text-align: center
}

#offre-speciale .section .number-detail {
    font-size: 2rem;
    font-family: "Buffalo";
    display: block;
    color: #003C57;
    text-align: center
}

#offre-speciale .section mark.yellow {
    padding: 1rem 2rem;
    display: inline-block;
    transform: skewX(-10deg)
}

#offre-speciale .section.section-small-height {
    height: 50vh
}

#offre-speciale #big-text {
    height: 100vh
}

#offre-speciale .magenta {
    color: #FF3962
}

#offre-speciale .mark_magenta {
    background-color: #FF3962;
    color: #fff !important
}

#offre-speciale .yellow {
    background-color: #fff300
}

#offre-speciale .text-black {
    color: #000
}

#offre-speciale .text-yellow {
    color: yellow
}

#offre-speciale .section-hero {
    margin-top: 0;
    padding: 0px !important;
    height: calc(100vh - 100px);
    background-image: url(../../../../../../../../themes/marsactu/assets/img/sable2.jpg);
    background-size: cover;
    text-align: right;
    line-height: .8
}

#offre-speciale .section-hero .titre-offre {
    font-size: 7rem;
    margin-bottom: 2rem
}

.cta-simple .section-hero .bloc-offre .titre-offre {
    text-align: right;
}

#offre-speciale .section-hero .row {
    height: 100vh;
    width: 100%;
    padding: 4rem
}

#offre-speciale .section-hero .box-prix {
    margin-top: 2rem;
    display: flex;
    align-items: center;
    transform: skewX(-10deg);
    padding: 10px 40px 12px;
    position: relative;
    z-index: 1;
    display: inline-block;
    font-size: 42px;
    white-space: nowrap;
    background-color: #003C57;
    color: #fff
}

#offre-speciale .section-hero .prix {
    font-size: 18rem;
    font-family: "Buffalo"
}

#offre-speciale .section-hero .duree {
    font-size: 7rem;
    margin-left: 2rem;
    text-align: left;
    font-family: "Buffalo"
}

#offre-speciale .section-hero a.button-action {
    margin-right: 2rem
}

#offre-speciale .section-hero a.mark_magenta {
    margin-right: 0rem
}

#offre-speciale .section-hero a.button-action.text-white {
    color: #fff
}

#offre-speciale .section-triptyque .box-button {
    margin-top: 3rem;
    padding-bottom: 8rem
}

#offre-speciale .section-triptyque img {
    width: 80vw;
    height: 400px;
    margin-top: 6rem;
    margin-bottom: 3rem
}

.white {
    color: #000
}

.white ul {
    font-size: 1.2rem
}

.w-100 {
    width: 100%
}

/*
.td-main-content-wrap {
    position: relative;
    z-index: 1
}
*/
.paywall-bg-gradient {
    position: relative;
    background: linear-gradient(rgba(255, 255, 255, .004), white);
    z-index: 2;
    margin-bottom: 6rem;
    height: 150px;
    margin-top: -8rem
}

#offre-speciale .box-button {
    text-align: center
}

#offre-speciale .section-hero {
    min-height: 700px
}

#offre-speciale .section-hero .bloc-offre {
    background-repeat: no-repeat;
    background-image: url(../../../../../../../../themes/marsactu/assets/img/top-left.svg), url(../../../../../../../../themes/marsactu/assets/img/bottom-right.svg), url(../../../../../../../../themes/marsactu/assets/img/bottom-left.svg);
    background-position: top left, bottom right, bottom left;
    background-size: 500px, 376px, 276px;
    font-size: 72px;
    font-weight: 600;
    font-family: "Buffalo";
    height: calc(100vh - 50px);
    min-height: 700px
}

#offre-speciale .section-hero .bloc-offre .row {
    height: 69% !important;
    min-height: 530px
}

#offre-speciale .section-hero .bloc-offre .box-prix {
    margin-right: auto;
    margin-left: 2rem
}

#offre-speciale .section-hero .bloc-offre .btn-prix {
    text-decoration: none;
    transition: all 0.5s ease-out
}

#offre-speciale .section-hero .bloc-offre .btn-prix:hover .box-prix {
    background-color: #fff;
    color: #003C57
}

#offre-speciale .section-hero .bloc-offre .button-action.texte-dark_blue {
    display: flex
}

#offre-speciale .section-hero .mark_magenta {
    color: #fff
}

#offre-speciale .section-hero .mark_magenta:hover {
    background-color: #fff;
    color: #FF3962 !important
}

.conditions {
    font-family: "buffalo", arial;
    font-size: 2.5rem;
    color: #003C57;
    text-align: left;
    margin-left: 2rem;
    margin-top: .8rem;
    font-weight: 500
}

.btn-prix {
    margin-top: 3.5rem;
    display: block
}

#section-paywall-offre, #section-paywall-offre .bloc-offre, #section-paywall-offre .row {
    height: 500px !important;
    min-height: unset !important
}

#offre-speciale #section-paywall-offre {
    margin-bottom: 5rem !important
}

#offre-speciale #section-paywall-offre .row {
    padding-bottom: 1rem !important
}

#offre-speciale #section-paywall-offre .bloc-offre {
    font-size: 58px !important;
    background-image: url(../../../../../../../../themes/marsactu/assets/img/top-left-small.svg), url(../../../../../../../../themes/marsactu/assets/img/bottom-right.svg), url(../../../../../../../../themes/marsactu/assets/img/bottom-left.svg)
}

#offre-speciale #section-paywall-offre .bloc-offre .row {
    height: 280px
}

#offre-speciale #section-paywall-offre .titre-offre {
    font-size: 4rem;
    margin-top: 1.5rem
}

#offre-speciale #section-paywall-offre .prix {
    font-size: 8rem
}

#offre-speciale #section-paywall-offre .duree {
    font-size: 3.5rem
}

#offre-speciale #section-paywall-offre a.button-action {
    font-size: 4rem
}

#offre-speciale #section-paywall-offre .text-blue {
    font-size: 3rem
}

#offre-speciale #section-paywall-offre .box-prix {
    margin-left: 1rem
}

#offre-speciale #section-paywall-offre .box-button {
    margin-bottom: 1rem
}

#offre-speciale #section-paywall-offre .btn-prix {
    margin-top: 0
}

#offre-speciale #section-paywall-offre .conditions {
    margin-left: 10rem;
    font-size: 2rem
}

#cta-offre-ete, #cta-offre-ete .bloc-offre {
    height: auto !important;
    min-height: 219px !important
}

#offre-speciale #cta-offre-ete .bloc-offre {
    display: flex;
    flex-direction: column;
    background-size: 300px, 180px, 120px !important
}

#offre-speciale #cta-offre-ete .bloc-offre .row {
    margin-top: 0px !important;
    padding: 1rem;
    height: 100% !important;
    min-height: unset
}

#offre-speciale #cta-offre-ete .prix {
    font-size: 7rem
}

#offre-speciale #cta-offre-ete .duree {
    font-size: 3.5rem
}

#offre-speciale #cta-offre-ete .box-prix {
    margin-top: 0
}

#offre-speciale #cta-offre-ete .titre-offre {
    font-size: 4rem;
    margin-bottom: 0rem;
    margin-top: -1rem
}

#offre-speciale #cta-offre-ete .box-button {
    margin-left: -1rem;
    margin-top: -1.1rem
}

#offre-speciale #cta-offre-ete .box-button .mark_magenta {
    font-size: 3rem
}

#offre-speciale #cta-offre-ete .container-offre-row {
    width: 100%;
    margin: auto
}

#offre-speciale #cta-offre-ete .container-offre-prix {
    display: flex;
    align-items: center
}

#offre-speciale #cta-offre-ete .conditions {
    font-size: 1.5rem;
    margin-top: 10px
}

#offre-speciale #cta-offre-ete .btn-prix {
    margin-top: 1rem
}

@media (max-width: 2000px) {
    #offre-speciale .section {
        width: unset
    }

    #offre-speciale .section .row {
        max-width: 1600px
    }

    #offre-speciale .section .box-image img {
        width: 100%
    }

    #offre-speciale .section-hero .prix {
        font-size: 14rem
    }

    #offre-speciale .section-hero .duree {
        font-size: 6rem;
        margin-left: 2rem
    }

    #offre-speciale .section-hero .bloc-offre .row {
        height: 49% !important;
        margin-top: 4rem;
        padding: 0;
        min-height: 450px
    }
}

@media (max-width: 1700px) {
    #offre-speciale .section.section-right .box-image, #offre-speciale .section.section-triptyque .box-image {
        margin-right: 2rem
    }

    #offre-speciale .section-hero {
        background-size: 100;
        padding: 0
    }

    #offre-speciale .section-hero .prix {
        font-size: 13rem
    }

    #offre-speciale .section-hero .duree {
        font-size: 5.5rem;
        margin-left: 2rem
    }

    #section-paywall-offre, #section-paywall-offre .bloc-offre, #section-paywall-offre .row {
        height: 500px !important;
        min-height: unset !important
    }
}

@media (max-width: 1475px) {
    #offre-speciale .section a.button-action {
        font-size: 54px
    }

    #offre-speciale .section-hero .titre-offre {
        font-size: 6rem
    }

    #offre-speciale .section-hero .prix {
        font-size: 11rem
    }

    #offre-speciale .section-hero .duree {
        font-size: 5rem;
        margin-left: 2rem
    }

    #offre-speciale .section-hero .bloc-offre .row {
        min-height: 400px
    }

    #offre-speciale .section-hero .btn-prix {
        margin-top: 3rem
    }

    #offre-speciale #big-text {
        height: auto;
        padding: 20rem 3rem
    }
}

@media (max-width: 1256px) {
    #offre-speciale .section h2 {
        font-size: 4.5rem
    }

    #offre-speciale #section-paywall-offre .bloc-offre {
        background-size: 300px, 206px, 176px
    }
}

@media (max-width: 1180px) {
    #offre-speciale .section-hero {
        padding: 0
    }

    #offre-speciale .section-hero .prix {
        font-size: 10rem
    }

    #offre-speciale .section-hero .duree {
        font-size: 4rem;
        margin-left: 2rem
    }

    #offre-speciale .section-hero .titre-offre {
        font-size: 5rem
    }

    #offre-speciale .section-hero .btn-prix {
        margin-top: 2.5rem
    }

    #offre-speciale #section-paywall-offre a.button-action {
        font-size: 3.5rem
    }
}

@media (max-width: 990px) {
    #offre-speciale .section .titre-offre {
        font-size: 5rem
    }

    #offre-speciale .section h2 {
        font-size: 4.5rem
    }

    #offre-speciale .section.section-right .box-image {
        margin-top: 0rem
    }

    #offre-speciale .section .box-image img {
        width: 82vw;
        height: 350px;
        margin-bottom: 3rem
    }

    #offre-speciale .section-hero {
        min-height: 700px;
        padding: 0
    }

    #offre-speciale .section-hero .titre-offre {
        font-size: 4rem
    }

    #offre-speciale .section-hero .prix {
        font-size: 9rem
    }

    #offre-speciale .section-hero .duree {
        font-size: 3.5rem;
        margin-left: 2rem
    }

    #offre-speciale .section-hero .bloc-offre .row {
        padding: 2rem
    }

    #offre-speciale .section-hero .bloc-offre .box-prix {
        margin-left: 0rem
    }

    #offre-speciale .section-hero .btn-prix {
        margin-top: 1.5rem
    }

    #offre-speciale .section.section-triptyque .box-image {
        margin-right: 0
    }

    #offre-speciale .section.section-triptyque .box-image img {
        width: 100% !important;
        height: 400px;
        margin-top: 6rem;
        margin-bottom: 3rem
    }

    #offre-speciale .section.section-triptyque .description {
        margin-top: 0
    }

    #offre-speciale .section.section-right .box-image img, #offre-speciale .section.section-right .box-image {
        margin-right: 0;
        width: 100%
    }

    #offre-speciale #cta-offre-ete .titre-offre {
        font-size: 3.2rem;
        margin-bottom: 0
    }

    #offre-speciale #cta-offre-ete .prix {
        font-size: 6rem
    }

    #offre-speciale #cta-offre-ete .duree {
        font-size: 3rem;
        margin-left: 1rem
    }

    #offre-speciale #cta-offre-ete .mark_magenta {
        font-size: 3rem
    }

    #offre-speciale #cta-offre-ete .bloc-offre {
        background-position: top left, bottom -30px right, bottom left;
        background-size: 200px, 170px, 100px !important
    }
}

@media (max-width: 880px) {
    #offre-speciale #cta-offre-ete .bloc-offre .mark_magenta {
        font-size: 2.5rem
    }

    #offre-speciale #cta-offre-ete .box-button {
        margin-top: -1.6rem
    }

    #offre-speciale #section-paywall-offre .text-blue {
        font-size: 2.5rem
    }
}

@media (max-width: 800px) {
    #offre-speciale .section-hero .titre-offre {
        font-size: 3.5rem
    }

    #offre-speciale .section-hero .box-prix {
        padding: 10px 27px 12px;
        margin-top: .5rem
    }

    #offre-speciale .section-hero .prix {
        font-size: 6rem
    }

    #offre-speciale .section-hero .duree {
        font-size: 3rem;
        margin-left: 1rem
    }

    #offre-speciale .section-hero .bloc-offre .row {
        min-height: unset;
        height: 39% !important;
        margin-top: 7rem
    }

    #offre-speciale .section-hero .btn-prix {
        margin-top: 2.5rem
    }

    #offre-speciale #section-paywall-offre .titre-offre {
        font-size: 3.5rem;
        margin-top: 2.5rem
    }

    #offre-speciale #section-paywall-offre .text-blue {
        font-size: 2.5rem
    }

    #offre-speciale #section-paywall-offre .conditions {
        margin-left: 8rem
    }

    #offre-speciale #section-paywall-offre .btn-prix {
        margin-top: 2.5rem
    }
}

@media (max-width: 768px) {
    #offre-speciale .section {
        padding: 10rem 2rem
    }

    #offre-speciale .section img {
        margin-bottom: 3rem;
        margin-top: 3rem
    }

    #offre-speciale .section .big-titre {
        font-size: 5rem;
        padding-top: 5rem;
        padding-bottom: 0rem
    }

    #offre-speciale #big-text {
        padding: 10rem 2rem
    }

    #offre-speciale .section-hero {
        margin-top: 0rem;
        min-height: 500px;
        padding-top: 0rem !important;
        padding-bottom: 0rem !important;
        height: auto
    }

    #offre-speciale .section-hero img {
        display: none
    }

    #offre-speciale .section-hero .bloc-offre {
        background-size: 250px, 214px, 170px
    }

    #offre-speciale .section-hero .bloc-offre .row {
        height: 444px !important;
        margin-top: 8vh
    }

    #offre-speciale .section-hero .bloc-offre .box-prix {
        margin-left: auto;
        padding: 10px 40px 12px
    }

    #offre-speciale .section-hero .bloc-offre .box-prix .prix {
        font-size: 9rem
    }

    #offre-speciale .section-hero .bloc-offre .box-prix .duree {
        font-size: 4rem;
        margin-left: 2rem
    }

    #offre-speciale .section-hero .titre-offre {
        font-size: 4.3rem;
        text-align: center
    }

    #offre-speciale .section-hero .btn-prix {
        margin-top: 0rem
    }

    #offre-speciale.section.section-small-height {
        height: 10vh
    }

    #offre-speciale .section-triptyque .col-xs-12 .col-xs-12 {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50% !important;
        max-width: 50% !important
    }

    #offre-speciale #cta-offre-ete .bloc-offre {
        padding: 4rem 1rem 6rem;
        width: unset;
        background-position: top left, bottom 0 right, bottom left;
        background-size: 200px, 200px, 170px !important
    }

    #offre-speciale #cta-offre-ete .titre-offre {
        font-size: 3.8rem;
        text-align: center
    }

    #offre-speciale #cta-offre-ete .box-prix {
        margin-top: .7rem
    }

    #offre-speciale #cta-offre-ete .btn-prix {
        margin-bottom: 1.5rem
    }

    #offre-speciale #cta-offre-ete .container-offre-prix {
        flex-direction: column;
        justify-content: center
    }

    #offre-speciale #cta-offre-ete .box-button {
        margin-left: 0rem
    }

    #offre-speciale #cta-offre-ete .mark_magenta {
        margin-top: 2rem
    }

    #offre-speciale .section-hero .col-xs-12, #offre-speciale .section-hero .col-sm-6 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100% !important;
        max-width: 100% !important
    }

    #offre-speciale #section-paywall-offre {
        height: 800px !important
    }

    #offre-speciale #section-paywall-offre .bloc-offre {
        height: 800px !important;
        padding-bottom: 4rem;
        background-position: top left, bottom right, bottom left 40px;
        background-size: 370px, 230px, 176px
    }

    #offre-speciale #section-paywall-offre .bloc-offre .row {
        height: 355px !important
    }

    #offre-speciale #section-paywall-offre .box-prix {
        margin-left: auto
    }

    #offre-speciale #section-paywall-offre .titre-offre {
        margin: 0;
        margin-block-start: 0em;
        margin-block-end: 0em
    }

    #offre-speciale #section-paywall-offre a.button-action {
        font-size: 3rem
    }

    #offre-speciale #section-paywall-offre .conditions {
        margin-left: 0rem;
        font-size: 1.8rem;
    }

    #offre-speciale #section-paywall-offre .btn-prix {
        margin-top: 0rem
    }
}

@media (max-width: 650px) {
    .logo-mobile {
        display: block
    }

    .logo {
        display: none
    }
}

@media (max-width: 450px) {
    #offre-speciale .section-hero .titre-offre {
        font-size: 3.3rem
    }

    #offre-speciale .section-hero.section {
        height: calc(100vh - 39px);
        padding: 0;
        min-height: 600px
    }

    #offre-speciale .section-hero.section .bloc-offre {
        min-height: 600px;
        background-size: 250px, 138px, 130px
    }

    #offre-speciale .section-hero.section .bloc-offre .row {
        height: auto !important;
        margin-top: 7vh
    }

    #offre-speciale .section-hero.section .bloc-offre .box-prix .duree {
        font-size: 2.6rem;
        margin-left: 1rem
    }

    #offre-speciale .section-hero.section .bloc-offre .box-prix .prix {
        font-size: 6.4rem
    }

    #offre-speciale .section .box-image img {
        height: 300px
    }

    #offre-speciale .section-triptyque .box-button {
        margin-top: 3rem;
        padding-bottom: 5rem
    }

    #offre-speciale .section {
        height: auto;
        padding: 9rem 1rem
    }

    #offre-speciale .section .big-titre {
        font-size: 3rem
    }

    #offre-speciale .section h2 {
        font-size: 3rem
    }

    #offre-speciale .section.section-right .button-action {
        margin-left: 0 !important
    }

    #offre-speciale .section a.button-action {
        font-size: 2.5rem
    }

    #section-paywall-offre .old-user span {
        display: block
    }

    #offre-speciale #section-paywall-offre .titre-offre {
        font-size: 2.8rem !important
    }

    #offre-speciale #section-paywall-offre a.mark_magenta {
        margin-top: 1rem
    }

    #offre-speciale #section-paywall-offre .bloc-offre {
        background-size: 350px, 180px, 100px;
        padding-bottom: 1rem
    }

    #offre-speciale #section-paywall-offre .bloc-offre .row {
        height: 323px !important
    }

    #offre-speciale #section-paywall-offre .text-blue {
        font-size: 2.5rem
    }

    #offre-speciale #section-paywall-offre .duree {
        font-size: 2.5rem
    }

    #offre-speciale #section-paywall-offre .prix {
        font-size: 5.5rem
    }

    #offre-speciale #cta-offre-ete .bloc-offre {
        background-size: 200px, 149px, 134px !important
    }

    #offre-speciale #cta-offre-ete .bloc-offre .row {
        margin: 0 !important
    }

    #offre-speciale #cta-offre-ete .bloc-offre .titre-offre {
        font-size: 2.8rem
    }
}

@media (max-width: 375px) {
    #offre-speciale .section {
        height: auto;
        padding: 15rem 1rem 2rem
    }

    #offre-speciale .section .big-titre {
        font-size: 3rem
    }

    #offre-speciale .section h2 {
        font-size: 3rem
    }

    #offre-speciale .section.section-right .button-action {
        margin-left: 0 !important
    }

    #offre-speciale .section-hero {
        height: calc(100vh - 139px);
        padding: 0
    }

    #offre-speciale .section-hero .titre-offre {
        font-size: 3rem
    }

    #offre-speciale .section-hero .duree {
        font-size: 2.6rem;
        margin-left: 1rem
    }

    #offre-speciale .section-hero .prix {
        font-size: 6.4rem
    }

    #offre-speciale .section-hero .box-prix {
        padding: 10px 20px 12px;
        margin-top: 0rem
    }

    #offre-speciale .section-hero .bloc-offre {
        background-size: 250px, 138px, 130px;
        min-height: 500px
    }

    #offre-speciale .section-hero .bloc-offre .row {
        padding: 1rem;
        margin-top: 4vh
    }

    #offre-speciale .section-hero .mark_magenta {
        color: #fff;
        margin-top: -11rem;
        margin-right: 0rem !important
    }

    #offre-speciale #section-paywall-offre .section-hero.section .titre-offre {
        font-size: 2.8rem !important
    }

    #offre-speciale #section-paywall-offre .old-user span {
        display: block
    }
}

@media (max-width: 330px) {
    #offre-speciale .section-hero .bloc-offre .box-prix {
        padding: 10px 25px 12px
    }

    #offre-speciale .section .number-detail {
        font-size: 1.7rem
    }
}

@media (max-width: 990px) {
    .conditions {
        margin-left: 0rem;
        font-size: 2rem
    }
}

@media (max-width: 768px) {
    .btn-prix {
        margin-top: -1.5rem;
        display: block
    }

    .conditions {
        text-align: center;
        font-size: 2rem;
        margin-right: 0;
        margin-left: -7px
    }
}