

/* CSS Code */
/* Tribute and many thanks to W3Schools.com, stackoverflow.com , developer.mozilla.org
and so many helpfull tips and advices from users all around the web. */

/* PC SETTINGS START */

:root {
  --desktop-display-scale: 1;
  --desktop-viewport-width: 100vw;
  --desktop-viewport-height: 100vh;
  --desktop-width-1: 1vw;
  --desktop-width-20: 20vw;
  --desktop-height-20: calc((20vw * 56.25) / 100);
  --desktop-width-30: 30vw;
  --desktop-height-30: calc((30vw * 56.25) / 100);
  --desktop-width-40: 40vw;
  --desktop-width-40-5: 40.5vw;
  --desktop-width-61: 61vw;
}

html:active {cursor: url("img/cursor_clic.webp"), default;}
html::-webkit-scrollbar {display:none;}
html {
  cursor: url("img/cursor.webp"), default; will-change: cursor;
  -webkit-transform:translate3d(0,0,0);
  width: var(--desktop-viewport-width);
  min-width: 640px;
  height: var(--desktop-viewport-height);
  margin: 0;
  display: flex;
  justify-content: center;
  background-color: transparent;
  -webkit-touch-callout: none;
  -moz-touch-callout: none;
  -ms-touch-callout: none;
  -o-touch-callout: none;
  touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  z-index: 1;}

body {
  position: relative;
  display: flex;
  column-gap: 8px;
  width: var(--desktop-viewport-width);
  min-width: 640px;
  max-width: 1920px;
  height: var(--desktop-viewport-height);
  margin: 0;
  background-color: transparent;
  text-align: center;
  pointer-events: auto;
  overflow-y: hidden;
  z-index: 1;}

/*@media only screen and (min-height: 1920px) and (max-height: 800px){
.PROJ_ORD_div_contact {left: 0px; position: relative; width: 100%;}}*/

@font-face {
  /* Created using https://fontstruct.com/ */
  font-family: Pixelus_Maximus;
  src: url(fonts/Pixelus_Maximus.ttf) format('truetype');
  font-display: swap;}

a, p, ul, li, ol {
  font-family: Pixelus_Maximus;
  font-size: 8px;
  font-style: none;
  font-weight: normal!important;
  font-kerning: normal;
  font-synthesis: none;
  font-variant: normal;
  font-optical-sizing: none;
  font-feature-settings: normal;
  font-size-adjust: none;
  font-variation-settings: normal;
  text-decoration: none!important;
  text-transform: none;
  color: inherit;}
ol, ul, li {list-style: none;}
p {padding: 0; margin: 0;}
a:link, p:link {
  text-decoration: none!important;
  cursor: url("img/cursor_clic.webp"), default;}
.invisible_txt {color: transparent;}

.pointer_div {
  position: fixed;
  background-color: transparent;
  transform: translate(-50%, -50%);
  opacity: 1;
  z-index: 3;
  pointer-events: none;}
.pointer_clic {
  filter: saturate(1);
  filter: invert(0);}
.pointer_div .pointer_fade {
  opacity: 0;
  transition: opacity 0s ease-in-out;}

.settings_div {position: absolute; display: none; opacity: 0;}

/* SETTINGS END */

/* LOADING START */ 
.LOADING_div1 {
  z-index: 1000;
  position: absolute;
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  top: -8px;
  left: -8px;
  width: calc(100% + 8px);
  height: calc(100% + 8px);
  padding: 0;
  margin: 0;
  background-color: rgba(000, 000, 000, .93);
  opacity: 1;
  pointer-events: none;
  background-image: url("media/the_white_stripes.png");
  background-repeat: repeat;
  background-size: 8px 8px;
  background-position: 50% 50%;
  -webkit-transition: opacity 1.0s;
  -moz-transition: opacity 1.0s;
  -o-transition: opacity 1.0s;
  transition: opacity 1.0s;}
.LOADING_video {
  z-index: 1001;
  position: absolute;
  display: block;
  background-image: url("media/loading_screen_w.webp");
  background-repeat: repeat;
  background-size: 321px 208px;
  background-position: 50% 50%;
  width: 100%;
  height: 100%;
  opacity: 0.5;}
.LOADING_div2 {
  z-index: 1002;
  position: fixed;
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  width: 321px;
  height: 208px;
  padding: 0;
  margin: 0;
  pointer-events: none;
  border-radius: 4px;
  opacity: 1;
  border: 2px solid white;
  background-image: url("media/loading_flood.webp");
  background-repeat: no-repeat;
  background-size: 321px 208px;
  background-position: 50% 50%;
  overflow: hidden;}
.LOADING_div2 a {
  z-index: 1003;
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  color: white;
  width: 100%;
  height: 100%;
  pointer-events: all;}

/* LOADING END */

