@font-face {
    font-family: 'vyv';
    font-weight: normal;
    src: url('../fonts/WigrumRegular.eot');
    src: url('../fonts/WigrumRegular.eot') format('embedded-opentype'),
    url('../fonts/WigrumRegular.woff2') format('woff2'),
    url('../fonts/WigrumRegular.woff') format('woff'),
    url('../fonts/WigrumRegular.ttf') format('truetype');

}

@font-face {
    font-family: 'vyv';
    font-weight: bold;
    src: url('../fonts/WigrumBold.eot');
    src: url('../fonts/WigrumBold.eot') format('embedded-opentype'),
    url('../fonts/WigrumBold.woff2') format('woff2'),
    url('../fonts/WigrumBold.woff') format('woff'),
    url('../fonts/WigrumBold.ttf') format('truetype');
}

@font-face {
    font-family: 'montserrat';
    font-weight: normal;
    src: url('../fonts/Montserrat-VariableFont_wght.otf');
    src: url('../fonts/Montserrat-VariableFont_wght.otf') format('embedded-opentype'),
    url('../fonts/Montserrat-VariableFont_wght.woff2') format('woff2'),
    url('../fonts/Montserrat-VariableFont_wght.woff') format('woff'),
    url('../fonts/Montserrat-VariableFont_wght.ttf') format('truetype');
}

html, body {
    font-family: 'montserrat', Helvetica, sans-serif;
    line-height: 1.6;
    font-size: 15px;
    /*color: var(--yvon-violet-color);*/
    font-weight: 400;
    overflow-x: hidden;
    background-color: #f1f1f1;
    /*background-color: #999999;*/
    --yvon-violet-color: #482683;
    --yvon-jaune-color: #feda46;
    --yvon-bleu-color: #2CBFDC;
    --yvon-error-color: #FF0000;
}

::selection {
    background: var(--yvon-bleu-color);
    color: #FFFFFF;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-family: 'vyv', Helvetica, sans-serif;
    /*font-weight: 700;*/
}

h1, .h1 {
    font-size: 1.5rem;
    font-weight: bold;
    color: var(--yvon-violet-color);
}

h2, .h2 {
    font-size: 1rem;
    font-weight: bold;
    color: var(--yvon-violet-color);
}

h3, .h3 {
    font-size: 17px;
    /*font-weight: bold;*/
}

h4, .h4 {
    font-size: 1.5rem;
    line-height: 20px;
    font-weight: bold;
    color: var(--yvon-violet-color);
}

h5, .h5 {
    font-size: 1rem;
    font-weight: normal;
}

img {
    max-width: 100%;
}

.text-bold {
    font-weight: bold;
}

.text-center {
    text-align: center
}

input {
    font-family: Helvetica, sans-serif;
}

ol, ul {
    padding-left: 2.5rem;
}

a {
    text-decoration: none;
}

hr {
    margin: 0;
}

small {
    font-size: 10px;
}


.row {
    padding: 0;
}

hr {
    border-top: 1px solid var(--yvon-violet-color);
}

.alert-danger {
    width: 100%;
    /*background-color: var(--yvon-jaune-color);*/
    background-color: #f6f5f5;
    color: var(--yvon-violet-color);
    border: 3px solid #eb5f79;
    padding: 5px;
    margin-bottom: 30px;
    text-align: center;
}

.form-floating > .form-select,
.form-floating > .form-control, .form-floating > .form-control-plaintext,
.form-floating > .form-control-plaintext:focus, .form-floating > .form-control-plaintext:not(:placeholder-shown), .form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown) {
    padding-top: 1.1rem;
    padding-bottom: 0;
    height: calc(2.7rem + 1.5px);
    line-height: normal;
}

.form-floating > label {
    right: 0;
    padding-top: 0.6rem;
    padding-bottom: 0;
    height: auto;
}

.form-floating > .picker__input--active ~ label,
.form-floating > .form-control-plaintext ~ label,
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-select ~ label {
    transform: translateY(-.5rem);
    font-size: 0.85rem;
}

.form-floating > .form-control-plaintext ~ label::after, .form-floating > .form-control:focus ~ label::after, .form-floating > .form-control:not(:placeholder-shown) ~ label::after, .form-floating > .form-select ~ label::after {
    background: none;
    border-radius: 0;
}

.required {
    border: 2px solid var(--yvon-bleu-color);
}
.required.error,
.required.error:focus,
.required.error:hover{
    border-color: var(--yvon-error-color);
    box-shadow: none;
}

