diff --git a/dev/js/main.js b/dev/js/main.js
index c6a859e..abc951b 100644
--- a/dev/js/main.js
+++ b/dev/js/main.js
@@ -7,6 +7,7 @@
 @import 'main/contentElements/carousel.js';
 @import 'main/contentElements/parallax.js';
 @import 'main/contentElements/sliderContainer.js';
+@import 'main/contentElements/imageTextLink.js';
 
 // plugins
 @import 'main/plugins/news/newsCarousel.js';
diff --git a/dev/js/main/contentElements/imageTextLink.js b/dev/js/main/contentElements/imageTextLink.js
new file mode 100644
index 0000000..fe9e3e4
--- /dev/null
+++ b/dev/js/main/contentElements/imageTextLink.js
@@ -0,0 +1,15 @@
+(function($) {
+    'use strict';
+
+    // document load event
+    $(document).ready(function() {
+
+        var $paragraph = $('.js__img-text-link');
+
+        $paragraph.dotdotdot({
+            height: 60
+        });
+
+    });
+
+})(jQuery);
diff --git a/dev/styles/main/contentElements/imageTextLink.less b/dev/styles/main/contentElements/imageTextLink.less
index 58c554d..5520ed5 100644
--- a/dev/styles/main/contentElements/imageTextLink.less
+++ b/dev/styles/main/contentElements/imageTextLink.less
@@ -5,12 +5,19 @@
     position: relative;
     overflow: auto;
     padding: 0 15px;
-    margin: 0 -15px; 
+    margin: 0 -15px;
 }
 .img-text-link {
-    padding: 40px 0;
-    padding-top: 50px;
+    margin: 20px 0;
+    margin-top: 25px;
 }
