MediaWiki:Common.css: Porovnání verzí

(Zrušena verze 74847 od uživatele Fufhiny (diskuse))
(Značka: Vrácení zpět)
 
(Není zobrazeno 45 mezilehlých verzí od 4 dalších uživatelů.)
Řádek 2: Řádek 2:
  
 
/** Volitelné styly wiki **/
 
/** Volitelné styly wiki **/
/* Volitelné transparentní pozadí */
 
.transp-bg {
 
    background: url("http://wiki.metin2.cz/images/9/91/Transparentn%C3%AD_pozad%C3%AD.png") repeat;
 
    border: 1px solid #000000;
 
    border-top-right-radius: 5px;
 
    border-top-left-radius: 5px;
 
    border-bottom-right-radius: 5px;
 
    border-bottom-left-radius: 5px;
 
}
 
  
.transp-bg2 {
 
    background: url("http://wiki.metin2.cz/images/9/91/Transparentn%C3%AD_pozad%C3%AD.png") repeat;
 
    background-color: transparent !important;
 
}
 
  
/* Skryje nápis „Hlavní strana“  */
+
/* Active effect */
body.page-Hlavní_strana #catlinks,
+
.item_background {
body.page-Hlavní_strana h1.firstHeading{
+
    display: inline-block;
display: none;
+
    vertical-align: middle;
 +
    position: relative;
 +
    top: 0px;
 +
    left: 0px;
 +
    line-height: 0%;
 
}
 
}
  
/* Vzhled hlaviček */
+
.item_item {
.header-bg {
+
     position: absolute;
     background: url("http://wiki.metin2.cz/images/1/12/Header-bg.png") repeat 0em 0em;
+
    top: 0px;
 
}
 
}
  
/* Doplněk pro nový vzhled hlavičky tabulek */
+
.item_active {
.header-bg a:link {
+
    -webkit-animation-name: item_active;
     color: #fece58;
+
    -webkit-animation-duration: 1s;
 +
    -webkit-animation-iteration-count: infinite;
 +
    animation-name: item_active;
 +
    animation-duration: 1s;
 +
    animation-iteration-count: infinite;
 +
    position: absolute;
 +
    top: 0px;
 +
     background-repeat: no-repeat;
 
}
 
}
  
.header-bg a:new {
+
.item_active a {
     color: rgb(241, 222, 142);
+
     display: block;
 
}
 
}
  
/** Collapsible tables *********************************************************
+
/* Chrome, Safari, Opera */
  *
