https://www.fuckgrechka.ru/coin/

1<!DOCTYPE html>
2<html>
3  <head>
4    <title>Койн — приложение, которое учит экономить и записывает расходы</title>
5    <meta charset="utf-8" />
6    <meta content="width=1000px" name="viewport" />
7    <link href="assets/css/style.css" rel="stylesheet" />
8    <link href="assets/css/likely.css" rel="stylesheet" />
9    <!-- Opengraph -->
10    <meta property="og:type" content="article">
11    <meta property="og:url" content="//fuckgrechka.ru/coin/index.html">
12    <meta property="og:title" content="Койн — приложение для экономии">
13    <meta property="og:description" content="Записывает расходы, анализирует историю, советует и мотивирует">
14    <meta property="og:image" content="//fuckgrechka.ru/coin/assets/img/coin-soc.png">
15
16    <!-- Twitter -->
17    <meta name="twitter:card" content="summary_large_image">
18    <meta name="twitter:title" content="Койн — приложение для экономии">
19    <meta name="twitter:description" content="Записывает расходы, анализирует историю, советует и мотивирует" />
20    <meta name="twitter:image" content="//fuckgrechka.ru/coin/assets/img/coin-soc.png">
21	<link rel="shortcut icon" href="assets/img/favicon.png" type="image/png">
22
23  </head>
24
25
26  <body>
27<style>
28	body {
29		background: #191919;
30	}
31
32	.logotype {
33		font-size: 30px;
34		font-weight: bold;
35		letter-spacing: -1px;
36		color: #ae2408;
37	    color:#d12b0a;
38		display: inline-block;
39		font-family: 'Helvetica Neue', Arial, sans-serif;
40		top: 4px;
41		position: relative;
42	}
43
44	.slogan {
45		display: inline-block;
46		font-size: 18px;
47		font-family: 'Helvetica Neue', Arial, sans-serif;
48		width: 200px;
49		margin-left: 12px;
50		line-height: 22px;
51	}
52
53	.blog-header {
54		display: inline-block;
55		font-size: 18px;
56		font-family: 'Helvetica Neue', Arial, sans-serif;
57		width: 250px;
58		position: absolute;
59		text-align: left;
60		right: 0px;
61		padding: 0;
62		margin-left: 0px;
63	}
64
65	.lead {
66		font-size: 30px;
67		line-height: 42px;
68		margin-top: 6px;
69		width: 600px;
70		margin-bottom: 10px;
71	}
72
73	h1 {
74		letter-spacing: -2px !important;
75	}
76
77	p {
78		font-size: 18px;
79		line-height: 22px;
80		display: inline-block;
81		vertical-align: top;
82		margin-left: 0px;
83	}
84
85	.left-app-name-link {
86		margin-left: 6px;
87	}
88
89
90	.app-profit {
91		width: 250px;
92		display: inline-block;
93		vertical-align: top;
94		border-top: solid 2px rgba(255, 255, 255, 0.1);
95		padding-top: 10px;
96		margin-right: 16px;
97	}
98
99	.app-mission-link {
100		font-size: 22px; background: #F5A623; width: 100%; display: inline-block; height: 100%; color: #000; padding-left: 12px; padding-top: 12px; line-height: 26px; box-shadow: inset 0px -3px 0px rgba(0, 0, 0, 0.34); border-bottom: 0;
101	}
102
103	.app-mission-link:hover {
104		background: #ffb700; border-bottom: 0; color: #000;
105	}
106
107	.app-mission-link:active {
108		opacity: 0.7;
109		box-shadow: inset 0px -1px 0px rgba(0, 0, 0, 0.34);
110	}
111
112	.app-mission-link:visited {
113		color: #000;;
114	}
115
116	.app-mission-link:visited:hover {
117		color: #000;;
118	}
119
120	.main-text {
121		width: 600px;
122		display: inline-block;
123	}
124
125	.main-text p {
126		font-size: 30px;
127		line-height: 44px;
128		margin-top: 18px;
129	}
130
131	.aside-text {
132		display: inline-block;
133		width: 250px;
134		vertical-align: top;
135		position: absolute;
136		right: 0;
137		top: 118px;
138	}
139
140	.aside-text p {
141		margin-bottom: 12px;
142		line-height: 24px;
143	}
144
145	.block-connect {
146		width: 100%;
147		height: 100px;
148		padding: 0 35px;
149		display: -webkit-box;
150		display: -webkit-flex;
151		display: -ms-flexbox;
152		display: flex;
153		-webkit-flex-wrap: nowrap;
154		-ms-flex-wrap: nowrap;
155		flex-wrap: nowrap;
156		-webkit-box-align: center;
157		-webkit-align-items: center;
158		-ms-flex-align: center;
159		align-items: center;
160		-webkit-box-pack: justify;
161		-webkit-justify-content: space-between;
162		-ms-flex-pack: justify;
163		justify-content: space-between;
164		background: #fff;
165		background: hsla(0, 0%, 100%, .05);
166	}
167
168	.block-connect p {
169		font-size: 30px;
170	}
171
172	.footer-link {
173		/*color: #DEDDD8; border-bottom: 1px solid rgba(222, 221, 216, 0.20);*/
174	}
175
176</style>
177    <div class="wrapper">
178     
179     <div class="block header" style="position: relative; vertical-align: top; margin-top: -20px;">
180	     <div class="logotype" style="font-size: 60px; top: 20px;"><a style="color:#d12b0a; border-bottom: 0;" href="//www.fuckgrechka.ru/">fuckgrechka</a>
181	     </div>
182	     <div class="slogan"><p>Приложения помогут<br>тратить меньше</p></div>
183	   <p class="blog-header" style="top: 46px;">Следите за развитием <a href="https://t.me/tzlvt">в Телеграмме</a></p>

