index.html 39 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <link rel="icon" href="favicon.png" type="image/x-icon">
  5. <!-- Title and Meta Tags Begins -->
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  7. <meta charset="utf-8">
  8. <!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
  9. <meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />
  10. <title>PeaceOS</title>
  11. <!-- Title and Meta Tags Ends -->
  12. <!-- Google Font Begins -->
  13. <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,800,300,800italic,700,300italic,700italic,400italic' rel='stylesheet' type='text/css'>
  14. <!-- Google Font Ends -->
  15. <!-- CSS Begins-->
  16. <link href='http://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>
  17. <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
  18. <link href="css/carousel.css" rel="stylesheet" type="text/css" />
  19. <link href="css/animate.min.css" rel="stylesheet" type="text/css"/>
  20. <link href="css/simple-line-icons.css" rel="stylesheet" type="text/css" />
  21. <!-- Main Style -->
  22. <link href="css/style.css" rel="stylesheet" type="text/css" />
  23. <link href="css/responsive.css" rel="stylesheet" type="text/css" />
  24. <!-- Color Panel -->
  25. <link href="css/color-panel.css" rel="stylesheet" type="text/css" />
  26. </head>
  27. <body>
  28. <!-- Page Loader -->
  29. <div class="pageloader"></div>
  30. <!-- Wrapper Begins -->
  31. <div id="wrapper" class="wrapper-class">
  32. <!-- Header Begins -->
  33. <div id="header" class="header-section">
  34. <!-- Sticky Header Begins -->
  35. <div id="sticky-menu" class="sticky-navigation">
  36. <div class="logo-container">
  37. <div class="container">
  38. <div class="row">
  39. <!-- Logo Begins -->
  40. <div class="col-md-2 logo">
  41. <a href="#" title="PeaceOS"><img class="img-responsive" src="images/logo.svg" alt="PeaceOS" /></a>
  42. </div>
  43. <!-- Logo Ends -->
  44. <!-- Navigation Menu Begins -->
  45. <div id="navigation" class="col-md-8 navbar top-navbar no-padding">
  46. <!-- Mobile Nav Toggle Begins -->
  47. <div class="navbar-header nav-respons">
  48. <button data-target=".bs-navbar-collapse" data-toggle="collapse" type="button" class="navbar-toggle">
  49. <span class="sr-only">Навигация</span>
  50. <span class="icon-bar"></span>
  51. <span class="icon-bar"></span>
  52. <span class="icon-bar"></span>
  53. </button>
  54. </div><!-- Mobile Nav Toggle Ends -->
  55. <!-- Menu Begins -->
  56. <nav id="topnav" role="navigation" class="collapse navbar-collapse bs-navbar-collapse no-padding">
  57. <ul class="nav navbar-nav navbar-right uppercase">
  58. <li><a href="#about" class="scroll">О нас</a></li>
  59. <li><a href="#features" class="scroll">О системе</a></li>
  60. <li><a href="#services" class="scroll">Идеалогия</a></li>
  61. <li><a href="#reviews" class="scroll">Мнения</a></li>
  62. <li><a href="#pricing" class="scroll">Пожертвовать</a></li>
  63. <li><a href="#contact-us" class="scroll">Контакты</a></li>
  64. </ul>
  65. </nav><!-- Menu Ends -->
  66. </div><!-- Navigation Menu Ends -->
  67. </div>
  68. </div>
  69. </div>
  70. </div><!-- Sticky Header Ends -->
  71. <!-- Banner Section Begins -->
  72. <div class="banner-bg">
  73. <div id="about" class="banner-section container">
  74. <div class="row">
  75. <!-- Left Banner Text Begins -->
  76. <div class="col-md-5 left-banner-text animated" data-animation="fadeInLeft" data-animation-delay="500">
  77. <!-- Banner Title -->
  78. <h1 class="text-uppercase"><span class="text-extrabold">PeaceOS</span> система для верных идеалам</h1>
  79. <!-- Banner Content -->
  80. <div class="row">
  81. <div class="col-md-10">
  82. <p class="banner-text">Si pacem afferre vis, non solum in factis tuis, sed etiam in corde tuo ac instrumentis quibus uteris, oportet esse. <span class="extrabold-italic">Verum in principiis pacis.</span></p>
  83. </div>
  84. </div>
  85. <!-- Banner Button -->
  86. <div class="banner-button">
  87. <a href="https://youtu.be/dQw4w9WgXcQ?si=jwoLcHWXWmQg2es1" target="_blank" class="btn gk-btn white-btn gk-btn-margin" role="button">Исходный код</a>
  88. <a href="https://youtu.be/dQw4w9WgXcQ?si=jwoLcHWXWmQg2es1" target="_blank" class="btn gk-btn red-btn" role="button"><i class="fa fa-cloud-download"></i> Загрузить ОС</a>
  89. </div>
  90. <!-- Banner Nav Shape -->
  91. <div class="row triangle-shape banner-nav">
  92. <div class="col-sm-12">
  93. <a href="#features" class="banner-triangle scroll color-white"><i class="flaticon flaticon-arrow351 gk-triangle-bigsharp"></i></a>
  94. </div>
  95. </div>
  96. </div><!-- Left Banner Text Ends -->
  97. <!-- Right Banner Image Begins -->
  98. <div class="col-md-7 right-banner-image animated" data-animation="fadeInRight" data-animation-delay="500">
  99. <div class="row">
  100. <!-- Banner Counter Info Begins -->
  101. <div class="col-sm-5 banner-image-info">
  102. <!-- Row 1 -->
  103. <div class="row">
  104. <div class="col-xs-12 banner-left-margin">
  105. <div class="banner-info col-xs-6 text-right text-uppercase">
  106. <div class="count-number" data-count="11452"><span class="counter text-bold"></span></div> миролюбов выбрали PeaceOS
  107. </div>
  108. <div class="banner-info-right col-xs-6 no-padding">
  109. <span class="close-brackets">}</span> <i class="fa fa-cloud-download color-greenalt"></i>
  110. </div>
  111. </div>
  112. </div>
  113. <!-- Row 2 -->
  114. <div class="row">
  115. <div class="col-xs-12 banner-left-margin">
  116. <div class="banner-info col-xs-6 text-right text-uppercase">
  117. <div class="count-number" data-count="524"><span class="counter text-bold"></span></div> обрели веру в человечество
  118. </div>
  119. <div class="banner-info-right col-xs-6 no-padding">
  120. <span class="close-brackets">}</span> <i class="fa fa-heart color-greenalt"></i>
  121. </div>
  122. </div>
  123. </div>
  124. <!-- Row 3 -->
  125. <div class="row">
  126. <div class="col-xs-12 banner-left-margin">
  127. <div class="banner-info col-xs-6 text-right text-uppercase">
  128. <div class="count-number" data-count="2136"><span class="counter text-bold"></span></div> новичков задумались
  129. </div>
  130. <div class="banner-info-right col-xs-6 no-padding">
  131. <span class="close-brackets">}</span> <i class="fa fa-hand-o-up color-greenalt"></i>
  132. </div>
  133. </div>
  134. </div>
  135. </div><!-- Banner Counter Info Ends -->
  136. <!-- Banner Image -->
  137. <div class="col-sm-7">
  138. <img class="img-responsive pull-right" src="images/notebook.png" alt="PeaceOS Notebook" />
  139. </div>
  140. </div>
  141. </div> <!-- Right Banner Image Begins -->
  142. </div>
  143. </div>
  144. </div><!-- Banner Section Ends -->
  145. </div><!-- Header Ends -->
  146. <!-- Layout Begins -->
  147. <!-- Features Section Begins -->
  148. <div id="features" class="features-section section-padding">
  149. <div class="container relative">
  150. <div class="row">
  151. <!-- Features Left Info Begins -->
  152. <div class="col-md-4 features-left-info animated" data-animation="fadeInLeft" data-animation-delay="500">
  153. <!-- Title -->
  154. <h3 class="section-msg1 color-grey text-uppercase"><span class="text-extrabold">Обретите <br />мир на</span> <br />своём устройстве</h3>
  155. <!-- Content -->
  156. <p>Ama instrumentum tuum sicut te ipsum. <br /> Love -> Work -> Love</p>
  157. <!-- Shape Down Arrow -->
  158. <p class="color-grey"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  159. <!-- List Elements -->
  160. <ul class="list-unstyled gk-list color-grey">
  161. <li class="text-bold"><span class="simple-icon icon-check"></span> Проста в использовании</li>
  162. <li class="text-bold"><span class="simple-icon icon-check"></span> Высокопроизводительна</li>
  163. <li class="text-bold no-border"><span class="simple-icon icon-check"></span> И всё это без принципов насилия</li>
  164. </ul>
  165. </div><!-- Features Left Info Ends -->
  166. <!-- Features Right Info Begins -->
  167. <div class="col-md-8 features-right-info animated" data-animation="fadeInRight" data-animation-delay="500">
  168. <!-- Shape Pointer -->
  169. <div class="gk-pointer-features gk-right-arrow animated" data-animation="fadeInLeftBig" data-animation-delay="1200">
  170. <img src="images/right-arrow-icon.png" alt="Pointer" class="img-responsive" />
  171. </div>
  172. <!-- Title -->
  173. <h2 class="section-title color-grey"><span class="text-extrabold">Мирный</span> функционал</h2>
  174. <!-- Shape Down Arrow -->
  175. <p class="text-center color-grey"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  176. <!-- Description -->
  177. <h3 class="section-msg text-center color-grey">PeaceOS воспитывает ваше мышление на примере себя самого. Вот лишь пара примеров: </h3>
  178. <div class="container features-right-grid">
  179. <!-- First Row Begins -->
  180. <div class="row">
  181. <!-- Column 1 Begins -->
  182. <div class="col-sm-6 text-right">
  183. <div class="features-grid gk-divider">
  184. <!-- Icon -->
  185. <span class="simple-icon icon-emoticon-smile color-greenalt"></span>
  186. <!-- Title -->
  187. <h4 class="text-uppercase grid-title text-bold color-grey">Равенство</h4>
  188. <!-- Content -->
  189. <p>Прежде чем извлечь съёмный накопитель, система спросит его мнение.</p>
  190. </div>
  191. <!-- Horizontal Line -->
  192. <hr class="features-line" />
  193. </div><!-- Column 1 Ends -->
  194. <!-- Column 2 Begins -->
  195. <div class="col-sm-6">
  196. <div class="features-grid">
  197. <!-- Icon -->
  198. <span class="simple-icon icon-frame color-greenalt"></span>
  199. <!-- Title -->
  200. <h4 class="text-uppercase grid-title text-bold color-grey">Скромность</h4>
  201. <!-- Content -->
  202. <p>Система никогда не будет вам ничего навязывать и рекомендовать. Используйте то, что вам нужно.</p>
  203. </div>
  204. <!-- Horizontal Line -->
  205. <hr class="features-line" />
  206. </div><!-- Column 2 Ends -->
  207. </div><!-- First Row Ends -->
  208. <!-- Second Row Begins -->
  209. <div class="row">
  210. <!-- Column 1 Begins -->
  211. <div class="col-sm-6 text-right">
  212. <div class="features-grid gk-divider">
  213. <!-- Icon -->
  214. <span class="simple-icon icon-lock-open color-greenalt"></span>
  215. <!-- Title -->
  216. <h4 class="text-uppercase grid-title text-bold color-grey">Свобода</h4>
  217. <!-- Content -->
  218. <p>Система никак не ограничивает ваши права и свободу действий.</p>
  219. </div>
  220. </div><!-- Column 1 Ends -->
  221. <!-- Column 2 Begins -->
  222. <div class="col-sm-6">
  223. <div class="features-grid">
  224. <!-- Icon -->
  225. <span class="simple-icon icon-heart color-greenalt"></span>
  226. <!-- Title -->
  227. <h4 class="text-uppercase grid-title text-bold color-grey">Доверие</h4>
  228. <!-- Content -->
  229. <p>Во избежание насилия в системе отсутствуют механизмы самозащиты. А если вы используете свою свободу, чтобы повредить её, то сами от сбоя и пострадаете. Законы вселенной неизменны везде.</p>
  230. </div>
  231. </div><!-- Column 2 Ends -->
  232. </div><!-- Second Row Ends -->
  233. </div>
  234. </div><!-- Features Right Info Ends -->
  235. </div>
  236. </div>
  237. </div>
  238. <!-- Features Section Ends -->
  239. <!-- Services Section Begins -->
  240. <div id="services" class="app-services-section section-padding">
  241. <div class="container relative">
  242. <!-- Services Top Row Begins -->
  243. <div class="row">
  244. <!-- Services Right Info Begins -->
  245. <div class="col-xs-12 animated" data-animation="fadeInRight" data-animation-delay="500">
  246. <!-- Title -->
  247. <h2 class="section-title color-white"><span class="text-extrabold">Хочешь учить - </span> следуй сам</h2>
  248. <!-- Shape Down Arrow -->
  249. <p class="text-center color-white"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  250. <!-- Description -->
  251. <h3 class="section-msg text-center color-white">Система верна своим принципам вплоть до архитектуры</h3>
  252. </div><!-- Services Right Info Ends -->
  253. </div><!-- Services Top Row Ends -->
  254. </div>
  255. <!-- Services Slider Begins -->
  256. <div class="container awesome-container">
  257. <!-- Services Bottom Row Begins -->
  258. <div class="row">
  259. <div class="col-xs-12 animated" data-animation="fadeInUp" data-animation-delay="800">
  260. <div id="awesome-services" class="owl-carousel app-carousel-slider">
  261. <!-- Item 1 -->
  262. <div class="awesome-services text-center">
  263. <!-- Icon -->
  264. <span class="simple-icon icon-settings color-greenalt"></span>
  265. <!-- Title -->
  266. <h3 class="color-grey text-uppercase text-bold">Ядро</h3>
  267. <!-- Content -->
  268. <p class="big-text">ОС работает на базе GNU/Hurd - системы равноправных микроядер.</p>
  269. </div>
  270. <!-- Item 2 -->
  271. <div class="awesome-services text-center">
  272. <!-- Icon -->
  273. <span class="simple-icon icon-control-forward color-greenalt"></span>
  274. <!-- Title -->
  275. <h3 class="color-grey text-uppercase text-bold">Многозадачность</h3>
  276. <!-- Content -->
  277. <p class="big-text">В ОС не используется режим вытесняющей многозадачности. Активный процесс выполняется до тех пор, пока он сам, по собственной инициативе, не отдаст управление планировщику операционной системы.</p>
  278. </div>
  279. <!-- Item 3 -->
  280. <div class="awesome-services text-center">
  281. <!-- Icon -->
  282. <span class="simple-icon icon-energy color-greenalt"></span>
  283. <!-- Title -->
  284. <h3 class="color-grey text-uppercase text-bold">Многопоточность</h3>
  285. <!-- Content -->
  286. <p class="big-text">Прекрасно отлаженные потоки не конфликтуют друг с другом.<br>ОС поддерживает до 1024 потоков ЦП.</p>
  287. </div>
  288. <!-- Item 4 -->
  289. <div class="awesome-services text-center">
  290. <!-- Icon -->
  291. <span class="simple-icon icon-screen-desktop color-greenalt"></span>
  292. <!-- Title -->
  293. <h3 class="color-grey text-uppercase text-bold">Ресурсы</h3>
  294. <!-- Content -->
  295. <p class="big-text">Для большей оптимизации ОС написана на C++, C и языке ассемблера. Малое потребление ресурсов снижает риски притеснения процессов на слабых устройствах.</p>
  296. </div>
  297. <!-- Item 5 -->
  298. <div class="awesome-services text-center">
  299. <!-- Icon -->
  300. <span class="simple-icon icon-shield color-greenalt"></span>
  301. <!-- Title -->
  302. <h3 class="color-grey text-uppercase text-bold">Безопасность</h3>
  303. <!-- Content -->
  304. <p class="big-text">Каждая функция ответственно относится к выделенной ей памяти. Перед каждым обновлением ОС проходит тестирование на уязвимости утечки памяти.</p>
  305. </div>
  306. <!-- Item 6 -->
  307. <div class="awesome-services text-center">
  308. <!-- Icon -->
  309. <span class="simple-icon icon-lock-open color-greenalt"></span>
  310. <!-- Title -->
  311. <h3 class="color-grey text-uppercase text-bold">Свобода</h3>
  312. <!-- Content -->
  313. <p class="big-text">ОС не придерживается<br>Unix-way.<br>Любая программа может быть создана для выполнения любого количества разных задач, код ОС также основывается на этом принципе.</p>
  314. </div>
  315. </div>
  316. </div>
  317. </div><!-- Services Bottom Row Ends -->
  318. </div>
  319. </div>
  320. <!-- Services Section Ends -->
  321. <!-- Reviews Section Begins -->
  322. <div id="reviews" class="reviews-section section-padding">
  323. <div class="container">
  324. <!-- Reviews Top Row -->
  325. <div class="row">
  326. <div class="col-md-7 col-lg-6 app-reviews animated" data-animation="fadeInLeft" data-animation-delay="500">
  327. <!-- Title -->
  328. <h2 class="section-title color-grey"><span class="text-extrabold">Независимые</span> Мнения</h2>
  329. <!-- Shape Down Arrow -->
  330. <p class="color-grey text-center"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  331. <!-- Description -->
  332. <h3 class="section-msg text-center color-grey">Что говорят о нас...</h3>
  333. </div>
  334. <!-- Reviews Slider Row Begins-->
  335. <div class="row">
  336. <div class="col-xs-12 animated" data-animation="fadeInUp" data-animation-delay="800">
  337. <!-- Shape Pointer -->
  338. <div class="gk-pointer-features gk-left-arrow"><img src="images/left-arrow-icon.png" alt="Pointer" class="img-responsive" /></div>
  339. <!-- Reviews Container Begins -->
  340. <div id="reviews-slider" class="carousel slide reviews-slider-section" data-ride="carousel">
  341. <!-- Slides Inner Begins -->
  342. <div class="carousel-inner">
  343. <!-- Item 1 -->
  344. <div class="item active container">
  345. <div class="row item-grid">
  346. <div class="col-lg-6 col-md-6 reviews-info color-grey">
  347. <!-- Content -->
  348. <div class="reviews-msg">
  349. <p class="light-italic info-margin">Данная ОС, энтузиазм, с которым она развивается, и цели, преследуемые разработчиками, достойны похвалы и подражания. <span class="extrabold-italic">Это образцовый представитель мира FLOSS.</span></p>
  350. </div>
  351. <!-- Author Info -->
  352. <div class="reviews-author">
  353. <p class="text-bold text-uppercase author-margin">Ричард Столлман</p>
  354. <p class="text-bold text-uppercase author-sub">The GNU Project</p>
  355. </div>
  356. </div>
  357. <!-- Image -->
  358. <div class="col-lg-6 col-md-5 reviews-image">
  359. <div class="main-reviews-image container">
  360. <div class="row">
  361. <img class="img-responsive img-circle" src="images/reviews/stallman.jpg" width="330" height="330" alt="Richard" />
  362. </div>
  363. </div>
  364. </div>
  365. </div>
  366. </div>
  367. <!-- Item 2 -->
  368. <div class="item container">
  369. <div class="row item-grid">
  370. <div class="col-lg-6 col-md-6 reviews-info color-grey">
  371. <!-- Content -->
  372. <div class="reviews-msg">
  373. <p class="light-italic info-margin">Мне неизвестна религия авторов этого проекта, но так или иначе они являются образцовыми христианами. Выражаю своё восхищение. <span class="extrabold-italic">Мои благословления всегда с вами.</span></p>
  374. </div>
  375. <!-- Author Info -->
  376. <div class="reviews-author">
  377. <p class="text-bold text-uppercase author-margin">Франциск</p>
  378. <p class="text-bold text-uppercase author-sub">Его Святейшество Папа Римский</p>
  379. </div>
  380. </div>
  381. <!-- Image -->
  382. <div class="col-lg-6 col-md-5 reviews-image">
  383. <div class="main-reviews-image container">
  384. <div class="row">
  385. <img class="img-responsive img-circle" src="images/reviews/franciscus.jpg" width="330" height="330" alt="Franciscus" />
  386. </div>
  387. </div>
  388. </div>
  389. </div>
  390. </div>
  391. <!-- Item 3 -->
  392. <div class="item container">
  393. <div class="row item-grid">
  394. <div class="col-lg-6 col-md-6 reviews-info color-grey">
  395. <!-- Content -->
  396. <div class="reviews-msg">
  397. <p class="light-italic info-margin">Меня не устраивает использование несвятых языков программирования. <span class="extrabold-italic">Но, думаю, я смогу выпросить им место в раю.</span></p>
  398. </div>
  399. <!-- Author Info -->
  400. <div class="reviews-author">
  401. <p class="text-bold text-uppercase author-margin">Терри Дэвис</p>
  402. <p class="text-bold text-uppercase author-sub">Создатель TempleOS</p>
  403. </div>
  404. </div>
  405. <!-- Image -->
  406. <div class="col-lg-6 col-md-5 reviews-image">
  407. <div class="main-reviews-image container">
  408. <div class="row">
  409. <img class="img-responsive img-circle" src="images/reviews/davis.jpg" width="330" height="330" alt="Terry" />
  410. </div>
  411. </div>
  412. </div>
  413. </div>
  414. </div>
  415. <!-- Item 4 -->
  416. <div class="item container">
  417. <div class="row item-grid">
  418. <div class="col-lg-6 col-md-6 reviews-info color-grey">
  419. <!-- Content -->
  420. <div class="reviews-msg">
  421. <p class="light-italic info-margin">Внимание, все данные отзывы, как и сам образ PeaceOS, являются вымышленными! <span class="extrabold-italic">Все совпадения случайны.</span></p>
  422. </div>
  423. <!-- Author Info -->
  424. <div class="reviews-author">
  425. <p class="text-bold text-uppercase author-margin">Дудоль Никита, КСиК-21</p>
  426. <p class="text-bold text-uppercase author-sub">Автор данного сайта (но не шаблона :))</p>
  427. </div>
  428. </div>
  429. <!-- Image -->
  430. <div class="col-lg-6 col-md-5 reviews-image">
  431. <div class="main-reviews-image container">
  432. <div class="row">
  433. <img class="img-responsive img-circle" src="images/reviews/nikitos.jpg" width="330" height="330" alt="Nikitos" />
  434. </div>
  435. </div>
  436. </div>
  437. </div>
  438. </div>
  439. </div><!-- Slider Inner Ends -->
  440. </div>
  441. <!-- Reviews Container Ends -->
  442. <!-- Indicators Begins -->
  443. <div class="reviews-indicators">
  444. <a class="gk-slide-left" href="#reviews-slider" data-slide="prev">
  445. <i class="fa fa-chevron-left color-grey"></i>
  446. </a>
  447. <a class="gk-slide-right" href="#reviews-slider" data-slide="next">
  448. <i class="fa fa-chevron-right color-grey"></i>
  449. </a>
  450. </div><!-- Indicators Ends -->
  451. </div>
  452. </div><!-- Reviews Slider Row Ends -->
  453. </div>
  454. </div>
  455. </div>
  456. <!-- Reviews Section Ends -->
  457. <!-- Pricing Section Begins -->
  458. <div id="pricing" class="pricing-section section-padding">
  459. <div class="container relative">
  460. <!-- Pricing Top Row Begins -->
  461. <div class="row">
  462. <!-- Pricing Right Info Begins -->
  463. <div class="col-xs-12 app-right-info animated" data-animation="fadeInRight" data-animation-delay="500">
  464. <!-- Title -->
  465. <h2 class="section-title color-grey"><span class="text-extrabold">Добровольная</span> подписка</h2>
  466. <!-- Shape Down Arrow -->
  467. <p class="text-center color-grey"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  468. <!-- Description -->
  469. <h3 class="section-msg text-center color-grey">Поддержите проект PeaceOS!<br>Для оформления подписки воспользуйтесь формой обратной связи.</h3>
  470. </div><!-- Pricing Right Info Ends -->
  471. </div>
  472. </div>
  473. <div class="container pricing-container">
  474. <!-- Pricing Grid Row Begins -->
  475. <div class="row pricing-grid">
  476. <div class="col-xs-12">
  477. <!-- Price Table 01 -->
  478. <div class="col-md-4 col-sm-4 pricing-item1 animated" data-animation="fadeInLeft" data-animation-delay="500">
  479. <div class="pricing-box">
  480. <!-- Price Title -->
  481. <div class="pricing-title">
  482. <h3 class="text-center text-uppercase text-bold color-greenalt">На чай</h3>
  483. <div class="price text-center">
  484. <h6 class="color-white text-bold"><span class="symbol color-grey">$</span>5<span class="per-month color-grey">/мес</span></h6>
  485. </div>
  486. </div>
  487. <!-- Price Table Features -->
  488. <ul class="list-unstyled gk-list text-bold color-grey">
  489. <li class="no-border"><span class="simple-icon icon-check"></span> Благодарность разработчиков</li>
  490. <li class="no-border"><span class="simple-icon icon-check"></span> Вклад в благое дело</li>
  491. <li class="no-border"><span class="simple-icon icon-check"></span> Доступ к ранним обновлениям</li>
  492. </ul>
  493. </div>
  494. </div>
  495. <!-- Price Table 02 -->
  496. <div class="col-md-4 col-sm-4 pricing-item2 animated" data-animation="fadeIn" data-animation-delay="700">
  497. <div class="pricing-box">
  498. <!-- Price Title -->
  499. <div class="pricing-title">
  500. <h3 class="text-center text-uppercase text-bold color-greenalt">Спонсор</h3>
  501. <div class="price text-center">
  502. <h6 class="color-white text-bold"><span class="symbol color-grey">$</span>25<span class="per-month color-grey">/мес</span></h6>
  503. </div>
  504. </div>
  505. <!-- Price Table Features -->
  506. <ul class="list-unstyled gk-list text-bold color-grey">
  507. <li class="no-border"><span class="simple-icon icon-check"></span> Благодарность разработчиков</li>
  508. <li class="no-border"><span class="simple-icon icon-check"></span> Вклад в благое дело</li>
  509. <li class="no-border"><span class="simple-icon icon-check"></span> Доступ к ранним обновлениям</li>
  510. <li class="no-border"><span class="simple-icon icon-check"></span> Доступ к техподдержке</li>
  511. </ul>
  512. </div>
  513. </div>
  514. <!-- Price Table 03 -->
  515. <div class="col-md-4 col-sm-4 pricing-item3 animated" data-animation="fadeInRight" data-animation-delay="500">
  516. <div class="pricing-box">
  517. <!-- Price Title -->
  518. <div class="pricing-title">
  519. <h3 class="text-center text-uppercase text-bold color-greenalt">Меценат</h3>
  520. <div class="price text-center">
  521. <h6 class="color-white text-bold"><span class="symbol color-grey">$</span>99<span class="per-month color-grey">/мес</span></h6>
  522. </div>
  523. </div>
  524. <!-- Price Table Features -->
  525. <ul class="list-unstyled gk-list text-bold color-grey">
  526. <li class="no-border"><span class="simple-icon icon-check"></span> Благодарность разработчиков</li>
  527. <li class="no-border"><span class="simple-icon icon-check"></span> Вклад в благое дело</li>
  528. <li class="no-border"><span class="simple-icon icon-check"></span> Доступ к ранним обновлениям</li>
  529. <li class="no-border"><span class="simple-icon icon-check"></span> Доступ к техподдержке</li>
  530. <li class="no-border"><span class="simple-icon icon-check"></span> Доступ к чату с разработчиками</li>
  531. </ul>
  532. </div>
  533. </div>
  534. </div>
  535. </div><!-- Pricing Grid Row Ends -->
  536. </div>
  537. </div>
  538. <!-- Pricing Section Ends -->
  539. <!-- Download Section Begins -->
  540. <div id="download" class="download-section section-padding">
  541. <div class="container">
  542. <!-- Download Top Right Row Begins -->
  543. <div class="row">
  544. <div class="col-xs-12 animated" data-animation="fadeInRight" data-animation-delay="500">
  545. <!-- Title -->
  546. <h2 class="section-title color-grey"><span class="text-extrabold">Дайджест</span> разработки</h2>
  547. <!-- Shape Down Arrow -->
  548. <p class="text-center color-grey"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  549. <!-- Content -->
  550. <h3 class="section-msg text-center color-grey">Подпишитесь на рассылку, <br /> будьте в курсе новостей!</h3>
  551. </div>
  552. </div><!-- Download Top Right Row Ends -->
  553. <!-- Download Content Row Begins -->
  554. <div class="row">
  555. <!-- Iphone Image -->
  556. <div class="col-lg-6 col-md-4 download-left-img animated" data-animation="fadeInLeft" data-animation-delay="500">
  557. <img src="images/postpigeon.png" alt="Post Pigeon" class="img-responsive" />
  558. </div>
  559. <!-- Right Info -->
  560. <div class="col-lg-5 col-md-7 download-right-info animated" data-animation="fadeInDown" data-animation-delay="800">
  561. <!-- Subscribe Form -->
  562. <div class="subscribe text-center gk-contact-form">
  563. <!-- Title -->
  564. <h2 class="section-msg1 text-uppercase color-grey"><span class="text-extrabold">Подпишитесь</span> сейчас!</h2>
  565. <!-- Description -->
  566. <p>Scientia potentia est.</p>
  567. <!-- Form -->
  568. <div class="subscribe-form">
  569. <!-- Form Error or Success Message -->
  570. <p class="gk-form-message-subscribe"></p>
  571. <form role="form" name="subscribe" class="form-horizontal" id="subscribe" method="post" action="subscribe.php">
  572. <div class="col-md-12">
  573. <!-- Email -->
  574. <div class="form-group gk-email">
  575. <input type="email" placeholder="Ваш EMAIL" class="subscribe input-email form-control email text-center" name="subscribe_email">
  576. </div>
  577. <!-- Submit Button -->
  578. <div class="gk-input-submit submit">
  579. <button type="submit" class="btn gk-submit">ПОДПИСАТЬСЯ</button>
  580. </div>
  581. </div>
  582. </form>
  583. </div><!-- Form Ends -->
  584. </div>
  585. </div><!-- Right Info Ends -->
  586. </div><!-- Download Content Row Ends -->
  587. </div>
  588. </div>
  589. <!-- Download Section Ends -->
  590. <!-- Contact Section Begins -->
  591. <div id="contact-us" class="contact-section section-padding">
  592. <div class="container">
  593. <div class="row">
  594. <!-- Contact Left Info Begins -->
  595. <div class="col-xs-12 animated" data-animation="fadeInLeft" data-animation-delay="500">
  596. <!-- Title -->
  597. <h2 class="section-title color-white"><span class="text-extrabold">Свяжитесь</span> с нами</h2>
  598. <!-- Shape Down Arrow -->
  599. <p class="text-center color-white"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  600. <!-- Description -->
  601. <h3 class="section-msg text-center color-white">Форма обратной связи.</h3>
  602. </div>
  603. <div class="col-md-6 animated" data-animation="fadeInLeft" data-animation-delay="500">
  604. <!-- Contact Form Container Begins -->
  605. <p class="gk-form-message"></p>
  606. <div class="gk-contact-form container animated" data-animation="fadeInUp" data-animation-delay="900">
  607. <!-- Form Begins -->
  608. <form role="form" name="contactform" class="form-horizontal" id="contactform" method="post" action="process.php">
  609. <div class="row">
  610. <div class="col-sm-12 col-md-12">
  611. <div class="container">
  612. <div class="row">
  613. <!-- Input: Name -->
  614. <div class="col-md-6 form-group gk-input-text">
  615. <input type="text" name="contact_name" class="input-name form-control" placeholder="Имя">
  616. </div>
  617. <!-- Input: Email -->
  618. <div class="col-md-6 form-group gk-email pull-right">
  619. <input type="email" name="contact_email" class="input-email form-control email" placeholder="Email">
  620. </div>
  621. </div>
  622. </div>
  623. <div class="form-group">
  624. <!-- Input: Textarea -->
  625. <div class="col-md-12 gk-textarea-message">
  626. <textarea name="contact_message" class="textarea-message form-control" rows="4" cols="25" placeholder="Сообщение"></textarea>
  627. </div>
  628. </div>
  629. <!-- Submit Button -->
  630. <div class="gk-input-submit submit">
  631. <button type="submit" class="btn gk-submit">Отправить</button>
  632. </div>
  633. </div>
  634. </div>
  635. </form><!-- Form Ends -->
  636. </div><!-- Contact Form Container Ends -->
  637. </div><!-- Contact Left Info Ends -->
  638. <!-- Contact Right Info Begins -->
  639. <div class="col-md-4 pull-right animated" data-animation="fadeInRight" data-animation-delay="500">
  640. <!-- Contact Info Begins -->
  641. <div class="container contact-info">
  642. <div class="row">
  643. <!-- Row 1 -->
  644. <div class="col-xs-12 contact-row">
  645. <!-- Icon -->
  646. <p><span class="simple-icon icon-call-end color-white"></span></p>
  647. <!-- Title -->
  648. <p class="bold-italic color-white">Телефон</p>
  649. <!-- Content -->
  650. <p class="light-italic color-white">1.234.567890</p>
  651. </div>
  652. <!-- Row 2 -->
  653. <div class="col-xs-12 contact-row">
  654. <!-- Icon -->
  655. <p><span class="simple-icon icon-envelope color-white"></span></p>
  656. <!-- Title -->
  657. <p class="bold-italic color-white">Эл. почта</p>
  658. <!-- Content -->
  659. <p class="light-italic color-white">info@peaceos.org</p>
  660. </div>
  661. <!-- Row 3 -->
  662. <div class="col-xs-12 contact-row">
  663. <!-- Icon -->
  664. <p><span class="simple-icon icon-pointer color-white"></span></p>
  665. <!-- Title -->
  666. <p class="bold-italic color-white">Юрид. адрес</p>
  667. <!-- Content -->
  668. <p class="light-italic color-white">Палестина, Восточный Иерусалим, ха-Ноцрим, 3</p>
  669. <p class="light-italic color-white">Код страны: PSE, 275</p>
  670. </div>
  671. </div>
  672. </div><!-- Contact Info Begins -->
  673. </div><!-- Contact Right Info Ends -->
  674. </div>
  675. </div>
  676. </div>
  677. <!-- Contact Section Ends -->
  678. <!-- Layout Ends -->
  679. <!-- Footer Begins -->
  680. <div id="footer" class="footer-section">
  681. <div class="footer-bg">
  682. <div class="container">
  683. <div class="row">
  684. <!-- Footer Content -->
  685. <div class="center-block">
  686. <p class="text-center">&copy; 2024 PeaceOS Team
  687. <span class="footer-social-icon">
  688. <a href="https://github.com" target="_blank" class="gk-github"><i class="fa fa-github"></i></a>
  689. </span>
  690. </p>
  691. </div>
  692. </div>
  693. </div>
  694. </div>
  695. </div><!-- Footer Ends -->
  696. </div><!-- Wrapper Ends -->
  697. <!-- Script Begins -->
  698. <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
  699. <script type="text/javascript" src="js/bootstrap.min.js"></script>
  700. <!-- Form Validation -->
  701. <script type="text/javascript" src="js/bootstrapValidator.min.js"></script>
  702. <!-- Sticky Header -->
  703. <script type="text/javascript" src="js/jquery.sticky.js"></script>
  704. <!-- Carousel Slider -->
  705. <script type="text/javascript" src="js/carousel.min.js"></script>
  706. <!-- Animation and Counter -->
  707. <script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
  708. <script type="text/javascript" src="js/jquery.appear.js"></script>
  709. <script type="text/javascript" src="js/jquery.countTo.js"></script>
  710. <!-- Simple Line Icons Font -->
  711. <!--[if lte IE 7]><script src="js/icons-lte-ie7.js"></script><![endif]-->
  712. <!-- Custom -->
  713. <script type="text/javascript" src="js/custom.js"></script>
  714. <!-- Script Ends -->
  715. </body>
  716. </html>