/* Reset some default margin and padding */
body{
    margin: 0;
    padding: 0;
background-color:honeydew ;
}


.ra{
    color: red;
    font-family: 'Great Vibes', cursive;
    padding-top: 5px;
    padding-right: 20px;
}
.rj{
    font-style: italic;
}

.card-title{
    text-align: center;
}
.card-body{
    display: flex;
    flex-direction: column;
    justify-content: center;
    display: block;


}
.card {
    width: 300px;
    height: 300px;
     justify-content: space-between;
    border-radius: 8px;
    transition: transform 0.3s ease;
}

/* Hover effect */
.card:hover {
    transform: scale(1.05);
    justify-content: space-between;
}
 
.pq{
    justify-content: space-between;
}


body, h1, h2, p, div {
    margin: 0;
    padding: 0;
}


.image-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50vh; 
}

img {
    max-width: 100%; 
    width: auto;
    height: auto;
}


/* Style the footer */
footer {
    background-color:white;
    text-align: center;
    justify-content: space-between;

}
.icon{
    width: 32px;
    height: 32px;
  }
.sa{
    flex-direction: row;
}