body {
    padding-top:80px;
}

input[type="file"] {
     display:none; 
}

.preview-container {
    display: grid;
    grid-template-columns: repeat(auto-ift, minmax(200px, auto));
    grid-column-gap:30px;
    grid-row-gap:50px;
    margin-top:50px;
}

.image-container {
    padding:5px;
    background-color: #3c4d68;
    color:#fff;
}

.preview-container img {
    display: inline-block;
    max-width:100%;
    height:auto;
    max-height:200px;
}

.drop-area {
    border: 2px dashed #ccc;
    border-radius: 5px;
    width: 100%;
    height: auto;
    display: block;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    color: #666;
    /*margin-top: 20px;*/
    padding:10px;
    text-align: center;
}


.drop-area:hover,
.highlight {
    border-color:green;
    background-color:lightgreen;
    cursor:pointer;
}

.error {
    display:none;
}

#spinnerSaveAndUpdate,
#spinnerLoadModelData {
    display:none;
}

.blur {
    filter: blur(20px);
}

.fleshlight-color-swatch-container {
    text-align: center;
    font-size:10px;
    text-transform:uppercase;
}

.fleshlight-color-swatch {
    display: inline-block;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    /*margin-right: 10px;*/
    border: 4px solid #666;   
}

.fleshlight-color-swatch:hover {
    border-color:#ccc;
    cursor:pointer;
}

.fleshlight-color-swatch.selected {
    border-color:#32276b;
    -webkit-box-shadow:0px 0px 21px 4px rgba(120,62,168,0.46);
    -moz-box-shadow: 0px 0px 21px 4px rgba(120,62,168,0.46);
    box-shadow: 0px 0px 21px 4px rgba(120,62,168,0.46);
}

.imageControlTables {
    height:100%;
    width:100%;
    border:1px solid #ccc;
    padding:5px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center center;
}

#tableSignaturePosition {
    background-image:url(images/templates/signature_positions_bg.jpg);
}

#tableSignaturePosition td {
    /*border:1px solid #ccc;*/
    padding:5px;
    text-align:center;
    cursor:pointer;
}

#tableSignaturePosition input[type="radio"] {
    /*border:1px solid #ccc;*/
    transform:scale(1.5);
}

#tableModelBGControl.bgDisabled {
    background-image:url(images/templates/bg_remove_control_bg_with_bg.png);
    background-size:cover;
    color:white;
    text-shadow: 1px 1px 2px black;
    font-weight: bold;
    text-transform:uppercase
}

#tableModelBGControl.bgEnabled {
    background-image:url(images/templates/bg_remove_control_bg_without_bg.png);
    background-size:cover;
    color:white;
    text-shadow: 1px 1px 2px black;
    font-weight: bold;
    text-transform:uppercase;
}

#cogBasedTexturesTable {
    display:none;
}
#tableModelBGControl td {
    padding:5px;
    text-align:center;
    cursor:pointer;
}

#rpImageContainer {
    position: relative;
    right:0px;
    text-align: right;
    height:90%;
    text-align:left;
}

.card img {
    height:250px;
    object-fit: cover;
}

.card {
    min-width: 100% !important;
}

.home-page-card .card:hover {
    cursor: pointer;
    border-color: blue;
}

@media screen and (max-width: 767px) {
    #rpImageContainer {
        margin-top:20px;
    }
}