* {
  margin: 0px;
  -webkit-font-smoothing: antialiased;
}
/* width */
::-webkit-scrollbar {
  width: 3px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #2c2b32;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #0c0a0d;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}
body{
  font: 16px/24px "Lato", Arial, sans-serif;
  color: #efefef;
}
header,
nav {

  height: 100vh;
  display: grid;
  align-content: center;
  align-items: center;
  justify-content: center;
  justify-items: center;
  box-sizing: border-box;
}
header{
  grid-template-rows: 200px auto auto;
}
main{
  box-sizing: border-box;
  background-image: linear-gradient(to left bottom, #002633, #111c2a, #16141d, #110a10, #000000);
}
nav{
  box-sizing: border-box;
  background-image: linear-gradient(to left bottom, #002633, #111c2a, #16141d, #110a10, #000000);
}

section {
  box-sizing: border-box;
  min-height: 15vh;
  display: grid;
  grid-template-columns: auto;
  align-items: center;
}

.content {
  width: 960px;
  margin: auto;
  padding: 25px 0px;
}

strong {
  font-weight: 100;
}

#presentationStudio {
    padding: 50px 5px 20px;
}

#gallerieStudio {
  box-sizing: border-box;
  height: 100%;
  width : 100%;
  background-image: linear-gradient(to left bottom, #002633, #111c2a, #16141d, #110a10, #000000);
  background-size: cover;
  margin : 20px 0px;
}
#gallerieStudio2 {
  display: grid;
  box-sizing: border-box;
  height: 100%;
  background-size: cover;
  margin: 20px 0;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  gap: 10px;
  padding: 10px;
}
.titrePage{
    position: absolute;
    height: 50px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    font-size: 21px;
    align-items: center;
    justify-items: center;
    margin: 0px 10px;
}

.toggle-button {
  visibility: hidden;
  opacity: 0;        
}

.menuRapide {
    width: 15%;
    float: right;
    display: block;
    text-align: right;
    box-sizing: border-box;
    padding-right: 25px;
    position: fixed;
    left: 0px;
    bottom: 0px;
}
.menuRapideContent a i {
  padding: 0px 10px;
  transition: all 1s;
  font-size: 30px;
}
.menuRapideContent a i:hover {
  color: white;
}

.menuRapideContent {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    font-size: 21px;
    align-items: center;
    justify-items: center;
}

.menuClassiqueContent {
  display: grid;
  grid-template-columns: auto auto auto auto auto;
  font-size: 21px;
  align-items: center;
  justify-items: center;
  float: right;
  gap: 20px;
  padding-right: 20px;
}

.menuClassiqueContent a {
  font-family: 'Poppins', sans-serif;
  text-decoration: none;
  color: #9e9e9e;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .5px;
  transition: .2s;
}

.menuClassiqueContent a:hover {
  color: #006488!important;
  transition: .2s;
}

@media screen and (max-width: 825px) {
.menuRapide {
    width: 20%;
    float: right;
    display: block;
    text-align: right;
    box-sizing: border-box;
    padding-right: 0px;
  }
  .menuRapideContent {
    grid-template-columns: auto;
}
.menuRapideContent .fab{
  display: none;
}
}

.menuRapide a{
    color: #9e9e9e;
}

header h1 {
  font-family: 'Poppins', sans-serif;
  font-size: 60px;
  line-height: 80px;
  margin: 25px;
  font-weight: 700;
  color: rgba(255,255,255, .9);
  letter-spacing: -1px;
  text-shadow: 0 0 0.25em rgba(0, 0, 0, 0.8);
  position: relative;
  top: 0;
  transition: 2s;
  transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
header .sousTitre{
  font-family: 'Poppins', sans-serif;
  font-size: 30px;
  font-weight: 300;
  color: #fff;
  text-shadow: 0 0 0.25em rgba(0, 0, 0, 0.8);
  display: block;
  line-height: 1.1;
  position: relative;
  transition: .2s;
}

#logoMain {
  text-align: center;
  animation: grow 10s ease-in-out 5ms;
  width: 200px;
  text-align: center;
  animation-duration: 6s;
  animation-timing-function: ease-in-out;
  animation-delay: 5ms;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  animation-play-state: running;
  animation-name: grow;
  transition: all 0.2s ease-in-out;
  z-index: 1;
  transition: all 0.2s ease-in-out;
  z-index: 1;
}
@media screen and (max-width: 640px) {
  #logoMain {
    width: 200px;
    animation: none;
  }
}
@keyframes grow {
  0% {
    transform: scale(1.5);
  }
  50% {
    transform: scale(2);
  }
  100% {
    transform: scale(1.5);
  }
}

