@charset "utf-8";
body {
    margin:0;
    padding:0;
    width:100%;
    /*    color:#9a9a9a;
        color:#000000;
        font:normal 12px/1.8em Arial, Helvetica, sans-serif;*/
    /*    background:#d9e7b6 ;*/
}
.main {
    padding:0;
    margin:0;

    background: #64991e;
    background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
    background: -moz-linear-gradient(top,  #7db72f,  #4e7d0e);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');

    margin:0;
    padding: 0 0 0 0;


    /*    background: none repeat scroll 0 0 #FFAB62;*/
    border-top: 1px solid #02932f;
    color: #333333;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.6);
    top: 0;
    left: 0;
    position: absolute;
    width: 100%;

}
.headSearch{
    color: #FFFFFF;

    /*text-shadow: 0.1em 0.1em 0.02em #000000;*/

    /*    background:#c2272d;*/
    /*    background:#01a734;*/
    color: #fef4e9;
    border: solid 1px #da7c0c;
    background: #f78d1d;
    background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
    background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');

    text-align:center;
    font-size: 12px;
    font-weight: bold;

    -webkit-border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
    -khtml-border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
    -moz-border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
    border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
    -moz-box-shadow: 0 0 3px #B6BDC4; /* กำหนดสีของกรอบและเงาครับ */
    -webkit-box-shadow: 0 0 5px #B6BDC4; /* กำหนดสีของกรอบและเงาครับ */
    box-shadow: 0 0 2px #B6BDC4; /* กำหนดสีของกรอบและเงาครับ */
    padding: 1px 1px 1px 1px;   /* กำหนดระยะห่างจากขอบด้านในของกรอบถึงขอบของรูปภาพ */
    border-color: #E2E2E2;
}
.clr {
    clear:both;
    padding:0;
    margin:0;
    width:100%;
    font-size:0;
    line-height:0;
}
.logo {
    padding:30px 0 20px 0;
    margin:0 auto;
    width:450px;
    float:left;
}
.logo img {
    float:left;
    margin:0 10px 0 0;
}

h1 {
    margin:0;
    padding: 5px 0 0 10px;
    width:400px;

    color:#fff;
    font:bold 24px Arial, Helvetica, sans-serif;
    letter-spacing:0px;

    text-shadow: 0.1em 0.1em 0.02em  #000000;
}
h1 a {
    color:#fff;
    text-decoration:none;
    float:left;
}
h1 span {
    color:#78bbe6;
}
h1 small {
    display:block;
    float:left;
    color:#fff;
    padding-left:2px;
    font:normal 12px Arial, Helvetica, sans-serif;
    letter-spacing:normal;
}
h2 {
    font:normal 24px Arial, Helvetica, sans-serif;
    padding:0;
    margin:5px 0;
    color:#595959;
}
p {
    margin:8px 0;
    padding:0 0 8px 0;
    font:normal 12px/1.8em Arial, Helvetica, sans-serif;
}
p.spec {
    text-align:right;
}
a {
    color: black;
    display: inline-block;
    /*height: 16px;*/
    /*line-height: 16px;*/
    margin: 0;
    padding: 1px 2px;
    text-decoration: none;
    white-space: nowrap;
}
a:hover {
    text-decoration:underline;
}
a.rm, a.com {
    margin-left:8px;
    padding:9px 12px;
    background:repeat-x top;
    text-decoration:none;
    color:#fff;
}
.header, .content, .menu_nav,  .footer, form, ol, ol li, ul, .content .mainbar, .content .sidebar {
    margin:0;
    padding:0;
}

#wrapper {
    min-height:100%;
    position:relative;
}
#header {
    top: 0;
}
#content {
    padding-top : 5px;
    padding-bottom : 50px;   /* Height of the footer element */
}
#footer {
    width:100%;
    /*    height:100px;*/
    position:absolute;
    bottom:0;
    left:0;
}


.header_resize {
    margin:0 auto;
    padding:3px 0 0 0;
    width:970px;
}
.header_img {
    /*    border-radius: 5px;*/
    /*    -moz-border-radius: 5px;ขนาดความโค้ง*/
    /*    -webkit-border-radius: 5px;ขนาดความโค้ง*/
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);/*ขนาดเงา*/
}

.menu_nav {
    margin:40px 0 0 0;
    padding:3px 0 0 10px;
    float:right;
    /*width:400px;*/
}
.menu_nav ul {
    list-style:none;
    padding:0;
    margin:0;
}
.menu_nav li {
    float:left;
    padding:0 5px;
}
.menu_nav li a {
    font:normal 13px Arial, Helvetica, sans-serif;
    color:#959595;
    display:block;
    float:left;
    padding:10px;
}
.menu_nav li a:hover {
    text-decoration:none;
    color:#78bbe6;
}
.menu_nav li.active a {
    text-decoration:none;
    color:#78bbe6;
}

