/*BEG - INDEX PAGE*/
@media (max-width:1024px) { /* minimum at 320px - smartphones, iPhone, portrait 480x320 phones */
    #index {
        background-color: #F1FAFF !important;
    }
    #index .container {
        height: 100vh;
        display: flex;
        min-height: 100vh;
        flex-direction: column;
        justify-content: center;
    }
    #index .content {
        display: flex;
        gap: 16px;
        height: 100%;
        flex-direction: column;
        align-items: stretch;
        position: relative;
        margin: 0px 20px 20px 20px;
        justify-content: center;
    }
    #index .content .wrapper {
        display: flex;
        gap: 30px;
        align-items: center;
        padding: 5%;
        background-color: white;
        border-radius: 10px;
        justify-content: center;
        height: 100%;
        border-top: 2px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
        border-right: 2px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
        border-bottom: 8px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
        border-left: 2px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
    }
    #index .content .wrapper h2 {
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        text-align: center;
        font-family: 'Alpino-Regular';
        letter-spacing: -1px;
        line-height: 90%;
    }
    #index .red {
        border-top: 2px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
        border-right: 2px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
        border-bottom: 8px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
        border-left: 2px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
    }
    #index .container h1 {
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        text-align: center;
        font-family: 'Alpino-Regular';
        line-height: 105%; /* 73.5px */
        letter-spacing: -1px;
        padding: 25px;
    }
    #index .content img {
        max-height: 200px;
    }

}
@media (min-width:1024px) { /* minimum at 320px - smartphones, iPhone, portrait 480x320 phones */
    #index {
        background-color: #F1FAFF !important;
    }
    #index .container {
        height: 100vh;
        display: flex;
        min-height: 100vh;
        flex-direction: column;
        justify-content: center;
    }
    #index .content {
        display: flex;
        gap: 16px;
        flex-direction: row;
        align-items: stretch;
        position: relative;
        margin: 0px 20px 20px 20px;
        justify-content: center;
    }
    #index .content .wrapper {
        display: flex;
        flex-direction: column;
        gap: 30px;
        align-items: center;
        justify-content: center;
        padding: 5%;
        background-color: white;
        border-radius: 10px;
        width: 25%;
        height: 70%;
        border-top: 2px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
        border-right: 2px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
        border-bottom: 6px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
        border-left: 2px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
        transition: all ease-out .2s;
    }
    #index .content .wrapper:hover {
        border-top: 6px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
        border-right: 2px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
        border-bottom: 2px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
        border-left: 2px solid var(--Main-Colors-Bleu-Deskiz, #02D8E9);
    }
    #index .content .wrapper h2 {
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        text-align: center;
        font-family: 'Alpino-Regular';
        letter-spacing: -1px;
        line-height: 90%;;
    }
    #index .red {
        transition: all ease-out .2s;
        border-top: 2px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
        border-right: 2px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
        border-bottom: 6px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
        border-left: 2px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
    }
    #index .red:hover {
        transition: all ease-out .2s;
        border-top: 6px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
        border-right: 2px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
        border-bottom: 2px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
        border-left: 2px solid var(--Main-Colors-Rouge-Deskiz, #FF474C) !important;
    }
    #index .container h1 {
        color: var(--Foundation-Dark-Blue-Normal, #042E4C);
        text-align: center;
        font-family: 'Alpino-Regular';
        line-height: 105%; /* 73.5px */
        letter-spacing: -1px;
        padding: 25px;
    }
    #index .content img {
        max-height: 300px;
    }

}
/*END - INDEX PAGE*/

/**/

