﻿b {
    font-weight: bold;
}

.fill, .fillWidth {
    width: 100%;
}

.fill, .fillHeight {
    height: 100%;
}

.hide {
    visibility: collapse;
    display: none;
}

.contentRow {
    top: 40px;
    bottom: 40px;
    padding: 5px;
    margin: 5px;
    margin-right: 0;
}

.noTitle {
    top: 0;
}

.backButtonBkg, .backButtonIcon {
    position: absolute;
    top: 0;
    left: 0;
}

.backButtonIcon {
    top: 25%;
    left: 25%;
    width: 50%;
    height: 50%;
    display: block;
}

#titleLogo {
    position: absolute;
    left: 45px;
    height: 40px;
    width: 127px;
}

.protoVisionLogo {
    position: absolute;
    right: 13px;
    bottom: 5px;
    height: 40px;
    width: 150px;
}

@media (max-width: 700px) {
    .protoVisionLogo {
        right: 5px;
        height: 15px;
        width: 75px;
    }
}

@media (max-width: 320px) {
    .protoVisionLogo {
        width: 60px;
    }
}

/*#actionsBar {
                position: absolute;
                left: 5px;
            }*/

@media (max-width: 700px) {
    .action {
        width: 80px;
        text-align: center;
    }

    .actionTitle {
        text-align: center;
    }

    .actionTitle {
        font-size: 0.8em;
    }

    .actionIcon {
        height: 25px;
        width: 25px;
    }
}

@media (min-width: 701px) {
    .action {
        vertical-align: middle;
    }

    .actionTitle, .actionSeparator {
        vertical-align: middle;
    }

    .actionTitle {
        display: inline-table;
    }

    .actionTitle {
        width: 100px;
        font-size: 1.1em;
    }

    .actionIcon {
        height: 40px;
        width: 40px;
    }
}

.actionSeparator {
    display: inline-table;
    width: 5px;
}

.action, .actionButton {
    display: inline-table;
}

.button {
    cursor: pointer;
    background-color: transparent;
}

    .button:hover {
        background-color: lightblue;
    }

    .button:active {
        background-color: white;
    }

.defs-only {
    display: block;
    position: absolute;
    height: 0;
    width: 0;
    margin: 0;
    padding: 0;
    border: none;
    overflow: hidden;
}

.gridContainer {
    overflow-x: scroll;
    overflow-y: hidden;
    /* IOS
                -webkit-overflow-scroll: touch;*/
}

.queryColumnButtonImage, .queryFindButtonImage {
    width: 25px;
    height: 25px;
}

.queryColumnButtonBigImage {
    width: 75px;
    height: 75px;
}

#filter {
    vertical-align: middle;
}

/*.queryTable {
                border-collapse: collapse;
                border-spacing: 0;
                margin-bottom: -16px !important;
            }*/

.queryGroupCell {
    background-color: lightblue;
}

.queryColumn, .queryCell {
    height: 40px;
}

    .queryCell .Hidden {
        height: 0;
    }

.queryColumn, .queryColumnFill, .queryColumnButton {
    background-color: lightgray;
}

.queryColumn, .queryColumnButton {
    width: auto;
}

.queryColumn, .queryColumnFill {
    position: relative;
}

.queryColumnFill {
    width: 100%;
}

.queryColumnButton {
    padding-left: 40px;
}

.queryButtonContainer {
    margin-left: 10px;
    vertical-align: middle;
}

.queryFindButtonContainer {
    margin-left: 5px;
    vertical-align: middle;
}

.queryColumnButtonImage {
    border-left: 10px;
}

.queryColumnCaption {
    font-weight: bold;
    margin-right: 20px;
}

.queryColumnSortButton {
    position: absolute;
    right: 0;
    top: 50%;
    width: 20px;
    margin-top: -10px;
}

.queryEvenRow {
    background-color: #E0E0E0;
}

.queryColumn, .queryColumnFill {
    padding-left: 5px;
    padding-right: 20px;
}

.queryCell {
    padding-left: 5px;
    padding-right: 5px;
}

    .queryCell.right {
        padding-right: 20px;
    }

.right {
    text-align: right;
}

.center {
    text-align: center;
}

.field {
    position: relative;
    width: 100%;
    padding-bottom: 5px;
}

.fieldButton {
    background-color: #E0E0E0;
    height: 40px;
}

.fieldDescription, .fieldButton {
    width: 150px;
    display: inline-block;
}

.fieldControl, .fieldValue, .fieldButtonInfo {
    display: inline-block;
}

.fieldFillControl {
    width: 100%;
    display: inline-block;
}

.fieldValue {
    min-width: 250px;
   /*font-weight: bold;*/
}

.fieldButtonInfo {
    padding-left: 5px;
    font-size: 12px;
}

@media (max-width: 700px) {
    .fieldButton {
        width: 100%;
    }

    .fieldButtonInfo {
        width: 100%;
    }

    .fieldValue {
       /* margin-left: 10px;*/
    }
}

