@import "./theme.css";

code,
.codeInline
{
  font-family: monospace;
  color: #2080C0;
  font-size: 110%;
  margin-left: 0.1em;
  font-weight: bold;
}


section.intro
{
  /* display: grid; */
  grid-template-columns: 10em auto;
  position: relative;
  /*background-color: rgba(15,70,160,0.7);*/
  background-image: linear-gradient(180deg, #38588d, #c9d5e9);
  -webkit-clip-path: ellipse(180% 100% at 50% 0);
  clip-path: ellipse(180% 100% at 50% 0);
  margin-top: 2em;
}
#intro_heading
{
  display: grid;
  grid-template-columns: auto auto;
}
#intro_header_text
{
  margin-top: 0.5em;
}
#intro_logo
{
  height: 2.5em;
  filter: invert(1);
}
#intro_logo_wrapper
{
  margin-right: 1em;
}
.intro_image_wrapper img
{
  width: 100vw;
  clip-path: circle(79% at 80% 83%);
  height: 30vw;
  object-fit: cover;
  min-height: 30em;
}

.intro_quick_switch
{
  display: grid;
  align-items: center;
  justify-content: center;
  position: absolute;
  z-index: 1;
  left: 2em;
  top: 1em;
  font-size: 1.9em;
  font-weight: bold;
  text-shadow: 0.1em 0.1em 0.3em grey;
  color: white;
  line-height: 1.3em;
}
.intro_image_wrapper
{
  align-items: center;
  justify-content: center;
  display: grid;
  overflow: hidden;
  /* position: absolute; */
}
.intro_quick_switch_button
{
  border: 1px solid black;
  border-radius: 0.5em;
  text-align: right;
  /*background-color: rgba(255,255,255,90%);*/
  display: grid;
  overflow: hidden;
  font-size: 80%;
  margin-top: 0.7em;
  padding: 0.2em 1.3em 0.2em 2em;
}
  .intro_quick_switch_button#quick_switch_can
  {
    background-image: linear-gradient(90deg, #f44 0%, rgba(255,255,255,90%) 20%);
  }
  .intro_quick_switch_button#quick_switch_abk
  {
    /*border-left: 1em solid #6f6;*/
    background-image: linear-gradient(90deg, #4f4 0%, rgba(255,255,255,90%) 20%);
    /*background-color: rgb(176,255,176,90%);*/
  }
  .intro_quick_switch_button#quick_switch_pc
  {
    background-image: linear-gradient(90deg, #ff4 0%, rgba(255,255,255,90%) 20%);
    /*background-color: rgb(255,255,128,90%);*/
  }
    .intro_quick_switch_button#quick_switch_can:hover,
    .intro_quick_switch_button#quick_switch_abk:hover,
    .intro_quick_switch_button#quick_switch_pc:hover
    {
      background-color: white;
      box-shadow: 0 0 var(--shadow_size) white;
    }

a.intro_quick_switch_button
{
  /* font-weight: normal; */
  color: black;
  /* font-style: normal; */
  min-width: 9em;
}
a.intro_quick_switch_button:hover
{
  text-decoration:none;
}

.intro_quick_switch_button img
{
  height: 1.5em;
  vertical-align: text-top;
}  
 










.thumb_block
{
  display: inline-block;
  width: 100%;
}

  .thumb_block a
  {
    background-color: #eee;
    margin-right: 1em;
    margin-bottom: 3em;
    padding: 1em;
    position: relative;
    float: left;
    /*	background: linear-gradient(to bottom, #fff 0%,#ccc 100%); */
    text-align: center;
    height: 8em;
    width: 8em;
    display: block;
    overflow: hidden;
  }

  .thumb_block span
  {
    /*	background: transparent;*/
    /*	background: linear-gradient(to bottom, rgba(21, 112, 166, 1), rgba(21,112, 166, 0)); /*background-color: #1570a6;*/
    /*	color: white;*/
    color: #808080;
    position: absolute;
    bottom: 0px;
    left: 0px;
    min-width: 100%;
    padding: 0.3em 0 0.3em 0;
    text-align: center;
    overflow: hidden;
    font-style: normal;
  }

  .thumb_block img
  {
    border-width: 0px;
    max-height: 70%;
    max-width: 70%;
    width: auto;
    height: auto;
    position: absolute;
    top: 0;
    bottom: 1.5em;
    left: 0;
    right: 0;
    margin: auto;
  }

.inline_thumb
{
  height: 2.5em;
  vertical-align:middle;
}

.headerbar_screen,
.footerbar_screen
{
  width: 100%;
  border: none;
  /* min-height: 100%; */
}

.headerbar_screen
{
  height: var(--page_header_height);
  box-shadow: 0 0 var(--shadow_size) var(--shadow_color);
  margin-bottom: var(--shadow_size);
}

.footerbar_screen
{
  height: var(--page_footer_height);
}

[class^="footerbar_print_page"]
{
  display: none;
}

.qrcode
{
  --qr_size: 5em;
  visibility: visible;
  height: var(--qr_size);
  width: var(--qr_size);
  right: 1.5em;
  position: absolute;
  z-index: 5;
  padding: calc(var(--qr_size)/10);
  background-color: white;
  top: 6em;
}
  .qrcode img
  {
    border-width: 0px;
    height: var(--qr_size);
  }



/* navigation menu */
.nav_wrapper
{
  overflow: hidden;
}
.nav_wrapper iframe
{
  width: 100vw; /* this ensures that the iframe width media query sees the same as the parent window*/
  border: none;
}



.content
{
  /* display: grid; */
  /* overflow: hidden; */
}
  .content > div:nth-child(2n+1)
  {
    background-color: var(--background_lightgray);
  }



nav
{
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

nav a.disabled
{
  pointer-events: none;
  cursor: default;
  font-weight: unset;
}

iframe.menu
{
  border: none;
}

iframe.menu_path
{
  height: 1.5em;
  border: none;
}

iframe.menu.thumb.gallery
{
  height: var(--thumb_gallery_height);
}

iframe.menu.thumb.menu_content
{
  height: 30em;
}

iframe.menu_accessories
{
  width: var(--dual_columns_column_width_max);
}

iframe.menu_applies_to
{
  width: 100%;
}

iframe.menu_content
{
  width: var(--page_narrowed_max_width);
}






.product_head /* head line area of product pages */
{
  padding-left: var(--page_hor_margin);
  padding-right: var(--page_hor_margin);
  /* text-align: center; */
  box-sizing: border-box;
}

.main_section
{
  justify-content: space-evenly;
  display: flex;
  border-top: 1px solid lightgray;
  padding: 1.5em var(--page_hor_margin) 1.5em var(--page_hor_margin);
  box-sizing: border-box;
}

  .main_section h2
  {
    margin-top: 0;
  }

.narrowed
{
  max-width: var(--page_narrowed_max_width);
}

.narrowed_full_width
{
  width: var(--page_narrowed_max_width);
}

  .narrowed_full_width .narrowed_full_width
  {
    width: 100%;
  }

  .flex_dual_columns
  {
    flex-wrap: wrap;
    column-gap: 2em;
    row-gap: 3em;
    column-count: 2;
  }

  .flex_dual_columns > div
  {
    max-width: var(--dual_columns_column_width_max);
    min-width: var(--dual_columns_column_width_min);
  }
    .flex_dual_columns .menu_thumb_class,
    .flex_dual_columns .menu_thumb_class_random
    {
      width: var(--dual_columns_column_width_max);
    }

.head_and_abstract
{
  width: 100%;
  text-align: center;
}

.description_and_techdata
{
  /* background-color: var(--background_lightgray); */
}

.description, .techdata
{
  /* max-width: 40em; */
  /* min-width: 25em; */
}

.techdata
{
  line-height: 1.3em;
}
  .techdata > tbody > tr:nth-child(2n+1)
  {
    background-color: var(--background_lightgray_shaded);
  }

  .techdata > tbody > tr:nth-child(2n+0)
  {
    background-color: #fafafa;
  }
  .techdata > tbody
  {
    width: 100%;
  }

  .techdata td
  {
    text-align: left;
    vertical-align: top;
  }
  .techdata td:first-child
  {
    padding-right: 1em;
  }
.techdata td[colspan]:not([colspan="1"])
{
  text-align: center;
}

.techdatasub tr:hover td
{
  background: #ddd;
}

.techdatasub
{
  border-collapse: collapse;
  width: 100%;
}

  .techdatasub td
  {
    text-align: left;
    vertical-align: top;
    padding-right: 0.2em;
    padding-bottom: 0em;
    border-style: solid;
    border-width: 0px;
    border-bottom-width: 1px;
    border-color: #eee;
  }


.h_centered
{
  margin: auto;
  text-align: center;
}

.more_to_like
{
  display: block;
  text-align: center;
  padding-top: 6em;
}
  .more_to_like .menu_thumb_class,
  .more_to_like .menu_thumb_class_random
  {
    width: 100%;
  }


  .main_section.variants
  {
    flex-flow: wrap;
    text-align: center;
  }

.main_section iframe.menu_thumb_class,
.main_section iframe.menu_thumb_class_random
{
  min-width: 20em;
}



#id_products #id_products > ul, #id_download #id_download > ul, #id_support #id_support > ul
{
  visibility: visible;
}

  #id_products #id_products > ul > li, #id_download #id_download > ul > li, #id_support #id_support > ul > li
  {
    line-height: 1.3em;
    padding-bottom: 0.12em;
    padding-top: 0.1em;
  }

    #id_products #id_products > ul > li > ul, #id_download #id_download > ul > li > ul, #id_support #id_support > ul > li > ul
    {
      visibility: visible;
      padding-bottom: 1em;
    }

      #id_products #id_products > ul > li > ul > li, #id_download #id_download > ul > li > ul > li, #id_support #id_support > ul > li > ul > li
      {
        line-height: 1.4em;
        padding-bottom: 0.12em;
        padding-top: 0.2em;
      }

        #id_products #id_products > ul > li > ul > li > ul, #id_download #id_download > ul > li > ul > li > ul, #id_support #id_support > ul > li > ul > li > ul
        {
          visibility: visible;
          padding-bottom: 0em;
        }

          #id_products #id_products > ul > li > ul > li > ul > li, #id_download #id_download > ul > li > ul > li > ul > li, #id_support #id_support > ul > li > ul > li > ul > li
          {
            line-height: 1.1em;
            padding-bottom: 0em;
          }

#id_cable #id_cable > ul
{
  visibility: visible;
}

  #id_cable #id_cable > ul > li
  {
    line-height: 1.5em;
    padding-bottom: 0em;
  }

#id_appnotes #id_appnotes > ul
{
  visibility: visible;
}

  #id_appnotes #id_appnotes > ul > li
  {
    line-height: 1.5em;
    padding-bottom: 0.8em;
  }

#id_appnotes #id_appnotes a:after
{
  display: block;
  position: relative;
  left: 0px;
  padding-left: 0%;
  height: 100%;
  line-height: 1em;
  text-decoration: none;
  padding-top: 0px;
  padding-bottom: 0px;
}

.section_full_width
{
  width: 100%;
  overflow: hidden;
  background-color: #f8f8f8;
  margin-bottom: 2em;
  padding: 0.5em 0.5em 1em 0.5em;
  background: linear-gradient(to bottom right,#e0e0e0,#ffffff);
}

  .section_full_width h2
  {
    margin-top: 0
  }

  .section_full_width > img
  {
    float: left;
    width: 40%;
  }

.acc_multiimages
{
  width: 40%;
  float: left;
}

  .acc_multiimages img
  {
    width: 100%;
  }

.prod_textsection
{
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}


.display_overview img
{
  width: 8em;
  filter: drop-shadow(0.5em 0.5em 0.5em #aaa);
}

table.pinout
{
  border-collapse: collapse;
  border-style:hidden;
}

.pinout td,
.pinout th
{
  border: 1px #C0C0C0 solid;
  text-align: left;
  padding: 0.1em;
  padding-right: 0.5em;
  padding-left: 0.5em;
  min-width: 2em;
  line-height: 1em;
}

.pinout > tbody > tr > th:first-child
{
  text-align: right;
  padding-left: 0;
  white-space: nowrap;
  font-weight: bold;
}
.pinout > tbody > tr > td:first-child
{
  text-align: right;
  padding-left: 0;
  white-space: nowrap;
  font-weight: bold;
}



.variants td,
.variants th
{
  border: 1px #C0C0C0 solid;
  text-align: center;
  padding: 0.1em;
  padding-right: 0.5em;
  padding-left: 0.5em;
  min-width: 3em;
  line-height: 1.5em;
}

.variants table
{
  border-collapse: collapse;
  border-style: hidden;
}

table.variants_acc tr:hover td,
table.variants tr:not(:first-child):hover td,
table.variants tbody:not(:first-child) tr:first-child:hover td,
table.variants tbody:hover td[rowspan],
table.display_overview tr:not(:first-child):hover td,
table.display_overview tbody:not(:first-child) tr:first-child:hover td,
table.display_overview tbody:hover td[rowspan]
{
  background: #e0e0e0;
}

.variants > tbody:first-child tr th,
.variants > tbody:first-child tr td
{
  font-weight: unset;
}
.variants > tbody > tr > th:first-child,
.variants > tbody > tr > td:first-child
{
  text-align: left;
  padding-left: 0;
  white-space: nowrap;
  font-weight: bold;
}
table.variants > tbody:first-child > tr:first-child > th:first-child:after,
table.variants > tbody:first-child > tr:first-child > td:first-child:after
{
  content: "SKU";
  font-weight: normal;
  text-align: left;
}


.aux_links
{
  padding: 2em;
  text-align: center;
}
  .aux_links .narrowed
  {
    flex-wrap: wrap;
    grid-row-gap: 1em;
    display: flex;
    justify-content: center;
  }
.aux_links a
{
  color: gray;
  background-color: #eee;
  margin-left: 2em;
  padding: 0.5em 2em 0.5em 2em;
  border-radius: 0.25em;
  height: 3em;
  font-style: normal;
  box-sizing: border-box;
  line-height: 1.7em;
  border: 1px solid gray;
  box-shadow: 0 0 var(--shadow_size) var(--shadow_color);
}


.sw_revision_table table
{
  width: 100%;
}

.sw_revision_table td
{
  padding-right: 1em;
  text-align: left;
  vertical-align: top;
  border-bottom:1px solid #ccc;
}
.sw_revision_table p
{
  margin: 0;
}
.sw_revision_table td:nth-child(1)
{
  white-space:nowrap;
}

  .sw_revision_table td:last-child
  {
    font-size: 0.8em;
    line-height: 1em;
    padding-top: 0.4em;
    padding-bottom: 0.8em;
    width: 100%;
  }

.sw_revision_table tr:first-child > td
{
  font-size: 1em;
  line-height: 1em;
  padding-bottom: 0.5em;
  font-weight: bold;
  padding-top: 0em;
}






.workstep li
{
  list-style: decimal;
  padding-bottom: 0.7em;
}

summary:focus
{
  outline-style: none;
}

.workstep > details
{
  background: #fcfcfc;
  margin-bottom: 1em;
  padding-bottom: 1em;
}


a.info_bubble
{
  position: relative;
  z-index: 1;
  color: gray;
  text-decoration: none;
  font-style: normal;
  font-weight: normal;
  line-height: 1.1em;
}
  a.info_bubble:before
  {
    content: "\1F6C8";
  }

  a.info_bubble:hover
  {
    z-index: 2;
  }

  a.info_bubble span
  {
    display: none;
  }

  a.info_bubble:hover span
  {
    display: block;
    position: absolute;
    width: 15em;
    left: -2em;
    border: 2px solid gray;
    background-color: #eee;
    color: #000;
    text-align: center;
    padding: 5px;
    font-size: 0.8em;
    bottom: 2em;
  }

    a.info_bubble:hover span .gui_button
    {
      display: initial;
      position: initial;
      width: inherit;
      left: inherit;
      border: inherit;
      background-color: initial;
      color: initial;
      text-align: inherit;
      padding: 0.1em;
      bottom: inherit;
    }



/* gallery */
.gallery
{
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

  .gallery.product_images
  {
    --max_items: 10;
    --image_spacing: 1rem;
    --button_size: 2.5em;
    height: var(--product_gallery_height);
    position: relative;
    /* padding: 0 0 1em 0; */
  }
    .gallery.product_images img[src$=".png"]
    {
      filter: drop-shadow(0.5em 0.5em 0.5em #888);
    }

  .gallery.menu
  {
    --max_items: 100;
    --image_spacing: 0.5rem;
    --button_size: 2.5em;
    position: relative;
  }

  .gallery > ul
  {
    width: 100%;
    margin: 0;
    list-style: none;
    display: grid;
    overflow: scroll;
    grid-template-columns: repeat(var(--max_items), auto);
    grid-template-rows: 1fr;
    grid-column-gap: var(--image_spacing);
    grid-row-gap: 0;
    /*scroll-snap-type: x proximity;*/
    scroll-padding: 1rem;
    position: absolute;
    top: 0;
    left: 0;
    transition: all 0.25s;
    /* background-color: var(--background_lightgray); */
    scrollbar-width: none; /* Firefox */
  }

  .gallery.product_images > ul
  {
    padding: 0;
  }
  .gallery.menu > ul
  {
    padding-left: calc(var(--button_size) + 3em);
    /* width: calc(100vw - 3em * 2 - var(--button_size) * 2); */
  }

  .gallery > ul::-webkit-scrollbar
  {
    width: 0px;
    height: 0px;
    background: transparent; /* make scrollbar transparent */
  }

  .gallery > ul:focus
  {
    outline: none;
  }

  .gallery ul > li
  {
    transition: all 0.25s;
    margin: 0 0 0 0;
    /* scroll-snap-align: center; */
    height: var(--product_gallery_height);
  }
    .gallery ul > li > div /* container for title and image */
    {
      position: relative;
      overflow: hidden;
      height: var(--product_gallery_height);
      text-align: center;
      background-color: var(--background_lightgray_shaded);
      /* scroll-snap-align: center; */
    }
  .gallery .active
  {
    scroll-snap-type: x;
  }
  .gallery.product_images img
  {
    height: var(--product_gallery_height);
    object-fit: cover;
    object-position: center;
    transition: all 0.5s;
  }
  .gallery.product_images div,
  .gallery.product_images div a
  {
    perspective: 90em;
    /* background-color: #888; */
  }
  .gallery.product_images .gallery_right img
  {
    /* transform: scale(0.8) translateY(-2em) scale3d(1,0.8,1) rotate3d(0, 1, 0, 30deg); */
    /* transform: scale3d(1,0.8,1) rotate3d(0, 1, 0, 30deg); */
  }
  .gallery.product_images .gallery_left img
  {
    /* transform: scale(0.8) translateY(-2em) scale3d(1,0.8,1) rotate3d(0, 1, 0, -30deg); */
    /* transform: scale3d(1,0.8,1) rotate3d(0, 1, 0, -30deg); */
  }
  .gallery.product_images .gallery_left img,
  .gallery.product_images .gallery_right img
  {
    /* -webkit-filter: contrast(50%); */
    /* filter: opacity(50%) blur(2px) saturate(0); */
    /* background-color: white; */
    /* border: solid 1px darkgray; */
    /* border-radius: 5em; */
  }
    .gallery div[role=button]
    {
      transition: all 0.25s;
      position: absolute;
      top: 50%;
      z-index: 10;
      width: var(--button_size);
      height: var(--button_size);
      padding: 0;
      border-radius: 50%;
      background-color: var(--background_company);
      box-shadow: 0 0 var(--shadow_size) var(--shadow_color);
      transform: translateY(-50%);
      text-align: center;
      vertical-align: middle;
      border-width: 0.15em;
      border-style: solid;
      border-color: white;
      opacity: 0.7;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }

    .gallery div[role=button] svg
    {
      height: 50%;
      transform: translateY(50%);
    }

    .gallery div[role=button]:hover
    {
      background-color: darkorange;
    }

  .gallery #gallery_prev
  {
    left: calc(var(--button_size)*0.5);
  }
  .gallery #gallery_next
  {
    right: calc(var(--button_size)*0.5);
  }


  .gallery .title
  {
    background-color: rgb(12 38 84 / 50%);
    /*positioned relative to parent div (container) */
    position: absolute;
    /* bottom margin is 0 so that it 
     coincides with container's bottom margin*/
    bottom: 0em;
    color: white;
    width: 100%;
    text-align: center;
    /*invisible because opacity is 0*/
    padding: 0.5em;
    font-weight: bold;
    margin: 0;
    box-sizing: border-box;
    font-style: normal;
  }

.gallery_left .title,
.gallery_right .title
{
  background-color: darkgrey;
}

.gallery_left .title
{
  /*transform: scale3d(1,1,1) rotate3d(0, 1, 0, 30deg);*/
}

.gallery_right .title
{
  /*transform: scale3d(1,1,1) rotate3d(0, 1, 0, -30deg);*/
}

  .gallery .inhibited
  {
    opacity: 0.1 !important;
  }


  .gallery .play_button
  {
    --play_button_size: 5em;
    background: var(--play_button_back_color);
    width: var(--play_button_size);
    height: calc(0.8 * var(--play_button_size));
    position: relative;
    /* margin-left: calc(50% - var(--play_button_size) / 2); */
    top: calc( 0px - (var(--product_gallery_height) + var(--play_button_size)) / 2);
    z-index: 3;
    border-radius: calc(var(--play_button_size) / 5);
    box-shadow: 0 0 var(
    --shadow_size) var(--shadow_color);
    margin: auto;
  }
    .gallery .play_button::after
    {
      content: '';
      display: inline-block;
      position: relative;
      top: 26%;
      left: 5%;
      border-style: solid;
      border-width: calc(var(--play_button_size) * 0.2) 0 calc(var(--play_button_size) * 0.2) calc(var(--play_button_size) * 0.4);
      border-color: transparent transparent transparent var(--play_button_symbol_color);
    }

nav.gallery
{
  background-image: linear-gradient(to right, #ffffff00, #dddddd40,#ffffff00);
}

/* product page main image */
.image_zoom_fit
{
  position: absolute;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  top: 50%;
  transform: translate(0,-50%);
}

.prod_main_image3
{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
  width: 100%;
  margin-bottom: 1em;
  background: linear-gradient(to bottom, #fff 0%,#ccc 100%);
}

.prod_main_image2
{
  padding-top: 40%;
}

.prod_main_image1
{
  position: relative;
  width: 100%;
  display: block;
}

.prod_aux_image
{
  width: 20em;
  float: left;
  margin-right: 1em;
  margin-top: 0.8em;
  margin-bottom: 0.3em;
}



.faq_question
{
  font-size: 130%;
  content: "F: "
}

  .faq_question:before
  {
    content: "F: "
  }

.faq_answer:before
{
  content: "A: "
}


/* street map */
iframe.street_map
{
  width: 100%;
  border: none;
  height: 30em;
  scrollbar-width: none; /* Firefox */
}



/* mobile menu */

iframe.mobile_menu
{
  border: none;
  width: 100%;
  scrollbar-width: none; /* Firefox */
}
nav.mobile_menu
{
  background-color: var(--background_darkgray);
}
  nav.mobile_menu ul
  {
    padding: 0.25em 0em 0.25em 1em;
    margin: 0;
    overflow: hidden;
  }
nav.mobile_menu li
{
  list-style: none;
  display: list-item;
  margin: 0em;
  padding: 0em 1.5em 0em 0em;
  text-align: left;
}

nav.mobile_menu li a
{
  text-decoration: none;
  color: #c0c0c0;
  font-style: normal;
  font-size: 200%;
}
.closebutton
{
  position: fixed;
  cursor: pointer;
  top: 0;
  right: 0;
  width: 5vh;
  height: 5vh;
  line-height: 2em;
  margin-top: 1.5em;
  margin-right: 1.5em;
  align-items: center;
  justify-content: center;
  display: inline-flex;
  box-shadow: 0 0 10px grey;
  border-radius: 50%;
  border-width: 0.2em;
  border-color: white;
  border-style: solid;
  transition: all 0.25s;
}
  .closebutton:hover
  {
    background-color: red;
  }


.important_text
{
  color: #FF0000;
}

.super_important_text
{
  text-decoration: underline;
  font-weight: bold;
}




@media screen and (max-device-width:801px)
{
  #intro_logo_wrapper
  {
    display: none;
  }

  .product_head /* head line area of product pages */
  {
    padding-left: var(--page_hor_margin);
  }

  .nomobile
  {
    display: none;
  }

  body
  {
    line-height: inherit;
    font-size: 100%;
    margin-bottom: 0;
  }

  .headerlogo
  {
    height: 2.5em;
  }

  .languageimage
  {
    height: 2.5em;
  }

  .headerbar
  {
    height: 50px
  }

  .menubutton
  {
    display: block;
    height: 2.5em;
    margin-right: 2.5em;
  }

  .headerbar .nav_wrapper
  {
    display: none;
  }

  .navbartop ul
  {
    padding: 0.25em 0em 0.25em 1em;
    margin: 0;
    height: inherit;
    overflow: hidden;
  }

  .navbartop li
  {
    list-style: none;
    display: list-item;
  }

    .navbartop li > ul
    {
      display: block;
    }

  .navbarMenu
  {
    width: 100%;
    float: none;
  }

  .navbar_search
  {
    width: 100%;
    float: none;
  }

  .thumb_block a
  {
    height: 6em;
    width: 6em;
  }

  .product_status
  {
    /* display: none;*/
  }

  h1
  {
    font-weight: normal;
    color: #404040;
    margin-bottom: inherit;
    margin-top: 0em;
  }

  .abstract
  {
    padding-bottom: inherit;
    line-height: inherit;
  }
  .prod_aux_image
  {
    float: none;
    visibility: collapse;
    height: 0px;
  }

  .featurelist
  {
    float: none;
    width: 100%;
    font-size: inherit;
    line-height: inherit;
    margin-left: 0em;
    margin-top: inherit;
  }

  .techdata td:first-child
  {
    display: none;
  }

  .techdatasub td:first-child
  {
    display: inherit;
  }

  .qrcode
  {
    display: none;
  }


  .iconTile
  {
    width: 80px;
    height: 70px;
    padding-top: 15px;
  }

    .iconTile img
    {
      margin-bottom: 0.5em;
    }

  .footerbar_screen
  {
    display: none;
  }

  /* search results */
  .grau-url
  {
    display: none;
  }

  .formsuche input
  {
    font-size: 100%;
  }

  .main_section
  {
    padding: 0.2em;
  }
  .gallery.menu > ul
  {
    padding-left: 0; /* brings buttons over the images rather than aside them */
    /* width: calc(100vw - 3em - var(--button_size));*/
  }

  .main_section iframe.menu_thumb_class,
  .main_section iframe.menu_thumb_class_random,
  .main_section iframe.menu_accessories,
  .main_section iframe.menu_applies_to
  {
    max-width: 100%;
  }

.variants table
  {
    font-size: 80%;
  }

  iframe.monitor_changes
  {
    display:none;
  }

}


article img
{
  max-width: 100%;
  margin: 0em 0em 1em 0em;
}


.warning:before
{
  margin-right: 0.5ch;
  content:"\26A0";
  font-weight: bold;
  color: orange;
  font-size: larger;
}

.warning:not(:empty):after
{
  margin-left: 0.5ch;
  content: "\26A0";
  font-weight: bold;
  color: orange;
  font-size: larger;
}