.card {  
    transition: transform 0.3s ease;  
    background-color: white;  
    border-radius: 4px;  
    box-shadow: 0 2px 5px rgba(0,0,0,.1);  
    padding: 20px;  
    color: black; /* Ensuring text color is visible on white background */  
}  
  
.card:hover {  
    transform: translateY(-5px);  
}  
  
.card-body {  
    display: flex;  
    flex-direction: column; /* Stack the icon and text content vertically */  
    align-items: center; /* Center align the items */  
    text-align: center; /* Center the text for better aesthetics */  
}  
  
.icon-bg {  
    width: 100%; /* Full width of the parent card's width */  
    height: 0; /* Height is zero initially */  
    padding-top: 75%; /* Effective height becomes equal to width, maintaining aspect ratio */  
    background: linear-gradient(to top right, #75767A, #56575b); /* Diagonal gradient from lower-left to upper-right */  
    border-radius: 4px; /* Updated border radius */  
    margin-bottom: 15px; /* Space between icon and text */  
    position: relative; /* Relative positioning for possible content inside the circle */  
    overflow: hidden; /* Ensures no overflow of content outside the circle */  
}  
  
.icon-bg img {  
    position: absolute;  
    top: 50%;  
    left: 50%;  
    width: 50%; /* Scale image to 50% of .icon-bg size */  
    height: auto; /* Maintain aspect ratio */  
    transform: translate(-50%, -50%); /* Center the image */  
    object-fit: contain; /* Ensures the image maintains its aspect ratio */  
}  
  
.text-content {  
    text-align: center; /* Center align the text content */  
}  
  
.card-title {  
    margin: 0; /* Remove default margins */  
    color: black; /* Text color for readability */  
}  

.card-text {  
    margin: 0; /* Remove default margins */  
    color: black; /* Text color for readability */  
    font-size: 14px;
}  

.welcome-card {  
    background-color: white; /* Soft grey background */  
    transition: none; /* Removes transition effect */ 
    padding: 80px 0 80px 0;
    margin: 0 0 5% 0; 
}  


  
.welcome-card:hover {  
    transform: none; /* Removes hover effect */  
}  

.welcome-message {
    margin: 0 0 0 0; 
    gap: 0px; 
    text-align: center; 
    font-weight: 300;
    font-size:50px;
    /*font-family: BornReady,ui-serif,Georgia,Cambria,Times New Roman,Times,serif;*/
    font-family: "Kalam","Trebuchet MS";
    color: #A5132A;
}