/*//////////////////////////////////////////////////////////////////
[ Table ]*/
.limiter {
    width: 100%;
    margin: 0 auto;
}

.jk-wraper-table {
    width: 960px;
    border-radius: 10px;
    overflow: hidden;
}

.jk-table {
    width: 100%;
    display: table;
    margin: 0;
}

@media screen and (max-width: 768px) {
    .jk-table {
        display: block;
    }
}

.jk-table.row {
    display: table-row;
    background: #fff;
}

    .jk-table.row.header {
        color: #ffffff;
        background: #6c7ae0;
    }


@media screen and (max-width: 768px) {
    .jk-table.row {
        display: block;
    }

        .jk-table.row.header {
            padding: 0;
            height: 0px;
        }

            .jk-table.row.header .cell {
                display: none;
            }

        .jk-table.row .cell:before {
            font-size: inherit;
            color: #808080;
            line-height: 1.2;
            text-transform: uppercase;
            font-weight: unset !important;
            margin-bottom: 13px;
            content: attr(data-title);
            min-width: 98px;
            display: block;
        }
}





.jk-table.cell {
    display: table-cell;
    vertical-align: top;
}



@media screen and (max-width: 768px) {
    .jk-table.cell {
        display: block;
    }
}

.jk-table.row .cell {
    font-size: inherit;
    color: #666666;
    line-height: 1.2;
    font-weight: unset !important;
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f2f2f2;
    vertical-align: top;
}

.jk-table.row.header .cell {
    font-size: inherit;
    color: #fff;
    line-height: 1.2;
    font-weight: unset !important;
    padding-top: 19px;
    padding-bottom: 19px;
}

.jk-table.row .cell:nth-child(1) {
    width: 360px;
    padding-left: 40px;
}

.jk-table.row .cell:nth-child(2) {
    width: 160px;
}

.jk-table.row .cell:nth-child(3) {
    width: 250px;
}

.jk-table.row .cell:nth-child(4) {
    width: 190px;
}


.jk-table, .row {
    width: 100% !important;
}

    .jk-table.row:hover {
        background-color: #ececff;
        cursor: pointer;
    }

@media (max-width: 768px) {
    .jk-table.row {
        border-bottom: 1px solid #f2f2f2;
        padding-bottom: 18px;
        padding-top: 30px;
        padding-right: 15px;
        margin: 0;
    }

        .jk-table.row .cell {
            border: none;
            padding-left: 30px;
            padding-top: 16px;
            padding-bottom: 16px;
        }

            .jk-table.row .cell:nth-child(1) {
                padding-left: 30px;
            }

        .jk-table.row .cell {
            font-size: inherit;
            color: #555555;
            line-height: 1.2;
            font-weight: unset !important;
        }

    .jk-table, .jk-table.row, .jk-table.cell {
        width: 100% !important;
    }
}

/*=======================================================*/
/*.jk-table {
    width: 100%;
    display: table;
    margin: 0;
}

@media screen and (max-width: 768px) {
    .jk-table {
        display: block;
    }
}

.jk-table.row {
    display: table-row;
    background: #fff;
}

    .jk-table.row.header {
        color: #ffffff;
        background: #6c7ae0;
    }

@media screen and (max-width: 768px) {
    .jk-table.row {
        display: block;
    }

        .jk-table.row.header {
            padding: 0;
            height: 0px;
        }

            .jk-table.row.header .cell {
                display: none;
            }

        .jk-table.row .cell:before {

            font-size: 12px;
            color: #808080;
            line-height: 1.2;
            text-transform: uppercase;
            font-weight: unset !important;
            margin-bottom: 13px;
            content: attr(data-title);
            min-width: 98px;
            display: block;
        }
}

.jk-table.cell {
    display: table-cell;
}

@media screen and (max-width: 768px) {
    .jk-table.cell {
        display: block;
    }
}

.jk-table.row .cell {

    font-size: 15px;
    color: #666666;
    line-height: 1.2;
    font-weight: unset !important;
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f2f2f2;
}

.jk-table.row.header .cell {

    font-size: 18px;
    color: #fff;
    line-height: 1.2;
    font-weight: unset !important;
    padding-top: 19px;
    padding-bottom: 19px;
}

.jk-table.row .cell:nth-child(1) {
    width: 360px;
    padding-left: 40px;
}

.jk-table.row .cell:nth-child(2) {
    width: 160px;
}

.jk-table.row .cell:nth-child(3) {
    width: 250px;
}

.jk-table.row .cell:nth-child(4) {
    width: 190px;
}


.jk-table, .row {
    width: 100% !important;
}

    .jk-table.row:hover {
        background-color: #ececff;
        cursor: pointer;
    }

@media (max-width: 768px) {
    .jk-table.row {
        border-bottom: 1px solid #f2f2f2;
        padding-bottom: 18px;
        padding-top: 30px;
        padding-right: 15px;
        margin: 0;
    }

        .jk-table.row .cell {
            border: none;
            padding-left: 30px;
            padding-top: 16px;
            padding-bottom: 16px;
        }

            .jk-table.row .cell:nth-child(1) {
                padding-left: 30px;
            }

        .jk-table.row .cell {

            font-size: 18px;
            color: #555555;
            line-height: 1.2;
            font-weight: unset !important;
        }

    .jk-table, .jk-table.row, .jk-table.cell {
        width: 100% !important;
    }
}*/
/*=======================================================*/
/*@import url('https://fonts.googleapis.com/css?family=Athiti|Bai+Jamjuree|Chakra+Petch|Charmonman|Chonburi|Fahkwang|Itim|K2D|Kanit|KoHo|Kodchasan|Krub|Maitree|Mali|Mitr|Niramit|Pattaya|Pridi|Prompt|Sriracha|Srisakdi|Taviraj|Trirong');*/


