h1{
    color:gray;
}

.one{
    color:white;
    background: pink;
}

.two{
    color:plum;
    animation-name: slide1;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

@keyframes slide1 {
    0%{
        margin-left: 0px;
    }

    20%{
        margin-left: 50px;
    }
    
}

#one{
    color:aquamarine;
    animation: slide2 4s infinite alternate;
}

@keyframes slide2 {
    form{
        margin-left: 0;
    }

    to{
        margin-left: 50px;
    }
}

.three{
    background-color: aqua;
}

.pera{
    color:rgb(87, 38, 208);
}

.main{
    display:flex;

    }

.A {
    background:rgb(211, 146, 244);
    width:200px;
    height:150px;
    margin-left:140px;
}
.A:hover{
    background-color: rgb(108, 108, 188);
}

.B{
    background:aqua;
    width:200px;
    height:150px;
    margin-left:100px;
}

.B:hover{
    background-color: rgb(89, 175, 136);
}

.C{
    background:bisque;
    width:200px;
    height:150px;
    margin-left:100px;    
}

.C:hover{
    background-color: rgb(235, 200, 112);
}

.D{
    width:200px;
    height:150px;
    margin-left:100px;
    background-color: rgb(112, 235, 194); 
}

.D:hover{
    background-color: rgb(112, 215, 235);
}

.main1{
    display:flex; 
    justify-content:space-between;
    }
  
button:hover{
    color:blueviolet;
    background: #a4b679;
    border-radius: 20px;
    border: none;
}