.ndayibi{
    border-left: 6px solid rgba(0, 0, 255, 0.808);
    padding: 5px;
    border-top-left-radius: 5px ;
    border-bottom-left-radius: 5px ;
    font-weight: bold;
    color: blue;
}
.avatar{
    border: 5px solid blue;
    width: 100px;
    height: 100px;
    border-radius: 70%;
    justify-content: center;
    display: flex;
    align-items: center;
    
}
@keyframes blink {
  0% {opacity: 0;}
  50% {opacity: 1;}
  100% {opacity: 0;}
}

#clignotant {
  font-size: 36px;
  animation: blink 1s infinite;
}
.rez{
    font-size: 20px;
    font-family: ELEPHANT, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}
.esth button{
    justify-content: center;
    align-items: center;
    text-align: center;
    
}
.music{
    border: 2px solid blue;
    height: 50vh;
    padding: 10px;
    background-repeat: no-repeat;
    margin-top: 10px;
    align-items: center;
    background-size: cover;
    animation: music 30s linear infinite;
    border-top-right-radius: 20px;
    border-bottom-left-radius:20px ;
}
.ecrire{
    border-left: 6px solid rgba(255, 0, 149, 0.925);
    padding: 5px;
    border-top-left-radius: 5px ;
    border-bottom-left-radius: 5px ;
    font-weight: bold;
    border-right: 6px solid rgba(255, 0, 149, 0.925);
    background-color: blue;
}
.chadrack{
    border-radius: 25px;
    margin-right: 40px;
    margin-left: 40px;
    align-items: center;
    text-align: center;
    padding: 20px;
    margin: 10px;
    

    animation: aristonji 30s linear infinite;
}
.vie{
    text-align: justify;
}
.notreprem{

    box-shadow: 50px 5px 25px black;

}
.ak{
    border-left: 6px solid rgba(0, 0, 255, 0.808);
    padding: 5px;
    border-top-left-radius: 5px ;
    border-bottom-left-radius: 5px ;
    font-weight: bold;
    
}

.pp{
    align-items: center;
    text-align: center;
    justify-content: center;
}
.pctg{
    align-items: center;
    text-align: center;
    justify-content: center;
    
}
.hero{
    background: url('image/2.jpg');
    background-size: cover;
    height: 60vh;
    text-align: center;
    margin-top: 0;
}
.etiko{
    color: white;
    margin-top: 10px;
    font-family:Comic Sans MS;
}
.aristonji{
    color:whitesmoke ;
    margin-top: 5px;
    font-size: 20px;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

@keyframes aristonji{
    0%{
        background-color: rgba(255, 255, 0, 0.74);
        color: rgba(0, 0, 0, 0.808);
    }
    10%{
        background-color: rgba(0, 0, 255, 0.699);
        color: rgba(255, 255, 0, 0.705);
    }
    30%{
        background-color: rgba(172, 255, 47, 0.644);
        color: blue;
    }
    50%{
        background-color: rgba(255, 222, 173, 0.699);
        color: cyan;
    }
    70%{
        background-color: rgba(51, 255, 0, 0.555);
        color: black;
    }
    80%{
        background-color: rgba(0, 128, 0, 0.603);
        color: red;
    }
    100%{
        background-color: rgba(255, 217, 0, 0.678);
        color: fuchsia;
    }
}

@keyframes music{
    0%{
        background-image: url('image/zzz.jpg');
        
    }
    10%{
        background-image:url('image/images\ \(1\).jpg')
    }
    30%{
       background-image: url('image/images\ \(2\).jpg');
    }
    50%{
        background-image: url('image/images\ \(3\).jpg');
    }
    70%{
        background-image: url('image/images\ \(4\).jpg');
    }
    80%{
        background-image: url('image/images\ \(5\).jpg');
    }
    100%{
        background-image: url('image/images\ \(6\).jpg');
    }
}