+
@-webkit-keyframes item_active {
  *  Description: Allows tables to be collapsed, showing only the header. See
+
    0%  { background-image: url('/images/2/29/Aktivovaný_101.png'); }
  *                        http://www.mediawiki.org/wiki/Manual:Collapsible_tables.
+
    8.33% { background-image: url('/images/2/25/Aktivovaný_102.png'); }
*  Maintainers: [[en:User:R. Koot]]
+
    16.66% { background-image: url('/images/2/25/Aktivovaný_103.png'); }
*/
+
    25% { background-image: url('/images/4/44/Aktivovaný_104.png'); }
+
    33.33% { background-image: url('/images/8/84/Aktivovaný_105.png'); }
table.collapsed tr.collapsible {
+
    41.66% { background-image: url('/images/e/e6/Aktivovaný_106.png'); }
        display: none;
+
    50% { background-image: url('/images/b/b7/Aktivovaný_107.png'); }
 +
    58.33% { background-image: url('/images/2/26/Aktivovaný_108.png'); }
 +
    66.66% { background-image: url('/images/c/cf/Aktivovaný_109.png'); }
 +
    75% { background-image: url('/images/3/30/Aktivovaný_110.png'); }
 +
    83.33% { background-image: url('/images/6/6e/Aktivovaný_111.png'); }
 +
    91.66% { background-image: url('/images/3/34/Aktivovaný_112.png'); }
 +
    100% { background-image: url('/images/8/80/Aktivovaný_113.png'); }
 
}
 
}
 
   
 
   
.collapseButton {               /* 'show'/'hide' buttons created dynamically by the */
+
/* Standard syntax */
        float: right;           /* CollapsibleTables JavaScript in [[MediaWiki:Common.js]] */
+
@keyframes item_active {
        font-weight: normal;   /* are styled here so they can be customised.             */
+
    0%  { background-image: url('/images/2/29/Aktivovaný_101.png'); }
        text-align: right;
+
    8.33%  { background-image: url('/images/2/25/Aktivovaný_102.png'); }
        width: auto;
+
    16.66%  { background-image: url('/images/2/25/Aktivovaný_103.png'); }
 +
    25%  { background-image: url('/images/4/44/Aktivovaný_104.png'); }
 +
    33.33% { background-image: url('/images/8/84/Aktivovaný_105.png'); }
 +
    41.66% { background-image: url('/images/e/e6/Aktivovaný_106.png'); }
 +
    50% { background-image: url('/images/b/b7/Aktivovaný_107.png'); }
 +
    58.33% { background-image: url('/images/2/26/Aktivovaný_108.png'); }
 +
    66.66% { background-image: url('/images/c/cf/Aktivovaný_109.png'); }
 +
    75% { background-image: url('/images/3/30/Aktivovaný_110.png'); }
 +
    83.33% { background-image: url('/images/6/6e/Aktivovaný_111.png'); }
 +
    91.66% { background-image: url('/images/3/34/Aktivovaný_112.png'); }
 +
    100% { background-image: url('/images/8/80/Aktivovaný_113.png'); }
 
}
 
}
  
/* Nový puntík do seznamů */
+
/* Volitelné transparentní pozadí */
ul {
+
.transp-bg {
    list-style-image: url("http://wiki.metin2.cz/images/4/4b/MinusS.png");
+
     background: url("https://cz-wiki.metin2.gameforge.com/images/9/91/Transparentn%c3%ad_pozad%c3%ad.png") repeat;
}
 
 
 
/* <ul> posnuto doprava */
 
.mw-content-ltr ul {
 
    margin: 0.3em 0px 0px 1.6em;
 
    padding: 0px;
 
}
 
 
 
/* <ul> v navigačních oknech posuunto doprava */
 
.portletNavMiddle UL {
 
    padding: 0px 0px 1px 27px;
 
}
 
 
 
/* Přebarvení tlačítka „Rozbalit/Sbalit“ */
 
th .mw-collapsible-toggle a {
 
        color: rgb(254, 206, 88);
 
}
 
 
 
/* Přidání obrázku na znamení externího odkazu */
 
#bodyContent a.external,
 
#bodyContent a.external[href^="gopher://"] {
 
     background: url("http://wiki.metin2.cz/images/a/af/External-link.png") no-repeat scroll right center transparent;
 
    padding-right: 13px;
 
}
 
 
 
/* Pozadí wiki */
 
div#content {
 
    border-width: 0px;
 
    background: url("http://wiki.metin2.cz/images/6/6c/Main_background.png") repeat-y;
 
    width: 888px !important;
 
}
 
 
 
/* Nové záhlaví pro názvy stránek. Např. Hlavní strana */
 
h1.firstHeading {
 
    background: url("http://wiki.metin2.cz/images/9/95/Title_background.png") no-repeat scroll right bottom transparent;
 
    display: table-cell;
 
    height: 65px;
 
    position: relative;
 
    vertical-align: middle;
 
    width: 880px;
 
    color: #fece58;
 
    text-indent: 50px;
 
    border-bottom: 0px;
 
    font-weight: none;
 
}
 
 
 
/* Nový vzhled pro nadpis 2. úrovně */
 
