.modal-backdrop {
    opacity: 0.2 !important;
}

.input-color::-webkit-search-cancel-button {
    margin-right: 1.2rem;
    cursor: pointer;
}

.clr-open,
.clr-color {
    z-index: 2000 !important;
}

.clr-field {
    width: 100%;
}

.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    border-color: var(--inv-primary) !important;
}

.custom-loader {
    border-color: #9d9d9d #0000;
}

.text-justify {
    text-align: justify;
}

.img-item img {
    margin-top: .25rem;
    transition: transform .15s linear;
}

.img-item img:hover {
    outline: 4px dashed #ffc107;
    border-radius: 8px;
}

.img-item button {
    display: none;
}

.img-item:hover button {
    display: block;
}

.custom-dropzone .dropzone {
    border: 2px dashed #dedede;
    border-radius: 5px;
    background: #f5f5f5;
    padding: 0.5rem;
}

.custom-dropzone .dz-message {
    z-index: 999;
    padding: 5rem 1rem;
    cursor: pointer;
    transition: all .15s ease;
    color: #8898aa;
    border: 2px dashed #dee2e6;
    border-radius: 0.375rem;
    background-color: #fff;
}

.custom-dropzone .dz-message:hover {
    color: #525f7f;
    border-color: #8898aa;
}

