/* Minification failed. Returning unminified contents.
(343,40): run-time error CSS1046: Expect comma, found '0'
(343,44): run-time error CSS1046: Expect comma, found '/'
(358,41): run-time error CSS1046: Expect comma, found '0'
(358,45): run-time error CSS1046: Expect comma, found '/'
(363,40): run-time error CSS1046: Expect comma, found '0'
(363,44): run-time error CSS1046: Expect comma, found '/'
 */
body {
    background-size: cover;
    background-position-x: center;
    color: #1c6e8c;
    font-size: 15px;
}

#paymentBtn > img {
}

.btn-success {
    background-color: #3a616b;
    border-color: #63bab5;
}

.btn-danger {
    border-color: #63bab5;
    background-color: #b0313d;
}

.form-control {
    border-color: #63bab5;
}

input[data-type="quantity"] {
    width: 40px !important;
    background-color: #d8f1eb;
}

.add-product-image {
    border: 2px solid #3a616b;
    border-radius: 5px;
}

.btn-breadcrumb > a {
    cursor: default;
}

.btn-breadcrumb .btn.btn-default.breadcrumb-selected {
    background-color: #63bab5;
    border-color: #63bab5;
}

.btn-breadcrumb .btn.btn-default.breadcrumb-selected:after {
    border-left: 10px solid #63bab5;
}

.btn-breadcrumb .btn.btn-default.breadcrumb-selected:hover:not(:last-child):after {
    border-left: 10px solid #63bab5;
}

.btn-breadcrumb .btn.btn-default.breadcrumb-selected:not(:last-child):before {
    border-left: 11px solid #63bab5;
}

.btn-breadcrumb .btn.btn-default.breadcrumb-selected:not(:last-child):after {
    border-left: 10px solid #63bab5;
}


.logo {
    color: #b0313d;
    font-size: 35px;
    font-weight: 800;
}

.color-danger {
    color: #b0313d;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#ProductsTable td {
    padding-top: 10px;
}

#ProductsTable thead {
    border-bottom: 1px solid #63bab5;
}

.bootstrap-dialog.type-primary .modal-header {
    background-color: #63bab5;
}


.pupil-details-container {
    border: 2px solid;
    padding: 10px;
    margin: 5px;
    background-color: white;
    border-radius: 10px;
    min-width: 330px;
}

@media (min-width: 768px) {
    .shopping-cart-container .pupil-details-container {
        height: 100%;
    }
}

.cursor-pointer {
    cursor: pointer;
}


.zoom-on-hover {
    transition: transform .2s;
}

.zoom-on-hover:hover {
    transform: scale(1.5);
}

.text-decoration-none:hover {
    text-decoration: none;
}

.basket-icon, .basket-icon:focus {
    color: #b0313d;
    font-family: Garibaldi-Medium, "GardenGrown", sans-serif;
}

.basket-icon:hover {
    color: #ea0943;
}

.basket-icon > i {
    box-shadow: none !important;
}

.right-share-btn {
    transform: rotate(0.25turn);
    box-shadow: none !important;
}

.left-share-btn {
    transform: rotate(0.75turn) scaleX(-1);
    box-shadow: none !important;
}

.missing-product {
    transition: all .4s ease;
    border: 4px solid #ea5f75;
    box-shadow: 0 0 20px red;
    border-radius: 10px;
    padding: 10px
}

.thank-you-container {
    max-width: 350px;
    margin: auto;
}

.shopping-cart-icon-container {
    position: absolute;
    top: 10px;
    right: 10px;
}

@media (max-width: 576px) {
    .shopping-cart-icon-container {
        position: relative;
        float: right;
    }
}

.card-preview-title {
    font-weight: bold;
    font-size: 22px;
}

.card-preview {
    background-color: #ffe3e3;
}

.gif-tag-preview {
    background-color: #aee2f0;
}

.calendar-preview {
    background-color: #cfebcf;
}

.drawing-image {
    max-height: 410px;
}

.drawing-image-thumbnail {
    max-width: 100px;
    max-height: 100px;
}

.placeholder-container {
    position: relative;
    border: 3px dotted #78e97d;
    padding: 10px;
    margin: 5px
}

.canvas-container {
    max-width: 470px;
    margin: 60px auto;
    padding: 25px;
}

.placeholder-title {
    position: absolute;
    top: -16px;
    left: -16px;
    background-color: white;
    border: 2px dotted #78e97d;
    color: #78e97d;
}

