/** General **/
/* #### Generated By: http://www.cufonfonts.com #### */

@font-face {
    font-family: 'GeosansLight';
    font-style: normal;
    font-weight: normal;
    src: local('GeosansLight'), url('../font/GeosansLight.woff') format('woff');
}
@font-face {
    font-family: 'Geo_bold';
    font-style: normal;
    font-weight: normal;
    src: local('Geo_bold'), url('../Geo_bold.ttf') format('ttf');
}

@font-face {
    font-family: 'GeosansLight-Oblique';
    font-style: normal;
    font-weight: normal;
    src: local('GeosansLight-Oblique'), url('../font/GeosansLight-Oblique.woff') format('woff');
}body{
    font-family: 'GeosansLight', sans-serif;
    color : #395062;
}

/***  Header  ****/

/*** NavBar ***/

.logo_cab_expeo{
    position: relative;
    z-index: 1031;
}
a:hover{
    color: #F6E2E2;
}
.nav-link.active{
    border-bottom: 3px solid #F6E2E2;
    padding-bottom: 0;
    font-weight: bolder;
    color: #395062!important;
    font-family: 'Geo_bold', sans-serif;
}
.nav-link:hover{
    font-family: 'Geo_bold', sans-serif;

}
.navbar-light .navbar-nav .nav-link{
    color: #395062!important;
}
.nav-link:hover:not(.active) {
    font-weight: 500!important;
}
header > .navbar > .container-fluid{
    width: 80%;
}
header{
    height: 10vh;
    margin: auto;
    background-color: #F2F2F2;
    position: sticky;
    top: 0;
    z-index: 15;
}
.navbar{
    font-size: 14px;
    color: #395062;
    height: inherit;
    margin: auto;
    padding: unset;
    z-index: 1030;
}
a.dropdown-item{
    font-size: 14px;
    color: #395062;
}
.navbar-brand{
    padding: unset;
    margin-left: 10%;
}
.logo_cab_expeo{width: fit-content;}
.dropdown-menu{
    background-color: #F2F2F2;
}
.navbar-collapse{
    flex-grow: unset;
    margin-right: 10%;
}
body > header > nav > div{
    background-color: #F2F2F2;
}
.collapse>ul{
    padding-left: 5%;
}
.navbar-toggler{margin-right: 10%}
.collapse> ul > li > a{
    width: max-content;
}
.dropdown-menu{
    border: unset;
}
.navbar-brand>img{
    height: 20vh;
    position: absolute;
    top: 0;
    left: 0;
}
header{
    padding-bottom: 5%;
}
/** HomePage **/



.carouselHome,#juriexpert{
    height: 100vh;
}
span{
    font-family: 'Geo_bold', sans-serif;
}
h1{
    font-family: "Geo_bold", sans-serif;
}

.carousel-caption{
    bottom: unset;
    top: 15%;
    color: #F2F2F2;
    left: 5% !important;
    right: 5% !important;
    height: 80vh;

}
.carousel-caption>p{
    font-size: 30px;
    width: 50%;
    text-align: left;
    font-weight: 500;
    float: right;
    margin-top: 10%;
}
.carousel-caption>h1{
    font-size: 45px;
    font-weight: bolder;
    border-bottom: solid 3px  #395062;
    width: fit-content;
}
.carouselHome>.carousel-item>img{
    filter: brightness(0.5);
}
.carousel-caption>div{
    margin-top: 5%;
}
#valeurs > div > div.valeur_logo_container > div:nth-child(2) > h4{
    margin-top: -13%;
}
/** Text Effect **/
.title-effect{
    display:inline-block;
    overflow:hidden;
    white-space:nowrap;
    font-size: 4.5rem;
    font-weight: 500;
    text-align: left;
    float: left;
}

.title-effect:first-of-type {
    animation: showup 8s 1;
}

