#content{
    background: #F8F8F8;
}

#login, #inscription-block, .forgot, #account{
    padding: 72px 0px;
}

#login, #inscription-block, .forgot{
    display: flex;
    justify-content: center;
    flex-direction: column;
    position: relative;
}
#login .login-content,
#inscription-block .inscription-content{
    display: grid;
    justify-content: space-around;
    width: 100%;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

#inscription-block .inscription-content{grid-template-columns: 2fr 1fr}

#login .left, #login .right,
#inscription-block .left, #inscription-block .right{
    background: #FFFFFF;
    border: 1px solid var(--color-2);
    border-radius: 8px;
    width: 100%;
    padding: 62px 47px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#login .left .left-title,
#login .right .right-title,
#inscription-block .right .right-title,
#inscription-block .left .left-title,
.forgot .forgot-title{
    font-weight: bold;
    font-size: 24px;
    line-height: 150%;
    display: flex;
    align-items: center;
    letter-spacing: 0.75px;
    margin-bottom: 52px;
    text-transform: uppercase;
    text-align: center;
}

#login .right,
#inscription-block .right{
    margin-right: 0;
}

form label{
    font-weight: bold;
    font-size: 20px;
    line-height: 1.0em;
    display: flex;
    align-items: center;
    color: var(--color-2);
    margin-bottom: 10px;
    margin-top: 4px;
}

form .login-block{
    margin-bottom: 15px;
}

form input::placeholder,
form input,
form select,
form .select2-container,
form textarea,
.forgot-subtitle{
    font-weight: normal;
    font-size: 20px;
    line-height: 1.2em;
    letter-spacing: 0.75px;
    color: var(--color-1);
}

form input::placeholder,
form textarea::placeholder{
    opacity: .7;
    color: #333;
}

form input,
form select,
form .select2-container,
form textarea{
    background: #FFFFFF;
    border: var(--color-2) 1px solid;
    width: 100%;
    border-radius: 8px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    min-height: 50px;
}
form .select2-container .selection{
    width: 100%;
}

.custom-switch, .custom-radio{
    display: flex; align-items: center;
    position: relative;
}
.custom-switch > div,
.custom-radio > div{width: 30px; height: auto; aspect-ratio: 1;margin-right: 15px;
    position: relative; overflow: hidden}

.custom-switch input:checked ~ .checkmark{
    background-color: var(--color-2);
}
.custom-switch input:checked ~ .checkmark:after,
.custom-radio input:checked ~ .checkmark:after{
    display: block;
}
.custom-switch .checkmark::after,
.custom-radio input:checked ~ .checkmark:after{
    left: 7px;
    top: 5px;
    width: 12px;
    height: auto;
    aspect-ratio: 1;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.custom-radio input:checked ~ .checkmark:after{
    background-color: var(--color-1);
    border-width: 0;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 20px;
    left: 50%; top: 50%;
}

form .custom-switch input,
form .custom-radio input{
    position: absolute;
    height: auto;
    width: 30px;
    min-height: 0;
    opacity: 0;
    cursor: pointer;
    aspect-ratio: 1;
    z-index: 2;
}

#preferences_add .custom-switch .custom-control-label::after,
#preferences_add .custom-switch .custom-control-label::before{
    display: none;
}

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 30px;
    aspect-ratio: 1;
    z-index: 1;
    border: var(--color-2) 1px solid;
}
form .custom-radio .checkmark,
.custom-radio .checkmark:after{border-radius: 50%;}
.checkmark::after {content: "";position: absolute;display: none;}

#login .left .link-revert{
    font-weight: normal;
    font-size: 20px;
    line-height: 28px;
    display: flex;
    align-items: center;
    letter-spacing: 0.75px;
}

#login .left .btn{margin-top: 30px;}

