body {
    padding: 10px;
}
.wide {
    width: 100%;
}

.login-form {
    max-width: 400px;
}
.my-form {
    margin: 0 auto;
}
.my-form div.form-group {
    padding-bottom: 20px;
}
.my-form-group-inline input[type="range"] {
    display: none;
}
.my-form-group-inline input[type="number"] {
    width: 50%;
    text-align: center;
    float: right;
}
.my-form-group-inline small {
    width: 50%;
    float: right;
}
.my-form-group-inline::after {
  content: "";
  clear: both;
  display: table;
}
.my-range-group input[type="range"] {
    display: inline-block;
    width: calc(100% - 80px)
}
.my-range-group input[type="number"] {
    width: 60px;
    float: right;
    margin-bottom: 4px;
}
/*
.my-range-slider {
    display: inline-block;
    width: calc(100% - 80px)
}
.my-range-text {
    width: 60px;
    float: right;
    margin-bottom: 4px;
}
*/
.my-price {
    /*text-align: center;*/
    /*margin: 5px 20px 5px 20px;*/
}
.my-price {
    font-weight: 600;
    font-size: 22px;
    border: 1px solid grey;
    width: fit-content;
    padding: 5px 10px 5px 10px;
    margin: 0 auto;
}
.my-form-footer {
    background-color: #F3F3F3;
}
.my-btn-close-dialog {
    width: 100%; text-align: right; padding-right: 20px;
}
.my-btn-close-dialog>span {
    font-weight: 600;
}
.my-title {
    color:blue;
}
.my-link {
    color: blue;
    cursor: pointer;
}
.my-link:hover {
    color: lightblue;
    text-decoration: underline;
}

.my-radio-option {
    border: 1px solid lightgrey;
    margin: 5px;
    cursor: pointer;
    color: darkgrey;
}
.my-radio-group.bgwhite .my-radio-option {
    background-color: white;
}
.my-radio-option:hover {
    background-color: #F3F3F3;
    color: black;
}
.my-radio-option.selected {
    border: 1px solid blue;
    background-color: #F3F3F3;
    color: black;
}
.my-radio-option .title {
    font-size: 18px;
    color: blue;
}
.my-alert {
    color: red;
}
.my-warning {
    color: orange;
}

.list-thumb {
    width: 100px;
}

.text-white a {
    color: white;
}
.text-white a:hover,
.text-white a:visited
{
    color: white;
}


.error-bubble {
    position: absolute;
    z-index: 1;
    display: none;
    background: #FFFF78;
    border: 1px solid black;
    /*width: 400px;*/
    padding: 5px;
    opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */

    box-shadow:             0px 0px 10px #000000;
    -moz-box-shadow:        0px 0px 10px #000000;
    -webkit-box-shadow:     0px 0px 10px #000000;
    border-radius:          3px 3px 3px 3px;
    -moz-border-radius:     3px 3px 3px 3px;
    -webkit-border-radius:  3px 3px 3px 3px;

    -webkit-touch-callout:  none;
    -webkit-user-select:    none;
    -khtml-user-select:     none;
    -moz-user-select:       none;
    -ms-user-select:        none;
    user-select:            none
}


.error-bubble-target-field {
    border: 2px solid red;
}

#admform-container {
    z-index: 2;
    opacity: 0;
    width: 100%;
    height: 100%;
    background: black;
    transition: opacity 1.5s;
}

#admform-container.show {
    display: block;
    opacity: .3;
}

#admform {
    z-index: 3;
    opacity: 0;
    min-width: 400px;
    min-height: 400px;
    width: 400px;
    height: 400px;
    text-align: center;
    background: #FCFCFC;
    padding: 20px;
    border-radius: 5px;
    transition: opacity 1.5s;
}

#admform.show {
    display: block;
    opacity: 1;
}

.center-in-window {
    position: fixed;
    margin: 0 auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.hcenter {
    margin: 0 auto;
}
.break-word {
    word-wrap: anywhere;
}
.page-title {
    margin-top: 20px;
}

.panel table td {
    padding: 5px;
}

.panel table td.text-small {
    font-size: 12px;
}

.panel table tr.odd {
    background: #EAEAEA;
}

.panel .lite-link {
    cursor: pointer;
}
.panel .lite-link:hover {
    text-decoration: underline;
}

.panel .one-row {
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.wrapword {
    white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    white-space: pre-wrap;       /* css-3 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
    white-space: -webkit-pre-wrap; /* Newer versions of Chrome/Safari*/
    word-break: break-all;
    white-space: normal;
}


.content-container {
    /*
    width: 80%;
    */
}
.left-bar-container {
    /*
    width: 20%;
    */
    /*
    position: relative;
    overflow-x: hidden;
    */
}

.breadcrumb-container {
    text-align: right;
    width: 100%;
    padding-right: 10px;
}


.left-bar {
    /*
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    min-width: 150px;
    */
}

.top-bar {
    background: lightgrey;
    padding: 10px;
}
.left-bar span {
    display: block;
}

.top-bar-left {
    float: left;
}

.top-bar-right {
    float: right;
}

.logo-image {
    width: 250px;
}
/*
.wait-layer {
    position: fixed;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: .5;
    display: none;
}
*/
.products-form,
.fixed-height {
    overflow-x: auto;
    max-height: 600px;
}

table.sticky-header>thead th
{
    background: white;
    position: sticky;
    top: 0px;
}

table th.center,
table td.center {
    text-align: center;
}

.image-viewer {
    position: fixed;
    z-index: 1;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    background-color: transparent;
    /*opacity: .5;*/
    display: none;
    align-content: center;
    text-align: center;
}

.image-viewer>img {
    border: 2px solid grey;
    box-shadow: 0px 0px 5px grey;
    height: 90%;
    max-width: 90%;
}

.btn-transparent {
    border: 0px;
    background: transparent;
    color: blue;
}
.btn-transparent:hover {
    opacity: .7;
}

.warning-message {
    width: 100%;
    background: orange;
    font-weight: 600;
}
table.sortable th {
    min-width: 70px;
}

table.data-table>thead th {
    background: lightsteelblue !important;
}

table.big-table td {
    font-size: 14px;
}