.title-effect:last-of-type {

    animation: reveal 8s 1;
}
.title-effect:nth-of-type(2){
    display: flex;
}
.title-effect:last-of-type span {

    animation: slidein 8s 1;
}
section > .carousel-caption > p{
    position: absolute;
    animation: revealP 3s 1;
    bottom: 20%;
    font-size: 1.5rem;
    right: 5%;
}
@keyframes showup {
    0% {opacity:0;}
    20% {opacity:1;}
    80% {opacity:1;}
    100% {opacity:1;}
}

@keyframes slidein {
    0% { margin-left:-800px; }
    20% { margin-left:-800px; }
    35% { margin-left:0px; }
    100% { margin-left:0px; }
}

@keyframes reveal {
    0% {opacity:0;width:0px;}
    20% {opacity:1;width:0px;}
    30% {width:800px;}
    80% {opacity:1;}
    100% {opacity:1;width:800px}
}
@keyframes revealP {
    0%{opacity: 0}
    79%{opacity: 0;}
    100%{opacity: 1}
}
section{
    height: 100vh;
}
/** subtitle definition **/

.sub_title{
    font-size: 3rem;
    margin-bottom: 2%;
}
.sub_title.right{
    text-align: right;
    margin-right: 10%;
}
.sub_title.left{
    text-align: left;
    margin-left: 10%;
}
.sub_title>span{
    font-size: 3rem;
    color: #F6E2E2 ;
    text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5), 2px 2px 2px rgba(206,89,55,0);
}
/**
description
 */
.description_text{
    background-color: #F2F2F2;
    width: 50%;
}
#description{
    display: flex;
    flex-direction: row-reverse;
    width: 90%;
    margin: auto;
    padding: 5%;
    padding-top: 10%;
}
#description > div.description_img > img    {
    width: 100%;
    margin-left: 10%;
}
#description > div.description_img{
    width: 40%;
}
#description > div.description_text> *{
    padding: 5%;
}

#description > div.description_text> div>p{
    margin-top: 2%;
    font-size: 1.2rem;
}
#description > div.description_text>h1{
    font-size: 2.4rem;
}
#description > div.border_animate_box.description_text > div > h1{
    white-space: nowrap;
    font-size: 2rem!important;
}
/** Section juriexpert **/
.bckgnd_juriexpert>img,.log_juriexpert>a>img{
    width: 100% ;
}
.bckgnd_juriexpert{
    background-image: url("../image/AdobeStock_90886251.jpeg");
    background-size: cover;
    filter: brightness(0.5);
    height: 100vh;
}
.caption_juriexpert{
    width: 50%;
    margin: auto;
    z-index: 1;
    position: absolute;
    left: 50%;
    margin-left: -25%;
    padding-top: 5%;
}
.caption_juriexpert>a{
    border-radius: 26.4px;
    font-size: 1.8rem;
    margin-left: 35%;
    width: 30%;
    margin-top: 5%;
}
.caption_juriexpert>h2{
    font-size: 5rem;
    color: white;
    text-align: center;
    margin-top: 5%;
}
.log_juriexpert{
    width: 50%;
    margin: auto;
}
/** Valeur Section **/
#valeurs{
    padding-top: 5%;
}
#valeurs>h1{
    text-align: right;
    font-size: 3rem;
    margin-right: 10%;
    margin-bottom: 2%;
}
#actualites>h1{
    text-align: left;
    font-size: 3rem;
    margin-left: 10%;
    margin-bottom: 2%;
}
#valeurs>h1>span, #actualites>h1>span{
    font-size: 3rem;
    color: #F6E2E2 ;
    text-shadow: -1px -1px 1px rgb(255 255 255 / 10%), 1px 1px 1px rgb(0 0 0 / 50%), 2px 2px 2px rgb(206 89 55 / 0%);
}
.no-decoration,.no-decoration:visited,.no-decoration:hover,.no-decoration:focus{
    color: unset;
    text-decoration: none;
}
.valeur_logo_container,.service_logo_container{
    display: flex;
    justify-content: space-evenly;
}
.valeur_logo,.service_logo{
    width: 20%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.service_logo>img{
    width: 100%;
    margin: auto;
}
.valeur_logo>img{
    width: 100%;
}
.valeur_logo>h4, .service_logo>h4{
    text-align: center;
}

.valeur_text{
    background-color: #F2F2F2;
    border-radius: 5px;
    width: 80%;
    margin: auto;
    margin-top: 5%;
    padding: 2%;
    margin-bottom: 5%;
}
.valeur_text>h2{
    font-family: 'Geo_bold', sans-serif;
}
.valeur_text>p{
    font-size: 1.4rem;
}
#actualites > div:nth-child(3) > button{
    width: 10%;
    margin-left: 45%;
}
#actualites > div:nth-child(3) > button>a{
    color: unset;
}
#actualites {
    margin-bottom: 5%
}
.border_animate_box_light>.border_animate_1 {
    top: 0;
    left: 0;
    border-top: 1px solid #3d5264;
    border-left: 1px solid #3d5264;
    width: 100px;
    height: 100px;
}

