*{
margin: 0px;
padding: 0px;
font-family: poppins;
box-sizing: border-box;
}
ul{
list-style: none;
}
a{
text-decoration: none;
}

body{
margin: 0px;
padding: 0px;
font-family: poppins;
background-color: rgba(255, 255, 255, 0.15);
}

/*--blog--------------------------*/
#blog{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 40px;
border-top: 1px solid rgba(0, 0, 0, 0.05);
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
background: #272727;
}
.blog-heading{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;

}
.blog-heading span{
color: #b0c4ff;
}
.blog-heading h3{
font-size: 2.4rem;
color: #76fdff;
font-weight: 600;
}
.blog-container{
display: flex;
justify-content: center;
align-items: center;
margin: 20px 0px;
flex-wrap: wrap;
}

.blog-box{
width:350px;
background-color: #272727;
border: 1px solid #272727;
margin: 20px 20px;

}
.blog-img{
width:100%;
height: auto;
}
.blog-img img{
width:100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.blog-text{
padding: 30px;
display: flex;
flex-direction: column;
}
.blog-text span{
color: #c9ffc4;
font-size: 0.9rem;
}
.blog-text .blog-title{
font-size: 1.3rem;
font-weight: 500;
color: #ffffff;
}
.blog-text p{
color: #6283d0;
font-size: 0.9rem;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
margin: 20px 0px;
}
.blog-text a{
color: #ffa9ad;
}
.blog-text a:hover{
color: #e7e2c1;
transition: all ease 0.3s;
}


@media(max-width:1250px){

.blog-box{
width: 300px;
}
} 
@media(max-width:1100px){
.blog-box{
width:70%;
}
}

@media(max-width:550px){

.blog-box{
margin: 20px 10px;
width: 100%;
}
#blog{
padding:20px;
}
}