h2 {
 
    background: url("http://wiki.metin2.cz/images/7/72/M2_logo.png") no-repeat scroll left transparent;
 
    color: #7b1300;
 
    text-indent: 35px;
 
    border-bottom: 2px dashed #7b1300;
 
    font-weight: bold;
 
}
 
 
 
/* Nový vzhled pro nadpis 3. úrovně */
 
h3 {
 
    background: url("http://wiki.metin2.cz/images/a/aa/M2_logo_2.png") no-repeat scroll left transparent;
 
    color: #7b1300;
 
    border-bottom: 2px dashed #7b1300;
 
    text-indent: 17px;
 
}
 
 
 
/* Nový vzhled pro nadpis 4. úrovně */
 
h4 {
 
    color: #7b1300;
 
    border-bottom: 2px dashed #7b1300;
 
}
 
 
 
/* Barva tlačítka Editovat */
 
.editsection a:link {
 
    color: #0667d2;
 
}
 
 
 
/* Posuntí tlačítka Editovat */
 
.mw-content-ltr .editsection {
 
    float: right;
 
    margin: 0 5px 0 0;
 
}
 
 
 
/* Nový vzhled pro sekci Kategorie v záhlaví stránek */
 
#catlinks,
 
.catlinks {
 
    color: rgb(241, 222, 142);
 
    border-radius: 5px;
 
    border-width: 2px;
 
    border-style: solid;
 
    border-right: 1px solid rgb(110, 48, 11);
 
    border-color: rgb(254, 206, 88) rgb(110, 48, 11) rgb(110, 48, 11);
 
    background: -moz-linear-gradient(center top , rgb(35, 5, 0) 0px, rgb(44, 7, 0) 50%, rgb(69, 10, 0) 100%) repeat scroll 0% 0% transparent;
 
}
 
 
 
/* Barva odkazů v záhlaví, při používání Kategorií */
 
#catlinks a:link,
 
.catlinks a:link {
 
    color: rgb(241, 222, 142);
 
}
 
 
 
/* Změna Obsahu (__TOC__) */
 
#toc,
 
.toc,
 
.mw-warning {
 
    background: url("http://wiki.metin2.cz/images/9/91/Transparentn%C3%AD_pozad%C3%AD.png") repeat;
 
 
     border: 1px solid #000000;
 
     border: 1px solid #000000;
    color: #FFFFFF;
 
 
     border-top-right-radius: 5px;
 
     border-top-right-radius: 5px;
 
     border-top-left-radius: 5px;
 
     border-top-left-radius: 5px;
Řádek 169: Řádek 79:
 
}
 
}
  
/* Doplněk pro Obsah (__TOC__) */
+
.transp-bg2 {
#toc h2,
+
     background: url("https://cz-wiki.metin2.gameforge.com/images/9/91/Transparentn%c3%ad_pozad%c3%ad.png") repeat;
.toc h2 {
+
     background-color: transparent !important;
     display: inline;
 
    border: none;
 
    padding: 0;
 
    font-size: 100%;
 
     font-weight: bold;
 
    background: none;
 
    color: #FFFFFF;
 
 
}
 
}
  
/* Nový vzhled pro tag <pre> (viz tato stránka) */
+
/* Skryje nápis „Hlavní strana“  */
pre {
+
body.page-Hlavní_strana #catlinks,
    border: 1px dashed rgb(0, 0, 0);
+
body.page-Hlavní_strana h1.firstHeading{
    color: black;
+
display: none;
    background: url("http://wiki.metin2.cz/images/9/91/Transparentn%C3%AD_pozad%C3%AD.png") repeat;
 
    background-color: transparent !important;
 
 
}
 
}
  
/* Posunutí textů pod novým nadpisem */
+
/* Vzhled hlaviček */
#contentSub,
+
.header-bg {
#contentSub2 {
+
     background: url("https://cz-wiki.metin2.gameforge.com/images/1/12/Header-bg.png") repeat 0em 0em;
     margin: 1em 0px 1.4em 1em;
+
    color: rgb(254, 206, 88);
 
}
 
}
  
