header  {
    height: 100vh;
    background: url(../images/services/service_1.png) center /cover no-repeat;

}
header {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    
}
header #card{
    max-width: 80%;
    padding: 40px 40px;
    align-self: center;
    text-align: center;
    position: absolute;
    /* margin-bottom: -90%; */
    right: auto;
    left: auto;
    bottom: 90px;
    /* right: 100px; */
    background-color: rgba(30, 30, 30, 0.396) ;
    backdrop-filter: blur(8px);
  color: var(--light-color);

}
header #card h1{
    margin :20px 0;
}
header #card #disc{
    line-height: 30px;
    font-size: 22px;
}


.stories .card-container{
    
    margin: 30px;
    gap: 10px;
    position: relative;


}
.stories .card-container #pattern{
    position: absolute;
    z-index: 0px;
}
.stories .card-container .card{
    /* width: 400px; */
   
    
   
    gap: 15px;
    border: 1px solid #80808070;
}
.stories .card-container .card img{
    width: 200px;
   object-fit: center;
}
.stories .card-container .card .content{
display: flex;
flex-direction: column;
justify-content:space-around;
max-width: 300px;
  padding: 20px 5px;
}

.stories .card-container .card .content button{
    color: var(--primary-color);
    border: 2px solid var(--primary-color) !important;
    background-color: var(--light-color);
    font-size: 16px;
    width: 200px;
    padding: 15px;
   
}