html {
  overflow-x: hidden;
}
/* Open sans is stored on the "webfonts" directory
"gf-opensans.css" select a police on demand with used unicode-range */
body {
  position: relative;
	font-family: 'Open Sans', sans-serif;
	background-color: #fbfbfb;
  font-size: 1rem;
  overflow-x: hidden;
}
header {
  padding: 1rem 0 1rem 0;
  box-shadow: 0 5px 12px -5px grey;
}
.firstline {
  background-color: #003b4f;
  padding-top: 1rem;
  margin-top: -1rem;
  min-height: 30px;
}
.firstline a {
  color: #fbfbfb;
  vertical-align: middle;
}
.firstline a:hover {
  color: #969798;
  text-decoration: none;
}
.home header {
  box-shadow: none;
}
.menuLangue ul li:first-child {
  padding-right: 1rem;
}
.menuLangue ul li:nth-child(2) {
  padding-right: 0.5rem;
  border-right:1px solid white;
}
#menuFixe {
  /*overflow: hidden;*/
  margin-top: -2rem;
}
.sticky {
  position: fixed;
  top: 2rem;
  left: 0;
  width: 100%;
  height: 80PX;
  z-index: 999;
  background-color: #fbfbfb;
  box-shadow: 0 5px 12px -5px grey;
}
.sticky .logo {
  width: 30%;
  padding-top: 1rem;
}
.sticky img {
  width: 60%;
}
.sticky .navbar {
  position: fixed;
  top: 0.5rem;
  right: 2rem;
}
.dropdown:hover .dropdown-menu{
    display: block;
    margin-top: -5px;
}
.logo {
  padding-top: 3rem;
}
/*.nav-item {
  text-transform: uppercase;
}*/
section	{
	padding: 5rem 0 2rem 0;
  margin-top: -5rem;
}
footer {
  padding-top: 3rem;
}
.menuFooter ul li {
  display: inline;
  padding-right: 0.5rem;
  border-right:1px solid black;
}
.menuFooter ul li:last-child {
  border-right:none;
}
#BtnTop {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    border: none;
    outline: none;
    background-color: transparent;
    color: black;
    cursor: pointer;
    padding: 15px;
    border-radius: 10px;
    font-size: 18px;
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}
#BtnTop:hover {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
i {
  font-size: 1.5rem;
}
a {
  color: #000;
  text-decoration: none;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}
