/*********************************************************************************
 * Zakladni layout
 ********************************************************************************/
@font-face {
  font-family: 'titillium';
  src: url('https://computermedia.sk/obrazky/fonty/TitilliumWeb-Regular.ttf');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'titillium';
  src: url('https://computermedia.sk/obrazky/fonty/TitilliumWeb-Bold.ttf');
  font-weight: bold;
  font-style: normal;
}

html {
  height: 100%;
}
 
body {
  padding: 0;
  margin: 0;
  color: #333333;
  font-family: 'titillium', Tahoma, sans-serif;
  background: #ffffff;
}

main {
  position: relative;
  overflow-x: hidden;
}

#stranka {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 320px;
}

#obsah {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px 40px 66px 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  box-sizing: border-box;
}

#obsah.je_obsah_nahore {
  padding-top: 22px;
}

#obsah_nahore {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 22px 40px 0px 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  box-sizing: border-box;
}

@media print { 
  #obsah_nahore {
    display: none;
  }
}

#obsah_vlevo {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 0px;
  flex: 0 0 0;
  -ms-flex-preferred-size: 264px;
  flex-basis: 264px;
  margin-right: 24px;
}

@media (max-width: 1023px) {
  #obsah_vlevo {
    display: none;
  }
}

@media (min-width: 1024px) {
  #obsah_vlevo {
    display: block !important;
  }
}

@media print { 
 #obsah_vlevo {
   display: none;
 } 
}

#obsah_vpravo {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  text-overflow: ellipsis; 
  overflow: hidden;
}

#komponenta {
  border: 0;
  margin: 0;
  padding: 0px 0px 0px 0px;
  min-height: 50px;
}

#zahlavi {
  border-top: 5px solid #ffffff;
  border-bottom: 5px solid #333333;
  background: #ffffff;
  height: 152px;
  box-sizing: border-box;
}

#zahlavi.vyber-jazyka-meny {
  height: 182px;
}

@media (max-width: 800px) {
  #zahlavi,
  #zahlavi.vyber-jazyka-meny {
    height: 144px;
  }
}

@media print { 
 #zahlavi {
   display: none;
 } 
}

#zahlavi-obsah {
  position: relative;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0px;
  text-align: center;
  box-sizing: border-box;
  height: 92px;
  line-height: 92px;
}

.vyber-jazyka-meny #zahlavi-obsah {
  height: 122px;
  line-height: 157px;
}

#zahlavi-menu {
  position: relative;
  background: #f8f8f8;
}

#zahlavi-vpravo {
  position: absolute;
  display: block;
  right: 0px;
  top: 0px;
}

@media (max-width: 1165px) {
  #zahlavi-vpravo {
    right: 32px;
  }
}

@media (max-width: 800px) {
  #zahlavi-vpravo {
    right: 28px;
  }
}

#vyber-obsah {
  position: absolute;
  top: 0px;
  right: 0px;
  line-height: normal;
}

@media (min-width: 801px) {
  #zahlavi-menu.sticky {
    position: fixed;
    top: 0px;
    z-index: 99;
    box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.08);
    width: 100%;
  }
}

@media (max-width: 800px) {
  #zahlavi-obsah {
    line-height: 180px;
  }
}

#zahlavi-obsah-info {
  position: absolute;
  top: 0px;
  left: 0px;
  line-height: normal;
}

@media (max-width: 1165px) {
  #zahlavi-obsah-info {
    left: 32px;
  }
}

@media (max-width: 450px) {
  #zahlavi-obsah-info {
    font-size: 0.75rem;
  }
}


#zapati {
}

@media print { 
 #zapati {
   display: none;
 } 
}

#zapati_obsah {
}

#social {
  position: relative;
  background: rgba(77, 86, 88, 0.2);
  border-radius: 4px;
}

@media (max-width: 650px) {
  #social {
    text-align: center;
  }
}

@media print { 
 #social {
   display: none;
 } 
}

.social-tlacitko {
  height: 48px;
  line-height: 48px;
  margin: 8px 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  background-color: #ffffff;
  border-radius: 4px;
  box-sizing: border-box;
  box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.08);
  text-align: center;
  padding: 0 16px;
  color: #4c83b9;
  text-decoration: none;
  font-weight: bold;
  vertical-align: middle;
  min-width: 165px;
}

.social-tlacitko:hover {
  opacity: 0.8;
}

#social .social-tlacitko.sdilet {
  background: #ffffff url('https://computermedia.sk/obrazky/sdilet_maly.png') no-repeat 16px;
  background-size: 20px 20px;
  padding-left: 40px;
}

#social .vytisknout {
  background: #ffffff url('https://computermedia.sk/obrazky/tisk_maly.png') no-repeat 16px;
  background-size: 20px 20px;
  padding-left: 40px;
}

#social .social-tlacitko.nahlasit {
  background: #ffffff url('https://computermedia.sk/obrazky/nahlasit_maly.png') no-repeat 16px;
  background-size: 20px 20px;
  padding-left: 40px;
}

#social .facebook {
  background: url('https://computermedia.sk/obrazky/fb.png') no-repeat left -1px;
  padding-left: 33px;
}

#social .twitter {
  background: url('https://computermedia.sk/obrazky/twitter.png') no-repeat left -1px;
  padding-left: 33px;
}

#social .gplus {
  background: url('https://computermedia.sk/obrazky/gplus.png') no-repeat left -1px;
  padding-left: 33px;
}

#social .email,
#social .skryte_mSocial_sdilet .email {
  background: url('https://computermedia.sk/obrazky/email.png') no-repeat left -1px;
  padding-left: 33px;
  margin: 5px 7px 1px 7px;
}

#social .skryte_mSocial_sdilet {
  position: absolute;
  left: 8px;
  bottom: 56px;
  background: white;
  z-index: 2;
  text-align: left;
  border: 1px solid black;
  border-radius: 4px;
  opacity: 0.93;
}

#social .skryte_mSocial_sdilet a {
  display: block;
  margin: 5px 7px;
  height: 25px;
}

/*********************************************************************************
 * Zakladni styly
 ********************************************************************************/

a {
  color: #333333;
  text-decoration: underline;
}

a:hover {
  text-decoration: none;
}