/* Nový vzhled pro vodorovné rozdělení/čáru */
+
.header-bg a {
hr {
+
color: #fece58;
    color: #6e300b;
+
text-decoration: none !important;
    background-color: #6e300b;
 
 
}
 
}
  
ul#filetoc {
+
li.gallerybox div.thumb,
     text-align: center;
+
div.thumbinner {
 +
     background: url("https://cz-wiki.metin2.gameforge.com/images/9/91/Transparentn%c3%ad_pozad%c3%ad.png") repeat scroll 0% 0% transparent;
 
     border: 1px solid #6e300b;
 
     border: 1px solid #6e300b;
    background: url("http://wiki.metin2.cz/images/1/12/Header-bg.png") repeat 0em 0em;
 
 
}
 
}
  
#filetoc li a:link {
+
html .thumbimage {
     color: rgb(254, 206, 88);
+
     border: 1px solid #6e300b;
 
}
 
}
  
table.mw_metadata td,
+
:focus {
table.mw_metadata th {
+
     outline: none;  
     border: 1px solid #6e300b;
 
    background: url("http://wiki.metin2.cz/images/9/91/Transparentn%C3%AD_pozad%C3%AD.png") repeat 0em 0em;
 
 
}
 
}
  
table.wikitable > tr > th,
+
.hoverbox { display:inline-block; padding:0em; }
table.wikitable > * > tr > th {
+
.hoverbox .hoveritem { display:none; margin:0em; padding:0em; }
    background: url("http://wiki.metin2.cz/images/1/12/Header-bg.png") repeat 0em 0em;
+
.hoverbox .hoveritem.selected { display:inline-block; }
    border: 1px solid #6e300b;
+
.hoverbox:hover .hoveritem { display:inline-block; }
    text-align: center;
+
.hoverbox:hover .hoveritem.selected { display:none; }
    color: #f0d9a2;
 
}
 
  
table.wikitable > tr > td,
+
.klavesa {
table.wikitable > * > tr > td {
+
    background-color: rgb(247, 247, 247);
     background-color: #f0d9a2;
+
    background-image: -webkit-linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
     border: 1px solid #6e300b;
+
    background-image: -moz-linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
     padding: 0.2em;
+
    background-image: -o-linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
 +
     background-image: linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
 +
     border: 1px solid;
 +
    border-color: rgb(221, 221, 221) rgb(170, 170, 170) rgb(136, 136, 136) rgb(204, 204, 204);
 +
    border-radius: 2px;
 +
     padding: 0 .4em;
 +
    text-shadow: 0 1px rgba(255,255,255,.5);
 +
    white-space: nowrap;
 
}
 
}
  
img.thumbborder {
+
/* Tooltip */
    border: 1px solid rgb(110, 48, 11);
+
.tooltip {
 +
  position: relative;
 +
  display: inline-block;
 +
  cursor: pointer;
 +
  z-index: 1000; /* Zajišťuje, že tooltip bude vždy nahoře */
 
}
 
}
  