.ligneContenu {
  height: auto;
}
h3 {
  font-family: Roboto;
  font-size: 32px;
  padding: 20px 10px 10px 10px;
}
p {
  font-family: Roboto;
  padding: 10px;
  text-align: justify;
}

footer {
  background: url(../img/pattern5.png) center repeat #006488;
  box-sizing: border-box;
}
#footerContent {
  width: 960px;
  margin: auto;
  font-size: 13px;
  padding: 20px;
  font-weight: 500;
  display: grid;
  grid-template-columns: 1fr 1fr 2fr;
  grid-template-rows: auto;
  background: url(../img/pattern5.png) center repeat #006488;
  align-content: end;
  color: #fff;
  grid-template-areas: "coordonnees navigation aPropos"
"copyright copyright copyright";
}

footer h4 {
  font-size: 20px;
  text-transform: capitalize;
  margin-bottom: 25px;
}

footer p{
    text-align: justify;
    line-height: 21px;
    padding: 0px;
}
footer p a {
  text-decoration: none;
  color: white;
}

#coordonnees{
  grid-area: coordonnees;
}
#navigation{
  grid-area: navigation;
}
#aPropos {
  grid-area: aPropos;
}

#socialNetwork{
  grid-area: socialNetwork;
}
#copyright{
  grid-area: copyright;
}

.menuRapide a:hover {
  -webkit-animation-name: hvr-wobble-vertical;
  animation-name: hvr-wobble-vertical;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
@keyframes hvr-wobble-vertical{
16.65% {
  -webkit-transform: translateY(8px);
  transform: translateY(8px);
}
33.3% {
  -webkit-transform: translateY(-6px);
  transform: translateY(-6px);
}

49.95% {
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
}
66.6% {
  -webkit-transform: translateY(-2px);
  transform: translateY(-2px);
}
83.25% {
  -webkit-transform: translateY(1px);
  transform: translateY(1px);
}
100% {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}
}
#goToTop{
  transition: background-color .3s, 
  opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
}