.nadpis,
.podnadpis,
.podpodnadpis {
  font-family: 'titillium', Tahoma, Arial, sans-serif;
  font-weight: bold;
  color: #333333;
  padding: 0;
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nadpis {
  font-size: 2rem;
  margin: 0 0 1rem 0;
  position: relative;
}

.nadpis_form .nadpis {
  float: left;
  width: calc(100% - 200px);
}

.nadpis_form .hledej {
  float: left;
  width: 200px;
  text-align: right;
  position: relative;
}

.nadpis_form:after {
  clear: both;
  content: "";
  display: table;
}

.nadpis-kategorie-obrazek {
  margin: 0 0 15px 0;
}

.nadpis-kategorie-obrazek img {
  max-width: 100%;
}

@media (max-width: 800px) {
  .nadpis-kategorie-obrazek img {
  }
}

.nadpis-kategorie-popis {
  margin: 0 0 10px 0;
}

.podnadpis {
  font-size: 1.5rem;
  margin: 0 0 0.6em 0;
}

.podnadpis a {
  text-decoration: none;
}

.podpodnadpis {
  font-size: 1.25rem;
  margin: 0 0 0.4em 0;
}

.dialog .nadpis:first-child {
  display: none;
}

.dialog .nadpis {
  line-height: 42px;
  text-align: left;
  font-family: 'titillium', Tahoma, Arial, sans-serif;
  font-size: 19px;
  font-weight: bold;
  color: #000000;
}

.dialog .podnadpis {
  font-family: 'titillium', Tahoma, Arial, sans-serif;
  font-size: 15px;
  color: #000000;
}

fieldset .podnadpis {
  font-family: 'titillium', Tahoma, Arial, sans-serif;
  padding: 0px;
  margin: 0px 0px 5px 0px;
  font-size: 16px;
  font-weight: bold;
}

.sloupec {
  float: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 2px 0px;
}

.sloupec .napul > span,
.sloupec .napulOdsazeno > span {
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 50%;
}

.sloupec .napul > span.none,
.sloupec .napulOdsazeno > span.none {
  display: none;
}

.sloupec .napul > span:first-child {
  text-align: right;
  line-height: 26px;
}

.sloupec .napul select,
.sloupec .napulOdsazeno select {
  width: 99%;
}

.sloupec .napulOdsazeno > span {
  width: 47%;
  line-height: 26px;
  padding: 2px;
}

.sloupec .napulOdsazeno > span:first-child {
  text-align: right;
  width: 51%;
}

.zalozky {
  width: 100%;
  padding-bottom: 2px;
  margin-bottom: 2px;
}

.zalozky a {
  display: block;
  border-right: 1px solid #a9a9a9;
  float: left;
  font-family: 'titillium', Tahoma, Arial, sans-serif;
  font-size: 0.8rem;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 3px;
  margin-bottom: 3px;
}

.zalozky a.posledni {
  border-right: none;
}

.zalozky a.aktivni {
  font-weight: bold;
  color: #356d9e;
}

.cara {
  height: 4px;
  background: #f3f7fa;
  border-top: 1px solid #f9fafc;
  border-bottom: 1px solid #f9fafc;
  margin: 10px 0px;
  clear: both;
}

.dialog {
  display: none;
  font-family: 'titillium', Arial, sans-serif;
  font-size: 14px;
  text-align: left;
}

.souborNacitany .souborObrazek {
  width: 50px;
  height: 50px;
  background: url('https://computermedia.sk/obrazky/nacitani_postup.png') no-repeat center center;
  background-position: 0px 0px;
  position: relative;
  float: left;
  margin: 5px;
}

.souborNacitany.neAjax .souborObrazek {
  width: 100px;
  background: url('https://computermedia.sk/obrazky/nacitani2.gif') no-repeat center left;
}

.souborNacitany .souborInformace,
.souborNahledy.nahledySloupec .souborNahled {
  float: left;
}

.souborNacitany .souborInformace,
.souborNahledy.nahledySloupec .souborNahled .souborInformace {
  width: 140px;
  height: 65px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 5px;
}

.souborNahledy.nahledySloupec .souborNahled .souborObrazek {
  height: 85px;
}

.souborNahledy.nahledyRadek .souborNahled {
  display: inline-block;
  padding: 10px 10px 10px 10px;
}

.souborNacitany .souborInformace span,
.souborNacitany .souborInformace a,
.souborNahled .souborInformace span,
.souborNahled .souborInformace a {
  display: block;
  font-size: 13px;
}

.souborNacitany .souborProcenta {
  position: absolute;
  font-size: 11px;
  top: 17px;
  left: 10px;
}

.souborNacitany.neAjax .souborProcenta {
  position: static;
  padding-left: 20px;
}

.souborUpload .souborNacitane,
.souborUpload .souborNahledy,
.souborUpload .souborDiv {
  clear: both;
}

.souborUpload label.tlacitkoSvetle {
  font-weight: normal;
  height: 20px;
  line-height: 20px;
  margin: 0px 5px 5px 10px;
}

.souborUpload .souborObrazek img {
  max-width: 280px;
  max-height: 200px;
}

.dialog .souborUpload .souborObrazek img {
  max-width: 100%;
}

/*********************************************************************************
 * Karusel
 ********************************************************************************/

svg {
  width: 100%;
  height: 100%;
  display: block;
}

.svg {
  width: 100%;
  height: 100%;
  display: block;
}

.posuvne {
  width: 100%;
  overflow: hidden;
  position: relative;
}

.posuvne-zpet,
.posuvne-vpred {
  width: 40px;
  height: 40px;
  position: absolute;
  z-index: 3;
  top: 50%;
  display: block;
  border-radius: 50%;
  background: #0091AA;
  opacity: 0.5;
  fill: white;
  stroke: white;
  text-decoration: none;
  transform: translateY(-50%);
}

.posuvne-zpet:hover,
.posuvne-vpred:hover {
  opacity: .8;
  filter: alpha(opacity=80);
}

.posuvne-zpet svg,
.posuvne-vpred svg {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 18px;
  transform: translateX(-50%) translateY(-50%);
}

.posuvne-zpet {
  left: 0px;
  display: none;
}

.posuvne-vpred {
  right: 0px;
  display: none;
}

.scroll-zpet .posuvne-zpet,
.scroll-zpet-vpred .posuvne-zpet,
.scroll-vpred .posuvne-vpred,
.scroll-zpet-vpred .posuvne-vpred {
  display: block;
}

.posuvne-polozky::-webkit-scrollbar {
  display: none;
}

.scroll-zpet .posuvne-polozky {
}

.scroll-vpred .posuvne-polozky {
}

.scroll-zpet-vpred .posuvne-polozky {
}

.posuvne-polozky {
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.posuvne-polozka {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 186px;
  height: 240px;
  margin: 0 25px 0 0;
}

.produkt-soubory .posuvne-polozka {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 96px;
  height: 100px;
}

/*********************************************************************************
 * Formulare
 ********************************************************************************/

form {
  margin: 0px;
}

form label.povinne,
form .vypis tr th.povinne {
  color: #356895;
}

form.zavislosti {
  padding-top: 5px;
}

.dialog form.zavislosti {
  padding-top: 0px;
}

form.zavislosti .zavislosti_nadpis,
form.zavislosti .zavislosti_nazev,
form.zavislosti .zavislosti_text {
  margin: 5px 10px;
}

.dialog form.zavislosti .zavislosti_nadpis,
.dialog form.zavislosti .zavislosti_nazev,
.dialog form.zavislosti .zavislosti_text {
  margin: 5px 0px;
}

form.zavislosti .zavislosti_nadpis,
form.zavislosti .zavislosti_nazev {
  font-weight: bold;
}

form.zavislosti .zavislosti_nadpis,
.dialog form.zavislosti .zavislosti_nadpis {
  margin-top: 10px;
}

.cbox, .rbox {
  margin: 7px 7px 0px 0px;
}

.select {
  box-sizing: content-box;
  -moz-box-sizing: content-box;
  font-family: inherit;
  font-size: inherit;
  color: #34373e;
  height: 26px;
  border: 2px solid #bcc3c9;
  margin: 0px 4px 0px 0px;
  padding: 3px 0px;
}

.select.velkyselect {
  font-weight: bold;
  height: 30px;
}

.tbox, .tarea {
  font-family: inherit;
  font-size: inherit;
  color: #34373e;
  background: white;
  border: 2px solid #4c83b9;
  padding: 3px 5px;
  margin: 0px 4px 0px 0px;
  height: 20px;
}

.tbox-multi, .tarea-multi, .upload-multi {
  display: none;
}

.span-multi {
  position: relative;
}

.select-multi {
  position: absolute;
  max-width: 80px;
  height: 26px;
  top: 0px;
  right: 0px;
}

.tarea {
  height: auto;
}

.tbox:focus, .tarea:focus {
  outline: none;
  background: #fff;
  border-color: #c8c8c8;
}

.tbox[disabled], .tarea[disabled], .tbox[disabled='disabled'], .tarea[disabled='disabled'] {
  background-color: #ddd;
}

.tbox.combobox, .tarea.combobox {
  margin-right: 0px;
}

input.cena,
input.cislo,
input.datum,
form.uprostred input.cena,
form.uprostred input.cislo,
form.uprostred input.datum {
  width: 100px;
}

input.telefon,
form.uprostred input.telefon {
  width: 189px;
}

input.kratky,
form.uprostred input.kratky {
  width: 70px;
}

div .label {
  float: left;
  text-align: left;
  width: 38%;
  padding: 3px 1%;
  height: 22px;
  line-height: 22px;
}

.tboxLabel, .tareaLabel, .selectLabel, .cboxLabel, .rboxLabel {
  padding-right: 5px;
  text-align: left;
}

.tareaLabel {
  vertical-align: top;
}

.cboxLabel, .rboxLabel {
  vertical-align: 0px;
}

fieldset {
  border: solid 1px #ddd;
  padding: 12px 12px 12px 12px;
  margin: 5px 0px 5px 0px;
}

fieldset legend {
  font-weight: bold;
  padding: 0px;
  margin: 0px;
}

form.uprostred > div .label,
form.uprostred fieldset > div .label {
  text-align: right;
  margin-top: 5px;
  margin-bottom: 5px;
}

form.uprostred > div .left,
form.uprostred fieldset > div .left {
  width: 60%;
  margin-top: 5px;
  margin-bottom: 5px;
}

form.uprostred .tbox,
form.uprostred .tarea {
  width: 75%;
}

form.uprostred .mce-tinymce:not(.mce-fullscreen) {
  width: 75%;
  max-width: 75%;
}

form.uprostred .editor-fw .mce-tinymce:not(.mce-fullscreen) {
  width: 95%;
  max-width: 95%;
}

form.uprostred > div .left.spanTextu,
form.uprostred fieldset > div .left.spanTextu {
  line-height: 22px;
  padding: 3px 0px;
}

.form-element {
  margin: 5px 0px 5px 40%;  
}

.form-text {
  padding-top: 3px;
}

.submit,
.tlacitko,
.tlacitkoSvetle,
.tlacitkoCervene,
.tlacitkoObjednat {
  font-family: inherit;
  font-size: inherit;
  font-weight: bold;
  box-sizing: content-box;
  -moz-box-sizing: content-box;
  display: inline-block;
  border: 2px solid #4c83b9;
  height: 26px;
  line-height: 26px;
  margin: 0px 5px;
  padding: 0px 20px;
  cursor: pointer;
  text-decoration: none;
}

.submit,
.tlacitko,
a.tlacitko {
  background: #4c83b9;
  color: white;
}

.submit:hover,
.tlacitko:hover,
a.tlacitko:hover {
  background: white;
  color: #4c83b9;
}

.submit[disabled], 
.submit[disabled='disabled'], 
.submit[disabled]:hover, 
.submit[disabled='disabled']:hover {
  color: #b0b0b0;
  background-color: #e0e0e0;
  border-color: #b0b0b0;
  cursor: default;
}

.elementSubmit {
  text-align: right;
  padding: 10px;
}

.dialog .elementSubmit {
  display: none;
}

.tlacitkoSvetle,
a.tlacitkoSvetle {
  background: white;
  color: #4c83b9;
}

.tlacitkoSvetle:hover,
a.tlacitkoSvetle:hover {
  border-color: #aaa;
}

.tlacitkoCervene,
a.tlacitkoCervene,
.tlacitkoObjednat,
a.tlacitkoObjednat {
  background: #ec0678;
  color: white;
  border: 2px solid #ec0678;
}

.tlacitkoCervene:hover,
a.tlacitkoCervene:hover,
.tlacitkoObjednat:hover,
a.tlacitkoObjednat:hover {
  border-color: #181717;
}

.listaTlacitek {
  position: absolute;
  right: 20px;
  top: 0px;
}

.uspech {
  color: green;
}

.varovani {
  color:orange;
}

.chyba {
  color:red;
}

.tbox.chybaElement,
.tarea.chybaElement {
  border-bottom: 2px solid red;
}

.chybaZprava {
  font-size: 14px;
  display: block;
  color: red;
  padding: 5px;
  text-align: left;
}

.chybaZprava.chybaCbox {
  margin-left: 5px;
}

.adresar-filtr-hledej {
  width: 99%;
  padding: 0.5%;
}

.adresar-filtr-hledej .hledej {
  float: right;
  position: relative;  
}

.adresar-filtr-hledej .filtr-zobrazeni {
  float: left;
}

.adresar-filtr-hledej:after {
  clear: both;
  content: "";
  display: table;
}

.hledej .tbox {
  background: #fff;
  height: 25px;
  margin: 0px;
  padding: 0px;
  outline: 0px;
}

.hledej .submit {
  background: #fff url('https://computermedia.sk/obrazky/hledej.png') no-repeat center center;
  bottom: 0px;
  height: auto;
  position: absolute;
  right: 0px;
  top: 0px;
  width: 25px;
  padding: 0px;
  display: block;
  margin: 0px;
}

.adresaPristupna {
  font-size: 12px;
  color: #a6a6a6;
}

.adresaPristupna .adresaZadana {
  font-weight: bold;
}

div.editor img {
  max-width: 100%;
}

div.editor img.logo {
  max-width: 350px;
  max-height: 65px;
}

.vyberBarvy,
form.uprostred input.vyberBarvy,
form.sloupce input.vyberBarvy {
  background: #ffffff;
  border: 1px solid #d7d7d7;
  padding: 5px 10px;
  display: block;
  color: #000;
  text-decoration: none;
  width: 100px;
}

/*********************************************************************************
 * Vypisy
 ********************************************************************************/

.divVypis {
  position: relative;
}

.divVypis .vypisObal {
  width: 99%;
  padding: 0px 0.5%;
}

.nastaveniSloupcu {
  background: #e2e3e3;
  display: none;
}

.nastaveniSloupcu .cbox {
  margin: 0px 0px 0px 5px;
}

.nastaveniSloupcu .cboxLabel {
  margin: 0px 10px 0px 0px;
}

.nastaveniSloupcu .sloupec_cbox_span {
  white-space: nowrap;
}

.vypis, .vypis_bez, .tabulka {
  border-collapse: collapse;
  border-spacing: 0px;
  width: 100%;
  text-align: left;
}

.vypis tr.zadnyRadek:hover {
  background: white;
}

.vypis tr:hover {
  background: #ecf0f1;
}

.vypis tr th {
  background-color: #d8d8d8;
  text-align: left;
  border-top: 1px solid #999999;
  border-bottom: 1px solid #999999;
  color: #626262;
  font-weight: normal;
  padding: 0px;
}

.vypis tr th:first-child {
  border-left: 1px solid #999999;
}

.vypis tr th:last-child {
  border-right: 1px solid #999999;
}

.vypis tr td,
.vypis_bez tr td {
  padding: 0px;
  vertical-align: middle;
  border: 1px solid #d7d7d7;
}

.vypis_bez tr td {
  border: 0px;
  padding: 5px 0px;
}

.vypis tr .tdDiv,
.vypis_bez tr .tdDiv {
  display: block;
  position: relative;
  padding: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.vypis .sudyRadek {
  background-color: #f9f9f9;
}

.vypis .lichyRadek {
  background-color: #ffffff;
}

.zapati {
  padding: 10px 0.5% 0;
}

.zapati:after {
  clear: both;
  content: "";
  display: table;
}

.zapati .stranky {
  float: left;
  padding-top: 5px;
}

.zapati .stranky ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-block;
}

.zapati ul + .zaznamu {
  padding: 0 0 0 10px;
}

.zapati .stranky li {
  display: inline-block;
  margin: 0 5px 5px 0;
}

.zapati .stranky a {
  border: 1px solid #626262;
  color: #626262;
  display: inline-block;
  line-height: 1em;
  padding: 5px 10px;
  text-decoration: none;
  vertical-align: middle;
}

.zapati .stranky a.b {
  color: #222;
  font-weight: bold;
  border: 2px solid #222;
}

.zapati .nastranku {
  float: right;
  text-align: right;
}

.zapati .nastranku .select {
  margin: 0;
}

.zapati .nastranku a {
  display: none;
}

.akce {
  padding: 0px;
  margin: 10px 0px;
}

.akce .right {
  text-align: right;
}

.razeni a {
  color: #626262;
  display: block;
  text-decoration: none;
  width: 100%;
  box-sizing: border-box;
}

.razeni.razeni_hover {
  background-color: #e9e9e9;
  text-decoration: underline;
}

.razeni0 a {
  background: url('https://computermedia.sk/obrazky/smer0.gif') no-repeat left;
  padding-left: 15px;
}

.razeni1 a {
  background: url('https://computermedia.sk/obrazky/smer1.gif') no-repeat left;
  padding-left: 15px;
}

th .zobrazFiltr {
  display: none;
}

th.razeni_hover .zobrazFiltr {
  display: block;
}

.vypis .cbox {
  margin: 3px 4px 0px 0px;
}

.trFiltry {
  background: #ecf0f1;
  display: none;
}

.vypis tr.trFiltry td {
  border: 0px;
}

.trFiltry .tdDiv {
  line-height: 18px;
  font-size: 13px
}

.trFiltry input.tbox {
  width: 234px;
  margin: 0px 5px;
  padding: 2px 4px;
  height: 18px;
  line-height: 18px;
  font-size: 12px;
}

.trFiltry input.cbox {
  margin-left: 5px;
}

.trFiltry input.rozsah {
  text-align: right;
  width: 100px;
}

.trFiltry input.datum {
  width: 100px;
}

.trFiltry .filtrLabel {
  width: 150px;
  display: block;
  float: left;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.trFiltry .filtrLabel.tboxLabel {
  padding: 4px 0px;
}

.vypis thead img,
.trFiltry img {
  position: absolute;
  right: 5px;
  top: 50%;
  margin-top: -8px;
  cursor: pointer;
}

.seznam-polozek-odkaz {
  padding-left: 10px;
}

.vypis-zapati-celkem {
  text-align: right;
  padding: 5px 0.5%;
}

.strom-odsazeni-prvni {
  display: inline-block;
  padding: 0 0 0 5px;
}

.strom-odsazeni {
  display: inline-block;
}

a.strom-odsazeni:before {
  content: '└';
  text-decoration: none;
  color: #333333;
  opacity: 0.7;
  display:inline-block;
  padding: 0 5px 0 0;
  font-size: 12px;
}

/*********************************************************************************
 * Adresar
 ********************************************************************************/

a.adresarSlozka,
a.adresarSoubor {
  text-decoration: none;
  color: black;
}

.adresarPriponaSlozka {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_slozka.gif') no-repeat left;
}

.adresarPriponaAudio {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_audio.gif') no-repeat left;
}

.adresarPriponaVideo {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_video.gif') no-repeat left;
}

.adresarPriponaObrazek {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_obrazek.gif') no-repeat left;
}

.adresarPriponaSoubor {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_soubor.gif') no-repeat left;
}

.adresarPriponaPdf {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_pdf.gif') no-repeat left;
}

.adresarPriponaDoc {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_doc.gif') no-repeat left;
}

.adresarPriponaDocx {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_docx.gif') no-repeat left;
}

.adresarPriponaXls {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_xls.gif') no-repeat left;
}

.adresarPriponaXlsx {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_xlsx.gif') no-repeat left;
}

.adresarPriponaPpt {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_ppt.gif') no-repeat left;
}

.adresarPriponaPptx {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_pptx.gif') no-repeat left;
}

.adresarPriponaOdt {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_odt.gif') no-repeat left;
}

.adresarPriponaEpub {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_epub.gif') no-repeat left;
}

.adresarPriponaPrc {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_prc.gif') no-repeat left;
}

.adresarPriponaMobi {
  padding-left: 19px;
  background: url('https://computermedia.sk/obrazky/pripona_mobi.gif') no-repeat left;
}

.adresarNahled {
  border: 1px solid #ecf0f1;
  margin: 5px;
  padding: 5px;
  width: 110px;
  float: left;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  position: relative;
}

.adresarNahled:hover {
  background: #ecf0f1;
}

.adresarNastroje {
  position: absolute;
  top: 0px;
  right: 0px;
  display: block;
  width: 17px;
  overflow: hidden;
}

.adresarNastroje span,
.adresarNastroje a {
  display: block;
  padding-top: 2px;
}

.adresarNastroje span {
  padding-left: 2px;
}

.adresarObalka {
  display: inline-block;
  height: 80px;
  width: 80px;
  line-height: 80px;
}

.adresarObalka img {
  vertical-align: middle;
}

.adresarNazev {
  padding-top: 5px;
  display: block;
}

/*********************************************************************************
 * E-shop
 ********************************************************************************/

.produkt-cena-od {
  padding: 5px;  
}

.produkt-ceny-od {
  padding: 10px;
  margin: 10px 0px;
  background: #f5f5f5;
  width: 100%;
}

.produkt-ceny-od .cena-od-mnozstvi {
  padding: 0px 10px;
}

.produkt-ceny-od .cena-od-cena,
.produkt-ceny-od .cena-od-sleva {
  font-weight: bold;
  padding: 0px 10px;
}

.produkt-pristupny0 {
  color: red;
}

.produkt-pristupny1 {
  color: green;
}

#idWebPanel,
#idBlok,
#idEdice.produkt-edice-pridat-vyber,
.kategorie-segmenty-pridat-vyber,
.kategorie-panely-pridat-vyber,
.kategorie-clanky-pridat-vyber,
.clanek-kategorie-pridat-vyber {
  display: none;
}

#produkt-bloky-pridat,
#produkt-autori-pridat,
#produkt-edice-pridat,
#segment-panely-pridat,
.kategorie-segmenty-pridat,
.kategorie-panely-pridat,
.kategorie-clanky-pridat,
.clanek-kategorie-pridat {
  display: inline-block;
  padding: 3px 10px 3px 0px;
}

.produkt-blok-nazev,
.produkt-autor-nazev,
.produkt-edice-nazev,
.segment-panel-nazev,
.kategorie-segment-nazev,
.kategorie-panel-nazev,
.kategorie-clanek-nazev,
.clanek-kategorie-nazev,
.distribuce-automatika-znacka-nazev,
.distribuce-automatika-kategorie-nazev {
  font-weight: bold;
}

.produkt-blok-odstranit,
.produkt-autor-odstranit,
.produkt-znacka-odstranit,
.produkt-edice-odstranit,
.segment-panel-odstranit,
.kategorie-segment-odstranit,
.kategorie-panel-odstranit,
.kategorie-clanek-odstranit,
.clanek-kategorie-odstranit,
.distribuce-automatika-znacka-odstranit,
.distribuce-automatika-kategorie-odstranit {
  display: inline-block;
  padding: 0px 0px 0px 15px;
}

#distribuce-znacky th,
#distribuce-znacky td {
  text-align: left;
  padding: 0 32px 0 0;
}

#distribuce-znacky .distribuce-znacka-odstranit {
  margin-left: 15px;
}

.produkt-blok-hover,
.segment-panel-hover {
  opacity: 0.4;
  border-bottom: 1px dashed black;  
}

.objednavka-expedovat-naraz {
  font-weight: bold;
  padding-top: 5px;
}

.objednavka-virtualni-nazev {
  display: block;
  font-weight: bold;
  margin: 5px 0px 5px 10px;  
}

.vypis-stranky {
  text-align: right;
  margin: 10px 0 0 0;
}

.vypis-stranka {
  display: inline-block;
  padding: 4px 6px;
  margin: 0px 5px 0px 0px;
  background: #f5f5f5;
  color: #333333;
  text-decoration: none;
}

.vypis-stranka.aktivni {
  background: #333333;
  color: white;
}

.vypis-dalsi-obal {
  margin: 10px 0 0 0;
  text-align: center;
}

.vypis-dalsi {
  display: inline-block;
  padding: 10px;
  background: #f5f5f5;
  color: #333333;
  -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
          border-radius: 5px;
  text-decoration: none;
}

.vypis-produkty {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: space-between;
  position: relative;
  padding: 0px 0px 0px 0px;
}

@media (max-width: 495px) {
  .vypis-produkty {
    justify-content: center;
  }
}

.vypis-produkty-nadpis {
  margin: -0.5rem 0 15px 0;
  padding: 1px 0px;
}

.vypis-produkty-serad {
  position: absolute;
  right: 0px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1rem;
  margin: 1px 0px;
}

@media (max-width: 800px) {
  .vypis-produkty-serad {
    position: static;
    display: block;
    font-size: 0.8rem;
    transform: none;
    right: auto;
    top: auto;
  }

  .vypis-produkty-serad .selectLabel {
    display: none;
  }
}

.vypis-produkt {
  flex: 0 0 196px;
  margin: 6px;
}

.vypis-produkt .produkt-obrazek {
  display: block;
  height: 265px;
  line-height: 265px;
  text-align: center;
  position: relative;
}

.produkt-obrazek-obal {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

.vypis-produkt .produkt-obrazek img {
  max-width: 186px;
  max-height: 260px;
  /*vertical-align: middle;*/
  display: block;
}

.vypis-produkt .produkt-nazev,
.vypis-produkt .produkt-autor {
  display: block;
}

.vypis-produkt .produkt-nazev {
  font-weight: bold;
}

.vypis-produkt .produkt-autor {
  margin: 5px 0 0 0;  
}

.vypis-produkt .produkt-cena {
  font-weight: bold;
  color: #09b4ff;
}

.vypis-produkt .produkt-dostupne-od {
  color: #09b4ff;
}

.vypis-produkt .produkt-paticka {
  margin: 10px 0 0 0;  
}

.vypis-produkt a.produkt-odkaz {
  text-decoration: none;  
}

.produkt-koupit,
.produkt-upozornit {
  display: inline-block;
  background: #333333;
  padding: 10px 18px;
  color: white;
  text-decoration: none;
  margin: 0px 0px 0px 0px;
}

.produkt-koupit:hover,
.produkt-upozornit:hover {
  color: white;
  background: #09b4ff;
}

.produkt-koupit-mnozstvi {
  height: 44px;
  width: 56px;
  box-sizing: border-box;
  text-align: center;
}

.vypis-produkt .produkt-koupit,
.vypis-produkt .produkt-upozornit {
  margin: 10px 0 0 0;  
}

.vypis-produkt .produkt-upozornit {
  font-size: 0.9rem;
}

.produkt-samostatne {
  display: inline-flex;
}

.produkt-obal {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  box-sizing: border-box;
}

@media (max-width: 1023px) {
  .produkt-obal {
    flex-direction: column;
    -ms-flex-direction: column;
  }
}

.produkt-detail {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  text-overflow: ellipsis; 
  overflow: hidden;
}

.produkt-nahledy {
  float: left;
  width: 40%;
  max-width: 370px;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 20px;
}

.produkt-nahledy.sticky {
  float: none;
  width: 100%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 100;
  max-width: 100%;
  height: 100vh;
}

#produkt-nahledy-pozadi {
  display: none;
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0.7;
  z-index: 100;
}

#produkt-nahledy-zpet,
#produkt-nahledy-vpred {
  display: none;
  padding: 25px;
  background: white url('https://computermedia.sk/obrazky/lightbox_predchozi.gif') no-repeat center center;
  border-radius: 10px;
  text-decoration: none;
  z-index: 101;
  position: relative;
  transform: translateY(-50%);
  top: 50%;
  margin: 0 30px 0 0;
  opacity: 0.7;
}

