#mon_espace{
    max-width: 1200px;
    margin: 0 auto;
}


#mon_espace a{
    text-decoration: none;
}
#mon_espace blue{
    background-color: #0077B7;
}

#mon_espace .header{
    display: flex;
    justify-content: center;
    align-items: self-start;
    height: 270px;
    padding: 30px;
    background-color: #C0DDED;
}

#mon_espace .header > a{
    flex: 1;
    text-align: center;
}

#mon_espace .header figure{
    flex: 4;
    text-align: center;
    align-self: center;
}

#mon_espace .header figure img{
    width: 150px;
    height: 150px;
    border-radius: 100%;
    border: 3px solid #494949;
}

#mon_espace ul#dashboard{
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    background-color: #F6F6F6;
    padding: 25px;
}

#mon_espace ul#dashboard li{
    width: 33.33%;
    text-align: center;
    margin: 20px 0;
    font-size: 24px;
    font-weight: 700;
    color: #4A4A4A;
}

#mon_espace ul#dashboard li figure{
    width: 100px;
    height: 100px;
    margin: 0 auto;
    background-color: #4A4A4A;
    border-radius: 100%;
    padding: 25px;
}

#mon_espace ul#dashboard li a{
    color: #4A4A4A;
}

#mon_espace ul#dashboard li:hover a{
    color: #0077B7;
}

#mon_espace ul#dashboard li:hover figure{
    background-color: #0077B7;
}

#mon_espace ul#dashboard li figure img{
    width: 100%;
    height: auto;
}

#mon_espace ul.nav li{
    width: 33.33%;
    background-color: #D8EAF4;
    border-right: 3px solid #4A4A4A;
    position: relative;
}

#mon_espace ul.nav li:last-child{
    border-right: none;
}

#mon_espace ul.nav li a{
    text-align: center;
    font-size: 24px;
    color: #4A4A4A;
    font-weight: 700;
    background-color: transparent;
    border: 0;
    padding: 20px 25px;
}
#mon_espace ul.nav li a.active {
    background-color: #0077B7;
    border-radius: 0;
    color: #ffffff;
}

#mon_espace ul.nav li a.active::after {
    content: '';
    width: 0;
    height: 0;
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
    border-top: 20px solid #0077b7;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 100%);
}

#mon_espace .tab-pane .content_tab{
    min-height: 240px;
}
#mon_espace .content_tab > div{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#mon_espace .mes_offres .contrat{
    color: #FF8F00;
    font-size: 19px;
    font-weight: 700;
}
#mon_espace .mes_offres .libelle{
    font-size: 24px;
    font-weight: 700;
    color: #4A4A4A;
}

#mon_espace .mes_offres .entreprise{
    font-size: 20px;
    color: #7B7B7B;
}


#mon_espace .stats .circle{
    border: 10px solid #0077B7;
    border-radius: 100%;
    width: 170px;
    height: 170px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
#mon_espace .stats .circle .number{
    font-size: 34px;
    font-weight: 700;
    color: #4A4A4A;
}

#mon_espace .rdv .date{
    color: #FF8F00;
    font-size: 31px;
    font-weight: 700;
}
#mon_espace .rdv .info{
    font-size: 30px;
}

#mes_offres .list_offres{
    padding: 0px 15px;
}
#mes_offres .list_offres > div {
    box-sizing: border-box;
    background-color: #ffffff;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    text-decoration: none;
    margin-bottom: 30px;
    color: inherit;
    transition: 0.4s;
}

#mes_offres .list_offres > div ul li:last-of-type {
    margin-top: 0px;
}

#form_logins h1.title{
        margin: 30px auto !important;
    }
    
#form_logins .action-group {
    text-align: center;
    margin-top: 40px;
    padding-left: 20px;
}
    
#form_logins .control-label {
        font-weight: 600;
    }
    
#form_logins .btn-view {
        border-radius: 0 5px 5px 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

#register_form .alert-info, #mon_profil .alert-info, #mydocuments .alert-info, #wishlist .alert, #curriculum .alert, #mes_offres .alert {
    max-width: 800px;
    margin: 0 40px 40px;
}

#curriculum h3 ~ .alert {
    max-width: 1200px;
}

#register_form .form-group, #mon_profil .form-group, #mydocuments .form-group, #wishlist .form-group, #curriculum .form-group {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid rgba(0,0,0,0.04);
    padding-bottom: 20px;
    margin-bottom: 20px;
}

#register_form .form-group label, #mon_profil .form-group label, #mydocuments .form-group label, #wishlist .form-group label, #curriculum .form-group label {
    font-weight: 600;
    padding-top: 0;
    color: var(--colorBgDark);
}

#mydocuments .s_frame label[for="customFile"] {
    padding-top: 5px;
    font-weight: normal;
}



#mon_profil [type="submit"], #form_postule [type="submit"], #mydocuments [type="submit"], #wishlist [type="submit"], #curriculum [type="submit"] {
    max-width: 380px;
}

#mydocuments .list_files, #wishlist .list_files, #curriculum .list_files {
    max-width: 1200px;
    margin: 0 auto 80px;
}

#mydocuments .list_files .table-warning, #mydocuments .table-warning > td, #mydocuments .table-warning > th, #wishlist .list_files .table-warning, #wishlist .table-warning > td, #wishlist .table-warning > th, #curriculum .list_files .table-warning, #curriculum .table-warning > td, #curriculum .table-warning > th {
    background-color: #f7f7f7;
}

