@font-face {
    font-family: icomoon;
    src: url(../font/GroupeMutuel/groupemutuel.ttf) format("truetype"), url(../font/GroupeMutuel/groupemutuel.woff) format("woff"), url(../font/GroupeMutuel/groupemutuel.svg) format("svg");
    font-weight: 400;
    font-style: normal;
    font-display: block;
    font-display: swap;
}

  .BlocImage {
background: url(../img/gma/background_06.jpg) no-repeat top 35% center;
background-size: cover;
}

  header .app_icon {
display: none;
background: url(../img/gma/logo_app_gmnet.svg) no-repeat;
background-size: contain;
height: 21px;
margin-top: 40px;
}

  .image-bottom-edge {
display: none;
}

  .header-banner {
background: #fff1d6;
clip-path: ellipse(124% 100% at 50% 0%);
}

  .MainPanel {
background: #fff1d6;
box-shadow: 0px -100px 0px 0px rgb(255, 241, 214);
max-width: 1400px;
margin: 0 auto;
}

  .labelInputWrapper {
display: inline !important;
float: left;
width: 33%;
}

  .labelInputWrapper label {
display: flex !important;
padding: 0 0 8px 16px;
}

  footer {
height: 125px;
}

  footer .adresse {
font-weight: bold;
color: #005262;
}

  .uap-input {
float: none;
width: 85%;
}

  .uap-button {
width: 33%;
background-color: #beced4;
margin: 24px 0 !important;
padding: 15px 30px;
}

  .uap-button:hover {
background-color: #447684;
}

  .gm-app {
display: flex;
gap: 84px;
padding: 32px;
margin: 56px 164px;
}

  .gm-app .gm-app-logo {
padding: 0 24px;
max-height: 158px;
box-shadow: 2px 4px 8px 2px rgba(47, 47, 47, 0.3);
border-radius: 8px;
}

  .gm-app .gm-app-title {
font-family: ABCGintoNord-Medium, serif;
color: #003d4c;
font-size: 1.25rem;
padding-bottom: 24px;
}

  .gm-app .gm-app-subtitle {
color: #003d4c;
font-size: 1rem;
padding-bottom: 32px;
}

  .gm-app .gm-app-links {
display: flex;
align-items: center;
gap: 8px;
}

  .gm-app .gm-app-appStore img {
width: 158px;
}

  .gm-app .gm-app-googlePlay img {
width: 172px;
border-radius: 8px;
}

  .promo-services {
text-align: center;
background: #fff1d6;
width: 100%;
padding: 0 0 48px 0;
}

  .promo-services .promo-services-title {
font-family: ABCGintoNord-Medium, serif;
color: #003d4c;
font-size: 24px;
line-height: 45px;
}

  .promo-services .promo-services-list {
margin: 4px auto;
list-style: none;
display: table;
}

  .promo-services .promo-services-list li {
text-align: left;
position: relative;
margin-top: 18px;
padding-left: 36px;
width: 100%;
font-size: 16px;
line-height: 22px;
font-family: Roboto, sans-serif;
color: #003d4c;
font-weight: 400;
}

  .promo-services .promo-services-list li::before {
content: "\e917";
position: absolute;
left: 3px;
top: 2px;
width: 18px;
height: 18px;
font-size: 18px;
line-height: 18px;
color: #f2a900;
font-family: icomoon !important;
}

  .promo-services .uap-promo-button {
float: none;
line-height: normal;
}

  .help-message {
display: inline-block;
font-family: ABCGintoNord-Medium, serif;
position: initial;
left: auto;
transform: none;
padding: 4px 0 0 0;
}

  /* service - header */
  .service-header {
display: block;
background: #003d4c;
}

  .BlocImage {
width: 65%;
}

  .service-header .service-header-data {
padding: 40px;
}

  .service-header-data .subtitle {
color: #fff;
padding-top: 16px;
font-size: 1rem;
}

  .service-header .service-header-data h3 {
font-family: ABCGintoNord-Medium, serif;
font-size: 36px;
color: #fff;
}

  .service-header .service-header-data .uap-button-secondary {
background: #fab600;
color: #003341;
}

  /* services */
  .services {
margin-top: -60px;
}

  .services .HeaderContent {
padding: 0;
}

  .services .Icone.icon1 {
background: url(../img/gma/PictoGM-Fusee.svg) no-repeat;
}

  .services .Icone.icon2 {
background: url(../img/gma/icon_mouse.svg) no-repeat;
}

  .services .Icone.icon3 {
background: url(../img/gma/PictoGM-Lunettes.svg) no-repeat;
}

  /* PASSWORD_CHANGE */
  .PASSWORD_CHANGE .help-message, .help-message .ui-accordion .ui-accordion-header {
margin-bottom: 24px;
}

  .PASSWORD_CHANGE .labelInputWrapper {
display: inline-block !important;
float: none;
width: 40%;
}

  .PASSWORD_CHANGE .labelInputWrapper label {
padding: 0 0 8px 26px;
}

  .PASSWORD_CHANGE .login-form .buttons {
display: flex;
width: 55%;
margin: 0 auto;
flex-direction: column-reverse;
}

  .PASSWORD_CHANGE .login-form .buttons #uap-cancel-button {
