﻿/* CSS Document */

*{
	margin:0;
	padding:0;
	border:0;
}

body{
	background:#FFF;
}

#container{
	width:1000px;
	background:#FFF;
	margin:0 auto;
	position:relative;
	overflow:hidden;
}

#content{
	width:100%;
	margin:0 0 30px 0;
	font:normal 20px/1.6 Arial, Helvetica, sans-serif;
	text-align:justify;
}

#main-menu{
	width:1000px;
	/*background:url(img-all/bg-main-menu.png) left top repeat-x;*/
	/*background:#bbd5e4;*/
	/*background:#e9e5ca;*/
	/*background:#ebedfe;*/
	background:#ff6400;
	line-height:36px;
	margin:0 0;
}

#main-menu ul li{
	/*float:left;
	list-style:none;
	border-right:solid 1px #999;*/
	/*padding:0 24px;*/
	/*font:normal 20px/36px "Times New Roman", Times, serif;*/
	font:bold 20px/36px Arial, Helvetica, sans-serif;
}

#main-menu ul li a{
	/*color:#8c1504;*/
	/*color:#7b5b2c;*/
	/*color:#12548d;*/
	/*color:#1b4d70;*/
	/*color:#FFF;*/
	/*text-decoration:underline;*/
	text-decoration:none;
	padding:0 10px;
}

#main-menu ul li a:hover{
	text-decoration:none;
	background:#BB3D00;
}

.viber-chat{
	position:relative;
	top:5px;
}

#messendzhery-i-telefon{
	position:fixed;
	left:30%;
	bottom:0px;
	width:180px;
	display:block;
	background:linear-gradient(259.65deg, #F2DA32 -1.99%, #FE9416 136.71%);
	border-radius:10px;
	z-index: 1000;
}

#messendzhery-i-telefon .viber-chat img{
	width:33px;
	height:33px;
	position:relative;
	bottom:-4px;
}

#messendzhery-i-telefon .viber-chat{
	top:0;
}

#messendzhery-i-telefon a{
	color:#000;
	text-decoration:none;
	font:bold 24px/1.5 Arial, Helvetica, sans-serif;
	padding-left:15px;
}

#content 

#content img{
	/*margin:25px auto;*/
	/*display:block;*/
}

#content .img-sert img{
	float:left;
}

#content .mainphoto{
	width:300px;
	height:300px;
	margin:25px auto;
	overflow: hidden; 
    border-radius: 50%;
}

#content .mainphoto img{
	width:100%;
	height:100%;
}

#content p, #content h1, #content h2, #content h3, #content h4, #content ul, #content ol{
	padding:0 30px;
}

#content a{
	color:#00C;
	text-decoration:underline;
}

#content a:hover{
	text-decoration:none;
}

#content p{
	padding:15px 30px;
}

#content p strong{
	color:#ff6400;
}

#content h4{
	font-size:30px;
	font-weight:bold;
}

#content h3{
	font-size:36px;
	font-weight:bold;
	text-align:center;
	margin:20px 0;
}

#content h2{
	font-size:39px;
	font-weight:bold;
	text-align:center;
	margin:25px 0;
}

#content h1{
	font-size:42px;
	font-weight:bold;
	text-align:center;
	margin:30px 0;
}

#content h1 span{
	font-size:21px;
}

#content ul, #content ol{
	margin-left:30px;
}

#content ul li, #content ol li{
	padding:5px 0;
}

#content ul{
	list-style-type:disc;
}

.align-center{
	text-align:center;
}

.align-left{
	text-align:left;
}

.align-right{
	text-align:right;
}

.pronouncement{
	text-align:right;
	font-style:italic;
	font-weight:bold;
}

.zaglushka{
	clear:both;
}

.dashline{
	width:100%;
	height:1px;
	border-bottom:1px dashed #000;
	margin:15px 0;
}

.video-content{
	text-align:center;
}

.video-content iframe{
	width:640px;
	height:480px;
}

