@import url('/t/animate.css');      
@import url('/t/odometer.min.css');

/* CSS для вертикального выравнивания внутри DIV */
.outer {
  width: 100%;
  height: 100%;  
  text-align: center;
}

.outer:after {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    content: "";
    /* For IE, the outcast */
    zoom:1;
    *display: inline;
}

.inner {
    display: inline-block;
    vertical-align: middle;
    text-align: left;
     /* For IE, the outcast */
    zoom:1;
    *display: inline;
}
/* ------------------------------------------ */


/* CSS Глобального врапера экрана */
.screen-wrap 
{
  position: fixed;
        z-index: 999999;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
}

.layer .overlay {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-image: url("/i/black-overlay80.png");
}
/* ------------------------------------------ */

/* CSS предзагрузчика (также использует глобальный врапер) */
  
.preloader {
  position: fixed;
  z-index: 999999;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        background-position: center center;
        background-repeat: no-repeat;
        background-image: url(/i/preloader.svg);
}

.preloader-close 
{
  position: fixed;
  z-index: 999999;
        color: #fff;
        padding: 10px 20px;
        cursor: pointer;
        right: 0;
        bottom: 0;
        font-weight: 600;
}
/* ------------------------------------------ */




  
html, body
{
  height:100%;
}

body 
{
  min-height:99%;
  padding: 0;
  margin: 0;
  font-family: "PT Sans Caption", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 18px;
}


h1 {font-weight: 700; line-height: 1.4; text-transform: uppercase; font-size: 200%;}

h1 div 
{
  transition: .1s ease-in-out;
  cursor: pointer;
  line-height:normal;
  margin-bottom: 20px;
  padding: 10px;
  display: inline-block; 
  border-radius: 4px;
}