.btnDebut,a.btnDebut i::before{line-height:42px}h5{font-size:16px}h6{font-size:12px}input{outline:0}#content_page{position:inherit;background:#fff;transition:.8s;overflow:hidden;right:0}#content_page .filter_nav{position:absolute;width:100%;height:100%;top:0;left:-100%;background:rgba(43,47,48,.5);display:none;z-index:99}.col_height,.hidden_bottom,.main_content{position:relative}.wrapper{max-width:1360px;margin:auto;padding:80px 25px}.row::after{display:block;clear:both}.col_6{width:50%}.col_4{width:33.3333%}.col_3{width:25%}.col_2{width:16.6666%}.row_sm_12{margin-left:-4%}.col_sm_3,.col_sm_4,.col_sm_5,.col_sm_6,.col_sm_7,.col_sm_8{margin-left:4%;float:left}.row_sm_12::after{display:block;clear:both}.col_sm_8{width:62.6666%}.col_sm_7{width:58.5%}.col_sm_6{width:46%}.col_sm_5{width:33.5%}.col_sm_4{width:29.3333%}.col_sm_3{width:21%}.txt_c{text-align:center}.txt_l{text-align:left}.txt_r{text-align:right}.color_txt_w{color:#fff!important}.color_txt_b{color:#2b2f30!important}.color_txt_g{color:#91c01f!important}.border_b_1{border-bottom:1px solid}span.nowrap{white-space:nowrap}.hidden_zoom{transform:scale(.1);opacity:0}.fx_zoom{transform:scale(1);transition:1s}.hidden_bottom{bottom:0;opacity:1}.main_content{background:#fff}.d_none{display:none}.big_button_green,a.big_button_green{color:#fff;font-weight:600;margin:0;letter-spacing:0;padding:15px 50px;white-space:nowrap;cursor:pointer;display:inline-block;position:relative;transition:.2s;background:#91c01f;border:1px solid #91c01f;border-radius:26px;box-shadow:0 0 .25em rgba(0,0,0,.3)}.big_button_green:hover,a.big_button_green:hover{transition:.2s;background:0 0;border:1px solid #fff}.big_button_green.over_b:hover,a.big_button_green.over_b:hover{transition:.2s;color:#2b2f30;background:0 0;border:1px solid #2b2f30}.big_button_black,.slim_button_green,a.big_button_black,a.slim_button_green{color:#fff;font-weight:600;letter-spacing:0;white-space:nowrap;display:inline-block;position:relative;box-shadow:0 0 .25em rgba(0,0,0,.3);transition:.2s;cursor:pointer}.big_button_green i,a.big_button_green i{margin-right:4px}.slim_button_green,a.slim_button_green{margin:0;padding:5px 25px;background:#91c01f;border:1px solid #91c01f;border-radius:26px}.slim_button_green:hover,a.slim_button_green:hover{transition:.2s;background:0 0;border:1px solid #fff}.slim_button_green i,a.slim_button_green i{margin-right:4px}.big_button_black,a.big_button_black{margin:0;padding:15px 50px;background:#2b2f30;border:1px solid #2b2f30;border-radius:26px}.big_button_black:hover,a.big_button_black:hover{color:#2b2f30;transition:.2s;background:0 0;border:1px solid #2b2f30}.big_button_black i,a.big_button_black i{margin-right:4px}.slim_button_black,a.slim_button_black{color:#fff;font-weight:600;margin:0;letter-spacing:0;padding:5px 25px;white-space:nowrap;cursor:pointer;display:inline-block;position:relative;transition:.2s;background:#2b2f30;border:1px solid #2b2f30;border-radius:26px;box-shadow:0 0 .25em rgba(0,0,0,.3)}.slim_button_black:hover,a.slim_button_black:hover{color:#2b2f30;transition:.2s;background:0 0;border:1px solid #2b2f30}.slim_button_black i,a.slim_button_black i{margin-right:4px}.big_button_whitte,a.big_button_whitte{color:#2b2f30;font-weight:600;margin:0;letter-spacing:0;padding:15px 50px;white-space:nowrap;cursor:pointer;display:inline-block;position:relative;transition:.2s;background:#fff;border:1px solid #fff;border-radius:26px;box-shadow:0 0 .25em rgba(0,0,0,.3)}.big_button_whitte:hover,a.big_button_whitte:hover{color:#91c01f;transition:.2s;background:0 0;border:1px solid #91c01f}.big_button_whitte i,a.big_button_whitte i{margin-right:4px}.slim_button_whitte,a.slim_button_whitte{color:#2b2f30;font-weight:600;margin:0;letter-spacing:0;padding:5px 25px;white-space:nowrap;cursor:pointer;display:inline-block;position:relative;transition:.2s;background:#fff;border:1px solid #fff;border-radius:26px;box-shadow:0 0 .25em rgba(0,0,0,.3)}.slim_button_whitte:hover,a.slim_button_whitte:hover{color:#91c01f;transition:.2s;background:0 0;border:1px solid #91c01f}.slim_button_whitte i,a.slim_button_whitte i{margin-right:4px}
.btnDebut{  
  height: 42px;
  width: 42px;
  text-align: center;
  font-size: 18px;
  text-transform: uppercase;
  background: #005f82;
  color: #fff;
  position: fixed;
  right: 30px;
  bottom: 30px;
  transition: .2s;
  display: grid;
  align-items: center;
  z-index: 90;
  -webkit-animation: .4s slidein infinite alternate;
  -moz-animation: .4s slidein infinite alternate;
  -o-animation: .4s slidein infinite alternate;
  -ms-animation: .4s slidein infinite alternate;
  animation: .4s slidein infinite alternate;
  border: 2px solid white;
  cursor: pointer;
}


.btnDebut:hover{transition:.2s;color:#2b2f30}
a.btnDebut i{position:relative}
@keyframes slidein{0%{bottom:20px}50%{bottom:22px}100%{bottom:24px}}
@-webkit-keyframes slidein{0%{bottom:20px}50%{bottom:22px}100%{bottom:24px}}
@-moz-keyframes slidein{0%{bottom:20px}50%{bottom:22px}100%{bottom:24px}}
@-o-keyframes slidein{0%{bottom:20px}50%{bottom:22px}100%{bottom:24px}}
@-ms-keyframes slidein{0%{bottom:20px}50%{bottom:22px}100%{bottom:24px}}

#goToTop.show{
  opacity : 1;  
  visibility: visible;
}

