.navbar {
    display: flex;
    background-color: #052d1380;;
}
.navbar>h1 {
    display: flex;
    align-items: center;
    color:rgb(93, 197, 143);
    padding-inline: 10px;
}
.navbar>a>img {
    width: 4em;
    padding: 0.3em;
}
.navlist {
    display: flex;
}
.navlist a {
    display: block;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    padding: 1.5em;
    text-decoration: none;
    color: rgba(250, 67, 104, 0.909);
    font-size: 1em;
    
}
.navlist a:hover {
    background-color: rgba(93, 197, 143, 0.21);
   
}

.navbut {
    display: none;
  
}
@media (max-width: 1000px) {
    .navbut {
        font-size: 3em;
        margin-left: 10px;
        padding-inline: 10px;
        padding-bottom: 2px;
        border: none;
        background-color: rgba(93, 197, 143, 0.816);
        color: rgb(2, 34, 36);
        display: block;
        cursor: pointer;
    }
    .navlist {
        display: none;
    }
    .drop:hover .navlist {
        display: block;
        position: absolute;
        top: 150px;
        left: 100px;
        background-color:  rgb(93, 197, 143);
    }
}

.navbar>a>img:hover {
    width: 4em;
    animation-name: rotation;
   animation-duration: 2s;
   animation-iteration-count:calc(1);
   animation-timing-function: linear;
}
@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(540deg);
    }
    50% {
        transform: rotate(-540deg);
    }
}
@media (max-width: 1000px) {
    .card-text {
        display: block;
        align-items: center;
    }
    .card-text>p {
       display: none;
    }
}