#category-table, #category-edit-table, #shape-table, #shape-edit-table {
margin:auto;
width:700px;
max-width:100%; border-radius:20px; background-color:#fffeee;
}
#category-table th, #category-edit-table th, #shape-table th, #shape-edit-table th {
text-align:left;
vertical-align:top;
background-color:#aeaee8;
padding:5px;
}
#category-table td.sortorder, #category-edit-table td.sortorder, #shape-table td.sortorder, #shape-edit-table td.sortorder {
text-align:center;
padding:5px;
}
.category-table, .category-edit-table, .shape-table, .shape-edit-table {
margin:auto;
width:700px;
max-width:95%;
border:1px solid #cccccc;
border-radius:20px;
padding:10px;
border-spacing:10px;
background-color:#fffeee;
}
td.df-cell-center, th.df-cell-center {
text-align:center;
}
.category-checkboxes {
display:grid;
grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
}
input.df-narrow-input {
width:60px;
max-width:100%;
}
input.df-narrow-medium {
width:140px;
max-width:100%;
}
input.df-full-input {
width:100%;
}
.df-flex-cell {
display:flex;
align-items:center;
justify-content: space-between;
}
.df-button {
padding:10px;
color:white;
background-color:#288d1a;
cursor:pointer;
}
.df-button:hover {
color:black;
background-color:#77b76e;
}
span.category-title {
font-weight:bold;
}
td.thumbnail {
max-width:50px;
}
td.thumbnail img {
width:100%;
height:auto;
margin-bottom:0px;
}
.df-deleted {
display:none;
}
.df-admin-link {
padding:5px;
}
.df-admin-link a {
text-decoration:none;
}
.df-admin-link a:hover {
text-decoration:underline;
}
span.thumbnail {
display:block;
width:250px;
max-width:100%;
overflow:hidden;
}
span.thumbnail img {
width:100%;
height:auto;
margin-bottom:0px;
}
td.edit-image {
display:flex;
justify-content:center;
align-items:center;
overflow:hidden;
}
.df-sort-button {
background-color:#6993bf;
color:white;
cursor:pointer;
padding:10px;
}
.df-sort-button:hover {
color:black;
}
.df_basket_icon {
display:block;
position:relative;
}
.df_basket_icon_text {
display:inline-block;
position:absolute;
left:-9999px;
}
.df_basket_icon:before{
position: relative;
background-size: 100% 100%;
display: inline-block;
top: 10px;
width: 30px;
height: 30px;
content: "";
background-image: url(//www.directfoam.com/wp-content/uploads/2022/05/cart-icon-blue.png);
}
body.page-id-26776 .df_basket_icon {
display:none;
}
.cushion-selector-div {
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
gap:1em; 
width:300px;
}
.cover_image_cart {
display:none;
} .msb-radiobutton {
position:relative;
display:inline-block;
width:40px;
height:18px;
background-color:#b0b0b0;
border-radius:18px;
}
.msb-radio-toggle {
position:absolute;
width:12px;
height:12px;
background-color:white;
display:inline-block;
left:0px;
margin:3px;
border-radius:50%;
}
.radioactive {
background-color: #6BBB1A; 
}
.radioactive.testmode {
background-color: orange !important; 
}
.radioactive .msb-radio-toggle {
left:21px;
}   .nf-img-uploader {
cursor:pointer;
padding:10px;
background-color:#27c527;
color:white;
margin-right:5px;
margin-left:5px;
}
.nf-img-uploader:hover {
color:black;
}
.nf-img-uploader.delete {
background-color:#da8153;
}
.uploader-button {
display:flex;
justify-content:center;
alight-items:center;
}
.modified-image {
border:1px solid red;
} .shape-wrapper {  text-align:center;
padding:25px 10px 15px 10px;
}
.shape-grid {
display: grid;
grid-gap: 1em 1.5em;
grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
align-items:flex-end;
}
.shape-grid-dimension {
display: flex;
flex-wrap:wrap;
grid-gap: 1em;
justify-content:space-between; align-items:top; }
.shape-grid-dimension>div {
max-width:175px;
width:175px;
}
.shape-grid-dimension div#shape-image-box {
width:50%;
max-width:350px;
margin:auto;
}
.image-caption {
display:flex;
justify-content:center;
align-items:top;
height:30px; color:#333333;
font-weight:normal !important;
line-height:130%;
}
.shape-image {
display:flex;
justify-content:center;
align-items:center;
width:100%; }
.shape-image img {
margin-top:10px;
}
.summary-shape-image {
max-width:250px;
margin:auto;
}
.dimension-input-field {
display:flex; justify-content: start;
padding:2px;
align-items:center;
}
.dimension-input-field input[type="text"] {
width:70px;
height:25px;
color:#137CAE;
}
.units-title, .form-title {
font-weight:bold;
text-align:left;
justify-self:flex-start;
text-transform:uppercase; color:#137CAE; font-size:90%; margin-bottom:10px;
}
.foam-grid {
display: grid;
grid-gap: 1em;
grid-template-columns: repeat(auto-fill, minmax(155px, 1fr));
text-align: left;
margin-top:10px;
margin-bottom:20px;
}
.foam-grid-wide {
display: grid;
grid-gap: 1em;
grid-template-columns: repeat(auto-fill, minmax(205px, 1fr));
}
.foam-selection-label {
text-align:left;
margin-top:10px;
color:#137CAE;
text-transform:uppercase;
font-weight:bold;
}
.foam-grid-wide div {
display:flex;
align-items:center;
}
.foam-grid-wide div div input {
margin-bottom:0px;
}
#cart-summary-wrapper {
display:flex;
justify-content:space-between;
flex-wrap:wrap;
}
.hidden-panel {
display:none;
}
.guidance-next {
display:flex;
justify-content:space-between;
align-items:center;
}
#enter-dimensions, #select-foam, #choose-cover {
display:flex;
text-align:center;  
color:#CC0000;
text-transform:uppercase;
justify-content:center; margin-top:10px; margin-bottom:15px; }
#qty-field { 
width:100px;
}
#dimensions-next {
cursor:pointer;
color: #FFFFFF;
background:#137CAE;
padding:5px 15px;
}
#ajax-wait {
position:absolute;
display:none;
left:45%;
top:-40px;
}
.ultra-prominent {
background: yellow;
color: blue;
font-weight: bold;
font-size: 120% !important;
}
.admin-shape-image {
max-width:300px;
margin:auto;
overflow:hidden;
}
.admin-shape-image img {
width:100%;
height: auto !important;
margin-bottom:0px;
}
.admin_dimensions {
color:blue;
font-size:120%;
font-weight:bold;
}
.admin_customer_shape span {
color:blue;
font-weight:bold;
}
.admin_customer_shape span.summary-label {
color:black;
}
.print_button {
margin:auto;
display:block;
max-width: fit-content;
padding: 10px;
font-weight: bold;
border-radius:10px;
border:2px solid #cccccc;
color: white;
background-color: blue;
cursor:pointer;
}
.print_button:hover {
color:#333333;
background-color:#9f9fe4;
border:2px solid black;
}
.cart-summary {
display:flex;
flex-direction:column;
justify-content:space-between;
gap:0.25em;
flex-wrap:wrap; width:fit-content;
text-align:left;
margin: auto;
padding: 10px;
border: 3px solid #cccccc;
border-radius: 10px;
margin-bottom: 20px;
margin-top: 10px;
font-size:90%;
background:#FFFFFF;
}
.cart-summary div {
white-space:nowrap;
}
.summary-label {
font-weight: bold;
white-space: break-spaces;
}
.dimension_error { 
visibility:hidden;
color:#CC0000;
}
.dimension_error.size-error {
visibility:visible;
}
.dimension-field.size-error {
background-color:#ecc6b7;
font-weight:bold;
color:#CC0000;
}
#calculator_error {
font-weight:bold;
color:#CC0000;
}
.dimension-list {
white-space: break-spaces;
}
.new-grid-row {
grid-column-start: 1;
}
#cushion-cover-panel {
display:none;
}
#add-to-basket {
cursor:pointer;
}
#add-to-basket.basket-disabled, #basket_disabled {
cursor:none;
background-color:grey;
}
.calculator-basket-disabled {
color:red;
border:2px solid #cccccc;
padding:10px;
}
.calculator-basket-disabled div {
text-align:center;
}
.nickname-wrapper {
text-align:left; color:#137CAE;
margin-top:10px;
margin-bottom:15px;
}
dd p {
text-align:left;
}
#foam-info-link, #foam-density-link, #foam-options-link, #foam-cushioncover-link {
font-size:70%;
margin-left:20px;
cursor:pointer;
}
#foam-type-info-panel, #foam-density-info-panel, #foam-options-info-panel, #foam-cushioncover-info-panel {
display:none;
border:1px solid green;
padding:10px;
text-align:left;
position:relative;
}
#foam-type-info-panel h3, #foam-density-info-panel h3, #foam-options-info-panel h3, #foam-cushioncover-info-panel h3 {
text-align:left;
margin-bottom:5px;
font-size:110%;
font-weight:bold;
text-transform:none;
}
#foam-type-info-panel p, #foam-density-info-panel p, #foam-options-info-panel p, #foam-cushioncover-info-panel p {
margin-top:0;
}
#close-foam, #close-density, #close-options, #close-cushioncover {
position:absolute;
right:-10px;
top:-10px;
}
#close-foam img, #close-density img, #close-options img, #close-cushioncover img {
margin:0px;
} .custom-foam-image {
min-width:100px;
}
.popular { color:#333333;
font-weight:bold;
}
.notpopular { color:#333333;
} #shape-dimensions-form label {
margin-right:10px;
width:30px;
display:inline-block;
}
#foamtypepanel {
margin-bottom:10px;
}
#checkoutpanel {
margin-top:25px;
margin-bottom:35px;
border:solid 1px #137CAE;
padding:1% 2% 2% 2%;
background:#F2F2F2;
}
.summary-shape-image img {
border:solid 1px #CCCCCC;
}
.input-units {
margin-left:5px;
margin-right:5px;
}
a .shape-image img {
}
a:hover .shape-image img {
opacity:0.7;
}
.cushion-cover-thumbnail img {
margin-top:0px !important;
}
#covertype_dropdown {
color:#4D4D53;
font-family: 'Montserrat', Arial, Helvetica, sans-serif;
background:#F2F2F2;
padding:6px;
}
.cushion-thumb-wrapper {
position:relative;
} .cover_image_cart_hover {
display:none;
overflow: hidden;
position: absolute;
width: 850px;
height: 425px !important;
z-index: 9999;
border:solid 1px #333333;
}  
.cover_image_cart_hover img {
width: 100%;
height: auto !important;
}
.cushion-thumb-wrapper:hover .cover_image_cart_hover { }
.cushion-thumb-wrapper.showpop .cover_image_cart_hover {
display:block;
}
@media only screen and (max-width: 600px) {
.shape-grid-dimension div#shape-image-box {
width: 100%;
max-width: 350px;
margin: auto;
}
}