
/* MAIN WRAPPER
______________________________________ */

ul.tags { display: block; margin-bottom: 15px; padding: 0 !important; }
ul.tags li { display: inline-block; margin: 0 2px 5px 0; padding: 0 !important; }
ul.tags li a { background: #3CC4CE; color: #fff; display: block;padding: 6px 13px 6px 13px; text-align: center; font-size: 0.9em; text-decoration:none; cursor: pointer;font-weight: 400;  }
ul.tags li a.active { color: #fff; background: #F15B5A; border-color: #F15B5A; }
ul.tags li a.active:after {  }
ul.tags a:hover { background: #F15B5A; }
ul.tags li { color: #fff; border-color: #F15B5A; }


/* .gallery { clear: both; width: 100%; }
.gallery ul {padding-left:0}
.gallery ul li.gallery-item { margin:5px 5px;display: inline-block;vertical-align: top; }
.gallery ul .gallery-item span{display:inline-block}
.gallery ul .gallery-item .pm-staff-profile-title{text-align:center;color:#0db7c4;font-weight:500}
.gallery-item img { width: 100%; height: auto;-webkit-transition: all .2s ease; -moz-transition: all .2s ease; -ms-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; }

#menu-portfolio-items { float: right; margin: -6px 0 0 0; }

*/
/* RESPONSIVE MAGIC
______________________________________ */

.gallery { clear: both; width: 100%; }
.gallery ul {padding-left:0}

.gallery ul .gallery-item { margin:5px 5px;vertical-align: top; }

.gallery ul .gallery-item img { width: 100%; height: auto;-webkit-transition: all .2s ease; -moz-transition: all .2s ease; -ms-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; }
.gallery ul .gallery-item span{display:inline-block}
.gallery ul .gallery-item .pm-staff-profile-title{text-align:center;color:#0db7c4;font-weight:500}
.gallery .gallery-item { opacity: 0; display: none; }










@media screen and (max-width: 740px) {
	
	.gallery { width: 100%; }		
	.gallery-item.col-4 { width: 30%;  }
	.gallery-item.col-3 { width: 30%;  }
}

@media screen and (max-width: 650px) {
	#wrapperbox { width: 89%; margin: 0 auto; }
	.gallery-item.col-4 { width: 47%;  }
	.gallery-item.col-3 { width: 47%;  }
}

@media screen and (max-width: 415px) {#wrapperbox { width: 87%; }}
@media screen and (max-width: 360px) {#wrapperbox { width: 88%; }}
