@media (orientation: landscape) and (max-device-width: 1200px) {}

@media (max-device-width : 1220px) {
  .container {
    width:100%;
  }
  a#logo {
    margin: 4vw 0 0 2vw;
    display: block;
    width: 20vw;
    height: 5vw;
    float: left;
  }
  a#logo img {
    height: 100%;
    width: auto;
  }
  #name {
    width: auto;
    font-size: 6vw;
    margin-top: 3vw;
    margin-left: 7vw;
  }
  #name div {
    font-size: 2.37vw;
  }
  #banner {
    margin: 3vw 3vw 0 0;
  }
  #banner a img {
    width: 22vw;
  }
  #header {
    height: 16vw;
  }
  #topmenu {
    margin-bottom:0.5vw;
  }
  #main_left {
    width: 65vw;
    margin-right: 2vw;
  }
  #main_right {
    width: 33vw;
  }
  #main_right .banner img {
    width:100%;
    max-width:460px;
  }
  #main_left h1 {
    margin-left: 4vw;
  }
  .ukazka {
    padding: 0 4vw 2vw 4vw;
  }
  .ukazka img {
    margin-right: 2vw;
  }
  .ukazka .texty {
    width: calc(100% - 8vw - 200px);
  }
  #main_left table.akce, #main_left table.rozhovor, #main_left table.tema {
    padding: 3vw 4vw;
    margin-bottom: 2vw;
  }
  #main_left .kdy {
    width: 13vw;
    padding-right: 2vw;
  }
  #main_left .co {
    width:auto;
    padding-right:2vw;
  }
  #main_left .kde {
    width: 10vw;
  }
  #mapa-ovladani {
    margin: 2vw 0 0 13.5vw;
  }
  #mapa {
    margin:0 1vw;
  }
  #mapa img {
    width:100%;
  }
  #main_right .tema {
    padding: 3vw 4vw;
    margin-bottom: 2vw;
    width: 100%;
  }
  #main_right a, #main_right a:visited {
    width: 100%;
  }
  #main_right .tema .nazev {
    width: calc(100% - 2vw);
    padding: 0 0 0 2vw;
  }
  #main_right h2 {
    padding-left: calc(50px + 4vw);
  }
  .single #main_right h2 {
    padding-left:4vw;
  }
  .single-slavnost #main_left .kdy,
  .single-slavnost #main_left .kde {
    width:50%;
  }
  .single-slavnost #main_left .kdy {
    padding-right:0;
    font-size:20px;
  }
  article {
    padding:3vw 4vw;
  }
  #footer .container {
    padding: 0 4vw;
  }
}

/** ----------------------------------------- SCREEN SIZE: tablets landscape / very old desktop --------------------*/
@media (max-device-width : 1023px) {
  #main_left {
    width: 100vw;
    margin-right: 0;
  }
  #main_left a, #main_left a:visited,
  #main_left a table, #main_left a:visited table {
    width: 100%;
  }
  #main_left #mapa-ovladani a.vse {
    width:auto;
  }
  #main_right {
    margin-top:0;
    width: 100vw;
  }
  #main_right .partneri h2 {
    padding-left:4vw;
    margin:2vw 0;
  }
  #main_right .temata {
    margin-bottom: 1.5em;
  }
  .dalsi_akce {
    padding: 3vw 4vw;
    margin-bottom: 2vw;
  }
  #main_right a.all_links, #main_right a.all_links:visited {
    padding-left:4vw;
  }
  .category #mapa-ovladani {
    margin: 2vw 2vw 0 0;
  }
  .single .parametry_slavnosti {
    padding: 1vw 2vw;
    margin-bottom: 2vw;
  }
  .partneri img {
    padding-left:4vw;
  }
  #footer{
    margin-top: 1em;
  }
}

