main_unregistered.html 8.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8"/>
  5. <link rel="stylesheet" href="style.css" />
  6. <link rel="stylesheet" href="doctors_carousel.css" />
  7. <link rel="stylesheet" href="polaroid-pets.css" />
  8. <link rel="shortcut icon" href="img/icon.svg" type="image/svg">
  9. <title>Хвостатый дом</title>
  10. <style>
  11. @import url('https://fonts.googleapis.com/css2?family=Commissioner:wght@100..900&display=swap');
  12. @import url('https://fonts.googleapis.com/css2?family=Abhaya+Libre:wght@400;500;600;700;800&family=Commissioner:wght@100..900&display=swap');
  13. html {
  14. height: 100%;
  15. overflow-x: hidden;
  16. }
  17. body {
  18. background:
  19. url(img/pinkCirclesMain.png) right -1vw top no-repeat,
  20. url(img/yellowFigureMain.png) left top 12vw no-repeat,
  21. url(img/crossesMain.png) right top 50vw no-repeat;
  22. position: absolute;
  23. }
  24. </style>
  25. <script src="main.js"></script>
  26. </head>
  27. <body class="main-unregistered">
  28. <div class="intro">
  29. <div class="heads-intro">
  30. <div class="text-head">Хвостатый дом</div>
  31. <div class="text-subhead">Тепло в добрые руки</div>
  32. <img class="image-intro-pets" src="img/image-2.png" />
  33. </div>
  34. <div class="menu">
  35. <button class="text-menu" id="glavnaya" onclick="scrollToTop()">Главная</button>
  36. <button class="text-menu" id="uslugi" onclick="document.location='services-unreg.html'">Услуги</button>
  37. <button class="text-menu" id="vrachi" onclick="document.location='doctors-unreg.html'">Наши врачи</button>
  38. <button class="text-menu" id="pryut" onclick="document.location='shelter-unreg.html'">Приют</button>
  39. <button class="text-menu" id="voiti" onclick="document.location='authorization_form.html'">Войти</button>
  40. </div>
  41. </div>
  42. <div class="miniinfo">
  43. <div class="subminiinfo">
  44. <img class="miniinfo-img" src="img/image-3.png">
  45. <div>
  46. <p class="text-miniinfo-head">Мы - Хвостатый дом</p>
  47. <p class="text-miniinfo-subhead">
  48. Мы предоставляем ветеринарные услуги для домашних и бездомных животных, помогая им получить необходимое
  49. лечение и уход. <br /><br />Мы заботимся о здоровье и благополучии всех наших подопечных, обеспечивая им
  50. любовь, заботу и благополучие.
  51. </p>
  52. </div>
  53. </div>
  54. </div>
  55. <div class="services">
  56. <div class="text-services-head">Популярные услуги</div>
  57. <div class="subservices">
  58. <div class="services-part" onmouseover="changeImage1('img/obsledovanie-hovered.png')" onmouseout="changeImage1('img/obsledovanie.png')">
  59. <div class="for-services-img"><div class="services-img"><img id="obsledovanie" src="img/obsledovanie.png"/></div></div>
  60. <div class="text-services">Клинический осмотр</div>
  61. </div>
  62. <div class="services-part" onmouseover="changeImage2('img/vakcinaciya-hovered.png')" onmouseout="changeImage2('img/vakcinaciya.png')">
  63. <div class="for-services-img"><div class="services-img"><img id="vakcinaciya" src="img/vakcinaciya.png" /></div></div>
  64. <div class="text-services">Вакцинация кошек</div>
  65. </div>
  66. <div class="services-part" onmouseover="changeImage3('img/analizy-hovered.png')" onmouseout="changeImage3('img/analizy.png')">
  67. <div class="for-services-img"><div class="services-img"><img id="analizy" src="img/analizy.png" /></div></div>
  68. <div class="text-services">Анализ крови</div>
  69. </div>
  70. </div>
  71. <div class="subservices">
  72. <div class="services-part" onmouseover="changeImage4('img/stomatologiya-hovered.png')" onmouseout="changeImage4('img/stomatologiya.png')">
  73. <div class="for-services-img"><div class="services-img"><img id="stomatologiya" src="img/stomatologiya.png" /></div></div>
  74. <div class="text-services">Ультразвуковая чистка</div>
  75. </div>
  76. <div class="services-part" onmouseover="changeImage5('img/gruming-hovered.png')" onmouseout="changeImage5('img/gruming.png')">
  77. <div class="for-services-img"><div class="services-img"><img id="gruming" src="img/gruming.png" /></div></div>
  78. <div class="text-services">Гигиеническая стрижка</div>
  79. </div>
  80. <div class="services-part" onmouseover="changeImage6('img/operaciya-hovered.png')" onmouseout="changeImage6('img/operaciya.png')">
  81. <div class="for-services-img"><div class="services-img"><img id="operaciya" src="img/operaciya.png" /></div></div>
  82. <div class="text-services">Кесарево сечение</div>
  83. </div>
  84. </div>
  85. </div>
  86. <div class="doctors">
  87. <p class="doctors-head">Наши лучшие специалисты</p>
  88. <div class="container">
  89. <input type="radio" name="slider" id="item-1" checked>
  90. <input type="radio" name="slider" id="item-2">
  91. <input type="radio" name="slider" id="item-3">
  92. <div class="cards">
  93. <label class="card" for="item-1" id="doc-1">
  94. <img class="img_doc" src="img/novikova.png" alt="Новикова Вера">
  95. </label>
  96. <label class="card" for="item-2" id="doc-2">
  97. <img class="img_doc" src="img/korolev.png" alt="Королев Михаил">
  98. </label>
  99. <label class="card" for="item-3" id="doc-3">
  100. <img class="img_doc" src="img/kirillov.png" alt="Кириллов Федор">
  101. </label>
  102. </div>
  103. <div class="player">
  104. <div class="upper-part">
  105. <div class="info-area" id="test">
  106. <label class="song-info" id="song-info-1">
  107. <div class="title">Новикова Вера</div>
  108. <div class="sub-line">
  109. <div class="subtitle">терапевт</div>
  110. </div>
  111. </label>
  112. <label class="song-info" id="song-info-2">
  113. <div class="title">Королев Михаил</div>
  114. <div class="sub-line">
  115. <div class="subtitle">ЛОР-офтальмолог</div>
  116. </div>
  117. </label>
  118. <label class="song-info" id="song-info-3">
  119. <div class="title">Кириллов Федор</div>
  120. <div class="sub-line">
  121. <div class="subtitle">лаборант и процедурный медбрат</div>
  122. </div>
  123. </label>
  124. </div>
  125. </div>
  126. </div>
  127. </div>
  128. </div>
  129. <div class="pets">
  130. <div class="pets-head">Наши питомцы</div>
  131. <div class="subpets">
  132. <div class="gallery">
  133. <img class="pets-img" src="img/britain.jpg" alt="Луна">
  134. <img class="pets-img" src="img/bulldog.jpg" alt="Белла">
  135. <img class="pets-img" src="img/hamster.jpg" alt="Марципан">
  136. <img class="pets-img" src="img/siamese.jpg" alt="Томас">
  137. </div>
  138. <div class="pets-part-background">
  139. <p class="pets-parts-text">Наши питомцы - наша ответственность. Мы стремимся найти каждому из них тёплый дом и заботливую семью.
  140. Может, вы станете следующим счастливым обладателем хвостатого соседа?</p>
  141. </div>
  142. </div>
  143. </div>
  144. <div class="podval">
  145. <div class="podval-str1">
  146. <div class="podval-text-col1">По всем вопросам по телефону/</div>
  147. <div class="podval-text-col2">+79625062815</div>
  148. </div>
  149. <div class="podval-str1">
  150. <div class="podval-text-col1">почте:</div>
  151. <div class="podval-text-col2">ardaismine@gmail.com</div>
  152. </div>
  153. <div class="podval-str2">
  154. <div class="podval-text-col1">Либо по адресу:</div>
  155. <div class="podval-text-col2">Н. Новгород, Южное ш., 2Г <br />Пн-Сб 9:00-20:00</div>
  156. </div>
  157. </div>
  158. </body>
  159. </html>