keyboard{--keyboard-percentage: .9;--keyboard-width: calc(var(--main-width) * var(--keyboard-percentage));--keyboard-padding: clamp(7px, calc(var(--keyboard-width) / 50), 50px);--keyboard-border-radius: var(--keyboard-padding);-webkit-backdrop-filter:blur(600px);backdrop-filter:blur(600px);background-color:#3c3c3c26;border:1px solid hsla(225,100%,8%,.8);border-radius:var(--keyboard-border-radius);box-shadow:#fffc 0 1px 4px;display:block;margin:0 auto;padding:var(--keyboard-padding);width:max-content}keyboard-row{display:flex}.center{align-items:center;display:flex;justify-content:center}keyboard-legend{display:block;margin:7px 0 0;text-align:center}keyboard[data-type=ergodox] keyboard-key[data-column="6"]{margin-right:50px}keyboard[data-type=ergodox] keyboard-row[data-row="6"]{margin-top:30px}kbd,kbd-output,kbd-non,keyboard-key{align-content:center;align-items:center;cursor:pointer;display:inline-block;font-family:Noto Sans,Noto Sans Symbols,sans-serif;font-optical-sizing:auto;font-style:normal;font-weight:300;justify-content:center;text-align:center}p kbd,p kbd-output{line-height:1.2em}keyboard-key{--key-size: calc(var(--keyboard-width) / 16);--key-margin: calc(.05 * var(--key-size));--key-depth: calc(var(--key-size) * .06);--key-pressed-depth: 1px;--key-pressed-depth-change: calc(var(--key-depth) - var(--key-pressed-depth));--key-shadow: rgba(0, 0, 0, .3) 5px 3px 5px;--effect-3d: hsla( var(--key-color-hue), var(--key-color-saturation), calc(var(--key-color-luminosity) - 20%), 70% );--key-border-color: hsla( var(--key-color-hue), var(--key-color-saturation), var(--key-color-luminosity), 30% );--key-border-radius: calc(var(--keyboard-border-radius) / 5);--key-border-size: 1px;--key-text-size: calc(var(--key-size) / 2.5);background-color:hsla(var(--key-color-hue),var(--key-color-saturation),var(--key-color-luminosity),var(--key-opacity));border:var(--key-border-size) solid var(--key-border-color);border-radius:var(--key-border-radius);box-shadow:var(--key-shadow),0 var(--key-depth) 0 var(--effect-3d);color:#fff;font-size:var(--key-text-size);height:calc(var(--key-size) - 2 * var(--key-margin));margin:var(--key-margin);text-shadow:rgb(0,0,0) 0px 0 1px,rgb(0,0,0) 0px 0 6px,rgba(0,0,0,.5) 0px 0 12px;width:calc(var(--key-size) * var(--size) - 2 * var(--key-margin))}@media (max-width: 500px){keyboard-key{--key-depth: 1px;--key-pressed-depth: .5px;--key-border-radius: calc(var(--keyboard-border-radius) / 8)}}keyboard-key:active,keyboard-key:hover,.pressed-key{background-color:#ffffffd9!important;box-shadow:0 var(--key-pressed-depth) 0 var(--effect-3d),inset 0 0 1px #0007;color:#333!important;font-weight:400;position:relative;text-shadow:none;top:var(--key-pressed-depth-change)}keyboard-key[data-key=""]{display:none}keyboard-key[data-key=none]{background-color:transparent!important;border-color:transparent;box-shadow:none;cursor:auto}keyboard{--color-left-index-finger: 0deg;--color-left-middle-finger: 35deg;--color-left-ring-finger: 60deg;--color-left-little-finger: 115deg;--color-right-little-finger: 180deg;--color-right-ring-finger: 225deg;--color-right-middle-finger: 270deg;--color-right-index-finger: 315deg}keyboard-key[data-hand=left][data-finger=index]{--key-color-hue: var(--color-left-index-finger)}keyboard-key[data-hand=left][data-finger=majeur]{--key-color-hue: var(--color-left-middle-finger)}keyboard-key[data-hand=left][data-finger=annulaire]{--key-color-hue: var(--color-left-ring-finger)}keyboard-key[data-hand=left][data-finger=auriculaire]{--key-color-hue: var(--color-left-little-finger)}keyboard-key[data-hand=right][data-finger=index]{--key-color-hue: var(--color-right-index-finger)}keyboard-key[data-hand=right][data-finger=majeur]{--key-color-hue: var(--color-right-middle-finger)}keyboard-key[data-hand=right][data-finger=annulaire]{--key-color-hue: var(--color-right-ring-finger)}keyboard-key[data-hand=right][data-finger=auriculaire]{--key-color-hue: var(--color-right-little-finger)}keyboard-key{--key-color-luminosity: 70%;--key-color-saturation: 100%;--key-opacity: 35%}keyboard[data-color=no] keyboard-key{--key-color-hue: 190 !important;--key-color-luminosity: 70%;--key-opacity: 35%}keyboard[data-color=azerty] keyboard-key{--key-color-hue: 200 !important}keyboard[data-color=azerty] keyboard-legend{color:#9df}keyboard[data-color=ergopti] keyboard-key{--key-color-hue: 300 !important}keyboard[data-color=ergopti] keyboard-legend{color:#ffb3ff}keyboard[data-color=freq] keyboard-key{--key-color-luminosity: 100%;--key-color-saturation: 0%}keyboard[data-color=freq] keyboard-key[data-type=letter],keyboard[data-color=freq] keyboard-key[data-type=french],keyboard[data-color=freq] keyboard-key[data-type=ponctuation]{--key-color-hue: calc(180deg * (1 - var(--frequency_normalized)));--key-color-saturation: 90%;--key-color-luminosity: 70%;--key-opacity: 45%;background-color:hsla(var(--key-color-hue),var(--key-color-saturation),var(--key-color-luminosity),var(--key-opacity))}keyboard-key[data-key=Space],keyboard-key[data-type=special],keyboard-key[data-key=Enter]{background-color:#0a0a0a;color:#fff;--key-border-color: hsla(var(--key-color-hue), 100%, 100%, 35%);--effect-3d: hsla(var(--key-color-hue), 0%, 80% , 70%);--key-color-hue: 0deg !important;--key-color-saturation: 0% !important}keyboard[data-type=ergodox] keyboard-key[data-finger=thumb]{background-color:#8ca0aa40}keyboard[data-plus=yes] keyboard-key[data-plus=yes]:not([data-key=Space]),keyboard[data-plus=yes][data-type=ergodox][data-layer=Visuel] keyboard-key[data-key=Space],keyboard[data-plus=yes][data-type=ergodox][data-layer=Primary] keyboard-key[data-key=Space]{--key-color-saturation: 0%;--key-color-luminosity: 100%;background:linear-gradient(to bottom,#00eaff26,#6600ff26)}tap-hold{display:inline-block;font-size:calc(var(--key-text-size) * .65);font-weight:400;margin-top:.25em}output-tap{color:#0080e2}keyboard[data-plus=yes][data-type=iso] keyboard-key[data-key=Tab] tap-hold,keyboard[data-plus=yes][data-type=iso] keyboard-key[data-key=RAlt] tap-hold{line-height:1.1}keyboard[data-plus=yes][data-type=iso] keyboard-key[data-key=CapsLock] tap-hold{font-size:calc(var(--key-text-size) * .65);line-height:1.25}keyboard[data-plus=yes][data-type=iso] keyboard-key[data-key=LCtrl] tap-hold,keyboard[data-plus=yes][data-type=iso] keyboard-key[data-key=LAlt] tap-hold{line-height:1.35}keyboard[data-plus=yes][data-type=iso] keyboard-key[data-key=RCtrl] tap-hold{font-size:.7em;line-height:1.5}keyboard-key[data-key=LShift] tap-hold output-hold{font-size:1.3em;font-weight:700;line-height:1.15}keyboard[data-layer=Visuel] keyboard-key[data-type=letter],keyboard[data-layer=Visuel] keyboard-key[data-type=french]{text-transform:uppercase}keyboard[data-layer=Visuel] keyboard-key[data-type=ponctuation]{font-size:calc(var(--key-text-size) * .7);font-weight:500;line-height:1}keyboard[data-layer=Visuel][data-plus=yes] keyboard-key[data-key=q],keyboard[data-layer=Shift][data-plus=yes] keyboard-key[data-key=q]{text-transform:capitalize}keyboard[data-layer=Ctrl] keyboard-key:not([data-type=special]){text-transform:uppercase}keyboard[data-type=iso] keyboard-key[data-type=enter]{border-right:none;position:relative;top:0;z-index:1}keyboard[data-type=iso] keyboard-key[data-type=enter] div{font-weight:400;position:relative;z-index:3}keyboard[data-type=iso] keyboard-key[data-type=enter]:before{border-radius:0 calc(var(--key-border-radius) - 1px) 0 0;border-right:var(--key-border-size) solid var(--key-border-color);content:"";height:var(--key-size);position:absolute;right:0;top:0;width:calc(var(--key-size) - 2 * var(--key-margin) - 1px);z-index:2}keyboard[data-type=iso] keyboard-key[data-type=enter]:after{border:var(--key-border-size) solid var(--key-border-color);border-radius:0 0 var(--key-border-radius) var(--key-border-radius);border-top:none;box-shadow:var(--key-shadow),0 var(--key-depth) 0 var(--effect-3d),-.5px var(--key-depth) 0 var(--effect-3d);content:"";height:calc(var(--key-size) + var(--key-margin) / 2);position:absolute;right:0;top:100%;width:calc(var(--key-size) - 2 * var(--key-margin));z-index:0}keyboard[data-type=iso] keyboard-key[data-type=enter]:active,keyboard[data-type=iso] keyboard-key[data-type=enter]:hover{position:relative;top:var(--key-pressed-depth-change)}keyboard[data-type=iso] keyboard-key[data-type=enter]:active:before,keyboard[data-type=iso] keyboard-key[data-type=enter]:hover:before{height:var(--key-size)}keyboard[data-type=iso] keyboard-key[data-type=enter]:active:after,keyboard[data-type=iso] keyboard-key[data-type=enter]:hover:after{box-shadow:0 var(--key-pressed-depth) 0 var(--effect-3d),0 var(--key-pressed-depth) 0 var(--effect-3d)}keyboard-key[data-type=enter]:before,keyboard-key[data-type=enter]:after{background-color:#0a0a0a!important;color:#fff!important}keyboard-key[data-type=enter]:hover,keyboard-key[data-type=enter]:hover:before,keyboard-key[data-type=enter]:hover:after,keyboard-key[data-type=enter].pressed-key,keyboard-key[data-type=enter].pressed-key:before,keyboard-key[data-type=enter].pressed-key:after{background-color:#d2d2d2!important;box-shadow:none;color:#333}keyboard-key[data-style=morte],keyboard-key[data-style=different]{--key-color-saturation: 0% !important;--key-color-luminosity: 100% !important;--key-opacity: 5% !important;font-weight:400}keyboard-key[data-content=◌̈],keyboard-key[data-content=◌̂]{font-family:Open Sans}keyboard-key[data-key=j][data-content=j] div,keyboard-key[data-key=j][data-content=J] div{position:relative;right:-.05em;top:-.1em}keyboard-key[data-content=★] div{position:relative;top:-.05em}keyboard-key[data-key=Escape],keyboard-key[data-key=LCtrl],keyboard-key[data-key=Win],keyboard-key[data-key=LAlt],keyboard-key[data-key=RCtrl]{font-size:calc(var(--key-text-size) * .75);font-weight:400}keyboard[data-type=iso] keyboard-key[data-key=Space],keyboard[data-type=iso] keyboard-key[data-key=RAlt],keyboard[data-type=iso] keyboard-key[data-key=Option]{font-size:calc(var(--key-text-size) * .7);font-weight:400}keyboard[data-type=ergodox] keyboard-key[data-key=RAlt]{font-size:calc(var(--key-text-size) * .65);font-weight:400}keyboard-key[data-key=BackSpace],keyboard-key[data-key=Delete]{font-size:calc(var(--key-text-size) * .85)}keyboard-key[data-key=RShift],keyboard-key[data-key=LShift]{font-weight:700}keyboard-key[data-key=AltTab]{font-size:calc(var(--key-text-size) * .7);line-height:1.15}keyboard[data-plus=yes][data-layer=Primary] keyboard-key[data-key=q],keyboard[data-plus=yes][data-layer=AltGr] keyboard-key[data-key=w]{font-size:calc(var(--key-text-size) * .9)}keyboard[data-plus=yes][data-layer=Visuel] keyboard-key[data-key=q],keyboard[data-plus=yes][data-layer=Shift] keyboard-key[data-key=q],keyboard[data-plus=yes][data-layer=ShiftAltGr] keyboard-key[data-key=w]{font-size:calc(var(--key-text-size) * .85)}keyboard[data-layer=Layer] keyboard-key[data-key=Coller]{font-size:calc(var(--key-text-size) * .85)}keyboard[data-layer=","] keyboard-key:not([data-type=special]):not([data-type=enter]){font-size:calc(var(--key-text-size) * .9)}keyboard[data-layer=À] keyboard-key:not([data-type=special]):not([data-type=enter]){font-size:calc(var(--key-text-size) * .7)}keyboard[data-layer=Layer] keyboard-key:not([data-finger=thumb]):not([data-type=special]):not([data-type=enter]){font-size:calc(var(--key-text-size) * .8)}keyboard[data-layer=Layer][data-type=ergodox] keyboard-key[data-key=Space]{font-size:calc(var(--key-text-size) * .65)}keyboard-key[data-key=CapsLock] tap-hold,keyboard-key[data-key=CapsLock][data-content=⌫],keyboard-key[data-key=CapsLock][data-content=⌦]{font-size:calc(var(--key-text-size) * .85)}keyboard-key[data-key=CapsLock][data-content="Ctrl + ⌫"],keyboard-key[data-key=CapsLock][data-content="Ctrl + ⌦"]{font-size:calc(var(--key-text-size) * .7)}keyboard-key[data-content="Caps<br>word"]{font-size:calc(var(--key-text-size) * .65)}keyboard-key[data-content="%"],keyboard-key[data-content="<nbsp></nbsp>%"]{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Open Sans}#keyboard_reference{--keyboard-width: 50vw}#keyboard_presentation,#keyboard_presentation_plus,#keyboard_emulation{--keyboard-width: calc(40vw + 25vh) }@media (max-width: 900px){#keyboard_reference,#keyboard_presentation,#keyboard_presentation_plus,#keyboard_presentation_emulation{--keyboard-width: 90vw}}#keyboard_controle keyboard-key[data-column]:nth-child(n+8):nth-child(-n+17),#keyboard_controle keyboard-key[data-column="0"],#keyboard_raccourcis_ergodox keyboard-key[data-column]:nth-child(n+8):nth-child(-n+17){display:none}#keyboard_controle keyboard-key[data-column="6"],#keyboard_raccourcis_ergodox keyboard-key[data-column="6"]{margin-right:0}#keyboard_symboles_plus keyboard-row:nth-child(n+5){display:none}#keyboard_magique keyboard-key[data-plus=yes]:not([data-key=magique]){background:unset!important;--key-color-saturation: 100% !important;--key-color-luminosity: 70% !important;background-color:hsla(var(--key-color-hue),var(--key-color-saturation),var(--key-color-luminosity),var(--key-opacity))!important}#keyboard_magique keyboard-key[data-plus=yes]:not([data-key=magique]):hover{background-color:#ffffffd9!important}#keyboard_magique keyboard-key[data-plus=yes][data-type=special]{background-color:#0a0a0a!important}#keyboard_magique keyboard-key[data-key=magique]{background:linear-gradient(to bottom,#ff000026,#ff000026)}nbsp{background-color:#fff;border-radius:1px;display:inline-block;height:.75em;margin-right:2px;width:.25em}