.border_animate_box_light>.border_animate_2{
    bottom:0;
    right:0;
    border-right:1px solid #3d5264;
    border-bottom:1px solid #3d5264;
    width:100px;
    height:100px;
}
.border_animate_box_light{
    position: relative;
}
.border_animate_box_light:hover .border_animate_1,.border_animate_box_light:hover .border_animate_2{
    width:102%;
    height:105%;
}
.border_animate_box_light:hover{
    background-color: #F2F2F2;
}
body > div.scroll_container > div.row.article_container > div> div > div > a,body > div.scroll_container > div.row.article_container > div > div > div> div.card-body,#actualites > div.row.article_container > div > div > div > a,body > div.scroll_container > div.row.article_container > div.col-md-10 > div > div > a,body > div.scroll_container > div.row.article_container > div.col-md-10 > div > div > div.card-body,#actualites > div.row.article_container > div > div > div > div.card-body{
    z-index: 5;
}
/**Blog */
.article_container{
    width: 90%;
    margin: auto;
}
.card{
    max-width: 31% !important;
    margin: 1%;
}
article{
    margin-bottom: 10%;
}
.list-group>a{
    color: #395062;
    text-decoration: none;
}
body > article > div:nth-child(2) > div{
    margin-top: 5%;
}
body > article > div:nth-child(1) > div > p > img{
    max-width: 100%;
}
.list-group{
    width: 100%;
}
.article_container{

    margin-bottom: 5%;
}
/*** Scroll Snap effect **/
/*.scroll_container{*/

/*    overflow: scroll;*/
/*    height: 100vh;*/
/*    scroll-snap-type: y mandatory;*/
/*    scroll-snap-points-y: repeat(100vh);*/
/*    overflow-x: hidden;*/

/*}*/


/*section {*/
/*    height: 100vh;*/
/*    scroll-snap-align: center;*/
/*    position: relative;*/
/*}*/
#border_animate_box{
    position: relative;
}
.border_animate_1, .border_animate_2{
    position:absolute;
    background:none;
    transition:all .5s ease-in-out;
}


.border_animate_box>.border_animate_1{
    top:0;
    left:0;
    border-top:3px solid #3d5264;
    border-left:3px solid #3d5264;
    width:100px;
    height:100px;
}
.border_animate_box>.border_animate_2{
    bottom:0;
    right:0;
    border-right:3px solid #3d5264;
    border-bottom:3px solid #3d5264;
    width:100px;
    height:100px;
}
.border_animate_box{
    position: relative;
}
.border_animate_box:hover .border_animate_1,.border_animate_box:hover .border_animate_2{
    width:102%;
    height:105%;
}
/** Service Page **/
.service{
    margin-bottom: 5%;
}

