.banner-interne {
    position: relative;
    overflow: hidden;
    height: 539px;
}
.img-header {
    height: 539px;
}
.banner-interne:before {
content: "";
    background: rgba(0,0,0,0.57);
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0px;
    z-index: 1;
    width: 0%;
    -webkit-animation: translatewidth 1s 0s ease-in-out forwards;
    animation: translatewidth 1s 0.4s ease-in-out forwards;
    }
    @keyframes translatewidth{
    0% {
   width:0%;
        animation-timing-function:  cubic-bezier(0.46, 0.03, 0.52, 0.96);
    }
     
    100% {
    width:100%;
    animation-timing-function:  cubic-bezier(0.46, 0.03, 0.52, 0.96);
    }
}
.banner-interne:after {
    content: "";
    background: url(/Files/App_002/Images/bg.png) top center no-repeat;
    width: 100%;
    height: 100%;
    z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
}
.breadcrumb-archi {
    position: absolute;
    bottom: 0;
    width: 960px;
    display: flex;
    justify-content: space-between;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 2;
    align-items: flex-end;
}
.title-breadcrumb {
    font-size: 35px;
    color: #fff;
    font-family: 'Arcon Rounded';
    text-transform: uppercase;
    line-height: 40px;
    padding-left: 10px;
    margin-bottom: 35px;
}
.ul-breadcrumb {
    position: relative;
}
.ul-breadcrumb:after {
    content: "";
    background: #2ab573;
    width: 6px;
    height: 270px;
    position: absolute;
    right: 0;
    bottom: 0;
}
.ul-breadcrumb li {
    position: relative;
    margin: 5px 0;
}

