@charset "utf-8";

/*
 * Responsive compatibility layer for the original 2011 design.
 * Desktop dimensions remain untouched; overrides start below the old 960px
 * canvas so the site's visual character is preserved on larger screens.
 */

html {
  -webkit-text-size-adjust: 100%;
}

img,
iframe,
video {
  max-width: 100%;
}

.menu_toggle {
  display: none;
}

@media (max-width: 980px) {
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  body {
    min-width: 0;
    overflow-x: hidden;
  }

  #header {
    position: absolute;
    height: 59px;
    z-index: 2000;
  }

  #header_content {
    width: 100%;
    height: 56px;
    padding: 0 20px;
  }

  #logo {
    float: left;
  }

  #menubar {
    float: right;
  }

  .menu_toggle {
    appearance: none;
    align-items: center;
    background: transparent;
    border: 0;
    color: #4e4e4e;
    cursor: pointer;
    display: flex;
    font: 700 12px/1 'PT Sans', Arial, sans-serif;
    gap: 8px;
    height: 56px;
    letter-spacing: .05em;
    padding: 0;
  }

  .menu_toggle_icon,
  .menu_toggle_icon::before,
  .menu_toggle_icon::after {
    background: #e42323;
    display: block;
    height: 2px;
    transition: transform .2s ease, opacity .2s ease;
    width: 22px;
  }

  .menu_toggle_icon {
    position: relative;
  }

  .menu_toggle_icon::before,
  .menu_toggle_icon::after {
    content: '';
    left: 0;
    position: absolute;
  }

  .menu_toggle_icon::before { top: -7px; }
  .menu_toggle_icon::after { top: 7px; }

  .nav_open .menu_toggle_icon { background: transparent; }
  .nav_open .menu_toggle_icon::before { top: 0; transform: rotate(45deg); }
  .nav_open .menu_toggle_icon::after { top: 0; transform: rotate(-45deg); }

  #menuani {
    background: #f9f9f9;
    border-bottom: 3px solid #e42323;
    box-shadow: 0 10px 25px rgba(0, 0, 0, .14);
    display: none;
    float: none;
    height: auto;
    left: 0;
    max-height: calc(100vh - 59px);
    overflow-y: auto;
    padding: 8px 20px 14px;
    position: absolute;
    top: 59px;
    width: 100%;
  }

  .nav_open #menuani { display: block; }

  .main_menu > li {
    background: none;
    border-bottom: 1px solid #e5e5e5;
    float: none;
    height: auto;
    width: 100%;
  }

  .main_menu > li:last-child { border-bottom: 0; }
  .main_menu li.back { display: none !important; }

  .main_menu li a {
    height: auto;
    margin: 0;
    min-height: 43px;
    overflow: visible;
    padding: 14px 3px 12px;
  }

  .main_menu li span { display: inline; }
  .main_menu li span .li-shadow { display: none; }
  .main_menu li.current > a { border-left: 3px solid #e42323; padding-left: 10px; }

  #menuani li ul {
    background: #f0f0f0;
    border: 0;
    display: none !important;
    left: auto;
    padding: 4px 10px;
    position: static;
    top: auto;
    visibility: visible !important;
    width: 100%;
  }

  #menuani li.submenu_open > ul { display: block !important; }

  #menuani li ul li a,
  #menuani li ul li ul li a {
    min-height: 40px;
    padding: 12px 8px;
    white-space: normal;
  }

  #wrap_home,
  #wrap,
  #header_content,
  #footer,
  #footnotes {
    max-width: 100%;
  }

  #wrap_home,
  #wrap {
    padding-left: 24px;
    padding-right: 24px;
    width: 100%;
  }

  #wrap { margin-top: 34px; }

  #content,
  .row,
  .full_width {
    float: none;
    width: 100%;
  }

  .row { margin-top: 42px; }

  .one_third,
  .two_third {
    float: none;
    margin: 0 0 38px;
    width: 100%;
  }

  .one_third.last,
  .two_third.last { margin-bottom: 0; }

  .one_third p,
  .two_third p { text-align: left; }

  .slideshow_container {
    height: clamp(190px, 31vw, 297px);
    margin-top: 59px;
  }

  #hm-slideshow .main {
    margin: 0;
    max-width: none;
    width: 100%;
  }

  #main_banner,
  #main_banner ul,
  .box_skitter,
  .box_skitter .container_skitter,
  .box_skitter .image {
    height: clamp(190px, 31vw, 297px) !important;
    max-width: none;
    width: 100% !important;
  }

  #main_banner .image,
  #main_banner .slide_link {
    display: block;
    height: 100% !important;
    width: 100% !important;
  }

  #main_banner .image_main {
    display: block !important;
    height: 100% !important;
    max-width: none;
    object-fit: cover;
    width: 100% !important;
  }

  #main_banner .box_clone img {
    height: var(--skitter-height, 100%) !important;
    max-width: none;
    object-fit: cover;
    width: var(--skitter-width, 100vw) !important;
  }

  #main_banner #label_wrapper {
    max-width: none;
  }

  #main_banner #seq1,
  #main_banner #seq2 {
    max-width: none;
    overflow: visible;
  }

  #navigation_arrows,
  #navigation_arrows > div,
  .box_skitter #info_inner {
    max-width: 100%;
    width: 100% !important;
  }

  #services .jcarousel-container-horizontal,
  #services .jcarousel-clip-horizontal {
    margin-left: 0;
    padding-left: 0;
    padding-right: 0;
    width: 100% !important;
  }

  #services .jcarousel-item-horizontal {
    padding-left: 0;
    padding-right: 0;
    width: calc(100vw - 48px) !important;
  }

  #svc_slider {
    display: flex !important;
    gap: 24px;
    height: auto;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    width: 100% !important;
  }

  #services .jcarousel-item-horizontal {
    flex: 0 0 100%;
    scroll-snap-align: start;
    width: 100% !important;
  }

  #services .jcarousel-item-horizontal .one_third,
  #services .bottom_link { width: 100%; }

  #services .jcarousel-prev-horizontal,
  #services .jcarousel-next-horizontal { display: none !important; }

  #featured_proj_rec_posts {
    margin-left: 0;
    padding: 24px;
  }

  #featured_projects,
  .project,
  .jcarousel-skin-feat_proj .jcarousel-container-horizontal,
  .jcarousel-skin-feat_proj .jcarousel-clip-horizontal,
  .jcarousel-skin-feat_proj .jcarousel-item-horizontal {
    max-width: 100%;
    width: 100% !important;
  }

  .project {
    display: flex;
    gap: 28px;
  }

  .project_details {
    flex: 1;
    margin-left: 0;
    width: auto;
  }

  #next_proj { right: 0; }
  #prev_proj { right: 17px; }
  .view_all_projects { right: 42px; }

  #latest_posts_slider,
  .jcarousel-skin-svc_post_slider .jcarousel-container-vertical,
  .jcarousel-skin-svc_post_slider .jcarousel-clip-vertical,
  .jcarousel-skin-svc_post_slider .jcarousel-item-vertical,
  .recent_post {
    width: 100% !important;
  }

  #footer_section {
    border-left-width: 24px;
    margin-top: 44px;
    width: calc(100% - 40px);
  }

  #footer {
    padding: 0 24px;
    width: 100%;
  }

  #footer .one_third {
    margin-bottom: 36px;
  }

  #social_media,
  #social_media_text,
  #contact_details {
    height: auto;
    max-width: 100%;
    width: 100%;
  }

  #social_media { min-height: 155px; }
  #footer_strip { height: auto; margin-top: 10px; }
  #footnotes { padding: 20px 24px; width: 100%; }
  #goto_top { bottom: 18px; margin: 0; right: 18px; }

  #map_outer,
  #map {
    height: 440px;
    max-width: 100%;
    width: 100%;
  }

  #contact_box {
    left: 20px;
    max-width: calc(100% - 40px);
  }

  .post,
  .post_desc,
  .post_title,
  .post_dets,
  .blog_slider,
  #blog_post_footer,
  #comments_section,
  #leave_a_reponse,
  .text_area,
  .post_paginate {
    max-width: 100%;
    width: 100%;
  }

  .post_img,
  .post_img img,
  .blog_slider img { width: 100%; }

  .blog_comment {
    margin-left: 0;
    max-width: 100%;
    width: 100%;
  }

  #team,
  .line,
  .jcarousel-skin-team .jcarousel-container-horizontal,
  .jcarousel-skin-team .jcarousel-clip-horizontal {
    margin-left: 0;
    max-width: 100%;
    width: 100% !important;
  }

  #portfolio_area,
  #portfolio_controls,
  #project_inner {
    max-width: 100%;
    width: 100%;
  }
}

