/*------------------- style 1 old ----------------------*/

.news1_title:link, .news1_title:visited {
  color: #ffffff;
  text-decoration: none;
}
.news1_title:hover {
  color:#00cffd;
  text-decoration: underline
}

/*------------------- style 1 new ----------------------*/

.style1_box {box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);}
.style1 img {
height: 180px;
width: 300px;
object-fit: contain;
}

.style1_title:link, .style1_title:visited {
  color:#007ccc;
  text-decoration: none;
}
.style1_title:hover {
  color:#e036ba;
  text-decoration: underline
}


/*------------------- style 2 -------------------*/
.style2 {
padding: 10px;
  background-color: #f2f2f2;
  margin: 10px;
  height: auto;
}
.style2 a{color:#2b4497;}
.style2 a:hover{color:#ea9425;}
.style2 img{
border: 4px solid #ffffff;
width: 300px;
object-fit: contain;
box-shadow: 0px 3px 5px 0px #9f9f9f;
padding: 0;
}
.style2_title {
/* height: 85px; */
width: 100%;
overflow: hidden;
line-height: 20px;
font-size: 14px;
text-align: left;

}
.style2_blog-news{
padding: 0;
}

/*------------------- style 3 new -------------------*/
* {
box-sizing: border-box;
}

.style3 {
margin: 20px 0;
position: relative;
overflow: hidden;
top: 200px;
left: 50%;
width: auto;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
background-color: #fff;
box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
transition: box-shadow 0.3s;
}

.style3 a {
color: inherit;
text-decoration: none;
}

.style3:hover {
box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.3);
}

.style3Date {
position: absolute;
top: 20px;
right: 20px;
width: 45px;
height: 45px;
padding-top: 10px;
color: #FFF;
text-align: center;
line-height: 13px;
font-weight: bold;
background-color: darkorange;
border-radius: 50%;
}

.style3DateDay {
display: block;
font-size: 14px;
}

.style3DateMonth {
display: block;
font-size: 10px;
text-transform: uppercase;
}

.style3Thumb {
height: 235px;
overflow: hidden;
background-color: #000;
transition: height 0.3s;
}

.style3Thumb img {
display: block;
opacity: 1;
transition: opacity 0.3s, -webkit-transform 0.3s;
transition: opacity 0.3s, transform 0.3s;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
position: relative;
}

.style3:hover .style3Thumb img {
opacity: 0.6;
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
}

.style3:hover .style3Thumb {
height: 90px;
}

.style3Body {
position: relative;
padding: 20px;
height: 185px;
transition: height 0.3s;
}

.style3:hover .style3Body {
height: 330px;
}

.style3Category {
position: absolute;
left: 0;
top: -25px;
height: 25px;
padding: 0 15px;
color: #FFF;
font-size: 11px;
line-height: 25px;
text-transform: uppercase;
background-color: darkorange;
}

.style3Title {
margin: 0;
padding: 0 0 10px 0;
font-size: 22px;
color: #000;
font-weight: bold;
}

.style3:hover .style3Title {
-webkit-animation: titleBlur 0.3s;
animation: titleBlur 0.3s;
}

.style3Subtitle {
margin: 0;
padding: 0 0 10px 0;
font-size: 19px;
color: #1f65a9;
}

.style3:hover .style3Subtitle {
-webkit-animation: subtitleBlur 0.3s;
animation: subtitleBlur 0.3s;
}

.style3Description {
position: absolute;
left: 20px;
right: 20px;
bottom: 65px;
margin: 0;
padding: 0;
color: #666C74;
font-size: 14px;
line-height: 27px;
opacity: 0;
transition: opacity 0.2s, -webkit-transform 0.2s;
transition: opacity 0.2s, transform 0.2s;
transition-delay: 0s;
-webkit-transform: translateY(25px);
-ms-transform: translateY(25px);
transform: translateY(25px);
}

.style3:hover .style3Description {
opacity: 1;
transition-delay: 0.1s;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}

.style3Footer {
position: absolute;
bottom: 20px;
left: 20px;
right: 20px;
font-size: 11px;
color: #A3A9AB;
}

.style3Footer .icon--comment {
margin-left: 12px;
}

.icon {
display: inline-block;
vertical-align: middle;
margin-right: 2px;
}

@-webkit-keyframes titleBlur {
0% {
  opacity: 0.6;
  text-shadow: 0px 5px 5px rgba(0, 0, 0, 0.6);
}
100% {
  opacity: 1;
  text-shadow: 0px 5px 5px transparent;
}
}

@keyframes titleBlur {
0% {
  opacity: 0.6;
  text-shadow: 0px 5px 5px rgba(0, 0, 0, 0.6);
}
100% {
  opacity: 1;
  text-shadow: 0px 5px 5px transparent;
}
}

@-webkit-keyframes subtitleBlur {
0% {
  opacity: 0.6;
  text-shadow: 0px 5px 5px rgba(255, 140, 0, 0.6);
}
100% {
  opacity: 1;
  text-shadow: 0px 5px 5px rgba(255, 140, 0, 0);
}
}

@keyframes subtitleBlur {
0% {
  opacity: 0.6;
  text-shadow: 0px 5px 5px rgba(255, 140, 0, 0.6);
}
100% {
  opacity: 1;
  text-shadow: 0px 5px 5px rgba(255, 140, 0, 0);
}
}


/*------------------- style 5 old -------------------*/

.blog_wrap {
margin-top: 0px;
background-color:#f9f9f9; 
padding: 0px; 
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
position: relative;
border-radius: 10px;
}
body .box-img-news{ width: auto; height: auto; margin: auto; 
text-align: center; padding-top: 20px; }
body .box-img-news img{ width: 33% !important; height: auto !important; display: inline-block; padding: 10px 5px;}
.single_wrap{ 	padding: 20px;  }
body .single_wrap ul{ margin-top: 0px !important; }
body .bg-sub-left .blog_wrap{ }
body .box-list-news{ padding: 0px; }
body .bg-sub-left .single_wrap ul li{ padding-top: 20px; max-height: 30px; }
body .bg-sub-left .single_wrap ul li a{ font-size: 19px; font-weight: 600; }
body .bg-sub-left .single_wrap ul li span{ font-size: 17px; font-weight: 600; }
.boxes_img {
height:200px;
width:100%;
/*border:solid #CCC 1px;
background-color:rgb(247,242,229);*/
padding:0px;
}
body #myTabContent{ background-color: transparent;}
body .menu-sub-left{ 

color: #3a71a0;
text-decoration-line: none;
border-bottom-color: rgb(51, 102, 153);
display: block;
padding: 20px 4px 15px 28px;
font-variant-numeric: normal;
font-variant-east-asian: normal;
font-stretch: normal;
font-size: 19px;
line-height: 1.7;
font-weight: 600;
}
body .box-list-detail{ width: 50%; float: left; }
body .box-list-detail .list-detail-col{ width: 50%; float: left; }
body .box-menu-sub-left{ padding: 40px 10px; border-radius: 15px; }
body  .container .box-menu-sub-left-list{ padding: 20px; );
border-radius: 15px; }
body .box-menu-sub-left li{ 

padding-left: 12px !important;
font-weight: 600;

}
body .box-menu-sub-left li a{ 
font-size: 19px;
font-weight: 600;
color: #3a71a0;
}
.news-title {
height: 90px;
width: 100%;
overflow: hidden; 
line-height: 20px;
position: relative; 
padding: 20px;
}
body .blog_wrap .ImageWrapper{height: 475px;background: #f58703;margin-top: 0px !important;}
body .home-page-main #col-b1 .blog_wrap{ 
background-color: #ffffff;
box-shadow: unset;
}
body .home-page-main #col-b1 .blog_wrap .ImageWrapper{ background: transparent; height: 300px;}
body .home-page-main #col-b1 .news-title{ display: none; }
body .home-page-main #col-b1 input.btn{
background: #ffffff;
margin-top: 0px;
font-size: 41px;
border-radius: 5px;
color: #7f4e09;
text-decoration: none;
margin: auto 0px;
font-family: 'quark-light';
font-weight: 500;
z-index: 99;
position: relative;
margin-right: 43px;}

