@charset "UTF-8";

/*******************************
couleurs
*******************************/
:root {
    --breadcrumb-color: #616c71;
    --breadcrumb-active-color: #ca9e64;
    --main-color: #ca9e64;
    --green-color: #1abbab;
    --violet-color: #4c5cb0;
    --violet-color-2: #413096;
    --gray-color: #707070;
    --main-button-color: #1abbab;
    --main-button-color-hover: #1abbab;
    --disabled: #d2d1d1;
    --gray-light: #f1f1f1;
    --red-color: #ff0000;
    --bg-green-light: #e4f7f4;
    --bg-gray-light: #e0e1e3;
    --violet-light: #c9c4df;
    --violet-light2: #6958a3;

}

.ulblock {
    margin-top:0px !important;
    margin-bottom:0px !important;
    padding-left:5px !important;
    list-style: none;
}

.txtcolorbreadcrumb {
    color:var(--breadcrumb-color) !important;
}

ul li::before {
    content: "\25A0";
    color: #6958a3;
    margin-right:7px;
}

[data-tooltip]::after {
    white-space: pre;
}

.primaryColor {
    color: var(--main-color);
}

.secondaryColor {
    color: var(--violet-color-2);
}

.green {
    color: var(--green-color) !important;
}
.violet {
    color: var(--violet-color);
}

.gray {
    color: var(--gray-color);
}
.autre_btn_adherent_active{
    background-color: var(--green-color) !important;
    color: #fff !important;
}
.bg-green{
    background-color: var( --green-color) !important;
}
/*******************************
             Bouttons
*******************************/
.primaryBtn {
    background-color: var(--violet-color) !important;
    padding: 20px 40px !important;
    color: #fff !important;
    border-radius: 0px !important;
}

.primaryBtn2 {
    background-color: var(--main-color) !important;
    padding: 20px 40px !important;
    color: #fff !important;
    border-radius: 0px !important;
}

.primaryBtn2:hover {
    background-color: var(--main-color) !important;
    color: white !important;
}

.primaryBtn3 {
    background-color: var(--violet-color-2) !important;
    padding: 20px 40px !important;
    color: #fff !important;
    border-radius: 0px !important;
}

.secondaryBtn {
    background-color: var(--disabled) !important;
    padding: 15px 30px !important;
    border-radius: 0px !important;
}

.standartBtn {
    background-color: var(--gray-light) !important;
    padding: 15px 50px !important;
    border: 1px solid #aab3b2 !important;
}

.standartBtn:hover {
    background-color: var(--main-color) !important;
    color: white !important;

}

.standartBtn.active {
    background-color: var(--main-color) !important;
    color: white !important;

}

.standartlightBtn {
    background-color: var(--gray-light) !important;
    padding: 15px 50px !important;
    border: 1px solid #aab3b2 !important;
    border-radius: 0px !important;
}

.standartlightBtn:hover {
    background-color: var(--main-button-color) !important;
    color: white !important;

}

.standartlightBtn.active {
    background-color: var(--main-button-color) !important;
    color: white !important;

}

.secondaryBtnMeduim {
    background-color: var(--violet-color-2) !important;
    color: #ffffff !important;
    padding: 10px !important;
    border: none !important;
    border-radius: 0px !important;
}

.btn_link_doc {
    padding: 5px 10px;
    border: 2px solid var(--main-color);
    background-color: #fff;
    color: rgba(0, 0, 0, .7);
    font-size: 11px;
    font-weight: 700;
    text-align: center;
    width: 100%;

}

.souscription_btn {
    margin: 20px 0px 30px 0px !important;
    width: 100% !important;
    font-size: 1.3rem !important;
}

.ui.inverted.primary.button,
.ui.inverted.primary.buttons .button {
    box-shadow: 0 0 0 2px #006899 inset !important;
    color: #006899 !important;
}

.ui.inverted.primary.button:hover,
.ui.inverted.primary.buttons .button:hover {
    box-shadow: 0 0 0 2px white inset !important;
    color: white !important;
    background: #006899;
}

/*******************************
             Global
*******************************/
html {
    font-size: 90% !important;
}

* {
    /*font-family: 'Roboto', sans-serif;*/
    font-family:'Montserrat', sans-serif;
}

body {
    /*font-family: 'Roboto', sans-serif;*/
    color: #707070 !important;
    font-family:'Montserrat', sans-serif;
}

.header {
    /*font-family: 'Roboto', sans-serif;*/
    font-family:'Montserrat', sans-serif;
}

.ui.form .field>label {
    color: #707070 !important;
}

