body
{
  /* Цвет фона */
  background-color: #ECECFF;
}

/* body{font-family: Verdana;}*/

body{font-family: Georgia;}

p.titl {color: black; font: Verdana; text-align:left; border-bottom: 0.1em solid; font-size: 1em; }

p.rekl_1 {color: black; font: Verdana; text-align: center; border-bottom: 0.1em solid; font-size: 1em; }

/* Для строки изображения на этой странице выполнены с помощью систем генерации изображений*/
p.IskInt {color: black; font: Verdana; text-align: center; margin-top: 0em; border-bottom: 0.1em solid; font-size: 0.8em; }

div.ch2 {font-family: Courier; font-size: 3em; font-weight: bold; font-style: italic; color: black;}

div.LeftRight {font-family: Georgia; font-size: 1em;  margin-top: -1.0em; color: black;}

/* Verdana Georgia Arial Helvetica Garamond Courier*/

/* div.ch2 {font-size: 3em; text-align: justify;}*/








/* Стереть. Для показа видео. Начало. Потом Стереть.*/
div.steret {background-color: blue; font-family: Arial; font-size: 2em; color: yellow;}

.block_video
{ 
  width: 800px;
  height: 600px;
  background: blue;
  padding: 5px; /* Поля вокруг текста */
  /* padding-right: px; */
  border: solid 1px yellow;
  overflow: hidden; /* скрывает всё, что не помещается в заданные размеры */
  float: left; /* выравнивает элемент по левому краю */
}

/* 
  .c1{
    display: inline-block;
  }
  .c2{
    display: inline-block;
  }
  .c3{
    display: inline-block;
  }
  .c4{
    display: inline-block;
  }
  .c5{
    display: inline-block;
  }
*/

  
  .type1{
      display: inline-block;
	  font: Arial;
	  font-weight: bold;
	  color: yellow;
	  font-size: 1.5em;
      overflow: hidden; /* скрываем переполнение контентом */
   /* border-right: .15em solid orange; - чтобы создать курсор */
      white-space: nowrap;  /* не переносить текст на новую строку */
      width: 0;
      animation: typing 1s steps(50, end) forwards;/* typing 1s steps(25, end) forwards; */
	  animation-delay: 1.8s;/* задержка перед началом анимации - 1s; */
  }
  .type2{
      display: inline-block;
	  font: Arial;
	  font-weight: bold;
	  color: yellow;
	  font-size: 1.5em; 
      overflow: hidden;
      white-space: nowrap; 
      width: 0;
      animation: typing 1s steps(50, end) forwards;/* typing 1s steps(25, end) forwards; */
      animation-delay: 3s;/* 1 */
  }
  .type3{
      display: inline-block;
	  font: Arial;
	  font-weight: bold;
	  color: yellow;
	  font-size: 1.5em; 
      overflow: hidden;
      white-space: nowrap; 
      width: 0;
      animation: typing 1s steps(50, end) forwards;/* typing 1s steps(25, end) forwards; */
      animation-delay: 4s;/* 2 */
  }
  .type4{
      display: inline-block;
	  font: Arial;
	  font-weight: bold;
	  color: yellow; 
	  font-size: 1.5em; 
      overflow: hidden;
      white-space: nowrap; 
      width: 0;
      animation: typing 1s steps(50, end) forwards;/*typing 1s steps(25, end) forwards;  */
      animation-delay: 5s;/* 3 */
  }
  .type5{
      display: inline-block;
	  font: Arial;
	  font-weight: bold;
	  color: yellow; 
	  font-size: 1.5em; 
      overflow: hidden;
      white-space: nowrap; 
      width: 0;
      animation: typing 1s steps(50, end) forwards;/* typing 1s steps(25, end) forwards; */
      animation-delay: 6s;/* 4 */
  }
  .type6{
      display: inline-block;
	  font: Arial;
	  font-weight: bold;
	  color: yellow; 
	  font-size: 1.5em; 
      overflow: hidden;
      white-space: nowrap; 
      width: 0;
      animation: typing 1s steps(50, end) forwards;/* typing 1s steps(25, end) forwards; */
      animation-delay: 7s;/* 5 */
  }
  .type7{
      display: inline-block;
	  font: Arial;
	  font-weight: bold;
	  color: yellow; 
	  font-size: 1.5em; 
      overflow: hidden;
      white-space: nowrap; 
      width: 0;
      animation: typing 1s steps(50, end) forwards;/* typing 1s steps(25, end) forwards; */
      animation-delay: 8s;/* 6 */
  }

  .type8{
      display: inline-block;
	  font: Arial;
	  font-weight: bold;
	  color: yellow; 
	  font-size: 1.5em; 
      overflow: hidden;
      white-space: nowrap; 
      width: 0;
      animation: typing 1s steps(50, end) forwards;/* typing 1s steps(25, end) forwards; */
      animation-delay: 9s;/* 6 */
  }

  .type9{
      display: inline-block;
	  font: Arial;
	  font-weight: bold;
	  color: yellow; 
	  font-size: 1.5em; 
      overflow: hidden;
      white-space: nowrap; 
      width: 0;
      animation: typing 1s steps(50, end) forwards;/* typing 1s steps(25, end) forwards; */
      animation-delay: 10s;/* 6 */
  }

  .type10{
      display: inline-block;
	  font: Arial;
	  font-weight: bold;
	  color: yellow; 
	  font-size: 1.5em; 
      overflow: hidden;
      white-space: nowrap; 
      width: 0;
      animation: typing 1s steps(50, end) forwards;/* typing 1s steps(25, end) forwards; */
      animation-delay: 11s;/* 6 */
  }
  
  @keyframes typing {
    from { width: 0 }
    to { width: 100% }
  }
  
