﻿/* CSS Document */

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

body{
}

#container{
	width:1000px;
	margin:0 auto;
	position:relative;
	background:#fff;
	padding-bottom:50px;
}



#main-info{
	width:100%;
	position:relative;
	overflow:hidden;
}

#main-info .site-name{
	float:left;
	text-align:center;
	font:normal 25px Tahoma, sans-serif;
	padding:0 0 0 20px;
	line-height:1.3;
}

#main-info .float-right-pc{
	float:right;
}

#main-info .site-name em{
	font-size:140%;
	font-style: normal;
}

#main-info .site-name a{
	color:#000;
	text-decoration:none;
}

#main-info .site-name a:hover{
	text-decoration:underline;
}

#main-info .site-name span{
	font-size:18px;
}

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

.display-pc{
	display:block;
}

.display-mob{
	display: none;
}


/* Dropdown Button */

.dropbtn{
    padding: 0;
    font-size: 16px;
	width:2.5em;
	height:2.5em;
    border: none;
    cursor: pointer;
	display: block;
	background: rgba(224,224,224,0.00);
}

.dropbtn img{
	width: 100%;
	height: 100%;
	position:relative;
	top: 0;
	left: 0;
	z-index:-1;
}

/* Dropdown button on hover & focus */
.dropbtn:hover, .dropbtn:focus {
    /*background-color: #2980B9;*/
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position:absolute;
	top:5px;
	left:950px;
    display: inline-block;
	z-index:3800;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position:fixed;
	left:50%;
	top:5em;
    background:#6D5F59;;
	color:#fff;
	width:350px;
    z-index: 1;
}

/* Links inside the dropdown */
#main-info .site-name .dropdown-content a {
    color:#fff;
   /* padding: 12px 16px;
	display: block;*/
    text-decoration: none;
}

.dropdown-content a {
    color:#fff;
   /* padding: 12px 16px;
	display: block;*/
    text-decoration: none;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;} 

#messendzhery-i-telefon{
	position:fixed;
	left:30%;
	bottom:0px;
	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;
}

#pay-online{
	position:fixed;
	left:30%;
	bottom:0;
	width:500px;
	height:40px;
	display:block;
	z-index: 1000;
}

#pay-online form button{
	width:220px;
	height:40px;
	background:#f7d746;
	background:linear-gradient(259.65deg, #F2DA32 -1.99%, #FE9416 136.71%);
	box-shadow:4px 4px 12px rgba(243, 148, 1, 0.3);
	border-radius:10px;
	float:left;
	margin-left:20px;
	font:bold 24px/1.5 Arial, Helvetica, sans-serif;
}

#copy{
	margin:20px 0;
	text-align:center;
	font:12px Arial, Helvetica, sans-serif;
}

#copy a{
	color:#00C;
}

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

#content{
	margin:0 0 30px 0;
	/*font:17px/1.4 "Times New Roman", Times, serif;*/
	/*font:normal 15px/1.5 Tahoma, Geneva, sans-serif;*/
	font:normal 16px/1.5 Arial, Helvetica, sans-serif;
	position:relative;
	padding-top:15px;
}

.main-img{
	top:-15px;
}

#content #ukr, #content #rus{
	position:absolute;
	top:-70px;
	font:normal 18px Tahoma, sans-serif;
	color:#000;
	padding-right:25px;
}

#content #ukr{
	left:550px;
	background:url(https://okr.kiev.ua/img-2021-02-08/flag-ukr.png) right center no-repeat;
}

#content #rus{
	left:650px;
	/*background:url(https://okr.kiev.ua/img-2021-02-08/flag-rus.png) right center no-repeat;*/
}

#content .page-top{
	position:absolute;
	/*top:150px;*/
	top:30px;
	left:25px;
	font:normal 30px/1.4 Arial, Helvetica, sans-serif;
	color:#1B1B1B;
	text-align:left;
	padding:0;
}

#content .page-top2{
	position:relative;
	top:0;
	left:0;
	font:normal 14px/1.4 Arial, Helvetica, sans-serif;
	padding-left:20px;
	padding-top:10px;
	padding-bottom:5px;
}

#content .zapis{
	width:230px;
	height:50px;
	text-align:center;
	background:linear-gradient(259.65deg, #F2DA32 -1.99%, #FE9416 136.71%);
	box-shadow:4px 4px 12px rgba(243, 148, 1, 0.3);
	border-radius:2px;
}

#content .zapis-main{
	position:absolute;
	left:30px;
	top:230px;
	/*top:330px;*/
}

#content .zapis a{
	text-decoration: none;
	color:#000;
	font-size:24px;
	line-height:50px;
	display: block;
	width:100%;
	height:100%;
}

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

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

#content p{
	padding:20px 45px;
}

#content h3{
	font:bold 20px/1.5 Arial, Helvetica, sans-serif;
	text-align:center;
	padding:20px 45px;
}