.label {
    color: #707070 !important;
}

.button,
.card {
    border-radius: 0px !important;
}

input,
.input.dropdown {
    border-radius: 0.18571429rem !important;
}

.pointing.red.label {
    color: #db2828 !important;
    border-radius: 0px !important;
}

.ui.red.basic.label {
    color: #db2828 !important;
    background-color: white !important;
}

.oblig::after {
    content: " *";
    color: #ff0000;
}

.mainContainer {
    margin: 15px 0px;
    position: relative;
}

h2.titreSection {
    color: var(--main-color);
    font-weight: bold;
    /*font-family: 'Roboto', sans-serif;*/
    font-family:'Montserrat', sans-serif;
    font-size: 1.8rem;
}

h3.titreSection {
    color: var(--green-color) !important;
    font-weight: bold;
    /*font-family: 'Roboto', sans-serif;*/
    font-family:'Montserrat', sans-serif;
    font-size: 1.5rem;
}

h5.titreSection {
    color: var(--green-color);
    font-weight: bold;
    /*font-family: 'Roboto', sans-serif;*/
    font-family:'Montserrat', sans-serif;
    font-size: 1.2rem;
    margin-bottom: 10px;
}

h4.titreSection {
    color: white;
    font-weight: bold;
    /*font-family: 'Roboto', sans-serif;*/
    font-family:'Montserrat', sans-serif;
    font-size: 1.5rem;
    margin-left: 10px;
}

.mainBtnColor {
    background-color: var(--main-button-color) !important;
    color: #ffffff !important;
}

.next_btn {
    background-color: var(--violet-color) !important;
    color: #ffffff !important;
    padding: 20px 30px !important;
}

.button.selectBtn {
    background: #ffffff;
    border: 1px solid #dededf;
    color: rgba(0, 0, 0, .6);
    max-width: 163px;
    height: 47px;
    border-radius: 0px;
    width: 100%;
}
.button.selectBtn.ui.labeled.icon{
    padding-left: 0px !important;
    padding-right: 0px !important;
}
.button.selectBtn.civiliteBtn {
    min-width: auto;
    height: auto;
}

.button.selectBtn.active {
    background: var(--main-color) !important;
    border: 1px solid #dededf !important;
    color: #fff !important;
}

.button.selectBtn:hover {
    background: var(--main-color) !important;
    border: 1px solid #dededf !important;
    color: #fff !important;
}

.button.standartBtn.selectBtn.sante-orientation-active {
    background: var(--main-color) !important;
    border: 1px solid #dededf !important;
    color: #fff !important;
}

.button.selectBtn.standartlightBtn:hover {
    background-color: var(--main-button-color) !important;
    padding: 15px 50px !important;
    border: 1px solid #aab3b2 !important;
    color: #fff !important;
}

.button.selectBtn.standartlightBtn.sante-orientation-active {
    background-color: var(--main-button-color) !important;
    padding: 15px 50px !important;
    border: 1px solid #aab3b2 !important;
    color: #fff !important;
}

.input.disabled {
    background-color: var(--disabled) !important;
    color: #707070 !important;
    opacity: 0.9 !important;
}

#couverture_conjoint_wrapper.ui.toggle.checkbox input:checked~label:before {
    background-color: var(--green-color) !important;
}

.enfant_ligne {
    align-items: flex-end;
    
}
#wrapper_list_enfants > div{
    margin-bottom: 60px !important;
}
.ligneEnfant i {
    background-color: var(--red-color);
    color: #fff;
    width: 30px;
    height: 30px;
    justify-content: center;
    align-items: center;
    display: flex !important;
}

.ligneEnfant {
    display: flex;
    align-items: flex-end;
}

.ligneEnfant span {
    margin-left: 15px;
}

.contactsShortcuts {
    position: fixed;
    right: 0px;
    top: 30%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ui.breadcrumb {
    margin-top: 20px !important;
    margin-bottom: 30px !important;
}

.section {
    border: 5px solid var(--breadcrumb-active-color);
    border-top: transparent;
    border-right: transparent;
    padding: 4px 4px 4px 9px !important;
    background-color: #fff;
    margin-left: 15px !important;
    font-weight: normal;
}

.section.active {
    border: transparent;
    background-color: var(--breadcrumb-active-color);
    color: #fff;
    padding: 10px !important;

}

.ui.breadcrumb .active.section {
    font-weight: normal;
}

#tarifs {
    position: relative;
}

#sidebar {
    position: relative;
    font-size: 12px;
    border: 1px solid rgba(34,36,38,.15);
}
#tarifs #sidebar {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border: transparent;
}