fieldset {
+
.tooltip .tooltiptext {
    border: 1px solid rgb(110, 48, 11);
+
  visibility: hidden;
}
+
  background-image: url(https://cz-wiki.metin2.gameforge.com/images/5/5d/Okno.png); /* Pozadí obrázku */
+
  background-size: contain; /* Zajistí, že celý obrázek se přizpůsobí obsahu */
.mw-htmlform-submit {
+
  background-repeat: no-repeat;
    color: rgb(254, 206, 88);
+
  color: white;
    border-radius: 5px 5px 0px 0px;
+
  text-align: center;
    border-width: 2px;
+
  padding: 20px;
    border-style: solid;
+
 
    border-color: rgb(254, 206, 88) rgb(110, 48, 11) rgb(110, 48, 11);
+
  /* Flexbox pro zarovnání textu do středu */
    background: -moz-linear-gradient(center top , rgb(35, 5, 0) 0px, rgb(44, 7, 0) 50%, rgb(69, 10, 0) 100%) repeat scroll 0% 0% transparent;
+
  display: flex;
}
+
  justify-content: center; /* Horizontální zarovnání */
+
  align-items: center; /* Vertikální zarovnání */
#preferences {
+
 
    border-color: rgb(110, 48, 11);
+
  /* Pozice pop-upu */
    background: url("http://wiki.metin2.cz/images/9/91/Transparentn%C3%AD_pozad%C3%AD.png") repeat;
+
  position: absolute;
    background-color: transparent !important;
+
  z-index: 1001; /* Text má vyšší z-index než obrázek pozadí */
}
+
  bottom: 100%; /* Tooltip je nyní blíže k otazníku */
+
  left: 50%;
.prefsection fieldset {
+
  transform: translateX(-50%); /* Centrování tooltipu */
    background: url("http://wiki.metin2.cz/images/9/91/Transparentn%C3%AD_pozad%C3%AD.png") repeat;
+
  white-space: nowrap; /* Zabraňuje zalamování textu */
    border: 1px solid rgb(0, 0, 0);
+
  margin-bottom: 5px; /* Přidání mezery mezi otazníkem a tooltipem */
    border-top-right-radius: 5px;
 
    border-top-left-radius: 5px;
 
    border-bottom-right-radius: 5px;
 
    border-bottom-left-radius: 5px;
 
}
 
 
td.htmlform-tip {
 
    color: rgb(153, 0, 0);
 
}
 
 
.prefsection legend {
 
    color: rgb(153, 0, 0);
 
}
 
 
#preftoc li a,
 
#preftoc li a:active {
 
    margin-left: 0.2em;
 
    border-radius: 5px 5px 0px 0px;
 
    border-width: 2px;
 
    border-style: solid;
 
    border-right: 1px solid rgb(110, 48, 11);
 
    border-color: rgb(254, 206, 88) rgb(110, 48, 11) rgb(110, 48, 11);
 
    background: -moz-linear-gradient(center top , rgb(35, 5, 0) 0px, rgb(44, 7, 0) 50%, rgb(69, 10, 0) 100%) repeat scroll 0% 0% transparent;
 
}
 
 
#preftoc a,
 
#preftoc a:active {
 
    display: inline-block;
 
    position: relative;
 
    color: rgb(254, 206, 88);
 
    padding: 0.5em;
 
    font-size: 0.9em;
 
}
 
 
#preftoc li,
 
#preftoc li.selected {
 
    background-color: transparent;
 
    border-width: 0px;
 
 
}
 
}
  
#preftoc li:first-child {
+
.tooltip:hover .tooltiptext {
    margin-left: 0.2em;
+
  visibility: visible;
}
+
  opacity: 1;
+
  z-index: 1001; /* Zajišťuje, že tooltip se zobrazí před jiným obsahem */
#preftoc li a:hover,
 
#preftoc li.selected a {
 
    color: rgb(255, 255, 255);
 
    text-decoration: none;
 
    border-radius: 5px 5px 0px 0px;
 
    border-width: 2px;
 
    border-style: solid;
 
    border-color: rgb(254, 206, 88) rgb(110, 48, 11) rgb(110, 48, 11);
 
    background: linear-gradient(to bottom, rgb(75, 11, 0) 0px, rgb(57, 8, 0) 100%) repeat scroll 0% 0% transparent;
 
}
 
 
#p-cactions li {
 
    border-style: none;
 
}
 
 
#p-cactions li a {
 
    border-radius: 5px 5px 0px 0px;
 
    border-width: 1px;
 
    border-style: solid;
 
    border-right: 1px solid rgb(110, 48, 11);
 
    border-color: rgb(254, 206, 88) rgb(110, 48, 11) rgb(110, 48, 11);
 
    background: -moz-linear-gradient(center top , rgb(35, 5, 0) 0px, rgb(44, 7, 0) 50%, rgb(69, 10, 0) 100%) repeat scroll 0% 0% transparent;
 
    padding: 0.3em 0.8em 0em;
 
}
 
 
#p-cactions li a:hover,
 
