html{
    font-family: 'Dosis' !important;
}
.logo-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    margin: 0 0 20px;
    z-index: 6;
    position: relative;
}
.logo-wrapper img {
    max-width: 170px;
}
.logo-wrapper h2 {
    font-size: 35px;
    font-weight: bold;
    font-family: 'Dosis';
    color: #434343;
    line-height: 40px;
}
.infboxstep {
    padding: 9px;
    border: 2px dashed transparent;
    border-radius: 18px;
    background-image: linear-gradient(90deg, #0096CF 50%, transparent 50%), linear-gradient(90deg, #0096CF 50%, transparent 50%), linear-gradient(0deg, #0096CF 50%, transparent 50%), linear-gradient(0deg, #0096CF 50%, transparent 50%);
    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
    background-size: 9px 3px, 9px 2px, 2px 9px, 2px 9px;
    background-position: left top, right bottom, left bottom, right top;
    animation: border-dance 1s infinite linear;
    max-width: 600px;
    position: absolute;
    right: 9px;
    bottom: 70px;
    width: 600px;
    height: 162px;
}
@keyframes border-dance {
    0% {
      background-position: left top, right bottom, left bottom, right   top;
    }
    100% {
      background-position: left 9px top, right 9px bottom , left bottom 9px , right   top 9px;
    }
  }
  .form-wizard .card-preInscription .infboxstep .alert-warning, .form-wizard .card-preInscription .infboxstep .alert.alert-success {
    width: 100%;
    margin: 7px 0;
    position: relative;
    padding: 1rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    right: 0;
    text-align: left;
}
.form-wizard .card-preInscription .infboxstep .alert.alert-success:after {
  display: none;
}
/*----------------------------------------------------*/
p.small-info {
    font-weight: 400 !important;
    font-size: 13px !important;
    text-align: left !important;
    background: #cae6ff;
    padding: 15px;
    border-radius: 7px;
    padding-left: 40px;
    position: relative;
}
p.small-info:before {
    content: "*";
    position: absolute;
    left: 2%;
    font-size: 35px;
    top: 20px;
}

#recapModal h4 {
    font-weight: 600;
    border-bottom: 1px solid #ebebeb;
    margin: 20px 0;
    padding: 0px 0 10px;
}
.payementbox-button-wrapper {
    display: flex;
    font-size: 15px;
    color: #fff;
    margin-top: 22px;
    cursor: pointer;
    justify-content: center;
}
.payementbox-button-wrapper > div {
   
    width: 235px;
    position: relative;
}
.payementbox-button-wrapper label {
    position: relative;
    width: 100%;
    display: block;
    height: 100%;
    padding: 13px 0 60px;
}
.yellow {
    color: #fee75b;
}
.modal-content .alert-danger {
  
    margin-top: 15px;
    font-weight: 600;
}
#recapModal .payementbox-button-wrapper .tarif1years {
    font-size: 15px;
}
#recapModal .payementbox-button-wrapper .timePrx {
    font-size: 11px;
    line-height: 1;
    position: absolute;
    bottom: 13px;
    left: 0;
    right: 0;
    width: 60%;
    display: table;
    margin: 0 auto;
}
.payementbox-button-wrapper > div:first-child {
   
    background: #4dd1b4;
    border-radius: 70px 0px 0 70px;
    position: relative;
}
.payementbox-button-wrapper > div:last-child:after {
    content: "";
    position: absolute;
    right: -37px;
    top: -30px;
    width: 100px;
    height: 100px;
    background: url(../../img/inscription/offre.png);
    -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
    animation: heartbeat 1.5s ease-in-out infinite both;
    background-size: 80px;
    background-repeat: no-repeat;
}


/**
 * ----------------------------------------
 * animation heartbeat
 * ----------------------------------------
 */
