/**************************************************************************************************
bgn breadcrumbs container *************************************************************************
**************************************************************************************************/
/* until 64em is 1024px */
   .container-breadcrumbs-div-cs
      {
   /* padding to prevent overlapping by header */   
      padding-top          : 4.54545rem;
      padding-bottom       : 0.9697rem;   
      }

/* from 64em between 120em is from 1024px between 1920px */
   @media print, screen and (min-width: 64em)
      {
      .container-breadcrumbs-div-cs
         {
      /* padding to prevent overlapping by header */
         padding-top          : 8.48485rem;
         padding-bottom       : 0.9697rem;
         }
      }

/* from 120em is 1920px */
   @media screen and (min-width: 120em)
      {
      .container-breadcrumbs-div-cs
         {
      /* padding to prevent overlapping by header */ 
         padding-top          : 8.48485rem;
         padding-bottom       : 0.9697rem;
         }
      }
/**************************************************************************************************
end breadcrumbs container *************************************************************************
**************************************************************************************************/

/**************************************************************************************************
bgn breadcrumbs ***********************************************************************************
**************************************************************************************************/ 
   section.section-hero .breadcrumbs-wrapper
      {
      position             : relative;
      z-index              : 3;
      -webkit-transform    : translateY(1.93939rem);
              transform    : translateY(1.93939rem);
      }

/* 64em = 1024px */
   @media print, screen and (min-width: 64em) 
      {
      section.section-hero .breadcrumbs-wrapper
         {
         -webkit-transform    : translateY(5.57576rem);
                 transform    : translateY(5.57576rem);
         }
      }

   section.section-hero .breadcrumbs-wrapper p span,section.section-hero .breadcrumbs-wrapper p a
      {
      color                : rgba(255, 255, 255, 1.0);
      }
   
   section.section-hero .breadcrumbs-wrapper .button-back
      {
      color                : #ffffff;
      border-color         : #ffffff;
      }

   section.section-overview .breadcrumbs-wrapper, section.section-team-overview .breadcrumbs-wrapper, section.section-compare .breadcrumbs-wrapper, section.section-form .breadcrumbs-wrapper, section.section-search .breadcrumbs-wrapper, section.section-account .breadcrumbs-wrapper, section.section-cart .breadcrumbs-wrapper
      {
   /* margin-bottom to create distance */
      margin               : 0 0 3.39394rem 0;
      }

   section.section-downloads-overview .breadcrumbs-wrapper
      {
      margin               : 0 0 3.39394rem 0;
      }

   section.section-downloads-overview .download-wrapper
      {
      padding              : 1.93939rem 0;
      }

   .breadcrumbs-wrapper p
      {
      margin               : 0;
      }

   .breadcrumbs-wrapper p span, .breadcrumbs-wrapper p a
      {
      font-size            : 0.848484rem;
      color                : #5F5F5F; 
      }

   .breadcrumbs-wrapper p span.breadrumb-divider
      {
      margin               : 0 0.424242rem;
      }

   @media print, screen and (max-width: 39.99875em)
      {
      .breadcrumbs-wrapper p span, .breadcrumbs-wrapper p a
         {
         font-size            : 0.75rem;
         color                : #5F5F5F; 
         }
      .breadcrumbs-wrapper p span.breadrumb-divider
         {
         margin               : 0 0.375rem;
         } 
      }

   .breadcrumbs-wrapper p a:hover 
      {
      text-decoration   : underline;
      }

/* only for woocommerce product list page */
   section.section-shop .plp-breadcrumb-bottom-margin-div-cs
      {
   /* margin between breadcrumb and back to parent category link */
      margin               : 0 0 3.39394rem 0;
      }

/* only for woocommerce product detail page */
   section.section-single-shop .breadcrumbs-wrapper
      {
      margin               : 0 0 0.9697rem 0; 
      }

/* checkout page */
   section.section-checkout .breadcrumbs-wrapper
      {
      padding              : 1.45455rem 0 3.39394rem 0;
      }

   @media print, screen and (min-width: 64em)
      {
      section.section-checkout .breadcrumbs-wrapper 
         {
         padding              : 2.90909rem 0 3.39394rem 0;
         }
      }
