.uhuru-portfolio-sort {
	margin-top: -20px;
}

.uhuru-portfolio-sort ul {
	float: right;
	margin: 0 0 10px 0;
}

.uhuru-portfolio-sort li {
	float: left;
	margin-left: 5px;
}

.uhuru-portfolio-sort a {
	margin-bottom: 0;
}

.uhuru-portfolio-list {
	margin: -28px 0 0;
	overflow: hidden;
	float: none;
	clear: both;
}

.uhuru-portfolio-list ul {
	overflow: hidden;
	margin-bottom: 0;
}

.uhuru-portfolio-list li {
	display: block;
	width: 234px;
	height: 201px;
		
		
	float: left;
	
	margin: 0 1px 1px 0;
	position: relative;
}

.uhuru-portfolio-list.hexagon li {
	height: 241px;
}


.uhuru-portfolio-list li:nth-child(4n) {
	margin-right: 0;
}

.uhuru-portfolio-list li img,
.uhuru-portfolio-list li canvas {
	margin: 0;
    padding: 0;
    
    height: 100%;
    width: 100%;
    
    position: absolute;
    top: 0;
    left: 0;
    
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
}

.uhuru-portfolio-list.hexagon li img {
	visibility: hidden;
}
 
.uhuru-portfolio-list li .hover {
	opacity: 0;
}

.uhuru-portfolio-list li:hover .hover {
	opacity: 1;
}

.uhuru-portfolio-list h3 {
	position: absolute;
	bottom: 0;
	width: 100%;
	
	text-align: center;
	
	opacity: 0;
	
	transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
}

.uhuru-portfolio-list.hexagon h3 {
	top: 50%;
	bottom: auto;
}

.uhuru-portfolio-list li:hover h3 {
	opacity: 1;
}

.uhuru-portfolio-list.circle li {
	height: 220px;
	width: 220px;
	margin: 0 20px 20px 0;
}

.uhuru-portfolio-list.circle li:nth-child(4n) {
	margin-right: 0;
}

.uhuru-portfolio-list.circle .portfolio-item {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	position: relative;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);
	background-position: center center;
}

.uhuru-portfolio-list.circle .item-wrap{
	position: absolute;
	width: 180px;
	height: 180px;
	border-radius: 50%;

	-webkit-perspective: 800px;
	-moz-perspective: 800px;
	-o-perspective: 800px;
	-ms-perspective: 800px;
	perspective: 800px;

	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;

	top: 20px;
	left: 20px;
	box-shadow: 
		0 0 0 20px rgba(255,255,255,0.2), 
		inset 0 0 3px rgba(115,114, 23, 0.8);

}

.uhuru-portfolio-list.circle .item-info{
	position: absolute;
	width: 180px;
	height: 180px;
	border-radius: 50%;

	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
		
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;

}

.uhuru-portfolio-list.circle .item-info > div {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-position: center center;

	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
}

.uhuru-portfolio-list.circle .item-info .item-back {
	-webkit-transform: rotate3d(0,1,0,180deg);
	-moz-transform: rotate3d(0,1,0,180deg);
	-o-transform: rotate3d(0,1,0,180deg);
	-ms-transform: rotate3d(0,1,0,180deg);
	transform: rotate3d(0,1,0,180deg);
	
	background: #111;
}

.uhuru-portfolio-list.circle .item-info h3 {
	position: absolute;
	top: 50%;
	bottom: auto;
	text-shadow: 
		0 0 1px #fff, 
		0 1px 2px rgba(0,0,0,0.3);
}

.uhuru-portfolio-list.circle .portfolio-item:hover .item-wrap {
	box-shadow: 
		0 0 0 0 rgba(255,255,255,0.8), 
		inset 0 0 3px rgba(115,114, 23, 0.8);
}

.uhuru-portfolio-list.circle .portfolio-item:hover .item-info {
	-webkit-transform: rotate3d(0,1,0,-180deg);
	-moz-transform: rotate3d(0,1,0,-180deg);
	-o-transform: rotate3d(0,1,0,-180deg);
	-ms-transform: rotate3d(0,1,0,-180deg);
	transform: rotate3d(0,1,0,-180deg);
}



#uhuru-portfolio-list-foot #rss {
	float: left;
}

#uhuru-portfolio-list-foot #pagination {
	float: right;
}

#uhuru-portfolio-list-foot #pagination .pagination-left {
	margin-right: 40px;
}

@media (min-width: 1200px) {
	.uhuru-portfolio-list li {
		width: 291px;
		height: 250px;
		
		margin: 0 2px 2px 0;
	}

	.uhuru-portfolio-list.hexagon li {
		height: 300px;
	}

	.uhuru-portfolio-list.circle li {
		height: 270px;
		width: 270px;
		margin: 0 30px 30px 0;
	}

	.uhuru-portfolio-list.circle .item-wrap{
		width: 210px;
		height: 210px;

		top: 30px;
		left: 30px;
		box-shadow: 
			0 0 0 30px rgba(255,255,255,0.2), 
			inset 0 0 3px rgba(115,114, 23, 0.8);

	}

	.uhuru-portfolio-list.circle .item-info{
		width: 210px;
		height: 210px;
	}
}

