body {
  color: #fff;
  background-color: #000;
  font-family: MPLSC;
  font-size: 10px;
}

@font-face {
  font-family: MPLSC;
  src: url(../fonts/MyriadPro-LightSemiCn.otf);
}

.Wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  top: 0;
  left: 0;

}

a.arrow:link, a.arrow:visited {
  opacity: 0.2;
  background-color: black;
  border: none;
  color: #FFFFFF;
  padding: 6px 4px;
  text-align: center;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  text-decoration: none;
  cursor: pointer;
  display: inline-block;

}

a.arrow:hover, a.arrow:active {
  opacity: 0.9;
  background-color: #0a0a0a;
}

.Container {
  position: relative;
  width: 100%;
  padding-top: 75%;
  /* 4:3 Aspect Ratio */
}

.AspectRatio {
  width: 1000px;
  height: 750px;
}

.unit {
  width: 25px;
  height: 25px;
  display: inline-block;
  padding: 0px;
  margin: 0px;
  background-image: url("../imgs/gb25.jpg");
  background-repeat: no-repeat;
  background-position: center;
}

/* Top Border */
.TB0 {
  grid-area: 1 / 1 / 1/ 41;
  background-color: #fff;
}

/* Bottom Border */
.BB0 {
  grid-area: 30 / 1 / 30/ 41;
  background-color: #fff;
}

/* Left Border */
.LB0 {
  grid-area: 2 / 1 / 30/ 1;
  background-color: #fff;
}

/* Right Border */
.RB0 {
  grid-area: 2 / 40/ 30/ 40;
  background-color: #fff;
}


.Matrix3x4 {
  display: grid;
  grid-template-columns: repeat(40, 1fr);
  grid-template-rows: repeat(30, 1fr);
  grid-gap: 0px;
  /*
  border-top: 1px solid white;
  border-left: 1px solid white;
  */
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  height: 90vh;
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
  min-width: 1000px;
  min-height: 750px;
}

.Matrix3x4>div {
  text-align: center;
  overflow: hidden;
}

.Stage{
grid-area: 2 / 2 / 30/ 40;
z-index: -1;
position: relative;
top: 0
left: 0;
height: 90vh;
background-position: center; /* Center the image */
background-repeat: no-repeat; /* Do not repeat the image */
background-size: cover; /* Resize the background image to cover the entire container */
}

.ACenter{
display: flex;
justify-content: center;
align-items: center;
}

.Flag {
  grid-area: 4 / 1 / 7/ 1;
  z-index: 2;
}

.Banner {
  grid-area: 4 / 2 / 7/ 40;
  z-index: 2;
  font-size: 3em;
  justify-self: start;
  align-self: center;
}

.BannerR {
  grid-area: 4 / 2 / 7/ 40;
  z-index: 2;
  font-size: 3em;
  justify-self: end;
  align-self: center;
}

.BannerTxt {
  padding-left: 1em;
  padding-right: 1em;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 2.5em;
}

.ContTxt{

text-align: left;
padding:1em;

}
/*Left Content*/
.LC {
  grid-area: 7 / 2 / 30/ 21;
  z-index: 2;
  padding:1em;
}

/*Right Content*/
.RC {
  grid-area: 8 / 21 / 29/ 40;
  z-index: 2;
  padding:1em;
}

.LCMLM {
  grid-area: 7 / 1 / 30/ 21;
  z-index: 2;
  padding:1em;
}

.RCMLM {
  grid-area: 2 / 20 / 30/ 40;
  z-index: 2;
  background-image: url("../imgs/MLM_portrait.jpg");
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
  height:100%;
  width:auto;
}

.RCD2L {
  z-index:3;
  position: relative; top:28em; left:0;
  width:26em;
  height:40em;
}

.RCPM {
  z-index:3;
  position: relative; top:-12em; left:24.2em;
  width:26em;
  height:40em;
}

/*Full Content Area*/
.CA {
  grid-area: 8 / 3 / 29/ 39;
  z-index: 3;
}

.SA {
  grid-area: 2/ 2 / 30/ 40;
  z-index: 3;

}

/*IndexName*/
.IN {
  grid-area: 40 / 30 / 30/ 41;
  z-index: 3;
  justify-self: end;
  align-self: center;
}