/* TABLOID START */
.TAB1 {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-content: flex-start;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  flex-grow: 0;
  row-gap: 24px;
  column-gap: 8px;
  top: 48px;
  left: 0;
  width: 296px;
  min-width: 296px;
  height: calc(var(--desktop-viewport-height) - 104px);
  arc_background-color: rgba(106, 188, 237, 1);
  background: radial-gradient(circle at center, #94cbeb , #6abced);
  border-radius: 4px;
  margin: 0;
  margin-left: 8px;
  margin-top: 8px;
  margin-bottom: 8px;
  padding: 8px;
  padding-top: 32px;
  overflow-y: scroll;
  opacity: 1;
  z-index: 1;
  order: 1;
  -webkit-scrollbar-width: none;
  -moz-scrollbar-width: none;
  -ms-scrollbar-width: none;
  -o-scrollbar-width: none;
  scrollbar-width: none;}
.TAB1::-webkit-scrollbar {display:none;}

.TAB2 {
  position: relative;
  display: inline-flex;
  justify-content: flex-start;
  align-content: flex-start;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  flex-grow: 1;
  row-gap: 24px;
  column-gap: 8px;
  top: 48px;
  left: 0;
  width: auto;
  height: calc(var(--desktop-viewport-height) - 104px);
  arc_background-color: rgba(106, 188, 237, 1);
  background: radial-gradient(circle at center, #94cbeb , #6abced);
  border-radius: 4px;
  margin: 0;
  margin-right: 8px;
  margin-top: 8px;
  margin-bottom: 8px;
  padding: 8px;
  padding-top: 32px;
  overflow-y: scroll;
  opacity: 1;
  z-index: 1;
  order: 2;
  -webkit-scrollbar-width: none;
  -moz-scrollbar-width: none;
  -ms-scrollbar-width: none;
  -o-scrollbar-width: none;
  scrollbar-width: none;}
.TAB2::-webkit-scrollbar {display:none;}

.TAB3 {
  position: relative;
  display: none;
  justify-content: center;
  align-content: flex-start;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  flex-grow: 0;
  row-gap: 8px;
  column-gap: 10px;
  top: 48px;
  left: 0;
  width: 416px;
  min-width: 416px;
  max-width: 416px;
  height: calc(var(--desktop-viewport-height) - 92px);
  arc_background-color: rgba(106, 188, 237, 1);
  background: radial-gradient(circle at center, #94cbeb , #6abced);
  border-radius: 4px;
  margin: 0;
  margin-left: 8px;
  margin-top: 8px;
  margin-bottom: 8px;
  padding: 8px;
  padding-top: 20px;
  overflow-y: scroll;
  opacity: 1;
  z-index: 1;
  order: 1;
  -webkit-scrollbar-width: none;
  -moz-scrollbar-width: none;
  -ms-scrollbar-width: none;
  -o-scrollbar-width: none;
  scrollbar-width: none;}
.TAB3::-webkit-scrollbar {display:none;}

.BOT_hider {
  position: fixed;
  display: inline-block;
  background-color: rgba(106, 188, 237, 1);
  margin: 0;
  padding: 0;
  bottom: 8px;
  border-radius: 0 0 4px 4px;
  height: 8px;
  z-index: 900;}
.BH_T1 {
  width: calc(296px + 16px);
  min-width: calc(296px + 16px);
  left: 8px;}
.BH_T3 {
  width: calc(296px + 16px);
  min-width: calc(296px + 16px);
  left: 8px;}
.BH_T2 {
  xbackground: linear-gradient(0deg, #6abced 0%, rgba(106, 188, 237, 0) 100%);
  xheight: 16px;
  width: calc(var(--desktop-viewport-width) - (296px + 40px));
  min-width: calc(var(--desktop-viewport-width) - (296px + 40px));
  right: 8px;}
/* TABLOID END */

/* BANNER START */
.BANNER_div {
  position: absolute;
  top: 0; left: 0;
  display: flex;
  align-content: center;
  justify-content: center;
  align-items: center;
  width: calc(100% - 16px);
  arc_background-color: rgba(128, 128, 128, 0.07);
  background: radial-gradient(circle at center, rgba(148, 203, 235, 1), rgba(106, 188, 237, 1));
  border-radius: 4px;
  min-width: 624px;
  height: 24px; /* Banner_Total-height: 40px */ /* Banner+Menu__Total-height: 64px */
  margin: 8px;
  padding: 0;
  color: black;
  z-index: 2;}

#BANNER_TITLE_txt_computer_id {
  width: auto;
  max-width: 100%;
  height: 13px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  letter-spacing: 0;
  padding-left: 4px;
  padding-right: 2px;
  overflow-x: hidden;
    -webkit-transition: color .73s, background-color .73s;
  -moz-transition: color .73s, background-color .73s;
  -o-transition: color .73s, background-color .73s;
  transition: color .73s, background-color .73s;}
#BANNER_TITLE_txt_mobile_id {display: none}

.MENU_WORKORDER {
  position: absolute;
  display: flex;
  background-color: rgba(255, 255, 255, 1);
  top: 30px;
  left: 0;
  align-content: center;
  justify-content: center;
  column-gap: 2px;
  width: auto;
  height: auto;
  padding: 0;
  border-radius: 3px;}
.MENU_AVDs {
  position: absolute;
  display: flex;
  background-color: rgba(255, 255, 255, 1);
  top: 30px;
  left: calc(296px + 24px);
  align-content: center;
  justify-content: center;
  column-gap: 2px;
  width: auto;
  height: auto;
  padding: 0;
  border-radius: 3px;}
.MENU_CLASSIQUE {
  position: absolute;
  display: flex;
  background-color: rgba(255, 255, 255, 1);
  top: 30px;
  right: 0;
  align-content: center;
  justify-content: center;
  column-gap: 2px;
  width: auto;
  height: auto;
  padding: 0;
  border-radius: 3px;}
#Language_ID {width: 55.5px;}
#Theme_ID {width: 55.5px;}
#Contact_ID {width: 56.5px;}
/* BANNER END */

/* MENU START */
.ME_BUTTON {
  position: relative;
  display: inline-flex;
  align-content: center;
  justify-content: center;
  align-items: center;
  width: auto;
  height: 16px;
  color: black;
  margin: 0;
  padding: 0;
  border-radius: 3px;}
.ME_BUTTON:hover {cursor: url("img/cursor_clic.webp"), default;}

#Zoom_BTN_id {display: inline-flex;}
@media screen and (max-width: 920px){#Zoom_BTN_id {display: none;}}

.ME_BUTTON_txt {
  position: relative;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  width: auto;
  height: 100%;
  padding-top: 2px;
  padding-right: 4px;
  padding-left: 6px;
  letter-spacing: 0;
  filter: contrast(2);
  -webkit-transition: all .73s;
  -moz-transition: all .73s;
  -o-transition: all .73s;
  transition: all .73s;}
.ME_BUTTON_txt:hover {cursor: url("img/cursor_clic.webp"), default;}

.ME_BUTTON_DIV1_txt {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: auto;
  height: auto;
  padding-top: 2px;
  padding-right: 4px;
  padding-left: 14px;
  letter-spacing: 0;
  -webkit-transition: all .73s;
  -moz-transition: all .73s;
  -o-transition: all .73s;
  transition: all .73s;}
.ME_BUTTON_DIV1_txt:hover {cursor: url("img/cursor_clic.webp"), default;}

.ME_BUTTON_txt:hover + .ME_LIST_div {display: block;}

.ME_LIST_div {
  position: absolute;
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  white-space: nowrap;
  top: 18px;
  left: 0px;
  width: calc(100% - 2px);
  height: auto;
  padding-left: 0px;
  border-radius: 3px;
  background: rgba(225, 255, 255, 0.73);
  border: 1px solid rgba(127, 127, 127, 0.55);}
.ME_LIST_div:hover {
  display: block;
  cursor: url("img/cursor_clic.webp"), default;}

.ME_LIST_txt {
  position: relative;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 8px;
  padding-top: 5px;
  padding-bottom: 3px;
  color: black;
  background-color: white;
  border-radius: 3px;
  letter-spacing: 0;
  filter: contrast(2);
  outline: 1px solid rgba(128, 128, 128, .55);
  outline-offset: -1px;
  -webkit-transition: all .73s;
  -moz-transition: all .73s;
  -o-transition: all .73s;
  transition: all .73s;
  -webkit-transition: outline 0s;
  -moz-transition: outline 0s;
  -o-transition: outline 0s;
  transition: outline 0s;}
.ME_LIST_txt:hover {
  outline: 1px solid rgba(128, 128, 128, .65);
  outline-offset: -1px;
  cursor: url("img/cursor_clic.webp"), default;}
.ME_LIST_txt:active {
  outline: 1px solid rgba(128, 128, 128, .75);
  outline-offset: -1px;
  cursor: url("img/cursor_clic.webp"), default;}

.ME_BUTTON_settings {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 12px;
  height: 12px;
  padding-top: 0px;
  padding-right: 2px;
  padding-left: 2px;
  color: black;
  letter-spacing: 0;
  background-image: url("img/set.png");
  background-repeat: no-repeat;
  background-size: 12px 12px;
  background-position: 50% 50%;
  -webkit-transition: all .73s;
  -moz-transition: all .73s;
  -o-transition: all .73s;
  transition: all .73s;
  z-index: 1000;}
.ME_BUTTON_settings:hover {transform: rotate3d(0, 0, 1, 360deg);}
.ME_BUTTON_settings:hover + .ME_SETTINGS_BOX {display: flex;}
.ME_SETTINGS_BOX:hover {display: flex;}

.ME_BUTTON_settings:hover {transform: rotate3d(0, 0, 1, 360deg);}

#ME_BU_CONNEC_id:hover {border-radius: 3px 3px 0px 3px;}
.ME_BUTTON_Connexion:hover {border-radius: 3px 3px 0px 3px;}
.ME_BUTTON_Connexion:hover + .Connexion_div {display: flex;}

.LIST_space_simu {
  position: absolute;
  display: block;
  width: 100%;
  height: 2px;
  background-color: transparent;
  top: -2px;
  left: 0px;}

.Connexion_div {
  cursor: url("img/cursor.webp"), default;
  display: none;
  position: absolute;
  justify-content: center;
  align-content: center;
  flex-wrap: wrap;
  flex-direction: row;
  width: calc(200px - 64px);
  height: calc(112px - 56px);
  background: -webkit-linear-gradient(-90deg, 
    rgba(255, 255, 255, 1),
    rgba(250, 250, 250, 1));
  background-image: radial-gradient(circle, rgba(250, 250, 250, 1), white, rgba(240, 240, 240, 1));
  border: 1px solid rgba(127, 127, 127, 0.55);
  bottom: -108px;
  right: 0;
  border-radius: 3px 3px 3px 3px;
  padding: 24px;}
.Connexion_div:hover {display: flex;}

.Connexion_div button {
  cursor: url("img/cursor.webp"), default;
  margin-top: 5px;
  height: 16px;
  background-color: white;
  border-radius: 3px;
  border: 1px solid lightgreen;}
.Connexion_div button:hover {
  border: 1px solid darkolivegreen;
  cursor: url("img/cursor_clic.webp"), default;}

.Connexion_div input {
  height: 16px;
  margin-bottom: 2px;
  margin-top: 2px;
  cursor: url("img/cursor.webp"), default;
  border-radius: 2px;
  border: 1px solid rgba(127, 127, 127, .40);}
.Connexion_div input:hover {
  cursor: url("img/cursor_clic.webp"), default;
  border: 1px solid rgba(127, 127, 127, .65);}

.Connexion_col {
  cursor: url("img/cursor.webp"), default;
  font-family: Pixelus_Maximus;
  font-size: 8px;
  display: flex;
  margin-bottom: 0px;}

#con_col_mdp {margin-top: 3px;}

.connexion_btn {
  height: 8px;
  padding-left: 4Px;
  padding-right: 2Px;
  padding-bottom: 0Px;
  padding-top: 4Px;}

.ME_SETTINGS_BOX {
  position: absolute;
  display: none;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-direction: row;
  flex-wrap: wrap;
  row-gap: 0px;
  column-gap: 2px;
  right: -5px;
  top: -6px;
  width: 120px;
  height: auto;
  background: rgba(255, 255, 255, 1);
  border-radius: 0 0px 8px 8px;
  border: 1px solid rgba(000, 000, 000, .15);
  padding: 4px;
  padding-right: 20px;
  z-index: 999;}

.ME_CPICK {
  position: relative;
  display: inline-flex;
  width: 12px;
  height: 12px;
  margin: 2px;
  flex-grow: 0;
  border: 1px solid rgba(000, 000, 000, .33);
  border-radius: 8px;
  cursor: url("img/cursor_clic.webp"), default;
  -webkit-transition: all 2.73s;
  -moz-transition: all 2.73s;
  -o-transition: all 2.73s;
  transition: all 2.73s;}
.ME_CPICK:hover {
  filter: saturate(2);
  border: 1px solid rgba(000, 000, 000, .33);
  outline: 2px solid rgba(000, 000, 000, .33);
  outline-offset: -2px;
  -webkit-transition: all 2.73s;
  -moz-transition: all 2.73s;
  -o-transition: all 2.73s;
  transition: all 2.73s;}

#CP_01_id {background-color: rgb(000, 000, 000);}
#CP_02_id {background-color: rgb(127, 127, 127);}
#CP_03_id {background-color: rgb(136, 000, 021);}
#CP_04_id {background-color: rgb(237, 028, 036);}
#CP_05_id {background-color: rgb(255, 127, 039);}
#CP_06_id {background-color: rgb(255, 242, 000);}
#CP_07_id {background-color: rgb(034, 177, 076);}
#CP_08_id {background-color: rgb(000, 162, 232);}
#CP_09_id {background-color: rgb(063, 072, 204);}
#CP_10_id {background-color: rgb(163, 073, 164);}
#CP_11_id {background-color: rgb(255, 255, 255);}
#CP_12_id {background-color: rgb(195, 195, 195);}
#CP_13_id {background-color: rgb(185, 122, 087);}
#CP_14_id {background-color: rgb(255, 174, 201);}
#CP_15_id {background-color: rgb(255, 201, 014);}
#CP_16_id {background-color: rgb(237, 227, 174);}
#CP_17_id {background-color: rgb(189, 233, 023);}
#CP_18_id {background-color: rgb(153, 206, 233);}
#CP_19_id {background-color: rgb(113, 142, 189);}
#CP_20_id {background-color: rgb(200, 191, 233);}
#CP_21_id {background-color: rgb(055, 255, 007);}
#CP_22_id {background-color: rgb(180, 100, 100);}
#CP_23_id {background-color: rgb(000, 255, 255);}
#CP_24_id {background-color: rgb(106, 188, 237);}

.ME_LIGHT_DIV1 {
  position: absolute;
  display: block;
  width: 4px;
  height: 4px;
  top: 6px;
  left: 4px;}

.ME_LIGHT {
  position: absolute;
  display: block;
  width: 4px;
  height: 4px;
  top: 6px;
  left: 4px;
  border-radius: 0;}

#ME_LIGHT_id_WO {background-color: rgba(55, 173, 33, 1); filter: saturate(3);}
#ME_LIGHT_id_AT {background-color: rgba(55, 173, 33, 1); filter: saturate(0);}

#ME_LIGHT_id01 {background-color: rgba(55, 173, 33, 1); filter: saturate(2);}
#ME_LIGHT_id02 {background-color: rgba(55, 173, 33, 1); filter: saturate(0);}

#ME_LIGHT_theme_w {background-color: rgba(55, 173, 33, 1); filter: saturate(2);}
#ME_LIGHT_theme_b {background-color: rgba(55, 173, 33, 1); filter: saturate(0);}
#ME_LIGHT_english {background-color: rgba(55, 173, 33, 1); filter: saturate(0);}

#ME_LIGHT_french {background-color: rgba(55, 173, 33, 1); filter: saturate(2);}
#ME_LIGHT_spanish {background-color: rgba(55, 173, 33, 1); filter: saturate(0);}

.sty_TITLE {background-color: transparent;}
.sty_ALL_w {background-color: rgba(000, 000, 000, 0.05);}
.sty_ALL_w:hover {background-color: rgba(000, 000, 000, 0.1);}
.sty_ALL_b {background-color: rgba(255, 255, 255, 0.1);}
.sty_ALL_b:hover {background-color: rgba(255, 255, 255, 0.2);}
.sty_AVD {background-color: rgba(246, 036, 036, .6);}
.sty_AVD:hover {background-color: rgba(246, 36, 036, .4);}
.sty_SD {background-color: rgba(036, 155, 246, .6);}
.sty_SD:hover {background-color: rgba(036, 155, 246, .4);}
.sty_WD {background-color: rgba(055, 173, 033, .6);}
.sty_WD:hover {background-color: rgba(055, 173, 033, .4);}
.sty_LD {background-color: rgba(204, 51, 255, .6);}
.sty_LD:hover {background-color: rgba(204, 051, 255, .4);}

/* MENU END */

/* VIDEOBOX START */

.AVD {
  position: relative;
  display: inline-flex;
  flex-grow: 1;
  width: var(--desktop-width-20);
  min-width: 256px;
  height: var(--desktop-height-20);
  min-height: 144px;
  border-radius: 0 8px 8px 8px;
  z-index: 15;}

.AVD_audio {
  flex-direction: row;
  flex-wrap: wrap;}

#TAB2_ANCHOR {
  position: absolute;
  width: 0px;
  height: 0px;
  top: 0px;
  left: 0;}

.AVD_FO {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-self: end;
  flex-grow: 0;
  width: 100%;
  min-width: 256px;
  height: 13px;
  white-space: nowrap;
  margin-top: -16px;
  border-radius: 6px 6px 6px 6px;
  color: black;
  padding: 4px;
  filter: contrast(2);
  text-overflow: ellipsis;
  background-color: rgba(255, 255, 255, 0.11);
  overflow-x: hidden;
  z-index: 15;}
.AVD_FO:hover {
  outline: 2px solid rgba(000, 000, 000, .1);
  outline-offset: -2px;}
.AVD_FO:active {
  outline: 2px solid rgba(000, 000, 000, .2);
  outline-offset: -2px;}

.AVD_FO p {
  width: auto;
  max-width: 100%;
  height: 13px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  letter-spacing: 0;
  padding-left: 4px;
  padding-right: 2px;
  -moz-transition: all .73s;
  -webkit-transition: all .73s;
  -o-transition: all .73s;
  transition: all .73s;}

.videodiv {
  position: absolute;
  top: 0px;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0 8px 8px 8px;
  z-index: 150;}
.videodiv:hover {
  outline: 2px solid rgba(000, 000, 000, .1);
  outline-offset: -2px;}
.videodiv:active {
  outline: 2px solid rgba(000, 000, 000, .2);
  outline-offset: -2px;}

.audiovideo {
  display: flex;
  position: relative;
  background-color: rgba(000, 000, 000, 1);
  width: 100%;
  height: 33.33%;
  left: 0;
  border-radius: 8px;
  z-index: 151;}
.audiovideo:hover {
  outline: 2px solid rgba(000, 000, 000, .1);
  outline-offset: -2px;}
.audiovideo:active {
  outline: 2px solid rgba(000, 000, 000, .2);
  outline-offset: -2px;}
.audiovideo_id1 {top: 0px; border-radius: 0 8px 8px 8px;}

#SLOT_00 {
  flex-grow: 2;
  width: calc(var(--desktop-width-40) + 8px);
  min-width: calc(256px + 8px);
  height: var(--desktop-height-20);
  min-height: 144px;}

#SLOT_12_VARIATION {
  will-change: src;
  z-index: 151;}

#SLOT_14 {flex-grow: 1;}
#SLOT_13 {flex-grow: 1;}
#SLOT_15 { flex-grow: 1;}
/*#SLOT_15 {
  flex-grow: 1.975;
  width: calc(var(--desktop-width-40) + 8px);
  min-width: calc(256px + 8px);
  height: var(--desktop-height-20);
  min-height: 144px;} */
#SLOT_16 {
  background-color: black;
  flex-grow: 0;
  flex-shrink: 0;}