#contactsShortcuts .button,#contactsShortcutsMobile .button {
    background-color: var(--violet-color);
    color: #fff;
    min-width: 160px;
}

#contactsShortcuts .button.contact {
    padding-left: 10px !important;
    text-align: left;
    border-radius: 0px;
    padding-top: 15px;
    padding-bottom: 15px;
    display: flex;
    align-items: center;
}

#contactsShortcuts .icon {
    right: 0px !important;
    left: unset !important;
    height: 40px;
}

.ui.secondary.segment {
    background-color: #f3f3f3;
    border: transparent;
}

#wrapper_besoin1 .button {
    width: 163px;
    height: 45px;
    line-height: initial;
}

.qst_niveau_3 {
    background-color: var(--bg-green-light) !important;
}

.ria_date_info i {
    background-color: var(--violet-color-2);
    color: #fff;
    min-width: 30px;
    height: 30px;
    justify-content: center;
    align-items: center;
    display: inline-flex !important;
}

.ria_date_info p {
    margin-left: 4px;
}

.nom_formule {
    background-color: transparent !important;
    color: var(--violet-color-2) !important;
    font-size: 1.4rem !important;
    font-weight: 700;
}

.tarif_formule {
    background-color: transparent !important;
    color: var(--green-color) !important;
    font-size: 1.4rem !important;
    font-weight: 700;
}

#wrapper_tarifs_modalites .tarif_selected_formule {
    text-align: center;
    border: 5px solid var(--main-color);
    max-width: 74%;
    padding: 30px 0px 5px 0px;
}

#wrapper_tarifs_modalites .tarif_selected_formule span {
    color: var(--green-color);
    font-weight: 700;
}

#wrapper_tarifs_modalites .tarif_selected_formule span:first-child {
    font-size: 1.8rem;
    margin-bottom: 5px;
}

#wrapper_tarifs_modalites .tarif_selected_formule span:last-child {
    font-size: 12px;
}

.rappel {
    font-weight: 700;
}

progress {
    width: 100%;
    height: 5px;
    padding: 0px !important;
    background-color: var(--gray-light);
}

progress::-webkit-progress-bar {
    background-color: var(--gray-light);
    width: 100%;
}

progress::-webkit-progress-value {
    background-color: var(--main-color) !important;
}

progress::-moz-progress-bar {
    background-color: var(--main-color) !important;
}

progress {
    color: var(--main-color);
}

.unstackable {
    gap: 15px;
}
.orientation_one .divider:last-child  {
    display: none;
}
.ui.selection.dropdown{
    width: 100%;
}
.field_enfant{
    position: relative;
}
.field_enfant .red.label{
    position: absolute !important;
    top: 100%;
    left: 0px;
}
.ui.form .inline.fields>label{
    font-weight: 500 !important;
}
.column > label{
    font-weight: 700;
    display: block;
    margin: 0 0 0.28571429rem 0;
    color: #707070;
    font-size: .92857143em;
}
.orientation_one .divider {
    margin-bottom: 0px !important;
    margin-top: 0px !important;
}
.choixNiveauSante .red.label{
    width: 100%;
    text-align: center;
}
.dev_conseil {
    width: 100%;
    text-align: center;
    margin-bottom: 16px !important;
}
.print.icon, .mail.icon {
    display: flex;
    justify-content: center;
    align-items: center;
}
.print_mail_tarif{
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 7px;
    padding-top: 8px;
}
#print_mail_tarif .button {
    background-color: var(--violet-color-2) !important;
    color: #fff;
}

#compare_formules_recommandees {
    margin: 0px;
    justify-content: center;
}