@media (max-device-width : 810px) {
  #main_left .kdy {
    width: 110px;
  }
  #topmenu {
    text-align:left;
  }
  #topmenu li {
    display:none;
  }
  #topmenu li.icon {
    display: inline-block;
    padding:0 2vw;
  }
  #topmenu li.icon img {
    padding: 1.4vw 0 0 0;
    width: 4vw;
  }
  #topmenu a, #topmenu a:visited {
    line-height:2em;
  }
  #topmenu.responsive {
    position: relative;
    padding-bottom: 1vw;
    margin-bottom:0;
  }
  #topmenu.responsive li {
    float: none;
    display: inline;
  }
  #topmenu.responsive li a {
    display: block;
    padding: 1vw 1vw 0 3vw;
    font-size: 1.2em;
    line-height: 1em;
  }
  #topmenu.responsive li.icon {
    display:none;
  }
  .ukazka h2 {
    font-size: 24px;
  }
  #mapa-ovladani {
    margin: 2vw 0 0 0;
    margin-left:calc(110px + 2vw);
  }
  .parametry_slavnosti .kdy, .parametry_slavnosti .kde {
    font-size: 20px;
  }
  #footer .container {
    height:auto;
    padding:3vw 4vw;
  }
  #footer .container div {
    float:none;
    display:block;
    clear:both;
  }
  #footer, #footer a, #footer a:visited {
    line-height: 35px;
  }
  #footer, #wrapper::after {
    height:auto;
  }
}

/* ----------------------------------------- SCREEN SIZE: phone landscape / tablets portrait --------------------*/
@media (max-device-width : 680px) {

}

@media (max-device-width : 560px) {
  a#logo {
    margin: 5vw 0 0 18vw;
    width: 39vw;
    height: 10vw;
  }
  #name {
    font-size: 10vw;
    margin: 3vw 3vw 3vw 18vw;
  }
  #banner {
    margin: 2vw 27vw 0 0;
  }
  #banner a img {
    width: 55vw;
  }
  #topmenu li.icon {
    padding: 0 4vw;
  }
  #topmenu li.icon img {
    padding: 2vw 0 0 0;
    width: 6vw;
  }
  #main_left h1 {
    margin-left: 4vw;
  }
  #main_left a h2 {
    line-height:1.3em;
  }
  .ukazka {
    padding: 0px 0 2vw 4vw;
  }
  .ukazka .texty {
    float:none;
    width:92vw;
    clear: both;
    padding: 4vw 0;
  }
  .ukazka a.cti_vse, .ukazka a.cti_vse:visited {
    margin-bottom: 2vw;
  }
  #main_left table.akce, #main_left table.rozhovor, #main_left table.tema {
    padding: 3vw 4vw;
    margin-bottom: 4vw;
  }
  #mapa-ovladani {
    margin: 2vw 0 0 0vw;
  }
  #main_left table,
  #main_left table tbody,
  #main_left table tr,
  #main_left table td {
    display:block;
  }
  #main_left .kdy,
  #main_left .co,
  #main_left .kde {
    width:100%;
  }
  #footer a.mail {
    float: none;
    margin-left: 0;
    display: block;
  }
}

@media (max-device-width : 450px) {
  #main_right a img {
    width:100vw;
    height:auto;
  }
}

/** ----------------------------------------- SCREEN SIZE: phone portrait --------------------*/
@media (max-device-width : 380px) {
  a#logo {
    margin: 5vw 0 0 8vw;
    width: 55vw;
    height: 13.5vw;
  }
  #name {
    font-size: 13vw;
    margin: 3vw 3vw 3vw 8vw;
  }
  #banner {
    margin: 2vw 26vw 0 0;
  }
  #banner a img {
    width: 67vw;
  }
  #topmenu li.icon img {
    width: 8vw;
  }
  #mapa-ovladani .prepinani {
    margin-left:2vw;
  }
  .single #main_left h1 {
    font-size: 24px;
  }
  #footer .container {
    padding: 1em 1em;
  }
  #footer a.fb {
    margin-left:0px;
    display:block;
    clear:both;
  }
  #footer .container div span {
    margin-left: 0px;
  }
}