/*Photo gallery*/
div.project-post > a img {
    width: 200px;
    height: 200px;
    transition: all 500ms;
    -webkit-transition: all 500ms;
}

div.project-post {
    position: relative;
    z-index: 5;
    width: 200px;
    height: 200px;
    padding-left: 0;
    overflow: hidden;
}

/* MF CAMERA EFFECT [START]*/
div.project-post div.camera-effect {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 12;
    padding: 10px;
    opacity: 0;
    transition: all 500ms;
    -webkit-transition: all 500ms;
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
    -ms-transform: scale(1.1,1.1);
    -o-transform: scale(1.1,1.1);
    transform: scale(1.1,1.1);
}
div.project-post div.camera-effect i {display: block;position: absolute;}
div.project-post div.camera-effect i:nth-child(1) {
    width: calc(100% - 20px);height: calc(100% - 20px);-webkit-border-radius: 10px;
    -moz-border-radius: 10px;border-radius: 10px;border: 1px solid rgba(255,255,255,.3);
}
div.project-post div.camera-effect i:nth-child(2) {
    width: 30%;height: 30%;top: 35%;left: 35%;border: 5px solid transparent;border-top: 5px solid rgba(255,255,255,.3);
    border-bottom: 5px solid rgba(255,255,255,.3);-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;
}
div.project-post div.camera-effect i:nth-child(3) {
    width: 6%;height: 6%;top: 47%;left: 47%;-webkit-border-radius: 1%;-moz-border-radius: 1%;border-radius: 1%;
    background: rgba(255,255,255,.1);border: 1px solid rgba(255,255,255,.3);
}
div.project-post div.camera-effect i:nth-child(4) {
    width: 76%;height: 56%;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;
    border: 1px solid rgba(255,255,255,.3);top: 22%;left: 12%;
}
/* MF CAMERA EFFECT [END]*/


div.project-post div.project-content {
    position: absolute;
    top: 0px;
    width: 200px;
    height: 200px;
    z-index: 10;
    text-align: center;
    background: rgba(0,0,0,0);
    opacity: 1;
    transition: all linear 200ms;
}


/*Image Gallery append new photoes*/
.slide-architecture-landscapes {position: relative;margin-bottom: 40px;}
.second-part-of-gallery-opener {
    border: 1px solid #37b4c2;
    position: absolute;
    bottom: -55px;
    width: 50px;
    height: 50px;
    text-align: center;
    padding: 12px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    left: 50%;
    margin-left: -25px;
    animation: jump ease-in 800ms infinite alternate;
    -webkit-animation: jump ease-in 800ms infinite alternate;
    cursor: pointer;
    transition: background linear 300ms;
    -webkit-transition: background linear 300ms;
    background: rgba(255, 255, 255, 1);
    z-index: 99;
    line-height: 0;
    font-size: 25px;
}
@keyframes jump {
    0% {transform: translateY(0);}
    100% {transform: translateY(5px);}
}
@-webkit-keyframes jump {
    0% {-webkit-transform: translateY(0);}
    100% {-webkit-transform: translateY(5px);}
}
.second-part-of-gallery-opener:hover{
    background: rgba(55, 180, 194, .3);
}
.second-part-of-gallery-opener.activated {
    transition: all ease-out 500ms;
    bottom: 200px;
    opacity: 0;
    /*display: none; пока отключаю*/
}
.append-effect {
    opacity: 0;
    /*transition: opacity ease-out 500ms;*/
}
.append-effect.show {
    /*opacity: 1;*/
}

.inner-photo-project h2,
.inner-photo-project h3 {
    opacity: 0;
    transform: translateY(50px);
    -webkit-transform: translateY(50px);
}
.inner-photo-project h2 {
    transition: all cubic-bezier(.18,-0.54,.68,1.47) 200ms;
    color: #fff;
}
.inner-photo-project h3 {
    transition: all cubic-bezier(.18,-0.54,.68,1.47) 300ms;
    color: #37b4c2;
}


/*HOVERS*/
div.project-post:hover div.project-content {
    opacity: 1;
    background: rgba(0,0,0,0.5);
}
div.project-post:hover div.camera-effect {
    opacity: 1;
    -webkit-transform: scale(1,1);
    -moz-transform: scale(1,1);
    -ms-transform: scale(1,1);
    -o-transform: scale(1,1);
    transform: scale(1,1);
}
div.project-post:hover img {
    transform: scale(1.1, 1.1);
}
div.project-post:hover div.project-content .inner-photo-project h2,
div.project-post:hover div.project-content .inner-photo-project h3 {
    opacity: 1;
    transform: translateY(0px);
    -webkit-transform: translateY(0px);
}