.portfolio-content
{
	width: 100%;
	height: auto;
	display: inline-block;
	
	padding-left: 35px;
	padding-right: 35px;
/* 	padding-top: 20px; */
	padding-bottom: 40px;
}


.portfolio-item 
{ 
	/*width: 380px; */
	width: calc(25% - 33px);	/* 4 per row*/
	display: inline-block;
	margin-bottom: 20px;
	cursor: pointer;
	
	visibility: hidden;
	
	-webkit-transition: transform .2s ease-in-out;
    transition: transform .2s ease-in-out;
}

@media screen and (max-width: 1280px) {
    .portfolio-item  {
        width: calc(33% - 33px);	/* 3 per row*/
    }
}

@media screen and (max-width: 1010px) {
    .portfolio-item  {
        width: calc(50% - 46px);	/* 2 per row*/
    }
}

@media screen and (max-width: 560px) {
    .portfolio-item  {
        width: calc(100% - 70px);	/* 1 per row*/
    }
}

.portfolio-item:hover{
	transform: scale(1.04);
}

.portfolio-item img{
	width: 100%;
	height: auto;
}

.project-description{
	padding: 30px;
	color: white;
}

.project-color-1{
/* 	background-color: #F58F31; */
	background-color: #FF5100;
}

.project-color-2{
	background-color: #313E48;
}

.project-title{
	text-transform: uppercase;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;	/* Bold */
	font-size: 16px;
	
	padding: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.project-text{
	font-family: "Muli", sans-serif; !important;
	font-weight: 300;	/* Light */
	font-size: 14px;
	
	padding: 0;
	margin-top: 10px;
	
	height: 40px;
    overflow: hidden;
}

.project-text *{
	padding: 0;
	margin: 0;
}

.project-footer{
	font-family: "Montserrat", sans-serif;
	font-weight: 400;	/* Regular */
	font-size: 9px;
	
	padding: 0;
	margin-top: 20px;
}

.project-footer *{
	padding: 0;
	margin: 0;
}

/* LOAD MORE PROJECTS */
.portfolio-more{
	
	width: calc(100% - 70px);
	margin-left: 35px;
	
	margin-bottom: 40px;
	padding-top: 30px;
	padding-bottom: 30px;
	
	background-color: #E6E6E6;
	color: #313E48;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;	/* Bold */
	font-size: 16px;
	
	cursor: pointer;
}

.portfolio-more:hover{
	opacity: 0.8;
}


.portfolio-filter-by {
	padding: 5px;
	border: 1px solid #c1c1c1;
}