/*******************************************************************************************************************************/
/* DEBUT DU FICHIER                                                                                                            */
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/* Nom         : index.css                                                                                                     */
/* Auteur      : Nicolas Dagnas                                                                                                */
/* Description : Implémentation des styles                                                                                     */
/* Créé le     : 09/08/2025                                                                                                    */
/* Modifié le  : 24/03/2026                                                                                                    */
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*                                                                                                                             */
/*  # #                                                                                                                        */
/*   #                                                                                                                         */
/*  # #                                                                                                                        */
/*                                                                                                                             */
/*******************************************************************************************************************************/
* { box-sizing: border-box }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*   ###                                                                                                                       */
/*  #   #                                                                                                                      */
/*  #####                                                                                                                      */
/*  #   #                                                                                                                      */
/*  #   #                                                                                                                      */
/*******************************************************************************************************************************/
a         { color: #FBCE8B                             }
a:link    { color: #FBCE8B; text-decoration: none      }
a:active  { color: #FBCE8B; text-decoration: none      }
a:visited { color: #FBCE8B; text-decoration: none      }
a:hover   { color: #FBCE8B; text-decoration: underline }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
a.link-button span
 {
 color           : #323232     ;
 display         : inline-block;
 padding         : 8px 28px    ;
 min-height      : 40px        ;
 border-radius   : 6px         ;
 background-color: #FF9900     ;
 font-weight     : 600         ;
 }
a.link-button:hover  span { background-color: #FFAA32 }
a.link-button:active span { background-color: #CC7A00 }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*  #   #                                                                                                                      */
/*  #   #                                                                                                                      */
/*  #####                                                                                                                      */
/*  #   #                                                                                                                      */
/*  #   #  ##  ##  ##                                                                                                          */
/*******************************************************************************************************************************/
h1, h2, h3, h4, h5, h6 { margin-top: 0; font-weight: 500; line-height: 1.2; }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*  #####   ###   #   #  #####                                                                                                 */
/*  #      #   #  ##  #    #                                                                                                   */
/*  ###    #   #  # # #    #                                                                                                   */
/*  #      #   #  #  ##    #                                                                                                   */
/*  #       ###   #   #    #                                                                                                   */
/*******************************************************************************************************************************/
font { color: #EDBB76 }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*  #   #  #####  #   #  #                                                                                                     */
/*  #   #    #    ## ##  #                                                                                                     */
/*  #####    #    # # #  #                                                                                                     */
/*  #   #    #    #   #  #                                                                                                     */
/*  #   #    #    #   #  #####                                                                                                 */
/*******************************************************************************************************************************/
html { font-size: 62.5%;  }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*  ####    ###   ####   #   #                                                                                                 */
/*  #   #  #   #  #   #   # #                                                                                                  */
/*  ####   #   #  #   #    #                                                                                                   */
/*  #   #  #   #  #   #    #                                                                                                   */
/*  ####    ###   ####     #                                                                                                   */
/*******************************************************************************************************************************/
body
 {
 color           : #FFEED8                     ;
 width           : 100%                        ;
 margin          : 0                           ;
 padding         : 8px                         ;
 display         : block                       ;
 background-color: #254372                     ;
 font-family     : Arial, Helvetica, sans-serif;
 }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
body.ie      { -ms-text-size-adjust    : none }
body.webkit  { -webkit-text-size-adjust: none }
body.mozilla { -moz-text-size-adjust   : none }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*  ####   #  #   #      ####    ###   ####   #   #                                                                            */
/*  #   #  #  #   #      #   #  #   #  #   #   # #                                                                             */
/*  #   #  #  #   #      ####   #   #  #   #    #                                                                              */
/*  #   #  #   # #       #   #  #   #  #   #    #                                                                              */
/*  ####   #    #    ##  ####    ###   ####     #                                                                              */
/*******************************************************************************************************************************/
div.body
 {
 padding         : 4px    ;
 display         : block  ;
 max-width       : 1000px ;
 margin-left     : auto   ;
 margin-right    : auto   ;
 border-radius   : 10px   ;
 background-color: #1D3459;
 }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body > * { margin-bottom: 24px; }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*  #   #  ####                                                                                                                */
/*  #   #  #   #                                                                                                               */
/*  #####  ####                                                                                                                */
/*  #   #  #   #                                                                                                               */
/*  #   #  #   #                                                                                                               */
/*******************************************************************************************************************************/
div.body > hr
 {
 border     : 0        ;
 height     : 1.5em    ;
 margin     : 30px 15px;
 position   : relative ;
 font-size  : 20px     ;
 text-align : center   ;
 line-height: 1em      ;
 }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body > hr::before
 {
 left      : 0                                                         ;
 top       : 50%                                                       ;
 width     : 100%                                                      ;
 height    : 1px                                                       ;
 content   : ""                                                        ;
 position  : absolute                                                  ;
 background: linear-gradient(to right, transparent, white, transparent);
 }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body > hr::after
 {
 color           : #EDBB76           ;
 content         : attr(data-content);
 padding         : 0 7px             ;
 position        : relative          ;
 line-height     : 1.5em             ;
 background-color: #1D3459           ;
 }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*  #  #   #   ###                                                                                                             */
/*  #  ## ##  #   #                                                                                                            */
/*  #  # # #  #                                                                                                                */
/*  #  #   #  #   ##                                                                                                           */
/*  #  #   #   ### #                                                                                                           */
/*******************************************************************************************************************************/
div.body img
 { display: block; text-align: center; margin-left: auto; margin-right: auto; border-radius: 8px; margin-bottom: 32px }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*  ####                                                                                                                       */
/*  #   #                                                                                                                      */
/*  ####                                                                                                                       */
/*  #                                                                                                                          */
/*  #                                                                                                                          */
/*******************************************************************************************************************************/
div.body .center { text-align : center; margin-left: auto; margin-right: auto }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body .title { padding: 12px 18px; font-size: 28px; border-radius: 8px; margin-bottom: 32px; background-color: #14233D }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body .subtitle { font-size: 22px; margin-left: 20px; margin-right: 20px; line-height: 24px; margin-bottom: 32px }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body .content { font-size: 18px; margin-left: 20px; margin-right: 20px; line-height: 24px }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body ul.content { font-size: 18px; margin-left: 20px; margin-right: 20px; line-height: 26px }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body .question
 {
 color        : #EDBB76;
 display      : flex   ;
 font-size    : 20px   ;
 margin-left  : 20px   ;
 margin-right : 20px   ;
 line-height  : 24px   ;
 margin-bottom: 12px   ;
 }
div.body .question span:last-child { padding-left: 1px; text-indent: -1px }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body .answer { font-size: 18px; margin-left: 28px; margin-right: 20px; line-height: 24px; margin-bottom: 24px }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body .big-content { font-size: 20px; line-height: 24px }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body .section { font-size: 22px; line-height: 24px; margin-left: 12px }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.body .footer
 {
 padding         : 6px 12px;
 font-size       : 14px    ;
 line-height     : 22px    ;
 border-radius   : 8px     ;
 margin-bottom   : 0       ;
 background-color: #14233D ;
 }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*   ####  #####   ###   #####  #   ###   #   #      #   ###                                                                   */
/*  #      #      #   #    #    #  #   #  ##  #      #  #   #                                                                  */
/*   ###   ###    #        #    #  #   #  # # #      #  #####                                                                  */
/*      #  #      #   #    #    #  #   #  #  ##      #  #   #                                                                  */
/*  ####   #####   ###     #    #   ###   #   #  ##  #  #   #                                                                  */
/*******************************************************************************************************************************/
section.ia { display: none }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/*  ####       #   #  #  ####   #####   ###                                                                                    */
/*  #   #      #   #  #  #   #  #      #   #                                                                                   */
/*  ####       #   #  #  #   #  ###    #   #                                                                                   */
/*  #           # #   #  #   #  #      #   #                                                                                   */
/*  #      ##    #    #  ####   #####   ###                                                                                    */
/*******************************************************************************************************************************/
/* padding-bottom : ratio 16:9 (9/16 = 0.5625 ? ajusté pour 95%) */
.video
 {
 height        : 0       ;
 width         : 95%     ;
 position      : relative;
 max-width     : 600px   ;
 margin-left   : auto    ;
 margin-right  : auto    ;
 margin-bottom : 24px    ;
 padding-bottom: 52%     ;
 }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.video iframe { top: 0; left: 0; width: 100%; height: 100%; border: 0; position: absolute }
/*******************************************************************************************************************************/

/*******************************************************************************************************************************/
/* Fin du fichier                                                                                                              */
/*******************************************************************************************************************************/