input.champErreur,
select.champErreur {
    border-color: var(--yvon-error-color) !important;
    box-shadow: 0 0 0 0.1rem var(--yvon-error-color) !important;
}

/************************ PARTIE HEADER ************************/


.header-top-bar {
    /*height: 90px;*/
    background-color: #FFFFFF;
    font-size: 14px;
    padding: 10px 0px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    color: var(--yvon-violet-color);
}

.top-bar-info {
    /*padding-left: 90px;*/
}

.top-right-bar {
    /*padding-right: 90px;*/
}

.logo_yvon {
    max-width: 120px;
}

.header-progress-bar {
    /*height: 90px;*/
    background-color: #e5e5e5;
}


.md-stepper-horizontal {
    display: table;
    width: 40%;
    margin: auto;
}

.md-stepper-horizontal .md-step {
    display: table-cell;
    position: relative;
    padding: 24px;
    width: 200px;
}


.md-stepper-horizontal .md-step:first-child .md-step-bar-left,
.md-stepper-horizontal .md-step:last-child .md-step-bar-right {
    display: none;
}

.md-stepper-horizontal .md-step .md-step-circle {
    width: 30px;
    height: 30px;
    margin: 0 auto;
    /*background-color: #999999;*/
    background-color: white;
    border-radius: 50%;
    text-align: center;
    line-height: 31px;
    font-size: 16px;
    font-weight: 600;
    color: var(--yvon-violet-color);
}

.md-stepper-horizontal.violet .md-step.active .md-step-circle {
    background-color: var(--yvon-jaune-color);
}

.md-stepper-horizontal .md-step .md-step-title {
    text-align: center;

    line-height: 1.2rem;
    color: var(--yvon-violet-color);
}

.md-stepper-horizontal .md-step.active .md-step-title {
    font-weight: 600;
    color: var(--yvon-violet-color);
}

.md-stepper-horizontal .md-step.active.done .md-step-title,
.md-stepper-horizontal .md-step.active.editable .md-step-title {
    font-weight: 600;
}

.md-stepper-horizontal .md-step .md-step-bar-left,
.md-stepper-horizontal .md-step .md-step-bar-right {
    position: absolute;
    top: 39px;
    height: 1px;
    border-top: 1px solid #4826833b;
}

.md-stepper-horizontal .md-step .md-step-bar-right {
    right: 0;
    left: 50%;
    margin-left: 20px;
}

.md-stepper-horizontal .md-step .md-step-bar-left {
    left: 0;
    right: 50%;
    margin-right: 20px;
}


/************************ FIN PARTIE HEADER ************************/

.contentSite {
    background: #FFFFFF;
    border-radius: 15px;
    margin: auto;
}

.contentSiteXLarge {
    max-width: 1200px;
}

.contentSiteLarge {
    max-width: 1000px;
}

.contentSiteSmall {
    max-width: 800px;
}

.contentSiteXSmall {
    max-width: 600px;
}


.tarif {
    font-size: 1.3rem;
    color: var(--yvon-violet-color);
}

.tarif span {
    font-size: 2.25rem;
    line-height: 2rem;
    font-weight: bold;
}

.blocRecap .tarif span {
    font-size: 1.6rem;
}

.slider-item h4 {
    color: var(--yvon-violet-color);
}

.btnValider {
    display: inline-block;
    color: var(--yvon-violet-color);
    background-color: var(--yvon-jaune-color);
    border-color: transparent;
    /*box-shadow: 0px 5px 0px 0px var(--yvon-bleu-color);*/
    box-shadow: unset;
    padding: 5px 20px 5px 20px;
    margin-top: 10px;
    border-radius: 5px;
    font-family: "Roboto", sans-serif;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    font-weight: bold;
    transition: 0.3s;
}

.btnValider:hover {
    background-color: var(--yvon-violet-color);
    color: var(--yvon-jaune-color);
    cursor: pointer;
}


.slider-item p {
    font-size: 14px;
}

.btn_age {
    /*width: 20%;*/
    margin: auto;
}

.qst div {
    text-align: center;
}

.inputRadioButton {
    display: inline-block;
    text-align: center;
}

.inputRadioButton input {
    display: none;
}

.inputRadioButton label {
    background-color: var(--yvon-jaune-color);
    border-radius: 5px;
    /*float: left;*/
    border-color: transparent;
    box-shadow: unset;
    font-weight: bold;
    transition: 0.3s;
    padding: 6px 20px;
    margin-top: 5px;
    font-size: 16px;
    transition: 0.3s;
    background: none;
    /*border: solid 2px var(--yvon-violet-color);*/
    border: solid 2px var(--yvon-bleu-color);
    color: var(--yvon-bleu-color);
}