a:hover {
  color: #003b4f;
  text-decoration: underline;
}
#mentionsLegales a {
  font-weight: bold;
  color: #003b4f;
}
#mentionsLegales a:hover {
  color: #c3c3c3;
  text-decoration: none;
}
caption {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  color: #6c757d;
  text-align: left;
  caption-side: bottom;
}
h1, .h1 {
  font-size: 2.5rem;
  margin: 2rem 0 2rem 0;
}
h2, .h2 {
  font-size: 2rem;
}
h3, .h3 {
  font-size: 1.5rem;
  margin-bottom: 1rem;
}
h4, .h4 {
  font-size: 1.75rem;
  margin-bottom: 2rem;
}
h5, .h5 {
  font-size: 1.25rem;
}
h6, .h6 {
  font-size: 1rem;
}
h1 span {
  background: linear-gradient(#c5d500, #c5d500) bottom no-repeat;
  background-image: -webkit-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
  background-image:-moz-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
  background-image:-o-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
  background-size: 100% 0.7rem;
  background-position: 0.2rem 2rem;
}
h2 span {
  background: linear-gradient(#c5d500, #c5d500) bottom no-repeat;
  background-image: -webkit-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
  background-image:-moz-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
  background-image:-o-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
  background-size: 100% 0.6rem;
  background-position: 0rem 1.6rem;
}
.colTitre {
  padding-right: 0;
  padding-left: 0;
}
.titre-droit, .titre-gauche, .titre-centre, .titre-mentions {
  background-image: url(../img/RectBleu.png);
  background-repeat: repeat-x;
  background-position: 3rem;
  position: relative;
  z-index: 1;
}
.titre-gauche mark{
  background-color: #fbfbfb;
  padding-left: 3rem;
  padding-right: 1rem;
}
.titre-droit mark {
  background-color: #fbfbfb;
  padding-right: 3rem;
  padding-left: 1rem;
}
.solution-numerique {
  padding-right: 3rem;
}
.titre-centre mark {
  background-color: #fbfbfb;
  padding-right: 1rem;
  padding-left: 1rem;
}
.img-solution {
  max-height: 70%;
  margin-top: 2rem;
}
.img-methodo {
  max-width: 70%;
}
.colTitreMentions {
  padding-right: 0;
  padding-left: 0;
  margin: 2rem 0 2rem 0;
}
.titre-mentions mark {
  background-color: #fbfbfb;
  padding-right: 1rem;
  padding-left: 5rem;
}
blockquote {
  margin-bottom: 1.5rem;
  font-weight: bold;
  color: #003b4f;
}
p {
    margin-top: 0;
    margin-bottom: 1.5rem;
}
/*CTA*/
.CTA {
  margin-top: 3rem;
  padding: 3rem 0 3rem 0;
  background-color: #003b4f;
}
.CTA h2, .CTA p {
  color: #fff;
}
/*.CTA h2 {
  text-transform: uppercase;
}*/
.CTA .btn-cont .btn {
  position: relative;
  padding: 20px 50px;
  color: #FFF;
  background-color: #003b4f;
  text-decoration: none;
  font-size: 18px;
  font-weight: bold;
  font-family: "Open Sans", sans-serif;
  /*text-transform: uppercase;*/
  letter-spacing: 2px;
  filter:progid:DXImageTransform.Microsoft.Shadow(color='#6565', Direction=135, Strength=5);
}
.CTA .btn-cont .btn:hover {
  border: none;
  box-shadow: none;
  color: #FFF;
}
/*button*/
.btn-bleu {
  border-bottom: 3px solid #003b4f;
  border-right: 3px solid #003b4f;
}
.btn-cont {
  margin-top: 20px;
  height: 70px;
}
.btn-cont .btn {
  position: relative;
  padding: 20px 50px;
  color: #000;
  background-color: #fbfbfb;
  text-decoration: none;
  font-size: 18px;
  font-weight: bold;
  font-family: "Open Sans", sans-serif;
  /*text-transform: uppercase;*/
  letter-spacing: 2px;
}
.btn-cont .btn:hover {
  border: none;
  box-shadow: none;
}
.btn:hover .line-1 {
  -webkit-animation: move1 1500ms infinite ease;
          animation: move1 1500ms infinite ease;
}
.btn-cont .btn:hover .line-2 {
  -webkit-animation: move2 1500ms infinite ease;
          animation: move2 1500ms infinite ease;
}
.btn-cont .btn:hover .line-3 {
  -webkit-animation: move3 1500ms infinite ease;
          animation: move3 1500ms infinite ease;
}
.btn-cont .btn:hover .line-4 {
  -webkit-animation: move4 1500ms infinite ease;
          animation: move4 1500ms infinite ease;
}
.btn-cont .line-1 {
  content: "";
  display: block;
  position: absolute;
  width: 2px;
  background-color: #003b4f;
  left: 0;
  bottom: 0;
}
.btn-cont .line-2 {
  content: "";
  display: block;
  position: absolute;
  height: 2px;
  background-color: #003b4f;
  left: 0;
  top: 0;
}
.btn-cont .line-3 {
  content: "";
  display: block;
  position: absolute;
  width: 2px;
  background-color: #003b4f;
  right: 0;
  top: 0;
}
.btn-cont .line-4 {
  content: "";
  display: block;
  position: absolute;
  height: 2px;
  background-color: #003b4f;
  right: 0;
  bottom: 0;
}
@-webkit-keyframes move1 {
  0% {
    height: 100%;
    bottom: 0;
  }
  54% {
    height: 0;
    bottom: 100%;
  }
  55% {
    height: 0;
    bottom: 0;
  }
  100% {
    height: 100%;
    bottom: 0;
  }
}
@keyframes move1 {
  0% {
    height: 100%;
    bottom: 0;
  }
  54% {
    height: 0;
    bottom: 100%;
  }
  55% {
    height: 0;
    bottom: 0;
  }
  100% {
    height: 100%;
    bottom: 0;
  }
}
@-webkit-keyframes move2 {
  0% {
    width: 0;
    left: 0;
  }
  50% {
    width: 100%;
    left: 0;
  }
  100% {
    width: 0;
    left: 100%;
  }
}
@keyframes move2 {
  0% {
    width: 0;
    left: 0;
  }
  50% {
    width: 100%;
    left: 0;
  }
  100% {
    width: 0;
    left: 100%;
  }
}
@-webkit-keyframes move3 {
  0% {
    height: 100%;
    top: 0;
  }
  54% {
    height: 0;
    top: 100%;
  }
  55% {
    height: 0;
    top: 0;
  }
  100% {
    height: 100%;
    top: 0;
  }
}
@keyframes move3 {
  0% {
    height: 100%;
    top: 0;
  }
  54% {
    height: 0;
    top: 100%;
  }
  55% {
    height: 0;
    top: 0;
  }
  100% {
    height: 100%;
    top: 0;
  }
}
@-webkit-keyframes move4 {
  0% {
    width: 0;
    right: 0;
  }
  55% {
    width: 100%;
    right: 0;
  }
  100% {
    width: 0;
    right: 100%;
  }
}
@keyframes move4 {
  0% {
    width: 0;
    right: 0;
  }
  55% {
    width: 100%;
    right: 0;
  }
  100% {
    width: 0;
    right: 100%;
  }
}
.btn-vert {
  border-bottom: 3px solid #c5d500;
  border-right: 3px solid #c5d500;
}
.btn-cont-vert .line-1 {
  content: "";
  display: block;
  position: absolute;
  width: 2px;
  background-color: #c5d500;
  left: 0;
  bottom: 0;
}
.btn-cont-vert .line-2 {
  content: "";
  display: block;
  position: absolute;
  height: 2px;
  background-color: #c5d500;
  left: 0;
  top: 0;
}
.btn-cont-vert .line-3 {
  content: "";
  display: block;
  position: absolute;
  width: 2px;
  background-color: #c5d500;
  right: 0;
  top: 0;
}
.btn-cont-vert .line-4 {
  content: "";
  display: block;
  position: absolute;
  height: 2px;
  background-color: #c5d500;
  right: 0;
  bottom: 0;
}
/*Carousel */
#carousel-logoClient {
  padding: 2rem 0 2rem 0;
}
.listImg img{
  padding: 0 2rem 0 2rem;
}
.carousel-indicators {
  bottom: -20px;
}
.carousel-indicators li {
    position: relative;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 15px;
    height: 5px;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    background-color: #c5d500;
}
.carousel-indicators .active {
  background-color: #003b4f;
}
#carousel-technologie {
  margin: 2rem 0 2rem 0;
}
#carousel-technologie .carousel-indicators {
    bottom: -50px;
}
#carousel-technologie .listImg img {
  padding: 0 4rem 0 4rem;
}
#carousel-technologie .listImgOutils img {
  padding-right: 4rem;
}
#carouselHome {
  min-height: 350px;
}
#carouselHome .btn-cont {
  padding-right: 5rem;
}
#carouselHome ul, #carouselHome p {
  margin-top: 1rem;
}
.carousel-home {
  padding-top: 2rem;
}
.carousel-home img {
  max-height: 300px;
}
.imgSlide {
  vertical-align: middle;
}
/*home*/
.Relief {
  padding: 1em 0 2em 0;
  box-shadow: 3px 0px 12px grey;
}
.iconHome {
  margin-left: 3rem;
  margin-right: 3rem;
}
.iconHome img {
  max-width: 200px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2rem;
}
.card {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fbfbfb;
    background-clip: border-box;
    border: none;
    min-height: 640px;
}
.card-footer {
    padding: .75rem 1.25rem;
    background-color: #fbfbfb;
    border-top: none;
    position: absolute;
    bottom: 0;
    right: 0;
}
.card h5 {
  font-size: 16px;
  font-weight: bold;
  color: #003b4f;
}
.imgRef {
  margin-top: 2rem;
}
#references img {
  height: 120px;
  -webkit-filter: grayscale(0%);
          filter: grayscale(0%);
}
#references img:hover {
  -webkit-filter: grayscale(100%);
          filter: grayscale(100%);
}
/*Page agence*/
.imgEquipe {
  margin-bottom: 1rem;
}
.hovereffect {
  width: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
  background: #003b4f;
}
.hovereffect .overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  padding: 50px 20px;
}
.hovereffect img {
  display: block;
  position: relative;
  max-width: none;
  width: calc(100% + 20px);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(-10px,0,0);
  transform: translate3d(-10px,0,0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.hovereffect:hover img {
  opacity: 0.4;
  filter: alpha(opacity=40);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.hovereffect h2 {
  /*text-transform: uppercase;*/
  color: #fff;
  text-align: center;
  position: relative;
  font-size: 17px;
  overflow: hidden;
  padding: 0.5em 0;
  background-color: transparent;
}
.hovereffect h2:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #fff;
  content: '';
  -webkit-transition: -webkit-transform 0.35s;
  transition: transform 0.35s;
  -webkit-transform: translate3d(-100%,0,0);
  transform: translate3d(-100%,0,0);
}
.hovereffect:hover h2:after {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.hovereffect a, .hovereffect p {
  color: #FFF;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(100%,0,0);
  transform: translate3d(100%,0,0);
}
.hovereffect:hover a, .hovereffect:hover p {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.citation{
  display: inline-block;
}
/*Page solution*/
.methodo {
  margin:3rem 0 3rem 0;
}
#developpons img {
  float: right;
}
/*Page contact */
.form-row>.col, .form-row>[class*=col-] {
  margin: 1rem;
}
.form-control {
  border-top: none;
  border-left: none;
  border-bottom: 3px solid #003b4f;
  border-right: 3px solid #003b4f;
  border-radius: 0rem;
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  background-color: #fbfbfb;
}
.miseEnRelief {
  margin-top: 2rem;
  padding: 1em 0 2em 0;
  box-shadow: 3px 0px 12px grey;
}
.villes {
	min-height: 250px;
	position: relative;
  padding-top: 2rem;
}
.contactEnRegion {
  margin-top: 1rem;
}
.contactEnRegion i {
  font-size: 1.5rem;
}
/*Pages réferences */
.entreprise {
  margin-top: 2rem;
}
.besoins {
  border-left: 10px solid #003b4f;
}
.align-middle {
  margin-bottom: 0rem;
}
.nossolutions {
  margin-top: 2rem;
}
ul li {
  list-style-type: none;
}
p.listmagiconline {
  margin-bottom: 1rem;
}
/*header*/
.navbar-light .navbar-nav .nav-link {
  color: #000;
}
button .navbar-toggler-icon {
  background-image: url(../img/menu-burger-blanc.png);
  margin-bottom: 0.5rem;
}
.navbar-toggler {
  font-size: 1rem;
}
/*Media queries Version responsive*/
@media (max-width: 576px) {
  .firstline {
    padding: 1rem 0 0rem 0;
  }
  section {
    padding: 1em 0 1rem 0;
    margin-top: 0;
  }
  .sticky {
    visibility: hidden;
  }
  h1, .h1 {
    font-size: 1.8rem;
    margin: 1rem 0 1rem 0;
  }
  h1 span {
    background: linear-gradient(#c5d500, #c5d500) bottom no-repeat;
    background-image: -webkit-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
    background-image:-moz-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
    background-image:-o-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
    background-size: 100% 0.75rem;
    background-position: 0.2rem 1.4rem;
  }
  h2 {
    font-size: 1.4rem;
  }
  h2 span {
    background: linear-gradient(#c5d500, #c5d500) bottom no-repeat;
    background-image: -webkit-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
    background-image:-moz-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
    background-image:-o-linear-gradient(#c5d500, #c5d500) bottom no-repeat;
    background-size: 100% 0.5rem;
    background-position: 0rem 1.1rem;
  }
  h3 {
    font-size: 1.1rem;
  }
  h4, .h4 {
    font-size: 1rem;
    margin-bottom: 1rem;
  }
  h5 {
    font-size: 1.1rem;
  }
  img {
    padding: 1rem 0 1rem 0;
  }
  #carouselHome {
    min-height: 250px;
  }
  #carouselHome .btn-cont {
    padding-right: 0.5rem;
  }
  .carousel-indicators {
    bottom: -30px;
  }
  #carousel-technologie .carousel-indicators {
    bottom: -60px;
  }
  #carousel-technologie {
    max-height: 300px;
  }
  #carousel-technologie {
    margin: 1rem 0 2rem 0;
  }
  #carousel-technologie .list-inline-item {
    display: block;
  }
  #carousel-technologie .listImgOutils img {
    padding: 0rem;
  }
  #carousel-logoClient {
    padding: 0;
  }
  .ville {
    padding: 2rem 0 0 0;
  }
  .CTA {
    margin-top: 1rem;
    padding: 3rem 0 3rem 0;
  }
  .btn-cont {
    margin: 0 0 1rem 0;
  }
  .imgVille {
    margin-top: -1rem ;
  }
  .contactEnRegion {
    margin: 1rem 0 3rem 0;
  }
  .card {
    min-height: 580PX;
  }
  .img-solution, .img-methodo {
    max-height: 270px;
    margin-top: 0rem;
  }
  .navbar-nav .dropdown-menu {
    position: absolute;
    float: left;
}
  .dropdown-menu, .dropdown-item {
    visibility: hidden;
  }
  .dropdown-toggle::after {
    content: none;
  }
}
@media (min-width:577px )and (max-width:689px ) {
  #carousel-technologie .listImgOutils img {
    width: 130px;
  }
}
@media (min-width:577px )and (max-width: 768px) {
  img {
      padding: 1.5rem 0 2rem 0;
    }
  .CTA h2 {
    font-size: 1.75rem;
    padding: 0 1rem 0 1rem;
  }
  #references img {
    height: auto;
  }
  #carouselHome .btn-cont {
    padding-right: 2rem;
  }
  #carousel-technologie {
    min-height: 120px;
  }
  #carousel-technologie .listImg img {
    padding: 0 2rem 0 2rem;
  }
  .listImgOutils img {
    padding: 0 1rem 0 1rem;
    vertical-align: middle;
  }
  .card {
    min-height: 500px;
  }
  .img-solution, .img-methodo {
    max-height: 370px;
    margin-top: 2rem;
  }
  .sticky .navbar {
    font-size: 14px;
  }
}
@media (max-width: 768px) {
  .colTitre {
    padding-right: 15px;
    padding-left: 15px;
  }
  .titre-droit, .titre-gauche, .titre-centre {
    background-image: none;
  }
  .titre-gauche mark, .titre-droit mark, .titre-centre mark, .titre-mentions mark {
    float: left;
    padding-right: 0rem;
    padding-left: 0rem;
  }
  .colTitreMentions {
    padding-right: 15px;
    padding-left: 15px;
    margin: 1rem 0 1rem 0;
  }
  #developpons .colTitre {
    text-align: left !important;
  }
  .transition {
    padding-left: 0rem;
  }
  .methodo {
    margin :0;
  }
  .solution-numerique {
    padding-right: 1rem;
  }
  .hovereffect {
    background: none;
  }
  .card-deck {
    display: inline-block;
  }
  .iconHome {
    margin-left: 0rem;
    margin-right: 0rem;
  }
  .iconHome img {
    margin-bottom: 0;
  }
  .carousel-home {
    padding-top: 1rem;
  }
  .btn-cont .btn {
    padding: 10px 25px;
  }
  .CTA .btn-cont .btn {
    padding: 10px 25px;
    font-size: 16px;
  }
  form .btn-cont {
    margin: 0 2rem 1rem 0;
  }
  .carousel-indicators li {
    margin-right: 0.5rem;
    margin-left: 0.5rem;
  }
  #carousel-technologie .listImgOutils img {
    padding-right: 0rem;
  }
  .sticky .logo {
    width: 35%;
    padding-top: 0;
  }
}
@media (min-width: 769px )and (max-width: 992px) {
  #transition-numerique img, #developpons img , #bigdata img, #methodologie img {
    max-height: 300px;
    margin-bottom: 2rem;
    margin-top: 0;
  }
  #developpons img {
    float: unset;
  }
  .card-body {
    padding: 0.75rem;
  }
  .card-footer .btn-cont .btn {
    padding: 10px 20px;
    float: right;
  }
  .solution-numerique {
    margin-left: 8.333333%;
    padding-right: 0px;
  }
  .methodo {
    margin: 0rem 0 0rem 0;
  }
  #carousel-technologie .listImgOutils img {
    padding-right: 1rem;
  }
}
@media (max-height: 992PX) {
   .iconHome {
    margin-left: 0rem;
    margin-right: 0rem;
  }
}
@-moz-document url-prefix() {
  section {
     padding-top: 100px;
  }
}
@-moz-document url-prefix() and @media (max-width: 576px) {
  section {
     padding-top: 1rem;
  }
}
.lang-tag{
        text-transform: uppercase;
  }

.active_lang{
        font-weight: bolder;
}