
/* basic responsive  */

@media only screen and (max-width: 1024px) {

  html { -webkit-text-size-adjust: none }
  img { max-width: 100%; height: auto; /*width: auto\9;*/ /* ie8 */ }
  input, textarea, select { box-sizing: border-box }
  input[type="submit"] { width: auto; -webkit-appearance: none }
  #content iframe, #content object, #content embed { max-width: 100% }

  body { font-size: 100% }

  /* header */

  #header { height: 60px }
  #logo { width: 70px; height: 30px; top: 0; margin: 0;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
   }

   .header-langs {
    margin-left: auto;
   }

  .header-top-wrapper { display: none }
  .header-wrapper { height: 100% }

  #header nav { position: absolute; left: 0; top: 61px; width: 100%; background-color: #fff; box-shadow: 0 20px 20px rgba(0,0,0,.1) }
  .header-menu { display: none; flex: none }
  .header-menu > li { display: block; height: auto; border: 1px solid #eee; border-width: 0 0 1px }
  .header-menu li:first-child { display: block }
  .header-menu li a { font-size: 120%; font-weight: bold; line-height: 1.4; letter-spacing: normal; padding: 8px 44px 9px 22px; flex: none; display: block; height: auto }
  .header-menu .menu-item-has-children:hover ul { display: none }
  .header-menu li.menu-item-has-children > a:after { content: '+'; position: absolute; top: 0; right: 32px; font-size: 140%; padding: 0 !important }
  .header-menu li.menu-item-has-children > a.active:after { content: "-" }
  .header-menu ul { position: static; min-width: 0; border-radius: 0; box-shadow: none }
  .header-menu ul a { display: block; padding: 8px 22px 9px }
  .header-menu ul li:last-child a { border-radius: 0 }

  .hamburger { align-self: center; margin-left: 22px; display: block; color: #101e8e; z-index: 110; cursor: pointer; border: 0; font-size: 260%; width: 30px !important; height: 35px; background: none; overflow: hidden; position: relative }
  .hamburger span { position: absolute; right: 0; height: 5px; width: 30px; background-color: #101e8e; -webkit-transition: all .3s; transition: all .3s }
  .hamburger span:nth-child(1) { top: 5px }
  .hamburger span:nth-child(2) { top: 15px }
  .hamburger span:nth-child(3) { top: 25px }

  #header.responsive .hamburger span:nth-child(1) { -webkit-transform: rotate(135deg); top: 45%; transform: rotate(135deg); top: 45% }
  #header.responsive .hamburger span:nth-child(2) { opacity: 0 }
  #header.responsive .hamburger span:nth-child(3) { -webkit-transform: rotate(-135deg); top: 45%; transform: rotate(-135deg); top: 45% }

  #header.fixed { position: absolute; box-shadow: none }

  /* other */

  .page-child #layout-wrapper,
  .tax-tax_reference #layout-wrapper,
  .single-_kariera #layout-wrapper
  {
   flex-wrap: wrap
  }

  #content { flex-basis: 100%; margin: 44px 0; order: 0 }
  #sidebar { flex-basis: 100%; margin: 44px 22px }

  .page-header .content-wrapper { min-height: 0; padding-top: 80px; padding-bottom: 25px }
  .home .page-header .content-wrapper { min-height: 0 }
  .page-header .summary { padding-top: 140px; padding-bottom: 80px }

  .home-rozcestnik .content-wrapper { display: flex; flex-flow: row wrap; justify-content: space-between }
  .home-rozcestnik .content-wrapper > div { flex-basis: 100% }

  .r-skupiny { margin: 44px 0 }
  .r-skupiny article { padding-right: 0 }

  .page-skupiny article { flex-basis: 100% }
  .page-skupiny article:nth-child(2) { margin-top: 66px }

  .page-kontakt article { max-width: none }
  .page-kontakt article:nth-child(n + 2) { margin-top: 66px }

  .footer-wrapper > div { color: #fff; margin-right: auto; flex-basis: 100% }
  .footer-menu { margin: .8em 0 0 }
  .footer-menu li { margin: 10px 20px 0 0 }

}

@media only screen and (max-width: 768px){

  .page-header .summary { flex-basis: 100%; text-align: center }
  .page-header figure { flex-basis: 100% }
  .page-header figure img { position: relative; right: -20px }

  .cpt-reference > a,
  .home .cpt-reference > a
   {
      flex-basis: calc(100% * (1/2) - 22px)
   }

  .cpt-kariera > a { flex-basis: calc(100% * (1/2) - 22px); max-width: calc(100% * (1/2) - 22px) }
  .cpt-kariera > a:nth-child(n + 3) { margin-top: 22px }

}

@media only screen and (max-width: 667px){
}

@media only screen and (max-width: 568px){

  .page-header figure { display: none }

  .home-sluzby h2 { margin: 0 auto 1em; flex-basis: 100%; text-align: center }
  .home-sluzby-wrapper { flex-basis: 100%; max-width: 100% }

  .cpt-reference > a,
  .home .cpt-reference > a
   {
      flex-basis: calc(100% - 22px);
      min-height: 0
   }
   .cpt-reference h3 { margin-top: 2em }

}

@media only screen and (max-width: 414px){

  .content-wrapper--padding { padding-top: 60px; padding-bottom: 60px }

  h1 { font-size: 210% }
  h2 { font-size: 190% }

  .home .page-header h1 { font-size: 230% }

  .cpt-reference > a,
  .home .cpt-reference > a
   {
      min-height: calc(100vw - 44px)
   }

  .cpt-kariera > a { flex-basis: calc(100% - 22px); max-width: calc(100% - 22px) }
  .cpt-kariera > a:nth-child(n + 2) { margin-top: 22px }

  .r-skupiny article { padding-left:  50px }
  .r-skupiny .skupina-vs { background-size: 40px }
  .r-skupiny .skupina-ss { background-size: 40px }

  div.wpcf7 label { flex-basis: 100% }

  .gallery-item { flex-basis: calc(100% * (1/3)) }

}

@media only screen and (max-width: 320px){

  .gallery-item { flex-basis: calc(100% * (1/2)) }

  blockquote { font-size: 110% }

}

