@import url('https://fonts.googleapis.com/css?family=Fira+Sans+Condensed:400,700|PT+Sans:400,700&subset=cyrillic');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap&quot');


/*
https://colorscheme.ru/#3z21TsOsOK-K-
black #231F20
dark gray #808184
light gray #E6E7E8
super light gray #F1F1F2
white #FFF
deep blue #214361
middle blue #345E85
light blue #A5CCEC
orange #F6921E

bright blue #0086ff
*/

/* Стилизация полосы прокрутки */
::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: white;
    border-radius: 10px;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
}

::-webkit-scrollbar-thumb {
    background: #345e85;
    border-radius: 10px;
    border: 2px solid transparent;
    background-clip: padding-box;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    transition: background 0.3s ease, transform 0.3s ease;
}

::-webkit-scrollbar-thumb:hover {
    background: #345e85;
    transform: scale(1.1);
}



.video {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}


.video iframe {
  width: 100%;
  max-width: 640px;
  aspect-ratio: 16 / 9; 
  height: auto;
  display: none;
}

.video-cover {
  width: 100%;
  max-width: 640px;
  aspect-ratio: 16 / 9;
  border: 5px solid #da811a;
  border-radius: 15px; 
  padding: 10px; 
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
  background-color: #fff;
}

.play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(210, 127, 31, 1); 
  border: none;
  border-radius: 50%;
  cursor: pointer;
  padding: 10px; 
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
  transition: background-color 0.3s, transform 0.3s; 
}
 /*
.play-button:hover {
  background-color: rgba(246, 146, 30, 1); 
  transform: translate(-50%, -50%) scale(1.1); 
}*/

.play-button svg {
  fill: white; 
}


.video-cover.hidden {
    display: none; /* Скрываем обложку */
}





@media (max-width: 680px) {
  .video iframe,
  .video-cover {
    max-width: 100%;
    aspect-ratio: 16 / 9; 
  }
  .play-button {
    padding: 1px; 
    width: 40px; 
    height: 40px; 
  }

  .play-button svg {
    width: 40px; 
    height: 40px;
  }
}

@media (max-width: 480px) {
  .video iframe,
  .video-cover {
    aspect-ratio: 16 / 9;
  }
}

.img__fond {
    display: block;
    margin: 20px 15px 20px 0; /* Отступы: сверху, справа, снизу, слева */
    float: left;
    
}

.img__rightind{
    margin: 5px 20px 5px 0; 
}

.img__leftind{
    margin: 5px 0 5px 20px; 
}

.img-container {
    text-align: center; 
    margin: 20px auto;
}

.centered-img {
    margin-right: 10px; 
}

.centered-imge:last-child {
    margin-right: 0; 
}

@media (max-width: 480px) {
    .img__fond {
        float: none; 
        display: block; 
        margin: 0 auto;
        margin-bottom: 2em;
        max-width: 100%;
        height: auto;
    }
    
    .centered-img {
        display: block; 
        margin: 0 auto; 
        margin-bottom: 10px; 
    }

    .centered-img:last-child {
        margin-bottom: 0;
    }
    
}


body#hover {
  font-family: "Fira Sans Condensed", sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  min-height: 100vh;
   font-size: 1.25em;
    
}

a#hover {
  position: relative;
  display: inline-block;
  text-decoration: none;
  transition: -webkit-clip-path 275ms ease;
  transition: clip-path 275ms ease;
  transition: clip-path 275ms ease, -webkit-clip-path 275ms ease;
}
a#hover:hover::before {
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
          clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
a#hover::before {
  position: absolute;
  content: attr(data-content);
  color: #F6921E;
  text-decoration: none;
  -webkit-clip-path: polygon(0 0, 0 0, 0% 100%, 0 100%);
          clip-path: polygon(0 0, 0 0, 0% 100%, 0 100%);
  transition: -webkit-clip-path 275ms ease;
  transition: clip-path 275ms ease;
  transition: clip-path 275ms ease, -webkit-clip-path 275ms ease;
}