.btn{transition: background-color .3s ease; will-change: background-color;}
.btn:hover{background-color: var(--color-2);}
a:not(.btn), a:not(.btn) span{transition: color .3s ease; will-change: color;}
a:not(.btn):hover, a:not(.btn):hover span{color: var(--color-2);}
button.btn{border: none; outline: 0; cursor: pointer;}

#inscription-block .right .right-desccription,
#login .right .right-desccription{
    font-weight: bold;
    font-size: 20px;
    line-height: 180%;
    letter-spacing: 0.75px;
    color: var(--color-1);
    padding-bottom: 26px;

}
#inscription-block .right .right-desccription ul,
#login .right .right-desccription ul{
    font-weight: normal;
    padding: 0px;
    margin: 0px;
    margin-top: 21px;
}
#inscription-block .right .right-desccription ul li,
#login .right .right-desccription ul li{
    list-style: none;
    margin-bottom: 21px;
}

#content .picto{position: absolute;}
#inscription-block > div, #login > div{position: relative;}
#content .picto.top-right{top: 0; right: 0;}
#content .picto.bottom-left{bottom: 0; left: 0;}
#content .picto.bottom-right{bottom: 0; right: 0;}

#login .alert-danger, #inscription-block .alert-danger,
#login .alert-success, #inscription-block .alert-success{margin-bottom: 30px}
.alert-info{margin-top: 20px;}

#zone_adresse + .form-group{margin-top: 15px;}


#account{
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 50px;
}

#account .account-left,
#account .account-right{
    border: 1px solid var(--color-2);
    background-color: white;
    border-radius: 10px;
    padding: 30px 20px 20px;
}

#account .account-right{padding: 30px;}

#account .account-left p{
    font-weight: normal;
    font-size: 20px;
    line-height: 180%;
    letter-spacing: 0.75px;
    color: var(--grey2);

    margin-top: 40px;
}
#account .delete{
    padding: 2px;
}
#account .delete svg{
    width: 18px;
    height: auto;
}

#account .delete svg path{
    fill: var(--color-7);
}
#account #dashboard-left li{
    list-style: none;
    position: relative;
}
#account #dashboard-left li:after{
    position: absolute;
    bottom: 0px;
    left:0px;
    width: 100%;
    height: 1px;
    background: var(--grey3);
    content:'';
}

#account #dashboard-left li a{
    text-decoration: none;
    font-size: 20px;
    line-height: 100%;
    display: flex;
    align-items: center;
    letter-spacing: 0.75px;
    color: var(--grey);
    padding-bottom: 18px;
    padding-top: 21px;
}
#account #dashboard-left li svg{
    margin-right: 15px;
    width: 25px; height: auto;
}
#account #dashboard-left li svg path{fill: var(--color-2)}

#account #dashboard-left li a i{
    margin-right: 0px;
    color: var(--grey);
    font-size: 18px;
    width: 37px;
}
#account #dashboard-left li.active a i,
#account #dashboard-left li a:hover i{
    color: var(--thirdary);
}

#account .account-right .account-title{
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0.75px;
    margin-bottom: 40px;
    display: flex;
    justify-content: space-between;
    text-transform: uppercase;
}

#account .account-right .user-block{
    display: flex;
    justify-content: space-between;
}
#account .account-right .user-block img{
    width: 50px;
    border: 2px solid var(--white2);
    border-radius: 8px;
}
#account .account-right .user-block .left{
    display: flex;
    align-items: center;
}
#account .account-right .user-block figure{
    border: 3px solid var(--grey3);
    margin: 0px;
    padding: 0px;
    margin-right: 11px;
}
#account .account-right .user-block  h4{
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 16px;
    letter-spacing: 0.25px;
    color: var(--grey);
    margin: 0px;
    padding: 0px;
}
#account .account-right .user-block a{

}

#account .account-right .dashboard-contents{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 32px;
    gap: 20px;
    text-align: center;
}
#account .account-right .dashboard-content{
    background: #f8f8f8;
    border: 1px solid var(--color-2);
    border-radius: 10px;
    width: 276px;
    padding: 39px 37px;
}

