@font-face
{
  font-family: "mont";
  src: url(../font/Poppins-Medium.ttf) format("woff");
}

@font-face
{
  font-family: "mont";
  src: url(../font/Poppins-Light.ttf) format("woff");
}

.bg-black
{
  background-color: black;
}

.titre
{
  letter-spacing: 2px;
}

.title
{
  font-family: "mont";
}
h1,h2,h3,h4,h5,h6
{
  font-family: "mont";
  font-weight: 700;
  letter-spacing: 2px;
}

.textRevealContainer {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-family: "Comic Sans MS", cursive, sans-serif;
  font-size: 1.5em; /*adjust according to your need*/
  text-align: center; /*in case you write multiline text*/
}

.textReveal {
  overflow: hidden;
  animation: textRevealAnim 2s ease 0.5s forwards;
}

.textReveal > div {
  padding: 8px 16px;
  font-family: "Roboto", sans-serif;
  font-weight: bold;
  color: white;
  font-size: 2em;
  transform: translateX(100%);
  border-left: 2px solid red;
  overflow: hidden;
  animation: textRevealAnim 2s ease 0.5s forwards,
    borderOpacityAnim 2s ease 0.5s forwards;
}

.textReveal > div > div {
  transform: translateX(-100%);
  animation: textRevealAnim 2s ease 0.5s forwards;
}

@keyframes textRevealAnim {
  to {
    transform: translateX(0);
  }
}

@keyframes borderOpacityAnim {
  50% {
    border-left: 2px solid red;
  }
  100% {
    border-left: 2px solid transparent;
  }
}

.textReveal.x50 {
  transform: translateX(-50%);
}

.textReveal.x100 {
  transform: translateX(-100%);
}

.textReveal.zoom > div {
  transform: translateX(100%) scale(0.5, 0.5);
}

.textReveal.rotateY {
  perspective: 100px; /*adjust according to your need*/
}

.textReveal.rotateY > div {
  transform: translateX(100%) rotateY(20deg);
}

.textReveal.color > div > div {
  background: linear-gradient(
    to right,
    red,
    red 45%,
    orange 45%,
    orange 55%,
    red 55%,
    red
  );
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-size: 300%;
  animation: textRevealAnim 2s ease 0.5s forwards,
    bgShiftAnim 3s ease 0.5s forwards;
}

@keyframes bgShiftAnim {
  to {
    background-position: 100%;
  }
}
.nav-link
{
  font-weight: bolder;
}

.box5{background:#444;position:relative}
.box5:after,.box5:before{width:50px;height:50px;border-radius:50%;background:#10a5b8;position:absolute;top:-80px;left:15px;opacity:0;z-index:1;transition:all .35s ease}
.box5:after{top:auto;left:auto;bottom:-80px;right:15px}
.box5:hover:after,.box5:hover:before{opacity:.75;transform:scale(8);transition-delay:.15s}
.box5 img{width:100%;height:auto;transition:all .35s ease-out 0s}
.box5:hover img{opacity:.4}
.box5 .icon{margin:0;position:absolute;bottom:15px;right:15px;z-index:2;transform:scale(0);transition:all .35s ease-out}
.box5:hover .icon{transform:scale(1);transition-delay:.15s}
.box5 .icon li a{display:block;width:35px;height:35px;line-height:35px;background:#fff;font-size:18px;color:#444;margin-right:10px;position:relative;transition:all .5s ease 0s}
.box5 .icon li a:hover{background:#444;color:#fff}
.box5 .box-content{padding:20px 15px;position:absolute;top:0;left:0;z-index:1}
.box5 .title{font-size:20px;font-weight:800;color:#fff;margin:0 0 5px;opacity:0;transform:translate(-20px,-20px);transition:all .35s ease-out}
.box5:hover .title{opacity:1;transform:translate(0,0);transition-delay:.15s}
.box5 .post{display:inline-block;font-size:16px;color:#fff;opacity:0;transform:translate(-20px,-20px);transition:all .35s ease-out}
.box5:hover .post{opacity:1;transform:translate(0,0);transition-delay:.15s}
.box6 .title,.box6 img,.box6:after{transition:all .35s ease 0s}
@media only screen and (max-width:990px){.box5{margin-bottom:30px}}


.item {
  transform: scale(0);
  transition: all 700ms;
}

.in-view {transform: scale(1); }

span.carousel-control-prev-icon {
  position: relative;
  bottom: 40px;
  right: 40px;
 }

 span.carousel-control-next-icon {
  position: relative;
  bottom: 40px;
 }

 .col-md-4{
  display: inline-block;
  margin-left:-10px;
}
.col-md-4 img{
  width:100%;
  height:auto;
}

.animate {
  -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}



.doc-img{
 /* Webkit for Chrome and Safari */
-webkit-transform: scale(1, 1);
-webkit-transition-duration: 500ms;
-webkit-transition-timing-function: ease-out;

/* Webkit for Mozila Firefox */
-moz-transform: scale(1, 1);
-moz-transition-duration: 500ms;
-moz-transition-timing-function: ease-out;

/* Webkit for IE( Version: 11, 10 ) */
-ms-transform: scale(1, 1);
-ms-transition-duration: 500ms;
-ms-transition-timing-function: ease-out;
}

.doc-item:hover .doc-img{
 /* Webkit for Chrome and Safari */
-webkit-transform: scale(1.2, 1.2);
-webkit-transition-duration: 500ms;
-webkit-transition-timing-function: ease-out;

/* Webkit for Mozila Firefox */
-moz-transform: scale(1.2, 1.2);
-moz-transition-duration: 500ms;
-moz-transition-timing-function: ease-out;

/* Webkit for IE( Version: 11, 10 ) */
-ms-transform: scale(1.20, 1.20);
-ms-transition-duration: 500ms;
-ms-transition-timing-function: ease-out;


}

.doc-item:hover .social-lists{


}