@charset "utf-8";
/* CSS overlay banner */

     .overlay1 {
        width: 6em;
        height: 1.9em;
        line-height: 1.8em;
        position: absolute;
        top: 0%;
        left: 86%;
        margin-top: 0%;
        margin-left: 0%;
        background-color: #0057b7;
        text-align: center;
        color: #EEE;
        letter-spacing: 0.1em;
        z-index: 2; 
      }
     .overlay2 {
        width: 6em;
        height: 1.9em;
        line-height: 1.7em;
        position: absolute;
        top: 1.9em;
        left: 86%;
        margin-top: 0%;
        margin-left: 0%;
        background-color: #ffd700;
        text-align: center;
        color: #111;
        letter-spacing: 0.1em;
        z-index: 2;
      }
     .overlay3 {
        width: 20rem;
        height: 2.5em;
        line-height: 2.5em;
        position: absolute;
        top: 3.1rem;
        left: auto;
        right: 16%;
        margin-top: 0%;
        margin-left: 0%;
        padding-left: 0%;
        padding-right: 0%;
        background-color: #CCC;
        text-align: center;
        color: #111;
        letter-spacing: 0.1em;
        z-index: 1; 
      }
      .overlay-A {
        width: 6em;
        height: 5em;
        line-height: 1.7em;
        position: absolute;
        top: 10em;
        left: 86%;
        margin-top: 0%;
        margin-left: 0%;
        background-color: transparent;
        text-align: center;
        color: #111;
        letter-spacing: 0.1em;
        z-index: 2;
      }
      .overlay-B {
        width: 6em;
        height: 5em;
        line-height: 1.7em;
        position: absolute;
        top: 16em;
        left: 86%;
        margin-top: 0%;
        margin-left: 0%;
        background-color: transparent;
        text-align: center;
        color: #111;
        letter-spacing: 0.1em;
        z-index: 2;
      }

      .overlay-C {
        width: 6em;
        height: 5em;
        line-height: 1.7em;
        position: absolute;
        top: 22em;
        left: 86%;
        margin-top: 0%;
        margin-left: 0%;
        background-color: transparent;
        text-align: center;
        color: #111;
        letter-spacing: 0.1em;
        z-index: 2;
      }

.overlay1 a         {color: #ffffff !important; text-decoration: none; filter: grayscale(0%) opacity(90%); }
.overlay1 a:hover   {color: #ffffff !important; text-decoration: none; filter: grayscale(0%) opacity(90%); }
.overlay1 a:visited   {color: #ffffff !important; text-decoration: none; filter: grayscale(0%) opacity(90%); }
.overlay2 a         {color: #0050b0 !important; text-decoration: none; filter: grayscale(0%) opacity(90%); }
.overlay2 a:hover   {color: #0050b0 !important; text-decoration: none; filter: grayscale(0%) opacity(90%); }
.overlay2 a:visited   {color: #0050b0 !important; text-decoration: none; filter: grayscale(0%) opacity(90%); }
.overlay3 a         {color: #111 !important; text-decoration: underline; filter: grayscale(0%) opacity(90%); }
.overlay3 a:hover   {color: #111 !important; text-decoration: none; filter: grayscale(0%) opacity(90%); }
.overlay3 a:visited   {color: #111 !important; text-decoration: underline; filter: grayscale(0%) opacity(90%); }


@media (prefers-color-scheme: dark) { 

     .overlay3 {
        color: #aaa;
        background-color: #333; 

      }
.overlay3 a         {color: #aaa !important; text-decoration: underline; filter: grayscale(0%) opacity(90%); }
.overlay3 a:hover   {color: #aaa !important; text-decoration: none; filter: grayscale(0%) opacity(90%); }
.overlay3 a:visited   {color: #aaa !important; text-decoration: underline; filter: grayscale(0%) opacity(90%); }
 }


 @media screen and (max-width: 1580px) { 

  .overlay-A, .overlay-B, .overlay-C, .overlay1, .overlay2 {
    left: 240%;
  }



  } 