<style type="text/css">.breadcrumb { left: 1em; top: 0; z-index: 5 } .breadcrumb .chevron { padding: 5px 7px } .breadcrumb .home-icon { padding-left: 10px }.img-container img { max-height: 50px; width: auto } .fs36 { font-size: 36px }.diblock { display: inline-block }.corange { color: #ef7d00 }.lh40 { line-height: 40px }.p8 { padding: 8px } .ptb-1p25em { padding-bottom: 1.25em; padding-top: 1.25em } .mb-0p5em { margin-bottom: .5em !important } .mb-1em { margin-bottom: 1em !important } .mb-2em { margin-bottom: 2em !important }.mt-1em { margin-top: 1em !important } .mlr-1em { margin-left: 1em !important; margin-right: 1em !important }div[class*=background-color] { height: 100%; left: 0; mix-blend-mode: multiply; position: absolute; top: 0; width: 100%; z-index: 0 } .background-color-orange { background: #ef7d00 } .frame-title { font-style: normal; padding: 1em 0 } .frame-title:after, .frame-title:before { border-bottom: solid #354161; display: inline-block; vertical-align: middle; width: 100% } .frame-title:before { margin-left: -100%; margin-right: 1em } .frame-title:after { margin-left: 1em; margin-right: -100% } .frame-title:after, .frame-title:before { border-bottom: 1px solid #000; content: ""; flex: 1 1; margin: auto } .frame-title:before { margin-right: 10px } .frame-title:after { margin-left: 10px } .mes-informations, .mon-activite, .reset-password { background-color: #fff; box-shadow: 0 4px 10px rgba(0, 0, 0, .2); margin: auto auto 138px; max-width: calc(1280px + 1em); padding: 24px 60px; width: 100% } .registration-form-container li { gap: 1.5em 0; margin-bottom: 1.5em } .file-input-container>div { display: flex; flex-direction: column; max-width: 550px; position: relative; width: 100% } .registration-form-container label, [class*=form-container] label { display: inline-block; margin-bottom: 4px } .registration-form-container select, [class*=form-container] select { border: 1px solid #605757; border-radius: 8px; box-shadow: 0 1px 2px rgba(0, 0, 0, .05); color: #354161; height: 50px; max-width: 550px; padding: 1em; width: 100% } .file-input-container>div { display: inline-flex; justify-content: center } .file-input-container input[type=file] { display: none } .file-input-container>span { margin-bottom: 4px } .file-input-container label { border: 1px solid #605757; border-radius: 8px; color: #354161; max-width: 550px; padding: 1em; width: 100% } .file-input-container img { right: 1em; top: 1em } [id$=_socialMediaProfiles] { display: flex; flex-wrap: wrap; gap: 2em } .registration-form-container li.social-media-li>div, [class*=form-container] li.social-media-li>div { display: block; max-width: unset } div.hidden { display: none } [id$=_typologieStructure] label { padding: .5em } [id$=_typologieStructure] { background-color: #fff; border-radius: 8px; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05), 0 0 0 1px rgba(0, 0, 0, .05); display: none; flex-direction: column; max-height: 150px; overflow-y: scroll; top: 4.6em; width: 100%; z-index: 2 } .note-container>div { max-width: unset !important } .note-container textarea { border-color: #d7d8dd; height: 122px } .CTA.center { margin-left: auto; margin-right: auto } .container.registration { height: 1550px } .header-cont { padding: 0 1em } .header-cont, .mes-informations>*, .mon-activite>*, .reset-password>* { margin: 0 auto; max-width: 384px; width: 100% } .mes-informations, .mon-activite, .reset-password { box-shadow: unset; position: absolute; right: 0 } .mes-informations.in { right: 0 } .mes-informations { right: 500%; z-index: 1 } .mon-activite { right: 500%; z-index: 2 } .reset-password { right: 500%; z-index: 3 } form[name=registration] { width: 45% } form[name=registration] button[type=submit] { width: 100% } .registration-form-container { height: 1130px; position: relative } .container.registration .img-container { height: 1358px; width: 55% } .container.registration .img-container img { height: 100%; max-height: unset; object-fit: cover; width: 100% } #previous1, #previous2 { background: unset; border: unset; right: 0; text-decoration: underline; top: -1.5em } #registration_note { max-height: 200px; max-width: 384px; overflow-y: scroll } #registration_note::-webkit-scrollbar { width: 12px } #registration_note::-webkit-scrollbar-thumb { border: solid transparent; -webkit-border-radius: 5px; -webkit-border-bottom-right-radius: 26px 6px; -webkit-border-top-right-radius: 26px 6px; border-width: 0 8px 0 0; -webkit-box-shadow: inset 0 0 0 1px #e1e2e6, inset 0 0 0 6px #e1e2e6; height: 60px } #registration_note::-webkit-scrollbar-track-piece { margin: 4px } .terms { gap: unset !important } .terms>div { flex-direction: row !important } .terms input { margin-right: 8px; width: 20px } #registration_visibleAnnuaire #registration_visibleAnnuaire_1 { margin-left: 40px } #registration_visibleAnnuaire input { width: 20px } .showpass { background-color: unset; border: none; bottom: 14px; height: 16px; right: 0 } .showpass svg path { fill: grey } [class*="form-container"] input:not([type="radio"], [type="checkbox"]), [class*="form-container"] select, .registration-form-container input:not([type="radio"], [type="checkbox"]), .registration-form-container select {color: #354161;height: 50px;width: 100%;max-width: 550px;padding: 1em;border-radius: 8px;border: 1px solid #605757;box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05)}@media screen and (max-width:1229px) { .mes-informations>*, .mon-activite>*, .reset-password>* { margin: 0 auto; max-width: 550px; width: 100% } } @media screen and (max-width:1024px) { .container>.img-container, form[name=registration] { width: 50% } } @media screen and (max-width:892px) { form[name=registration] { width: 70% } .container>.img-container { width: 30% } }@media screen and (max-width:768px) { form[name=registration] { width: 100% } .container>.img-container { display: none; width: 0 } .mes-informations, .mon-activite, .reset-password { padding: 24px } }@media screen and (max-width:768px) { .mes-informations, .mon-activite, .reset-password { padding: 24px } } @media screen and (max-width:480px) { .registration-form-container select, [class*=form-container] select { height: 40px; padding: .5em } } @media screen and (max-width:480px) { .registration-form-container select, [class*=form-container] select { height: 40px; padding: .5em } .file-input-container label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap } } </style>