contact-block.html

<div class="container">
	<div class="contacts">
		<h2 class="contacts__title">Контактні дані</h2>
		
		<ul class="contacts-list">
			<li>
				<div class="contacts-list__heading">
					<div class="contacts-list__icon">
						<img alt="icon" src="assets/images/system/icon/map-icon.svg">
					</div>
					<h3 class="contacts-list__title">Адреса</h3>
				</div>
				
				<a class="contacts-list__desc"
				   href="https://goo.gl/maps/ByeJqEA31hzBsJsC7" target="_blank">
					Україна, 03113, м. Київ <br/> вул. Дружківська, буд. 10
				</a>
			</li>
			
			<li>
				<div class="contacts-list__heading">
					<div class="contacts-list__icon">
						<img alt="icon" src="assets/images/system/icon/time-icon.svg">
					</div>
					<h3 class="contacts-list__title">Часи роботи</h3>
				</div>
				
				<p class="contacts-list__desc">
					Понеділок - п’ятниця 9.00 -18.00
					<br>
					Обідня перерва 13.00-14.00
				</p>
			</li>
			
			<li>
				<div class="contacts-list__heading">
					<div class="contacts-list__icon">
						<img alt="icon" src="assets/images/system/icon/phone-icon.svg">
					</div>
					<h3 class="contacts-list__title">Електронна пошта</h3>
				</div>
				
				<a class="contacts-list__desc" href="mailto:sk_gamayun@ukr.net"
				   target="_blank">
					sk_gamayun@ukr.net
				</a>
			</li>
			
			<li>
				<div class="contacts-list__heading">
					<div class="contacts-list__icon">
						<img alt="icon" src="assets/images/system/icon/phone-icon.svg">
					</div>
					<h3 class="contacts-list__title">Телефон</h3>
				</div>
				
				<a class="contacts-list__desc" href="tel:380931755035" target="_blank">
					+380(93)175-50-35
				</a>
			</li>
		</ul>
		
		<div class="contacts__map">
			<iframe
				allowfullscreen=""
				height="100%"
				loading="lazy"
				src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2540.2184067868475!2d30.412965899999996!3d50.4556575!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x40d4cc4399981b8b%3A0x1c80467deaa2447e!2z0YPQuy4g0JTRgNGD0LbQutC-0LLRgdC60LDRjywgMTAsINCa0LjQtdCyLCDQo9C60YDQsNC40L3QsCwgMDMxMTM!5e0!3m2!1sru!2sie!4v1677168565707!5m2!1sru!2sie"
				style="border:0;"
				width="100%"></iframe>
		</div>
	
	</div>
</div>