GTC
/
Frontend


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253
							<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />    
    <link rel="stylesheet" href="style.css" />
    <link rel="stylesheet" href="doctors_carousel.css" />
    <link rel="stylesheet" href="polaroid-pets.css" />
    <link rel="shortcut icon" href="img/icon.svg" type="image/svg">
    <style>
      @import url('https://fonts.googleapis.com/css2?family=Commissioner:wght@100..900&display=swap');
      @import url('https://fonts.googleapis.com/css2?family=Abhaya+Libre:wght@400;500;600;700;800&family=Commissioner:wght@100..900&display=swap');
    </style>
    <script type="text/javascript">
      function changeImage1(src) { document.getElementById('obsledovanie').src = src;}
      function changeImage2(src) { document.getElementById('vakcinaciya').src = src;}
      function changeImage3(src) { document.getElementById('analizy').src = src;}
      function changeImage4(src) { document.getElementById('stomatologiya').src = src;}
      function changeImage5(src) { document.getElementById('gruming').src = src;}
      function changeImage6(src) { document.getElementById('operaciya').src = src;}
      </script>
  </head>
  <body class="main-unregistered">
    
    <!-- <div class="main-unregistered">
      <div class="div">
        <div class="podval">
          <p class="text-wrapper">По всем вопросам по телефону:</p>
          <div class="text-wrapper-2">Либо по адресу:</div>
          <div class="text-wrapper-3">+79625062815</div>
          <p class="element">Н. Новгород, Южное ш., 2Г <br />Пн-Сб 9:00-20:00</p>
        </div>
        <div class="pets">
          <div class="overlap-group">
            <div class="rectangle"></div>
            <div class="text-wrapper-4">Наши питомцы</div>
            <img class="img" src="img/image.png" />
            <img class="rectangle-2" src="img/rectangle-20.png" />
            <img class="rectangle-3" src="img/rectangle-21.png" />
            <div class="rectangle-4"></div>
            <p class="p">
              Наши питомцы - наша ответственность. Мы стремимся найти каждому из них тёплый дом и заботливую семью.
              Может,&nbsp;&nbsp;вы станете следующим счастливым обладателем хвостатого соседа?
            </p>
          </div>
        </div>
        <div class="doctors">
          <div class="overlap">
            <img class="rectangle-5" src="img/rectangle-18.png" />
            <img class="rectangle-6" src="img/rectangle-19.png" />
            <img class="rectangle-7" src="img/rectangle-16.png" />
          </div>
          <div class="text-wrapper-5">Наши специалисты</div>
          <div class="overlap-2">
            <div class="text-wrapper-6">Новикова Вера Дмитриевна</div>
            <div class="text-wrapper-7">терапевт</div>
          </div>
        </div>
        <div class="services">
          <div class="overlap-3">
            <div class="text-wrapper-8">Популярные услуги</div>
            <div class="view">
              <div class="text-wrapper-9">Обследование</div>
              <img class="image" src="img/image-15.png" />
            </div>
            <div class="view-2">
              <div class="text-wrapper-10">Груминг</div>
              <img class="image-2" src="img/image-12.png" />
            </div>
            <div class="view-3">
              <div class="text-wrapper-9">Стоматология</div>
              <img class="image-3" src="img/image-13.png" />
            </div>
            <div class="view-4">
              <div class="text-wrapper-9">Анализы</div>
              <img class="image-4" src="img/image-11.png" />
            </div>
            <div class="view-5">
              <div class="text-wrapper-11">Вакцинация</div>
              <img class="image-5" src="img/image-10.png" />
            </div>
            <div class="view-6">
              <div class="text-wrapper-12">Операции</div>
              <img class="image-6" src="img/image-14.png" />
            </div>
          </div>
        </div>
        <div class="miniinfo">
          <div class="text-wrapper-13">Мы - Хвостатый дом</div>
          <p class="text-wrapper-14">
            Мы предоставляем ветеринарные услуги для домашних и бездомных животных, помогая им получить необходимое
            лечение и уход. <br /><br />Мы заботимся о здоровье и благополучии всех наших подопечных, обеспечивая им
            любовь, заботу и благополучие.
          </p>
          <img
            class="vertical-shot-person"
            src="img/vertical-shot-person-s-hand-stroking-gray-cat-lying-ground-1.png"
          />
        </div>
        <div class="overlap-4">
          <div class="view-7">
            <img class="image-7" src="img/image-9.png" />
            <img class="image-8" src="img/image-7.png" />
            <img class="image-9" src="img/image-1.png" />
          </div>
          <div class="overlap-wrapper">
            <div class="overlap-5">
              <div class="text-wrapper-16">Хвостатый дом</div>
              <div class="text-wrapper-15">Тепло в добрые руки</div>
              <img class="image-10" src="img/image-2.png" />
            </div>
          </div>
        </div>
        <div class="overlap-group-wrapper">
          <div class="overlap-6">
            <div class="view-8"></div>
            <div class="view-9">
              <div class="div-wrapper"><div class="text-wrapper-17">Главная</div></div>
              <div class="div-wrapper"><div class="text-wrapper-18">Услуги</div></div>
              <div class="view-10"><div class="text-wrapper-19">Наши врачи</div></div>
              <div class="div-wrapper"><div class="text-wrapper-18">Приют</div></div>
              <div class="div-wrapper"><div class="text-wrapper-20">Войти</div></div>
            </div>
          </div>
        </div>
      </div>
    </div> -->
    <div class="intro">
      <div class="heads-intro">
        <div class="text-head">Хвостатый дом</div>
        <div class="text-subhead">Тепло в добрые руки</div>
        <img class="image-intro-pets" src="img/image-2.png" />
      </div>

      <div class="menu">
        <div class="text-menu">Главная</div>
        <div class="text-menu">Услуги</div>
        <div class="text-menu">Наши врачи</div>
        <div class="text-menu">Приют</div>
        <div class="text-menu"><a href="registration_form.html" class="link">Войти</a></div>
      </div>

    </div>
    <div class="miniinfo">
      <div class="subminiinfo">
        <img class="miniinfo-img" src="img/image-3.png">
        <div>
          <p class="text-miniinfo-head">Мы - Хвостатый дом</p>
          <p class="text-miniinfo-subhead">
            Мы предоставляем ветеринарные услуги для домашних и бездомных животных, помогая им получить необходимое
            лечение и уход. <br /><br />Мы заботимся о здоровье и благополучии всех наших подопечных, обеспечивая им
            любовь, заботу и благополучие.
          </p>
        </div>
      </div>
    </div>

    <div class="services">
      <div class="text-services-head">Популярные услуги</div>
      <div class="subservices">
        <div class="services-part" onmouseover="changeImage1('img/obsledovanie-hovered.png')" onmouseout="changeImage1('img/obsledovanie.png')">
          <div class="for-services-img"><div class="services-img"><img id="obsledovanie" src="img/obsledovanie.png"/></div></div>
          <div class="text-services">Клинический осмотр</div>
        </div>
        <div class="services-part" onmouseover="changeImage2('img/vakcinaciya-hovered.png')" onmouseout="changeImage2('img/vakcinaciya.png')">
          <div class="for-services-img"><div class="services-img"><img id="vakcinaciya" src="img/vakcinaciya.png" /></div></div>
          <div class="text-services">Вакцинация кошек</div>
        </div>
        <div class="services-part" onmouseover="changeImage3('img/analizy-hovered.png')" onmouseout="changeImage3('img/analizy.png')">
          <div class="for-services-img"><div class="services-img"><img id="analizy" src="img/analizy.png" /></div></div>
          <div class="text-services">Анализ крови</div>
        </div>
      </div>
      <div class="subservices">
        <div class="services-part" onmouseover="changeImage4('img/stomatologiya-hovered.png')" onmouseout="changeImage4('img/stomatologiya.png')">
          <div class="for-services-img"><div class="services-img"><img id="stomatologiya" src="img/stomatologiya.png" /></div></div>
          <div class="text-services">Ультразвуковая чистка</div>
        </div>
        <div class="services-part" onmouseover="changeImage5('img/gruming-hovered.png')" onmouseout="changeImage5('img/gruming.png')">
          <div class="for-services-img"><div class="services-img"><img id="gruming" src="img/gruming.png" /></div></div>
          <div class="text-services">Гигиеническая стрижка</div>
        </div>
        <div class="services-part" onmouseover="changeImage6('img/operaciya-hovered.png')" onmouseout="changeImage6('img/operaciya.png')">
          <div class="for-services-img"><div class="services-img"><img id="operaciya" src="img/operaciya.png" /></div></div>
          <div class="text-services">Кесарево сечение</div>
        </div>
      </div>
    </div>

    <div class="doctors">
      <p class="doctors-head">Наши лучшие специалисты</p>
      <div class="container">
        <input type="radio" name="slider" id="item-1" checked>
        <input type="radio" name="slider" id="item-2">
        <input type="radio" name="slider" id="item-3">
      <div class="cards">
        <label class="card" for="item-1" id="doc-1">
            <img class="img_doc" src="img/novikova.png" alt="Новикова Вера">
        </label>
        <label class="card" for="item-2" id="doc-2">
          <img class="img_doc" src="img/korolev.png" alt="Королев Михаил">
        </label>
        <label class="card" for="item-3" id="doc-3">
          <img class="img_doc" src="img/kirillov.png" alt="Кириллов Федор">
        </label>
      </div>
      <div class="player">
        <div class="upper-part">
          <div class="info-area" id="test">
            <label class="song-info" id="song-info-1">
              <div class="title">Новикова Вера</div>
              <div class="sub-line">
                <div class="subtitle">терапевт</div>
              </div>
            </label>
            <label class="song-info" id="song-info-2">
              <div class="title">Королев Михаил</div>
              <div class="sub-line">
                <div class="subtitle">ЛОР-офтальмолог</div>
              </div>
            </label>
            <label class="song-info" id="song-info-3">
              <div class="title">Кириллов Федор</div>
              <div class="sub-line">
                <div class="subtitle">лаборант и процедурный медбрат</div>
              </div>
            </label>
          </div>
        </div> 
      </div>
    </div>
    </div>

    <div class="pets">
      <div class="pets-head">Наши питомцы</div>
      <div class="subpets">
        <div class="gallery">
        <img class="pets-img" src="img/britain.jpg" alt="Луна">
        <img class="pets-img" src="img/bulldog.jpg" alt="Белла">
        <img class="pets-img" src="img/hamster.jpg" alt="Марципан">
        <img class="pets-img" src="img/siamese.jpg" alt="Томас">
        </div>
        <div class="pets-part-background">
          <p class="pets-parts-text">Наши питомцы - наша ответственность. Мы стремимся найти каждому из них тёплый дом и заботливую семью. 
            Может,  вы станете следующим счастливым обладателем хвостатого соседа?</p>
        </div>
      </div>

    </div>
  </body>
</html>