@charset "utf-8";

#certificate{
	max-width:855px;
	position:relative;
}
#certificate > img{
	width:100%;
	height:auto;
	display:block;
	position:absolute;
	top:0;
	left:0;
	opacity:0;
	transition:opacity 0.5s ease;
	cursor:pointer;
}
#certificate > img.active{
	opacity:1;
	position:relative;
}
#certificate_icon{
	display:flex;
	justify-content:space-between;
}
#certificate_icon img{
	flex:1 1 auto;
	width:0;
	height:auto;
	cursor:pointer;
	border:1px solid #ccc;
	margin:2px;
}
#certificate_icon .active, #certificate_icon img:hover{
	border:1px solid #ff717b;
}
#certificate figcaption{
	font-size:21px;
	font-weight:500;
	text-align:center;
	line-height:50px;
}
pre, .error_disp{
	overflow-wrap:break-word;
	position:fixed;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	line-height:15px;
	width:310px;
	padding:5px;
	white-space:pre-wrap;
	outline:2px solid #fff;
}
pre{
	left:0;
	background-color:#B9FDD8;
}
.error_disp{
	right:0;
	background-color:#FCCBBA;
}
.error_disp br {
    display:none;
}
*{
	margin:0;
	padding:0;
	outline:0;
	border:0;
	border-color:transparent;
	outline-color:#fff;
	font-style:normal;
	text-decoration:none;
}
html{
	font-size:17px;
	font-family:'Inter', Arial, Helvetica, sans-serif;
	background-color:#fff;
	color:#333;
	font-weight:400;
	min-height:100%;
	height:100%;
	scroll-behavior:smooth;
}
body{
	display:grid;
	grid-template-areas:
		'header header'
		'nav nav'
		'breadcrumb breadcrumb'
		'aside main';
	grid-template-rows:auto 46px auto 1fr;
	grid-template-columns:30% 1fr;
	gap:0;
	font-size:16px;
	line-height:24px;
	position:relative;
	max-width:1250px;
	margin:0 auto;
	min-height:100%;
	height:auto;	
}
#home_body{
	grid-template-areas:
		'header'
		'nav'
		'main';
	grid-template-rows:auto 46px 1fr;
	grid-template-columns:1fr;
}
#admin_body{
	grid-template-areas:
		'nav'
		'breadcrumb'
		'main';
	grid-template-rows:46px auto 1fr;
	grid-template-columns:1fr;
}

nav{
	grid-area:nav;
	display:flex;
	gap:0.5%; 
	position:sticky;
	width:100%;
	top:0;
	background-color:#FFF;
	z-index:77;
}
nav a{
	font-size:20px;
	padding:0 1%;
	text-align:center;
	flex:1;
	display:flex;
	line-height:1.1;
	align-items:center;
	justify-content:center;
	color:#fff;
	background-color:#04afbc;		
}
nav a:hover, nav .active{
	background-color:#ff717b;
}
#lang_choice{
	font-size:18px;
	font-weight:500;
	max-width:82px;
	width:82px;
	word-spacing:10px;
	position:relative;
	padding:0;
}
#lang_choice div{
	text-align:center;
	text-transform:uppercase;
	background-color:#fff;
	color:#04afbc;
	line-height:24px;
	padding:5px 1px;
	position:absolute;
	left:5px;
	top:6px;
	height:24px;
	width:34px;
	box-shadow:1px 1px 4px rgba(0, 0, 0, 0.15), 3px 3px 4px rgba(0, 0, 0, 0.15);
}
#lang_choice:hover{
	background-color:#ff717b;
}
#lang_choice div.lng_ro{
	left:40px;
}
#breadcrumb{
	grid-area:breadcrumb;
	font-size:15px;
	line-height:30px;
	margin:15px 0 10px 0;
	color:#777;
}
#breadcrumb a{
	color:#333;
	padding:10px;
}
#breadcrumb a:hover{
	color:#000;
	background-color:#ecf3ff;
}
.edit{
	z-index:777777;
	opacity:0.28;
	padding:10px;
	position:fixed;
	right:0;
	top:70px;
	background:none !important;
.edit}
:hover {
  opacity:1;
}
main{
	position:relative;
	grid-area:main;
	margin:0 1%;
}
aside{
	grid-area:aside;
	margin:0 8% 0 2%;
	position:sticky;
	top:46px;
	align-self:start;
}
footer{
	text-align:center;
	border-top:1px solid #ccc;
	font-size:14px;
	margin:20px 0;
	padding:20px 0 0 0;
}
footer b{
	font-weight:400;
}
h1{
	font-size:clamp(1.2rem, 1vw + 1.15rem, 2.1rem);
	margin:0 0 30px 0;
	line-height:1.1;
	font-weight:400;
}