#mydocuments .list_files .table-warning tbody + tbody, #mydocuments .list_files .table-warning td, #mydocuments .list_files .table-warning th, #mydocuments .list_files .table-warning thead th, #wishlist .list_files .table-warning tbody + tbody, #wishlist .table-warning td, #wishlist .table-warning th, #wishlist .table-warning thead th, #curriculum .list_files .table-warning tbody + tbody, #curriculum .table-warning td, #curriculum .table-warning th, #curriculum .table-warning thead th {
    border-color: #eaeaea;
    vertical-align: middle;
}

#mydocuments .list_files thead th:nth-child(4) {
    width: 40%;
}

#curriculum h3 {
    color: var(--color1);
}

#section_register h1 {
    margin-left: 0px;
    margin-right: 0px;
}
#section_register {
    padding: 50px;
}
#section_register .left{
    background-color: #ffffff;
    padding: 35px; 

}

#section_register #fiche_offre{
    padding: 0px;
}

#section_register.inscription #sendform_btn_small{
    display: none;
}



input[name="verif_human"] {
    display: none;
}
@media (max-width: 768px){
    /* DOCUMENT */
    /* Force table to not be like tables anymore */
    #mydocuments table, #mydocuments thead, #mydocuments tbody, #mydocuments th, #mydocuments td, #mydocuments tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    #mydocuments thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    #mydocuments  tr { border: 1px solid #ccc;  margin-bottom: 20px;}
    #mydocuments td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
    }
    #mydocuments td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: wrap;
    }
    #mydocuments td:nth-of-type(1):before { content: "Type de document"; }
    #mydocuments td:nth-of-type(2):before { content: "Nom du fichier"; }
    #mydocuments td:nth-of-type(3):before { content: "État"; }
    #mydocuments td:nth-of-type(4):before { content: "Commentaire"; }
    #mydocuments td:nth-of-type(5):before { content: "Actions"; }



    /* DIPLOME */
    /* Force table to not be like tables anymore */
    #mes-diplomes table, #mes-diplomes thead, #mes-diplomes tbody, #mes-diplomes th, #mes-diplomes td, #mes-diplomes tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    #mes-diplomes thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    #mes-diplomes  tr { border: 1px solid #ccc;  margin-bottom: 20px;}
    #mes-diplomes td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
    }
    #mes-diplomes td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: wrap;
    }
    #mes-diplomes td:nth-of-type(1):before { content: "#"; }
    #mes-diplomes td:nth-of-type(2):before { content: "Niveau"; }
    #mes-diplomes td:nth-of-type(3):before { content: "Diplôme"; }
    #mes-diplomes td:nth-of-type(4):before { content: "Année"; }
    #mes-diplomes td:nth-of-type(5):before { content: "Actions"; }



    /* EXPERIENCES */
    /* Force table to not be like tables anymore */
    #mes-experiences table, #mes-experiences thead, #mes-experiences tbody, #mes-experiences th, #mes-experiences td, #mes-experiences tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    #mes-experiences thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    #mes-experiences  tr { border: 1px solid #ccc;  margin-bottom: 20px;}
    #mes-experiences td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
    }
    #mes-experiences td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: wrap;
    }
    #mes-experiences td:nth-of-type(1):before { content: "#"; }
    #mes-experiences td:nth-of-type(2):before { content: "Secteur d'activité"; }
    #mes-experiences td:nth-of-type(3):before { content: "Poste"; }
    #mes-experiences td:nth-of-type(4):before { content: "Entreprise"; }
    #mes-experiences td:nth-of-type(5):before { content: "Années"; }
    #mes-experiences td:nth-of-type(5):before { content: "Actions"; }

    /* MES PREFERENCES */
    /* Force table to not be like tables anymore */
    #wishlist table, #wishlist thead, #wishlist tbody, #wishlist th, #wishlist td, #wishlist tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    #wishlist thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    #wishlist  tr { border: 1px solid #ccc;  margin-bottom: 20px;}
    #wishlist td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
    }
    #wishlist td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: wrap;
    }
    #wishlist td:nth-of-type(1):before { content: "#"; }
    #wishlist td:nth-of-type(2):before { content: "Poste"; }
    #wishlist td:nth-of-type(3):before { content: "Type"; }
    #wishlist td:nth-of-type(5):before { content: "Actions"; }
}


@media (min-width: 480px) and (max-width: 1024px) {
    
}

@media (max-width: 480px) {
    #section_register.inscription{
        padding: 0px;
    }
    #section_register.inscription .left{
        padding: 0px;
    }

    #section_register.inscription #sendform_btn{
        display: none;
    }
    #section_register.inscription #sendform_btn_small{
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #section_register.inscription .alert {
        margin: 0px 0px 20px 0px;
    }
    #section_register.inscription #sendform_btn {
        word-break: break-word;
    }
    #section_register.inscription .s_frame{
        margin-left: 0px;
        margin-right: 0px;
        padding: 20px 15px;
    }

    #section_register.inscription .help-block.form-error{
        padding: 0px 15px;
    }

    #mon_espace .header {
        flex-direction: column;
        align-items: center;
        height: auto;
    }
    
    #mon_espace .header > * {
        order: 1;
    }
    
    #mon_espace .header figure {
        order: 0;
    }
    
    #mon_espace ul.nav li {
        width: 100%;
    }
    
    #mon_espace ul.nav li a {
        font-size: 18px;
        padding: 10px;
    }
    
    #mon_espace .tab-pane .content_tab {
        min-height: 200px;
    }
    
    #mon_espace ul#dashboard li {
        width: 100%;
    }

}