@font-face {  font-family: 'TrueText';  src: url('./fonts/TLight.ttf'); }
@font-face {  font-family: 'TrueText';  src: url('./fonts/TBold.ttf');  font-weight: bold; }

@font-face {  font-family: 'TrueTextB';  src: url('./fonts/TrueTextBOnline-Regular.ttf'); }
@font-face {  font-family: 'TrueTextB';  src: url('./fonts/TrueTextBOnline-Bold.ttf');  font-weight: bold; }

@font-face {  font-family: 'THSarabun';  src: url('./fonts/TH Sarabun.ttf'); }
@font-face {  font-family: 'THSarabun';  src: url('./fonts/TH Sarabun Bol.ttf');  font-weight: bold; }


/* BASE */
html, body {  font-family: 'THSarabun', sans-serif; color:#333; font-size: 26px;  line-height: 26px;  height: 100%;  margin: 0;  padding: 0; /*background:url('../../assets/images/main-bg.jpg'); */}

@media (max-width: 767px) {
  html, body { font-size: 22px;  line-height: 24px;  }
  .h2-title{color:#000; font-size:24px; font-weight:bold;}
}

.radius-5{ border-radius:5px !important; overflow: hidden;}
.radius-0{ border-radius:0px}
.bg-default{background-color: #fff;}
.bg-alternate{background-color: #000;}
.full-width{width:100%}
.verticalLine { height: 100%; width: 1px; }
.row-eq-height { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;}
.bg-white{background-color: #fff;}
.channel-logo{max-width:120px}
.channel-logo-gradient{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+22;Neutral+Density */
  background: -moz-linear-gradient(-45deg, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 40%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(-45deg, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(135deg, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
a, a:hover, a:focus, a:active{color:#616161; text-decoration: none;}

.btn-flat-bg  {border: 0; border-radius: 0; font-size: 30px; padding: 5px 16px 0px 16px; background-color: #ffe9c5;}
.btn-flat-bg:hover {background-color:#f5daae}
.btn-flat-bg.active, .btn-flat-bg.active:hover {background-color:#ffb500; box-shadow: none;}

/*FOTER*/
.main-footer { background-color:#A3A3A3; color:#eee; color:#fff; font-size:30px; line-height:32px; padding: 10px;     font-family: THSarabun; }
.main-footer-row{padding: 20px 10px 20px 10px; }
.footer-nav ul, li {line-height:24px; }
.style-show li{list-style:none;     margin-top: 5px;}
.style-show li:before { content: "•"; padding-right: 5px; }
li.style-none{list-style:none; font-size:25px;}
li.style-none:before{content: ""; font-size:25px;}
.footer-logo{width:120px; margin:0 10px}
.footer-nav a, .footer-nav a:hover, .footer-nav a:focus, .footer-nav a:active { color:#eee; text-decoration: none; }
.m-t-10{margin-top:10px;}
.m-t-20{margin-top:20px;}
.m-b-10{margin-bottom:10px;}
.m-b-20{margin-bottom:20px;}
.p-t-20{padding-top:20px;}
.p-t-10{padding-top:10px;}
.p-t-5{padding-top:5px;}
.p-b-20{padding-bottom:20px;}
.p-b-10{padding-bottom:10px;}
.p-b-5{padding-bottom:5px;}
.m-l-0{margin-left:0px;}
.m-r-0{margin-right:0px;}
.m-0{margin:0px;}

.line-in-middle { width:auto; height:100%; background: linear-gradient(to right, transparent 0%, transparent calc(50% - 0.81px), transparent calc(50% - 0.8px), #eee calc(50% + 0.8px), transparent calc(50% + 0.81px), transparent 100%); }
@media (min-width: 768px) {
  .footer-box-right { margin-left: -25px; margin-right: -25px; }
}
.fs-10px{font-size:18px}
.p-r-0px{padding-right:0px}
.noborder { border: 0; box-shadow: none; padding: 0px; border-radius: 0px; }
.p-15{padding:15px}
.p-0{padding:0px}
.p-l-0{padding-left:0px}
.p-r-0{padding-right:0px}
.p-l-10{padding-left:10px}
.p-r-10{padding-right:10px}
.p-l-15{padding-left:15px}
.p-r-15{padding-right:15px}

/*HEADER*/
ul.header-nav-menu { font-size:26px; list-style-type: none; margin: 0; padding: 0; color:#333; position: relative; display: block; margin-top:-10px; margin-right:30px; line-height:15px}
.header-nav-menu li { display: inline-block; }
.header-nav-menu li a { line-height: 20px; display: block; color: white; text-align: center; padding: 0px 7px; text-decoration: none;color:#333; margin-top: 15px;}@media (max-width: 1045px) {  .header-nav-menu li a { padding: 0px 3px; }}
.header-nav-menu li a:hover img{ color:#fcb100;  opacity:1; }
.header-nav-menu li a img{ opacity:0; transition:0.5s; }


.fb-page { width:100%; margin: 0 auto; }
.fb-like-box, .fb-like-box span, .fb-like-box span iframe[style] { width: 100% !important; margin: 0 auto;}

/*
  .showme{ 
  display: none;
  }
  .showhim:hover .showme{
  display : block;
  }
  .showhim:hover .ok{
  display : none;
  }
*/


/*.header-nav-menu li a::before{ content:url(/themes/default/assets/images/linktop-bar-70.png);}*/

/* HOME NEWS */
.thumbnail .news-caption {
  padding: 9px;
  color: #616161;
}
.news-caption:hover{}
.channel-list-box:hover{    opacity: 0.8;;}
a.dltv-t-01, a.dltv-t-01:hover {color:#00a3d9; }
a.dltv-t-02, a.dltv-t-02:hover {color:#00a3d9}
a.dltv-t-03, a.dltv-t-03:hover {color:#00a3d9}

a.dltv-t-04, a.dltv-t-04:hover {color:#0255a3}
a.dltv-t-05, a.dltv-t-05:hover {color:#0255a3}
a.dltv-t-06, a.dltv-t-06:hover {color:#0255a3}

a.dltv-t-07, a.dltv-t-07:hover {color:#6a4399}
a.dltv-t-08, a.dltv-t-08:hover {color:#6a4399}
a.dltv-t-09, a.dltv-t-09:hover {color:#6a4399}

a.dltv-t-10, a.dltv-t-10:hover {color:#00a68d}
a.dltv-t-11, a.dltv-t-11:hover {color:#00a68d}
a.dltv-t-12, a.dltv-t-12:hover {color:#00a68d}

a.dltv-t-13, a.dltv-t-13:hover {color:#006636}
a.dltv-t-14, a.dltv-t-14:hover {color:#652e8f}
a.dltv-t-15, a.dltv-t-15:hover {color:#1d24ab}




/*DOWNLOAD BOX*/
.tv-viewcount{color:#a3a3a3; font-size:22px}
.download-box{ background-color:#fcedd6; padding:15px 20px;}
.download-box .download-item{ background-color:#fff; height:65px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.download-box .download-item > img { background-color:#FFB700; height:65px}
.tv-episodecount{color:#a3a3a3; font-weight:normal;}





i.fa-inside-circle  {
    display: inline-block;
    border-radius: 12px;
    border: 1px solid #666;
    padding: 3px 5px;
    font-size: 12px;
    top: -2px;
    position: relative;
}




.channel-list-box {font-size: 21px; font-weight: bold; margin-bottom:15px;}
.channel-list-box img {max-width:120px; max-height: 53px;}
.channel-list-box span {max-width:120px;}
.channel-list-box:hover, .channel-list-box:focus { text-decoration: none;}

@media (max-width: 768px) {
  .channel-list-box {font-size: 14px; font-weight: bold; margin-bottom:15px;}
  .channel-list-box img {max-width:70px; max-height: 30px;}
  .channel-list-box span {max-width:120px;}
  .channel-list-box:hover, .channel-list-box:focus { text-decoration: none;}
}

.post-box{position: relative; padding: 20px 20px; margin:0px; border-radius:4px; }
.commentlist{list-style:none; margin-top:20px; margin-bottom:20px; padding-left:0px;}
.commentlist ul{list-style:none;}
.comment-box{position: relative; padding: 20px 20px; margin:0px; border-radius:4px; margin-bottom:20px; background-color:#fff; color:#000}
.commentlist .comment-box a{ color:#000}
.commentlist .comment .avatar{ position:absolute; top:20px; left:8px;}
.commentlist .comment .body{ margin-left:60px;}
.commentlist .comment ul { margin-left:50px; padding-left:0px;}
.commentlist .content-view-title{font-size:24pt; font-weight:bold; margin: 0;}
.commentlist .content-view-bar{font-size:90%}
.commentlist .content-view-content{font-size:90%; margin-top:20px;}
.commentlist .content-view-comments{}
.commentlist .img-profile-small{width:50px}
.commentlist .comment-reply-box>form{padding-bottom:50px; display:grid}



.webboardlist{list-style:none; margin-top:20px; margin-bottom:20px; padding-left:0px;}
.webboardlist ul{list-style:none;}
.webboardlist .comment-box{position: relative; padding: 20px 20px 15px 20px; margin:0px; border-radius:4px; margin-bottom:20px; background-color:#eee; color:#000}
.webboardlist .comment-box a{ color:#000}
.webboardlist .comment .avatar{ position:absolute; top:20px; left:8px;}
.webboardlist .comment .body{ margin-left:60px;}
.webboardlist .comment ul { margin-left:50px; padding-left:0px;}
.webboardlist .content-view-title{font-size:24pt; font-weight:bold; margin: 0;}
.webboardlist .content-view-bar{font-size:90%}
.webboardlist .content-view-content{font-size:90%; margin-top:20px;}
.webboardlist .content-view-comments{}
.webboardlist .img-profile-small{width:50px}
.webboardlist .comment-reply-box>form{padding-bottom:50px; display:grid}
.webboardlist .comment-author{color:#999; font-size:90%}


/* HOVER EFFECT */
.hover-grad { background-color: #fff;}
.hover-grad img {	opacity: 1;	-webkit-transition: .3s ease-in-out;	transition: .3s ease-in-out; }
.hover-grad img:hover  { opacity: .5; }
.hover-zoom img { -webkit-transform: scale(1); transform: scale(1); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; }
.hover-zoom img:hover { -webkit-transform: scale(1.1); transform: scale(1.1); }
.hover-zoom { overflow: hidden; position:relative; }
.hover-opacity img:hover { opacity: 0.8; background-color:#fff;}
.hover-opacity { opacity: 1; display: block; width: 100%; height: auto; transition: .2s ease; backface-visibility: hidden; }


/* THEME OVERRIDE */
.bg-default{background-color: #fff;}
.bg-alternate{background-color: #feb807;}
.txt-default{color:#000}
.txt-alternate{color:#fff}
.full-width{width:100%}
.news-content-subject{color:#000; text-decoration:none; font-weight:bold; display: block; line-height: 1.3em; max-height: 2.6em; overflow: hidden;}
a.news-content-subject:hover,a.news-content-subject:active {  text-decoration:none; color:#616161; }
.news-content-short{color:#000; line-height: 1.2em; max-height: 3.6em; overflow: hidden;}
.news-content-view{color:#000; font-size:0.8em}
.h2-title{color:#000; font-size:30px; font-weight:bold;}
.verticalLine {background-color:#feb807;}
.hover-grad { background-color: #1abc9c; }
.comment-box{background-color:#fff; color:#000}
.comment-box a{ color:#000}
.news-caption{position:relative}

@media (max-width: 767px) {

.news-content-subject{color:#000; text-decoration:none; font-weight:bold; display: block; line-height: 1.3em; max-height: 2.6em; overflow: hidden; }
a.news-content-subject:hover,a.news-content-subject:active {  text-decoration:none; color:#616161;}
.news-content-short{color:#000; line-height: 1.2em; max-height: 3.6em; overflow: hidden;}
.news-content-view{color:#000; font-size:0.8em}
  
}


.breadcrumb > li + li:before {
  content: ">";
  padding: 0 5px;
  color: #8e8e8e;
}

.breadcrumb {
  padding: 8px 0px;
  margin-bottom: 20px;
  list-style: none;
  background-color: transparent;
  border-radius: 4px;
}
.breadcrumb > .active {
  color: #8e8e8e;
}
.breadcrumb  a {
  color: #8e8e8e;
}
.breadcrumb  a:hover {
  color: #D3D3D3;
}

/*MENU OVERLAY*/
/* The side navigation menu */

.navbar-header-fixedtop{display: table; position:fixed; height:auto; width:100%; z-index:99999998; background-color:#fff; box-shadow: 0 1px 0 rgba(12,13,14,0.1), 0 1px 3px rgba(12,13,14,0.1), 0 4px 20px rgba(12,13,14,0.035), 0 1px 1px rgba(12,13,14,0.025);}
.header-bpad {padding-bottom:140px;}
.navbar-header-table{display:table; height: 100%; width:100%; padding: 0 10px;}  
.navbar-header-row{display: table-row; vertical-align: middle; }
.navbar-header-cell{display:table-cell; vertical-align: middle;}
.menu-overlay {  height: calc(100% - 140px); width: 100%; display: none; position: fixed; top:140px; z-index: 99999999; background-color: rgba(68,68,68, 0.95); }
.menu-overlay-content { position: relative;  max-width: 100%; text-align: left; margin: 60px 30px;}
.menu-overlay a { text-decoration: none; font-size: 32px; color: #fff; line-height:40px; display: block; transition: 0.3s; }
.menu-overlay a:hover, .menu-overlay a:focus { color: #f1f1f1; }
.menu-overlay .closebtn { position: absolute; top: 10px; right: 5px; font-size: 60px; }
#btnCloseNav{display:none;}


.text-left{ text-align: left;}

/*DDL */

.ddl-flat-bg {font-size:30px; padding: 5px 16px 0px 16px; background-position:right; background-repeat:no-repeat; height: 34px; border: 0px solid #ccc; overflow: hidden; height: 60px; border-radius: 0px; }  
select.ddl-flat-bg  { -webkit-appearance: none; -moz-appearance: none; text-indent: 1px; text-overflow: ''; } 
select.ddl-flat-bg::-ms-expand { display: none; }
.ddl-flat-bg:focus{border:0px; border-color: #66afe9; outline: 0; -webkit-box-shadow: none; box-shadow: none; }


@media (max-width: 991px) {
  .push-header-page{padding-top:15px; background-color:#fce6c3;}
}