/*BEG - HOMEPAGE*/
@media (min-width:1px) { /*Phones*/

    /*-----------------------------*/
    /*-----COMPONENTS HOMEPAGE-----*/
    /*-----------------------------*/

    /*==> Container de la page d'accueil*/
    #homepage .container {
        padding: 6.4%;
    }

    /*==> Div avec Titre, texte + bouton*/
    #homepage .compo_title_para_cta {
        display: flex;
        padding: 6.4%;
        align-items: flex-start;
        gap: 15px;
        flex: 1 0 0;
        width: 50%;
        flex-direction: column;
        background: var(--Foundation-Red-Light, #FFEDED);
        justify-content: center;
        border-left: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F);
    }
    #homepage .compo_title_para_cta h2 {
        color: var(--Foundation-Red-Darker, #59191B);
        -webkit-text-stroke-width: 0.5;
        -webkit-text-stroke-color: var(--Foundation-Red-Darker, #59191B);
        font-family: 'Eskool';
        font-weight: 100;
        line-height: 105%; /* 71.158px */
        letter-spacing: -2.033px;
    }
    #homepage .compo_title_para_cta p {
        color: var(--Foundation-Red-Darker, #59191B);
        font-family: 'Alpino-Regular';
        line-height: normal;
        letter-spacing: -0.209px;
        margin-block-end: .5em;
    }
    #homepage .compo_title_para_cta a {
        display: flex;
        padding: 15px 35px 15px 35px;
        justify-content: center;
        align-items: center;
        gap: 15px;
        border-radius: 9px;
        border-top: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-right: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-bottom: 6.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-left: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        background: var(--Main-Colors-Blanc-Deskiz, #FFF);
        color: var(--Foundation-Red-Darker, #59191B);
        text-align: center;
        font-family: 'Alpino-Bold';
        letter-spacing: -0.25px;
        text-decoration: none;
        transition: all ease .1s;
    }
    #homepage .compo_title_para_cta a:active {
        border-top: 6.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-right: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-bottom: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-left: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
    }

    /*==> Div avec Titre, texte + bouton (no styling mother div)*/
    #homepage .compo_title_para_cta_no_styling {
        display: flex;
        align-items: flex-start;
        gap: 15px;
        flex: 1 0 0;
        flex-direction: column;
        justify-content: center;
    }
    #homepage .compo_title_para_cta_no_styling h2 {
        color: var(--Foundation-Red-Darker, #59191B);
        -webkit-text-stroke-width: 0.5;
        -webkit-text-stroke-color: var(--Foundation-Red-Darker, #59191B);
        font-family: 'Eskool';
        font-weight: 100;
        line-height: 105%; /* 71.158px */
        letter-spacing: -2.033px;
    }
    #homepage .compo_title_para_cta_no_styling p {
        color: var(--Foundation-Red-Darker, #59191B);
        font-family: 'Alpino-Regular';
        line-height: normal;
        letter-spacing: -0.209px;
        margin-block-end: .5em;
    }
    #homepage .compo_title_para_cta_no_styling a {
        display: flex;
        padding: 15px 35px 15px 35px;
        justify-content: center;
        align-items: center;
        gap: 15px;
        border-radius: 9px;
        border-top: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-right: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-bottom: 6.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-left: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        background: var(--Main-Colors-Blanc-Deskiz, #FFF);
        color: var(--Foundation-Red-Darker, #59191B);
        text-align: center;
        font-family: 'Alpino-Bold';
        letter-spacing: -0.259px;
        text-decoration: none;
    }
    #homepage .compo_title_para_cta_no_styling a:hover {
        border-top: 6.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-right: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-bottom: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-left: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
    }
    #homepage .compo_title_para_cta_no_styling a:active {
        border-top: 6.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-right: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-bottom: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-left: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
    }

    /*==> Div avec Titre + texte (no styling mother div)*/
    #homepage .compo_title_para {
        display: flex;
        flex-direction: column;
        text-align: center;
        gap: 45px;
        align-items: center;
    }
    #homepage .compo_title_para h2 {
        color: var(--Main-Colors-Black-Deskiz, #181A1F);
        font-family: 'Eskool';
        font-weight: 100;
        line-height: 105%; /* 71.158px */
        letter-spacing: -2.033px;
        margin-block-end: -30px;
        margin-block-start: 0.1em;
    }
    #homepage .compo_title_para p {
        color: var(--Main-Colors-Black-Deskiz, #181A1F);
        text-align: center;
        font-family: 'Alpino-Regular';
        letter-spacing: -0.209px;
        max-width: 666px;
    }


    /*-------------------------------*/
    /*-----BASIS CONTENT STYLING-----*/
    /*-------------------------------*/

    /*Page*/
    #homepage {
        background-color: #F1FAFF !important;
        margin: 16px;
    }
    #homepage .giga_container {
        gap: 16px;
        display: flex;
        flex-direction: column;
    }

    /*Header*/
    #homepage #header_hp_b2b {
        border-radius: 15px;
        border: 1px solid var(--foundation-dark-blue-dark-active, #021522);
        background: var(--Foundation-Dark-Blue-Normal, #042E4C);
        width: 100%;
        margin: 0;
        overflow: hidden;
        position: relative;
    }
    #homepage #header_hp_b2b .filigrane {
        position: absolute;
        top: -395px;
        left: -203px;
        width: 3500px;
        height: auto;
        z-index: 0;
        opacity: 0.15;
        mix-blend-mode: overlay;
    }
    #homepage #header_hp_b2b .container {
        position: relative;
        z-index: 1;
    }
    #homepage #header_hp_b2b .item.item-1 h1 {
        color: var(--main-colors-blanc-deskiz, #FFF);
        font-family: 'Eskool';
        font-weight: 100;
        max-width: 1150px;
        line-height: 100%;
        letter-spacing: -1.55px;
        position: relative;
        z-index: 2;
        margin-block-end: 0.75em;
        font-size: 3rem;
        margin-top: 0;
    }
    #homepage #header_hp_b2b span::before {
        background-color: var(--main-colorsrouge-deskiz);
        content: "";
        position: absolute;
        width: 339px;
        height: 52px;
        left: -5px;
        bottom: -8px;
        z-index: -1;
    }
    #homepage #header_hp_b2b .container .item.item-1 .wrapper {
        padding-right: 0% !important;
    }
    #homepage #header_hp_b2b .form_connexion {
        padding: 29px 22px 26px 22px;
        background-color: var(--main-colorsblanc-deskiz, rgba(255, 255, 255, 1));
        border-radius: 5px;
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_connexion form {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_connexion label {
        color: var(--main-colorsbleu-fonc-deskiz);
        font-family: 'Alpino-Bold';
        font-size: 1.25em;
        letter-spacing: -0.2px;
        margin-bottom: -5px;
        line-height: normal;
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_connexion input {
        border-radius: 3.6px;
        border: 1px solid var(--secondary-colors-bleu-cass-deskiz, #64879C);
        background: var(--secondary-colors-bleu-blanc-deskiz, #F1FAFF);
        display: flex;
        padding: 16px;
        width: auto;
        color: var(--secondary-colors-bleu-cass-deskiz, #64879C);
        font-family: 'Alpino-Regular';
        font-size: calc(1.125em + 0.125vw);
        font-style: normal;
        line-height: 105%;
        letter-spacing: -0.72px;
        margin-top: -16px;
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_connexion input:focus {
        border: 1px solid var(--main-colorsjaune-deskiz, rgba(255, 201, 1, 1)) !important;
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_connexion a {
        text-decoration: none;
        display: flex;
        align-items: center;
        justify-content: center;
        padding-top: 10px;
        padding-bottom: 10px;
        margin-top: 5px;
        margin-bottom: -5px;
        gap: 10px;
        width: 100%;
        height: 1.7em;
        color: var(--main-colors-bleu-fonc-deskiz, #032B44);
        font-family: 'Alpino-Bold';
        font-size: calc(1.125em + 0.125vw);
        line-height: normal;
        letter-spacing: -0.2px;
        border-radius: 3.6px;
        border-top: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-right: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-bottom: 3.5px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-left: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        background: var(--main-colors-jaune-deskiz, #FDC800);
        transition: all 0.15s linear;
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_connexion a:active {
        border-top: 3.5px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-right: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-bottom: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-left: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_connexion img {
        width: 16.8px;
        height: 16.778px;
    }
    #homepage #header_hp_b2b .container .item.item-1 .separator {
        display: flex;
        padding: 25px 5%;
        justify-content: center;
        align-items: center;
        gap: 15px;
    }
    #homepage #header_hp_b2b .container .item.item-1 .separator div {
        background: var(--main-colors-blanc-deskiz, #FFF);
        display: flex;
        height: 1px;
        flex-direction: column;
        align-items: flex-start;
        flex: 1 0 0;
    }
    #homepage #header_hp_b2b .container .item.item-1 .separator p {
        color: var(--main-colors-blanc-deskiz, #FFF);
        text-align: center;
        font-family: 'Eskool';
        font-weight: 100;
        font-size: 20px;
        font-style: normal;
        line-height: 90%;
    }
    #homepage #header_hp_b2b .container .item.item-1 .alternatives_connexion {
        background: var(--secondary-colors-bleu-blanc-deskiz, #F1FAFF);
        justify-content: space-between;
        align-items: center;
        display: flex;
        border-radius: 5px;
        gap: 10px;
        padding: 12px 18px;
    }
    #homepage #header_hp_b2b .container .item.item-1 .alternatives_connexion p {
        line-height: normal;
        font-family: 'Alpino-Bold';
    }
    #homepage #header_hp_b2b .container .item.item-1 .alternatives_connexion .socials_icon {
        display: flex;
        align-items: flex-end;
        justify-content: center;
        gap: 12px;
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_inscription {
        background: var(--secondary-colors-bleu-blanc-deskiz, #F1FAFF);
        justify-content: space-between;
        align-items: center;
        display: flex;
        border-radius: 5px;
        gap: 10px;
        padding: 12px 18px;
        margin-top: 12px;
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_inscription p {
        line-height: normal;
        font-family: 'Alpino-Bold';
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_inscription .button_inscription {
        flex-direction: row;
        gap: 7px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5em;
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_inscription .button_inscription a {
        display: flex;
        padding: 4.797px 22.785px;
        justify-content: center;
        align-items: center;
        align-self: stretch;
        border-radius: 35px;
        border-top: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-right: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-bottom: 3.5px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-left: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        background: var(--main-colors-jaune-deskiz, #FDC800);
        color: var(--main-colors-bleu-fonc-deskiz, #032B44);
        font-family: 'Alpino-Bold';
        font-size: 20px;
        font-style: normal;
        line-height: normal;
        letter-spacing: -0.2px;
        text-decoration: none;
        transition: all 0.15s linear;
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_inscription .button_inscription a:active {
        border-top: 3.5px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-right: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-bottom: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-left: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
    }
    #homepage #header_hp_b2b .item.item-2 {
        display: none;
    }

    /*--------------------------*/
    /*-----Partie Entrepriz-----*/
    /*--------------------------*/
    #homepage #page_entrepriz {
        border-radius: 15px;
        border: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F);
        background: var(--Foundation-Blue-Light, #E6FBFD);
    }
    #homepage #page_entrepriz .container{
        display: flex;
        align-items: flex-start;
        gap: 10px;
        align-self: stretch;
        overflow: hidden;
        flex-direction: column;
    }
    #homepage #page_entrepriz .container h2{
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }
    #homepage #page_entrepriz .container p{
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }
    #homepage #page_entrepriz .container a{
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-top: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 6.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        background: var(--Main-Colors-Blanc-Deskiz, #FFF);
        transition: all ease .1s;
    }
    #homepage #page_entrepriz .container a:active{
        border-top: 6.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }
    #homepage #page_entrepriz .label {
        display: flex;
        padding: 0px 5px;
        align-items: flex-end;
        align-self: stretch;
    }
    #homepage #page_entrepriz .label img{
        height: 17px;
        width: 17px;
    }
    #homepage #page_entrepriz .label_category {
        display: flex;
        padding: 7px 13px;
        justify-content: flex-end;
        align-items: center;
        border-radius: 5px 5px 0px 0px;
        background: var(--Main-Colors-Jaune-Deskiz, #FFC901);
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        text-align: center;
        font-family: 'Alpino-Bold';
        font-style: normal;
        line-height: 105%; /* 23.1px */
        letter-spacing: -0.66px;
    }
    #homepage #page_entrepriz .container .carousel_wrapper {
        display: flex;
        gap: 1em;
    }
    #homepage #page_entrepriz .card {
        margin-block-start: 3em;
    }
    #homepage #page_entrepriz .card .detail {
        display: flex;
        width: 400px;
        padding-bottom: 35px;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        border-radius: 10px;
        border-top: 1.3px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-right: 1.3px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-bottom: 6.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-left: 1.3px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        background: var(--Main-Colors-Blanc-Deskiz, #FFF);
        overflow: hidden;
        box-shadow: 0px 20px 22.3px 0px rgba(4, 46, 76, 0.10);
    }
    #homepage #page_entrepriz .card .detail .images{
        display: flex;
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
    }
    #homepage #page_entrepriz .card .detail .images .background_company{
        width: 100%;
        height: 150px;
        background-size: cover; /* This makes the background image scale to fit inside the container */
        background-repeat: no-repeat; /* Prevents the image from repeating */
        background-position: center; /* Centers the background image in the div */
    }
    #homepage #page_entrepriz .card .detail .images .logo_company {
        position: relative;
        z-index: 1;
        width: 125px;
        height: 125px;
        margin-left: 25px;
        margin-block-start: -65px;
        background-size: cover; /* This makes the background image scale to fit inside the container */
        background-repeat: no-repeat; /* Prevents the image from repeating */
        background-position: center; /* Centers the background image in the div */
        border-radius: 5px;
        border-top: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 4px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }
    #homepage #page_entrepriz .card .detail h4 {
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        font-family: 'Alpino-Bold';
        line-height: 88.5%; /* 30.975px */
        letter-spacing: -0.35px;
    }
    #homepage #page_entrepriz .card .detail .infos {
        padding: 15px 25px 0px 25px;
        display: flex;
        flex-direction: column;
        gap: 15px;
    }
    #homepage #page_entrepriz .card .detail .infos .badges{
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        gap: 5px;
    }
    #homepage #page_entrepriz .card .detail .infos .badges img{
        width: 32.75%; /* Each image takes up roughly one-third of the container width */
        aspect-ratio: 1 / 1; /* Keep the images circular */
        object-fit: cover; /* This will ensure the images cover the space without distortion */
        border-radius: 50%; /* This makes the images circular */
        box-shadow: 0px 2.979px 0px 0px rgba(0, 0, 0, 0.25);
    }
    #homepage #page_entrepriz .card .detail .infos .end_part {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
    }
    #homepage #page_entrepriz .card .detail .infos .end_part .left{
        display: flex;
        flex-direction: column;
        gap: 5px;
        margin-block-start: 10px;
    }
    #homepage #page_entrepriz .card .detail .infos .end_part .left .item {
        display: flex;
        align-items: center;
        gap: 7px;
    }
    #homepage #page_entrepriz .card .detail .infos .end_part .left .item p{
        padding: 0;
        margin: 0;
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        font-family: 'Alpino-Regular';
        line-height: 88.5%; /* 19.47px */
        letter-spacing: -0.22px;
    }
    #homepage #page_entrepriz .card .detail .infos .end_part .left .item img{
        width: 17px;
        height: 17px;
    }
    #homepage #page_entrepriz .card .detail .infos .end_part .right a {
        display: flex;
        padding: 10px 20px;
        justify-content: center;
        align-items: center;
        border-radius: 4px;
        border-top: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 3px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        background: var(--Main-Colors-Jaune-Deskiz, #FFC901);
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        font-family: 'Alpino-Bold';
        letter-spacing: -0.22px;
        text-decoration: none;
    }
    #homepage #page_entrepriz .card .detail .infos .end_part .right a:active {
        border-top: 3px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }

    /*-------------------------*/
    /*-----Section Badging-----*/
    /*-------------------------*/
    #homepage #badging {
        display: flex;
        align-items: stretch;
        align-self: stretch;
        border-radius: 15px;
        border: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F);
        overflow: hidden;
        flex-direction: column;
    }
    #homepage #badging .badges{
        display: flex;
        justify-content: center;
        align-items: center;
        object-fit: contain;
        height: auto;
        width: 100%;
        /*background-image: url(../img/homepage/badges_background.svg);
        background-size: cover;
        background-position: center;*/
    }
    #homepage #badging img{
        object-fit: cover;
        object-position: center;
        width: 100%;
        max-height: 300px;
    }
    #homepage #badging .compo_title_para_cta {
        width: 92% !important;
        border-top: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F) !important;
        border-left: none;
    }

    /*----------------------------------*/
    /*-----Section Contexte Badging-----*/
    /*----------------------------------*/
    #homepage #contexte {
        border-radius: 15px;
        border: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F);
        background: var(--Main-Colors-Blanc-Deskiz, #FFF);
    }
    #homepage #contexte .container {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 55px;
        align-self: stretch;
        overflow: hidden;
        padding: 4.4% 4.4% 0.4% 4.4% !important;
    }
    #homepage #contexte .wrapper{
        display: flex;
        gap: 20px;
    }
    #homepage #contexte .wrapper .item{
        display: flex;
        width: 325px;
        height: 600px;
        padding: 28px 25px;
        flex-direction: column;
        align-items: center;
        gap: 22.597px;
        border-radius: 9.825px;
        transition: all ease .25s;
    }
    #homepage #contexte .wrapper .item:hover{
        margin-block-start: -1em;
    }
    #homepage #contexte .wrapper .i1{
        background: linear-gradient(180deg, #E4F9FF 0%, rgba(255, 255, 255, 0.00) 100%);
    }
    #homepage #contexte .wrapper .i2{
        background: linear-gradient(180deg, #FFF9E5 0%, rgba(255, 249, 229, 0.00) 100%);
    }
    #homepage #contexte .wrapper .i3{
        background: linear-gradient(180deg, #FFECED 0%, rgba(255, 236, 237, 0.00) 100%);
    }
    #homepage #contexte .label_wrapper {
        display: flex;
        gap: 15px;
        width: 100%;
        justify-content: center;
        align-items: center;
    }
    #homepage #contexte .label_wrapper .separator{
        width: 100%;
        height: 0.5px;
        background-color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }
    #homepage #contexte .label_wrapper .text{
        text-wrap: nowrap;
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        text-align: center;
        font-family: 'Alpino-Regular';
        line-height: 105%; /* 22.696px */
        letter-spacing: -0.648px;
    }
    #homepage #contexte .wrapper .item .info {
        display: inline-flex;
        padding: 10.5px 21px;
        justify-content: center;
        align-items: center;
        text-wrap: nowrap;
        flex-shrink: 0;
        border-radius: 100px;
        font-family: 'Alpino-Regular';
        line-height: 105%; /* 22.696px */
        letter-spacing: -0.648px;
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        background: var(--Main-Colors-Blanc-Deskiz, #FFF);
    }
    #homepage #contexte .wrapper .item .i1 {
        border-top: 1.3px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 1.3px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 1.3px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }
    #homepage #contexte .wrapper .item .i2 {
        border-top: 1.3px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-right: 1.3px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-bottom: 5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-left: 1.3px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
    }
    #homepage #contexte .wrapper .item .i3 {
        border-top: 1.3px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-right: 1.3px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-bottom: 5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-left: 1.3px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
    }
    #homepage #contexte .wrapper .item .badge {
        width: 245.625px;
        height: 245.625px;
        flex-shrink: 0;
        box-shadow: 0px 2.456px 0px 0px rgba(0, 0, 0, 0.25);
        border-radius: 50%; /* This makes the images circular */
    }
    #homepage #contexte .wrapper .item .b1 {
        margin-block-start: -30px;
    }
    #homepage #contexte .wrapper .item .b2 {
        margin-block-start: -10.5px;
    }
    #homepage #contexte .wrapper .item .b3 {
        margin-block-start: -17px;
    }
    #homepage #contexte .wrapper .item .arrow {
        width: 16.21px;
    }
    #homepage #contexte .wrapper .item .a1 {
        margin-right: -193px;
        margin-block-start: -23px;
    }
    #homepage #contexte .wrapper .item .a2 {
        margin-right: -114px;
        margin-block-start: -42px;
    }
    #homepage #contexte .wrapper .item .a3 {
        transform: scaleX(-1);
        margin-right: 220px;
        margin-block-start: -35px;
    }
    #homepage #contexte .wrapper .item p {
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        text-align: center;
        font-family: 'Alpino-Bold';
        line-height: 105%; /* 22.696px */
        letter-spacing: -0.648px;
        position: relative;
        z-index: 1;
    }
    #homepage #contexte span::before {
        content: "";
        position: absolute;
        z-index: -1;
    }
    #homepage #contexte .span1::before {
        background-color: var(--main-colorsbleu-deskiz);
        width: 103px;
        height: 24px;
    }
    #homepage #contexte .span2::before {
        background-color: var(--main-colorsjaune-deskiz);
        width: 89px;
        height: 24px;
    }
    #homepage #contexte .span3::before {
        background-color: var(--main-colorsrouge-deskiz);
        width: 55px;
        height: 24px;
    }
    #homepage #contexte .span1, .span3 {
        color: var(--Main-Colors-Blanc-Deskiz, #FFF) !important;
    }

    /*---------------------------------*/
    /*-----Section Cartes de Fitiz-----*/
    /*---------------------------------*/
    #homepage #badging.cards{
        background: var(--Foundation-Yellow-Light, #FFFAE6);
    }
    #homepage #badging.cards .compo_title_para_cta{
        background: transparent;
        border: none;
    }
    #homepage #badging.cards .compo_title_para_cta{
        background: transparent;
        border-bottom: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F);
        border-left: none;
        border-top: none !important;
    }
    #homepage #badging.cards .compo_title_para_cta h2, #badging.cards .compo_title_para_cta p{
        color: var(--Foundation-Yellow-Darker, #594600) !important;
    }
    #homepage #badging.cards .compo_title_para_cta a {
        border-top: 2.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-right: 2.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-bottom: 6.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-left: 2.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        color: var(--Foundation-Yellow-Darker, #594600) !important;
    }
    #homepage #badging.cards .compo_title_para_cta a:active {
        border-top: 6.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-right: 2.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-bottom: 2.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-left: 2.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
    }
    #homepage #badging.cards .badges{
        background: var(--Main-Colors-Blanc-Deskiz, #FFF);
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        max-height: 300px;
    }
    #homepage #badging.cards .badges img{
        object-fit: contain;
        width: 250% ;
        max-height: none;
    }

    /*-------------------------*/
    /*-----Section 2 Modes-----*/
    /*-------------------------*/
    #homepage #two_modes {
        border-radius: 15px;
        border: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F);
        background: var(--Main-Colors-Blanc-Deskiz, #FFF); 
    }
    #homepage #two_modes .container{
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 25px;
        align-self: stretch;
    }
    #homepage #two_modes h2 {
        color: var(--Main-Colors-Black-Deskiz, #181A1F);
        font-family: 'Eskool';
        font-weight: 100;
        font-style: normal;
        line-height: 105%; /* 71.158px */
        letter-spacing: -2.033px;
    }
    #homepage #two_modes p {
        color: var(--Main-Colors-Black-Deskiz, #181A1F);
        text-align: center;
        font-family: 'Alpino-Regular';
        letter-spacing: -0.209px;
        max-width: 666px;
    }

    /*-----------------------------*/
    /*-----Section Mapiz-Fitiz-----*/
    /*-----------------------------*/
    #homepage #mapiz_fitiz {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
    #homepage #mapiz {
        width: 100%;
        border-radius: 15px;
        border: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F);
        background: var(--Foundation-Yellow-Light, #FFFAE6);
        height: 600px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }
    #homepage #mapiz h2 {
        color: var(--Foundation-Yellow-Darker, #594600) !important;
    }
    #homepage #mapiz p {
        color: var(--Foundation-Yellow-Darker, #594600) !important;
    }
    #homepage #mapiz.fitiz h2 {
        color: var(--Foundation-Red-Darker, #59191B) !important;
    }
    #homepage #mapiz.fitiz p {
        color: var(--Foundation-Red-Darker, #59191B) !important;
    }
    #homepage #mapiz.fitiz {
        background: var(--Foundation-Red-Light, #FFEDED);
    }
    #homepage #mapiz .container{
        width: 92%;
    }
    #homepage #mapiz .video_content{
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    #homepage #mapiz .video_content img{
        width: 100%;
        object-fit: cover;
        object-position: center;
    }
    #homepage #mapiz.fitiz .video_content img{
        width: 172%;
    }
    #homepage #mapiz .separator {
        background: var(--Main-Colors-Black-Deskiz, #181A1F);
        display: flex;
        min-height: 1px;
        flex-direction: column;
        align-items: flex-start;
    }

    /*-------------------------------*/
    /*-----Section Outil pour RH-----*/
    /*-------------------------------*/
    #homepage #outil_rh {
        width: 100%;
        background: var(--Foundation-Blue-Light, #E6FBFD);
        border: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F);
        border-radius: 15px;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: column;
    }
    #homepage #outil_rh .compo_title_para_cta {
        width: auto;
        background: none;
        border: none;
        border-bottom: none !important;
    }
    #homepage #outil_rh .compo_title_para_cta h2, #outil_rh .compo_title_para_cta p, #outil_rh .compo_title_para_cta a{
        color: var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C) !important;
    }
    #homepage #outil_rh .compo_title_para_cta a{
        border-top: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 6.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        transition: all ease .1s;
    }
    #homepage #outil_rh .compo_title_para_cta a:active{
        border-top: 6.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }
    #homepage #outil_rh img {
        max-width: 466px;
        margin-right: 0em;
        margin-block-end: -4em;
    }
    #homepage #outil_rh .phone {
        display: none;
    }

}
@media (min-width:501px) { /*Wide Phone & Tablets*/
    #homepage .container {
        padding: 4.4%;
    }
    /*==> Div avec Titre, texte + bouton*/
    #homepage .compo_title_para_cta {
        padding: 4.4%;
    }

    #homepage #mapiz.fitiz .video_content img{
        width: 187%;
    }

    #homepage #outil_rh {
        width: 100%;
        flex-direction: row;
    }

    #homepage #outil_rh .phone {
        margin-right: -2em;
        margin-block-end: -3em;
        max-width: 120px;
        position: relative;
        transform: rotateZ(354deg);
        z-index: 12;
        display: block;
    }

    #homepage #outil_rh img {
        max-width: 555px;
        margin-right: 8em;
        margin-block-end: -6em;
    }
}
@media (min-width:693px) { /*Special*/
    #homepage .container {
        padding: 5.4%;
    }
    /*==> Div avec Titre, texte + bouton*/
    #homepage .compo_title_para_cta {
        padding: 5.4%;
    }
}
@media (min-width:992px) { /*SD & HD*/
    #homepage #header_hp_b2b .container {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr;
        grid-gap: 4em 5em;
        padding-left: 4.4%;
        padding-right: 4.4%;
        padding-top: 4.4%;
        padding-bottom: 4.4%;
        display: grid;
        overflow: hidden;
    }
    #homepage #header_hp_b2b .item.item-2 {
        width: 100%;
        height: 100%;
        display: flex;
        position: relative;
        align-items: center;
        background-color: var(--main-colorsrouge-deskiz);
        max-height: 85vh;
        border-radius: 5px;
        transform: rotate(-2deg);
        margin-bottom: auto;
        margin-top: auto;
    }
    #homepage #header_hp_b2b .container .item.item-2 .img_header_true {
        background-image: url(../img/company/figma/figma-foodtruck.png);
        background-size: cover;
        background-position: center;
        width: calc(95% + 5%);
        height: calc(100% + 5%);
        position: absolute;
        transform: translate(-50%, -50%);
        transform: rotate(2deg);
        border: 5px solid;
        border-color: var(--main-colorsblanc-deskiz);
        background-color: var(--main-colorsbleu-deskiz);
        border-radius: 5px;
        z-index: 11;
        max-width: 100%;
        max-height: 100%;
    }
    #homepage #header_hp_b2b .container .item.item-2 .img_header_blue {
        width: calc(95% + 5%);
        height: calc(100% + 5%);
        position: absolute;
        transform: translate(-50%, -50%);
        transform: rotate(5deg);
        background-color: var(--main-colorsbleu-deskiz);
        border-radius: 5px;
        z-index: 10;
        max-width: 100%;
        max-height: 100%;
    }
    #homepage #header_hp_b2b .item.item-1 h1 {
        margin-top: -10px;
    }


    #homepage .compo_title_para_cta {
        border-bottom: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F);
        border-top: none;
        border-right: none;
    }
    #homepage .compo_title_para_cta_no_styling p {
        margin-block-end: 1em;
    }
    #homepage .compo_title_para h2 {
        margin-block-start: 0;
    }
    #homepage .compo_title_para_cta p {
        margin-block-end: 1em;
    }


    #homepage #page_entrepriz .container a:hover{
        border-top: 6.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }
    #homepage #page_entrepriz .card .detail .infos .end_part .right a:hover {
        border-top: 3px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 1px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }
    #homepage #badging.cards .compo_title_para_cta a:hover {
        border-top: 6.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-right: 2.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-bottom: 2.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
        border-left: 2.5px solid var(--Main-Colors-Jaune-Deskiz, #FFC901);
    }
    #homepage .compo_title_para_cta a:hover {
        border-top: 6.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-right: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-bottom: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
        border-left: 2.5px solid var(--Main-Colors-Rouge-Deskiz, #FF474C);
    }
    #homepage #outil_rh .compo_title_para_cta a:hover{
        border-top: 6.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-right: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-bottom: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
        border-left: 2.5px solid var(--Main-Colors-Bleu-fonc-Deskiz, #042E4C);
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_connexion a:hover {
        border-top: 3.5px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-right: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-bottom: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-left: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
    }
    #homepage #header_hp_b2b .container .item.item-1 .form_inscription .button_inscription a:hover {
        border-top: 3.5px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-right: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-bottom: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
        border-left: 1.2px solid var(--main-colors-bleu-fonc-deskiz, #032B44);
    }


    /*==> Div avec Titre, texte + bouton (no styling mother div)*/
    #homepage #badging {
        flex-direction: row;
    }
    #homepage #badging .badges{
        display: flex;
        justify-content: center;
        align-items: center;
        object-fit: contain;
        height: 600px;
        width: 50%;
        /*background-image: url(../img/homepage/badges_background.svg);
        background-size: cover;
        background-position: center;*/
    }
    #homepage #badging img{
        max-height: none;
        width: 173%;
    }
    #homepage #badging .compo_title_para_cta {
        width: auto !important;
        border-top: none !important;
        border-left: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F) !important;
        border-bottom: none !important;
    }

    #homepage #badging.cards .compo_title_para_cta{
        background: transparent;
        border-bottom: none;
        border-right: 1px solid var(--Main-Colors-Black-Deskiz, #181A1F);
        border-left: none !important;
    }
    #homepage #badging.cards .badges{
        max-height: none;
    }

    #homepage #contexte .container {
        padding: 4.4% 4.4% 2.4% 4.4% !important;
    }


    #homepage #mapiz {
        height: 700px;
    }
    #homepage #mapiz_fitiz {
        flex-direction: row;
    }
    #homepage #mapiz.fitiz .video_content img{
        width: 230%;
    }
    #homepage #mapiz .video_content img {
        width: 116%;
        object-fit: cover;
        object-position: center;
    }


}
@media (min-width:1450px) { /*Special*/
    #homepage #badging img{
        width: 116%
    }
}
@media (min-width:1900px) { /*Special*/
    #homepage #mapiz.fitiz .video_content img{
        width: 117%;
    }
}
@media (min-width:1921px) { /*2k-4k screens*/
    #homepage #badging img{
        width: 100%
    }
}
/*END - HOMEPAGE*/

