@font-face {
    font-family:"Roboto-Black";
    src: url("../ressources/fonts/Roboto-Black.ttf");
}
@font-face {
    font-family:"Roboto-Bold";
    src: url("../ressources/fonts/Roboto-Bold.ttf");
}
@font-face {
    font-family:"Roboto-Medium";
    src: url("../ressources/fonts/Roboto-Medium.ttf");
}
@font-face {
    font-family:"Roboto-Regular";
    src: url("../ressources/fonts/Roboto-Regular.ttf");
}
body{
    margin: 0;
    padding: 0;
}
.container{
    position: relative;
    width: 1215.35px;
    margin: auto;
    padding-top: 20px;
}

/* Naviguation principale */    /* Naviguation principale */
/* Naviguation principale */    /* Naviguation principale */
.container .nav-bar{
    position: sticky;
    width: 90%;
    top: -1px;
    line-height: 90px;
    margin-bottom: 10px;
    padding: 0 60.775px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: white;
    transition: all 500ms;
    z-index: 2;
    /* border: 1px solid black; */
}
.container .nav-bar .main-links{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 85%;
    z-index: 1;
    background: white;
    /* border: 1px solid black; */
}
.container .nav-bar .other-links{
    display: flex;
    align-items: center;
}
.container .nav-bar .main-links .logo, 
.container .trans-part .logo {
    width: 100px;
    object-fit: cover;
    /* border: 1px solid black; */
}
.container .nav-bar .main-links .logo a img,
.container .trans-part .logo a img{
    width: 100%;
    height: 100%;
}
.container .nav-bar .main-links .links{
    width: 80%;
    display: flex;
    justify-content: space-around;
    /* border: 1px solid black; */
}
.container .nav-bar .main-links .links a,
.container .nav-bar .other-links a{
    font-family: 'Roboto-Bold';
    font-size: 15px;
    line-height: 30px;
    text-transform: capitalize;
    text-decoration: none;
    color: black;
    transition: all 250ms;
}
.container .nav-bar .main-links .links a.active,
.container .nav-bar .other-links a.active{
    font-family: 'Roboto-Black' !important;
    opacity: 1 !important;
    border-bottom: 3px solid black;
    font-size: 15px !important;
}
.container .nav-bar .main-links .links a:hover,
.container .nav-bar .other-links a:hover{
    font-family: 'Roboto-Black';
    font-size: 17px;
    transition: all 250ms;
    opacity: 0.6;
}

/* Naviguation principale */    /* Naviguation principale */
/* Naviguation principale */    /* Naviguation principale */

/* Naviguation du mobile */
.nav-bar-mobile-part{
    display: none;
}
/* Naviguation du mobile */


/* Burger */    /* Burger */    /* Burger */    /* Burger */
/* Burger */    /* Burger */    /* Burger */    /* Burger */
.burger{
    width: 33px;
    height: 33px;
    /* background-color: black; */
    display: none;
    cursor: pointer;
    position: relative;
    margin-bottom: 5px;
    margin-right: 0;
    z-index: 9;
}
.burger span{
    width: 100%;
    height: 3px;
    background-color: black;
    display: block;
    position: absolute;
    top: 50%;
    border-radius: 30px;
    transform: translateY(-50%);
    background-color: transparent;
}
.burger span::before,.burger span::after{
    content : '';
    position: absolute;
    width: 100%;
    height: 3px;
    border-radius: 20px;
    background-color: black;
    transition: 0.5s ease-in-out;
}
.burger span::before{
    transform: translateY(-6px);
}
.burger span::after{
    transform: translateY(6px);
}

.burger.active span::before{
    transform: translateY(0) rotate(-45deg);
}
.burger.active span::after{
    transform: translateY(0) rotate(45deg);
}

/* Burger */    /* Burger */    /* Burger */    /* Burger */
/* Burger */    /* Burger */    /* Burger */    /* Burger */


/* Sliders */   /* Sliders */   /* Sliders */
/* Sliders */   /* Sliders */   /* Sliders */

.container .slide-container{
    width: 100%;
    height: 450px;
    display: flex;
    /* border: 1px solid black; */
}
.container .slide-container .btn{
    width: 5%;
    height: 450px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.container .slide-container .sliders{
    position: relative;
    width: 90%;
    height: 450px;
    /* border: 1px solid black; */
}
.container .slide-container .slide{
    width: 100%;
}
.container .slide-container .slide .slide-element
{
    width: 100%;
    height: 450px;
    display: none; 
}

.container .slide-container .slide .slide-element img{
    width: 60%;
    float: right;
    height: 100%;
    object-fit: cover;
}
/* Sliders */   /* Sliders */   /* Sliders */
/* Sliders */   /* Sliders */   /* Sliders */



/******* Photographie vidéo *******/
/******* Photographie vidéo *******/
/******* Photographie vidéo *******/
.photo-video{
    margin-top: 50px;
}
.nos-competences-photo-video{
    padding-bottom: 30px !important;
}
/******* Photographie vidéo *******/
/******* Photographie vidéo *******/
/******* Photographie vidéo *******/



/******* Numérique **********/
/******* Numérique **********/
/******* Numérique **********/

.container .slide-container .slide .numerique
{
    width: 85%;
    margin: auto;
    height: 450px;
    display: flex;
    justify-content: space-around;
    /* border: black solid 1px; */
}
.container .slide-container .slide .numerique .image{
    width: 50%;
    /* border: solid black 1px; */
    line-height: 100%;
    overflow: hidden;
    text-align: center;
}
.container .slide-container .slide .numerique .image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    animation: fade 1.5s;
}