#produkt-nahledy-vpred {
  background: white url('https://computermedia.sk/obrazky/lightbox_dalsi.gif') no-repeat center center;
  margin: 0 0 0 30px;
}

#produkt-nahledy-zpet:hover,
#produkt-nahledy-vpred:hover {
  opacity: 1;
}

#produkt-nahledy-zavrit {
  display: none;
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 10px 10px 10px 25px;
  background: white url('https://computermedia.sk/obrazky/zavrit.png') no-repeat 5px;
  border-radius: 10px;
  z-index: 101;
  text-decoration: none;
  opacity: 0.7;
}

#produkt-nahledy-zavrit:hover {
  opacity: 1;
}

.produkt-nahledy.sticky #produkt-nahledy-pozadi,
.produkt-nahledy.sticky #produkt-nahledy-zavrit {
  display: block;
}

.produkt-nahledy.produkt-nahledy-dalsi.sticky #produkt-nahledy-zpet,
.produkt-nahledy.produkt-nahledy-dalsi.sticky #produkt-nahledy-vpred {
  display: inline-block;
}

@media (max-width: 700px) {
  .produkt-nahledy {
    width: 100%;
    max-width: 100%;
    padding: 0px;
  }
}

#produkt-soubor-hlavni {
  position: relative;
  display: inline-block;
  max-width: 100%;
}

