/* 
    Document   : default
    Created on : Jul 13, 2013, 8:26:25 PM
    Author     : Presinal
    Description:
        Purpose of the stylesheet follows.
*/

html,body{
    height: 100%;    
    background-color: transparent;
}

html {
    background: url('../images/page_bg.png') repeat-x left top;
    background-attachment:fixed;
}

label{
    cursor: default;
}

/* page header*/
#header{
   background: url('../images/header_bg.png') repeat-x left top; 
   height: 74px;
   width: 100%;
   display: block;
   padding-top: 5px;   
}

#header div{
    float: left;   
    height: 70px;
}

#loggedUser{
    height: 26px !important;
    color: #626262;
    margin-left: 63px;
    margin-top: 8px;
}

#loggedUser div{
    display: inline-block;
    height: 100%;
}

#loggedUser .left{
     background: url('../images/Loged_user_left.png') no-repeat left top;
     width: 5px;
}

#loggedUser .center{
     background: url('../images/Loged_user_center.png') repeat left top;
     line-height: 26px;
     font-weight: bold;
     font-size: 12pt;
     padding-left: 5px;
     padding-right: 5px;
}

#loggedUser .right{
     background: url('../images/Loged_user_rightt.png') repeat left top;
     width: 17px;
}

.toolbtn-container{
    width: 31px;
    position: relative;
}

.toolbtn{
    cursor: pointer;
    margin-left: 10px;
    margin-top: 8px;
    width: 29px;
    height: 29px;
    background: url('../images/icons/setting_btn_normal.png') no-repeat left top;
    position: relative;
}

.toolbtn:hover{
     background: url('../images/icons/setting_btn_hover.png') no-repeat left top;
}

.toolbtn:active{
    width: 31px;
    height: 31px;
    background: url('../images/icons/setting_btn_click.png') no-repeat left top;
}

.toolbtnactive{
    width: 31px !important;
    height: 31px !important;
    background: url('../images/icons/setting_btn_click.png') no-repeat left top !important;
}

.toolbtn-menu{
    float: left;
    left: -90px;
    top: 40px;
    list-style: none outside none;
    margin: 2px 0 0;
    min-width: 160px;
    padding: 5px 0;
    position: absolute;
    z-index: 1000;
    width: 131px;
    height: 82px;
    background: url('../images/toolmenu-bg.png') no-repeat left top;
}


.toolbtn-menu > li > a {
    clear: both;
    color: #333333;
    display: block;
    font-weight: normal;
    line-height: 20px;
    padding: 5px 10px;
    white-space: nowrap;
    cursor: pointer;
}

#logo{
    margin-left: 30px; 
}

/* Pagemenu Style*/
#menu{
    height: 70px;
    width: 100%;
    list-style: none;
    margin-left: 21px;
}

#menu li{
    float: left;
    height: 100%;    
    font-size: 18px;
    text-decoration: none;
}

#menu li button{
    background-color: transparent;
    border: none;
    outline: none;
    font-size: 18px;
    margin-top: 5px;
   /* line-height: 22px;*/
    width: 100%;
    height: 80%;
    color: #929292;
}

#menu li div{
    display: inline-block;
    float: none;
}
.menu-item_off, .menu-item_on{
    height: 70px;
    width: 104px;
    text-align: center;
   /* line-height: 70px;*/
}

.menu-item_off{    
    background: url('../images/menu_item_off.png') no-repeat left top;    
}

.menu-item_on, #menu li div:hover{    
    background: url('../images/menu_item_on.png') no-repeat left top;
    color: black !important;
}

.menu-item_on button, #menu li:hover button{
    color: black !important;
}

.submenu_off, .submenu_on{
    border: 1px solid #454444;
    border-right: 0;
    background: url('../images/submenu_bg.png') repeat left top;
    width: 104px;
    height: 40px;
    float: left;
    text-align: center;
    font-weight: bold;
    cursor: pointer;
    
}

.submenu_right_off, .submenu_right_on{
    background: url('../images/submenu_right_bg.png') no-repeat left top;    
    border-bottom: 1px solid #454444;
    float: left;
    height: 41px;
    margin-left: 0;
    width: 10px;
    
}

.submenu_right_on{
    background: url('../images/submenu_right_bg_on.png') no-repeat left top;
    border-bottom: 0;
    height: 42px;
}


.submenu_on {
    background: url('../images/submenu_bg_on.png') repeat left top;
    border-bottom: 0;
    color: #1e1e1e;
}


/*Page conent style*/
.float-left{
    float: left;
    display: inline-block;
    margin-left: 30px;
}