.container .slide-container .slide .numerique .text-inside-image{
    width: 55%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    /* align-content: center; */
    flex-direction: column;
}
.container .slide-container .slide .numerique h2{
    font-family: 'Roboto-Black';
    font-size: 40px;
    color: black;
    margin-bottom: 10px;
}

/* Nos Compétences numérique */
.offers-content-numerique{
    width: 100%;
}
.offers-container .offers-content-numerique .offers-part-numerique .offers{
    width: 100%;
    /* border: 1px solid black; */
    display: flex;
    justify-content: space-between;
}
.offers-container .offers-content-numerique .offers-part-numerique .offers .offer{
    /* width: 20%; */
    /* border: 1px solid red; */
}
.offers-container .offers-content-numerique .offers-part-numerique .offers .offer .image{
    width: 230px;
    height: 230px;
    /* border: 1px solid black; */
    border-radius: 50%;
}
.offers-container .offers-content-numerique .offers-part-numerique .offers .image img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}
.offers-container .offers-content-numerique .offers-part-numerique .offers .image-title{
    /* width: 90%; */
    /* border: 1px solid black; */
    margin: 20px auto 20px;
    text-align: center;
}
.offers-container .offers-content-numerique .offers-part-numerique .offers .image-title h4{
    font-family: 'Roboto-medium';
    font-size: 14px;
    margin: 0;
}

/******** Numérique ********/
/******** Numérique ********/
/******** Numérique ********/

.container .slide-container .slide .slide-element .text-inside-image{
    position: absolute;
    width: 40%;
    bottom: 50px;
    animation:  fade 2s;

}
.container .slide-container .slide .slide-element img {
    width: 60%;
    float: right;
    height: 100%;
    object-fit: cover;
}

.container .slide-container.a-propos .slide .slide-element .text-inside-image{
    animation: none !important;
}

.container .slide-container.a-propos .slide .slide-element img {
    width: 100%;
    float: right;
    height: 100%;
    object-fit: cover;
}

