/* obecné */

table {margin-left: auto; margin-right: auto; border-collapse: collapse; border: 1px solid black;}
table th, table td {border: 1px solid black; padding: 0.2em;}
.lichy {background-color: #EEF;}
.sudy {background-color: #FFF;}


/* databáze */

#filtr {margin-bottom: 1em;}

/* prehled */

#prehled img {border-width: 0;}
#prehled table {border-width: 0;}
#prehled table td {border-width: 0; padding: 0px; text-align: center;}
#lupa {padding-left: 0px;}  
#prehled #druha-rada td {padding-top: 20px;}
#prehled .stredni-bunka {padding-right: 90px;padding-left: 90px;}

/* podrobné informace */

#podrobne-informace #zpet {margin-top: 1em; float: right;}
#podrobne-informace #seznam-odkaz {width: 8em; float: right; text-align: right;}
#podrobne-informace h2 {margin-top: 0.5em; margin-bottom: 0.5em;}
#podrobne-informace h3 {margin-top: 0.5em; margin-bottom: 0.5em;}
#podrobne-informace #kod, #podrobne-informace #typ , #podrobne-informace #cena  {font-weight: bold;}
#cena_th {width: 100px;}
#podrobne-informace table {margin: 0; width: 100%; border-width: 0;}
#podrobne-informace table td {border-width: 0;}
#podrobne-informace .obsahuje_kod {white-space: nowrap;}
#podrobne-informace .pribuzne_kod {white-space: nowrap;}
#podrobne-informace .pribuzne_cena {text-align: right;}
#podrobne-informace img, table {max-width: calc(100% - 1em);}

.GAgrid {display: grid; grid-column-gap: 5em;  margin-top: 3em;
    grid-template-areas:
    'ilustracea ilustraceb'
    'popiseka popisekb'
    'ilustracec ilustraced'
    'popisekc popisekd'
    'ilustracee ilustracef'
    'popiseke popisekf';
    }
    
.GAgrid p {padding-top: 0; margin-top: 1em; text-align: justify; margin-bottom: 5em;}

.GApopisek5 p, .GApopisek6 p {margin-bottom: 3em;}


.video-wrapper { max-width: 400px;}
.video-wrapper iframe { display:block; width:100%; height:auto; aspect-ratio:16/9; border:0; }

.GAilustrace1 {
    grid-area: ilustracea;
}

.GAilustrace2 {
    grid-area: ilustraceb;
}

.GAilustrace3 {
    grid-area: ilustracec;
}

.GAilustrace4 {
    grid-area: ilustraced;
}

.GAilustrace5 {
    grid-area: ilustracee;
}

.GAilustrace6 {
    grid-area: ilustracef;
}

.GApopisek1 {
    grid-area: popiseka;
}

.GApopisek2 {
    grid-area: popisekb;
}

.GApopisek3 {
    grid-area: popisekc;
}

.GApopisek4 {
    grid-area: popisekd;
}

.GApopisek5 {
    grid-area: popiseke;
}

.GApopisek6 {
    grid-area: popisekf;    
}





@media screen and (max-width: 499px) {
    .GAgrid {grid-template-areas:
    'ilustracea'
    'popiseka'
    'ilustraceb'
    'popisekb'
    'ilustracec'
    'popisekc'
    'ilustraced'
    'popisekd'
    'ilustracee'
    'popiseke'
    'ilustracef'
    'popisekf';
    }
}   






/* zobrazení tabulek u qclicku */
.qclick-produkt {width: auto !important; border: 1px solid black !important; border-collapse: collapse !important;}
.qclick-produkt td {border: 1px solid black !important; text-align: right !important;}


/* rozhraní */
#rozhrani img {height: 200px;}
#rozhrani .levy {width: 400px; float: left; margin-bottom: 2em;}
#rozhrani .pravy {width: 400px; float: right;}
#rozhrani #druha-rada {clear: both;}
#rozhrani a img {border-width: 0;}
#rozhrani #prvni-rada p, #rozhrani #druha-rada p, #rozhrani #prvni-rada h3, #rozhrani #druha-rada h3, #rozhrani h2 {text-align: center;}
#rozhrani #text {clear: both;}
#rozhrani #cara {width: 30%; margin-bottom: 2em;}

.comp-header, .comp-header th {
              border-bottom: 0px solid black;
             }
             
    

/* balíčky */

#balicky th, #balicky td {text-align: center; padding: 0.4em;}
#balicky #pro-celou-skolu {font-size: 130%;}
#balicky #nadpis {font-size: 130%;}

#balicky .balicky-popis {font-size: 90%}

#balicky .obrazekBalicku {max-width: 400px; float: right; margin-top: 3em; margin-left: 2em;}

#balicky img {max-width: calc(100% - 1em);}

@media only screen and (max-width: 999px) {
#tabs li {qclear: both; width: calc(100% - 1em);}   
#tabs li a {width: calc(100% - 1em); margin: 0; padding-right: 0;}
}


/* jak si vybrat */

#jak-si-vybrat #konfigurator-nahled {width: 210px; float: right; margin-left: 1em; text-align: center;}
#jak-si-vybrat #konfigurator-nahled img {cursor: pointer; border-style: double; border-width: 5px;}


/* ise */

#ise td, #ise th {border: 0px solid black; text-align: center; padding: 5px; border: 1px solid #CCC;}
#ise {border-collapse: collapse; border: 1px solid #CCC; margin: 0;}

/* senzory */

#senzory #seznam-senzoru div {width: 250px; float: left; border: 0px solid black;}
#senzory #prostredni-sloupec {margin-right: 100px; margin-left: 100px; }
#senzory #seznam-senzoru p {line-height: 1.1em; margin: 0.4em;}

#senzory   td {border: 1px solid black;}
#senzory   table {border-collapse: collapse; width:960px; margin-left: auto; margin-right: auto; border: 0px solid black;}
#senzory   td, th {text-align: center; padding: 5px;}
#senzory   .group {text-align: left; background-color: rgb(230,230,217); color: #07356e; font-weight: bold;}
#senzory   .sensor_in_group {padding-left: 30px;}
#senzory   .sensor_name {text-align: left; width: 70px;}
#senzory   .blank2, .blank {background-color: white; color: red; border: 0px solid black;}
#senzory   .incompatible {font-size: 100%;}
#senzory   .column_names {background-color: rgb(230,230,217); color: #07356e; font-weight: bold; font-size: 100%;}
#senzory   th {font-size: 85%;}
#senzory   th a {padding-bottom: 10px;}
#senzory   .mensi1 {font-size: 80%;}
#senzory   .mensi2 {font-size: 85%;}
#senzory img {max-width: 90px; max-height: 90px;}
#senzory .obrazky-senzoru th {border-bottom: 0px solid black; width: 80px;}
#senzory .nazvy-senzoru th {border-top: 0px solid black; width: 80px;}
#senzory .blank, #senzory .blank2 {border-top: 0px solid black; border-left: 0px solid black;}
#senzory a {text-decoration: none;}
#senzory a:hover {text-decoration: underline;}
#senzory .kod-produktu                  {color: #222; text-align: right; font-size: 60%; width: 178px; line-height: 0; margin: 0; margin-bottom: 4px; margin-top: 6px; margin-right: 0px;}
#senzory .sensor_in_group .kod-produktu {width: 153px;}
#senzory .zvyraznit {background-color:  #EEE;}
                    
                    

                       
/* gowireless */
                     
.gowireless-prod {text-align: center; width: 300px; float: left; border: 0px solid black; margin-bottom: 2em;}
.gowireless-prod img {max-width: 290px;}
.clr {clear: both;}


/* wireless */


/* .wireless-prod {text-align: center; width: 230px; border: 1px solid #DDD;} */
.wireless-prod {text-align: center; width: 95%; border: 1px solid #DDD; margin-right: auto; margin-left: auto;}
.wireless-prod img {max-width: 150px; max-height: 150px; padding: 5px; padding-top: 0;}

.wireless-prod p {padding-left: 10px; padding-right: 10px;}


.wireless-produkty {display: grid; grid-row-gap: 10px; justify-items: center;}






@media screen and (max-width: 499px) {
  .wireless-produkty {
      grid-template-columns: 100%;
  }
  
  
}   


@media screen and (min-width: 500px) {
  .wireless-produkty {
      grid-template-columns: 50% 50%;
      /* width: 480px;*/
      margin-left: auto; margin-right: auto;
  }
    
}   


@media screen and (min-width: 750px) {
  
  .wireless-produkty {
      grid-template-columns: 33% 33% 33%;
      /* width: 720px; */
      margin-left: auto; margin-right: auto;
  }
  
    
   
}       

 

@media screen and (min-width: 980px) {
  
  .wireless-produkty {
      grid-template-columns: 25% 25% 25% 25%;
      /* width: 960px; */
  }
  

}  
     
     
     

     
     
.wireless-prod  {
transition: 0.2s;
display: none;
}


.wireless-prod:hover  {
border: 1px solid #888;

}


.wirelesszvyraznit {font-weight: bold; font-size: 120%;}


.wireless-prod-note {font-size: 90%; color: #444;}


/* konfigurátor */

.konf-obdelnik {
    border: 1px solid #AAA;
    margin-top: 3em;
    padding-left: 0.5em;
}

.konf-nazev {
    background-color: white;
    padding: 2px;
    font-size: 110%;
    position: relative; top: -1.9em; 
    padding-left: 10px;
    padding-right: 10px;
    margin-right: 0.5em;
    display: inline-block;
    padding-bottom: 0; margin-bottom: 0;

}

.konf-vnitrek {
    margin-top: -1.5em;
    
}