.produkt-nahledy.sticky #produkt-soubor-hlavni,
.produkt-nahledy.sticky .produkt-soubor-sipka {
  display: inline-block;
  height: 100%;
  position: relative;
  z-index: 101;
  cursor: default;
  vertical-align: middle;
}

.produkt-nahledy.produkt-nahledy-dalsi.sticky #produkt-soubor-hlavni {
  max-width: calc(100% - 170px);
}

.produkt-nahledy.produkt-nahledy-dalsi.sticky #produkt-soubor-hlavni,
.produkt-nahledy.produkt-nahledy-dalsi.sticky .produkt-soubor-sipka {
  height: calc(100% - 120px);
}

.produkt-nahledy.sticky #produkt-soubor-hlavni .stitek {
  display: none;
}

.produkt-nahledy.sticky .posuvne {
  max-width: 450px;
  margin: 10px auto 10px auto;
  position: relative;
  z-index: 101;
}

.produkt-nahledy img {
  max-width: 100%;
}

.produkt-nahledy #produkt-soubor-hlavni img {
  display: block;
}

.produkt-nahledy.sticky #produkt-soubor-hlavni img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  position: relative;
  transform: translateY(-50%);
  top: 50%;
  background: white;
}

.produkt-info {
  float: left;
  width: 60%;
  box-sizing: border-box;
  padding: 0px 0px 0px 3%;
}

@media (max-width: 700px) {
  .produkt-info {
    margin: 15px 0px;
    width: 100%;
    max-width: 100%;
    padding: 0px;
  }
}

.produkt-info .produkt-nazev {
  margin: 0px 0px 15px 0px;
  padding: 0px;
  font-size: 2rem;
}

.produkt-info .produkt-autor {
  margin: 0px 0px 10px 0px;
  padding: 0px;
  font-size: 1rem;
}

.produkt-info .produkt-popis-kratky {
  margin: 0px 0px 10px 0px;
  padding: 0px;
}

.produkt-info .produkt-paticka {
  border-top: 1px solid #f5f5f5;
  border-bottom: 1px solid #f5f5f5;
  padding: 15px 0px;
  margin: 15px 0px 0px 0px;
}

.produkt-info .produkt-cena {
  font-weight: bold;
  font-size: 1.5rem;
  color: #09b4ff;
}

.produkt-cena-bez-akce {
  display: inline-block;
  padding: 0px 15px 0px 0px;
  text-decoration: line-through;
  color: #09b4ff;
}

.produkt-cena-vysledna {
  color: red;
}

.produkt-cena-predbezna {
  color: #686868;
}

.produkt-info .produkt-predprodej,
.produkt-info .produkt-pripravujeme,
.produkt-info .produkt-skladem {
  display: inline-block;
  padding: 0 10px 0 0;
}

.produkt-sklad .produkt-skladem {
  font-weight: bold;
}

.produkt-sklad .produkt-skladem0 {
  color: red;
}

.produkt-sklad .produkt-skladem1 {
  color: green;
}

.produkt-info .produkt-dostupne-od {
  color: #09b4ff;
}

.produkt-info .produkt-isbn {
  color: #7d7d7d;
}

.produkt-info .produkt-koupit,
.produkt-info .produkt-upozornit {
  margin: 10px 10px 0px 0px;
}

.produkt-nahledy-info:after {
  clear: both;
  content: "";
  display: table;
}

.produkt-zalozka,
.produkt-zalozka-vertikalni {
  display: inline-block;
  text-decoration: none;
  padding: 10px 15px 10px 15px;
  margin: 0px 1px -1px 1px;
  border: 0px;
  color: #7d7d7d;
  background: #f0f0f0;
}

.produkt-zalozka-vertikalni {
  display: none;
  margin: 0px 1px 0px 1px;
  border: 1px solid #d1d1d1;
}

.produkt-zalozka:hover {
  opacity: 0.92;
}

@media (max-width: 800px) {
  .produkt-zalozka {
    display: none;
  }

  .produkt-zalozka-vertikalni {
    display: block;
  }
}

.produkt-zalozka.aktivni,
.produkt-zalozka-vertikalni.aktivni {
  background: white;
  border: 1px solid #d1d1d1;
  border-bottom: 1px solid white;  
  color: #333333;
}

.produkt-zalozka-vertikalni.aktivni {
  border-bottom: 1px solid #d1d1d1; 
}

.produkt-zalozky {
  margin: 15px 0px 0px 0px;
  border-bottom: 1px solid #d1d1d1;
}

.produkt-zalozky-vertikalni {
  margin: 15px 0px 0px 0px;
}

.produkt-zalozka-obsah {
  padding: 10px;
}

@media (max-width: 700px) {
  .produkt-zalozka-obsah {
    padding: 10px 0px 10px 10px;
  }
}

.produkt-zalozka-obsah div.produkt-parametry {
  display: none;
}

@media (max-width: 700px) {
  .produkt-zalozka-obsah div.produkt-parametry {
    display: block;
  }

  .produkt-zalozka-obsah table.produkt-parametry {
    display: none;
  }
}

.produkt-parametry .produkt-parametr-nazev {
  font-weight: bold;
  padding: 5px 40px 5px 0;
}

@media (max-width: 700px) {
  .produkt-parametry .produkt-parametr-nazev {
    padding: 5px 10px 5px 0;
  }
}

.produkt-parametry .produkt-parametr-hodnota {
  padding: 5px 0px 5px 0;
}

.parametr-graficky-hvezda-vyplneny,
.parametr-graficky-hvezda-prazdny,
.parametr-graficky-ctverec-vyplneny,
.parametr-graficky-ctverec-prazdny {
  display: inline-block;
  height: 20px;
  width: 20px;
  vertical-align: middle;
}

.parametr-graficky-hvezda-vyplneny {
  background: url('https://computermedia.sk/obrazky/hvezda.png') no-repeat center;
  background-size: 20px 20px;
  padding-left: 2px;  
}

.parametr-graficky-hvezda-prazdny {
  background: url('https://computermedia.sk/obrazky/hvezda-prazdna.png') no-repeat center;
  background-size: 20px 20px;
  padding-left: 2px;  
}

.parametr-graficky-ctverec-vyplneny {
  background: url('https://computermedia.sk/obrazky/ctverec.png') no-repeat center;
  background-size: 20px 20px;
  padding-left: 2px;  
}

.parametr-graficky-ctverec-prazdny {
  background: url('https://computermedia.sk/obrazky/ctverec-prazdny.png') no-repeat center;
  background-size: 20px 20px;
  padding-left: 2px;  
}

.produkt-parametr-skupina-nazev {
  font-weight: bold;
  padding: 15px 0 0 0;
  margin: 0 0 10px 0;
  border-bottom: 1px solid #d1d1d1;
  text-transform: uppercase;
}

.produkt-prilohy .produkt-priloha,
.produkt-virtualnis .produkt-virtualni {
  padding: 5px 10px 5px 0px;
}

.produkt-prilohy .produkt-priloha-velikost,
.produkt-virtualnis .produkt-virtualni-velikost {
  padding: 0px 0px 0px 5px;
  font-style: italic;
}

#produkt-ukazka {
  width: 100%;
  min-height: 1000px;
  border: 0px;
}

.produkt-souvisejicis {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 0px;
  flex: 0 0 0;
  -ms-flex-preferred-size: 226px;
  flex-basis: 226px;
  margin-left: 24px;
}

.produkt-prislusenstvis,
.produkt-doporucenes,
.produkt-take-koupilis {
  margin: 15px 0px 0px 0px;
}

@media (max-width: 1023px) {
  .produkt-souvisejicis {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    text-overflow: ellipsis; 
    overflow: hidden;
    margin-left: 0px;
    width: 100%;
  }
}

.produkt-souvisejicis .produkt-souvisejici-nadpis,
.produkt-doporucenes .produkt-doporucene-nadpis,
.produkt-take-koupilis .produkt-take-koupili-nadpis,
.vypis-homepage-nadpis {
  font-weight: normal;
  font-size: 1.5rem;
  margin: 0px 0px 15px 0px;
  padding: 0px 0px 5px 0px;
  border-bottom: 1px solid #e5e5e5;
}

.vypis-homepage-nadpis {
  margin: 15px 0px 15px 0px;
  display: flex;
  flex-wrap: wrap;
}

.vypis-homepage-nadpis-nadpis {
  flex: 1 1 auto;
  padding: 0 15px 0 0;
}

.vypis-homepage-nadpis-tlacitko {
  text-align: center;
  flex: 0 0 0;
  flex-basis: 160px;
  color: #333333;
  border-radius: 3px;
  border: 2px solid #333333;
  height: 40px;
  line-height: 20px;
  box-sizing: border-box;
  margin: 0;
  padding: 10px 10px;
  display: inline-block;
  width: auto;
  font-size: 14px;  
  text-decoration: none;
}