.activites{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
}
.activites>div{
    width: 30%;
}
/** Login /register **/
#contact > form > button.btn.btn-outline-danger > a{
    color: unset;
}
/**Outil travail page **/
#outils_travail,#actualites,.actualite,.service>h1{
    padding-top: 10%;
}
.outil{
    width: 80%;
    display: flex;
    flex-direction: row;
    padding-bottom: 5%;
    margin: auto;
}
.outil>div:nth-child(1){
    width: 50%;
}
.outil>div:nth-child(1)>img{
    width: 100%;
}
.outil>div:nth-child(2){
    left: -4%;
    margin-top: 10%;
}
h5 {
    font-size: 1.75rem;
}
/** Footer **/
footer{
    background-color: #F2F2F2;
    display: flex;
    justify-content: space-evenly;
    padding-top: 4%;
}
.menu_reminder, .menu_reminder>li{
    list-style: none;
}
.menu_reminder>li>a{
    color : #395062;
}
.menu_reminder{
    padding-left: 0;
}
.menu_reminder>li>a:hover{
    font-family: 'Geo_bold', sans-serif;
}
footer>div>div>i{
    display: flex!important;
}
footer>div>div>i>p{
    font-family: GeosansLight;
    margin-left: 3%;
    white-space: nowrap;
}
/** Contact Vue **/
.contact_box{
    background: #F2F2F2;
}
.contact_content{
    display: flex;
}
#contact{
    margin: auto;
    width: 50%;

}
.border_animate_box.contact_box{
    width: 80%;
    margin-top: 4%;
    padding: 5%;
}
.contact-form{
    position: relative;
    z-index: 5;
}
#contact > div > div:nth-child(2){
    margin-left: -20%;
    width: 80%;
}
#contact > div > div:nth-child(2)>img{
    width: 100%;
}
.contact_box>h2,.contact_box>p{
    text-align: center;
}
.contact_content{
    padding-bottom:5%;
}
.contact_btn{
    width: 30% ;
    margin-left: 35%;
}
.alert{
    margin-top: 10%;
}
/** Vue Mobile **/
@media all and (max-device-width: 480px)
{
    .article_body{
        font-size: 2rem!important;
    }
    .carousel>.carousel-caption>div{
        margin-top: unset;
    }
    .navbar-brand>img {
        height: 15vh;
    }

    .navbar{
        font-size: 35px;
    }
    a.dropdown-item{
        font-size: 28px;

    }
    section, .carouselHome{
        height:fit-content;
    }
    .navbar-toggler-icon{
        width: 3em;
        height: 3em;
        font-weight: bolder;
        color: #395062;
    }
    .navbar-toggler{
        border: unset;
    }

    #description > div.description_text>div>h1 {
        font-size: 4.4rem!important;
    }
    #description > div.description_text> div>div>span {
        font-size: 3rem!important;
    }
    #description > div.description_text> div>div>p {
        font-size: 2.2rem!important;
    }
    #description > div.border_animate_box.description_text > div > h1{
        white-space: nowrap;
    }
    body > section > .carousel-caption > p {
        font-size: 2rem!important;
        width: 100%!important;
    }
    div .title-effect{
        font-size: 3.5rem;
    }
    section .carousel-caption{
        height: auto;
    }
    section > .carousel-caption > p {
        position: relative;
        width: 80%;
        font-size: 2.75rem;
    }
    .title-effect:nth-of-type(2){
        width: 80%;
    }
    body #description > div.description_img > img{
        margin-left: 0;
        width: 100%;
    }
    body #description > div.description_img{
        width: 60%;
    }
    body #description{
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
    }
    section .description_text{
        background-color: #F2F2F2;
        width: 100%;
        margin-top: -5%;
    }
    div .valeur_logo>img, div .service_logo>img{
        width: 80%;
    }
    div .valeur_logo>h4, div .service_logo>h4 {
        font-size: 2rem;
    }
    body #valeurs>h1>span, body #valeurs>h1 {
        font-size: 4rem;
    }
    .valeur_text{
        margin-bottom: 5%;
    }
    #valeurs > div > .valeur_text > div > p{
        font-size: 2rem;
    }
    #valeurs > div > .valeur_text > div > h2{
        font-size: 2.5rem;
    }
    div .menu_reminder,.menu_contact{
        font-size: 1.7rem;
    }
    .google_map{
        display: none;
    }
    body > header > nav > .navbar-toggler{
        position: absolute;
        right: 0;
        z-index: 11;
        top: 10%;
    }
    #navbarTogglerDemo02{
        position: relative;
        flex-basis: 40%;
        padding-top: 15%;
        margin-right: unset;
    }
    #outils_travail,#actualites,.actualite,.service>h1{
        padding-top: 10% !important;
    }
    .row>.card {
        margin: 1%;
        max-width: unset!important;
    }
    .col-sm-5 {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667% !important;
        max-width: 41.666667% !important;
    }
    .col-sm-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333% !important;
        max-width: 33.333333%!important;
    }
    .col-sm-8 {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667% !important;
        max-width: 66.666667% !important;
    }
    .card-body{
        font-size: 1.5rem!important;
    }
    #actualites > div:nth-child(3) > button {
        width: 30% !important;
        margin-left: 35%!important;
        font-size: 2rem;
    }
    .scroll_container> #description > div.border_animate_box.description_text > div > h1{
        white-space: break-spaces;
    }
    p ,li {
        font-size: 2rem;
    }
    h2{
        font-size: 2.5rem;
    }
    #service_activite>.activites{
        flex-direction: column;
    }
    #service_activite>.activites>div{
        width: 80%;
    }
}
/**Vue Tablette **/
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px){
    .row>.card {
        margin: 1%;
        max-width: unset!important;
    }
    .article_body{
        font-size: 2rem!important;
    }
    .title-effect{
        font-size: 4rem;
    }
    #description{
        flex-direction: column-reverse;
        align-items: center;
    }

    .description_text{
        width: 100%;
    }
    .description_img{
        width: 50%;
        margin-bottom: 5%;
        margin-top: 0!important;
    }
    .description_img>img{
        margin-top: 0!important;
        margin-left: 0!important;
    }
    section{
        height: auto;
    }
    .carouselHome, #juriexpert{
        height: auto;
    }
    section .carousel-caption>p {
        position: relative;
        font-size: 30px;
        left: 20%;
        width: 60%;
        float: unset;
        bottom: unset;
    }
    body > header > nav > .navbar-toggler{
        position: absolute;
        right: 0;
        z-index: 11;
        top: 10%;
    }
    #navbarTogglerDemo02{
        position: relative;
        flex-basis: 30%;
        padding-top: 5%;
        margin-right: unset;
    }
    #outils_travail,#actualites,.actualite,.service>h1 {
        padding-top: 15%;
    }
    h2{
        font-size: 2.5rem;
    }
    h4{
        font-size: 2rem;
    }
    p, li{
        font-size: 1.7rem;
    }
    #sercice_activite > div > div{
        width: 80%;
    }
    .activites{
        flex-direction: column;
    }
    .service_logo_container{
        padding-top: 7%;
    }
    .google_map{
        display: none;
    }
    #outils_travail {
        padding-top: 15%;
    }

    #outils_travail > div > div.valeur_text{
        width: 100%;
        margin-top: -10%;
    }
    #outils_travail > div > div:nth-child(1){
        width: 100%;
    }
    #outils_travail > .outil{
        flex-direction: column;
    }
    #contact > h1{
        padding-top: 17%;
    }
    #contact > div > div:nth-child(2){
        display: none;
    }
    .contact_content>.contact_box{
        width: 100%;
    }
    #contact>h1{
        padding-left: 17%;
    }
    #service_activite>.activites{
        flex-direction: column;
    }
    #service_activite>.activites>div{
        width: 80%;
    }
}