#account .account-right .dashboard-content.first-flex-wrapped,
#account .account-right .dashboard-content:first-of-type{
    margin-left: 0px;
}
#account .account-right .dashboard-content .dashboard-content-top{
    font-weight: 600;
    font-size: 36px;
    line-height: 100%;
    letter-spacing: 0.75px;
    color: var(--secondary);

}
#account .account-right .dashboard-content .dashboard-content-bottom{
    font-weight: normal;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0.75px;
    color: var(--grey);
}

#account .table-responsive table{
    width: 100%;
}

#update_profil button[type="submit"]{margin: 0 auto;}
#update_profil input[type="text"],
#update_profil input[type="password"],
#update_profil input[type="number"],
#update_profil textarea,
#update_profil select {background-color: #f8f8f8;}
#update_profil .inscription-subtitle{color: var(--color-2)}
.form-group > .custom-radio:last-of-type{margin-top: 10px;}

/*#aide_financiere .inscription-title,*/
/*#cv_add .inscription-title,*/
/*#preferences_add .inscription-title,*/
/*#files_add .inscription-title,*/
/*#update_profil .inscription-title,*/
/*#inscription-block .inscription-title{*/
/*    font-weight: bold;*/
/*    font-size: 24px;*/
/*    line-height: 150%;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    letter-spacing: 0.75px;*/
/*    color: var(--primary);*/
/*}*/
/*#aide_financiere .inscription-subtitle,*/
/*#cv_add .inscription-subtitle,*/
/*#preferences_add .inscription-subtitle,*/
/*#files_add .inscription-subtitle,*/
/*#update_profil .inscription-subtitle,*/
/*#inscription-block .inscription-subtitle{*/
/*    font-weight: bold;*/
/*    font-size: 20px;*/
/*    line-height: 1.0em;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    padding-bottom: 29px;*/
/*}*/
/*#aide_financiere .inscription-subtitle-accroche,*/
/*#cv_add .inscription-subtitle-accroche,*/
/*#preferences_add .inscription-subtitle-accroche,*/
/*#files_add .inscription-subtitle-accroche,*/
/*#update_profil .inscription-subtitle-accroche,*/
/*#inscription-block .inscription-subtitle-accroche{*/
/*    font-size: 14px;*/
/*    line-height: 180%;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    letter-spacing: 0.75px;*/
/*    color: var(--grey);*/
/*    margin-bottom: 29px;*/
/*}*/

.block-inline{display: grid; grid-template-columns: 1fr 1fr; gap: 20px;}
.block-inline:not(:last-of-type){margin-bottom: 20px;}

