.from-run {
  width: 100%;
  float: left;
  background-color: #F0F0F0;


}
.tr {
  
  font-size: 70px;
  font-weight: 600;
  float: left;
  width: 20%;
  font-family: 'Arial Black', 'Arial Bold', Gadget, sans-serif;
}
.t5{
      font-family: 'LaoSangamMN', 'Lao Sangam MN';
    font-size: 24px;
    color: #919191;
    word-wrap: break-word;
}
a img {border:0px;}
body {margin: 0px auto; font-family: 'Kanit', sans-serif;background: #FEFFFF}


#customers td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
}
.formrun{width: 85%;margin: auto;    color: #000;padding: 70px 0px;}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #04AA6D;
  color: white;
}
.container{width: 100%;}
.form-container{
  
  background-color: #F0F0F0;}
  .branlogo{width: 100%;color: #fff;text-align:center;padding: 10px 0px; background: #4d4d4d;}
  .textLogo{    position: relative;
    margin: 1px;
    /* align-items: center; */
    top: -19px;
    font-family: 'Arial-BoldMT', 'Arial' ,sans-serif;
    font-size: 23px;
    font-weight: 700;}

    .bg{   left: 0px;
      top: 310px;
      width: 100%;
     
      z-index: 92;
      font-family: 'LaoSangamMN', 'Lao Sangam MN';
      font-size: 24px;
      color: #5D5D5D;
      word-wrap: break-word;
      text-align: center;}
      .textlot{padding: 15px;}
      .t5{}
      .SlideShow {
        position: relative;
        overflow: hidden;
        width: 100%;
        /*height: 300px;*/
      }

      .SlideShowfood {
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 90px;
      }

      .SlideShow-slides {
        display: flex;
        flex-flow: row-nowrap;
        /*height: 100%;*/
        width: 100%;
        transition: transform 0.7s; /* Animation duration here */
      }

      .SlideShow-item {
        min-width: 100%;
      }

      .SlideShow-item>img {
        display: block;
        width: 100%;
    /*height: 100%;
    object-fit: cover;*/
  }
.text-l{padding: 8px 0px;}
.text-h{padding: 1px 0px;}
  .SlideShow-btn {
    position: absolute;
    top: 0;
    z-index: 1;
    width: 50px;
    height: 100%;
    background: rgb(255 255 255 / 0%);
    opacity: 0.5;
    border: 0;
    cursor: pointer;
  }

  .SlideShow-btn:hover {
    opacity: 1;
  }

  .SlideShow-btn.next {
    right: 0px;
  }

  .text-lotm{

    width: 100%;text-align: center;float: left;margin-bottom: 0px
  }
  #form-list{background-color: #F0F0F0;}
  .t1{
   font-family: 'LaoSangamMN', 'Lao Sangam MN';
   font-size: 24px;
   color: #5D5D5D;
   word-wrap: break-word;
   padding: 10px;
   border-bottom: 2px solid #dddddd;
    width: 58%;
    margin: auto;
    margin-bottom: 15px;
 }
 .t9{font-family: 'Helvetica' ,sans-serif!important;
    font-size: 12px!important;
    word-wrap: break-word!important;color: #333!important;width: 80px!important;margin-left: 5px;}
 .t2{font-family: 'LaoSangamMN', 'Lao Sangam MN';
 font-size: 14px;
 color: #ededeb;
 word-wrap: break-word;}
 .t3{       font-family: 'Montserrat-Bold';
    font-size: 26px;
    font-weight: 700;
    color: #616161;
    background-color: #FEFFFF;
    word-wrap: break-word;padding: 5px}
    .foolimg{    height: 40px;
    width: 41px;}
    .imgfool{    width: 8%;
    margin: auto;
    padding: 10px;}
    .text-img{    font-family: 'LaoSangamMN', 'Lao Sangam MN';
    font-size: 18px;
    color: #FEFEFE;
    letter-spacing: 0.15em;
    word-wrap: break-word;
    text-align: center;    margin-top: -10px;}
 .t8{    font-family: 'Montserrat-Bold', 'Montserrat';
 font-size: 20px;
 /* font-weight: 700; */
 color: #f3f3ed;
 background-image: url(img/bg.png);
 word-wrap: break-word;
 padding: 11px;
 border: 3px solid #919191;
 font-family: 'LaoSangamMN', 'Lao Sangam MN';
 font-size: 36px;
 color: #FEFEFE;
 letter-spacing: 0.23em;
 word-wrap: break-word;}
 table, td, th {  
  border: 2px solid #919191;
  text-align: left;
}
.tal{    border: 2px solid #e4e4e4;}
.tcss{padding: 3px;}
.trs:nth-child(even) {background-color: #9dae9f;}
 .ty{font-family: 'LaoSangamMN', 'Lao Sangam MN';
font-size: 14px;
color: #080808;
word-wrap: break-word;
width: 30%;
text-align: center;
padding: 5px;}
.dn{    font-family: 'LaoSangamMN', 'Lao Sangam MN';
    font-size: 14px;
    color: #5E5E5D;
    background-color: #FEFEFF;
    word-wrap: break-word;
    text-align: center;}
table {
  border-collapse: collapse;
  width: 100%;
}
.from-l{
  width: 100%;float: left; position: relative;padding: 8px 0px;}
  .thk{width: 25%;float: left;}
  .shape_10 {
    filter: drop-shadow(0px 6px 3px rgba(0,0,0,0.75));
    background-color: #EFEFEF;
    opacity: 1.00;
    filter: alpha(opacity=100);
    border-radius: 11px;
    left: 16px;
    top: 668px;
    width: 93px;
    height: 27px;
    z-index: 10;
    font-family: 'Helvetica' ,sans-serif;
    font-size: 14px;
    word-wrap: break-word;
    
}
.trd{font-family: 'Helvetica' ,sans-serif;
    font-size: 12px!important;
    word-wrap: break-word;
    width: 80px!important;margin-left: 5px;}
.fool{left: 0px;
        left: 0px;
    top: 1417px;
    width: 100%;
    height: 98px;
    /* z-index: 7; */
    float: left;}
    .img-fool{width: 100%;}

/*th, td {
  padding: 15px;
  }*/
.t4{    font-family: 'LaoSangamMN', 'Lao Sangam MN';
    font-size: 18px;
    color:#959292;
    word-wrap: break-word;}
.loglist{font-family: 'LaoSangamMN', 'Lao Sangam MN';
    font-size: 16px;
    color: #5E5E5D;
    background-color: #f0f0f0;
    word-wrap: break-word;text-align: center;width: 125px;}
  .t-n{        font-family: 'LaoSangamMN', 'Lao Sangam MN';
  font-size: 22px;
  word-wrap: break-word;    padding: 5px;
  text-align: center;}
  .t-nn{ font-family: 'LaoSangamMN', 'Lao Sangam MN';
    font-size: 16px;
    font-weight: 700;
    color: #616161;
    background-color: #FEFFFF;
    word-wrap: break-word;text-align: center;}
      .tdlot{
        font-family: 'LaoSangamMN', 'Lao Sangam MN';
        font-size: 22px;
        word-wrap: break-word;
        padding: 5px;
        text-align: center;

      }
      .imgd{    /* display: block; */
    opacity: 1;
    min-width: 0px;
    min-height: 0px;
    max-width: none;
    max-height: none;
    transform: translate3d(0px, 0px, 0px);
    max-width: 100%;
    height: 130px;
    /* position: absolute; */
    top: 0px;
    object-fit: cover;
    left: -8px;}
      .imglogo-d{width: 55px;
        height: 54px;
        margin: 10px;}
        .t-hean{font-family: 'LaoSangamMN', 'Lao Sangam MN';
        font-size: 21px;
        color: #FEFEFE;
        letter-spacing: 0.10em;
        word-wrap: break-word;letter-spacing: 0;}
        
        img {vertical-align: middle;}

        /* Slideshow container */
        .slideshow-container {
              width: 100%;
          position: relative;
          margin: auto;
        }

        /* Caption text */
        .text {
          color: #f2f2f2;
          font-size: 15px;
          padding: 8px 12px;
          position: absolute;
          bottom: 8px;
          width: 100%;
          text-align: center;
        }

        /* Number text (1/3 etc) */
        .numbertext {
          color: #f2f2f2;
          font-size: 12px;
          padding: 8px 12px;
          position: absolute;
          top: 0;
        }

        /* The dots/bullets/indicators */
        .dot {
          height: 15px;
          width: 15px;
          margin: 0 2px;
          background-color: #bbb;
          border-radius: 50%;
          display: inline-block;
          transition: background-color 0.6s ease;
        }

        .active {
          background-color: #717171;
        }

        /* Fading animation */
        .fade {
          -webkit-animation-name: fade;
          -webkit-animation-duration: 1.5s;
          animation-name: fade;
          animation-duration: 1.5s;
        }

        @-webkit-keyframes fade {
          from {opacity: .4} 
          to {opacity: 1}
        }

        @keyframes fade {
          from {opacity: .4} 
          to {opacity: 1}
        }

        /* On smaller screens, decrease text size */
        @media only screen and (max-width: 320px) {
          .text {font-size: 11px}


        }
        .sine{display: block;
          opacity: 1;
          min-width: 0px;
          min-height: 0px;
          max-width: none;
          max-height: none;
          transform: translate3d(0px, 0px, 0px);
         max-width: 100%;
          height: 236px;
              object-fit: cover;
          top: 0px;
          left: 0px; }
          @media  only screen and (min-width: 500px) {
            .t-hean{
        font-size: 24px;}
            .from-l{padding: 8px 14px;}
            .slideshow-container{max-width: 1000px;}
            .form-container{width: 480px;margin: 0px auto;}
            .branlogo{margin: auto;}
            .sine{width: 480px;}
            .bg{width: 480px;} 
            
            .fool{width: 480px;}
            .textLogo{    font-size: 38px;top: -26px}
            .imgd{width: 480px;}


           
       



            .t2{font-size: 30px;}
            .table{width: 99%;margin-left: 2px;}

          
            
            .SlideShowfood{height: 22%}
            .t-img{width: 10%}
            .t-text{font-size: 25px;}
          }
          @media  only screen and (min-width: 1024px){
            .textLogo {
              font-size: 45px;
              top: -26px;
            }




            @media  only screen and (min-width: 1200px){



              .SlideShow-item>img {

                height: 100%;
                object-fit: cover;
              }


              .textLogo {
                font-size: 35px;
                top: -7px;
              }



              .t2 {
                font-size: 25px;
              }
             
          
              .ty {
                font-size: 25px;
              }
              

            }
            @media  only screen and (min-width: 1300px){

              

              .textLogo{    font-size: 25px;}





         
              .ty {
                font-size: 20px;
              }
              .SlideShowfood {
                height: 30%;
              }



            }
            @media  only screen and (min-width: 1600px){

            }

            @media  only screen and (min-width: 1800px){




              .text-lotm{width: 100%}
              .text-lotm{width: 100%}

            }
.imgreload{width: 100%;}
