@charset "utf-8";
/* CSS Document */

.wall-widget-view { margin: 0 auto; }

.free-wall {
	margin: auto;
}

.free-wall-logo {
	margin: auto;
	height: 420px;
}

/*
.size11 {
	height: 160px;
	width: 160px;
}

.size12 {
	width: 160px;
	height: 320px;
}

.size21 {
	width: 320px;
	height: 160px;
}

.size22 {
	height: 320px;
	width: 320px;
}

.size13 {
	width: 160px;
	height: 480px;
}

.size31 {
	width: 480px;
	height: 160px;
}

.size23 {
	width: 320px;
	height: 480px;
}

.size24 {
	width: 320px;
	height: 640px;
}

.size32 {
	width: 480px;
	height: 320px;
}

.size33 {
	width: 480px;
	height: 480px;
}

.size34 {
	width: 480px;
	height: 640px;
}

.size43 {
	width: 640px;
	height: 480px;
}

.size42 {
	width: 640px;
	height: 320px;
}

.size44 {
	width: 640px;
	height: 640px;
}

.size35 {
	width: 480px;
	height: 800px;
}

.size53 {
	width: 800px;
	height: 480px;
}

.size36 {
	width: 480px;
	height: 960px;
}
*/
.size88 { width: 1400px; height: 1400px; }
.size87 { width: 1400px; height: 1225px; }
.size86 { width: 1400px; height: 1050px; }
.size85 { width: 1400px; height: 875px; }
.size84 { width: 1400px; height: 700px; }
.size83 { width: 1400px; height: 525px; }
.size82 { width: 1400px; height: 350px; }
.size81 { width: 1400px; height: 175px; }

.size78 { width: 1225px; height: 1400px; }
.size77 { width: 1225px; height: 1225px; }
.size76 { width: 1225px; height: 1050px; }
.size75 { width: 1225px; height: 875px; }
.size74 { width: 1225px; height: 700px; }
.size73 { width: 1225px; height: 525px; }
.size72 { width: 1225px; height: 350px; }
.size71 { width: 1225px; height: 175px; }

.size68 { width: 1050px; height: 1400px; }
.size67 { width: 1050px; height: 1225px; }
.size66 { width: 1050px; height: 1050px; }
.size65 { width: 1050px; height: 875px; }
.size64 { width: 1050px; height: 700px; }
.size63 { width: 1050px; height: 525px; }
.size62 { width: 1050px; height: 350px; }
.size61 { width: 1050px; height: 175px; }

.size58 { width: 875px; height: 1400px; }
.size57 { width: 875px; height: 1225px; }
.size56 { width: 875px; height: 1050px; }
.size55 { width: 875px; height: 875px; }
.size54 { width: 875px; height: 700px; }
.size53 { width: 875px; height: 525px; }
.size52 { width: 875px; height: 350px; }
.size51 { width: 875px; height: 175px; }

.size48 { width: 700px; height: 1400px; }
.size47 { width: 700px; height: 1225px; }
.size46 { width: 700px; height: 1050px; }
.size45 { width: 700px; height: 875px; }
.size44 { width: 700px; height: 640px; }
.size43 { width: 700px; height: 525px; }
.size42 { width: 700px; height: 350px; }
.size41 { width: 700px; height: 175px; }

.size38 { width: 525px; height: 1400px; }
.size37 { width: 525px; height: 1225px; }
.size36 { width: 525px; height: 1050px; }
.size35 { width: 525px; height: 875px; }
.size34 { width: 525px; height: 700px; }
.size33 { width: 525px; height: 525px; }
.size32 { width: 525px; height: 350px; }
.size31 { width: 525px; height: 175px; }

.size28 { width: 350px; height: 1400px; }
.size27 { width: 350px; height: 1225px; }
.size26 { width: 350px; height: 1050px; }
.size25 { width: 350px; height: 875px; }
.size24 { width: 350px; height: 700px; }
.size23 { width: 350px; height: 525px; }
.size22 { width: 375px; height: 375px; }
.size21 { width: 375px; height: 175px; }

.size18 { width: 175px; height: 1400px; }
.size17 { width: 175px; height: 1225px; }
.size16 { width: 175px; height: 1050px; }
.size15 { width: 175px; height: 875px; }
.size14 { width: 175px; height: 700px; }
.size13 { width: 175px; height: 525px; }
.size12 { width: 175px; height: 350px; }
.size11 { width: 175px; height: 175px; }

