@charset "utf-8";
/* CSS Document */
/*###Global*/
/*html {-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;
text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important; font-kerning: auto;}
*/
body {margin:0 auto; padding:0; font-family:Tahoma, Arial, Helvetica, sans-serif; font-size:14px; color:#616164; background:#f2f2f2;}

h1, h2, h3, h4 {font-family:"supermarketregular",Tahoma, Arial, Helvetica, sans-serif; margin:0; padding:0;}
p {margin:0; padding:0;}

a {color:inherit;}
a:hover, :hover, :hover a {-webkit-transition: all .2s ease-in-out !important; -moz-transition: all .2s ease-in-out !important; -o-transition: all .2s ease-in-out !important; -ms-transition: all .2s ease-in-out !important; transition: all .2s ease-in-out !important; text-decoration:none; outline:none !important;}

a:active, a:visited {color:inherit !important; outline:none !important;}

.clear {clear:both;}
.word-break {word-break: break-all; word-wrap: break-word;}
.img-responsive {max-width:100%; display:block;}
/*###End global*/

/*###Layout*/
/*row-bgcolor*/
.row-bgcolor-yellow {background:#dd9716;}
.row-bgcolor-yellow2 {background:#e3e3d7; padding:30px 0;}
.row-bgcolor-yellow3 {background:#f6f6ef; padding:20px 0;}
.row-bgcolor-yellow3-pad {background:#f6f6ef; padding:0;}

.row-bgcolor-white {background:#fff; padding:30px 0;}
.row-bgcolor-white2 {background:#fff; padding:15px 0;}
.row-shadow {background:url(../images/shadow.png) repeat-x top center; margin-bottom:-19px; z-index:1; position:relative;}
.row-bgslope-footer {background:url(../images/bar-slop-footer.png) no-repeat bottom right #fff; min-height:45px; max-height:45px; display:block;}
.row-linedot {background:url(../images/dot.gif) repeat-x center center; height:20px; margin:30px 0;}
/*end rowbgcolor*/

/*logo*/
.logo {float:left; margin:5px 10px 0 0;}
.logo-mobile {display:none;}

.txtname {font-size:26px; color:#fff; font-weight:normal;}
.txtname-mobile {display:none;}
.txtname span.txt-en {font-size:18px; display:block;}
/*end logo*/

/*Background Slider*/
/*end background slider*/

/*mntop*/
ul.mntop {margin:30px 0; padding:0; text-align:right;}
ul.mntop li {margin:0; padding:0 7px; list-style:none; display:inline; font-family:"supermarketregular",Tahoma, Arial, Helvetica, sans-serif; color:#000; font-size:16px;}
ul.mntop li a { color:inherit;}
ul.mntop li a:hover, ul.mntop li:hover a {color:#fff !important; text-decoration:none;}
ul.mntop li img {margin:0 7px 0 0; border:0;}

.menutop {color:#000;}
.menutop-active {color:#fff !important;}
/*end mntop*/

/*mainmn*/
ul.mainmn {margin:0; padding:0; text-align:center;}
ul.mainmn li {margin:0; padding:0 25px; list-style:none; display:inline; font-family:"supermarketregular",Tahoma, Arial, Helvetica, sans-serif; color:#4a4a4a; font-size:21px; line-height:23px;}
ul.mainmn li a { color:inherit;}
ul.mainmn li:hover a {color:#dd9716 !important; text-decoration:none;}

.mainmenu {color:#fff;}
.mainmenu-active {color:#dd9716 !important;}
/*end mainmn*/

/*menu on left*/
ul.mnleft {margin:0; padding:0; font-family:"supermarketregular",Arial, Helvetica, sans-serif; font-size:18px;}
ul.mnleft li {margin:0; list-style:none;}

.mnleft-normal {padding:7px 10px; color:#424242; border-top:0;}
.mnleft-normal a {color:#424242;}

.mnleft-normal:hover a, .submnleft-normal:hover a {color:#dd9716 !important;}

.mnleft-active {padding:7px 10px; color:#fff; background:#dd9716; }
.mnleft-active a {background:#dd9716; color:#fff;}
.mnleft-active:hover a {color:#fff !important;}

.line-mnleft {border-bottom:1px solid #ccc;}

ul.submnleft {margin:10px 0 10px 10px; padding:0; background:#fff;}
ul.submnleft li {margin:0; padding:2px 0 2px 10px; list-style:none;}

.submnleft-normal { background:url(../images/icn-arrow-nav.png) no-repeat 0 9px; color:#424242;}
.submnleft-normal a {color:#424242;}
.submnleft-normal:hover {background:url(../images/icn-arrow-nav-yell.png) no-repeat 0 9px;}

.submnleft-acitve {background:url(../images/icn-arrow-nav-yell.png) no-repeat 0 9px; color:#dd9716;}
.submnleft-acitve a {color:#dd9716;}
/*end menu on left*/

/*Text Header*/
.txt-headerpage {font-size:24px; line-height:22px; margin-bottom:20px; color:#424242;}
.txt-headerpage-inner {font-size:24px; line-height:22px; margin-bottom:10px; color:#424242;}

.txt-headerpage span {font-size:18px; color:#dd9716;}

.txt-header-situ {color:#7a6b4f; font-size:18px; margin-bottom:20px; letter-spacing:1px;}

.txt-subheader {color:#dd9716; font-size:22px; margin-bottom:20px; letter-spacing:1px;}
.txt-subheader-badge {background:#654306; color:#fff; font-size:12px; padding:3px 10px; border-radius:50%; -webkit-border-radius:50%;}
.txt-subheader2 {color:#dd9716; font-size:18px; margin-bottom:10px; padding:0 0 0 13px; background:url(../images/icn-arrow-nav-yell.png) no-repeat 0 5px;}
.txt-brief-depart {margin:0 0 20px 0; padding:0; text-indent:50px !important;}

.arrow-down-header {background:url(../images/icn-arrow-down.png) no-repeat 0 0; width:31px; height:15px; position:absolute; z-index:2;}
/*end text header*/

/*Navigation*/
.row-nav {margin:20px 0; color:#424242;}
.row-nav span, .row-nav a:hover {color:#dd9716;}
.icn-nav {background:url(../images/icn-arrow-nav.png) no-repeat 0 0; width:7px; height:9px; margin:0 7px; display:inline-block;}

.row-pagenum {margin-top:30px; clear:both;}
/*end navigation*/

/*Btn*/
.btn-read-all {background:#7a6b4f; color:#fff; text-align:center; margin:0 auto; display:block; width:110px; padding:7px 20px;}
.btn-read-more {background:#616164; color:#fff; text-align:center; margin:0 auto; display:block; width:100px; padding:7px 20px;}

.btn-read-all:hover, .box-news:hover .btn-read-more {background:#dd9716;}
/*end btn*/

/*######Index page*/
/*Hero slider*/
.img-vdo-slider {border:1px solid #fff; max-width:100%;}
.box-content-slider-2 { /*background:url(../../images/bg-alpha.png); padding:10px; width:auto; */margin-top:140px;}
.box-content-slider-3 {margin-top:0px;}

.txtname-mkl {color:#3d3c3c; font-size:28px; margin:0 0 10px 0; padding:0;}
/*.txt-quote {font-size:132px; color:#dd9716; position:absolute; top:20px;}
*/
p.txt-brief-mkl {margin:0; padding:0;}
p.txt-brief-mkl span {color:#dd9716;}

.img-youtube {float:left; margin:0 20px 10px 0; max-width:100%;}

/*Situation section*/
.box-list-situ {display:block; min-height:inherit; max-height:inherit;}
ul.list-situ { margin:0 0 20px 0; padding:0;}
ul.list-situ li {margin:0; padding:7px 0 12px 32px; border-bottom:1px solid #ccc; color:#616164; list-style:none; background:url(../images/icn-pdf.png) no-repeat 0 7px;}
ul.list-situ li a {color:inherit;}
ul.list-situ li:hover, ul.list-situ li a:hover {color:#dd9716;}
/*end situation section*/

/*News Section*/
.txt-read-all {font-family:"supermarketregular",Tahoma, Arial, Helvetica, sans-serif; background:url(../images/icn-readmore.png) no-repeat 0 0; font-size:18px; color:#3d3c3c !important; text-align:right; float:right; padding:0 0 0 25px;}
.txt-read-all:hover, .txt-read-all:hover a, .txt-read-all a:hover {color:#dd9716 !important;}

.box-news { margin:0; padding:0;}
.box-news:hover img.img-news {border:3px solid #dd9716;}
.box-news:hover .txt-topic-news {color:#dd9716;}
.box-news:hover .txt-brief-news {color:#dd9716;}

.img-news {border:3px solid transparent; max-width:100%; margin-bottom:10px;}

.txt-topic-news {color:#7a6b4f; font-size:18px; min-height:100px; margin-bottom:10px; /*font-family:tahoma, Arial, Helvetica, sans-serif; font-weight:bold;*/}
.txt-topic-news span { background:url(../images/icn-time.png) no-repeat 0 0; display:block; color:#3d3c3c; margin-top:7px; padding:0 0 0 25px; line-height:18px; font-weight:normal;}
.box-news:hover .txt-topic-news span {background:url(../images/icn-time-hover.png) no-repeat 0 0; color:#dd9716;}

.txt-brief-news { margin:0; padding:0; min-height:100px;}
/*end news section*/

/*cctv section*/
.box-show-map {margin-top:20px;}
.img-cctv {display:block; width:100%; max-width:100%; height:auto; margin-bottom:20px; vertical-align:middle; border:0;}
.click-show-map {font-family:"supermarketregular",Arial, Helvetica, sans-serif; font-size:16px; color:#dd9716;}
.click-show-map a:hover {color:#000;}
/*end cctv section*/

/*report section*/
ul.boxreport {margin:0; padding:0;}
ul.boxreport li {margin:0 auto; padding:10px 20px; list-style:none; display:block; float:none; width:164px; height:144px;}

.box-report {background:#fff; border:1px solid #616164; text-align:center !important;}
.box-report img {margin:0 auto 20px auto !important; width:auto !important; height:auto;}
.box-report h3 { color:#616164; font-size:16px;}
.box-report:hover h3 {color:#dd9716;/*opacity:.5; -moz-opacity:.5; -webkit-opacity:.5; filter:alpha(opacity=50);*/}
.box-report:hover {border:1px solid #dd9716;}
.box-report:hover img {opacity:.7; -moz-opacity:.7; -webkit-opacity:.7; filter:alpha(opacity=70);}

/*.box-24h {background:url(../images/icn-time24.png) no-repeat center 20px #fff;}
.box-24h:hover {background:url(../images/icn-time24-over.png) no-repeat center 18px #fff;}

.box-cctv {background:url(../images/icn-cctv.png) no-repeat center 20px #fff;}
.box-cctv:hover {background:url(../images/icn-cctv-over.png) no-repeat center 18px #fff;}

.box-tele {background:url(../images/icn-tele.png) no-repeat center 20px #fff;}
.box-tele:hover {background:url(../images/icn-tele-hover.png) no-repeat center 18px #fff;}

.box-situ {background:url(../images/icn-situation.png) no-repeat center 20px #fff;}
.box-situ:hover {background:url(../images/icn-situation-over.png) no-repeat center 18px #fff;}

.box-daily {background:url(../images/icn-summary-report.png) no-repeat center 20px #fff;}
.box-daily:hover {background:url(../images/icn-summary-report-over.png) no-repeat center 18px #fff;}

.box-sumdaily {background:url(../images/icn-summary-report.png) no-repeat center 20px #fff;}
.box-sumdaily:hover {background:url(../images/icn-summary-report-over.png) no-repeat center 18px #fff;}

.box-dam {background:url(../images/icn-dam.png) no-repeat center 20px #fff;}
.box-dam:hover {background:url(../images/icn-dam-over.png) no-repeat center 18px #fff;}
*/
/*end report section*/
/*######end Index page*/

/*######Inner page*/
/*Situation page*/
ul.list-situation {margin:0 0 30px 0; padding:0;}
ul.list-situation li {margin:0; padding:10px 20px 20px 20px; background:url(../images/dot.gif) repeat-x bottom left; border-bottom:none; color:#424242; list-style:none !important;}
ul.list-situation li:hover {color:#dd9716; background:url(../images/dot.gif) repeat-x bottom left #f6f6ef;}
ul.list-situation li:hover a {color:#dd9716;}
ul.list-situation li img {float:left; margin:0 10px 10px 0;}

ul.list-situation li .txt-situ-info {display:block; font-size:12px; color:#a3a3a3; margin:7px 0 20px 0;}
ul.list-situation li:hover .txt-situ-info {color:#dd9716;}
ul.list-situation li .txt-situ-info p {float:left; margin:0 10px 0 0;}
ul.list-situation li .txt-situ-info p img {float:left; margin:0 3px 0 0;}

.txtcomment {color:#f00;}
.txt-yellow {color:#dd9716;}
/*end situation page*/

/*cctv page*/
.border-cctv {border:1px solid #6a6a6a; margin-bottom:20px; text-align:center;}
.border-cctv h6 {font-size:13px; color:inherit; background:#efefef; display:block; margin:0; padding:10px 0;}
.border-cctv h6 a {color:inherit;}
.border-cctv:hover {border:1px solid #dd9716;}
.border-cctv:hover, .border-cctv:hover h6 {color:#dd9716;}
/*end cctv page*/

/*##knowledge page*/
.box-document {margin-bottom:20px;}
.box-document h6 {font-size:14px; color:inherit; display:block; margin:0; padding:10px; min-height:105px;}
.box-document h6 a {color:inherit;}
.box-document h6 small {color:#a6a6a6; margin-top:7px;}
.box-document img {max-width:100%; display:block; text-align:center; margin:0 auto; border:1px solid #fff;}
.box-document img:hover {border:1px solid #dd9716;}
.box-document:hover, .box-document:hover h6, .box-document:hover h6 small {color:#dd9716;}

ol.list-basin {margin:0; padding:0;}
ol.list-basin li {margin:7px 0; padding:0; list-style:none; background:url(../images/bg-cycle.png) no-repeat 0 0; line-height:22px;}
ol.list-basin li span {font-family:"supermarketregular",Tahoma, Arial, Helvetica, sans-serif; font-size:16px; color:#fff; margin:0 10px 0 4px;}
ol.list-basin li:hover, ol.list-basin li:hover a {color:#dd9716;}

.details-basin {margin:0 0 30px 0; padding:0;}
.details-basin .img-mapbasin {float:right; margin:0 0 20px 20px; max-width:100%;}
.details-basin .img-mapbasin-left {float:left; margin:0 20px 20px 0; max-width:100%;}

.details-basin .img-responsive {margin-bottom:30px;}

.details-basin ul {margin:20px 0 20px 40px; padding:0;}
.details-basin h3 {font-size:18px; margin-bottom:7px; color:#333;}

.btn-download-basin-doc {background:url(../images/icn-download-white.png) no-repeat 20px 7px #dd9716; display:block; width:250px; padding:10px 10px 10px 30px;color:#fff; font-family:"supermarketregular",Tahoma, Arial, Helvetica, sans-serif; font-size:18px; text-align:center;}
.btn-download-basin-doc:hover{color:#fff; background:url(../images/icn-download-white.png) no-repeat 20px 7px #616161;}
.btn-download-basin-doc a:hover {color:#fff;}

.btn-more-detail {background:#dd9716; display:block; padding:10px; margin:20px 0 0 0; color:#fff; font-family:"supermarketregular",Tahoma, Arial, Helvetica, sans-serif; font-size:18px; text-align:center;}
.btn-more-detail:hover{color:#fff; background:#616161;}
.btn-more-detail a:hover {color:#fff;}

/*##end knowledge page*/

/*Weblinks page*/
ul.list-weblinks {margin:0; padding:0;}
ul.list-weblinks li {margin:0 0 20px 0; padding:0 0 20px 0; list-style:none; display:block; background:url(../images/dot.gif) repeat-x bottom left;}
ul.list-weblinks li .img-weblink { float:left; margin:0 20px 20px 0;}
ul.list-weblinks li .txtbrief-weblink {word-wrap:break-word;}
ul.list-weblinks li h3 {font-size:18px; color:#dd9716;}

ul.list-weblinks li:hover {color:#dd9716;}
ul.list-weblinks li:hover .img-weblink {filter:alpha(opacity=80); -moz-opacity:.8; -webkit-opacity:.8;}
/*end Weblinks page*/

/*News page*/
.img-newsB {float:left; margin:0 20px 20px 0;}
.txtbrief-news-detail h2 {font-size:21px; color:#dd9716;}
.txtbrief-news-detail h2 span, ul.list-othernews li .txtbrief-othernews h2 span {margin-left:10px;}
.txtbrief-news-detail h3, ul.list-othernews li .txtbrief-othernews h3 {font-size:16px; color:#a6a6a6; margin:5px 0 20px 0;}

.row-btn-news {margin:20px 0;}
.btn-news {float:left; display:block; margin:0 10px 0 0; padding:7px 20px; text-align:center;font-family:"supermarketregular",Tahoma, Arial, Helvetica, sans-serif; font-size:18px; color:#fff;}
.btn-news a {color:#fff;}
.btn-news:hover {fiter:alpha(opacity=80); opacity:.8; -moz-opacity:.8; -webkit-opacity:.8; cursor:pointer;}

.btn-gallery { background:#dd9716;}
.btn-download {background:#7a6b4f;}

.box-other-news {margin:50px 0 0 0;}
ul.list-othernews {margin:0; padding:0;}
ul.list-othernews li {margin:0; padding:20px 0; list-style:none; display:block; background:url(../images/dot.gif) repeat-x bottom left;}
ul.list-othernews li .img-othernews {float:left; margin:0 20px 0 0;}
ul.list-othernews li .img-othernews img {width:220px; height:133px;}

ul.list-othernews li .txtbrief-othernews h2 {font-size:18px; color:#dd9716;}
ul.list-othernews li:hover, ul.list-othernews li:hover a {color:#dd9716;}

.row-btn-back { margin-top:50px; padding-bottom:30px;}
.line-dot-hor {background:url(../images/dot.gif) repeat-x 0 0; height:20px;}

.btn-back {background:url(../images/icn-prev-page.gif) no-repeat 0 0; font-family:"supermarketregular", Arial, Helvetica, sans-serif; font-size:18px; margin-top:20px !important; padding:0 0 0 50px; line-height:30px;}
.btn-back:hover, .btn-back:hover a {color:#dd9716;}
/*end news page*/

/*About page*/
.img-about {float:left; margin:0 20px 0 0; max-width:100%;}
.txtbrief-about span {color:#dd9716; font-weight:bold;}
.txtbrief-about a {color:#dd9716 !important; text-decoration:underline !important;}
.txtbrief-about a:hover {text-decoration:none !important;}

.row-txtobject { clear:both; margin-top:30px;}
.row-txtobject ul {margin:0 0 0 20px; padding:0;}
.row-txtobject ul li { margin:0; padding:0; list-style:url(../images/icn-disc-yell.png);}

ul.list-about { margin:0 0 30px 30px; padding:0;}
ul.list-about li {margin:0; padding:0;}
ul.list-about li ul {margin:0; padding:0;}
ul.list-about li ul li {margin:10px 0 10px 30px; padding:0; list-style:circle;}

.txt-about-special {font-family:"supermarketregular",Arial, Helvetica, sans-serif; font-size:27px;}
.txt-about-special2 {font-family:"supermarketregular",Arial, Helvetica, sans-serif; font-size:18px;}
.txt-about-special span {color:#dd9716;}
.txt-about-special span.colon {font-size:50px;}

ul.list-about-author { margin:0 0 30px 30px; padding:0;}
ul.list-about-author li {margin:0; padding:0;}
.row-img-about-author { margin-top:30px;}
.row-img-about-author img {float:left; margin:0 7px 0 0; max-width:100%;}

.box-about-people {text-align:center; margin-bottom:40px;}
.box-about-people:hover .txtname-people span {color:#dd9716;}
.box-about-people:hover .boximg-people {border:1px solid #dd9716;}

.boximg-people {border:1px solid #000; margin-bottom:10px; }
.boximg-people img {width:100%; max-width:100%;}

.txtname-people {color:#dd9716; font-size:14px; font-family:Tahoma, Arial, Helvetica, sans-serif; line-height:18px;}
.txtname-people span {display:block; color:#616164;}

.popup-info-people {margin:0; padding:20px;}
.popup-info-people h3 {font-size:22px; color:#dd9716;}
.popup-info-people h3 span {font-size:18px;display:block; color:#616164;}
.popup-info-people img {float:left; margin:0 20px 20px 0;}
.img-person {border:1px solid #666; max-width:100%;}
.popup-info-people a {color:#616161; text-decoration:underline;}
.popup-info-people a:hover {text-decoration:none; color:#dd9716;}

.txtfield-popup {width:120px; display:block; float:left;}
/*end about page*/

/*Contact page*/
.txt-address { margin:0 auto; width:100%; text-align:center;}
.txt-address h2 { font-size:22px; color:#dd9716; margin-bottom:10px;}
.txt-address h2 span {display:block; font-size:18px;}

.box-map {text-align:center; border:3px solid #ccc; padding:12px;}
.box-map img {max-width:100%;}
.box-map:hover {border:3px solid #dd9716;}
/*end Contact page*/

/*Sitemap page*/
ul.list-sitemap {margin:0; padding:0;}
ul.list-sitemap li {margin:0 0 0 20px; padding:0 0 0 13px; font-size:18px; font-family:"supermarketregular", Arial, Helvetica, sans-serif; color:#dd9716; list-style:none; background:url(../images/icn-arrow-nav-yell.png) no-repeat 0 7px;}
ul.list-sitemap li ul {margin:10px 0 10px 30px; padding:0;}
ul.list-sitemap li ul li {margin:0; padding:0; color:#424242; font-family:Tahoma, Arial, Helvetica, sans-serif; font-size:14px; list-style:disc; background:none;}
ul.list-sitemap li ul li a:hover { color:#dd9716;}
/*end Sitemap page*/

/*download app*/
.row-adload-app {margin:20px 0;}
.box-load-app {background:#efefef; margin:0 auto 20px auto; padding:10px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; text-align:center; width:100%;}
.box-load-app img {max-width:100%;}
.box-load-app:hover {background:#ccc;}

.img-screen-app {margin:0 10px 20px 10px; max-width:100%;}
/*end download app*/
/*######end Inner page*/


/*Footer*/
.row-bgfooter {background:#654306; color:#e9c682; padding:30px 0;}
.row-bgfooter a {color:inherit;}
.row-bgfooter p {margin-bottom:10px;}

.txt-topic-footer {color:#fff; font-size:18px; margin-bottom:10px;}

ul#mnfooter {margin:0 0 0 20px; padding:0;}
ul#mnfooter li {margin:0; padding:0;}
ul#mnfooter li a {color:inherit; text-decoration:none;}
ul#mnfooter li a:hover, ul#mnfooter li:hover a, ul#mnfooter li:hover {color:#dd9716;}

.line-ver-right {border-right:1px solid #5c3d06; min-height:265px;}
.line-ver-left {border-left:1px solid #694c19; min-height:265px;}

.row-bgfooter-copy {background:#5c3d06; color:#e9c682; padding:20px 0; border-top:1px solid #694c19;}
.row-bgfooter-copy a {color:#fff; text-decoration:underline;}

.row-gototop {position:absolute; right:0; left:0;}
.btn-gototop {background:url(../images/icn-goto-top.png) no-repeat top center; color:#dd9716; font-family:"supermarketregular",Tahoma, Arial, Helvetica, sans-serif; font-size:18px; padding:10px 0 10px 0;}
.btn-gototop:hover {cursor:pointer;}
/*end footer*/
/*#####################end layout*/


/***********************Resposive css*/
@media only screen and (max-width:414px) {
/*Header*/
.logo {float:none; display:block;}
.txtname { display:none;}
.txtname-mobile {display:inline; font-size:18px; font-family:"supermarketregular",Tahoma, Arial, Helvetica, sans-serif; color:#fff;}

.logo-mobile {display:inline; padding:5px 0; width:auto;}
.logo-hidden {display:none !important;}

.txt-headerpage-inner {font-size:21px;}
.txt-subheader {font-size:18px;}
/*end header*/

/*Index page*/
.txt-headerpage {font-size:18px;}

.img-youtube {float:none;}
.txtname-mkl {font-size:18px;}

.btn-read-all, .btn-read-more {margin-bottom:30px;}

.txt-topic-news {min-height:inherit;}
.txt-brief-news {min-height:inherit; margin-bottom:10px;}

.box-show-map {margin-bottom:30px;}
/*end index page*/

/*news page*/
ul.list-othernews li .img-othernews {float:none; margin:0 0 20px 0;}
/*end news page*/

/*About page*/
.txt-about-special {font-size:18px; line-height:20px;}
.txt-about-special span.colon {font-size:30px;}

.popup-info-people {padding:20px 0;}
.popup-info-people h3 {font-size:18px; }
.popup-info-people img {float:none; margin:0 0 20px 0;}
.txtfield-popup {float:none; display:block;}
/*end about page*/

/*download app*/
.img-screen-app {margin:0 auto 20px auto;}
/*end download app*/
}
@media only screen and (min-width:415px) and (max-width:449px){
/*Header*/
.logo {margin:7px 7px 10px 0;}
.txtname { font-size:15px; margin-top:17px !important;}
/*.txtname span { display:block;}
*/
/*end header*/
}

@media only screen and (min-width:450px) and (max-width:991px) {
/*Header*/
.logo {margin:7px 7px 7px 0;}
.txtname {margin-top:18px !important;}
/*end header*/
}

@media only screen and (max-width:567px) {
/*index page*/
.img-youtube {float:none; margin:0 0 20px 0; display:block;}
/*end index page*/

ul.list-situation li {margin:0 0 10px 0; padding:10px 0px 50px 0px;}
ul.list-situation li img {margin:0 10px 30px 0;}
}

@media only screen and (max-width:578px) {
span.page-no {display:block; margin-top:10px;}
span.inactive, a.paginate-arrow {margin:0 !important;}
}

@media only screen and (max-width:767px) {
/*header*/
.txtname {font-size:18px; margin-top:10px;}
.txtname span.txt-en {font-size:14px; display:block; margin-bottom:7px;}

.txt-headerpage-inner {font-size:21px;}
.txt-subheader {font-size:18px;}
/*end header*/

/*bgpage*/
.row-bgcolor-yellow3-pad {padding:30px 0 0 0;}
/*end bgpage*/

/*navigation*/
.row-nav {display:none;}
/*end navigation*/

/*Index page*/
.img-news {margin:0 auto 20px auto; display:block;}
.txt-topic-news {min-height:inherit;}
.txt-brief-news {min-height:inherit; margin-bottom:10px;}
.btn-read-all, .btn-read-more {margin:0 auto 30px auto;}

.box-show-map {margin-bottom:30px;}
/*end index page*/

/*knowledge document*/
.box-document h6 {min-height:auto; font-size:12px;}
/*end knowledge document*/

/*Basin*/
.details-basin .img-mapbasin, .details-basin .img-mapbasin-left {float:none; margin:0 0 30px 0; display:block; max-width:100%;}
/*end basin*/

/*Weblink page*/
ul.list-weblinks li .img-weblink {float:none; margin-bottom:10px;}
/*end weblink page*/

/*news page*/
ul.list-othernews li .img-othernews {float:none; margin:0 0 20px 0;}
ul.list-othernews li .img-othernews img {width:auto; height:auto;}

.txtbrief-news-detail h2 {font-size:18px;}
.img-newsB {float:none;}
/*end news page*/

/*About page*/
.txt-about-special {line-height:30px;}

.img-about {float:none; margin:0 0 20px 0;}
/*end about page*/

/*contact page*/
.txt-address {width:100%;}
.box-map {margin-bottom:20px;}
/*end contact page*/

/*footer*/
.line-ver-right, .line-ver-left {min-height:auto; border-left:none; border-right:none; margin-bottom:30px;}
.row-gototop { position:relative; margin:20px auto; text-align:center;}
/*end footer*/
}

@media only screen and (min-width:768px) and (max-width:991px) {
/*header*/
.txtname {font-size:18px; margin-top:10px;}
.txtname span.txt-en {font-size:14px; display:block; margin-bottom:7px;}
/*end header*/

/*Index page*/
.box-news img.img-news {float:left; margin-right:20px; margin-bottom:50px;}
.txt-topic-news span {display:table;}
.box-news .btn-read-more {display:table;}
/*end index page*/

/*contact page*/
.txt-address {width:100%;}
.box-map {margin-bottom:20px;}
/*end contact page*/

/*news page*/
.img-newsB {float:none;}
.txtbrief-news-detail h2 {font-size:18px;}
/*end news page*/

/*sitemap page*/
ul.list-sitemap {min-height:490px;}
/*end sitemap page*/

/*footer*/
.line-ver-right, .line-ver-left {border-left:none; border-right:none; margin-bottom:30px;}
/*end footer*/
}
@media only screen and (min-width:992px) {
/*Header*/
.txtname {margin-top:15px;}
/*end header*/
}

@media only screen and (min-width:992px) and (max-width:1023px) {
/*footer*/
.txt-topic-footer {font-size:16px;}
/*end footer*/
}

@media only screen and (min-width:768px) and (max-width:1024px) {
/*footer*/
.txt-topic-footer {font-size:16px;}
/*end footer*/
}
@media only screen and (min-width:768px) and (max-width:1023px) {
/*Index page*/
.txt-topic-news {min-height:inherit;}
.txt-brief-news {min-height:80px; margin-bottom:10px;}
.btn-read-all, .btn-read-more {margin:0 0 30px 0;}

.box-show-map {margin-bottom:30px;}
/*end index page*/

/*knowledge page*/
.details-basin .img-mapbasin-left, .details-basin .img-mapbasin {float:none; margin:0 0 20px 0; display:block;}
/*end knowledge page*/
}
@media only screen and (min-width:768px) and (max-width:1199px) {
/*header*/
.txt-headerpage-inner {font-size:21px;}
.txt-subheader {font-size:21px;}
/*end header*/
}

@media only screen and (min-width:992px) and (max-width:1199px) {
/*main menu*/
ul.mainmn li {font-size:18px; padding:0 20px;}
ul.mnleft {font-size:16px;}
/*end mainmenu*/

/*index page*/
.box-list-situ {min-height:430px; max-height:430px;}

.img-news {margin:0 auto 20px auto; display:block;}
.txt-topic-news {min-height:70px;}
.txt-brief-news {min-height:80px; margin-bottom:10px;}
.btn-read-all, .btn-read-more {margin:0 auto 30px auto;}
/*end index page*/

/*footer*/
.txt-topic-footer {font-size:16px;}
.icn-footer {display:none;}
/*end footer*/
}

@media only screen and (min-width:1024px) and (max-width:1199px) {
/*knowledge page*/
.details-basin .img-mapbasin-left, .details-basin .img-mapbasin {float:none; margin:0 0 20px 0; display:block;}
/*end knowledge page*/
}
@media only screen and (min-width:1200px){
/*index page*/
.box-list-situ {min-height:360px; max-height:360px;}
/*end index page*/

/*Weblink page*/
ul.list-weblinks li {float:left; width:30.9%; margin-right:20px;}
ul.list-weblinks li .img-weblink { float:none;}
ul.list-weblinks li .txtbrief-weblink { display:block; min-height:98px;}
/*end weblink page*/
}

/***end Resposive css*/

/*****************************************************/
/*****************####Edit Bootstrap CSS*/
@media only screen and (max-width:414px) {
.col-xs-6 {width:100%;}
}
/*****************####end Edit Bootstrap CSS*/