/* 

// Created :: 2025-08-03
// Updated :: 2025-08-03

// 2025-08-23 :: 

*/

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

  /* INBOX */

  .container_standard { max-width: 90%; margin: 0px auto; padding: 100px 0px 105px 0px; }
  #header_zahlavi_sub { padding-left: 20px; padding-right: 20px; }

  /* RESET */

  #layout_footer_space { display: none; }

  /* LAYOUT :: HP :: ABOUT US */

  .aboutus_wrap { flex-direction: column; gap: 40px; }
  .aboutus_left { width: 100%; }
  .aboutus_left img { width: 100%; height: auto; max-height: none; object-fit: cover; border-radius: 8px; display: block; }
  .aboutus_right { padding-top: 0; text-align: center; }

  .aboutus_right p { margin-bottom: 60px; }
  .aboutus_right { padding-top: 0; text-align: center;  }
  .aboutus_stats { display: flex; flex-direction: column; align-items: center; gap: 20px; }
  .aboutus_stats .stat_box { text-align: center; width: 100%; }

  /* LAYOUT :: PATICKA */

  .paticka_wrap { flex-direction: column; }
  .paticka_left, .paticka_right { width: 100%; flex: none; }
  .paticka_left { padding: 60px 40px 70px 40px; text-align: center; border-top-right-radius: 0; }
  .paticka_right { padding: 70px 40px 60px 40px; }

  #paticka .columns { flex-direction: column; gap: 40px; }
  #paticka .column { flex: none; text-align: center; }
  #paticka .column h4 { padding-bottom: 20px; }
  #paticka .column ul { margin-bottom: 40px; }
  #paticka .column ul li { padding-bottom: 15px; }
  
  .copyright { gap: 8px; padding-top: 20px; text-align: center; display: flex; flex-direction: column; }
  .paticka_left a { margin: 0 auto; }

  /* LAYOUT :: HTML OBSAH :: KONTAKTY */

  #html_kontakty_zajem { flex-direction: column; padding: 80px 60px 100px 60px; }
  #html_kontakty_zajem .container_obsah, #html_kontakty_zajem .container_obrazek {
    flex: 1 1 100%; width: 100%; max-width: 800px; margin: 0 auto; }
  #html_kontakty_zajem .container_obrazek { margin-top: 40px; }

  /* HTML OBSAH :: Ceník */

  #cenik_hlavni { padding: 80px 20px; }
  #cenik_hlavni .cenik_boxy { flex-direction: column; align-items: center; gap: 20px; }
  #cenik_hlavni .cenik_box { flex: 1 1 100%; width: 100%; text-align: center; align-items: center; }
  #cenik_hlavni .cenik_box ul { text-align: left; display: inline-block; width: 100%; }

}

