MediaWiki:Common.css
De Omnis Bibliotheca
Note : après avoir publié vos modifications, il se peut que vous deviez forcer le rechargement complet du cache de votre navigateur pour voir les changements.
- Firefox / Safari : maintenez la touche Maj (Shift) en cliquant sur le bouton Actualiser ou appuyez sur Ctrl + F5 ou Ctrl + R (⌘ + R sur un Mac).
- Google Chrome : appuyez sur Ctrl + Maj + R (⌘ + Shift + R sur un Mac).
- Internet Explorer / Edge : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl + F5.
- Opera : appuyez sur Ctrl + F5.
/** Polices d'écritures : **/
@import url("//fonts.googleapis.com/css2?family=Grenze+Gotisch&family=Iceland&family=UnifrakturCook:wght@700&display=swap");
.page-wrapper {
scroll-padding-top: 60px;
}
/** Affichage des titres pour smartphone **/
@media screen and (max-width: 1023px) {
body.page-Accueil .contentHeader {
display: none !important;
}
body.page-Accueil.OB div#bodyContent {
margin-top: 20px !important;
}
body .contentHeader,
body.OB .contentHeader,
body.OB.theme .contentHeader {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 150px;
background: radial-gradient(#031516, black 70%) !important;
}
body .contentHeader h1#firstHeading,
body.OB .contentHeader h1#firstHeading,
body.OB.theme .contentHeader h1#firstHeading {
position: absolute !important;
top: 50% !important;
left: 50% !important;
transform: translateX(-50%) translateY(-50%);
background: none !important;
margin: 0 !important;
padding: 0 !important;
font-size: 0 !important;
box-shadow: none !important;
border: none !important;
}
body.OB.theme .contentHeader #firstHeading::after {
content: none !important;
color: transparent !important;
font-size: 0 !important;
text-shadow: none !important;
}
.contentHeader h1#firstHeading .mw-page-title-namespace,
.contentHeader h1#firstHeading .mw-page-title-separator {
display: none;
}
body .contentHeader h1#firstHeading>span.mw-page-title-main,
body.OB .contentHeader h1#firstHeading>span.mw-page-title-main,
body.OB.theme .contentHeader h1#firstHeading>span.mw-page-title-main {
overflow: hidden;
text-overflow: ellipsis;
max-width: 100vw;
white-space: nowrap;
padding: 20px;
color: white !important;
text-shadow: 0 0 black !important;
font-family: 'Grenze Gotisch', cursive;
font-size: 1.8rem !important;
}
body div#bodyContent,
body.OB div#bodyContent,
body.OB.theme div#bodyContent {
top: 0 !important;
position: relative;
background: black !important;
margin-top: 150px !important;
padding-top: 0 !important;
}
body div#content,
body.OB div#content,
body.OB.theme div#content {
padding-top: 0 !important;
}
}
/** Misc. layout **/
.flex-1 {
flex: 1;
}
/** fix page menu layout **/
div#toc a {
flex-wrap: nowrap;
white-space: nowrap;
}
body .explorer-menu-item-desc-title {
text-shadow: 0 0 2px #000, 0 0 3px #30e2ff, 0 0 5px #30e2ff !important;
}
body .explorer-menu-item-desc {
width: 270px;
}
.mw-body div.thumbinner {
max-width: 100%;
}
/** Accueil **/
#dallage-grid-left .dallage-inner::before,
#dallage-grid-right .dallage-inner::before,
#dallage-grid-left .dallage-inner::after,
#dallage-grid-right .dallage-inner::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 200000;
background: url(/images/e/eb/Black_leather_bg.jpg) black;
}
#dallage-grid-left .dallage-inner::after,
#dallage-grid-right .dallage-inner::after {
height: 400px;
box-shadow: inset 0 -2px 1px #ffffff30, inset 0 -2px 25px #547777, inset 0 0 150px #6cc7c5, 0 0 0 20px #0d2f34, 0 0 30px 20px black;
}
#dallage-grid-left .dallage-inner::before,
#dallage-grid-right .dallage-inner::before {
--offset-pane: 1000px;
top: var(--offset-pane);
height: calc(100% - var(--offset-pane));
box-shadow: inset 0 2px 1px #ffffff30, inset 0 2px 25px #547777, inset 0 0 150px #6cc7c5, 0 0 0 5px #0d2f34, 0 0 30px 5px black;
}
/*************************************/
/** TODO: A TRANSFERER vers le skin **/
/*************************************/
body.OB h1,
body.OB h2,
body.OB h3,
body.OB h4,
body.OB h5,
body.OB h6 {
text-align: left;
}
@media print {
.page-wrapper {
position: relative !important;
height: auto !important;
}
body .page-wrapper div#content,
body.OB .page-wrapper div#content,
body.OB.theme .page-wrapper div#content {
box-shadow: none !important;
}
#firstHeading,
#firstHeading *,
h1,
h1 *,
h2,
h2 *,
h3,
h3 *,
h4,
h4 *,
h5,
h5 *,
h6,
h6 * {
color: black !important;
}
}
.container {
max-width: 1400px;
}
.mw-parser-output {
text-align: justify;
}
@media screen and (max-width: 1023px) {
.page-wrapper>.container>.row>.col {
padding-left: 0;
padding-right: 0;
}
a.image img {
max-width: 100%;
height: auto;
}
mw-parser-output,
body.OB.theme .mw-parser-output {
padding: 0 1em !important;
}
.theme-spacer {
height: 140px;
pointer-events: none;
display: block !important;
}
div#content,
body.OB div#content,
body.OB.theme div#content {
background: black !important;
}
body.OB span.mw-page-title-namespace,
body.OB span.mw-page-title-separator,
body.OB.theme span.mw-page-title-namespace,
body.OB.theme span.mw-page-title-separator,
{
display: none !important;
}
body.OB #firstHeading,
body.OB.theme #firstHeading {
top: 75px;
max-width: 100%;
font-size: 0;
white-space: nowrap;
}
body.OB .mw-parser-output>ul:last-of-type {
clear: both;
}
}
/** Titre page**/
span#firstHeadingTitle {
padding: 0 0.2em;
}
/** Titre paragraphes **/
body.OB h1,
body.OB h2 {
border: none;
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) black;
padding: 0.5em;
box-shadow: inset 1px 1px #ffffff03, inset 0 0 0 1px #272727, 0 4px 3px black, inset 0 0 10px black !important;
}
a[href].new {
color: #dd3333;
text-decoration: none;
background-color: transparent;
-webkit-text-decoration-skip: objects;
}
/** Style des références (sources): **/
body.OB .mw-references-wrap {
margin-top: 2em;
}
body.OB .mw-references-wrap li {
padding: 6px 24px;
margin: 1rem 0;
border: 1px solid black;
color: rgb(209 209 209);
border-radius: 3px;
background: linear-gradient(transparent 50%, black), linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) black;
box-shadow: inset 1px 1px #ffffff03, inset 0 0 0 1px #272727, 0 4px 3px black, inset 0 0 10px black, inset 0 -50px 50px black, 0 4px 8px #000;
}
body.OB .mw-references-wrap li:first-child {
margin-top: 0;
}
body.OB .mw-references-wrap li:last-child {
margin-bottom: 0;
}
body.OB .mw-references-wrap li:target,
sup.reference:target {
box-shadow: inset 1px 1px #ffffff03, inset 0 0 0 1px #272727, 0 4px 3px black, inset 0 0 10px black, inset 0 -50px 50px #00000085, 0 4px 8px #000 !important;
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) rgba(0, 127, 255, 0.133) !important;
}
/** Layout globale de page : **/
#content {
overflow: hidden;
position: relative;
}
/** Lazy loader : **/
.lazy-loading-tag {
display: inline-flex;
-webkit-mask-image: url('/images/7/7d/LoadMechanicus.png');
-webkit-mask-size: 100% 100%;
mask-image: url('/images/7/7d/LoadMechanicus.png');
mask-size: 100% 100%;
}
.lazy-loader[data-state="sleep"],
.lazy-loader[data-state="sleep"]~*,
.lazy-loader[data-state="loading"]~* {
display: none !important;
}
/** Previews Random **/
.preview {
display: inline-flex;
perspective: 1200px;
perspective-origin: center 30%;
}
.preview * {
transition: 0.5s all ease-in-out;
user-select: none;
}
.preview-ref {
display: none;
}
.preview-container {
background: linear-gradient(transparent 50%, black), linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) black;
box-shadow: inset 1px 1px #ffffff03, inset 0 0 0 1px #272727, 0 4px 3px black, inset 0 0 10px black, inset 0 -50px 50px black;
display: inline-flex;
flex-flow: column;
height: 420px;
min-height: 420px;
width: 280px;
min-width: 280px;
border-radius: 10px 10px 0 0;
text-align: left;
position: relative;
margin: 0 5px 20px 5px;
overflow: hidden;
}
.preview-title {
text-align: center;
border-radius: 10px 10px 0 0;
margin: 1px;
box-shadow: 0 4px 8px #000, inset 0 0 10px #000, inset 0 0 10px #000;
background: #131414;
}
.preview-title a[title] {
text-decoration: none;
font-weight: normal;
font-size: 110%;
padding: 10px 0;
display: block;
border-radius: 10px 10px 0 0;
color: white !important;
}
.preview-title a:hover {
color: #fff !important;
text-shadow: 0 0 2px #000, 0 0 3px #30e2ff, 0 0 5px #30e2ff !important;
background: linear-gradient(#121313, #526c651c 1px, transparent);
box-shadow: inset 0 0 10px #000;
}
.preview-page-bg {
margin: 8px;
border-radius: 5px 5px 0 0;
box-sizing: border-box;
position: absolute;
top: 40px;
height: calc(100% - 80px);
width: calc(100% - 16px);
z-index: 1;
overflow: hidden;
transition: 0.5s all ease-in-out;
}
.preview-page-bg::before {
content: '';
position: absolute;
top: 6px;
right: 6px;
height: calc(100% - 6px);
width: calc(100% - 6px);
box-shadow: inset 0 0 0 1px #8685829e, inset 0 0 15px white, 0 0 5px -2px black;
border-radius: 5px 5px 0 0;
}
.preview-page-bg::after {
content: '';
position: absolute;
top: 2px;
right: 2px;
height: calc(100% - 2px);
width: calc(100% - 2px);
box-shadow: inset 0 0 0 1px #868582, inset -3px 3px #c3b49d, 0 0 5px -2px black;
border-radius: 5px 5px 0 0;
}
.preview-page {
margin: 8px;
overflow: hidden;
font-size: 95%;
-webkit-mask-image: linear-gradient(black 50%, transparent 280px);
mask: linear-gradient(black 50%, transparent 280px);
padding: 20px;
border-radius: 5px;
box-sizing: border-box;
position: absolute;
color: #553b1e;
z-index: 2;
transition: 0.3s;
top: 46px;
right: 6px;
height: calc(100% - 22px);
width: calc(100% - 22px);
transition: 0.5s all ease-in-out;
}
.preview-container.random .preview-page {
-webkit-mask-image: linear-gradient(black 50%, transparent 90%);
mask-image: linear-gradient(black 50%, transparent 90%);
}
.preview-page a,
.preview-page a:visited,
.preview-page a:hover,
.preview-page a[href].new,
.preview-page [data-popover-link],
.preview-page .popover-link {
color: #553b1e !important;
text-decoration: none !important;
text-shadow: none !important;
}
.preview-page span[data-popover-link]::after,
.preview-page a[data-popover-link]::after {
content: none;
}
.preview-page a:hover {
color: #fdfdfd;
text-shadow: 0 0 1px black, 0 0 2px black;
}
.preview-page a[href].new {
color: #cc2200;
text-shadow: none;
}
.preview-background-image {
position: absolute;
top: 40px;
left: 0;
max-height: 325px;
overflow: hidden;
z-index: -1;
opacity: 0.5;
pointer-events: none;
-webkit-mask-image: linear-gradient(black, transparent);
mask: linear-gradient(black, transparent);
transform: translateY(-50%);
}
.preview-footer {
width: 100%;
padding: 10px;
background: #000;
box-shadow: inset 0 0 0 1px #ffffff1c, 0 -5px 5px -5px black, inset 0 0 10px black;
box-sizing: border-box;
display: flex;
overflow: hidden;
align-items: center;
min-height: 40px;
flex-wrap: wrap;
height: 40px;
position: absolute;
bottom: 0;
left: 0;
z-index: 10;
}
.preview-footer>* {
padding: 2px 5px;
border-radius: 5px;
white-space: nowrap;
font-weight: lighter;
font-size: 90%;
background: #2b0d0db0;
opacity: 0.8;
margin: 0 5px 10px;
box-sizing: border-box;
text-overflow: initial;
overflow: initial;
display: block;
}
.preview-footer a[title] {
color: lightgrey !important;
}
.preview-footer a[title]:hover {
text-decoration: none !important;
}
.preview-footer a[title]:hover {
color: white !important;
opacity: 1;
background: #2b0d0d;
}
.preview-navigator {
position: absolute;
left: 0;
z-index: 3;
background: linear-gradient(transparent, black);
width: 100%;
display: flex;
justify-content: center;
align-items: center;
top: 46px;
height: calc(100% - 86px);
background-position: center bottom;
background-size: 100% 50px;
background-repeat: no-repeat;
box-sizing: border-box;
}
.preview-navigator a[title],
.preview-navigator a[title]:visited {
font-weight: normal;
color: #2b1702 !important;
transition: all 0.2s ease-in-out;
text-shadow: 0 0 5px #fff3;
text-decoration: none;
letter-spacing: 1px;
font-size: 18px;
font-family: 'Grenze Gotisch', cursive;
padding-bottom: 10px;
display: flex;
flex: 1;
justify-content: center;
align-items: center;
height: 100%;
width: 100%;
padding-top: 280px;
}
.preview-navigator a:hover {
text-shadow: 0 0 5px white, 0 0 10px white;
}
.preview-random-img img {
-webkit-mask: linear-gradient(90deg, transparent, black 20%, black 95%, transparent);
mask: linear-gradient(90deg, transparent, black 20%, black 95%, transparent);
}
.preview-random-img {
position: absolute;
top: 105px;
left: 50%;
transform: translateX(-50%);
z-index: -1;
-webkit-mask: radial-gradient(black, transparent);
mask: radial-gradient(black, transparent);
transition: 0.5s all ease-in-out;
}
.preview:hover .preview-page-img {
scale: 1.05;
}
.preview-page::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
background: linear-gradient(#00000030 1px, transparent 2px, transparent 100%), linear-gradient(90deg, #00000030 1px, transparent 2px, transparent 100%);
background-size: 100% 8px, 8px 100%;
-webkit-mask: radial-gradient(transparent 60%, black);
mask: radial-gradient(transparent 60%, black);
opacity: 0.5;
}
.preview-page::after {
position: absolute;
content: '';
top: 6px;
left: 6px;
height: calc(100% - 12px);
width: calc(100% - 12px);
box-shadow: inset 0 0 0 1px #2d1515ba, inset 0 0 0 2px #731919;
clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 22px, 100% 100%, 0 100%);
opacity: 0.5;
}
.preview-container.random .preview-footer a {
font-size: 18px;
border-radius: 50%;
box-sizing: border-box;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate3d(-50%, -50%, 0);
height: 30px;
width: 30px;
display: flex;
justify-content: center;
align-items: center;
}
.preview-page>a:first-child {
position: absolute;
font-size: 0;
color: transparent;
top: 0;
right: 0;
width: 35px;
height: 25px;
z-index: 5;
border-radius: 0 0 0 8px;
clip-path: polygon(-20% -20%, 120% 120%, -20% 120%);
box-shadow: inset 1px -1px 0 #938a7a, 0 0 5px, 0 0 5px #a7977a;
transform: translateX(18px) rotate(32deg);
transform-origin: left top;
background: linear-gradient(45deg, #eadabf 30%, #37230d);
}
.preview-page>a:first-child:hover {
background: linear-gradient(45deg, #d5c3a4 30%, #553717);
}
.preview-page-img {
position: absolute;
width: 200px;
height: 280px;
background: black;
top: 50%;
box-shadow: 2px 2px 20px black;
overflow: hidden;
border-radius: 10px;
border: 1px solid #ffffff17;
display: flex;
justify-content: center;
align-items: center;
}
.preview-page-img.right {
right: 0;
transform: translateY(-45%) translateX(100%) rotateY(-41deg);
}
.preview-page-img.left {
left: 0;
transform: translateY(-45%) translateX(-100%) rotateY(41deg);
}
.preview-page-img::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-shadow: inset 0 0 0 1px #ffffff38;
background: linear-gradient(transparent, transparent 6px, #6af1f84d 20px, #ffffff8b 13px, #6af1f84d 16px, transparent), linear-gradient(rgba(0, 0, 0, 0.1) 0px, rgba(0, 0, 0, 0.1) 2px, rgba(128, 128, 128, 0.1) 2px, rgba(128, 128, 128, 0.1) 4px);
background-size: 100% 20px, auto 4px;
background-position: 0 -30px, center center;
background-repeat: no-repeat, repeat;
opacity: 0.6;
border-radius: 10px;
}
.preview-symbol {
position: absolute;
top: 45%;
left: 50%;
transform: translate3d(-50%, -50%, 0);
opacity: 0.6;
z-index: 0;
pointer-events: none;
}
#previews-wrapper {
--preview-wrapper-bg: black;
position: relative;
margin: 0 auto 60px auto;
overflow: hidden;
display: flex;
flex-wrap: wrap;
width: 1100px;
box-sizing: border-box;
justify-content: center;
max-width: 100%;
}
#previews-wrapper>* {
margin: 40px 40px 0 !important;
transition: 0.3s all ease-in-out;
z-index: 1;
}
#previews-wrapper> :nth-child(2n+1) {
justify-self: end;
}
#previews-wrapper> :nth-child(2n) {
justify-self: start;
}
.preview-section-subtitle {
text-align: center;
letter-spacing: 2px;
font-family: 'Grenze Gotisch', cursive;
font-size: 18px;
font-style: normal;
color: #403e3e;
padding: 10px;
text-shadow: 0 0 3px #00000021, 0 0 15px #00000057;
}
#previews-wrapper>.preview-refresh-btn {
position: absolute;
top: 500px;
left: 50%;
transform: translateX(-50%) translateY(-50%);
margin: 0 !important;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%);
box-shadow: inset 0 0 0 1px #27272782, inset 0 0 10px black, inset 0 0 10px #000, 0 4px 3px black;
cursor: pointer;
font-size: 32px;
color: white;
user-select: none;
padding: 5px 5px 4px 5px;
transition: 0.3s all ease-in-out;
z-index: 0;
}
#previews-wrapper>.preview-refresh-btn:hover {
box-shadow: inset 0 0 0 1px #27272782, inset 0 0 10px black, inset 0 0 10px #000, 0 0 2px white, 0 0 10px #30e2ff, 0 0 100px #30e2ff;
}
#previews-wrapper[status="loading"]>.preview-refresh-btn {
pointer-events: none !important;
box-shadow: inset 0 0 0 1px #27272782, inset 0 0 10px black, inset 0 0 10px #000, 0 0 2px white, 0 0 10px #30e2ff, 0 0 100px #30e2ff;
}
.preview-refresh-btn::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 400px;
height: 400px;
background: conic-gradient(transparent, var(--preview-wrapper-bg), transparent, var(--preview-wrapper-bg), transparent, var(--preview-wrapper-bg), transparent, var(--preview-wrapper-bg), transparent, var(--preview-wrapper-bg), transparent, var(--preview-wrapper-bg), transparent);
transform: translate3d(-50%, -50%, 0);
-webkit-mask: radial-gradient(transparent 30px, black 70px, transparent 70%);
mask: radial-gradient(transparent 30px, black 70px, transparent 70%);
border-radius: 50%;
box-shadow: inset 0 0 20px black;
pointer-events: none;
animation: 5s center-rotation infinite linear;
animation-play-state: paused;
opacity: 0;
}
.preview-refresh-btn:hover::after {
opacity: 1;
}
#previews-wrapper[status="loading"] .preview-refresh-btn::after {
animation-play-state: running;
opacity: 1;
}
#previews-wrapper>.preview-refresh-btn>div {
background: black;
height: 50px;
width: 50px;
position: absolute;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
z-index: 1;
box-shadow: inset 1px 1px #ffffff03, inset 0 0 0 1px #272727, 0 4px 3px black, inset 0 0 10px black, inset 0 0 20px black, inset 0 0 20px black;
background: linear-gradient(135deg, #717978a0, #414444a0, #575b5ba0, #232625a0, #3c4240a0, #1f2322a0, #717978a0, #414444a0, #575b5ba0, #232625a0, #3c4240a0, #1f2322a0) #2f2d2d !important;
font-size: 40px;
padding-bottom: 6px;
box-sizing: border-box;
text-shadow: 0 0 2px #000, 0 0 3px #59595970, 0 0 5px #ffffff73 !important;
color: black;
}
#previews-wrapper>.preview-refresh-btn:hover>div {
text-shadow: 0 0 2px #ff3030, 0 0 3px #ff3030, 0 0 5px #ff3030 !important;
color: white;
}
#previews-wrapper[status="loading"]>.preview-refresh-btn:hover>div {
color: black !important;
text-shadow: 0 0 2px #000, 0 0 3px #59595970, 0 0 5px #ffffff73 !important;
opacity: 1 !important;
}
#previews-wrapper>.preview-refresh-btn img {
position: relative;
pointer-events: none;
transition: 2s all ease-in-out;
z-index: 0;
transform: rotate(0deg);
border-radius: 50%;
overflow: hidden;
width: 70px;
height: 70px;
}
#previews-wrapper>.preview-refresh-btn:hover img {
transform: rotate(180deg);
}
/** Adjust Style for dynamic Preview resfresh: **/
#previews-wrapper * {
transition: 0.5s all ease-in-out;
user-select: none;
}
#previews-wrapper[status="loading"] .preview-footer a {
opacity: 0;
pointer-events: none;
}
#previews-wrapper[status="loading"] .preview * {
color: transparent !important;
text-shadow: none !important;
pointer-events: none;
}
#previews-wrapper[status="loading"] .preview-page,
#previews-wrapper[status="loading"] .preview-page-bg {
transform: translateY(100%);
}
.preview {
transform-style: preserve-3d;
}
.preview-page-img {
transition: 0.5s all ease-in-out;
backface-visibility: hidden;
}
#previews-wrapper[status="loading"] .preview-page-img.left {
transform: translateY(-45%) translateX(-100%) rotateY(calc(180deg + 41deg));
}
#previews-wrapper[status="loading"] .preview-page-img.right {
transform: translateY(-45%) translateX(100%) rotateY(calc(-180deg - 41deg));
}
.preview-page-img::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 10px;
transition: 1s all ease-in-out;
box-shadow: inset 0 0 0 1px #000;
}
#previews-wrapper[status="loading"] .preview-page-img::before {
box-shadow: inset 0 0 500px 250px black;
}
#previews-wrapper[status="loading"] .preview-footer a {
position: relative;
transform: translateX(-300px);
}
@-webkit-keyframes center-rotation {
from {
transform: translate3d(-50%, -50%, 0) rotate(0);
}
to {
transform: translate3d(-50%, -50%, 0) rotate(360deg);
}
}
@keyframes center-rotation {
from {
transform: translate3d(-50%, -50%, 0) rotate(0);
}
to {
transform: translate3d(-50%, -50%, 0) rotate(360deg);
}
}
/** Theme Votann features **/
.votann-runes-mask {
-webkit-mask-image: url('/images/e/ea/VotannRunes.png');
-webkit-mask-size: 100% auto;
-webkit-mask-repeat: no-repeat repeat;
-webkit-mask-position-x: center;
mask-image: url('/images/e/ea/VotannRunes.png');
mask-size: 100% auto;
mask-repeat: no-repeat repeat;
mask-position-x: center;
}
.votann-runes-wrapper {
width: 100%;
height: 100%;
background-size: 100%;
background-image: url('/images/e/ea/VotannRunes.png');
-webkit-filter: drop-shadow(0 0 2px black) drop-shadow(0 0 2px #00f3ff);
-moz-filter: drop-shadow(0 0 2px black) drop-shadow(0 0 2px #00f3ff);
-ms-filter: drop-shadow(0 0 2px black) drop-shadow(0 0 2px #00f3ff);
-o-filter: drop-shadow(0 0 2px black) drop-shadow(0 0 2px #00f3ff);
filter: drop-shadow(0 0 2px black) drop-shadow(0 0 2px #00f3ff);
}
.votann-symbol-wrapper {
width: 100%;
height: 100%;
background-size: 100%;
background-image: url(/images/b/b0/VotannFactionSymbol.png);
background-position: center center;
background-repeat: no-repeat;
-webkit-filter: drop-shadow(0 0 2px black) drop-shadow(0 0 2px #00f3ff);
-moz-filter: drop-shadow(0 0 2px black) drop-shadow(0 0 2px #00f3ff);
-ms-filter: drop-shadow(0 0 2px black) drop-shadow(0 0 2px #00f3ff);
-o-filter: drop-shadow(0 0 2px black) drop-shadow(0 0 2px #00f3ff);
filter: drop-shadow(0 0 2px black) drop-shadow(0 0 2px #0d0d0da3);
}
.votann-symbol-wrapper.back {}
.votann-symbol-mask {
-webkit-mask-image: url(/images/b/b0/VotannFactionSymbol.png);
-webkit-mask-size: 100% auto;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center center;
mask-image: url(/images/b/b0/VotannFactionSymbol.png);
mask-size: 100% auto;
mask-repeat: no-repeat;
mask-position: center center;
height: 100%;
}
/** Theme Ork features **/
body.OB.theme-ork .mw-parser-output h3 {
background: linear-gradient(#000, #0000 50%), url('/images/6/69/Deco-ork-6.jpg'), linear-gradient(#601717, #601717) !important;
padding-bottom: 31px;
background-size: auto 22px, auto 22px, auto 27px !important;
background-position-y: bottom !important;
background-repeat: no-repeat !important;
/* mask: linear-gradient(black 80%, transparent 120%); */
box-shadow: inset 10px 0 10px -10px black, inset -10px 0 10px -10px black !important;
}
body.OB.theme-ork .mw-parser-output h1,
body.OB.theme-ork .mw-parser-output h2 {
border: none;
background: linear-gradient(#000, #0000 50%), url(/images/6/69/Deco-ork-6.jpg), linear-gradient(#601717, #601717), linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) #011712;
padding: 0.5em;
box-shadow: inset 0 1px 0 #272727, inset 0 0 10px black, inset 0 0 20px black !important;
padding-bottom: 31px;
background-size: auto 22px, auto 22px, auto 27px, auto auto !important;
background-position-y: bottom !important;
background-repeat: no-repeat !important;
}
body.OB.theme-ork #deco-top-middle-border {
background: url('/images/5/5e/Deco-ork-3.jpg');
background-size: auto 100%;
}
/** Encadré style Asuryani **/
body.OB.theme .asuryani-pane-1 {
padding: 1em;
border-radius: 20px;
text-shadow: 0 0 5px black;
max-width: 100%;
color: #ccd7db !important;
border: 1px solid #6171711c !important;
box-shadow: 0 10px 10px -10px black, 0 20px 20px -20px black, 0 30px 30px -30px black, inset 0 0 2px 5px #00000070;
background: linear-gradient(135deg, #03807047 0, #013c3c47 25%, #015b5b47 40%, #001a1e47 55%, #013b4447 75%, #00040347 85%);
}
body.OB.theme .asuryani-pane-2 {
background: #9dbdc226;
padding: 1em;
border-radius: 20px;
box-shadow: 0 4px 4px -2px #66848c;
max-width: 100%;
}
body.OB.theme .asuryani-pane-3 {
color: #90b9b5;
padding: 60px 0;
clip-path: polygon(0 0, 100% 60px, 100% 100%, 0 calc(100% - 60px));
width: calc(100% + 100px);
transform: translateX(-50px);
background: linear-gradient(2deg, black 50px, transparent 100px, transparent calc(100% - 100px), black calc(100% - 50px)), linear-gradient(135deg, #03807047 0, #013c3c47 25%, #015b5b47 40%, #001a1e47 55%, #013b4447 75%, #00040347 85%) #0f141c;
box-shadow: 0 10px 10px -10px black, 0 20px 20px -20px black, 0 30px 30px -30px black, inset 0 0 2px 5px #00000070;
clear: both;
}
/** Cadre custom necromunda **/
.cadre-custom-necromunda {
width: 800px;
max-width: 100%;
position: relative;
padding: 3em;
box-sizing: border-box;
margin: 40px auto;
background: url(/images/0/0f/Parchemin.jpg);
font-family: 'Grenze Gotisch', cursive;
font-size: 1rem;
color: #3c2407;
box-shadow: inset 0 0 10px 9px #473720, inset 0 0 20px 9px #473720;
}
.cadre-custom-necromunda .ccn-deco {
pointer-events: none;
position: absolute;
}
.cadre-custom-necromunda .ccn-corner {
pointer-events: none;
position: absolute;
left: 0;
width: 100%;
}
.cadre-custom-necromunda .ccn-deco.p-top {
top: 0;
}
.cadre-custom-necromunda .ccn-deco.p-bottom {
bottom: 0;
}
.cadre-custom-necromunda .ccn-deco.p-left {
left: 0;
}
.cadre-custom-necromunda .ccn-deco.p-right {
right: 0;
}
.cadre-custom-necromunda .ccn-corner.p-top>.image {
position: absolute;
top: 0;
z-index: 10;
}
.cadre-custom-necromunda .ccn-corner.p-bottom>.image {
position: absolute;
bottom: 0;
z-index: 10;
}
.cadre-custom-necromunda .ccn-corner.p-top>.image:first-child {
left: 0;
transform: scaleX(-1);
}
.cadre-custom-necromunda .ccn-corner.p-top>.image:last-child {
right: 0;
}
.cadre-custom-necromunda .ccn-corner.p-bottom>.image:first-child {
right: 0;
transform: scaleX(-1);
}
.cadre-custom-necromunda .ccn-corner.p-bottom>.image:last-child {
left: 0;
}
.ccn-deco.ccn-border {
border: 1px solid #4e3e25;
overflow: hidden;
box-sizing: border-box;
z-index: 5;
}
.cadre-custom-necromunda .ccn-border.p-top,
.cadre-custom-necromunda .ccn-border.p-bottom {
width: 100%;
height: 8px;
left: 0;
background: url("/images/5/59/Cadre-necromunda-border-h.jpg");
}
.cadre-custom-necromunda .ccn-border.p-left,
.cadre-custom-necromunda .ccn-border.p-right {
width: 8px;
height: 100%;
top: 0;
background: url("/images/e/eb/Cadre-necromunda-border.jpg");
}
.cadre-custom-necromunda .ccn-deco.ccn-sign.p-top {
left: 50%;
top: 0;
transform: translateX(-50%) translateY(-43px);
z-index: 20;
}
.cadre-custom-necromunda .ccn-title {
font-size: 1.6rem;
line-height: 100%;
display: inline-flex;
align-items: center;
padding: 5px;
box-shadow: 0 0 0px 2px #6f5f466b, 0 0 0px 7px #dac7a7, 0 0 0px 12px #4d130f85;
margin-bottom: 30px;
position: relative;
left: 50%;
transform: translateX(-50%);
box-sizing: border-box;
}
.cadre-custom-necromunda .ccn-title :first-child {
font-size: 280%;
margin-right: 5px;
height: 100%;
display: flex;
padding-bottom: 8px;
color: #4d130fd4;
text-shadow: 0 0 2px #d5c4a6;
}
.cadre-custom-necromunda .ccn-deco.ccn-stamp {
right: 0;
opacity: 0.5;
top: 50px;
z-index: 0;
}
.cadre-custom-necromunda .ccn-content {
display: flex;
flex-direction: column;
align-items: center;
}
.cadre-custom-necromunda .ccn-content p {
margin: 0;
}
.cadre-custom-necromunda .ccn-deco.ccn-seal {
position: absolute;
bottom: 0;
right: 90px;
transform: translateY(20%);
z-index: 15;
}
.cadre-custom-necromunda .ccn-separator {
height: 10px;
display: flex;
align-items: center;
}
.cadre-custom-necromunda .ccn-tree-fork {
display: flex;
align-items: start;
width: 100%;
}
.cadre-custom-necromunda .ccn-tree-fork> :first-child {
text-align: right;
margin: 10px 10px 0 0;
flex: 1;
}
.cadre-custom-necromunda .ccn-tree-fork> :last-child {
text-align: right;
margin: 10px 0 0 10px;
flex: 1;
}
.cadre-custom-necromunda .ccn-tree-fork>*>* {
padding-bottom: 4px;
}
.cadre-custom-necromunda .ccn-tree-fork> :first-child>* {
text-align: right;
position: relative;
padding-right: 10px;
}
.cadre-custom-necromunda .ccn-tree-fork> :first-child> ::after {
content: '';
position: absolute;
top: 0;
right: 0;
height: 100%;
width: 1px;
background: #3c2407;
}
.cadre-custom-necromunda .ccn-tree-fork> :last-child>* {
text-align: left;
position: relative;
padding-left: 10px;
}
.cadre-custom-necromunda .ccn-tree-fork> :last-child> ::after {
content: '';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 1px;
background: #3c2407;
}
/** Filtre vitraux pour le theme Sororitas. **/
body.theme-sororitas .deco-left>.deco-left-1 img,
body.theme-sororitas .deco-right>.deco-right-1 img {
filter: hue-rotate(50deg) brightness(1.4) saturate(0.5);
}
/** Effet sur le sigle libre-marchand **/
body.OB.theme.theme-jdr-rogue-trader .deco-top-middle-sigil .image {
display: block;
-webkit-mask: url('/images/9/92/Symbol_libre-marchand.png');
mask: url('/images/9/92/Symbol_libre-marchand.png');
}
/** theme JDR imperium maledictum **/
.jdr-imperium-maledictum-margin-bg {
background: url("/images/thumb/2/29/Imperium-maledictum-margin.jpg/100px-Imperium-maledictum-margin.jpg");
}
/** theme Drukhari **/
.side-drukhari-margin-bg {
background: linear-gradient(-90deg, transparent, black), url(/images/5/54/Side-drukhari.jpg) black;
background-size: 150px 900px;
background-repeat: no-repeat;
}
body.OB.theme.theme-drukhari .deco-left-1::after {
background: url(/images/4/4f/Drukhari-side_left.jpg) !important;
background-repeat: no-repeat !important;
background-position: -50px top !important;
-webkit-mask-image: linear-gradient(130deg, black, transparent 500px);
mask: linear-gradient(130deg, black, transparent 500px);
opacity: 0.5;
filter: sepia(0.5) hue-rotate(230deg);
}
body.OB.theme.theme-drukhari .deco-right-1::after {
background: url(/images/b/be/Drukhari-side_right.jpg) !important;
background-repeat: no-repeat !important;
background-position: -80px -50px !important;
-webkit-mask-image: linear-gradient(130deg, black, transparent 500px);
mask: linear-gradient(130deg, black, transparent 500px);
opacity: 0.5;
filter: sepia(0.5) hue-rotate(230deg);
transform: scale(-1, 1);
}
/** theme Arlequin **/
.side-arlequin-margin-bg {
background: linear-gradient(-90deg, transparent, black), url(/images/4/49/Side-arlequin.jpg) black;
background-size: 175px 310px;
}
body.OB.theme.theme-Arlequin .deco-left-1::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(/images/1/15/Arlequin-side_left.jpg) !important;
background-repeat: no-repeat !important;
background-position: -80px top !important;
-webkit-mask-image: linear-gradient(130deg, black, transparent 400px);
mask: linear-gradient(130deg, black, transparent 400px);
opacity: 0.5;
filter: sepia(0.5);
}
body.OB.theme.theme-Arlequin .deco-right-1::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(/images/7/7a/Arlequin-side_right.jpg) !important;
background-repeat: no-repeat !important;
background-position: -80px -50px !important;
-webkit-mask-image: linear-gradient(130deg, black, transparent 500px);
mask: linear-gradient(130deg, black, transparent 500px);
opacity: 0.5;
filter: sepia(0.5);
transform: scaleX(-1);
}
/** theme Ynnari **/
.side-ynnari-margin-bg {
background: linear-gradient(-90deg, transparent, black), url(/images/5/54/Side-drukhari.jpg) black;
background-size: 150px 900px;
background-repeat: no-repeat;
}
body.OB.theme.theme-Ynnari .deco-left-1::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(/images/6/65/Ynnari-side_left.jpg) !important;
background-repeat: no-repeat !important;
background-position: -50px top !important;
-webkit-mask-image: linear-gradient(130deg, black, transparent 500px);
mask: linear-gradient(130deg, black, transparent 500px);
opacity: 0.5;
filter: sepia(0.5) hue-rotate(230deg);
}
body.OB.theme.theme-Ynnari .deco-right-1::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(/images/3/3f/Ynnari-side_right.jpg) !important;
background-repeat: no-repeat !important;
background-position: -40px 0px !important;
-webkit-mask-image: linear-gradient(130deg, black, transparent 400px);
mask: linear-gradient(130deg, black, transparent 400px);
opacity: 0.5;
filter: sepia(0.5) hue-rotate(230deg);
transform: scale(-1, 1);
}
/** theme Imperium **/
.side-imperium-margin-bg {
background: linear-gradient(-90deg, transparent, black), url("/images/thumb/2/29/Imperium-maledictum-margin.jpg/100px-Imperium-maledictum-margin.jpg");
background-size: 150px 900px;
}
body.OB.theme.theme-Imperium .deco-left-1::after,
body.OB.theme.theme-Inquisition .deco-left-1::after,
body.OB.theme.theme-assassinorum .deco-left-1::after,
body.OB.theme.theme-adeptus-ministorum .deco-left-1::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(/images/c/c4/Imperium-side_left.jpg) !important;
background-repeat: no-repeat !important;
-webkit-mask-image: linear-gradient(130deg, black, transparent 500px);
mask: linear-gradient(130deg, black, transparent 500px);
opacity: 0.8;
filter: sepia(0.5) hue-rotate(150deg);
}
body.OB.theme.theme-Imperium .deco-right-1::after,
body.OB.theme.theme-Inquisition .deco-right-1::after,
body.OB.theme.theme-assassinorum .deco-right-1::after,
body.OB.theme.theme-adeptus-ministorum .deco-right-1::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(/images/7/79/Imperium-side_right.jpg) !important;
background-repeat: no-repeat !important;
background-position: right 0px !important;
-webkit-mask-image: linear-gradient(130deg, black, transparent 500px);
mask: linear-gradient(130deg, black, transparent 500px);
opacity: 0.5;
filter: sepia(0.5) hue-rotate(150deg);
transform: scale(-1, 1);
}
body.OB.theme.theme-Imperium .deco-top-left-alt>.image,
body.OB.theme.theme-Imperium .deco-top-right-alt>.image,
body.OB.theme.theme-assassinorum .deco-top-left-alt>.image,
body.OB.theme.theme-assassinorum .deco-top-right-alt>.image,
body.OB.theme.theme-Inquisition .deco-top-left-alt>.image,
body.OB.theme.theme-Inquisition .deco-top-right-alt>.image,
body.OB.theme.theme-adeptus-ministorum .deco-top-left-alt>.image,
body.OB.theme.theme-adeptus-ministorum .deco-top-right-alt>.image {
filter: brightness(0.7) grayscale(0.4);
}
/** Background parchemin. **/
.bg-parchemin {
background: url('/images/0/0f/Parchemin.jpg') !important;
}
.bg-parchemin-clair,
.bg-parchemin-light,
.bg-parchemin-lightened {
background: url('/images/8/84/Parchemin-clair.jpg') !important;
}
/** gestion auto des marges des table flottantes **/
body.mediawiki .mw-parser-output>table.float-right {
margin: 0 0 1em 1em;
clear: right;
}
body.mediawiki .mw-parser-output>table.float-left {
margin: 0 1em 1em 0;
clear: left;
}
body.mediawiki .mw-parser-output>table.auto-center {
margin-bottom: 1em;
clear: both;
}
/** Grille s'ajustant à la taille de l'écran. **/
.responsive-grid {
clear: both;
display: flex;
flex-wrap: wrap;
max-width: 100%;
}
.responsive-grid>* {
flex: 1;
padding: 1em;
box-sizing: border-box;
}
/** scrollbar du site (sauf pour firefox) **/
body::-webkit-scrollbar {
width: 20px;
}
body::-webkit-scrollbar-thumb {
background: linear-gradient(135deg, #717978, #414444, #575b5b, #232625, #3c4240, #1f2322);
border-radius: 3px;
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 5px black, inset 0 0 15px black;
}
body::-webkit-scrollbar-track {
background: #151616;
box-shadow: -1px 0 1px #1e1e1e;
}
/** police d'écriture spéciale**/
.text-standard {
font-size: 1rem;
font-family: Verdana, Geneva, sans-serife;
font-weight: normal;
font-size: 1rem;
font-style: normal;
text-transform: none;
line-height: 1;
}
.text-gothic {
font-family: 'Grenze Gotisch', cursive;
font-weight: normal;
font-size: 1.2rem;
font-style: normal;
text-transform: none;
line-height: 1.2;
}
.text-gothic a {
font-weight: normal !important;
}
.text-scifi {
font-family: 'Iceland';
font-size: 1.4em;
letter-spacing: -0.5px;
}
/** Mise en évidence de la première lettre d'un texte en gothic et grande taille. **/
.first-letter-large:first-letter {
font-family: 'Grenze Gotisch', cursive;
font-weight: normal;
font-style: normal;
text-transform: none;
line-height: 0.6;
font-size: calc(1.375rem + 1.5vw) !important;
float: left;
margin-right: 0.1em;
}
/** Classes génériques **/
.w-300,
.w-xs {
width: 300px !important;
max-width: 100%;
}
.w-400,
.w-small {
width: 400px !important;
max-width: 100%;
}
.w-500 {
width: 500px !important;
max-width: 100%;
}
.w-600 {
width: 600px !important;
max-width: 100%;
}
.w-800,
.w-middle {
width: 800px !important;
max-width: 100%;
}
.w-1000,
.w-large {
width: 1000px !important;
max-width: 100%;
}
.w-1200,
.w-xl {
width: 1200px !important;
max-width: 100%;
}
.w-100p,
.w-100 {
width: 100% !important;
}
.w-min-300 {
min-width: min(100%, 300px) !important;
}
.w-min-400 {
min-width: min(100%, 400px) !important;
}
.w-min-500 {
min-width: min(100%, 500px) !important;
}
.w-min-600 {
min-width: min(100%, 600px) !important;
}
.w-min-800 {
min-width: min(100%, 800px) !important;
}
.w-min-1000 {
min-width: min(100%, 1000px) !important;
}
.w-min-1200 {
min-width: min(100%, 1200px) !important;
}
.w-100p,
.w-100 {
width: 100% !important;
}
.auto-center {
margin-left: auto !important;
margin-right: auto !important;
}
.auto-center.auto-margin {
margin-left: 0 auto 1em auto !important;
}
.text-center {
text-align: center !important;
}
.text-right {
text-align: right !important;
}
.text-left {
text-align: left !important;
}
.text-italic {
font-style: italic !important;
}
.text-bold {
font-weight: bold !important;
}
.float-left {
float: left !important;
}
.float-left.auto-margin {
margin: 0 1em 1em 0 !important;
}
.float-right {
float: right !important;
}
.float-right.auto-margin {
margin: 0 0 1em 1em !important;
}
.clear-both {
clear: both !important;
}
.clear-right {
clear: right !important;
}
.clear-left {
clear: left !important;
}
.OB-panel {
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) black;
box-shadow: inset 1px 1px #ffffff03, 0 0 0 1px #272727, 0 4px 3px black, inset 0 0 10px black !important;
border-radius: 3px;
padding: 0.2em;
}
/*** tables ***/
/** fix pour les fiche de char**/
table.fiche-char td:nth-child(2n+1) {
white-space: nowrap;
}
/** Table custom standard **/
table.OB-data-table {
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) black;
box-shadow: inset 1px 1px #ffffff03, 0 0 0 1px #272727, 0 4px 3px black, inset 0 0 10px black !important;
border-radius: 3px;
border-collapse: separate;
border-spacing: 0.5em 0.4em;
padding: 0.2em;
}
table.OB-data-table>tr>th,
table.OB-data-table>*>tr>th {
color: #bdbdbd;
}
table.OB-data-table>tr>td,
table.OB-data-table>*>tr>td {
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) black !important;
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black;
border-radius: 3px;
margin: 0.2em;
padding: 0.2em 1em;
}
/** Ancien stile 'wikitable' **/
table.simple {
background-color: #f8f9fa;
color: #222;
margin: 1em 0;
border: 1px solid #a2a9b1;
border-collapse: collapse;
}
table.simple>tr>th,
table.simple>tr>td,
table.simple>*>tr>th,
table.simple>*>tr>td {
border: 1px solid #a2a9b1;
padding: 0.2em 0.4em;
}
body.OB .mw-parser-output>.wikitable {
float: none;
margin-left: auto;
margin-right: auto;
}
body.OB.theme table.wikitable:not(.simple) {
color: #DBE9F4;
max-width: 100%;
}
/** table - style Adepta Sororitas **/
body.OB.theme table.wikitable_sororitas {
color: #DBE9F4;
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) black !important;
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black !important;
padding: 30px;
border-radius: 5px;
padding: 10px;
border: none;
border-collapse: unset;
clear: both;
border-spacing: 0;
}
body.OB.theme table.wikitable_sororitas>tr>th,
body.OB.theme table.wikitable_sororitas>tr>td,
body.OB.theme table.wikitable_sororitas>*>tr>th,
body.OB.theme table.wikitable_sororitas>*>tr>td {
border: 2px solid #623939;
padding: 10px 20px;
}
body.OB.theme.theme-jdr-imperium-maledictum table.wikitable {
position: relative;
background-image: url("/images/8/89/Imperium-maledictum-panel-bg.jpg") !important;
background-repeat: repeat !important;
box-shadow: inset 4px 4px #ffffff03, inset 0 0 0 4px #95a0a2, 0 4px 5px black, inset 0 0 10px black !important;
}
body.OB.theme.theme-jdr-imperium-maledictum table.wikitable:not(.citation)::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 42px;
height: 100%;
background-image: url("/images/4/40/Imperium-maledictum-panel-corner-top.png"), url("/images/b/ba/Imperium-maledictum-panel-corner-bottom.png");
background-position: left top, left bottom;
background-repeat: no-repeat, no-repeat;
pointer-events: none;
}
body.OB.theme.theme-jdr-imperium-maledictum table.wikitable:not(.citation)::after {
content: '';
position: absolute;
top: 0;
right: 0;
width: 42px;
height: calc(100% + 1px);
background-image: url("/images/4/40/Imperium-maledictum-panel-corner-top.png"), url("/images/b/ba/Imperium-maledictum-panel-corner-bottom.png");
background-position: left top, left bottom;
background-repeat: no-repeat, no-repeat;
transform: scaleX(-1);
pointer-events: none;
}
/** Modèles: **/
.parchemin-ob {
background: linear-gradient(transparent 50%, black), linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) black;
box-shadow: inset 1px 1px #ffffff03, inset 0 0 0 1px #272727, 0 4px 3px black, inset 0 0 10px black, inset 0 -50px 50px black;
display: flex;
flex-flow: column;
border-radius: 10px;
text-align: left;
position: relative;
margin: 0 5px 20px 5px;
overflow: hidden;
}
.parchemin-ob-title {
text-align: center;
border-radius: 10px 10px 0 0;
margin: 1px;
box-shadow: 0 4px 8px #000, inset 0 0 10px #000, inset 0 0 10px #000;
background: #131414;
min-height: 39px;
display: flex;
justify-content: center;
align-items: center;
color: white;
font-family: 'Grenze Gotisch', cursive;
font-weight: normal;
font-size: 20px;
}
.parchemin-ob-title a {
text-decoration: none;
font-weight: normal;
padding: 10px 0;
display: block;
border-radius: 10px 10px 0 0;
color: white;
flex: 1;
}
.parchemin-ob.titled .parchemin-ob-title a {
color: white !important;
}
.parchemin-ob.titled .parchemin-ob-title a.external {
background-position-x: calc(100% - 10px);
}
.parchemin-ob-title a:hover {
color: white !important;
text-shadow: 0 0 2px #000, 0 0 3px #30e2ff, 0 0 5px #30e2ff !important;
box-shadow: inset 0 0 10px #000;
}
.parchemin-ob-page-bg {
margin: 8px;
border-radius: 5px;
box-sizing: border-box;
position: absolute;
top: 0;
height: calc(100% - 16px);
width: calc(100% - 16px);
z-index: 1;
overflow: hidden;
}
.parchemin-ob.titled .parchemin-ob-page-bg {
top: 40px;
height: calc(100% - 56px);
}
.parchemin-ob-page-bg::before {
content: '';
position: absolute;
top: 6px;
right: 6px;
height: calc(100% - 6px);
width: calc(100% - 6px);
box-shadow: inset 0 0 0 1px #8685829e, inset 0 0 15px white, 0 0 5px -2px black;
border-radius: 5px;
}
.parchemin-ob-page-bg::after {
content: '';
position: absolute;
top: 2px;
right: 2px;
height: calc(100% - 2px);
width: calc(100% - 2px);
box-shadow: inset 0 0 0 1px #868582, inset -3px 3px #c3b49d, 0 0 5px -2px black;
border-radius: 5px;
}
.parchemin-ob-content {
margin: 14px 14px 8px 14px;
overflow: hidden;
padding: 20px;
border-radius: 5px;
box-sizing: border-box;
color: #382612;
z-index: 2;
right: 6px;
width: calc(100% - 22px);
position: relative;
height: 100%;
flex: 1;
}
.mw-body-content .parchemin-ob-content a,
.mw-body-content .parchemin-ob-content a.external {
text-decoration: none !important;
text-shadow: none;
color: #382612 !important;
}
.mw-body-content .parchemin-ob-content a:hover,
.mw-body-content .parchemin-ob-content a.external:hover {
color: #fdfdfd !important;
text-shadow: 0 0 1px black, 0 0 2px black !important;
}
.mw-body-content .parchemin-ob-content a[href].new:hover,
.mw-body-content .parchemin-ob-content a[href].new {
text-decoration: none !important;
text-shadow: none;
color: #cc2200 !important;
}
.parchemin-ob-content a[href].new {
color: #cc2200;
text-shadow: none;
}
.parchemin-ob-content::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(#00000030 1px, transparent 2px, transparent 100%), linear-gradient(90deg, #00000030 1px, transparent 2px, transparent 100%);
background-size: 100% 8px, 8px 100%;
-webkit-mask: radial-gradient(transparent 60%, black);
mask: radial-gradient(transparent 60%, black);
opacity: 0.5;
pointer-events: none;
}
.parchemin-ob-content::after {
position: absolute;
content: '';
top: 6px;
left: 6px;
height: calc(100% - 12px);
width: calc(100% - 12px);
box-shadow: inset 0 0 0 1px #2d1515ba, inset 0 0 0 2px #731919;
clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 22px, 100% 100%, 0 100%);
opacity: 0.5;
pointer-events: none;
}
.parchemin-ob-content .parchemin-ob-corner {
position: absolute;
font-size: 0;
color: transparent;
top: 0;
right: 0;
width: 35px;
height: 25px;
z-index: 5;
border-radius: 0 0 0 8px;
clip-path: polygon(-20% -20%, 120% 120%, -20% 120%);
box-shadow: inset 1px -1px 0 #938a7a, 0 0 5px, 0 0 5px #a7977a;
transform: translateX(18px) rotate(32deg);
transform-origin: left top;
background: linear-gradient(45deg, #eadabf 30%, #37230d);
}
.parchemin-ob.inlight .parchemin-ob-content .parchemin-ob-corner {
background: linear-gradient(45deg, #e4e0d5 30%, #544937);
}
body.OB .mw-parser-output>ul:last-of-type {
box-shadow: 5px 5px 5px -5px #0000006e, inset 0 0 50px #000, 0 0 3px #443c3d, 0 0 3px black, inset 25px 0 50px #ffffff4d, inset 5px 5px 2px -5px #ffffffba;
background: linear-gradient(rgba(0, 0, 0, 0.1) 0px, rgba(0, 0, 0, 0.1) 2px, rgba(128, 128, 128, 0.1) 2px, rgba(128, 128, 128, 0.1) 4px), radial-gradient(rgba(128, 186, 200, 0.4), rgba(20, 24, 28, 0.76)), linear-gradient(135deg, #000, #042417, #000, #000, #000, #02150e, #000, #000, #000, #042417, #000);
background-size: auto 4px, 100% 100%;
padding: 35px 30px 35px 60px;
box-sizing: border-box !important;
margin: 0 10px;
display: flex;
flex-flow: column;
}
body.OB .perspective-container {
text-align: center;
perspective: 1000px;
background: linear-gradient(#000, #00000061 60%, #000c11 100%), radial-gradient(#334c46, transparent);
position: relative;
width: 200%;
transform: translateX(-25%);
-webkit-mask: linear-gradient(black calc(100% - 20px), transparent);
mask-image: linear-gradient(black calc(100% - 20px), transparent);
}
body.OB .perspective-container.cards {
text-align: center;
perspective: 1000px;
background: linear-gradient(#000, #00000061 60%, #000c11 100%), radial-gradient(#334c46, transparent);
position: relative;
width: calc(100% + 4em);
transform: translateX(-2em);
-webkit-mask: linear-gradient(black calc(100% - 20px), transparent);
mask-image: linear-gradient(black calc(100% - 20px), transparent);
}
body.OB .perspective-container::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 200%;
height: 1500px;
background-image: linear-gradient(#0000006e, #181d1d3d 80%), linear-gradient(#75b9b96e 0px, transparent 4px, transparent calc(100% - 4px), #75b9b96e 100%), linear-gradient(90deg, #75b9b96e 0px, transparent 2px, transparent calc(100% - 2px), #75b9b96e 100%);
background-repeat: repeat;
background-size: auto, auto 80px, 80px auto;
background-position: center center;
transform: translateX(-25%) rotateX(88deg);
transform-origin: center bottom;
z-index: -1;
-webkit-mask-image: linear-gradient(transparent, black, transparent);
mask-image: linear-gradient(transparent, black, transparent);
}
body.OB .portrait-scifi-entry:not(:hover) .portrait-scifi-overlay-1 {
box-shadow: inset 0 -30px 50px 0 transparent, inset 0 0 50px transparent, inset 0 -100px 50px -50px transparent, 5px 5px 5px -5px #0000006e, inset 0 0 50px #000, 0 0 3px #000, inset 25px 0 50px #ffffff5c, inset 5px 5px 2px -5px #ffffffba !important;
}
body.OB .portrait-scifi-entry:hover .portrait-scifi-overlay-1 {
transition: 0s background ease-in-out !important;
}
body.OB .portrait-scifi-entry.frame>.portrait-scifi-overlay-1 {
background: radial-gradient(transparent, transparent 70%, black), linear-gradient(90deg, black, transparent 10px, transparent calc(100% - 10px), black), linear-gradient(black, transparent 10px, transparent calc(100% - 10px), black);
}
body.OB .portrait-scifi-entry:hover .portrait-scifi-overlay-2 {
background-position: 0 110%, 0 10% !important;
transition: 0.7s all ease-in-out !important;
}
.portrait-scifi-avatar> :last-child {
position: absolute;
left: 0 !important;
top: 0 !important;
transform: none !important;
width: 100%;
height: 100%;
}
.portrait-scifi-avatar> :last-child img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: none;
object-fit: cover;
transition: 0.3s all ease-in-out;
}
.portrait-scifi-entry:hover .portrait-scifi-avatar> :last-child img {
transform: scale(1.05);
}
body.OB .portrait-scifi-avatar>.image {
overflow: hidden;
display: inline-flex;
justify-content: center;
align-items: center;
z-index: 1;
}
body.OB .portrait-scifi-avatar.top>.image {
align-items: baseline;
}
body.OB .portrait-scifi-avatar.bottom>.image {
align-items: end;
}
body.OB .portrait-scifi-entry:not(:hover)>.portrait-scifi-name {
text-shadow: 0 0 3px transparent, 0 0 3px transparent, 0 0 3px transparent, 0 0 3px black, 0 0 5px transparent, 0 0 10px transparent !important;
}
body.OB .portrait-scifi-entry>.portrait-scifi-name {
font-family: 'Iceland';
font-size: 16px;
letter-spacing: -0.5px;
}
body.OB .portrait-scifi-name::after {
content: '';
position: absolute;
z-index: -1;
top: 0;
left: 0;
height: calc(100% - 20px);
width: 100%;
border-radius: 5px;
padding: 6px 0;
box-sizing: border-box;
background: linear-gradient(135deg, #71797848, #41444448, #575b5b48, #23262548, #3c424048, #1f232248) #131313 !important;
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black !important;
}
body.OB .portrait-scifi-logo {
position: absolute;
bottom: 0;
right: 0;
padding: 10px 0 10px 20px;
width: 100%;
text-align: center;
opacity: 0.7;
z-index: 20;
pointer-events: none;
}
body.OB .portrait-scifi-logo img {
background: radial-gradient(#000000ba, transparent 80%);
}
body.OB .portrait-scifi-entry>a {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 100;
opacity: 0;
clip-path: polygon(0 0%, calc(100% - 20px) 0%, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 20px 100%, 0% calc(100% - 20px), 0% 20px);
}
body.OB .perso-card-list {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
/*** Carte Necron ***/
body.OB .perso-card.necron {
box-sizing: border-box;
padding: 0;
margin: 2em;
position: relative;
display: table;
text-align: center;
border-radius: 0 0 10px 10px;
background: linear-gradient(135deg, #000, #042417, #000, #000, #000, #02150e, #000, #000, #000, #042417, #000), radial-gradient(#000 80%, #00f21a38) !important;
box-shadow: inset 0 0 20px #000, inset 25px 0 50px #04a26e26, inset 5px 5px 2px -5px #ffffffba, 1px 1px 5px #000, 1px 1px 3px #000 !important;
}
body.OB .perso-card::before {
content: '';
position: absolute;
top: 40px;
left: 10px;
width: calc(100% - 20px);
height: calc(100% - 49px);
background: #f9f9f90d;
}
body.OB .perso-card.necron>.logo {
position: absolute;
z-index: 10;
top: 0;
background: none !important;
right: 0;
transform: translateY(-9px) translateX(19px);
opacity: 0.9;
}
body.OB .perso-card.necron .perso-card-title {
font-size: 16px;
color: #cacaca !important;
text-shadow: 0 0 5px #ffffff2e !important;
padding: 0.5em;
margin-bottom: 0.3em;
overflow: clip;
border-radius: 10px 5px 0 0;
box-shadow: 0 10px 10px -10px #61ca8f, 0 20px 20px -15px #b4ffbc;
position: relative;
z-index: 20;
height: 35px;
box-sizing: border-box;
}
body.OB .perso-card.necron .perso-card-title::after {
content: '';
z-index: 10;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, #4bfbb124, #45d7a02e, #0c31278c, #0c31278c, #000000f0), linear-gradient(#00000029, black);
}
body.OB .perso-card.necron .bg-title {
pointer-events: none;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
z-index: 0;
width: 100%;
display: flex;
justify-content: center;
height: 100%;
overflow: clip;
}
body.OB .perso-card.necron .bg-title:last-child {
transform: translateX(-50%) translateY(-9px);
display: block;
z-index: 1;
}
body.OB .perso-card.necron .perso-card-title .label {
font-size: 16px;
color: #ffffff78 !important;
text-shadow: 0 0 5px #ffffff2e !important;
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-40%);
z-index: 50;
}
body.OB .perso-card.necron .perso-card-description {
box-sizing: border-box;
padding: 0.5em 0.5em 1em 0.5em;
position: relative;
width: 220px;
flex: 1;
text-shadow: 0 0 40px #50ff00, 0 0 80px #50ff00, 0 0 25px #fff !important;
color: #fafff85e;
}
body.OB .perso-card.necron .perso-card-description a {
color: black !important;
}
body.OB .perso-card.necron .perso-card .portrait-scifi-entry {
scale: 0.95;
}
body.OB .perso-card.necron .perso-card .portrait-scifi-entry:hover {
scale: 1;
}
body.OB .perso-card.necron .perso-card:hover .perso-card-description,
body.OB .perso-card.necron .perso-card:hover .perso-card-description a {
color: #ffffffb0 !important;
}
body.OB .perso-card.necron .perso-card .status {
color: #a8a19a;
}
body.OB .custom-table-header {
display: flex;
justify-content: space-between;
padding: 0.5em 1.5em;
color: #cacaca;
font-style: italic;
}
body.OB .custom-table-header>div {
flex: 1;
}
body.OB .custom-table {
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) !important;
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black !important;
padding: 0.5em;
}
body.OB .custom-table>div {
display: flex;
justify-content: space-between;
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) !important;
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black !important;
padding: 0.5em;
margin: 0.5em;
}
body.OB .custom-table>div>div {
flex: 1;
}
body.OB .custom-table>div>div:last-child {
min-width: 280px;
white-space: nowrap;
}
body.OB .responsive-flex {
display: flex;
flex-direction: row;
max-width: 100%;
}
body.OB .responsive-flex>* {
flex: 1;
}
body.OB .responsive-flex.spacing>* {
padding: 0 1em;
}
body.OB .sheet-wrapper {
position: relative;
clear: both;
}
body.OB.theme #mw-content-text h3 {
border-bottom: 1px solid #757575;
margin-bottom: 1em;
}
body.OB .sheet-wrapper h2,
body.OB .sheet-wrapper h3,
body.OB .sheet-wrapper h4,
body.OB .sheet-wrapper h5 {
position: absolute;
top: 0;
left: 0;
transform: translateX(89px);
margin: 16px 0;
padding-left: 6em;
width: calc(100% - 127px);
box-sizing: border-box;
display: flex;
align-items: center;
overflow: hidden;
text-overflow: ellipsis;
flex-direction: row;
white-space: nowrap;
background: linear-gradient(#121313 60%, #0000), linear-gradient(135deg, #71797848, #41444448, #575b5b48, #23262548, #3c424048, #1f232248, #71797848, #41444448, #575b5b48, #23262548, #3c424048, #1f232248, #71797848, #41444448, #575b5b48, #23262548, #3c424048, #1f232248) !important;
box-shadow: 0 4px 4px -4px black !important;
border-bottom: 1px solid black;
}
body.OB .sheet-wrapper h2> :first-child,
body.OB .sheet-wrapper h3> :first-child,
body.OB .sheet-wrapper h4> :first-child,
body.OB .sheet-wrapper h5> :first-child {
overflow: hidden;
text-overflow: ellipsis;
}
body.OB .sheet-wrapper h2> :last-child,
body.OB .sheet-wrapper h3> :last-child,
body.OB .sheet-wrapper h4> :last-child,
body.OB .sheet-wrapper h5> :last-child {
flex: 1;
display: block;
}
body.OB .sheet-content {
min-height: 220px;
display: flex;
}
body.OB .sheet-image {
min-width: 89px;
}
body.OB .sheet-desc {
position: relative;
margin-top: 45px;
padding: 1em 3em 1em 84px;
clip-path: polygon(0 0, calc(100% - 38px) 0, 100% 38px, 100% 100%, 38px 100%, 0 calc(100% - 38px));
box-sizing: border-box;
text-shadow: 0 0 5px black, 0 0 15px black;
display: block;
transition: 0s all ease-in-out;
background: radial-gradient(circle at 0 0, #000, #0000 200px), radial-gradient(at center 0, #2f2f2f, #0000 75%) #111;
}
body.OB .sheet-desc::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 150%;
height: 250%;
border-radius: 50%;
background: radial-gradient(#00000085, #00000087, #35353573, transparent 50%);
transform: translateX(-50%) translateY(50%);
pointer-events: none;
z-index: -1;
}
body.OB .sheet-desc::after {
content: '';
top: 0;
right: 0;
width: 250%;
height: 100%;
transform: translateX(50%) translateY(-50%);
pointer-events: none;
background: radial-gradient(#acacac21, transparent 50%);
position: absolute;
z-index: -1;
}
.carriere-pane-content {
background: linear-gradient(135deg, #71797848, #41444448, #575b5b48, #23262548, #3c424048, #1f232248) !important;
margin: 1.5em;
position: relative;
overflow: clip;
box-sizing: border-box;
min-width: 200px;
display: flex;
flex-direction: column;
width: 200px;
}
.carriere-pane-content.imperium {
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black, inset 0 -30px 5px -5px #ffffff70, inset 0 -32px 0 #9f000061 !important;
}
.carriere-pane-content.ork {
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black, inset 0 -30px 5px -5px #ffffff70, inset 0 -32px 0 #283c24 !important;
}
.carriere-pane-content.aeldari {
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black, inset 0 -30px 5px -5px #ffffff70, inset 0 -32px 0 #093a4d !important;
}
.carriere-pane-content.other {
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black, inset 0 -30px 5px -5px #ffffff70, inset 0 -32px 0 #37373761 !important;
}
.carriere-pane-image {
display: inline-block;
border-radius: 5px;
box-shadow: inset 0 0 1px #ffffff38, inset 0 0 5px #000, inset 0 0 15px #000;
padding: 10px;
margin: 12px;
min-height: 256px;
box-sizing: border-box;
}
.carriere-pane-image .image {
display: flex;
width: 100%;
height: 100%;
justify-content: center;
align-items: center;
overflow: hidden;
}
.carriere-pane-image img {
width: auto;
height: auto;
margin: auto;
}
.carriere-pane-image fit-vertical img {
min-height: 236px !important;
}
.carriere-pane-image fit-horizontal img {
min-height: 156px !important;
}
.carriere-pane-title {
text-align: center;
font-family: sans-serif;
letter-spacing: 1px;
font-size: 14px;
transform: translateY(-5px);
color: #e3e3e3;
text-shadow: 0 0 5px black;
min-width: 140px;
box-shadow: inset 0 0 1px #ffffff38, inset 0 0 5px #000, inset 0 0 15px #000;
padding: 0.5em;
box-sizing: border-box;
width: 100%;
height: 52px;
display: flex;
justify-content: center;
align-items: center;
}
.carriere-pane-label {
padding: 2px 0;
width: 100%;
margin-top: 4px;
white-space: nowrap;
display: flex;
justify-content: center;
background: #191b1b;
color: #6f6f6f;
box-shadow: inset 1px 1px 0 #ffffff1a, inset -1px 2px 0 #0000003d;
height: 23px;
box-sizing: border-box;
background: #1c0404 !important;
}
.carriere-pane-infos {
position: absolute;
top: 0;
left: 15px;
width: calc(100% - 30px);
pointer-events: none;
}
.carriere-pane-infos-handler {
display: flex;
justify-content: center;
background: linear-gradient(69deg, #414141 9px, transparent 10px), linear-gradient(-69deg, #3e3a3a 9px, transparent 10px) #1c1c1c;
box-shadow: inset 0 1px 0 #ffffff17, inset 0 -1px 0px #000000ad, 0 2px 10px black;
clip-path: polygon(0 0, 100% 0, calc(100% - 9px) 100%, calc(100% - 9px) 200%, 9px 200%, 9px 100%);
height: 22px;
font-weight: bold;
pointer-events: all;
z-index: 1;
position: relative;
}
.imperium .carriere-pane-infos-handler {
background: linear-gradient(69deg, #414141 9px, transparent 10px), linear-gradient(-69deg, #3e3a3a 9px, transparent 10px) #1c0404;
}
.aeldari .carriere-pane-infos-handler {
background: linear-gradient(69deg, #414141 9px, transparent 10px), linear-gradient(-69deg, #3e3a3a 9px, transparent 10px) #04041c;
}
.ork .carriere-pane-infos-handler {
background: linear-gradient(69deg, #414141 9px, transparent 10px), linear-gradient(-69deg, #3e3a3a 9px, transparent 10px) #041c04;
}
.other .carriere-pane-infos-handler {
background: linear-gradient(69deg, #414141 9px, transparent 10px), linear-gradient(-69deg, #3e3a3a 9px, transparent 10px) #1c1c1c;
}
.carriere-pane-image:hover~.carriere-pane-infos *,
.carriere-pane-infos:hover * {
opacity: 1;
pointer-events: all;
}
.carriere-pane-infos-data {
margin: auto;
width: 160px;
height: 244px;
background: radial-gradient(#454545, #1c0404);
padding: 0.5em;
box-sizing: border-box;
pointer-events: none;
text-align: left;
opacity: 0;
font-style: italic;
position: relative;
transform: translateY(-7px);
border-radius: 5px;
}
.carriere-pane-infos-data a {
font-style: normal;
font-weight: normal;
}
.imperium .carriere-pane-infos-data {
background: radial-gradient(#452e2e, #1c0404);
}
.ork .carriere-pane-infos-data {
background: radial-gradient(#2e452e, #041c04);
}
.aeldari .carriere-pane-infos-data {
background: radial-gradient(#2e2e45, #04041c);
}
.other .carriere-pane-infos-data {
background: radial-gradient(#454545, #1c1c1c);
}
.split-image {
position: relative;
margin: 2rem auto;
display: flex;
perspective: 1000px;
transform-style: preserve-3d;
}
.split-image>* {
display: flex;
}
.split-image .left-pane {
width: 25%;
transform: scale(0.8);
transform-origin: right;
}
.split-image .center-pane {
width: 50%;
}
.split-image .right-pane {
width: 25%;
transform: translateX(-30%) scale(0.8);
transform-origin: left;
}
.split-image .left-pane> :nth-child(1) {
width: 20%;
}
.split-image .left-pane> :nth-child(2) {
width: 80%;
}
.split-image .center-pane> :nth-child(1) {
width: 10%;
}
.split-image .center-pane> :nth-child(2) {
width: 90%;
}
.split-image .right-pane> :nth-child(1) {
width: 20%;
}
.split-image .right-pane> :nth-child(2) {
width: 80%;
}
.split-image .left-pane> :nth-child(1) img {
transform: translateX(0);
}
.split-image .left-pane> :nth-child(2) img {
transform: translateX(-5%);
}
.split-image .center-pane> :nth-child(1) img {
transform: translateX(-25%);
}
.split-image .center-pane> :nth-child(2) img {
transform: translateX(-30%);
}
.split-image .right-pane> :nth-child(1) img {
transform: translateX(-75%);
}
.split-image .right-pane> :nth-child(2) img {
transform: translateX(-80%);
}
.split-image>*> :nth-child(2n+1) {
perspective: 1000px;
perspective-origin: right center;
}
.split-image>*> :nth-child(2n+1)>* {
transform: rotateY(-60deg);
transform-origin: right center;
height: 100%;
width: 100%;
background: white;
position: relative;
}
.split-image>*> :nth-child(2n+1)> ::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-shadow: inset 0 0 10px black, inset 0 0 40px black;
z-index: 10;
}
.split-image>*> :nth-child(2n) {
perspective: 1000px;
perspective-origin: left center;
}
.split-image>*> :nth-child(2n)>* {
transform: rotateY(30deg);
transform-origin: left center;
height: 100%;
width: 100%;
background: black;
box-shadow: 0 40px 40px -30px #ffffff30;
}
.split-image>*>* {
height: 100%;
width: 100%;
}
.split-image>*>*>* {
height: 100%;
width: 100%;
overflow: hidden;
}
.split-image *,
.split-image ::before {
transition: 1s all ease-in-out;
}
.split-image:hover * {
transform: none;
box-shadow: none !important;
}
.split-image:hover ::before {
box-shadow: inset 0 0 10px transparent, inset 0 0 40px transparent !important;
}
/** Pour le mécanisme de sélection **/
[data-trigger] {
cursor: pointer;
user-select: none;
}
:not(.p-navbar)>[data-target]:not(.active) {
display: none;
}
/** Effets d'animation: **/
@keyframes shine {
to {
background-position: 200% center;
}
}
@keyframes shine-alt {
to {
background-position: -200% center;
}
}
@media screen and (max-device-width: 900px) {
#content a.image {
animation-play-state: paused !important;
}
}
/** Website navigator **/
.wiki-top-banner-wiki-toggler::after {
content: "\2b";
position: absolute;
right: 0;
top: 50%;
transform: translateX(100%) translateY(-50%);
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 24px;
width: 22px;
height: 22px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: #000;
background: #585858;
background: #000;
}
.wiki-top-banner-wiki-toggler {
position: absolute;
top: 0;
right: 7px;
width: 200px;
height: 100%;
background: url("/images/8/8c/40k-Logo-mini.png");
background-position: center center;
background-repeat: no-repeat;
margin-right: 40px;
}
@media screen and (max-width: 767px) {
.float-left,
.float-left.auto-margin,
.float-right,
.float-right.auto-margin {
margin-left: auto !important;
margin-right: auto !important;
float: none !important;
}
}
/** fix display news on Home page**/
.news-author {
font-size: 0;
font-style: normal;
}
.news-author a {
font-size: small;
font-style: normal;
}
.news-author::before {
content: '\f56b';
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: small;
margin-right: 0.375rem;
font-style: normal;
}
.news-author,
.news-author::before,
.news-author>*,
.news-author>a,
.news-author>a:visited {
user-select: none;
pointer-events: none;
color: #64615d !important;
}
/** Fix btn link **/
.btn.btn-link {
box-shadow: none !important;
}
/** custom button **/
.btn.btn-ob {
color: white;
margin-top: 0.5em;
background: linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) #032525;
padding: 0.5em;
}
.btn.btn-ob:hover {
background-color: #0e8080 !important;
}
/** Bootstrap popover style (liens popup) **/
body {
--popover-border-color: #1e2222;
}
.custom-template-title,
.custom-template-content {
display: none;
}
[data-popover-link],
.popover-link {
line-height: 1 !important;
vertical-align: baseline;
padding: 0 !important;
display: inline-flex;
align-items: baseline;
color: #5077b9;
user-select: all;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
[data-popover-link]::after,
.popover-link::after {
content: '\f059';
font-family: 'Font Awesome 5 Free';
font-weight: 900;
color: var(--popover-border-color);
margin-left: 3px;
font-size: small;
transition: color 0.15s ease-in-out;
text-shadow: 0 0 1px #000000, 0 0 1px #000000;
}
.popover-link[aria-describedby] {
user-select: none;
color: white !important;
}
.popover-link[aria-describedby]::after,
.popover-link:hover::after {
color: var(--default-link-color);
}
.popover {
border: 1px solid var(--popover-border-color);
border-radius: 0.5rem;
max-width: min(80vw, 400px) !important;
}
.popover-header {
position: relative;
background: radial-gradient(#031516, black 90%) !important;
border-radius: 0.375rem 0.375rem 0 0;
font-weight: normal;
border-bottom-color: var(--popover-border-color);
padding: 0.5rem 50px 0.5rem 40px;
text-align: center !important;
font-family: "Grenze Gotisch", cursive;
font-size: 20px;
}
.popover-header img {
position: absolute;
top: 12px;
left: 20px;
filter: brightness(0.2);
}
.popover-body {
background: black;
border-radius: 0 0 0.375rem 0.375rem;
padding: 1rem 1.75rem 1rem 1.5rem !important;
}
.popover-thumb-wrapper {
position: absolute;
right: 0;
top: 0;
transform: translate3d(50%, -30%, 0);
width: 90px;
height: 90px;
border-radius: 50%;
border: 1px solid var(--popover-border-color);
border-radius: 50%;
transition: ease-in-out 0.5s all;
background-color: #000;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
}
.popover-thumb {
position: absolute;
width: 120px;
height: 120px;
object-fit: cover;
border-radius: 50%;
transition: ease-in-out 0.5s all;
}
.popover-body a:hover .popover-thumb-wrapper {
right: 0;
top: 0;
width: 200px;
height: 200px;
border-radius: 1rem;
}
.popover-body a:hover .popover-thumb {
width: 200px;
height: 200px;
border-radius: 1rem;
}
.popover-tags {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 10px;
}
.popover-tags > * {
border: 1px solid #2c2c2c;
border-radius: 10px;
padding: 0 8px;
font-size: small;
}
.popover-tags > a {
border: 1px solid #2c2c2c;
color: var(--default-link-color);
}
.popover-tags > a:hover {
border: 1px solid white !important;
color: white;
}
.bs-popover-right>.arrow::after,
.bs-popover-auto[x-placement^="right"]>.arrow::after {
border-right-color: var(--popover-border-color);
}
.bs-popover-left>.arrow::after,
.bs-popover-auto[x-placement^="left"]>.arrow::after {
border-left-color: var(--popover-border-color);
}
.bs-popover-top>.arrow::after,
.bs-popover-auto[x-placement^="top"]>.arrow::after {
border-top-color: var(--popover-border-color);
}
.bs-popover-bottom>.arrow::after,
.bs-popover-auto[x-placement^="bottom"]>.arrow::after {
border-bottom-color: var(--popover-border-color);
}
/** style de preview de wikicode pour les exemples dans les pages de modèles**/
pre {
background: #020a0c !important;
color: #007575 !important;
border-radius: 0.5rem;
border-color: #1f2223 !important;
max-height: 50vh;
}
/** style du rendu des pages JSON **/
table.mw-json {
border-collapse: collapse;
border-spacing: 0;
font-style: normal;
}
table.mw-json th {
background-color: #fff;
font-weight: normal;
vertical-align: top;
background: radial-gradient(#031516, black 70%) !important;
color: white;
}
table.mw-json td {
background: #949b9c;
color: black;
overflow: hidden;
}
/** Menu contextuel **/
body.OB.theme #pinned-page-menu {
position: fixed;
top: 90px;
left: 0;
box-sizing: border-box;
min-width: 200px;
max-width: 200px;
height: calc(100vh - 90px);
background: linear-gradient(135deg, #71797838 0, #41444438 25%, #575b5b38 40%, #23262538 55%, #3c424038 75%, #1f232238 85%) #000 !important;
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black !important;
z-index: 10000;
user-select: none;
overflow: auto;
white-space: nowrap;
transition: 0.3s all ease-in-out;
-ms-overflow-style: none;
scrollbar-width: none;
}
/* Hide menu scrollbar (Chrome, Safari and Opera) */
body.OB.theme #pinned-page-menu::-webkit-scrollbar {
display: none;
}
body.OB.theme #pinned-page-menu .toctogglespan {
display: none;
}
body.OB.theme #pinned-page-menu > .toctitle {
border-bottom: 1px solid #414141;
background: radial-gradient(black,transparent 70%),linear-gradient(135deg,#717978,#414444,#575b5b,#232625,#3c4240,#1f2322,#717978,#414444,#575b5b,#232625,#3c4240,#1f2322) !important;
box-shadow: inset 1px 1px #ffffff1f,inset 0 0 0 1px #272727,0 4px 10px black,inset 0 0 50px black !important;
margin-bottom: 20px;
position: sticky;
top: 0;
padding-top: 30px;
border-radius: 0 0 5px;
}
#context-menu-ob {
display: absolute;
top: 0;
left: 0;
max-width: min(80vw, 400px);
width: 400px;
display: none;
}
/** Fix full-screen mode **/
body.OB.theme.mode-fullscreen div#content {
overflow-x: hidden !important;
align-content: normal;
background: black !important;
}
/** Affichage simplifié de la liste des modifications **/
table.mw-changeslist-line {
margin: 5px 0;
position: relative;
}
table.mw-changeslist-line:nth-child(2n) {
background: #80808012;
border-radius: 3px;
}
span.history-user .mw-usertoollinks {
display: none;
}
span.mw-changeslist-line-inner-userLink {
float: right;
}
td.mw-changeslist-line-inner > span.changedby {
float: right;
}
a.mw-userlink::before {
content: "\f007";
margin-right: 5px;
}
span.mw-changeslist-links {
display: inline-block;
margin-right: 5px;
}
td:not(:hover) span.mw-changeslist-links {
display: none;
}
span.comment.comment--without-parentheses {
font-style: normal;
color: gray;
}
span.comment.comment--without-parentheses::before {
content: '\f10d' !important;
}
span.comment.comment--without-parentheses::after {
content: '\f10e' !important;
margin-left: 5px;
}
span.mw-changeslist-line-inner-separatorAfterLinks,
span.mw-changeslist-line-inner-historyLink,
span.mw-changeslist-line-inner-separatorAftercharacterDiff,
span.mw-changeslist-separator {
display: none;
}
abbr.minoredit {
font-size: 0;
text-decoration: unset;
}
abbr.minoredit::before {
color: #525252;
}
abbr.unpatrolled {
font-size: 0;
text-decoration: unset;
}
abbr.unpatrolled::before {
content: '\f071';
color: red !important;
}
table.mw-changeslist-line td.mw-enhanced-rc {
min-width: 115px;
text-align: right;
margin-right: 10px;
padding: 0 !important;
}
abbr.newpage {
font-size: 0;
}
abbr.newpage::before {
content: '\f067';
color: green !important;
}
span.mw-changeslist-line-inner-comment {
display: block;
float: right;
margin-right: 15px;
}
span.mw-changeslist-line-inner-comment .comment {
font-style: normal;
display: inline-block;
color: gray;
font-size: smaller;
}
span.mw-changeslist-line-inner-comment .comment::before {
content: '\f10d';
}
span.mw-changeslist-line-inner-comment .comment::after {
content: '';
}
span.mw-changeslist-line-inner-articleLink .mw-title,
td.mw-changeslist-line-inner .mw-title {
font-size: large;
font-weight: normal;
margin-right: 5px;
}
span.mw-changeslist-line-inner-articleLink .mw-title > a,
td.mw-changeslist-line-inner .mw-title > a {
font-size: large;
font-weight: normal;
}
span.mw-changeslist-line-inner-articleLink .mw-title > a::before,
td.mw-changeslist-line-inner .mw-title > a::before {
content: '\f70e';
}
span.mw-changeslist-line-inner-rollback {
display: none !important;
}
td:hover span.mw-changeslist-line-inner-rollback {
display: inline-block !important;
}
a.mw-userlink::before,
abbr.minoredit::before,
abbr.unpatrolled::before,
abbr.newpage::before,
span.comment.comment--without-parentheses::before,
span.comment.comment--without-parentheses::after,
span.mw-changeslist-line-inner-comment .comment::before,
span.mw-changeslist-line-inner-articleLink .mw-title > a::before,
td.mw-changeslist-line-inner .mw-title > a::before,
span.mw-changeslist-line-inner-characterDiff::before {
font-size: 12px;
font-style: normal;
font-family: "Font Awesome 5 Free";
font-weight: 900;
color: gray;
margin-right: 5px;
}
.mw-changeslist-legend.mw-collapsible.mw-made-collapsible {
box-shadow: inset 1px 1px #ffffff1f, inset 0 0 0 1px #272727, 0 4px 10px black !important;
background: radial-gradient(#093435, black) !important;
border: none;
border-radius: 5px;
padding: 15px;
}
abbr.newpage {
text-decoration: none !important;
}
span.mw-changeslist-line-inner-logEntry a.mw-userlink::after,
td.mw-changeslist-line-inner > span.changedby a.mw-userlink::after,
span.mw-changeslist-line-inner-userLink a.mw-userlink::after {
width: 25px;
height: 25px;
border-radius: 50%;
position: absolute;
top: 1px;
left: 0;
transform: translateX(calc(-100% - 10px));
background: #092441;
background-size: 100% 100%;
overflow: hidden;
font-size: 15px;
font-style: normal;
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f007";
display: flex;
align-items: center;
justify-content: center;
color: black;
}
span.mw-changeslist-line-inner-logEntry a.mw-userlink[title="Utilisateur:Trazyn l'infini"]::after,
td.mw-changeslist-line-inner > span.changedby a.mw-userlink[title="Utilisateur:Trazyn l'infini"]::after,
span.mw-changeslist-line-inner-userLink a.mw-userlink[title="Utilisateur:Trazyn l'infini"]::after {
content: '';
background-image: url('/images/f/f1/User-Trazyn.jpg');
}
span.mw-changeslist-line-inner-logEntry a.mw-userlink[title="Utilisateur:Blacklisted Jack"]::after,
td.mw-changeslist-line-inner > span.changedby a.mw-userlink[title="Utilisateur:Blacklisted Jack"]::after,
span.mw-changeslist-line-inner-userLink a.mw-userlink[title="Utilisateur:Blacklisted Jack"]::after {
content: '';
background-image: url('/images/a/af/User-BJack.jpg');
}
span.mw-changeslist-line-inner-logEntry a.mw-userlink[title="Utilisateur:Trazyn Guilhem"]::after,
td.mw-changeslist-line-inner > span.changedby a.mw-userlink[title="Utilisateur:Guilhem"]::after,
span.mw-changeslist-line-inner-userLink a.mw-userlink[title="Utilisateur:Guilhem"]::after {
content: '';
background-image: url('/images/d/dd/User-Guilhem.jpg');
}
span.mw-changeslist-line-inner-logEntry a.mw-userlink[title="Utilisateur:Trazyn Christer"]::after,
td.mw-changeslist-line-inner > span.changedby a.mw-userlink[title="Utilisateur:Christer"]::after,
span.mw-changeslist-line-inner-userLink a.mw-userlink[title="Utilisateur:Christer"]::after {
content: '';
background-image: url('/images/a/ae/User-Christer.jpg');
}
/** fix look page category panel **/
div#catlinks {
box-sizing: border-box;
justify-content: center;
background: black;
border: none;
padding: 10px 20px;
border-radius: 0.5rem;
border: 1px solid #151515;
}
div#catlinks li a {
border: 1px solid;
padding: 0.25rem 0.5rem;
display: flex;
align-items: center;
border-radius: 0.5rem;
box-shadow: none;
}
div#catlinks li {
border: none !important;
}
/** Links toast & modal. **/
#linksModal, #linksModal .modal-title {
color: black;
}
.btn.btn-mini .expandable {
display: none;
}
.btn.btn-mini:hover .expandable {
display: inline;
}
.btn.btn-links {
color: #fff;
background-color: #5077b9;
border-color: #5077b9;
}
.btn.btn-links:hover {
color: #fff;
background-color: #5077b9;
border-color: #5077b9;
}
#linksModal .modal-body > :nth-child(2n+1) {
background: #c1c6cf;
}
#linksModal .modal-body > * {
padding: 2px 10px;
}
.toast{
opacity: 1;
z-index: 1000;
position: fixed;
top: calc(100vh - 40px);
right: 40px;
transform: translateY(-100%);
width: 300px;
background: #000000ed;
border: 1px solid rgb(30 34 34);
}
.toast-header {
display: flex;
align-items: center;
padding: 0.25rem 0.75rem;
color: #ffffff;
background-color: rgba(255,255,255,0.85);
background-clip: padding-box;
border-bottom: 1px solid rgba(0,0,0,0.05);
border-top-left-radius: calc(0.25rem - 1px);
border-top-right-radius: calc(0.25rem - 1px);
background: radial-gradient(#093435c2, #000000c7) !important;
}
.toast-header .close {
text-shadow: none;
color: #303535;
}
.toast-body {
color: lightgrey;
}
.toast-body a {
color: #009b9c !important;
display: block !important;
}
.toast-body a:hover {
color: white !important;
}
.link-match {
padding-top: 20px !important;
display: flex;
position: relative;
}
.link-match-id {
position: absolute;
top: 0;
color: teal;
}
.match-data {
width: 100%;
}
.match-item {
display: flex;
justify-content: space-between;
align-items: center;
margin: 4px 0;
}
.match-item > * {
margin-top: 0;
margin-bottom: 0;
}
.match-item input.form-check-input {
position: relative;
}
.match-item > .source-item {
flex: 1;
font-family: monospace;
font-size: small;
color: #334;
white-space: nowrap;
min-width: 150px;
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;
}
.match-item > i {
color: #609696;
}
.match-item > .transform-item {
flex: 1;
font-family: monospace;
font-size: small;
color: #334;
white-space: nowrap;
text-align: right;
}
.match-item:not(.checked) {
justify-content: flex-start;
}
.match-item:not(.checked) > i,
.match-item:not(.checked) > .transform-item {
display: none;
}
/** fix page menu bar **/
.top-menu-item.w40k-univers > .top-menu-title {
user-select: none;
pointer-events: none;
}
/** Theme Dark angels **/
.theme-wing::before {
content: '';
background: url('https://omnis-bibliotheca.com/images/1/17/DA-wing.png');
width: 43px;
height: 63px;
display: block !important;
position: absolute;
top: 0;
left: 0;
transform: translateX(-35px);
}
.theme-wing {
position: relative;
margin-left: 40px;
}
@media screen and (max-width: 767px) {
.hide-next-sm + * {
display: none !important;
}
}
/** Notif OB **/
div#mw-notification-area {
position: fixed;
top: 50%;
left: 50%;
right: unset;
border: unset;
transform: translate(-50%, -50%);
background: linear-gradient(transparent 50%, black), linear-gradient(135deg, #71797848 0, #41444448 25%, #575b5b48 40%, #23262548 55%, #3c424048 75%, #1f232248 85%) black;
box-shadow: inset 1px 1px #ffffff03, inset 0 0 0 1px #272727, 0 4px 3px black, inset 0 0 10px black, inset 0 -50px 50px black;
border-radius: 10px;
}
#pending-review::first-letter {
text-transform: capitalize;
}
div#postedit-modqueued::before {
content: '';
position: absolute;
top: 0;
left: 0;
height: 90px;
width: 90px;
background: url(/images/6/66/OB-modif-sent.png) !important;
background-size: 100% 100% !important;
transform: translate(-5px, -5px);
}
#pending-review {
border: none;
text-align: center;
width: 100%;
font-weight: normal;
text-transform: lowercase;
color: #8a4949;
font-family: "Grenze Gotisch",cursive;
font-size: 24px;
margin: 10px;
z-index: 1;
}
.mw-notification {
background: url(/images/thumb/0/0f/Parchemin.jpg/323px-Parchemin.jpg) !important;
padding: 15px 40px;
}
.mw-notification::before {
content: '';
position: absolute;
bottom: 0;
right: 0;
background: url('/images/c/c0/Purity-seals.png'), radial-gradient(#000000de, transparent 70%);
height: 74px;
width: 37px;
transform: translatey(50%);
z-index: 10;
}
.mw-notification::after {
content: '';
position: absolute;
top: 7px;
left: 7px;
bottom: 7px;
right: 7px;
border: 2px solid #2e000069;
}
div#postedit-modqueued {
color: #303040 !important;
text-align: center;
}
.mw-message-box-warning {
background-color: #fef6e7;
border-color: #fc3;
z-index: 1000000;
position: relative;
}
.mw-notification-visible .oo-ui-labelElement-label {
color: #303040 !important;
}