@-webkit-keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    10% {
        -webkit-transform: scale(0.91);
        transform: scale(0.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    17% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    33% {
        -webkit-transform: scale(0.87);
        transform: scale(0.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}
@keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    10% {
        -webkit-transform: scale(0.91);
        transform: scale(0.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    17% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    33% {
        -webkit-transform: scale(0.87);
        transform: scale(0.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

.payementbox-button-wrapper > div:first-child:after {
    content: "";
    position: absolute;
    right: -11px;
    width: 4px;
    background: #fff;
    top: -3px;
    bottom: -3px;
    transform: rotate(8deg);
    border-radius: 4px;
    z-index: 3;
}
.payementbox-button-wrapper > div:last-child {
    background: #4dd1b4;
    border-radius: 0px 70px 70px 0px;
    position: relative;
    z-index: 1;
    text-align: center;
}
.payementbox-button-wrapper > div:last-child span.timePrx.smalltext {
    padding-left: 20px;
}
.payementbox-button-wrapper h3 {
    font-weight: 600;
    font-size: 19px;
    line-height: 1;
    margin: 0 0 5px;
    text-align: center;
}
.payementbox-button-wrapper .prix {
    text-align: center;
    color: #fff;
    font-size: 12px;
    line-height: 15px;
}
.payementbox-button-wrapper > div.active {
    border: 0;
}
.payementbox-button-wrapper > div.active {
    background: #74b6f0;
}

.modal-header {
    padding: 0px 0 0 !important;
}
.continue-application {
    --color: #fff;
    --background: #404660;
    --background-hover: #3A4059;
    --background-left: #2B3044;
    --folder: #F3E9CB;
    --folder-inner: #BEB393;
    --paper: #FFFFFF;
    --paper-lines: #BBC1E1;
    --paper-behind: #E1E6F9;
    --pencil-cap: #fff;
    --pencil-top: #275EFE;
    --pencil-middle: #fff;
    --pencil-bottom: #5C86FF;
    --shadow: rgba(13, 15, 25, .2);
    border: none;
    outline: none;
    cursor: pointer;
    position: relative;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 500;
    line-height: 19px;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: transparent;
    padding: 17px 29px 17px 69px;
    transition: background 0.3s;
    color: var(--color);
    background: var(--bg, var(--background));
    text-align: right;
    float: left;
}

.continue-application > div {
    top: 0;
    left: 0;
    bottom: 0;
    width: 53px;
    position: absolute;
    overflow: hidden;
    border-radius: 5px 0 0 5px;
    background: var(--background-left);
}

.continue-application > div .folder {
    width: 23px;
    height: 27px;
    position: absolute;
    left: 15px;
    top: 13px;
}

.continue-application > div .folder .top {
    left: 0;
    top: 0;
    z-index: 2;
    position: absolute;
    transform: translateX(var(--fx, 0));
    transition: transform 0.4s ease var(--fd, 0.3s);
}

.continue-application > div .folder .top svg {
    width: 24px;
    height: 27px;
    display: block;
    fill: var(--folder);
    transform-origin: 0 50%;
    transition: transform 0.3s ease var(--fds, 0.45s);
    transform: perspective(120px) rotateY(var(--fr, 0deg));
}

.continue-application > div .folder:before, .continue-application > div .folder:after,
.continue-application > div .folder .paper {
    content: "";
    position: absolute;
    left: var(--l, 0);
    top: var(--t, 0);
    width: var(--w, 100%);
    height: var(--h, 100%);
    border-radius: 1px;
    background: var(--b, var(--folder-inner));
}

.continue-application > div .folder:before {
    box-shadow: 0 1.5px 3px var(--shadow), 0 2.5px 5px var(--shadow), 0 3.5px 7px var(--shadow);
    transform: translateX(var(--fx, 0));
    transition: transform 0.4s ease var(--fd, 0.3s);
}

.continue-application > div .folder:after,
.continue-application > div .folder .paper {
    --l: 1px;
    --t: 1px;
    --w: 21px;
    --h: 25px;
    --b: var(--paper-behind);
}

.continue-application > div .folder:after {
    transform: translate(var(--pbx, 0), var(--pby, 0));
    transition: transform 0.4s ease var(--pbd, 0s);
}

.continue-application > div .folder .paper {
    z-index: 1;
    --b: var(--paper);
}

.continue-application > div .folder .paper:before, .continue-application > div .folder .paper:after {
    content: "";
    width: var(--wp, 14px);
    height: 2px;
    border-radius: 1px;
    transform: scaleY(0.5);
    left: 3px;
    top: var(--tp, 3px);
    position: absolute;
    background: var(--paper-lines);
    box-shadow: 0 12px 0 0 var(--paper-lines), 0 24px 0 0 var(--paper-lines);
}

.continue-application > div .folder .paper:after {
    --tp: 6px;
    --wp: 10px;
}

.continue-application > div .pencil {
    height: 2px;
    width: 3px;
    border-radius: 1px 1px 0 0;
    top: 8px;
    left: 105%;
    position: absolute;
    z-index: 3;
    transform-origin: 50% 19px;
    background: var(--pencil-cap);
    transform: translateX(var(--pex, 0)) rotate(35deg);
    transition: transform 0.4s ease var(--pbd, 0s);
}

.continue-application > div .pencil:before, .continue-application > div .pencil:after {
    content: "";
    position: absolute;
    display: block;
    background: var(--b, linear-gradient(var(--pencil-top) 55%, var(--pencil-middle) 55.1%, var(--pencil-middle) 60%, var(--pencil-bottom) 60.1%));
    width: var(--w, 5px);
    height: var(--h, 20px);
    border-radius: var(--br, 2px 2px 0 0);
    top: var(--t, 2px);
    left: var(--l, -1px);
}

.continue-application > div .pencil:before {
    -webkit-clip-path: polygon(0 5%, 5px 5%, 5px 17px, 50% 20px, 0 17px);
    clip-path: polygon(0 5%, 5px 5%, 5px 17px, 50% 20px, 0 17px);
}

.continue-application > div .pencil:after {
    --b: none;
    --w: 3px;
    --h: 6px;
    --br: 0 2px 1px 0;
    --t: 3px;
    --l: 3px;
    border-top: 1px solid var(--pencil-top);
    border-right: 1px solid var(--pencil-top);
}

.continue-application:before, .continue-application:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 2px;
    border-radius: 1px;
    background: var(--color);
    transform-origin: 9px 1px;
    transform: translateX(var(--cx, 0)) scale(0.5) rotate(var(--r, -45deg));
    top: 26px;
    right: 16px;
    transition: transform 0.3s;
}

.continue-application:after {
    --r: 45deg;
}

.continue-application:hover {
    --cx: 2px;
    --bg: var(--background-hover);
    --fx: -40px;
    --fr: -60deg;
    --fd: .15s;
    --fds: 0s;
    --pbx: 3px;
    --pby: -3px;
    --pbd: .15s;
    --pex: -24px;
}
.recap p {
    margin: 0 0 10px;
}
/*----------------------------------------------------*/
.paiement-wrapper p {
    font-weight: 600;
    font-size: 20px;
    text-align: center;
    margin-top: 18px;
}
.checkbox {
    width: 273px;
    height: 60px;
    background-color: #c4edfd;
    border-radius: 30px;
    position: relative;
    color: black;
    overflow: hidden;
    margin: 0 auto;
}
#checkbox_toggle {
    display: none;
}

.checkbox .toggle {
    width: 100px;
    height: 50px;
    position: absolute;
    border-radius: 30px;
    left: 5px;
    cursor: pointer;
    background: #2fbaef;
    transition: 0.4s;
    color: #fff;
}
.check:checked + .checkbox .slide .toggle {
    width: 158px;
}
.checkbox .slide {
    width: 100%;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    cursor: pointer;
}

.checkbox .slide .text {
    font-size: 16px;
    font-weight: 700;
    z-index: 100;
    cursor: pointer;
}

.check:checked + .checkbox .slide .toggle {
    transform: translateX(100px);
    background: #4dd1b4;
}
.check:checked + .checkbox .slide {
    background-color: #0f71b1;
    color: #fff;
}
.checkbox input[type="radio"] {
    visibility: hidden;
}
/*----------------------------------------------------*/
.second-wrapper .tarif {
    position: relative;
    padding: 60px 0 30px;
}
.offerDiscount {
    color: #2ac09b;
}
img.logo-forfait {
    position: absolute;
    max-width: 24%;
    right: 2px;
    opacity: 0.7;
    top: 5%;
    transform: rotate(22deg);
}
h3.title-recap {
    margin: 16px 0 10px;
    font-size: 19px;
    font-weight: 600;
    color: #4295ce;
    width: fit-content;
    padding-right: 63px;
    line-height: 1;
}
p.optionaltext {
    font-weight: bold;
    margin: 13px 0 0;
}
.etiquet-price {
    position: absolute;
    background: #d3f1fb;
    width: fit-content;
    padding: 8px;
    border-radius: 5px 0 0 5px;
    right: -34px;
    bottom: 8px;
}

.etiquet-price div {
    position: absolute;
    bottom: -23px;
    right: 0px;
    width: 0;
    height: 0;
    border-top: 13px solid #acd2df;
    border-bottom: 10px solid transparent;
    border-right: 13px solid transparent;
    z-index: -6;
}
/*-----------------------------------------------------*/
.info-box-pwd.moreAudio {
    background: #b8fbec;
    text-align: left;
    border-radius: 0px 18px 18px 18px;
    padding: 15px;
    font-weight: bold;
}
.info-box-pwd.moreCtr {
    background: #b8fbec;
    text-align: left;
    border-radius: 0px 18px 18px 18px;
    padding: 15px;
    font-weight: bold;
}
.animate-charcter {
    text-transform: uppercase;
    background-image: linear-gradient( -225deg, #0eb67a 0%, #60c4b2 29%, #309dd0 67%, #2ab8d9 100% );
    background-size: auto auto;
    background-clip: border-box;
    background-size: 200% auto;
    color: #fff;
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: textclip 2s linear infinite;
    display: inline-block;
    font-size: 21px !important;
    font-weight: bold !important;
    line-height: 1 !important;
    margin: 9px 0 0 !important;
}
@keyframes textclip {
    to {
        background-position: 200% center;
    }
}
input.button-minus , input.button-plus  {
    background: #afdeed !important;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    line-height: 0;
    border-color: #afdeed !important;
    border-radius: 23px;
}
input.button-minus:hover , input.button-plus:hover  {
   background: #3295ce !important;
   color:#fff !important;
    border-color: #3295ce !important;

}
input.button-minusMonth , input.button-plusMonth  {
    background: #afdeed !important;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    line-height: 0;
    border-color: #afdeed !important;
    border-radius: 23px;
}
input.button-minusMonth:hover , input.button-plusMonth:hover  {
   background: #3295ce !important;
   color:#fff !important;
    border-color: #3295ce !important;

}
.form-group.number-ins {
    margin-top: 15px;
    border-top: 1px solid #cddadf;
    width: fit-content;
    padding: 10px;
}

/*----------------------------------*/
.valdeSms.badge.bg-success {
    background: #368bc1 !important;
}
.valdeSms.badge.bg-success i {
    font-size: 21px;
    margin-right: 4px;
    line-height: 1;
    -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
    animation: heartbeat 1.5s ease-in-out infinite both;
}

@-webkit-keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    10% {
        -webkit-transform: scale(0.91);
        transform: scale(0.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    17% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    33% {
        -webkit-transform: scale(0.87);
        transform: scale(0.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}
@keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    10% {
        -webkit-transform: scale(0.91);
        transform: scale(0.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    17% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    33% {
        -webkit-transform: scale(0.87);
        transform: scale(0.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

.phone-info {
    display: flex;
    gap: 10px;
}
button.send-sms {
    font-family: inherit;
    font-size: 14px;
    background: #2ab8d9;
    color: white;
    padding: 10px 10px;
    display: flex;
    align-items: center;
    border: none;
    border-radius: 6px;
    overflow: hidden;
    transition: all 0.2s;
    min-width: fit-content;
    height: 35px;
}
button.send-sms span {
    margin-left: 7px;
    transition: all 0.3s ease-in-out;
    display: none;
}

button.send-sms svg {
    display: block;
    transform-origin: center center;
    transition: transform 0.3s ease-in-out;
}

button.send-sms .svg-wrapper {
    animation: fly-1 0.6s ease-in-out infinite alternate;
}
button.send-sms:hover .svg-wrapper {
    animation: none;
}

button.send-sms:hover svg {
    transform: translateX(0em) rotate(45deg) scale(1);
}
button.send-sms:hover span {

    display: block;
}
@keyframes fly-1 {
    from {
        transform: translateY(0.1em);
    }

    to {
        transform: translateY(-0.1em);
    }
}

/*-----------------------------------------------------*/
.form-confirm {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    overflow: hidden;
    padding: 20px;
    background: linear-gradient(to right, #0dab7a, #55d9bb);
    border-radius: 10px;
    box-shadow: 0px 87px 78px -39px rgba(0,0,0,0.4);
    max-width: 320px;
    z-index: 20000000;
    margin: 15% auto 0;
}
.form-confirm .info {
    margin-bottom: 10px;
}

.form-confirm .title {
    color: #fff;
    font-size: 1.5rem;
    line-height: 1.8rem;
    font-weight: 800;
    letter-spacing: -0.025em;
}

.form-confirm .description {
    color: #fff;
    margin-top: 10px;
    font-size: 15px;
}

.form-confirm .inputs {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.form-confirm .inputs input {
    height: 2.5em;
    width: 2.5em;
    outline: none;
    text-align: center;
    font-size: 1.5em;
    color: #fff;
    border-radius: 0.3em;
    border: 1px solid rgba(253, 253, 253, 0.363);
    background-color: rgb(255 255 255 / 0.05);
}

.form-confirm .inputs input:focus {
    border: 1px solid rgb(3 118 83);
}

.form-confirm .resend {
    color: #fff;
    margin-top: 10px;
    font-size: 15px;
    text-align: center;
}

.form-confirm .resend-action {
    text-decoration: none;
    cursor: pointer;
    margin-left: 6px;
    color: rgb(255, 255, 255);
    font-weight: 600;
    text-transform: capitalize;
}
.form-confirm .resend-action:hover {
    text-decoration: underline rgb(3 118 83);
    color: rgb(3 118 83);
}

.form-confirm .validate {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    text-decoration: none;
    background-color: #fff;
    padding: 10px 20px;
    margin: 8px 0 0 0;
    font-size: 13px;
    font-weight: 600;
    border-radius: 10px;
    transition: .3s ease;
}

.form-confirm .validate:hover {
    background-color: #037653;
    color: #fff;
}
.form-confirm .close {
    position: absolute;
    right: 10px;
    top: 10px;
    background-color: #11ae7e;
    height: 30px;
    width: 30px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    cursor: pointer;
    font-weight: 600;
    transition: .3s ease;
    border: 0;
    outline: none;
    box-shadow: none;
    color: #fff;
    opacity: 0.7;
}
.form-confirm .close:hover {
   opacity: 1;
}
.modal.show-modal {
    display: block !important;
    z-index: 20000000000;
    opacity: 1;
}
/*----------------------------------------------------*/
.word {
    position: absolute;
    right: 0;
    top: 31%;
    text-align: center;
    font-size: 25px;
    width: 30%;
    color: #8ab8d9;
    font-weight: 700;
    line-height: 1.2;
}
.form-wizard .card-preInscription .alert-warning {

    width: calc(100% - 191px);
}

.form-wizard .wizard-fieldset.show .checkboxContainer:last-child, .form-wizard .wizard-fieldset.show .check-item-wrapper .check-items:last-child {
    padding-top: 8px;
    column-span: all;
    gap: 0;
}
fieldset#step6 .checkboxContainer:last-child {
    display: block;
}
fieldset#step6 .containerColumn2 .checkboxContainer:last-child  {
    column-span: inherit;
    padding: 0;
}
/* .form-wizard .card-preInscription .alert.alert-success {
    position: absolute;
    right: 5%;
    width: 40%;
    text-align: center;
    top: 33%;
    border: 2px dashed #04be96;
    padding: 0 30px;
    background-color: #ebf9f5;
} */
fieldset#step1 img.PIimage {
    top: 4%;
    right: -30px;
}
.form-wizard .card-preInscription .alert.alert-success {
    position: absolute;
    right: 19%;
    width: 28%;
    text-align: center;
    top: 3%;
    border: 0;
    padding: 0 10px;
    background-color: #d7f2eb;
    border-radius: 0;
}
.form-wizard .card-preInscription .alert.alert-success:after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    bottom: 39%;
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
    background: #d7f2eb;
    transform: rotate(88deg);
    right: -12px;
}
.form-wizard .card-preInscription .alert.alert-success .alert-heading {
    font-weight: 600;
    font-size: 14px;
    line-height: 1.3;
}
.form-wizard .card-preInscription .alert.alert-success hr:not([size]) {
    height: 2px;
    margin: 0 30px 10px;
}
.form-wizard .card-preInscription .alert.alert-success p {
    font-weight: 600;
    font-size: 13px;
    line-height: 1.3;
}
.form-wizard .wizard-fieldset.show .checkboxContainer:last-child >div {
    grid-template-columns: 15px 60px auto;
    height: 30px;
    margin-bottom: 3px;
    align-items: center;
}
.form-wizard .wizard-fieldset.show .checkboxContainer:last-child input {
    max-width: 100%;
}
.pricing-switcher {
    text-align: center;
}
.btn-diplome {
    cursor: pointer;
}
.btn-diplome .fakeLabelFile {
   transition: all .4s ease;
}
.btn-diplome .label_checkbox {
    transition: all .4s ease;
}
.btn-diplome:hover .label_checkbox {
    color: #2ab8d9;
}
.btn-diplome:hover .fakeLabelFile {
    transform: scale(1.2);
}

.pricing-switcher .fieldset {
    display: inline-block;
    position: relative;
    padding: 2px;
    border-radius: 50em;
    border: 2px solid #64dcc1;
    width: 100%;
    max-width: 250px;
    background: #64dcc1;
    margin: 0;
}


.pricing-switcher input[type="radio"] {
    position: absolute;
    opacity: 0;
}

.pricing-switcher label {
    position: relative;
    z-index: 1;
    display: inline-block;
    float: left;
    height: 40px;
    line-height: 40px;
    cursor: pointer;
    font-size: 1.4rem;
    color: #fff;
    width: 110px;
}

.pricing-switcher input[type=radio]:checked + label {
    height: 40px;
    width: 130px;
    background-color: #338ccb;
    border-radius: 50em;
    -webkit-transition: -webkit-transform 0.5s;
    -moz-transition: -moz-transform 0.5s;
    color: #fff;
}
.lunshing-offer .tarif.mens .prix {
 
    display: block;
}

span.big-discount {
    font-size: 31px;
    color: #04be96;
}
.tarif.mens {
    display: block;
    margin: 0;
}
.lunshing-offer .tarif-anuelle .prix {
 
    display: block;
}
.lunshing-offer h3 {
    color: #1969a1;
    font-size: 19px;
    font-weight: 600;
    line-height: 0;
}
/*.prix {
 
    display: none;
}*/
span.remise {
    position: absolute;
    top: -34px;
    background: red;
    font-size: 13px;
    border-radius: 50%;
    width: 59px;
    height: 59px;
    padding: 7px;
    clip-path: polygon(50% 0%, 69% 28%, 98% 35%, 74% 57%, 79% 91%, 50% 67%, 21% 91%, 28% 56%, 2% 35%, 34% 26%);
    color: yellow;
    -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
    animation: heartbeat 1.5s ease-in-out infinite both;
}
/**
 * ----------------------------------------
 * animation heartbeat
 * ----------------------------------------
 */
 @-webkit-keyframes heartbeat {
    from {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-transform-origin: center center;
              transform-origin: center center;
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    10% {
      -webkit-transform: scale(0.91);
              transform: scale(0.91);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    17% {
      -webkit-transform: scale(0.98);
              transform: scale(0.98);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    33% {
      -webkit-transform: scale(0.87);
              transform: scale(0.87);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    45% {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
  }
  @keyframes heartbeat {
    from {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-transform-origin: center center;
              transform-origin: center center;
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    10% {
      -webkit-transform: scale(0.91);
              transform: scale(0.91);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    17% {
      -webkit-transform: scale(0.98);
              transform: scale(0.98);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    33% {
      -webkit-transform: scale(0.87);
              transform: scale(0.87);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    45% {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
  }
  
.prixTemp {
 
    display: none;
}
.lunshing-offer .path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: dash 3s linear infinite ; /* Changed animation-iteration-count to 'infinite' */
    animation-delay: 1s;
  }
  
  @keyframes dash {
    to {
      stroke-dashoffset: 0;
    }
  }
  
  .dashed {
    stroke-dasharray: 5, 12;
  }
  
  #arrow {
    animation: arrow 1.6s linear infinite; /* Changed animation-iteration-count to 'infinite' */
    opacity: 0;
   
  }
  
  @keyframes arrow {
    to {
      opacity: 1;
    }
  }
  .tarif-anuelle p.prix {
    line-height: 29px;
}
/*----------------------------------------------------*/
.form-wizard .card-preInscription .button.btn-vert {
    position: relative;
    width: 68px;
    height: 30px;
    cursor: pointer;
    display: flex;
    align-items: center;
    border: 0;
    background-color: #04be96;
    padding: 0;
    border-radius: 0;
    margin-right: 21px;
}
.form-wizard .card-preInscription .button.btn-vert, .form-wizard .card-preInscription .button__icon, .form-wizard .card-preInscription .button__text {
    transition: all 0.3s;
}

.form-wizard .card-preInscription .button.btn-vert .button__text {
    transform: translateX(10px);
    color: #fff;
    font-weight: 600;
}
.form-wizard .card-preInscription .button.btn-vert .button__icon {
    position: absolute;
    height: 100%;
    background-color: #04be96;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    transform: translateX(0);
}

.form-wizard .card-preInscription .button.button.btn-vert .svg {
    width: 30px;
    stroke: #fff;
}

.form-wizard .card-preInscription .button.btn-vert:hover {
    background: #04be96;
}

.form-wizard .card-preInscription .button.btn-vert:hover .button__text {
   // color: transparent;
}

.form-wizard .card-preInscription .button.btn-vert:hover .button__icon {
    transform: translateX(56px);
    width: 39px;
}

.form-wizard .card-preInscription .button.btn-vert:active .button__icon {
    background-color: #04be96;
}

.form-wizard .card-preInscription .button.btn-vert:active {
    border: 1px solid #04be96;
}
.metrorow , #row , .item{
    display: flex;
    justify-content: space-between;
    padding: 0 0 13px;
    border-bottom: 1px solid #ddd;
    margin: 0 0 15px;
}
.inputFerme {
    padding: 2px 5px;
    border-radius: 5px !important;
    font-size: 16px;
    border: 1px solid #70707098 !important;
    font-weight: 500;
    color: #232323;
}
.form-wizard .card-preInscription select.inputFerme {
    background: transparent;
    width: 190px;
    border: 1px solid #70707098 !important;
    outline: 0;
    border-radius: 5px !important;
    padding: 4px 5px;
}
.form-wizard .card-preInscription select.inputFerme  option {
    background-color: #ffffff; /* sets background color */
    color: #808080; /* sets font color */
    padding: 8px; /* sets padding */
}

.form-wizard .card-preInscription select.inputFerme  option:hover {
    background-color: #2ab8d9; /* sets background color on hover */
    color:#fff;
}

.form-wizard .card-preInscription select.inputFerme  option:checked {
    background-color: #2ab8d9; /* sets background color when selected */
    color: #ffffff; /* sets font color when selected */
}
.form-wizard .card-preInscription .btn-rouge {
    color: transparent;
    width: 30px;
    height: 30px;
    background: #dd6363;
    font-size: 0;
    line-height: 0;
    position: relative;
}
.form-wizard .card-preInscription .btn-rouge:hover {
  
    background: #fff;
    border-color: #dd6363;
  
}
.form-wizard .card-preInscription .btn-rouge:before {
    content: "\f2ed";
    font-family: 'Font Awesome 5 Pro';
    font-size: 15px;
    color: #fff;
    text-align: center;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    right: 0;
}
.form-wizard .card-preInscription .btn-rouge:hover:before {
    color: #dd6363;
}
/*----------------------------------------------------*/
.form-wizard .form-wizard-header {
    text-align: center;
}
.form-wizard .form-wizard-next-btn, .form-wizard .form-wizard-previous-btn, .form-wizard .form-wizard-submit {
    min-width: 120px;
    padding: 10px;
    text-align: center;
    text-decoration: none;
    color: #fff;
}
.form-wizard .form-wizard-next-btn:hover, .form-wizard .form-wizard-previous-btn:hover, .form-wizard .form-wizard-submit:hover {
    color: #04BE96 !important;

    text-decoration: none;
}
.form-wizard .wizard-fieldset {
    display: none;
}
.form-wizard .wizard-fieldset.show {
    display: block;
}

.form-wizard .form-wizard-previous-btn {
    background-color: #9f9494;
    color: #fff !important;
    border-radius: 10px;
    font-weight: 600;
    border: 2px solid #fff;
}
.form-wizard .form-wizard-previous-btn:hover {
    background: #2ab8d9;
    color: #fff !important;
    opacity: 0.6;
}
.form-wizard .form-control {
    font-weight: 600;
    height: 41px !important;
    padding: 15px;
    color: #232323;
    background-color: transparent;
    outline: 0;
    border: 1px solid #70707098 !important;
    border-radius: 5px !important;
}
.form-wizard .form-control:focus {
    box-shadow: none;
}
.form-wizard .form-group.buttons {
    position: relative;
    margin: 25px 0 0;
    display: flex;
    justify-content: space-between;
    bottom: 0;
    right: 0;
}
.form-wizard .wizard-form-error {
    display: none;
}
.alert-dismissible .close {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0.75rem 1.25rem;
    color: inherit;
    background: no-repeat;
    border: 0;
    font-size: 36px;
    background: none;
    border: 0;
    outline: 0;
}

.form-wizard .form-wizard-steps {
    margin: 30px 0;
}
.form-wizard .form-wizard-steps li {
    width: 14%;
    float: left;
    position: relative;
}
.form-wizard .form-wizard-steps li::after {
    background-color: #f3f3f3;
    content: "";
    height: 5px;
    left: 0;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    border-bottom: 1px solid #dddddd;
    border-top: 1px solid #dddddd;
}
.form-wizard .form-wizard-steps li span {
    background-color: #dddddd;
    border-radius: 50%;
    display: inline-block;
    height: 40px;
    line-height: 40px;
    position: relative;
    text-align: center;
    width: 40px;
    z-index: 1;
}
.form-wizard .form-wizard-steps li:last-child::after {
    width: 50%;
}
.form-wizard .form-wizard-steps li.active span, .form-wizard .form-wizard-steps li.activated span {
    background-color: #2ab8d9;
    color: #ffffff !important;
}
.form-wizard .form-wizard-steps li.active::after, .form-wizard .form-wizard-steps li.activated::after {
    background-color: #2ab8d9;
    left: 50%;
    width: 50%;
    border-color: #2ab8d9;
}
.form-wizard .form-wizard-steps li.active {
    background: none;
    font-weight: 400;
    border: 0;
}
.form-wizard .form-wizard-steps li.activated::after {
    width: 100%;
    border-color: #2ab8d9;
}
.form-wizard .form-wizard-steps li:last-child::after {
    left: 0;
}
div#firstForfait .input-group {

    transform: scale(0.75);
}

/*-------------------------------------------------------*/
.fieldset-wrapper {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-gap: 35px;
}
.fieldset-wrapper .pIn {
    text-align: left;
    font-size: 11.8px;
    font-weight: 600;
    line-height: 30px;
    margin-top: 6px;
}
.fieldset-wrapper .PIimage {
    width: 250px;
    position: relative;
    right: -50px;
    top: 0;
    align-self: end;
    display: none !important;
}
.fieldset-wrapper .Iimage {
    width: 160px;
    position: absolute;
    right: 9px;
    top: 9px;
    float: revert;
    align-self: end;
}
.fieldset-wrapper .titrePhase {
    margin-top: 0;
    margin-bottom: 0;
    line-height: 30px;
}
.fieldset-wrapper .subtitle, .fieldset-wrapper .entete {

    margin: 0 0 6px;
}
/*----------------------------------------------------*/
.r-tabs .r-tabs-nav {
    margin: 0;
    padding: 0;
  }
  
  .r-tabs .r-tabs-tab {
    display: inline-block;
    margin: 0;
    list-style: none;
  }
  
  .r-tabs .r-tabs-panel {
    padding: 15px;
    display: none;
  }
  
  .r-tabs .r-tabs-accordion-title {
    display: none;
  }
  
  .r-tabs .r-tabs-panel.r-tabs-state-active {
    display: block;
  }
  
  /* <a href="https://www.jqueryscript.net/accordion/">Accordion</a> responsive breakpoint */
  @media only screen and (max-width: 768px) {
    .r-tabs .r-tabs-nav {
        display: none;
    }
  
    .r-tabs .r-tabs-accordion-title {
        display: block;
    }
  }


.tab_section_mobile {
  display: none;
}
#firstSection{
    margin-top:0px;
}
section{
    margin-top:0px;
}

.home_title {
    font-family: 'Dosis';
    font-weight: 700;
    font-size: 30px;
    line-height: 35px;
    text-align: left;
    white-space: pre-line;
    margin: 3px 0px 8px;
}

.subtitle, .entete {
    font-family: 'Dosis';
    text-align: left;
    font-size: 18px;
    font-weight: 700;
    line-height: 14px;
    white-space: pre-line;
    margin: 5px 0;
}

.card {
    background-color: #FCFCFC;
    border: 1px solid #D6D6D6;
    box-shadow: 3px 3px 6px #00000029;
    text-align: left;
    border-radius: 8px;
    padding: 15px 20px;
    position: relative;
}
.card-preInscription{
    max-width:1000px;
    margin-bottom:30px;
}
.fieldset-wrapper .parrainageDescription {

    display: none;
}
.fieldset-wrapper .tarif {
    display: flex;
    align-items: center;
    column-gap: 0px;
    margin-top: 9px;
    flex-wrap: wrap;
}
.fieldset-wrapper .tarif p.pIn {
    display: none;
}
.fieldset-wrapper  .panierOffer {
    display: grid;
    grid-template-columns: auto auto;
    grid-gap: 9px;
}
.PIimage{
    width:250px;
    position:absolute;
    right: 20px;
    top:20px;
}

.pIn {
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    line-height: 30px;
    margin-top: 10px;
}

.inputFermeH{
    padding:8px;
    border-radius:5px !important;
    font-size:20px;
    border:1px solid #70707098 !important;
    font-weight: 600;
    color:#232323;
}

.inputFerme{
    padding:2px 5px;
    border-radius:5px !important;
    font-size:16px;
    border:1px solid #70707098 !important;
    font-weight: 500;
    color:#232323;
}

input#nbAudio {
    border-color: #afdeed;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    margin: 0;
    padding: 0;
}
input::placeholder{
    color:#808080;
    font-size:20px;
    font-weight: 600;
}

.inputFerme::placeholder{
    color:#808080;
    font-size:16px;
    font-weight: 500;
}

.parrainageController {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 10px;
    flex-wrap: wrap;
}

.parrainageDescription{
    color:#000000;
    white-space: pre-line;
    line-height: 1;
    font-size:15px;
    margin:0;

}

.prix {
    color: var(--couleur-bleu-principale);
    font-weight: 600;
    font-size: 30px;
    margin: 0;
}

.prix sub{
    font-size:20px;
}

.tarif{
    display: flex;
    align-items: center;
    column-gap: 20px;
    margin-top: 20px;
    flex-wrap: wrap;
}

.Iimage{
    width: 245px;
        position: absolute;
        right: 150px;
        top: 25px;
}

.titrePhase{
    font-size:30px;
    text-decoration: underline;
    text-decoration-color: var(--couleur-vert-principale);
    font-weight: 600;
    margin-top:40px;
    margin-bottom: 30px;
    line-height: 35px;
}

.sousTitrePhase {
    font-size: 20px;
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 30px;
    line-height: 30px;
}
.multiCenter {
    display: flex;
    align-items: center;
    position: relative;
}
.multiCenter .inputFerme {
    margin-left: 11px;
    margin-right: 6px;
}
.multiCenter p {
    margin: 0;
}

.audioTitre:before{
    display: inline-block;
    position: relative;
    width: 1em;
    height: 1em;
    top: 0.2rem;
    margin-right: 0;
    content: "";
    background-image: url(/assets/img/accueil/tiré.png);
    background-size: contain;
    
}
.r-tabs .r-tabs-panel.r-tabs-state-active .imgremp {
    position: relative;
    float: right;
    margin-top: -90px;
}
.r-tabs .r-tabs-panel.r-tabs-state-active .input-group {
    margin-top: 7px;
}
.audioTitreGrand:before{
    margin-right: 0.4rem; 
}
.btn-red-inverse {
    background: #dd6363;
    color: #fff;
}
.btn-red-inverse:hover, .btn-red-inverse:focus {
    background: #df4747;
    color: #fff;
}
.multiCenter .alert , .multiCenter .alert.alert-success.found{
    position: absolute;
    width: 39% !important;
    top: -39px;
    right: -56px;
    border: 0;
    text-align: left;
    padding: 4px;
    margin: auto;
    left: 0;
}
.checkCivilite{
    display: flex;
    gap: 20px;
}

.label_checkbox {
    color: #808080;
    font-weight: 500;
    font-size: 18px;

  /*  flex-basis: 100%;*/
}
.info-box-pwd i {
    color: #0096cf;
    font-size: 25px;
}
.alert-danger {

    z-index: 3;
}
.buttons-wrapper {
    display: grid;
    grid-template-columns: auto auto;
    grid-gap: 6px;
    margin: 8px 0;
}
.buttons-wrapper .btn {
    font-size: 15px !important;
}
input:checked + .fakeLabel::before {
    content: '\f00c';
    color: #04BE96;
    border-radius: 3px;
}

input + .fakeLabel::before {
    font-family: "Font Awesome 5 Pro";
    content: '\f00c';
    font-size: 1em;
    color: #fff;
    background-color: #fff;
    border: 1px solid #707070 ;
    border-radius: 3px;
}

/*.input-group{*/
    /*gap: 35px;*/
/*}*/
.input-group.nameLastName > div {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: 10px;
    align-items: center;
}

 .input-group{
    margin-top:0px;
}

.input-group:first-child{
    margin-top: 0px; 
}

.borderBottom{
    background-color: transparent;
    border:0;
    border-bottom: 2px solid #DDDDDD;
    font-size:20px;
}
.form-wizard .card-preInscription {
    margin: 0 auto;
    max-width: 100%;
    width: 100%;
}
.form-wizard .sousTitrePhase {
    margin-top: 0;
    margin-bottom: 10px;
}
.containerColumn2 {
    column-count: 2;
}
.form-wizard .addAudioContainer {
    margin-top: 0px;
    margin-bottom: 14px;
}
.form-wizard .titrePhase {
    font-size: 22px;
}

.newbtn {
    cursor: pointer;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
}
.pis {
    display: none;
}

.imgremp {
    width: 90px;
    height: 90px;
    border: 1px solid #DDDDDD;
    border-radius: 8px;
    margin-bottom: 8px;
    position: relative;
    margin-top: 10px;
}
.fa-pen{
border: 1px solid #DDDDDD;
padding: 4px;
border-radius: 50%;
font-size: 13px;
background: #fff;
}

.imgremp label {
     position: relative;
    height: 100%;
    width: 100%;
}

.imgremp img{
    width: 90px;
    height: 90px;
    object-fit: contain;
}

.imgremp button{
    right: 5px;
    top: 5px; 
    position: absolute;
}

#email, .longEmail{
    max-width:400px;
}

#num, #nom, #prenom, #nomCentre, #siteCentre, .longName{
    max-width: 300px;
}

.nameLastName {
    justify-content: space-between;
    margin: 9px 0 0;
}
.checkboxContainer {
    margin-bottom: 5px;
    display: flex;
    gap: 10px;
    align-items: center;
}
fieldset#step3 .checkboxContainer {
    display: grid;
    grid-template-columns: 0.3fr auto;
}
.info-box-pwd {
    font-weight: 600;
    margin-top: 10px;
    background: #e3f3f7;
    padding: 11px;
    border-radius: 8px;
}
.checkboxContainer >div {
    display: grid;
    grid-template-columns: 15px auto auto;
    grid-gap: 6px;
}
.checkboxContainer input::placeholder, .checkboxContainerFlex input::placeholder , #row input::placeholder ,.item input::placeholder{
    font-size: 15px;
}

.checkboxContainer input, .checkboxContainerFlex input , .tailleFlexInput , #row input  , .item input {
    font-size: 15px;
    padding: 7px 5px;
    width: 230px;
    margin-left: 15px;
    border: 0;
    border-bottom: 1px solid #2ec29e47;
    outline: 0;
}
.checkboxContainer input:focus, .checkboxContainerFlex input:focus , .tailleFlexInput:focus , #row input:focus ,.item input:focus {

    border-bottom: 1px solid #2ab8d9;

}

.containerColumn3{
    column-count: 3;

}
.sousSousTitrePhase {
    font-size: 16px;
    font-weight: 600;
    margin-top: 7px;
}

input + .fakeLabelFile::before{
    font-family: "Font Awesome 5 Pro";
    content: '\f0c6';
    font-size: 1em;
    color: var(--couleur-bleu-principale);
    
}

.checkboxContainerFlex{
    margin-bottom: 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.addExp{
    color:var(--couleur-bleu-principale);
    font-size: 16px;
    font-weight: 600;
    margin-top: 10px;
    cursor: pointer;
}

.r-tabs-nav {
    border-bottom: 2px solid rgb(52 137 202 / 50%);
}

.r-tabs-anchor{
    font-size: 20px;
    color: initial;
    text-decoration: none;
}

.r-tabs .r-tabs-tab {
    padding:0 5px;
}

.r-tabs .r-tabs-nav {
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    row-gap: 5px;
    column-gap: 20px;
}

.r-tabs-state-active a{
    color:var(--couleur-vert-principale);
}

.r-tabs-accordion-title {
    margin: 0;
    border: 1px solid #D6D6D8;
    box-shadow: 0 3px 6px #00000029;
    border-radius: 8px;
    padding: 10px 15px;
}

.addAudioContainer{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 40px; 
    margin-bottom: 30px;
}

#addAudio{
    font-size:18px;
    color:var(--couleur-bleu-principale);
    cursor: pointer;
    font-weight: 500;
}

.prixafter {
    font-size: 14px;
    margin-top: 5px;
}

.prixafter sub{
    font-size:10px;
}

.timePrx {
    font-size: 15px;
    line-height: 28px;
}
.graph__wrapper {
    position: absolute;
    transform: rotate(-229deg);
    right: 17%;
    top: 24%;
}

.flex1 {
    flex: 2;
    text-align: left;
    font-weight: 600;
    font-size: 16px;
}

span.textAcces {
    font-weight: 400;
}

p.textHeaderRecap {
    text-align: left;
    margin-bottom: 0px;
    font-size: 15px;
    font-weight: 600;
}
p.textHeaderRecap.anual {
display: none;
}
#recapModal .modal-dialog {
    max-width: 1000px;
}

#recapModal .modal-body {
    padding: 10px 50px;
    width: 100%;
    max-width: 100%;
}
#recapModal .tarif1years {
    font-size:25px;
}

#recapModal .prix sub {
    font-size: 14px;
}
#recapModal .prix sup {
    font-size: 17px;
}

#recapModal .timePrx {
    font-size: 10px;
}

.sousTitrePhase{
    text-align:left;
}

.medium{
    font-weight: 500;
    flex:1;
}


.recap{
    max-height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
}

.tailleFlexLabel {
    flex: 1;
    max-width: fit-content;
}

.tailleFlexInput{
    flex: 3;
    max-width: 200px;
    text-align: left;
}

.alertErreur{
    color: rgba(199, 0, 0, 0.856);
    font-size: 18px;
    font-weight: 600;
    padding: 10px;
    margin-top:20px;
    text-align: center;
}
.form-wizard .r-tabs-state-active .form-control {
    padding: 4px 15px;

}
.r-tabs-state-active .form-control::placeholder {
    font-size: 14px;
}
@media screen and (max-width: 1366px) {
    .form-wizard .card-preInscription .alert.alert-success {
      
        width: 27%;
    
    }
    .graph__wrapper {
       
        display: none;
    }
  }
  @media screen and (max-width: 1199px) {
    img.logo-forfait {
        
        max-width: 8%;
       
      }
      
    .fieldset-wrapper {
  
        grid-template-columns: 100%;
        grid-gap: 35px;
      }
    .form-wizard .card-preInscription .alert.alert-success {
      
        display: none;
    }
   
  }
@media screen and (max-width: 870px) {
    .containerColumn2 {
        column-count: 1;
      }
    fieldset#step1 img.PIimage {
      
        display: none !important;
    }
    .form-wizard .card-preInscription .alert-warning {
        width: 100%;
      }
    .containerColumn3 {
    column-count:2;
    }
  }

  @media only screen and (max-width: 767px){
    .inputFerme {
       
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 0 22px;
        height: 37px;
      }
    .flex1 {
        flex: 100%;
        text-align: left;
        font-weight: 600;
        font-size: 16px;
      }
      .parrainageDescription {
       
        margin: 10px 0;
      }
    img.logo-forfait {
        max-width: 8%;
        display: none;
      }
    .metrorow, #row, .item {
        display: block;
        justify-content: space-between;
        padding: 0 0 13px;
        border-bottom: 1px solid #ddd;
        margin: 0 0 15px;
      }
      .form-wizard .card-preInscription select.inputFerme {
        width: 100%;
        margin-bottom: 10px;
      }
      .busrow , .tramrow , .rerrow , .parking_publicrow , .parking_priverow , .autrerow{
        display: flex !important;
      }
      .input-group > .form-control, .input-group > .form-select {
        position: relative;
        flex: 100%;
        width: 100%;
        min-width: 0;
        margin: 0 0 7px;
      }
      .input-group.nameLastName > div {
        display: grid;
        grid-template-columns: 1fr auto;
        grid-gap: 10px;
        align-items: center;
        width: 100%;
        margin: 0 0 17px;
      }
      button.send-sms {
      
        margin-top: -15px;
      }
      .badge {
       
        margin-top: -15px;
      }
      .parrainageController {
        display: block;
        gap: 10px;
        align-items: center;
        margin-top: 10px;
        flex-wrap: wrap;
      }
      .form-wizard .r-tabs-state-active .form-control {
        padding: 4px 15px;
        margin: 0 0 15px;
      }
    #num, #nom, #prenom, #nomCentre, #siteCentre, .longName , .specialrow{
        max-width: 100%;
      }
    .lunshing-offer .tarif-anuelle .prix {
        display: block;
        margin-top: -15px;
      }
    .r-tabs .r-tabs-nav {
        display: none;
    }
    .form-group.number-ins {
      
        width: 100%;
      
    }
    .lunshing-offer .d-flex {
        display: block !important;
    }
    .pIn {
        text-align: left;
        font-size: 17px !important;
    }
    div#firstForfait .input-group {
        transform: scale(0.5);
        display: flex;
        flex-wrap: nowrap;
      }
      .phone-info {
        display: block;
      
        width: 100%;
      }
      .fieldset-wrapper .pIn {
        text-align: center;
        font-size: 12px;
        font-weight: 600;
        line-height: 23px;
        margin-top: 6px;
      }
    .form-group.number-ins .input-group {
      
        display: flex !important;
        flex-wrap: nowrap;
      
      }
      .lunshing-offer h3 {
        line-height: 1;
        margin: 30px 0 50px;
        text-align: center;
      }
  }
  @media screen and (max-width: 630px) {
    .checkbox {
        width: 230px;
       
      }
      .check:checked + .checkbox .slide .toggle {
        width: 118px;
      }
      .check:checked + .checkbox .slide .toggle {
        transform: translateX(94px);
      
      }
      p.small-info::before {
       display: none;
      }
      p.small-info {
       
        text-align: center !important;
       
        padding-left: 15px;
       
      }
    .checkbox .slide .text {
        font-size: 16px;
        font-weight: 700;
        z-index: 100;
        cursor: pointer;
        margin-top: -11px;
      }
    .multiCenter {
        display: block;
        align-items: center;
        position: relative;
      }
      .multiCenter .inputFerme {
        margin-left: 0;
        margin-right: 0;
      }
      #checkAudio1 {
        margin-top: -13px !important;
      }
    .btn-diplome {
        cursor: pointer;
        margin-top: 15px;
      }
    
    .subtitle, .entete {
    
        text-align: center;
      
      }
      .form-wizard .card-preInscription .alert-warning {
        width: 100%;
        display: block !important;
        text-align: center;
      }
    .containerColumn3 {
    column-count:1;
    }
    .pricing-switcher .fieldset {
       
        max-width: 240px;
    
      }
    .pricing-switcher input[type="radio"]:checked + label {
       
        width: 120px;
    
      }
      .pricing-switcher label {
   
        font-size: 1.1rem;
    
      }
      .form-group.number-ins .d-flex {
        display: block !important;
      }
      .form-group.number-ins .pIn {
        text-align: center;
        font-size: 17px !important;
      }
      .d-flex {
        display: block !important;
      }
  }
  @media screen and (max-width: 480px) { 
    .input-group.nameLastName > div {
        display: grid;
        grid-template-columns: 100%;
        grid-gap: 10px;
        align-items: center;
        width: 100%;
        margin: 0 0 17px;
      }
  }

  @media screen and (max-width: 630px) {
    .card {
    padding:20px;
    }

    .pIn {
        text-align: left;
        font-size: 17px !important;
    }

    .prix {
        font-size: 25px;
    }
    .prix sub {
        font-size: 15px;
    }
    .prixafter {
        font-size: 13px;
    }
    .prixafter sub {
        font-size: 11px;
    }
    .timePrx {
        font-size: 12px;
    }

    .titrePhase {
        font-size: 22px;
        line-height: 1;
    }
    .sousTitrePhase {
        font-size: 20px;
        line-height: 1;
    }
    .label_checkbox {
        
        font-size: 16px;
    }

    input::placeholder{
        font-size:16px;
        font-weight: 500;
    }
    input{
        font-size:16px;
        font-weight: 500;
    }
  }
  .active{
    color: #fff;
    border-color: var(--couleur-vert-principale);
    background-color: var(--couleur-vert-principale);
    border: 2px solid;
    border-radius: 10px;
    font-weight: 600;
}
.offerDiscount {
    font-weight: bold;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    margin-top: 0;
}
.errorWizard{
    box-shadow: 0 0 5px #CC0000;

}
.successWizard{
    box-shadow: 0 0 4px #01b911;

}

