diff --git a/css/style.css b/css/style.css
index 0e5d43b..32c302e 100755
--- a/css/style.css
+++ b/css/style.css
@@ -413,7 +413,7 @@ h1, h2, h3, h4, h5, h6, figure {
 #fh5co-hero .flexslider .slider-text > .slider-text-inner h1, #fh5co-hero .flexslider .slider-text > .slider-text-inner h2 {
   margin: 0;
   padding: 0;
-  color: black;
+  color: white;
   font-family: "Oxygen", sans-serif;
 }
 #fh5co-hero .flexslider .slider-text > .slider-text-inner h1 {
@@ -1473,4 +1473,69 @@ input[type="text"] {
   font-weight: 400;
 }
 
+.blurred-card {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  box-shadow: 2px 2px 9px 2px black;
+  overflow: hidden;
+  color: white;
+  padding: 20px;
+}
+
+.blurred-card > .background-faker {
+  position: absolute;
+  top: 0;
+  left: 0;
+  background: black;
+  width: 100%;
+  height: 100%;
+}
+
+.blurred-card > .background-faker > div {
+  width: calc(100vw - 15px);
+  height: 500px;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  background-repeat: no-repeat;
+  background-position: bottom center;
+  background-size: cover;
+  filter: blur(10px);
+  opacity: 0.6;
+  max-width: 1060px;
+}
+
+.col-md-pull-3 .blurred-card > .background-faker > div {
+  left: calc(-1 * (15px + 2em));
+  right: auto;
+  transform: translate(0, -50%);
+}
+
+.col-md-push-3 .blurred-card > .background-faker > div {
+  right: calc(-1 * (15px + 2em));
+  left: auto;
+  transform: translate(0, -50%);
+}
+
+@media screen and (max-width: 992px) {
+  .col-md-push-3 .blurred-card > .background-faker > div,
+  .col-md-pull-3 .blurred-card > .background-faker > div
+  {
+    right: auto;
+    left: calc(-1 * (15px + 2em));
+    transform: translate(0, -50%);
+  }
+}
+
+.blurred-card > .card-content {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  padding: 20px;
+}
+
 /*# sourceMappingURL=style.css.map */
diff --git a/index.html b/index.html
index f7d7246..b5b2b15 100755
--- a/index.html
+++ b/index.html
@@ -76,10 +76,28 @@
 			   			<div class="row">
 				   			<div class="col-md-6 col-md-offset-3 col-md-pull-3 slider-text">
 				   				<div class="slider-text-inner">
-									<h1><font color="white"><b>Огорчи силовика <br> — удаляйся из ВК!</b></font></h1>
-									<h2><font color="white"><b>Привычные централизованные соцсети не защитят вас от произвола и слежки</b></font></h2>
-										<p><a class="btn btn-primary btn-demo" href="https://phreedom.tk/about#new_user"></i>Сбежать</a> 
-										<a class="btn btn-primary btn-learn" href="info.html">Узнать подробности</a></p>
+									<div class="blurred-card">
+										<!--
+											Будьте внимательны! В этой и других карточках текст дублируется умышленно!
+											Одно повторение нужно для того, что бы автоматически подобрались размеры блока
+											с учетом переносов строк
+											Другое повторение нужно для отображения текста поверх абсолютно позицированного блока.
+											Это плохое решение, но другого я не нашел
+										-->
+										<h1><b>Огорчи силовика <br> — удаляйся из ВК!</b></h1>
+										<h2><b>Привычные централизованные соцсети не защитят вас от произвола и слежки</b></h2>
+										<p><a class="btn btn-primary btn-demo" href="https://phreedom.tk/about#new_user"></i>Сбежать</a>
+											<a class="btn btn-primary btn-learn" href="info.html">Узнать подробности</a></p>
+										<div class="background-faker">
+											<div style="background-image: url(images/silovik.png);"></div>
+										</div>
+										<div class="card-content">
+											<h1><b>Огорчи силовика <br> — удаляйся из ВК!</b></h1>
+											<h2><b>Привычные централизованные соцсети не защитят вас от произвола и слежки</b></h2>
+											<p><a class="btn btn-primary btn-demo" href="https://phreedom.tk/about#new_user"></i>Сбежать</a>
+												<a class="btn btn-primary btn-learn" href="info.html">Узнать подробности</a></p>
+										</div>
+									</div>
 				   				</div>
 				   			</div>
 				   		</div>