#compare_formules_recommandees .card{
    max-width: 33.33%;
    border: 1px solid transparent !important;
    box-shadow: none !important;
    margin: 0px -1rem 0px 0px;
    padding: 0px 3% 0px 0px;
}
#compare_formules_recommandees .details{
    padding-left: 0px;
    padding-right: 0px;
}
#accordeon_non_reco #formules_non_recommandees .cards{
    width: calc(16.666666666666664% - 1rem);
}
#accordeon_non_reco #formules_non_recommandees .card{
    width: calc(16.666666666666664% - 0.5rem);
    /*border: 1px solid #7465aa !important;*/
    margin: 0.8rem 0.2rem !important;
}
#accordeon_non_reco #formules_non_recommandees .title_formule{
    background-color: #a59cc8 !important;
    color: #fff !important;
}
#accordeon_non_reco #formules_non_recommandees .tarif_per_month span{
    color: var(--violet-light2) !important;
}
#formules_non_recommandees .details{
    padding: 0px;
    margin-left: 6px;
    text-align: left;
    font-size: 14px;
}
#compare_formules_recommandees .card .content{
    color: var(--violet-color-2) !important;
    background-color: #fff !important;
    min-height: 20px !important;
    border-top: 1px solid rgba(0,0,0,.0)!important;
}
#compare_formules_recommandees .card .content .title_formule {
    color: var(--violet-color-2) !important;
}
#compare_formules_recommandees .score_tableau_domaine:nth-child(odd) {
    background-color: #f2f2f2;
}
#formules_non_recommandees .col_score {
    width: 24px;
    height: 10px;
}
#formules_non_recommandees .score_tableau_domaine:nth-child(odd) {
    background-color: #f2f2f2;
}
#compare_formules_recommandees .score_tableau_domaine{
    padding-left: 50px;
    padding-bottom: 1px;
}
#compare_formules_recommandees .card .link_file{
    text-align: left;
}
#tableau_reco{
    padding: 20px 5px 0px 0px;
}
#header{
    background-color:#00B3A7;
    max-height: 90px; 
}
.menu {
    display: flex;
    justify-content: center;
    align-self: center;
    float: left;
}
.menu li {
    list-style: none;
}
.menu li:before {
    display: none;
}
.menu a{
    color: #fff; 
    margin-left: 41px;
}
.menu li:first-child a{
    color: #fff; 
    margin-left: 0px;
}
.menuHead{
    font-family: 'Montserrat', sans-serif !important;
    font-size:14px !important;
    font-weight:700 !important;
    color:#ffffff !important;
}
.menuHeadItem {
    box-sizing:border-box !important;
    color:#ffffff !important;
    display:inline-block !important;
    font-family:'Montserrat', sans-serif !important;
    font-size:14px !important;
    font-weight:700 !important;
    list-style-image:none !important;
    list-style-position:outside !important;
    list-style-type:none !important;
    text-align:center !important;
    text-rendering:optimizelegibility !important;
    text-size-adjust:100% !important;
    padding-bottom: 10px !important;
}

.menuHeadItem:hover {
    box-sizing:border-box !important;
    color:#ffffff !important;
    display:inline-block !important;
    font-family:'Montserrat', sans-serif !important;
    font-size:14px !important;
    font-weight:700 !important;
    list-style-image:none !important;
    list-style-position:outside !important;
    list-style-type:none !important;
    text-align:center !important;
    text-rendering:optimizelegibility !important;
    text-size-adjust:100% !important;
    border-bottom: 3px solid #ffffff !important;
    padding-bottom: 10px !important;
}

/* css pour menu burger mobile  */
.topnav {
    overflow: hidden;
    background-color: #00B3A7;
    position: relative;
    display: none;
    z-index:10000 !important;
}
.topnav a {
    color: white;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
    display: block;
}

.footer{
    width: 100%;
    background-color: rgb(69 50 142 / 81%);
    color: #fff;
    background-repeat: no-repeat;
    background-position: 0 0, center;
    margin-top: 50px;
}
.column_footer p{
    max-width: 300px;
}
.phone{
    display: flex;
    align-items: center;
}
.phone > img{
    margin-right: 8px;
}
.link_footer{
    display: flex;
    flex-direction: column;
    font-size: 16px;
    font-weight: 400 !important;
}
.link_footer_bas {
    font-size: 13px !important;
    font-weight: 700 !important;
}
.title_footer_column{
    margin-bottom: 21px;
    font-size: 22px;
    font-family:'Montserrat', sans-serif !important;
    font-weight:700 !important;
}
.footer_top{
    padding-bottom: 50px !important;
    padding-top: 60px;
    padding-left: 120px;
    padding-right: 120px;
}
.footer_top .link_footer a{
    margin-top: 21px;
    color: #fff;
}
.link_footer a:first-of-type{
    margin-top: 0px;
}
.square{
    width: 15px;
    height: 15px;
    background-color: #fff;
    margin-right: 13px;
    display: inline-block;
}
.footer_bottom{
    background-color: #45328E;
    height: 99px !important;
    padding-left: 120px;
    padding-right: 120px;
}
.footer_bottom .grid{align-items: center;}
.footer_bottom .link a{
    color: #fff;
    margin-left: 25px;
}
.network {
    display: flex;
    align-items: center;
}
.network a {
    padding-left: 12px;
}

.network a:first-of-type {
    padding-left: 0px;
}
.logo_footer_bottom{
    text-align: center;
}