/*  
  @keyframes blink {
    from { border-color: transparent }
    to { border-color: orange; }
  }
 */


/* Для показа видео. Конец. Потом Стереть.*/





/* Для плавного увеличение изображений. Начало. */
.img-increase
{
display: block;
margin-left: auto;
margin-right: auto;
width: 100%;/* width: 50%; */

/*width: 8em;/* ширина -    width: 128px; 8em;   - */
/*height: 8em;/* высота -    height: 128px; 8em; - */
}


/* .img-increase
{
overflow:auto;
{
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}
width: 128px;
height: 128px;

}
*/


.img-increase img
{
transition: all 0.5s ease-out; /* 0.5s - анимация за пол секунды */
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
}
.img-increase img:hover
{
transform: scale(4); /* 1s - картинка увеличивается 4 раза */
-webkit-transform: scale(4);
-moz-transform: scale(4);
-o-transform: scale(4);
}

/* Для плавного увеличение изображений. Конец. */



/* Для кнопок Вперед, Назад Начало */
table.next_previous
{
width: 100%; /* text-align: center; */
/* position: absolute; margin: auto; */
text-align: justify;
margin-top: -1.0em;
border-bottom: 0.1em solid;
tbody.next_previous_button
{border: 0px; text-align: center;}
td.next_td
{border: 0px; text-align: center;}
td.center_td
{border: 0px; text-align: justify;}

button.center_button
{
background-color: #ECECFF;
border: none;
color: #ECECFF;
width: 40em;
}

button.next_button
{
background-color: lightskyblue;
border: none;
color: black;
padding: 0.625em 1.25em; /* padding: 10px 20px; */
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1em; /* {font-size: 16px; */
margin: 0.125em 0.125em; /* margin: 2px 2px; */
cursor: pointer;
float: left;
width: 11.25em; /* width: 180px; */
/*border: 0px;*/
}

button.next_button:hover
{
background-color:dodgerblue;
border: none;
color:white;
padding: 0.625em 1.25em;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1em;
margin: 0.125em 0.125em;
cursor: pointer;
float: left;
width: 11.25em;
}
 
button.previous_button
{
background-color: lightskyblue; 
border: none;
color: black; 
padding: 0.625em 1.25em;
text-align: center; 
text-decoration: none; 
display: inline-block; 
font-size: 1em;
margin: 0.125em 0.125em;
cursor: pointer; 
float: right;
width: 11.25em;
}
button.previous_button:hover
{
background-color:dodgerblue; 
border: none;
color: white; 
padding: 0.625em 1.25em;
text-align: center; 
text-decoration: none; 
display: inline-block; 
font-size: 1em;
margin: 0.125em 0.125em;
cursor: pointer; 
float: right;
width: 11.25em;
}
}
/* Для кнопок Вперед, Назад Конец */