#mainContent{
/*    margin-top: 50px;*/
    margin-top: 13px;
    min-width: 900px;
    
}
/*Overrite bootstratp tab component .nav class*/
#mainContent .nav {
    list-style: none outside none;
    margin-bottom: -1px;
    margin-left: 0;
}


#mainContent .nav-tabs > li {
    margin-bottom: -1px;
    margin-left: -2px;
}

/*CONTENT STYLE*/
#content{
    background: url('../images/content_bg.png') repeat left top;
   /*width: 100%;*/
   padding: 14px;
   -webkit-border-bottom-left-radius: 7px;
    -webkit-border-bottom-right-radius: 7px;    
    -moz-border-bottom-left-radius: 7px;
    -moz-border-bottom-right-radius: 7px;    
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
}

#content .title{
    color: #212121;
    /*margin-top: 26px;*/
    margin-top: 20px;
/*    margin-bottom: 26px;*/
   /* margin-bottom: 15px;*/
    font-size: 1.8em;
}

/*Overrite bootstratp tab component .tab-content class*/
#content .tab-content{
    overflow: hidden;
}

#content .panel{
    background-color: #d1d0d0;
    width: 100%;    
    font-size: 16px;    
    color: #4b4b4b;
     -webkit-border-bottom-left-radius: 7px;
    -webkit-border-bottom-right-radius: 7px;    
    -moz-border-bottom-left-radius: 7px;
    -moz-border-bottom-right-radius: 7px;    
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
}

#content .panel .panel-content{
    padding: 18px;    
    width: 100%;
}

#content .panel .action{
    background-color: #c2c2c2;
    height: 110px;
    border-top: 1px solid #949494;
    color: #434141;
     -webkit-border-bottom-left-radius: inherit;
    -webkit-border-bottom-right-radius: inherit;    
    -moz-border-bottom-left-radius: inherit;
    -moz-border-bottom-right-radius: inherit;    
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit;
}

#content .panel .action div{
    display: inline-block;
    margin-top: 20px;
}

#content .panel .action a{
    text-decoration: none;
}

tbody .hovercolor:hover{
    background-color: #E5E5E5;
}

/*Action div Button style*/

.action .btn_container{
    width: 160px;
    height: 71px;
    /*display: inline-block;*/
    background-color: #c8c8c8;
/*    margin-top: 20px;*/
    margin-right: 23px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.action .btn_cancel, .btn_cancel:visited{
    color: #434141;
    cursor: pointer;
    
}

.action .btn-submit, .btn-submit, .btn-submit:visited{
    width: 141px;
    height: 53px;
    background: url('../images/btn_submit_bg.png') no-repeat left top;
    cursor: default;
    display: block;
    text-decoration: none;       
    color: black;    
    padding-top: 21px;
    text-align: right;
    font-size: 18px;
    margin: 10px;
}

.action .btn-submit span, .btn-submit span{    
    margin-right: 26px;    
}

.action .btn-submit:hover, btn-submit:hover{    
    background: url('../images/btn_submit_bg_hover.png') no-repeat left top;
}
.action .btn-submit:active, .btn-submit:active{    
    background: url('../images/btn_submit_bg_click.png') no-repeat left top;
}

/*End action div button style*/

/* Toggle panel style*/

.toggle-panel div{
    display: inline-block;
}

.toggle-panel .header{
    color: #343434;
    font-size: 18px;
    padding-bottom: 5px;
    cursor: pointer;
}

.toggle-panel .header img{
    margin: 5px;
}

/* end Toggle panel style*/

/* FORM AND INPUT style*/

.chk-margin-5{
    margin-right: 5px !important;
}

.btn-clear-filter{
    width: 67px;
    height: 22px;
    display: inline-block;
    margin-top: 10px;
    background: url('../images/btn_clear_normal.png') no-repeat left top;
    margin-left: 28px;
}

.btn-clear-filter:hover{
    background: url('../images/btn_clear_hover.png') no-repeat left top;  
}

.btn-clear-filter:active{
    background: url('../images/btn_clear_click.png') no-repeat left top;  
}

textarea{
    resize: none;
}

input[type=radio]{
     background:  #737272 url('../images/radio_off.png') no-repeat left center;
     -webkit-appearance: none;
     -moz-appearance: none;
     width: 13px;
     height: 13px;		
     display: inline-block;
}

input[type=radio]:checked{
     background: #737272 url('../images/radio_on.png') no-repeat left center !important;
     -webkit-appearance: none;
     -moz-appearance: none;
}

input[type=checkbox]{
    background: url('../images/checkbox_off.png') no-repeat left top;
     -webkit-appearance: none;
     -moz-appearance: none;
     width: 18px;
     height: 18px;     
}

input[type=checkbox]:checked{
    background: url('../images/checkbox_on.png') no-repeat left top;
}

.btn-add, .btn-add:visited, .btn-add:active, .btn-add:focus, .btn-add:hover {
    cursor: pointer;
    color: black;
    font-weight: bold;
    text-decoration: none;
}

.btn-add .icon{
    background: url('../images/icons/plus_icon.png') no-repeat left top;
    width: 14px;
    height: 14px;
    display: inline-block;
}

.btn-add .text{
    display: inline-block;
    margin-left: 0;
}

/*RIGHT PANEL STYLE*/
#rightPanel{
    width: 243px;
    height: 100%;
}


