/*----------------------------------------------------------------------

                                   Global
  
------------------------------------------------------------------------*/

body
{
    font-size: 62.5%;
    font-family: sans-serif;
}

input, a, li, ul, div, textarea
{
    font-family: Calibri, Verdana, Arial;
}

.km-pane
{
    background: black;
}

.km-loader
{
    font-size: 0.8em;
    height: auto;
    width: auto;
    min-width: 180px;
    padding-top: 1.5em;
    padding-bottom: 0.5em;
}

.km-actionsheet
{
    font-size: 0.9em;
}

.km-listview .km-list
{
    margin: 0;
}

.km-list > li
{
    padding: 0.3em 0.5em;
}

.km-footer, .km-header .km-navbar
{
    min-height: 3.1em;
}

/* Buttons */

.km-ios .km-button
{
    padding: 0px;
}

.km-ios .km-button .km-icon, .km-ios .km-button.km-state-active .km-icon
{
    background: linear-gradient(top,rgba(255,255,255,1.0),rgba(255,255,255,1.0));
    background: -webkit-gradient(linear,50% 0,50% 100%,color-stop(0,rgba(255,255,255,1.0)),color-stop(1,rgba(255,255,255,1.0)));
    background: -moz-linear-gradient(top,rgba(255,255,255,1.0),rgba(255,255,255,1.0));
    background: -ms-linear-gradient(top,rgba(255,255,255,1.0),rgba(255,255,255,1.0));
    background: -o-linear-gradient(top,rgba(255,255,255,1.0),rgba(255,255,255,1.0));
}

