label{ 
    display: block;
    padding: 5px;

}

body{
    background-color: rgb(236, 255, 234);
}



.hero{
    background-image: url(backgrounds/back1.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    /* gives the image boxshadow inside the immage*/
    box-shadow: 40px 30px 30px rgb(236, 255, 234) inset;

    min-block-size: 30vh;
   
}

a{
    color:  #18a7a7;
    text-decoration:  none;
}

.container{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
   justify-content: center;

    
}

.card{
     display: flex;
     background-color: rgb(135, 219, 219);
     width: 340px;
     height: 450px;
     margin: 50px;
     border-radius: 10px;
     box-shadow: 5px 20px 20px;
     flex-direction: column;
     align-items: center;
     justify-content: space-around;


     
    
}