#rightPanel .panel{
    width: 234px;
    background: url('../images/right_panel_center.png') repeat left top;    
}

#rightPanel .panel div{
    margin: 0;
}
#rightPanel .panel .top{
    height: 10px;
    width: 100%;
    background: url('../images/right_panel_top_corner.png') no-repeat;
}

#rightPanel .panel .bottom{
    height: 10px;
    width: 100%;
    background: url('../images/right_panel_bottom_corner.png') no-repeat;
}

#rightPanel .panel .center{
    min-height: 108px;
    border-left: 1px solid #847c7c;
    border-right: 1px solid #847c7c;
    padding-left: 5px;
    padding-right: 5px;
}

#rightPanel .panel .center .span1{
    width: 100px;
}

#goBtn {
   background: url('../images/go_btn.png') no-repeat transparent;
   width: 36px;
   height: 32px;
   border: none;   
   margin-top: -1px;
   margin-left: 5px;
}

/* END RIGHT PANEL STYLE*/



.cf:before,
.cf:after {
    content:"";
    display:block;
}

.cf:after {
    clear:both;
}

.cf {
    zoom:1;
    clear:both;
    display:block;
    height: 1px !important; 
}

/***************** icon styles *******************/

.icon{
    display: inline-block;
    margin-right: 5px;    
}

.iconst{
    display: inline-block;
    margin-right: 5px;
    margin-bottom: 2px;
    margin-top: 5px;
}


.icon-view{
    background: url('../images/icons/view_icon.png') no-repeat transparent;
    width: 22px;
    height: 13px;
}

.icon-view:hover{
    background: url('../images/icons/view_icon_hover.png') no-repeat transparent;
}

.icon-remove{
    background: url('../images/icons/close_icon.png') no-repeat transparent;
    width: 14px;
    height: 15px;
}

.icon-remove:hover{
    background: url('../images/icons/close_icon_hover.png') no-repeat transparent;    
}

.icon-edit{
    background: url('../images/icons/edit_icon.png') no-repeat transparent;
    width: 16px;
    height: 16px;
}

.icon-edit:hover{
    background: url('../images/icons/edit_icon_hover.png') no-repeat transparent;    
}

.icon-print-label{
    background: url('../images/icons/print_icon.png') no-repeat transparent;
    width: 20px;
    height: 20px;
}
.icon-print-label:hover{
    background: url('../images/icons/print_icon_hover.png') no-repeat transparent;
}

.actionIcon{
    width: 100px;
}

.actionIcon img{
    cursor: pointer;
}

.actionIcon .icon{
    cursor: pointer;
}
/***************** End icon styles *******************/

/* calendar panel style */
/* Override jquery UI datepicker style*/
#calendar .ui-datepicker{
    width: 96%;
    padding: 0;
    background-color: #f6f6f6;
}

#calendar .ui-widget-header {
    background: url('../images/calendar_header_bg.png') repeat scroll 50% 50% #3d3d3d;
    border: 1px solid #3d3d3d;
    color: #e0e0e0;
    font-weight: bold;
}

#calendar .prev-icon{
   background: url('../images/icons/calendar_prev.png') no-repeat;
   background-position: 0px 0px;
}

#calendar .next-icon{
   background: url('../images/icons/calendar_nexts.png') no-repeat; 
   background-position: 0px 0px;
}

.ui-datepicker-trigger{
    margin-left: 5px;
    cursor: pointer;
}
#calendar  div.ui-corner-all{
    border-radius: 0;
}

#calendar .ui-datepicker table {
    font-size: 12px;
    background-color: #f6f6f6;
}

#calendar .ui-datepicker table th{
    color: #666666;
    border-bottom: 0.15em solid #BBBBBB;
}

#calendar .ui-datepicker table td {
    border: 0.1em solid #BBBBBB;
    padding: 1px;
}