.km-ios .km-tabstrip .km-icon
{
    background: transparent;
    margin: 0px 1.5em;
}
.km-ios .km-tabstrip .km-state-active .km-icon
{
    background: linear-gradient(top,#bce4ff 0,#3f99d2 50%,#53bfe5 100%);
    background: -webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#bce4ff),color-stop(0.5,#3f99d2),color-stop(1,#53bfe5));
    background: -moz-linear-gradient(top,#bce4ff 0,#3f99d2 50%,#53bfe5 100%);
    background: -ms-linear-gradient(top,#bce4ff 0,#3f99d2 50%,#53bfe5 100%);
    background: -o-linear-gradient(top,#bce4ff 0,#3f99d2 50%,#53bfe5 100%);
    margin: 0px 1.5em;
}

/*
.km-ios .km-tabstrip .km-icon
{
    background: rgba(255,255,255,1.0) linear-gradient(top,rgba(255,255,255,1.0),rgba(255,255,255,1.0));
    background: rgba(255,255,255,1.0) -webkit-gradient(linear,50% 0,50% 100%,color-stop(0,rgba(255,255,255,1.0)),color-stop(1,rgba(255,255,255,1.0)));
    background: rgba(255,255,255,1.0) -moz-linear-gradient(top,rgba(255,255,255,1.0),rgba(255,255,255,1.0));
    background: rgba(255,255,255,1.0) -ms-linear-gradient(top,rgba(255,255,255,1.0),rgba(255,255,255,1.0));
    background: rgba(255,255,255,1.0) -o-linear-gradient(top,rgba(255,255,255,1.0),rgba(255,255,255,1.0));
}

.km-ios .km-tabstrip .km-state-active .km-icon
{
    background: linear-gradient(top,#bce4ff 0,#3f99d2 50%,#53bfe5 100%);
    background: -webkit-gradient(linear,50% 0,50% 100%,color-stop(0,#bce4ff),color-stop(0.5,#3f99d2),color-stop(1,#53bfe5));
    background: -moz-linear-gradient(top,#bce4ff 0,#3f99d2 50%,#53bfe5 100%);
    background: -ms-linear-gradient(top,#bce4ff 0,#3f99d2 50%,#53bfe5 100%);
    background: -o-linear-gradient(top,#bce4ff 0,#3f99d2 50%,#53bfe5 100%);
}
*/

/* Nova button */

.km-root .km-pane .km-view .km-button .km-novabackbutton, .km-header .km-button .km-novabackbutton, .km-header .km-button .km-novabackbutton:hover, .km-header .km-button .km-novabackbutton:active, .km-footer .km-button .km-novabackbutton, .km-footer .km-button .km-novabackbutton:hover, .km-footer .km-button .km-novabackbutton:active
{
    background: transparent url('../../Images/BackButton.png') no-repeat center;
    background-color: transparent;
    background-size: 1.6em 1.6em;
}

.km-root .km-pane .km-view .km-button .km-novaokbutton, .km-header .km-button .km-novaokbutton, .km-header .km-button .km-novaokbutton:hover, .km-header .km-button .km-novaokbutton:active, .km-footer .km-button .km-novaokbutton, .km-footer .km-button .km-novaokbutton:hover, .km-footer .km-button .km-novaokbutton:active
{
    background: transparent url('../../Images/novaokbutton.png') no-repeat center;
    background-color: transparent;
    background-size: 1.6em 1.6em;
}

.km-root .km-pane .km-view .km-button .km-novasendmail, .km-header .km-button .km-novasendmail, .km-header .km-button .km-novasendmail:hover, .km-header .km-button .km-novasendmail:active, .km-footer .km-button .km-novasendmail, .km-footer .km-button .km-novasendmail:hover, .km-footer .km-button .km-novasendmail:active
{
    background: transparent url('../../Images/SendMail.png') no-repeat center;
    background-color: transparent;
    background-size: 1.6em 1.6em;
}

.km-root .km-pane .km-view .km-button .km-invoiceactionsbutton, .km-header .km-button .km-invoiceactionsbutton, .km-header .km-button .km-invoiceactionsbutton:hover, .km-header .km-button .km-invoiceactionsbutton:active, .km-footer .km-button .km-invoiceactionsbutton, .km-footer .km-button .km-invoiceactionsbutton:hover, .km-footer .km-button .km-invoiceactionsbutton:active
{
    background: transparent url('../../Images/InvoiceActions.png') no-repeat center;
    background-color: transparent;
    background-size: 1.6em 1.6em;
}

.km-root .km-pane .km-view .km-button .km-novarefreshbutton, .km-header .km-button .km-novarefreshbutton, .km-header .km-button .km-novarefreshbutton:hover, .km-header .km-button .km-novarefreshbutton:active, .km-footer .km-button .km-novarefreshbutton, .km-footer .km-button .km-novarefreshbutton:hover, .km-footer .km-button .km-novarefreshbutton:active
{
    background: transparent url('../../Images/Refresh.png') no-repeat center;
    background-color: transparent;
    background-size: 2.6em 2.6em;
}

.km-header .novaButton, .km-footer .novaButton, .km-header .novaImageButton, .km-footer .novaImageButton
{
    width: 2.0em;
    box-shadow: none;
    border: 0px solid transparent;
    background-color: transparent;
    background: transparent none;
    -webkit-tap-highlight-color: transparent;
    white-space: nowrap;
}

.km-header .novaButton, .km-header .novaImageButton
{
    margin: 0.2em 0;
}

.km-header .novaButton .km-icon, .km-footer .novaButton .km-icon, .km-header .novaImageButton .km-icon, .km-footer .novaImageButton .km-icon
{
    width: 2em;
    height: 2em;
}

.km-header .novaButton:active, .km-footer .novaButton:active, .km-header .novaImageButton:active, .km-footer .novaImageButton:active
{
    background-color: transparent;
    border-color: transparent;
}

/* Header */

.km-header .km-view-title
{
    font-size: 1.4em;
    box-shadow:none;
    -webkit-box-shadow:none;
}

.novaTitleContainer
{
    margin: 0 3em;
    white-space: nowrap;
}

.novaTitle
{
    display: inline-block;
    text-align: right;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display:inline;
}

.novaTitleCount
{
    text-align: left;
    padding-left: 3px;
}

/* Footer */

.km-footer .km-tabstrip
{
    position: relative;
    left: 0; /* text-align: right; */
}

.km-footer .km-tabstrip .km-button
{
    min-width: 4em;
    min-width: 2.5rem;
}

.km-footer .km-tabstrip .km-button .km-icon
{
    width: 3em;
    height: 3em;
    width: 2.2rem;
    height: 2.2rem;
}

.list-footer
{
    padding: 0.5em;
    font-size: 0.8em;
    text-align: center;
    vertical-align: middle;
}
.list-footer .list-info
{
    vertical-align: middle;
    font-size: 1.2em;
}
.list-footer .list-info .date
{
    color: Gray;
    padding-left: 0.2em;
}

.list-footer .list-info .time
{
    padding-left: 0.2em;
}

/* Details list */

.detailsList
{
    opacity: 0.9;
}
.detailsList .detailsLabel
{
    width: 100%;
    height: 2em;
    line-height: 2em;
    font-weight: bolder;
    text-align: left;
    font-size: 0.7em;
    display: inline;
    color: Black;
}

.detailsList .detailsValue
{
    text-align: right;
    height: 2em;
    line-height: 2.3em;
    margin-right: 1em;
    font-weight: normal;
    font-size: 0.7em;
    display: inline;
    float: right;
    color: #3c3c3c;
    font-weight: bold;
    width:50%;
    overflow:hidden !important;
    text-overflow: ellipsis;
}

.detailsList a div.detailsLabel
{
    display: inline;
}

.detailsList a div.detailsValue
{
    display: inline;
    float: right;
}

/* Text overflow */
.textOverflow
{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* Background */
.backgroundImage
{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*----------------------------------------------------------------------

                       Layout: Invoice Details

------------------------------------------------------------------------*/

#layout-invoice-details-tabstrip a
{
    margin-top: 0.3em;
    background-color: transparent;
    background-position: center;
    background-repeat: no-repeat;
}

#layout-invoice-details-tabstrip .km-state-active .km-icon
{
    background-image: none;
    background:#00ADEF;
}

#layout-invoice-details-tabstrip .km-novabookkeeping
{
    background-image: url('../../Images/Nova.Bookkeeping.png');
    margin: 0px auto;
}

.km-novabookkeeping
{
    -webkit-mask-box-image: url('../../Images/Nova.Bookkeeping.Mask.png');
}

#layout-invoice-details-tabstrip .km-novareviews
{
    background-image: url('../../Images/Nova.Reviews.png');
    margin: 0px auto;
}

.km-novareviews
{
    -webkit-mask-box-image: url('../../Images/Nova.Reviews.Mask.png');
}

#layout-invoice-details-tabstrip .km-novaproperties
{
    background-image: url('../../Images/Nova.Properties.png');
    margin: 0px auto;
}

.km-novaproperties
{
    -webkit-mask-box-image: url('../../Images/Nova.Properties.Mask.png');
}

#layout-invoice-details-tabstrip .km-novaimage
{
    background-image: url('../../Images/Nova.Image.png');
    margin: 0px auto;
}

.km-novaimage
{
    -webkit-mask-box-image: url('../../Images/Nova.Image.Mask.png');
}

/*----------------------------------------------------------------------

                        View: Loading Screen

------------------------------------------------------------------------*/

/*----------------------------------------------------------------------

                             View: Login

------------------------------------------------------------------------*/

.km-tablet .km-ios #form-login
{
    margin: auto;
    max-width: 400px;
}

#view-login .km-insetcontent
{
    background: transparent;
    background-color: transparent;
}

#view-login-content
{
    position: relative;
    top:6em;
    z-index: 1;
}

.km-tablet .km-ios #view-login-content
{
    margin-top: 230px;
}

#view-login #form-login
{
    -webkit-margin-before: 0px;
    -webkit-margin-after: 0px;
    margin-top: 3.7em;
    font-size: 2.2em;
}
#view-login #form-login li
{
    height: 1.2em;
}
#view-login #form-login input
{
    width: 100%;
    margin-right: -0.5em;
    font-size: 0.5em;
    color: Black;
}
#view-login #view-login-company 
{
    width: 100%;
    color: Black;
}
#view-login #view-login-button-container
{
    text-align: center;
    margin-top: 15px;
}
#view-login #view-login-button-container .km-button
{
    padding-top: 0.5em;
    background-color: Black;
    opacity: 0.6;
    color: White;
    font-size: 1em;
    font-weight: bold;
    width: 8em;
    height: 1.8em;
}
#view-login #view-login-button-container .km-state-disabled
{
    opacity: 0.35;
}

/*----------------------------------------------------------------------

                             View: Folders

------------------------------------------------------------------------*/

.folderItem
{
    font-size: 1.3em;
    vertical-align: middle;
}
.folderItem .folderImage
{
    width: 2.0em;
}
.folderItem .folderImage img
{
    width: 1.6em;
    height: 1.6em;
}
.folderItem .folderName
{
    vertical-align: middle;
}
.folderItem .folderCount, .folderItem .defaultFolderCount
{
    float: right;
    min-width: 1.5em;
    font-size: 0.7em;
    text-align: center;
    padding: 0 0.5em;
    margin-right: 1em;
    border-radius: 1em;
    font-weight: bolder;
    color: white;
}
.folderItem .folderCount
{
    background-color: #afafaf;
}

.folderItem .defaultFolderCount
{
    background-color: #d23232;
}

.folderItem .hidden
{
    display: none;
}

/*----------------------------------------------------------------------

                          View: Invoice List

------------------------------------------------------------------------*/

.invoiceListItem div
{
    line-height: 100%;
    vertical-align: middle;
}
.invoiceListItem .hidden
{
    display: none;
}
.invoiceListImage
{
    width: 1.3em;
}
.invoiceListImage img
{
    width: 0.8em;
    height: 0.8em;
}
.invoiceListFirstLine
{
    font-size: 1.1em;
    font-weight: bold;
}
.invoiceListSecondLine
{
    font-size: 1em;
    font-weight: normal;
}
.invoiceListThirdLine
{
    font-size: 0.8em;
    margin-top: 0.2em;
    font-weight: normal;
}
.invoiceListType
{
    float: right;
    padding-right: 2em;
    font-size: 0.9em;
    font-weight: normal;
}
.invoiceListProperty
{
}
.invoiceListCurrency
{
}
.invoiceListReview
{
}
.invoiceListReviewUser
{
}
.invoiceListReviewText
{
    color: #B54040;
    font-style: italic;
}

#view-invoice-list-search-container
{
    width: 98%;
    display: none;
    left:0;
}

#view-invoice-list-search-container .invoiceListSearchTable
{
    width: 97%;
    height: 3em;
    margin: 0;
}
#view-invoice-list-search-container .invoiceListSearch
{
    width: 98%;
    margin-left: 0.5em;
    padding-left: 0.9em;
    height: 1.4em;
    -webkit-border-radius: 1.4em;
    -moz-border-radius: 1.4em;
    border-radius: 1.4em;
}
#view-invoice-list-search
{
    width: auto;
}
#view-invoice-list-search-button
{
    width: 1.2em;
    box-shadow: none;
    border-color: transparent;
    background: transparent none no-repeat;
}
#view-invoice-list-search-button .km-novasearchbutton, #view-invoice-list-search-button .km-novasearchbutton:hover, #view-invoice-list-search-button .km-novasearchbutton:active, #view-invoice-list-search-button .km-novasearchbutton, #view-invoice-list-search-button .km-novasearchbutton:hover, #view-invoice-list-search-button .km-novasearchbutton:active
{
    width: 2.5em;
    box-shadow: none;
    border: 0px solid transparent;
    background: transparent url('../../Images/Search.png') no-repeat center;
    background-color: transparent;
    background-size: 2em 2em;
    -webkit-tap-highlight-color: transparent;
    white-space: nowrap;
}

.km-scroller-pull
{
    left: 0;
    width: 98%;
    background:none;
    margin:0;
}

.km-scroller-pull .km-template 
{
    text-align:right;
}

/*----------------------------------------------------------------------

                        View: Invoice bookkeeping

------------------------------------------------------------------------*/

#invoice-bookkeeping-list
{
    opacity: 0.9;
    margin: 0;
}

#invoice-bookkeeping-list td
{
    line-height: 100%;
}

#invoice-bookkeeping-list .bookkeepingImage
{
    width: 2em;
    height: 2em;
}

#invoice-bookkeeping-list .bookkeepingImage img
{
    width: 1.6em;
    height: 1.6em;
}

#invoice-bookkeeping-list .bookkeepingApprovedAmmount #invoice-bookkeeping-list .bookkeepingAmmount
{
    float: left;
    font-size: 1em;
    font-weight: bold;
}

#invoice-bookkeeping-list .bookkeepingAmmount
{
    color: Red;
}

#invoice-bookkeeping-list .bookkeepingApprover
{
    float: right;
    font-size: 0.7em;
    font-style: italic;
    padding-right: 2em;
}

#invoice-bookkeeping-list .bookkeepingDetailsContainer
{
    margin-right: 1.5em;
}

#invoice-bookkeeping-list .bookkeepingDetails
{
    font-size: 0.7em;
    font-weight: lighter;
    height: 1.3em;
    line-height: 1.3em;
}

#invoice-bookkeeping-list .hidden
{
    display: none;
}

/*----------------------------------------------------------------------

                     View: Invoice bookkeeping details

------------------------------------------------------------------------*/

#view-invoice-bookkeeping-details-background
{
    visibility: hidden;
}

#invoice-bookkeeping-details-line
{
    position: relative;
    top: 0.6em;
    left: 1.3em;
    font-size: 1.2em;
    font-weight: lighter;
    color: #666666;
}

/*----------------------------------------------------------------------

                           View: Invoice reviews

------------------------------------------------------------------------*/

#invoice-reviews-list
{
    opacity: 0.9;
}
#invoice-reviews-list ul, #invoice-reviews-list li
{
    border-color: transparent;
    margin-bottom: 0px;
}
#invoice-reviews-list .reviewContainer
{
    vertical-align: middle;
    line-height: 100%;
}
#invoice-reviews-list .reviewDate
{
    float: left;
    font-weight: bold;
    font-size: 0.9em;
    margin-top: 0px;
}
#invoice-reviews-list .reviewText
{
    float: left;
    width: 100%;
    font-size: 0.8em;
    font-weight: lighter;
}
#invoice-reviews-list .reviewer
{
}

#invoice-reviews-list .reviewAction
{
}
#invoice-reviews-list .reviewActionInfo
{
}
#invoice-reviews-list .remarksSystem
{
    padding-left: 0.2em;
    color: black;
    font-style: italic;
}
#invoice-reviews-list .remarksUser
{
    padding-left: 0.2em;
    color: red;
    font-style: italic;
}

/*----------------------------------------------------------------------

                          View: Invoice properties

------------------------------------------------------------------------*/

#view-invoice-properties-background
{
    visibility: hidden;
}

#simple-textarea, #userComment-textarea
{
    min-width: 95%;
    max-width: 95%;
    min-height: 10em;
    max-height: 10em;
    margin: 10px;
}

.k-widget.k-calendar {
            width: 100%;
        }
.k-widget.k-calendar .k-content tbody td {
            width: auto;
            text-align:center;
}


.k-calendar td.k-state-focused.k-state-selected {
   background: #00ADEF;
}


/*----------------------------------------------------------------------

                            View: Invoice image

------------------------------------------------------------------------*/

#view-invoice-image .km-content
{
    background: white;
}

#invoice-image-container
{
    background: white;
}

#invoice-image-scrollView
{
    background: white;
}

#invoice-image-scrollView img
{
    display: block;
}

#invoice-image-scrollView ol
{
    display: none;
}

#invoice-image-scrollView .noImage
{
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
}



/*----------------------------------------------------------------------

                        View: Invoice image preview

------------------------------------------------------------------------*/

#invoice-image-preview-container
{
    position: relative;
    overflow: hidden;
    left: 0;
    top: 0;
}

#invoice-image-preview
{
    width: 100%;
}

.km-novazoomin
{
    -webkit-mask-box-image: url('../../Images/Nova.ImagePreview.ZoomIn.png');
}

.km-novazoomout
{
    -webkit-mask-box-image: url('../../Images/Nova.ImagePreview.ZoomOut.png');
}

.km-novareset
{
    -webkit-mask-box-image: url('../../Images/Nova.ImagePreview.Reset.png');
}

.km-novaprevious
{
    -webkit-mask-box-image: url('../../Images/Nova.ImagePreview.Previous.png');
}

.km-novanext
{
    -webkit-mask-box-image: url('../../Images/Nova.ImagePreview.Next.png');
}

/*----------------------------------------------------------------------

                           View: Compose mail

------------------------------------------------------------------------*/

#view-compose-mail .km-content
{
    background: White;
}

#view-compose-mail #compose-mail-form
{
    width: 100%;
    padding: 0.5em;
    vertical-align: middle;
    background: White;
}

#view-compose-mail #compose-mail-form .label
{
    float: left;
    margin-top: 0.2em;
    height: 1.5em;
    min-width: 70px;
    line-height: 100%;
    font-weight: normal;
    color: White;
}

#view-compose-mail #compose-mail-form .input
{
    overflow: hidden;
    margin-right: 0.5em;
}

#view-compose-mail #compose-mail-form .input textarea
{
    width: 100%;
    font-size: 0.9em;
    color: Black;
    resize: none;
}

#view-compose-mail #compose-mail-form .attachment
{
    text-align: left;
    vertical-align: middle;
    line-height: 100%;
    height: 1.3em;
}

#view-compose-mail #compose-mail-form .attachment img
{
    float: left;
    width: 1.2em;
    height: 1.2em;
}

#view-compose-mail #compose-mail-form .attachment span
{
    float: left;
    margin-top: 0.2em;
    font-size: 0.7em;
    font-style: italic;
    color: #666666;
}

#view-compose-mail #compose-mail-form .body textarea
{
    width: 97%;
    height: 100%;
    min-height: 15em;
    font-size: 0.9em;
    resize: none;
    border: none;
}

#view-compose-mail #compose-mail-form .validInput
{
    border: none;
}

#view-compose-mail #compose-mail-form .invalidInput
{
    border-bottom: 1px solid red;
}

#compose-mail-form li {
    border: 2px solid white;
}

#compose-mail-autocomplete-container
{
    line-height: 90%;
}

#compose-mail-autocomplete-name
{
    font-size: 0.8em;
    font-weight: bold;
}

#compose-mail-autocomplete-email
{
    font-size: 0.8em;
}

/*----------------------------------------------------------------------

                          Action sheet

------------------------------------------------------------------------*/

#invoiceGlobalActions li 
{
    padding:0.1em;
}

#invoiceGlobalActions li a 
{
    font-size: 1.25em;
}

/*----------------------------------------------------------------------

                         Folder Action sheet

------------------------------------------------------------------------*/

#folderActions li 
{
    padding:0.1em;
}

#folderActions li a 
{
    font-size: 1.25em;
}

/*----------------------------------------------------------------------

                         Invoice List Action sheet

------------------------------------------------------------------------*/

#invoiceListActions li 
{
    padding:0.1em;
}

#invoiceListActions li a 
{
    font-size: 1.25em;
}

/*----------------------------------------------------------------------

                         Email Action sheet

------------------------------------------------------------------------*/

#emailActions li 
{
    padding:0.1em;
}

#emailActions li a 
{
    font-size: 1.25em;
}

/*----------------------------------------------------------------------

                           View: Approve Invoice

------------------------------------------------------------------------*/

.selectUserButton 
{
    width:30%;
    height:2em;
}

input.readonlyTextBox 
{
    width:60%;
    margin:0.8em;
    font-size:1.1em;
    display:block;
}

/*----------------------------------------------------------------------

                          switch widget

------------------------------------------------------------------------*/
.switch-section ul
{
    margin: 0;
    padding: 0;
}
.switch-section ul li
{
    margin: 0;
    padding: 10px 10px 10px 10px;
    min-height: 28px;
    line-height: 28px;
    vertical-align: middle;
}
.switch-section
{
    padding: 0;
}
.switch-section ul li .km-switch
{
    float: right;
}