/**************************************************************************************************
end breadcrumbs ***********************************************************************************
**************************************************************************************************/

/**************************************************************************************************
bgn main ******************************************************************************************
**************************************************************************************************/
   main
      {
      margin-top           : 1rem;
      margin-bottom        : 3rem;   
      }

   main .main-content-header-cs
      {
      margin-bottom        : 3rem;   
      }
/**************************************************************************************************
end main ******************************************************************************************
**************************************************************************************************/

/**************************************************************************************************
bgn sections **************************************************************************************
**************************************************************************************************/
   main section,
   .main-section-cs 
      {
   /* reset general section padding */
      padding              : 0;
      }
/**************************************************************************************************
end sections **************************************************************************************
**************************************************************************************************/

/**************************************************************************************************
bgn text elements *********************************************************************************
**************************************************************************************************/
   main h1
      {
      font-size            : 1.454545rem;
      font-weight          : 700;
      line-height          : 1.25; 
      margin-bottom        : 1.212121rem;
      color                : #006d65;
      }
   main h2
      {
      font-size            : 1.212121rem;
      font-weight          : 700;
      line-height          : 1.25; 
      margin-bottom        : 0.969696rem;
      color                : #006d65;
      }
   main h3
      {
      font-size            : 1.090909rem;
      font-weight          : 700;
      line-height          : 1.25; 
      margin-bottom        : 0.909090rem;
      color                : #5f5f5f;
      }
   main h4
      {
      font-size            : 1rem;
      font-weight          : 700;
      line-height          : 1.25;
      margin-bottom        : 0.848484rem;
      color                : #5f5f5f;
      }
   @media print, screen and (min-width: 64em)
      {
      main h1
         {
         font-size            : 1.939393rem;
         }
      main h2
         {
         font-size            : 1.454545rem;
         }
      main h3
         {
         font-size            : 1.212121rem;
         }
      main h4
         {
         font-size            : 1.090909rem;
         }          
      }

   h2.h2_main_content 
      {
   /* default font size adopted from .h3 */    
      font-size            : 1.51515rem;
      font-weight          : 700; 
      line-height          : 1.4;
      margin-top           : 0;
      margin-bottom        : 1.69697rem;
   /* color adopted from .text-primary */   
      color                : #006d65;
      }
/* for screens wider than 64em (1024px with a standard setting of 16px per em) */
   @media screen and (min-width: 64em)
      {
    h2.h2_main_content
         {
      /* custom size similar to .h3 at this screen width */
         font-size            : 2.06061rem;
         }
      }
/* for screens wider than 120em (1920px with a standard setting of 16px per em) */
   @media screen and (min-width: 120em)
      {
      h2.h2_main_content
         {
      /* custom size similar to .h3 at this screen width */ 
         font-size            : 2.30303rem;
         }
      }

   .txt-paragraph-div-cs
      {
      max-width            : 32em; 
      }
/**************************************************************************************************
end text elements *********************************************************************************
**************************************************************************************************/

/**************************************************************************************************
bgn cards *****************************************************************************************
**************************************************************************************************/
   .card-div-cs
      {
      display              : flex;
      flex-direction       : column;
      justify-content      : space-between;
      background-color     : #ffffff;       
      }

   .card-link-a-cs
      {
      display              : flex;
      flex-direction       : column;
      text-decoration      : none;        
   /* inherits text color from parent, necessary otherwise text color will be changed */   
      color                : inherit;
   /* ensures the link takes the full width of the card */  
      width                : 100%;
   /* ensures the link takes the full height of the card */ 
      height               : 100%;
      }

   .card-div-cs picture
      {
      height               : auto;
      width                : 100%;
      }

   .card-aspect-square
      {
      flex-shrink          : 0;
      position             : relative;
      padding-bottom       : 50%;
      width                : 100%;
      }

   .card-aspect-square > *
      {
      position             : absolute;
      top                  : 0;
      left                 : 0;      
      height               : 100%;
      width                : 100%;
      object-fit           : cover;
      }

   .card-txt-content-div-cs
      {
      display              : flex;
   /* ensures text area takes remaining space */
      flex-grow            : 1;
      flex-direction       : column;
      justify-content      : space-between;
      padding              : 1rem;
      }

   .card-row-visit-page-div-cs
      {
      display              : flex;
      justify-content      : right;
   /* ensures visit page stays at bottom */
      margin-top           : auto;
      }