#calendar .ui-datepicker .ui-state-default{
    border: 0;
    background: url('../images/calendar_day_cell_bg.png') repeat;
    color: #666666;
}

#calendar .ui-datepicker .ui-state-active {
    background: url('../images/calendar_day_cell_active_bg.png') repeat scroll 50% 50%;
    color: #e0e0e0;
    font-weight: bold;
}

#calendar .ui-datepicker .ui-state-highlight {
    background-color: #FBF9EE;
    border: 1px solid #448c26;
    color: #363636;
}

#calendar .ui-datepicker table td a{
    text-align: center;
}


/***************** Override bootstrap style *****************/
.table{
    font-size: 14px;
    width: 96%;
}

.table th{
    color: #343434;
    font-weight: bold;  
    border-bottom: 1px solid #828181;
}
.table td{
    border-top: 0;
      line-height: 20px;
    padding-top: 0;
    padding-bottom: 0;
    text-align: left;
    vertical-align: middle;
}

.table input[type="checkbox"] {
    line-height: normal;
    margin: 0;
}
/***************** End Override bootstrap style *****************/

/*detalle factur table style*/
#facturaDetail{
    margin-left: 10px;
    margin-right: 5px;
    background-color: white;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;    
    -moz-border-top-left-radius: 10px;
    -moz-border-top-right-radius: 10px;         
    border-top-left-radius: 10px;
    border-top-right-radius: 10px; 
    border: 1px solid #808080;
    border-collapse: separate;
}

#facturaDetail tr{
    margin: 5px;
}
#facturaDetail thead{
    background: url('../images/facturad_header_bg.png') repeat;    
    
}

#facturaDetail thead th{
    color: white;
}
#facturaDetail select{
    width: 100%;        
}
#facturaDetail td{    
    padding: 5px 0 5px 5px;
}
#facturaDetail .table-striped tbody > tr:nth-child(2n+1) > td{
    background-color: #faf9f9;
}


#facturaDetail .input-mini{
    width: 30px;
}

.summary, .summary td{
    background-color: white !important;
}
.summary td {    
    padding: 0;
    text-align: right;
}

.summary td.left{
    text-align: left;
}

.padding-left8{
    padding-left: 8px !important;
}

.text-bold{
    font-weight: bold;
}

.text-center{
    text-align: center !important;
}

.colorRed{
    color: red !important;
}

.filter-input{
    height: 50px;    
}

.filter-btn-container{
    height: 35px;
}

.filter-btn{
     background: url('../images/filter_btn.png') no-repeat;
     width: 78px;
     height: 31px;
     margin-left: 9px;
     cursor: pointer;
     /*display: inline-block;*/
}

.modal{
    background-color: #D1D0D0 !important;
}

.modal .modal-header{
    border-bottom: 1px solid #828181;
}

.modal .modal-body {
    max-height: none;
    overflow-y: auto;    
}

.modal .modal-footer {
    background-color: transparent;
    border-top: 1px solid #828181;
}

.paginator{
    width: 96%;
    height: 40px;
}
.paginator .text{
    color: #595958;
    padding-left: 3px;
    padding-right: 5px;
}

.paginator .prevButton, .nextButton{
    width: 99px;
    height: 25px;
    border: none;
}

.paginator .prevButton{
    background: url('../images/prev_btn.png') no-repeat; 
}

.paginator .prevButton:hover{
    background: url('../images/prev_btn_hover.png') no-repeat;
}

.paginator .prevButton:active{
    background: url('../images/prev_btn_click.png') no-repeat;
}


.paginator .nextButton{
    background: url('../images/next_btn.png') no-repeat;    
}

.paginator .nextButton:hover{
    background: url('../images/next_btn_hover.png') no-repeat;
}

.paginator .nextButton:active{
    background: url('../images/next_btn_click.png') no-repeat;
}

.ajax-loading{
    position: absolute; 
    width: 100%; 
    height: 100%;
}
.loading-modal{
    position: absolute;
    background-color: #000000;
    opacity: 0.3;
    left: 0;
    top: 0;
    width: 96%;
    height: 100%;
    z-index: 450;
}

.loading{
    width: 96%;
    height: 100%;
    z-index: 456;
    position: absolute;
}

.loading .loading-img{    
    position: relative;
    left: 50%;        
    top: 50%;
    z-index: 490;
    display: inline-block;
}

.text-ellipsis{
    -o-text-overflow: ellipsis;   /* Opera */
    text-overflow:    ellipsis;   /* IE, Safari (WebKit) */
    overflow:hidden;              /* don't show excess chars */
    white-space:nowrap;           /* force single line */
}

.link-btn .btn{
    color: #434141;
    padding-left: 0px;
}