
@media only screen
and (max-width: 1310px)
{
  #homeText {width: 100%;}
}


@media only screen
and (max-width: 1200px)
{
  
}


@media only screen
and (max-width: 1000px)
{
  #menu {margin: 0; padding: 20px 30px; justify-content: space-between;}
  #menu .home {margin-left: auto; margin-right: 20px;}
  #menu .home img {height: 35px;}
  #menu ul {display: none; position: absolute; top: 100%; left: 0; width: 100%; margin: 0; background-color: rgba(160, 39, 53, 0.4);}

  .burger {position: relative; width: 30px; height: 24px; cursor: pointer; z-index: 1100; display: flex; flex-direction: column; justify-content: space-between;}
  .burger span {height: 4px; width: 100%; background: #ffffff; 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);}

  #homeTitle h1 {font-size: 50px;}
  #homeTitle h2 {font-size: 32px;}

  #contender .item {width: calc(33.333333% - (34px * 2 / 3));}
  #contender .item .name {font-size: 23px;}

  #footer {flex-wrap: wrap; padding: 50px 50px;}
  #footer .texts {order: 1; width: 100%; margin-bottom: 50px;}
  #footer .logo {order: 2;}

  #footer .texts .copyRight {display: none;}
  #footer .copyRightMobile {display: block; order: 3; width: 100%; margin-top: 50px; text-align: center;}
}


@media only screen
and (max-width: 900px)
{
  #homeTitle {width: 100%;}
}


@media only screen
and (max-width: 850px)
{
  body {background-image: url("/images/bg-pro-home-mobil1.jpg"); background-size: 100% auto;}
  body.subpage {background-image: url("/images/bg-pro-home-mobil1.jpg");}
}


@media only screen
and (max-width: 800px)
{
  #contender .item {width: calc(50% - (34px * 1 / 2));}
  #contender .item .name {font-size: 21px;}
}


@media only screen
and (max-width: 700px)
{
  .webform .checkboxCont .inner .text p.radioCont span {width: 100%; margin: 5px 0;}

  #homeTitle {margin: 450px auto 0 auto;}
  #homeTitle h1 {font-size: 40px;}
  #homeTitle h2 {font-size: 24px;}
}


@media only screen
and (max-width: 550px)
{
  #homeTitle {margin: 350px auto 0 auto;}
  #homeTitle h1 {font-size: 32px;}
  #homeTitle h2 {font-size: 20px;}

  .tinymceCont h1::after {width: 80%; left: 10%;}
}


@media only screen
and (max-width: 500px)
{
  #homeTitle {margin: 300px auto 0 auto;}
  #homeTitle h1 {font-size: 30px;}
  #homeTitle h2 {font-size: 19px;}

  #homeText {padding: 30px 30px; font-size: 18px;}

  #pageContent {padding: 30px 30px;}
  .tinymceCont h1 {font-size: 30px;}
  .tinymceCont p {font-size: 18px;}


  #contender .item {width: 100%;}
  #contender .item .name {font-size: 20px;}

  #footer {flex-wrap: wrap; padding: 50px 10px;}
}


@media only screen
and (max-width: 400px)
{
  #homeTitle {margin: 250px auto 0 auto;}
  #homeTitle h1 {font-size: 28px;}
  #homeTitle h2 {font-size: 18px;}
}