/* @import url(https://fonts.google.com/specimen/Inter); */
@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Outfit:wght@100..900&display=swap');
body{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: hsl(0, 0%, 8%);
    font-family: "Inter";
    opacity: 0.8;
    padding: 0px;

 
}
.card{
    /* border: 1px solid; */
    padding: 40px;
    /* padding-bottom: 65px; */
    /* border-radius: 10px; */
    background-color: hsl(0, 0%, 12%);
    align-items: center;
    /* width: 200px; */
    border-radius: 20px;
    /* height: 580px; */
    justify-content: center;
    display: flex;
    flex-direction: column;
}
img{
    border-radius: 90px;
    width: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    
    margin-bottom: 10px;
    /* padding-bottom: 0px; */
    align-content: center;
    /* padding-left: 50px; */
    opacity: 0.9;
    
}
h3{
    color: hsl(75, 94%, 57%);
    align-items: center;
    display: flex;
    
    margin-top: 0px;
    font-size: 14x;
    opacity: 0.9;
    

}
h1{
    color: hsl(0, 0%, 100%);
    opacity: 0.9;
    padding-bottom: 5px;
}
p{
    color: hsl(0, 0%, 100%);
    opacity: 0.9;


}
h4{
    
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 10px;
    color: hsl(0, 0%, 100%);
    background-color: hsl(0, 0%, 20%);
    width: 320px;
    padding: 15px ;
    font-size: medium;
    opacity: 0.9;
    font-weight: 400;
    transition: all 0.3s ease-in;
    
}
.content{
    margin-top: px;
    align-items: center;
    display: flex;
    flex-direction: column;
    font-size: small;
    font-weight: 600;
    
} 
h4:hover{
    background-color: hsl(75, 94%, 57%);
    color: black;
    /* transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); */
    
}