/* #Media Queries */

@media (max-width: 1450px){
  
  
}


@media (max-width: 1300px){
  
  .mainFrame {width: 100%; padding: 0 40px;}
}


@media (max-width: 1000px){   
  

}


@media (max-width: 900px) {

}


@media (max-width: 800px) {

  #header .inner .menu {display: none;}

  .burger {position: relative; width: 40px; height: 30px; margin: 0 40px 0 auto; cursor: pointer; z-index: 1100; display: flex; flex-direction: column; justify-content: space-between;}
  .burger span {height: 5px; width: 100%; background: #999999; border-radius: 2px; transition: 0.3s ease; transform-origin: center;}

  /* Burger jako křížek */
  .burger.active span:nth-child(1) {transform: rotate(45deg) translate(5px, 5px);}
  .burger.active span:nth-child(2) {opacity: 0;}
  .burger.active span:nth-child(3) {transform: rotate(-45deg) translate(6px, -6px);}

  #header {position: relative;}
  #header .inner .menu {position: absolute; right: 0; top: 100%; width: auto; height: auto; margin: 0 30px 0 0; background-color: #333333; z-index: 999; color: #ffffff;}
  #header .inner .menu ul {display: block; flex-direction: column; padding: 20px;}
  #header .inner .menu ul li {margin: 10px 0;}
  #header .inner .menu ul li a {}
  #header .inner .menu ul li a:hover {color: #ffffff;}


  #bannerPhoto .text h2 {font-size: 32px;}
  #bannerPhoto .text p {font-size: 24px;}


  #catList .inner {gap: 10px;}
  #catList .inner .item {max-width: unset; width: calc(50% - 5px);}


  #homeText .inner ul {width: 100%; margin: 0;}


  #bannerKava .text h2 {font-size: 24px;}
  #bannerKava .text p {font-size: 16px;}


  #fotogalerie .inner {padding: 0 20px;}
  #photogallery .item {width: calc(100% / 5);}
}


@media (max-width: 700px) {

}


@media (max-width: 600px) {  

  #homeText .inner ul li {width: 100%;}
}

@media (max-width: 500px) {
  #header .inner {flex-wrap: wrap;}
  #header .inner .logo {order: 1; width: 100%; text-align: center;}
  #header .inner .burger {order: 3; margin: 0 0 0 auto;}
  #header .inner .fb {order: 2;}

  #photogallery .item {width: calc(50% - 5px);}
}

@media (max-width: 500px) {
  #bannerKava .text p {display: none;}
}