/**/

/*BEG - INDEX PAGE*/
@media (min-width:1px) { /* minimum at 320px - smartphones, iPhone, portrait 480x320 phones */
    #deskiz_bento  {
        cursor: url('../img/deskiz_cursor.png') 16 16, auto; /* Fallback to default cursor */
    }
    #deskiz_bento.holding {
        cursor: url('../img/deskiz_cursor_holding.png') 16 16, auto;
    }
    #deskiz_bento .giga_container {
        display: block;
        margin: 48px;
        overflow: visible;
    }
    #deskiz_bento h1, #deskiz_bento h2 {
        font-weight: 100;
    }
    #deskiz_bento p {
        max-width: none;
    }
    #deskiz_bento .content .image-clickable {
        cursor: pointer;
        transition: all ease .2s;
    }
    #deskiz_bento .content .image-clickable:active {
        border: 1px solid var(--yellow-500, rgba(255, 223, 2, 1));
        transform: scale(1.01); /* Grows the image by 5% */
        transition: transform 0.3s ease, border 0.3s ease; /* Smooth transition */
    }
    /* Fullscreen overlay styling */
    #deskiz_bento .content .fullscreen-overlay {
        display: none; /* Initially hidden */
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9); /* Black background with transparency */
        justify-content: center;
        align-items: center;
        z-index: 1000; /* Ensure it's on top */
    }
    #deskiz_bento .content .fullscreen-overlay img {
        max-width: 90%;
        max-height: 90%;
        object-fit: contain; /* Ensures the image fits within the screen without distortion */
    }
    #deskiz_bento .content .close-btn {
        position: absolute;
        top: 20px;
        right: 40px;
        font-size: 40px;
        color: white;
        cursor: pointer;
    }
    .progress-container {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 8px; /* Height of the progress bar */
        /*background-color: rgba(0, 0, 0, 0.1);*/ /*Light background to contrast the progress bar  */
        z-index: 9999; /* Ensure it's always on top */
    }
    #progress-bar {
        width: 0;
        height: 100%;
        background-color: #0074d9; /* Blue-500 color from your image */
        transition: width 0.1s ease-out; /* Smooth transition as the user scrolls */
    }
    #deskiz_bento .main_wrapper {
        display: flex;
        flex-direction: column;
        gap: 48px;
        width: 100%;
    }
    #deskiz_bento .left {
        display: flex;
        flex-direction: column;
        gap: 24px;
        align-items: flex-start;
        box-sizing: border-box;
        width: 100%;
    }
    #deskiz_bento .left li{
        list-style: none;
    }
    #deskiz_bento .right {
        background-color: rgba(0, 116, 217, 0.02); /*navy-500*/
        border-radius: 20px;
        border: 1px solid #e6f1fb; /*blue-50*/
        display: flex;
        flex-direction: column;
        gap: 24px;
        padding: 24px;
        box-sizing: border-box;
        height: fit-content;
        width: 100%;
    }
    #deskiz_bento .left img{
        width: 66%;
    }
    #deskiz_bento .left p{
        margin: 1em 0em .75em 0em;
    }
    #deskiz_bento .left a {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        box-sizing: border-box;
        width: auto;
    }
    #deskiz_bento .left a.download_button {
        gap: 8px;
        padding: 12px 16px;
        border-radius: 2px;
        margin-block-end: 1em;
    }
    #deskiz_bento .left a .download_button_img{
        width: 28px;
        height: 28px;
    }
    #deskiz_bento .left .wrapper_contact ul{
        margin: 0 !important;
        padding: 0 !important;
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
    #deskiz_bento .left .wrapper_contact .contact_element{
        margin: 0 !important;
        padding: 0 !important;
        display: flex;
        gap: 8px;
        align-items: center;
    }
    #deskiz_bento .left .contact_element img{
        width: 32px;
        height: 32px;
    }
    #deskiz_bento .right iframe{
        width: 100%;
        border-radius: 6px;
        border: 1px solid #e6f1fb; /*blue-50*/
    }
    #deskiz_bento .right img{
        width: 100%;
        border-radius: 6px;
        border: 1px solid #e6f1fb; /*blue-50*/
    }
    #deskiz_bento .right hr{
        height: 2px; /* Controls the thickness of the line */
        width: 80%; /* Controls the width of the line */
        background-color: #e6f1fb; /* Blue color */
        border: none; /* Remove default border */
    }
    #deskiz_bento .right .title_wrapper{
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    #deskiz_bento .right .img_wrapper{
        display: flex;
        flex-direction: column;
        gap: 24px;
    }
    /* Container to maintain the 16:9 ratio */
    #deskiz_bento .right .iframe-container {
        position: relative;
        width: 100%; /* Full width, adjusts based on the parent container */
        padding-top: 56.25%; /* 16:9 aspect ratio (9 / 16 = 0.5625 -> 56.25%) */
        height: 0; /* Use padding to control the height */
        overflow: hidden; /* Hide any overflow */
    }

/* Make iframe responsive and fit the container */
    #deskiz_bento .right .iframe-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%; /* Full width of the container */
        height: 100%; /* Full height of the container */
        border: 0; /* Remove any default borders */
    }

}
@media (min-width:1260px) {
    #deskiz_bento .main_wrapper {
        flex-direction: row;
    }
    #deskiz_bento .left {
        position: fixed;
        top: 48px;
        left: 48px;
        gap: 24px;
        width: 30%;
        padding-bottom: 90px;
        height: 100vh; /* Ensure it fits within the viewport height */
        overflow-y: auto; /* Enable vertical scrolling inside the left div */
        scrollbar-width: none; /* Firefox */
        -ms-overflow-style: none; /* Internet Explorer and Edge */
    }
    #deskiz_bento .right {
        margin-left: 40%;
        width: 60%;
    }
    #deskiz_bento .content .image-clickable:hover {
        border: 1px solid var(--yellow-500, rgba(255, 223, 2, 1));
        transform: scale(1.01); /* Grows the image by 5% */
        transition: transform 0.3s ease, border 0.3s ease; /* Smooth transition */
    }
}

/*END - INDEX PAGE*/