@media (min-width: 501px) {
    #mobile{
        display: none;
    }

    #desktop{
        display: block;
    }
    
    .vector-2-stroke {
    width: 8px;
    position: relative;
    height: 14px;
    object-fit: contain;
    }
    .septembre-2024 {
        position: absolute;
        top: 0px;
        left: 0px;
        letter-spacing: -0.01em;
        line-height: 24px;
        font-weight: 600;
    }
    .septembre-2024-wrapper {
        position: absolute;
        top: 1px;
        left: 0px;
        width: 152px;
        height: 24px;
    }
    .product-title {
        position: absolute;
        top: 0px;
        left: 24px;
        letter-spacing: -0.01em;
        line-height: 24px;
        backdrop-filter: blur(10px);
    }
    .clock-icon {
        position: absolute;
        top: 2px;
        left: 0px;
        width: 20px;
        height: 20px;
    }
    .product-title-parent {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 110px;
        height: 24px;
    }
    .group-wrapper {
        position: absolute;
        top: 1.5px;
        left: 184px;
        width: 110px;
        height: 24px;
        font-size: 14px;
    }
    .group-child {
        position: absolute;
        top: 0px;
        left: 311px;
        width: 27px;
        height: 27px;
    }
    .group-parent {
        width: 338px;
        position: relative;
        height: 27px;
    }
    .date-heure-dtail {
        position: absolute;
        height: 89.84%;
        width: 57.62%;
        top: 5.1%;
        right: 42.38%;
        bottom: 5.06%;
        left: 0%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap;
        align-content: center;
        gap: 10px 29px;
    }
    .group-item {
        position: absolute;
        height: 100%;
        width: 54.11%;
        top: 0%;
        right: 0%;
        bottom: 0%;
        left: 45.89%;
        max-width: 100%;
        overflow: hidden;
        max-height: 100%;
    }
    .powered-by {
        position: absolute;
        height: 69.14%;
        width: 42.89%;
        top: 15.63%;
        left: 0%;
        letter-spacing: -0.01em;
        line-height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .group-container {
        position: absolute;
        height: 100%;
        width: 30.73%;
        top: 0%;
        right: 0%;
        bottom: 0%;
        left: 69.27%;
        text-align: center;
        font-size: 14px;
        color: #959595;
    }
    .component-2 {
        width: 652.5px;
        position: relative;
        height: 25.6px;
    }
    .group-inner {
        position: absolute;
        top: 0px;
        left: 0px;
        border-radius: 4px;
        width: 292px;
        height: 210.7px;
        object-fit: cover;
    }
    .rectangle-icon {
        position: absolute;
        top: 224.35px;
        left: 0px;
        border-radius: 4px;
        width: 66.8px;
        height: 48.8px;
        object-fit: cover;
    }
    .group-child1 {
        position: absolute;
        top: 224.35px;
        left: 149.85px;
        border-radius: 4px;
        width: 66.8px;
        height: 48px;
        object-fit: cover;
    }
    .group-child2 {
        position: absolute;
        top: 224.35px;
        left: 225.21px;
        border-radius: 4px;
        width: 66.8px;
        height: 48px;
        object-fit: cover;
    }
    .group-child3 {
        position: absolute;
        top: 224.35px;
        left: 75.35px;
        border-radius: 4px;
        width: 66.8px;
        height: 48px;
        object-fit: cover;
    }
    .rectangle-parent {
        align-self: stretch;
        position: relative;
        height: 273.2px;
    }
    .images-slider {
        width: 326px;
        background-color: #f6f6f6;
        overflow: hidden;
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 17px;
        box-sizing: border-box;
    }
    .titre-de-lvnement {
        margin: 0;
    }
    .titre-de-lvnement-container1 {
        width: 100%;
    }
    .titre-de-lvnement-container {
        position: absolute;
        top: 0px;
        left: 0px;
        line-height: 30px;
        font-weight: 600;
        display: flex;
        align-items: center;
        width: 284px;
    }
    .karaok {
        color: #59b090;
    }
    .soire {
        position: absolute;
        top: 10px;
        left: 0px;
        letter-spacing: -0.01em;
        line-height: 24px;
    }
    .karaok1 {
        position: absolute;
        top: 0px;
        left: 68px;
        letter-spacing: -0.01em;
        line-height: 24px;
        color: #59b090;
    }
    .group-frame {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 24px;
    }
    .pop {
        position: relative;
        font-weight: 600;
    }
    .pop-wrapper {
        border: 1px solid #59b090;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 5px 15px;
        width: auto;
        margin-right: 5px;
        margin-top: 5px;
    }
    .rock-wrapper {
        position: absolute;
        top: 0px;
        left: 54px;
        border: 1px solid #59b090;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 5px 15px;
    }
    .s-wrapper {
        position: absolute;
        top: 0px;
        left: 113px;
        border: 1px solid #59b090;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 5px 15px;
    }
    .s-container {
        position: absolute;
        top: 0px;
        left: 169px;
        border: 1px solid #59b090;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 5px 15px;
    }
    .frame-parent {
        position: absolute;
        top: 36px;
        left: 0px;
        width: 220px;
        height: 22px;
        font-size: 10px;
        color: #000;
        display: flex;
        flex-wrap: wrap;
    }
    .group-div {
        position: absolute;
        top: 83px;
        left: 0px;
        width: 220px;
        height: 58px;
        font-size: 14px;
        color: #959595;
    }
    .titre-de-lvnement-ligne-1-t-parent {
        width: 284px;
        position: relative;
        height: 141px;
    }
    .span {
        font-weight: 600;
    }
    .product-title1 {
        position: absolute;
        top: 0px;
        left: 0px;
        backdrop-filter: blur(10px);
    }
    .product-title2 {
        position: absolute;
        top: 5px;
        left: 34px;
        font-size: 14px;
        letter-spacing: -0.01em;
        line-height: 24px;
        backdrop-filter: blur(10px);
    }
    .product-title-group {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 87px;
        height: 29px;
    }
    .group-wrapper1 {
        position: absolute;
        top: 24px;
        left: 31px;
        width: 87px;
        height: 29px;
    }
    .group-child4 {
        position: relative;
        width: 0px;
        height: 0px;
    }
    .group-parent2 {
        width: 118px;
        position: relative;
        height: 53px;
    }
    .product-title3 {
        position: relative;
        letter-spacing: -0.01em;
        line-height: 24px;
        font-weight: 600;
        backdrop-filter: blur(10px);
        text-decoration: none;
        color: white;
    }
    .product-title-wrapper {
        align-self: stretch;
        background-color: #59b090;
        height: 38px;
        overflow: hidden;
        flex-shrink: 0;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 7px 50px;
        box-sizing: border-box;
        font-size: 16px;
        color: #fff;
    }
    .group-parent1 {
        position: absolute;
        top: 0.5px;
        left: 97px;
        width: 191px;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        justify-content: flex-start;
        gap: 6px;
    }
    .frame-wrapper {
        width: 288px;
        position: relative;
        height: 97px;
    }
    .frame-div {
        width: 321px;
        background-color: #f6f6f6;
        height: 305px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        align-content: center;
        padding: 17px 15px;
        box-sizing: border-box;
        gap: 30px;
    }
    .dtail-card {
        height: 307.2px;
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        justify-content: flex-start;
    }
    .images-slider-parent {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        justify-content: center;
        gap: 25px;
        font-size: 20px;
    }
    .purchase-now {
        flex: 1;
        position: relative;
        letter-spacing: -0.01em;
        line-height: 24px;
        backdrop-filter: blur(10px);
    }
    .bloc-texte {
        width: 665px;
        background-color: #f6f6f6;
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        justify-content: center;
        flex-wrap: wrap;
        align-content: flex-start;
        padding: 17px;
        box-sizing: border-box;
        font-size: 14px;
    }
    .property-1default {
        position: relative;
        border-radius: 8px;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 19px;
        box-sizing: border-box;
        gap: 25px;
        background-image: url('Property 1=Default.png');
        background-size: cover;
        background-repeat: no-repeat;
        background-position: top;
        text-align: left;
        font-size: 16px;
        color: #000;
        font-family: Inter;
    }
}



