﻿body {
}


/* k-grid
----------------------------------------------------------*/
/*-----------------------K-Grid Standard*/
.k-grid table tr.k-state-selected
{
    background-color:peachpuff;
    color:brown;
    
}

/*----------------------- K-Grid Toolbar --------------------------*/
.toolbar {
    float: right;
    margin-right: .8em;
    vertical-align:middle;
}

.grid-toolbar-caption-label{
     font-family : Tahoma;
     font-size : 12px;
     text-align : center;
     color:darkred;
     vertical-align:middle;
     padding-right: .2em;
     padding:.1em;
    
}


/*----------------------- K-Grid Header --------------------------*/

    .k-grid-header th.k-header{
        text-align:center;
    }

/*----------------------- K-Grid Cell --------------------------*/


#grid-cell {
    font-family: Tahoma;
    font-size: 12px;
    text-align: left;
    white-space: nowrap;
}

#grid-cell-text {
        font-family: Tahoma;
        font-size: 12px;
         text-align: left;
         white-space: nowrap;
    }

#grid-cell-text-center  {
        font-family: Tahoma;
        font-size: 12px;
        text-align: center;
        white-space: nowrap;
    }

#grid-cell-currency {
        font-family: Tahoma;
        font-size: 12px;
        text-align: right;
    }

#grid-cell-currency-principle {
        font-family: Tahoma;
        font-size: 12px;
        text-align: right;
        color: royalblue;
       
    }

#grid-cell-currency-movements {
        font-family: Tahoma;
        font-size: 12px;
        text-align: right;
        color: red;
        
    }

#grid-cell-currency-movements-forestgreen {
        font-family: Tahoma;
        font-size: 12px;
        text-align: right;
        color: forestgreen;
        
    }

#grid-cell-currency-movements-orangered {
        font-family: Tahoma;
        font-size: 12px;
        text-align: right;
        color: orangered;
        
    }

#grid-cell-currency-movements-chocolate {
        font-family: Tahoma;
        font-size: 12px;
        text-align: right;
        color: chocolate;
        
    }

#grid-cell-currency-balance {
        font-family: Tahoma;
        font-size: 12px;
        text-align: right;
        color: darkred;
        
    }




#grid-cell-number {
       
        text-align: right;

    }

#grid-cell-number-center {

        text-align: center;

    }

#grid-cell-date {

        text-align: center;
    }

#grid-cell-bool {
  
        text-align: right;
    }


/*ส่วนของ Cell Buttom*******************************************/
   .k-button.k-grid-delete
    {

       /*background-position: center;*/
     min-width: 29px;
     background-color:transparent;
     border:none;
 width:29px;
    }
       .k-button.k-grid-edit
    {
     background-color:transparent;
     border:none;
     min-width: 29px;
     width:29px;
    }
    .k-grid tbody .k-button{
 
        min-width: 29px;
    }
    .k-button.k-button-icontext.k-grid-ItemCancel
    {
     background-color:transparent;
     border:none;
     min-width: 29px;
     width:29px;
    }
    .k-button.k-button-icontext.k-grid-ItemDisplay
    {
     background-color:transparent;
     border:none;
     min-width: 29px;
     width:29px;
    }
    .k-button.k-button-icontext.k-grid-ItemStatus
    {
     background-color:transparent;
     border:none;
     min-width: 29px;
     width:29px;
    }
    .k-button.k-button-icontext.k-grid-ItemView
    {
     background-color:transparent;
     border:none;
     min-width: 29px;
     width:29px;
    }
    /*----------------------- Tooltip Template --------------------------*/
    a.tooltip {outline:none; }
    a.tooltip strong {line-height:30px;}
    a.tooltip:hover {text-decoration:none;} 
    a.tooltip span {
    z-index:10;display:none; padding:14px 20px;
    margin-top:60px; margin-left:-160px;
    width:300px; line-height:16px;
}
a.tooltip:hover span{
    display:inline; position:absolute; 
    border:2px solid #FFF;  color:#EEE;
    /*background:#333 url(cssttp/css-tooltip-gradient-bg.png) repeat-x 0 0;*/
}
.callout {z-index:20;position:absolute;border:0;top:-14px;left:120px;}
    
/*CSS3 extras*/
a.tooltip span
{
    border-radius:2px;        
    box-shadow: 0px 0px 8px 4px #666;
    /*opacity: 0.8;*/
}