184     </div>
185
186     <!-- Шапка закончилась -->
187
188      <div class="header" style="padding-top: 24px;">
189        <div style="display: inline-block; width: 650px; vertical-align: top;">
190	     <h1 class="header__header" style="margin-top: 0; vertical-align: top;">
191          Койн
192        </h1><!--<span style="position: absolute; left: 235px; top: 48px; font-size: 18px; line-height: 22px; color: #ae2408; color:#d12b0a;">Скоро <br />на АйОС</span>-->
193        <p class="lead">Учит тратить меньше, помогает с мотивацией и показывает, на кого равняться</p>
194        </div>
195        <div style="display: inline-block; position: relative; vertical-align: top; top: 16px;">
196	        <div style="margin-top: 12px;">
197		        <a style="border-bottom: 0;" target="_blank" href="//www.fuckgrechka.ru/tzlvt/"><img class="app__icon" style="left: 0; top: 0; position: relative;" src="assets/img/ticon.png"/></a>
198				<p class="left-app-name-link "><a target="_blank" href="//www.fuckgrechka.ru/tzlvt/">Тяжеловато</a> <br />Мешает тратить</p>
199		    </div>
200		    <div style="margin-top: 12px; background: rgba(255, 255, 255, 0.1); box-sizing: content-box; padding-top: 10px; padding-left: 10px; padding-bottom: 10px; padding-right: 50px; border-radius: 4px; left: -10px; position: relative;">
201		        <img class="app__icon" style="left: 0; top: 0; position: relative;" src="assets/img/bicon.png"/>
202				<p class="left-app-name-link ">Койн <br />Считает и учит</p>
203		    </div>
204		 </div>
205      </div>
206     <div class="block" style="text-align: center; position: relative; margin-top: 30px; border-bottom: 0; padding-bottom: 0px;">
207	     <div class="app__phone" style="display: inline-block;">
208		     <img class="app__content" width="300px" src="assets/img/coin-app.png">
209		 </div>
210		<div style="text-align: left; width: 220px; position: absolute; line-height: 24px !important; top: 120px; left: 0px; "><p style="margin-bottom: 12px;"><b>История и чат</b><br />
211			 Койн следит за вашими тратами и пишет, если что-то не так. </p>
212			 <p style="line-height: 24px !important;">Даёт советы сразу после траты или спустя время.</p>
213		</div>
214		<div style="text-align: left; width: 220px; position: absolute; line-height: 24px !important; top: 344px; right: 0px; "><p style="margin-bottom: 12px;"><b>Всё нужное рядом</b><br />
215			 Приложение показывает историю, сумму на день, советы и статистику на одном экране. </p>
216			 <p style="line-height: 24px !important;">Записывает трату там же.</p>
217		</div>
218     </div>
219
220     <div class="block email__block" style="border-bottom: 0; margin-top: -10px; position: relative; margin-bottom: -40px;">
221        <div class="block-connect" style="margin-bottom: 4px;">
222            <p>Следите за развитием в Телеграмме</p>
223            <br><a href="https://t.me/tzlvt" style="border: 0;"><p>Подписаться</p></a>
224        </div>
225       		<div class="likely likely-light likely-big share__likely likely-rewrite" style="top: 6px;;">
226	        <div class="twitter">Твитнуть</div>
227	        <div class="facebook">Поделиться</div>
228	        <div class="vkontakte">Поделиться</div>
229	     </div>
230
231      </div>
232
233
234     <div class="block" style="border-bottom: 0; position: relative;">
235          <div class="main-text">
236          <h2 style="font-size: 60px; line-height: 60px; letter-spacing: -2px; color: #ae2408; color:#d12b0a;">О койне</h2>
237          <p>Самое тяжелое в экономии — мотивация. Когда тратишь, получаешь удовольствие сейчас. Когда экономишь — потом. Из-за этого мы тратим деньги на чепуху.</p>
238          <p>Койн помогает, как может: показывает, сколько тратить в день, следит за расходами, присылает статьи и статистику.</p>
239          <p>Приложение старается объяснить принципы и идеи, которым научились авторы. Развеивает предрассудки и поддерживает в трудную минуту.</p>
240          </div>
241          <div class="aside-text">
242	          <p style="margin-bottom: 0;"><b>Мечтаем, чтобы Койн умел</b></p>
243	          <p>Предсказывать регулярные расходы</p>
244	          <p>Показывать аналитику в сравнении с другими людьми</p>
245	          <p>Помогать ставить цели</p>
246	          <p>Отслеживать расходы по СМС</p>
247	          <p>Предупреждать слишком большие расходы</p>
248	          <p>Присылать советы, лайфхаки и примеры других людей</p>
249	          <p>Формировать привычку: напоминать о себе, поддерживать в трудную минуту и хвалить за успехи</p>
250          </div>
251      </div>
252
253      <div class="block email__block" style="border-bottom: 0;">
254	     <div style="width: 100%; text-align: center; margin-bottom: -5px;"><img src="assets/img/coin-learning.gif" width="316" style="width: 316px; margin: 0 auto;"></div>
255
256               <div class="block-connect" style="margin-bottom: 4px;">
257            <p>Следите за развитием в Телеграмме</p>
258            <br><a href="https://t.me/tzlvt" style="border: 0;"><p>Подписаться</p></a>
259        </div>        
260        <div class="block-connect" style="margin-bottom: 4px; padding-bottom: 20px; padding-top: 0px; padding-right: 0; padding-left: 0; box-sizing: content-box; position: relative; background: inherit;">
261           <p style="font-size: 24px; width: 450px; line-height: 30px; display: inline-block; margin-left: 0px;">
262	           <a href="//www.fuckgrechka.ru/tzlvt/"><img src="assets/img/ticon.png" width="54px" style="margin-left: 2px; margin-right: 0; display: inline-block; position: absolute; top: 24px; left: 34px;"></a>