#SLOT_16 > .MENU_frame2 {
  z-index: 152;}

#SLOT_16_video_16 {
  overflow: hidden;
  isolation: isolate;
  background: radial-gradient(circle at 50% 42%, #15335b 0%, #071223 46%, #03060d 100%);}

#threejs_canvas_id {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 2;
  transition: opacity .35s ease;}

#SLOT_16_video_16.threejs_ready #threejs_canvas_id {opacity: 1;}

.threejs_fallback {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 700px;
  overflow: hidden;
  opacity: 1;
  z-index: 1;
  transition: opacity .35s ease;
  background:
    radial-gradient(circle at 48% 42%, rgba(38, 134, 221, .42), transparent 31%),
    linear-gradient(145deg, rgba(255, 43, 151, .08), transparent 48%);}

#SLOT_16_video_16.threejs_ready .threejs_fallback {
  opacity: 0;
  pointer-events: none;}

.threejs_fallback_model {
  position: relative;
  width: 108px;
  height: 112px;
  z-index: 2;
  transform-style: preserve-3d;
  animation: ik_fallback_rotate 7s linear infinite;
  filter: drop-shadow(0 0 9px rgba(48, 185, 255, .85));}

.ik_bar {
  position: absolute;
  display: block;
  border: 1px solid rgba(220, 247, 255, .75);
  border-radius: 2px;
  box-shadow:
    inset -7px -5px 10px rgba(0, 24, 64, .55),
    inset 5px 4px 7px rgba(255, 255, 255, .22),
    0 0 10px rgba(44, 186, 255, .75);
  transform-style: preserve-3d;}