@media (max-width: 500px) {
    #mobile{
        display: block;
    }

    #desktop{
        display: none;
    }

    .vector-2-stroke {
        position: absolute;
        height: 54.69%;
        width: 2.74%;
        top: 22.68%;
        right: 97.26%;
        bottom: 22.64%;
        left: 0%;
        max-width: 100%;
        overflow: hidden;
        max-height: 100%;
        object-fit: contain;
  }
  .groupe-5-icon {
        position: absolute;
        height: 100%;
        width: 55.78%;
        top: 0%;
        right: 0%;
        bottom: 0%;
        left: 44.22%;
        max-width: 100%;
        overflow: hidden;
        max-height: 100%;
  }
  .powered-by {
        position: absolute;
        width: 100%;
        top: 0%;
        left: 0%;
        letter-spacing: -0.01em;
        line-height: 24px;
        white-space: pre-wrap;
        display: flex;
        align-items: center;
        justify-content: center;
  }
  .powered-by-wrapper {
        position: absolute;
        height: 93.75%;
        width: 44.22%;
        top: 0%;
        right: 55.78%;
        bottom: 6.25%;
        left: 0%;
  }
  .groupe-5-parent {
        position: absolute;
        height: 100%;
        width: 66.61%;
        top: 0%;
        right: 0%;
        bottom: 0%;
        left: 33.39%;
  }
  .component-4 {
        width: 292px;
        position: relative;
        height: 25.6px;
        text-align: center;
        color: #959595;
  }
  .septembre-2024 {
        position: absolute;
        top: 0px;
        left: 0px;
        letter-spacing: -0.01em;
        line-height: 24px;
        font-weight: 600;
        display: flex;
        align-items: center;
        width: 194px;
  }
  .septembre-2024-wrapper {
        width: 194px;
        position: relative;
        height: 24px;
  }
  .frame-child {
        width: 10.8px;
        position: relative;
        height: 16.7px;
  }
  .product-title {
        position: absolute;
        top: 0px;
        left: 0px;
        letter-spacing: -0.01em;
        line-height: 24px;
        backdrop-filter: blur(10px);
  }
  .product-title-wrapper {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 86px;
        height: 24px;
  }
  .group-wrapper {
        width: 86px;
        position: relative;
        height: 24px;
  }
  .frame-item {
        width: 27px;
        position: relative;
        height: 27px;
  }
  .group-container {
        position: absolute;
        top: 0px;
        left: 0px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 9px;
  }
  .frame-container {
        width: 141.8px;
        position: relative;
        height: 27px;
        font-size: 14px;
  }
  .group-parent {
        width: 194px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 8px;
        font-size: 16px;
  }
  .titre-de-lvnement {
        position: absolute;
        top: 0px;
        left: 0px;
        line-height: 30px;
        font-weight: 600;
        display: flex;
        align-items: center;
        width: 292px;
        height: 64px;
  }
  .karaok {
        color: #59b090;
  }
  .soire-karaok-txt-container {
        width: 100%;
  }
  .soire-karaok {
        width: 165px;
        position: relative;
        letter-spacing: -0.01em;
        line-height: 24px;
        font-weight: 600;
        display: flex;
        align-items: center;
        flex-shrink: 0;
  }
  .soire-karaok-wrapper {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 164.9px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
  }
  .group-div {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 164.9px;
        height: 24px;
  }
  .group-frame {
        position: absolute;
        top: 66px;
        left: 0px;
        width: 164.9px;
        height: 24px;
        font-size: 16px;
        color: #959595;
  }
  .pop {
        position: relative;
        letter-spacing: -0.01em;
        line-height: 24px;
        font-weight: 600;
  }
  .pop-wrapper {
        border: 1px solid #59b090;
        box-sizing: border-box;
        height: 24.5px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 5px 15px;
  }
  .rock-wrapper {
        width: 67px;
        border: 1px solid #59b090;
        box-sizing: border-box;
        height: 24.5px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 5px 15px;
  }
  .s-wrapper {
        width: 63.3px;
        border: 1px solid #59b090;
        box-sizing: border-box;
        height: 24.5px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 5px 15px;
  }
  .frame-parent {
        position: absolute;
        top: 102px;
        left: 0px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 6px;
        font-size: 12px;
        flex-wrap: wrap;
  }
  .titre-de-lvnement-ligne-1-t-parent {
        align-self: stretch;
        position: relative;
        height: 156.5px;
        font-size: 20px;
  }
  .component-4-parent {
        align-self: stretch;
        height: 278.1px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 19px;
  }
  .frame-wrapper {
        background-color: #f6f6f6;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 17px;
  }
  .group-child {
        position: absolute;
        top: 0px;
        left: 0px;
        border-radius: 4px;
        width: 292px;
        height: 210.7px;
        object-fit: cover;
  }
  .group-item {
        position: absolute;
        top: 224.35px;
        left: 0px;
        border-radius: 4px;
        width: 66.8px;
        height: 48.8px;
        object-fit: cover;
  }
  .group-inner {
        position: absolute;
        top: 224.35px;
        left: 149.85px;
        border-radius: 4px;
        width: 66.8px;
        height: 48px;
        object-fit: cover;
  }
  .rectangle-icon {
        position: absolute;
        top: 224.35px;
        left: 225.21px;
        border-radius: 4px;
        width: 66.8px;
        height: 48px;
        object-fit: cover;
  }
  .group-child1 {
        position: absolute;
        top: 224.35px;
        left: 75.35px;
        border-radius: 4px;
        width: 66.8px;
        height: 48px;
        object-fit: cover;
  }
  .rectangle-parent {
        align-self: stretch;
        position: relative;
        height: 273.2px;
  }
  .images-slider {
        width: 326px;
        background-color: #f6f6f6;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 17px;
        box-sizing: border-box;
  }
  .instance-parent {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 25px;
  }
  .prpare-toi-pour-une {
        margin: 0;
  }
  .purchase-now {
        flex: 1;
        position: relative;
        letter-spacing: -0.01em;
        line-height: 24px;
        backdrop-filter: blur(10px);
  }
  .bloc-texte {
        width: 322px;
        background-color: #f6f6f6;
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        justify-content: center;
        flex-wrap: wrap;
        align-content: flex-start;
        padding: 17px;
        box-sizing: border-box;
  }
  .product-title1 {
        position: relative;
        font-size: 40px;
        letter-spacing: -0.01em;
        line-height: 24px;
        font-weight: 600;
        backdrop-filter: blur(10px);
  }
  .product-title2 {
        position: relative;
        font-weight: 600;
        backdrop-filter: blur(10px);
  }
  .product-title-container {
        position: absolute;
        top: 0px;
        left: 0px;
        background-color: #59b090;
        width: 322px;
        height: 68.1px;
        overflow: hidden;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 7px 50px;
        box-sizing: border-box;
  }
  .frame-wrapper1 {
        width: 322px;
        position: relative;
        height: 68.1px;
  }
  .property-1variant2-inner {
        width: 322px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        font-size: 24px;
        color: #fff;
  }
  .property-1variant2 {
        position: relative;
        border-radius: 8px;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 19px;
        box-sizing: border-box;
        gap: 25px;
        background-image: url('Property 1=Variant2.png');
        background-size: cover;
        background-repeat: no-repeat;
        background-position: top;
        text-align: left;
        font-size: 14px;
        color: #000;
        font-family: Inter;
  }
  
  
}


/* Global: applique la police à tout le contenu */
body.type1 * {
    font-family: 'Inter', sans-serif !important;
}

body.type2 * {
    font-family: 'Oswald', sans-serif !important;
}

body.type3 * {
    font-family: 'Martian Mono', monospace !important;
}

body.type4 * {
    font-family: 'Righteous', cursive !important;
}

body.type5 * {
    font-family: 'Aldrich', sans-serif !important;
}

body.type6 * {
    font-family: 'Merriweather', serif !important;
}

body.type7 * {
    font-family: 'Playfair Display', serif !important;
}

body.type8 * {
    font-family: 'Crimson Pro', serif !important;
}

body.type9 * {
    font-family: 'Pirata One', cursive !important;
}

body.type10 * {
    font-family: 'Permanent Marker', cursive !important;
}

body.type11 * {
    font-family: 'Kaushan Script', cursive !important;
}

body.type12 * {
    font-family: 'Balsamiq Sans', cursive !important;
}

body.type13 * {
    font-family: 'Alkatra', cursive !important;
}

body.type14 * {
    font-family: 'New Rocker', cursive !important;
}

body.type15 * {
    font-family: 'Concert One', cursive !important;
}