#community-container {
	width:930px;
	margin:0 auto;
	position:relative;
}

/**
 * Width should be a multiple of 157.
 * Default width is 785px (5 columns) because the content width is 960px.
 */

@media screen and (min-width: 1220px) {
  #community-container { width: 785px; }
}
@media screen and (max-width: 1220px) {
   #community-container{ width: 785px; }
}
@media screen and (max-width: 980px) {
   #community-container { width: 628px; }
}
@media screen and (max-width: 740px) {
  #community-container { width: 471px; }
}
@media screen and (max-width: 500px) {
   #community-container { width: 314px; }
}

#community-container p {
	padding:0;
	margin:0;
}
.community-brick {
	border:1px solid #2FBDC2;
	margin:2.5px;	
	overflow:hidden;
	position:relative;
}

.community-1x1 {
	height:150px;
	width:150px;
}
.community-1x2 {
	height:307px;
	width:150px;
}
.community-1x3 {
	height:464px;
	width:150px;
}
.community-2x1 {
	height:150px;
	width:307px;
}
.community-2x2 {
	height:307px;
	width:307px;
}
.community-2x3 {
	height:464px;
	width:307px;
}

.community-3x1 {
	height:150px;
	width:464px;
}

.community-3x2 {
	height:307px;
	width:464px;
}
.community-3x3 {
	height:464px;
	width:464px;
}
    
span.community-post-title {
	font-weight:bold;
}
div.community-post-header {
	padding: 10px;
	height:30px;
	overflow: hidden;
	text-overflow: ellipsis;
}
div.community-post-text {
	padding: 10px;
	overflow:hidden;
	position:absolute;
	top:30px;
	bottom:30px;
}

div.community-post-footer {
	padding:10px;
	position:absolute;
	bottom:0;
	height:35px;
	width:100%;
}
div.community-post-caption {
	padding:10px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
div.community-label {
	position:absolute;
	bottom:0;
	height:70px;
	overflow:hidden;
	z-index:2;
	background-color:white;
	width:100%;
}
span.community-right {
	display:block;
	float:right;
}
span.community-left {
	display:block;
	float:left;
}

img.community-dynamic {
	width:100%;
}
div.community-img-frame {
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	overflow:hidden;
}
a img {
	opacity:1;
	-webkit-transition:opacity .5s;
	transition:opacity .5s;
}
/* a img:hover {
	opacity:.5;
}
 */
div.community-layover {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	opacity:1;
	z-index:1;
	-webkit-transition:opacity .5s;
	transition:opacity .5s;
}

div.community-layover:hover, div.community-layover:active {
	opacity:0;
	z-index:-1;
}

div.community-layunder {
	position:absolute;
	background-color:white;
	opacity:0;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:0;
	-webkit-transition:opacity .5s;
	transition: opacity .5s;
}
div.community-layunder:hover, div.community-layunder:active {
	z-index:2;
	opacity:1;
}

div.community-layunder div.community-post-footer, div.community-layunder:hover div.community-post-footer {
	z-index:1;
	opacity:1;
}

 @media screen and (max-device-width: 768px) {   
        .community-3x1 {
		width:312px;
		height:150px;
        }
        .community-3x2 {
        	width:312px;
        	height:312px;
        }
        .community-3x3 {
        	width:312px;
        	height:312px;
        }
    } 


/****
UPDATED 
****/

div#comm-loading {
	text-align:center;
	vertical-align:middle;
	font-size:24px;
}
div#comm-container {
	  margin:0 auto;
}

div.comm-brick {
	width:320px;
	overflow:hidden;
	border:1px solid #7f7f7f;
	margin:5px;
	color:#7F7F7F;
	font-size:10pt;
	line-height:1.5em;
    position:relative;
}

.comm-brick a {
	color:#7f7f7f;
}

div.comm-post-header, div.comm-post-textwrapper, div.comm-post-footer {
	width:100%;
	padding:10px;
	clear:both;
	overflow:auto;
}

img.comm-dynamic {
	width:100%;
	transition:.5s;
}
img.comm-dynamic:hover {
	opacity:.7;
	transition:.5s;
}
.comm-left {
	display:block;
	float:left;
}

.comm-right {
	display:block;
	float:right;
}

img.icon {
	width:15px;
}

.comm-brick.comm-instagram {
  line-height:1em;
}

.comm-instagram .comm-post-textwrapper {
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  background:#fff;
  display:none;
}

.comm-instagram .comm-post-footer {
	position:absolute;
	bottom:0;
	left:0;
	right:0;
}

.comm-instagram:hover .comm-post-textwrapper {
  display:block;
}
.comm-instagram:hover .comm-post-footer {
  display:none;
}
.comm-instagram a {
	color:#fff;
}

div.comm-shopify {
	color:#000;
	background-color:#fff;
	transition:.5s;
}

div.comm-shopify:hover {
	background:transparent;
	transition:.5s;
}

div.comm-shopify a {
	color:#000;
}
.comm-read-more {
	font-weight:bold;
}

div.comm-shopify div.comm-post-header {
	text-align:center;
}

.comm-shopify .comm-post-header a {
	font-size: 1.5em;
	text-transform:uppercase;
	color:#7EB21A;
	font-weight:bold;
}

.comm-shopify .comm-img-frame {
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:-1;
	opacity:.5;
}

.comm-shopify .comm-post-textwrapper {
	transition:.5s;
	padding-top:2em;
	padding-bottom:2em;
}



/*****************
BLOG PAGE
*****************/
#blog-articles {
  font-family:'Open Sans', Arial, sans-serif;
  width:100%;
  max-width:768px;
  margin:0 auto;
  text-align:center;
  color:#000;
}

ul#blog-articles li {
  min-height:0;
  border-bottom:2px solid #ccc;
}

h1.blog-page-title {
  font-family:'Playfair Display', Arial, sans-serif;
  color:#000;
  text-align:center;
  font-weight:normal;
  font-size:36px;
  text-transform:uppercase;
}

#blog-articles #excerpt img {
  width:100%;
}

#blog-articles .read-more {
  text-transform:uppercase;
  font-style:normal;
  font-weight:bold;
}

#blog-instagram .comm-brick {
  width:31%;
  margin:1%;
  float:left;
  position:relative;
  border-color:#fff;
}

@media screen and (max-width:740px) {
  #blog-instagram .comm-brick {
    width:100%;
    margin:0;
  }
}


/*****************
INSTAGRAM FOOTER WIDGET
*****************/

#instagram-widget .comm-brick {
  border:0px transparent;
  float:left;
  width:150px;
  height:150px;
  margin-left:5px;
  overflow:hidden;
}

#instagram-widget .comm-bodywrap,
#instagram-widget .comm-img-frame {
  width:100%;
  height:100%;
}

#instagram-widget .comm-img-frame a {
  display:block;
  line-height:0;
  width:100%;
  height:100%;
}

#instagram-widget .comm-post-textwrapper, 
#instagram-widget .comm-post-footer,
#instagram-widget .comm-instagram:hover .comm-post-textwrapper,
#instagram-widget .comm-instagram:hover .comm-post-footer {
  display:none;
}