@@ -91,10 +109,28 @@
 			   			<div class="row">
 				   			<div class="col-md-6 col-md-offset-3 col-md-push-3 slider-text">
 				   				<div class="slider-text-inner">
-				   					<h1>Надоело быть товаром?</h1>
+									<div class="blurred-card">
+										<!--
+											Будьте внимательны! В этой и других карточках текст дублируется умышленно!
+											Одно повторение нужно для того, что бы автоматически подобрались размеры блока
+											с учетом переносов строк
+											Другое повторение нужно для отображения текста поверх абсолютно позицированного блока.
+											Это плохое решение, но другого я не нашел
+										-->
+										<h1>Надоело быть товаром?</h1>
 										<h2>Вконтакте, Facebook, Instagram — цинично торгуют данными своих пользователей. Вы - товар!</h2>
-										<p><a class="btn btn-primary btn-demo" href="https://mastodon.ml/about#new_user"></i>Освободиться</a> 
-										<a class="btn btn-primary btn-learn" href="info.html">Узнать подробности</a></p>
+										<p><a class="btn btn-primary btn-demo" href="https://mastodon.ml/about#new_user"></i>Освободиться</a>
+											<a class="btn btn-primary btn-learn" href="info.html">Узнать подробности</a></p>
+										<div class="background-faker">
+											<div style="background-image: url(images/zuker.jpg);"></div>
+										</div>
+										<div class="card-content">
+											<h1>Надоело быть товаром?</h1>
+											<h2>Вконтакте, Facebook, Instagram — цинично торгуют данными своих пользователей. Вы - товар!</h2>
+											<p><a class="btn btn-primary btn-demo" href="https://mastodon.ml/about#new_user"></i>Освободиться</a>
+												<a class="btn btn-primary btn-learn" href="info.html">Узнать подробности</a></p>
+										</div>
+									</div>
 				   				</div>
 				   			</div>
 				   		</div>
@@ -106,10 +142,28 @@
 			   			<div class="row">
 				   			<div class="col-md-6 col-md-offset-3 slider-text">
 				   				<div class="slider-text-inner text-center">
-									<h1>Что делать с корпоративной слежкой?</h1>
-									<h2>Корпорации Mail.ru (ВК, OK, Mail), Facebook (Instagram, WhatsApp)
-												и Google следят за вами</h2>
+									<div class="blurred-card">
+										<!--
+											Будьте внимательны! В этой и других карточках текст дублируется умышленно!
+											Одно повторение нужно для того, что бы автоматически подобрались размеры блока
+											с учетом переносов строк
+											Другое повторение нужно для отображения текста поверх абсолютно позицированного блока.
+											Это плохое решение, но другого я не нашел
+										-->
+										<h1>Что делать с корпоративной слежкой?</h1>
+										<h2>Корпорации Mail.ru (ВК, OK, Mail), Facebook (Instagram, WhatsApp)
+											и Google следят за вами</h2>
 										<p><a class="btn btn-primary btn-demo" href="https://va11hal.la/about#new_user"></i>Спрятаться</a> <a class="btn btn-primary btn-learn" href="info.html">Узнать больше</a></p>
+										<div class="background-faker">
+											<div style="background-image: url(images/corporation.jpg);"></div>
+										</div>
+										<div class="card-content">
+											<h1>Что делать с корпоративной слежкой?</h1>
+											<h2>Корпорации Mail.ru (ВК, OK, Mail), Facebook (Instagram, WhatsApp)
+												и Google следят за вами</h2>
+											<p><a class="btn btn-primary btn-demo" href="https://va11hal.la/about#new_user"></i>Спрятаться</a> <a class="btn btn-primary btn-learn" href="info.html">Узнать больше</a></p>
+										</div>
+									</div>
 				   				</div>
 				   			</div>
 				   		</div>
