/*
 * GENERATION FICHIER par sass
 * => .\scss\PageErreur.scss
 *
 * !!! Ne pas modifier ce fichier !!!
 */
/**/ html {
/**/   font-size: 62.5%;
/**/ }
/**/
/**/ html,
/**/ body {
/**/   height: 100%;
/**/   width: 100%;
/**/ }
/**/
/**/ body {
/**/   font-family: "Montserrat", "Segoe UI", Tahoma, Geneva, sans-serif;
/**/   max-height: 100%;
/**/ }
/**/
/**/ body,
/**/ h1,
/**/ h2 {
/**/   margin: 0;
/**/   padding: 0;
/**/ }
/**/
/**/ main {
/**/   --color-theme: #005734;
/**/   display: flex;
/**/   flex-direction: column;
/**/   height: 100%;
/**/   background-repeat: no-repeat;
/**/   background-size: cover;
/**/ }
/**/
/**/ main h1,
/**/ main h2 {
/**/   flex: 1 1 auto;
/**/ }
/**/
/**/ main h1 {
/**/   font-weight: 600;
/**/   font-size: 2.4rem;
/**/ }
/**/
/**/ main h2 {
/**/   --size: 3.2rem;
/**/   height: var(--size);
/**/ }
/**/
/**/ main h2 span {
/**/   display: none;
/**/ }
/**/
/**/ main h2:before {
/**/   content: "";
/**/   display: block;
/**/   height: var(--size);
/**/   background-size: contain;
/**/   background-repeat: no-repeat;
/**/   background-position-x: right;
/**/ }
/**/
/**/ header {
/**/   display: flex;
/**/   align-items: center;
/**/   justify-content: space-between;
/**/   padding: 0.8rem 1.6rem;
/**/   background-color: rgba(255, 255, 255, 0.8);
/**/   z-index: 10;
/**/ }
/**/
/**/ .content {
/**/   flex: 1 1 auto;
/**/   display: flex;
/**/ }
/**/
/**/ .img-container,
/**/ .message-container {
/**/   flex: 1 1 auto;
/**/   width: 50%;
/**/   display: flex;
/**/   flex-direction: column;
/**/   justify-content: center;
/**/   z-index: 10;
/**/ }
/**/
/**/ .img-container {
/**/   align-items: center;
/**/   padding-left: 1.6rem;
/**/ }
/**/
/**/ .img-container .player {
/**/   width: 70%;
/**/   height: auto;
/**/ }
/**/
/**/ .message-container {
/**/   align-items: flex-start;
/**/   padding: 0 3.2rem;
/**/ }
/**/
/**/ .message-container .details {
/**/   background: inherit;
/**/   padding: 1.6rem;
/**/   background-color: rgba(255, 255, 255, 0.2);
/**/   backdrop-filter: blur(3px);
/**/   width: calc(100% - 3.2rem);
/**/   border-top: solid 1px;
/**/   border-left: solid 1px;
/**/   border-image: linear-gradient(0.48turn, rgba(0, 0, 0, 0.07), transparent) 20;
/**/ }
/**/
/**/ .message-container .details h3 {
/**/   font-size: 3.6rem;
/**/   font-weight: 600;
/**/   margin: 0.8rem 0;
/**/   color: var(--color-theme);
/**/ }
/**/
/**/ .message-container .details p {
/**/   font-size: 2.2rem;
/**/   max-width: 72rem;
/**/ }
/**/
/**/ @media screen and (max-width: 720px) {
/**/   main {
/**/     background: none !important;
/**/   }
/**/   main header {
/**/     flex-direction: column-reverse;
/**/     justify-content: center;
/**/     gap: 0.4rem;
/**/   }
/**/   main header h1 {
/**/     font-size: 1.6rem;
/**/   }
/**/   main header h2 {
/**/     width: 100%;
/**/   }
/**/   main header h2:before {
/**/     background-position-x: center;
/**/   }
/**/   main .content {
/**/     flex-direction: column-reverse;
/**/     flex: 0 1 auto;
/**/   }
/**/   main .img-container,
/**/ main .message-container {
/**/     width: 100%;
/**/     align-items: center;
/**/     padding: 0;
/**/   }
/**/   main .img-container .player {
/**/     min-width: 0;
/**/     width: 80%;
/**/     height: auto;
/**/   }
/**/   main .message-container .details {
/**/     background-color: transparent;
/**/     text-align: center;
/**/     border: none;
/**/     padding: 3.2rem 1.6rem 1.6rem;
/**/     margin-bottom: 1.6rem;
/**/     width: auto;
/**/   }
/**/   main .message-container .details h3 {
/**/     font-size: 2rem;
/**/     margin: 1.6rem auto;
/**/   }
/**/   main .message-container .details p {
/**/     font-size: 1.6rem;
/**/     font-weight: 500;
/**/     max-width: auto;
/**/   }
/**/ }
/*
 * GENERATION FICHIER par sass
 * => .\scss\PageErreur.scss
 *
 * !!! Ne pas modifier ce fichier !!!
 */