+@media(min-width: 992px){
+    .img-text-link {
+        margin: 40px 0;
+        margin-top: 50px;
+    }
+}
+
 .img-text-link__img-link {
     position: relative;
     display: block;
@@ -90,3 +97,1003 @@
 
 // =========================================================
 // =========================================================
+
+
+// =========================================================
+// === HOVER EFFECT 1 =====================================
+// =========================================================
+
+
+.img-text-link._hover-1{
+    position: relative;
+    overflow: hidden;
+}
+.img-text-link._hover-1:after{
+    content:'';
+    display: block;
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    left: 0;
+    opacity: 1;
+    visibility: visible;
+    background: -webkit-linear-gradient(to bottom, fade(@main-color, 0%) 0%, fade(@main-color, 80%) 75%);
+    background: linear-gradient(to bottom, fade(@main-color, 0%) 0%, fade(@main-color, 80%) 75%);
+    transition: all .2s;
+}
+.img-text-link._hover-1 .img-text-link__img-link{
+    display: block;
+}
+.img-text-link._hover-1 .img-text-link__img-link:before{
+    display: none;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-1:after{
+        opacity: 0;
+        -webkit-transform: translate3d(0, 80%, 0);
+        transform: translate3d(0, 80%, 0);
+    }
+}
+.img-text-link._hover-1 .img-text-link__header{
+    position: absolute;
+    text-align: center;
+    color: @main-body-bg;
+    top: 50%;
+    left: 0;
+    width: 100%;
+    padding: 15px;
+    margin: 0;
+    z-index: 2;
+    transition: all .4s;
+    -webkit-transform: translate3d(0, -90%, 0);
+    transform: translate3d(0, -90%, 0);
+}
+@media(min-width: 992px){
+    .img-text-link._hover-1 .img-text-link__header{
+        color: @main-color;
+        -webkit-transform: translate3d(0, -50%, 0);
+        transform: translate3d(0, -50%, 0);
+    }
+}
+.img-text-link._hover-1 .img-text-link__p{
+    position: absolute;
+    padding: 0 30px;
+    transition: all .4s ease;
+    bottom: 0;
+    color: @main-body-bg;
+    text-align: center;
+    z-index: 2;
+    -webkit-transform: translate3d(0, -20%, 0);
+    transform: translate3d(0, -20%, 0);
+}
+@media(min-width: 992px){
+    .img-text-link._hover-1 .img-text-link__p{
+        opacity: 0;
+        -webkit-transform: translate3d(0, 0, 0);
+        transform: translate3d(0, 0, 0);
+    }
+}
+.img-text-link._hover-1 .img-text-link__link{
+    position: absolute;
+    z-index: 3;
+    width: 100%;
+    height: 100%;
+    background: transparent;
+    border: none;
+    top: 0;
+    left: 0;
+    display: block;
+    font-size: 0;
+}
+.img-text-link._hover-1:hover:after{
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+}
+.img-text-link._hover-1:hover .img-text-link__header{
+    -webkit-transform: translate3d(0, -90%, 0);
+    transform: translate3d(0, -90%, 0);
+    color: @main-body-bg;
+}
+.img-text-link._hover-1:hover .img-text-link__p{
+    -webkit-transform: translate3d(0, -20%, 0);
+    transform: translate3d(0, -20%, 0);
+    opacity: 1;
+    color: @main-body-bg;
+}
+.img-text-link._hover-1:hover .img-text-link__link{
+    background: transparent;
+}
+
+// =========================================================
+// =========================================================
+
+// =========================================================
+// === HOVER EFFECT 2 =====================================
+// =========================================================
+
+.img-text-link._hover-2{
+    position: relative;
+    overflow: hidden;
+    background: @main-color;
+}
+.img-text-link._hover-2 .img-text-link__img{
+    z-index: 2;
+    display: block;
+    position: relative;
+    transition: all .4s;
+    -webkit-transform: translate3d(0, -70px, 0);
+    transform: translate3d(0, -70px, 0);
+}
+@media(min-width: 992px){
+    .img-text-link._hover-2 .img-text-link__img{
+        -webkit-transform: translate3d(0, 0, 0);
+        transform: translate3d(0, 0, 0);
+    }
+}
+.img-text-link._hover-2 .img-text-link__header{
+    margin: 0;
+    position: absolute;
+    bottom: 0;
+    padding: 15px;
+    z-index: 3;
+    width: 100%;
+    transition: all .4s;
+    color: @main-body-bg;
+    border-bottom: 2px solid @main-color;
+    -webkit-transform: translate3d(0, -70px, 0);
+    transform: translate3d(0, -70px, 0);
+}
+@media(min-width: 992px){
+    .img-text-link._hover-2 .img-text-link__header{
+        -webkit-transform: translate3d(0, 0, 0);
+        transform: translate3d(0, 0, 0);
+    }
+}
+.img-text-link._hover-2 .img-text-link__p{
+    position: absolute;
+    background: @main-color;
+    color: @main-body-bg;
+    bottom: 0;
+    padding: 8px 15px;
+    height: 70px;
+    margin: 0;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+    transition: all .4s;
+    -webkit-transform-origin: 0% 100%;
+    transform-origin: 0% 100%;
+    border-bottom: 4px solid @main-color;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-2 .img-text-link__p{
+        -webkit-transform: scaleY(0);
+        transform: scaleY(0);
+        color: @main-color;
+    }
+}
+.img-text-link._hover-2 .img-text-link__link{
+    position: absolute;
+    background: transparent;
+    border: none;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    z-index: 4;
+    font-size: 0;
+    display: block;
+}
+.img-text-link._hover-2:hover .img-text-link__img{
+    -webkit-transform: translate3d(0, -70px, 0);
+    transform: translate3d(0, -70px, 0);
+}
+.img-text-link._hover-2:hover .img-text-link__header{
+    -webkit-transform: translate3d(0, -70px, 0);
+    transform: translate3d(0, -70px, 0);
+}
+.img-text-link._hover-2:hover .img-text-link__p{
+    -webkit-transform: scaleY(1);
+    transform: scaleY(1);
+    color: @main-body-bg;
+}
+.img-text-link._hover-2:hover .img-text-link__link{
+    background: transparent;
+}
+
+// =========================================================
+// =========================================================
+
+// =========================================================
+// === HOVER EFFECT 3 =====================================
+// =========================================================
+
+
+.img-text-link._hover-3{
+    position: relative;
+    overflow: hidden;
+    &:before{
+        content:'';
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        background: fade(@main-color, 40%);
+        display: block;
+        transition: all .5s;
+        z-index: 2;
+    }
+    &:after{
+        content:'';
+        display: none;
+        height: 100%;
+        width: 100%;
+        background: rgba(255,255,255,0.5);
+        position: absolute;
+        top: 0;
+        left: 0;
+        transition: all .5s;
+        -webkittransform: translate3d(150%, 0, 0) skew(45deg);
+        transform: translate3d(150%, 0, 0) skew(45deg);
+        z-index: 3;
+    }
+}
+@media(min-width: 992px){
+    .img-text-link._hover-3:before{
+        background: fade(@main-color, 20%);
+    }
+    .img-text-link._hover-3:after{
+        display: block;
+    }
+}
+.img-text-link._hover-3 .img-text-link__img-link:before{
+    display: none;
+}
+.img-text-link._hover-3 .img-text-link__img{
+    display: block;
+    transition: all .3s ease;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-3 .img-text-link__img{
+        -webkit-transform: scale(1.05);
+        transform: scale(1.05);
+    }
+}
+.img-text-link._hover-3 .img-text-link__header{
+    position: absolute;
+    top: 0;
+    margin: 0;
+    padding: 15px 50px 15px 15px;
+    width: 100%;
+    z-index: 3;
+    color: @main-body-bg;
+}
+.img-text-link._hover-3 .img-text-link__p{
+    position: absolute;
+    bottom: 0;
+    color: @main-body-bg;
+    padding: 5px 15px 5px 50px;
+    text-align: right;
+    transition: all .4s ease;
+    border-right: 3px solid @main-body-bg;
+    margin: 15px 0;
+    width: 100%;
+    right: 15px;
+    z-index: 3;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-3 .img-text-link__p{
+        opacity: 0;
+    }
+}
+.img-text-link._hover-3 .img-text-link__link {
+    position: absolute;
+    content:'';
+    display: block;
+    width: 100%;
+    height: 100%;
+    border: none;
+    background: transparent;
+    left: 0;
+    top: 0;
+    font-size: 0;
+    z-index: 4;
+}
+.img-text-link._hover-3:hover:after{
+    -webkit-transform: translate3d(-150%, 0, 0) skew(45deg);
+    transform: translate3d(-150%, 0, 0) skew(45deg);
+}
+.img-text-link._hover-3:hover:before{
+    background: fade(@main-color, 40%);
+}
+.img-text-link._hover-3:hover .img-text-link__img{
+    -webkit-transform: scale(1);
+    transform: scale(1);
+}
+.img-text-link._hover-3:hover .img-text-link__p{
+    opacity: 1;
+}
+.img-text-link._hover-3:hover .img-text-link__link{
+    background: transparent;
+}
+
+
+// =========================================================
+// =========================================================
+
+
+// =========================================================
+// === HOVER EFFECT 4 =====================================
+// =========================================================
+
+
+.img-text-link._hover-4{
+    position: relative;
+    overflow: hidden;
+}
+.img-text-link._hover-4 .img-text-link__img{
+    position: relative;
+    display: block;
+}
+.img-text-link._hover-4:after{
+    content:'';
+    display: block;
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    z-index: 2;
+    top: 0;
+    left: 0;
+    background: -webkit-linear-gradient(to bottom, fade(tint(@main-text-color, 90%), 0%) 0%, fade(tint(@main-text-color, 90%), 80%) 75%);
+    background: linear-gradient(to bottom, fade(tint(@main-text-color, 90%), 0%) 0%, fade(tint(@main-text-color, 90%), 80%) 75%);
+    transition: all .2s;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-4:after{
+        opacity: 0;
+        -webkit-transform: translate3d(0, 80%, 0);
+        transform: translate3d(0, 80%, 0);
+    }
+}
+.img-text-link._hover-4 .img-text-link__header{
+    position: absolute;
+    text-align: center;
+    color: @main-text-color;
+    top: 50%;
+    left: 0;
+    width: 100%;
+    padding: 15px;
+    margin: 0;
+    z-index: 3;
+    transition: all .4s;
+    -webkit-transform: translate3d(0, -70%, 0);
+    transform: translate3d(0, -70%, 0);
+}
+@media(min-width: 992px){
+    .img-text-link._hover-4 .img-text-link__header{
+        color: @main-body-bg;
+        -webkit-transform: translate3d(0, -60%, 0);
+        transform: translate3d(0, -60%, 0);
+    }
+}
+.img-text-link._hover-4 .img-text-link__p{
+    position: absolute;
+    padding: 0 30px;
+    transition: all .4s ease;
+    bottom: 0;
+    margin: 0;
+    z-index: 3;
+    text-align: center;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+}
+@media(min-width: 992px){
+    .img-text-link._hover-4 .img-text-link__p{
+        opacity: 0;
+        -webkit-transform: translate3d(0, 0, 0);
+        transform: translate3d(0, 0, 0);
+    }
+}
+.img-text-link._hover-4 .img-text-link__link{
+    position: absolute;
+    z-index: 4;
+    width: 100%;
+    height: 100%;
+    background: transparent;
+    border: none;
+    top: 0;
+    left: 0;
+    display: block;
+    font-size: 0;
+}
+.img-text-link._hover-4:hover .img-text-link__header{
+    -webkit-transform: translate3d(0, -70%, 0);
+    transform: translate3d(0, -70%, 0);
+    color: @main-text-color;
+}
+.img-text-link._hover-4:hover .img-text-link__p{
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+    opacity: 1;
+    color: @main-text-color;
+}
+.img-text-link._hover-4:hover:after{
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+
+}
+.img-text-link._hover-4:hover .img-text-link__link{
+    background: transparent;
+}
+
+// =========================================================
+// =========================================================
+
+// =========================================================
+// === HOVER EFFECT 5 =====================================
+// =========================================================
+
+.img-text-link._hover-5{
+    position: relative;
+    overflow: hidden;
+    color: @main-body-bg;
+}
+.img-text-link._hover-5 .img-text-link__img{
+    z-index: 2;
+    display: block;
+    position: relative;
+    transition: all .4s;
+    -webkit-transform: translate3d(0, -70px, 0);
+    transform: translate3d(0, -70px, 0);
+}
+@media(min-width: 992px){
+    .img-text-link._hover-5 .img-text-link__img{
+        -webkit-transform: translate3d(0, 0, 0);
+        transform: translate3d(0, 0, 0);
+    }
+}
+.img-text-link._hover-5 .img-text-link__header{
+    margin: 0;
+    position: absolute;
+    bottom: 0;
+    padding: 15px;
+    width: 100%;
+    z-index: 3;
+    transition: all .4s;
+    border-bottom: 2px solid @main-color;
+    color: @main-body-bg;
+    -webkit-transform: translate3d(0, -70px, 0);
+    transform: translate3d(0, -70px, 0);
+}
+@media(min-width: 992px){
+    .img-text-link._hover-5 .img-text-link__header{
+        -webkit-transform: translate3d(0, 0, 0);
+        transform: translate3d(0, 0, 0);
+    }
+}
+.img-text-link._hover-5 .img-text-link__p{
+    position: absolute;
+    background: @main-body-bg;
+    color: @main-text-color;
+    bottom: 0;
+    padding: 8px 15px;
+    height: 70px;
+    margin: 0;
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+    transition: all .4s;
+    -webkit-transform-origin: 0% 100%;
+    transform-origin: 0% 100%;
+    border-bottom: 4px solid @main-body-bg;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-5 .img-text-link__p{
+        -webkit-transform: scaleY(0);
+        transform: scaleY(0);
+        color: @main-body-bg;
+    }
+}
+.img-text-link._hover-5 .img-text-link__link{
+    position: absolute;
+    background: transparent;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    z-index: 4;
+    font-size: 0;
+    display: block;
+}
+.img-text-link._hover-5:hover .img-text-link__img{
+    -webkit-transform: translate3d(0, -70px, 0);
+    transform: translate3d(0, -70px, 0);
+}
+.img-text-link._hover-5:hover .img-text-link__header{
+    -webkit-transform: translate3d(0, -70px, 0);
+    transform: translate3d(0, -70px, 0);
+}
+.img-text-link._hover-5:hover .img-text-link__p{
+    -webkit-transform: scaleY(1);
+    transform: scaleY(1);
+    color: @main-text-color;
+}
+.img-text-link._hover-5:hover .img-text-link__link{
+    background: transparent;
+}
+
+
+// =========================================================
+// =========================================================
+
+// =========================================================
+// === HOVER EFFECT 6 =====================================
+// =========================================================
+
+
+.img-text-link._hover-6{
+    position: relative;
+    overflow: hidden;
+    &:after{
+        content:'';
+        display: block;
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        transition: all .4s ease;
+        background: fade(@main-color, 40%);
+        top: 0;
+        left: 0;
+        z-index: 1;
+    }
+}
+@media(min-width: 992px){
+    .img-text-link._hover-6:after{
+        background: fade(@main-color, 20%);
+    }
+}
+.img-text-link._hover-6 .img-text-link__header{
+    position: absolute;
+    width: 100%;
+    text-align: center;
+    padding: 0 30px;
+    margin: 0;
+    top: 50%;
+    color: @main-body-bg;
+    z-index: 2;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+}
+.img-text-link._hover-6 .img-text-link__p{
+    position: absolute;
+    width: 100%;
+    bottom: 50%;
+    text-align: center;
+    padding: 15px 30px;
+    margin: 0;
+    color: @main-body-bg;
+    z-index: 2;
+    transition: all .3s ease;
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+}
+@media(min-width: 992px){
+    .img-text-link._hover-6 .img-text-link__p{
+        opacity: 0;
+        -webkit-transform: translate3d(0, 100%, 0) scale(.9);
+        transform: translate3d(0, 100%, 0) scale(.9);
+    }
+}
+.img-text-link._hover-6 .img-text-link__link{
+    position: absolute;
+    background: transparent;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    font-size: 0;
+    border: none;
+    display: block;
+    z-index: 3;
+    &:before{
+        content:'';
+        display: block;
+        width: 90%;
+        height: 90%;
+        position: absolute;
+        left: 5%;
+        top: 5%;
+        transition: all .4s ease;
+        border-top: 1px solid @main-body-bg;
+        border-left: 1px solid @main-body-bg;
+        z-index: 2;
+    }
+    &:after{
+        content:'';
+        display: block;
+        width: 90%;
+        height: 90%;
+        position: absolute;
+        right: 5%;
+        bottom: 5%;
+        transition: all .4s ease;
+        border-bottom: 1px solid @main-body-bg;
+        border-right: 1px solid @main-body-bg;
+        z-index: 2;
+    }
+}
+
+@media(min-width: 992px){
+    .img-text-link._hover-6 .img-text-link__link:before{
+        width: 0;
+        left: 0;
+        opacity: 0;
+    }
+    .img-text-link._hover-6 .img-text-link__link:after{
+        width: 0;
+        right: 0;
+        opacity: 0;
+    }
+}
+
+.img-text-link._hover-6:hover:after{
+    background: fade(@main-color, 40%);
+}
+
+.img-text-link._hover-6:hover .img-text-link__link:before{
+    left: 5%;
+    width: 90%;
+    opacity: 1;
+}
+.img-text-link._hover-6:hover .img-text-link__link:after{
+    right: 5%;
+    width: 90%;
+    opacity: 1;
+}
+.img-text-link._hover-6:hover .img-text-link__p{
+    opacity: 1;
+    -webkit-transform: translate3d(0, 100%, 0) scale(1);
+    transform: translate3d(0, 100%, 0) scale(1);
+}
+.img-text-link._hover-6:hover .img-text-link__link{
+    background: transparent;
+}
+
+// =========================================================
+// =========================================================
+
+// =========================================================
+// === HOVER EFFECT 7 =====================================
+// =========================================================
+
+
+.img-text-link._hover-7{
+    position: relative;
+    overflow: hidden;
+    &:after{
+        content:"";
+        display: block;
+        width: 0;
+        position: absolute;
+        z-index: 2;
+        top: 15px;
+        left: 15px;
+        bottom: 15px;
+        right: 15px;
+        width: auto;
+        transition: all .3s ease;
+        background: fade(@main-color, 50%);
+        border: 2px solid @main-body-bg;
+        box-shadow: 0 0 0 50px fade(tint(@main-text-color, 90%), 50%);
+    }
+}
+@media(min-width: 992px){
+    .img-text-link._hover-7:after{
+        -webkit-transform: scale(1.2);
+        transform: scale(1.2);
+        opacity: 0;
+    }
+}
+.img-text-link._hover-7 .img-text-link__header{
+    color: @main-body-bg;
+    position: absolute;
+    width: 100%;
+    left: 0;
+    top: 50%;
+    text-align: center;
+    padding: 0 30px;
+    margin: -10px 0 0 0;
+    -webkit-transform: translate3d(0, -100%, 0) scale(.9);
+    transform: translate3d(0, -100%, 0) scale(.9);
+    z-index: 3;
+    transition: all .3s ease;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-7 .img-text-link__header{
+        -webkit-transform: translate3d(0, -100%, 0) scale(1);
+        transform: translate3d(0, -100%, 0) scale(1);
+    }
+}
+.img-text-link._hover-7 .img-text-link__p{
+    color: @main-body-bg;
+    position: absolute;
+    width: 100%;
+    left: 0;
+    bottom: 50%;
+    text-align: center;
+    padding: 0 30px;
+    margin: 0 0 -50px 0;
+    z-index: 3;
+    transition: all .3s ease;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-7 .img-text-link__p{
+        opacity: 0;
+        -webkit-transform: scale(1.5);
+        transform: scale(1.5);
+    }
+}
+.img-text-link._hover-7 .img-text-link__link{
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: transparent;
+    border: none;
+    display: block;
+    z-index: 4;
+    text-indent: -9999px
+}
+.img-text-link._hover-7:hover{
+    &:after{
+        -webkit-transform: scale(1);
+        transform: scale(1);
+        opacity: 1;
+    }
+}
+.img-text-link._hover-7:hover .img-text-link__header{
+    -webkit-transform: translate3d(0, -100%, 0) scale(.9);
+    transform: translate3d(0, -100%, 0) scale(.9);
+}
+.img-text-link._hover-7:hover .img-text-link__p{
+    -webkit-transform: scale(1);
+    transform: scale(1);
+    opacity: 1;
+}
+.img-text-link._hover-7:hover .img-text-link__link{
+    background: transparent;
+}
+
+// =========================================================
+// =========================================================
+
+// =========================================================
+// === HOVER EFFECT 8 =====================================
+// =========================================================
+
+
+.img-text-link._hover-8{
+    position: relative;
+    transition: all .4s ease;
+    box-shadow: 0 3px 30px @main-text-color;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-8{
+        box-shadow: 0 3px 30px fade(@main-text-color, 0%);
+    }
+}
+.img-text-link._hover-8 .img-text-link__header{
+    position: absolute;
+    top: 50%;
+    width: auto;
+    left: 25px;
+    right: 25px;
+    margin: 0;
+    z-index: 1;
+    text-align: center;
+    padding: 2px 10px;
+    background: @main-color;
+    color: @main-body-bg;
+    -webkit-transform: translate3d(0, -150%, 0);
+    transform: translate3d(0, -150%, 0);
+}
+.img-text-link._hover-8 .img-text-link__p{
+    transition: all .4s ease;
+    position: absolute;
+    bottom: 50%;
+    left: 25px;
+    right: 25px;
+    width: auto;
+    text-align: center;
+    z-index: 1;
+    background: @main-color;
+    color: @main-body-bg;
+    padding: 5px 15px;
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+}
+@media(min-width: 992px){
+    .img-text-link._hover-8 .img-text-link__p{
+        -webkit-transform: translate3d(0, 100%, 0) scale3d(0.7, 0.7, 1);
+        transform: translate3d(0, 100%, 0) scale3d(0.7, 0.7, 1);
+        opacity: 0;
+    }
+}
+.img-text-link._hover-8 .img-text-link__img{
+    display: block;
+    transition: all .4s ease;
+}
+.img-text-link._hover-8 .img-text-link__link{
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    border: none;
+    background: transparent;
+    display: block;
+    z-index: 4;
+    text-indent: -9999px;
+}
+.img-text-link._hover-8:hover{
+    box-shadow: 0 3px 30px @main-text-color;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-8:hover .img-text-link__img{
+        -webkit-transform: scale3d(1.05, 1.05, 1);
+        transform: scale3d(1.05, 1.05, 1);
+    }
+}
+.img-text-link._hover-8:hover .img-text-link__p{
+    -webkit-transform: translate3d(0, 100%, 0) scale3d(1, 1, 1);
+    transform: translate3d(0, 100%, 0) scale3d(1, 1, 1);
+    opacity: 1;
+}
+.img-text-link._hover-8:hover .img-text-link__link{
+    background: transparent;
+}
+
+
+
+// =========================================================
+// =========================================================
+
+
+// =========================================================
+// === HOVER EFFECT 9 =====================================
+// =========================================================
+
+
+.img-text-link._hover-9{
+    position: relative;
+    overflow: hidden;
+    &:before{
+        content:'';
+        display: block;
+        padding-top: 67.35%;
+        background: fade(@main-color, 30%);
+        position: relative;
+        z-index: 1;
+    }
+}
+.img-text-link._hover-9 .img-text-link__header{
+    position: absolute;
+    color: @main-body-bg;
+    padding: 0 35px;
+    margin: 0;
+    width: 100%;
+    top: 50%;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+    left: 0;
+    z-index: 5;
+}
+.img-text-link._hover-9 .img-text-link__p{
+    transition: all .3s ease;
+    position: absolute;
+    color: @main-body-bg;
+    bottom: 50%;
+    padding: 20px 35px 0 35px;
+    width: 100%;
+    left: 0;
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+    z-index: 5;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-9 .img-text-link__p{
+        -webkit-transform: translate3d(-10px, 100%, 0);
+        transform: translate3d(-10px, 100%, 0);
+        opacity: 0;
+    }
+}
+.img-text-link._hover-9 .img-text-link__img{
+    position: absolute;
+    width: 100%;
+    transition: all .3s ease;
+    left: 0;
+    top: 0;
+    max-width: none;
+}
+@media(min-width: 992px){
+    .img-text-link._hover-9 .img-text-link__img{
+        width: calc(~"100% + 30px");
+        -webkit-transform: translateX(-30px);
+        transform: translateX(-30px);
+    }
+}
+.img-text-link._hover-9 .img-text-link__img-link{
+    position: static;
+}
+.img-text-link._hover-9 .img-text-link__img-link:before{
+    content:'';
+    display: block;
+    padding-top: 67.35%;
+}
+.img-text-link._hover-9 .img-text-link__link{
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: transparent;
+    border: none;
+    display: block;
+    z-index: 5;
+    text-indent: -9999px;
+    &:before{
+        content:'';
+        display: block;
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        top: 0;
+        left: 0;
+        z-index: 1;
+    }
+    &:after{
+        content:'';
+        position: absolute;
+        top: 20px;
+        left: 20px;
+        bottom: 20px;
+        right: 20px;
+        width: auto;
+        height: auto;
+        display: block;
+        border: 1px solid @main-body-bg;
+        transition: all .3s ease;
+        z-index: 2;
+    }
+}
+@media(min-width: 992px){
+    .img-text-link._hover-9 .img-text-link__link:after{
+        -webkit-transform: translateX(-20px);
+        transform: translateX(-20px);
+        opacity: 0;
+    }
+}
+.img-text-link._hover-9:hover .img-text-link__link:after{
+    -webkit-transform: translateX(0);
+    transform: translateX(0);
+    opacity: 1;
+}
+.img-text-link._hover-9:hover .img-text-link__img{
+    -webkit-transform: translateX(0);
+    transform: translateX(0);
+}
+.img-text-link._hover-9:hover .img-text-link__p{
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+    opacity: 1;
+}
+.img-text-link._hover-9:hover .img-text-link__link{
+    background: transparent;
+}
diff --git a/dev/templates/pages/index.hbs b/dev/templates/pages/index.hbs
index 2657d75..a633a4f 100644
--- a/dev/templates/pages/index.hbs
+++ b/dev/templates/pages/index.hbs
@@ -119,7 +119,8 @@ externalLink: false #just add link (http://link.com) instead of "false" to use t
                 text="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt."
                 linkName="Lorem Ipsum Dolor"
                 linkAsBtn=true
-                disableWholeAreaLink=true
+                disableWholeAreaLink=false
+                hoverEffect="_hover-1"
             }}
         </div>
         <div class="col-md-4">
