/* --------------- reset.css --------------- */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, em, img, strong, sub, sup, b, u, i,  dl, dt, dd,  , fieldset, form, label, /*table*/, tbody, tfoot, thead, /*tr, th, td*/, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;                               /* обнуляем отступы и убираем бордюры */
	vertical-align: baseline;          /* приводим все к одной базовой линии */
	background: transparent;      /* чтобы не проскакивали левые фоны, установленные по умолчанию */
	font-size: 100%;                     /* размер шрифта всем одинаковый */
}
a {                                      	     /* ссылка не в общем списке чтобы не сбрасывать outline по умолчанию */
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	outline:none;
}
table {						 /*устраняем отступы между ячейками таблицы */
	border-collapse: collapse; 
	border-spacing: 0;
}
td, td img {
	vertical-align: top;			 /*возвращаем привычное вертикальное выравнивание */
} 
input, select, button, textarea {
	margin: 0; 				/* убираем отступы по умолчанию для элементов форм (в частности для checkbox и radio) */
	font-size: 100%; 			/* делаем размер шрифтов везде одинаковым */
	outline: none;
}
input[type="text"], input[type="password"], textarea {
	padding: 0; 				/* убираем внутренние отступы для текстовых полей */
}
input[type="checkbox"] { 		/* вертикальное выравнивание чекбоксов и радиобатонов относительно меток */
	vertical-align: bottom;
}
input[type="radio"] {
	vertical-align: text-bottom;
}
sub {
	vertical-align: sub;
	font-size: smaller;
}
sup {
	vertical-align: super;
	font-size: smaller;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display:block;
}
nav ul {
	 list-style:none;
}
/* --------------- /reset.css --------------- */