header{
	grid-area:header;
	max-height:210px;
	height:auto;
	position:relative;
	background-image:url(img/header.webp);
	background-size:cover;
	display:flex;
	align-items:center;
}
header a{
	padding: !important;
	display:flex;
	background:none !important;
	width:100%;
}
header img{
	display:inline-block;
	max-height:210px;
	height:auto;
	width:16.8%;
	margin:0 1%;
}
header a:hover b, header a:hover i, header a:hover u{
	color:#ff717b;
}
header b{
	margin:auto 1%;
	font-size:clamp(2.8em, 1.8vw + 2.0em, 9em);
	line-height:1.25;
	text-transform:uppercase;
	max-height:200px;
	text-align:center;
	color:#ff717b;
	text-shadow:0 0 3px #fff, 0 0 7px #fff, 0 0 10px #fff, 0 0 20px #fff;
	transform: scaleX(1.25);
	font-weight: 400;
}

header b i{
	letter-spacing:1px;
	display:block;
	font-size:57%;
	color:#006da0;
	transform: scaleX(0.8);
}
header b u{
	display:block;
	font-size:41%;
	color:#006da0;
	text-transform: none;
	transform: scaleX(0.8);
}
h2{
	font-size:23px;
	font-weight:500;
	line-height:1.15;
	
}
h3{
	font-size:19px;
	font-weight:500;
	line-height:1.15;
	
}
main h2{
	margin:20px 0 10px 0;
}
aside h2{
	margin:5px 0 23px 0;
	font-weight:400;
}
a:not(nav a, header a){
	color:#0058dd;
	padding:5px 1px;
}
a:not(nav a, #instagram):hover{
	color:#03F;
	background-color:#E0F1FC;
}
p{
	margin:14px 0;
	hyphens:auto;
	word-break:break-word;
}
ul{
	overflow:hidden;
	margin:0 0 10px 0;
	list-style:square;
}
li{
	margin:10px 0 10px 40px;
	hyphens:auto;
	word-break:break-word;
}
ul li::marker{
	content:'■  ';
	color:#ccc;
	font-size:20px;
	text-transform:uppercase;
}
b{
	font-weight:600;
}
hr{
	border:none;
	height:1px;
	background-color:#ccc;
	margin:20px 0 10px 0;
}
#home_body main{
	display:grid;
	grid-template-areas:
		'card h1'
		'card columns';
	grid-template-rows:auto 1fr;
	grid-template-columns:auto 1fr;
	margin:25px 0 10px 0;
	gap:0 3%;
}
#home_body h1{
	grid-area:h1;
	margin-bottom:10px;
}
#aside_ul, #aside_ul li{
	margin:0;
	padding:0;
	list-style:none;
}
.aside_ul a{
	font-size:17px;
	padding-left:10px !important;
}
aside a:not(aside h2 a){
	display:block;
	margin:5px 0;
	padding:9px 0 9px 12px;
	line-height:17px;
	background-color:#ecf3ff;
	font-size:15px;
	color:#222;
}
aside h2 a{
	display:block;
	padding:5px 10px;
	color:#333;
	background-color:#ecf3ff;
}
aside a:hover, #card a:not(#instagram):hover{
	background-color:#dcedfe;
	color:#06F;
}
aside .active{
	color:#555;
	background-color:#fff !important;
	border-left:6px solid #FFBFBF;
	padding-left:6px;
}