@@ -121,9 +175,26 @@
 			   			<div class="row">
 				   			<div class="col-md-6 col-md-offset-3 col-md-push-3 slider-text">
 				   				<div class="slider-text-inner">
-									<h1><font color="white"><b>Стать невидимкой, но только для Большого Брата</b></font></h1>
-									<h2><font color="white"><b>Общайтесь с друзьями, без цензуры и слежки!</b></font></h2>
+									<div class="blurred-card">
+										<!--
+											Будьте внимательны! В этой и других карточках текст дублируется умышленно!
+											Одно повторение нужно для того, что бы автоматически подобрались размеры блока
+											с учетом переносов строк
+											Другое повторение нужно для отображения текста поверх абсолютно позицированного блока.
+											Это плохое решение, но другого я не нашел
+										-->
+										<h1><b>Стать невидимкой, но только для Большого Брата</b></h1>
+										<h2><b>Общайтесь с друзьями, без цензуры и слежки!</b></h2>
 										<p><a class="btn btn-primary btn-demo" href="https://lor.sh/about#new_user"></i>Приступить</a> <a class="btn btn-primary btn-learn" href="info.html">Узнать больше</a></p>
+										<div class="background-faker">
+											<div style="background-image: url(images/bigbrother.jpg);"></div>
+										</div>
+										<div class="card-content">
+											<h1><b>Стать невидимкой, но только для Большого Брата</b></h1>
+											<h2><b>Общайтесь с друзьями, без цензуры и слежки!</b></h2>
+											<p><a class="btn btn-primary btn-demo" href="https://lor.sh/about#new_user"></i>Приступить</a> <a class="btn btn-primary btn-learn" href="info.html">Узнать больше</a></p>
+										</div>
+									</div>
 				   				</div>
 				   			</div>
 				   		</div>
diff --git a/sass/style.scss b/sass/style.scss
index 877aaa1..303c29c 100755
--- a/sass/style.scss
+++ b/sass/style.scss
@@ -492,7 +492,7 @@ h1, h2, h3, h4, h5, h6, figure {
 				h1, h2 {
 					margin: 0;
 					padding: 0;
-					color: rgba(0,0,0,1);
+					color: white;
 					font-family: $font-primary;
 				}
 				h1 {
@@ -1479,4 +1479,69 @@ input[type="text"] {
 			}
 		}
 	}
+}
+
+.blurred-card {
+	width: 100%;
+	height: 100%;
+	position: relative;
+	box-shadow: 2px 2px 9px 2px black;
+	overflow: hidden;
+	color: white;
+	padding: 20px;
+}
+
+.blurred-card > .background-faker {
+	position: absolute;
+	top: 0;
+	left: 0;
+	background: black;
+	width: 100%;
+	height: 100%;
+}
+
+.blurred-card > .background-faker > div {
+	width: calc(100vw - 15px);
+	height: 500px;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
+	background-repeat: no-repeat;
+	background-position: bottom center;
+	background-size: cover;
+	filter: blur(10px);
+	opacity: 0.6;
+	max-width: 1060px;
+}
+
+.col-md-pull-3 .blurred-card > .background-faker > div {
+	left: calc(-1 * (15px + 2em));
+	right: auto;
+	transform: translate(0, -50%);
+}
+
+.col-md-push-3 .blurred-card > .background-faker > div {
+	right: calc(-1 * (15px + 2em));
+	left: auto;
+	transform: translate(0, -50%);
+}
+
+@media screen and (max-width: 992px) {
+	.col-md-push-3 .blurred-card > .background-faker > div,
+	.col-md-pull-3 .blurred-card > .background-faker > div
+	{
+		right: auto;
+		left: calc(-1 * (15px + 2em));
+		transform: translate(0, -50%);
+	}
+}
+
+.blurred-card > .card-content {
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	top: 0;
+	left: 0;
+	padding: 20px;
 }
\ No newline at end of file