@media (max-width: 500px) {
  .vypis-homepage-nadpis-tlacitko {
    position: static;
    text-align: center;
  }
}

.produkt-souvisejicis .produkt-souvisejici {
  text-decoration: none;
  text-align: center;
  display: block;
  margin: 15px 0px;
  vertical-align: top;
}

.produkt-novy {
  text-decoration: none;
  text-align: center;
  display: inline-block;
  margin: 12px 12px;
  width: 226px;
  vertical-align: top;
}

.produkt-novy.produkt-varianta {
  padding-right: 12px;
  border-right: 2px solid #4c83b9;
  margin-right: 0;
}

@media (max-width: 1023px) {
  .produkt-souvisejicis .produkt-souvisejici {
    display: inline-block;
    margin: 12px 12px;
    width: 226px;
  }
}

.produkt-souvisejicis .produkt-souvisejici-obrazek {
  display: block;
  text-align: center;
}

.produkt-novy .produkt-novy-obrazek {
  display: block;
  height: 265px;
  line-height: 265px;
  text-align: center;
}

.produkt-souvisejicis .produkt-souvisejici-obrazek img,
.produkt-novy .produkt-novy-obrazek img {
  max-width: 208px;
  max-height: 260px;
  /*vertical-align: middle;*/
  display: block;
}

.produkt-souvisejicis .produkt-souvisejici-nazev,
.produkt-souvisejicis .produkt-souvisejici-cena, 
.produkt-novy .produkt-novy-nazev {
  display: block;
}

.produkt-souvisejicis .produkt-souvisejici-nazev,
.produkt-novy .produkt-novy-nazev {
  font-weight: bold;
  margin: 5px 0 0 0;
}

.produkt-souvisejicis .produkt-souvisejici-cena {
  font-weight: bold;
  color: #09b4ff;
}

.stitky {
  bottom: 0px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  font-weight: bold;
  left: -12px;
  margin: 0px;
  max-width: 150px;
  position: absolute;
  align-items: flex-start;
}

.stitek {
  background-color: #999;
  color: #555;
  height: 24px;
  line-height: 24px;
  margin-top: 10px;
  padding: 0px 10px;
  position: relative;
  white-space: nowrap;
  -webkit-box-shadow: 0px 2px 4px #888;
  -moz-box-shadow: 0px 2px 4px #888;
  box-shadow: 0px 2px 4px #888;
}

.stitek .stitek-obsah {
  display: inline-block;
  overflow: hidden;
}

.stitek.stitek-barva-tmava {
  color: white;
}

.stitek.stitek-barva-svetla {
  color: #333;
}

.stitek:after {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  left: 0px;
  top: 100%;
  border-width: 3px 6px;
  border-style: solid;
  border-color: #666 #666 transparent transparent;
}

.ikony {
  align-items: flex-end;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  margin: 0px;
  max-width: 50px;
  position: absolute;
  right: 0px;
  top: 0px;
}

.ikony img.ikona {
  display: inline-block;
  margin-bottom: 5px;
  max-height: 30px;
  max-width: 30px;
}

.produkt-detail .produkt-nahledy img.ikona {
  max-height: 45px;
  max-width: 45px;
  margin-bottom: 10px;
}

.objednavka-stav-barva {
  border-radius: 5px;
  display: inline-block;
  padding: 5px;
}

.objednavka-stav-barva-tmava {
  color: white;
}

.objednavka-stav-barva-svetla {
  color: #333;
}

.lista-zarovnani-0 {
  text-align: left;
}

.lista-zarovnani-1 {
  text-align: center;
}

.lista-zarovnani-2 {
  text-align: right;
}


.produkt-hodnoceni-cislo {
  font-size: 20px;
  font-weight: bold;
}

.produkt-hodnoceni-hvezdy {
  margin: 10px 0 0 0;
  white-space: nowrap;
}

.produkt-hodnoceni-pocet {
  font-size: 14px;
  margin: 10px 0 0 0;
}

.produkt-hodnoceni-obsah {
  display: flex;
  align-items: center;
  text-align: center;
  margin: 0 0 50px 0;
}

@media (max-width: 1000px) {
  .produkt-hodnoceni-obsah {
    flex-flow: column;
    margin: 0px;
  }
}

.produkt-hodnoceni-obsah .produkt-hodnoceni {
  flex: 1 1 auto;
  padding: 0 10px;
}

.produkt-pocty-hvezd {
  flex: 1 0 0;
  flex-basis: 220px;
  padding: 0 10px;
  border-left: 1px solid #DDDDDD;
  border-right: 1px solid #DDDDDD;
}

@media (max-width: 1000px) {
  .produkt-pocty-hvezd {
    flex: 1 1 auto;
    border: 0px;
    margin: 25px 0;
  }
}

.produkt-hvezdy {
  white-space: nowrap;
  font-size: 14px;
}

.produkt-hvezdy-hodnoceni {
  vertical-align: middle;
}

.produkt-hvezdy-text {
  vertical-align: middle;
}

.produkt-hodnotit {
  flex: 1 1 auto;
  padding: 0 10px;
  font-family: 'roboto', Tahoma, serif;
}

.produkt-hodnotit-nadpis {
  font-size: 18px;
  font-weight: bold;
  margin: 0 0 30px 0;
}

.produkt-hodnotit-obsah {
  white-space: nowrap;
}

.produkt-hodnotit-text {
  font-size: 12px;
  text-transform: uppercase;
  color: #555555;
}

.produkt-hodnotit-hvezdy {
  margin: 0 10px;
}

.produkt-hvezda {
  display: inline-block;
  margin: 0 4px 0 0;
}

.hvezda svg {
  width: 18px;
  height: 17px;
  fill: none;
  stroke: #AAAAAA;
  stroke-width: 1px; 
  display: inline-block;
}

.produkt-hvezda-barevna .hvezda svg {
  fill: #eebb33;
  stroke: #eebb33;
}

.produkt-hodnoceni-komentar-radek {
  color: grey;
  font-size: 14px;
}

.produkt-recenzes {
  margin: 0 0 50px 0;  
}

@media (max-width: 500px) {
  .produkt-recenzes {
    margin: 50px 0 0 0;  
  }
}

.produkt-recenze-dalsi {
  background: green;
  border-radius: 3px;
  color: white;
  height: 40px;
  line-height: 40px;
  padding: 0 20px;
  display: inline-block;
  text-decoration: none;
}

.produkt-recenze-dalsi-stranky {
  margin: 20px 0 0 0;
}

.produkt-recenze-dalsi-obsah {
  text-align: center;
}

.produkt-recenze {
  padding: 50px;
  display: flex;
}

@media (max-width: 500px) {
  .produkt-recenze {
    flex-flow: column;
    padding: 30px;
  }
}

.produkt-recenze:nth-child(odd) {
  background: rgba(238, 238, 238, 0.6);
  border-radius: 3px;
}

.produkt-recenze-uzivatel {
  margin: 15px 0 0 0;
  font-weight: bold;
}

.produkt-recenze-datum {
  font-size: 12px;
  color: #AAAAAA;
  margin: 12px 0 0 0;
}

.produkt-recenze-hodnoceni {
  flex: 0 0 0;
  flex-basis: 210px;
  text-align: center;
}

@media (max-width: 500px) {
  .produkt-recenze-hodnoceni {
    flex: 1 1 auto;
    text-align: left;
  }
}

.produkt-recenze-komentar {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
}

.produkt-recenze-popis {
  flex: 1 1 100%;  
}

.produkt-recenze-klady,
.produkt-recenze-zapory {
  flex: 1 1 50%;
  padding: 0 0 0 30px;
  box-sizing: border-box;
}

@media (max-width: 500px) {
  .produkt-recenze-klady,
  .produkt-recenze-zapory {
    padding: 30px 0 0 0;
  }
}

.produkt-recenze .span-radek {
  display: flex;
  align-items: center;
}

.produkt-recenze .span-radek .span-radek-text {
  flex: 1 1 auto;
}

.produkt-recenze .span-radek .produkt-recenze-klad,
.produkt-recenze .span-radek .produkt-recenze-zapor {
  flex: 0 0 20px;
  margin: 0 10px 0 0;
  height: 20px;
  width: 20px;
  background-color: green;
  border-radius: 100%;
  position: relative;
}

.produkt-recenze .span-radek .produkt-recenze-zapor {
  background-color: red;
}

.produkt-recenze .plus svg,
.produkt-recenze .minus svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: #FFFFFF;
  stroke-width: 2px; 
  display: inline-block;
  position: absolute;
  transform: translate(-50%,-50%);
  top: 50%;
  left: 50%;
}

.produkt-doprava-obrazek {
  display: block;
  text-align: center;
}

.produkt-doprava-obrazek img {
  display: inline-block;
  vertical-align: middle;
  max-height: 3rem;
}

.produkt-doprava-nazev {
  display: block;
  font-weight: bold;
}

.produkt-doprava-cena,
.produkt-doprava-datum {
  display: block;
  text-align: right;
}

.produkt-poradna-datum {
  color: #626262;
}

.produkt-poradna-jmeno {
  font-weight: bold;
  position: relative;
}

.produkt-poradna-odpoved {
  margin: 10px 0 0 25px;
}

.produkt-poradna-zaznam {
  margin: 15px 0 0 0;
  border-bottom: 1px solid #626262;
  padding: 0 0 10px 0;
}

.produkt-poradna-jmeno img {
  max-width: 16px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.produkt-poradna-jmeno span {
  margin: 0 0 0 20px;
}

.produkt-poradna-pridat .tlacitko {
  margin: 10px 0 0 0;
}

.produkt-akce-odpocet {
  margin: 0 0 15px 0;
}

.produkt-akce-odpocet .odpocet-obsah {
  display: flex;
  font-size: 14px;
  background: red;
  color: white;
}

.produkt-akce-odpocet .odpocet-den,
.produkt-akce-odpocet .odpocet-hodina,
.produkt-akce-odpocet .odpocet-minuta,
.produkt-akce-odpocet .odpocet-sekunda {
  text-align: center;
  padding: 0 10px 0 10px;
}

.produkt-akce-odpocet .odpocet-konec {
  color: red;
  display: none;
  text-align: left;
  width: 100%;
}

.produkt-akce-odpocet .popis {
  display: block;
  font-size: 14px;
}

.produkt-akce-odpocet-popis {
  font-size: 1.15rem;
  color: black;
  font-weight: normal;
}

#kategorie-clanek-obsah {
  border-top: 1px solid #cccccc;
  margin: 15px 0 0 0;
  padding: 15px 0 0 0;
}

#kategorie-clanky-odkazy {
  border-top: 1px solid #cccccc;
  margin: 15px 0 0 0;
  padding: 15px 0 0 0;
}

#kategorie-clanky-odkazy ul {
  columns: 2;
  margin: 0;
  padding: 0;
}

#kategorie-clanky-odkazy li {
  list-style: none;
}

.clanek-seznam-clanky {
  padding: 20px 0 0 0;
}

.clanek-seznam-clanek {
  display: flex;
}

@media (max-width: 480px) {
  .clanek-seznam-clanek {
    flex-direction: column;
  }
}

