body {
    /* background-color: #DCE0DD; */
    background-color: #fff;
}

/*แก้ปัญหาลิงค์บทความไม่มีสีฟ้า และ ไม่มีขีด ใช้ในบางส่วน */
.fixcolorlinkunderline {text-decoration-line: underline;}

#container_member {
    width: 48px;
    height: 48px;
}

#container_member img {
    width: 100%;
}

.row_member :: after {

    content :  "";
    clear :  both;
    display : table;

}

[class *= "col-member"] {

    float : left;
    padding : 10px;
    border:0px solid #ccc;

}

/* For mobile phones เป็นค่า Default*/
[class *= "col-member"] {

    width:100%;
    padding : 10px;
    background-color: #fff;
    border:0px solid #000;


}

[class *= "form-member"] {

    float : left;
    padding : 15px;
    font-family : "Bai Jamjuree", sans-serif;

}

[class *= "form-member"] {

    width :  96%;
    margin : 2%;
    float : left;
    padding : 15px;

}


@media only screen and (min-width :  768px) {

     /* For desktop */
     .form-3 {width:46%; margin:2%}

}


@media only screen and (min-width :  600px) {

    /* For tablets */
    .col-s-1 {width :  8.33%;}
    .col-s-2 {width :  16.66%;}
    .col-s-3 {width :  25%;}
    .col-s-4 {width :  33.33%;}
    .col-s-5 {width :  41.66%;}
    .col-s-6 {width :  50%;}
    .col-s-7 {width :  58.33%;}
    .col-s-8 {width :  66.66%;}
    .col-s-9 {width :  75%;}
    .col-s-10 {width :  83.33%;}
    .col-s-11 {width :  91.66%;}
    .col-s-12 {width :  100%;}

}


@media only screen and (min-width :  768px) {

    /* For desktop */
    .col-member-1 {width :  8.33%;}
    .col-member-2 {width :  15%; padding:10px;}
    .col-member-3 {width :  25%;}
    .col-member-4 {width :  33.33%;}
    .col-member-5 {width :  41.66%;}
    .col-member-6 {width :  50%;}
    .col-member-7 {width :  58.33%;}
    .col-member-8 {width :  66.66%;}
    .col-member-9 {width :  30%; padding:10px;}
    .col-member-10 {width : 75%; padding-top:10px; padding-left:25%}
    .col-member-11 {width :  91.66%;}
    .col-member-12 {width :  100%;}
    .col-member-18 {width : 17%; margin-top:30px; margin-left:2%; border:0px solid #000; border-radius:10px;}
    .col-member-19 {width : 60%; margin-top:30px; margin-left:2%; border:0px solid #000; border-radius:10px; padding:5px; padding-bottom:100px;}
    .col-member-20 {width : 10%; margin-top:30px; margin-left:2%; border:0px solid #000; border-radius:10px;}
    .col-member-22 {width : 15%; padding:10px; margin-left:20%;}
    .col-member-25 {width : 20%; padding-top:10px; margin-left:40%}
    .col-member-26 {width : 30%; margin-top:100px; margin-left:35%}

}


@media (max-width: 800px) {

    /* mobile */

    .col-member-10 {margin-top:30px;}

    .col-member-2 {margin-left:0%;}

    .col-member-25 {margin-left:0%;}

    .col-member-22 {margin-left:0%;}

    /* .col-member-18 {display:none} */
}

* {
    box-sizing: border-box;
  }
  
  .flex-container {
    display: flex;
    flex-direction: row;
    font-size: 0.6em;
    text-align: center;
  }
  
  .flex-item-left {
    background-color: #f1f1f1;
    padding: 0px;
    flex: 50%;
    border-radius:10px; background-color:#686868 ; color:#fff;font-weight:bold; margin-right:10px;
  }
  
  .flex-item-right {
    background-color: dodgerblue;
    padding: 10px;
    flex: 50%;
  }
  
  /* Responsive layout - makes a one column-layout instead of two-column layout */
  @media (max-width: 300px) {
    .flex-container {
      flex-direction: column;
    }
  }


  .affiliate-textbox {
    padding:10px; 
    border-radius:30px; 
    background-color:none; 
    color:#7e7e7e;
    text-align:center;
    font-weight:bold; 
    margin-right:10px;
    border:1px dotted #7e7e7e;
    font-size:0.7em;

  }

  /* fix bottom menu bar */
  #adsbar {
    background-color: #333;
    position: fixed;
    bottom: 0px;
    width: 100%;
    display: block;
    transition: top 0.3s;
    z-index:99;
  }
  
  /* #adsbar a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 15px;
    text-decoration: none;
    font-size: 17px;
  }
  
  #adsbar a:hover {
    background-color: #ddd;
    color: black;
  } */