.projects-section {
    /*padding: 4rem 0;*/
}

.projects-section .featured-text {
    padding: 0 0 0 0rem;
    /* border-top: 0.5rem solid #64a19d;*/
}

.featlist {
   /* padding: 0 0 0 2rem;*/
    /* border-top: 0.5rem solid #64a19d;*/
    padding: 0rem;
    padding-top: 1.5rem;
}

@media (min-width: 992px) {
    .featured-text {
        padding: 0 0 0 2rem;
        border-left: 0.5rem solid #7b0483;
    }

    .featlist {

        padding: 2rem;
        border-left: 0.5rem solid;
  border-image: linear-gradient(180deg, #7b0483 25%, #c6c6c4 ,#00baff,#0084ff) 1;
        /* border-top: 0.5rem solid #64a19d;*/
    }
}


.projects-section .project-link {

        position: absolute;
        bottom: 0;
        width: 100%;
    }

@media (max-width: 992px) {
.projects-section .project-link {

        position: absolute;
        bottom: 5px;
        right: 0px;
        float: right;
    text-align: right !important;
        width: 100%;
    }
}









@media (max-width:330px) {
    
    
        
    .project h4 {
        font-size: 1.2rem;        
    }
    
    .project hr {
        margin-top: 0.3rem;
        border-bottom: none;
        border-top: dotted;
        border-top-color: rgba(255, 255, 255, 0.5) !important;
        border-top-width: 0.1rem;
    }
    
    
     .project-text{
        padding-left: 1rem;
        padding-right: 1rem;
        padding-top: 1.5rem;
        padding-bottom: 2rem;
        }
    
    .project-text p{
        font-size: 0.7rem;
        line-height: 0.5rem;
        color:  rgba( 255, 255, 255, 0.70 );
    }

    .project-link{
        font-size: 0.8rem;
        text-align: right;
        
    }
}

@media (min-width: 331px) {
    
    .project h4 {
        font-size: 1.2rem;        
    }
    
    .project hr {
        
        margin-top: 0.5rem;
        border-bottom: none;
        border-top: dotted;
        border-top-color: rgba(255, 255, 255, 0.5) !important;
        border-top-width: 0.1rem;
        
        
    }
  
    
     .project-text{
        padding-left: 1rem;
        padding-right: 1rem;
        padding-top: 1.5rem;
        padding-bottom: 2rem;
        }
    
    .project-text p{
        font-size: 0.8rem;
        line-height: 0.5rem;
        color:  rgba( 255, 255, 255, 0.70 );
    }

    .project-link{
        font-size: 0.8rem;
        
    }
}

@media (min-width: 400px) {
         .project-text{
        padding-left: 2rem;
        padding-right: 2rem;
        padding-top: 1.5rem;
        padding-bottom: 2rem;
        }
    
}


@media (min-width: 476px) {
    
    .project h4 {
        font-size: 1.8rem;        
    }
    
    .project hr {
        
        margin-top: 0.5rem;
        border-bottom: none;
        border-top: dotted;
        border-top-color: rgba(255, 255, 255, 0.5) !important;
        border-top-width: 0.1rem;
        
        
    }
  
    
     .project-text{
        padding-left: 3rem;
        padding-right: 3rem;
        padding-top: 1.5rem;
        padding-bottom: 2rem;
        }
    
    .project-text p{
        font-size: 1rem;
        line-height: 0.8rem;
        color:  rgba( 255, 255, 255, 0.70 );
    }

    .project-link{
        font-size: 1rem;
        
    }
}


@media (min-width: 992px) {
    .projects-section .project-text {
       
        padding-top: 3.5rem;
        padding-left: 3rem;
        padding-right: 3rem;
    }

   /*.projects-section .project-link {
        
        position: absolute;
       
        bottom: 5px;
        right: 0px;
        float: none;
        width: 100%;
    }
*/
}

@media (min-width: 1200px) {
    .project-text {
        padding: 5rem !important;
  
    }
    
}




.projectSetup {
    /* position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0.5); /* or use transparent pixel.gif like below */
    background-image: url(../assets/img/your_components.png);
    /* only if 
    background-size: cover;
    your not using the rgba method */
    background-size: 100%;
    background-repeat: no-repeat;
}