.description, .subtitle, .title { color: #fff; font-family: "Open Sans"; } .border_img, .title_form { align-items: center; display: flex; } .active .step_title, .title { font-weight: 700; } .btn_popup, .description, .remplissage, .semibold, .step_title, .subtitle, .title { font-family: "Open Sans"; } .calendar, .info { right: 30px; position: absolute; } #msform, #msform fieldset, #progressbar li, input[type="date"] { position: relative; } #progressbar li:after, .calendar, .deleteblock, .info, .optional, .rib_example { position: absolute; } #loader_form, #preloader { position: fixed; left: 0; bottom: 0; z-index: 999999; } .annuler, .legal-contents a, .mail_link, .termes, .text_verif a, a.input-button { text-decoration: none; } body { font-family: "Open Sans" !important; } .height-100 { height: 100vh; } .bg-blue { background-image: url(../img/preadhesion/bg.png); min-height: 100vh; background-size: cover; } .title { font-size: 2.3em; margin-left: -13%; } .phone_img { display: block; margin: -8% auto 0; } .subtitle { font-size: 24px; font-weight: 600; } .description { font-size: 17px; } .btn_popup { color: #222e63; font-size: 14px; background: #fff; border-radius: 4px; border: 1px solid #fff; box-shadow: none; padding: 7px 30px; } .btn_popup:hover { color: #fff; background: #222e63; } .cnx_compte a, .text_verif a { color: #0786d5; } .copyright { color: #fff; font-size: 15px; } .semibold { font-weight: 500; } .content-right { padding: 20px 60px; overflow-x: hidden; } @media screen and (min-width: 190px) { .content-right { height: auto; min-height: 100vh; overflow-y: auto; -ms-overflow-style: none; scrollbar-width: none; } .content-right::-webkit-scrollbar { display: none; } } .title_form { color: #222e63; font-size: 2.5em; line-height: 30px; } .title_form::before { content: ""; width: 2px; height: 30px; background: #0786d5; margin-right: 15px; } .cnx_compte { margin-left: 20px; font-size: 15px; color: #222e63; } .active .image_bg, .image_bg { padding: 5px; margin: 5px; } .border_img { border: 1px solid #222e63; border-radius: 50%; width: 40px; height: 40px; justify-content: center; } .active .border_img { border: 1px solid #0786d5; border-radius: 50%; } .step_title { display: flex; align-items: center; color: #222e63; font-size: 12px; } .remplissage { font-size: 16px; color: #222e63; } #msform input, select { width: 100%; margin: 10px 0 !important; height: 45px; border-radius: 10px; border: 1px solid #d3d5e0; padding: 10px 25px; font-size: 15px; color: #222e63; font-weight: 600; } #msform input::placeholder { font-size: 14px; font-family: "Open Sans"; font-weight: 400; color: #222e63; opacity: 0.5; } #msform .iti { width: 100%; } .iti--separate-dial-code .iti__selected-flag { background-color: transparent !important; } .info { top: 19px; cursor: help; } .calendar { top: 17px; } .rib_example { right: -48px; top: -228px; z-index: 999999999; max-width: 300px; } .article ul > li:before, .rib_example.hidden, .second_step, .third_step { display: none; } .rib_example.showed { display: block; } .text_verif { font-size: 12px; color: #222e63; font-weight: 400; } .trust { display: flex; align-items: flex-start; max-width: 250px; } .trust img { margin-right: 10px; } .text_verif a { font-weight: 600; } input[type="date"]::-webkit-calendar-picker-indicator { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: auto; height: auto; color: transparent; background: 0 0; } .recto p, .verso p { color: #222e63; opacity: 0.8; } .recto-face label, .verso-face label { padding: 7px 15px; text-align: center; max-width: 200px; font-size: 13px; margin: 20px auto 0; cursor: pointer; background-color: #fff; color: #2494da; border: 1px solid #2494da; border-radius: 10px; font-weight: 600; } .upload { border: 1px dashed #222e6333; border-radius: 15px; display: block; text-align: center; margin: auto; } .upload p, .upload span { color: #222e63; font-size: 14px; display: block; } .delete, .delete_verso { margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; display: flex; justify-content: center; align-items: center; height: 45px; width: 200px; background: 0 0; border: 1px solid #fff; color: #fff; border-radius: 10px; } .delete i, .delete_verso i { margin-left: 15px; } #msform { text-align: left; margin-top: 20px; } #msform fieldset { background: #fff; border: 0; border-radius: 0.5rem; box-sizing: border-box; width: 100%; margin: 0; padding-bottom: 20px; } #msform input:focus, #msform textarea:focus { -moz-box-shadow: 2px 2px 2px 2px #f2f9fd; -webkit-box-shadow: 2px 2px 2px 2px #f2f9fd; box-shadow: 2px 2px 2px 2px #f2f9fd; border: 1px solid #188ed8; outline-width: 0; } #msform .action-button, #msform .action-button-previous, .end { width: 180px; cursor: pointer; padding: 10px 25px; margin: 10px 5px; font-weight: 400; box-shadow: none; } #msform .action-button, .end { background: #0786d5; border: 1px solid #0786d5; color: #fff; border-radius: 5px; } #msform .action-button:hover, .save:hover, .savev:hover { background: #fff; border: 1px solid #0786d5; color: #0786d5; } #msform .action-button-previous { background: #e8eaef; border: 1px solid #e8eaef; color: #222e63; border-radius: 5px; } #msform .action-button-previous:hover { background: #fff; border: 1px solid #e8eaef; color: #222e63; } #preview_recto, #preview_verso { max-width: 100%; width: 100%; border-radius: 5px; } .filename { color: #0786d5 !important; font-weight: 300; } .status { font-weight: 600; color: #222e63; } .deleteblock { width: 100%; height: 100%; display: block; top: 0; background: #00000057; } #progressbar li.active:after, #progressbar li.active:before, .optional { background: #0786d5; } @media screen and (max-width: 400px) { #msform .action-button, #msform .action-button-previous { width: 100px !important; font-size: 10px; } .recto p, .step_title, .verso p { font-size: 12px; } .trust { max-width: 100% !important; } #progressbar li { width: 100% !important; } } @media screen and (min-width: 401px) and (max-width: 1199px) { #msform .action-button, #msform .action-button-previous { width: 140px !important; } .recto p, .step_title, .verso p { font-size: 12px; } .trust { max-width: 100% !important; } } #progressbar { margin-bottom: 20px; overflow: hidden; color: #d3d3d3; } #progressbar .active { color: #000; } #progressbar li { list-style-type: none; font-size: 12px; width: 50%; float: left; min-height: 60px; } #progressbar li:before { width: 50px; height: 50px; line-height: 45px; display: block; font-size: 18px; color: #fff; background: #d3d3d3; border-radius: 50%; margin: 0 auto 10px; padding: 2px; } #progressbar li:after { content: ""; width: 100%; height: 3px; background: #d3d3d3; left: 0; top: 50px; z-index: -1; } #progressbar #account:after, #progressbar #personal:after { width: 96%; } .success_msg { color: #222e63; font-size: 14px; } .error_mail { font-weight: 300; font-size: 14px; } .mail_link, .termes { color: #0786d5; } .checkboxoffre { width: 25px !important; margin: 0 25px 0 0 !important; height: 25px !important; border-radius: 5px !important; padding: 0 !important; } .form-check-label { font-weight: 600; color: #222e63; font-size: 14px; margin-left: 15px; } .optional { font-weight: 600; color: #fff; font-size: 12px; padding: 10px 15px; border-radius: 5px; top: 3.8px; right: 3.5px; text-transform: uppercase; border: 0; } .bg_option_one { border: 1px solid #e0e1e8; border-radius: 10px; max-width: 90%; margin: auto; padding: 0 10px; background: #fff; top: -25px; } .annuler, .save, .savev { color: #fff; padding: 10px 15px; margin: 10px 5px; font-weight: 400; font-size: 14px; box-shadow: none; cursor: pointer; } .toggling_bloc { border: 1px solid #e0e1e8; border-radius: 10px; position: relative; } .faq-section .mb-0 > a:after { content: "\f067"; font-family: "Font Awesome 5 Free"; position: absolute; right: 0; font-weight: 600; } .faq-section .mb-0 > a[aria-expanded="true"]:after { content: "\f068"; font-family: "Font Awesome 5 Free"; font-weight: 600; } .save, .savev { background: #0786d5; border: 1px solid #0786d5; border-radius: 5px; } .annuler { background: #7a7a7a; border: 1px solid #7a7a7a; border-radius: 5px; } .annuler:hover { background: #fff; border: 1px solid #7a7a7a; color: #000; } #accordionoffre .accordion-button::after, #accordionoffre .accordion-button:not(.collapsed)::after { background-image: none !important; transform: rotate(-360deg); border-radius: 50%; width: 30px; height: 30px; display: flex; color: #222e63; } #accordionoffre .accordion-button:not(.collapsed)::after { content: "-"; background: #fff; justify-content: center; align-items: center; } #accordionoffre .accordion-button::after { content: "+"; background: #fff; justify-content: center; align-items: center; } #accordionoffre { width: 90%; margin: 0 auto 30px; } #accordionoffre .accordion-item { margin-bottom: 10px; border: 1px solid #f2f9fd !important; } #accordionoffre .accordion-body { background: #f2f9fd; } #accordionoffre .accordion-button:not(.collapsed) { color: #222e63; background-color: #f2f9fd; box-shadow: none; font-weight: 500; font-size: 20px; } #accordionoffre .accordion-button { background: #f4f4f7; font-weight: 500; font-size: 20px; } #accordionoffre .accordion-body { font-size: 12px; font-weight: 500; color: #222e63; padding: 10px 40px 30px; } .accordion-button:focus { box-shadow: none !important; } .lightblue { color: #0786d5; font-style: italic; font-weight: 600; } .terms label { font-size: 15px; font-weight: 500; } .lireplus p { font-size: 14px; } @media screen and (max-width: 767px) { #progressbar { flex-wrap: wrap; } .spacer { height: 70px; } } @media screen and (min-width: 768px) { .spacer { height: 30px; } } .legal-container { margin: 25px auto 0; position: absolute; bottom: 0; text-align: center; width: 100%; left: 0; } .legal-contents ul { gap: 0 10px; flex-direction: column; display: flex; margin: 0; padding: 1.5rem; list-style: none; text-align: left; flex-wrap: wrap; flex-direction: row; -webkit-box-pack: start; justify-content: center; } .legal-contents a { font-size: 12px; font-weight: 600; color: #222e63; opacity: 0.5; border-right: 1px solid #222e63; padding: 0 10px 0 0; } .legal-contents li:last-child a { border: 0 !important; } #preloader { top: 0; right: 0; width: 100%; height: 100%; background-color: #fff; } [data-loader="circle-side-2"], [data-loader="circle-side"] { position: absolute; width: 50px; height: 50px; top: 50%; left: 50%; margin-left: -25px; margin-top: -25px; -webkit-animation: 0.95s linear infinite circle; -moz-animation: 0.95s linear infinite circle; -o-animation: 0.95s linear infinite circle; animation: 0.95s linear infinite circle; border: 2px solid #333; border-top-color: rgba(0, 0, 0, 0.2); border-right-color: rgba(0, 0, 0, 0.2); border-bottom-color: rgba(0, 0, 0, 0.2); border-radius: 100%; } #loader_form { top: 0; right: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.6); display: none; } @-webkit-keyframes circle { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @-moz-keyframes circle { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @-o-keyframes circle { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes circle { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } .d-none-step { display: none; position: relative; } .flatpickr-month { height: 60px !important; } input.flatpickr { cursor: pointer; } .new_input_date { border-right: 0 !important; height: 36px; line-height: 36px; width: 100%; padding: 8px; max-width: 80%; background: #fff; border-radius: 10px 0 0 10px !important; } .color-danger { color: #f64747 !important; fill: #f64747 !important; } article.article { line-height: 1.5; } .palette-primary-blue .article code { color: #5b6982; } .article ul { list-style-type: disc; } .article ul ul { list-style-type: circle; } .input-group { display: flex; align-items: center; } input:focus { border-color: #4889e0; } a.input-button { border: 1px solid #d3d5e0; display: flex; padding: 8.5px 12px; border-left: 0; cursor: pointer; align-items: center; justify-content: center; height: 45px; width: 10%; border-radius: 0 10px 10px 0; } a.input-button:hover { background: #eee; } a.input-button svg { width: 16px; height: 16px; } svg path { fill: inherit; } @media screen and (max-width: 767px) { .title {margin-left: 0; font-size: 1.8em;} }