index.html 46 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <!-- Title and Meta Tags Begins -->
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  6. <meta charset="utf-8">
  7. <!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
  8. <meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />
  9. <title>KAMBUUUUUR</title>
  10. <!-- Title and Meta Tags Ends -->
  11. <!-- Google Font Begins -->
  12. <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,800,300,800italic,700,300italic,700italic,400italic' rel='stylesheet' type='text/css'>
  13. <!-- Google Font Ends -->
  14. <!-- CSS Begins-->
  15. <link href='http://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>
  16. <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
  17. <link href="css/carousel.css" rel="stylesheet" type="text/css" />
  18. <link href="css/animate.min.css" rel="stylesheet" type="text/css"/>
  19. <link href="css/YTPlayer.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=""><img class="img-responsive" src="images/logo123.png" alt="GeekApp" /></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">Toggle navigation</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="#reviews" class="scroll">Проекты</a></li>
  61. <li><a href="#services" class="scroll">Гарантии</a></li>
  62. <li><a href="#pricing" class="scroll">Услуги</a></li>
  63. <!-- <li><a href="#video" class="scroll">Demo</a></li> -->
  64. <li><a href="#contact-us" class="scroll">Связь</a></li>
  65. </ul>
  66. </nav><!-- Menu Ends -->
  67. </div><!-- Navigation Menu Ends -->
  68. <!-- Social Links Begins -->
  69. <!-- <div class="col-md-2">
  70. <ul class="top-social-icon">
  71. <li><a href="#" class="gk-facebook"><i class="fa fa-facebook"></i></a></li>
  72. <li><a href="#" class="gk-twitter"><i class="fa fa-twitter"></i></a></li>
  73. </ul>
  74. </div> -->
  75. <!-- Social Links Ends -->
  76. </div>
  77. </div>
  78. </div>
  79. </div><!-- Sticky Header Ends -->
  80. <!-- Banner Section Begins -->
  81. <div class="banner-bg">
  82. <div id="about" class="banner-section container">
  83. <div class="row">
  84. <!-- Left Banner Text Begins -->
  85. <div class="col-md-5 left-banner-text animated" data-animation="fadeInLeft" data-animation-delay="500">
  86. <!-- Banner Title -->
  87. <h1 class="text-uppercase"><span class="text-extrabold">Бесконечный потенциал кода. </span>Ломайте стереотипы, стройте будущее. </h1>
  88. <!-- Banner Content -->
  89. <div class="row">
  90. <div class="col-md-10">
  91. <p class="banner-text">С нами ваши IT-проекты будут реализованы без границ.<span class="extrabold-italic"> Готовы к новым высотам?</span></p>
  92. </div>
  93. </div>
  94. <!-- Banner Button -->
  95. <div class="banner-button">
  96. <a href="#" class="btn gk-btn white-btn gk-btn-margin" role="button">Подробнее</a>
  97. <a href="#" class="btn gk-btn red-btn" role="button"><i class="fa fa-cloud-download"></i> Начать</a>
  98. </div>
  99. <!-- Banner Nav Shape -->
  100. <!-- <div class="row triangle-shape banner-nav">
  101. <div class="col-sm-12">
  102. <a href="#features" class="banner-triangle scroll color-white"><i class="flaticon flaticon-arrow351 gk-triangle-bigsharp"></i><h5><b>К возможностям</b></h5> </a>
  103. </div>
  104. </div> -->
  105. </div><!-- Left Banner Text Ends -->
  106. <!-- Right Banner Image Begins -->
  107. <div class="col-md-7 right-banner-image animated" data-animation="fadeInRight" data-animation-delay="500">
  108. <div class="row">
  109. <!-- Banner Counter Info Begins -->
  110. <div class="col-sm-5 banner-image-info">
  111. <!-- Row 1 -->
  112. <div class="row">
  113. <div class="col-xs-12 banner-left-margin">
  114. <div class="banner-info col-xs-6 text-right text-uppercase">
  115. <div class="count-number" data-count="10"><span class="counter text-bold"></span></div> Выполненых проектов
  116. </div>
  117. <div class="banner-info-right col-xs-6 no-padding">
  118. <span class="close-brackets">}</span> <i class="fa fa-cloud-download color-greenalt"></i>
  119. </div>
  120. </div>
  121. </div>
  122. <!-- Row 2 -->
  123. <div class="row">
  124. <div class="col-xs-12 banner-left-margin">
  125. <div class="banner-info col-xs-6 text-right text-uppercase">
  126. <div class="count-number" data-count="10"><span class="counter text-bold"></span></div>Под Android системы
  127. </div>
  128. <div class="banner-info-right col-xs-6 no-padding">
  129. <span class="close-brackets">}</span> <i class="fa fa-android color-greenalt"></i>
  130. </div>
  131. </div>
  132. </div>
  133. <!-- Row 3 -->
  134. <div class="row">
  135. <div class="col-xs-12 banner-left-margin">
  136. <div class="banner-info col-xs-6 text-right text-uppercase">
  137. <div class="count-number" data-count="0"><span class="counter text-bold"></span></div>под IOS системы
  138. </div>
  139. <div class="banner-info-right col-xs-6 no-padding">
  140. <span class="close-brackets">}</span> <i class="fa fa-apple color-greenalt"></i>
  141. </div>
  142. </div>
  143. </div>
  144. </div><!-- Banner Counter Info Ends -->
  145. <!-- Banner Image -->
  146. <div class="col-sm-7">
  147. <img class="img-responsive pull-right" src="images/зп123.png" alt="Iphone" />
  148. </div>
  149. </div>
  150. </div> <!-- Right Banner Image Begins -->
  151. </div>
  152. </div>
  153. </div><!-- Banner Section Ends -->
  154. </div><!-- Header Ends -->
  155. <!-- Layout Begins -->
  156. <!-- Features Section Begins -->
  157. <!-- <div id="features" class="features-section section-padding">
  158. <div class="container relative">
  159. <div class="row">
  160. <!- Features Left Info Begins --
  161. <div class="col-md-4 features-left-info animated" data-animation="fadeInLeft" data-animation-delay="500">
  162. <!- Title --
  163. <h3 class="section-msg1 color-grey text-uppercase"><span class="text-extrabold">Make Your <br />Life Simpler</span> <br />With GEEKAPP</h3>
  164. <-- Content --
  165. <p>Ut labores laoreet petentium vix. Nec cu eripuit <br /> alterum, vel cibo laoree</p>
  166. <-- Shape Down Arrow --
  167. <p class="color-grey"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  168. <-- List Elements --
  169. <ul class="list-unstyled gk-list color-grey">
  170. <li class="text-bold"><span class="simple-icon icon-check"></span> Easy to Use</li>
  171. <li class="text-bold"><span class="simple-icon icon-check"></span> Social Connect</li>
  172. <li class="text-bold"><span class="simple-icon icon-check"></span> Dedicated Support</li>
  173. <li class="text-bold no-border"><span class="simple-icon icon-check"></span> Pixel Perfect Design</li>
  174. </ul>
  175. </div><!- Features Left Info Ends --
  176. <!- Features Right Info Begins --
  177. <div class="col-md-8 features-right-info animated" data-animation="fadeInRight" data-animation-delay="500">
  178. <!- Shape Pointer --
  179. <div class="gk-pointer-features gk-right-arrow animated" data-animation="fadeInLeftBig" data-animation-delay="1200">
  180. <img src="images/right-arrow-icon.png" alt="Pointer" class="img-responsive" />
  181. </div>
  182. <!- Title --
  183. <h2 class="section-title color-grey"><span class="text-extrabold">Awesome</span> Features</h2>
  184. <!- Shape Down Arrow --
  185. <p class="text-center color-grey"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  186. <-- Description --
  187. <h3 class="section-msg text-center color-grey">GeekApp offers a wide range of features with Beautiful Design & Great Functionality.</h3>
  188. <div class="container features-right-grid">
  189. <!- First Row Begins --
  190. <div class="row">
  191. <-- Column 1 Begins --
  192. <div class="col-sm-6 text-right">
  193. <div class="features-grid gk-divider">
  194. <-- Icon --
  195. <span class="simple-icon icon-pencil color-greenalt"></span>
  196. <!- Title --
  197. <h4 class="text-uppercase grid-title text-bold color-grey">Beautiful Design</h4>
  198. !-- Content --
  199. <p>Ut labores laoreet petentium vix. Nec cu eripuit alterum, vel cibo laoree</p>
  200. </div>
  201. <!- Horizontal Line --
  202. <hr class="features-line" />
  203. </div><!- Column 1 Ends --
  204. <!- Column 2 Begins --
  205. <div class="col-sm-6">
  206. <div class="features-grid">
  207. <-- Icon --
  208. <span class="simple-icon icon-magnifier color-greenalt"></span>
  209. <!- Title --
  210. <h4 class="text-uppercase grid-title text-bold color-grey">Browse Files</h4>
  211. <!- Content --
  212. <p>Ut labores laoreet petentium vix. Nec cu eripuit alterum, vel cibo laoree</p>
  213. </div>
  214. <!- Horizontal Line --
  215. <hr class="features-line" />
  216. </div><!- Column 2 Ends --
  217. </div><!- First Row Ends --
  218. <!- Second Row Begins --
  219. <div class="row">
  220. <!- Column 1 Begins --
  221. <div class="col-sm-6 text-right">
  222. <div class="features-grid gk-divider">
  223. <-- Icon --
  224. <span class="simple-icon icon-camera color-greenalt"></span>
  225. <-- Title --
  226. <h4 class="text-uppercase grid-title text-bold color-grey">Share Photos</h4>
  227. <-- Content --
  228. <p>Ut labores laoreet petentium vix. Nec cu eripuit alterum, vel cibo laoree</p>
  229. </div>
  230. </div><!- Column 1 Ends --
  231. <!- Column 2 Begins --
  232. <div class="col-sm-6">
  233. <div class="features-grid">
  234. <!- Icon --
  235. <span class="simple-icon icon-paper-clip color-greenalt"></span>
  236. <-- Title --
  237. h4 class="text-uppercase grid-title text-bold color-grey">File Attachment</h4>
  238. <!- Content --
  239. <p>Ut labores laoreet petentium vix. Nec cu eripuit alterum, vel cibo laoree</p>
  240. </div>
  241. </div><!- Column 2 Ends --
  242. </div><-- Second Row Ends --
  243. </div>
  244. </div><!- Features Right Info Ends --
  245. </div>
  246. <-- Features Image Row Begins --
  247. <div class="row">
  248. <div class="col-sm-12 ipad-shot-wrapper animated" data-animation="fadeIn" data-animation-delay="600">
  249. <img src="images/ipad-shot.png" class="img-responsive" alt="IPad Shot" />
  250. </div>
  251. </div><-- Features Image Row Ends --
  252. </div>
  253. </div> -->
  254. <!-- Features Section Ends -->
  255. <!-- Reviews Section Begins -->
  256. <div id="reviews" class="reviews-section section-padding">
  257. <div class="container">
  258. <!-- Reviews Top Row -->
  259. <div class="row">
  260. <div class="col-md-7 col-lg-6 app-reviews animated" data-animation="fadeInLeft" data-animation-delay="500">
  261. <!-- Title -->
  262. <h2 class="section-title color-greenalt"><span class="text-extrabold">Подробнее </span>о проекте</h2>
  263. <!-- Shape Down Arrow -->
  264. <p class="color-white text-center"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  265. <!-- Description -->
  266. <h3 class="section-msg text-center color-greenalt">Обзор инструментов используемых разработчиком</h3>
  267. </div>
  268. <!-- Reviews Slider Row Begins-->
  269. <div class="row">
  270. <div class="col-xs-12 animated" data-animation="fadeInUp" data-animation-delay="800">
  271. <!-- Shape Pointer -->
  272. <!-- <div class="gk-pointer-features gk-left-arrow "><img src="images/left-arrow-icon.png" alt="Pointer" class="img-responsive" /></div> -->
  273. <!-- Reviews Container Begins -->
  274. <div id="reviews-slider" class="carousel slide reviews-slider-section" data-ride="carousel">
  275. <!-- Slides Inner Begins -->
  276. <div class="carousel-inner">
  277. <!-- Item 1 -->
  278. <div class="item active container">
  279. <div class="row item-grid">
  280. <div class="col-lg-6 col-md-6 reviews-info color-greenalt">
  281. <!-- Content -->
  282. <div class="reviews-msg">
  283. <p class="light-italic info-margin"><b>C#.</b>Он может использоваться для создания широкого спектра приложений, включая веб-приложения, игры, мобильные приложения, десктопные приложения и многое другое. Благодаря платформе .NET, C# поддерживает кросс-платформенность, позволяя разработчикам создавать приложения, которые могут работать на различных операционных системах, таких как <span class="extrabold-italic">Windows, macOS и Linux.</span></p>
  284. </div>
  285. <!-- Author Info -->
  286. <div class="reviews-author">
  287. <p class="text-bold text-uppercase author-margin"><b>©️ kambur | dv </b></p>
  288. <p class="text-bold text-uppercase author-sub"></p>
  289. </div>
  290. </div>
  291. <!-- Image -->
  292. <div class="col-lg-6 col-md-5 reviews-image">
  293. <div class="main-reviews-image container">
  294. <div class="row">
  295. <img class="img-responsive img-circle" src="images/pngwing.com.png" width="330" height="330" alt="Jennifer" />
  296. </div>
  297. </div>
  298. </div>
  299. </div>
  300. </div>
  301. <!-- Item 2 -->
  302. <div class="item container">
  303. <div class="row item-grid">
  304. <div class="col-lg-6 col-md-6 reviews-info color-greenalt">
  305. <!-- Content -->
  306. <div class="reviews-msg">
  307. <p class="light-italic info-margin"><b>HTML (HyperText Markup Language).</b> Это язык разметки, используемый для создания веб-страниц. С его помощью можно определить структуру веб-страницы, добавить текст, изображения, ссылки и другие элементы. HTML-код пишется в виде текстовых файлов и открывается в браузере, который отображает содержимое страницы в соответствии с разметкой.<span class="extrabold-italic"></span></p>
  308. </div>
  309. <!-- Author Info -->
  310. <div class="reviews-author">
  311. <p class="text-bold text-uppercase author-margin"><b>©️ kambur | dv </b></p>
  312. <p class="text-bold text-uppercase author-sub"></p>
  313. </div>
  314. </div>
  315. <!-- Image -->
  316. <div class="col-lg-6 col-md-5 reviews-image">
  317. <div class="main-reviews-image container">
  318. <div class="row">
  319. <img class="img-responsive img-circle" src="images/pngwin123g.com.png" width="330" height="330" alt="Jennifer" />
  320. </div>
  321. </div>
  322. </div>
  323. </div>
  324. </div>
  325. <!-- Item 3 -->
  326. <div class="item container">
  327. <div class="row item-grid">
  328. <div class="col-lg-6 col-md-6 reviews-info color-greenalt">
  329. <!-- Content -->
  330. <div class="reviews-msg">
  331. <p class="light-italic info-margin"><b>1С.</b> Это программа, которая помогает автоматизировать бизнес: бухгалтерию, управление запасами и складом, расчеты с сотрудниками и контрагентами, торговлю, кадровый учет.<span class="extrabold-italic"></span></p>
  332. </div>
  333. <!-- Author Info -->
  334. <div class="reviews-author">
  335. <p class="text-bold text-uppercase author-margin"><b>©️ kambur | dv </b></p>
  336. <p class="text-bold text-uppercase author-sub"></p>
  337. </div>
  338. </div>
  339. <!-- Image -->
  340. <div class="col-lg-6 col-md-5 reviews-image">
  341. <div class="main-reviews-image container">
  342. <div class="row">
  343. <img class="img-responsive img-circle" src="images/1c-logo.png" width="330" height="330" alt="Jennifer" />
  344. </div>
  345. </div>
  346. </div>
  347. </div>
  348. </div>
  349. </div><!-- Slider Inner Ends -->
  350. </div>
  351. <!-- Reviews Container Ends -->
  352. <!-- Indicators Begins -->
  353. <div class="reviews-indicators">
  354. <a class="gk-slide-left" href="#reviews-slider" data-slide="prev">
  355. <i class="fa fa-chevron-left color-greenalt"></i>
  356. </a>
  357. <a class="gk-slide-right" href="#reviews-slider" data-slide="next">
  358. <i class="fa fa-chevron-right color-greenalt"></i>
  359. </a>
  360. </div><!-- Indicators Ends -->
  361. </div>
  362. </div><!-- Reviews Slider Row Ends -->
  363. </div>
  364. </div>
  365. </div>
  366. <!-- Reviews Section Ends -->
  367. <!-- Services Section Begins -->
  368. <div id="services" class="app-services-section section-padding">
  369. <div class="container relative">
  370. <!-- Services Top Row Begins -->
  371. <div class="row">
  372. <!-- Services Right Info Begins -->
  373. <div class="col-xs-12 animated" data-animation="fadeInRight" data-animation-delay="500">
  374. <!-- Title -->
  375. <h2 class="section-title color-white"><span class="text-extrabold">Наши </span>Гарантии </h2>
  376. <!-- Shape Down Arrow -->
  377. <p class="text-center color-white"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  378. <!-- Description -->
  379. <h3 class="section-msg text-center color-white"><b>kambur | dv</b> предоставляет лучшие сервисы, которые <b>помогут Вам сделать вашу жизнь проще</b></h3>
  380. </div><!-- Services Right Info Ends -->
  381. </div><!-- Services Top Row Ends -->
  382. </div>
  383. <!-- Services Slider Begins -->
  384. <div class="container awesome-container">
  385. <!-- Services Bottom Row Begins -->
  386. <div class="row">
  387. <div class="col-xs-12 animated" data-animation="fadeInUp" data-animation-delay="800">
  388. <div id="awesome-services" class="owl-carousel app-carousel-slider">
  389. <!-- Item 1 -->
  390. <div class="awesome-services text-center">
  391. <!-- Icon -->
  392. <span class="simple-icon icon-cloud-upload color-greenalt"></span>
  393. <!-- Title -->
  394. <h3 class="color-grey text-uppercase text-bold">Безопасность</h3>
  395. <!-- Content -->
  396. <p class="big-text">Гарантия безопасности от нас включает в себя комплекс мер, направленных на обеспечение защиты ваших данных и информации. Мы предлагаем современные решения в области информационной безопасности, которые позволяют предотвратить возможные угрозы и снизить риски нарушения конфиденциальности.</p>
  397. </div>
  398. <!-- Item 2 -->
  399. <div class="awesome-services text-center">
  400. <!-- Icon -->
  401. <span class="simple-icon icon-shield color-greenalt"></span>
  402. <!-- Title -->
  403. <h3 class="color-grey text-uppercase text-bold">Оригинальнсть</h3>
  404. <!-- Content -->
  405. <p class="big-text">Гарантия оригинальности от нас - это возможность создать уникальный и неповторимый продукт или бренд. Мы предлагаем широкий спектр услуг, начиная от разработки концепции и заканчивая созданием дизайна и написанием контента. Наши специалисты обладают большим опытом работы в данной сфере и готовы помочь Вам в реализации самых смелых идей.</p>
  406. </div>
  407. <!-- Item 3 -->
  408. <div class="awesome-services text-center">
  409. <!-- Icon -->
  410. <span class="simple-icon icon-calendar color-greenalt"></span>
  411. <!-- Title -->
  412. <h3 class="color-grey text-uppercase text-bold">Точные сроки готовности</h3>
  413. <!-- Content -->
  414. <p class="big-text">Данная гарантия от нас поможет вам избежать задержек и непредвиденных ситуаций в процессе работы. Мы гарантируем, что ваш проект будет выполнен в установленные сроки и с высоким качеством. Наша команда профессионалов имеет большой опыт в области планирования и управления проектами, что позволяет нам предоставлять нашим клиентам наиболее оптимальные решения.</p>
  415. </div>
  416. <!-- Item 4
  417. <div class="awesome-services text-center">
  418. !-- Icon --
  419. <span class="simple-icon icon-cloud-upload color-greenalt"></span>
  420. !-- Title --
  421. <h3 class="color-grey text-uppercase text-bold">DATA STORAGE</h3>
  422. !-- Content --
  423. <p class="big-text">Ut labores laoreet petentium vix. Nec cu eripuit alterum, vel cibo laoreeem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus amet m.</p>
  424. </div>
  425. <-- Item 5 --
  426. <div class="awesome-services text-center">
  427. <-- Icon --
  428. <span class="simple-icon icon-shield color-greenalt"></span>
  429. !-- Title --
  430. <h3 class="color-grey text-uppercase text-bold">SECURITY</h3>
  431. <-- Content ->
  432. <p class="big-text">Ut labores laoreet petentium vix. Nec cu eripuit alterum, vel cibo laoreeem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus amet m.</p>
  433. </div>
  434. <!- Item 6 --
  435. <div class="awesome-services text-center">
  436. <!- Icon ->
  437. <span class="simple-icon icon-calendar color-greenalt"></span>
  438. <!- Title ->
  439. <h3 class="color-grey text-uppercase text-bold">EVENTS &amp; COUNTERS</h3>
  440. <!- Content ->
  441. <p class="big-text">Ut labores laoreet petentium vix. Nec cu eripuit alterum, vel cibo laoreeem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus amet m.</p>
  442. </div> -->
  443. </div>
  444. </div>
  445. </div><!-- Services Bottom Row Ends -->
  446. </div>
  447. </div>
  448. <!-- Services Section Ends -->
  449. <!-- Screenshot Section Begins -->
  450. <div id="app-screen" class="app-screen-section section-padding">
  451. <div class="container relative">
  452. <!-- Screenshot Top Row Begins -->
  453. <div class="row">
  454. <!-- Screenshot Right Info Begins -->
  455. <div class="col-xs-12 app-right-info pull-right animated" data-animation="fadeInRight" data-animation-delay="500">
  456. <!-- Title -->
  457. <h2 class="section-title color-grey"><span class="text-extrabold">Наши</span>недавние проекты </h2>
  458. <!-- Shape Down Arrow -->
  459. <p class="text-center color-grey"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  460. <!-- Description -->
  461. <h3 class="section-msg text-center color-grey">Последние выполненные задачи</h3>
  462. </div><!-- Screenshot Right Info Ends -->
  463. </div><!-- Screenshot Top Row Ends -->
  464. </div>
  465. <!-- Screenshot Carousel Begins -->
  466. <div class="container app-container">
  467. <div class="row">
  468. <div class="col-xs-12 animated" data-animation="fadeInUp" data-animation-delay="800">
  469. <!-- Carousel Slider Container Begins -->
  470. <div id="app-screenshot" class="owl-carousel app-carousel-slider">
  471. <!-- Item 1 -->
  472. <div class="screen-item">
  473. <img src="images/Снимок экрана 2024-03-15 204111.png" width="600" height="534" alt="App Screenshot" class="img-responsive" />
  474. <h3 class="text-center color1-bg">Разработка конфигурации</h1>
  475. </div>
  476. <!-- Item 2 -->
  477. <div class="screen-item">
  478. <img src="images/2024-03-15_21-21-16.png" width="600" height="534" alt="App Screenshot" class="img-responsive" />
  479. <h3 class="text-center color1-bg">Разработка сайта</h1>
  480. </div>
  481. <!-- Item 3 -->
  482. <div class="screen-item">
  483. <img src="images/Снимок экрана 2024-03-15 212438.png" width="600" height="534" alt="App Screenshot" class="img-responsive" />
  484. <h3 class="text-center color1-bg">Оптимизация окна</h1>
  485. </div>
  486. <!-- Item 4
  487. <div class="screen-item">
  488. <img src="images/screenshot/screen-1.jpg" width="314" height="534" alt="App Screenshot" class="img-responsive" />
  489. </div>
  490. !-- Item 5 --
  491. <div class="screen-item">
  492. <img src="images/screenshot/screen-2.jpg" width="314" height="534" alt="App Screenshot" class="img-responsive" />
  493. </div>
  494. !-- Item 6 --
  495. <div class="screen-item">
  496. <img src="images/screenshot/screen-3.jpg" width="314" height="534" alt="App Screenshot" class="img-responsive" />
  497. </div> -->
  498. </div><!-- Carousel Slider Container Ends -->
  499. </div>
  500. </div>
  501. </div><!-- Screenshot Carousel Ends -->
  502. </div>
  503. <!-- Screenshot Section Ends -->
  504. <!-- Pricing Section Begins -->
  505. <div id="pricing" class="pricing-section section-padding">
  506. <div class="container relative">
  507. <!-- Pricing Top Row Begins -->
  508. <div class="row">
  509. <!-- Pricing Right Info Begins -->
  510. <div class="col-xs-12 app-right-info animated" data-animation="fadeInRight" data-animation-delay="500">
  511. <!-- Title -->
  512. <h2 class="section-title color-grey"><span class="text-extrabold">Возможные</span> услуги</h2>
  513. <!-- Shape Down Arrow -->
  514. <p class="text-center color-grey"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  515. <!-- Description -->
  516. <h3 class="section-msg text-center color-grey">Цены будут варьироваться в зависимости от ваших требований</h3>
  517. </div><!-- Pricing Right Info Ends -->
  518. </div>
  519. </div>
  520. <div class="container pricing-container">
  521. <!-- Pricing Grid Row Begins -->
  522. <div class="row pricing-grid">
  523. <div class="col-xs-12">
  524. <!-- Price Table 01 -->
  525. <div class="col-md-4 col-sm-4 pricing-item1 animated" data-animation="fadeInLeft" data-animation-delay="500">
  526. <div class="pricing-box">
  527. <!-- Price Title -->
  528. <div class="pricing-title">
  529. <h3 class="text-center text-uppercase text-bold color-greenalt">Разработка и поддержка сайта на основе HTML</h3>
  530. <div class="price text-center">
  531. <h6 class="color-white text-bold"><span class="symbol color-grey"></span>18999 ₽<span class="per-month color-grey"></span></h6>
  532. </div>
  533. </div>
  534. <!-- Price Table Features -->
  535. <ul class="list-unstyled gk-list text-bold color-grey">
  536. <li class="no-border"><span class="simple-icon icon-check"></span> Оригинальность</li>
  537. <li class="no-border"><span class="simple-icon icon-check"></span> Поддержка</li>
  538. <li class="no-border"><span class="simple-icon icon-check"></span> Оптимизация</li>
  539. <li class="no-border"><span class="simple-icon icon-check"></span> Работа с базами данных</li>
  540. <li class="no-border"><span class="simple-icon icon-check"></span> Бесплатная консультация</li>
  541. </ul>
  542. </div>
  543. </div>
  544. <!-- Price Table 02 -->
  545. <div class="col-md-4 col-sm-4 pricing-item2 animated" data-animation="fadeIn" data-animation-delay="700">
  546. <div class="pricing-box">
  547. <!-- Price Title -->
  548. <div class="pricing-title">
  549. <h3 class="text-center text-uppercase text-bold color-greenalt">Разработка программных решений на основе 1С</h3>
  550. <div class="price text-center">
  551. <h6 class="color-white text-bold"><span class="symbol color-grey"></span>24599 ₽<span class="per-month color-grey"></span></h6>
  552. </div>
  553. </div>
  554. <!-- Price Table Features -->
  555. <ul class="list-unstyled gk-list text-bold color-grey">
  556. <li class="no-border"><span class="simple-icon icon-check"></span> Оригинальность</li>
  557. <li class="no-border"><span class="simple-icon icon-check"></span> Поддержка</li>
  558. <li class="no-border"><span class="simple-icon icon-check"></span> Оптимизация</li>
  559. <li class="no-border"><span class="simple-icon icon-check"></span> Работа с базами данных</li>
  560. <li class="no-border"><span class="simple-icon icon-check"></span> Бесплатная консультация</li>
  561. </ul>
  562. </div>
  563. </div>
  564. <!-- Price Table 03 -->
  565. <div class="col-md-4 col-sm-4 pricing-item3 animated" data-animation="fadeInRight" data-animation-delay="500">
  566. <div class="pricing-box">
  567. <!-- Price Title -->
  568. <div class="pricing-title">
  569. <h3 class="text-center text-uppercase text-bold color-greenalt">Разработка программы для решения задач на основе C#</h3>
  570. <div class="price text-center">
  571. <h6 class="color-white text-bold"><span class="symbol color-grey"></span>18999 ₽<span class="per-month color-grey"> </span></h6>
  572. </div>
  573. </div>
  574. <!-- Price Table Features -->
  575. <ul class="list-unstyled gk-list text-bold color-grey">
  576. <li class="no-border"><span class="simple-icon icon-check"></span> Быстрое решение</li>
  577. <li class="no-border"><span class="simple-icon icon-check"></span> Поддержка различных фреймворков</li>
  578. <li class="no-border"><span class="simple-icon icon-check"></span> Удобный код</li>
  579. <li class="no-border"><span class="simple-icon icon-check"></span> Оптимизация</li>
  580. <li class="no-border"><span class="simple-icon icon-check"></span> Бесплатная консультация</li>
  581. </ul>
  582. </div>
  583. </div>
  584. </div>
  585. </div><!-- Pricing Grid Row Ends -->
  586. </div>
  587. </div>
  588. <!-- Pricing Section Ends -->
  589. <!-- Demo Section Begins -->
  590. <!-- <div id="video" class="video-section section-padding">
  591. <div class="container">
  592. !-- Demo Top Row Begins --
  593. <div class="row relative">
  594. <div class="col-xs-12 animated" data-animation="fadeInLeft" data-animation-delay="500">
  595. !-- Title --
  596. <h2 class="section-title color-white"><span class="text-extrabold">Watch</span> Demo</h2>
  597. !-- Shape Down Arrow --
  598. <p class="color-white text-center"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  599. !-- Description --
  600. <h3 class="section-msg text-center color-white">Checkout how it works</h3>
  601. </div>
  602. </div>!-- Demo Top Row Ends --
  603. !-- Video Row Begins --
  604. <div class="row">
  605. <div class="col-xs-12 animated" data-animation="fadeInUp" data-animation-delay="800">
  606. !-- Video Container --
  607. <div class="video-bg">
  608. <div id="video_container"></div>
  609. !-- Video Player --
  610. <div id="P2" class="player video-container" data-property="{videoURL:'vdRqcPyB1gw',containment:'#video_container',autoPlay:true, showControls:true, mute:true, startAt:0}"></div>
  611. </div>
  612. </div>
  613. </div>!-- Video Row Ends -
  614. </div>
  615. </div> -->
  616. <!-- Demo Section Ends -->
  617. <!-- Download Section Begins -->
  618. <div id="download" class="download-section section-padding">
  619. <div class="container">
  620. <!-- Download Top Right Row Begins -->
  621. <div class="row">
  622. <div class="col-xs-12 animated" data-animation="fadeInRight" data-animation-delay="500">
  623. <!-- Title -->
  624. <h2 class="section-title color-grey"><span class="text-extrabold">Попробуйте</span> сейчас</h2>
  625. <!-- Shape Down Arrow -->
  626. <p class="text-center color-grey"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  627. <!-- Content -->
  628. <h3 class="section-msg text-center color-grey">Выберите платформу <br /> для разработки проекта</h3>
  629. </div>
  630. </div><!-- Download Top Right Row Ends -->
  631. <!-- Download Content Row Begins -->
  632. <div class="row">
  633. <!-- Iphone Image -->
  634. <div class="col-lg-6 col-md-4 download-left-img animated" data-animation="fadeInLeft" data-animation-delay="500">
  635. <img src="images/12331.png" alt="IPhone Black" class="img-responsive" />
  636. </div>
  637. <!-- Right Info -->
  638. <div class="col-lg-5 col-md-7 download-right-info animated" data-animation="fadeInDown" data-animation-delay="800">
  639. <!-- Button -->
  640. <div class="download-button">
  641. <a href="#" class="btn gk-download-btn greenalt-btn gk-btn-margin" role="button"><i class="fa fa-apple"></i> Платформа Apple </a>
  642. <a href="#" class="btn gk-download-btn red-btn" role="button"><i class="fa fa-android"></i>Платформа Android </a>
  643. </div>
  644. <!-- Subscribe Form -->
  645. <div class="subscribe text-center gk-contact-form">
  646. <!-- Title -->
  647. <h2 class="section-msg1 text-uppercase color-grey"><span class="text-extrabold">Ждем</span> Вас!</h2>
  648. <!-- Description -->
  649. <p></p>
  650. <!-- Form -->
  651. <div class="subscribe-form">
  652. <!-- Form Error or Success Message -->
  653. <p class="gk-form-message-subscribe"></p>
  654. <form role="form" name="subscribe" class="form-horizontal" id="subscribe" method="post" action="subscribe.php">
  655. <div class="col-md-12">
  656. <!-- Email -->
  657. <div class="form-group gk-email">
  658. <input type="email" placeholder="Введите E-mail" class="subscribe input-email form-control email text-center" name="subscribe_email">
  659. </div>
  660. <!-- Submit Button -->
  661. <div class="gk-input-submit submit">
  662. <button type="submit" class="btn gk-submit">Отправить</button>
  663. </div>
  664. </div>
  665. </form>
  666. </div><!-- Form Ends -->
  667. </div>
  668. </div><!-- Right Info Ends -->
  669. </div><!-- Download Content Row Ends -->
  670. </div>
  671. </div>
  672. <!-- Download Section Ends -->
  673. <!-- Contact Section Begins -->
  674. <div id="contact-us" class="contact-section section-padding">
  675. <div class="container">
  676. <div class="row">
  677. <!-- Contact Left Info Begins -->
  678. <div class="col-xs-12 animated" data-animation="fadeInLeft" data-animation-delay="500">
  679. <!-- Title -->
  680. <h2 class="section-title color-white"><span class="text-extrabold">Связаться</span> со мной</h2>
  681. <!-- Shape Down Arrow -->
  682. <p class="text-center color-white"><i class="flaticon flaticon-yield gk-triangle-medium"></i></p>
  683. <!-- Description -->
  684. <h3 class="section-msg text-center color-white">Напишите мне, и я скоро<br />свяжусь с вами.</h3>
  685. </div>
  686. <div class="col-md-6 animated" data-animation="fadeInLeft" data-animation-delay="500">
  687. <!-- Contact Form Container Begins -->
  688. <p class="gk-form-message"></p>
  689. <div class="gk-contact-form container animated" data-animation="fadeInUp" data-animation-delay="900">
  690. <!-- Form Begins -->
  691. <form role="form" name="contactform" class="form-horizontal" id="contactform" method="post" action="process.php">
  692. <div class="row">
  693. <div class="col-sm-12 col-md-12">
  694. <div class="container">
  695. <div class="row">
  696. <!-- Input: Name -->
  697. <div class="col-md-6 form-group gk-input-text">
  698. <input type="text" name="contact_name" class="input-name form-control" placeholder="ФИО">
  699. </div>
  700. <!-- Input: Email -->
  701. <div class="col-md-6 form-group gk-email pull-right">
  702. <input type="email" name="contact_email" class="input-email form-control email" placeholder="ваш E-mail">
  703. </div>
  704. </div>
  705. </div>
  706. <div class="form-group">
  707. <!-- Input: Textarea -->
  708. <div class="col-md-12 gk-textarea-message">
  709. <textarea name="contact_message" class="textarea-message form-control" rows="4" cols="25" placeholder="Сообщение"></textarea>
  710. </div>
  711. </div>
  712. <!-- Submit Button -->
  713. <div class="gk-input-submit submit">
  714. <button type="submit" class="btn gk-submit">Отправить сообщение</button>
  715. </div>
  716. </div>
  717. </div>
  718. </form><!-- Form Ends -->
  719. </div><!-- Contact Form Container Ends -->
  720. </div><!-- Contact Left Info Ends -->
  721. <!-- Contact Right Info Begins -->
  722. <div class="col-md-4 pull-right animated" data-animation="fadeInRight" data-animation-delay="500">
  723. <!-- Contact Info Begins -->
  724. <div class="container contact-info">
  725. <div class="row">
  726. <!-- Row 1 -->
  727. <div class="col-xs-12 contact-row">
  728. <!-- Icon -->
  729. <p><span class="simple-icon icon-call-end color-white"></span></p>
  730. <!-- Title -->
  731. <p class="bold-italic color-white">Телефон</p>
  732. <!-- Content -->
  733. <p class="light-italic color-white">+7 977 587 22 83</p>
  734. </div>
  735. <!-- Row 2 -->
  736. <div class="col-xs-12 contact-row">
  737. <!-- Icon -->
  738. <p><span class="simple-icon icon-envelope color-white"></span></p>
  739. <!-- Title -->
  740. <p class="bold-italic color-white">mail</p>
  741. <!-- Content -->
  742. <p class="light-italic color-white">kamburdmitry@mail.ru</p>
  743. </div>
  744. <!-- Row 3 -->
  745. <div class="col-xs-12 contact-row">
  746. <!-- Icon -->
  747. <p><span class="simple-icon icon-pointer color-white"></span></p>
  748. <!-- Title -->
  749. <p class="bold-italic color-white">Местоположение</p>
  750. <!-- Content -->
  751. <p class="light-italic color-white">Москва, улица Пушника дом Калатушкина </p>
  752. <p class="light-italic color-white"></p>
  753. </div>
  754. </div>
  755. </div><!-- Contact Info Begins -->
  756. </div><!-- Contact Right Info Ends -->
  757. </div>
  758. </div>
  759. </div>
  760. <!-- Contact Section Ends -->
  761. <!-- Layout Ends -->
  762. <!-- Footer Begins -->
  763. <div id="footer" class="footer-section">
  764. <div class="footer-bg">
  765. <div class="container">
  766. <div class="row">
  767. <!-- Footer Content -->
  768. <div class="center-block">
  769. <p class="text-center">&copy; 2024 Kambur | dv
  770. <!-- <span class="footer-social-icon">
  771. <a href="#" class="gk-facebook"><i class="fa fa-facebook"></i></a>
  772. <a href="#" class="gk-twitter"><i class="fa fa-twitter"></i></a>
  773. </span> -->
  774. </p>
  775. </div>
  776. </div>
  777. </div>
  778. </div>
  779. </div><!-- Footer Ends -->
  780. </div><!-- Wrapper Ends -->
  781. <!-- Color Switcher -->
  782. <section id="theme-panel" class="close-theme-panel">
  783. <!--Panel Button -->
  784. <a class="panel-button dark"><i class="fa fa-cog fa-spin"></i></a>
  785. <div class="segment">
  786. <h4 class="uppercase no-padding bold-italic">Color Switcher</h4>
  787. </div>
  788. <!-- Colors -->
  789. <div class="segment">
  790. <a title="" class="switcher color1-bg" href="../color-1/"></a>
  791. <a title="" class="switcher color2-bg" href="../color-2/"></a>
  792. <a title="" class="switcher color3-bg" href="../color-3/"></a>
  793. <a title="" class="switcher color4-bg" href="../color-4/"></a>
  794. </div>
  795. </section><!-- End Color Switcher -->
  796. <!-- Script Begins -->
  797. <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
  798. <script type="text/javascript" src="js/bootstrap.min.js"></script>
  799. <!-- Form Validation -->
  800. <script type="text/javascript" src="js/bootstrapValidator.min.js"></script>
  801. <!-- Sticky Header -->
  802. <script type="text/javascript" src="js/jquery.sticky.js"></script>
  803. <!-- Carousel Slider -->
  804. <script type="text/javascript" src="js/carousel.min.js"></script>
  805. <!-- Animation and Counter -->
  806. <script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
  807. <script type="text/javascript" src="js/jquery.appear.js"></script>
  808. <script type="text/javascript" src="js/jquery.countTo.js"></script>
  809. <!-- Simple Line Icons Font -->
  810. <!--[if lte IE 7]><script src="js/icons-lte-ie7.js"></script><![endif]-->
  811. <!-- Video -->
  812. <script type="text/javascript" src="js/jquery.mb.YTPlayer.js"></script>
  813. <!-- Custom -->
  814. <script type="text/javascript" src="js/custom.js"></script>
  815. <!-- Script Ends -->
  816. </body>
  817. </html>