#p-cactions li.selected a {
 
    color: rgb(255, 255, 255);
 
    border-radius: 5px 5px 0px 0px;
 
    border-width: 1px;
 
    border-style: solid;
 
    border-color: rgb(254, 206, 88) rgb(110, 48, 11) rgb(110, 48, 11);
 
    background: linear-gradient(to bottom, rgb(75, 11, 0) 0px, rgb(57, 8, 0) 100%) repeat scroll 0% 0% transparent;
 
    padding: 0.3em 1em 0em !important;
 
}
 
 
#p-cactions .new a:hover {
 
    color: rgb(255, 0, 0);
 
 
}
 
}
  
li.gallerybox div.thumb,
+
  /* Automatická velikost obrázku dle hranic ohraničení */
div.thumbinner {
+
.responsive-image {
    background: url("http://wiki.metin2.cz/images/9/91/Transparentn%C3%AD_pozad%C3%AD.png") repeat scroll 0% 0% transparent;
+
  max-width: 100%;
    border: 1px solid #6e300b;
+
  height: auto;
 +
  object-fit: contain;
 
}
 
}

Aktuální verze z 2. 10. 2024, 20:47

/* Zde uvedené CSS bude ovlivňovat všechny styly */

/** Volitelné styly wiki **/


/* Active effect */
.item_background {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: 0px;
    left: 0px;
    line-height: 0%;
}

.item_item {
    position: absolute;
    top: 0px;
}

.item_active {
    -webkit-animation-name: item_active;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    animation-name: item_active;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    position: absolute;
    top: 0px;
    background-repeat: no-repeat;
}