a.breadcrumb-link {
    font-size: 14px;
    color: #2ab573;
    font-family: 'Arcon';
}
.icon-separateur {
    position: relative;
    margin: 5px 0;
}
.icon-separateur:after {
    content: "/";
    font-size: 14px;
    color: #2ab573;
    font-family: 'Arcon';
    position: absolute;
    top: 0;
}
.breadcrumb-link {
    font-size: 14px;
    color: #fff;
    font-family: 'Arcon';
}
.flex-breadcrumb {
    writing-mode: vertical-lr;
    -ms-writing-mode: bt-lr;
    text-orientation: sideways-right;
    transform: rotate(180deg);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    margin-bottom: 15px;
}
.bloc-presentation {
    position: relative;
    overflow: hidden;
}
.flex-presentation {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 0;
}
.boxpresentation {
    padding: 0;
    position: relative;
    border-bottom: 1px solid #ebebeb;
}
.img-presentation {
    padding: 0;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid #ebebeb;
    z-index: 1;
}
.boxgrid {
    height: 268px;
}
.boxtitle {
    height: 268px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.boxtitle-two {
    padding: 0;
    height: 268px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 50px;
    font-family: 'Arcon Rounded';
    line-height: 55px;
    padding: 20px;
}
.bggris {
    background: #254e90;
}

.boxtitle span {
    font-size: 40px;
    color: #fff;
    font-family: 'Arcon Rounded';
    text-transform: uppercase;
}
.bgwhite {
    background: #fff;
}
.colorone {
    display: block;
    color: #296fad;
}
.colortwo {
    display: block;
    color: #2ab573;
}
.boxparag {
    padding: 25px;
    height: 268px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    background: #fff;
    position: relative;
    z-index: -1;
}
.boxparag p {
    font-size: 15px;
    color: #090909;
    text-align: justify;
    font-family: 'Futura PT Book';
    line-height: 22px;
}
.bgpink {
    background: #2ab573;
}
.boxparag-two {
    padding: 25px;
    height: 269px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
}
.img-presentation img {
    max-width: inherit;
}
.boxparag-two p {
    font-size: 15px;
    color: #fff;
    text-align: justify;
    font-family: 'Futura PT Book';
    line-height: 22px;
}
.btn-presentation {
    background: #556271;
    color: #fff;
    font-weight: bold;
    font-family: 'Futura PT Book';
    font-size: 14px;
    text-transform: uppercase;
    padding: 13px 20px;
    display: table;
    margin-top: 35px;
}
.btn-presentation:hover {
    color: #fff;
    background: #3d3d3d;
}
.imgparag {
    padding: 0;
}
.name-presentation {
    background: #fff url(/Files/App_002/Images/bg-presentation.jpg) top center no-repeat;
    background-size: cover;
    height: 535px;
    display: flex;
    flex-direction: column;
    padding: 80px 0;
    align-items: center;
}
.name-presentation span {
    color: #556271;
    font-size: 13px;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'Futura PT Book';
    opacity: 0.41;
    text-align: left;
}
.logo-presentation {
    margin-top: -15px;
}
.name-presentation:before {
    content: "";
    background: #e85252;
    width: 6px;
    height: 42px;
    position: absolute;
    left: -3px;
    top: 0;
}
.boxparag-two:before {
    content: "";
    background: #296fad;
    width: 6px;
    height: 42px;
    position: absolute;
    right: 0px;
    bottom: -21px;
    z-index: 2;
}
.borderbottom {
    border-bottom: 1px solid #ebebeb;
}
.boxborder {
    border-right: 1px solid #ebebeb;
}
.borderleft {
    border-left: 1px solid #ebebeb;
}
.boxvision {
    padding: 0;
}
.boxvision span {
    display: block;
    font-size: 20px;
    color: #296fad;
    font-family: 'Futura PT Book';
    margin-bottom: 20px;
}
.gridmission {
    transform: translateX(-50%);
    position: relative;
    z-index: 2;
}
.gridmission:after {
    content: "";
    background: #2ab573;
    width: 6px;
    height: 42px;
    position: absolute;
    right: -3px;
    bottom: -21px;
    z-index: 2;
}
.gridvision {
    position: relative;
    overflow: hidden;
}
.gridservices span {
    font-size: 28px;
    color: #254e90;
    text-transform: uppercase;
    font-family: 'Arcon Rounded';
    line-height: 30px;
    font-weight: 300;
}
.boxcontact span {
    display: block;
    font-size: 20px;
    color: #296fad;
    font-family: 'Futura PT Book';
    text-transform: capitalize;
    line-height: 25px;
    margin-bottom: 0;
}
.boxparag p a {
    color: #090909;
}
.boxmaps {
    padding: 0;
}
.boxmaps iframe {
    width: 100%;
    height: 530px;
}
.flexform {
    display: flex;
    justify-content: center;
    align-items: center;
    float: none;
    margin: 0 auto;
    padding: 0;
   position: relative;
}
.flexform:before {
    content: "";
    background: #2ab573;
    width: 6px;
    height: 42px;
    position: absolute;
    right: 0;
    top: -21px;
    z-index: 2;
    left: 0;
    margin: 0 auto;
}
.title-form {
    font-size: 30px;
    color: #fff;
    text-align: center;
    display: block;
    font-family: 'Futura PT Book';
    margin: 45px;
}
.borderbefore {
    position: relative;
}
.borderbefore:after {
    content: "";
    background: #254e90;
    width: 6px;
    height: 42px;
    position: absolute;
    right: 0px;
    top: -21px;
    z-index: 2;
    margin: 0 auto;
}
.menu-categ-realisations {
    margin: 35px  auto;
    text-align: center;
}
.maps-realisations {
    position: relative;
}
.nos-realisations {
    height: auto;
    margin-bottom: 80px;
    overflow: hidden;
}
.listes-realisations {
    position: relative;
    overflow: hidden;
}
@media screen and (max-width: 1280px) {
.gridservices span {
    font-size: 20px;
    line-height: 22px;
}
.boxtitle span {
    font-size: 35px;
}
.boxtitle-two {
    font-size: 35px;
    line-height: 35px;
}
}
@media screen and (max-width: 1024px) {
.logo-apropos {
    width: 160px;
}
.boxvision span {
    font-size: 18px;
    margin-bottom: 5px;
}
.boxparag {
    padding: 25px 15px;
}
.boxparag-two {
    padding: 25px 15px;
}
}
@media screen and (max-width: 991px) {
.borderbefore:after {display: none;}
.maps-realisations {
    overflow: hidden;
}
.paginator {
    overflow: hidden;
    margin-top: 50px;
}
.flexform {
    margin-top: 90px;
    width: 95%;
}
.flexform:before { display: none;}
.boxmargin {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
.img-presentation {
    order: 2;
}
.gridservices span {
    margin-top: 50px;
}
.title-breadcrumb {
    padding-left: 0;
}
.gridmission {
    transform: translateX(0);
}
.boxparag.boxborder {
    margin-bottom: 10px;
    margin-top: 0;
    padding-top: 0;
}
.boxparag.boxborder.borderleft {
    padding-bottom: 0px;
    margin-top: 40px;
}
.gridvision {
    margin-top: 40px;
}
.boxvision span {
    font-size: 20px;
    margin-bottom: 15px;
    text-align: center;
}
.borderbottom {
    border-bottom: 0;
}
.gridmission:after {display: none;}
.borderleft {
    border-left: 0;
}
.boxborder {
    border-right: 0;
}
.boxpresentation, .img-presentation { border-bottom: 0;}
.banner-interne {
    height: 450px;
}
.img-header {
    height: 450px;
}
.banner-interne:after{ display: none;}
.ul-breadcrumb { display: none;}
.breadcrumb-archi {
    justify-content: center;
    width: 100%;
}
.logo-apropos {
    width: auto;
}
.boxapropos {
    order: 3;
}
.img-apropos {
    display: flex;
    flex-wrap: wrap;
}
.imgparag {
    order: 2;
    height: 450px;
}
.name-apropos {
    height: 450px;
}
.name-apropos:before {
    display: none;
}
.imgparag img, .img-presentation img {
    height: auto;
    width: 100%;
}
.boxgrid {
    height: auto;
}
.boxtitle {
    height: 250px;
}
.boxtitle-two {
    margin-top: 35px;
    height: auto;
}
.boxparag {
    height: auto;
    margin-top: 15px;
    margin-bottom: 70px;
}
.boxparag p {
    text-align: center;
}
.boxparag-two:before {
   display: none;
}
.boxparag-two {
    padding: 50px 25px;
    height: auto;
    align-items: center;
}
.boxparag-two p {
    text-align: center;
}
}
@media screen and (max-width: 767px) {
.banner-interne {
    height: 350px;
}
.img-header {
    height: 350px;
}
.title-breadcrumb {
    font-size: 20px;
    line-height: 20px;
    margin-bottom: 30px;
}
.name-apropos {
    height: 400px;
    padding: 70px 15px;
}
.boxtitle {
    padding: 20px 15px;
}
.boxtitle-two {
    padding: 20px 15px;
}
.boxparag {
    padding: 25px 15px;
}
.boxparag-two {
    padding: 50px 15px;
}
}
@media screen and (max-width: 550px) {
.imgparag {
    order: 2;
    height: auto;
}
.flexform {
    width: 90%;
}
}
.textcenter {
    text-align: center;
}
.gridservices {
    position: relative;
    z-index: 3;
}