.portfolio-item .wrap {
	padding: 80px 2%;
}

.portfolio-item .wrap > .cols {
	width: 100%;
	display: flex;
}

.portfolio-item .wrap > .cols > .col {
	width: 100%;
	padding: 40px 2%;
	flex: 1;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
}

.portfolio-item table.portfolio-data {
	width: 100%;
}

.portfolio-item table.portfolio-data td {
	padding: 10px;
	border: 1px solid #ddd;	
}

.portfolio-item table.portfolio-data tr > td:first-child {
	padding-right: 20px;	
}

.portfolio-item table.portfolio-data >tbody > tr:nth-child(even) > td {
	background-color: #fafafa;
}

.portfolio-item .wrap .col .portfolio {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

.portfolio-item .wrap .col .portfolio { 
  display: flex;
  flex-flow: row wrap;
  margin-left: -8px; /* Adjustment for the gutter */
  width: 100%;
}

.portfolio-item .wrap .col .portfolio > li {
  flex: auto;
  height: 250px;
  min-width: 150px;
  margin: 0 8px 8px 0; /* Some gutter */
}

.portfolio-item .wrap .col .portfolio > li img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.portfolio-item .wrap .col .portfolio > li:nth-child(4n+1) {
  width: 250px;
}
.portfolio-item .wrap .col .portfolio > li:nth-child(4n+1):nth-child(4n+2) {
  width: 325px;
}
.portfolio-item .wrap .col .portfolio > li:nth-child(4n+1):nth-child(4n+3) {
  width: 180px;
}
.portfolio-item .wrap .col .portfolio > li:nth-child(4n+1):nth-child(4n+4) {
  width: 380px;
}

@media only screen and (max-width: 960px) {
	.portfolio-item .wrap > .cols {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
}