html, body { color: #555555; font-family: 'Calibri Light'}
        h1, h2, h3, h4, h5, h6 { font-family: 'Archivo', 'Franklin Gothic Medium', Arial, sans-serif; color: #222222;  }
        h1 { margin-top: 1em; }
        .h-prod-cat { color:#27417D; width:100%;}
        a { color: #666666; } /* 27417d */
        .a-darkblue { color: #27417D; }
        
        ul { margin:0;}
        .a-noline:hover { text-decoration:none;}
        
        hr { border-top: 1px solid #BBBBBB;}
        a:hover { color: #27417D; text-decoration:underline; text-decoration-color: #d52229; text-decoration-thickness:2.5px;}
        @font-face {
           font-family: 'Abel Regular'; /*a name to be used later*/
           /*src: url('http://www.wemco-usa.com/Abel-Regular.ttf'); /*URL to font*/
           src: url('Abel-Regular.ttf'); /*URL to font*/
        }
        @font-face {
          font-family: 'Archivo'; /*a name to be used later*/
          /*src: url('http://www.wemco-usa.com/Abel-Regular.ttf'); /*URL to font*/
          src: url('Archivo-Medium.ttf'); /*URL to font*/
       }
        .a-reverse { color: #4EAD5F; }
        .a-reverse:hover { color: #27417D; }
        .side-margins { background-color: #dddddd; }

        .prev-price { text-decoration:line-through;}
        .sale-price { color: #CC0000; font-weight:bold;}
 

        .a-special:hover { font-weight: 500; }
        .red-underline {  color: #27417D; /* text-decoration:underline; text-decoration-color: #d52229; text-decoration-thickness: 4px; */}


        @media (min-width: 576px) /*and (max-width: 767.98px)*/
        {
          .banner-top { height: 220px; }
        }
        @media (min-width: 768px) /*and (max-width: 991.98px)*/
        {
          .banner-top { height: 220px; }
        }
        @media (min-width:992px) /*and (max-width: 1199.98px)*/
        {
          .banner-top { height: 520px; }
        }
        @media (min-width: 1200px) 
        {
          .banner-top { height: 520px; }
        }

        .banner-top {
            background-image: linear-gradient(0deg, #1E3666,#0C213A);
            background-size: 3840px 680px;
            background-repeat: no-repeat;

        }

        .banner-top-short {
            background-image: linear-gradient(0deg, #1E3666,#0C213A);
            background-size: 3840px 180px;
            background-repeat: no-repeat;
            height: 160px;
        }
        
        #header-logo {
            margin:auto;
            padding-left: 0px; 
            padding-top: 8px;
        }

        #header-aux {
            display:flex;
            flex-shrink: 1;
            flex-basis: 100%;      
            align-items: center;
            justify-content: flex-end;
        }

        #header-top {
            display:flex;
        }

        #header-menu { 
          padding-top: .5em;
            font-size: 18pt;        
            font-family:'Questrial-Regular','Gill Sans', 'Gill Sans MT', 'Calibri', 'Trebuchet MS', sans-serif; /*a name to be used later*/
           /*src: url('http://www.wemco-usa.com/Abel-Regular.ttf'); /*URL to font*/
            src: url('Questrial-Regular.ttf'); /*URL to font*/
            color: #EEEEEE;
        }
        .header-menu-toplevel
        {
          color:#FFFFFF;
        }
        .header-menu-toplevel:hover
        {
          color:#FFFFFF;
        }
      
        #header-menu a {
            
        }
        #header-menu a:hover {
            /*color: #73B580;*/
            text-decoration: underline; 
            text-decoration-color: #d52229;
            text-decoration-thickness: 3px;
        }
        .header-menu-item {
            padding: 0 2em;
        }
        
        .header-menu-item-dropdown .dd-content {
          display:none;
        }
        .header-menu-item-dropdown:hover .dd-content {
          display: block;
          position:absolute;
          text-align:center;
          border: #27417D 1px solid;
        }
        .dd-content a {
          display:block;
          /*background-color: #0C213A;*/
          background-color: #FFFFFF;
          color:#27417D;
          font-weight:100;
          font-size:14pt;
          padding-left:1.5em;
          padding-right:1.5em;
          padding-top:.2em;
          padding-bottom:.2em;
          border-bottom: 1px solid #FFFFFF;
          text-decoration:none !important;
        }
        .dd-content a:hover {
          background-color: #27417D;
          text-decoration-color:#4668B1;
          color:white;
          
        }
        #dd-menu-items { text-decoration:none;}

        .responsive-item { background-color:#1E3666; }
        .responsive-item a { color:white; font-size:16pt;}
        .responsive-item a:hover { color:#4EAD5F;font-weight:bold;}

        #search-box {
        }
        .hero-heading {
            font-size: 35pt;
            color: white;
            font-family: 'Archivo';
            font-style:italic;
        }

      .font-headings { font-family: 'Abel Regular';}

      .gray-box-w-grn-stripe
      {
        background-color: #E0E2E3; color:#0C213A;
        /*background-image: linear-gradient(0deg, #73B580,#73B580);*/
        background-size: 1920px 80px;
        background-position: center center;
        background-repeat: no-repeat;
        font-size:20pt;
        font-family:'Archivo';
        
      }
      .gray-box-w-grn-stripe h3 {
      color: #0C213A;
      margin: 0;
      }

      .nav-bar-button-image img{
        
        width:auto;       
      }

      #footer {
        background-color: #233560;
        color:#FFFFFF;
        
        font-size: 10pt;
        padding-top: 2em;
      }



      .table-bordered {
        border: 1px solid #BBBBBB;
        border-collapse:collapse;
        }
      .table-bordered thead {
       background-color: #DDDDDD;
       padding: .2em;
       font-weight:bold;
     }   
     .table-bordered td {
       border: 1px solid #BBBBBB;
       padding: .4em;
       line-height:1;
     }
     .table-contacts td {
      height:2em;
      font-size:12pt;
     }
     .table-prod-page {
      margin:auto;
      text-align:left;
      margin-top: .5em;
     }
     .list-prod-page {
      margin:auto;
      text-align:left;
     }


     .h-banded{
      width:70%;
      background-color: #eeeeee;
      text-align: center;
      margin:auto;
      margin-top:1em;
     }
     

     .table-left-menu a {
        color: #27417D;
      }
      .table-left-menu a:hover { color: #4EAD5F;}
      .table-catalog { width: 65%; border-collapse: collapse; border:2px solid #FFFFFF; }
      .table-catalog a:hover { background-color:#EEEEEE; width:100%; }
      /*.table-catalog td:hover { border: 2px solid #FFFFFF; background-color: #EEEEEE;}*/
      .catalog-category { font-size: 20pt; font-weight: bold; background-color: #EEEEEE;}

      /* left menus on catalog pages are nested in 2 tables, therefore we use the extra "table" after class name for those tables */
      .table-catalog-left-top-menu table { border: 3px solid white; border-collapse: collapse; background-color:#EAEAEA; width: 160px;}
      .table-catalog-left-top-menu table td { border: 3px solid white; padding: .5em; border-collapse: collapse; }
      .table-catalog-left-top-menu table a { color: #27417D; font-size: 14pt; }
      .table-catalog-left-top-menu table p { color: #BBBBBB; font-size: 14pt; }
      /* menu title */
      .table-catalog-left-top-menu a { color: #27417D; font-size: 18pt; text-align:center; margin:auto;}
      .table-catalog-left-top-menu { text-align:center; }
      .table-catalog-page-wrapper-table { margin-left:auto; margin-right:auto; width:950px;}
/* self referring link table 
      <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#FFFFFF" width="160">




////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// PRODUCTS AND CATEGORIES 
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  /* product categories) **************************************/
  .card-prod-cat {
    display:flex;         
    margin-top: 1em; margin-bottom: 1em;
    justify-content:center; flex-wrap:wrap;
  }
  .card-prod-cat-item { 
    /*min-width: 250px;*/
    margin-right: .2em;
    margin-left: .2em;
    background-color: #DDDDDD;       
    border-radius:10px; 
    padding:.2em;
    
  }
  .card-prod-cat-item img { width: 100%;}
  .card-prod-cat-item a { font-size: 16pt; font-weight: 600; color: #888888; Font-family: 'Archivo', 'Gill Sans', 'Gill Sans MT', 'Calibri', 'Trebuchet MS', sans-serif;}
  .card-prod-cat-item a:hover { text-decoration: underline; color: #27417D; text-decoration-color: #d52229; text-decoration-thickness: 3px; }
  .card-prod-cat-item:hover { background-color: #dce6f0;}
  

  .card-prod-hscroll-lscroll {
    display:flex;
    width:25px;
    background-image: url('/images/nav/arrow-left.svg'); 
    background-size:25px;
    background-position:center center;
    background-repeat: no-repeat;
    margin-left: .5em; margin-right: .5em;
    min-width:25px;
    height:200px;
  }
  .card-prod-hscroll-rscroll {
    display:flex;
    width:25px;
    background-image: url('/images/nav/arrow-right.svg'); 
    background-size:25px;
    background-position:center center;
    background-repeat: no-repeat;
    margin-left: .5em; margin-right: .5em;
    min-width:25px;
    height:200px;
  }

  /* sub h-scroll items (products for this category) **************************************/
  .card-prod-hscroll {
    display:flex;         
    overflow-x:auto;
    flex-shrink:4;
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
  }
  /*::-webkit-scrollbar {
    width: 0px;
    background: transparent; 
  }*/
  .card-prod-hscroll-item { 
    min-width: 200px;
    margin-right: 1em;
    margin-left: 1em;
    background-color: #eaeaea;       
    border-radius:10px; 
    padding:.3em;
    flex-basis:200px;
    flex-grow:0;
  }
  .card-prod-hscroll-item:hover { background-color:#dce6f0;}
  .card-prod-hscroll img { width: 150px;}
  .card-prod-hscroll a { font-size: 12pt; font-family:'Archivo','Franklin Gothic Medium', Arial, sans-serif;}
  
  .menu-prod-cat
  {
    display:flex;
  }
  .menu-prod-cat ul{
    list-style-type: none;
    font-size: 16pt;
    text-align:left;
    /*border-right: 1px solid #BBBBBB;*/
    margin-right: 2em;
    padding-right:1em;
  }
  .menu-prod-cat span a { 
    font-family:'Franklin Gothic Medium', Arial, sans-serif;
    font-size: 18pt;
    text-decoration:underline;
    font-variant:small-caps;
    color:#27417D;
    text-decoration-color: #d52229;
  }
  .menu-prod-cat li{
    list-style-image: url('/images/nav/arrow-right-red.svg'); 

    /*font-family: 'Gill Sans', 'Gill Sans MT', 'Calibri', 'Trebuchet MS', sans-serif;*/
    font-family:'Franklin Gothic Medium', Arial, sans-serif;
    color: #27417D;
    margin:.5em;
    font-variant:small-caps;
    padding-left: 1em; padding-right:1em;
  }
  .menu-prod-cat li:hover {
    background-color: #27417D;
    color: #eeeeee;
  }
  .cat-and-prod-wrapper { display:flex; overflow:auto;}
  .prod-right-wrapper { display:flex; flex-direction:column; overflow:auto; flex-basis:75%; }
  .prod-right-products-wrapper { display: flex;}
  .grey-text { color:#777777;}