/**************************************************************************************************
bgn cards *****************************************************************************************
**************************************************************************************************/

/**************************************************************************************************
bgn comparison table ******************************************************************************
**************************************************************************************************/
/* < 1024px) */
   @media (max-width: 1023px)
      {
      .container-comparison-table-div-cs
         {
         display              : none;
         }
      }
   
/* > 1023px */
   @media (min-width: 1024px)
      {
      .comparison-table-div-cs
         {
         width                : 75%;
         }

      .cell-comparison-table-div-cs
         {
         display              : flex;
         justify-content      : center;
         align-items          : center;
         }

      .product_name.cell-comparison-table-div-cs, 
      .specs.cell-comparison-table-div-cs
         {
         padding              : 1rem;
         }      

   /* middle: every second cell in row */
      .product_name.cell-comparison-table-div-cs:nth-child(3n+2),
      .specs.cell-comparison-table-div-cs:nth-child(3n+2)
         {
         font-weight          : 600; 
         }      
   /* middle: every second cell in row */
      .cell-comparison-table-div-cs .current-product-span-cs
         {
         font-style           : italic; 
         }

   /* border left every second and thirth cell in a row */
      .cell-comparison-table-div-cs:nth-child(3n-1),
      .cell-comparison-table-div-cs:nth-child(3n)
         {
         border-left          : 0.0606rem solid rgb(159, 159, 159);
         }  

   /* every odd row */
      .cell-comparison-table-div-cs:nth-child(6n+1),
      .cell-comparison-table-div-cs:nth-child(6n+2),
      .cell-comparison-table-div-cs:nth-child(6n+3)
         {
         background-color     : rgb(255, 255, 255);       
         }     
   /* every even row */
      .cell-comparison-table-div-cs:nth-child(6n+4),
      .cell-comparison-table-div-cs:nth-child(6n+5),
      .cell-comparison-table-div-cs:nth-child(6n+6)
         {
         background-color     : rgb(233, 233, 233);       
         }        

   /* button */
      .btn-product-link.cell-comparison-table-div-cs
         {
         padding-top          : 1rem;
         }
      }
         
/* > 1023px < 1280px */
   @media (min-width: 1024px) and (max-width: 1279px)
      {
      .product_name.cell-comparison-table-div-cs 
         {
         font-size            : 1.21212rem;
         }
      }
/* > 1023px < 1280px */
   @media (min-width: 1024px) and (max-width: 1279px)
      {
      .product_name.cell-comparison-table-div-cs 
         {
         font-size            : 1.21212rem;
         }
      }
/* > 1279px < 1920 */
   @media (min-width: 1280px) and (max-width: 1919px) 
      {
      .product_name.cell-comparison-table-div-cs
         {
         font-size            : 1.21212rem;
         }
      }
/* > 1920 */
   @media (min-width: 1920px)
      {
      .product_name.cell-comparison-table-div-cs 
         {
         font-size            : 1.45455rem;
         }
      }
/**************************************************************************************************
end comparison table ******************************************************************************
**************************************************************************************************/

/**************************************************************************************************
bgn dual column flexible content section **********************************************************
**************************************************************************************************/
   .container-dual-column-flexible-content-section-cs 
      {
      margin-top              : 2rem;
      margin-bottom           : 2rem;
      padding-top             : 0;
      padding-bottom          : 0;
      }

   .container-dual-column-flexible-content-section-cs.intermediary-category
      {
      background-color        : #ffffff;
      }
         
   .row-dual-column-flexible-content-div-cs 
      {
      display                 : flex;
      flex-wrap               : wrap;
      gap                     : 2rem;
      justify-content         : space-between;
      
      margin-bottom           : 4rem;
      }

   .column-dual-column-flexible-content-div-cs 
      {
      flex                    : 1;
      max-width               : 35rem;
      
      margin-left             : auto;
      margin-right            : auto;
      }