.score_tableau{
    display: flex;
    margin-bottom: 20px;
    gap: 5px;
    padding-left: 8px;
}
.col_score{
    vertical-align: middle;
    text-align: center;
    border-bottom: .2px solid transparent !important;
    border-top: .2px solid transparent !important;
    border-left: .2px solid transparent !important;
    border-right: .2px solid transparent !important;
    background-color: #FFC000;
    width: 30px;
    height: 10px;
}
.col_empty{
    width: 30px;
    height: 10px;
    
}
.contactsShortcutsMobile{
    margin: 1rem auto;
}
#compare_formules_recommandees .domaine,#details_computer .domaine {
    padding-top: 10px;
    font-size: 16px;
    margin-bottom: 5px;
    padding-left: 8px;
}
#details_computer_non_reco{
    width: 100%;
    margin-left: 2%;
    margin-right: 0%;
}
#details_computer{
    width: 100%;
    margin-left: 0px;
    margin-right: 0px;
    padding-right: 1rem;
    justify-content: flex-end;
}
.wrapper_details .domaine_score:nth-child(odd) {
    background-color: #f2f2f2;
}
#details_computer .details{
    padding: 0px !important;
    width: 107px;
}
.wrapper_details .score_tableau{
    padding-bottom: 10px;
    padding-left: 8px;
}
.details.accordion{
    padding-top: 0px !important;
}
.details.accordion .title {
    padding-left: 8px !important;
    color: #707070 !important;
    /*font-family: 'Roboto', sans-serif !important;*/
    font-family:'Montserrat', sans-serif;
    font-size: 16px !important;
}
.details.accordion .title i{
    float: right !important;
}
.details .dropdown{
    font-size: 1.5rem !important;
}
#details_computer.remboursements_exemples_non_reco .domaine{
    font-size: 13px;
}
#details_computer.remboursements_exemples_non_reco .domaine_score:last-of-type .domaine{font-size: 12px;}
.content_accordion{
    padding-left: 10px !important;
}
/*******************************
             Card
*******************************/
.cards{
    cursor: pointer;
}
.cards.cards_tarifs {
    flex-wrap: nowrap;
    margin-left: 3%;
    margin-right: 3%;
}

.cards_tarifs a {
    font-size: 11px;
    color: rgba(0, 0, 0, .7) !important;
}
.cards_tarifs a:hover {
    color: rgba(0, 0, 0, .7) !important;
}

.cards.cards_tarifs .card {
    border: 4px solid var(--green-color) !important;
    border-radius: 0px !important;
}

.cards.cards_tarifs .card.recommande {
    border: 7px solid var(--main-color) !important;
    border-radius: 0px !important;
}

.cards.cards_tarifs .card .content {
    background-color: var(--violet-color-2) !important;
    min-height: 120px;
}

.cards.cards_tarifs .card .extra.content {
    background-color: #fff !important;
    padding-left: 3px !important;
}

.title_formule {
    font-size: 1.5em !important;
    color: #fff !important;
    text-align: center;
    margin: 0px !important;
    padding: 13px 0px 0px 0px !important;
}

.title_formule_recommande {
    text-align: center;
    background-color: var(--green-color);
    color: #fff;
}

.tarif_per_month span:first-child {
    font-size: 1.5em;
    color: #fff;
    text-align: center;
    font-weight: 700;
}

.tarif_per_month span:last-child {
    font-size: 13px;
    color: #fff;
    text-align: center;
    font-weight: 700;
}

.header_tarif {
    background-color: var(--green-color);
    color: #fff;
    padding: 5px 0px 1px 5px;
    margin-bottom: 30px;
    position: relative;
    max-height: 44px;
}

.wrapper_card_tarifs {
    border: 5px solid var(--main-color) !important;
    border-radius: 0px;
}

.cards.cards_tarifs .card>:first-child {
    border-radius: 0px !important;
    padding-bottom: 0px !important;
    padding-top: 0px !important;
}

.tarif_selected {
    background-color: var(--violet-color-2);
    padding: 19px;
    position: absolute;
    top: calc(100% - 75px);
    left: calc(100% - 172px);
    width: 186px;
    height: 116px;
}

.questions_besoins i {
    font-size: 1.6em;
}

.reponse {
    background-color: var(--main-color);
    color: #fff;
    display: block;
    margin-bottom: 1.6em;
    text-align: center;
    max-width: 69px;
    max-height: 30px;
    line-height: 30px;
}

.rec_qst {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
}

.rec_qst span {
    display: block;
}
.question_list{
    margin-left: 1rem;
}
.question_list .row {
    margin-left: -1rem;
}