/* --------------- базовые настройки ---------*/
html {
	min-height:100%;  /*всегда показываем вертикальную полосу прокрутки*/
	background: url(images/fon.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
body {


 

	text-align: left;
	font-size: 1em; /* используем безопасные шрифтовые CSS стеки */
	min-height:100%;
	font-family: Arial, sans-serif;
}
a, a:visited { /* порядок правил для ссылок имеет значение */
	color: #b15cb3;
	text-decoration: underline;
}
a:hover {
	color: #b15cb3;
	text-decoration:none;
}
a:focus, a:active {
	color: #b15cb3;
	text-decoration: underline;
}
h1, h2, h3, h4, h5, h6{
	font-weight:normal;
}
img{

	max-width:100%;
}
.clr{
	clear:both;
}
.clearfix:after {
    clear: both;
    content: "";
    display: table;
}
/* --------------- /базовые настройки ---------*/


/*Настройка каркаса и шапки*/

.karkas{
    width: 960px;
     margin: 0 auto;

      position: relative;
  
  /*margin: 1em auto 1em;*/
 
  /*padding: 1em;*/
  border-radius: 10px;
  background: rgb(100,160,210) radial-gradient(circle at 100% 100%, rgba(255,255,255,.60), rgba(255,255,255,.20));
  box-shadow:
   -1px -1px rgb(100, 150, 200),
   -2px -2px rgb(100, 140, 190),
   -3px -3px rgb(100, 130, 180),
   -4px -4px rgb(100, 120, 170),
   -5px -5px rgb(100, 120, 160),
   -6px -6px rgb(100, 120, 150),
  /* тень подложки */
   -4px -3px 2px 1px rgb(180, 180, 180),
   -4px -4px 3px 2px rgb(200, 200, 200);
}
header {
	height: 201px;
	background-image: url(images/logo1.jpg);
	border-radius: 0px 0px 10px 10px;
}
header a.logo {
	display: block;
	position: absolute;
	background-position: 0px 0px;
	background-repeat: no-repeat;
	width: 380px;
	height: 92px;
	top: 12px;
	right: 219px;
	background-image: url(images/Bershanskaya.png);
	}

/*Навигаци, всплывающее меню*/

nav {
  background: #4478B4;
 box-shadow: 0 2px 0 0 #1c1c1c;
  border-top: 1px solid #ECF1F2;
  text-align: center;
}
nav a {
  text-decoration: none;
  display: block;
  transition: .3s linear;
}
nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.topmenu > li {
  display: inline-block;
  position: relative;
  margin-right: -4px;
  border-left: 1px solid #ECF1F2;
}
.topmenu > li:last-child {border-right: 1px solid #ECF1F2;}
.topmenu > li > a {
  font-weight: bold;
  padding: 5px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #1c1c1c;
}
.active:after, .submenu-link:after {
  content: "\f107";
  font-family: "FontAwesome";
  color: inherit;
  margin-left: 5px;
}
.topmenu .active, .topmenu > li > a:hover, .submenu li a:hover {color: #ECF1F2;}
.submenu {
  position: absolute;
  left: -1px;
  z-index: 5;
  width: 120px;
  border-bottom: 1px solid #ECF1F2;
  visibility: hidden;
  opacity: 0;  
  transform: translateY(10px);
  transition: .3s ease-in-out;
}
.submenu li {position: relative;}
.submenu a {
  background: #4478B4;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  border-left: 1px solid #fff;
  color: #1c1c1c;
  font-weight: bold;
  text-align: left;
  font-size: 12px;
  letter-spacing: 1px;
  padding: 5px 5px;
}
.submenu .submenu {
  position: absolute;
  top: 0;
  left: calc(100% - 1px);
  left: -webkit-calc(100% - 1px);
}
nav li:hover > .submenu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0px);
}



/*nav {
    background: #4478B4;
	border-radius:5px;
}
.navbar ul {
  display: none;
  position: absolute;
  background: #E6EFF4;
}
.navbar li:hover ul { 
	display: block; 
}
.navbar, .navbar ul {
  list-style-type: none;
}
.navbar {
  height: 30px;
  min-width: 470px;
}
.navbar li {
  float: left;
  position: relative;
  height: 100%;
}
.navbar li a {
  display: block;
  padding: 9px 17px;
  color: #000;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
}
.navbar ul li { 
	float: none; 
}
.navbar li:hover { 
	background-color: #80C4F1;
	border-radius: 5px; 
}*/

/*Работа с остальным контентом*/
.main-content{
    overflow: hidden;
}
h1 {
	text-align: center;
}
p {
	padding-bottom: 10px;
	text-indent: 15px;
}
.main-content h1{
    margin-bottom: 20px;
     font-size: 24px; 
     font-family: 'Times New Roman', Times, serif;
    font-weight: normal;
}
article{
    width: 670px; padding: 30px 30px 32000px 30px; 
    margin-bottom: -32000px; float: left; 
    background: #fff;
    border-radius: 5px 5px 0px 0px; 
}
aside{
    float: right; padding: 10px 10px 32000px 10px; 
    width: 209px;background: #fff; 
     margin-bottom: -32000px;
    font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
     font-size: 14px;
     border-radius: 5px 5px 0px 0px; 
}
footer{
    padding: 20px 0;
    background: #4478B4;
    color: #E3F1FC;
    border-radius: 0px 0px 5px 5px;
   	margin-top: 5px;
}
/*Работа с изображением*/
.img_right {
float:right;
margin: 5px 0px;
transition: all 0.5s linear 0s;
z-index: 1;
}

.img_right:hover {
position: fixed;
max-height: 280px;
max-width: 300px;
transform:scale(2) translate(-98px, -52px);
}
/*Работа с таблицами*/

table {
	font-size: 12px;
}

th {
	padding: 5px 10px;
}
td {
	padding: 5px 10px;
}
caption {
	margin-top: 10px;
	margin-bottom: 5px;
	text-align: left;
}
/*работа со списком*/
.list {
/* убираем стандартную нумерацию */
list-style: none; 
/* Идентифицируем счетчик и даем ему имя li. 
Значение счетчика не указано - по умолчанию оно равно 0 */ 
counter-reset: li; 
}
.list li:before {
/* Определяем элемент, который будет нумероваться — li. 
Псевдоэлемент before указывает, что содержимое, вставляемое 
при помощи свойства content, будет располагаться перед пунктами 
списка. Здесь же устанавливается значение приращения счетчика 
(по умолчанию равно 1). */
counter-increment: li; 
 /*С помощью свойства content выводится номер пункта списка. 
 counters() означает, что генерируемый текст представляет 
 собой значения всех счетчиков с таким именем. 
 Точка в кавычках добавляет разделяющую точку между цифрами, 
 а точка с пробелом добавляется перед содержимым каждого пункта с
 писка */
content: counters(li,".") ". "; 
}
.marker {
  color: red;
}