.container .slide-container .slide .slide-element h2{
    font-family: 'Roboto-Medium';
    font-size: 52px;
    margin: 0;
}
.container .slide-container .slide .slide-element p{
    width: 85%;
    font-family: 'Roboto-Regular';
    font-size: 18px;
    margin: 20px 0 10px;
}
.container .slide-container .slide .slide-element a{
    font-family: 'Roboto-Bold';
    font-size: 16px;
    color: black;
    text-transform: uppercase;
    line-height: 20px;
    border-bottom: 3px solid black ;
    text-decoration: none;
    /* font-style: italic; */
}
.container .slide-container .slide .active{
    display: block;
    /* border: solid black 1px; */
}
.container .slide-container .slide .active img{
    transition: 500ms;
    animation: image 2s cubic-bezier(0.32,0.43,0.6,0.88);
    /* border: solid black 1px; */
}
/* Animation du slider */
@keyframes fade {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes image {
    from {
        width: 0;
    }
    to {
        width: 60%;
    }
}

/* Petit cercles sur les sliders qui indique le slider active */
.container .slide-container .sliders .focus-circle{
    position: absolute;
    width: 40%;
    left: 0%;
    height: 30px;
    /* border: 1px solid black; */
    bottom: 0;
    display: flex;
    /* flex-direction: column; */
    justify-content: flex-start;
    align-items: center;
}
.container .slide-container .sliders .focus-circle .circle{
    width: 6px;
    height: 6px;
    margin: 0 8px;
    border-radius: 50%;
    border:  black 2px solid;
    cursor: pointer;
}

.container .slide-container .sliders .focus-circle .focus{
    background-color: black;
}
/* Bouton pour changer le slide */
.container .slide-container .sliders .focus-circle .slide-btns{
    position: absolute;
    left: 0 ;
    bottom: 20px;
    width: 110px;
    /* height: 50px; */
    /* border: 1px solid black; */
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
}
.container .slide-container .sliders .focus-circle .slide-btn{
    width: 25px;
    height: 25px;
    cursor: pointer;
}
.container .slide-container .sliders .focus-circle .slide-btn:first-child{
    margin-right: 20px;
}
.container .slide-container .sliders .focus-circle .slide-btn:last-child{
    margin-left: 20px;
}
.container .slide-container .sliders .focus-circle .slide-btn img{
   width: 100%;
   height: 100%;
   object-fit: cover;
}

/* style de nos offres */
/* style de nos offres */

.offers-container .offers-content{
    width: 100%;
    /* border: 1px solid black; */
    display: flex;
    justify-content: space-between;
}
/* Premier block */
.offers-container .offers-content .offers:nth-child(1){
    width: 50%;
    /* border: 1px solid black; */
}
.offers-container .offers-content .offers:nth-child(1) .offer{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.offers-container .offers-content .offers:nth-child(1) .offer .image {
	width: 510px;
    height: 510px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 500ms;
    /* overflow: hidden; */
}
.offers-container .offers-content .offers:nth-child(1) .offer .image img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    flex-direction: column;
    justify-content: space-between;
    object-fit: cover;
    transition: all 500ms;
}
.offers-container .offers-content .offers:nth-child(1) .offer .image img:hover{
    /* -webkit-transform: scale(1.3);
    transform: scale(1.3); */
}
.offers-container .offers-content .offers:nth-child(1) .offer .image-title{
    width: 90%;
    margin: 10px auto 0;
    text-align: center;
    /* border: 1px solid black; */
}
/* Premier block */

/* Second block && Troisième block */

.offers-container .offers-content .offers{
    width: 25%;
    display: flex;
    flex-direction: column;
    align-content: flex-end;
    align-items: flex-end;
    justify-content: space-between;
    /* border: 1px solid black; */
  
}
.offers-container .offers-content .offers .offer{
    /* border: 1px solid black; */
}
.offers-container .offers-content .offers .offer .image{
	width: 210px;
    height: 210px;
    border-radius: 50%;
    overflow: hidden;
    /* border: 1px solid black; */
}
.offers-container .offers-content .offers .offer .image img{
  	width: 100%;
    height: 100%;
    border-radius: 50%;
    transition: all 500ms;
    object-fit: cover;
    /* border: 1px solid black; */
}
.offers-container .offers-content .offers .offer .image img:hover{
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
    transition: all 500ms;
}
.offers-container .offers-content .offers .offer .image-title{
    width: 100%;
    margin: 5px auto 0;
    text-align: center;
    /* border: 1px solid black; */
}
.offers-container .offers-content .offers:nth-child(1) .offer .image-title span{
	 font-size: 22px;
}
.offers-container .offers-content .offers .offer span{
    font-family: 'Roboto-Bold';
    font-size: 16px;
    display: block;
    margin: 0;
}
/* Second block && Troisième block */

/* style methodology */     /* style methodology */     /* style methodology */
/* style methodology */     /* style methodology */     /* style methodology */

.methodology-content .methodology-part{
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    flex-wrap: wrap;
    /* border: 1px solid red; */
}
.methodology-content .methodology-part .methodologies{
    width: 48%;
    /* border: 1px solid black;    */
}
.methodology-content .methodology-part .methodologies .methodologie{
    width: 100%;
    margin: 0 auto;
    margin-bottom: 50px;
    /* height: 150px; */
}
.methodology-content .methodology-part .methodologies .methodologie div{
    border-left: 2px solid #27ae60;
    padding-left: 20px;
}
.methodology-content .methodology-part .methodologies .methodologie:nth-child(3),
.methodology-content .methodology-part .methodologies .methodologie:nth-child(6){
    margin-bottom: 0;
}
.methodology-content .methodology-part .methodologies .methodologie div h4{
   font-family:"Roboto-Bold";
   display: flex;
   font-size: 20px;
   margin: 0;
   /* border: 1px solid black; */
}
.methodology-content .methodology-part  .methodologies .methodologie div h4 span:nth-child(1){
    margin-right: 10px;
}
.methodology-content .methodology-part .methodologies .methodologie p{
    font-family: 'Roboto-Regular';
    font-size: 15px;
    margin-bottom: 0;
}
/* style methodology */     /* style methodology */     /* style methodology */
/* style methodology */     /* style methodology */     /* style methodology */


/* style solutions part */      /* style solutions part */  /* style solutions part */
/* style solutions part */      /* style solutions part */  /* style solutions part */
.solutions-container .solution-content-mobile{
    display: none;
}
.solutions-container .solutions-content{
    width: 100%;  
    /* border: 1px solid red;  */
    display: flex;
    justify-content: space-between
}

.solutions-container .solutions-content .solution-part{
    width: 47%;
    /* border: 1px solid green;  */
}
.solutions-container .solutions-content .solution-part:nth-child(1) .image{
    width: 100%;
    height: 516.09px;
    /* border: 1px solid black; */
    border-radius: 50%;
    /* position: relative; */
    overflow: hidden;
}
.solutions-container .solutions-content .solution-part:nth-child(1) .image img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    transition: 500ms;
}
.solutions-container .solutions-content .solution-part:nth-child(1) .image img:hover{
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    transition: 500ms;
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions{
    /* width: 100%; */
    /* border: 1px solid yellow; */
    padding-top: 50px ;
    position: relative;
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions .solution-card{
    /* border: 1px solid black; */
    position: relative;
    top: 25px;
    padding: 25px 20px 0px;
    display: flex;
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions .solution-card::after{
   content:'';
   position: absolute;
   /* border-top: 2px solid white; */
   top: -25px;
   left: 0;
   right: 100%;
   border-top:transparent;
   /* transition: all 50ms; */
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions .active{
    padding: 30px 20px 50px;
    margin-top: 25px; 
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions .active::after{
    border-top: 3px solid black;
    padding: 30px 20px 50px;
    margin-top: 25px;
    transition: all 250ms;
    right: 0;
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions .solution-card div{
    /* border: 1px solid black; */
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions .solution-card div:nth-child(1){
    font-family: 'Roboto-Medium';
    font-size: 22px;
    margin-right: 25px;
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions .solution-card div:nth-child(2){
    display: flex;
    flex-direction: column;
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions .solution-card div:nth-child(2) span{
    font-family: 'Roboto-Medium';
    font-size: 22px;
    margin-bottom:15px; 
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions .solution-card div:nth-child(2) a{
    font-family: 'Roboto-Medium';
    font-size: 13px;
    text-transform: uppercase;
    color: #006EFF;
    display: none;
    line-height: 22px;
}
.solutions-container .solutions-content .solution-part:nth-child(2) .solutions .active div:nth-child(2) a{
    display: block;
}


/* Nos partenaire */    /* Nos partenaire */    /* Nos partenaire */
/* Nos partenaire */    /* Nos partenaire */    /* Nos partenaire */

.nos-partenaire .partenaire-content{
    width: 80%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    /* border: 1px solid red; */
}
.nos-partenaire .partenaire-content .images{
    /* margin-top: 20px; */
    width: 35%;
    /* height: 100px; */
    /* border: 1px solid black; */
    margin: 0 10px;
}
.nos-partenaire .partenaire-content .images img{
    width: 100%;
    /* height: 100%; */
    object-fit: cover;
}
/* Pourquoi nous */
.pourquoi-nous  .pourquoi-nous-content{
    width: 50%;
    margin: 0 auto;
    text-align: center;
    /* border: 1px solid black; */
}
.pourquoi-nous  .pourquoi-nous-content p{
    font-family: 'Roboto-Regular';
    font-size: 18px;
    margin: 0;
}
/* Footer */
/* Footer part 1 */
.footer-container{
    width: 90%;
    margin: 80px auto 50px;
    /* border: 1px solid black; */
}
.footer-container .footer_1{
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding-bottom: 30px;
    border-top: 2px solid gainsboro;
    border-bottom: 2px solid gainsboro;
    /* border: 1px solid red; */
}
.footer-container .footer_1 .footer-part{
    width: 45%;
    height: auto;
    /* border: 1px solid yellow; */
}
.footer-container .footer_1 .footer-part:nth-child(1) .footer-ask{
    width: 100%;
    /* border: 1px solid black; */
}
.footer-container .footer_1 .footer-part:nth-child(1) .footer-ask h2{
    font-family: 'Roboto-Black';
    font-size: 35px;
    margin: 45px 0 30px;
}
.footer-container .footer_1 .footer-part:nth-child(1) .footer-contact{
    width: 100%;
    /* border: 1px solid black; */
}
.footer-container .footer_1 .footer-part:nth-child(1) .footer-contact .contact{
    width: 100%;
    /* border: 1px solid black; */
    display: flex;
    flex-direction: column;
    margin-bottom: 15px;
}
.footer-container .footer_1 .footer-part:nth-child(1) .footer-contact .contact span{
    font-family: 'Roboto-Black';
    font-size: 16px;
    opacity: 0.42;
    margin-bottom: 5px;
}
.footer-container .footer_1 .footer-part:nth-child(1) .footer-contact .contact a{
    font-family: 'Roboto-Black';
    font-size: 18px;
    color: #006EFF;
}
.footer-container .footer_1 .footer-part:nth-child(2){
    width: 40%;
    display: flex;
    justify-content: space-between;
    margin-top: 45px;
    /* border: 1px solid black; */
}
.footer-container .footer_1 .footer-part:nth-child(2) .footer-sub-part{
    display: 48%;
    padding: 0px 30px;
}
.footer-container .footer_1 .footer-part:nth-child(2) .footer-sub-part span{
    font-family: 'Roboto-Bold';
    font-size: 18px;
}
.footer-container .footer_1 .footer-part:nth-child(2) .footer-sub-part ul{
    padding: 0;
}
.footer-container .footer_1 .footer-part:nth-child(2) .footer-sub-part ul li{
    list-style: none;
    padding: 5px 0px;
    font-family: 'Roboto-Regular';
    font-size: 16px;
}
.footer-container .footer_1 .footer-part:nth-child(2) .footer-sub-part:nth-child(1) ul li{
    opacity: 0.42;
}
.footer-container .footer_1 .footer-part:nth-child(2) .footer-sub-part:nth-child(1) ul li a{
    text-decoration: none;
    color: black;
    opacity: 0.72;
}
.footer-container .footer_1 .footer-part:nth-child(2) .footer-sub-part:nth-child(1) ul li a:hover{
    text-decoration: underline;
}
.footer-container .footer_1 .footer-part:nth-child(2) .footer-sub-part:nth-child(1) ul li:nth-child(6){
    margin-top: 20px;
    opacity: 1;
}
.footer-container .footer_1 .footer-part:nth-child(2) .footer-sub-part:nth-child(2) ul li a{
    color: #34495e;
}
.footer_1 .footer-part:nth-child(2) .footer-sub-part:nth-child(2) .icones {
    display: none;
}
/* Footer part 2 */
.footer_2{
    width: 100%;
    margin: 15px 0 30px;
    display: flex;
    justify-content: space-between;
}
.footer_2 .footer-part{
    width: 45%;
    display: flex;
    flex-direction: column;
}
.footer_2 .footer-part{
    font-family: 'Roboto-Bold';
    font-size: 14px;
}
.footer_2 .footer-part:nth-child(1){
    font-size: 12px
}
.footer_2 .footer-part span{
    padding: 5px 0 0 0;
}
.footer_2 .footer-part:nth-child(2){
    align-items: flex-end;
}
.footer_2 .footer-part:nth-child(2) span{
    opacity: 0.42;
}
/* Nos Compétences */

.nos-competences-container .nos-competences-content{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.nos-competences-container .nos-competences-content .competence{
    width: 180px;
    /* margin-right: 30px; */
    /* border: 1px solid black; */
}
.nos-competences-container .nos-competences-content .competence .image{
    position: relative;
    width: 100%;
    height: 180px;
    border-radius: 50%;
    overflow: hidden;
    /* border: 1px solid black; */
}
.nos-competences-container .nos-competences-content .competence .image img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    transition: .5s ease-in-out;
}
.nos-competences-container.hover .nos-competences-content .competence .image img:hover{
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    transition: all 500ms;
}
.nos-competences-container .nos-competences-content .competence .image-title{
    width: 100%;
    text-align: center;
    /* border: solid black 1px; */
}
.nos-competences-container .nos-competences-content .competence .image-title h4{
    font-family: 'Roboto-Regular';
    font-size: 16px;
    margin-bottom: 0;
}

/* Nos realisation */
.nos-realisation-container .nos-realisation-content{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.nos-realisation-container .nos-realisation-content .image{
    width: 32%;
    height: 550px;
    margin-bottom: 20px;
    overflow: hidden;
    position: relative;
}
.nos-realisation-container .nos-realisation-content .text{
    position: absolute;
    width: 100%;
    height: 100px;
    background-color: white;
    bottom: 0;
    filter: opacity(0.7) brightness(0.5) contrast(0.5);
    color: white;
}
.nos-realisation-container .nos-realisation-content .image:nth-child(1),
.nos-realisation-container .nos-realisation-content .image:nth-child(4){
    width: 40%;
}
.nos-realisation-container .nos-realisation-content .image:nth-child(2),
.nos-realisation-container .nos-realisation-content .image:nth-child(3){
    width: 58%;
}
.nos-realisation-container .nos-realisation-content .image:nth-child(5),
.nos-realisation-container .nos-realisation-content .image:nth-child(6),
.nos-realisation-container .nos-realisation-content .image:nth-child(7){
    margin-bottom: 0;
}
/* Pour environnement */
.nos-realisation-container.env .nos-realisation-content .image:nth-child(3),
.nos-realisation-container.env .nos-realisation-content .image:nth-child(4){
    margin-bottom: 0;
}
.nos-realisation-container .nos-realisation-content .image img{
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 500ms;
}
.nos-realisation-container .nos-realisation-content .image img:hover{
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    transition: all 500ms;
}

.nos-realisation-container .nos-realisation-content .video{
    width: 49%;
}
.nos-realisation-container .nos-realisation-content .video:nth-child(3){
    margin: 17px auto;
}
.nos-realisation-container .nos-realisation-content .video video{
    width: 100%;
}
.nos-realisation-container .section-title {
    width: 100%;
    text-align: center;;
}
.nos-realisation-container .section-title h4{
    font-family: 'Roboto-Medium';
    color: black;
    margin: 0 30px 30px;
    font-size: 25px;
    text-decoration: underline;
}
.nos-realisation-container .nav-ph a:nth-child(1){
   border-bottom: 4px solid black ;
}
.video-part{
    margin-top: 50px;
}
.video .description{
    padding-right: 40px;
}
.video .description p{
    font-family: 'Roboto-Medium';
    font-size: 18px;
    margin-bottom: 10px;
}
.video .description span{
    font-family: 'Roboto-Regular';
    font-size: 14px;
}

/* Nos réalisation numerique */
.nos-realisation-container .nos-realisation-content .part:nth-child(1){
    width: 55%;
    height: 700px;
    margin-bottom: 0px !important;
}
.nos-realisation-container .nos-realisation-content .part:nth-child(2){
    width: 43%;
    display: flex;
    flex-direction: column;
    align-content: space-between;
    /* border: 1px solid black; */
}
.nos-realisation-container .nos-realisation-content .part:nth-child(2) .image:nth-child(1){
    width: 100%;
    height: 290px;
    margin-bottom: 20px;
}
.nos-realisation-container .nos-realisation-content .part:nth-child(2) .image{
    margin-bottom: 0;
}
.nos-realisation-container .nos-realisation-content .part:nth-child(2) .image:nth-child(2){
    width: 100%;
    height: 390px;
    
}
.nos-realisation-container .nos-realisation-content .part .image{
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/**** A propos *****/   /**** A propos *****/
/**** A propos *****/   /**** A propos *****/

.container .slide-container .slide .slide-element-a-propos .mystere{
    position: relative;
    /* filter: blur(35px); */
    /* border: 1px solid black; */
   
}
.container .slide-container .slide  .slide-element-a-propos .a-propos{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /* border: 1px solid black; */
}
.container .slide-container .slide .slide-element-a-propos .a-propos .logo{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    /* border: 1px solid black; */
    /* border: 1px solid black; */
}
.container .slide-container .slide .slide-element-a-propos .a-propos .logo img{
    width: 200px;
    height: 200px;
    object-fit: cover;
}
.container .slide-container .slide .slide-element-a-propos .a-propos .logo p{
    font-family: 'Roboto-Black';
    font-size: 60px;
    color: white;
    margin: 0;
}

/* Présentation dyra */

.dyra{
    width: 90%;
    margin: 65px auto 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.dyra .dyra-part{
    width: 45%;
    /* border: 1px solid black; */
}
.dyra .dyra-part .title{
    font-family: 'Roboto-Black';
    font-size: 40px;
}
.dyra .dyra-part:nth-child(3) p,
.dyra .dyra-part:nth-child(4) p{
    margin-bottom: 0;
}
.dyra .dyra-part p{
    font-family: 'Roboto-Regular';
    font-size: 17px;
    margin: 15px 0 35px;
}


/**** A propos *****/
/**** A propos *****/
/**** A propos *****/


/* Solution en savoir plus */
/* Solution en savoir plus */


.nav-solution{
    position: sticky;
    width: 100%;
    margin: auto;
    background-color: white;
    z-index: 1;
    top: 87px;
    /* border: 1px solid black; */
}
.nav-solution .nav{
    width: 90%;
    margin: auto;
    border-top: 1px solid black;
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* border: solid 1px red; */
}
.nav-solution.active{
    z-index: 0;
}
.nav-solution .logo{
    margin: 20px 0;    
    /* border: 1px solid black; */
}
.nav-solution .logo img{
    width: 200px;
    object-fit: cover;
}
.final-image{
    position: relative;
    width: 90%;
    margin: 0 auto;
    /* border: 1px solid black; */
}
.final-image .image{
    position: relative;
    width: 100%;
    height: 550px;
    margin: 65px auto 0;
}
.final-image .image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.final-image .image-text-sol1{
    width: 25%;
    position: absolute;
    top: 25%;
    right: 5% ;
    /* border: black solid; */
}
.final-image .image-text-sol1 p{
    font-family: 'Roboto-Bold';
    font-size: 22px;
}

.nav-solution .btn a{
    font-family: 'Roboto-Regular';
    font-size: 16px;
    color: white;
    width: 140px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
#btn1{
    background-color: #385ca4;
    border-radius: 50px;
}
#btn2{
    background-color: #27ae60;
    border-radius: 50px;
}

.slide-container .sliders .slide .numerique .text-inside-image a,
.pourquoi-nous a,
.main-image .numerique .text a,
.final-image .image-text-sol1 a,
.container .slide-container .slide .numerique-digi .text-inside-image a,
.final-image .image-text-sol2 a{
    font-family: 'Roboto-Regular';
    font-size: 18px;
    color: white;
    text-decoration: none;
    width: 170px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 30px 0 40px;
}


#btn1-1{
    background-color: #385ca4;
    border-radius: 50px;
}
#btn2-1{
    background-color:  #27ae60;
    border-radius: 50px;
}
#btn2-2{
    color: black;
    background-color: white;
    border-radius: 50px;
}
#btn2-3{
    background-color:  #27ae60;
    border-radius: 50px;
    margin: 0;
}

/* Orientation */
.pourquoi-nous div{
    width: 100%;
}
.pourquoi-nous div:last-child {
    display: flex;
    justify-content: center;
}

.description-container{
    width: 100%;
    margin: 0 auto;
    /* border: 1px solid black; */
}
.description-container .description{
    width: 90%;
    margin: auto;
    /* border: 1px solid black; */
    display: flex;
    justify-content: space-between;
}
.description-container .description .image:nth-child(1){
    width: 50%;
    /* border: 1px solid black; */
}
.description-container .description .image:nth-child(2){
    width: 50%;
    margin: 50px 0;
    /* border: 1px solid black; */
}
.description-container .description .image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.description-container .description .text{
    width: 50%;
    /* border: solid red 1px; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.description-container .description .text h4{
    font-family: 'Roboto-Bold';
    font-size: 30px;
    width: 80%; 
    margin: 0;
    /* border: solid yellow 1px; */
}
.description-container .description .text p{
    font-family: 'Roboto-Regular';
    font-size: 16px;
    width: 80%; 
    /* border: solid green 1px; */
}
/* Orientation */

/* Drone et Camera piège */

.nav-solution .logo h4{
    font-family: 'Roboto-Regular';
    font-size: 18px;
    line-height: 30px;
    margin: 0;
}
.container .slide-container .slide .slide-element .text-inside-image-cd{
    position: absolute;
    width: 100%;
    text-align: center;
    top: 20%;
}
.description-container .description-cd{
    width: 100%;
    /* border: 1px solid black; */
    display: flex;
    justify-content: space-between;
}
.description-container .description-cd .image{
    width: 45%;
    height: 400px;
    border-radius: 50%;
    /* border: 1px solid black; */
}
.description-container .description-cd .image:nth-child(1){
   display: flex;
   justify-content: flex-end;
   margin-top: 15px !important;
}

.description-container .description-cd .image img{
    width: 400px;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}
.description-container .description-cd .text{
    width: 50%;
    /* border: solid red 1px; */
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.description-container .description-cd .text:nth-child(1){
    align-items: flex-end;
}
.description-container .description-cd .text:nth-child(2){
    align-items: flex-start;
}
.description-container .description-cd .text h4{
    font-family: 'Roboto-Bold';
    font-size: 30px;
    width: 80%; 
    /* border: solid yellow 1px; */
    margin: 0;
}
.description-container .description-cd .text p{
    font-family: 'Roboto-Regular';
    font-size: 16px;
    width: 80%; 
    /* border: solid green 1px; */
}

.final-image .image-text-sol2{
    width: 50%;
    position: absolute;
    top: 25%;
    left: 5% ;
    /* border: black solid; */
}
.final-image .image-text-sol2 p{
    font-family: 'Roboto-Bold';
    font-size: 30px;
    margin-bottom: 25px;
    color: white;
}
/* Drone et Camera piège */


/* Digitalisation d'entreprise */

.container .slide-container .slide .numerique-digi{
    position: relative;
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    /* border: black solid 1px; */
}
.container .slide-container .slide .numerique-digi .text-inside-image{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* border: black solid 1px; */
    text-align: center;
}
.container .slide-container .slide .numerique-digi .text-inside-image h2{
    font-family: 'Roboto-Black';
    font-size: 35px;
    margin-bottom: 0;
}
.container .slide-container .slide .numerique-digi .image{
    width: 55%;
    /* height: 300px; */
    object-fit: cover;
}
.container .slide-container .slide .numerique-digi .image img{
    width: 100%;
    /* height: 100%; */
    object-fit: cover;
}
.avantage{
    width: 90%;
    margin: 0 auto;
    /* border: 1px solid black; */
}
.avantage .text p{
    width: 70%;
    margin: 0 auto;
    font-family: 'Roboto-Regular';
    font-size: 16px;
}
.avantage .image{
    width: 70%;
    margin: 30px auto;
    height: 450px;
    /* border: 1px solid black; */
}
.avantage .image:last-child{
   margin-bottom: 0;
}
.avantage .image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nos-competences-container.il .nos-competences-content{
   margin-top: 50px;
}
.nos-competences-container.il .nos-competences-content .competence{
    width: 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.nos-competences-container.il .nos-competences-content .competence .image{
    width: 60px !important;
    height: 60px !important;
    /* border: 1px solid black; */
    border-radius: 0 !important;
}
.nos-competences-container.il .nos-competences-content .competence .image-title h4{
    margin: 10px 0 0;
}
.nos-competences-container.il .nos-competences-content .competence .image img{
    width: 100%;
    height: 100%;
    border-radius: 0% !important;
    object-fit: cover;
}
/* Solution en savoir plus */
/* Solution en savoir plus */
.main-image {
    width: 100%;
    margin: auto;
    /* border: 1px solid red; */
}
.main-image .numerique {
    width: 90%;
    margin: auto;
    display: flex;
    justify-content: space-around;
    /* border: 1px solid black; */
}
.main-image.digi .numerique {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* border: 1px solid black; */
}
.main-image.digi .numerique .text {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* border: 1px solid black; */
}
.main-image.digi .numerique .text h2 {
    width: 60%;
    margin: 30px auto 0;
    text-align: center;
}
.main-image.digi .numerique .text .image {
    width: 50%;
    /* border: 1px solid black; */
    margin-right: 0;
}



.main-image .numerique .text {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    margin-left: 50px;
    /* border: 1px solid black; */
}
.main-image.env .numerique .text {
    width: 40%;
    margin-left: 0px;
    /* border: 1px solid black; */
}
.main-image .numerique .text h2 {
    font-family: 'Roboto-Medium';
    font-size: 40px;
    width: 100%;
    margin: 0 0;
}
.main-image .numerique .image {
    width: 35%;
    margin-right: 50px;
    /* border: 1px solid black; */
}
.main-image.env .numerique .image {
    width: 55%;
    margin-right: 0;
    height: 450px;
    /* border: 1px solid black; */
}
.main-image.sv .numerique .text {
    width: 45%;
}
.main-image.sv .numerique .image {
    width: 55%;
    /* border: 1px solid black; */
}
.main-image .numerique .image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.main-image.sv .numerique .image img{
    width: 100%;
    object-fit: cover;
    /* border: 1px solid black; */
}

/* Nos compétences photo vidéo */

.nos-competences-pv .competences-content{
    margin-top: 60px;
    display: flex;
    justify-content: space-around;
    /* border: 1px solid palegreen; */
}
.nos-competences-pv .competences-content .competences-part{
    width: 45%;
    /* border: 1px solid yellow; */
}
.nos-competences-pv .competences-content .competences-part .title{
    width: 100%;
    /* border: 1px solid green; */
    text-align: center;
}
.nos-competences-pv .competences-content .competences-part .title h4{
    font-family: 'Roboto-Medium';
    font-size: 30px;
    margin: 0 0 25px;
}
.nos-competences-pv .competences-content .competences-part .competences{
    display: flex;
    flex-wrap: wrap;
    /* border: 1px solid red; */
    /* justify-content: space-between; */
}
.nos-competences-pv .competences-content .competences-part .competences .competence{
    width: 33%;
    /* border: saddlebrown 2px solid; */
    display: flex;
    flex-direction: column;
}
.nos-competences-pv .competences-content .competences-part:nth-child(2) .competences .competence{
    align-items: flex-end;
}
.nos-competences-pv .competences-content .competences-part .competences .competence .image{
    width: 100px;
    height: 100px;
    /* border: 1px solid black; */
    display: flex;
    justify-content: center;
    align-items: center;
}
.nos-competences-pv .competences-content .competences-part .competences .competence .image img{
    width: 70%;
    height: 70%;
    margin: auto;
    object-fit: cover;
    margin-bottom: 10px;
}
.nos-competences-pv .competences-content .competences-part .competences .competence h4{
    font-family: 'Roboto-Regular';
    font-size: 16px;
    width: 100px;
    /* border: 1px solid black; */
    text-align: center;
    margin: 0 0 30px;
}
.nos-competences-pv .competences-content .competences-part .competences .competence:nth-child(4) h4,
.nos-competences-pv .competences-content .competences-part .competences .competence:nth-child(5) h4,
.nos-competences-pv .competences-content .competences-part .competences .competence:nth-child(6) h4{
    margin-bottom: 0;
}

.nos-competences-stat{
    width: 90%;
    margin: auto;
}
/* Autres solution */
.autres-solutions{
    width: 90%;
    margin: auto;
    /* border: 1px solid black; */
}
.autres-solutions .title{
    width: 100%;
    text-align: center;
    margin-top: 30px;
}
.autres-solutions .btn{
    display: flex;
}
.autres-solutions .btn div{
    width: 50%;
    margin: 0 5px;
    /* border: solid black; */
}
.autres-solutions .btn div:nth-child(1){
   text-align: right;
}
.autres-solutions .btn div:nth-child(2){
   text-align: left;
}
.autres-solutions .btn a{
    font-family: 'Roboto-Regular';
    font-size: 13px;
    text-decoration: none;
    text-align: center;
    padding: 10px 20px;
    border-radius: 50px;
    border: 1px solid black;
    color: black;
    background-color: white;
}
.autres-solutions .btn a:hover{
    border: 1px solid white;
    color: white;
    background-color: black;
}

/* Style général */ /* Style général */ /* Style général */
/* Style général */ /* Style général */ /* Style général */

.first-element{
    padding-top: 50px;
}

/* Section u site */    /* Section u site */

.offers-container,.methodology-content,.solutions-container,.nos-partenaire,.pourquoi-nous,.nos-realisation-container,.nos-competences-container,.nos-competences-pv{
    width: 90%;
    margin: 0 auto;
    /* border: 1px solid  red; */
}

/* Section u site */    /* Section u site */

/* Titre de section */  /* Titre de section */

.offers-container .offres-title,.methodology-content .methodology-title,.solutions-container .solutions-title,.nos-competences-container .nos-competences-title,
.nos-partenaire .nos-partenaire-title,.pourquoi-nous .pourquoi-nous-title,.nos-realisation-container .nos-realisation-title,.nos-competences-pv .text,.avantage .text{
    width: 100%;
    text-align: center;
    /* border: 1px solid black; */
}
.offers-container .offres-title h2,.methodology-content .methodology-title h2,.solutions-container .solutions-title h2,.nos-competences-container .nos-competences-title h2,.avantage .text h2,
.nos-partenaire .nos-partenaire-title h2,.pourquoi-nous .pourquoi-nous-title h2,.nos-realisation-container .nos-realisation-title h2,.autres-solutions .title h2,.nos-competences-pv .text h2{
    font-family: 'Roboto-Black';
    font-size: 50px;
    margin: 65px auto 30px;
    width: 60%;
}
/* Titre de section */  /* Titre de section */

/* Style général */ /* Style général */ /* Style général */
/* Style général */ /* Style général */ /* Style général */


/* Images a propos */

.image-apropos{
    position: relative;
    width: 90%;
    margin: auto;
    height: 400px;
    /* border: 1px solid black; */
}
.image-apropos img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.image-apropos .dyra-logo{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* border: 1px solid green; */
    display: flex;
    justify-content: center;
    align-items: center;
}
.image-apropos .dyra-logo img{
    width: 180px;
    height: 180px;
}