/*=======================================================*/
.jk-container-table {
    width: 100%;
    /*min-height: 100vh;*/
    background: inherit;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    /*justify-content: center;*/
    flex-wrap: wrap;
    /*padding: 10px 10px;*/
    /*background-color: antiquewhite;*/
    font-size: 1.0rem;
    vertical-align: top;
    background-color: inherit;
    overflow: auto;
    /*white-space: nowrap;*/
}

    .jk-container-table img {
        padding: 0 10px;
    }

    .jk-container-table row.header {
        color: #fff;
        line-height: 1.2;
        font-weight: unset !important;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .jk-container-table table {
        border: 2px solid #ececff;
        border-radius: 5px;
        border-collapse: collapse;
        margin: 5px;
        /*table-layout: fixed;*/
        /*font-size: 1.15em;*/
        font-size: inherit;
        background-color: #ececff;
    }

        .jk-container-table table caption {
            /*font-size: 1.5em;*/
            font-size: inherit;
            margin: .5em 0 .75em;
        }

        .jk-container-table table tr {
            padding: .35em;
            vertical-align: top !important;
            background-color: #fbfbfb;
            border-spacing: 1px;
            border: dotted 1px #ddd;
        }

        .jk-container-table table th,
        .jk-container-table table td {
            padding: .25rem .50rem;
            text-align: left;
        }

        .jk-container-table table th {
            letter-spacing: .1rem;
            text-transform: uppercase;
            background-color: #88ACD6; /*azure*/
            /*font-size: 1.0em;*/
            font-size: inherit;
        }


        .jk-container-table table tr:hover {
            background-color: aliceblue;
            color: orangered !important;
        }





@media screen and (max-width: 768px) {
    .jk-container-table table {
        border: 0;
    }

        .jk-container-table table caption {
        }


        .jk-container-table table th {
            border: none;
            clip: rect(0 0 0 0);
            height: 0px;
            overflow: hidden;
            padding: 0;
            position: absolute;
        }

        .jk-container-table table thead {
            border: none;
            clip: rect(0 0 0 0);
            height: 1px;
            margin: -1px;
            overflow: hidden;
            padding: 0;
            position: absolute;
            width: 1px;
        }


        .jk-container-table table tr {
            display: block;
        }

        .jk-container-table table td {
            border:none;
            display: block;
        }

            .jk-container-table table td::before {
                /** aria-label has no advantage, it won't be read inside a table content: attr(aria-label);    */
                content: attr(data-label);
                float: left;
                font-weight: bold;
                text-transform: uppercase;
            }
}


/*=======================================================*/
/*************************
.jk-container-table-data
*************************/
.jk-container-table-data {
    width: 98%; /*min-height: 100vh;*/
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    font-size: .92rem;
    font-family: Tahoma;
    vertical-align: top;
    background-color: inherit;
    overflow: auto;
    /*white-space: nowrap;*/
    border-radius: 5px;
    border: solid 2px #eeeeee;
}

    .jk-container-table-data img {
        padding: 0 2px;
        margin: 0 2px;
    }
    
    .jk-container-table-data table {
        border: 2px solid #ececff;
        border-radius: 3px;
        border-collapse: collapse;
        margin: 2px;
        /*table-layout: fixed;*/
        font-size: inherit;
        background-color: #FAFAFA;
    }

        .jk-container-table-data table caption {
            /*font-size: 1.5em;*/
            font-size: inherit;
            margin: .5em 0 .75em;
        }

        .jk-container-table-data table tr {
            padding: .35em 0;
            vertical-align: top !important;
            background-color: #fbfbfb;
            border-spacing: 1px;
            border: 2px solid #FAFAFA;
        }

            .jk-container-table-data row.header,
            .jk-container-table-data row.header:hover,
            .jk-container-table-data table tr:first-child,
            .jk-container-table-data table tr:first-child:hover {
                color: #fff !important;
                line-height: 1.2;
                font-weight: normal !important;
                padding-top: 15px;
                padding-bottom: 15px;
            }

        .jk-container-table-data table th,
        .jk-container-table-data table td {
            padding: .1rem .250rem;
            text-align: left;
        }

            .jk-container-table-data table th .hide-layout,
            .jk-container-table-data table td .hide-layout {
                display: normal;
            }

        .jk-container-table-data table th {
            letter-spacing: .1rem;
            text-transform: uppercase;
            background-color: #88ACD6; /*azure*/
            font-size: inherit;
        }

        .jk-container-table-data table tr:hover {
            background-color: #eefafb !important;
            color: #0000FF !important;
        }



/*.jk-container-table-data table td:hover {
        background-color: #ddd;
    }*/



@media screen and (max-width: 768px) {
    .jk-container-table-data table {
        border: 0;
    }

        .jk-container-table-data table caption {
        }


        .jk-container-table-data table th {
            /*border: none;
            clip: rect(0 0 0 0);
            height: 0px;
            overflow: hidden;
            padding: 0;
            position: absolute;*/
        }

        .jk-container-table-data table thead {
            /*border: none;
            clip: rect(0 0 0 0);
            height: 1px;
            margin: -1px;
            overflow: hidden;
            padding: 0;
            position: absolute;
            width: 1px;*/
        }


        .jk-container-table-data table tr {
            /*border-bottom: 2px solid #ddd;
            display: block;*/
        }

        .jk-container-table-data table td {
            /*border-bottom: 1px solid #ddd;*/
            /*display: block;*/
        }

            .jk-container-table-data table td::before {
                /** aria-label has no advantage, it won't be read inside a table content: attr(aria-label);    */
                /*content: attr(data-label);
                float: left;
                font-weight: bold;
                text-transform: uppercase;*/
            }

            .jk-container-table-data table td:last-child {
                /*border-bottom: 0;*/
                border-top: 0;
            }


        .jk-container-table-data table tr:hover {
            background-color: #ddd;
        }

        /*.jk-container-table-data table td:hover {
            background-color: #ddd;
        }*/

        .jk-container-table-data table th + .hide-layout,
        .jk-container-table-data table td + .hide-layout {
            display: none;
        }
}





/*************************
gv-style1
*************************/
.gv-style1 {
    padding: 0;
    margin: 0;
    border: 1px solid #eeeeee;
    font-weight: lighter !Important;
    font-size: inherit;
}

    .gv-style1 tr.header {
        border-top: none;
        background-color: #C0E9E8;
        min-height: 25px;
        vertical-align: baseline;
        text-align: center;
        padding: 3px;
        color: #333;
    }

    .gv-style1 tr > th {
        color: #333 !Important;
        border: 1px solid #eeeeee;
        padding: 3px 8px;
    }


    .gv-style1 tr.normal, .gv-style1 tr.alternate {
        padding-left: 5px;
        border-bottom: solid 1px #eeeeee;
        background-color: #fdfefb;
        color: #003399;
        vertical-align: middle;
        text-align: left;
    }

    .gv-style1 tr.normal {
        background-color: #fdfefb;
        height: 23px;
        vertical-align: middle;
        text-align: left;
        padding-left: 5px;
        border-bottom: solid 1px #eeeeee;
    }

    .gv-style1 tr.alternate {
        background-color: #fdfefb;
        height: 23px;
        vertical-align: middle;
        text-align: left;
        padding-left: 5px;
        border-bottom: solid 1px #eeeeee;
    }

        .gv-style1 tr.normal:hover, .gv-style1 tr.alternate:hover {
            background-color: #F2F4F8;
            color: black;
        }


    .gv-style1 td {
        padding-left: 8px;
    }


    .gv-style1 > tr:nth-child(odd), gv-style1 > tr:nth-child(even) {
        padding-left: 5px;
        border-bottom: solid 1px #eeeeee;
        background-color: #fdfefb;
        color: #003399;
        vertical-align: middle;
        text-align: left;
    }

    .gv-style1 tr:hover {
        background-color: #ebf4fc;
        color: black;
    }




/*=======================================================*/
.div-resp-table {
    display: table;
    text-align: left;
    background-color: transparent;
    width: inherit;
    margin-top: 0.25rem;
}

    .div-resp-table > div {
        display: table-row;
        text-align: left;
    }

        .div-resp-table > div > div {
            display: table-cell;
            padding-left: 2px;
            padding-top: 2px;
            vertical-align: top;
        }


@media only screen and (max-width : 1200px) {
}

@media only screen and (max-width : 992px) {
}

@media only screen and (max-width : 768px) {
    .div-resp-table > div > div {
        display: block;
        padding-left: 2px;
        padding-top: 2px;
        vertical-align: top;
    }
}

@media only screen and (max-width : 576px) {
}


/*=======================================================*/
.resp-table {
    display: table;
    width: inherit;
    /*color: #003399;*/
    background-color: transparent; /*transparent; #fbfbfb;*/
    text-align: left;
    margin-top: 0.25rem;
    /*padding: 0.5rem;*/
}

    .resp-table > div {
        display: table-row;
        text-align: left;
    }
       
        .resp-table > div > div {
            display: table-cell;
            padding: 3px 5px;
            /*background-color: #fbfbfb;*/
            border: dotted 1px #ddd;
            vertical-align: top;
        }

        .resp-table > div.header > div {
            /*background: #EFEFEF !important;*/
        }


@media only screen and (max-width : 1200px) {
}

@media only screen and (max-width : 992px) {
    .resp-table {
        display: block;
    }
    .resp-table > div {
        display: flex;
        flex-wrap: wrap;
        margin-right: -5px;
        margin-left: -5px;
    }

        .resp-table > div > div {
            position: relative;
            flex-basis: 0;
            flex-grow: 1;
            max-width: 100%;
        }
}

@media only screen and (max-width : 768px) {
}

@media only screen and (max-width : 576px) {
}



/*.resp-table {
    padding-right: 5px;
    padding-left: 5px;
    margin-right: auto;
    margin-left: auto;
    background-color: #eeeeee;
}

    .resp-table > div {
        display: flex;
        flex-wrap: wrap;
        margin-right: -5px;
        margin-left: -5px;
    }

        .resp-table > div.no-gutters {
            margin-right: 0;
            margin-left: 0;
        }

            .resp-table > div.no-gutters > div {
                padding-right: 0;
                padding-left: 0;
            }

        .resp-table > div > div {
            position: relative;
            padding-right: 5px;
            padding-left: 5px;
            flex-basis: 0;
            flex-grow: 1;
            max-width: 100%;
            background-color: #fff;
            margin: 1px;
        }*/




/*************************
gv-default
*************************/
.gv-default {
    padding: 0;
    margin: 0;
    border: 1px solid #eeeeee;
    font-weight: lighter !Important;
    font-size: inherit;
}

    .gv-default tr.header {
        border-top: none;
        background-color: #C0E9E8;
        min-height: 25px;
        vertical-align: baseline;
        text-align: center;
        padding: 3px;
        color: #333;
    }



    .gv-default > tr:nth-child(odd), .gv-default > tr:nth-child(even),
    .gv-default > tbody tr:nth-child(odd), .gv-default > tbody tr:nth-child(even) {
        padding-left: 5px;
        border-bottom: solid 1px #eeeeee;
        background-color: #fcfcfc !important;
        color: #003399;
        vertical-align: top;
        text-align: left;
    }

    .gv-default > tr:nth-child(even),
    .gv-default > tbody tr:nth-child(even) {
        background-color: #fefefe !important;
    }



    /*.gv-default tr {
        background-color: lightpink !important;
    }*/

    .gv-default tr:hover, .gv-default > tbody > tr:hover {
        background-color: #ebf4fc !important;
        color: #06f;
    }


    .gv-default td, .gv-default th {
        padding: 3px;
        /*white-space: nowrap;*/
        color: #0956A8;
        font-size: 0.90rem;
    }

    .gv-default tr > th {
        border: 1px solid #FFF;
        padding: 3px 8px;
        background-color: #F1F3F4;
        text-align: center;
        font-weight: normal;
    }

    .gv-default img {
        padding-left: 10px
    }

/*.gv-default tr.normal, .gv-default tr.alternate {
        padding-left: 3px;
        border-bottom: solid 1px #eeeeee;
        background-color: #fdfefb;
        color: #003399;
        vertical-align: middle;
        text-align: left;
        height: 23px;
    }

    .gv-default tr.normal {
        background-color: #fdfefb;
    }

    .gv-default tr.alternate {
        background-color: #fdfefb;
    }
        .gv-default tr.normal:hover, .gv-default tr.alternate:hover {
            background-color: #F2F4F8;
            color: black;
        }*/




.gv-defaultHeader th, .gv-defaultHeader td {
    padding: 3px;
    /*white-space: nowrap;*/
    color: #0956A8;
    font-size: 0.90rem;
    background-color: #F7F7F7;
    text-align: center;
    font-weight: normal;
}


.gv-defaultItem, .gv-defaultItemFreeze, .gv-defaultFooterFreeze {
    padding: 10px;
    /*white-space: nowrap;*/
    border-right: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
}

    .gv-defaultItem:hover, .gv-defaultItemFreeze:hover, .gv-defaultFooterFreeze:hover {
        padding: 10px;
        /*white-space: nowrap;*/
        border-right: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        color: red;
        font-weight: bold;
    }

    .gv-defaultItem td {
        /*padding: 10px;
    white-space: nowrap;
    border-right: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    background-color: #FFFFFF;
    color: #444444;*/
    }

    .gv-defaultItemFreeze td {
        padding: 10px;
        /*white-space: nowrap;*/
        border-right: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        background-color: #FAFAFA;
    }

    .gv-defaultFooterFreeze TD {
        padding: 10px;
        /*white-space: nowrap;*/
        border-right: 1px solid #e6e6e6;
        border-top: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        background-color: #F4F4F4;
    }

/*****************************************************************************************************/



/*************************
gv-Scrolling
*************************/
.gv-Scrolling {
    padding: 0;
    margin: 0;
    border: 1px solid #eeeeee;
    font-weight: lighter !Important;
    font-size: inherit;
}

    .gv-Scrolling TD {
        padding: 10px;
        font-weight: normal;
        /*white-space: nowrap;*/
        border-right: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
    }

.gv-ScrollingHeader TH, .gv-ScrollingHeader TD {
    padding: 10px;
    font-weight: normal;
    /*white-space: nowrap;*/
    border-right: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    background-color: #F4F4F4;
    color: #999999;
    text-align: left;
    vertical-align: bottom;
}


.gv-ScrollingItem, .gv-ScrollingItemFreeze, .gv-ScrollingFooterFreeze {
    padding: 10px;
    /*white-space: nowrap;*/
    border-right: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
}

    .gv-ScrollingItem:hover, .gv-ScrollingItemFreeze:hover, .gv-ScrollingFooterFreeze:hover {
        padding: 10px;
        /*white-space: nowrap;*/
        border-right: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        color: red;
        font-weight: bold;
    }

    .gv-ScrollingItem TD {
        /*padding: 10px;
    white-space: nowrap;
    border-right: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    background-color: #FFFFFF;
    color: #444444;*/
    }

    .gv-ScrollingItemFreeze TD {
        padding: 10px;
        /*white-space: nowrap;*/
        border-right: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        background-color: #FAFAFA;
    }

    .gv-ScrollingFooterFreeze TD {
        padding: 10px;
        /*white-space: nowrap;*/
        border-right: 1px solid #e6e6e6;
        border-top: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        background-color: #F4F4F4;
    }

/*****************************************************************************************************/

/*h1 {
    font-size: 30px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 300;
    text-align: center;
    margin-bottom: 15px;
}*/

/*table {
    width: 100%;
    table-layout: fixed;
}*/

.tbl-header {
    /*background-color: rgba(255,255,255,0.3);*/
    background-color: #25b7c4;
}

.tbl-content {
    height: 300px;
    overflow-x: auto;
    margin-top: 0px;
    border: 1px solid rgba(255,255,255,0.3);
}

/*th {
    padding: 20px 15px;
    text-align: left;
    font-weight: 500;
    font-size: 12px;
    color: #fff;
    text-transform: uppercase;
}

td {
    padding: 15px;
    text-align: left;
    vertical-align: middle;
    font-weight: 300;
    font-size: 12px;
    color: darkslategray;
    border-bottom: solid 1px rgba(255,255,255,0.1);
}*/



/* for custom scrollbar for webkit browser*/

/*::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 12px rgba(0,0,0,0.3);
}

::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 12px rgba(0,0,0,0.3);
}*/