*
{
padding: 0px;
margin: 0px;
box-sizing: border-box;
font-family: inherit;
font-weight: inherit;
font-size: inherit;
line-height: inherit;
color: inherit;
text-align: inherit;
z-index: 0;
}

html
{
font-size: 16px;
line-height: 1.5;
font-family: 'PT Sans', sans-serif;
font-weight: 300;
color: #231F20;
}

.link {
  text-decoration: none;
}

body
{
background: #FFF;
}

h1, h2, h3, h4
{
font-family: 'Fira Sans Condensed', sans-serif;
color: #214361;
font-weight: 400;
text-transform: uppercase;
margin-top: 1rem;
}

h1
{
font-size: 1.75rem;
line-height: 1.75rem;
margin-top: 0;
}

h2
{
font-size: 1.5rem;
line-height: 1.5rem;
}

h3
{
font-size: 1.25rem;
line-height: 1.25rem;
}

h3
{
font-size: 1rem;
line-height: 1rem;
}

p
{
margin-top: 1rem;
}

ol, ul
{
margin-left: 1.25rem;
margin-top: 1rem;
}

table
{
margin-top: 1rem;
border-collapse: collapse;

}

td
{
padding: 0.5rem;
border: solid 1px;
}

strong
{
font-weight: 400;
}

b
{
font-weight: bold;
}

i
{
font-style: italic;
}

a
{
color: #345E85;
}

.clear
{
clear: both;
}

span#scroll_top
{
display: block;
position: fixed;
right: 1rem;
bottom: 1rem;
z-index: 75000;
width: 3.5rem;
height: 3.5rem;
line-height: 3rem;
text-align: center;
font-size: 2rem;
color: #345E85;
background: rgba(255, 255, 255, 0.35);
outline: none;
border: solid 0.25rem;
border-radius: 1.75rem;
cursor: pointer;
transition: all ease 0.15s;
opacity: 0;
}

span#scroll_top.visible
{
opacity: 1;
}

span#scroll_top.visible:hover
{
background: #fff;
}

div#page
{
width: 100%;
max-width: 80rem;
margin-left: auto;
margin-right: auto;
border-left: solid 1px #F1F1F2;
border-right: solid 1px #F1F1F2;
}

div#header
{
position: relative;
height: 5.5rem;
z-index: 6000; 
}

a#logo
{
position: absolute;
left: 1rem;
top: 1rem;
display: block;
width: 12.0625rem;
height: 3.4375rem;
background-position: center left;
background-repeat: no-repeat;
}

div#header input
{
position: absolute;
right: 13.5rem;
top: 1.2rem;
width: 8rem;
height: 1.5rem;
border: none;
color: #345E85;
background-color: #FFF;
background-image: url('search-blue.png');
background-position: 6rem;
background-repeat: no-repeat;
padding-left: 1.25rem;
padding-right: 2.5rem;
text-transform: uppercase;
}

div#headeren input
{
position: absolute;
right: 7.7rem;
top: 1.4rem;
width: 8rem;
height: 1.5rem;
border: none;
color: #345E85;
background-color: #FFF;
background-image: url('search-blue.png');
background-position: 6rem;
background-repeat: no-repeat;
padding-left: 1.25rem;
padding-right: 2.5rem;
text-transform: uppercase;
}


a#elk
{
position: absolute;
right: 14rem;
top: 0.9rem;
width: auto;
height: auto;
font-size: 1.5rem;
color: #345E85;
}

a#subscribe
{
position: absolute;
right: 11.5rem;
top: 0.9rem;
width: auto;
height: auto;
font-size: 1.5rem;
color: #345E85;
}

a#feedback
{
position: absolute;
right: 9rem;
top: 0.9rem;
width: auto;
height: auto;
font-size: 1.5rem;
color: #345E85;
}
a#feedback_en
{
position: absolute;
right: 5.8rem;
top: 0.95rem;
width: auto;
height: auto;
font-size: 1.5rem;
color: #345E85;
}
a#special
{
position: absolute;
right: 6.5rem;
top: 0.9rem;
width: auto;
height: auto;
font-size: 1.5rem;
color: #345E85;
}

