@charset "UTF-8";
/*Filename: gallery-folio-masonry
ID: 2070
*/

/* gallery/masonry/folio items
================================================== */
.gallery img { width: 100% }
.gallery {
    position: relative;
    left: -1%;
    width: 102.87%;
    margin: 0;
    padding: 2px 0 0 0;
    list-style: none;
    clear: both;
}
.gallery li {
    float: left;
    width: 22.25%;
    margin: 0 1% 20px 1%;
    padding: 0 0 5px 0;
    /*background: url('/media/umb/style-assets/images/5p.png');*/
    background: #fff;
  	border-bottom: 6px solid #EFF0F0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

}
/* column  settings */
.gallery.four_col li { width: 22.25% }
.gallery.three_col li { width: 31% }
.gallery.two_col li { width: 47% }
.three_col li h4,
.four_col li h4 {
    overflow: hidden; /* long words chop off at small sizes due to skinniness of 3 or 4 columns */
    font-size: 120%;
}

.gallery li img {
    width: 100% !important;
    max-width: none;
}
.gallery img { background: #fff url('/media/umb/style-assets/images/loader.gif') no-repeat 50% 50% }

/* gallery "item" contents (summary, captions, etc) */
.gallery li .entry-summary { padding: 0 10px; background-color: #fff; }
.gallery li h4 {
    padding: 15px 0 5px 0;
    margin: 0px 0 0 0;
}
.gallery li .entry-summary a { /*text-decoration: none*/ }
.gallery li .entry-summary p { font-size: 85% }
.gallery li .categories {
    font-size: 11px;
  	font-color: #555;
    font-size: 1.1rem;
    width: auto;
    text-align: left;
	margin-top:10px;
    padding:5px 0  0 0;
    border-top:1px solid #ddd;
}
.gallery li .categories a {
    /*text-decoration: none;*/
    display: inline;
}
.gallery li a.videoicon,
.gallery li a.hover {
    position: relative;
    display: block;
}
.gallery li a.videoicon span.videoicon {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 25px;
    height: 25px;
    display: block;
    background: #fff url('/media/umb/style-assets/images/videoicon.png') no-repeat;
    z-index: 10;
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
}
/* photo credit */
.gallery li span.credit {
    font-size: xx-small;
    position: relative;
    padding: 5px 0 0 0;
    margin: 0;
    display: block;
    text-align: right;
}
/* photo credit */
.gallery li span.credit a, .gallery li span.credit {
    /*text-decoration: none;*/
}

/* portfolio lightbox styles */
.gallery.lightbox li {padding:0;}
.gallery.lightbox li .entry-summary {display:none;}


/* filter
================================================== */
.sort {
    float: left;
    position: relative;
    list-style: none;
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 10px 0px;
    background: none;
    top: auto;
    width: auto;
    border: none;
}
.sort li {
    padding: 0 10px 0 0;
    margin: 0;
    display:inline;
    position: relative;
}
.sort li:only-child {
  	display:none;
}
.sort li a {
    padding: 0;
    /*text-decoration: none;*/
    color: #000;
    line-height: normal;
}

.sort li:after { content:"\00b7";padding-left:10px;color:#777 }

.sort li.last-child:after,
ul.sort li.last:after { content:"" }

.sort li a:hover,
.sort a.active {
    color: #53a3b7;
    background: none;
}

/* no javascript */
.no-js .gallery { margin-top: 20px }
.no-js .sort,
.no-js .entry-summary,
.no-js .categories,
.no-js span.credit { display: none!important }
.no-js .gallery li {
    height: 200px;
    overflow: hidden;
}

.mobile-filter-trigger {display:none;}


/* media queries for mobile max width 767
================================================== */
@media only screen and (max-width: 767px) { 
    .gallery.four_col li,
    .gallery.two_col li { width: 44.5% }
    /* filter for isotope navigation mobile version */
    .no-js .filter-box,
    .no-js .sort { display: none }

	.filter-box {display:none}
	
	.mobile-filter-trigger {cursor:pointer;display:block;}
	
	.sort-mobile {
 	   list-style: none;
 	   margin: 0 0 10px 0;
 	   padding: 0 0 10px 0;
	}
	.sort-mobile li {
		padding: 10px 0;
		margin: 0;
		display:block;
		position: relative;
		border-bottom:1px solid #eee;
	}
	.sort-mobile li a {
		/*text-decoration:none;*/
	}

} /*end max width 767*/


/* max width 700px
================================================== */
/*@media only screen and (max-width: 700px) { */
@media only screen and (max-width: 300px) {
    
	.gallery.three_col li,
	.gallery.four_col li, 
	.gallery.two_col li {
		width: 98%;
		margin: 0 1% 10px 1%;
	}

} /*end */


/* ================================================== 
	38. RETINA BACKGROUND IMAGE REPLACEMENT & RETINA INFORMATION
	http://weedygarden.net/2012/04/hi-res-retina-display-css-sprites/
	http://www.kylejlarson.com/blog/2012/creating-retina-images-for-your-website/
	http://www.webresourcesdepot.com/3-solutions-for-serving-high-res-images-to-retina-display-devices/
================================================== */

/*	change the webkit number to 1 to test on webkit to make sure 
	the sizes and the images show up correctly then switch back before launch */

@media only screen and (-webkit-min-device-pixel-ratio: 2),
 	only screen and (-o-min-device-pixel-ratio: 3/2),
 	only screen and (min--moz-device-pixel-ratio: 2),
	only screen and (min-device-pixel-ratio: 2) 
{


.gallery img {
		background-image: url('/media/umb/style-assets/images/retina/loader_@2x.gif');
            -moz-background-size:80px 10px; 
             -ie-background-size:80px 10px; 
              -o-background-size:80px 10px; 
       	 -webkit-background-size:80px 10px; 
                 background-size:80px 10px; 

}

.gallery li a.videoicon span.videoicon {
	background-image:url('/media/umb/style-assets/images/retina/videoicon_@2x.png');
            -moz-background-size:25px 25px; 
             -ie-background-size:25px 25px;
              -o-background-size:25px 25px;
       	 -webkit-background-size:25px 25px;
                 background-size:25px 25px;	

}



}/* end retina */


