body{
    font-family: 'Fredoka One', cursive;
}
.peso_bgBlue{
    background-color: rgb(40, 54, 69);
}

.peso_bgOrange{
    background-color: #FF8000;
}
nav a{
    color:white !important;
    font-size:20px;
}

nav a:hover{
    color: #FF8000 !important;
}
.peso_bgBlueDegade{
    background: linear-gradient( rgb(40, 54, 69),white)
}
.peso_colorBlueLight{
    color: #1490d7 !important;
}
html{
    scroll-behavior: smooth !important;
}
.navbar-brand{
    animation-name: brand;
    animation-duration: 2s;
    position:relative;
}
@keyframes brand{
    0%{left:-1000px;}
   100%{left: 0px;}
}

.navbar-nav{ 
    animation-name: nav;
    animation-duration:2s;
    position:relative;
}
@keyframes nav{
    0%{left:1000px;}
   100%{left:0px;}
}

.monBouton{
    animation-name: saut;
    animation-duration:1s;
    position: relative;
    animation-iteration-count:infinite ;
    animation-direction:alternate;
}
@keyframes saut{
    0%{
        transition: all 200ms ease-in;
        transform: scale(1);
    }
   100%{
       transition: all 200ms ease-in;
       transform: scale(1.2);
   }
}

.animationTemoignage1{
    animation-name: temoignage1;
    animation-duration: 1s;
    position: relative;
}
@keyframes temoignage1{
    0%{left: -1000px;}
    100%{left: 0px;}
}    

.animationTemoignage2{
    animation-name: temoignage2;
    animation-duration: 1s;
    position: relative;
}
@keyframes temoignage2{
    0%{bottom: -100px;}
    100%{bottom: 0px;}
}    

.animationTemoignage3{
    animation-name: temoignage3;
    animation-duration: 1s;
    position: relative;
}
@keyframes temoignage3{
    0%{left: 1000px;}
    100%{left: 0px;}
}   
.video-container {
    position: relative;
    padding-bottom: 62.5%; /* ratio 16/9 */
    height: 0; overflow: hidden;
    clear: both;
}
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.iframe__container{
    width: 80%;
    position: relative;
  }
.iframe__container::after{
    content:"";
    display: block;
    width: 100%;
    padding-bottom: calc(315/560*100%);
  }
iframe{
    position: absolute;
    width: 100%;
    height: 100%;
    top:0px;
    left: 0px;
  }