@media (max-width: 640px) {
  #header_content { padding: 0 15px; }
  #logo { background-size: auto 48px; width: 165px; }
  #logo .site_brand a { width: 165px; }
  .menu_toggle { gap: 6px; }

  #wrap_home,
  #wrap,
  #footer { padding-left: 18px; padding-right: 18px; }

  .row { margin-top: 34px; }
  #featured_proj_rec_posts { padding: 18px; }

  .project {
    display: block;
    height: auto;
  }

  #featured_projects,
  #featured_projects .jcarousel-container-horizontal,
  #featured_projects .jcarousel-clip-horizontal,
  #feat_projects_slider,
  #feat_projects_slider > li,
  #feat_projects_slider .project {
    height: auto !important;
    width: 100% !important;
  }

  #feat_projects_slider { overflow: visible; }
  #feat_projects_slider > li { display: none !important; }
  #feat_projects_slider > li:first-child { display: block !important; }

  #featured_projects .jcarousel-prev-horizontal,
  #featured_projects .jcarousel-next-horizontal { display: none !important; }

  .small_slideshow,
  .small_slideshow ul,
  .small_slideshow li,
  .small_slideshow li img {
    height: auto;
    max-width: 100%;
    width: 100% !important;
  }

  .small_slideshow { min-height: 205px; }

  .service_slideshow {
    float: none;
    margin: 0 0 18px;
  }

  .service_copy_with_media { min-height: 0; }

  .service_placeholder {
    max-width: 100%;
    width: 100%;
  }

  .project_details {
    height: auto;
    margin-top: 12px;
    padding-bottom: 12px;
  }

  .project_details,
  .project_name,
  .project_details li { width: 100%; }

  #contact_box {
    margin: 20px 0;
    max-width: 100%;
    padding: 15px;
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
  }

  #close_box_btn { display: none; }

  .contact_text_small,
  .contact_text_long,
  .contact_text_area {
    margin-right: 0;
    width: 100%;
  }

  #map_outer,
  #map { height: 330px; }

  img.telefon_nerede {
    height: auto;
    margin: 15px 0 0;
    max-width: 100%;
    position: relative;
    width: 100%;
  }

  .post_title,
  .post_dets { padding-left: 8px; width: calc(100% - 42px); }

  #blog_tags,
  #blog_share { float: none; margin-bottom: 12px; }

  #footer_strip { text-align: center; }
  #footnotes { background: none; padding: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Legacy editor content is repaired server-side and contained here so wide
   code samples, tables and images cannot push the page or footer off-canvas. */
.legacy-blog-summary,
.legacy-blog-body {
  clear: both;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.legacy-blog-summary {
  padding-top: 18px;
  font-weight: 600;
}

.legacy-blog-body img,
.legacy-blog-body table,
.legacy-blog-body pre,
.legacy-blog-body code {
  max-width: 100%;
}

.legacy-blog-body img {
  height: auto;
}

.legacy-blog-body table {
  display: block;
  overflow-x: auto;
}

.legacy-blog-body pre {
  box-sizing: border-box;
  overflow-x: auto;
  white-space: pre;
}

.legacy-blog-body::after {
  clear: both;
  content: "";
  display: table;
}