/*animation elements propriety*/
.elem_from_left {
    opacity: 0;
    transform: translateX(-20%);
}
.pin_animated.elem_from_left {
    opacity: 1;
    transform: translateX(0%);
    transition: opacity 0.3s ease 0.2s, transform 0.3s ease 0.2s;
}
.elem_from_right {
    opacity: 0;
    transform: translateX(20%);
}
.pin_animated.elem_from_right {
    opacity: 1;
    transform: translateX(0%);
    transition: opacity 0.3s ease 0.2s, transform 0.3s ease 0.2s;
}
.elem_from_bottom {
    opacity: 0;
    transform: translateY(20%);
}
.pin_animated.elem_from_bottom {
    opacity: 1;
    transform: translateY(0%);
    transition: opacity 0.3s ease 0.2s, transform 0.3s ease 0.2s;
}
.elem_from_top {
    opacity: 0;
    transform: translateY(-20%);
}
.pin_animated.elem_from_top {
    opacity: 1;
    transform: translateY(0%);
    transition: opacity 0.3s ease 0.2s, transform 0.3s ease 0.2s;
}
.elem_from_fade {
    opacity: 0;
    transform-origin: center;
    transform: scale(0.95);
}
.pin_animated.elem_from_fade {
    opacity: 1;
    transform: scale(1);
    transition: opacity 0.3s ease 0.2s, transform 0.3s ease 0.2s;
}
/*end of animation elements propriety*/