.placeholder-title-remove {
    position: absolute;
    top: -16px;
    right: -16px;
    background-color: white;
    border: 2px dotted #78e97d;
    color: #78e97d;
    cursor: pointer;
}

.product-quantity {
    font-size: 30px;
    font-weight: bold;
}

.basket-icon:hover,
.basket-icon:visited,
.basket-icon:focus {
    text-decoration: none;
}

.continue-count {
    color: #b0313d;
    font-size: 45px;
    font-weight: bold;
    position: absolute;
    top: -10px;
    right: 10px;
}

.greeting-text {
    color: black;
    font-size: 3em;
    font-family: "Dancing Script", serif;
    word-break: break-word;
}

.back-text {
    color: black;
    width: 100%;
    font-size: 19px;
    font-family: 'Trebuchet MS', serif;
    font-weight: bold
}

.back-text .back-text-title {
    color: red;
    font-weight: bold;
}

.crop-image-modal .modal-dialog,
.crop-image-modal .modal-content {
    /* 80% of window height */
    /*height: 80%;*/
}

.crop-image-modal .modal-body {
    /* 100% = dialog height, 120px = header + footer */
    max-height: calc(100% - 120px);
    overflow-y: scroll;
}

@media ( max-width: 480px ) {
    .modal.crop-image-modal {
        height: 90%;
        left: 5%; /* ( window's width [100%] - dialog's width [90%] ) / 2 */
        top: 5%;
        width: 90%;
    }
}

.modal {
    overflow: auto !important;
}

.note-input {
    margin-left: 20px;
    margin-top: 5px;
}

@media (max-width: 767px) {
    .note-input {
        margin-left: 10px;
        margin-right: 10px;
        max-width: calc(100% - 20px);
    }
}

.santa-sock-name-container {
    position: absolute;
    width: 40%;
    height: 18%;
    left: 22%;
    top: 9%;
    align-items: center;
    justify-content: center;
    display: flex;
    font-family: CooperBlack-Std, sans-serif;
    font-weight: bold;
    color: #b33131;
    white-space: nowrap;
}

[santa-sock-name] {
    font-size: 30px;
}

.upsell-bottom-btn {
    position: fixed;
    right: 15px;
    bottom: 15px;
    width: 100px;
    z-index: 100;
    cursor: pointer;
}

.loading-panel {
    position: fixed !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%);
}

.card-d {
    box-shadow: 9px 3px 12px 0px rgb(0 0 0 / 90%);
    background-color: white;
    text-align: center;
    border-radius: 15px;
    height: 145px;
    font-size: 95px;
    color: #A6122B;
    font-weight: 600;
    text-shadow: 1px 0px 3px black;
    width: 90%;
    cursor: pointer;
    transition: all .4s ease-in-out;
}

.card-d:hover {
    box-shadow: 12px 3px 20px 0px rgb(0 0 0 / 90%);
}

.selected {
    transform: scale(1.15);
    box-shadow: 9px 3px 12px 0px rgb(0 0 0 / 90%);
    border: 2px solid #A6122B;
}

.card-text {
    display: flex;
    justify-content: center;
    align-items: center;
}

@media (max-width: 991px) {
    .card-d {
        width: 100%;
    }
}