body .blog_wrap .ImageWrapper img {
  object-fit: contain !important;
  background: #f9f9f9;
  height: 100%;
}
/*----------------/*style 5 news-----------------------*/
.style5-blog_wrap {
margin-top:20px;
background-color:#f9f9f9; 
border:1px solid #ccc; 
padding: 0px; 
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}
.style5-blog_wrap .h3 {font-size:18px; line-height:22px;}

body .blog_wrap .style5-boxes_img {
height:250px;
width:100%;
/*border:solid #CCC 1px;
background-color:rgb(247,242,229);*/
padding: 0px;
margin-top: 0px;
}
body .blog_wrap .style5-boxes_img img{ object-fit: cover !important; 
border-top-left-radius: 10px;
border-top-right-radius: 10px;}


body .blog_wrap .style5-news-title {
height: 200px;
width: auto;
line-height: 20px;
padding:10px;
margin-bottom:20px;
text-align: left;

}
body #tab2273{ background-color: #ffffff; }
body .news-panel ul .list-news{ text-align: left; }
body .news-panel ul .list-news a{ font-size: 21px; color: #2f2d2d;}
body .news-panel ul .list-news span{ padding-left: 32px; }
body .blog_wrap .style5-news-title .h3{
max-height: 121px;
overflow: hidden;
line-height: 1.3;
}
body .blog_wrap .style5-news-title .h3 a{
font-size: 19px;
color: #505356;
font-family: 'quark-bold';
font-weight: 700;
}
body .blog_wrap .style5-post_meta {font-size:0.8em; font-family: 'Kanit', Tahoma, sans-serif;}
body .blog_wrap .style5-post_meta {color: #505356;}
body .blog_wrap .style5-post_meta:hover{color:#f19841;}

/*------------------------style 6------------------------------*/
body .news-panel .style6{ display: inline-block; margin-right: 0px;}
body .news-panel .style6 li{ display: inline-block; margin-right: 0px; }
body #bgnexttwo{ background-color: #ffffff; border-radius: 3px; }
body #page_selected {
background-color: #3B5998;
}
.style6-preview {
 float: left;
 width: 100%;
 position: relative;
 z-index: 5;
 position: relative;
 /* margin-left: -15px; */
 /* margin-right: -15px; */
 /* margin-top: 25px; */
}
.style6-date-preview {
float: left;
width: 100%;
position: relative;
z-index: 5;
position: relative;
/* margin-left: -15px; */
/* margin-right: -15px; */
/* margin-top: 25px; */
}
body .style6-date-preview .style6-top-content{ display: block; float: left; width: 25%; position: relative; 
padding: 5px 10px;   padding-left: 0px; margin-right: 0px;  }
body .style6-top-content{ display: block; float: left; width: 48.6%; position: relative; 
padding-top: 5px;  margin-right: 10px;  }

body  .style6-preview .img-small-book{ display: block; float: left; list-style-type: none; width: 25%; margin: 0px; padding: 5px 10px; 
padding-left: 0px;}
body  .style6-date-preview .img-small-book{ display: block; float: left; list-style-type: none; width: 25%; margin: 0px; padding: 5px 10px; 
padding-left: 0px; min-height: 390px; max-height: 390px; 
}
body  .style6-preview .news-title{ height: auto; padding: 0px; }
body  .style6-date-preview .news-title{ height: auto; padding: 0px;}
body .img-small-book .news-title{ padding-bottom: 0px; }
body  .style6-preview .news-title .news_thumb{ height: auto;  padding: 0px; }
body  .style6-date-preview .news-title .news_thumb{ height: auto;  padding: 0px; }
.style6-preview img{
  display: block;
  width: 100%;
  height: auto;
  /* max-height:275px; */
  /* margin: 10px; */
  /* padding: 10px; */
  object-fit: cover;
} 
body .style6-date-preview .style6-top-content img{
  display: block;
  width: 100%;
  height: 100%;
  /* margin: 10px; */
  /* padding: 10px; */
  object-fit: cover;
}
.style6-content {
  position: absolute;
  background: #333333;
  z-index: 10;
  padding: 0;
  top: 0;
  left: 0;
  right:0;
  display: none;
}
.style6-resume{
position:absolute;
bottom:0px;
/*left:10px;
right:10px;*/
background:rgba(0,0,0,0.8);
/* padding:10px; */
color:#fff;
width: 100%;
/* margin: 10px; */
min-height: 70px;
max-height: 70px;
}
body .style6-date-preview .style6-resume{ min-height: 90px;
max-height: 90px;}
body .style6-date-preview .style6-top-content .style6-resume{ 
   bottom: 5px; width: 96%;
}
body .style6-date-preview .news-detail{ right: 0px; bottom: -7px;}
body .style6-date-preview .news-detail span{ color: #ff7800; }
body .style6-resume .style6-title{ font-weight: 500; font-size: 17px; color: #fff;
margin-top: 7px;
line-height: 1.2;}
.style6-resume p{ margin-bottom: 15px; color:#ccc; font-size:16px; font-weight:400;}

a.style6-title {
display:block;
color: #fff9f9;
margin:20px;
font-size:18px;
}
a.style6-title:hover{
background:none;
text-decoration:underline;
}
.style6-top-content {
  display: block;
}
.style6 {display:block;}
.style6 ul li {position:relative; margin:0; padding:0;}
.style6 li {width: 210px;height: auto; float: left; }
.style6 li {margin: 0 0 10px 10px;}
.style6 .img-contain {
position: relative;
margin: 0 auto;
padding: 0;
overflow:  hidden;
}
.style6 .img-contain img {
width:260px;
}
.style6 p{ font-size: 16px; font-weight: 200; line-height: 16px; padding: 0 10px;  margin-bottom: 10px;}
.style6 .btn {font-size:18px; font-weight:500;}

@media screen and (max-width: 780px){
.style6 ul li {position:relative; margin:0; padding:0;}
.style6 li {width:98% ;height:auto;float:left;}
.style6 li {margin:10px 5px;}
.style6 .img-contain {
position: relative;
margin: 0 auto;
padding: 0;
overflow:  hidden;
}
.style6 .img-contain img {
width:100%;
}
}
/*------------------------style 7------------------------------*/

* {margin: 0; padding: 0;}

#style7 {margin-right:-15px; margin-left:-15px;}
.style7 ul {
list-style-type: none;
/* width: 500px; */
}

.style7 h3 {
font: bold 20px/1.5 'Kanit', Tahoma, sans-serif;
}

.style7 li img {
float: left;
margin: 0 15px 0 0;
}

.style7 li p {
font-size: 16px;
font-weight: 300;
line-height: 24px;
}

.style7 li {
 padding: 10px;
 overflow: auto;
 border-bottom: 1px dashed #f1e0e0;
 border-left: 3px solid #428bca;
 margin: 15px 0;
}

.style7 li:hover {
background: #eee;
cursor: pointer;
}
.style7 span {
color:#2c6494; font-size:14px; font-weight:500;
}
.style7 span::before {
content: "\f073";
  font-family: FontAwesome;
  padding-right: 5px;
  font-size: 14px;
  color:#666666;
}
/*.style7 span::after {
content: "\f06e";
  font-family: FontAwesome;
  padding-right: 5px;
  font-size: 14px;
  color:#666666;
}*/
.post_desc {padding:20px;}
.post_desc {font-family:'Kanit', Tahoma, sans-serif;}

.news-detail{text-align:left;}
@media screen and (max-width:980px) {
.news-detail{ position: relative;bottom: 5px;}
}

/*-------------------------------------------------------*/
/* Date Time News
/*-------------------------------------------------------*/
.post_meta {font-size:0.8em; font-family: 'Kanit', Tahoma, sans-serif; margin: 10px 0px;}
.post_meta {color: #505356;}
.post_meta:hover{color:#f19841;}

body .tab-pane .btn-md{ background-color: #ca4000 !important; font-size: 1.5rem !important; }
body  #hero-and-body .box-text-news span{  
font-family: 'quark-light';
font-weight: 600;
font-size: 23px;
color: #554b4b;
}

body #hero-and-body .single_wrap .title h3{ 
font-weight: 700;
font-size: 32px;
color: #FF8C00 !important;
}
/* responsive */
@media(min-width: 140px) and (max-width: 767px){
body #hero-and-body .single_wrap .title h3{ 
  font-weight: 700;
  font-size: 22px;
  color:#FF8C00 !important;
  text-align:left;
}
body  #hero-and-body .box-text-news span{  
  font-family: 'quark-light';
  font-weight: 500;
  font-size: 18px;
  color: #554b4b;
 }

}
/* responsive */
@media(min-width: 768px) and (max-width: 1023px){
body #hero-and-body .single_wrap .title h3{ 
  font-weight: 700;
  font-size: 25px;
  color: #FF8C00 !important;
  text-align:left;
}
body  #hero-and-body .box-text-news span{  
  font-family: 'quark-light';
  font-weight: 700;
  font-size: 22px;
  color: #554b4b;
 }

}