/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/*         o°        o°        o°                                         °o        °o        °o         */
/*        O         O         O                  SOCIAL WALL                O         O         O        */
/* ><(((°>   ><(((°>   ><(((°>                                               <°)))><   <°)))><   <°)))>< */
/* _-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_ */

/* ¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨ */
/*  o°        o°      o°      o°    Main container with large background   °o      °o      °o        °o  */
/* O ><(((°> O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O <°)))>< O */

#main-container.social{
	background-image:url(../images/social/social.jpg);
}

/* ¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨ */
/*  o°        o°      o°      o°                   Title                   °o      °o      °o        °o  */
/* O ><(((°> O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O <°)))>< O */

.social .page-title{
	padding-bottom:80px;
}

@media all and (max-width: 989px){
	.social .page-title{padding-bottom:40px;}
}

@media all and (max-width: 767px){
	.social .page-title{padding-bottom:31px;}
}

/* ¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨ */
/*  o°        o°      o°      o°                  Filters                  °o      °o      °o        °o  */
/* O ><(((°> O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O <°)))>< O */

.social-filters{
	background:rgba(255, 255, 255, 0.92);
	border-bottom:solid 14px #005120;
}

.social-filters ul{
	font-size:0;
}

.social-filters ul li{
	display:inline-block;
	box-sizing:border-box;
	border-right:solid 1px #005120;
	width:25%;
	font:700 18px / 61px 'Open Sans', sans-serif;
	color:#005120;
	text-align:center;
	text-transform:uppercase;
	cursor:pointer;
	height:61px;
}

.social-filters ul li:first-child{
	border-left:solid 1px #005120;
}

.social-filters ul li:hover, .social-filters ul li.focus{
	background:#005120;
	color:#fff;
}

/* .o° .o° .o° .o° .o° .o° Icon °o. °o. °o. °o. °o. °o. */

.social-filters ul li span{
	display:inline-block;
	width:20px;
	height:19px;
	margin:21px 5px 0 0;
	vertical-align:top;
}

.social-filters ul li span.facebook{background:url(../images/social/filter-facebook.png) no-repeat 0 0;}
.social-filters ul li span.twitter{background:url(../images/social/filter-twitter.png) no-repeat 0 0;}
.social-filters ul li span.instagram{background:url(../images/social/filter-instagram.png) no-repeat 0 0;}

.social-filters ul li.focus span, .social-filters ul li:hover span{
	background-position:0 bottom;
}

/* .o° .o° .o° .o° .o° .o° Mobile °o. °o. °o. °o. °o. °o. */

.social .filter-select{
	display:none;
}

@media all and (max-width: 989px){
	.social-filters{border-bottom-width:10px;}
	.social-filters .global{width:754px;}
	.social-filters ul li{font-size:16px; line-height:45px; height:45px;}
	.social-filters ul li span{margin:14px 5px 0 0;}
}

@media all and (max-width: 767px){
	.social-filters{display:none;}
	.social .filter-select{display:block;}
}

/* ¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨ */
/*  o°        o°      o°      o°                    Wall                   °o      °o      °o        °o  */
/* O ><(((°> O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O . . . O <°)))>< O */

.global.social-wall{
	padding:25px 0 0 0;
	width:1008px;
}

@media all and (max-width: 989px){
	.global.social-wall{width:768px;}
}

@media all and (max-width: 767px){
	.global.social-wall{width:auto;}
}

/* .o° .o° .o° .o° .o° .o° Column °o. °o. °o. °o. °o. °o. */

.social-wall .column{
	width:336px;
	float:left;
}

@media all and (max-width: 989px){
	.social-wall .column{width:256px;}
}

@media all and (max-width: 767px){
	.social-wall .column{width:auto; float:none; margin:0 auto;}
}

/* .o° .o° .o° .o° .o° .o° Blocks °o. °o. °o. °o. °o. °o. */

.social-block{
	width:318px;
	margin:0 auto 18px auto;
	border:solid 1px #c5c7bf;
	border-radius:2px;
	overflow:hidden;
	background:#fff;
	position:relative;
}

/* network icon */

.social-block .network-icon{
	width:30px;
	height:29px;
	margin:22px auto;
	position:relative;
	z-index:5;
	background-repeat:no-repeat;
	background-position:0 0;
}

.social-block .network-icon.facebook{background-image:url(../images/social/icon-facebook.png);}
.social-block .network-icon.twitter{background-image:url(../images/social/icon-twitter.png);}
.social-block .network-icon.instagram{background-image:url(../images/social/icon-instagram.png);}

/* text */

.social-block p.text{
	font:600 italic 20px / 25px 'Open Sans', sans-serif;
	color:#5c5c5c;
	padding:0 30px;
}

.social-block p.text a{
	color:#1aa8d4;
}

.social-block.pic p.text{
	font-size:16px;
	line-height:19px;
}

/* img */

.social-block .img{
	line-height:0;
}

.social-block .img img{
	width:100%;
	height:auto;
}

/* time */

.social-block p.time{
	font:600 14px / 14px 'Open Sans', sans-serif;
	color:#acacac;
	text-transform:uppercase;
	padding:22px 33px;
	text-align:center;
}

/* hover */

.social-block .hover{
	position:absolute; top:0; left:0;
	display:block;
	width:100%;
	height:100%;
	background:url(../images/social/hover.png) no-repeat center center rgba(2, 58, 18, 0.77);
	z-index:4;
	display:none;
}

.social-block:hover{
	border-color:#3d6849;
}

.social-block:hover .hover{
	display:block;
}



@media all and (max-width: 989px){
	.social-block{width:242px; margin:0 auto 14px auto;}
	.social-block p.text{font-size:15px; line-height:19px; padding:0 22px;}
	.social-block.pic p.text{font-size:13px; line-height:15px;}
	.social-block .network-icon{width:22px; height:22px; margin:17px auto; background-size:22px auto;}
	.social-block p.time{font-size:11px; line-height:11px; padding:15px 22px;}
}