.clanek-seznam-obrazek {
  flex: 0 0 0;
  flex-basis: 160px;
  padding: 0 20px 0 0;
}

.clanek-seznam-obrazek img {
  max-width: 100%;
  vertical-align: middle;
}

.clanek-seznam-obsah {
  flex: 1 1 auto;
  padding: 0 0 20px 0;
}

.clanek-seznam-nazev {
  font-size: 20px;
  font-weight: bold;
}

.clanek-seznam-popis {
  padding: 5px 0 5px 0;
}

.clanek-seznam-odkaz {
  display: block;  
}

/*********************************************************************************
 * Kosik a objednavka
 ********************************************************************************/

.kosik-pridano {
  margin: 0px 0px 10px 0px;  
}

.kosik-pridano-zbozi {
  padding: 10px 0px;
}

.kosik-pridano-obrazek {
  float: left;
  width: 80px;
}

.kosik-pridano-zbozi .nazev {
  display: inline-block;
  width: 270px;
  padding: 10px 0px 0px 10px;
}

#kosik-koupit-zpet,
#kosik-koupit-kosik {
  font-size: 12px;
  padding: 5px;
}

#kosik-koupit-zpet {
  float: left;
  margin: 0px 5px 0px 0px;
}

#kosik-koupit-kosik {
  float: right;
  margin: 0px 0px 0px 5px;
}

#kosik-koupit-tlacitka {
  margin: 10px 0px 0px 0px;    
}

#kosik-koupit-tlacitka:after,
.kosik-pridano-zbozi:after {
  clear: both;
  content: "";
  display: table;    
}

.kosik-zahlavi {
  background: white;
  text-align: center;
}

.kosik-krok {
  color: #8d8d8d;
  display: inline-block;
  padding: 10px;
  width: 160px;
  opacity: .6;
}

.kosik-krok-aktivni {
  color: black;
  opacity: 1;
}

.kosik-krok .cislo {
  display: inline-block;
  line-height: 30px;
  width: 30px;
  height: 30px;
  background: #ff6b04;
  border-radius: 30px;
  text-align: center;
  color: white;
  font-weight: bold;
  margin: 0px 7px 0px 0px;
}

.kosik-krok .polozka {
  display: inline-block;
  width: 123px;
}

.kosik-zapati {
  background: white; 
  padding: 10px 5px; 
}

.kosik-zapati a.tlacitkoSvetle {
  margin: 0;
  float: left;
}

.kosik-zapati a.tlacitko {
  margin: 0;
  float: right;
}

@media (max-width: 400px) {
  .kosik-zapati a.tlacitkoSvetle,
  .kosik-zapati a.tlacitko {
    font-size: 13px;
    padding: 0px 8px;
  }
}

.kosik-zapati:after {
  clear: both;
  content: "";
  display: table;    
}

.kosik-obsah-vypis {
  background: white;
  color: black;  
}

#kosik-zapati-celkem {
  padding: 5px;
  text-align: right;
}

#kosik-sleva {
  font-weight: bold;
  color: #ee0000;
}

#kosik-celkem {
  font-weight: bold;  
}

#kosik-slevovy-kod {
  max-width: 133px;
}

#kosik-slevovy-kod-pridat {
  padding: 0px 14px;
  margin: 0 0 0 5px;
  min-width: 40px;
}

.kosik-darky,
.kosik-benefity {
  margin: 15px 0 0 0;
}

.kosik-benefit-spravovat {
  margin: 0 0 10px 0;  
}

#kosik-benefit-spravovat {
  margin: 0 0 0 5px;
}

.kosik-slevy-nadpis,
.kosik-benefity-nadpis,
.kosik-darky-nadpis {
  font-weight: bold; 
  padding: 0 0 5px 0; 
}

#kosik-slevy,
#kosik-benefity,
#kosik-darky {
  margin: 15px 0 10px 0;
  padding: 10px;
  background: #d8d8d8;
  max-width: 340px;
  min-width: 220px;
}

.kosik-sleva-kod {
  display: inline-block;
  font-style: italic;
  padding: 0 10px 0 0;
}

.kosik-sleva-sleva {
  display: inline-block;
  font-weight: bold;  
  padding: 0 10px;
  font-size: 0.95rem;
}

.kosik-slevovy-kod-smazat,
.kosik-benefit-smazat-krizek {
  display: inline-block;
  font-weight: bold;
  font-size: 1.3rem;
  text-decoration: none;
  font-family: Arial;
  vertical-align: middle;
  padding: 0 0 0 5px;
  color: #ee0000;
  width: 30px;
}

.kosik-slevovy-kod-zapati,
.kosik-benefit-zapati {
  margin: 15px 0 15px 0;  
}

.kosik-darek-teaser {
  padding: 0 10px 10px 10px;  
}

.kosik-darek-venovani-label {
  display: block;
  font-weight: bold;
  margin: 10px 0 0 0;
}

.kosik-darek-vice {
  display: block;
}

.kosik-darek-nazev-obrazek,
.kosik-benefit-nazev-obrazek {
  display: flex;
  align-items: center;
  justify-content: center;
}

.kosik-darek-nazev,
.kosik-benefit-nazev {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 0 0 0 10px;
}

.kosik-darek-obrazek,
.kosik-benefit-obrazek {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 0px;
  flex: 0 0 0;
  -ms-flex-preferred-size: 40px;
  flex-basis: 40px;
  padding: 0 0 0 10px;
}

.kosik-darek-obrazek img,
.kosik-benefit-obrazek img {
  max-width: 100%;
  vertical-align: middle;
}

.kosik-darek-dialog,
.benefit-tabulka-nazev-popis-obrazek,
.darky-tabulka-nazev-popis-obrazek {
  display: flex;
  align-items: center;
  justify-content: center;
}

.kosik-darek-dialog-popis,
.benefit-tabulka-nazev-popis,
.darky-tabulka-nazev-popis {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

.kosik-darek-dialog-obrazek,
.benefit-tabulka-obrazek,
.darky-tabulka-obrazek {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 0px;
  flex: 0 0 0;
  -ms-flex-preferred-size: 260px;
  flex-basis: 260px;
  padding: 0 15px 0 0;
}

.benefit-tabulka-obrazek,
.darky-tabulka-obrazek {
  -ms-flex-preferred-size: 160px;
  flex-basis: 160px;
}

.kosik-darek-dialog-obrazek img,
.benefit-tabulka-obrazek img,
.darky-tabulka-obrazek img {
  max-width: 100%;
  vertical-align: middle;
}

.benefit-tabulka,
.darky-tabulka,
.platby-tabulka,
.dopravci-tabulka {
  border-collapse: collapse;
  border-spacing: 0px;
  text-align: center;
  width: auto;
}

.benefit-tabulka tr th,
.benefit-tabulka tr td,
.darky-tabulka tr th,
.darky-tabulka tr td,
.platby-tabulka tr th,
.platby-tabulka tr td,
.dopravci-tabulka tr th,
.dopravci-tabulka tr td {
  padding: 0 15px;
}

.benefit-tabulka tr td,
.darky-tabulka tr td,
.platby-tabulka tr td,
.dopravci-tabulka tr td {
  padding: 15px;
}

.benefit-tabulka-nazev,
.darky-tabulka-nazev {
  font-weight: bold;
}

#benefit-kosik-zpet {
  margin: 0 0 15px 0;  
}

#prodavajiciPopis {
  width: 98%;
  min-height: 70px;
  margin: 0px;
}

.objednavka-info {
  background: white;
  color: black;
  padding: 10px;
  float: left;
  width: calc(50% - 20px);
}

.objednavka-info-prodavajici-poznamka {
  background: white;
  color: black;
  padding: 10px;
  float: left;
  width: calc(50% - 20px);
}

#objednavka-info-panel:after {
  clear: both;
  content: "";
  display: table;
}

#objednavka-info-panel .submit {
  margin: 0px;
}

.objednavka-info-blacklist {
  margin: 10px 0 0 0;
  background-color: red;
}

.objednavka-info-poznamka {
  font-weight: bold;
  margin: 10px 0 0 0;
}

.objednavka-info-poznamka-obsah {
  font-weight: normal;
}

.objednavka-stav {
  padding: 10px 0;
  font-size: 18px;
  font-weight: bold;
}

.objednavka-baliky {
  padding: 0 0 10px 0;
  font-weight: normal;
}

.objednavka-baliky-balik {
  display: block;
  margin: 5px 0;
}

.objednavka-platba-info {
  padding: 10px 0;
}

.objednavka-zpusob {
  display: none;
}

.objednavka-adresy {
  margin: 0px -2%;    
}

.objednavka-adresa-fakturacni,
.objednavka-adresa-dodaci {
  vertical-align: top;
  display: inline-block;
  width: 46%;
  min-width: 240px;
  margin: 10px 2%;
  box-sizing: border-box;
}

.objednavka-produkty-nadpis {
  font-weight: normal;
  font-size: 1.5rem;
  margin: 10px 0px 15px 0px;
  padding: 0px 0px 5px 0px;
  border-bottom: 1px solid #e5e5e5;
}

.objednavka-platba {
  padding: 10px;
}

.objednavka-platba-typ {
  font-style: italic;
  padding: 0px 0px 10px 0;
}

.objednavka-platba-hodnota {
  font-weight: bold;
}

.objednavka-vytvorena-adresa {
  font-weight: bold;
  text-decoration: none; 
}

.kosik-obsah,
.distribuce-kosik-obsah {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  background: white;
  color: black;
}

.kosik-obsah {
  flex-wrap: nowrap;
}

@media(max-width: 900px) {
  .kosik-obsah {
    flex-flow: column;
  }
}

.kosik-vlevo,
.distribuce-kosik-vlevo {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  text-overflow: ellipsis; 
  overflow: hidden;
  padding: 10px;
}

@media(max-width: 900px) {
  .kosik-vlevo {
    max-width: 810px;
    width: 100%;
    width: calc(100% - 20px);
  }
}

.kosik-vpravo,
.distribuce-kosik-vpravo {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 0px;
  flex: 0 0 0;
  -ms-flex-preferred-size: 270px;
  flex-basis: 270px;
  align-items: flex-start;
  padding: 21px 10px 0 0;
}

@media(max-width: 900px) {
  .kosik-vpravo {
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
  }
}

.kosik-obrazek,
.objednavka-obrazek,
.distribuce-kosik-obrazek {
  display: table-cell;  
  vertical-align: middle;
  width: 20%;
  text-align: center;
}

.kosik-obrazek img,
.objednavka-obrazek img,
.distribuce-kosik-obrazek img {
  max-width: 40px;
}

.kosik-vypis-obrazek {
  max-width: 40px;
}

.kosik-mnozstvi-obsah .produkt-koupit-mnozstvi-plus,
.kosik-mnozstvi-obsah .produkt-koupit-mnozstvi-minus {
  display: none;
}

.kosik-mnozstvi {
  width: 30px;
}

.kosik-mnozstvi-chyba {
  color: red;
  font-style: italic;
}

.kosik-nabidka-skoly {
  color: green;
  font-style: italic;
}