.INTxt {
  padding-left: 1em;
  padding-right: 1em;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 1.6em;
  font-size:1.3em;
  border: 3px solid #fff;

}


/*PageNumber*/
.PN {
  grid-area: 40 / 40 / 30/ 41;
  z-index: 3;
  justify-self: center;
  align-self: center;
}
.PNTxt{
  margin:auto;
  display: flex;
  justify-content: center;
  align-items: center;
  height:1.6em;
  width:1.6em;
  font-size: 1.2em;
}

.IndexGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 10px;
}

.Hide {
  display: none;
}

.IGColTitle {
  grid-column: span 3 / auto;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 1.5em;
  font-size: 3em;
  font-weight: 100;
}

.IGColumns {
  grid-column: span 3 / auto;
  padding: 0.5em 0;
}

#IGColumns {
  display: inline-block;
  width: auto;
  -moz-column-count: 3;
  -moz-column-gap: 5px;
  -webkit-column-count: 3;
  -webkit-column-gap: 5px;
  column-count: 3;
  column-gap: 5px;
  column-fill: auto;
  text-align: left;
}

.Txt05 {
  font-size: 0.5em;
}

.Txt10 {
  font-size: 1em;
}

.Txt13 {
  font-size: 1.3em;
}

.Txt14 {
  font-size: 1.4em;
}

.Txt15 {
  font-size: 1.5em;
}

.Txt20 {
  font-size: 2em;
}

.Txt25 {
  font-size: 2.5em;
}

.Txt30 {
  font-size: 3em;
}

.Txt40 {
  font-size: 4em;
}

ol {
  margin-top: 0px;
}

a.outbound:link {
text-decoration: underline;
color: #ccc;
}

a.outbound:visited {
text-decoration: underline;
color: #ccc;
opacity: 0.8;
}

a.outbound:hover {
text-decoration: none;
color: #7d6e46;
background-color:#fff;
opacity: 0.5;
}

a.outbound:active {
text-decoration: none;
color: #7d6e46;
background-color:#fff;
opacity: 0.9;
}


.Flag {background-image: url("../imgs/flagl.png"); max-width: 100%; height: auto; background-size: contain; }

a.Flag:link, a.Flag:visited {
opacity: 0.5;
border: none;
-webkit-transition-duration: 0.4s;
transition-duration: 0.4s;
text-decoration: none;
cursor: pointer;
display: inline-block;
}

a.Flag:hover, a.Flag:active {
opacity: 1;
}

.email a { text-decoration: none;}
.email a:link { text-decoration: none; color:#fff;  }
.email a:visited { text-decoration: none;color:#fff;  }
.email a:hover { text-decoration: none;color:#fff; font-weight:bold; }
.email a:active { text-decoration: none; color:#7d6e46; }
.email a[href^="mailto"]:hover:after { content:  attr(title); position: absolute;
  top: 3ex;
  left: -.5ch; }


@media screen and (min-height: 974px) and (orientation: landscape) {

  body{
  font-size: 13px;
  }

  .AspectRatio {
    width: 1300px;
    height: 975px;
  }
  .unit {
    width: 32px;
    height: 32px;
    display: inline-block;
    padding: 0px;
    margin: 0px;
    background-image: url("../imgs/gb32.jpg");
    background-repeat: no-repeat,
    background-position: center;
  }

  .Txt10 {font-size: 1em;}
  .Txt14 {font-size: 1.4em;}
  .Txt15 {font-size: 1.5em;}
  .Txt20 {font-size: 2em;}
  .Txt30 {font-size: 3em;}
  .Txt40 {font-size: 4em;}
  }

  @media screen and (min-height: 1350px) and (orientation: landscape) {
    body{
    font-size: 18px;
    }

    .AspectRatio {
      width: 1800px;
      height: 1350px;
    }

    .unit {
      width: 45px;
      height: 45px;
      display: inline-block;
      padding: 0px;
      margin: 0px;
      background-image: url("../imgs/gb45.jpg");
      background-repeat: no-repeat,
      background-position: center;
    }


  .Txt10 {font-size: 1em;}
  .Txt15 {font-size: 1.5em;}
  .Txt20 {font-size: 2em;}
  .Txt30 {font-size: 3em;}
  .Txt40 {font-size: 4em;}

    }