/* CSS Document */

body, html  {margin: 0; padding: 0; font-family: 'Caveat', arial; font-size: 24px; color: #222;}
::-webkit-input-placeholder {color: pink;} /* Chrome/Opera/Safari */
::-moz-placeholder {color: pink;}  /* Firefox 19+ */
:-ms-input-placeholder {color: pink;}  /* IE 10+ */
:-moz-placeholder {color: pink;}  /* Firefox 18- */
::placeholder {color: #aba;}

.eshop-slide  {width: 100%; height: 200px; position: relative;}

h3    {font-family: Calibri; font-size: 1.2em; color: #666;}
h2    {font-family: Calibri; font-size: 1.0em; color: #666;}
.text1 {font-family: Calibri; font-size: .7em; color: #666; text-align: center;}

.title {width: 100%; padding: 0px 0 0px 0; background: #789E08;}
.title-text a {position: relative; left: 20px; font-size: 1.8em; color: #fff; max-width: 320px; text-decoration: none;}
.message-text  {position: absolute; top: 60px; right: 20px; border: solid 1px #808080; border-radius: 30px 0 30px 0; padding: 5px 20px; color: #fff; font-family: Calibri; font-size: .7em; background: #f00;}

.infopanel    {background-image: linear-gradient(to right, rgba(246,180,0,1), rgba(246,250,150,1), rgba(246,180,0,1)); font-family: Calibri; font-size: .6em; padding: 5px 3px 5px 3px; text-align: center;}
.hlavniinfo   {font-size: 1.5em; font-weight: bold;}
.infopanel a  {text-decoration: underline;; color: #000;}

.podmenu  {position: relative; font-family: Calibri; height: 70px; text-transform: uppercase; font-size: .7em; }
.button-predkat  {position: relative; font-family: Calibri; height: 70px; text-transform: uppercase; font-size: 1em; border: none; background: transparent; text-decoration: underline; cursor: pointer;}
.foto-kat {vertical-align: middle; width: 60px; border: solid 3px #789E08; border-radius: 0 30px 0 30px;}
.topvyrobky {font-family: Calibri; font-size: 1.2em; font-weight: bold; position: relative; left: 30px;}
.w100p  {width: 100%;}
.w25p   {position: relative; width: 24%; display: inline-block; vertical-align: top; border: solid 2px #789E08; min-height: 500px;}
.w75p   {position: relative; width: 70%; display: inline-block;}
.w1000  {position: relative; width: 1000px; margin: 0 auto;}
.w1400  {position: relative; width: 1400px; margin: 0 auto;}
.w250   {position: relative; width: 23.6%; height: 400px; margin: 0px; display: inline-block; border: solid 2px #eee; z-index: 10; transition: 0.5s; margin-bottom: 5px;}
.w250:hover   {border: solid 2px #789E08; box-shadow: 3px 3px 10px #808080;}
.w700   {position: relative; display: inline-block; width: 58%; vertical-align: top;}
.w300   {position: relative; display: inline-block; width: 39%; vertical-align: top;}
.center  {text-align: center;}

.nadpis1  {font-size: 1.2em; color: #666; font-weight: bold;}
.fotozbo  {position: relative; top: 0; left: 0; width: 100%; height: 200px; text-align: center; border: none; background: transparent;}
.fotozbo img  {height: 100%; max-width: 100%; vertical-align: middle; cursor: pointer;}
.nazevzbo {position: relative; height: 50px; font-family: Calibri; font-size: 0.8em; width: 100%; padding:  5px; font-weight: bold; cursor: pointer; border: none; text-align: left; background: transparent;}
.popiszbo {position: relative; height: 100px; font-family: Calibri; font-size: .6em;  padding: 5px; color: #666;}
.cenazbo  {position: relative; height: 25px; bottom: 0; left: 5px; width: 100%; height: 40px; text-align: left;}
.cenatext {font-family: Calibri; color: red; font-size: 1.1em;}
.divkosik {position: absolute; height: 25px; right: 0px; top: 0; display: inline-block;}
.orig     {font-family: Calibri; color: #444; font-size: .8em; vertical-align: top; padding-top: 8px; display: inline-block;}
.kosikzbo {text-align: right; border: none; background: transparent; cursor: pointer;}
.kszbozi  {width: 40px; text-align: center; vertical-align: top; margin-top: 10px;}

.dnazevzbo {position: relative; font-family: Calibri; font-size: 1em; width: 100%; font-weight: bold; background: transparent; padding-bottom: 20px;}
.dpopiszbo {position: relative; font-family: Calibri; font-size: .7em; color: #666; padding-bottom: 50px;}
.dcenazbo  {position: relative; bottom: 0; left: 0; font-family: Calibri; color: red; font-size: 1.2em; width: 100%; height: 40px; text-align: center; padding-bottom: 50px;}
.dkosikzbo {position: absolute; right: 0px; bottom: 0; display: inline-block; text-align: right; border: none; background: transparent; cursor: pointer;}
.zpet       {position: relative; padding-top: 80px; text-align: center; width: 100%;}
.button-zpet  {padding: 0px 20px; border: solid 2px #789E08; background: #D6F874; font-weight: bold; border-radius: 30px 0 30px 0; transition:.7s; font-family: Calibri; font-size: .7em; cursor: pointer;}
.button-zpet:hover  {border-radius: 0 30px 0 30px; background: #545E39; color: #fff;}
 /* košík v pravém horním rohu */
.min-kosik  {display: none;}
.kosik {position: absolute; right: 10px; top: 7px; background: #fff; padding: 5px 10px; border-radius: 30px 0 30px 0;}
.kosik-textzbozi  {font-family: Calibri; font-size: .7em; color: #aaa;}
.kosik-pocet  {padding: 0 10px 0 10px; font-size: .8em; font-family: Calibri; color: #000;}
.button-kosik { border: none; background: transparent; vertical-align: top; cursor: pointer;}

.aktual       {font-family: Calibri; font-size: .7em; color: #666; padding: 5px;}
.akt-box      {width: 100%; min-height: 100px; margin-bottom: 5px; position: relative; border: solid 1px #808080; cursor: pointer; background-image: linear-gradient(to right, rgba(230,230,230,1), rgba(250,250,250,1));}
.akt-img-box  {width: 30%; display: inline-block; height: 100px; position: relative; padding: 2px 0 0 2px;}
.akt-img      {height: 100%; max-width: 100%;}
.akt-text     {width: 65%; max-height: 100%; min-height: 100px; display: inline-block; vertical-align: top; position: relative;}
.akt-nazev    {font-size: .9em; font-weight: bold; color: #666; padding-top: 15px;}
.akt-cena     {position: absolute; height: 20px; width: 100%; bottom: 15px; font-size: 1.4em; color: #789E08;}
.aktual li    {font-size: .8em; color: #666;}
.akt-li       {list-style-type: none;}
.kontakty     {font-size: 1.4em; position: relative; top: 5px;}

.zmail        {width: 100%; border: solid 1px #777; border-bottom: solid 2px #f6b400; margin-bottom: 5px;}
.ztext        {max-width: 100%; min-width: 100%; border: solid 1px #777; border-bottom: solid 2px #f6b400; margin-bottom: 5px;}
.zsubmit      {width: 50%; text-align: center; border: solid 2px #f6b400; cursor: pointer;}
.ztelefon      {width: 100%; border: solid 1px #777; border-bottom: solid 2px #f6b400;}
.div-ztelefon {font-size: .9em; margin: 10px 0 10px 0;}
textarea::placeholder {color: #aaa; font-family: Calibri;} 
.infogdpr      {font-size: .7em;} 
#errorkont    {display: none; font-size: .9em; font-family: Calibri; color: #f00;}

.obch-podm    {font-family: Calibri; font-size: .7em; position: relative; padding: 20px;}
ol            {list-style-type: decimal;}

/* pager */
.cycle-pager { 
    text-align: center; width: 100%; z-index: 250; position: absolute; top: 100%; overflow: hidden;
    
}
.cycle-pager span { 
    font-family: arial; font-size: 85px; width: 25px; height: 65px; 
    display: inline-block; color: #ddd; cursor: pointer;
}
.cycle-pager span.cycle-pager-active { color: #789E08;}
.cycle-pager > * {cursor: pointer;}



/* ---------------------------------- MENU ---------------------------------- */
.menu   {
  position: absolute;
  top: 10px;
  right: 250px;
  font-family: Calibri;
  font-size: .7em;
}

.menu button {
  color: #ddd;
  text-decoration: none;
  padding-left: 20px;
  cursor: pointer;
  
}

.menu-button {
    background: #fff;
    border: 0;
    color: #000;
    font-size: 30px;
    cursor: pointer;
    display: none;                                                
    position: absolute;                                             
    top: 1px;
    right: 1px;
    
}

.menu-button:hover, .menu-button:focus {
    background: #ddd;    
}

.item-menu  {
  border: none;
  background: transparent;
  display: inline-block;
}

/*------------------------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 1400px)  {
  .menu-button  {
    display: block;
  }
  
      .menu {
      display: block;
      position: fixed;
      right: 20px;
      top: 110px;
      width: 0px;
      height: 150px;
      padding-top: 20px;
      overflow: hidden;
      transition: width .5s;
      box-shadow: 0px 0px 5px #808080;
      z-index: 2000;
      
    }
    
    .menu button {
      color: #444;
      line-height: 25px;
      font-weight: bold;
    }
        
    .item-menu  {
      display: block;
    }
    
    .zobrazit .menu {
      width: 200px;
      background: #fff;
    }
    
    .kosik    {display: none;}
    .min-kosik  {display: block; position: fixed; top: 250px; right: 0; z-index: 1200; width: 60px; height: 120px; background: #789E08; border-radius: 30px 0 0 30px;}
    .min-button-kosik {display: block; position: relative; left: 3px; border: solid 1px #fff; border-radius: 50%; width: 50px; height: 50px; left: 5px; top: 15px; cursor: pointer;}
    .min-pocet  {display: block; position: relative; top: 5px; color: #fff; text-align: center; font-family: Calibri; font-size: .9em;}

    .eshpo-slide  {width: 100%; height: auto;}
    
    .title  {}
    .w250  {width: 48%;}
    .w1000  {width: 100%;}
    .w1400  {width: 100%;}
    .w700   {width: 100%;}
    .w300   {width: 100%;}
    .message-text {top: 110px;}
    .kosik-ntext1, .kosik-ntext2, .kosik-ntext3, .kosik-text1, .kosik-text2, .kosik-text3 {
      width: 97%; padding: 0 5px 0 5px;
    }
    .kosik-textcenazbozi  {width: 59%;} 
    .kosik-cenazbozi  {width: 39%;}

}

@media only screen and (max-width: 640px)  {
    
    .eshop-slide  {display: none;}
    .title-text {left: 0px;}
    .w250  {width: 95%; padding: 0px; margin: 5px;}
    .w1000  {width: 100%;}
    .w1400  {width: 100%; height: auto;}
    .w250:hover   {border: solid 2px #789E08; box-shadow: none;}
    .podmenu {padding-left: 10px; font-size: .5em; height: auto;}
    .foto-kat {width: 32px; border-radius: 15px 0 15px 0;}
    .eshpo-slide  {width: 100%; height: auto;}
    .w25p {display: none;}
    .w75p {width: 100%;}
    

}