html, body {
    margin: 0;
    padding: 0;
}
.container{
    display: flex;
    flex-direction: column;
   border:1px solid #bdc3c7;
    margin:20px;
    height:340px;
    width:260px;
     border-top-left-radius: 4%;
      border-bottom-left-radius: 4%;
        border-top-right-radius:4%;
          border-bottom-right-radius:4%;
    
}
.header{
    height:160px;
      border-top-left-radius: 4%;
        border-top-right-radius:4%;
    width: 260px;
    background: rgb(237,244,246);
}
.blobs{
    border:2px solid rgb(227,229,242);
    border-top-left-radius: 40%;
      border-bottom-left-radius: 80%;
        border-top-right-radius:50%;
          border-bottom-right-radius:50%;
          height:100px;
          width:100px;  
          margin:30px;
          background: rgb(227,229,242);
          position:relative;
}
.header{
    display: flex;
    overflow: hidden;
}
.blobs1{
    height:50px;
    width:50px;
    border:1px solid rgb(227,229,242);
    border-radius: 50%;
    background-color: rgb(227,229,242);
    margin-top: 100px;
    position:relative;
}
.blobs2{
    height:100px;
    width:50px;
    border:1px solid rgb(227,229,242);
    border-radius:50%;
    background: rgb(227,229,242);
    margin-right: 10px;
    margin-top: 10px;
    position:relative;
}
.heading{
 
    position:absolute;
    top:50px; 
    left:50px;
    text-align: right;
    font-size: 2rem;
    font-weight:bold;
    color:rgb(112,118,138);
    
}
.blobs:hover {
    transform: scale(1.5); 
}
.blobs1:hover {
    transform: scale(1.5); 
}
.blobs2:hover {
    transform: scale(1.5); 
}
.info{
   margin-top:15px;
    display:flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding:10px;
}
.info1{
    text-align:left;
}
.image{
  
    background-position: center ;
    border: 1px;
    border-radius: 50%;
    height:50px;
    width:50px;
    
}
.enroll{
    margin-top:50px;
    display:flex;
    padding:10px;
    justify-content: space-between;
}
.hi{
    display:flex;
}
.h1{
    display:flex;
}


You challenge is clone a course card from Scrimba's homepage.

For the layout, you can go grid or flex.

Some extra things to look into:
 - logical properties for margin and padding
 - the new color syntax (for RGB and HSL)
 
 Stretch goals: 
  - Add those fun bubble animations!
  - Create a set of cards where the colors (and other things?) are updated through the use of custom properties

*/

/* Write your code here 👇 */