html {
  scroll-behavior: smooth;
}
body {
    background-color: #F5F5F5;
}
#navigation {
    background-color: #E5E5E5;
    z-index: 1;
}
.logo {
    width: 125px;
}

.navbar-brand, .nav-link  {
    font-size: 1.2rem;
    color: #4D4D4D;
}

.navbar-brand:hover, .nav-link:hover {
    text-decoration: underline;
    color: #FF9000;
}
.photo_profil_nav {
    position:absolute;
    width:32px;
    height:32px;
    border-radius:50%
}
.caret {
    margin-left: 2rem;
}

/* Form element */
.nav-btn {
    display: block;
    background-color: transparent;
    color: #FF9000;
    border: 1px solid #FF9000;
    /*font-size: 1rem;*/
    padding: .375rem .75rem;
    line-height: 1.5;
}
.nav-btn:hover {
    text-decoration: none;
    background-color: #FF9000;
    color: #FFFFFF;
    border-width: 0px;
}
.btn-custom {
    background-color: #FF9000;
    color: #FFFFFF;
    padding: .375rem .75rem;
    /*font-size: 1rem;*/
    line-height: 1.5;
    border-radius: .25rem;
}
.btn-red {
    background-color: #FFFFFF;
    color: #ff0000;
    padding: .375rem .75rem;
    font-size: 1.2rem;
    line-height: 1.5;
    border-radius: .25rem;
}
.btn-custom:hover {
    background-color: #F3A202;
    border-color: #EE9F05;
    color: #FFFFFF;
}
.btn:focus {
    outline: 0;
    box-shadow: 0 0 0 .2rem #f3a30246;
}
.btn-outline-custom {
    background-color: none;
    color: #FF9000;
    border: 1px solid #FF9000;
    padding: .375rem .75rem;
    /*font-size: 1rem;*/
    line-height: 1.5;
    border-radius: .25rem;
}
.btn-outline-custom:hover {
    background-color: #FF9000;
    border-color: #FF9000;
    color: #FFFFFF;
}
.btn-outline-custom2 {
    background-color: #FF9000;
    color: #FFFFFF;
    border: 1px solid #FFFFFF;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
}
.btn-outline-custom2:hover {
    background-color: #FFFFFF;
    border-color: #FFFFFF;
    color: #FF9000;
}
.form-control {
    border: 0px;
    border-bottom: 1px solid #707070;
}

.main-content {
    padding: 2rem
}

.content-title {
    font-size: 2rem;
    margin-bottom: 20px;
}
.profil-head {
    padding: 4rem 8rem;
    background-color: #F5F5F5;
}

.profil-img {
    width: 320px;
    height: 180px;
    background-color: #D8D8D8;
}

.profil-name {
    font-family: 'Roboto';
    font-size: 2.1rem;
    font-weight: 600
}
.profil-btn-container {
    position: absolute;
    right: 0;
    top: 0;
}

.profil-email {
    font-family: 'Sylfaen';
    margin-top: -10px;
    font-size: 1.25rem;
    color: #5BA8E4;
    margin-bottom: 20px
}

.profil-body {
    padding: 4rem 6rem;
    background-color: #FFFFFF;
}
.profil-body div .item {
    margin-bottom: 1rem;
}
.profil-description {
    font-size: 1rem;
    color: #5D5D5D
}

.number {
    font-size: 1.75rem
}

.subtitle {
    color: #5D5D5D;
}
.show-head-image {
    height: 140px;
    background-color: #C4C4C4;
}
.show-middle-container {
    background-color: #fff;
    padding: 1rem 1rem;
    margin-top: 1rem;
}

.show-title {
    font-family: 'MADE Evolve Sans';
    font-size: 2rem;
}
.show-head-entreprise {
    font-size: 1rem;
    font-weight: bold;
    color: #FF9000
}
.show-head-lieu {
    font-size: .8rem;
    color: #8F8F8F;
}

.btn-postule {
    font-size: 1.4rem
}
.show-btn-postule {
    position: absolute;
    bottom: 0;
    right: 15px;
}
.show-btn-postule .btn-outline-custom {
    font-size: 1.2rem;
    border-width: 2px;
}
.show-resume {
    margin-top: 4rem;
    margin-bottom: 2rem;
}
.show-resume .list {
    list-style: none;
}
.show-resume .list .item {
    margin-bottom: 1rem;
    border-bottom: 1px solid #C4C4C4;
}
.show-resume .list .item .text {
    font-size: 1.2rem;
}
.show-resume .list .item .value {
    font-size: 1.2rem;
    color: #606060;
    float: right;
}
.button_share {
    float: right;
    margin-top: 1rem;
    font-size: 1.4rem;
}
.button_share a {
    margin-left: 10px;
}
.button_share a i {
    font-size: 1.4rem;
}

.lil-title{
    font-weight: bold;
    font-size: 1.6rem;
}
.description {
    color: #333333;
}
.resume-title {
    color: #646464
}
.show-description-trait {
    width: 7%;
    background-color: #333333;
    height: 4px;
    margin-bottom: .8rem;
}
.description-content, .resume {
    line-height: 1.5;
    /*margin-top: 2rem*/
}
.show-end {
    display: flex;
    flex-wrap: wrap;
    margin-top: 2rem;
    margin-bottom: 4rem;
}
.show-end .item {
    margin-right: 1.4rem;
}
.show-end div .text {
    font-size: 1.2rem;
}
.show-end div .value {
    font-size: 1.2rem;
    color: #606060;
}