@media (max-width: 768px) {

  #zahlavi { padding-left: 0px; padding-right: 0px; }

  #zahlavi .menu_wrap { flex-direction: column; align-items: center; }
  #zahlavi .logo { order: 0; padding: 10px 0; text-align: center; width: 100%; }
  #zahlavi .logo img { margin: 0 auto; max-width: 90%; height: auto; }

  #menu_burger_btn { order: 1; margin-top: 10px; }
  #menu { order: 2; width: 100%; }
  #menu ul { gap: 10px; padding: 10px 0; flex-direction: column; align-items: center; }
  #menu ul li { width: 100%; justify-content: center; }
  #menu ul li.button a { margin-left: 0; }

  /* LAYOUT :: HEADER */

  #header.header_hp { padding: 80px 20px; text-align: center; }

  /* LAYOUT :: HP :: SERVICES_MAIN */

  #services_main {  }
  #services_main { flex-direction: column; padding: 0 20px 60px 20px; }
  #services_main > .service_box { min-height: auto; }
  #services_main > .service_box { flex: 1 1 100%; margin-bottom: 30px; text-align: center; align-items: center; }
  .service_box .icon { padding-bottom: 20px;}
  .service_box h3 { margin: 0 0 10px; }

  /* LAYOUT :: HP :: ABOUT US */

  #aboutus_hp { padding: 0px 20px 50px 20px; }
  .aboutus_stats { gap: 20px; padding-top: 20px; flex-direction: column; align-items: center; }
  .stat_box::before { display: none; }
  .stat_label, .stat_number { padding-top: 10px; }
  .copyright span:not(:first-child)::before { content: none; }

  /* CONTAINERS OBSAH UVOD */

  .obsah_uvod { max-width: 90%; margin: 0px auto; padding: 90px 0px 95px 0px; }
  .obsah_uvod_blogmag { max-width: 100%; margin: 0px auto; padding: 90px 0px 90px 0px; }
  .obsah_uvod_reference { max-width: 100%; margin: 0px auto; padding: 90px 0px 90px 0px; }

  /* LAYOUT :: HTML OBSAH :: KONTAKTY */

  #html_kontakty { padding: 80px 20px; text-align: center; }
  #html_kontakty p { margin-bottom: 50px; }
  .kontakt_boxy { flex-direction: column; gap: 40px; }
  .kontakt_box { flex: 1 1 100%; flex-direction: column; align-items: center; text-align: center; padding: 20px 10px; }
  .kontakt_box .ikonka { padding: 0; width: 60px; height: auto; margin-bottom: 20px; }
  .kontakt_box .text h3 { margin: 0 0 20px 0; }
  .kontakt_box .text ul { padding: 0; }
  .kontakt_box .text ul li { padding-bottom: 10px; }

  #html_kontakty_zajem { padding: 60px 20px 80px 20px; gap: 40px; }
  #html_kontakty_zajem h3, #html_kontakty_zajem p { text-align: center; }
  #html_kontakty_zajem form { width: 100%; }
  #html_kontakty_zajem .form_line { margin-bottom: 20px; }
  #html_kontakty_zajem .form_line label { display: block; margin-bottom: 8px; text-align: left; }
  #html_kontakty_zajem .btn { display: block; width: 100%; max-width: 300px; margin: 30px auto 0 auto; }

  /* LAYOUT :: HTML OBSAH :: FAV_SERVICES */

  #fav_services { padding: 80px 20px; text-align: center; }
  #fav_services p { margin-bottom: 50px; }
  .services_boxy { flex-direction: column; gap: 40px; }
  .services_box { flex: 1 1 100%; flex-direction: column; align-items: center; text-align: center; padding: 20px 10px; }
  .services_box .ikonka { padding: 0; width: 60px; height: auto; margin-bottom: 20px; }
  .services_box .text h3 { margin: 0 0 20px 0; }
  .services_box .text ul { padding: 0; }
  .services_box .text ul li { padding-bottom: 10px; }

  /* SLUZBY */
  #sluzby { padding: 80px 20px; }

  /* CONTAINERS VYPISY :: BLOG :: HP */

  .blogs_vypis { padding: 80px 20px; }
  .obsah_vypis_box_hp.obsah_vypis_box_galerie_blogmag_hp { flex: 0 1 100%; max-width: 100%; }
  .obsah_vypis_box.obsah_vypis_box_galerie_blogmag { flex: 0 1 100%; max-width: 100%; }

/* CONTAINERS VYPISY :: REFERENCE */

  .references_vypis { padding: 80px 20px; }
  .obsah_vypis_box_hp.obsah_vypis_box_galerie_blogmag_hp { flex: 0 1 100%; max-width: 100%; }
  .obsah_vypis_box.obsah_vypis_box_galerie_reference { flex: 0 1 100%; max-width: 100%; }

  /* CONTAINERS DETAILY */

#_x_blogmag_detail_perex { display: flex; flex-wrap: nowrap; gap: 90px; align-items: center; margin-bottom: 60px; 
padding-left: 50px; padding-right: 50px; box-sizing: border-box; }

  #blogmag_detail_perex { max-width: 90%; margin: 0px auto 60px auto; flex-direction: column; gap: 40px; 
    padding-left: 0px; padding-right: 0px; }
  #blogmag_detail_perex .left, #blogmag_detail_perex .right { flex: 1 1 100%; max-width: 100%; }
  .tinymce.blogmag { max-width: 90%; margin: 0px auto; } 

  /* CONTAINERS DETAILY */

  #reference_detail_perex { max-width: 90%; margin: 0px auto 60px auto; flex-direction: column; gap: 40px; }
  #reference_detail_perex .left, #reference_detail_perex .right { flex: 1 1 100%; max-width: 100%; }
  .tinymce.reference { max-width: 90%; margin: 0px auto; } 

  /* TINY */

  .tinymce.blogmag h2 { padding-left: 0px; padding-right: 0px; }
  .tinymce.blogmag p { padding-left: 0px; padding-right: 0px; }
  .tinymce blockquote { margin-left: 0px; margin-right: 0px; }

  .tinymce.reference table.reference tr:first-child { display: none; }
  .tinymce.reference table.reference,
  .tinymce.reference table.reference tbody,
  .tinymce.reference table.reference tr,
  .tinymce.reference table.reference td { display: block; width: 100%; }
  .tinymce.reference table.reference tr { margin-bottom: 16px; }
  .tinymce.reference table.reference td { padding: 6px 0; border: none; position: relative; }

  /* Labely pro buňky podle pořadí */
  .tinymce.reference table.reference td:nth-child(1)::before {
    content: "Klient: "; color: #555; font-weight: 200; font-size: 15px; display: inline-block; padding-right: 10px; }
  .tinymce.reference table.reference td:nth-child(2)::before {
    content: "Spuštění: ";  color: #555; font-weight: 200; font-size: 15px; display: inline-block; padding-right: 10px; }
  .tinymce.reference table.reference td:nth-child(3)::before {
    content: "Typ: "; color: #555; font-weight: 200; font-size: 15px; display: inline-block; padding-right: 10px; }
  .tinymce.reference table.reference td:nth-child(4)::before {
    content: "Náhled: ";  color: #555; font-weight: 200; font-size: 15px; display: inline-block; padding-right: 10px; }

  /* FONT :: HEADER */

  #header.header_hp span { font-size: 60px; } /* Original 100px */ 

  /* FONT :: H1 */

  h1 { font-size: 50px; }

  /* FONT :: PATICKA */
  
  .paticka_left h2 { font-size: 50px; } /* Original 70px */

}