.loader {
    margin: 100px auto;
    font-size: 25px;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: relative;
    text-indent: -9999em;
    -webkit-animation: load5 1.1s infinite ease;
    animation: load5 1.1s infinite ease;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

[placeholder]:empty::before {
    content: attr(placeholder);
    color: #C6C6C8;
}

[placeholder]:empty:focus::before {
    content: "";
}

.image-media {
    max-height: 520px;
    background-color: white;
}

@media (max-width: 768px) {
    .image-media {
        max-height: 260px;
    }
}

body.modal.fade.in {
    overflow: hidden;
}

.image-canvas {
    margin: 15px;
    max-width: 240px;
    border: 3px solid;
    border-radius: 10px;
    background-color: white;
    padding: 15px;
}

.image-canvas:hover {
    box-shadow: 0 2px 8px 0;
    padding: 5px;
    transition: 0.5s;
}

@-webkit-keyframes load5 {
    0%, 100% {
        box-shadow: 0em -2.6em 0em 0em #ff0000, 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2), 2.5em 0em 0 0em rgba(255, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.2), 0em 2.5em 0 0em rgba(255, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.2), -2.6em 0em 0 0em rgba(255, 0, 0, 0.5), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.7);
    }

    12.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.7), 1.8em -1.8em 0 0em #ff0000, 2.5em 0em 0 0em rgba(255, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.2), 0em 2.5em 0 0em rgba(255, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.2), -2.6em 0em 0 0em rgba(255, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.5);
    }

    25% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.5), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.7), 2.5em 0em 0 0em #ff0000, 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.2), 0em 2.5em 0 0em rgba(255, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.2), -2.6em 0em 0 0em rgba(255, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2);
    }

    37.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.5), 2.5em 0em 0 0em rgba(255, 0, 0, 0.7), 1.75em 1.75em 0 0em #ff0000, 0em 2.5em 0 0em rgba(255, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.2), -2.6em 0em 0 0em rgba(255, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2);
    }

    50% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2), 2.5em 0em 0 0em rgba(255, 0, 0, 0.5), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.7), 0em 2.5em 0 0em #ff0000, -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.2), -2.6em 0em 0 0em rgba(255, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2);
    }

    62.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2), 2.5em 0em 0 0em rgba(255, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.5), 0em 2.5em 0 0em rgba(255, 0, 0, 0.7), -1.8em 1.8em 0 0em #ff0000, -2.6em 0em 0 0em rgba(255, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2);
    }

    75% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2), 2.5em 0em 0 0em rgba(255, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.2), 0em 2.5em 0 0em rgba(255, 0, 0, 0.5), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.7), -2.6em 0em 0 0em #ff0000, -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2);
    }

    87.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2), 2.5em 0em 0 0em rgba(255, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.2), 0em 2.5em 0 0em rgba(255, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.5), -2.6em 0em 0 0em rgba(255, 0, 0, 0.7), -1.8em -1.8em 0 0em #ff0000;
    }
}

@keyframes load5 {
    0%, 100% {
        box-shadow: 0em -2.6em 0em 0em #ff0000, 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2), 2.5em 0em 0 0em rgba(255, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.2), 0em 2.5em 0 0em rgba(255, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.2), -2.6em 0em 0 0em rgba(255, 0, 0, 0.5), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.7);
    }

    12.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.7), 1.8em -1.8em 0 0em #ff0000, 2.5em 0em 0 0em rgba(255, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.2), 0em 2.5em 0 0em rgba(255, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.2), -2.6em 0em 0 0em rgba(255, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.5);
    }

    25% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.5), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.7), 2.5em 0em 0 0em #ff0000, 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.2), 0em 2.5em 0 0em rgba(255, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.2), -2.6em 0em 0 0em rgba(255, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2);
    }

    37.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.5), 2.5em 0em 0 0em rgba(255, 0, 0, 0.7), 1.75em 1.75em 0 0em #ff0000, 0em 2.5em 0 0em rgba(255, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.2), -2.6em 0em 0 0em rgba(255, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2);
    }

    50% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2), 2.5em 0em 0 0em rgba(255, 0, 0, 0.5), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.7), 0em 2.5em 0 0em #ff0000, -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.2), -2.6em 0em 0 0em rgba(255, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2);
    }

    62.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2), 2.5em 0em 0 0em rgba(255, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.5), 0em 2.5em 0 0em rgba(255, 0, 0, 0.7), -1.8em 1.8em 0 0em #ff0000, -2.6em 0em 0 0em rgba(255, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2);
    }

    75% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2), 2.5em 0em 0 0em rgba(255, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.2), 0em 2.5em 0 0em rgba(255, 0, 0, 0.5), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.7), -2.6em 0em 0 0em #ff0000, -1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2);
    }

    87.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(255, 0, 0, 0.2), 2.5em 0em 0 0em rgba(255, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(255, 0, 0, 0.2), 0em 2.5em 0 0em rgba(255, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(255, 0, 0, 0.5), -2.6em 0em 0 0em rgba(255, 0, 0, 0.7), -1.8em -1.8em 0 0em #ff0000;
    }
}
.up-sell-card {
    font-family: Garibaldi-Medium, serif;
    font-size: 18px;

    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;

    min-height: 300px;
    border: 5px solid #e1c2a6;
    border-radius: 5px;

    min-width: 200px;
    
    margin: 20px;
    transition: all .4s ease;
    background: white;
    cursor: pointer;
    position: relative;
}

.up-sell-card:hover {
    box-shadow: 0 0 20px;
}