div#language
{
position: absolute;
right: 1rem;
top: 1rem;
width: auto;
height: auto;
}

div#language a, div#language span
{
display: block;
float: left;
font-family: 'Fira Sans Condensed', sans-serif;
width: 2.5rem;
height: 1.5rem;
line-height: 1.5rem;
text-align: center;
text-decoration: none;
color: #FFF;
text-transform: uppercase;
}

div#language span
{
background: #F6921E;
}

div#language a
{
color: #214361;
}



div#language2 {
   position: absolute;
    z-index: 9000;
    right: 1rem;
    top: 1rem;
}

.dropdown {
    position: relative;
    display: inline-block;
     z-index: 9000;  
}

.dropbtn {
    background-color: #F6921E;
    color: white; 
    width: 3.5rem; 
    height: 1.9rem; 
    font-family: 'Fira Sans Condensed', sans-serif; 
    border: none;
    cursor: pointer; 
    border-radius: 5px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); 
    transition: background 0.3s ease, transform 0.2s;
    display: flex; 
    align-items: center; 
    justify-content: center;
}

.arrow {
    margin-left: 5px;
}

.dropdown-content {
    display: none;
    text-transform: uppercase; 
    position: absolute;
    background-color: #fff;
    border-radius: 8px;
    min-width: auto;
    max-width: 100px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.2);
    padding: 0.5rem 0; 
    top: 2rem;
    left: 0.3rem;
    z-index: 8000;
    transition: opacity 0.3s ease, visibility 0.3s ease; 
}

.dropdown-content a {
    color: #345E85; 
    padding: 10px 12px; 
    text-decoration: none; 
    display: block; 
    text-align: center;
    transition: background 0.2s ease;    
}

.dropdown-content a:hover {
    background-color: #E6E7E8; 
}

.dropdown:hover .dropdown-content {
    display: block; 
}

.small-fontcn {
  font-size: 0.8em;
  font-weight: 400;
}



div#main
{
width: 100%;
}

div#menu_top
{
position: relative; 
background: #345E85;
background: #214361;
width: 100%;
height: 2.5rem;
display: flex;
justify-content: space-between;
z-index: 5000;
transition: all 0.25s;
padding: 0 1rem;
}

div#menu_top div.burger
{
width: 2.5rem;
height: 2.5rem;
background-image: url('burger.svg');
background-position: center left;
background-size: 1.5rem 1.5rem;
background-repeat: no-repeat;
display: none;
}

div#menu_top div.section
{
width: auto;
height: 2.5rem;
line-height: 2.5rem;
position: relative;
padding: 0rem;
}

div#menu_top div.subsection
{
background: #F1F1F2;
width: auto;
min-width: 12rem;
height: auto;
line-height: 1.5rem;
position: absolute;
top: 2.5rem;
left: 1px;
padding: 0.5rem 1rem;
outline: solid 1px #345E85;
transition: all ease 0.5s;
display: none;
}

div#menu_top div.section:last-of-type div.subsection
{
left: auto;
right: 0;
}

div#menu_top div.section:hover
{
height: auto;
}

div#menu_top div.section:hover div.subsection
{
display: block;
}

div#menu_top a
{
display: block;
color: #FFF;
font-family: 'Fira Sans Condensed', sans-serif;
text-decoration: none;
text-transform: uppercase;
white-space: nowrap;
}

div#menu_top div.subsection a
{
color: #345E85;
text-transform: none;
}

div#menu_top a:hover
{
text-decoration: underline;
}

div#menu_top a.selected, div#menu_top div.subsection a.selected
{
color: #F6921E;
}

.subsection-title
{
font-family: 'Fira Sans Condensed', sans-serif;
font-weight: 500;
color: #F6921E;
letter-spacing: 0.1em;
margin-top: 0;
font-size: 1.05rem;
}

.subsection-group:nth-child(n+2) {
border: none;
border-top: 1px solid #345E85;
margin-top: 8px;
padding-top: 8px;
}