#content h2{
	font:bold 28px/1.5 Arial, Helvetica, sans-serif;
	text-align:center;
	padding:25px 45px;
}

#content h1{
	font:bold 32px/1.5 Arial, Helvetica, sans-serif;
	text-align:center;
	padding:10px 45px 15px 45px;
}

#content ul, #content ol{
	padding:0 60px 20px 90px;
}

#content ul li, #content ol li{
	/*margin:10px 0;*/
	padding:5px 0;
}

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

#content #in-article, #content .in-article{
	width:30%;
	float:none;
	text-align:left;
	font:normal 12px/1.5 Arial, Helvetica, sans-serif;
	padding:10px;
	background:#fff7d8;
	margin-left:10px;
	margin-bottom:10px;
}

#content #in-article ul, #content .in-article ul{
	padding:0 20px 10px 10px;
	list-style-type:disc;
}

#content #in-article ul ul, #content .in-article ul ul{
	padding:0 20px 0 15px;
	list-style-type:circle;
}

#content #in-article ul li, #content .in-article ul li{
	padding:4px 0;
}

#content #in-article .in-article-head, #content .in-article .in-article-head{
	list-style:none;
	font-size:100%;
	font-weight:bold;
	text-align:center;
}

#content #in-article a, #content .in-article a{
	color:#000;
	text-decoration:underline;
}


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

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

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

.psiholog{
	clear:both;
}

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

.zaglushka, .zagl{
	clear:both;
}

#form{
	width:550px;
	height:280px;
	margin:18px auto 0 auto;
}

#Indeks{
	width:550px;
	height:400px;
	margin:18px auto 0 auto;
}

.vopros-otvet{
	height:700px;
	overflow:auto;
}

.img-float-left{
	float:left;
	padding:10px 15px 10px 0;
}

.img-float-right{
	float:right;
	padding:10px 0 10px 15px;
}

.cost{
	font-size:150%
}

#counters{
	padding:30px;
	clear:both;
	text-align:center;
}

#map{
	text-align:center;
}

#content #questions p{
	padding:20px 0;
	border-bottom:1px dashed #036;
}

#content .ansver{
	text-align:right;
	/*font-weight:bold;*/
}

#content .ansver a{
	color:#00F;
	text-decoration:underline;
}

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

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

#content .mail-zapis{
	box-shadow:5px 5px 10px rgba(0,0,0,0.5);
	width:450px;
	margin:5px 25px;;
	border-radius:5px;
	float:left;
	overflow: hidden;
}

#content .mail-zapis h3{
	margin:0;
	padding:10px 50px;
	color:#514642;
}

#content .mail-zapis p{
	width:80%;
	margin:0 auto;
}

#content .mail-zapis p input, #content .mail-zapis p textarea{
	padding:5px 0;
	width:100%;
	background:#E1E0DF;
}

#content .mail-zapis .submit{
	font-size:28px;
	background:linear-gradient(259.65deg, #F2DA32 -1.99%, #FE9416 136.71%);
box-shadow: 0px 4px 10px rgba(43, 53, 130, 0.3);
	height:50px;
	width:360px;
	margin:0 auto;
	border-radius:3px;
	color:#000;
}

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

.video-content{
	text-align:center;
	margin-bottom:30px;
}

.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:100%;
	height:auto;
}
    .youtube .play, .youtube-map .play, #map  .youtube-map .play{
        background: url('https://okr.kiev.ua/video/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;
    }

.img-1000-667{
	width:1000px;
	height:667px;
}

.img-1000-653{
	width:1000px;
	height:653px;
}

.img-1000-667 img, .img-1000-653 img{
	width:100%;
	height:auto;
}

.img-450-380{
	width:450px;
	height:380px;
}

.img-355-533{
	width:355px;
	height:533px;
}

.img-492-327{
	width:492px;
	height:327px;
}

.img-449-558{
	width:449px;
	height:558px;
}

.img-130-110{
	width:130px;
	height:110px;
}

#content .bg-6D5F59, #content .lech{
	background: linear-gradient(180deg, #6D5F59 0%, #5C3626 100%);
	border-radius: 22px;
	color:#fff;
}

#content .bg-6D5F59 a{
	color:#fff;
	text-decoration:none;
}

#content .lech{
	padding-bottom:15px;
}

#content .lech .zapis{
	margin-left:15px;
}

.width-50{
	width:500px;
}

.width-45{
	width:450px;
}

.width-60{
	width:600px;
}

#content .fl-l{
	float:left;
}

#content .fl-r{
	float:right;
}

#content .bg-6D5F59 .width-50 li{
	border-bottom:1px solid rgba(65, 40, 29, 0.5);
}

#content .bg-6D5F59 .width-50 ul{
	padding-left:30px;
	list-style:none;
}

.cards{
	padding:20px 230px;
}

.card{
	width:150px;
	height:100px;
	float:left;
	margin:0 0 0 25px;
	border:3px solid #E6E6E6;
	box-sizing: border-box;
	border-radius:3px;
}