@media screen and (max-width: 640px){
  footer {
    display: flex;
    flex-direction: column;
  }
  footer ul {
    padding: 0px;
    text-align: center;
  }
  #copyright {
    margin: auto;
    padding-top: 0px;
  }
}

footer ul {
  list-style: none;
}

#contact {
  grid-area: contact;
  justify-self: center;
  align-self: center;
  transition: all 3s;
}
#socialNetwork {
  grid-area: socialNetwork;
  justify-self: center;
  align-self: center;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  cursor: pointer;
}
#socialNetwork a i {
  transition: all .2s;
}
#copyright {
  padding-top: 25px;
  grid-area: copyright;
  justify-self: right;
  display: flex;
  transition: all 3s;
}
#contact:hover,
#socialNetwork a i:hover,
#copyright:hover {
  color: white;
}

/* Social Media Icons */
#socialNetwork a {
    color: #9e9e9e;
    text-decoration: none;
}
/* .social-media-list {
  position: relative;
  font-size: 2.3rem;
  text-align: center;
  width: 100%;
}

.social-media-list li a {
  color: #fff;
  text-decoration: none;
}

.social-media-list li {
  position: relative;
  top: 0;
  left: -20px;
  display: inline-block;
  height: 70px;
  width: 70px;
  margin: 10px auto;
  line-height: 70px;
  border-radius: 50%;
  color: #fff;
  background-color: rgb(27, 27, 27);
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

.social-media-list li:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 70px;
  height: 70px;
  line-height: 70px;
  border-radius: 50%;
  opacity: 0;
  box-shadow: 0 0 0 1px #fff;
  transition: all 0.2s ease-in-out;
}

.social-media-list li a:hover {
  background-color: #fff;
}

.social-media-list li a:hover:after {
  opacity: 1;
  transform: scale(1.12);
  transition-timing-function: cubic-bezier(0.37, 0.74, 0.15, 1.65);
}

.social-media-list li:hover a {
  color: #111;
} */

footer a i {
  font-size: 24px;
  padding: 24px;
  display: grid !important;
}

.slideout-menu {
  position: fixed;
  top: 0;
  bottom: 0;
  width: 256px;
  min-height: 100vh;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  z-index: 0;
  display: none;
}

.slideout-menu-left {
  left: 0;
}

.slideout-menu-right {
  right: 0;
}

.slideout-panel {
  position: relative;
  z-index: 1;
  will-change: transform;
  min-height: 100vh;
}

.slideout-open,
.slideout-open body,
.slideout-open .slideout-panel {
  overflow: hidden;
}

.slideout-open .slideout-menu {
  display: block;
}
#header {
    position: fixed;
    z-index: 100;
    width: 100vw;
    height: 50px;
    line-height: 50px;
    background-color: #00000045;
}
.toggle-button {
    display: grid;
    height: 50px;
    align-items: center;
}

.intro {
  padding-bottom: 45px;
  text-decoration: none;
}

.intro h2 {
  font-family: 'Poppins', sans-serif;
  font-size: 48px;
  text-align: left;
  line-height: 80px;
  padding: 45px 25px 0px 25px;
  font-weight: 700;
  color: rgba(255,255,255, .9);
  letter-spacing: -1px;
  text-shadow: 0 0 0.25em rgba(0, 0, 0, 0.8);
  position: relative;
  transition: 2s;
  transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
.intro h3 {
  font-family: 'Poppins', sans-serif;
  font-size: 32px;
  text-align: left;
  line-height: 10px;
  padding: 0 50px 25px;
  font-weight: 700;
  color: rgba(255,255,255, .9);
  letter-spacing: -1px;
  text-shadow: 0 0 0.25em rgba(0, 0, 0, 0.8);
  position: relative;
  transition: 2s;
  transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}

.content h4 {
  font-family: 'Poppins', sans-serif;
  font-size: 24px;
  line-height: 24px;
  padding: 0px 10px;
  font-weight: 700;
  color: rgb(0, 91, 123);
  letter-spacing: -1px;
  text-shadow: 0 0 0.25em rgba(0, 0, 0, 0.8);
  position: relative;
  transition: 2s;
  transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
nav h2 {
  padding: 10px;
}
nav ul {
  list-style: none;
  padding: 0px;
}
nav ul li a {
  text-decoration: none;
  color: grey;
}
nav ul li:first-child {
  border-top: 0px;
}
nav ul li:last-child {
  border-bottom: 1px solid #0c2f3c;
}
nav ul li {
  border-top: 1px solid #0c2f3c;
  transition: all 1s;
}
nav ul li:hover {
  background-color: #ffffff1c;
}
nav ul li a {
  display: block;
  padding: 20px 20px;
  text-decoration: none;
  color: #006c8c;
}

#presentationFany {
  padding: 25px 0px;
}

#presentationFany p {
  padding: 5px 50px;
}

