/* Container styling */
.projects {
  padding: 5rem 0  9rem 0;
 border-radius: 1.25rem;
background: #100F0F;
margin:1rem;
}
.projects .main-heading{
    max-width: 450px;
}

.projects-slider { 
}

/* Each project item */
.projects-slider > div { 
  transition: transform 0.3s;
}

.projects-slider > div:hover {
  transform: translateY(-5px);
} 
/* Caption content */
.projects .item {
    margin:1rem;
    position:relative;
}
.projects .item .image{ 
    position:relative;
}
.projects .item .image .play{
    position:absolute;
    left:40%;
    top:40%
}
.projects .item .image .play svg{
     max-width:3.25rem;
    max-height:3.25rem;
}
.projects .item .image .left-icons {
     position:absolute;
    left:1rem;
    bottom:2rem;
    list-style:none;
}
.projects .item .image .left-icons svg{
    max-width:3.25rem;
    max-height:3.25rem;
}
.projects .btn{
    float:left;
}
.projects .item  .bottom{
    margin-top:auto;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
}
.projects .item .image img{
    border-radius: 1.25rem;
}
.projects .item .caption {
  position:relative;
  padding: 2rem 0rem 1rem 4rem;
  border-radius: 1.25rem; 
  width:100%;
  display:flex;
  flex-direction:column;
}
 
.projects .item  .caption h2 {
  color: #FFF;
text-align: right; 
font-size: 1.35rem;
font-style: normal;
font-weight: 700;
line-height: 120%; /* 2.1rem */
max-width: 12.625rem;
}
 

.projects .item .caption p {
  color: #FFF;
text-align: right; 
font-size: 1.75rem;
font-style: normal;
font-weight: 300;
line-height: 120%; /* 2.1rem */ 
}
 
/* Example responsive tweaks */
@media (max-width: 768px) {
   .projects .item .caption {
        width: 100%;
    }
   
}