/* Для основных таблиц. Начало */
table.tab_general {
  width: 100%;
  border-top: 0.1em solid black;
  border-collapse: collapse;
  text-align: center;
  margin-bottom: 1.25em; /* margin-bottom: 20px; */
  border: 0.1em solid black;
}
td.tab_general {
  text-align: center;
	padding: 0.625em; /* padding: 10px; */
	border: 0.1em solid black;
}
 th.tab_general {
  text-align: center;
  padding: 0.625em; /* padding: 10px; */
	border: 0.1em solid black;
 }
/* Для основных таблиц. Конец */




/* Слой перекрытия */
.modal
{
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
background:rgba(0,0,0,.5);
z-index:9;  /*z-index:9;*/
/* Трансформации прозрачности при открытии */
transition:opacity 511ms ease-in;
/*Скрываем изначально*/
opacity:0;pointer-events:none
}
/* Показываем модальное окно */
.modal:target
{
opacity:1;pointer-events:auto
}
/* Содержание */
.modal>div{
width:511px;background:#fff;position:relative;margin:9% auto;/* width:311px; - ширина заставки. margin:9% auto;*/
/*По умолчанию минимизируем анимацию*/
-webkit-animation:minimise 511ms linear;
/*Придаем хороший вид*/
padding: 15px;  /* padding:31px; */
border-radius:7px;box-shadow:0 3px 9px #000;
text-shadow:0 1px 0 #fff;
}
/*Изменяем анимацию при открытии модального окна*/
.modal:target>div{
-webkit-animation-name:bounce
}
.modal h2{
font-size:35px;padding:0 0 9px;
}
@-webkit-keyframes bounce{0%{-webkit-transform:scale3d(.1,.1,1);
-webkit-box-shadow:0 3px 9px #000}55%{-webkit-transform:scale3d(1,1,1);
-webkit-box-shadow:0 9px 9px #000}75%{-webkit-transform:scale3d(1,1,1);
-webkit-box-shadow:0 0 9px #000}100%{-webkit-transform:scale3d(1,1,1);
-webkit-box-shadow:0 3px 9px #000}}
@-webkit-keyframes minimise{0%{-webkit-transform:scale3d(1,1,1)}100%{-webkit-transform:scale3d(.1,.1,1)}}
/*Ссылка на кнопку Закрыть*/
.modal a[href="#close"]{position:absolute;right:0;top:0;color:transparent}
/*Сбрасываем изменения*/
.modal a[href="#close"]:focus{outline:none}
/*Создаем кнопку Закрыть*/
.modal a[href="#close"]:after{content:'X';display:block;
/*Позиционируем*/
position:absolute;right:-9px;top:-9px;width:19px;padding:1px;
/*Стили*/
text-decoration:none;
text-shadow:none;
text-align:center;
font-weight:bold;
background:#000;
color:#fff;
border:3px solid #fff;
border-radius:19px;
box-shadow:0 1px 3px #000
}
.modal a[href="#close"]:focus:after,.modal a[href="#close"]:hover:after{-webkit-transform:scale(1.1,1.1);
-moz-transform:scale(1.1,1.1);
}
.modal a[href="#close"]:focus:after{outline:0 solid #000}
/*Открываем модальное окно*/a.openModal{}
a.openModal:hover,a.openModal:focus{}
.modal .modal_title{display:block;text-align:center;font-size:19pt}