#headerContact
{
  box-sizing: border-box;
  height: 80vh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-content: center;
  justify-content: center;
  box-sizing: border-box;
}
#headerContact #logoMain {
  width: 300px;
  text-align: center;
  animation: grow 60s linear 10ms infinite;
  transition: all 0.2s ease-in-out;
  z-index: 1;
  justify-self: center;
}

.formulaire {
  width: 75%;
}

#btnRetour {
  position: absolute;
  left: 15px;
  color: #9e9e9e;
  font-size: 18px;
  line-height: 50px;
  transition: all 1s;
  text-decoration: none;
}

#btnRetour:hover {
  color: white;
}

ol {
  padding: 0px;
}

ol li:before {
    content: counter(jeff,decimal-leading-zero);
    margin-right: 20px;
    background: -webkit-linear-gradient(bottom,#005573 0,#005573 3px,rgba(0,0,0,0) 0);
    background: linear-gradient(0deg,#005573 0px,#005573 3px,rgba(0,0,0,0) 0);
}
ol li{
  counter-increment: jeff;
  list-style: none;
  padding: 5px;
}
#tarifs li:before{
  font-size : 24px;
}

#tarifs span {
  font-size : 24px;
  text-transform: uppercase;
}
#sectionGalleriePortfolio {
  width: 960px;
  margin: auto;
}
button {
  width: 230px;
  height: 42px;
  text-align: center;
  font-size: 18px;
  text-transform: uppercase;
  background: #005f82;
  color: #fff;
  transition: .2s;
  z-index: 90;
  border: 2px solid white;
  cursor: pointer;
  margin : 10px;
}
button:hover {
  transition: .2s;
  color: #2b2f30;
}

a {
  text-decoration: none;
  color: #005b7c;
}

.glowing {
  -webkit-animation: glowing 1500ms infinite;
  -moz-animation: glowing 1500ms infinite;
  -o-animation: glowing 1500ms infinite;
  animation: glowing 1500ms infinite;
}