@@ -131,6 +132,7 @@ externalLink: false #just add link (http://link.com) instead of "false" to use t
                 linkName="Lorem Ipsum Dolor"
                 linkAsBtn=true
                 disableWholeAreaLink=false
+                hoverEffect="_hover-1"
             }}
         </div>
         <div class="col-md-4">
@@ -142,6 +144,7 @@ externalLink: false #just add link (http://link.com) instead of "false" to use t
                 linkName="Lorem Ipsum Dolor"
                 linkAsBtn=true
                 disableWholeAreaLink=false
+                hoverEffect="_hover-1"
             }}
         </div>
     </div>
diff --git a/dev/templates/parts/content/contentElements/imageTextLink.hbs b/dev/templates/parts/content/contentElements/imageTextLink.hbs
index 313e004..21a6b8e 100644
--- a/dev/templates/parts/content/contentElements/imageTextLink.hbs
+++ b/dev/templates/parts/content/contentElements/imageTextLink.hbs
@@ -7,10 +7,13 @@
         linkAsBtn = true/false (by deafalt false);
         link = "" (set href to the element);
         linkName = "" (set button or link name);
+        hoverEffect = "" (set class for hover effect,
+                        can be: _hover-1, _hover-2, , _hover-3, _hover-4, _hover-5,
+                        _hover-6, _hover-7, _hover-8, _hover-9);
 --}}
 
 <div class="img-text-link__wrp">