.content {
    padding:10px 0 0 0;
}
.content_resize {
    margin:0 auto;
    padding:20px 0 0 0;
    width:970px;
}
.content .mainbar {
    margin:0;
    float:right;
}
.content .mainbar img {
    float:left;
    padding:4px;
    margin:0 10px 0 0;
    border:1px solid #eaecec;
    background-color:#fff;
}
.content .mainbar .article {
    margin:0 0 20px 0;
    padding:30px 20px;
    width:610px;
}
.content .mainbar .article span.butons a {
    margin:0 5px 0 0;
    float:right;
    color:#9a9a9a;
    padding:1px 10px;
    text-decoration:none;
    border:1px solid #ebe8e8;
    background:#fbfbfc;
}
.content .mainbar .article span.butons a:hover {
    border:1px solid #d9f0ff;
    background:#78bbe6;
    color:#fff;
    text-decoration:none;
}
.content .mainbar .article span.butons a.active {
    border:1px solid #ebe8e8;
    background:#78bbe6;
    color:#fff;
    text-decoration:none;
}
.content .sidebar {
    margin:0;
    padding:0;
    float:left;
}
.content .sidebar .gadget {
    margin:0 0 20px 0;
    padding:30px 20px;
    width:230px;
}


.content .mainbar .comment {
    margin:0;
    padding:16px 0 0 0;
}
.content .mainbar .comment img.userpic {
    border:1px solid #dedede;
    margin:10px 0px 0 0;
    padding:0;
    float:left;
}
.fbg {

    background: #030303;
    /*    background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
        background: -moz-linear-gradient(top,  #7db72f,  #4e7d0e);
        filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');*/

    margin:0;
    height: 45px;
    padding: 0 0 0 0;

    /*    background: none repeat scroll 0 0 #FFAB62;*/
    border-top: 1px solid #3e3e3e;
    color: #333333;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.6);
    bottom: 0;
    left: 0;
    position: absolute;
    width: 100%;

}
.fbg_resize {
    margin:0 auto;
    /*    padding:20px 20px;*/
    /* width:930px;*/
}
.fbg h2 {
    color:#dedddd;
}
.fbg p {
    color:#FFFFFF;
}
.fbg a {
    color:#FFFFFF;
    text-decoration:none;
}
.footer {
    margin:0 auto;
    /*    padding: 30px 0 20px 0;*/
}
.footer p {
    /*    float:right;*/
    text-align: center;
    margin:0;
    padding:6px 0 0 0;
    line-height:normal;

    text-shadow: 0.1em 0.1em 0.02em #000000;
}
.footer a {
    color:#FFFFFF;
    padding:inherit;
    text-decoration:underline;
}
.footer a:hover {
    text-decoration:none;
}

.shadow {
    -webkit-border-radius: 10px; /* กำหนดรัศมีของมุมครับ */
    -khtml-border-radius: 10px; /* กำหนดรัศมีของมุมครับ */
    -moz-border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
    border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
    -moz-box-shadow: 0 0 8px #B6BDC4; /* กำหนดสีของกรอบและเงาครับ */
    -webkit-box-shadow: 0 0 8px #B6BDC4; /* กำหนดสีของกรอบและเงาครับ */
    box-shadow: 0 0 8px #B6BDC4; /* กำหนดสีของกรอบและเงาครับ */
    padding:10px; /* กำหนดระยะห่างจากขอบด้านในของกรอบถึงขอบของรูปภาพ */
    background-color: #FFFFFF;
    border-color: #E2E2E2;
}

.pagging{
    font-size: 12px;
    padding-right: 10px;
    font-style: normal;
}
.anotherPage{
    font-style: normal;
    text-decoration:none;
    cursor: pointer;
}
.currentPage{
    text-decoration:underline;
    font-weight: bold;
    color: #004a80;
}

/*.mainOdd{
        border: 1px solid #FF4B02;
    background-color: #CCC;
    border-top: thin solid black;
}*/

.statusActive{
    color: #7db72f;
}

.statusInactive{
    color: #CC2222;
}


.odd{
    background: #CCC;
}

.even{
    background: #FFF;
}

.cName{
    font-weight: bold;
    text-decoration: underline;
    font-size: 12px;
    padding-bottom: 3px;
}


#tableReport{
    width: 100%;
    border-collapse: collapse;
    border:1px solid #9a9a9a;
}

#tableReport td{
    border:1px solid #9a9a9a;
    min-height: 30px;
    /*    background-color: #FFFFFF;*/
}

.buttonImg{
    padding: 3px 3px 3px 3px;
    border: 1px solid #004a80;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;

    webkit-transform:scale(0.9); /*Webkit: Scale down image to 0.8x original size*/
    -moz-transform:scale(0.9); /*Mozilla scale version*/
    -o-transform:scale(0.9); /*Opera scale version*/
    /*    -webkit-transition-duration: 0.5s; Webkit: Animation duration
        -moz-transition-duration: 0.5s; Mozilla duration version
        -o-transition-duration: 0.5s; Opera duration version*/
    opacity: 1; /*initial opacity of images*/

}

.buttonImg:hover{

    /*    -webkit-transition: opacity 1s ease-in-out;
        -moz-transition: opacity 1s ease-in-out;
        -o-transition: opacity 1s ease-in-out;
        -ms-transition: opacity 1s ease-in-out; 
        transition: opacity 1s ease-in-out;*/


    -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
    -moz-transform:scale(1.1); /*Mozilla scale version*/
    -o-transform:scale(1.1); /*Opera scale version*/

}

hr{
    color:#CCC;
    background-color:#E2E2E2;
    height:3px;border:none;
}