.custom-dropzone .dropzone-item {
    transition: all ease 0.5s;
    background-color: #f5f8fa;
    border-radius: 0.65rem;
    padding: 0.5rem 1rem;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.custom-dropzone .dropzone-item:hover {
    cursor: pointer;
}

.custom-dropzone .dropzone-item .dz-filename:hover,
.custom-dropzone .dropzone-item .dz-toolbar:hover {
    color: #2dce89;
}

.custom-dropzone .dropzone-item.delete {
    transform: scale(1.05);
}

.timeline-secondary.timeline-past::after,
.timeline-secondary.timeline-current::after {
    background-color: var(--timeline-bg, #748194) !important;
    border-color: var(--timeline-bg, #748194) !important;
}

.icon-item.icon-item-xl {
    height: 3.75rem;
    width: 3.75rem;
}

.icon-item.icon-item-xxl {
    height: 5rem;
    width: 5rem;
}

.preview-box {
    width: 100%;
    height: calc(100vh - 61px);
    background: white;
    border: 1px solid #ccc;
    border-radius: 10px;
    overflow: hidden;
    transition: all 0.5s ease;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    user-select: none;
}

.preview-box.desktop {
    width: 100%;
}

.preview-box.tablet {
    width: 768px;
}

.preview-box.mobile {
    width: 375px;
}

.widget-icon-item:hover,
.widget-icon-item.active {
    cursor: pointer;
    outline: 4px dashed #ffc107;
    border-radius: 8px;
}

.widget-icon-item.text,
.widget-icon-item .text {
    text-align: center;
    margin-bottom: 0rem;
    padding: 0.7rem;
    font-weight: bold;
    font-size: 0.85rem;
}

.widget-item {
    width: 100%;
    position: relative;
    cursor: pointer;
}

.widget-item:hover {
    border: 4px dashed #ffc107;
    border-radius: 8px;
}

.widget-item.active {
    border: 4px solid #0d6efd;
    box-shadow: inset 0 0 0 3px rgba(13, 110, 253, 0.4);
}

.widget-buttons {
    position: absolute;
    width: 100%;
    bottom: 10px;
    left: 0;
    display: flex;
    justify-content: center;
    gap: 10px;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s ease;
    pointer-events: none;
}

.widget-item.active .widget-buttons {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.widget-item .widget-delete {
    position: absolute;
    top: 10px;
    right: 10px;
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none;
}

.widget-item.active .widget-delete {
    opacity: 1;
    pointer-events: auto;
}

.fade-out {
    opacity: 0;
    transform: scale(0.95);
    transition: all 0.3s ease;
}

.preview-box.background-1,
.widget-item.background-1 {
    background-image: url('../img/assets/backgrounds/background_1.webp');
}

.preview-box.background-2,
.widget-item.background-2 {
    background-image: url('../img/assets/backgrounds/background_2.webp');
}

.preview-box.background-3,
.widget-item.background-3 {
    background-image: url('../img/assets/backgrounds/background_3.webp');
}

.preview-box.background-4,
.widget-item.background-4 {
    background-image: url('../img/assets/backgrounds/background_4.webp');
}

.preview-box.background-5,
.widget-item.background-5 {
    background-image: url('../img/assets/backgrounds/background_5.jpg');
}

.preview-box.background-6,
.widget-item.background-6 {
    background-image: url('../img/assets/backgrounds/background_6.webp');
}

.preview-box.background-7,
.widget-item.background-7 {
    background-image: url('../img/assets/backgrounds/background_7.webp');
}

.preview-box.background-8,
.widget-item.background-8 {
    background-image: url('../img/assets/backgrounds/background_8.webp');
}

.preview-box.background-9,
.widget-item.background-9 {
    background-image: url('../img/assets/backgrounds/background_9.webp');
}

.preview-box.background-10,
.widget-item.background-10 {
    background-image: url('../img/assets/backgrounds/background_10.webp');
}

.preview-box.background-11,
.widget-item.background-11 {
    background-image: url('../img/assets/backgrounds/background_11.webp');
}

.preview-box.background-12,
.widget-item.background-12 {
    background-image: url('../img/assets/backgrounds/background_12.webp');
}

.preview-box.background-13,
.widget-item.background-13 {
    background-image: url('../img/assets/backgrounds/background_13.webp');
}

.preview-box.background-14,
.widget-item.background-14 {
    background-image: url('../img/assets/backgrounds/background_14.webp');
}

.preview-box.background-15,
.widget-item.background-15 {
    background-image: url('../img/assets/backgrounds/background_15.webp');
}

.preview-box.background-16,
.widget-item.background-16 {
    background-image: url('../img/assets/backgrounds/background_16.webp');
}

.preview-box.background-17,
.widget-item.background-17 {
    background-image: url('../img/assets/backgrounds/background_17.webp');
}

.preview-box.background-18,
.widget-item.background-18 {
    background-image: url('../img/assets/backgrounds/background_18.webp');
}

.preview-box.background-19,
.widget-item.background-19 {
    background-image: url('../img/assets/backgrounds/background_19.webp');
}

.preview-box.background-20,
.widget-item.background-20 {
    background-image: url('../img/assets/backgrounds/background_20.webp');
}

.preview-box.background-21,
.widget-item.background-21 {
    background-image: url('../img/assets/backgrounds/background_21.webp');
}

.preview-box.background-22,
.widget-item.background-22 {
    background-image: url('../img/assets/backgrounds/background_22.webp');
}

.preview-box.background-23,
.widget-item.background-23 {
    background-image: url('../img/assets/backgrounds/background_23.webp');
}

.preview-box.background-24,
.widget-item.background-24 {
    background-image: url('../img/assets/backgrounds/background_24.webp');
}

.preview-box.background-25,
.widget-item.background-25 {
    background-image: url('../img/assets/backgrounds/background_25.webp');
}

.preview-box.background-26,
.widget-item.background-26 {
    background-image: url('../img/assets/backgrounds/background_26.webp');
}

.preview-box.background-27,
.widget-item.background-27 {
    background-image: url('../img/assets/backgrounds/background_27.webp');
}

.preview-box.background-28,
.widget-item.background-28 {
    background-image: url('../img/assets/backgrounds/background_28.webp');
}

.preview-box.background-29,
.widget-item.background-29 {
    background-image: url('../img/assets/backgrounds/background_29.webp');
}

.preview-box.background-30,
.widget-item.background-30 {
    background-image: url('../img/assets/backgrounds/background_30.webp');
}

.preview-box.background-31,
.widget-item.background-31 {
    background-image: url('../img/assets/backgrounds/background_31.webp');
}

.preview-box.background-32,
.widget-item.background-32 {
    background-image: url('../img/assets/backgrounds/background_32.webp');
}

.preview-box.background-33,
.widget-item.background-33 {
    background-image: url('../img/assets/backgrounds/background_33.webp');
}

.preview-box.background-34,
.widget-item.background-34 {
    background-image: url('../img/assets/backgrounds/background_34.webp');
}

.preview-box.background-35,
.widget-item.background-35 {
    background-image: url('../img/assets/backgrounds/background_35.webp');
}

.preview-box.background-36,
.widget-item.background-36 {
    background-image: url('../img/assets/backgrounds/background_36.webp');
}

.preview-box.background-37,
.widget-item.background-37 {
    background-image: url('../img/assets/backgrounds/background_37.webp');
}

.preview-box.background-38,
.widget-item.background-38 {
    background-image: url('../img/assets/backgrounds/background_38.webp');
}

.preview-box.background-39,
.widget-item.background-39 {
    background-image: url('../img/assets/backgrounds/background_39.webp');
}

.preview-box.background-40,
.widget-item.background-40 {
    background-image: url('../img/assets/backgrounds/background_40.webp');
}

.preview-box.background-41,
.widget-item.background-41 {
    background-image: url('../img/assets/backgrounds/background_41.webp');
}

.preview-box.background-42,
.widget-item.background-42 {
    background-image: url('../img/assets/backgrounds/background_42.webp');
}

.preview-box.background-43,
.widget-item.background-43 {
    background-image: url('../img/assets/backgrounds/background_43.webp');
}

.preview-box.background-44,
.widget-item.background-44 {
    background-image: url('../img/assets/backgrounds/background_44.webp');
}

.preview-box.background-45,
.widget-item.background-45 {
    background-image: url('../img/assets/backgrounds/background_45.webp');
}

.preview-box.background-46,
.widget-item.background-46 {
    background-image: url('../img/assets/backgrounds/background_46.webp');
}

.preview-box.background-47,
.widget-item.background-47 {
    background-image: url('../img/assets/backgrounds/background_47.webp');
}

.preview-box.background-48,
.widget-item.background-48 {
    background-image: url('../img/assets/backgrounds/background_48.webp');
}

.preview-box.background-49,
.widget-item.background-49 {
    background-image: url('../img/assets/backgrounds/background_49.webp');
}

.preview-box.background-50,
.widget-item.background-50 {
    background-image: url('../img/assets/backgrounds/background_50.webp');
}

.preview-box.gradient-1,
.gradient-1 {
    background: -webkit-linear-gradient(90deg, #1f2c51, #1f2c51, #000000);
    background: linear-gradient(90deg, #1f2c51, #1f2c51, #000000);
}

.preview-box.gradient-2,
.gradient-2 {
    background: -webkit-linear-gradient(90deg, #d7b679, #ddd4c3, #d7b679);
    background: linear-gradient(90deg, #d7b679, #ddd4c3, #d7b679);
}

.preview-box.gradient-3,
.gradient-3 {
    background: -webkit-linear-gradient(90deg, #291d53, #4d1740, #5a1e2d);
    background: linear-gradient(90deg, #291d53, #4d1740, #5a1e2d);
}

.preview-box.gradient-4,
.gradient-4 {
    background: -webkit-linear-gradient(90deg, #ababab, #d0d0d0, #c6c6c6);
    background: linear-gradient(90deg, #ababab, #d0d0d0, #c6c6c6);
}

.preview-box.gradient-5,
.gradient-5 {
    background: -webkit-linear-gradient(90deg, #29482a, #4e8950, #9fb97f);
    background: linear-gradient(90deg, #29482a, #4e8950, #9fb97f);
}

.preview-box.gradient-6,
.gradient-6 {
    background: -webkit-linear-gradient(90deg, #6f2e0b, #953d0d, #c95c22);
    background: linear-gradient(90deg, #6f2e0b, #953d0d, #c95c22);
}

.preview-box.gradient-7,
.gradient-7 {
    background: -webkit-linear-gradient(90deg, #97b5d3, #c2ccd1, #d0d0e2);
    background: linear-gradient(90deg, #97b5d3, #c2ccd1, #d0d0e2);
}

.preview-box.gradient-8,
.gradient-8 {
    background: -webkit-linear-gradient(90deg, #1f2937, #293647, #233043);
    background: linear-gradient(90deg, #1f2937, #293647, #233043);
}

.preview-box.gradient-9,
.gradient-9 {
    background: -webkit-linear-gradient(90deg, #872518, #943020);
    background: linear-gradient(90deg, #872518, #943020);
}

.preview-box.gradient-10,
.gradient-10 {
    background: -webkit-linear-gradient(90deg, #374471, #307c9d, #5eb2b5);
    background: linear-gradient(90deg, #374471, #307c9d, #5eb2b5);
}

.preview-box.gradient-11,
.gradient-11 {
    background: -webkit-linear-gradient(90deg, #77b1ca, #41a7d2, #0096d6);
    background: linear-gradient(90deg, #77b1ca, #41a7d2, #0096d6);
}

.preview-box.gradient-12,
.gradient-12 {
    background: -webkit-linear-gradient(90deg, #ad7111, #d18c26, #f7a73a);
    background: linear-gradient(90deg, #ad7111, #d18c26, #f7a73a);
}

.preview-box.gradient-13,
.gradient-13 {
    background: -webkit-linear-gradient(90deg, #3b6156, #0d4338, #3b6156);
    background: linear-gradient(90deg, #3b6156, #0d4338, #3b6156);
}

.preview-box.gradient-14,
.gradient-14 {
    background: -webkit-linear-gradient(90deg, #7290a7, #a4dcf4);
    background: linear-gradient(90deg, #7290a7, #a4dcf4);
}

.preview-box.gradient-15,
.gradient-15 {
    background: -webkit-linear-gradient(90deg, #784b21, #935d2a, #c78a52);
    background: linear-gradient(90deg, #784b21, #935d2a, #c78a52);
}

.preview-box.gradient-16,
.gradient-16 {
    background: -webkit-linear-gradient(90deg, #bdbdbd, #dedede, #ffffff);
    background: linear-gradient(90deg, #bdbdbd, #dedede, #ffffff);
}

.preview-box.gradient-17,
.gradient-17 {
    background: -webkit-linear-gradient(90deg, #c4dfe6, #66a5ad);
    background: linear-gradient(90deg, #c4dfe6, #66a5ad);
}

.preview-box.gradient-18,
.gradient-18 {
    background: -webkit-linear-gradient(90deg, #405758, #5e787b, #405758);
    background: linear-gradient(90deg, #405758, #5e787b, #405758);
}

.preview-box.gradient-19,
.gradient-19 {
    background: -webkit-linear-gradient(132deg, #374471, #307c9d, #5eb2b5);
    background: linear-gradient(132deg, #374471, #307c9d, #5eb2b5);
}

.preview-box.gradient-20,
.gradient-20 {
    background: -webkit-linear-gradient(90deg, #222120, #312e26, #45423a);
    background: linear-gradient(90deg, #222120, #312e26, #45423a);
}

.preview-box.gradient-21,
.gradient-21 {
    background: -webkit-linear-gradient(90deg, #f5a0bd, #f7f7d9);
    background: linear-gradient(90deg, #f5a0bd, #f7f7d9);
}

.preview-box.gradient-22,
.gradient-22 {
    background: -webkit-linear-gradient(90deg, #839cf4, #bda8ea, #ddbbe2);
    background: linear-gradient(90deg, #839cf4, #bda8ea, #ddbbe2);
}

.preview-box.gradient-23,
.gradient-23 {
    background: -webkit-linear-gradient(90deg, #ffd700, #ff8c00, #ff4500);
    background: linear-gradient(90deg, #ffd700, #ff8c00, #ff4500);
}

.preview-box.gradient-24,
.gradient-24 {
    background: -webkit-linear-gradient(129deg, #84a94d, #60d69b, #21fff8);
    background: linear-gradient(129deg, #84a94d, #60d69b, #21fff8);
}

.preview-box.gradient-25,
.gradient-25 {
    background: -webkit-linear-gradient(90deg, #fff7d7, #ffcb95, #ffa489);
    background: linear-gradient(90deg, #fff7d7, #ffcb95, #ffa489);
}

.preview-box.gradient-26,
.gradient-26 {
    background: -webkit-linear-gradient(315deg, #29d6d4, #00b7e1, #0093e3, #3068cd, #77309a);
    background: linear-gradient(315deg, #29d6d4, #00b7e1, #0093e3, #3068cd, #77309a);
}

.preview-box.gradient-27,
.gradient-27 {
    background: -webkit-linear-gradient(90deg, #59bdbd, #70e0e1);
    background: linear-gradient(90deg, #59bdbd, #70e0e1);
}

.preview-box.gradient-28,
.gradient-28 {
    background: -webkit-linear-gradient(90deg, #5f655f, #a6b6a9);
    background: linear-gradient(90deg, #5f655f, #a6b6a9);
}

.preview-box.gradient-29,
.gradient-29 {
    background: -webkit-linear-gradient(90deg, #d30c22, #e52c22, #f74220);
    background: linear-gradient(90deg, #d30c22, #e52c22, #f74220);
}

.preview-box.gradient-30,
.gradient-30 {
    background: -webkit-linear-gradient(90deg, #0071e1, #002c88);
    background: linear-gradient(90deg, #0071e1, #002c88);
}

.preview-box.gradient-31,
.gradient-31 {
    background: -webkit-linear-gradient(90deg, #4159d6, #585dd9, #6b62dc);
    background: linear-gradient(90deg, #4159d6, #585dd9, #6b62dc);
}

.preview-box.gradient-32,
.gradient-32 {
    background: -webkit-linear-gradient(356deg, #ffffff, #adecff);
    background: linear-gradient(356deg, #ffffff, #adecff);
}

.preview-box.gradient-33,
.gradient-33 {
    background: -webkit-linear-gradient(90deg, #eab566, #ffc266, #ffce85);
    background: linear-gradient(90deg, #eab566, #ffc266, #ffce85);
}

.preview-box.gradient-34,
.gradient-34 {
    background: -webkit-linear-gradient(90deg, #e28c12, #e1c894, #eee2c4);
    background: linear-gradient(90deg, #e28c12, #e1c894, #eee2c4);
}

.preview-box.gradient-35,
.gradient-35 {
    background: -webkit-linear-gradient(90deg, #97b5d3, #c2ccd1, #d0d0e2);
    background: linear-gradient(90deg, #97b5d3, #c2ccd1, #d0d0e2);
}

.preview-box.gradient-36,
.gradient-36 {
    background: -webkit-linear-gradient(120deg, #75a47f, #bacd92, #fcffe0);
    background: linear-gradient(120deg, #75a47f, #bacd92, #fcffe0);
}

.preview-box.gradient-37,
.gradient-37 {
    background: -webkit-linear-gradient(139deg, #795960, #e0d2d5);
    background: linear-gradient(139deg, #795960, #e0d2d5);
}

.preview-box.gradient-38,
.gradient-38 {
    background: -webkit-linear-gradient(90deg, #753fbf, #4abfd9);
    background: linear-gradient(90deg, #753fbf, #4abfd9);
}

.preview-box.gradient-39,
.gradient-39 {
    background: -webkit-linear-gradient(90deg, #e5d2ed, #fceaff);
    background: linear-gradient(90deg, #e5d2ed, #fceaff);
}

.preview-box.gradient-40,
.gradient-40 {
    background: -webkit-linear-gradient(90deg, #cda3a8, #ffd6db, #dfa9b0);
    background: linear-gradient(90deg, #cda3a8, #ffd6db, #dfa9b0);
}

.widget-front-page.background {
    width: 100%;
    height: 90vh;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    transition: all ease-in 0.3s;
}

.widget-front-page .fp-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}

.widget-front-page .fp-content.fp-center {
    justify-content: center;
}

.front-page-1 {
    background-image: url('../img/assets/front-page/fp_1_full.webp');
    background-color: #EAE6DE;
}

.front-page-2 {
    background-image: url('../img/assets/front-page/fp_2_full.webp');
    background-color: #fff;
}

.front-page-3 {
    background-image: url('../img/assets/front-page/fp_3_full.webp');
    background-color: #445146;
}

.front-page-4 {
    background-image: url('../img/assets/front-page/fp_4_full.webp');
    background-color: #1F1E3C;
}

.front-page-5 {
    background-image: url('../img/assets/front-page/fp_5_full.webp');
    background-color: #FDF6DE;
}

.front-page-6 {
    background-image: url('../img/assets/front-page/fp_6_full.webp');
    background-color: #F4F1E9;
}

.front-page-7 {
    background-image: url('../img/assets/front-page/fp_7_full.webp');
    background-color: #070E49;
}

.front-page-8 {
    background-image: url('../img/assets/front-page/fp_8_full.webp');
    background-color: #DCEAE3;
}

.front-page-9 {
    background-image: url('../img/assets/front-page/fp_9_full.webp');
    background-color: #FFF9FE;
}

.front-page-10 {
    background-image: url('../img/assets/front-page/fp_10_full.webp');
    background-color: #C7E0EE;
}

.front-page-11 {
    background-image: url('../img/assets/front-page/fp_11_full.webp');
    background-color: #BCD9EF;
}

.front-page-12 {
    background-image: url('../img/assets/front-page/fp_12_full.webp');
    background-color: #D1E9FF;
}

.front-page-13 {
    background-image: url('../img/assets/front-page/fp_13_full.webp');
    background-color: #FAF1DF;
}

.front-page-14 {
    background-image: url('../img/assets/front-page/fp_14_full.webp');
    background-color: #B01B11;
}

.front-page-15 {
    background-image: url('../img/assets/front-page/fp_15_full.webp');
    background-color: #342642;
}

.front-page-16 {
    background-image: url('../img/assets/front-page/fp_16_full.webp');
    background-color: #F8F1C8;
}

.front-page-17 {
    background-image: url('../img/assets/front-page/fp_17_full.webp');
    background-color: #F2F2F2;
}

.front-page-18 {
    background-image: url('../img/assets/front-page/fp_18_full.webp');
    background-color: #172333;
}

.front-page-19 {
    background-image: url('../img/assets/front-page/fp_19_full.webp');
    background-color: #FFE9D5;
}

.front-page-20 {
    background-image: url('../img/assets/front-page/fp_20_full.webp');
    background-color: #361E14;
}

.front-page-21 {
    background-image: url('../img/assets/front-page/fp_21_full.webp');
    background-color: #BDD8EF;
}

.front-page-22 {
    background-image: url('../img/assets/front-page/fp_22_full.webp');
    background-color: #F2F2F2;
}

.preview-box.tablet .widget-front-page.background,
.preview-box.mobile .widget-front-page.background {
    background-size: 100% 100%;
}

.preview-box.tablet .front-page-1,
.preview-box.mobile .front-page-1 {
    background-image: url('../img/assets/front-page/fp_1.webp');
}

.preview-box.tablet .front-page-2,
.preview-box.mobile .front-page-2 {
    background-image: url('../img/assets/front-page/fp_2.webp');
}

.preview-box.tablet .front-page-3,
.preview-box.mobile .front-page-3 {
    background-image: url('../img/assets/front-page/fp_3.webp');
}

.preview-box.tablet .front-page-4,
.preview-box.mobile .front-page-4 {
    background-image: url('../img/assets/front-page/fp_4.webp');
}

.preview-box.tablet .front-page-5,
.preview-box.mobile .front-page-5 {
    background-image: url('../img/assets/front-page/fp_5.webp');
}

.preview-box.tablet .front-page-6,
.preview-box.mobile .front-page-6 {
    background-image: url('../img/assets/front-page/fp_6.webp');
}

.preview-box.tablet .front-page-7,
.preview-box.mobile .front-page-7 {
    background-image: url('../img/assets/front-page/fp_7.webp');
}

.preview-box.tablet .front-page-8,
.preview-box.mobile .front-page-8 {
    background-image: url('../img/assets/front-page/fp_8.webp');
}

.preview-box.tablet .front-page-9,
.preview-box.mobile .front-page-9 {
    background-image: url('../img/assets/front-page/fp_9.webp');
}

.preview-box.tablet .front-page-10,
.preview-box.mobile .front-page-10 {
    background-image: url('../img/assets/front-page/fp_10.webp');
}

.preview-box.tablet .front-page-11,
.preview-box.mobile .front-page-11 {
    background-image: url('../img/assets/front-page/fp_11.webp');
}

.preview-box.tablet .front-page-12,
.preview-box.mobile .front-page-12 {
    background-image: url('../img/assets/front-page/fp_12.webp');
}

.preview-box.tablet .front-page-13,
.preview-box.mobile .front-page-13 {
    background-image: url('../img/assets/front-page/fp_13.webp');
}

.preview-box.tablet .front-page-14,
.preview-box.mobile .front-page-14 {
    background-image: url('../img/assets/front-page/fp_14.webp');
}

.preview-box.tablet .front-page-15,
.preview-box.mobile .front-page-15 {
    background-image: url('../img/assets/front-page/fp_15.webp');
}

.preview-box.tablet .front-page-16,
.preview-box.mobile .front-page-16 {
    background-image: url('../img/assets/front-page/fp_16.webp');
}

.preview-box.tablet .front-page-17,
.preview-box.mobile .front-page-17 {
    background-image: url('../img/assets/front-page/fp_17.webp');
}

.preview-box.tablet .front-page-18,
.preview-box.mobile .front-page-18 {
    background-image: url('../img/assets/front-page/fp_18.webp');
}

.preview-box.tablet .front-page-19,
.preview-box.mobile .front-page-19 {
    background-image: url('../img/assets/front-page/fp_19.webp');
}

.preview-box.tablet .front-page-20,
.preview-box.mobile .front-page-20 {
    background-image: url('../img/assets/front-page/fp_20.webp');
}

.preview-box.tablet .front-page-21,
.preview-box.mobile .front-page-21 {
    background-image: url('../img/assets/front-page/fp_21.webp');
}

.preview-box.tablet .front-page-22,
.preview-box.mobile .front-page-22 {
    background-image: url('../img/assets/front-page/fp_22.webp?v=1.0.2');
}

.animation-item {
    transition: transform .15s linear;
}

.animation-item:hover {
    outline: 3px dashed #ffc107;
    cursor: pointer;
}

.gradient-item,
.color-item {
    width: 50px;
    height: 50px;
    margin: 5px;
    border-radius: .25rem !important;
    transition: transform .15s linear;
}

.gradient-item:hover,
.color-item:hover {
    transform: scale(1.25);
    cursor: pointer;
}

.gradient-item.active,
.color-item.active,
.animation-item.active {
    outline: 3px dashed #ffc107;
}

.preview-save {
    position: absolute;
    bottom: 20px;
    right: 20px;
    z-index: 100;
}

.inv-card {
    margin: 1.5rem auto 1.5rem auto;
    transition: all 0.5s ease;
}

/*========== DESKTOP ==========*/
/*.preview-box.desktop .inv-card {
    width: 50%;
}*/

/*========== TABLET ==========*/
.preview-box.tablet .inv-card {
    width: 75%;
}

/*========== MOBILE ==========*/
.preview-box.mobile .inv-card {
    width: 95%;
}

/*========== WIDGETS ==========*/

/*========== QUOTES ==========*/
.widget-quote {
    padding: 1rem 0 1rem 0;
    margin-bottom: 0;
}

.widget-quote p {
    margin-bottom: 0;
}

/*========== PICTURES ==========*/
.widget-picture {
    display: flex;
}

.preview-box.mobile .widget-picture img {
    width: 100% !important;
}

/*========== COUNTDOWN COUNTERS ==========*/
.widget-countdown-counter {
    display: flex;
    padding: 1rem 0 1rem 0;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
}

.widget-countdown-counter .countdown-item {
    display: flex;
    align-items: center;
    flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
}

.widget-countdown-counter .countdown-number {
    font-size: 2.48832rem;
}

.widget-countdown-counter .countdown-letters {
    font-size: 1.44rem;
}

.widget-countdown-counter .countdown-separator {
    padding: 0 1rem 0 1rem;
    font-size: 2.48832rem;
}

.preview-box.tablet .widget-countdown-counter .countdown-number,
.preview-box.tablet .widget-countdown-counter .countdown-separator {
    font-size: 2rem;
}

.preview-box.tablet .widget-countdown-counter .countdown-letters {
    font-size: 1.2rem;
}

/*.preview-box.mobile .widget-countdown-counter .countdown-number {
    font-size: 1.44rem !important;
}*/

.preview-box.mobile .widget-countdown-counter .countdown-separator {
    padding: 0 0.35rem 0 0.35rem;
    /*font-size: 1.44rem !important;*/
}

.preview-box.mobile .widget-countdown-counter .countdown-letters {
    font-size: 1.1rem !important;
}

/*========== TEXT ==========*/
.widget-text {
    padding: 1rem 0 1rem 0;
}

.widget-text .column-two {
    display: flex;
    flex-direction: row;
}

.widget-text .column-two p {
    width: 50%;
}

/*========== MAP ==========*/
.widget-map {
    display: flex;
    flex-direction: column;
}

.widget-map .map-iframe {
    height: 500px;
}

.preview-box.tablet .widget-map .map-iframe {
    height: 400px;
}

.preview-box.mobile .widget-map .map-iframe {
    height: 300px;
}

.preview-box.mobile .widget-map .map-title,
.preview-box.mobile .widget-map .map-place,
.preview-box.mobile .widget-map .map-iframe {
    width: 100% !important;
}

/*========== TIMELINE ==========*/
.widget-timeline {
    display: flex;
    flex-direction: column;
    padding: 1rem;
}

.widget-timeline .title {
    font-size: 1.5rem !important;
}

.widget-timeline .sub-title {
    font-size: 1.2rem !important;
}

.widget-timeline .text {
    font-size: 1rem !important;
}

.widget-timeline .time {
    font-size: 0.9rem !important;
}

.preview-box.tablet .title {
    font-size: 1.25rem !important;
}

.preview-box.tablet .widget-timeline .sub-title {
    font-size: 1.1rem !important;
}

.preview-box.mobile .widget-timeline .title,
.preview-box.mobile .widget-timeline .content {
    width: 100% !important;
}

.preview-box.mobile .title {
    font-size: 1rem !important;
}

.preview-box.mobile .widget-timeline .sub-title {
    font-size: 0.9rem !important;
}

/*========== CONFIRM ==========*/
.widget-confirm {
    padding: 1rem;
    display: flex;
}

.widget-table {
    padding: 1rem;
    display: flex;
}

.preview-box.mobile .widget-table .table {
    width: 100% !important;
}

/*========== GALLERY ==========*/
.widget-gallery {
    padding: 1rem;
    display: flex;
}

.widget-gallery .carousel-inner>.carousel-item img {
    width: 100%;
    /*height: 65vh;*/
    /*min-height: 350px;*/
    object-fit: contain;
    object-position: center;
}

.preview-box.mobile .widget-gallery img {
    width: 100% !important;
}

/*========== MUSIC ==========*/
.widget-music {
    padding: 1rem 0 1rem 0;
    display: flex;
    flex-direction: column;
}

.music-button.top-lh {
    position: fixed;
    left: 20px;
    top: 20px;
    padding: .375rem 1.25rem;
    font-size: 1.2rem;
}

.music-button.top-rh {
    position: fixed;
    right: 20px;
    top: 20px;
    padding: .375rem 1.25rem;
    font-size: 1.2rem;
}

.music-button.bottom-lh {
    position: fixed;
    left: 20px;
    bottom: 20px;
    padding: .375rem 1.25rem;
    font-size: 1.2rem;
}

.music-button.bottom-rh {
    position: fixed;
    right: 20px;
    bottom: 20px;
    padding: .375rem 1.25rem;
    font-size: 1.2rem;
}

/*========== MESA DE REGALOS ==========*/
.widget-gift {
    display: flex;
    flex-direction: column;
}

.widget-gift .gift-icon {
    width: 75%;
}

@keyframes bgMove {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

@media (min-width: 576px) {
    /* Tus estilos aquí */
}

@media (min-width: 768px) {
    /* Tus estilos aquí */
}

@media (min-width: 992px) {
    /* Tus estilos aquí */
}

@media (min-width: 1200px) {
    .preview-box.desktop .inv-card {
        width: 70%;
    }
}

@media (min-width: 1400px) {
    .preview-box.desktop .inv-card {
        width: 60%;
    }
}

/* Hasta pequeño (sm) */
@media (max-width: 575.98px) {
    .inv-card {
        margin: 1.5rem 0.5rem 1.5rem 0.5rem;
    }

    .widget-delete,
    .widget-buttons button {
        font-size: 0.8rem;
        padding: 0 8px 0 8px;
    }

    .preview-save {
        font-size: 1rem;
        padding: .3125rem 1rem;
    }

    /*.preview-box .widget-countdown-counter .countdown-number {
        font-size: 1.44rem !important;
    }*/

    .preview-box .widget-countdown-counter .countdown-separator {
        padding: 0 0.2rem 0 0.2rem;
        /*font-size: 1.44rem !important;*/
    }

    .preview-box .widget-countdown-counter .countdown-letters {
        font-size: 1rem !important;
    }

    .widget-timeline .title,
    .widget-timeline .content {
        width: 100% !important;
    }

    .widget-timeline .title {
        font-size: 1rem !important;
    }

    .widget-timeline .sub-title {
        font-size: 0.9rem !important;
    }

    .widget-picture img {
        width: 100% !important;
    }

    .widget-map .map-iframe {
        height: 300px;
    }

    .widget-map .map-title,
    .widget-map .map-place,
    .widget-map .map-iframe {
        width: 100% !important;
    }

    .widget-front-page.background {
        background-size: 100% 100%;
    }

    .widget-table .table {
        width: 100% !important;
    }

    .front-page-1 {
        background-image: url('../img/assets/front-page/fp_1.webp');
    }

    .front-page-2 {
        background-image: url('../img/assets/front-page/fp_2.webp');
    }

    .front-page-3 {
        background-image: url('../img/assets/front-page/fp_3.webp');
    }

    .front-page-4 {
        background-image: url('../img/assets/front-page/fp_4.webp');
    }

    .front-page-5 {
        background-image: url('../img/assets/front-page/fp_5.webp');
    }

    .front-page-6 {
        background-image: url('../img/assets/front-page/fp_6.webp');
    }

    .front-page-7 {
        background-image: url('../img/assets/front-page/fp_7.webp');
    }

    .front-page-8 {
        background-image: url('../img/assets/front-page/fp_8.webp');
    }

    .front-page-9 {
        background-image: url('../img/assets/front-page/fp_9.webp');
    }

    .front-page-10 {
        background-image: url('../img/assets/front-page/fp_10.webp');
    }

    .front-page-11 {
        background-image: url('../img/assets/front-page/fp_11.webp');
    }

    .front-page-12 {
        background-image: url('../img/assets/front-page/fp_12.webp');
    }

    .front-page-13 {
        background-image: url('../img/assets/front-page/fp_13.webp');
    }

    .front-page-14 {
        background-image: url('../img/assets/front-page/fp_14.webp');
    }

    .front-page-15 {
        background-image: url('../img/assets/front-page/fp_15.webp');
    }

    .front-page-16 {
        background-image: url('../img/assets/front-page/fp_16.webp');
    }

    .front-page-17 {
        background-image: url('../img/assets/front-page/fp_17.webp');
    }

    .front-page-18 {
        background-image: url('../img/assets/front-page/fp_18.webp');
    }

    .front-page-19 {
        background-image: url('../img/assets/front-page/fp_19.webp');
    }

    .front-page-20 {
        background-image: url('../img/assets/front-page/fp_20.webp');
    }

    .front-page-21 {
        background-image: url('../img/assets/front-page/fp_21.webp');
    }

    .front-page-22 {
        background-image: url('../img/assets/front-page/fp_22.webp?v=1.0.2');
    }

    .carousel {
        width: 100% !important;
    }
}

/* Hasta mediano (md) y Hasta grande (lg) */
@media (min-width: 768px) and (max-width: 991.98px) {

    .preview-box .widget-countdown-counter .countdown-number,
    .preview-box .widget-countdown-counter .countdown-separator {
        font-size: 2rem;
    }

    .preview-box .widget-countdown-counter .countdown-letters {
        font-size: 1.2rem;
    }

    .widget-timeline .title {
        font-size: 1.25rem !important;
    }

    .widget-timeline .sub-title {
        font-size: 1.1rem !important;
    }

    .widget-map .map-iframe {
        height: 400px;
    }

    .widget-front-page.background {
        background-size: 100% 100%;
    }

    .front-page-1 {
        background-image: url('../img/assets/front-page/fp_1.webp');
    }

    .front-page-2 {
        background-image: url('../img/assets/front-page/fp_2.webp');
    }

    .front-page-3 {
        background-image: url('../img/assets/front-page/fp_3.webp');
    }

    .front-page-4 {
        background-image: url('../img/assets/front-page/fp_4.webp');
    }

    .front-page-5 {
        background-image: url('../img/assets/front-page/fp_5.webp');
    }

    .front-page-6 {
        background-image: url('../img/assets/front-page/fp_6.webp');
    }

    .front-page-7 {
        background-image: url('../img/assets/front-page/fp_7.webp');
    }

    .front-page-8 {
        background-image: url('../img/assets/front-page/fp_8.webp');
    }

    .front-page-9 {
        background-image: url('../img/assets/front-page/fp_9.webp');
    }

    .front-page-10 {
        background-image: url('../img/assets/front-page/fp_10.webp');
    }

    .front-page-11 {
        background-image: url('../img/assets/front-page/fp_11.webp');
    }

    .front-page-12 {
        background-image: url('../img/assets/front-page/fp_12.webp');
    }

    .front-page-13 {
        background-image: url('../img/assets/front-page/fp_13.webp');
    }

    .front-page-14 {
        background-image: url('../img/assets/front-page/fp_14.webp');
    }

    .front-page-15 {
        background-image: url('../img/assets/front-page/fp_15.webp');
    }

    .front-page-16 {
        background-image: url('../img/assets/front-page/fp_16.webp');
    }

    .front-page-17 {
        background-image: url('../img/assets/front-page/fp_17.webp');
    }

    .front-page-18 {
        background-image: url('../img/assets/front-page/fp_18.webp');
    }

    .front-page-19 {
        background-image: url('../img/assets/front-page/fp_19.webp');
    }

    .front-page-20 {
        background-image: url('../img/assets/front-page/fp_20.webp');
    }

    .front-page-21 {
        background-image: url('../img/assets/front-page/fp_21.webp');
    }

    .front-page-22 {
        background-image: url('../img/assets/front-page/fp_22.webp?v=1.0.2');
    }
}

/* Hasta extra grande (xl) */
@media (max-width: 1199.98px) {}

/* Hasta extra extra grande (xxl) */
@media (max-width: 1399.98px) {}