#autres_formules .ui.secondary.segment {
    box-shadow: none !important;
}

#accordeon_non_reco_title {
    background-color: var(--violet-light);
    height: 53px;
    line-height: 40px;
    padding-left: 40px;
    border-radius: 0px !important;
    padding-top: 5px;
}

#accordeon_non_reco_title .header {
    font-size: 1.5rem;
    color: var(--violet-light2);
    font-weight: 700;
    display: flex;
    align-items: center;
    padding-left: 15px;
}

#accordeon_non_reco_title .header a {
    margin-left: 20px;
}

#accordeon_non_reco_title .header i {
    color: var(--violet-light2);
    line-height: 42px;
    height: 42px;
}

.wrapper_cart_total {
    margin-top: 50px;
    width: 100%;
}

.wrapper_cart_total .tarif_selected_formule {
    background-color: var(--violet-color-2);
    color: #fff;
    padding: 10px 0px;
    width: 100%;
    float: right;
    max-width: 176px;
    height: 162px;
    justify-content: space-between;
    align-items: center;
    text-align: center;
}

.wrapper_cart_total .tarif_selected_formule span {
    width: 100%;
    display: block;
}

.wrapper_cart_total .tarif_selected_formule span {
    font-size: 1rem;

}

.wrapper_cart_total .tarif_selected_formule span:nth-child(2) {
    font-size: 30px;
    font-weight: 700;
}

#accordeon_non_reco {
    background-color: var(--violet-light);
 
}
#accordeon_non_reco .cards{
    margin-right: 0.1rem;
    margin-left: 0.1rem;
    justify-content: center !important;
    margin-bottom: 0.1rem;
}
#accordeon_non_reco .active {
    margin-top: 10px;
}

.headphone_user{
    width:60px ;
    height:70px;
}

#formules_recommandees .selected, #formules_non_recommandees .selected{
    border: 7px solid var(--main-color) !important;
    border-radius: 0px !important;
}
.declaration textarea{
    width: 100% !important;
    min-height: 100px;
}
#sidebar_accordion .title{
    color: var(--violet-color-2);
    font-size: 1.1rem;
}
/*******************************/
/* Card Modalités de réglement */
/*******************************/

.PrelevementCard {
    cursor: pointer;
}

.PrelevementHeader.active,
.PrelevementHeader:hover {
    background-color: var(--green-color) !important;
    color: white !important;
}

.PrelevementHeader {
    padding: 15px;
    font-size: 16px;
    background-color: var(--bg-gray-light) !important;
    color: var(--gray-color) !important;
    text-align: center;

}

.PrelevementContent.active {
    color: var(--green-color) !important;
}

.PrelevementContent {
    display: block;
    font-size: 18px !important;
    font-weight: bold;
    text-align: center;
    color: var(--green-color) !important;
}

.ChosenPrelevementIcon.active {
    display: block;
}

.ChosenPrelevementIcon {
    position: absolute;
    top: 10px;
    left: 5px;
}

.ChosenPrelevementIcon.inactive {
    display: none;
}

#modalites_reglement .cards {
    gap: 40px;
}
.ui.labeled.icon.button>.icon, .ui.labeled.icon.buttons>.button>.icon{
    background-color: transparent !important;
}
/*******************************
             Card formules
*******************************/
.autres_formules .card .header {
    color: var(--violet-light2) !important;
}
.autres_formules .title_formule.header{
    background-color:#fff;
    font-size: 1.7rem !important;
    border: 1px solid transparent;
    font-weight: bold !important;
}
.autres_formules .card .content {
    padding: 0px 0px 5px 0px !important;
    border: none !important;
}

.autres_formules .ui.cards>.card {
    margin: 0.8rem 0rem !important;
    box-shadow: none !important;
}
#formules_non_recommandees .card{
    width: calc(16.666666666666664%);
}
#autres_formules .content{
    border: none !important;
}
#formules_non_recommandees .card > .extra {
    border-top: 1px solid transparent !important;
}
#formules_non_recommandees .score_tableau_domaine{
    padding-left: 0px;
    padding-bottom: 1px;
    padding-right: 10px;
}
#formules_non_recommandees .score_tableau_domaine .domaine{
    padding-top: 10px;
    font-size: 13px;
    margin-bottom: 5px;
    padding-left: 10px;
}
#formules_non_recommandees .score_tableau_domaine .score_tableau{
    display: flex;
    margin-bottom: 20px;
    gap: 5px;
    padding-left: 10px;
}
.autres_formules .link_file {
    font-size: 11px;
    padding-left: 0px;
    text-align: left;
    color: #787878 !important;
}
.autres_formules .link_file.remboursements {
    font-size: 11px; 
}
.autres_formules .link_file:hover{
    color: rgba(0,0,0,.4);
}
.autres_formules .tarif_per_month {
    padding: 15px 0px;
}