/*#aide_financiere .table .delete i,*/
/*#cv_add .table .delete i,*/
/*#preferences_add .table .delete i,*/
/*#files_add .table .delete i,*/
/*#update_profil .table .delete i,*/
/*#inscription-block .table .delete i{*/
/*    color: var(--thirdary);*/
/*}*/
/**/
/*#aide_financiere .block-inline,*/
/*#cv_add .block-inline,*/
/*#preferences_add .block-inline,*/
/*#files_add .block-inline,*/
/*#update_profil .block-inline,*/
/*#inscription-block .block-inline{*/
/*    display: flex;*/
/*    margin-bottom: 25px;*/
/*}*/
/**/
/**/
/*#aide_financiere .block-inline .form-group:first-of-type,*/
/*#cv_add .block-inline .form-group:first-of-type,*/
/*#preferences_add .block-inline .form-group:first-of-type,*/
/*#update_profil .block-inline .form-group:first-of-type,*/
/*#inscription-block .block-inline .form-group:first-of-type{*/
/*    padding-right: 19px;*/
/*}*/
/*#aide_financiere .block-inline .form-group:last-of-type,*/
/*#cv_add .block-inline .form-group:last-of-type,*/
/*#preferences_add .block-inline .form-group:last-of-type,*/
/*#update_profil .block-inline .form-group:last-of-type,*/
/*#inscription-block .block-inline .form-group:last-of-type{*/
/*    padding-left: 15px;*/
/*}*/
/*#aide_financiere .block-inline .form-group,*/
/*#cv_add .block-inline .form-group,*/
/*#preferences_add .block-inline .form-group,*/
/*#files_add .block-inline .form-group,*/
/*#update_profil .block-inline .form-group,*/
/*#inscription-block .block-inline .form-group{*/
/*    flex: 1;*/
/*    margin-bottom: 0px;*/
/*    position: relative;*/
/*}*/
/*#cv_add .block-inline i,*/
/*#aide_financiere .block-inline i,*/
/*#preferences_add .block-inline i,*/
/*#files_add .block-inline i,*/
/*#update_profil .block-inline i,*/
/*#inscription-block .block-inline i{*/
/*    position: absolute;*/
/*    right: 27px;*/
/*    top: 50%;*/
/*    transform: translateY(-50%);*/
/*    cursor: pointer;*/
/*}*/
/*#aide_financiere .block-inline .input-cnarm,*/
/*#cv_add .block-inline .input-cnarm,*/
/*#preferences_add .block-inline .input-cnarm,*/
/*#files_add .block-inline .input-cnarm,*/
/*#update_profil .block-inline .input-cnarm,*/
/*#inscription-block .block-inline .input-cnarm{*/
/*    margin-bottom: 0px;*/
/*}*/
/*#aide_financiere .separator-custom,*/
/*#cv_add .separator-custom,*/
/*#preferences_add .separator-custom,*/
/*#files_add .separator-custom,*/
/*#update_profil .separator-custom,*/
/*#inscription-block .separator-custom{*/
/*    padding-top: 33px;*/
/*}*/
/**/
/**/
/*#preferences_add .inscription-subtitle{*/
/*    display: none;*/
/*}*/

/*#account_offre .offers-list{*/
/*    justify-content: space-between;*/
/*}*/

/*#account_offre .offers-list .offer-list{*/
/*    width: 428px;*/
/*}*/
/*#account_offre .offers-list .offer-list:after{*/
/*    display: none;*/
/*}*/

/*#account_offre .offers-list .offer-list{*/
/*    margin-left: 0px;*/
/*    margin-bottom: 28px;*/
/*}*/


/*#demande_rdv .block-rdv{*/
/*    padding: 40px;*/
/*    background: var(--white2);*/
/*    box-shadow: 0px 0px 24px rgba(17, 17, 17, 0.04);*/
/*    border-radius: 4px;*/
/*}*/



/*#demande_rdv .rdv-accroche{*/
/*    font-weight: bold;*/
/*    font-size: 20px;*/
/*    line-height: 150%;*/
/*    letter-spacing: 0.75px;*/
/*    color: var(--thirdary);*/
/*    margin-bottom: 20px;*/
/*}*/

/*#demande_rdv .p{*/
/*    font-size: 20px;*/
/*    line-height: 150%;*/
/*    letter-spacing: 0.75px;*/
/*    color: var(--noir);*/
/*}*/
/*#demande_rdv .rdv-raison {*/
/*    font-weight: bold;*/
/*    font-size: 16px;*/
/*    line-height: 150%;*/
/*    letter-spacing: 0.75px;*/
/*    color: var(--secondary);*/
/*    text-align: left;*/
/*    margin-top: 27px;*/
/*    margin-bottom: 39px;*/
/*}*/

/*#demande_rdv .choix {*/
/*    width: 428px;*/
/*    height: 111px;*/
/*    background: #FFFFFF;*/
/*    border-radius: 4px;*/
/*    font-size: 14px;*/
/*    line-height: 150%;*/
/*    letter-spacing: 0.75px;*/
/*    color: var(--grey);*/
/*    position: relative;*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    align-content: space-between;*/
/*    align-items: center;*/
/*    cursor: pointer;*/
/*    border:1px solid #FFFFFF;*/
/*}*/

