@font-face {
    font-family: 'MadeEvolve';
    src:
      url("font/madeevolve-50605d5552b38e0420f653f1efc09889.otf") format("truetype");
  }
@font-face {
    font-family: 'sourceCode';
    src: url("font/SourceCodePro-6813bcf7c0466c96fcd5481149b4c30d.ttf") format("truetype");
}

body {
    background-image: url("images/background-8ad16ef393d3b555cb4a82fd840427bf.jpg");
    background-size: cover;
}

.madeEvolv{
    font-family: "MadeEvolve", arial, helvetica, sans-serif;
    color : whitesmoke;
}

.sourceCode{
    font-family: 'sourceCode', arial, helvetica, sans-serif;
    color:whitesmoke;
}

.banner{
    background-color: rgba(0, 0, 0, 0.5);
}
.bannerAbout{
    background-color: rgba(117, 117, 117, 0.5);    
}

.scale-up-hor-left {
	-webkit-animation: scale-up-hor-left 0.9 s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: scale-up-hor-left 0.9s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

/**
 * ----------------------------------------
 * animation scale-up-hor-left
 * ----------------------------------------
 */
 @-webkit-keyframes scale-up-hor-left {
    0% {
      -webkit-transform: scaleX(0.4);
              transform: scaleX(0.4);
      -webkit-transform-origin: 0% 0%;
              transform-origin: 0% 0%;
    }
    100% {
      -webkit-transform: scaleX(1);
              transform: scaleX(1);
      -webkit-transform-origin: 0% 0%;
              transform-origin: 0% 0%;
    }
  }
  @keyframes scale-up-hor-left {
    0% {
      -webkit-transform: scaleX(0.4);
              transform: scaleX(0.4);
      -webkit-transform-origin: 0% 0%;
              transform-origin: 0% 0%;
    }
    100% {
      -webkit-transform: scaleX(1);
              transform: scaleX(1);
      -webkit-transform-origin: 0% 0%;
              transform-origin: 0% 0%;
    }
  }

  .footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 60px;
}

