
@media only screen
and (max-width: 1400px)
{
  .mainFrame {width: 100%; padding: 0 10px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
}


@media only screen
and (max-width: 1000px) {
  #banner {padding: 0 10px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
}


@media only screen
and (max-width: 800px)
{
  .burger {position: relative; width: 30px; height: 24px; padding: 6px; margin: 0 0 0 20px; flex: 0 0 30px; background: #d37e19; border-radius: 5px; cursor: pointer; z-index: 1100; display: flex; flex-direction: column; justify-content: space-between;}
  .burger span {height: 4px; width: 100%; background: #f1d5a6; 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);}

  #menu {position: relative;}
  #menu .inner {min-height: unset;}
  #menu .inner ul {display: none; flex-direction: column; width: auto; position: absolute; right: 10px; top: 100%; z-index: 9999; background-color: #f7941e;}
  #menu .inner ul li {margin: 0; border-bottom: 1px solid #d37e19;}
  #menu .inner ul li a {width: 100%; padding: 10px 20px; font-size: 16px;}
  #menu .inner ul li a:hover {background-color: transparent;}
}


@media only screen
and (max-width: 600px)
{
  #news .item {width: calc(50% - 10px);}
  #news .item:nth-child(2n) {margin-right: 0;}
}


@media only screen
and (max-width: 450px)
{
  #news .item {width: 100%; margin: 10px 0;}
}