.content_preview{
    text-align: justify;
    text-indent:3em;
}


.info_button
,.info_button:hover
{
    text-decoration: none;
    color: initial;
}

.info_button div{
    
    width                : 100%;
    height               : 2em;
    line-height          : 2em;
   
    background-color     : #99CCFF;
    /* border-radius        : 50%; */
    /* -webkit-border-radius: 50%;
    -moz-border-radius   : 50%; */
    -webkit-box-shadow   : 0px 5px 5px 0px #adb5bd;
    box-shadow           : 0px 5px 5px 0px #adb5bd;
}


div.contact{
    font-size:1.1em;
    margin-top:0.5em;
    margin-bottom:0.5em;
}

div.contact .fa-line{
    color:green;
    font-size:1.6em;   
}
div.contact .fa-phone-square{
    color:#0066ff;
    font-size:1.6em;   
}

.p_li{
    text-align: left !important;
}

.bg-light>div>p{
    font-size: 18px;
    /* color: rgb(21, 49, 77); */
}

#topic_dbs{
    color:#6EC8FF;
}
.table-ba{
    background-color : #BBDEFB !important;
}
.table-ba-light>td{
    background-color : #E3F2FD !important;
}
.btn.btn-info.btn-lg{
    background-color : #6EC8FF !important;
    border-color : #6EC8FF;
}
.btn.btn-info.btn-lg:hover{
    background-color : rgb(60, 160, 223) !important;
    border-color :rgb(60, 160, 223);
}
#detail a{
    font-size: 18px;
    font-weight: 600;
    color: #6EC8FF ;
}

#detail a:hover{
    font-size: 18px;
    text-decoration: none;
    color: #3ca2df;  /*#dc3545 สีแดง*/
}
#fee_detail a{
    color: #212529;
}
#fee_detail a:hover{
    color: #6EC8FF;
    text-decoration: none;
    font-weight: 600;
}

.btn.btn-lg.btn-outline-ba{
    /* background-color: #0f3b9e; */
    border-color: #6EC8FF;
    color: #6EC8FF;

}
.btn.btn-lg.btn-outline-ba:hover{
    background-color: rgb(60, 160, 223);
    color: #FFF;
}
.btn.btn-lg.btn-outline-ba:active{
    border-color: rgb(60, 160, 223);
    background-color: rgb(60, 160, 223);
    color: #FFF;
}
.list-inline-item.mr-3 a:hover{
    text-decoration: none;
}

.btn-outline-dark.box:hover{
    background-color: #F8F9FA;
    border-color: #343a40;
    color: #343a40;
}
.btn-outline-danger.box:hover{
    background-color: #F8F9FA;
    border-color: #dc3545;
    color: #dc3545;
}
.btn-outline-success.box:hover{
    background-color: #F8F9FA;
    border-color: #28a745;
    color: #28a745;
}
p#detail{
    margin: 0px;
}

/* add 17-03-2020 */
.tni-logo img{
    position: absolute;
    left: 3em;
    top: 1.5em;

}

@media(max-width: 989px) {
    .text-header {
        font-size: 1.2em !important;
    }
    .text-header-icon{
        font-size: 1.0em !important;
    }
    #top-banner{
        margin-top: 0.1em !important;
        /* padding: 10px 5px; */
    }
    #bottom-banner{
        margin-bottom: -4em;
    }

    hr{
        border:1px solid #333 !important;
        margin-bottom: 0.5em !important;
       margin-top: 0.5rem !important;
    }
    .tni-logo img{
        width: 30%;
        left: 2em;
    }

    .features-icons,.testimonials {
        padding-top: 3.0rem !important;
    }
    .testimonials,.features-icons{
        padding-bottom: 3rem !important;
    }

    .text-mobile{        
        font-size: 1.1em;  /* หัวข้ออื่นๆ เช่นคำว่า วิชาที่เรียน */
    }
    h6.text-mobile{
        font-size: 1.0em;  /*รายละเอียด*/
    }
    h2.text-mobile{
        font-size: 1.3em;  /*จุดเด่น โอกาส*/
    }
    .text-mobile ul{
        font-size: 0.7em;  /* listวิชาเรียน*/
    }
    .table td{
        font-size: 0.9em !important;  /*เนื้อหาของโอกาส จุดเด่น*/
    }
  
    .card-title.pricing-card-title>.text-muted{
        font-size: 0.8em !important;
    }
    p.text-mobile{
        font-size: 1.0em !important;   /* คุณสมบัติ ค่าใช้จ่าย เวลาเรียน*/
    }
    .shadow-sm.mx-auto{
        height: 310px!important;
        padding-top: 2.0em !important;  /* ระยะขอบของไอคอน คุณสมบัติ ค่าใช้จ่าย เวลาเรียน*/
    }
    .btn.btn-info.btn-lg,.btn.btn-dark.btn-lg{
        font-size: medium
        ; /* ปุ่มกลับ และสมัครเรียน */
    }
}