.inputRadioButton label:hover,
.inputRadioButton input:focus + label,
.inputRadioButton input:checked + label {
    /*background-color: var(--yvon-violet-color);*/
    /*color: var(--yvon-jaune-color);*/
    background-color: var(--yvon-bleu-color);
    color: #FFFFFF;
    cursor: pointer;
}

.inputRadioButton input.champErreur + label {
    border-color: var(--yvon-error-color) !important;
    box-shadow: 0 0 0 0.1rem var(--yvon-error-color) !important;
}

.inputRadioButton label:hover,
.inputRadioButton input:focus + label {
    opacity: 0.7;
}

.link {
    color: var(--yvon-violet-color);
    transition: 0.2s;
}

.link:hover {
    color: var(--yvon-bleu-color);
    text-decoration: underline;
}

.garant {
    display: none;
    padding-top: 17px;
    margin-bottom: 10px;
}

.none {
    display: none;
}

.inline-block {
    display: inline-block;
}

.dateCouverture {
    display: inline-block;
    padding-top: 6px;
}

body .picker__input,
.form-select,
.form-control {
    transition: 400ms;
}

body .picker__input.picker__input--active,
.form-select:hover,
.form-control:hover,
.form-select:focus,
.form-control:focus {
    border-color: var(--yvon-bleu-color);
    outline: 0;
    box-shadow: 0 0 0 0.1rem var(--yvon-bleu-color);
}

.picto-yvon {
    width: 40%;
}

.card-assur-sante {
    display: inline-block;
    padding-top: 20px;
    width: 100%;
}

.tarif-recap-individuel > * {
    display: inline;
}

.form-control {
    /*color: var(--yvon-violet-color);*/
    background: none;
    /*border-color: var(--yvon-violet-color);*/
    padding: 9px 20px 8px 20px;
    margin-top: 10px;
    border-radius: 3px;
    box-shadow: unset;
}

.row-login-inscription {
    text-align: center;
}

/*
.btnMail {
    width: 140px !important;
}

.btnLogin {
    width: 100px !important;
}

.btnCreation {
    width: 150px !important;
}*/

.mdpOublie {
    color: var(--yvon-violet-color);
}

.mdpOublie:hover {
    color: var(--yvon-bleu-color);
    text-decoration: underline;
}

.section-internationnal {
    text-align: center;
}

/*
.recalculerOptionInter {
    width: 200px !important;
}*/

.typeChambre label {
    height: 100%;
    line-height: 1.2rem;
    display: block;
}


.progress {
    height: 80px;
    text-align: center;
    background-color: #f6f5f5;
    padding: 10px 0 10px 0;
    display: block;
}

.progress .circle,
.progress .bar {
    display: inline-block;
    /*background: #fff;*/
    width: 40px;
    height: 40px;
    border-radius: 40px;
    border: 1px solid #d5d5da;
}

.progress .bar {
    position: relative;
    width: 80px;
    height: 6px;
    top: -33px;
    margin-left: -5px;
    margin-right: -5px;
    border-left: none;
    border-right: none;
    border-radius: 0;
}

.progress .circle .label {
    display: inline-block;
    width: 32px;
    height: 32px;
    line-height: 32px;
    border-radius: 32px;
    margin-top: 3px;
    color: #b5b5ba;
    font-size: 17px;
}

.progress .circle .title {
    color: #b5b5ba;
    font-size: 13px;
    line-height: 30px;
    margin-left: -5px;
}

/* Done / Active */
.progress .bar.done,
.progress .circle.done {
    /*background: #eee;*/
}

.progress .bar.active {
    /*background: linear-gradient(to right, #EEE 40%, #FFF 60%);*/
}

.progress .circle.done .label {
    color: #FFF;
    background: var(--yvon-violet-color);
    box-shadow: inset 0 0 2px rgba(0, 0, 0, .2);
}

.progress .circle.done .title {
    color: var(--yvon-violet-color);
}

.progress .circle.active .label {
    color: #FFF;
    background: var(--yvon-bleu-color);
    box-shadow: inset 0 0 2px rgba(0, 0, 0, .2);
}

.progress .circle.active .title {
    color: var(--yvon-violet-color);
}

.alternance {
    padding-top: 15px;
}

.fonctionPubliqueMoulinette {
    padding-top: 17px;
    margin-bottom: 10px;
}

