
.isotope-item {
	z-index: 2;
}

.isotope-hidden.isotope-item {
	pointer-events: none; z-index: 1;
}

.isotope, .isotope .isotope-item {
	-webkit-transition-duration: 800ms;
	-moz-transition-duration: 800ms;
	-ms-transition-duration: 800ms;
	-o-transition-duration: 800ms;
	transition-duration: 800ms;
}

.isotope {
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	-ms-transition-property: height, width;
	-o-transition-property: height, width;
	transition-property: height, width;
}

.isotope .isotope-item {
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform, opacity;
	-ms-transition-property: -ms-transform, opacity;
	-o-transition-property: -o-transform, opacity;
	transition-property: transform, opacity;
}

ul#filters {margin: 20px 0;}
ul#filters li{ padding:0;}


.portfolio-control {
	height:190px;
	margin-top:-95px;
	top:50%;
	right:0;
	position:fixed;
	z-index:50;
}

.portfolio-control ul, .portfolio-control li {
	margin:0;
	padding:0;
	list-style:none outside none;
}

.portfolio-control a {
	display:block;
	background: #fff;
	color:#848494;
	width:50px;
	height:50px;
	line-height:50px;
	text-align:center;
	border-width: 1px 0 1px 1px;
	border-style:solid;
	border-color:#E5E5E5;
}

.portfolio-control a:hover, .portfolio-control a:active, .portfolio-control a:focus {
	background: #f5f5f5;
	color:#848494;
	border-color:#c5c5c5;
}

.portfolio-control a.btn-primary:hover, .portfolio-control a.btn-primary:active, .portfolio-control a.btn-primary:focus {
	color:#848494;
	border-color:#c5c5c5;
}

.portfolio-control a.btn-primary {
	background:#f5f5f5;
	border-color:#c5c5c5;
}

.portfolio-control a#shuffle {
	margin-bottom:20px;
}

.portfolio-control ul li:first-child a {
	margin-bottom:20px;
}

.element h3 {
	color: #20A5E8;
	font-size: 16px;
	margin: 10px 0;
}

.with-toggle .element h3:hover {
	cursor:pointer;
}

.portfolio-container {
	margin:0 -20px;
}

#portfolio-container-inner {
	height:100%;
	width:100%;
}

.wsp-z-index {
	z-index:35;
}

.element {
  margin: 0;
  padding:0;
  float: left;
  position: relative;
}

.element .portfolio-inner {
	margin:20px;
	background: #fff;
}

/* Start Columns */

.portfolio-1-cols .element {
	width: 100%;
}

.portfolio-2-cols .element {
	width: 49.9%;
}

.portfolio-3-cols .element {
	width: 33.30%;
}

.portfolio-4-cols .element {
	width: 24.9%;
}

.portfolio-6-cols .element {
	width: 16.65%;
}

.portfolio-12-cols .element {
	width: 8.32%;
}

.portfolio-2-cols .element.size-2x {
	width: 100%;
}

.portfolio-3-cols .element.size-2x {
	width: 66.60%;
}

.portfolio-4-cols .element.size-2x {
	width: 49.9%;
}

.portfolio-6-cols .element.size-2x {
	width: 33.3%;
}

.portfolio-12-cols .element.size-2x {
	width: 16.65%;
}

.portfolio-2-cols .element.size-3x {
	width: 100%;
}

.portfolio-3-cols .element.size-3x {
	width: 100%;
}

.portfolio-4-cols .element.size-3x {
	width: 74.9%;
}

.portfolio-6-cols .element.size-3x {
	width: 49.9%;
}

.portfolio-12-cols .element.size-3x {
	width: 24.9%;
}

.element.size-full { width: 100%; }

/* End Columns */

@media only screen and (max-width: 980px) {
	.element, .portfolio-1-cols .element, .portfolio-2-cols .element, .portfolio-3-cols .element, .portfolio-4-cols .element, .portfolio-6-cols .element, .portfolio-12-cols .element {
	  width: 49.9%;
	}
}

@media only screen and (max-width: 480px) {
	.element, .portfolio-1-cols .element, .portfolio-2-cols .element, .portfolio-3-cols .element, .portfolio-4-cols .element, .portfolio-6-cols .element, .portfolio-12-cols .element {
	  width: 100%;
	}
	.right {
		float:left;
	}
}


/*******  Portfolio
*******************/


/*portfolio simple info*/
.portfolio-info-simple{padding:10px 50px 10px 0;  margin: 1px 0 0 0 !important; position:relative; border-bottom:1px solid #e5e5e5;}
.portfolio-info-simple .portfolio-title{font-size: 18px; margin: 0 !important; line-height: 1.6;}
.portfolio-info-simple:after, .portfolio-info-simple:before { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.portfolio-info-simple:after { border-color: rgba(0, 0, 0, 0); border-bottom-color: #fff; border-width: 8px; left: 47%;}
.portfolio-like{ height: 50px; line-height: 1; position: absolute; right: 0px; text-align: center; top: 13px; min-width: 50px;}
.portfolio-like a{ border:1px solid #e5e5e5; display:block; padding:5px 10px;}
.portfolio-like .portfolio-like-icon { font-size:24px;}

/*portfolio toggle */
.portfolio-info-toggle{background-color: #20A5E8;  padding:10px;  margin: 0 !important; position:relative;}
.portfolio-info-toggle:after, .portfolio-info-toggle:before { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.portfolio-info-toggle:after { border-color: rgba(0, 0, 0, 0); border-bottom-color: #20A5E8; border-width: 8px; left: 47%;}
.portfolio-info-toggle p{ color:#fff; margin-bottom:0;}
.portfolio-info-toggle a{ color:#fff; opacity:1; filter:alpha(opacity=100); /* For IE8 and earlier */}
.portfolio-info-toggle a:hover{ color:#fff; opacity:0.6; filter:alpha(opacity=60); /* For IE8 and earlier */}
.portfolio-info-toggle .portfolio-title{color: #FFFFFF !important; font-size: 18px; font-weight: 400; margin: 0 !important; line-height: 1.6;}
.portfolio-info-toggle .portfolio-title span.fa{ float:right; line-height:1.6;}
.portfolio-toggle{ background:#fff; padding:10px; border:1px solid #e5e5e5;}
/* mansonry content */
.mansonry-content { padding: 20px 20px 60px; border:1px solid #e5e5e5; position:relative;}
.mansonry-content h3 { font-size:20px; line-height:1.2; margin:0 0 20px;}
.mansonry-content .btn.view-project { margin-bottom:0; position:absolute; bottom:-1px; left:-1px;}
.mansonry-content .portfolio-like { right:-1px; bottom:-1px; top:auto;}

/* single portfolio */
.portfolio-media{ margin:0 0 30px;padding:8px; border:1px solid #f2f2f2; position:relative; text-align:center;
-webkit-box-shadow: 0 0 2px rgba(50, 50, 50, 0.1);
-moz-box-shadow:    0 0 2px rgba(50, 50, 50, 0.1);
box-shadow:         0 0 2px rgba(50, 50, 50, 0.1);}
.portfolio-description{ margin:0 0 20px; padding:0 0 20px; border-bottom:1px solid #e5e5e5; position:relative;}
.portfolio-info{ float:right; margin-left:20px;}
.portfolio-info .panel { padding-right: 45px;}
.share-project { float:right;}

@media (max-width: 767px) {

.portfolio-info{ float:none; margin-left:0;}
.share-project { float:none;}
}