.brick {
	background-color: white;
	float: left;
	cursor: default;
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.brick .brick-image{ position: absolute; top: 0;  left: 0; width: 100%; height: 100%; background-position: center center; background-size: cover;  transition: .2s all ease-out; }
.brick:hover .brick-image { transform: scale(1.1); }

.brick .brick-link { position: absolute; top: 0;  left: 0; width: 100%; height: 100%;  }

.brick.link { cursor: pointer; }

.brick.link .overlay{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.1); transition: .2s all ease-out; transform: scale(0); z-index: 9; }
.brick.link:hover .overlay{ transform: scale(1); }

.brick .cover {
	overflow: hidden;
}


.brick .cover .html-content {
	position: absolute;
	top: 50%;
	left: 50%;
	color: #fff;
	width: 90%;
	text-align: center;
}

.brick .cover .html-content a {
	color: #fff;	
}

.brick .cover .html-content-wrapper {
	position: relative;
	left: -50%;
	transform: translateY(-50%);
}

.brick .cover .html-content h1 {
	font-size: 35px;
	color: #fff;
}

.brick .cover .html-content h2 {
	font-size: 30px;
	color: #fff;
	font-weight: normal;
}

.brick .cover .html-content h3 {
	font-size: 25px;
	color: #fff;
	font-weight: normal;
}

.brick .cover .html-content p {
	font-size: 20px;
	color: #fff;
}

.brick .read-more {
	position: absolute;
	display: none;
	bottom: 0px;
	left: 0px;
	right: 0px;
	padding: 12px;
	background: rgb(0, 0, 0);
	background: rgba(0, 0, 0, 0.45);
}

.brick:hover .read-more {
	display: block;
	cursor: pointer;
}

.brick .more-info { 
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	width: calc(100% - 10px);
	z-index: 9;
	background: rgba(0,0,0,0.7);
	color: #fff;
	padding: 5px;
}

.brick .unavailable { position: absolute; top: 0; right: 0; background: #000; color: #fff; padding: 2px 12px; }

.brick .more-info a { 
	color: #fff;
	text-decoration:none;
	font-size: 13px;
}

.brick .tag { 
	position: absolute;
	width: 70px;
	height: 70px;
	line-height: 70px;
	border-radius: 35px;
	top: 10px; 
	left: 10px;
	display: block;
	color: #fff;
	text-align: center;
	font-size: 20px; 
	font-weight: bold;
	vertical-align:middle;
	font-weight: bold;
	margin: 0;
	vertical-align: middle;
	transform: rotate(-25deg);
	z-index: 99;
	transition: transform .4s cubic-bezier(1, 2, 0, 2) 0s;
}

.brick.link:hover .tag{
	transform: rotate(0);
	transform: scale(1.1);
}

.brick .image-html { 
	display: block;
	color: #fff;
	margin: 0;
	padding: 5px 10px;
	font-size: 25px; 
	font-weight: lighter;
	vertical-align: middle;
	width: 100%;
}

.brick .over {
	position: absolute; 
	height: 100%;
	width: 100%;
	top: 0; 
	left: 0;
	background: rgba(0,0,0,0.1);
	transform: scale(0, 0);
	transform-origin: center center;
	transition: all .2s ease-out;
	z-index: 0;
}

.brick:hover .over {
	transform: scale(1, 1);
}


.brick .main-link {
	position: absolute;
	top: 40%;
	left: 50%;
	visibility: hidden;
	opacity: 0;
	transition: .3s all ease;
	z-index: 9;
}

.brick:hover .main-link { 
	opacity: 1;
	visibility: visible;
}

.brick .main-link .mpblog-social-container,
.brick .main-link .button { 
	position: relative;
	left: -50%;
	transform: translateY(-50%);
}

.brick .main-link .mpblog-social-container { 
	margin-top: 30px;
}

.mpblog-social-container .mp-buttons a {
	display: block;
	position: relative;
	height: 26px;
	width: 26px;
}
.mpblog-social-container .mp-buttons a:before {
	display: block;
	position: absolute;
	top: 1px;
	left: 1px;
	width: 100%;
	height: 100%;
	background: #fff;
	content: "";
	border-radius: 50%;
}

.brick .image-html * {
	margin: 0;
	padding: 0;
	line-height: normal;
}

.brick .desc {
	display: none;
}

.full-width .float-left {
	display: none;
}

.full-width .desc {
	display: block;
}

.full-width.brick {
	box-shadow: none;
	overflow: visible;
	border: none !important;
	background: none !important;
}

.full-width.brick .cover {
	margin: 0px 20px;
	color: #333;
}

.full-width.brick .cover * {
	text-shadow: none;
}

.full-width.brick .cover code {
	color: #666;
}

.open .float-left {
	display: none;
}

.open .desc {
	display: block;
}