.cards .card .card-img{
	width:70px;
	height:45px;
	margin:25px auto 0 auto;
	text-align:center;
}

.card p{
	text-align:center;
	position:relative;
	top:-5px;
}

#content .card p{
	padding:0;
	font:normal 16px Times New Roman, "serif";
}

.card .card-img img{
	width:100%;
	height:100%;
}

#content .pc-4-cols{
	width:200px;
	height:200px;
	border:2px solid #E4EDFF;
	border-radius:3px;
	float:left;
	margin:0 23px;
}

#content .pc-4-cols a{
	display:block;
	width:100%;
	height:100%;
	text-align:center;
	text-decoration:none;
}

#content .pc-4-cols a .img-box{
	width:80px;
	height:80px;
	margin:30px auto;
}

#content .pc-4-cols a .img-box img{
	width:100%;
	height:100%;
}

#content #treningi-recl{
	position: relative;
	margin:20px auto;
	width:80%;
	height:112px;
	overflow:hidden;
	text-align: center;
	/*border:4px solid #6D5F59;
	border-radius:15px;
	background:linear-gradient(259.65deg, #F2DA32 -1.99%, #FE9416 136.71%);
	background: rgba(242,218,50,0.33);*/
box-shadow:0px 0px 10px #FBB03B;
border-radius:22px;
	background: rgba(251,176,59,0.10);
}

#content #treningi-recl a{
	display: block;
	padding:20px 0 20px 0;
	font-size:24px;
	text-decoration:none;
	color:#000;
}

#content #treningi-recl a img{
	position: absolute;
	top: 0;
	left: 100px;
	width:75px;
	height:75px;
}

#content #treningi-recl a span{
	font-size:16px;
}

#content .preim{
	width:1000px;
	font:bold 26px/1.5 Arial, Helvetica, sans-serif;
	text-align:center;
	margin:60px 0 0 0;
	color:#FBB03B;
}

#content .preim h2, #content .pc-3-cols h2{
	font-size:32px;
	line-height:2;
	color:#534741;
	text-align: left;
}

.preim div{
	width:30%;
	float:left;
	margin-left:2.5%;
	padding:20px 0;
	margin-bottom:0;
}

.preim div .preim-img{
	display:block;
	width:130px;
	height:100px;
	margin:0 auto;
}

.preim div p{
	margin:0;
	font-size:130%;
}

.preim div p span{
color:#534741;
}

.pc-3-cols{
	margin:20px 0;
}

#content .pc-3-cols a{
	text-decoration:none;
}

.pc-1-3-cols{
	width:300px;
	display:block;
	background: rgba(255, 255, 255, 0.85);
box-shadow: 0px 4px 7px rgba(109, 95, 89, 0.15);
border-radius: 22px;
	margin:15px 0 15px 25px;
}

#content .pc-1-3-cols a{
	display:block;
	width:90%;
	padding:15px 5%;
	text-decoration:none;
	color:#000;
}

.pc-3-cols .min-550{
	min-height:580px;
}

.pc-3-cols .min-200{
	min-height:190px;
}

#content .pc-1-3-cols a span{
	display:inline-block;
	width:100%;
	text-align:center;
	font-weight:bold;
}

#content .pc-1-3-cols a .img-130-110{
	margin:0 auto;
}

#cost-all-page{
	width:1000px;
	margin-bottom:15px;
}

#cost-all-page div{
	width:16%;
	margin:0 2%;
	height:340px;
	float:left;
	border-radius:10px;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.5);
	text-align:center;
}

.cost-all-page{
	width:450px;
	margin:0px 20px 15px 20px;
	padding-bottom:10px;
	border-radius:10px;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.5);
	text-align:center;
	display:none;
}

#content #cost-all-page div p{
	padding:15px;
	margin:0;
}

#content .cost-all-page p{
	padding:5px;
	margin:0;
}

#content .cost-all-page-link{
	width:230px;
	margin:12px auto;
	background:#A7A7A7;
}

#content .cost-all-page-link-2{
	background:#F9CE7D;
}

#content .cost-all-page-link a{
	display:block;
	width:100%;
	text-decoration:none;
	font-size:20px;
	line-height:30px;
	color:#fff;
}

#content .cost-all-page-link-2 a{
	color:#000;
}

#cost-all-page div .cost-all-page-name, .cost-all-page .cost-all-page-name{
	display:block;
	padding:none;
	color:#534741;
	background:#E6E6E6;
	font-weight:bold;
	min-height:0;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
}

.cost-all-page .cost-all-page-name{
	color:#000;
	background:linear-gradient(259.65deg, #F2DA32 -1.99%, #FE9416 136.71%);
}

#content #cost-all-page div .cost-all-page-name-small{
	font-size:80%;
	font-weight:bold;
}


.slick-list {
	overflow:hidden;
} 
/* Лента слайдов */ 
.slick-track{
	display:flex;
}

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

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

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

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

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