@media (min-width: 768px) and (max-width: 979px) {
	/* width: 724px */
	
	.uhuru-portfolio-list li {
		width: 240px;
		height: 206px;
		
		margin: 0 2px 2px 0;
	}

	.uhuru-portfolio-list.hexagon li {
		height: 241px;
	}	
	
	.uhuru-portfolio-list li:nth-child(4n) {
		margin-right: 2px;
	}
	
	.uhuru-portfolio-list li:nth-child(3n) {
		margin-right: 0;
	}

	.uhuru-portfolio-list.circle li {
		height: 228px;
		width: 228px;
	}

	.uhuru-portfolio-list.circle li:nth-child(4n) {
		margin-right: 20px;
	}

	.uhuru-portfolio-list.circle li:nth-child(3n) {
		margin-right: 0;
	}

	.uhuru-portfolio-list.circle .item-wrap{
		width: 188px;
		height: 188px;

		top: 20px;
		left: 20px;
		box-shadow: 
			0 0 0 20px rgba(255,255,255,0.2), 
			inset 0 0 3px rgba(115,114, 23, 0.8);

	}

	.uhuru-portfolio-list.circle .item-info{
		width: 188px;
		height: 188px;
	}
}

@media (min-width: 501px) and (max-width: 767px) {
	.uhuru-portfolio-list {
		margin: 0 0 24px 0;
	}
	
	.uhuru-portfolio-list li {
		width: calc( (100% - 2px) / 3 );
		width: -o-calc( (100% - 2px) / 3 );
		width: -moz-calc( (100% - 2px) / 3 );
		width: -webkit-calc( (100% - 2px) / 3 );
		
		
		/* height calculated via js */
		
		margin: 0 1px 1px 0;
	}	
	
	.uhuru-portfolio-list li:nth-child(4n) {
		margin-right: 1px;
	}
	
	.uhuru-portfolio-list li:nth-child(3n) {
		margin-right: 0;
	}
}

@media (min-width: 480px) and (max-width: 767px) {
	.uhuru-portfolio-list.circle li {
		width: calc( (100% - 20px) / 3 );
		width: -o-calc( (100% - 20px) / 3 );
		width: -moz-calc( (100% - 20px) / 3 );
		width: -webkit-calc( (100% - 20px) / 3 );
		
		
		/* height calculated via js */
		
		margin: 0 10px 10px 0;
	}	
	
	.uhuru-portfolio-list.circle li:nth-child(4n) {
		margin-right: 10px;
	}
	
	.uhuru-portfolio-list.circle li:nth-child(3n) {
		margin-right: 0;
	}

	.uhuru-portfolio-list.circle .item-wrap{
		top: 15px;
		left: 15px;
		box-shadow: 
			0 0 0 15px rgba(255,255,255,0.2), 
			inset 0 0 3px rgba(115,114, 23, 0.8);

	}

	.uhuru-portfolio-list.circle h3 {
		font-size: 16px;
	}
}

@media (max-width: 500px) {
	.uhuru-portfolio-list {
		margin: 0 0 24px 0;
	}
	
	.uhuru-portfolio-list li {
		width: calc( (100% - 1px) / 2 );
		width: -o-calc( (100% - 1px) / 2 );
		width: -moz-calc( (100% - 1px) / 2 );
		width: -webkit-calc( (100% - 1px) / 2 );
		
		
		/* height calculated via js */
		
		margin: 0 1px 1px 0;
	}	
	
	.uhuru-portfolio-list li:nth-child(4n) {
		margin-right: 1px;
	}
	
	.uhuru-portfolio-list li:nth-child(2n) {
		margin-right: 0;
	}
}

@media (max-width: 479px) {
	.uhuru-portfolio-list.circle li {
		width: calc( (100% - 10px) / 2 );
		width: -o-calc( (100% - 10px) / 2 );
		width: -moz-calc( (100% - 10px) / 2 );
		width: -webkit-calc( (100% - 10px) / 2 );
		
		
		/* height calculated via js */
		
		margin: 0 10px 10px 0;
	}	
	
	.uhuru-portfolio-list.circle li:nth-child(4n) {
		margin-right: 10px;
	}
	
	.uhuru-portfolio-list.circle li:nth-child(2n) {
		margin-right: 0;
	}

	.uhuru-portfolio-list.circle .item-wrap{
		top: 15px;
		left: 15px;
		box-shadow: 
			0 0 0 15px rgba(255,255,255,0.2), 
			inset 0 0 3px rgba(115,114, 23, 0.8);

	}

	.uhuru-portfolio-list.circle h3 {
		font-size: 16px;
	}
}