div#container
{
   width: 1000px;
   position: relative;
   margin: 0 auto 0 auto;
   text-align: left;
}
body
{
   background-color: #7F7F7F;
   background-image: url('https://images.unsplash.com/photo-1628863353691-0071c8c1874c?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w2ODk0MXwwfDF8c2VhcmNofDV8fGNoZW1pY2FsfGVufDB8fHx8MTc3MjAwOTIwNHww&ixlib=rb-4.1.0&q=80&w=1080');
   background-attachment: fixed;
   background-position: center center;
   background-repeat: no-repeat;
   color: #000000;
   font-family: Arial;
   font-weight: normal;
   font-size: 13px;
   line-height: 1.1875;
   margin: 0;
   text-align: center;
}
#Shape2
{
   border-width: 0;
   vertical-align: top;
}
#wb_Shape2
{
   position: absolute;
   left: 432px;
   top: 6px;
   width: 137px;
   height: 32px;
   z-index: 2;
}
#Html1
{
   position: absolute;
   left: 1px;
   top: 44px;
   width: 100%;
   height: 700px;
   z-index: 1;
}
#Shape2
{
   width: 137px;
   height: 32px;
}
@media only screen and (max-width: 999px)
{
div#container
{
   width: 360px;
}
body
{
   background-color: #7F7F7F;
   background-image: url('https://images.unsplash.com/photo-1553413077-190dd305871c?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w2ODk0MXwwfDF8c2VhcmNofDJ8fHdhcmVob3VzZXxlbnwwfHx8fDE3NzIwMTQyMDd8MA&ixlib=rb-4.1.0&q=80&w=1080');
   background-attachment: fixed;
   background-position: center center;
   background-repeat: no-repeat;
}
#BuildWith1
{
   left: 0px;
   top: 720px;
   width: 88px;
   height: 31px;
   visibility: visible;
   display: inline;
}
#Html1
{
   left: 0px;
   top: 101px;
   width: 360px;
   height: 484px;
   visibility: visible;
   display: inline;
}
#wb_Shape2
{
   left: 112px;
   top: 8px;
   visibility: visible;
   display: inline;
   margin: 0;
}
}
  /* 1. สร้างกรอบครอบเพื่อคุมขนาด */
  .looker-container {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-top: 75%; /* ปรับอัตราส่วนความสูง (4:3) หรือตามความเหมาะสม */
    border: 1px solid #ddd;
    border-radius: 8px;
    -webkit-overflow-scrolling: touch; /* ให้การเลื่อนบน iOS ลื่นไหล */
  }

  /* 2. บังคับให้ iFrame ยืดเต็มกรอบ */
  .looker-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
  }

  /* 3. ปรับแต่งสำหรับหน้าจอมือถือโดยเฉพาะ */
  @media screen and (max-width: 600px) {
    .looker-container {
      padding-top: 150%; /* เพิ่มความสูงในแนวตั้งให้มองเห็นข้อมูลตารางได้มากขึ้น */
    }
  }