.StripeElement {
    box-sizing: border-box;
    height: 43px;
    width: 144%;
    margin-left: -52px;
    padding: 10px 12px;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: white;
    box-shadow: 0 1px 3px 0 #e6ebf1;
    -webkit-transition: box-shadow 150ms ease;
    transition: box-shadow 150ms ease;
}

.StripeElement--focus {
    box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
    border-color: #0A9B01;
}

.StripeElement--webkit-autofill {
    background-color: #fefde5 !important;
}
.checkboxContainer input, .checkboxContainerFlex input, .tailleFlexInput, #row input, .item input {
    font-size: 15px;
    padding: 7px 10px;
    width: 230px;
    margin-left: 15px;
    border: 1px solid #70707098 !important;
    outline: 0;
    height: 30px;
    background: transparent;
    border-radius: 5px;
}
.resendMessage{
    color:white;
}
input,
textarea {
  border: 1px solid #eeeeee;
  box-sizing: border-box;
  margin: 0;
  outline: none;
  padding: 10px;
}

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

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.input-group {
    clear: both;
    margin: 10px 0;
    position: relative;
}

.input-group input[type='button'] {
  background-color: #eeeeee;
  min-width: 38px;
  width: auto;
  transition: all 300ms ease;
}

.input-group .button-minus,
.input-group .button-plus {
  font-weight: bold;
  height: 38px;
  padding: 0;
  width: 38px;
  position: relative;
}