/* Postuler */
.postuler-container {
    padding: 35px;
    background-color: #ECECEC;
    border: 1px solid #E5E5E5;
    border-radius: 7px;
    margin-top: 30px;
    margin-bottom: 30px
}
.form-title {
    text-align: center;
    font-size: 1.8rem;
    font-weight: 400;
}
.domaine-title {
  font-weight: bold;
  color: #cb6b13;
}
.identifier {
    text-align: center
}
.identifier-word {
    font-size: 1.4rem;
    font-weight: 200;
    margin-bottom: 1rem;
}
.btn-modif-profil {
    float: right;
}
.search-bar-content {
    display: flex;
    justify-content: center;   
}
/* FOOTER */
footer {
    line-height: 2;
    color: #FCFCFC;
}
.footer-item{
    margin: 0px 15px;
}
.footer-haut {
    padding: 2rem 4rem;
    background-color: #858585;
}
.footer-bas {
    background-color: #4B4B4B;
    padding: 0.5rem;
    text-align: center;
}
.oumar:hover {
     color: #fff;
}

.img-social-media {
    width: 25px;
    height: 25px;
    display: inline;
}
.media-link {
    margin-left: .4rem;
}
.form-item {
    margin-top: 1.5rem;
}
/* Liste offre */
.offre-block-number {
    font-size: 4rem;
    margin: 1rem 0rem;
    font-family: "Segoe UI";
    box-shadow: 0px 0px 4px 2px #00000031;
}
.offre-block-number-up {
    background-color: #F5FFFF;
}
.offre-block-number-word {
    padding: 1rem 2rem;
    font-weight: bold;
}
.offre-block-number-icon {
    font-size: 5rem;
    padding: 1rem 2rem;
    background-color: #E1FFFE;
}
.offre-block-number-down {
    padding: 1rem 2rem;
    background-color: #FFF;
}

/* View Tablette -- Medium devices (tablets, 768px and up) */

@media (max-width: 991px) { 

    /* Navigation */
    .logo {
        width: 90px;
    }

    /* Detail Opportunite */
    .show-title {
        font-size: 1.2rem;
    }
    .show-head-entreprise {
        font-size: .8rem
    }
    .show-description-trait {
        width: 12%;
    }
    .show-btn-postule .btn-outline-custom {
        font-size: 1rem;
    }
    .show-resume .list .item .text, .show-resume .list .item .value {
        font-size: 1rem;
    }
    .show-end {
        margin-top: 1rem;
    }
    .show-end div .text, .show-end div .value {
        font-size: 1rem;
    }
    .lil-title {
        font-size: 1.2rem;
      }

    /* Detail User */
    .profil-img {
        height: 200px;
    }
    .profil-name {
        font-size: 1.8rem;
    }
    .profil-email {
        font-size: 1.1rem;
    }
    .main-content {
        padding: 1rem
    }
    .content-title {
        font-size: 1.6rem;
    }
    .offre-block-number {
        font-size: 2rem;
    }
    .offre-block-number-icon {
        font-size: 3rem;
    }
    .offre-block-number-word {
        padding: .5rem .5rem;
    }

    /* PROFIL */
    .profil-head {
        padding: 2rem 4rem
    }
    .profil-body {
        padding: 2rem 4rem
    }
}

@media (max-width: 567px) {
    
    .content-title {
        font-size: 1.4rem;
        margin-bottom: 10px;
    }
    .btn-custom {
        padding: .3rem .5rem;
        font-size: 1rem;
        line-height: 1.2;
    }
    .show-head-image {
        height: 90px
    }
    .show-middle-container {
        padding: .6rem;
        margin-top: .6rem;
        margin-left: -15px;
        margin-right: -15px;
    }
    .show-title {
        font-size: 1.2rem;
    }
    .show-description-trait {
        width: 18%;
    }
    .show-btn-postule .btn-outline-custom {
        font-size: .8rem;
    }
    #diplome{
        margin-top: 0.5rem;
    }
    #filtre-btn {
        margin-top: 0.5rem;
        margin-left: 5px;
        margin-right: auto;
    }
    .form-item {
        margin-top: .5rem;
    }
    .entreprise-detail-offres-title {
        font-size: 1.2rem;
    }
    .offre-title {
        font-size: 1.2rem;
    }
    .offre-block-number {
        font-size: 2rem;
    }
    .offre-block-number-icon {
        font-size: 3rem;
        padding: .5rem 1rem;
    }
    .offre-block-number-word {
        padding: .5rem .5rem;
    }
    .offre-block-number {
        font-size: 1.4rem;
    }
    .offre-block-number-down {
        padding: .5rem 1rem;
    }
    /* Detail opportunite */
    .show-head-container {
        /*height: 200px;*/
    }
    .show-title {
        font-size: 1.4rem;
    }
    .lil-title {
        font-size: 1.2rem;
    }
    .description-content, .resume {
        margin-top: 1rem;
    }
    /* PROFIL */
    .postuler-container {
        padding: 35px;
    }
    .profil-btn-container {
        position: relative;
    }
    .profil-img {
        width: 100%;
    }
    .btn-modif-profil {
        float: left;
        margin-top: .5rem;
    }
    .search-bar-content {
        display: block;
    }
    .profil-name {
        display: flex;
    }
    .profil-email {
        margin: auto;
    }
    .profil-head {
        padding: 1rem 1rem
    }
    .profil-body {
        padding: 1rem 1rem
    }
    .profil-name {
        font-size: 1.2rem
    }
}