/*#demande_rdv .choix span:first-of-type{*/
/*    position: relative;*/
/*    margin-right: 20px;*/
/*    background: #D6D8E7;*/
/*    width: 24px;*/
/*    height: 24px;*/
/*    border-radius: 12px;*/
/*    content:'';*/
/*    display: block;*/
/*    margin-left: 20px;*/
/*}*/

/*#demande_rdv .choix span:last-of-type{*/
/*    flex: 1;*/
/*}*/


/*#demande_rdv .choix.active span:first-of-type{*/
/*    border:6px solid var(--secondary);*/
/*}*/

/*#demande_rdv .choix.active{*/
/*    color: var(--thirdary);*/
/*    border:1px solid var(--secondary);*/
/*}*/


/*.forgot .newsletter-description{*/
/*max-width: 960px;*/
/*margin: 0 auto;*/
/*padding: 20px 50px;*/
/*color: var(--color-2);*/
/*font-size: 20px;*/
/*font-weight: bold;*/
/*}*/

/*.forgot .forgot-content{*/
/*    max-width: 960px;*/
/*    background: #FFFFFF;*/
/*    border: 1px solid var(--color-2);*/
/*    box-sizing: border-box;*/
/*    border-radius: 8px;*/
/*    margin: 0 auto;*/
/*    padding: 64px 50px;*/
/*}*/

/*.forgot .forgot-content form{margin-top: 30px;}*/

/*#mc_embed_signup form{*/
/*    padding: 0px !important;*/
/*}*/
/*#mc_embed_signup .mc-field-group{*/
/*    width: 100% !important;*/
/*}*/


/*.forgot form .login-block{*/
/*    margin-bottom: 28px;*/
/*}*/

/*#demande_rdv .demande_rdv_block{*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*}*/
@media (max-width: 1024px) {
    #account{grid-template-columns: 1fr;}

    #account .account-right{
        margin: 0px;
        overflow: auto;
    }
    #account .account-left p{
        padding-top: 30px;
    }
    #account{
        flex-direction: column;
        padding-left: 15px;
        padding-right: 15px;
        padding-top: 0px;
    }
    #account .account-left{
        margin: 0 auto;
        max-width: inherit !important;
        width: 100%;
    }
    #account .account-right{
        position: relative;
        z-index: 1;
    }
    #account #dashboard-left{
        display: flex;
        justify-content: center;
        align-content: center;
        align-items: center;
        padding: 0px;
        margin-left: -16px;
        margin-right: -16px;
        position: fixed;
        width: calc(100% - 40px);
        z-index: 2;
        column-gap: 10px;
        flex-wrap: wrap;
    }
    #account #dashboard-left li a{
        width: 60px;
        height: 60px;
        border-radius: 5px;
        display: flex;
        justify-content: center;
        align-items: center;
        align-content: center;
        position: relative;
        text-align: center;
        border:1px solid var(--color-2);
        background-color:  #fff;
    }
    #account #dashboard-left li a:hover,
    #account #dashboard-left li.active a{
        background-color: var(--color-2);;
    }
    #account #dashboard-left li svg{
        margin: 0;
    }
    #account #dashboard-left li a:hover svg path,
    #account #dashboard-left li.active svg path{
        fill: #fff
    }
    #account #dashboard-left li{
        width: auto;
        position: relative;
        margin-bottom: 10px;
    }

    #account #dashboard-left li a i{
        margin-right: 0px;
        width: auto;
    }


    #account #dashboard-left li:after{
        right: 1px;
        left: 0px;
        height: 100%;
        content:'';
        position: absolute;
        width: 1px;
        background: inherit;
        border-left: 1px solid var(--grey3);
    }
    #account #dashboard-left li:first-of-type:after{
        display: none;
    }
    #account #dashboard-left li:last-of-type:after{
        display: block;
    }
    #account #dashboard-left span{
        display: none;
    }
    #inscription-block .inscription-content{
        flex-direction: column;
        padding-left: 15px;
        padding-right: 15px;
    }
    #inscription-block .left,
    #inscription-block .right{
        max-width: 100%;
        width: 100%;
    }

    #inscription-block .right{
        margin-top: 30px;
    }
}
@media (max-width: 1029px) {

    .forgot,
    #login .login-content{
        padding-left: 15px;
        padding-right: 15px;
    }
    #login .login-content{
        flex-direction: column;
    }
    #login .left,
    #login .right{
        max-width: 100%;
    }

    #login .right{
        margin-top: 40px;
    }
}