.item_active a {
    display: block;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes item_active {
    0%   { background-image: url('/images/2/29/Aktivovaný_101.png'); }
    8.33%  { background-image: url('/images/2/25/Aktivovaný_102.png'); }
    16.66%  { background-image: url('/images/2/25/Aktivovaný_103.png'); }
    25%  { background-image: url('/images/4/44/Aktivovaný_104.png'); }
    33.33% { background-image: url('/images/8/84/Aktivovaný_105.png'); }
    41.66% { background-image: url('/images/e/e6/Aktivovaný_106.png'); }
    50% { background-image: url('/images/b/b7/Aktivovaný_107.png'); }
    58.33% { background-image: url('/images/2/26/Aktivovaný_108.png'); }
    66.66% { background-image: url('/images/c/cf/Aktivovaný_109.png'); }
    75% { background-image: url('/images/3/30/Aktivovaný_110.png'); }
    83.33% { background-image: url('/images/6/6e/Aktivovaný_111.png'); }
    91.66% { background-image: url('/images/3/34/Aktivovaný_112.png'); }
    100% { background-image: url('/images/8/80/Aktivovaný_113.png'); }
}
 
/* Standard syntax */
@keyframes item_active {
    0%   { background-image: url('/images/2/29/Aktivovaný_101.png'); }
    8.33%  { background-image: url('/images/2/25/Aktivovaný_102.png'); }
    16.66%  { background-image: url('/images/2/25/Aktivovaný_103.png'); }
    25%  { background-image: url('/images/4/44/Aktivovaný_104.png'); }
    33.33% { background-image: url('/images/8/84/Aktivovaný_105.png'); }
    41.66% { background-image: url('/images/e/e6/Aktivovaný_106.png'); }
    50% { background-image: url('/images/b/b7/Aktivovaný_107.png'); }
    58.33% { background-image: url('/images/2/26/Aktivovaný_108.png'); }
    66.66% { background-image: url('/images/c/cf/Aktivovaný_109.png'); }
    75% { background-image: url('/images/3/30/Aktivovaný_110.png'); }
    83.33% { background-image: url('/images/6/6e/Aktivovaný_111.png'); }
    91.66% { background-image: url('/images/3/34/Aktivovaný_112.png'); }
    100% { background-image: url('/images/8/80/Aktivovaný_113.png'); }
}

/* Volitelné transparentní pozadí */
.transp-bg {
    background: url("https://cz-wiki.metin2.gameforge.com/images/9/91/Transparentn%c3%ad_pozad%c3%ad.png") repeat;
    border: 1px solid #000000;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.transp-bg2 {
    background: url("https://cz-wiki.metin2.gameforge.com/images/9/91/Transparentn%c3%ad_pozad%c3%ad.png") repeat;
    background-color: transparent !important;
}

/* Skryje nápis „Hlavní strana“  */
body.page-Hlavní_strana #catlinks,
body.page-Hlavní_strana h1.firstHeading{
display: none;
}

/* Vzhled hlaviček */
.header-bg {
    background: url("https://cz-wiki.metin2.gameforge.com/images/1/12/Header-bg.png") repeat 0em 0em;
    color: rgb(254, 206, 88);
}

.header-bg a {
 color: #fece58;
 text-decoration: none !important;
}

li.gallerybox div.thumb,
div.thumbinner {
    background: url("https://cz-wiki.metin2.gameforge.com/images/9/91/Transparentn%c3%ad_pozad%c3%ad.png") repeat scroll 0% 0% transparent;	
    border: 1px solid #6e300b;
}

html .thumbimage {
    border: 1px solid #6e300b;
}

:focus {
    outline: none; 
}

.hoverbox { display:inline-block; padding:0em; }
.hoverbox .hoveritem { display:none; margin:0em; padding:0em; }
.hoverbox .hoveritem.selected { display:inline-block; }
.hoverbox:hover .hoveritem { display:inline-block; }
.hoverbox:hover .hoveritem.selected { display:none; }

.klavesa {
    background-color: rgb(247, 247, 247);
    background-image: -webkit-linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
    background-image: -moz-linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
    background-image: -o-linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
    background-image: linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
    border: 1px solid;
    border-color: rgb(221, 221, 221) rgb(170, 170, 170) rgb(136, 136, 136) rgb(204, 204, 204);
    border-radius: 2px;
    padding: 0 .4em;
    text-shadow: 0 1px rgba(255,255,255,.5);
    white-space: nowrap;
}

/* Tooltip */
.tooltip {
  position: relative;
  display: inline-block;
  cursor: pointer;
  z-index: 1000; /* Zajišťuje, že tooltip bude vždy nahoře */
}

.tooltip .tooltiptext {
  visibility: hidden;
  background-image: url(https://cz-wiki.metin2.gameforge.com/images/5/5d/Okno.png); /* Pozadí obrázku */
  background-size: contain; /* Zajistí, že celý obrázek se přizpůsobí obsahu */
  background-repeat: no-repeat;
  color: white;
  text-align: center;
  padding: 20px;
  
  /* Flexbox pro zarovnání textu do středu */
  display: flex;
  justify-content: center; /* Horizontální zarovnání */
  align-items: center; /* Vertikální zarovnání */
  
  /* Pozice pop-upu */
  position: absolute;
  z-index: 1001; /* Text má vyšší z-index než obrázek pozadí */
  bottom: 100%; /* Tooltip je nyní blíže k otazníku */
  left: 50%;
  transform: translateX(-50%); /* Centrování tooltipu */
  white-space: nowrap; /* Zabraňuje zalamování textu */
  margin-bottom: 5px; /* Přidání mezery mezi otazníkem a tooltipem */
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
  z-index: 1001; /* Zajišťuje, že tooltip se zobrazí před jiným obsahem */
}

  /* Automatická velikost obrázku dle hranic ohraničení */
.responsive-image {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}