263	           <span style="display: inline-block; margin-left: 108px;">Пока ждёте Койн, попробуйте экономить <a target="_blank" href="//www.fuckgrechka.ru/tzlvt/">в «Тяжеловато»</a></p>
264        </div>
265      </div>
266      <div class="block footer" style="border-top: 2px solid hsla(0, 0%, 100%, 0.1);padding-top: 24px !important;">
267       <div style="display: inline-block; width: 800px;">
268        <div style="width: 220px; display: inline-block; line-height: 24px;">
269         <p><a href="https://t.me/superufastar" class="footer-link">Константинопольский</a></p> <br />
270          <p>Идея и дизайн</p>
271
272        </div>
273        <div style="width: 180px; display: inline-block; line-height: 24px;">
274          <p><a class="footer-link" href="https://bespoyasov.ru">Беспоясов</a></p> <br />
275          <p>Разработка и тесты</p>
276        </div>
277        </div>
278        <div class="likely likely-light likely-big share__likely likely-rewrite" style="top: -24px; padding-top: 0;">
279	        <div class="twitter">Твитнуть</div>
280	        <div class="facebook">Поделиться</div>
281	        <div class="vkontakte">Рассказать</div>
282	  </div>
283
284      </div>
285     </div>
286    

286<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>

286
287    

287<script src="assets/js/scripts.js"></script>

287
288    

288<script src="assets/js/likely.js"></script>

288
289    <!-- Yandex.Metrika counter -->
290    

290<script type="text/javascript">
291    (function (d, w, c) {
292        (w[c] = w[c] || []).push(function() {
293            try {
294                w.yaCounter35496690 = new Ya.Metrika({
295                    id:35496690,
296                    clickmap:true,
297                    trackLinks:true,
298                    accurateTrackBounce:true
299                });
300            } catch(e) { }
301        });
302
303        var n = d.getElementsByTagName("script")[0],
304            s = d.createElement("script"),
305            f = function () { n.parentNode.insertBefore(s, n); };
306        s.type = "text/javascript";
307        s.async = true;
308        s.src = "https://mc.yandex.ru/metrika/watch.js";
309
310        if (w.opera == "[object Opera]") {
311            d.addEventListener("DOMContentLoaded", f, false);
312        } else { f(); }
313    })(document, window, "yandex_metrika_callbacks");
314    </script>

314
315    <noscript><div><img src="https://mc.yandex.ru/watch/35496690" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
316    <!-- Yandex.Metrika counter -->
317
318
319  </body>
320</html>