@media (max-width: 900px) {
    #demande_rdv .choix{
        width: 300px;
    }
}
@media (max-width: 742px) {
    #aide_financiere .block-inline .form-group,
    #cv_add .block-inline .form-group,
    #preferences_add .block-inline .form-group,
    #files_add .block-inline .form-group,
    #inscription-block .block-inline .form-group{
        width: 50%;
    }
}

@media (max-width: 670px) {
    #account #dashboard-left li svg {
        width: 20px;
        height: auto;

    }

    #account #dashboard-left li a {
        width: 40px;
        height: 40px;
    }
}
@media (max-width: 650px) {
    #demande_rdv .demande_rdv_block{
        flex-direction: column;
    }
    #demande_rdv .choix{
        width: 100%;
    }
}
@media (max-width: 600px) {
    #account #tab-experiences .btn-cnarm.bg-orange-linear{
        width: 100% !important;
    }
    #account #tab-diplomes .btn-cnarm.bg-orange-linear{
        width: 100% !important;
    }

    #account .nav-tabs .nav-item{
        width: 48%;
        margin-right: 0px;
        text-align: center;
    }
    #account .nav-tabs{
        width: 100%;
        justify-content: space-between;
    }

    #demande_rdv .block-rdv{
        padding: 20px;
    }
    #account .account-right .account-title{
        flex-direction: column;
    }
    #account .account-right .user-block{
        flex-direction: column;
    }
    #account .account-right .dashboard-content{
        width: 100%;
        text-align: center;
    }
    #account .account-right #contact-cnarm{
        width: 100%;
        padding: 23px 10px;
    }
    #account .account-right .user-block .left{
        padding-bottom: 10px;
        flex-direction: column;
    }
    #login{
        padding: 40px 0px;
    }
    .forgot .forgot-content,
    #inscription-block .left,
    #inscription-block .right,
    #login .left,
    #login .right{
        padding: 30px 20px;
    }
    .forgot .newsletter-description{
        padding: 20px;
    }
}


@media (max-width: 498px) {
    #account .account-left p{
        margin-top: 70px;
        font-size: 16px;
        line-height: 100%;
    }
    #aide_financiere .block-inline,
    #cv_add .block-inline,
    #preferences_add .block-inline,
    #files_add .block-inline,
    #update_profil .block-inline,
    #inscription-block .block-inline{
        flex-direction: column;
        grid-template-columns: 1fr;
    }
    #aide_financiere .block-inline .form-group,
    #cv_add .block-inline .form-group,
    #preferences_add .block-inline .form-group,
    #files_add .block-inline .form-group,
    #update_profil .block-inline .form-group,
    #inscription-block .block-inline .form-group{
        width: 100%;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    #aide_financiere .block-inline .form-group:last-of-type,
    #cv_add .block-inline .form-group:last-of-type,
    #preferences_add .block-inline .form-group:last-of-type,
    #files_add .block-inline .form-group:last-of-type,
    #inscription-block .block-inline .form-group:last-of-type{
        margin-top: 25px;
    }
}