margin: 12px 0 24px 0 !important;
}

  .PASSWORD_CHANGE .login-form .buttons #uap-submit-button {
margin: 12px 0 0 0 !important;
}

  /* service - footer */
  .BlocServiceFooter {
width: 100%;
height: 440px;
display: inline-flex;
background-image: #fff;
}

  .service_footer_gradient {
width: calc((100% - 1400px) / 2);
height: 440px;
background-image: linear-gradient(260deg, #ffffff 100%, #ffffff 100%);
float: left;
}

  .service_footer_image {
width: 620px;
height: 440px;
background: url(../img/gma/background_04.jpg) no-repeat;
background-size: cover;
background-position-x: right;
float: left;
transform: scaleX(-1);
}

  .service_footer_contents {
position: relative;
width: 780px;
height: 440px;
float: left;
background-color: #eef2f4;
}

  .service_footer_data {
width: 90%;
margin: 0;
position: absolute;
top: 55%;
left: 25%;
transform: translate(-20%, -55%);
}

  .service_footer_data h3 {
font-family: ABCGintoNord-Medium, serif;
font-size: 28px;
color: #003d4c;
margin-bottom: 24px;
}

  .service_footer_contact {
width: 100%;
margin: 0;
position: absolute;
bottom: 10%;
line-height: 1.2em;
}

  .service_footer_data p, .service_footer_contact p {
font-size: 16px;
color: #003d4c;
margin-top: 10px;
line-height: 20px;
}

  .contact-form-link {
font-family: ABCGintoNord-Medium, serif;
color: #003d4c;
}

  .underline {
text-decoration: underline;
}

  .goto-customer-area {
font-weight: bold;
margin-top: 24px !important;
}

  .uap-button-secondary {
float: left;
width: 250px;
margin-top: 40px !important;
background-color: #003d4c;
border: unset;
}


  @media only screen and (max-width: 1400px) {
     .service-header .service-header-data h3 {
     font-size: 36px;
}

     .service_footer_data h3 {
     font-size: 32px;
}

     .service-header-data .subtitle {
     color: #fff;
     padding-top: 16px;
     font-size: 1rem;
}
}

  @media only screen and (max-width: 1000px) {
     #main-panel {
     min-height: 300px;
     max-width: 575px;
}

     footer {
     height: 160px;
}

     .PASSWORD_CHANGE .labelInputWrapper {
     float: unset;
     width: 45%;
}

     .MainPanel {
     box-shadow: 0px -150px 0px 0px rgb(255, 241, 214);
}

     .gm-app {
     margin: unset;
}

     .FORGET_PASSWORD_REQUEST .buttons {
     display: inline;
}

     .FORGET_PASSWORD_REQUEST .buttons input {
     margin-top: 24px !important;
}

     .FORGET_PASSWORD_REQUEST .help-message {
     padding: 12px 0 32px 0;
}

     #nav_menu #navMenuLogo {
     display: none;
     background: url(../img/gma/logo_app_gmnet.svg) no-repeat center;
     background-size: contain;
     height: 21px;
}

     /* service - header */
     .header-banner {
     flex-direction: column-reverse;
     clip-path: ellipse(100% 100% at 51% 0%);
}

     .service-header {
     width: 100%;
}

     .BlocImage {
     width: 100%;
     height: 350px;
}

     .service-header .service-header-data h3 {
     font-size: 34px;
}

     /* service - footer */
     .BlocServiceFooter {
     height: unset;
}

     .service_footer_gradient {
     display: none;
}

     .service_footer_image {
     width: 100%;
     height: 325px;
     display: block;
     float: left;
}

     .service_footer_contents {
     width: 100%;
     height: 305px;
     display: block;
     float: left;
     background: #eef2f4;
}

     .service_footer_data {
     width: unset;
     position: unset;
     top: unset;
     left: unset;
     transform: unset;
     padding: 30px;
     display: flex;
     flex-direction: column;
}

     .service_footer_data h3 {
     color: #003d4c;
     max-width: 100%;
     font-size: 32px;
}

     .service_footer_contact {
     width: unset !important;
     position: unset !important;
     top: unset !important;
     left: unset !important;
     transform: unset !important;
     padding-left: 10px;
     padding-right: 10px;
     display: flex !important;
     justify-content: center !important;
}

     .service_footer_data p, .service_footer_contact p {
     color: #003d4c !important;
     max-width: 100% !important;
}
}

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

     .service-header {
     height: 450px;
}

     .BlocServiceFooter {
     height: 590px !important;
     display: block !important;
     margin-bottom: 40px;
}

     .PASSWORD_CHANGE .help-message .ui-accordion .ui-accordion-content {
     top: 42px
}

     .PASSWORD_CHANGE .labelInputWrapper {
     width: 100% !important;
}

     .PASSWORD_CHANGE .login-form .buttons {
     width: 85%;
}

     .service-header .service-header-data h3 {
     font-size: 30px;
}

     .service_footer_data h3 {
     font-size: 18px;
}
}

  @media only screen and (max-width: 480px) {
     .header-banner {
     clip-path: none !important;
}

     .BlocImage {
     height: 156px !important;
}

     .FormContentTitre {
     font-size: 24px;
}

     .promo-services .promo-services-title {
     font-size: 18px;
     line-height: 24px;
}

     .help-message {
     padding: 12px 0;
}

     .PASSWORD_CHANGE .help-message .ui-accordion .ui-accordion-content {
     top: 42px
}

     .PASSWORD_CHANGE .labelInputWrapper {
     width: 100% !important;
}

     .PASSWORD_CHANGE .labelInputWrapper label {
     padding: 0 0 8px 16px;
}

     .PASSWORD_CHANGE .login-form .buttons {
     width: 92%;
}

     .promo-services-list {
     padding-right: 32px;
     width: 80%;
}

     .gm-app {
     display: block;
     padding: 24px;
     margin: 24px auto;
     text-align: center;
}

     .gm-app-logo {
     margin: 24px 0 24px 0;
     padding: 24px;
}

     .labelInputWrapper {
     float: unset;
}

     .uap-input {
     width: 88%;
}

     .uap-button {
     width: unset;
}

     .service_footer_data {
     padding: 24px 12px;
}

     .service_footer_image {
     height: 325px;

}
}

  @media only screen and (max-width: 320px) {
     .service-header {
     height: 495px;
}
}