.autres_formules .tarif_per_month span {
    color: var(--violet-color-2);
}

.autres_formules .title_formule {
    padding: 10px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 50px;
    font-size: 1.3em;
}
.autres_formules .card .content::after{
    display: none !important;
}

.souscriptionBtnRetour .row:first-child {
    order: 1;
}

.souscriptionBtnRetour .row:last-child {
    order: 2;
    justify-content: flex-end;
}
.rapplelSouscription{
    box-shadow: none !important;
    border: none !important;
}
#wrapper_sepa .message.positive {
    background-color: var(--bg-gray-light) !important;
    color: var(--gray-color) !important;
    border: 1px solid #c9c9c9;
    box-shadow: 0 0 0 1px #e5e5e5 inset, 0 0 0 0 transparent;
    text-align: center;
    
}
.editInputBtn{
    position: relative;
}
.editInputBtn > i{
    position: absolute;
    top: 0px;
    right: 10px;
}
.editInputBtn .mainBtnColor{
    position: absolute;
    right: 0px;
    top: 0px;
    width: 3.5rem !important;
    z-index: 1!important;
    max-height: 39px !important;
    margin: 0px !important;
}
.update_needs {
    margin: 15px 0px 10px 0px;
}
.titre_modal{
    color: var(--violet-light2) !important;
    padding-top: 4px;
    font-size: 1.3rem;
    font-weight: 700;
}
.wrapper_formules_non_recommandees .titre_modal{
    background-color: var(--violet-light);
    border: 1px solid var(--violet-light2);
    margin-bottom: 0px;
}

.wrapper_formules_non_recommandees .card .header{
    min-height: 15px !important;
    text-align: center;
    padding-left: 8px !important;
    font-weight: bold !important;
}
.sup_grid{
    width: 100%;
}
.sub_question{
    text-align: center;
}
.dap_civilite_error{
    max-width: 160px !important;
    display: flex !important;
    justify-content: center !important;
    margin: 10px auto 10px auto !important;
}
/*******************************
             Utilities
*******************************/
.flex_column {
    display: flex;
    flex-direction: column;
}
.flex_inline {
    display: inline-flex;
}
.space_between {
    justify-content: space-between !important;
}

.alignItemCenter {
    align-items: center !important;
}
.alignItemEnd {
    justify-content: flex-end !important;
}

.flex_row_center {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.dividerCustom {
    border-top: 1px solid rgba(34, 36, 38, .15);
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    display: inline-block;
    width: 100%;
    margin-left: 10px;
}

.flex {
    display: flex !important;
}

.gap10 {
    gap: 10px;
}

.gap20 {
    gap: 20px;
}
.centered{
    text-align: center !important;
}
.info_btn{
    display: inline-block;
}
.sousTitreSection{
    width: 100%;
}
#choix_creneau_rappel .ui.checkbox{
    margin-top: 1.2rem !important;
}
.contact_txt{
    display: block;
    font-size: 11px;
}
.simple{
    background-color: var(--violet-color) !important;
    color: #ffffff !important;
    padding: 20px 30px !important;
}
.question_list .row{
    margin-right: -1rem;
}
.recap_qst{
    padding-right: 0px !important;
}
.colorTitre{
    color: var(--violet-color);
}
.signatureNumeriqueBtn {
    background-color: var(--main-color) !important;
    color: #fff !important;
    text-align: center !important;
    max-width: 353px;
    width: 100%;
}
.signaturePapierBtn{
    background-color: var(--main-button-color) !important;
    color: #ffffff !important;
    text-align: center !important;
    max-width: 353px;
    width: 100%;
}

