/* CTND 0.3.0. Existing desktop layout is outside the media query and unchanged. */
.ctndm-root { display: none; }

@media screen and (max-width: 900px) {
  body:has(> .ctndm-root) {
    margin: 0 !important;
    padding: 0 !important;
    background: #faf8f4 !important;
    color: #282726 !important;
    font: 17px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    -webkit-text-size-adjust: 100%;
  }
  .ctndm-root, .ctndm-root * { box-sizing: border-box; }
  #ctnd-mobile-header.ctndm-root {
    display: block !important;
    position: relative;
    text-align: left;
    color: #282726;
    background: #fff;
    border-bottom: 1px solid #ded8cf;
    font: 16px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  }
  .ctndm-bar { padding: 16px 106px 16px 18px; min-height: 80px; }
  #ctnd-mobile-header .ctndm-brand {
    display: inline-flex; align-items: center; gap: 10px;
    color: #282726; text-decoration: none; font-weight: 400;
  }
  .ctndm-mark {
    display: grid; place-items: center; flex: 0 0 43px;
    width: 43px; height: 43px; background: #8d2019; color: #fff;
    font: 700 12px/1 Georgia, serif; letter-spacing: 0; white-space: nowrap;
  }
  .ctndm-brand-copy strong { display: block; font-size: 14px; line-height: 1.25; }
  .ctndm-brand-copy small { display: block; font-size: 10px; margin-top: 4px; color: #5c5650; }
  #ctnd-mobile-header summary { cursor: pointer; list-style: none; }
  #ctnd-mobile-header summary::-webkit-details-marker { display: none; }
  #ctnd-mobile-header summary::marker { content: ""; }
  #ctnd-mobile-header .ctndm-menu-toggle {
    position: absolute; top: 18px; right: 14px;
    display: flex; align-items: center; justify-content: center; gap: 7px;
    min-width: 78px; min-height: 44px; padding: 8px 10px;
    border: 1px solid #cfc6ba; border-radius: 4px;
    color: #282726; font-size: 14px; font-weight: 600;
  }
  .ctndm-menu-icon, .ctndm-menu-icon::before, .ctndm-menu-icon::after {
    display: block; width: 16px; height: 2px; background: currentColor;
  }
  .ctndm-menu-icon { position: relative; }
  .ctndm-menu-icon::before, .ctndm-menu-icon::after { content: ""; position: absolute; left: 0; }
  .ctndm-menu-icon::before { top: -5px; }
  .ctndm-menu-icon::after { top: 5px; }
  #ctnd-mobile-header .ctndm-navigation[open] > .ctndm-menu-toggle { background: #8d2019; border-color: #8d2019; color: #fff; }
  .ctndm-panel { padding: 0 18px 18px; max-height: 70vh; max-height: 70dvh; overflow: auto; }
  #ctnd-mobile-header ul { list-style: none; margin: 0; padding: 0; }
  #ctnd-mobile-header li { position: relative; margin: 0; padding: 0; background: none; text-align: left; }
  #ctnd-mobile-header .ctndm-menu > li { border-top: 1px solid #e6e1d9; }
  #ctnd-mobile-header li > a, #ctnd-mobile-header li > span {
    display: block; padding: 12px 56px 12px 2px; min-height: 48px;
    color: #282726; font: 500 16px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    text-decoration: none; overflow-wrap: anywhere;
  }
  #ctnd-mobile-header .ctndm-current > a { color: #8d2019; font-weight: 700; }
  #ctnd-mobile-header .ctndm-branch > summary {
    position: absolute; top: 2px; right: 0; display: grid; place-items: center;
    width: 44px; height: 44px; color: #8d2019; font: 24px/1 Arial, sans-serif;
    border-left: 1px solid #e6e1d9;
  }
  .ctndm-branch[open] > summary > span { transform: rotate(180deg); }
  #ctnd-mobile-header .ctndm-submenu { margin: 0 0 10px 10px; padding-left: 14px; border-left: 2px solid #e6e1d9; }
  #ctnd-mobile-header .ctndm-submenu li > a { font-size: 15px; }
  #ctnd-mobile-header :focus-visible,
  .ctndm-root ~ :is(.center, .site) :focus-visible { outline: 3px solid #8d2019 !important; outline-offset: 3px; }

  /* Only the existing taijiquan document following the inserted header is restyled. */
  .ctndm-root ~ :is(.center, .site) { width: auto !important; text-align: left !important; }
  .ctndm-root ~ :is(.center, .site) #wrapper { display: block !important; width: auto !important; margin: 0 !important; }
  .ctndm-root ~ :is(.center, .site) #banner_wrapper,
  .ctndm-root ~ :is(.center, .site) #horizontal_menu { display: none !important; }
  .ctndm-root ~ :is(.center, .site) #container,
  .ctndm-root ~ :is(.center, .site) #common_main_right,
  .ctndm-root ~ :is(.center, .site) :is(#maincolumn, #main_component),
  .ctndm-root ~ :is(.center, .site) #maincolumn_full,
  .ctndm-root ~ :is(.center, .site) #border_top_right {
    display: block !important; float: none !important; width: auto !important; min-width: 0 !important;
    max-width: 100% !important; overflow: visible !important;
    margin: 0 !important; padding: 0 !important; background: none !important;
  }
  .ctndm-root ~ :is(.center, .site) .padding_maincolumn { padding: 28px 20px 14px !important; }
  .ctndm-root ~ :is(.center, .site) :is(#maincolumn, #main_component),
  .ctndm-root ~ :is(.center, .site) #maincolumn_full { color: #282726; font-size: 17px !important; line-height: 1.65 !important; }
  .ctndm-root ~ :is(.center, .site) #border_bottom,
  .ctndm-root ~ :is(.center, .site) #border_bottom_right,
  .ctndm-root ~ :is(.center, .site) #border_bottom_left { display: none !important; }
  .ctndm-root ~ :is(.center, .site) p { margin: 0 0 18px; }
  .ctndm-root ~ :is(.center, .site) .fancy_title { display: block; padding: 0 0 16px; }
  .ctndm-root ~ :is(.center, .site) .red_dot { display: none; }
  .ctndm-root ~ :is(.center, .site) .header_title { margin: 0; }
  .ctndm-root ~ :is(.center, .site) :is(#maincolumn, #main_component) h1,
  .ctndm-root ~ :is(.center, .site) #maincolumn_full h1 { font: 500 clamp(27px, 6vw, 36px)/1.18 Georgia, "Times New Roman", serif !important; }
  .ctndm-root ~ :is(.center, .site) :is(#maincolumn, #main_component) h2,
  .ctndm-root ~ :is(.center, .site) #maincolumn_full h2 { font: 500 clamp(25px, 5.8vw, 32px)/1.22 Georgia, "Times New Roman", serif !important; }
  .ctndm-root ~ :is(.center, .site) :is(#maincolumn, #main_component) h3,
  .ctndm-root ~ :is(.center, .site) #maincolumn_full h3 { font: 650 20px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important; }
  .ctndm-root ~ :is(.center, .site) :is(#maincolumn, #main_component) :is(h1,h2,h3),
  .ctndm-root ~ :is(.center, .site) #maincolumn_full :is(h1,h2,h3) {
    float: none !important; color: #282726 !important; text-transform: none;
    margin: 0 0 14px; padding: 0; height: auto; overflow-wrap: anywhere;
  }
  .ctndm-root ~ :is(.center, .site) :is(#maincolumn, #main_component) a:not([style]):not([class~="btn"]):not([class^="btn-"]):not([class*=" btn-"]):not([class*="button"]):not([class*="cta"]),
  .ctndm-root ~ :is(.center, .site) #maincolumn_full a:not([style]):not([class~="btn"]):not([class^="btn-"]):not([class*=" btn-"]):not([class*="button"]):not([class*="cta"]),
  .ctndm-root ~ :is(.center, .site) #rightcolumn a:not([style]):not([class~="btn"]):not([class^="btn-"]):not([class*=" btn-"]):not([class*="button"]):not([class*="cta"]) { color: #8d2019 !important; text-decoration: underline; text-underline-offset: .18em; }
  .ctndm-root ~ :is(.center, .site) :is(#maincolumn, #main_component) img,
  .ctndm-root ~ :is(.center, .site) #maincolumn_full img,
  .ctndm-root ~ :is(.center, .site) #rightcolumn img { max-width: 100% !important; height: auto !important; }
  .ctndm-root ~ :is(.center, .site) .item-image,
  .ctndm-root ~ :is(.center, .site) .item-image img { float: none !important; margin-left: 0 !important; margin-right: 0 !important; }
  .ctndm-root ~ :is(.center, .site) :is(.columns-2,.masonry-2) { display: block !important; }
  .ctndm-root ~ :is(.center, .site) :is(.columns-2,.masonry-2) .blog-item { width: auto !important; }
  .ctndm-root ~ :is(.center, .site) .blog-items .blog-item .item-content { margin: 0 0 28px; padding-bottom: 28px; border-bottom: 1px solid #ded8cf; }
  .ctndm-root ~ :is(.center, .site) a.readon,
  .ctndm-root ~ :is(.center, .site) p.readmore a {
    position: static !important; float: none !important; transform: none !important;
    display: inline-block !important; max-width: 100%; box-sizing: border-box;
    margin: 8px 0 18px !important; padding: 11px 15px !important; height: auto !important; min-height: 44px;
    border: 1px solid #8d2019 !important; border-radius: 3px; background: #8d2019 !important;
    color: #fff !important; text-decoration: none !important; white-space: normal !important;
    font: 600 15px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    text-indent: 0 !important; -webkit-text-fill-color: #fff !important;
    visibility: visible !important; opacity: 1 !important; width: auto !important;
    overflow-wrap: anywhere;
  }
  .ctndm-root ~ :is(.center, .site) p.readmore { margin: 0 0 18px !important; }
  .ctndm-root ~ :is(.center, .site) .article-info { margin: 0 0 18px; color: #5c5650; font-size: 14px; }
  .ctndm-root ~ :is(.center, .site) .article-info :is(time,.createdby) { margin-left: 0 !important; }
  .ctndm-root ~ :is(.center, .site) #rightcolumn {
    float: none !important; width: auto !important; max-width: none;
    margin: 20px 20px 30px !important; padding: 24px 0 0 !important;
    overflow: visible !important; border-top: 1px solid #ded8cf;
    font-size: 15px; line-height: 1.6;
  }
  .ctndm-root ~ :is(.center, .site) #rightcolumn .moduletable { border-bottom-color: #ded8cf; margin-bottom: 24px; padding-bottom: 24px; }
  .ctndm-root ~ :is(.center, .site) #footer_bar { height: auto !important; background: #75201b !important; margin-top: 24px; }
  .ctndm-root ~ :is(.center, .site) #footermenu { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px 16px; box-sizing: border-box;
    width: auto !important; height: auto !important; padding: 24px 20px; background: none !important; }
  .ctndm-root ~ :is(.center, .site) :is(#bottommenu1,#bottommenu2,#bottommenu3,#bottommenu4) { float: none !important; width: auto !important; height: auto !important; padding: 0; margin: 0 !important; }
  .ctndm-root ~ :is(.center, .site) #footermenu li { background: none; }
  .ctndm-root ~ :is(.center, .site) #footermenu li a { display: block; padding: 8px 0 !important; color: #fff !important; font-size: 13px; line-height: 1.5; }
  .ctndm-root ~ :is(.center, .site) #footer { margin: 0; padding: 12px 20px; }
  /* Responsivizer is the currently observed iPhone template on ctnd.de. */
  .ctndm-root ~ .site,
  .ctndm-root ~ .site :is(.wrapper-site,.middle-site,.right_column,.main-content) {
    box-sizing: border-box; width: auto !important; max-width: 100% !important;
    min-width: 0 !important; float: none !important; margin: 0 !important;
    padding: 0 !important; background: none !important; border: 0 !important;
    box-shadow: none !important;
  }
  .ctndm-root ~ .site :is(.header-site,.main_menu_box) { display: none !important; }
  .ctndm-root ~ .site #main_component {
    box-sizing: border-box; padding: 28px 20px 14px !important;
    border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
    overflow-wrap: break-word;
  }
  .ctndm-root ~ .site #main_component :is(h1,h2,h3) {
    background: none !important; border: 0 !important; box-shadow: none !important;
    text-align: left !important;
  }
  .ctndm-root ~ .site .right-module-position {
    box-sizing: border-box; float: none !important; width: auto !important;
    margin: 20px 20px 30px !important; padding: 24px 0 0 !important;
    border-top: 1px solid #ded8cf; background: none !important;
    font-size: 15px; line-height: 1.6;
  }
  .ctndm-root ~ .site .right-module-position a { color: #8d2019 !important; }
  .ctndm-root ~ .site .right-module-position img { max-width: 100% !important; height: auto !important; }
  .ctndm-root ~ .site .right-module-position .moduletable { margin-bottom: 24px; padding-bottom: 24px; border-bottom: 1px solid #ded8cf; background: none !important; }
  .ctndm-root ~ .site .right-module-position h3 { font: 650 20px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important; color: #282726 !important; }
  .ctndm-root ~ .site .right-module-position a.readon { color: #fff !important; }
  .ctndm-root ~ .site .bottom-site {
    width: auto !important; margin: 24px 0 0 !important; padding: 24px 20px !important;
    background: #75201b !important; color: #fff !important; border: 0 !important;
  }
  .ctndm-root ~ .site .bottom-site a { color: #fff !important; text-decoration: underline; }
  .ctndm-root ~ .site .bottom-site :is(.copyright,.bottom_switcher) { background: none !important; padding: 10px 0 !important; }
  .ctndm-root ~ .site .bottom-site ul { margin: 0 !important; padding: 0 !important; list-style: none; }
  .ctndm-root ~ :is(.center, .site) :is(#maincolumn, #main_component) :is(input:not([type=checkbox]):not([type=radio]),textarea,select),
  .ctndm-root ~ :is(.center, .site) #maincolumn_full :is(input:not([type=checkbox]):not([type=radio]),textarea,select) { box-sizing: border-box; max-width: 100%; font-size: 16px; }
  .ctndm-root ~ :is(.center, .site) iframe { max-width: 100%; }
  @media (max-width: 360px) {
    .ctndm-bar { padding-left: 14px; padding-right: 100px; }
    .ctndm-brand-copy strong { font-size: 12px; }
    .ctndm-brand-copy small { font-size: 9px; }
    .ctndm-root ~ :is(.center, .site) .padding_maincolumn { padding-left: 16px !important; padding-right: 16px !important; }
  }
}