.input-group .button-minusMonth,
.input-group .button-plusMonth {
  font-weight: bold;
  height: 38px;
  padding: 0;
  width: 38px;
  position: relative;
}


.input-group .quantity-field {
  position: relative;
  height: 38px;
  left: -6px;
  text-align: center;
  width: 62px;
  display: inline-block;
  font-size: 13px;
  margin: 0 0 5px;
  resize: vertical;
}

.input-group .quantity-fieldMonth {
    position: relative;
    height: 38px;
   /* left: -6px;*/
    text-align: center;
    width: 62px;
    display: inline-block;
    font-size: 13px;
    margin: 0 0 5px;
    resize: vertical;
  }

.button-plus {
  left: -13px;
}

input[type="number"] {
  -moz-appearance: textfield;
  -webkit-appearance: none;
}

.menu-checkbox:checked + .menu {
    z-index: 99;
}

@media(max-width:640px){
	.logo-wrapper {
    width: 100%;
    margin-top: 25px;
	}

	.logo-wrapper img {
		width: 70px;
		height: auto;
	}

	.logo-wrapper h2 {
		font-size: 22px;
	}

	.infboxstep {
		position: relative;
		width: 100%;
		top: 0;
		left: 0;
		right: 0;
		margin: 25px auto;
		bottom: 0;
		max-width: 100%;
		height: auto;
	}
}