.vslider {	 	  
  display: grid;
  grid-template-columns: 1fr 1fr 1fr; /* 3 equal columns */
  height: 100vh;
  position:relative;
}
.vslider:after{
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	content:'';
	background-color:rgba(0, 0, 0, 0.2);
}
.vslider-item{ 
	display: flex;
	justify-content: center;
	align-items: flex-start;
	padding:150px 100px;
	border-left:1px solid rgba(0, 0 ,0, 0.2);	 
	text-align:center;
	color:var(--white);	 
	position:relative;
	z-index:2;
	transition: all 0.4s ease;
	
}
.vslider-item:hover{
	backdrop-filter: blur(5px);
	background-color:rgba(0, 0 ,0, 0.2);	 
}
.mid{
	align-items: flex-end;
}
.vslider-item:before{
 	background-color:var(--primary-color);
	width:0;
	height:5px;
	position:absolute;
	left:50%;
	top:0;
	content:''; 
	z-index:-1;
	transition: all 0.4s ease;
	
 }
.vslider-item:hover:before{
	 width:100%;
	 left:0;
	 
}
.vslider-item:first-child{
	border-left:0;
}

@media (max-width: 1280px) {

.vslider-item{ 
	padding:100px 20px;
	
}
.vslider-item .heading{
	font-size:30px;
	line-height:normal;
}
}

@media (max-width: 640px) {
.vslider {	 	  
  display: grid;
  height:auto;
  grid-template-columns: repeat(1, 1fr);
  border-left: 10px solid #fff;
        border-right: 10px solid #fff;
 
}
.vslider-item{ 
	padding:20px;
	align-items: center !important;
	border-left:0;	 
	border-bottom:1px solid rgba(255, 255 ,255, 0.2);	 
	
}
.vslider-item:last-child{
	border-bottom:0;	 
}
.vslider-item .heading{
	        font-size: 28px;
        line-height: 28px;
        margin-bottom: 15px;
	 
}
.vslider-item {
    backdrop-filter: blur(5px);
    background-color: rgba(0, 0, 0, 0.2);
	padding-top: 30px;
}
.vslider-item p{ margin-bottom: 20px;}
}