.youtube, .youtube-map{
        background-position: center;
        background-repeat: no-repeat;
        position: relative;
        display: inline-block;
        overflow: hidden;
        transition: all 200ms ease-out;
        cursor: pointer;
		width:640px;
		height:480px;
    }
.youtube img, .youtube-map img{
	width:640px;
	height:480px;
}
    .youtube .play, .youtube-map .play{
        background: url('https://mamitko.kiev.ua/img/youtube-play-btn.png') no-repeat; /*ВАЖНО: здесь укажите адрес до изображения*/
        background-position: 0 -50px;
        -webkit-background-size: 100% auto;
        background-size: 100% auto;
        position: absolute;
        height: 50px;
        width: 69px;
        transition: none;
        top:0;
        left:0;
        right:0;
        bottom:0;
        margin:auto;
    }
    .youtube:hover .play, .youtube-map:hover .play {
        background-position: 0 0;
    }

.video{
	width:100%;
	text-align:center;
}

#content #mail-zapis p input, #content #mail-zapis p textarea{
	border:1px #000 solid;
	padding:5px;
}

#mail-zapis{
	font:22px;
	position:relative;
}

#mail-zapis .submit{
	font:22px;
}

#mail-zapis .bezspama{
	width:1px;
	height:1px;
	top:0;
	right:0;
}

.soc-sh-but{
	display:block;
	padding:2%;
	width:16%;
	float:left;
}

.soc-sh-but-face{
	display:block;
	padding:2%;
	width:25%;
	float:left;
}

.soc-sh-but-gaut{
	display:block;
	padding:2%;
	width:10%;
	float:left;
}

.img-float-left-sert-footer{
	overflow:hidden;
}

.img-float-left-sert-footer div{
	float:left;
	height:200px;
}

.img-float-left-sert-footer div a{
	display: inline-block;
}

.img-float-left-sert-footer div img, .img-float-left-sert-footer div a{
	width:100%;
	height:auto;
	max-height:100%;
}

.img-300-215{
	width:200px;
	height:143px;
}

.img-215-300{
	width:143px;
	height:200px;
}

.social-links {
  /*display: flex;
  flex-wrap: wrap;*/
  margin-top: 20px;
  min-height: 40px; /* Резервуємо висоту, щоб контент не стрибав */
}

.social-links a{
	display: inline-block;
	width:40px;  /* Жорстко задаємо розмір КОНТЕЙНЕРА */
    height:40px;
	margin:0 15px;
}

.soc-link {
  display: inline-block;
}

.soc-link svg {
  width: 100%;  /* SVG розтягується на весь контейнер */
  height: 100%;
  display: block;
}

/* Контакти dropdown */
.contact-dropdown {
  position: absolute;
  top: 5px;
  right: 20px;
  z-index: 800;
}

.contact-btn {
  width: 50px;
  height: 50px;
  padding: 4px;
  border: none;
  background: transparent;
  cursor: pointer;
  color: #6D5F59;
  transition: color 0.2s;
}

.contact-btn:hover,
.contact-btn:focus {
  color: #5C3626;
}

.icon-phone {
  width: 100%;
  height: 100%;
}

.contact-content {
  display: none;
  position: absolute;
  right: 0;
  top: 100%;
  background: #FFFFFF;
  padding: 15px;
  border-radius: 8px;
  min-width: 200px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

.contact-content.show {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.contact-content a {
  color: #000;
  text-decoration: none;
}

.contact-content a:hover {
  opacity: 0.8;
}

.icon-messenger {
  width: 32px;
  height: 32px;
  fill: #fff;
  transition: transform 0.2s;
}

.icon-messenger:hover {
  transform: scale(1.1);
}

.phone-link {
  display: block;
  width: 100%;
  padding: 5px 0;
  border-top: 1px solid rgba(255,255,255,0.2);
}

.address {
  display: block;
  width: 100%;
  font-size: 14px;
  color:#000000;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,0.2);
}

/* Брендові кольори */
.icon-viber {
  fill: #7360F2;
}

.icon-telegram {
  fill: #26A5E4;
}

.icon-whatsapp {
  fill: #25D366;
}