@media (min-width: 701px) {
    .fieldButtonInfo {
        top: 50%;
        margin-top: -15px;
    }
}

.fieldAreaDescription .fieldArea {
    width: 100%;
}

.fieldDetailButton {
    position: absolute;
    right: 5px;
    top: 0;
}

.fieldButton {
    text-align: left;
    font-size: 16px;
}

.listRow {
    height: 40px;
}

.listIcon {
    height: 40px;
    width: 40px;
}

.listDescription {
    font-size: 18px;
}

.loadingScreen {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: #909090;
    text-align: center;
    z-index: 100;
}

.loadingScreenContent {
    position: absolute;
    top: 50%;
    left: 50%;
    bottom: 50%;
    height: 40px;
    width: 200px;
    margin-top: -20px;
    margin-left: -100px;
    font-size: 24px;
}

.loadingScreenText {
    display: inline;
    vertical-align: bottom;
    margin-left: 5px;
}

.fixFillDescription {
    width: 40%;
    height: 40px;
}

.fixFillValue {
    width: 60%;
    text-align: right;
    font-weight: bold;
}

.artDescription {
    width: 50%;
    height: 40px;
}

.artValue {
    width: 50%;
    font-size: 28px;
    text-align: right;
}

.qtaDescription {
    width: 100%;
    height: 40px;
}

.qtaValue {
    width: 0;
    font-size: 36px;
    text-align: right;
}

.przListino {
    width: 50%;
    height: 40px;
}

.przValue {
    width: 25%;
    font-size: 18px;
    text-align: right;
}

.titleBox {
    padding: 10px;
    margin-bottom: 5px;
    background-color: lightblue;
}

.infoBox {
    padding: 10px;
    margin-bottom: 5px;
    background-color: lightgreen;
}

.infoLightBox {
    padding: 10px;
    margin-bottom: 5px;
    background-color: lightgoldenrodyellow;
}

.questionBox {
    padding: 10px;
    margin-bottom: 5px;
    background-color: gold;
}

.warningBox {
    padding: 10px;
    margin-bottom: 5px;
    background-color: orange;
}

.errorBox {
    padding: 10px;
    margin-bottom: 5px;
    background-color: red;
    color: white;
    text-shadow: none;
}

.controlInteger, .controlPrice {
    text-align: right;
}

.controlBoolean {
    width: auto;
}

/* Form */
.control, .controlInteger {
    width: 170px;
}

.controlPriceContainer {
    width: 170px;
}

.controlPrice {
    width: 150px;
}

.controlTextArea {
    resize: none;
    width: 100%;
    height: 80px;
}

/* Griglia */
/*td > div.control, td > div.controlInteger {
                width: 120px;
            }

            td > div.controlPriceContainer {
                width: 120px;
            }

            td > div.controlPriceContainer > input.controlPrice {
                width: 100px;
            }*/
/* end */

.formSeparator {
    height: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    background-color: lightgray;
}

.formSeparatorBlue {
    height: 3px;
    margin-top: 5px;
    margin-bottom: 5px;
    background-color: blue;
}

.formSpace {
    height: 10px;
}

.LogoContainer {
    position: relative;
    height: 200px;
}

.Logo {
    position: absolute;
    left: 50%;
    width: 220px;
    margin-left: -110px;
}

.Logo350 {
    position: absolute;
    left: 50%;
    width: 350px;
    margin-left: -175px;
}

.findBarcode {
    width: 100%;
    height: 40px;
    font-size: 24px;
}

#debug-panel {
    position: absolute;
    top: 200px;
    left: 500px;
    height: auto;
    width: 500px;
    border-color: red;
    border-width: 2px;
    border-style: dashed;
}

#debug-output {
    width: 500px;
    max-width: 500px;
    min-width: 500px;
    min-height: 150px;
    background-color: transparent;
}

.countBubl {
    float: left;
    margin-top: -13px;
    /*margin-left: 35px;*/
    background: #ed1d24;
    color: #fff;
    padding: 2px;
    border-radius: 5px;
    z-index: 100;
    border: solid #999 1px;
    width: 25px;
}

.inlineIcon {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin-right: 6px;
}

/* Hide the number input */
.full-width-slider input {
    display: none;
}

.full-width-slider .ui-slider-track {
    margin-left: 15px;
}




.ui-selectmenu.ui-popup .ui-input-search {
    margin-left: .5em;
    margin-right: .5em;
}

.ui-selectmenu.ui-dialog .ui-content {
    padding-top: 0;
}

.ui-selectmenu.ui-dialog .ui-selectmenu-list {
    margin-top: 0;
}

.ui-selectmenu.ui-popup .ui-selectmenu-list li.ui-first-child .ui-btn {
    border-top-width: 1px;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.ui-selectmenu.ui-dialog .ui-header {
    border-bottom-width: 1px;
}