h1 div:not(.active):hover {color: #aaa; }

.__editable {
    margin: 0;
    padding: 0;
}
.active /*h1 div:hover */
{
  color: #024f94; /*#024f94; #011b39*/
  background-image: url('/i/1px_white_70.png');
  cursor: default;
  }

   
.bl1 
{
  background-color: #011b39; /*#024F94 #009ee0*/
  float:left;
  text-align:center;
  width:50%;
  height:100%;
  line-height: 1.8;
  overflow: hidden;
}
.bl1 .inner {width: 70%;}

.max 
{
  height: 99%;
}

.bl2 
{
  background-color: #bcbcbc;
  float:left;
  width:50%;
  height:100%;
  line-height: 1.8;
}
.bl2 .inner {width: 70%;}
      
/*.bl2 img 
{
  width: 100%;
  height: 100%;
}*/

.box-image-1 {
    position: relative;
    overflow: hidden;
  }

.box-image-1 img {
  /*height: 1024px;*/
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: .9s ease-in-out;
}

/*.box-image-1:hover img {
  transform: scale(1.05);
}*/












/* штука для смены цвета изображения */
  

.fadableElement {
   opacity: 1;
   /*transition: opacity 2s ease-in-out;*/
   -moz-transition: opacity 2s ease-in-out;
   -webkit-transition: opacity 2s ease-in-out;
 }
.fadeOut {
    opacity:0;
}

/* ------------------------------------------ */


.main-menu
{
background-color: #0b1930; /*#eee;*/
z-index: 100;
font-size: 17px;
width: 100%;
text-align: right;
display: inline-block;
}

.navigation 
{

display: inline-block;
/* For IE, the outcast */
zoom:1;
*display: inline;
}

.navigation, .navigation ul, .navigation li
{
list-style-type: none;
list-style-position:inside;
margin:0;
padding:0;
text-align: left;
}


.navigation .lvl1, .navigation .lvl2 {position:relative;}

.lvl1 span
{
width: 22px;
height: 22px;
display: inline-block;
/*background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgd2lkdGg9IjgwMHB4IiBoZWlnaHQ9IjgwMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+DQo8cGF0aCBkPSJNNiA5TDEyIDE1TDE4IDkiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4NCjwvc3ZnPg==");*/
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgd2lkdGg9IjgwMHB4IiBoZWlnaHQ9IjgwMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+DQo8cGF0aCBkPSJNNiA5TDEyIDE1TDE4IDkiIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4NCjwvc3ZnPg==");
background-repeat: no-repeat;
background-position: center center;
background-size: 24px Auto;
}


.lvl2 span
{
width: 27px;
height: 27px;
display: inline-block;
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgd2lkdGg9IjgwMHB4IiBoZWlnaHQ9IjgwMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+DQo8cGF0aCBkPSJNOSA2TDE1IDEyTDkgMTgiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4NCjwvc3ZnPg==");
background-repeat: no-repeat;
background-position: center center;
background-size: 24px Auto;
}

/* ------------------------------------------------- */
/*     стиль для всех ячеек меню всех уровней        */
/* ------------------------------------------------- */
.navigation li
{
/*padding: 20px; /*отступы*/
/*cursor: pointer; /*курсор*/
/*width: fit-content; /*делает ступеньки в меню*/
padding: 0px 20px 0px 0px;
text-align: center;
}

.navigation li a 
{
display: inline-block;
padding: 20px 0px 20px 16px; /*16px;*/
text-decoration: none;
text-align: left;
color : #ddd; /*#111; /*цвет шрифта меню (цвет родителя если закомментировано)*/
border-bottom: solid 1px #666; /*#666;*/
width:100%;
}

.navigation > li > a 
{ border: none;
padding: 16px; /*20px;*/}

/* ------------------------------------------------- */
/*              видимая часть меню                   */
/* ------------------------------------------------- */
.navigation > li 
{
padding: 0;
/*background-color : #eee; /*цвет фона меню (прозрачное если закомментировано)*/
/*color : #111; /*цвет шрифта меню (цвет родителя если закомментировано)*/
/*border-left: solid 1px #666;
border-bottom: solid 1px #666;
border-top: solid 1px #666;*/
}

.navigation > li:last-child 
{
/*border-right: solid 1px #666;*/
}

.navigation > li:hover 
{
background-color : #0d5194; /*#fff; /*цвет фона меню при наведении (цвет родителя если закомментировано)*/
/*color: #fff; /*цвет шрифта меню при наведении (цвет родителя если закомментировано)*/
}

.navigation_li_hover 
{
background-color : #0d5194; /*#fff; /*цвет фона меню при наведении (цвет родителя если закомментировано)*/
/*color: #fff; /*цвет шрифта меню при наведении (цвет родителя если закомментировано)*/
}


/* ------------------------------------------------- */
/*          меню первого уровня вложенности          */
/* ------------------------------------------------- */

.navigation .lvl1 > ul li 
{
background-color : #0b1930; /* #ccc; /*цвет фона меню (прозрачное если закомментировано)*/
/*color : #111; /*цвет шрифта меню (цвет родителя если закомментировано)*/
/*border-bottom: solid 1px #666;
border-left: solid 1px #666;
border-right: solid 1px #666;*/
}

.navigation .lvl1 > ul li a:hover 
{
background-color : #0d5194; /*#eee; /*цвет фона меню при наведении (цвет родителя если закомментировано)*/
/*color: #fff; /*цвет шрифта меню при наведении (цвет родителя если закомментировано)*/
}
/* ------------------------------------------------- */
/*          меню второго уровня вложенности          */
/* ------------------------------------------------- */
.navigation .lvl2 > ul li 
{
background-color : #bbb; /*цвет фона меню (цвет родителя если закомментировано)*/
/*color : #111; /*цвет шрифта меню (цвет родителя если закомментировано)*/
}

.navigation .lvl2 > ul li:first-child 
{
/*border-top: solid 1px #666;*/
}


.navigation .lvl2 > ul li a:hover 
{
background-color : #ccc; /*цвет фона меню при наведении (цвет родителя если закомментировано)*/
/*color: #fff; /*цвет шрифта меню при наведении (цвет родителя если закомментировано)*/
}
/* ------------------------------------------------- */





.navigation > li
{
float:left;
z-index:2;
margin: 0px;
}




.lvl1 > ul {
position:absolute;
top: 100%;
left: 0px;
z-index:100;
width: 300px;

display: none;
/*visibility: hidden;
opacity: 0;
max-height: 0;
transition: opacity 0.3s, visibility 0.3s, max-height 0.1s 0.3s, max-width 0.1s 0.3s; */
}

.lvl2 > ul {

position:absolute;
left: 100%;
top: 0px;
z-index:100;
width: 400px;

/*display: none;*/
/*ibility: hidden;
opacity: 0;
max-width: 0;
max-height: 0;
transition: opacity 0.3s, visibility 0.3s, max-height 0.1s 0.3s, max-width 0.1s 0.3s; */
}

/*.lvl1:hover > ul, .lvl2:hover > ul {
visibility: visible;
max-width: 400px;
max-height: 100%;
opacity: 1;
transition: opacity 0.3s, visibility 0.3s;
}*/


.navigation li:last-child  {border-radius: 0px 0px 4px 4px;}
.navigation li:last-child a { border-bottom: none;}


/*карта*/

[class*="ymaps-2"][class*="-ground-pane"] {
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
-webkit-filter: grayscale(80%);
}



.center-cropped {
width: 49.9%; /*33.3%*/
height: 49.9%;
background-position: center center;
background-repeat: no-repeat;
overflow: hidden;
display: inline-block;
float: left;
background-size: auto 100%;
outline: 1px solid #eee;
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
-webkit-filter: grayscale(40%);
cursor: pointer;
}

/* Set the image to fill its parent and make transparent */
.center-cropped img {
min-height: 100%;
min-width: 100%;
height: 100%;
/* IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
/* IE 5-7 */
filter: alpha(opacity=0);
/* modern browsers */
opacity: 0;
}


.center-cropped:hover 
{
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
-webkit-filter: grayscale(0%);
/*transform: -webkit-transform:rotateY(180deg);
transform: rotateY(180deg);*/
/*display: none;
visibility: hidden;*/
}


.graph 
{
transition: all 1s
}