#blog, #blog li{
	margin:0;
	padding:0;
	list-style:none;
}
#blog a{
	display:block;
	margin:5px 0;
	padding:7px 2px 7px 10px;
	line-height:1.5;
	background-color:#ecf3ff;
	font-size:20px;
	color:#333;
}
#blog a:hover{
	background-color:#dcedfe;
	color:#000;
}
#uslugi{
	display:flex;
	flex-wrap:wrap;
	gap:15px 1.5%;
	justify-content:center;
	margin:20px 0;
}
#uslugi li{
	margin:0;
	padding:0;
	list-style:none;
	box-shadow:1px 1px 6px rgba(0, 0, 0, 0.1);
	width:32%;
	max-width:380px;
	text-align:center;
	transition:transform 0.25s ease;
}
#uslugi a{
	display:block;
	font-weight:500;
	color:#333;
	line-height:22px;
	background-color:#FFF;
}
#uslugi li:hover, #uslugi li:hover a, a#uslugi a:hover {
	background-color:#ecf3ff;
	color:#0058dd;
}
#uslugi li:hover{
	 transform:scale(1.05);
	 box-shadow:1px 1px 6px rgba(0, 0, 0, 0.2), 1px 1px 12px rgba(0, 0, 0, 0.1);
}
#uslugi li::marker{
	content:'';
}
#uslugi li img{display:block;
	width:100%;
	height:auto;
}
.adaptive_img{
	
	width:100%;
	max-width:850px;
	height:auto;
}
.float_left{
	float:left;
	margin:12px 20px 20px 0;
	display:inline-block;
}
.float_clear{
	clear:both;
}
#aside_justify{
	position:relative;
	text-align:center;
	font-size:15px;
	line-height:20px;
	padding:10px;
	margin:5px 0;
	background:linear-gradient(0, rgb(160, 235, 236) 0%, rgb(229, 251, 251) 100%);
}
#aside_justify b{
	font-size:17px;
	font-weight:500;
}
#aside_justify a{
	background:none;
	font-size:23px;
	display:block;
	padding:10px 0;
	color:#0058dd;
	font-weight: 500;
}
#aside_justify a:hover{
	background:none;
}
#map_k, #map_d{
	display:inline-block;
	width:150px;
	height:34px;
	cursor:pointer;
	background-color:#03a1ad;
	color:#fff;
	padding:5px 0;
	font-size:13px;
	line-height:16px;
	margin:5px 1px;
	z-index:7777;
	position:relative;
}
#map_k:hover, #map_d:hover, .map_active{
	background-color:#ff717b !important;
}
#map{
	display:none;
	position:fixed;
	top:0;
	left:0;
	height:100%;
	width:100%;
	z-index:77;
	background-color:#fff;
	box-shadow:1px 1px 7px rgba(0, 0, 0, 0.4);
}
.cent{
	text-align:center;
}
/* ТАБЛИЦА */
table{
	background-color:#fff;
	width:100%;
	border-collapse:collapse;
	margin:10px 0;
	font-size:16px;
}
tr{border:1px solid #E7EBF5;}
tr:nth-child(odd){
	background-color:#f1f1f1;
}
tr:hover{background-color:#E7EBF5 !important;}
tr.highlight{background-color:#d3ebe6 !important;}
th{
	text-align:left;
	background-color:#E7EBF5;
}
td, th{
	vertical-align:middle !important;
	border:none;
	padding:3px 5px;
	line-height:normal;
}
td{
	font-size:15px;
	line-height:20px;
}
td a, th a{
	display:block;
	padding:2px;
	margin:-3px;
}
td img{vertical-align:middle;}
.small{font-size:13px;}

#debug{
	z-index:777770;
	max-width:96%;
	box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);
	position:fixed;
	right:0;
	bottom:-1px;
	font-size:13px;
	background-color:#FFF;
}
#debug div{
	max-height:860px;
	overflow-y:auto;
	padding:10px;
}
#debug h3{
	margin:0;
	padding:4px;
	cursor:pointer;
	font-size:13px;
	line-height:24px;
	color:#FFF;
	background-color:#444;
	border-bottom:1px solid #FFF;
}
.accordion div{display:none;}
.accordion h3{cursor:pointer;}
.accordion h3:before{content:" + ";}
.accordion .active:before{content:" - ";}
#card{
	grid-area:card;	
	background:linear-gradient(0, rgb(160, 235, 236) 0%, rgb(229, 251, 251) 40%, rgb(229, 251, 251) 100%);
	text-align:center;
	width:340px;
	max-height:755px;
	box-shadow:1px 1px 4px rgba(0, 0, 0, 0.1), 3px 3px 7px rgba(0, 0, 0, 0.07);
	position:sticky;
	top:55px;
	line-height:20px;
	white-space:nowrap;
	overflow:hidden;
	margin:10px 0 0 0;
}
#card_photo{
	position:relative;
	width:340px;
	height:480px;
	overflow:hidden;
	margin-bottom:10px;
}
#card_photo img{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	object-fit:cover;
	opacity:0;
	transition:opacity 2s ease;
}
#card_photo img.active{
	opacity:1;
}
#card_photo figcaption{
	background:#e4fbfe;
	position:absolute;
	bottom:-6px;
	left:0;
	width:100%;
	padding:10px 0;
	font-size:23px;
	font-weight: 500;
}
#card a:not(#instagram){
	display:block;
	line-height:40px;
	margin:0;
	font-size:23px;
	font-weight:500;
}
#instagram{
	display:block;
	width:100%;
	text-align:center;
	margin:5px 0 0 0;
}
#columns{
	grid-area:columns;

}
#new{
	background-image:url(img/new.png);
	background-repeat:no-repeat;
	background-position:0px 0px;
	font-size:21px;
	margin:30px 0;
	background-color:#ecf3ff;
	display:block;
	height:42px;
	line-height:42px;
	padding:0 0 0 60px;
}
#comments li{
	margin:0 0 10px 0;
	padding:0 0 10px 0;
	border-bottom:solid 1px #ddd;
}
#comments li::marker{
	content:'';
}
#comments b{
	display:block;
	margin:0 10px 10px 2%;
}
#comments i{
	display:block;
	font-size:12px;
	font-weight:400;
	color:#444;	
}
#comment_submit{
	display:block;
	width:100%;
	margin:0 auto;
	line-height:38px;
	font-size:21px;
	text-align:center;
	background-color:#357EC8;
	color:#fff;
	cursor:pointer;
}
#comment_submit:hover{
	background-color:#ff717b;
}
@media (max-width:768px){
	#new{
		line-height:17px;
		font-size:15px;
		font-weight:600;
		padding:4px 0 4px 60px;
		height:34px;
	}
	 body{
		grid-template-areas:
			'header'
			'nav'
			'breadcrumb'
			'main'
			'aside';
		grid-template-rows:auto 40px auto auto auto;
		grid-template-columns:1fr;
	}
	#home_body{
		grid-template-rows:auto 40px 1fr;
	}
	#home_body main{
	grid-template-areas:
		'h1'
		'card'
		'columns';
	grid-template-rows:1fr;
	grid-template-columns:auto auto auto;
	margin:10px 0;
	gap:0;
}
	#debug{
		display:none;
	}
	.float_left{
		float:none;
		margin:0;
		display:block;
		width:100%;
		height:auto;
	}
	li{
		margin:10px 0 10px 17px;
	}
	ul li::marker{
		content:'■ ';
	}
	header{
		background-image:url(img/header_mobile.webp);
		min-height:84px;
		background-position: right bottom;
	}
	header img{
		margin:0;
		width: 24%;
	}
	header b{
		margin: auto 0 auto -3.6%;
		font-weight:500;
		font-size:clamp(26px, 6.8vw, 10vw);
		transform: scaleX(1.14);
	}
	header b u{
		font-size:44%;
		
	}
	#lang_choice{
		font-size:12px;
		max-width:53px;
		width:53px;
		word-spacing:3px;
	}
	#lang_choice div{
		left:3px;
		top:3px;
		width:22px;
		padding:5px 1px;
		line-height:23px;
	}
	#lang_choice div.lng_ro{
		left:27px;
	}
	nav{
		gap:0;
		z-index:9999;
	}
	nav a{
		font-size:clamp(14px, calc(11px + 0.5vw), 9vw);
		line-height:0.84rem;
	}
	nav a img{
		display:none;
	}
	#breadcrumb{
		line-height:24px;
		font-size:14px;
		padding:0 2%;
		width:96%;
		margin-top:10px;
	}
	.edit{
		display:none;
	}
	main{
		position:relative;
		margin:0;
		padding:5px 2%;
		width:96%;
	}
	main h2{
		margin:20px 0 0 0;
	}
	h1, #home_body h1{
		text-align:center;
		margin:0 0 20px 0;
	}
	h2{
		font-size:21px;
		text-align:center;
	}
	h3{
		font-size:18px;
		text-align:center;
	}
	aside{
		position:relative;
		top:auto;
		margin:0;
		padding:5px 2% 0 2%;
		width:96%;
	}
	footer{
		font-size:15px;
		line-height:20px;
		background:linear-gradient(0, rgb(160, 235, 236) 0%, rgb(229, 251, 251) 100%);
		margin:7px;
		border:none;
		padding:10px 7px 15px 7px;
	}
	footer b{
		font-size:16px;
		line-height:20px;
		font-weight:500;
	}
	footer br{
		display:none;
	}
	footer a{
		display:block;
		font-size:23px;
		line-height:30px;
		font-weight:500;
	}
	aside h2{
		margin:5px 0 10px 0;
	}
	#uslugi{
		gap:5px 1%;
		margin:10px 0;
	}
	#uslugi li{
		list-style:none;
		padding:0 0 5px 0;
		width:48%;
		max-width:380px;
	}
	#uslugi a{
	font-size:15px;
	line-height:18px;
}

	#aside_justify{
		font-size:15px;
		line-height:18px;
	}
	#columns{
		display:block;
	}
	#card{
		box-shadow:none;
		margin:10px auto;
		position:relative;
		top:0;
	}
	#blog a{
		margin:5px 0;
		padding:5px 1px 5px 5px;
		line-height:1.2;
		font-size:15px;
		font-weight:500;
		hyphens:auto;
		word-break:break-word;
	}
}
@media (max-width:429px){
	nav a:first-child {
		background-image:url(img/home.png);
		background-position:center 0px;
		padding:0;
		font-size:0;
		max-width:40px;  
	}
}