.kosik-smazat {
  display: inline-block;
  font-weight: bold;
  font-size: 1.3rem;
  line-height: 1.3rem;
  height: 1.3rem;
  text-decoration: none;
  font-family: Arial;
  margin: 0 0 0 5px;
  color: #ee0000;
  width: 1em;
  text-align: center;
}

.kosik-nazev,
.objednavka-nazev,
.distribuce-kosik-nazev-odstranit {
  display: table-cell;
  vertical-align: middle;
  width: 55%;
  padding: 0 1%;
}

.kosik-nazev,
.distribuce-kosik-nazev {
  font-size: 12px;
}

a.kosik-nazev,
a.distribuce-kosik-nazev {
  color: #8d8e8d;
}

.kosik-cena,
.objednavka-cena,
.distribuce-kosik-cena {
  display: table-cell;  
  vertical-align: middle;
  width: 22%;
  text-align: right;
  padding: 0 0 0 1%;
}

.kosik-doprava-nazev,
.kosik-platba-nazev,
.kosik-celkem-nazev,
.objednavka-doprava-nazev,
.objednavka-platba-nazev,
.objednavka-celkem-nazev,
.distribuce-kosik-celkem-nazev {
  display: table-cell;  
  vertical-align: middle;
  width: 55%;
  padding: 0 1%;
}

.kosik-doprava-cena,
.kosik-platba-cena,
.kosik-celkem-cena,
.kosik-celkem-sleva,
.objednavka-doprava-cena,
.objednavka-platba-cena,
.objednavka-celkem-cena,
.objednavka-celkem-sleva,
.distribuce-kosik-celkem-cena {
  display: table-cell;  
  vertical-align: middle;
  width: 23%;
  text-align: right;
}

.kosik-celkem-sleva {
  color: #ee0000;
}

.kosik-polozky {
  max-height: 400px;
  overflow: auto;  
}

.kosik-polozky::-webkit-scrollbar,
.distribuce-kosik-polozky::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
}

.kosik-polozky::-webkit-scrollbar-thumb,
.distribuce-kosik-polozky::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, .5);
  border-radius: 4px;
  box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

.kosik-polozka,
.kosik-doprava-polozka,
.kosik-platba-polozka,
.kosik-celkem-polozka,
.objednavka-polozka,
.objednavka-doprava-polozka,
.objednavka-platba-polozka,
.objednavka-celkem-polozka,
.distribuce-kosik-polozka,
.distribuce-kosik-celkem-polozka {
  padding: 3px 0px;
  display: table;
  width: 100%;
}

.kosik-celkem-polozka,
.objednavka-celkem-polozka,
.distribuce-kosik-celkem-polozka {
  border-top: 1px solid black;
  margin: 5px 0px;
  padding: 5px 0px;
  font-weight: bold;  
}

.kosik-typ-dopravy-cena,
.kosik-platba-vyber-cena {
  font-style: italic;
}

.kosik-typ-dopravy-datum-doruceni {
  padding: 0 10px 0 20px;
  color: #71717a;
}

.kosik-typ-dopravy-datum-doruceni-do {
  font-size: 13px;
  padding: 0 5px 0 0;
}

.kosik-typ-dopravy-nevyhovujici {
  color: #8d8e8d;
  display: inline-block;
  padding: 0 0 0 10px;
}

.kosik-fakturacni-vlastni-skryte,
.kosik-dodaci-vlastni-skryte {
  display: none;
}

.kosik-udaje-panel {
  margin-bottom: 10px;
}

.kosik-typ-dopravy,
.kosik-typ-platby {
  display: inline-block;
  height: 32px;
  line-height: 32px;
}

.kosik-typ-dopravy img,
.kosik-typ-platby img {
  max-height: 100%;
  vertical-align: middle;
  padding: 1px 5px 1px 0;
  box-sizing: border-box;
}

.kosik-typ-dopravy-vybrat a {
  display: inline-block;
  margin-left: 10px;
}

.kosik-typ-dopravy-nazev {
  font-weight: bold;
  display: inline-block;
  margin-left: 10px;
}

.kosik-typ-dopravy-pobocky {
  border: none;
  -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
  box-shadow: 0 2px 10px rgba(0,0,0,.2);
  display: block;
  height: 570px;
  margin: 10px 10px 20px;
  max-width: auto;
  overflow: hidden;
  padding: 15px;
  position: relative;
  width: 95%;
  width: calc(100% - 50px);
}

#kosik-typ-dopravy-zasilkovna {
  box-shadow: none;
  position: static;
  padding: 0;
  margin: 0;
  overflow: hidden;
  width: 100%;
  border: none;
  margin-bottom: 10px;
}

#kosik-typ-dopravy-dpd {
  padding-top: 0;
}

.faktura-stahni {
  text-decoration: none;
}

#platba-kartou-tlacitko {
  margin: 10px 0;
}

#platba-kartou {
  display: none;
  position: fixed;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  width: 100%;
  height: 100%;
}

#platba-kartou-pozadi {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0.3;
  z-index: 100;
}

#platba-kartou-dialog {
  position: absolute;
  max-width: 320px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 101;
  opacity: 1;
}

#platba-kartou-dialog-obsah {
  background: white;
  padding: 20px;
  color: black;
}

#platba-kartou-chyba {
  display: none;
  color: red;
  margin: 10px 0px 0px 0px;
}

.kosik-souhlas-podminky {
  margin: 0px auto;
  max-width: 400px;
}


/*********************************************************************************
 * Distribuce
 ********************************************************************************/
.produkt-sklad-historie {
  font-weight: bold;
  display: inline-block;
  padding: 0 10px 0 0;
}

.produkt-naskladnit {
  display: inline-block;
  padding: 0 10px 0 20px;
}

.produkt-vyskladnit {
  display: inline-block;
  padding: 0 0 0 10px;
}

tr.produkt-distribuce th,
tr.produkt-distribuce td {
  padding: 0 10px 0 0;
}

.distribuce-kosik-mnozstvi {
  width: 40px;
}

.distribuce-kosik-mnozstvi-pridat {
  display: none;  
}

.distribuce-kosik-pridat-vybrano {
  font-weight: bold;
  text-decoration: none;
  display: inline-block;
  padding: 0 15px 0 5px;
}

.distribuce-kosik-skladem0 {
  color: red;
}

.distribuce-kosik-skladem1 {
  color: green;
}

#distribuce-kosik-vpravo.distribuce-kosik-vpravo {
  padding: 0 10px 0 0;
}

.distribuce-kosik-distribuce-nazev {
  font-weight: bold;
}

.distribuce-kosik-distribuce {
  padding: 0 0 15px 0;
}

.distribuce-kosik-odstranit {
  display: inline-block;
  padding: 5px 10px 10px 5px;
  background: white url('https://computermedia.sk/obrazky/zavrit.png') no-repeat 0px;
}

.distribuce-objednavka-filtr-sklad {
  margin: 0 0 10px 0;
}

.distribuce-objednavka-filtr-sklad .distribuce-objednavka-filtr {
  float: left;
}

.distribuce-objednavka-filtr-sklad .distribuce-objednavka-sklad {
  float: right;
}

.distribuce-objednavka-filtr-sklad:after {
  clear: both;
  content: "";
  display: table;
}

/*********************************************************************************
 * Hlavni stranka
 ********************************************************************************/

.vypis-kategories {
  margin: 0px;
  background: rgba(77,86,88, 0.2);
  border-radius: 4px;
  box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.08);
}

.vypis-kategories.vypis-kategories-hledani {
  margin: 15px 0;
}

.vypis-kategorie {
  position: relative;
  height: 48px;
  line-height: 48px;
  margin: 8px 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  background: #ffffff;
  border-radius: 4px;
  min-width: 147px;
  padding: 0px 10px;
  box-sizing: border-box;
  box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.08);
  text-align: center;
}

.vypis-kategorie-popis {
  margin-bottom: 24px;
}

.vypis-kategorie-obrazek {
  display: inline-block;
  text-align: center;
  padding: 0 5px;
  vertical-align: middle;
  line-height: normal;
}

.vypis-kategorie-obrazek .obrazek {
  max-width: 36px;
  max-height: 36px;
  border: 0;
}

.vypis-kategorie-nazev {
  display: inline-block;
  padding: 0 5px;
  color: #4c83b9;
}

.vypis-clanky {
  margin: 0px -12px;
}

.vypis-clanky-dalsi {
  display: inline-block;
  white-space: nowrap;
  text-decoration: none;
  background: #4c83b9;
  color: white;
  padding: 12px 24px;
  border-radius: 4px;
}

.vypis-clanky-dalsi-obal {
  text-align: center;
  margin-top: 15px
}

.vypis-clanek,
.vypis-hledane {
  width: 178px;
  height: 178px;
  margin: 12px 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  background: #ffffff;
  box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.08);
  border-radius: 4px;
  color: #4D5658;
  text-decoration: none;
  padding: 24px 0px 0px 0px;
  box-sizing: border-box;
}

.vypis-bannery:not(:first-child),
.vypis-panely:not(:first-child),
.vypis-popis:not(:first-child) {
  margin-top: 15px;
}

.vypis-bannery {
  position: relative;
  text-align: center;
}

.vypis-bannery-lista {
  position: absolute;
  bottom: 0px;
  display: block;
  width: 100%;
  text-align: center;
  height: 80px;
  line-height: 90px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
}

.vypis-bannery-lista-zpet,
.vypis-bannery-lista-vpred {
  display: inline-block;
  width: 9px;
  fill: white;
  stroke: white;
}

.vypis-bannery-lista-zpet {
  margin: 0 21px 0 0;
}

.vypis-bannery-lista-vpred {
  margin: 0 0 0 21px;
}

.vypis-bannery-lista-polozky {
  line-height: 86px;
  display: inline-block;
  vertical-align: top;
}

.vypis-banner-lista-polozka {
  display: inline-block;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  width: 10px;
  height: 10px;
  margin: 0 4px 0 4px;
}

.vypis-banner-lista-polozka-aktivni {
  background: white;
}

.vypis-banner {
  display: none;
  text-align: center;
}

@keyframes banner-fadeIn {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 1;
  }
}

.vypis-banner-aktivni {
  display: inline-block;
  animation: banner-fadeIn 0.25s ease-out;
}

.vypis-banner .obrazek {
  padding: 0;
  margin: 0;
  border: 0;
  max-width: 100%;
  vertical-align: middle;
}

.vypis-panely {
  margin-right: -9px;
  margin-left: -7px;
}

.vypis-panel {
  display: inline-block;
  width: calc(33.3% - 24px);
  box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.15);
  border-radius: 4px;
  margin: 12px 12px;
  text-decoration: none;
  padding: 15px 15px;
  box-sizing: border-box;
  text-align: center;
  height: 300px;
  line-height: 270px;
  color: black;
  overflow: hidden;
  transition: all .2s ease-in-out;
}

.vypis-panely-2 .vypis-panel {
  width: calc(50% - 24px);
}

.vypis-panely-4 .vypis-panel {
  width: calc(25% - 24px);
}

.vypis-panely-6 .vypis-panel {
  width: calc(16.66% - 24px);
}

.vypis-panely-8 .vypis-panel {
  width: calc(12.5% - 24px);
}