/*******************************
             responcive
*******************************/
@media only screen and (max-width: 768px) {
    .standartBtn {
        padding: 15px 0px !important;
    }

    .primaryBtn2,
    .primaryBtn {
        padding: 15px !important;
        width: 100%;
    }

    .primaryBtn {
        max-width: 45%;
        line-height: 17px !important;
        font-size: 0.9rem !important;
    }

    label {
        font-size: 12px;
    }

    .choixNiveauSante .column:first-child {
        margin-bottom: 10px !important;
    }

    .ligneEnfant {
        padding: 0.67857143em 0px !important;

    }
    .cards.cards_tarifs {
        overflow: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .cards.cards_tarifs::-webkit-scrollbar {
        display: none;
    }
    .cards.cards_tarifs .card {
        margin-left: 10px;
        margin-right: 0px;
        min-width: 33%;

    }
    .cards.cards_tarifs .card:first-child {
        margin-left: 20px;
    }
    h2.titreSection {
        font-size: 1.2rem;
    }

    h3.titreSection {
        font-size: 1.2rem;
    }
    h4.titreSection {
        font-size: 1.2rem;
    }
    .tarif_selected {
        top: calc(100% - 65px);
        left: calc(100% - 104px);
        width: 119px;
        height: 68px;
    }
    #wrapper_tarifs_modalites .tarif_selected_formule {
        max-width: 100%;
        padding: 30px 0px 15px 0px;
    }
    .questions_besoins {
        margin-bottom: 15px;
    }
    .souscriptionBtnRetour .row:first-child {
        order: 2;
    }
    .souscriptionBtnRetour .row:last-child {
        order: 1;
    }

    .prelevement_autre_btn_change b {
        font-size: 11px;
    }

    .ui.stackable.cards>.card {
        border-radius: 0.28571429rem 0.28571429rem 0 0 !important;
    }
    .ui.stackable.cards{
        padding-left: 20px;
    }
    .beneficiaire{
        font-size: 11px;
        padding-right: 0px !important;
    }
    .headphone_user{
        width:30px;
        height:35px;
    }

    .sousTitreSection{
        margin-top: 20px !important;
    }
    .button.selectBtn.civiliteBtn {
        font-size: 12px;
    }
    #accordeon_non_reco_title .header{
        font-size: 1rem;
    }
    #autres_formules .link_file{
        text-align: left;
    }
    #wrapper_information_perso label{
        font-size: 13px;
    }
    #accordeon_non_reco .cards{
        margin-right: 0px;
        flex-wrap: nowrap;
        margin-left: 3%;
        margin-right: 3%;
        overflow-x: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    #accordeon_non_reco .cards .card{
        width: calc(16.666666666666664% -1.2rem);
        margin: 0.8rem 0.8rem !important;
    }
    #accordeon_non_reco .cards.alignItemEnd {
        justify-content: flex-start !important;
    }
    #accordeon_non_reco .cards .card{
        margin-right: 0px;
        min-width: 33%;
    }
    .editInputBtn .mainBtnColor{
        bottom: calc(100% - 83px);
    }
    .contactsShortcutsMobile{
        margin: 1rem auto;
        width: 100%;
        display: flex;
        justify-content: space-evenly;
        padding-left: 0px;
        padding-right: 60px;
    }
    .souscription .circle {
        position: absolute;
    }
    .souscriptionBtnRetour .space_between{
        justify-content: flex-start !important;
    }
    #compare_formules_recommandees{
        justify-content: flex-start;
    }

}
@media only screen and (max-width: 480px) {
    .cards.cards_tarifs .card{
        min-width: 53%;
    }
    .rec_qst{
        font-size: 11px !important;
        margin-left: 5px;
    }
    #modal_etre_contacte .primaryBtn{
        font-size: 11px !important;
    }
    .footer_top, .footer_bottom{
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .footer_bottom{
        height: auto !important;
        text-align: center;
    }
    .footer{
        margin-top: 0px;
    }
    #header{
        text-align: center;
    }
    .contactsShortcutsMobile{
        padding-right: 0px;
    }
    #compare_formules_recommandees .card{
        width: 100%;
        max-width: 200px;
        margin: 10px auto;
    }
    #compare_formules_recommandees {
        flex-wrap: wrap;
        margin-left: 0px;
        margin-right: 0px;
        overflow: visible;
    }
    .details{
        background-color: #ededed;
        padding: 20px;
        margin: 20px;
    }
    .autres_formules .link_file{
        text-align: center;
        font-size: 11px;
    }
    #compare_formules_recommandees .mobile{ 
        margin-right: 0px !important;
        margin-left: 0px !important;
    }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px){
    .rec_qst{
        font-size: 11px !important;
    }
    .autres_formules .title_formule {
        min-height: 50px;
    }
}
@media only screen and (min-width: 900px) and (max-width: 1024px) {
    .rec_qst{
        font-size: 11px !important;
    }
    .autres_formules .title_formule {
        min-height: 50px;
    }
    .autres_formules .title_formule {
        font-size: 15px !important;
    } 
}
@media only screen and (min-width: 769px) and (max-width: 900px) {
    .souscription .circle {
        position: absolute;
    }
    .souscriptionBtnRetour .primaryBtn{
        max-width: 220px;
    }
}