@-webkit-keyframes glowing {
  0% { color: #B20000; -webkit-box-shadow: 0 0 3px #B20000; }
  50% { color: #FF0000; -webkit-box-shadow: 0 0 40px #FF0000; }
  100% { color: #B20000; -webkit-box-shadow: 0 0 3px #B20000; }
}

@-moz-keyframes glowing {
  0% { color: #B20000; -moz-box-shadow: 0 0 3px #B20000; }
  50% { color: #FF0000; -moz-box-shadow: 0 0 40px #FF0000; }
  100% { color: #B20000; -moz-box-shadow: 0 0 3px #B20000; }
}

@-o-keyframes glowing {
  0% { color: #B20000; box-shadow: 0 0 3px #B20000; }
  50% { color: #FF0000; box-shadow: 0 0 40px #FF0000; }
  100% { color: #B20000; box-shadow: 0 0 3px #B20000; }
}

@keyframes glowing {
  0% { color: white;}
  50% { color: #005b7c; }
  100% { color: white; }
}

#navigation p {
  height: 48px;
  line-height: 48px;
  min-width: 48px;
}

.slide-out-blurred-top{-webkit-animation:slide-out-blurred-top .45s cubic-bezier(.755,.05,.855,.06) both!important;animation:slide-out-blurred-top .45s cubic-bezier(.755,.05,.855,.06) both!important;animation-delay: 1.5s!important}

/* ----------------------------------------------
 * Generated by Animista on 2019-8-25 23:11:11
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

 @-webkit-keyframes slide-out-blurred-top{0%{-webkit-transform:translateY(0) scaleY(1) scaleX(1);transform:translateY(0) scaleY(1) scaleX(1);-webkit-transform-origin:50% 0;transform-origin:50% 0;-webkit-filter:blur(0);filter:blur(0);opacity:1}100%{-webkit-transform:translateY(-1000px) scaleY(2) scaleX(.2);transform:translateY(-1000px) scaleY(2) scaleX(.2);-webkit-transform-origin:50% 0;transform-origin:50% 0;-webkit-filter:blur(40px);filter:blur(40px);opacity:0}}@keyframes slide-out-blurred-top{0%{-webkit-transform:translateY(0) scaleY(1) scaleX(1);transform:translateY(0) scaleY(1) scaleX(1);-webkit-transform-origin:50% 0;transform-origin:50% 0;-webkit-filter:blur(0);filter:blur(0);opacity:1}100%{-webkit-transform:translateY(-1000px) scaleY(2) scaleX(.2);transform:translateY(-1000px) scaleY(2) scaleX(.2);-webkit-transform-origin:50% 0;transform-origin:50% 0;-webkit-filter:blur(40px);filter:blur(40px);opacity:0}}

 #gridPortfolio {
  width: 960px;
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
  padding: 10px;
}
#gridPortfolio img{
  width : 100%;
}


.clientThumb{
  position : relative;
  height : 190px;
  width : 350px;
  transition : .5s all;
  overflow : hidden;
  box-sizing : border-box;  
  box-shadow: 0px 8px 20px 0px rgba(0,0,0,0.15);
}
.clientThumb:hover{
  transition : 1.2s all;
  transition: all .2s ease-in-out;
  transform: translateY(-3px);
  box-shadow: 0 15px 25px 0 rgba(0,0,0,.15) !important;
}

.clientThumb:hover .ombreThumb{
  opacity : 0.75;
}
.clientThumb:hover img{
  transform: scale(1.1, 1.1);
  transition : 2s all;
}
.clientThumb img{
  transition : .5s all;
}
.ombreThumb{
  position : absolute;
  height: 100%;
  width : 100%;
  background-color : black;
  opacity : 0;
  transition : .2s all;
  z-index : 3;
}
.titreThumb{
  position : absolute;
  bottom : -50px;
  width : 100%;
  height : 50px;
  background-color : #3636365c;
  text-align : center;
  color : white;
  transition : .5s all;
  z-index : 3;
}
.clientThumb:hover .titreThumb{
  -webkit-transition-property: all; /* Safari */
  -webkit-transition-duration: .5s; /* Safari */
  -webkit-transition-delay: .2s; /* Safari */
  transition-property: all;
  transition-duration: .5s;
  transition-delay: .2s;
  bottom :0px;
}


/* portfolio */
/*=== 5.9 Portfolio ===*/
.portfolio .portfolio-box {
    position: relative;
  }
  
  .portfolio .portfolio-box .portfolio-img {
    position: relative;
    overflow: hidden;
  }
  
  .portfolio .portfolio-box .portfolio-overlay {
    text-align: center;
    display: -ms-flexbox !important;
    display: flex !important;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    opacity: 0;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  
  .portfolio .portfolio-box:hover .portfolio-overlay {
    opacity: 1;
  }
  
  .portfolio .portfolio-box .portfolio-img img {
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  
  .portfolio .portfolio-box:hover .portfolio-img img {
    -webkit-filter: blur(2px);
    filter: blur(2px);
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
  }
  
  .portfolio .portfolio-box .portfolio-overlay-details {
    width: 100%;
    margin-top: auto;
    margin-bottom: auto;
  }
  
  .portfolio .portfolio-details {
    padding: 1.5rem 0;
    text-align: center;
  }

  .portfolio a, .portfolio a:focus {
    color: #f5df4e;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }
  
  .portfolio a:hover, .portfolio a:active {
    color: #f3d92c;
    text-decoration: none;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }

  .ajax-container {
    position: relative;
    background: #FFF;
    margin: 40px auto;
    max-width: 1170px;
    padding: 30px;
  }

  .text-5 {
    font-size: 21px !important;
    font-size: 1.3125rem !important;
  }
  
  .text-light {
    color: #dee3e4 !important;
  }

  .text-primary{
    color : #005b7c !important;
  }

  .list-style-2 > li {
    list-style-type: none;
    border-bottom: 1px solid #eaeaea;
    padding-top: 12px;
    padding-bottom: 12px;
}