/* Portfolio Page */
.project_box_wrapper{display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-flex-direction: row;-ms-flex-direction: row;flex-direction: row;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;-webkit-align-content: center;-ms-flex-line-pack: center;align-content: center;-webkit-align-items: flex-start; -ms-flex-align: start;align-items: flex-start;padding-top: 1em;}
.project_box {width: 49%;margin-bottom: 1em;overflow:hidden;position: relative;text-align: center;background: #000;}
.project_box .project_info h2 {margin: 0;}
.masonry-wrapper {padding: 0;-moz-column-gap: 0;-webkit-column-gap: 0;column-gap: 0;font-size: .85em;padding: 10px 0;}
.masonry-wrapper img {display: inline-block;background: #fff;padding: .2em;width: 100%;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
@media only screen and (min-width: 400px) {    .masonry-wrapper {-moz-column-count: 2;-webkit-column-count: 2;column-count: 2;}}
@media only screen and (min-width: 700px) {    .masonry-wrapper {-moz-column-count: 3;-webkit-column-count: 3;column-count: 3;}}
.fancybox-opened {z-index: 999999999 !important;}
.fancybox-overlay {z-index: 999999998 !important;}
.bb-image-box{position:relative;}
.pin-it-link{position:absolute;right:8px;top:7px;font-size:30px;line-height:1;color:#bd081c;opacity:0;}
.bb-image-box:hover > .pin-it-link{opacity:1}
/* Popup Box */
.project_inner_content .project_inner_caption {margin:0;}
.project_inner_content .project_inner_caption:last-child {margin-bottom: 15px;}
.project_inner_description {background-color: #ffffff;overflow: auto;}
.popup_block {background-color: #fff;top: 0;transform: translate(-50%, 0%);z-index: 99999;width: 95%;max-width: 800px;text-align: center;}
.dark_wraper {background-color: rgba(0, 0, 0, 0.7);height: 100%;width: 100%;top: 50%;transform: translate(-50%, -50%);z-index: 9999;}
.popup_block, .dark_wraper {position: absolute;left: 50%;display: none;}
.close_btn {background-color: #000; color: #fff; width: 30px; display: inline-block; text-align: center; height: 30px; line-height: 30px; position: absolute; right: 1px; top: 1px;}
.project_box img {max-width: none;width: -webkit-calc(100% + 50px);width: calc(100% + 50px);opacity: 0.7;-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;transition: opacity 0.35s, transform 0.35s;-webkit-transform:translate3d(-40px,0, 0);	transform: translate3d(-40px,0,0);}
.project_box .project_info {text-align: left;}
.project_box .project_info > div {position: absolute;bottom: 0;left: 0;padding: 2em;width: 100%;height: 50%;}
.project_box .project_info p{font-size:24px;margin: 0px 0 7px;}
.project_box .project_info a {display: inline-block;padding: 5px 15px;border: 1px solid rgba(255, 255, 255, 0.8);}
.project_box .project_info a:hover{background:#fff;color:#333}
.project_box .project_info h2,.project_box .project_info p,.project_box .project_info a {-webkit-transform: translate3d(0,80px,0);transform: translate3d(0,80px,0);}
.project_box .project_info h2 {-webkit-transition: -webkit-transform 0.35s;transition: transform 0.35s;color: #fff;}
.project_box .project_info p,.project_box .project_info a {color: rgba(255,255,255,0.8);opacity: 0;-webkit-transition: opacity 0.2s, -webkit-transform 0.35s;transition: opacity 0.2s, transform 0.35s;}

@media only screen and (max-width:1000px){
	/* Portfolio Page */
	.project_box .project_info h2 {font-size: 1.5em;}
	.project_box .project_info p{font-size:18px;margin: 0 0 7px;}
	.project_box .project_info .btn_general {margin: 0;}
	.project_box .project_info h2,.project_box .project_info p,.project_box .project_info a {-webkit-transform: translate3d(0,60px,0);transform: translate3d(0,60px,0);}
}

@media only screen and (max-width:800px){
.project_box .project_info > div{height: 62%;padding:1.5em}

}
@media only screen and (max-width:550px){
	.project_box {width:100%;}
	.project_box .project_info > div{height: 50%;padding:2em}
}

@media only screen and (max-width:400px){
	.project_box .project_info > div{height: 55%;padding:1.5em}
}
@media only screen and (max-width:360px){
	.project_box .project_info > div{padding:1em}
}
.project_box:hover img,.project_box:hover p,.project_box:hover a {opacity:1;}
.project_box:hover img,.project_box:hover h2,.project_box:hover p,.project_box:hover a {-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}
.project_box:hover p {-webkit-transition-delay: 0.05s;transition-delay: 0.05s;	-webkit-transition-duration: 0.35s;transition-duration: 0.35s;}
.project_box:hover a{-webkit-transition-delay: 0.06s;transition-delay: 0.06s;-webkit-transition-duration: 0.35s;transition-duration: 0.35s;}