index.html 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174
  1. <!-- Andrey Shevchenko. FEA-23. Home work 7 -->
  2. <!DOCTYPE html>
  3. <html lang="en">
  4. <head>
  5. <meta charset="UTF-8" />
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7. <link
  8. href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap"
  9. rel="stylesheet"
  10. />
  11. <link rel="stylesheet" href="./css/">
  12. <link rel="stylesheet" href="./css/style.css" />
  13. <title>Factor</title>
  14. </head>
  15. <body>
  16. <header class="headerclass">
  17. <img class="imagelogoclass" src="./images/Fill 4.svg" alt="Logo Factor" />
  18. <nav class="navclass">
  19. <a href="#">Services</a>
  20. <a href="#">Portfolio</a>
  21. <a href="#">About</a>
  22. <a href="#">Contact</a> |
  23. <a href="#">Discus Your Idea</a>
  24. </nav>
  25. <div class="emeilmenu">
  26. <a href="mailto:hello@digitfactor.com" class="heademail">hello@digitfactor.com</a>
  27. <div class="headmenu">
  28. <a href="#" class="topmenumenu">Menu</a>
  29. <div class="poloski"></div>
  30. </div>
  31. </div>
  32. </header>
  33. <!-- ----------------------------MAIN -------------------------------->
  34. <div class="all_window">
  35. <video autoplay loop muted class="video">
  36. <source src="./video/GettyImages.mp4" type="video/mp4" />
  37. <!-- MP4 для Safari, IE9, iPhone, iPad, Android, и Windows Phone 7 -->
  38. <source src="./video/GettyImages.webm" type="video/webm" />
  39. <!-- WebM/VP8 для Firefox4, Opera, и Chrome -->
  40. <source src="#" type="video/ogg" />
  41. <!-- Ogg/Vorbis для старых версий браузеров Firefox и Opera -->
  42. </video>
  43. <div class="center_blok">
  44. <div class="welcome">
  45. <svg
  46. class="welcome__svg"
  47. width="20"
  48. height="16"
  49. viewBox="0 0 20 16"
  50. fill="none"
  51. xmlns="http://www.w3.org/2000/svg"
  52. >
  53. <path
  54. fill-rule="evenodd"
  55. clip-rule="evenodd"
  56. d="M12 0H8L0 16H4L12 0ZM20 0H16L8 16H12L20 0Z"
  57. fill="#FFCA00"
  58. />
  59. </svg>
  60. <span class="welcome__text">Welcome to Digit Factor</span>
  61. </div>
  62. <div class="center_blok__title">Creative Web Production from Ukraine</div>
  63. <div class="center_blok__discuss">
  64. <span class="center_blok__discuss__text">Discus Your Idea</span>
  65. <span class="center_blok__discuss__tochka"></span>
  66. </div>
  67. </div>
  68. </div>
  69. <!-- ------------------------------BOTTOM--------------------------- -->
  70. <div class="low_left_scroll">
  71. <svg
  72. class="low_left_scroll__arrow"
  73. width="8"
  74. height="48"
  75. viewBox="0 0 8 48"
  76. fill="none"
  77. xmlns="http://www.w3.org/2000/svg"
  78. >
  79. <path
  80. d="M7.87969 44.2206C8.0401 44.063 8.0401 43.8006 7.87969 43.6375C7.72469 43.4798 7.46671 43.4798 7.31208 43.6375L4.40466 46.5945L4.40466 0.408252C4.4043 0.180792 4.22654 0 4.00289 0C3.77924 0 3.5957 0.180792 3.5957 0.408252L3.5957 46.5945L0.693704 43.6375C0.533285 43.4798 0.274952 43.4798 0.120314 43.6375C-0.0401049 43.8006 -0.0401049 44.0634 0.120314 44.2206L3.71601 47.8776C3.87101 48.0408 4.12899 48.0408 4.28362 47.8776L7.87969 44.2206Z"
  81. fill="#7E7E7E"
  82. />
  83. </svg>
  84. Scroll down
  85. </div>
  86. <div class="chatbutton">
  87. <svg width="34" height="26" viewBox="0 0 34 26" fill="none" xmlns="http://www.w3.org/2000/svg">
  88. <path
  89. fill-rule="evenodd"
  90. clip-rule="evenodd"
  91. d="M29.3377 4.80738V11.9809C29.3377 14.636 27.1488 16.7883 24.4485 16.7883H12.015L6.38496 22.2345C6.18437 22.4285 5.91812 22.5314 5.64736 22.5314C5.51045 22.5314 5.37255 22.5052 5.24122 22.451C4.85052 22.29 4.5962 21.914 4.5962 21.4975V16.7789C2.03254 16.6299 0 14.5393 0 11.9809V4.80738C0 2.15234 2.18894 0 4.88912 0H24.4486C27.1487 0 29.3377 2.15234 29.3377 4.80738ZM31.4399 12.7387V12.3689C32.8857 12.5627 34.0001 13.7809 34 15.2555V19.6041C34 21.155 32.7679 22.4224 31.2137 22.5127V25.3732C31.2137 25.6257 31.0596 25.8536 30.8227 25.9513C30.7431 25.9839 30.6595 26 30.5764 26C30.4124 26 30.251 25.9375 30.1293 25.8199L26.7164 22.5184H19.1792C17.5424 22.5184 16.2154 21.2137 16.2154 19.6041V18.8428H25.2321C28.6551 18.8428 31.4399 16.1045 31.4399 12.7387Z"
  92. fill="#202020"
  93. />
  94. </svg>
  95. </div>
  96. <!-- --------------------- White part ----------------------- -->
  97. <div class="whitepart">
  98. <div class="topik">
  99. <svg width="20" height="16" viewBox="0 0 20 16" fill="none" xmlns="http://www.w3.org/2000/svg">
  100. <path fill-rule="evenodd" clip-rule="evenodd" d="M12 0H8L0 16H4L12 0ZM20 0H16L8 16H12L20 0Z" fill="#FFCA00" />
  101. </svg>
  102. <span class="topikname">Services</span>
  103. </div>
  104. <div class="services">
  105. <div class="servicess_item">
  106. <img class="servicess_item__img" src="./images/Engineering_Service.png" alt="Engineering_Service">
  107. <div class="servicess_item__info">
  108. <div class="servicess_item__info__name">Engineering Service</div>
  109. <div class="servicess_item__info__content">Software Development / Software Testing / Solutions Architecture / Business Analysis / Operations Support</div>
  110. <a href="#" class="lern_more">
  111. <div class="servicess_item__info__more">
  112. Learn More
  113. <svg width="28" height="8" viewBox="0 0 28 8" fill="none" xmlns="http://www.w3.org/2000/svg">
  114. <path fill-rule="evenodd" clip-rule="evenodd"
  115. d="M24.2206 7.87969C24.063 8.0401 23.8006 8.0401 23.6375 7.87969C23.4798 7.72469 23.4798 7.46671 23.6375 7.31208L26.5945 4.40466L0.408252 4.40466C0.180792 4.4043 0 4.22654 0 4.00289C0 3.77924 0.180792 3.5957 0.408252 3.5957L26.5945 3.5957L23.6375 0.693704C23.4798 0.533285 23.4798 0.274952 23.6375 0.120314C23.8006 -0.0401049 24.0634 -0.0401049 24.2206 0.120314L27.8776 3.71601C28.0408 3.87101 28.0408 4.12899 27.8776 4.28362L24.2206 7.87969Z"
  116. fill="#202020" />
  117. </svg>
  118. </div>
  119. </a>
  120. </div>
  121. </div> <!-- servicess_item -->
  122. <div class="servicess_item">
  123. <img class="servicess_item__img" src="./images/Internet_of_Things.png" alt="Engineering_Service">
  124. <div class="servicess_item__info">
  125. <div class="servicess_item__info__name">Internet of Things</div>
  126. <div class="servicess_item__info__content">Intelligent Mobility / Predictive Maintenance / Smart Manufacturing
  127. </div>
  128. <a href="#" class="lern_more">
  129. <div class="servicess_item__info__more">
  130. Learn More
  131. <svg width="28" height="8" viewBox="0 0 28 8" fill="none" xmlns="http://www.w3.org/2000/svg">
  132. <path fill-rule="evenodd" clip-rule="evenodd"
  133. d="M24.2206 7.87969C24.063 8.0401 23.8006 8.0401 23.6375 7.87969C23.4798 7.72469 23.4798 7.46671 23.6375 7.31208L26.5945 4.40466L0.408252 4.40466C0.180792 4.4043 0 4.22654 0 4.00289C0 3.77924 0.180792 3.5957 0.408252 3.5957L26.5945 3.5957L23.6375 0.693704C23.4798 0.533285 23.4798 0.274952 23.6375 0.120314C23.8006 -0.0401049 24.0634 -0.0401049 24.2206 0.120314L27.8776 3.71601C28.0408 3.87101 28.0408 4.12899 27.8776 4.28362L24.2206 7.87969Z"
  134. fill="#202020" />
  135. </svg>
  136. </div>
  137. </a>
  138. </div>
  139. </div> <!-- servicess_item -->
  140. </div> <!-- services -->
  141. </div> <!-- whitepart -->
  142. </body>
  143. </html>