@media(max-width: 768px) {
    
    #media{
        font-size: 1.5em;
     
    }
    #media-icon{
        font-size:0.7em;
    }
    .text-uppercase{
        font-size: 2rem !important;
      }
   
    .text-header {
        font-size: 1.0em !important;
    }
    .text-header-icon{
        font-size: 0.8em !important;
    }
    #top-banner{
        margin-top: 0.1em !important;
        /* padding: 10px 5px; */
    }
    #bottom-banner{
        margin-bottom: -4em;
    }

    hr{
        border:1px solid #333 !important;
        margin-bottom: 0.5em !important;
       margin-top: 0.5rem !important;
    } 

    .tni-logo img{
        width: 30%;
        left: 2em;
    }

    .features-icons,.testimonials {
        padding-top: 2.0rem !important;
    }
    .testimonials,.features-icons{
        padding-bottom: 2.0rem !important;
    }

    .text-mobile{        
        font-size: 1.1em;  /* หัวข้ออื่นๆ */
    }
    h6.text-mobile{
        font-size: 1.0em;  /*รายละเอียด*/
    }
    h2.text-mobile{
        font-size: 1.3em;  /*จุดเด่น โอกาส*/
    }
    .text-mobile ul{
        font-size: 0.8em;  /* listวิชาเรียน*/
    }
    .table td{
        font-size: 0.9em !important;  /*เนื้อหาของโอกาส จุดเด่น*/
    }
    .card-title.pricing-card-title>.text-muted{
        font-size: 0.6em !important;
    }
  
    p.text-mobile{
        font-size: 0.9em !important;   /* คุณสมบัติ ค่าใช้จ่าย เวลาเรียน*/
    }
    .shadow-sm.mx-auto{
        height: 350px!important;
        padding-top: 2.0em !important;  /* ระยะขอบของไอคอน คุณสมบัติ ค่าใช้จ่าย เวลาเรียน*/
    }
    .btn.btn-info.btn-lg,.btn.btn-dark.btn-lg{
        font-size: medium; /* ปุ่มกลับ และสมัครเรียน */
    }
}


@media(max-width: 565px) {

    #media .text-uppercase{
        /* font-size: 1.0em; */
        padding-top: 5.0em;
     
    }
    #media {
        font-size: 12px !important;
        padding-top: 0.5em;
     
    }
    #media-icon{
            font-size:0.7em;
        }
    .info_button div>p,.info_button_light div>p{
        font-size: 0.8em;
    }
    .row{
        margin-left: 0px !important;
    }
    #freepik{
        font-size:0.7em;
    }
    #logo-tni{
        width: 56%;
    }
    .text-uppercase{
         font-size: 1.0em !important;
         padding-top: 3em;
    }
        .text-second ,.list-inline {
        font-size: 1.0em !important;
        /* padding-top: 17em; */
   }

   .list-inline {
    margin: 0.1px;
  }

   
    /*add 17-03-2020*/
    .text-header {
        font-size: 0.9em !important;
    }
    .text-header-icon{
        font-size: 0.8em !important;
    }
    #top-banner{
        margin-top: -3em !important;
        padding: 0px 1px;
    }
    #bottom-banner{
        margin-bottom: -4em;
    }

    hr{
        border:1px solid #333 !important;
        margin-bottom: 0.5em !important;
       margin-top: 0.5rem !important;
    }

    .tni-logo img{
        position: relative;
        left: -5.5em;
        top: -0.1em;
        width: 40%;
    }
    .tni-logo {
        position: relative;
        top: -6em;
        background-color:rgba(192,192,192,0.3);
        padding: 6px 6px 6px;
    }

    .features-icons,.testimonials {
        padding-top: 2rem !important;
    }
    .testimonials,.features-icons{
        padding-bottom: 2rem !important;
    }

    .text-mobile{        
        font-size: 1.0em;  /* หัวข้ออื่นๆ */
    }
    h6.text-mobile{
        font-size: 0.9em;  /*รายละเอียด*/
    }
    h2.text-mobile{
        font-size: 1.2em;  /*จุดเด่น โอกาส*/
    }
    .text-mobile ul{
        font-size: 0.8em;  /* listวิชาเรียน*/
    }
    .table td{
        font-size: 0.8em !important;  /*เนื้อหาของโอกาส จุดเด่น*/
    }
  
    .card-title.pricing-card-title>.text-muted{
        font-size: 0.6em !important;
    }
    p.text-mobile{
        font-size: 0.8em !important;   /* คุณสมบัติ ค่าใช้จ่าย เวลาเรียน*/
    }
    .shadow-sm.mx-auto{
        height: 360px!important;
        padding-top: 2.0em !important;  /* ระยะขอบของไอคอน คุณสมบัติ ค่าใช้จ่าย เวลาเรียน*/
    }
    .btn.btn-info.btn-lg,.btn.btn-dark.btn-lg{
        font-size: small; /* ปุ่มกลับ และสมัครเรียน */
    }
  
}