html, body { 
    margin: 0; 
    height: 100%; /* Ensure the body takes up full height */ 
    overflow:hidden;
} 


/* Style the button that is used to open and close the collapsible content */
.collapsible {
/*background-color: #eee;*/
/*color: #444;*/
cursor: pointer;
padding: 3px;
width: 100%;
/*border: none;*/
text-align: left;
outline: none;
font-size: 15px;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .collapsible:hover {
background-color: #ccc;
}

/* Style the collapsible content. Note: hidden by default */
.content {
padding: 0 3px 3px;
display: none;
overflow: hidden;
/*background-color: #f1f1f1;*/
} 

.collapsible:after {
content: '\02795'; /* Unicode character for "plus" sign (+) */
font-size: 13px;
color: white;
float: right;
margin-left: 5px;
}

.active:after {
content: "\2796"; /* Unicode character for "minus" sign (-) */
}

.product {
    margin-bottom:5px;
    padding:0px;
}

.productBox {
    border: #444 solid 1px;
    border-radius: 8px;
    margin: 5px;
    height:100%;
    padding: 5px;
}


.ps-head {
    height:100px;
}

.ps-body { 
    height: 100vh; /* Full viewport height */ 
    overflow-y: auto; /* Enable scrolling if content overflows */ 
    overflow-x:hidden;
    box-sizing: border-box; /* Include padding in width/height */ 
}

.ps-body-inner {
    margin-right: 15px;
}

.bottom-spacer {
    margin-top:115px;
}

.ps-sidebar {
    padding: 0 20px 0 20px;
    /*height: 100%;*/
    height: 100vh; /* Full viewport height */ 
    overflow-y: auto; /* Enable scrolling if content overflows */ 
    overflow-x:hidden;
    box-sizing: border-box; /* Include padding in width/height */ 
}

.form-check-label,.noselect {
    -webkit-user-select: none; /* Safari */        
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+/Edge */
    user-select: none; /* Standard */

}

td {
    vertical-align: top;
}

.detailTable {
    width:100%;
    border-collapse: collapse;
    margin-bottom:3px;
    margin-top: 3px;
}

.detailTable td {
    border: 1px solid black;
    padding: 2px;
}

.align-right {
    text-align:right;
}

.align-left {
    text-align:left;
}

.center {
    text-align:center;
    margin-left: auto;
    margin-right: auto;
}

.width100 {
    width:100%;
}

.productDetailsArea{
    vertical-align: bottom;
}

.content-product {
    max-height:15em;
    overflow-y:auto;
}

.greytext {
    color:grey;
    font-style: italic;
}

.productBox img {
    cursor:pointer;
    width:50%;
    display:inline-block;
    margin-left:auto;margin-right:auto;
    object-fit:contain;
}

.carousel-button {
    display:inline-block;
    font-size: 1.5em;
    /*color: rgb(43, 43, 43);*/
    background-color: transparent;
    background-repeat: no-repeat;
    border: none;
    cursor: pointer;
    overflow: hidden;
    outline: none;
}

.disabled {
    opacity:0.3;
    cursor: not-allowed;
}