/* mobile */    
   @media (max-width : 63.999em)
      {   
      .column-dual-column-flexible-content-div-cs.none
         {
         display                 : none;
         }
      }

/* desktop => 1024px */
   @media print , screen and (min-width : 64em) 
      {
      .container-dual-column-flexible-content-section-cs 
         {
         margin-top              : 4rem;
         }
         
      .column-dual-column-flexible-content-div-cs 
         {         
         width                   : 50%;
         max-width               : none;
         margin-left             : 0;
         margin-right            : 0;            
         }       
      }
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
bgn one column layout desktop +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ 
/* desktop => 1024px */
   @media print , screen and (min-width : 64em) 
      {     
   /* intermediary category row */
      .container-dual-column-flexible-content-section-cs.intermediary-category .row-dual-column-flexible-content-div-cs.one-column
         {
           
         justify-content         : center;
         }

   /* intermediary category column */         
      .container-dual-column-flexible-content-section-cs.intermediary-category .row-dual-column-flexible-content-div-cs.one-column .column-dual-column-flexible-content-div-cs
         {
         display                 : flex;
         justify-content         : center;          
         }
      }      
         
/* desktop => 1024px < 1200px */
   @media print , screen and (min-width : 64em) and (max-width : 74.999em)
      {
      .row-dual-column-flexible-content-div-cs.one-column .inner-column-dual-column-flexible-content-div-cs
         {         
         max-width               : 35rem;
         }
      }

/* desktop => 1200px */
   @media print , screen and (min-width : 75em) 
      {
   /* product list page category row */
      .container-dual-column-flexible-content-section-cs.product-list .row-dual-column-flexible-content-div-cs.one-column
         {
         display                 : flex;   
         justify-content         : right;           
         margin-left             : -0.48485rem;
         margin-right            : -0.48485rem;            
         }

   /* product list page category column */         
      .container-dual-column-flexible-content-section-cs.product-list .row-dual-column-flexible-content-div-cs.one-column .column-dual-column-flexible-content-div-cs
         {
         flex                    : none;
         margin-left             : 0.48485rem;
         margin-right            : 0.48485rem; 
         padding-left            : 1.45455rem;
         width                   : calc(75% - 0.9697rem);
         max-width               : none;       
         }
         
      .row-dual-column-flexible-content-div-cs.one-column .inner-column-dual-column-flexible-content-div-cs
         {
         max-width               : 40rem;
         }         
      }
         
/* desktop => 1440px */
   @media print , screen and (min-width : 90em) 
      {
      .row-dual-column-flexible-content-div-cs.one-column .inner-column-dual-column-flexible-content-div-cs
         {
         max-width               : 45rem;
         }         
      }         
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
end one column layout desktop +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/* desktop => 1920px */
   @media print , screen and (min-width : 120em) 
      {      
      .row-dual-column-flexible-content-div-cs.two-columns 
         {
         gap                     : 6rem;
         justify-content         : flex-start;
         margin-bottom           : 6rem;
         max-width               : 88rem;
         }
         
      .column-dual-column-flexible-content-div-cs
         {
         max-width               : 48rem;
         }    
         
       .column-dual-column-flexible-content-div-cs.right
         {
         margin-left             : 0;
         }

      .inner-column-dual-column-flexible-content-div-cs
         {         
         max-width               : 40rem;
         }
      }