@media (max-width: 1024px)
{
.subsection-group:nth-child(n+2) 
	{ border-color: #fff;}
}

div.banners
{
margin-top: 1rem;
text-align: center;
}

div.banners a
{
display: block;
margin-top: 1rem;
}

div.banners a:first-child
{
margin-top: 0rem;
}

div#content
{
width: auto;
}

div.subcontainer
{
padding: 2rem;
}
div.subcontainer-mes
{
padding: 2rem 2rem 0rem 2rem;
}


h2.main
{
height: 3.5rem;
line-height: 3.5rem;
margin-top: 0rem;
font-size: 1.5rem;
font-family: 'Fira Sans Condensed', sans-serif;
text-align: center;
}

h2.main.blue
{
background: #345E85;
color: #FFF;
}

h2.main.gray
{
background: #E6E7E8;
color: #214361;
}

h2.main:hover
{
color: #F6921E;
}

h2.main a
{
text-decoration: none;
color: inherit;
}



a#izd_fb
{
display: block;
margin-top: 1.5rem;
width: 3rem;
height: 3rem;
background-image: url('fb.png');
background-position: center;
background-size: contain;
}



ul.file-list
{
list-style-type: none;
margin-left: 0;
}

ul.file-list.pdf li a
{
padding-left: 1.5rem;
background-image: url('icon-pdf.gif');
background-position: calc(50% - 60px) center;

background-repeat: no-repeat;
}

img.full-width
{
width: 100%;
height: auto;
}



a.banner_full_width
{
display: block;
}

a.banner_full_width img
{
width: 100%;
height: auto;
float: left;
}

div#e-g-top
{
background: #345E85;
color: #fff;
padding: 2rem;
}

div#e-g-top *
{
color: inherit;
}

span.close
{
display: block;
width: 1.25rem;
height: 1.25rem;
background-image: url('close.gif');
background-position: center;
background-size: contain;
background-repeat: no-repeat;
opacity: 1;
}

div.feedback_container 
{
width: 100%;
max-width: 60rem ;

}

form.vulgaris p
{
margin-top: 1.5rem;
}

form.vulgaris input[id="fio"]
{
text-transform: capitalize;
}

form.vulgaris strong
{
font-family: 'Fira Sans Condensed', sans-serif;
font-weight: 700;
color: #345E85;
text-transform: uppercase;
display: block;

}

form.vulgaris input, form.vulgaris textarea
{
display: block;
outline: none;
margin-top: 0.5rem;
border: solid 1px #345E85;
padding: 0 1rem;
height: 2.5rem;
line-height: 2.5rem;
width: 100%;
max-width: 40rem;
}



form.vulgaris textarea
{
height: 5rem;
padding: 1rem;
line-height: 1.25rem;
}

form.vulgaris .invalid
{
outline: solid 2px #b00;
}
/*
form.vulgaris div.captcha
{
margin-top: 1.5rem;
}

form.vulgaris div.captcha img
{
display: inline-block;
vertical-align: middle;
margin-top: 0.5rem;
cursor: pointer;
width: 11.25rem;
height: 2.5rem;
}

form.vulgaris div.captcha input
{
width: 11.25rem;
display: inline-block;
vertical-align: middle;
margin-top: 0.5rem;
margin-left: 1rem;
}
*/

form.vulgaris div.captcha {
    margin-top: 1.5rem;
}

.captcha-group {
    display: inline-block;
    width: 100%; 
    white-space: nowrap; 
    text-align: left; 
}

form.vulgaris div.captcha img,
form.vulgaris div.captcha input,
.refresh-icon {
    display: inline-block;
    vertical-align: middle;
    line-height: 2.5rem; 
}

form.vulgaris div.captcha img {
    margin-top: 0.5rem;
    cursor: pointer;
    width: 11.25rem;
    height: 2.5rem;
}

form.vulgaris div.captcha input {
    width: 11.25rem;
    margin-top: 0.5rem;
    margin-left: 1rem;
}

.refresh-icon {
    cursor: pointer;
    font-size: 1.5rem;
    color: #345e85;
    margin-left: 1rem;
}



form.vulgaris p.message
{
margin-top: 2rem;
font-weight: 700;
color: #b00;
}

form.vulgaris p.success
{
font-size: 1.5rem;
color: #0b0;
}

form.vulgaris p.toolset
{
margin-top: 2rem;
}

p.toolset
{
margin-top: 2rem;
}

.button
{
display: inline-block;
border: solid 1px #345E85;
background: #345E85;
color: #fff;
transition: all ease 0.15s;
cursor: pointer;
padding: 0.5rem 1rem 0.5rem 2.5rem;
position: relative;
text-transform: uppercase;
text-decoration: none;
}

.button i
{
position: absolute;
top: 0.75rem;
left: 0.75rem;
}

.button:hover
{
background: #fff;
color: #345E85;
}

div.loading
{
width: 100%;
height: auto;
text-align: left;
}

div.loading div.item
{
display: inline-block;
width: 3rem;
height: 3rem;
margin: 3rem 3rem 3rem 0rem;
background: #F0FFFF;
border: solid 0.0625rem #444;
transition: all 0.25s;
}

div.loading div.item.active
{
background: #448ABD;
}

div.success
{
color: #0b0;
font-size: 1.25rem;
font-weight: bold;
margin-top: 2rem;
}

div.narrow
{
width: 100%;
max-width: 40rem;
}

p.subscribe_rubric
{
position: relative;
padding-left: 1.75rem;
cursor: pointer;
color: #808184;
}

p.subscribe_rubric::before
{
content: "\f0c8";
font-family: "Font Awesome 5 Free";
position: absolute;
top: -0.125rem;
left: 0;
font-size: 1.25rem;
color: #345E85;
}

p.subscribe_rubric.active
{
color: #231F20;
}

p.subscribe_rubric.active::before
{
content: "\f14a";
}

p.subscribe_rubric strong
{
font-weight: 700;
}

h2#rubric_header
{
position: relative;
display: inline-block;
width: auto;
}

span#rubric_message
{
position: absolute;
top: 0;
left: 100%;
margin-left: 0.5rem;
color: #0b0;
white-space: nowrap;
}

p.back
{
color: #808184;
font-style: italic;
}

p.back a
{
color: inherit;
font-style: inherit;
}

div.photogallery
{
margin-top: 2rem;
width: 100%;
max-width: 40rem;
}

div.photogallery div.container
{
margin-top: 1rem;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
}

div.photogallery div.container a.item
{
display: block;
width: 15%;
height: auto;
background-position: center;
background-size: cover;
outline: solid 1px #888;
}

div.photogallery div.container a.item div
{
padding-top: 100%;
}

div#map
{
width: 100%;
height: 30rem;
border-top: solid 1px #f1f1f2;
border-bottom: solid 1px #f1f1f2;
}

div#map div.balloon
{
display: flex;
justify-content: space-between;
align-items: flex-start;
}

div#map div.balloon div.thumb
{
flex-shrink: 0;
flex-grow: 0;
width: 6rem;
background-position: center;
background-size: cover;
margin-right: 0.5rem;
}

div#map div.balloon div.thumb div
{
padding-top: 100%;
}

div#map div.balloon div.text hr
{
margin: 0.5rem 0;
border: none;
height: 1px;
background: #000;
}

div#map div.balloon div.text p
{
margin-top: 0rem;
}

.ymaps-2-1-74-balloon__tail
{
z-index: -1000;
}

div.bottom_share_container
{
margin: 2rem auto 1rem 0;
display: flex;
flex-direction: row;
justify-content: flex-start;
}

div.bottom_share_container div.subscribe
{
/*margin-left: 1rem;*/
}

/*div.ya-share2
{
}

div.ya-share2 div.ya-share2__container_size_m span.ya-share2__icon
{
	width: 2.7rem;
	height: 2.7rem;
	background-size: 2.7rem 2.7rem;
}
*/
.ya-share-container {
    display: inline-flex;
    overflow: hidden; 
    height: 30px; 
}

.ya-share2 {
    transform: scale(1.2);
    transform-origin: top left; 
    display: inline-block;
    margin-right: 20px;
}



@media (max-width: 1024px)
{
div#page { padding: 0.25rem; }
div#content div#mainpage { width: 100%; position: static; padding: 0rem; }
div#content div#right { width: 100%; position: static; }
div#content h1 { margin-top: 1rem; }

div#menu_top { display: block; padding-left: 0.5rem; overflow: hidden; }
div#menu_top.open { height: auto; }
div#menu_top div.burger { display: block; }
div#menu_top div.section { height: auto; padding: 0.5rem 0.5rem 0.5rem 0rem; line-height: 1.25rem; }

div#menu_top div.subsection { display: block; position: static; background: #345E85; color: #FFF; padding:10px; border-radius:10px; }
div#menu_top a { color: #FFF !important; font-size: 1rem; white-space: normal; padding-bottom:6.5px;}

}


@media (max-width: 768px)
{
div#page { border: none; }

div#left_bottom_block { display: none; }

h2.main:first-child { margin-top: 0.25rem; }

div#page { padding: 0.25rem; margin-top: 0rem; }
div#main { display: block; margin-top: 0.25rem; }
div#left { width: 100%; }
div#left div#menu a { text-align: center; }
div#left div.banners { display: none; }
div#content { width: 100%; }
div#content div#mainpage { width: 100%; position: static; padding: 0rem; }
div#content div#right { width: 100%; position: static; }
div#content div#right div.banners a img { width: 50%; height: auto; }
div#content h1 { margin-top: 1rem; }
div#content div#detail div.detail { padding: 1rem; }
div#content div#detail div.detail img { width: 100%; height: auto; float: none !important; margin: 0rem !important; }

div#content.internal { padding: 0.25rem; }

h2.main { margin-top: 0.25rem; height: auto; line-height: 2rem; padding: 0.5rem 0; }
div.content_block, div.content_block_small { margin-top: 0.25rem; }


div#menu_top { margin-top: 0.25rem; }



div.photogallery div.container a.item { width: 33%; }


}

@media (max-width: 480px)
{
div#header { height: 7rem; }
div#header input { position: static; margin-top: 5rem; width: 75%; background-position: center left; margin-left: 1.5rem; padding-left: 1.5rem; }

a#feedback { right: 1.5rem; top: 3rem; }
a#subscribe { right: 4rem; top: 3rem; }
a#elk { right: 6.5rem; top: 3rem; }
a#special { display: none; }



div#calendar_main_container { display: block; padding: 0.25rem 0 0 0; }
div#calendar_main_container table { width: 100%; }
div#calendar_main_container div.list { width: 100%; margin: 1rem 0 0 0; }

div.subcontainer { padding: 0.5rem 0.5rem 1rem 0.5rem; }
div.subcontainer-mes { padding: 0.5rem 0.5rem 1rem 0.5rem; }

form.vulgaris div.captcha input { display: block; margin-left: 0; }

}


@media (max-width: 820px)
{
.table-scroll {
    overflow-x: scroll;
    overflow-y: auto;
}
.table-scroll::-webkit-scrollbar-thumb {
    border: 2px solid white;
    background-color: #ccc;
}
.table-scroll::-webkit-scrollbar {
    -webkit-appearance: none;
}
.table-scroll::-webkit-scrollbar:horizontal {
    height: 13px;
}
.table-scroll::-webkit-scrollbar-thumb {
    border-radius: 6px;
    border: 2px solid white; 
    background-color: rgba(0, 0, 0, .5);
}
}


.table {
	width: 100%;
	margin-bottom: 20px;
	border: 1px solid #dddddd;
	border-collapse: collapse; 
}
.table th {
	font-weight: bold;
	padding: 5px;
	background: #efefef;
	border: 1px solid #dddddd;
}
.table td {
	border: 1px solid #dddddd;
	padding: 5px;
}