.picto_conseil {
    width: 5%;
}

.recommandation {
    padding-bottom: 25px;
}

.choixFormule {
    text-align: center;
}

input:autofill,
input:autofill:focus,
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px #ECE9F2 inset;
}

.linkDocument {
    line-height: 0.8rem;
    color: var(--yvon-bleu-color);
}

.linkDocument a {
    color: var(--yvon-bleu-color);
    font-size: 0.8rem;
}

.blocInputNumber {
    position: relative;
    max-width: 40%;
    margin: auto;
}

.blocInputNumber > a {
    display: block;
    position: absolute;
    background: var(--yvon-bleu-color);
    color: #FFFFFF;
    top: 5px;
    height: 35px;
    width: 35px;
    border-radius: 100%;
    font-size: 35px;
    line-height: 25px;
}

.blocInputNumber > a:hover,
.blocInputNumber > a:focus {
    opacity: 0.7;
}

.blocInputNumber > a.btnMoins {
    left: 3px;
}

.blocInputNumber > a.btnPlus {
    right: 3px;
}

.blocInputNumber > a::before {
    content: "";
    display: block;
    position: absolute;
    background: #FFFFFF;
    top: 16px;
    left: 7px;
    height: 3px;
    width: 21px;
}

.blocInputNumber > a.btnPlus::after {
    content: "";
    display: block;
    position: absolute;
    background: #FFFFFF;
    top: 7px;
    left: 16px;
    height: 21px;
    width: 3px;
}

.form-floating.blocInputNumber > label {
    padding-left: 45px;
}

.form-floating.blocInputNumber > .form-control {
    padding-left: 45px;
    padding-right: 45px;
}

.small {
    font-size: 0.8rem;
    line-height: 1.2rem;
}

body .picker--focused .picker__day--selected,
body .picker__day--selected,
body .picker__day--selected:hover {
    background: var(--yvon-bleu-color);
}

.blocDestinationInterdite {
    border-radius: 5px;
}

footer.container {
    max-width: 600px;
    /*width: 100%;*/
    /*bottom: 0;*/
}

/* datePicker */
body .picker__frame {
    max-width: 400px;
}

body .picker__header {
    margin-top: 0.35em;
}

body .picker__nav--next,
body .picker__nav--prev {
    top: 0.07em;
    padding: 0.2em 1.05em;
}

body .picker__select--month,
body .picker__select--year {
    height: 1.8em;
    font-size: 1rem;
    border-radius: 5px;
}

body .picker__weekday {
    font-size: 1rem;
}

body .picker__day {
    padding: 0.2em 0;
    font-size: 1rem;
}

body .picker__button--clear,
body .picker__button--close,
body .picker__button--today {
    font-size: 1rem;
    padding: 0.5em 0;
}

.btnArriere {
    color: var(--yvon-bleu-color);
    /*text-decoration: underline var(--yvon-violet-color);*/
}

.btnArriere:hover {
    color: var(--yvon-violet-color);
    text-decoration: underline var(--yvon-violet-color);
}

.form-check-input:checked {
    background-color: var(--yvon-bleu-color);
    border-color: var(--yvon-bleu-color);
}

.btnBlue {
    background-color: transparent;
    border: solid 2px var(--yvon-bleu-color);
    color: var(--yvon-bleu-color);
    transition: 0.3s;
}

.btnBlue:hover {
    background-color: var(--yvon-bleu-color);
    color: var(--yvon-bleu-color);
    color: #FFFFFF;
    cursor: pointer;
}

@media only screen and (min-width: 768px) {
    body .picker--opened .picker__frame {
        top: 30%;
        bottom: auto;
    }
}

@media only screen and (max-width: 768px) {

    .top-bar-info {
        padding-left: 0px;
    }

    .top-right-bar {
        padding-right: 0px;
    }

    .slider-item {
        margin: 130px 0px;
    }

    .btn_age {
        width: auto;
    }

    .card-assur-sante {
        width: 16rem !important;
    }

    .recapitulatif {
        padding-left: 0px;
    }

    .md-stepper-horizontal .md-step .md-step-title {
        display: none;
    }

    .md-stepper-horizontal .md-step {
        padding: 14px;
    }

    .md-stepper-horizontal .md-step .md-step-bar-left,
    .md-stepper-horizontal .md-step .md-step-bar-right {
        top: 30px;
    }

    .picker__select--month,
    .picker__select--year {
        font-size: 1rem;
    }


    .blocInputNumber {
        max-width: 80%;
    }

}