@import url('https://fonts.googleapis.com/css?family=Kanit'); body { margin: 0px auto; font-size: 14px; background-image: url('../images/bg.jpg'); font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif"; width:100%; } img {border:0px;} .topbar { width: 100%; background-color:#FFFFFF;border-bottom: #c0c0c0 solid 1px; } .nav { width: 990px; margin: 0px auto; padding: 5px 0px 5px 0px; } .nav .nav_icon { float: left; margin-left: 400px;height:29px; } .nav .login { float: right; margin-top: 6px; padding-right: 20px; border-right: #e0e0e0 solid 1px; } .nav .login a { text-decoration: none; color: #000; } .nav .register { float: right; margin-top: 6px; margin-right: 20px; padding: 0px 20px 0px 20px; border-right: #e0e0e0 solid 1px; border-left: #e0e0e0 solid 1px; } .nav .register a { text-decoration: none; color: #000; } .nav .social { float:right;margin: 6px 5px 0px 0px;font-size:11px;} .main { width: 990px; margin: 0px auto; background-color: #FFFFFF; } .content_body {float:left; width: 100%; background:url('../images/bgright.jpg') repeat-y right;} .search {float: right; margin-right: 5px; width:550px;height:50px;background-image:url(../images/search.jpg);} .search input[type=text] {float:left;margin:10px 0px 0px 40px;height: 26px;width:410px;background:transparent;border:0px;} .search input[type=image] {float:left;margin:6px 0px 0px 10px;} .menu_1 { float: left; width: 100%; background-color: #ebebeb; padding: 0px; margin: 0px; font-size: 11px; height:22px;} .menu_1 span { float: left; padding: 0px; padding-left: 10px; } .menu_1 li { list-style: none; float: left; position: relative; padding:3px 0px 0px 10px; } .menu_1 li:first-child { background-color: #fff; padding:0px 0px 0px 10px;height:21px;} .menu_1 li:last-child { float: right; margin-right: 10px; } .menu_1 li a { color:#6a7064; } .menu_2 { float: left; width: 100%; height: 24px; padding: 0px; margin: 0px; background-image: url('../images/bg1.jpg'); } .menu_2 li { list-style: none; float: left; position: relative; padding: 5px 5px 5px 5px; color: #FFF; font-weight: bold; } .menu_2 li:first-child { margin-left: 4px; width:68px; padding-left: 10px;} .menu_2 li a { text-decoration: none; color: #FFF } .menu_2 .active { background:url('../images/bg_menu_a.jpg') no-repeat; color: #000; border-top: #99cc00 solid 1px; padding-top: 4px; } .menu_2 .active a {color:#000;} .sub_menu_1 { float: left; width: 988px; height: 26px; !height: 22px; background-color: #ededed;background:url('../images/bg_main_menu.jpg');border:#fff5c4 solid 1px;} .sub_menu_1 ul { float:left; padding: 0px;margin:0px; font-size:11px;} .sub_menu_1 ul li { list-style: none; float: left; color: #000; margin:0px; border-right:#fff5c4 solid 1px;cursor:pointer;} .sub_menu_1 ul li a {text-decoration:none;color:#000;font-weight:bold;} .sub_menu_1 ul li a span {float:left; padding:6px 10px 7px 10px;} .sub_menu_1 ul li.active {float:left; margin:0px;padding:0px;} .sub_menu_1 ul li.active a span{float:left; margin:0px;padding:6px 10px 7px 10px;font-weight:bold;background-color:#f7f3f3;border: #f7f3f3 solid 1px;} .sub_menu_1 ul li:first-child{padding-left:20px;} .sub_menu { float: left; width: 100%; height: 32px; background:url('../images/bg_submenu.jpg');} .sub_menu ul {margin:0px;padding: 0px; font-size:11px;} .sub_menu ul li { list-style: none; float: left;margin:0px; padding:6px 15px 6px 15px;} .sub_menu ul li:hover {background:#FFF;} .sub_menu ul li a {text-decoration:none;color:#006699;} .sub_menu ul li.active {font-weight:bold;background-color:#ffffff;} .sub_menu ul li.active a{color:#cc0000;} .adv { float: left; width: 990px; height: 100px; background-color: #e0e0e0; border: solid 0px; background-image:url('../images/image3.jpg');} .adv>.banner {width:728px;height: 90px; margin:5px auto;} .content_left { float: left; width: 680px; margin-top: 10px; } .news { float: left; width: 675px; padding: 10px 0px 10px 0px; border-bottom: #999999 dashed 1px;} .news .image1 { float: left; width: 200px; height: 200px; margin-left: 5px; } .news .image2 { float: left; width: 70px; height: 70px; margin-left: 5px; } .news .right { float: left; margin-left: 20px; color: #505050; } .news .title { float: left; color: #000; width: 100%; border: #FF0000 solid 0px; } .news .title a { text-decoration:none; color: #000000; font-size: 13px; font-weight:bold; } .news .short_desc_1 { float: left; width: 430px; margin-top: 0px;} .news .short_desc { float: left; width: 230px; margin-top: 0px;} .news .social { float: right; } .paging { float: left; padding: 0px; color: #FFF; } .paging li { float: left; list-style: none; padding: 1px 8px 1px 8px; margin-left: 3px; background-color: #ff6600; font-size: 10px; } .paging li:first-child { background-color: #ff9900; } .content_right { float: right; width:300px; margin-top: 10px;} .content_right .tab_panel { float: left; width:298px; background-color: #fbf5d5; border: #dad8dd solid 1px; margin-top:-1px;} .content_right .tab_panel a { text-decoration: none; color:#000000; } .content_right .tab_active { float: left; width: 120px; text-align: center; padding: 2px 10px 2px 10px; font-size: 14px; font-weight: bold; background-color: #fbf5d5; border: #dad8dd solid 1px; border-bottom: #fbf5d5 solid 1px; position: relative; } .content_right .tab { float: left; width: 120px; text-align: center; padding: 2px 10px 2px 10px; font-size: 14px; font-weight: bold; background-color: #fbfbfb; border: #dad8dd solid 1px; border-right: #dad8dd solid 1px; position: relative; border-bottom: #dad8dd solid 1px; cursor: pointer; } .content_right .border1 { float: left; width: 100%; height: 2px; border-top: #dad8dd solid 1px; margin-top:-1px; z-index: 10 } .menu_3 { float: left; padding: 0px; margin: 10px; font-size: 11px; font-weight: bold; } .menu_3 li { list-style: none; float: left; padding: 0px 5px 0px 5px; color: #000; border-right: #b0b0b0 solid 1px; } .menu_3 li:last-child { border: 0px; } .menu_3 li a { text-decoration: none; color: #000 } .footer { float: left;} .footer .link { float: left; padding: 0px; width: 700px; margin: 0px 0px 0px 10px; font-size: 11px; clear: left; } .footer .link li { list-style: none; float: left; padding: 0px 5px 0px 5px; color: #000; border-right: #b0b0b0 solid 1px; } .footer .link li:first-child { font-weight: bold; border: 0px; } .footer .link li:last-child { border: 0px; } .footer .link li a { text-decoration: none; color: #000; } .footer .logo { float: left; margin: 20px 0px 0px 100px; } .footer .email { float: left; margin: 15px; font-size: 11px; } .footer .email a { color: #666666; } .content_left .news_view { float:left; margin: 10px 0px 0px 20px; width:650px;} .content_left .news_view .title { font-size: 20px; width: 650px; color: #F40011; padding-bottom: 3px; background:url('../images/linedot.gif') no-repeat bottom } .content_left .news_view .date { float: left; color: #919191; margin-top: 3px; } .content_left .news_view .relative { float: left; width: 100%; color: #000000; background:url('../images/linedot.gif') no-repeat top; padding: 20px 0px 0px 0px; } .content_left .news_view .relative li { list-style: none; float: left; width: 140px; text-align: center; margin:0px 20px 0px 0px; padding-bottom: 10px; } .content_left .news_view .relative li a {text-decoration:none;color:#000;} .content_left .news_view .relative li img { width: 70px; } .comment_box {float:left; border: #e9e9e9 solid 5px;} .comment { float: left; width: 100%; background-color: #e9e9e9; } .comment .avatar { float: left; margin: 10px 5px 10px 5px; } .comment .description { float: left; background-color:#FFF;width:100%;border-top:#e9e9e9 solid 2px;} .comment .no { float: left; margin: 5px 0px 0px 5px; width: 100%; font-weight: bold; color:#f26d04;} .comment .message { float: left; margin: 15px 0px 5px 5px; border-bottom: #909090 dashed 1px; padding-bottom:15px; width: 970px; } .comment .visitor { float: left; margin: 0px 0px 5px 5px; } .comment .log { float: right; margin-right: 10px; padding-bottom:5px; } .comment .log .date { float:left;color:#339936; } .comment .log .separate { float:left;color:#909090;padding:0 5px 0 5px; } .comment .log .ip { float:left;color:#f30005;padding-right: 10px; } #btn_submit{cursor:pointer;} .login2 { float:left; width: 100%; background-color:#e9e9e9; padding: 10px 0px 10px 0px;} .comment_form { float:left; width: 100%; background-color:#e9e9e9; padding: 0px 0px 10px 0px;} .comment_form span { float:left;width:99%; font-weight:bold;color:#6a6663;background-color:#FFF; height:30px; background:url(../images/commentbg.gif);} .comment_form span img { float:right;} .comment_form span img:first-child { float:left;} .comment_form span div { float:left;width: 800px;margin-top:6px;} .comment_form .emo { float:left;width:320px; margin:0px 10px 0px 10px;} .comment_form .richtech{float:left;} .comment_form textarea { float:left;width:400px; height: 200px;} .spacing {width:100%;height:10px;float:left;} .menu_left {float:left;width:130px;margin-left:5px;} .menu_left ul {float:left;width:128px;border:#cccccc solid 1px; border-top: #cccccc solid 2px; padding:0px; margin:0px;} .menu_left ul li {list-style-type:none;padding:10px 0px 5px 30px;border-top:dashed #cccccc 1px;} .menu_left ul li a{color:#5c5c5c;text-decoration:none;} .menu_left ul li:first-child {border:0px;} .hi_light_news {float:left;width:415px;margin-left:5px;z-index:999;} .hi_light_news>.image{float:left;width:200px;height:200px;margin-left:10px;} .hi_light_news>.image>a>img{width:200px;height:200px;} .hi_light_news>.image:first-child{margin-left:0px;} .hi_light_news>.image>a{text-decoration:none;} .hi_light_news>.image>a>.title {position:relative;top:-75px;background-color:black; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter: alpha(opacity=70);opacity:0.7; color:#FFF;font-weight:bold;font-size:16px;width:180px;height:63px;padding:5px 10px 5px 10px;} .hi_light_news>.image>a>.title:hover {background-color:#505050;} .hi_light_2 {float:left;width:418px;margin-left:1px;} .hi_light_2 .tab {float:left;padding:0px;margin:0px;} .hi_light_2 .tab li {float:left;list-style-type:none;border:#cccccc solid 1px;border-left:0px;width:60px;height:24px;z-index:100px;position:relative;} .hi_light_2 .tab li:first-child {width:85px;border-left:#cccccc solid 1px;} .hi_light_2 .tab li.active{border-bottom:#FFF solid 1px;} .hi_light_2 .panel {float:left;border:#cccccc solid 1px;color:#5c5c5c;margin-top:-1px;z-index:10px;width:100%;padding:10px 0px 10px 0px} .hi_light_2 .panel ul {float:left;padding:0px; margin:20px 10px 10px 20px} .hi_light_2 .panel ul li {list-style-type:none;background:url('../images/arrow_1.jpg') no-repeat left; padding-left: 14px;} .hi_light_2>.panel>.ss{float:left;width:130px;margin-left: 5px;text-align:center;} .hi_light_2>.panel>.ss>a{text-decoration:none;color:black;} .hi_light_2>.panel>.ss>a>img{width:100px;height:100px;} .hi_light_2>.panel>.ss:hover{background:#e5e5e5;} .content_tab {float:left;margin:5px 0px 0px 10px;width:530px;padding-bottom:10px;} .content_tab .tab {float:left;padding:0px;margin:0px;cursor:pointer;} .content_tab .tab li {float:left;list-style-type:none;border:#cccccc solid 1px;border-left:0px;width:60px;height:24px;z-index:100px;position:relative;text-align:center;} .content_tab .tab li span{position:relative;top: 5px;text-decoration:none;color:#5c5c5c;} .content_tab .tab li:first-child {width:85px;border-left:#cccccc solid 1px;} .content_tab .tab li.active{border-bottom:#FFF solid 1px;font-weight:bold;color:#696969;} .content_tab .panel {float:left;border-top:#cccccc solid 1px;color:#5c5c5c;margin-top:-1px;z-index:10px;display:none;} .content_tab .panel ul {float:left;padding:0px; margin:10px 10px 10px 0px;width:520px;} .content_tab .panel ul li {float:left;list-style-type:none;width: 120px;text-align:center;margin: 10px 10px 0px 0px;padding:5px 0px 5px 0px;} .content_tab .panel>ul>li>a {text-decoration:none;color:#000000;font-size:11px; } .content_tab .panel ul li a img {width:73px;} .content_tab .panel #read_more {float:right;margin-right:5px;padding:5px;background:#c0c0c0; } .content_tab .panel #read_more:hover {cursor:pointer;background:#FFFFFF;} .content_tab .panel #read_more a {text-decoration:none;color:#000;} .content_tab .panel>ul>li:hover {background:#e5e5e5}; .content_right {float:right; width:300px;margin:5px 10px 0px 0px;} .content_right .banner_1 {width:300px; height:250px;background:#c0c0c0;} .content_right .news_pr {float:right;padding:0px;margin:10px 0px;width:300px;} .content_right .news_pr>div {border:#cccccc solid 1px;border-bottom:#cccccc solid 2px;color:#5c5c5c;width:100%;padding: 5px 0px 5px 0px;} .content_right .news_pr li {list-style-type:none;float:left;width:100%;margin-top:10px;} .content_right .news_pr li>a {text-decoration:underline;color:#000000;} .content_right .news_pr li>a>img {float:left;width:50px;height:50px;} .content_right .news_pr li>a>div {float:left;margin-left:8px;width:240px;color:#666666;} .content_2 {float:left; margin-left: 5px; width:978px; background:#ebebeb;border-bottom:#cdcdcd solid 3px;} .content_2 .banner_2 {float:left; width:300px; height:250px;margin:10px 0px 10px 10px;background:#c0c0c0;} .content_2>ul {float:left;padding:0px;margin:0px 0px 0px 20px} .content_2>ul>li {list-style-type:none;float:left;border-left:#cdcdcd solid 1px;padding: 10px 8px 0px 8px;width:145px;height:260px;} .content_2>ul>li>a{font-weight:bold;color:#000;text-decoration:none;} .content_2>ul>li>ul{padding:0px;margin:10px 0px 0px 15px;} .content_2>ul>li>ul>li{width:130px;} .ul_spacing{padding:0px;margin-left:14px;} .ul_spacing>li{list-style-type:none;float:left;width:323px;height:25px;border-left:#cdcdcd solid 1px;border-bottom:#cdcdcd solid 1px;} .ul_spacing>li:first-child{border-left:0px;width:321px;} .content_3{float:left;width:320px;height:300px;border:#cdcdcd solid 1px;border-right:0px;padding-bottom:10px;} .content_3>.title{font-weight:bold;width:100%;height:30px;border-bottom:#cdcdcd solid 1px;border-top:#cdcdcd solid 1px;} .content_3>.title>span{float:left;margin:7px 0px 0px 25px;} .content_3>.title>.more{float:right;font-size:11px;font-weight:normal;margin:8px 10px;} .content_3>.title>.more a{text-decoration:none;color:#606060;} .content_3>ul{float:left;margin:0px;padding:0px;} .content_3>ul>li{float:left;width:140px;text-decoration:none;list-style:none;color:#686868;margin:4px 0px 4px 12px;padding:4px 0px 4px 0px;text-align:center;} .content_3>ul>li>a{text-decoration:none;color:#686868;} .content_3>ul>li>a>img{width:67px;height:70px;} .content_3>ul>li:hover{background:#e5e5e5;} #movie {float:left;padding:0px;width:320px;margin:0px;margin-left:15px;border-top:#cdcdcd solid 3px;background:url('../images/bg_read_more.jpg') no-repeat bottom;} #movie>.title{float:left;border-bottom:#cdcdcd solid 1px;font-weight:bold;margin-top:0px;width:100%;} #movie>.title>img {float:left;margin-left:5px;} #movie>.title>span {float:left;margin:5px 0px 0px 2px;} #movie>ul {float:left;padding:0px;margin:0px;border-right:#cdcdcd solid 1px;width:100%;} #movie>ul>li {float:left;list-style-type:none;margin-top:10px;width:96px;padding:0px 4px 0px 4px;text-align:center;} #movie>ul>li>a {color:#686868;font-size:11px;} #tv {float:left;padding:0px;width:320px;margin:0px 0px 0px 1px;border-top:#cdcdcd solid 3px;background:url('../images/bg_read_more.jpg') no-repeat bottom;} #tv>.title{float:left;border-bottom:#cdcdcd solid 1px;font-weight:bold;margin-top:0px;width:100%;height:25px;} #tv>.title>img {float:left;margin-left:5px;} #tv>.title>span {float:left;margin:5px 0px 0px 2px;} #tv>ul {float:left;padding:0px;margin:0px;border-right:#cdcdcd solid 1px;width:100%;} #tv>ul>li{float:left;list-style-type:none;margin-top:10px;width:150px;padding:0px 4px 0px 4px;text-align:center;} #tv>ul>li>a{color:#686868;font-size:11px;} #tv>ul>li>a>img{width:120px;height:120px;} #tv>ul>li:hover{background:#e5e5e5;} #tv>.sub_section{float:left;margin:10px 0px 0px 10px;width:300px;border-top:#cdcdcd dashed 1px;} #tv>.sub_section>ul{float:left;padding:0px;margin:10px 0px 0px 20px;width:130px;color:#656565;font-size:11px;} #star {float:left;padding:0px;width:320px;margin:0px 0px 0px 1px;border-top:#cdcdcd solid 3px;background:url('../images/bg_read_more.jpg') no-repeat bottom;} #star>.title{float:left;border-bottom:#cdcdcd solid 1px;font-weight:bold;margin-top:0px;width:100%;} #star>.title>img{float:left;margin-left:5px;} #star>.title>span{float:left;margin:5px 0px 0px 2px;} #star>ul {float:left;padding:0px;margin:0px;width:100%;} #star>ul>li{float:left;list-style-type:none;margin-top:10px;width:150px;padding:0px 4px 0px 4px;text-align:center;} #star>ul>li>a{color:#686868;font-size:11px;} #star>ul>li>a>img{width:120px;height:120px;} #star>ul>li:hover{background:#e5e5e5;} #star>.sub_section{float:left;margin:10px 0px 0px 10px;width:300px;border-top:#cdcdcd dashed 1px;} #star>.sub_section>ul{float:left;padding:0px;margin:10px 0px 0px 20px;width:130px;color:#656565;font-size:11px;} ul.sort_tab {float:left;padding:0px;margin:0px;} ul.sort_tab li {float:left;list-style-type:none;border:#c0c0c0 solid 1px;border-left:0px;border-bottom:#FFF solid 1px;text-align:center;font-size:14px;font-weight:bold;} ul.sort_tab li.active {border-bottom:#ebebeb solid 1px;background:#ebebeb;} ul.sort_tab li a {text-decoration:none;color:#000000} ul.sort_tab li a span {padding:0px 20px 0px 20px;color:#000000} .articleDetailTitle { font-family:'Kanit',sans-serif; } .radius { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } .radius-top { -moz-border-radius-topright: 5px; -moz-border-radius-topleft: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-left-radius: 5px; } .radius-bottom { -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } ul.pagination { margin: 10px 0; padding: 0; list-style: none; } ul.pagination li { display: inline-block; } ul.pagination li a.page { display: block; border: 1px solid #CCCCCC; color: #333333; text-shadow: 0 1px 1px #FFFFFF; font-weight: bold; margin: 0 2px; padding: 4px 8px; background-color: #F6F6F6; background-image: -moz-linear-gradient(#F6F6F6, #EEEEEE); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #F6F6F6),color-stop(1, #EEEEEE)); background-image: -webkit-linear-gradient(#F6F6F6, #EEEEEE); background-image: -o-linear-gradient(#F6F6F6, #EEEEEE); background-image: linear-gradient(top, #F6F6F6, #EEEEEE); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#F6F6F6', EndColorStr='#EEEEEE'); } ul.pagination li a.page:hover, ul.pagination li span.page-active { display: block; border: 1px solid #0CA1D3; background-color: #EEEEEE; text-decoration: none; font-weight: bold; color: #FFFFFF; margin: 0 2px; padding: 4px 8px; text-shadow: 0 1px 1px #000000; background-color: #95D7EF; background-image: -moz-linear-gradient(#95D7EF, #59C8EF); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #95D7EF),color-stop(1, #59C8EF)); background-image: -webkit-linear-gradient(#95D7EF, #59C8EF); background-image: -o-linear-gradient(#95D7EF, #59C8EF); background-image: linear-gradient(top, #95D7EF, #59C8EF); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#95D7EF', EndColorStr='#59C8EF'); cursor: pointer; } ul.pagination li span.page-inactive { display: block; background-color: #F9F9F9; border: 1px solid #CCCCCC; margin: 0 2px; padding: 4px 8px; } .latest_news{float:left; width:636px;margin:10px 0px 0px 20px;background:url('../images/bg3.png');} .latest_news>.ss{float:left;width:138px;margin-left: 1px;padding:0px 10px 0px 10px;text-align:center;} .latest_news>.ss>a{text-decoration:none;color:black;} .latest_news>.ss>a>img{width:70px;height:70px;} .latest_news>.ss:hover{background:#FFF;} /**********************************************************************************************************************************************************************/ /**** For Template v2 ****/ .header { width:100%; min-width:1380px; height:101px; background:url('../images/v2/header-bg.png'); } /**** Begin Header Top ****/ .header > .top { margin:0px auto; width:990px; height:54px; clear:both; } .header > .top img.logo { float:left; margin-top:10px; } .header > .top > .section-right { float:right; list-style:none; padding:0px; margin:0px; height:100%; } .header > .top > .section-right > li { float:left; border-right:#326d13 solid 1px; border-left:#9ae25c solid 1px; height:100%; padding:0px 5px 0px 5px; } .header > .top > .section-right > li:first-child { border-left:0px; } .header > .top > .section-right > li > div { position:relative; top:18px; } .header > .top > .section-right > li > div.search_form > form { float:left; border:#f8b502 solid 1px; background:#f8b502; margin-top:-5px; } .header > .top > .section-right > li > div.search_form > form > input[type=text] { float:left; border:#f8b502 solid 1px; height:26px; margin:0px; } .header > .top > .section-right > li > div.search_form > form > input[type=text]:focus { border:#f8b502 solid 1px; } /**** End Header Top ****/ /**** Begin Main Menu ****/ .header > .main-menu { position:relative; width:100%; height:46px; background:url('../images/v2/main-menu-bg.png'); z-index:9999; text-align:center; } .header > .main-menu > ul { margin:0px auto; width:1094px; padding:0px; height:46px; list-style:none; font-family:'Kanit',sans-serif; } .header > .main-menu > ul > li { float:left; margin:0px; height:46px; font-size:15px; padding-right:10px; color:#FFF; cursor:pointer; } .header > .main-menu > ul > li > a { text-decoration:none; color:#FFF; } .header > .main-menu > ul > li > a > span { float:left; margin-top:14px; } .header > .main-menu > ul > li > a > span:first-child { float:left; margin-top:0px; padding:14px 0px 10px 20px; } .header > .main-menu > ul > li > a > span.arrow-down { background:url('../images/v2/arrow-down.png') no-repeat right; width:10px; height:20px; margin-left:5px; } .header > .main-menu > ul > li:hover { background-color:#ff9900; height:100%; } .header > .main-menu > ul > li.active { background-color:#ff9900; height:100%; } .header > .main-menu > ul > li:first-child { border-right:#386811 solid 1px; } .header > .main-menu > ul > li:first-child:hover { background:#f8b502; } .header > .main-menu > ul > li:first-child.active { background:#f8b502; } .header > .main-menu > ul > li:first-child:hover > .sub-menu-home { display:block; } .header > .main-menu > ul > li.active-orange:hover { background-color:#ff9900; height:100%; } .header > .main-menu > ul > li.active-orange.active { background-color:#ff9900; height:100%; } .header > .main-menu > ul > li.active-gray:hover { background-color:#ececec; height:100%; } .header > .main-menu > ul > li.active-gray.active { background-color:#ececec; height:100%; } .header > .main-menu > ul > li.active-blue:hover { background-color:#406b98; height:100%; } .header > .main-menu > ul > li.active-blue.active { background-color:#406b98; height:100%; } /**** End Main Menu ****/ /**** Begin Home Submenu ****/ .header > .main-menu > ul > li > .sub-menu-home { position:absolute; background:#f8b502; list-style:none; padding:0px; z-index:9999; top:46px; display:none; } .header > .main-menu > ul > li > .sub-menu-home > li { border-top:#805d03 solid 1px; border-bottom:#ffe28c solid 1px; clear:both; text-align:left; } .header > .main-menu > ul > li > .sub-menu-home > li:first-child > a > span { border-top:0px; background:url('../images/v2/arrow-up.png') no-repeat 20px; } .header > .main-menu > ul > li > .sub-menu-home > li > a { text-decoration:none; color:#FFF; } .header > .main-menu > ul > li > .sub-menu-home > li > a > span { float:left; padding:10px 20px 10px 50px; width:100%; } /**** End Home Submenu ****/ /**** Begin Submenu ****/ .header > .main-menu > ul > li > div { position:absolute; width:100%; left:-0px; margin-top:46px; list-style:none; padding-bottom:8px; display:none; } .header > .main-menu > ul > li:hover > div { display:block; } .header > .main-menu > ul > li > div > ul { margin:0px auto; width:1140px; padding:0px; list-style:none; } .header > .main-menu > ul > li > div > ul > li { float:left; width:134px; height:35px; margin:8px 8px 0px 0px; text-align:center; font-size:15px; color:#FFF; cursor:pointer; } .header > .main-menu > ul > li > div > ul > li > a { text-decoration:none; color:#FFF; } .header > .main-menu > ul > li > div > ul > li > a > span { float:left; padding:8px 0px 8px 0px; width:100%; text-align:center; } .header > .main-menu > ul > li > div.orange { background:#ff9900; } .header > .main-menu > ul > li > div.orange > ul > li { background:#fcbf66; } .header > .main-menu > ul > li > div.gray { background:#ececec; } .header > .main-menu > ul > li > div.gray > ul > li { background:#d0d0d0; } .header > .main-menu > ul > li > div.blue { background:#406b98; } .header > .main-menu > ul > li > div.blue > ul > li { background:#74a6d7; } /**** End Submenu ****/ .hot-link { list-style:none; margin:0px; padding:0px; } .hot-link > li { float:left; width:168px; border:#FFF solid 1px; background:#e1e1e1; text-align:center; padding:5px 0px 5px 0px;} .hot-link > li a { text-decoration:none; color:#000; font-size:14px; } /**** Begin Latest News ****/ .latest_news { float:left; list-style:none; margin:0px; padding:0px; width:340px; background:none; } .latest_news > li { float:left; width:100%; height:90px; border-top:#a0a0a0 solid 1px; } .latest_news > li:first-child { border-top:0px; } .latest_news > li > a { color:#000; } .latest_news > li > a > img { float:left; width:110px; height:68px; margin:10px; } .latest_news > li > a > span { float:left; width:200px; height:68px; margin:10px 01px 0px 0px; } /**** End Latest News ****/ /**** Begin Highlight ****/ ul.highlight { list-style:none; position:relative; width:auto; padding:0px; margin:0px; font-family:'Kanit',sans-serif;} ul.highlight > li { float:left; width:200px; height:200px; border:solid 1px; margin:4px 0px 0px 4px; } ul.highlight > li > a > img { float:left; width:100%; height:100%; z-index:998; } ul.highlight > li > a > span { position:absolute; width:190px; height:50px; background:#000; color:#FFF; margin-top:140px; margin-left:-200px; overflow:hidden; font-size:16px; padding:5px; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter: alpha(opacity=70);opacity:0.7; z-index:999; } ul.highlight > li > a > span:hover { background-color:#505050; } /**** End Highlight ****/ /**** Begin Tab ****/ .popcorn-tab { float:left; width:730px; } .popcorn-tab > .tab { float:left; list-style:none; padding:0px; margin:0px 0px 0px 4px; clear:both; z-index:99; } .popcorn-tab > .tab > li { float:left; width:auto; border:#a0a0a0 solid 1px; border-left:0px; cursor:pointer; } .popcorn-tab > .tab > li:first-child { border-left:#a0a0a0 solid 1px; } .popcorn-tab > .tab > li.active { border-bottom:#FFF solid 1px; font-weight:bold; } .popcorn-tab > .tab > li > span { float:left; margin:6px 20px 4px 20px; } .popcorn-tab > .panel { position:left; list-style:none; margin:-1px 0px 0px 4px; padding:0px; border-top:#a0a0a0 solid 1px; z-index:90; font-family:'Kanit',sans-serif;} .popcorn-tab > .panel > li { float:left; width:170px; height:170px; border:#e0e0e0 solid 1px; margin:8px 8px 0px 0px; } .popcorn-tab > .panel > li > a > img { position:absolute; width:170px; height:170px; } .popcorn-tab > .panel > li > a > span { position:absolute; padding:5px; width:160px; height:50px; margin-top:96px; overflow:hidden; font-size:14px; background:#000; color:#FFF; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter: alpha(opacity=70);opacity:0.7; } .popcorn-tab > .panel > li:hover > a > span { width:165px; height:55px; margin-top:91px; margin-left:-3px; background:#505050; color:#FFF; } .popcorn-tab > .panel > .read_more { float:left; background:#FF6600; width:712px; } .popcorn-tab > .panel > .read_more > a { color:#FFF; text-decoration:none; font-weight:bold; } .popcorn-tab > .panel > .read_more > a > span { float:left; margin:5px; } .popcorn-tab > .panel > .read_more > a > span > img { float:left; margin-left:250px; } .popcorn-tab > .panel > .read_more > a > span > span { float:left; margin:5px 0px 0px 10px; } .popcorn-tab > .listview { float:left; padding:0px; display:none; border:0px; margin-top:0px; } .popcorn-tab > .listview > li { float:left; width:100%; padding:10px 0px 0px 0px; margin:0px; height:auto; border:0px; border-top:#cccccc dashed 1px; } .popcorn-tab > .listview > li:first-child { border-top:#cccccc solid 1px; } .popcorn-tab > .listview > li > ul { float:left; width:100%; list-style:none; padding:0px; height:auto; margin:0px; } .popcorn-tab > .listview > li > ul > li { float:left; font-size:14px; clear:right; padding:0px; padding-left:20px; width:640px; color:#505050; background:url('../images/v2/bullet-square-orange.png') no-repeat 5px; height:22px; padding-top:5px; } .popcorn-tab > .listview > li > ul > li.bg-gray { background-color:#f5f5f5; } .popcorn-tab > .listview > li > ul > li > a { text-decoration:none; color:#505050; } .popcorn-tab > .listview > li > ul > li > a > span { float:left; width:500px; overflow-x:hidden; white-space:nowrap; } .popcorn-tab > .listview > li > ul > li > span.num_view { float:right;width:40px; background:url('../images/v2/icon-view.png') no-repeat 5px; padding-left:25px; font-size:11px; } .popcorn-tab > .listview > li > ul > li > span.num_comment { float:right; width:40px; background:url('../images/v2/icon-comment.png') no-repeat 5px; padding-left:25px; font-size:11px; } .panel.listview > li > .listview-2 { float:left; padding:0px; margin:0px; width:730px; list-style:none; } .panel.listview > li > .listview-2 > li { float:left; font-size:14px; clear:right; padding:0px; padding-left:20px; width:710px; color:#505050; background:url('../images/v2/bullet-square-gray.png') no-repeat 5px; } .panel.listview > li > .listview-2 > li.bg-gray { background-color:#f5f5f5; } .panel.listview > li > .listview-2 > li > a { text-decoration:none; color:#505050; } .panel.listview > li > .listview-2 > li > span.num_view { float:right; width:40px; background:url('../images/v2/icon-view.png') no-repeat 5px; padding-left:25px; font-size:11px; } .panel.listview > li > .listview-2 > li > span.num_comment { float:right; width:40px; background:url('../images/v2/icon-comment.png') no-repeat 5px; padding-left:25px; font-size:11px; } .listview-2 { float:left; padding:0px; margin:0px; width:730px; list-style:none; } .listview-2 > li { float:left; font-size:14px; clear:right; padding:0px; padding-left:20px; width:710px; color:#505050; background:url('../images/v2/bullet-square-gray.png') no-repeat 5px; height:22px; padding-top:5px; font-family:'Kanit',sans-serif; } .listview-2 > li.bg-gray { background-color:#f5f5f5; } .listview-2 > li:hover { background-color:#ebebeb; } .listview-2 > li > a { text-decoration:none; color:#505050; } .listview-2 > li > a > span { float:left; width:570px; overflow-x:hidden; white-space:nowrap; } .listview-2 > li > span.num_view { float:right; width:40px; background:url('../images/v2/icon-view.png') no-repeat 5px; padding-left:25px; font-size:11px; } .listview-2 > li > span.num_comment { float:right; width:40px; background:url('../images/v2/icon-comment.png') no-repeat 5px; padding-left:25px; font-size:11px; } .listview-2 .read_more { float:left; background:#FF6600; width:712px; margin:10px; } .listview-2 .read_more > a { color:#FFF; text-decoration:none; font-weight:bold; } .listview-2 .read_more > a > span { float:left; margin:5px; } .listview-2 .read_more > a > span > img { float:left; margin-left:250px; } .listview-2 .read_more > a > span > span { float:left; margin:5px 0px 0px 10px; } /**** End Tab ****/ /**** Begin Ads ****/ .ads-title { float:left; width:100%; text-align:center; clear:both; padding:5px 0px 2px 0px; text-transform:uppercase; clear:both; } .banner-170x170 { float:left; width:170px; height:170px; } .banner-336x280 { float:left; width:336px; height:280px; } .banner-300x250 { float:left; width:300px; height:250px; } .banner-300x600 { float:left; width:300px; height:600px; } .banner-300x1200 { float:left; width:300px; height:1200px; } .banner-728x90 { float:left; width:728px; height:90px; } .banner-990x90 { margin:0px auto; width:990px; height:90px; } /**** End Ads ****/ .form-register h2 { color:#75b11b; } .form-register > label { float:left; clear:both; width:180px; font-size:16px; margin-left:10px; color:#505050; } .form-register > label > span { color:#FF0000; } .form-register > label > img { border:#a0a0a0 solid 1px; } .form-register > div { float:left; color:#a0a0a0; } .form-register > input[type=text] { float:left; border:#a0a0a0 solid 1px; width:240px; } button { padding:6px 20px 6px 20px; font-size:18px; color:#707070; } .comment { float:left; background:#f0f0f0; width:100%; font-size:12px; color:#000; } .comment > .form { float:left; margin:10px; font-size:11px; } .comment > #divMsg { float:left; padding:10px 0px 10px 0px; } .comment > #divMsg > .emo_icon { float:left; width:142px; border:#e0e0e0 solid 0px; margin-left:5px; } .comment > #divMsg > .emo_icon > div { float:left; border:#e0e0e0 solid 1px; border-left:0px;border-top:0px; width:22px; height:22px; } .comment > #divMsg > .emo_icon > div > img { margin:2px; cursor:pointer; } .comment > #divMsg > textarea { float:left; width:340px; height:100px; margin-left:10px; } .comment > #divMsg > input[type=button] { padding:20px 10px 20px 10px; margin-left:10px; background:#d9d9d9; border:solid 1px; } .comment > form > #divMsg { float:left; padding:10px 0px 10px 0px; } .comment > form > #divMsg > .emo_icon { float:left; width:142px; border:#e0e0e0 solid 0px; margin-left:5px; } .comment > form > #divMsg > .emo_icon > div { float:left; border:#e0e0e0 solid 1px; border-left:0px;border-top:0px; width:22px; height:22px; } .comment > form > #divMsg > .emo_icon > div > img { margin:2px; cursor:pointer; } .comment > form > #divMsg > textarea { float:left; width:340px; height:100px; margin-left:10px; } .comment > form > #divMsg > input[type=button] { padding:20px 10px 20px 10px; margin-left:10px; background:#d9d9d9; border:solid 1px; } .comment > .box { float:left; width:650px; background:#f9f9f9; border:#e0e0e0 solid 1px; border-top:0px; } .comment > .box.best { border:#8de600 solid 2px; } .comment > .box > .number { float:left; width:30px; text-align:center; font-size:24px; font-weight:bold; margin-top:15px; color:#909090; } .comment > .box > .thumb { float:left; width:50px; height:50px; margin-top:5px; } .comment > .box > .thumb > img { width:100%; height:100%; } .comment > .box > .message { float:left; width:350px; margin:5px 0px 0px 10px; } .comment > .box > .topRight { float:right; margin:2px; } .comment > .box > .topRight > span { position:relative; top:-5px; left:-10px; } .comment > .box > .bottom { float:right; font-size:11px; } .comment > .box > .bottom > .green { color:#2d9326; } .comment > .box > .bottom > .red { color:red; } .comment > .box > .top { float:left; margin:6px 0px 0px 4px; color:#f46614; font-weight:bold; } .comment > .normal { background:#FFF; } .comment > .normal > .topRight > span { font-size:11px; } .comment > .normal > .image { float:left; margin:5px 0px 0px 10px; text-align:left; } .comment > .normal > .image > .thumb{ width:50px; height:50px; clear:both } .comment > .normal > .image > .thumb > img { width:100%; height:100%; } .comment > .normal > .message { width:350px; } .comment > .normal > .message { width:350px; } .comment > .normal > .message .main-img { max-width:400px; } .comment > .reply { margin-left:50px; width:600px; } .subComment { position:absolute; float:left; left:12px; padding:10px 0px 10px 0px; width:650px; display:none; z-index:999; background:#FFF; border:#e0e0e0 solid 1px; } .subComment > .emo_icon { float:left; width:150px; border:#e0e0e0 solid 1px; margin-left:5px; } .subComment >.emo_icon > img { cursor:pointer; } .subComment > textarea { float:left; width:300px; height:90px; margin-left:10px; } .subComment > input[type=button] { padding:10px 10px 10px 10px; margin-left:10px; } form[name=form-new-topic] > div.row { float:left; width:99%; margin:10px 0px 0px 10px; } form[name=form-new-topic] > div.row > label { float:left; width:70px; padding-left:10px; padding-right:10px; text-align:right; } form[name=form-new-topic] > div.row > input[type=text] { width:600px; } form[name=form-new-topic] > div.row > textarea { width:400px; height:200px; } /**** Begin Webboard Category Menu ****/ .webboard-cat-menu { list-style:none; padding:0px; float:left; width:1406px; height:auto; background:#ff9900; color:#fff; font-size:14px; z-index:-999} .webboard-cat-menu > li { float:left; height:40px; } .webboard-cat-menu > li.no-border { border:solid 0px; } .webboard-cat-menu > li.active { background:#FFFFFF; } .webboard-cat-menu > li.active > a > span { color:#000; } .webboard-cat-menu > li:hover > ul { display:block; } .webboard-cat-menu > li > a > span { float:left; padding: 12px 30px 8px 30px; color:#FFFFFF; } .webboard-cat-menu > li > a > span.arrow-down { float:left; padding:0px; width:10px; height:40px; background:url('../images/v2/arrow-down.png') no-repeat right; margin-right:10px; } .webboard-cat-menu > li:first-child { border-right:#FFF solid 1px; } .webboard-cat-menu > li:first-child > a > span { padding-right: 5px; } .webboard-cat-menu > li:first-child:after { float:left; height:40px; content:''; border-right:#6c4406 solid 1px; } .webboard-cat-menu > li.last { float:right; border-right:0px; border-left:#6c4406 solid 1px; } .webboard-cat-menu > li.last > ul { margin-left:-96px; } .webboard-cat-menu > li.last > ul > li > a > span { float:left; padding:10px 40px 10px 20px; color:#FFF;} .webboard-cat-menu > li.last:before { float:left; border-left:#FFF solid 1px; content:''; height:100%; } .webboard-cat-menu > li > ul { position:absolute; list-style:none; padding:0px; border:#FFF solid 1px; background:#b86f00; margin-top:40px; display:none; } .webboard-cat-menu > li > ul > li { border-top:#dea049 solid 1px; clear:both; } .webboard-cat-menu > li > ul > li:first-child { border:0px; } .webboard-cat-menu > li > ul > li > a { text-decoration: none; } .webboard-cat-menu > li > ul > li > a > span { float:left; padding:10px 40px 10px 20px; color:#FFF; } .webboard-cat-menu #triangle-topleft { position: absolute; margin-top:40px; margin-left:80px; width: 0; height: 0; border-style: solid; border-width: 50px 25px 0 0; border-color: #7d5300 transparent transparent transparent; } .webboard-poster { float:left; border:#a0a0a0 solid 2px; width:336px; } .webboard-poster a { text-decoration:none; } .webboard-poster > .user { float:left; margin:20px 10px 20px 20px; text-align:center; } .webboard-poster > .user img { max-width:50px; max-height:50px; } .webboard-poster > .user > strong > a { color:#fb5f00; } .webboard-poster > .num { float:left; width:200px; margin-top:5px; } .webboard-poster > .num > .number { float:left; background:#c0c0c0; padding:5px; min-width:25px; text-align:right; } .webboard-poster > .num > .text { float:left; margin:5px 0px 0px 10px; width:150px; } .webboard-poster > .num > .text > a { color:#000; } .stick { position:fixed; z-index:1; } .pre-thumb { cursor:pointer; padding:2px; margin-right:2px; border:1px solid #999; width:50px; height:50px; } .dropzone { background:url('../images/v2/drop-zone.png'); width:200px; height:62px; } #emo { cursor:pointer; padding-top:5px; background:#dbdbdb; width:680px; float:right; } #emo > img { cursor:pointer; background:#dbdbdb; } .tagsTitle { float:left; color:#000; margin-top:4px; font-weight:bold; margin-left:10px; } .tagsText { float:left; list-style:none; padding:0px; margin:0px; margin-left:15px; width:640px; } .tagsText > li { float:left; background-color:#acb445; color:#FFF; padding:5px 10px 5px 10px; margin:0px 2px 2px 2px; } .tagsText > li:hover { background-color:#333333; } .tagsText > li > a { color:#FFF; text-decoration:none; } .relateNews { float:left; margin:20px 0px 0px 30px; padding:0px; list-style:none; font-size:13px; } .relateNews > li { float:left; width:150px; margin:10px 0px 0px 10px; text-align:center; overflow:hidden; } .relateNews > li:hover { background:#e6e6e6; } .relateNews > li > a { text-decoration:none; color:#000; } /*.relateNews > li > a > div { border:solid 1px; width:145px; height:145px; }*/ /*.relateNews > li > a > div > img { max-width:120px; max-height:120px; margin:5px auto; }*/ .relateNews > li > a > div { width:120px; height:120px; margin:0px auto; background:#000; overflow:hidden; } /*.relateNews > li > a > div > img { max-width:120px; max-height:120px; margin:0px auto; }*/ .relateNews > li > a > div > span { float:left; width:100%; margin-bottom:5px; } #float-login:hover { background-color:#FFF; } #float-login:hover .float-login { display:block; background-color:#FFF; } #float-login:hover #icon-user { content:url('../images/v2/icon-user.jpg'); } .float-login { position:absolute; border:#c0bbb5 solid 1px; border-top:0px; width:280px; margin:6px 0px 0px -248px; z-index:11000; display:none; color:#5e5e5e; } .float-login a { color:#9d9d9d; } .float-login > form > ul { float:left; list-style:none; padding:0px; margin:20px; } .float-login > form > ul > li { padding-bottom:10px; } .float-login > form > ul > li > label { float:left; width:60px; } .float-login > form > ul > li > a { font-weight:bold; } .float-login > form > ul > li > input[type=button] { border:0px; background:#f87c02; color:#FFF; padding:5px 10px 5px 10px; } #popup-login { padding:10px 0px 10px 100px; color:#000; width:280px; display:none; } #popup-login a { color:#9d9d9d; } #popup-login > form > ul { float:left; list-style:none; padding:0px; margin:0px; width:280px; } #popup-login > form > ul > li { padding-bottom:10px; } #popup-login > form > ul > li > label { float:left; width:60px; } #popup-login > form > ul > li > a { font-weight:bold; } #popup-login > form > ul > li > input[type=button] { border:0px; background:#f87c02; color:#FFF; padding:5px 10px 5px 10px; } .dzImage { max-width:640px; } .content-tab > .panel { float:left; display:none; } .content-tab > .panel:first-child { display:block; } .content-tab > .panel img.thumb { float: left; margin-left: 5px; width: 50px; height:50px; } .content-tab > .panel img.thumb.first { width:100px; height:100px; margin: 10px 0px 0px 100px; } .black-ribbon { position: fixed; z-index: 9999; width: 70px; } @media only all and (min-width: 768px) { .black-ribbon { width: auto; } } .stick-left { left: 0; } .stick-right { right: 0; } .stick-top { top: 0; } .stick-bottom { bottom: 0; } ul.tagsLink { clear:both; padding:0px; margin:0px; font-size:15px; } ul.tagsLink li { float:left; list-style: none; margin-left:10px; padding:5px 10px 5px 10px; background-color:#d0d0d0; border-radius: 5px;} ul.tagsLink li a { text-decoration:none;color:#000; } ul.tagsLink li:hover { background-color:#c0c0c0; }