.ik_i {
  left: 18px;
  top: 9px;
  width: 18px;
  height: 92px;
  background: linear-gradient(90deg, #0677cb, #63d4ff 48%, #1166be);}

.ik_k_stem {
  left: 53px;
  top: 9px;
  width: 17px;
  height: 92px;
  background: linear-gradient(90deg, #b86a00, #ffd46a 48%, #cb7600);}

.ik_k_top, .ik_k_bottom {
  left: 67px;
  width: 17px;
  height: 61px;
  transform-origin: 50% 50%;
  background: linear-gradient(90deg, #b86a00, #ffd46a 48%, #cb7600);
  box-shadow:
    inset -7px -5px 10px rgba(77, 32, 0, .52),
    inset 5px 4px 7px rgba(255, 255, 255, .22),
    0 0 10px rgba(255, 185, 55, .7);}

.ik_k_top {top: 3px; transform: rotate(43deg);}
.ik_k_bottom {bottom: 3px; transform: rotate(-43deg);}

.threejs_fallback_orbit {
  position: absolute;
  left: 50%;
  top: 49%;
  width: 196px;
  height: 72px;
  margin: -36px 0 0 -98px;
  border: 2px solid rgba(78, 207, 255, .82);
  border-radius: 50%;
  transform: rotate(-15deg);
  box-shadow: 0 0 13px rgba(33, 181, 255, .65);}

.orbit_back {z-index: 1; animation: ik_orbit_back 5s linear infinite;}
.orbit_front {
  width: 162px;
  height: 112px;
  margin: -56px 0 0 -81px;
  border-color: rgba(255, 190, 65, .75);
  box-shadow: 0 0 12px rgba(255, 170, 40, .55);
  z-index: 3;
  animation: ik_orbit_front 6s linear infinite;}

.threejs_fallback_base {
  position: absolute;
  left: 50%;
  top: calc(50% + 67px);
  width: 150px;
  height: 22px;
  margin-left: -75px;
  z-index: 4;
  border-radius: 50%;
  background: linear-gradient(#273954, #070b13 72%);
  border: 1px solid rgba(94, 211, 255, .55);
  box-shadow: 0 0 17px rgba(34, 164, 226, .55);}

.threejs_fallback p {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10%;
  z-index: 5;
  margin: 0;
  color: rgba(222, 246, 255, .85);
  text-align: center;
  font-family: Pixelus_Maximus;
  font-size: 7px;
  letter-spacing: 2px;
  text-shadow: 0 0 8px #28aee8;}

@keyframes ik_fallback_rotate {
  0% {transform: rotateY(0deg) rotateX(-5deg);}
  50% {transform: rotateY(180deg) rotateX(5deg);}
  100% {transform: rotateY(360deg) rotateX(-5deg);}}

@keyframes ik_orbit_back {
  from {transform: rotateX(62deg) rotateZ(0deg);}
  to {transform: rotateX(62deg) rotateZ(360deg);}}

@keyframes ik_orbit_front {
  from {transform: rotateY(67deg) rotateZ(0deg);}
  to {transform: rotateY(67deg) rotateZ(-360deg);}}

.STARZ_BTNZ {
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border-radius: 0 8px 8px 8px;
  z-index: 152;}
.STARZ_BTNZ:hover {
  filter: saturate(2);
  outline: 2px solid rgba(000, 000, 000, .1);
  outline-offset: -2px;}
.STARZ_BTNZ:active {
  filter: saturate(2);
  outline: 2px solid rgba(000, 000, 000, .2);
  outline-offset: -2px;}
.STARZ_BTNZ:hover .GREENSTAR {opacity: 1;}

.STARZ_BTN_L {
  left: 29%;
  background-image: url("media/AVD_12_spec/Arrow_L.webp");}
.STARZ_BTN_L:hover {transform: rotate3d(0, 1, 0, -33deg);}
.STARZ_BTN_R {
  right: 29%;
  background-image: url("media/AVD_12_spec/Arrow_R.webp");}
.STARZ_BTN_R:hover {transform: rotate3d(0, 1, 0, 33deg);}

@media only screen and (min-width: 720px) and (max-width: 872px){
.STARZ_BTN_L {transform: rotate3d(0, 1, 0, -45deg); scale: 1.2;}
.STARZ_BTN_R {transform: rotate3d(0, 1, 0, 45deg); scale: 1.2;}}

.GREENSTAR {
  position: absolute;
  opacity: 1;
  width: 5.5%;
  height: 10%;
  top: 35%;
  background-repeat: no-repeat;
  background-size: 100% 100%;}
.GREENSTAR:hover {scale: 1.2;}

#V1_V8_L_id {display: block;}
#V8_V7_L_id, #V7_V6_L_id, #V6_V5_L_id, #V5_V4_L_id, #V4_V3_L_id, #V3_V2_L_id, #V2_V1_L_id {display: none;} 

#V1_V2_R_id {display: block;}
#V2_V3_R_id, #V3_V4_R_id, #V4_V5_R_id, #V5_V6_R_id, #V6_V7_R_id, #V7_V8_R_id, #V8_V1_R_id {display: none;} 


#V1_V8_L_id {display: block;}
#V8_V7_L_id, #V7_V6_L_id, #V6_V5_L_id, #V5_V4_L_id, #V4_V3_L_id, #V3_V2_L_id, #V2_V1_L_id {display: none;} 

#V1_V2_R_id {display: block;}
#V2_V3_R_id, #V3_V4_R_id, #V4_V5_R_id, #V5_V6_R_id, #V6_V7_R_id, #V7_V8_R_id, #V8_V1_R_id {display: none;} 

.MENU_frame {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
  width: auto;
  max-width: 95%;
  height: 13px;
  top: -13px;
  left: 0;
  padding-left: 4px;
  padding-right: 2px;
  white-space: nowrap;
  filter: contrast(2);
  text-overflow: ellipsis;
  background-color: rgba(255, 255, 255, 1);
  overflow: hidden;
  z-index: 150;
  -webkit-transition: color .73s;
  -moz-transition: color .73s;
  -o-transition: color .73s;
  transition: color .73s;}

.MENU_frame_child_L {
  width: auto;
  opacity: 0.85;
  top: 4px;
  left: 4px;
  z-index: 151;}
.MENU_frame_child_L:hover {opacity: 1;}

#agran_clic_id {display: flex;}
#retrec_clic_id {display: none;}

.MENU_frame2 {
  position: absolute;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
  width: auto;
  max-width: 100%;
  height: 13px;
  top: -13px;
  right: 3px;
  padding-left: 4px;
  padding-right: 2px;
  white-space: nowrap;
  filter: contrast(2);
  text-overflow: ellipsis;
  overflow: hidden;
  z-index: 149;
  -webkit-transition: color .73s;
  -moz-transition: color .73s;
  -o-transition: color .73s;
  transition: color .73s;}

.MENU_frame_child_R {
  width: auto;
  text-align: right;
  line-height: 14px;
  height: 14px;
  color: white;
  right: 4px;}

.ME_FR_CH_L {top: 4px;}
.ME_FR_CH_M {top: 18px;}
.ME_FR_CH_R {top: 32px;}

.threejs_img {
  height: 12px;
  width: 12px;
  display: inline-flex;
  margin-left: 4px;}

#ME_SET_MENU_frame {
  position: absolute;
  border-left: 1px solid rgba(000, 000, 000, .15);
  border-right: 1px solid rgba(000, 000, 000, .15);
  border-top: 1px solid rgba(000, 000, 000, .15);
  border-bottom: 1px solid rgba(000, 000, 000, .075);
  left: -1px;
  top: -17px;
  width: 118px;
  filter: contrast(1);
  padding-top: 2px;
  border-radius: 0 8px 0px 0px;}

.MENU_frame_ORDORNEM {
  padding-top: 1px;
  transition: none!important;
  height: 13px;
  top: -13px;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -o-transition:all 1s;
  transition: all 1s;
  border-bottom: 1px solid black;}

.POD_comm ~ .MENU_frame_ORDORNEM {padding-top: 0px; top: -15px;}

.info_video_01 {
  position: absolute;
  display: block;
  bottom: -5px;
  right: -5px;
  height: 20px;
  width: 20px;
  background-image: url("media/info.webp");
  background-repeat: no-repeat;
  background-size: 20px 20px;
  border-radius: 10px;
  filter: contrast(1.2);
  cursor:url(img/cursor_clic.webp), auto;
  z-index: 750;
  opacity: 1;}
.info_video_01:hover {
  cursor:url(img/cursor_clic.webp), auto;
  filter: saturate(2);}
.info_video_01:active {cursor:url(img/cursor_clic.webp), auto;}

.info_video_02 {
  position: absolute;
  display: none;
  bottom: -5px;
  right: -5px;
  height: 20px;
  width: 20px;
  will-change: background-image;
  background-image: url("media/info2.webp");
  background-repeat: no-repeat;
  background-size: 20px 20px;
  border-radius: 10px;
  cursor:url(img/cursor_clic.webp), auto;
  z-index: 750;
  opacity: 1;}
.info_video_02:hover {
  cursor:url(img/cursor_clic.webp), auto;
  filter: saturate(2);}
.info_video_02:active {cursor:url(img/cursor_clic.webp), auto;}

.Trackx3X {
  position: relative;
  display: flex;
  width: calc(100% + 32px);
  height: auto;
  margin: 30px;
  align-items: center;
  justify-content: center;
  align-content: center;
  color: white;}

.AVD_description {
  position: absolute;
  display: none;
  opacity: 1;
  align-items: center;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  background: -webkit-linear-gradient(bottom, 
    rgba(000, 000, 000, .42),
    rgba(000, 000, 000, 0.33),
    rgba(000, 000, 000, .42));
  background-color: rgba(000, 000, 000, .73);
  width: calc(100% - 32px);
  height: calc(100% - 32px);
  padding: 16px;
  margin: 0;
  border-radius: 0 8px 8px 8px;
  line-height: 12px;
  color: white;
  z-index: 551;
  filter: contrast(2);
  letter-spacing: 0;
  -moz-transition: background-color 2.55s;
  -webkit-transition: background-color 2.55s;
  -o-transition: background-color 2.55s;
  transition: background-color 2.55s;}
.AVD_description:hover, .AVDD_scroll:hover {
  background-color: rgba(000, 000, 000, .33);
  outline: 2px solid rgba(000, 000, 000, .1);
  outline-offset: -2px;
  -moz-transition: background-color 2.55s;
  -webkit-transition: background-color 2.55s;
  -o-transition: background-color 2.55s;
  transition: background-color 2.55s;}
.AVD_description:active, .AVDD_scroll:active {
  background-color: rgba(000, 000, 000, .89);
  outline: 2px solid rgba(000, 000, 000, .2);
  outline-offset: -2px;
  -moz-transition: background-color 2.55s;
  -webkit-transition: background-color 2.55s;
  -o-transition: background-color 2.55s;
  transition: background-color 2.55s;}

#AVD_00_front_id {
  display: flex;
  opacity: 1;
  background: rgba(000, 000, 000, 0);
  background-color: rgba(000, 000, 000, .375);}
#AVD_00_front_id:hover {
  background-color: rgba(000, 000, 000, 0);
  color: transparent;
  outline: 0px solid rgba(000, 000, 000, .1);
  outline-offset: -0px;
  -moz-transition: background-color 5s, color 5s;
  -webkit-transition: background-color 5s, color 5s;
  -o-transition: background-color 5s, color 5s;
  transition: background-color 5s, color 5s;}
#AVD_00_front_id:active {
  background-color: rgba(000, 000, 000, .89);
  outline: 0px solid rgba(000, 000, 000, .2);
  outline-offset: -0px;
  -moz-transition: background-color 2.55s;
  -webkit-transition: background-color 2.55s;
  -o-transition: background-color 2.55s;
  transition: background-color 2.55s;}

.AVD_tracklist_BTN {background-color: green; padding: 8px;}

.TAB1_descr_flex {
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  width: calc(100% - 12px);
  height: calc(100% - 12px);
  z-index: 551;
  background-color: none;
  padding: 6px;
  color: transparent;
  -moz-transition: background-color .75s, color .75s;
  -webkit-transition: background-color .75s, color .75s;
  -o-transition: background-color .75s, color .75s;
  transition: background-color .75s, color .75s;}
.TAB1_descr_flex:hover {
  background-color: rgba(000, 000, 000, 0.9);
  color: white;
  opacity: 1;
  -moz-transition: background-color 0s, color 0s;
  -webkit-transition: background-color 0s, color 0s;
  -o-transition: background-color 0s, color 0s;
  transition: background-color 0s, color 0s;}
.TAB1_descr_flex:active {
  background-color: rgba(000, 000, 000, 0.73);
  color: white;
  opacity: 1;
  -moz-transition: background-color .5s, color .5s;
  -webkit-transition: background-color .5s, color .5s;
  -o-transition: background-color .5s, color .5s;
  transition: background-color .5s, color .5s;}

.TAB1_descr {
  position: relative;
  display: block;
  text-align: left;
  line-height: 12px;
  top: 0px;
  left: 0;
  width: auto;
  height: auto;
  padding: 0;
  border-radius: 0;
  opacity: 1;
  z-index: 551;}

.AVD_descr_LINK {
  background-color: green;
  -moz-transition: all .73s;
  -webkit-transition: all .73s;
  -o-transition: all .73s;
  transition: all .73s;
  cursor:url(img/cursor_clic.webp), auto;}
.AVD_descr_LINK:hover {filter: saturate(.55);}

.AVDD_scroll {
  display: none;
  position: absolute;
  background: -webkit-linear-gradient(bottom, 
    rgba(000, 000, 000, .42),
    rgba(000, 000, 000, 0.33),
    rgba(000, 000, 000, .42));
  background-color: rgba(000, 000, 000, .89);
  width: calc(100% - 16px);
  height: calc(100% - 16px);
  padding: 8px;
  margin: 0;
  letter-spacing: -0.5px;
  line-height: 8px;
  border-radius: 0 0px 8px 8px;
  color: white;
  overflow-y: scroll;
  scrollbar: show;
  z-index: 551;}

.AVDD_scroll::-webkit-scrollbar {
  display: block;
  width: 8px;
  background-color: rgba(255, 255, 255, 0.123);}
.AVDD_scroll::-webkit-scrollbar-thumb {
  display: block;
  width: 12px;
  border: 1px solid rgba(255, 255, 255, 0.222);
  background-color: rgba(255, 255, 255, 0.321);;}
.AVDD_scroll::-webkit-scrollbar-thumb:hover {
  background-color: rgba(255, 255, 255, 0.18);
  cursor: url("img/cursor_clic.webp"), default;}
.AVDD_scroll::-webkit-scrollbar-thumb:active {
  background-color: rgba(255, 255, 255, 0.18);
  cursor: url("img/cursor_clic.webp"), default;}

.AVD_LINKS {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  width: 100%;
  height: 16px;
  margin-bottom: 14px;
  margin-top: 6px;}

.AVD_LOG {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  width: 16px;
  height: 16px;
  margin-right: 4px;
  margin-left: 4px;}
.AVD_LOG:hover {
  scale: 1.15;}
/* VIDEOBOX END */

/* ORDER A PROJECT START */
#PROJ_ORD_icon_id_08x {
  opacity: 0;
  visibility: none;
  pointer-events: none;}

.PROJ_ORD_title_div {
  position: relative;
  display: inline-flex;
  align-content: center;
  justify-content: center;
  width: calc((216px * 3) + var(--desktop-width-1));
  max-width: 100%;
  height: 13px;
  background-color: rgba(255, 255, 255, 1);
  padding: 4.5px;
  margin-bottom: 8px;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-transition: all 1.5s;
  -moz-transition: all 1.5s;
  -o-transition: all 1.5s;
  transition: all 1.5s;}

.PROJ_ORD_url {
  text-decoration: none!important;
  font-style: none;
  color: black;
  -webkit-transition: all 1.5s;
  -moz-transition: all 1.5s;
  -o-transition: all 1.5s;
  transition: all 1.5s;}

.PROJ_ORD_div {
  position: relative;
  display: inline-flex;
  align-content: center;
  justify-content: center;
  flex-grow: 0;
  margin: 0;
  padding: 0;
  width: 144px;
  height: 144px;
  border-radius: 0 8px 8px 8px;}

.videodiv_we {
  position: absolute;
  display: block;
  top: 0px;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 150;
  filter: saturate(1);}

#PROJ_ORD_video_03_id {z-index: 150;}
#PROJ_ORD_video_03_02_id {z-index: 151;}

.videodiv_we_devis {
  position: absolute;
  display: block;
  bottom: 0px;
  left: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 150;
  filter: saturate(1);}

.PROJ_ORD_div_contact {
  position: absolute;
  bottom: 8px;
  left: 8px;
  display: flex;
  align-content: center;
  justify-content: center;
  align-self: flex-end;
  margin: 0;
  padding: 0;
  width: calc(100% - 16px);
  height: 32px;}

@media only screen and (min-height: 0px) and (max-height: 800px){
.PROJ_ORD_div_contact {left: 0px; position: relative; width: 100%;}}

.hidden_audio {display: none; opacity: 0;}

.POD_comm {
  display: flex;
  justify-content: center;
  position: absolute;
  width: 100%;
  height: 32px;
  outline: 2px solid rgba(255, 255, 255, 1);
  outline-offset: -2px;
  background-color: rgba(255, 255, 255, 1);
  background: -webkit-linear-gradient(45deg,
    rgba(055, 255, 007, .43),
    rgba(180, 100, 100, .43),
    rgba(000, 255, 255, .43));
  color: black;
  filter: contrast(2);
  letter-spacing: 0;
  z-index: 151;
  white-space: nowrap;
  -webkit-transition: background .5s, background-color 2.5s 0.25s, color 2.5s 0.25s;
  -moz-transition: background .5s, background-color 2.5s 0.25s, color 2.5s 0.25s;
  -o-transition: background .5s, background-color 2.5s 0.25s, color 2.5s 0.25s;
  transition: background .5s, background-color 2.5s 0.25s, color 2.5s 0.25s;}
.POD_comm:hover {
  cursor: url("img/cursor_clic.webp"), auto;
  background-color: rgba(000, 255, 255, 1);
  outline: 2px solid rgba(000, 000, 000, .33);
  -webkit-transition: all 2.5s;
  -moz-transition: all 2.5s;
  -o-transition: all 2.5s;
  transition: all 2.5s;}

.POD_comm p {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  text-align: center;}

.PODC_tel {display: flex;}
.PODC_mail {display: none;}

.PODC_icone {
  display: block;
  position: absolute;
  width: 28px;
  height: 28px;
  background-color: transparent;
  outline: 1px solid rgba(255, 255, 255, 0);
  outline-offset: -1px;
  top: 2px;
  z-index: 151;}

.comm_ico_tel {
  right: 2px;
  background-image: url("img/tel_off.png");
  background-repeat: no-repeat;
  background-size: 28px 28px;
  border-left: 2px solid rgba(255, 255, 255, 0.2);}
.comm_ico_tel:hover {background-image: url("img/tel_on.png"); background-color: rgba(000, 000, 000, .3);}

.comm_ico_mail {
  right: 2px;
  background-image: url("img/mail_o.png");
  background-repeat: no-repeat;
  background-size: 28px 28px;
  border-left: 2px solid rgba(255, 255, 255, 0.2);}
.comm_ico_mail:hover {background-image: url("img/mail_c.png"); background-color: rgba(000, 000, 000, .3);}

.videodiv_we_red {outline: 2px solid rgba(255, 255, 255, 1); outline-offset: -2px;}
.videodiv_we_red:hover {outline: 2px solid rgba(246, 036, 036, 1); outline-offset: -2px;}
.videodiv_we_red:active {outline: 2px solid rgba(246, 036, 036, 0); outline-offset: -2px;}
.videodiv_we_green {outline: 2px solid rgba(255, 255, 255, 1); outline-offset: -2px;}
.videodiv_we_green:hover {outline: 2px solid rgba(055, 173, 033, 1); outline-offset: -2px;}
.videodiv_we_green:active {outline: 2px solid rgba(055, 173, 033, 0); outline-offset: -2px;}
.videodiv_we_blue {outline: 2px solid rgba(255, 255, 255, 1); outline-offset: -2px;}
.videodiv_we_blue:hover {outline: 2px solid rgba(036, 155, 246, 1); outline-offset: -2px;}
.videodiv_we_blue:active {outline: 2px solid rgba(036, 155, 246, 0); outline-offset: -2px;}
.videodiv_we_yellow {outline: 2px solid rgba(255, 255, 255, 1); outline-offset: -2px;}
.videodiv_we_yellow:hover {outline: 2px solid rgba(255, 255, 000, 1); outline-offset: -2px;}
.videodiv_we_yellow:active {outline: 2px solid rgba(255, 255, 000, 0); outline-offset: -2px;}
.videodiv_we_purple {outline: 2px solid rgba(255, 255, 255, 1); outline-offset: -2px;}
.videodiv_we_purple:hover {outline: 2px solid rgba(204, 51, 255, 1); outline-offset: -2px;}
.videodiv_we_purple:active {outline: 2px solid rgba(204, 51, 255, 0); outline-offset: -2px;}
.videodiv_we_orange {outline: 2px solid rgba(255, 255, 255, 1); outline-offset: -2px;}
.videodiv_we_orange:hover {outline: 2px solid rgba(255, 102, 000, 1); outline-offset: -2px;}
.videodiv_we_orange:active {outline: 2px solid rgba(255, 102, 000, 0); outline-offset: -2px;}
.videodiv_we_black {outline: 2px solid rgba(255, 255, 255, 1); outline-offset: -2px;}
.videodiv_we_black:hover {outline: 2px solid rgba(255, 255, 255, 1); outline-offset: -2px;}
.videodiv_we_black:active {outline: 2px solid rgba(255, 255, 255, 0); outline-offset: -2px;}

.PROJ_ORD_descr {
  position: absolute;
  display: flex;
  width: 100%;
  height: 100%;}

.PROJ_ORD_div_descr {
  color: transparent;
  filter: contrast(2);
  letter-spacing: auto;
  z-index: 151;
  -webkit-transition: color .5s, background-color .5s;
  -moz-transition: color .5s, background-color .5s;
  -o-transition: color .5s, background-color .5s;
  transition: color .5s, background-color .5s;}
.PROJ_ORD_div_descr:hover {
  background-color: rgba(000, 000, 000, 1);
  color: white;
  cursor: url("img/cursor_clic.webp"), default;
  -webkit-transition: color 0.0s, background-color 0.0s;
  -moz-transition: color 0.0s, background-color 0.0s;
  -o-transition: color 0.0s, background-color 0.0s;
  transition: color 0.0s, background-color 0.0s;}
/* ORDER A PROJECT END */

/* PC SETTINGS START */
.LOG_YT {
  loading: lazy;
  background-image: url("img/AVD_prv/logo_youtube_16x16.png");
  background-repeat: no-repeat;
  background-size: 16px 16px;
  border: 0px;}
.LOG_DZ {
  loading: lazy;
  background-image: url("img/AVD_prv/logo_deezer_16x16.png");
  background-repeat: no-repeat;
  background-size: 16px 16px;}
.LOG_DM {
  loading: lazy;
  background-image: url("img/AVD_prv/logo_dailymotion_16x16.png");
  background-repeat: no-repeat;
  background-size: 16px 16px;}
.LOG_SC {
  loading: lazy;
  background-image: url("img/AVD_prv/logo_soundcloud_16x16.png");
  background-repeat: no-repeat;
  background-size: 16px 16px;}
.LOG_SP {
  loading: lazy;
  background-image: url("img/AVD_prv/logo_spotify_16x16.png");
  background-repeat: no-repeat;
  background-size: 16px 16px;}
.LOG_AP {
  loading: lazy;
  background-image: url("img/AVD_prv/logo_apple_16x16.png");
  background-repeat: no-repeat;
  background-size: 16px 16px;}

/* ART DIV USED TO BE HERE */
/* ART DIV USED TO BE HERE */

/* PLAYER SETTINGS START */

.audiovideo_controls1 {
  position: absolute;
  top: 0px;
  left: 0px;
  display: block;
  width: 100%;
  height: 33.33%;} /* 1fr */
.audiovideo_controls2 {
  position: absolute;
  top: 33.33%;
  left: 0px;
  display: block;
  width: 100%;
  height: 33.33%;} /* 1fr */
.audiovideo_controls3 {
  position: absolute;
  bottom: 0px;
  left: 0px;
  display: block;
  width: 100%;
  height: 33.33%;} /* 1fr */

.custom_controls {
  position: absolute;
  padding: 0;
  margin: 0;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: rgba(120, 120, 120, .33);
  opacity: 0.20;
  z-index: 500;}
.custom_controls:hover {opacity: 1;}
.custom_controls[data-state="hidden"] {display: none;}
.custom_controls[data-state="visible"] {display: block;}

.custom_controls:hover .timer {opacity: .575;} 

.playpause_btn {
  display: block;
  position: absolute;
  bottom: 16px;
  left: 10px;
  width: 20px;
  height: 20px;
  background-color: transparent;
  opacity: 0.73;
  border-radius: 0px;
  cursor: url("img/cursor.webp"), auto;}
.playpause_btn:hover {cursor: url("img/cursor_clic.webp"), auto; opacity: .9;}
.playpause_btn:active {cursor: url("img/cursor.webp"), auto; opacity: 1;}
.progress_div { /* div */
  display: block;
  position: absolute;
  bottom: 8px;
  left: 10px;
  width: calc(100% - 20px);
  height: 4px;
  background-color: transparent;
  border-radius: 4px;
  cursor: url("img/cursor.webp"), auto;
  opacity: 0.73;
  z-index: 500;}
.progress_div:hover {cursor: url("img/cursor_clic.webp"), auto; opacity: 1;}
.progress_div:active {cursor: url("img/cursor.webp"), auto; opacity: 0.9;}
.progress_nbr { /* MAIN */
  display: block;
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: cyan;
  opacity: 0.73;
  border-radius: 1px;
  cursor: url("img/cursor.webp"), auto;
  z-index: 501;}
.progress_nbr:hover {
  bottom: -2px;
  height: 200%;
  cursor: url("img/cursor_clic.webp"), auto;}
.progress_nbr:active {
  bottom: -2px;
  height: 200%;
  cursor: url("img/cursor.webp"), auto;}
.mute_btn {
  display: block;
  position: absolute;
  bottom: 16px;
  right: 10px;
  width: 20px;
  height: 20px;
  background-color: transparent;
  opacity: 0.73;
  border-radius: 4px;
  cursor: url("img/cursor.webp"), auto;}
.mute_btn:hover {cursor: url("img/cursor_clic.webp"), auto; opacity: 1;}
.mute_btn:active {cursor: url("img/cursor.webp"), auto; opacity: 0.9;}
.volinc_btn {
  display: block;
  position: absolute;
  bottom: 16px;
  right: 34px;
  width: 20px;
  height: 20px;
  background-color: transparent;
  opacity: 0.73;
  border-radius: 4px;
  cursor: url("img/cursor.webp"), auto;}
.volinc_btn:hover {cursor: url("img/cursor_clic.webp"), auto; opacity: 1;}
.volinc_btn:active {cursor: url("img/cursor.webp"), auto; opacity: 0.9;}
.voldec_btn {
  display: block;
  position: absolute;
  bottom: 16px;
  right: 58px;
  width: 20px;
  height: 20px;
  background-color: transparent;
  opacity: 0.73;
  border-radius: 4px;
  cursor: url("img/cursor.webp"), auto;}
.voldec_btn:hover {cursor: url("img/cursor_clic.webp"), auto; opacity: 1;}
.voldec_btn:active {cursor: url("img/cursor.webp"), auto; opacity: 0.9;}
.fullscreen_btn {
  display: block;
  position: absolute;
  bottom: 40px;
  right: 10px;
  width: 20px;
  height: 20px;
  background-color: transparent;
  opacity: 0.73;
  border-radius: 4px;
  cursor: url("img/cursor.webp"), auto;}
.fullscreen_btn:hover {cursor: url("img/cursor_clic.webp"), auto; opacity: 1;}
.fullscreen_btn:active {cursor: url("img/cursor.webp"), auto; opacity: 0.9;}

.timer {
  display: block;
  position: absolute;
  bottom: 8px;
  left: 44px;
  width: auto;
  height: 20px;
  padding-left: 2px;
  background-color: transparent;
  opacity: 0.33;
  border-radius: 0px;
  text-align: center;
  font-family: Pixelus_Maximus;
  font-size: 8px;
  color: white;
  cursor: url("img/cursor.webp"), auto;}
.timer:hover {cursor: url("img/cursor_clic.webp"), auto; opacity: .85;}
.timer:active {cursor: url("img/cursor.webp"), auto; opacity: 1;}


video::-webkit-media-controls-panel {opacity: 0; background: rgba(255, 255, 255, 0.00); cursor: url("img/cursor.webp"), auto;}
video::-webkit-media-controls-panel:hover {opacity: 1; background: rgba(255, 255, 255, 0.07); cursor: url("img/cursor.webp"), auto;}
video::-webkit-media-controls-panel:active {background: rgba(255, 255, 255, 0.07); cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-play-button {opacity: 1; cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-play-button:hover {opacity: 1; cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-play-button:active {cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-timeline {opacity: 1; cursor: url("img/cursor.webp"), auto;}
video::-webkit-media-controls-timeline:active {cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-timeline:hover {opacity: 0.6; cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-slider-runnable-track {cursor: url("img/cursor.webp"), auto;}
video::-webkit-slider-runnable-track:active {cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-range-thumb {cursor: url("img/cursor.webp"), auto;}
video::-webkit-range-thumb:active {cursor: url("img/cursor.webp"), auto;}
video::-webkit-range-track {cursor: url("img/cursor.webp"), auto;}
video::-webkit-slider-thumb {cursor: url("img/cursor.webp"), auto;}
video::-webkit-slider-thumb:active {cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-track {cursor: url("img/cursor.webp"), auto;}
video::-webkit-media-controls-current-time-display {opacity: 0.42;cursor: url("img/cursor.webp"), auto;}
video::-webkit-media-controls-current-time-display:hover {opacity: 1; cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-time-remaining-display {opacity: 0.9; cursor: url("img/cursor.webp"), auto;}
video::-webkit-media-controls-time-remaining-display:hover {opacity: 1; cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-fullscreen-button {cursor: url("img/cursor.webp"), auto;}
video::-webkit-media-controls-fullscreen-button:hover {opacity: 0.9; cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-fullscreen-button:active {cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-mute-button {cursor: url("img/cursor.webp"), auto;}
video::-webkit-media-controls-mute-button:hover {opacity: 0.9; cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-mute-button:active {cursor: url("img/cursor_clic.webp"), auto;}
video::-webkit-media-controls-volume-slider-container {cursor: url("img/cursor.webp"), auto;}
video::-webkit-media-controls-volume-slider {cursor: url("img/cursor.webp"), auto;}
video::-webkit-media-controls-volume-slider:active {cursor: url("img/cursor_clic.webp"), auto;}
/* PLAYER SETTINGS  -ms- -moz-  END */

.PC_BLOCK {display: block;}
.PC_INLINEBLOCK {display: inline-block;}
.PC_FLEX {display: flex;}
.PC_INLINEFLEX {display: inline-flex;}
.MOBILE_BLOCK {display: none;}
.MOBILE_INLINEBLOCK {display: none;}
.MOBILE_FLEX {display: none;}
.MOBILE_INLINEFLEX {display: none;}

/* Preserve the 1920 x 1080 desktop composition on 2K and 4K displays. */
html.high-resolution {
  --desktop-display-scale: 1;
  --desktop-viewport-width: 1920px;
  --desktop-viewport-height: 1080px;
  --desktop-width-1: 19.2px;
  --desktop-width-20: 384px;
  --desktop-height-20: 216px;
  --desktop-width-30: 576px;
  --desktop-height-30: 324px;
  --desktop-width-40: 768px;
  --desktop-width-40-5: 777.6px;
  --desktop-width-61: 1171.2px;
  display: block;
  width: 100vw;
  height: 100vh;
  min-width: 0;
  overflow: hidden;
}

html.high-resolution body {
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--desktop-viewport-width);
  min-width: var(--desktop-viewport-width);
  max-width: var(--desktop-viewport-width);
  height: var(--desktop-viewport-height);
  margin: 0;
  transform: translate(-50%, -50%) scale(var(--desktop-display-scale));
  transform-origin: center center;
}

/* PC SETTINGS END */

/* /////// MOBILE PHONE START /////// */
@media only screen and (hover: none) and (pointer: coarse){

/* SETTINGS START */

@font-face {
  /* Created using https://fontstruct.com/ */
  font-family: Pixelus_Maximus_12px;
  src: url(fonts/Pixelus_Maximus_12px.ttf) format('truetype');
  font-display: swap;}

ol, ul, p, a, li {
  font-family: Pixelus_Maximus_12px;
  font-size: 12px;
  text-decoration: none;
  font-style: none;
  font-weight: normal!important;
  font-kerning: normal;
  font-synthesis: none;
  font-variant: normal;
  font-optical-sizing: none;
  font-feature-settings: normal;
  font-size-adjust: none;
  font-variation-settings: normal;
  text-decoration: none!important;
  text-transform: none;
  color: inherit;}
ol, ul, li {list-style:none}
p {padding: 0; margin: 0;}
a:link {
  text-decoration: none!important;
  cursor: url("img/cursor_clic.webp"), default;}

html, body, .BANNER_div {min-width: unset;}

html {
  width: 100vw;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: scroll;}

body {overflow: hidden;}

.TAB1 {display: none;}
#LOADING_div1_tab1_id {display: none;}
.TAB3, .ARTISTDIRECTORY_div {display: none;}

.TAB2 {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-content: flex-start;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  flex-grow: 1;
  row-gap: 32px;
  column-gap: 8px;
  top: 56px;
  right: 0;
  width: calc(100vw - 32px);
  height: calc(100vh - 112px);
  background-color: rgba(106, 188, 237, 1);
  border-radius: 4px;
  margin: 8px;
  padding: 8px;
  padding-top: 32px;
  overflow: hidden;
  opacity: 1;
  z-index: 1;
  order: 2;
  -webkit-scrollbar-width: none;
  -moz-scrollbar-width: none;
  -ms-scrollbar-width: none;
  -o-scrollbar-width: none;
  scrollbar-width: none;}
.TAB2::-webkit-scrollbar {display:none;}

.BANNER_div {
  position: fixed;
  display: flex;
  align-content: center;
  justify-content: center;
  align-items: center;
  width: calc(100% - 16px);
  background-color: rgba(128, 128, 128, 0.07);
  border-radius: 4px;
  height: 24px;
  margin: 8px;
  padding: 0;
  color: black;
  z-index: 4;
  white-space: nowrap;
  filter: contrast(1);}

#BANNER_TITLE_txt_mobile_id {
  width: auto;
  max-width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  letter-spacing: 1px;
  padding-left: 4px;
  padding-right: 2px;
  -moz-transition: all .73s;
  -webkit-transition: all .73s;
  -o-transition: all .73s;
  transition: all .73s;}
#BANNER_TITLE_txt_computer_id {display: none}

.MENU_WORKORDER {display: none;}
.MENU_AVDs {
  position: absolute;
  display: flex;
  top: 36px;
  left: 0;
  align-content: center;
  justify-content: center;
  column-gap: 2px;
  width: auto;
  height: 16px;
  padding: 0;}
.MENU_CLASSIQUE {
  position: absolute;
  display: flex;
  top: 36px;
  right: 0;
  align-content: center;
  justify-content: center;
  column-gap: 2px;
  width: auto;
  height: 16px;
  padding: 0;}

.sty_SD {background-color: rgba(036, 155, 246, .45);}
.sty_SD:hover {background-color: rgba(036, 155, 246, .35);}
.sty_WD {background-color: rgba(055, 173, 033, .4);}
.sty_WD:hover {background-color: rgba(055, 173, 033, .2);}

.ME_BUTTON_txt {
  letter-spacing: 0;
  padding-top: 3px;
  padding-bottom: 4px;
  padding-left: 6px;
  padding-right: 5px;
  filter: contrast(1);}

.BUTTON_comp {display: none;}
#Language_ID, #Theme_ID, #Contact_ID {width: auto;}
#Zoom_button_comp {display: none;}
.ME_LIGHT_DIV1, .ME_LIGHT, .ME_LIGHT_RIGHTPAN {display: none; opacity: 0; visibility: hidden;}

.ME_LIST_txt {filter: contrast(1); height: 13px;}

#ME_LIGHT_theme_w {background-color: white; filter: saturate(0);}
#ME_LIGHT_theme_b {background-color: white; filter: saturate(0);}
#ME_LIGHT_english {background-color: white; filter: saturate(0);}
#ME_LIGHT_french {background-color: white; filter: saturate(0);}
#ME_LIGHT_spanish {background-color: white; filter: saturate(0);}

.AVD {
  position: relative;
  display: inline-flex;
  width: 89vw;
  height: calc((89vw * 56.25) / 100);
  min-height: 200px;
  flex-grow: 2;
  background-color: transparent;
  border-radius: 0 0px 8px 8px;
  z-index: 15;}

#SLOT_00, #SLOT_12, #SLOT_13, #SLOT_14, #SLOT_15 {flex-grow: 1; width: 89vw; min-height: 200px;}

.AVD_description {letter-spacing: 0;}

.AVDD_scroll {
  display: none;
  position: absolute;
  background: -webkit-linear-gradient(bottom, 
    rgba(000, 000, 000, .42),
    rgba(000, 000, 000, 0.33),
    rgba(000, 000, 000, .42));
  background-color: rgba(000, 000, 000, .89);
  width: calc(100% - 32px);
  height: calc(100% - 32px);
  padding: 16px;
  margin: 0;
  letter-spacing: 0;
  line-height: 12px;
  border-radius: 0 0px 8px 8px;
  color: white;
  overflow-y: scroll;
  scrollbar: show;
  z-index: 551;}

.MENU_frame {
  height: 16px;
  top: -16px;
  padding-left: 6px;
  padding-right: 2px;
  border-radius: 0 6px 0px 0px;}
.MENU_frame p {
  height: 14px;}
.MENU_frame2 {
  height: 14px;
  top: -14px;
  padding-left: 4px;
  padding-right: 2px;}
.MENU_frame2 p {
  height: 14px;}

.info_video_01 {
  position: absolute;
  display: block;
  bottom: -5px;
  right: -5px;
  height: 24px;
  width: 24px;
  background-image: url("media/info.webp");
  background-repeat: no-repeat;
  background-size: 24px 24px;
  border-radius: 12px;
  filter: contrast(1.2);
  cursor:url(img/cursor_clic.webp), auto;
  z-index: 750;
  opacity: 1;}
.info_video_01:hover {
  cursor:url(img/cursor_clic.webp), auto;
  filter: saturate(2);}
.info_video_01:active {cursor:url(img/cursor_clic.webp), auto;}

.info_video_02 {
  position: absolute;
  display: none;
  bottom: -5px;
  right: -5px;
  height: 24px;
  width: 24px;
  will-change: background-image;
  background-image: url("media/info2.webp");
  background-repeat: no-repeat;
  background-size: 24px 24px;
  border-radius: 12px;
  cursor:url(img/cursor_clic.webp), auto;
  z-index: 750;
  opacity: 1;}
.info_video_02:hover {
  cursor:url(img/cursor_clic.webp), auto;
  filter: saturate(2);}
.info_video_02:active {cursor:url(img/cursor_clic.webp), auto;}

video::-webkit-media-controls-panel {opacity: .1;}
video::-webkit-media-controls-current-time-display {font-family: Pixelus_Maximus_12px; font-size: 12px;}
video::-webkit-media-controls-time-remaining-display {font-family: Pixelus_Maximus_12px; font-size: 12px;}

.PC_BLOCK {display: none;}
.PC_INLINEBLOCK {display: none;}
.PC_FLEX {display: none;}
.PC_INLINEFLEX {display: none;}
.MOBILE_BLOCK {display: block;}
.MOBILE_INLINEBLOCK {display: inline-block;}
.MOBILE_FLEX {display: flex;}
.MOBILE_INLINEFLEX {display: inline-flex;}

/* SETTINGS END */

}
/* /////// MOBILE PHONE END /////// */