-    <div class="img-text-link{{#if this.disableWholeAreaLink}}{{else}} _whole-area-link{{/if}}">
+    <div class="img-text-link{{#if this.disableWholeAreaLink}}{{else}} _whole-area-link{{/if}} {{#if this.hoverEffect}}{{this.hoverEffect}}{{/if}}">
         {{#if this.imgSrc}}
             {{#if this.imgLink}}
                 <a class="img-text-link__img-link" title="{{imgLink}}" href="{{imgLink}}">
@@ -24,13 +27,15 @@
             <h3 class="img-text-link__header">{{header}}</h3>
         {{/if}}
         {{#if this.text}}
-            <p class="img-text-link__p">{{text}}</p>
+            <p class="img-text-link__p {{#if this.hoverEffect}}js__img-text-link{{/if}}">{{text}}</p>
         {{/if}}
         {{#if this.linkName}}
             <a class="img-text-link__link {{#if this.linkAsBtn}}btn btn-default {{/if}}" title="{{linkName}}" href="{{#if this.link}}{{link}}{{else}}#{{/if}}">{{linkName}}</a>
         {{/if}}
         {{#if this.disableWholeAreaLink}}{{else}}
-            <span class="img-text-link__sham-link {{#if this.linkAsBtn}}btn btn-default {{/if}}">{{linkName}}</span>
+            {{#if this.hoverEffect}}{{else}}
+                <span class="img-text-link__sham-link {{#if this.linkAsBtn}}btn btn-default {{/if}}">{{linkName}}</span>
+            {{/if}}
         {{/if}}
     </div>
 </div>