.scale-up-ver-bottom {
	-webkit-animation: scale-up-ver-bottom 0.9s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: scale-up-ver-bottom 0.9s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

/**
 * ----------------------------------------
 * animation scale-up-ver-bottom
 * ----------------------------------------
 */
 @-webkit-keyframes scale-up-ver-bottom {
    0% {
      -webkit-transform: scaleY(0.4);
              transform: scaleY(0.4);
      -webkit-transform-origin: 0% 100%;
              transform-origin: 0% 100%;
    }
    100% {
      -webkit-transform: scaleY(1);
              transform: scaleY(1);
      -webkit-transform-origin: 0% 100%;
              transform-origin: 0% 100%;
    }
  }
  @keyframes scale-up-ver-bottom {
    0% {
      -webkit-transform: scaleY(0.4);
              transform: scaleY(0.4);
      -webkit-transform-origin: 0% 100%;
              transform-origin: 0% 100%;
    }
    100% {
      -webkit-transform: scaleY(1);
              transform: scaleY(1);
      -webkit-transform-origin: 0% 100%;
              transform-origin: 0% 100%;
    }
  }
  
  .text-focus-in {
	-webkit-animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

/**
 * ----------------------------------------
 * animation text-focus-in
 * ----------------------------------------
 */
 @-webkit-keyframes text-focus-in {
    0% {
      -webkit-filter: blur(12px);
              filter: blur(12px);
      opacity: 0;
    }
    100% {
      -webkit-filter: blur(0px);
              filter: blur(0px);
      opacity: 1;
    }
  }
  @keyframes text-focus-in {
    0% {
      -webkit-filter: blur(12px);
              filter: blur(12px);
      opacity: 0;
    }
    100% {
      -webkit-filter: blur(0px);
              filter: blur(0px);
      opacity: 1;
    }
  }

.link{
    color:whitesmoke;
}
.link:hover{
    color:gray;
    cursor: pointer;
}

.scale-up-center {
	-webkit-animation: scale-up-center 0.7s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: scale-up-center 0.7s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

/**
 * ----------------------------------------
 * animation scale-up-center
 * ----------------------------------------
 */
 @-webkit-keyframes scale-up-center {
        0% {
          -webkit-transform: scale(0.5);
                  transform: scale(0.5);
        }
        100% {
          -webkit-transform: scale(1);
                  transform: scale(1);
        }
      }
      @keyframes scale-up-center {
        0% {
          -webkit-transform: scale(0.5);
                  transform: scale(0.5);
        }
        100% {
          -webkit-transform: scale(1);
                  transform: scale(1);
        }
      }
.breadcrumb-item + .breadcrumb-item::before {
        content: ">";
        color: whitesmoke;
    }

.breadcrumb .active {
        color: whitesmoke;
    }

.slide-in-right {
    -webkit-animation: slide-in-right 0.9s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-in-right 0.9s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
/**
 * ----------------------------------------
 * animation slide-in-right
 * ----------------------------------------
 */
 @-webkit-keyframes slide-in-right {
        0% {
          -webkit-transform: translateX(1000px);
                  transform: translateX(1000px);
          opacity: 0;
        }
        100% {
          -webkit-transform: translateX(0);
                  transform: translateX(0);
          opacity: 1;
        }
      }
      @keyframes slide-in-right {
        0% {
          -webkit-transform: translateX(1000px);
                  transform: translateX(1000px);
          opacity: 0;
        }
        100% {
          -webkit-transform: translateX(0);
                  transform: translateX(0);
          opacity: 1;
        }
      }

.photo{
    width:auto;
    height: 150px;
    border-radius: 10%;
    border: 2px solid whitesmoke;
    
}
    
.tag{
        background-color: rgb(30, 200, 126);
        color: whitesmoke;
        border-radius: 20px;    
}
.taglink{
        background-color: rgb(248, 193, 42);
        color: whitesmoke;
        border-radius: 20px;
}
.titre{
    display: none;
    position : absolute;
    top:0;
    left:0;
    z-index: 1000;
    background-color: rgba(117, 117, 117, 0.5);
}

.cross
{
    position: absolute;
    right:10px;
    top:10px;
    z-index: 10;
    padding-right: 1rem;
    padding-top: .6rem;
    color: black;
}
@media (max-width: 768px) {
        .titre img {
            width: 100vw;
            height: auto;
        }
    }
    @media (min-width: 769px) {
        .titre img {
            height: 100vh;
            width: auto;
        }
    }
.circle{
    background-color: rgb(254, 211, 113);    
}
.circle:hover{
    background-color: rgb(237, 174, 0);
    cursor: pointer;
}
.scale-in-right {
    -webkit-animation: scale-in-right 0.9s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: scale-in-right 0.9s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
/* ----------------------------------------------
 * Generated by Animista on 2024-2-25 10:37:47
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation scale-in-right
 * ----------------------------------------
 */
 @-webkit-keyframes scale-in-right {
        0% {
          -webkit-transform: scale(0);
                  transform: scale(0);
          -webkit-transform-origin: 100% 50%;
                  transform-origin: 100% 50%;
          opacity: 1;
        }
        100% {
          -webkit-transform: scale(1);
                  transform: scale(1);
          -webkit-transform-origin: 100% 50%;
                  transform-origin: 100% 50%;
          opacity: 1;
        }
      }
      @keyframes scale-in-right {
        0% {
          -webkit-transform: scale(0);
                  transform: scale(0);
          -webkit-transform-origin: 100% 50%;
                  transform-origin: 100% 50%;
          opacity: 1;
        }
        100% {
          -webkit-transform: scale(1);
                  transform: scale(1);
          -webkit-transform-origin: 100% 50%;
                  transform-origin: 100% 50%;
          opacity: 1;
        }
      }
.tp{
    width: 90vw;
}
.showimage{
    width: 60px;
    height: auto;
    margin: 5px;
}
.heightImage{
    height:35%;
}
.imgProjet{
        width: 95%;
}
.fontsizedescription{
        font-size: 0.8rem;      
}
.cardheight{
    height: 100%;
}

.tilt-in-fwd-tr {
	-webkit-animation: tilt-in-fwd-tr 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: tilt-in-fwd-tr 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
/* ----------------------------------------------
 * Generated by Animista on 2024-3-4 11:19:34
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation tilt-in-fwd-tr
 * ----------------------------------------
 */
 @-webkit-keyframes tilt-in-fwd-tr {
        0% {
          -webkit-transform: rotateY(20deg) rotateX(35deg) translate(300px, -300px) skew(-35deg, 10deg);
                  transform: rotateY(20deg) rotateX(35deg) translate(300px, -300px) skew(-35deg, 10deg);
          opacity: 0;
        }
        100% {
          -webkit-transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
                  transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
          opacity: 1;
        }
      }
      @keyframes tilt-in-fwd-tr {
        0% {
          -webkit-transform: rotateY(20deg) rotateX(35deg) translate(300px, -300px) skew(-35deg, 10deg);
                  transform: rotateY(20deg) rotateX(35deg) translate(300px, -300px) skew(-35deg, 10deg);
          opacity: 0;
        }
        100% {
          -webkit-transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
                  transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
          opacity: 1;
        }
      }

      .studi{
        width:50px; 
        height:auto;
      }