/* mobile styles */    
   @media (max-width : 63.999em)
      {
      .row-dual-column-flexible-content-div-cs 
         {
         flex-direction          : column;
         }

      .row-dual-column-flexible-content-div-cs.mobile-left-first .column-dual-column-flexible-content-div-cs.left 
         {
         order                   : 1;
         }

      .row-dual-column-flexible-content-div-cs.mobile-left-first .column-dual-column-flexible-content-div-cs.right 
         {
         order                   : 2;
         }

      .row-dual-column-flexible-content-div-cs.mobile-right-first .column-dual-column-flexible-content-div-cs.left 
         {
         order                   : 2;
         }

      .row-dual-column-flexible-content-div-cs.mobile-right-first .column-dual-column-flexible-content-div-cs.right 
         {
         order                   : 1;
         }
      }  
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
bgn image alignment +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
   .column-dual-column-flexible-content-div-cs.image-block .inner-column-dual-column-flexible-content-div-cs
      {
      display                 : flex;
      
      height                  : 100%; 
      }

   .column-dual-column-flexible-content-div-cs.image-block.align-horizontal-left .inner-column-dual-column-flexible-content-div-cs
      {
      justify-content         : left;
      }

   .column-dual-column-flexible-content-div-cs.image-block.align-horizontal-center .inner-column-dual-column-flexible-content-div-cs
      {
      justify-content         : center;
      }

   .column-dual-column-flexible-content-div-cs.image-block.align-horizontal-right .inner-column-dual-column-flexible-content-div-cs
      {
      justify-content         : right;
      }

   .column-dual-column-flexible-content-div-cs.image-block.align-vertical-top .inner-column-dual-column-flexible-content-div-cs
      {
      align-items             : flex-start;
      }

   .column-dual-column-flexible-content-div-cs.image-block.align-vertical-middle .inner-column-dual-column-flexible-content-div-cs
      {
      align-items             : center;
      }

   .column-dual-column-flexible-content-div-cs.image-block.align-vertical-bottom .inner-column-dual-column-flexible-content-div-cs
      {
      align-items             : flex-end;
      }
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
end image alignment +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
   .column-dual-column-flexible-content-div-cs h1
      {
      font-size               : var(--h2-large-font-size);
      font-weight             : bold;
      line-height             : var(--h2-default-line-height);
      margin-bottom           : var(--h2-default-margin-bottom);

      color                   : var(--color-primary-dark-green);        
      }

   .column-dual-column-flexible-content-div-cs h1 a
      {
      color                   : var(--color-primary-dark-green);        
      }
         
   .column-dual-column-flexible-content-div-cs h2
      {
      font-size               : var(--h2-large-font-size);
      font-weight             : bold;
      line-height             : var(--h2-default-line-height);
      margin-bottom           : var(--h2-default-margin-bottom);

      color                   : var(--color-secondary-dark-blue);       
      }

   .column-dual-column-flexible-content-div-cs h2 a
      {
      color                   : var(--color-secondary-dark-blue);         
      }

   .column-dual-column-flexible-content-div-cs h3
      {
      font-size               : var(--h3-large-font-size);
      font-weight             : bold;
      line-height             : var(--h3-default-line-height);
      margin-bottom           : var(--h3-default-margin-bottom);

      color                   : var(--color-primary-black);       
      }

   .column-dual-column-flexible-content-div-cs h3 a
      {
      color                   : var(--color-primary-black);         
      }

   .column-dual-column-flexible-content-div-cs h4,
   .column-dual-column-flexible-content-div-cs h5,
   .column-dual-column-flexible-content-div-cs h6
      {
      font-size               : var(--h4-large-font-size);
      font-weight             : bold;
      line-height             : var(--h4-default-line-height);
      margin-bottom           : var(--h4-default-margin-bottom);

      color                   : var(--color-primary-black);       
      }

   .column-dual-column-flexible-content-div-cs h4 a,
   .column-dual-column-flexible-content-div-cs h5 a,
   .column-dual-column-flexible-content-div-cs h6 a
      {
      color                   : var(--color-primary-black);         
      }

   .column-dual-column-flexible-content-div-cs
      {
      font-size               : var(--p-large-font-size);
      color                   : var(--color-primary-black);
      }

   .column-dual-column-flexible-content-div-cs p,
   .column-dual-column-flexible-content-div-cs ul,
   .column-dual-column-flexible-content-div-cs ol
      {
      font-size               : var(--p-large-font-size);
         
      margin-bottom           : 1rem;
         
      color                   : var(--color-primary-black);
      }

   .column-dual-column-flexible-content-div-cs p:last-child,
   .column-dual-column-flexible-content-div-cs ul:last-child,
   .column-dual-column-flexible-content-div-cs ol:last-child
      {
      margin-bottom           : 0rem;
      }

   .column-dual-column-flexible-content-div-cs .inner-column-dual-column-flexible-content-div-cs li
      {
      list-style              : disc;
      
      height                  : 100%; 
      }
/**************************************************************************************************
end dual column flexible content section **********************************************************
**************************************************************************************************/