@media (max-width: 750px) {
  .vypis-panel {
    width: calc(100% - 24px);
  }

  .vypis-panely-4 .vypis-panel,
  .vypis-panely-2 .vypis-panel {
    width: calc(50% - 24px);
  }

  .vypis-panely-6 .vypis-panel,
  .vypis-panely-8 .vypis-panel {
    width: calc(25% - 24px);
  }
}

@media (max-width: 500px) {
  .vypis-panely-4 .vypis-panel,
  .vypis-panely-2 .vypis-panel {
    width: calc(100% - 24px);
  }

  .vypis-panely-6 .vypis-panel,
  .vypis-panely-8 .vypis-panel {
    width: calc(50% - 24px);
  }
}

.vypis-panel:hover {
  box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.65); 
}

.vypis-panel img {
  max-width: 100%;
  max-height: 100px;
  vertical-align: middle;
  padding: 0px;
  margin: 0px;
  border: 0px;
}

.vypis-panel .vypis-panel-obrazek {
  display: block;
  padding: 0px 0px 10px 0px;
  height: 120px;
  line-height: 120px;
}

.vypis-panel-nazev-podpis {
  display: inline-block;
  line-height: normal;
  vertical-align: middle;
  max-height: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.vypis-panel-s-obrazkem .vypis-panel-nazev-podpis {
  vertical-align: top;
}

.vypis-panel-nazev {
  display: block;
  font-weight: bold;
  padding: 0px 0px 10px 0px;
  font-size: 1.25rem;
}

.vypis-panel-popis {
  display: block;
}

.vypis-hledane {
  margin: 0px;
}

.vypis-hledanes {
  margin: 10px 0 32px 0;
}

.produkt-soubor {
  display: block;
  text-align: center;
  height: 100%;
}

.produkt-soubor img {
  max-width: 86px;
  vertical-align: middle;
}

.vypis-homepage-produkt,
.produkt-doporucene,
.produkt-take-koupili,
.produkt-prislusenstvi {
  width: 186px;
  height: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  text-decoration: none;
  box-sizing: border-box;
}

.vypis-homepage-produkt img,
.produkt-doporucene img,
.produkt-take-koupili img,
.produkt-prislusenstvi img {
  padding: 0px;
  margin: 0px;
  border: 0px;
  max-width: 168px;
  max-height: 168px;
  /*vertical-align: middle;*/
  display: block;
}

.produkt-soubor:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.vypis-homepage-produkt .vypis-homepage-obrazek,
.produkt-doporucene .produkt-doporucene-obrazek,
.produkt-take-koupili .produkt-take-koupili-obrazek,
.produkt-prislusenstvi .produkt-prislusenstvi-obrazek {
  padding: 0px 15px 18px 15px;
  height: 168px;
  line-height: 168px;
  display: block;
  text-align: center;
}

.vypis-clanek-obrazek,
.vypis-hledane-obrazek {
  padding: 0px 49px 18px 49px;
  height: 80px;
  line-height: 80px;
  display: block;
  text-align: center;
}

.vypis-clanek-obrazek .obrazek,
.vypis-hledane-obrazek .obrazek {
  padding: 0;
  margin: 0;
  border: 0;
  max-width: 80px;
  max-height: 80px;
  vertical-align: middle;
}

.vypis-clanek-nazev,
.vypis-hledane-nazev,
.vypis-homepage-nazev,
.produkt-doporucene-nazev,
.produkt-take-koupili-nazev,
.produkt-prislusenstvi-nazev {
  display: block;
  text-align: center;
  font-weight: bold;
}

.vypis-homepage-nazev,
.produkt-doporucene-nazev,
.produkt-take-koupili-nazev,
.produkt-prislusenstvi-nazev {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.vypis-homepage-cena,
.produkt-doporucene-cena,
.produkt-take-koupili-cena,
.produkt-prislusenstvi-cena {
  display: block;
  text-align: center;
  font-weight: bold;
  color: #09b4ff;
}

.vypis-hledane-nadpis,
.vypis-pridane-nadpis {
  font-size: 1.25rem;
  margin-bottom: 4px;  
}

.vypis-pridanes {
  margin: 0px -12px;
  text-align: center;
}

.vypis-pridane {
  width: calc(50% - 24px);
  height: 178px;
  line-height: 114px;
  margin: 12px 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  background: #ffffff;
  box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.08);
  border-radius: 4px;
  color: #4D5658;
  text-decoration: none;
  padding: 32px 24px;
  box-sizing: border-box;
  white-space: nowrap;
}

@media (max-width: 700px) {
  .vypis-pridane {
    width: calc(100% - 24px);
  }
}

@media (max-width: 400px) {
  .vypis-pridane {
    padding: 32px 16px;
  }
}

.vypis-pridane-obrazek {
  padding: 0px 8px 0px 0px;
  display: inline-block;
  text-align: center;
  width: 108px;
  box-sizing: border-box;
}

.vypis-pridane-obrazek .obrazek {
  padding: 0;
  margin: 0;
  border: 0;
  max-width: 100px;
  max-height: 100px;
  vertical-align: middle;
}

.vypis-pridane-nazev-pridano {
  display: inline-block;
  padding: 0px 0px 0px 8px;
  text-align: left;
  line-height: normal;
  vertical-align: middle;
  width: calc(100% - 108px);
  box-sizing: border-box;
}

.vypis-pridane-nazev {
  display: inline-block;
  font-weight: bold;
  margin-bottom: 8px;
}

.vypis-pridane-pridano {
  white-space: normal;
}

.vypis-clanek:hover,
.vypis-pridane:hover,
.vypis-hledane:hover,
.vypis-kategorie:hover {
  opacity: 0.8;
}

#fulltext-list {
  display: block;
  list-style: none;
  position: absolute;
  margin: 0;
  padding: 0 10px;
  border: 1px solid #e2e2e4;
  outline: 0;
  text-align: left;
  background-color: white;
  min-width: calc(100% - 10px);
  z-index: 100;
  box-sizing: border-box;
  line-height: normal;
  font-size: 0.9em;
  white-space: nowrap;
  overflow: scroll;
  text-overflow: ellipsis;
  max-height: 300px;
}

@media (max-width: 800px) {
  #fulltext-list {
    min-width: calc(100% - 64px);
  }
}

#fulltext-list a {
  text-decoration: none;
  display: block;
}

#fulltext-list li {
  display: block;
  padding: 0;
  margin: 5px 0;
}

#fulltext-list li.fulltext-list-hledat span {
  font-weight: bold;
}

#fulltext-list li.fulltext-list-oddelovac {
  border: 1px solid #e2e2e4;
  margin: 5px 0;
}

#fulltext-list li.fulltext-list-kategorie {
  height: 22px;
  line-height: 22px;
}

#fulltext-list li.fulltext-list-produkt {
  height: 40px;
  line-height: 40px;
}

#fulltext-list li.fulltext-list-produkt .fulltext-list-obrazek {
  display: inline-block;
  width: 45px;
  height: 100%;
  text-align: center;
  background: white;
}

#fulltext-list li.fulltext-list-produkt img {
  max-width: 40px;
  max-height: 40px;
  padding: 0;
  margin: 0 5px 0 0;
  border: 0;
  vertical-align: middle;
}

#fulltext-list li.fulltext-list-hledat:hover,
#fulltext-list li.fulltext-list-produkt:hover {
  background-color: #e2e2e4;
}

#fulltext-list li.fulltext-list-produkt .fulltext-list-cena {
  display: none;
}

#hledani-vysledek {
  display: none;
}

#hledani-nenasli {
  margin-top: 20px;
  text-align: center;
}

.emailing-aktivni-stav {
  padding: 0px 0px 15px 0px;
  font-size: 18px;
  font-weight: bold;
}

.emailing-aktivni0 {
  color: green;
}

.emailing-aktivni1 {
  color: red;
}

/*********************************************************************************
 * Ostatni
 ********************************************************************************/

.clanek_nastroje {
  display: block;
  background: url('https://computermedia.sk/obrazky/strom_nastroje.png') no-repeat;
  width: 14px;
  height: 14px;
}
 
.prihlaseni0, .zverejni0 {
  padding-left: 20px;
  background: url('https://computermedia.sk/obrazky/zverejni1.png') no-repeat right;
  text-decoration: none;
}

.prihlaseni1, .zverejni1 {
  padding-left: 20px;
  background: url('https://computermedia.sk/obrazky/zverejni0.png') no-repeat right;
  text-decoration: none;
}

a.sdilet_facebook {
  padding: 5px;
  background: url('https://computermedia.sk/obrazky/sdilet_facebook.gif') no-repeat 0px 8px;
  text-decoration: none;
}

a.sdilet_twitter {
  padding: 5px;
  background: url('https://computermedia.sk/obrazky/sdilet_twitter.gif') no-repeat 0px 8px;
  text-decoration: none;
}

a.sdilet_facebook:hover, a.sdilet_twitter:hover {
  opacity: .8;
  filter: alpha(opacity=80);
}

/*********************************************************************************
 * Kalendar
 ********************************************************************************/

.kalendarDiv {
  text-align: center;
  margin: 10px 0px 10px 0px;
}

.kalendarAktualni,
.kalendarPredchozi,
.kalendarNasledujici {
  display: inline-block;
  height: 33px;
  line-height: 33px;
  padding: 0px 15px;
  background: #f8f8f8;
  border: 1px solid #d7d7d7;
  text-decoration: none;
  color: #222;
  font-weight: bold;
}

.kalendarPredchozi:hover,
.kalendarNasledujici:hover {
  background-color: #fff;
}

.kalendarPredchozi,
.kalendarNasledujici {
  background: #f8f8f8 url('https://computermedia.sk/obrazky/vzad.png') no-repeat center center;
  width: 33px;
  padding: 0px;
}

.kalendarNasledujici {
  background: #f8f8f8 url('https://computermedia.sk/obrazky/vpred.png') no-repeat center center;
}

.kalendarMesic {
  float: left;
  width: 30%;
  padding: 0% 0% 20px 3%;
}

.kalendarMesic .kalendarMesicNazev {
  font-weight: bold;
}

.clanek-vycentrovany {
  text-align: center;
}

.zobraz.plus {
  background: url('https://computermedia.sk/obrazky/plus.gif') no-repeat left center;
  display: inline-block;
  padding-left: 15px;
}

.zobraz.minus {
  background: url('https://computermedia.sk/obrazky/minus.gif') no-repeat left center;
  display: inline-block;
  padding-left: 15px;
}

/*********************************************************************************
 * Pomocne
 ********************************************************************************/

.sedy { color: gray; }
.maly { font-size: 14px; }
.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.skryte, .none { display: none; }
.block { display: block; }
.b { font-weight: bold; }
.i { font-style: italic; }
.paddT { padding-top: 10px; }
.paddB { padding-bottom: 10px; }
.paddL { padding-left: 10px; }
.paddR { padding-right: 10px; }
.margT { margin-top: 10px; }
.margB { margin-bottom: 10px; }
.margR { margin-right: 10px; }
.margL { margin-left: 10px; }
.tCenter { text-align: center; }
.tLeft { text-align: left; }
.tRight { text-align: right; }
.ui-datepicker { z-index: 9999 !important; }
.ui-dialog-titlebar > .ui-button { outline-width: 0px !important; }