@charset "utf-8";
body {
	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
	background: #d7d5d2;
	margin: 0;
	padding: 0;
	color: #000;
}

/* ~~ Селекторы элементов/тегов ~~ */
ul, ol, dl { /* Из-за различий между браузерами рекомендуется обнулять поля в списках. Для согласованности можно указать нужные величины либо здесь, либо в элементах списка (LI, DT, DD), которые они содержат. Помните, что сделанное здесь последовательно включается в список .nav, если только не будет прописан более конкретный селектор. */
	padding: 0;
	margin: 0;
}
h1, h5, h6, p {
	margin-top: 0;	 /* удаление верхнего поля позволяет обойти проблему выхода полей за границы содержащего их контейнера DIV. Оставшееся нижнее поле отделит его от любых последующих элементов. */
	padding-right: 15px;
	padding-left: 15px; /* добавление боковых полей к элементам внутри контейнеров DIV, а не к самим контейнерам избавляет от необходимости расчетов рамочной модели. В качестве альтернативы можно использовать вложенный контейнер DIV с боковыми полями. */
}
h1 {
	margin-top: 0;
	color:#da7406;
	font-family: Palatino Linotype;
	padding-right: 15px;
	padding-left: 15px;
	font-size:20px;
}
h2 {
	margin-top: 0;
	color:#5f1687;
	font-family: Arial, Helvetica, Sans-serif;
	padding-right: 15px;
	padding-left: 50px;
	font-size:18px;
}
h3 {
	margin-top: 0;
	color:#6d4d7e;
	font-family: Arial, Helvetica, Sans-serif;
	padding-right: 15px;
	padding-left: 15px;
	font-size:17px;
}
h4 {
	margin-top: 0;
	color:#785b9c;
	font-family:  Arial, Helvetica, sans-serif;
	padding-right: 15px;
	padding-left: 15px;
	font-size:17px;
	display: block;
	border: 1px  dotted #595b16;
	
	}
h5 {
	font-family:  Arial, Helvetica, sans-serif;
	margin-top: 0;	
	padding-right: 15px;
	padding-left: 15px; 
	color:#78854c;
	font-size:13px;
}
a img { /* этот селектор убирает стандартную синюю рамку, которая появляется у изображений в некоторых браузерах, если вокруг изображения есть ссылка */
	border: none;
}

/* ~~ Оформление ссылок на вашем сайте должно оставаться в этом порядке, включая группу селекторов, создающих эффект наведения. ~~ */
a:link {
	color:#4c1b63;
	font-size:10px;
	text-decoration: none; /* если только ссылки не должны выглядеть исключительно своеобразно, то для быстрого зрительного распознавания рекомендуется использовать подчеркивание */
	font-weight: bold;
}
a:visited {
	color:#4c1b63;
	text-decoration: none;
	font-size:10px;
	font-weight: bold;
}
a:hover, a:active, a:focus { 
	text-decoration: none;
	font-size:10px;
	color:#5e7807;
	font-weight: bold;
}
a.mn2:link {
	color:#4c1b63;
	font-size:13px;
	text-decoration: none; 
	font-weight: bold;
}
a.mn2:visited {
	color:#4c1b63;
	text-decoration: none;
	font-size:13px;
	font-weight: bold;
}
a.mn2:hover, a:active, a:focus { 
	text-decoration: none;
	font-size:13px;
	color:#5e7807;
	font-weight: bold;
}
a.cp1:link {
	color:#201128;
	text-decoration: none;
	font-weight: bold;
	font-size:12px;
}
a.cp1:visited {
	color: #4b3a55;
	font-weight: bold;
	text-decoration: none;
}
a.cp1:hover, a.cp:active, a.cp:focus {
	color: #5b8207;
	text-decoration: none;
	font-weight: bold;
}
a.cp:link {
	color:#fff;
	text-decoration: none;
	font-weight: bold;
	font-size:12px;
}
a.cp:visited {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
}
a.cp:hover, a.cp:active, a.cp:focus {
	color: #f6d263;
	text-decoration: none;
	font-weight: bold;
}
a.arxl:link {
	color:#73920b;
	text-decoration: none;
	font-weight: bold;
	font-size:17px;
}
a.arxl:visited {
	color: #73920b;
	font-weight: bold;
	text-decoration: none;
	font-size:17px;
}
a.arxl:hover, a.arxl:active, a.arxl:focus {
	color: #5f1687;
	text-decoration: underline;
	font-weight: bold;
	font-size:17px;
}
a.arxl2:link {
	color:#73920b;
	text-decoration: none;
	font-weight: bold;
	font-size:13px;
}
a.arxl2:visited {
	color: #73920b;
	font-weight: bold;
	text-decoration: none;
	font-size:13px;
}
a.arxl2:hover, a.arxl2:active, a.arxl2:focus {
	color: #5f1687;
	text-decoration: underline;
	font-weight: bold;
	font-size:13px;
}

a.cnt:link {
	color:#d67527;
	text-decoration: none;
	font-weight: normal;
	font-size:12px;
}
a.cnt:visited {
	color: #d67527;
	text-decoration: none;
	font-weight: normal;
	font-size:12px;
}
a.cnt:hover, a.cnt:active, a.cnt:focus {
	color: #73920b;
	text-decoration: underline;
	font-weight: normal;
	font-size:12px;
}
/* ~~ этот контейнер окружает все остальные контейнеры DIV, задавая их ширину на процентной основе ~~ */
.brd {
	width: 85%;
	max-width: 1062px;
	min-width: 782px;
	background: #306;
	margin: 0 auto; 
}
.container {
	width: 100%;
	max-width: 1060px;/* желательно задать максимальную ширину, чтобы макет не стал слишком широким на большом экране. Это повышает удобство чтения строк. В IE6 это объявление не соблюдается. */
	min-width: 780px;/* желательно задать минимальную ширину, чтобы макет не стал слишком узким. Это повышает удобство чтения строк в боковых столбцах. В IE6 это объявление не соблюдается. */
	background: #fbf7f3;
	margin: 0 auto; /* автоматическое задание величин по бокам в совокупности с шириной центрирует макет. Это необязательно, если ширина контейнера составляет 100 %. */
}

/* ~~верхнему колонтитулу не задана ширина. Он растянется по всей ширине макета. Он содержит заполнитель для изображения, который должен быть заменен логотипом по ссылке~~ */
.header {
	background-image: url(img/bg.png);
	text-align: center;
	vertical-align: bottom;
}

/* ~~ Информация по макету. ~~ 

1) Поля размещены только вверху и/или внизу DIV. Элементы в этом DIV имеют боковые поля. Это избавляет пользователя от необходимости расчетов рамочной модели. Помните, что при добавлении боковых полей или границы к самому DIV их ширина будет добавлена к задаваемой ширине, что образует "полную" ширину. Кроме того, можно удалить поля элемента в DIV и поместить внутри него второй DIV без ширины и с необходимыми по проекту полями.

*/
.tp {
	background: #FFF;
	height: 4px;
}
.plr {
	background: #000;
	height: 14px;
}
.tp2 {
	background: #894f20;
	height: 1px;
}
.tp3 {
	background: #d3d1d2;
	height: 1px;
}
.tpict {
	background-image: url(img/pict.jpg);
	height: 341px;
}
.bt1 {
	color:#fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}
.bt2 {
	color:#fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}
.txt {
	color:#4c4c4c;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	text-align:justify;
}
.txt2 {
	color:#4c4c4c;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	text-align:right;
}
.txt3 {
	color:#c86906;
	font-family: Palatino Linotype;
	font-size: 18px;
	text-align:right;
	font-weight: bold;
}
.txt4 {
	color:#4c4c4c;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	text-align:justify;
	margin-left:24px;
}
.content {
	padding: 6px 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	text-align:justify;
}

/* ~~ Этот сгруппированный селектор выдает списки в пространстве .content ~~ */
.content ul, .content ol { 
	padding: 0 15px 15px 40px; /* это поле зеркально повторяет правое поле в правиле для заголовков и параграфов выше. Внизу поле помещено как граница между элементами списков, а слева - как отступ. Поля можно настраивать по желанию. */
}

/* ~~ Нижний колонтитул ~~ */
.footer {
	padding: 10px 0;
	background: #62506c;
}

/* ~~ прочие классы float/clear ~~ */
.fltrt {  /* этот класс можно использовать для обтекания элемента справа на странице. Обтекаемый элемент должен предшествовать элементу, с которым он должен находиться рядом на странице. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* этот класс можно использовать для обтекания элемента слева на странице. Обтекаемый элемент должен предшествовать элементу, с которым он должен находиться рядом на странице. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* этот класс можно поместить в теге <br /> или в пустом блоке DIV в качестве конечного элемента, следующего за последним обтекаемым DIV (внутри #container), если .#footer удален или извлечен из #container */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
ul#navmenu-v,
ul#navmenu-v li,
ul#navmenu-v ul {
  margin: 0;
  border: 0 none;
  padding: 0;
  width: 260px; 
  list-style: none;
  z-index:10;
}

ul#navmenu-v:after {
  clear: both;
  display: block;
  font: 1px/0px serif;
  content: ".";
  height: 0;
  visibility: hidden;
}

ul#navmenu-v li {
  float: left; 
  display: block !important; 
  display: inline; 
  position: relative;
  border:#fffbf5 2px solid;
  border-bottom:#29105a 1px solid;
  background: #e3e3e3;
  opacity: 0.85; /* степень прозрачности */
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=85);
  
}
ul#navmenu-v li ul li {
border:none;
border-bottom:#676711 1px solid;
border-top:#fff 1px  solid;
}

/* Root Menu */
ul#navmenu-v a {
  padding: 0 6px;
  display: block;
  color: #306;
  font: bold 11px/28px Verdana, Arial;
  text-decoration: none;
  height: auto !important;
  height: 1%; 
}


ul#navmenu-v a:hover,
ul#navmenu-v li:hover a,
ul#navmenu-v li.iehover a {
  background: #fff;
  color: #a43606;
  font: bold 11px/28px Verdana, Arial;
 }

a.button {
  display: inline-block;
  color: white;
  text-decoration: none;
  margin: 9px;
  padding: 8px;
  outline: none;
  border-width: 2px 0;
  border-style: solid none;
  border-color: #FDBE33 #000 #D77206;
  border-radius: 6px;
  background: linear-gradient(#d79807, #E38916) #E38916;
  transition: 0.2s;
  font: bold 14px;
} 
a.button:hover { background: linear-gradient(#f5ae00, #f59500) #f5ae00; }
a.button:active { background: linear-gradient(#f59500, #f5ae00) #f59500; }


.line {
    background:url(img/line_horz.gif) top center repeat-x; height:1px; width:100%;

    }
	
.line2 {
    background::#ba7347;

    }
.arx {
  padding: 6px 0px 2px 10px;
  display: block;
  height:30px; 
  width:200px;
  float:right;
  text-align:left;
  border-left:#676711 1px dotted;
  vertical-align: middle;
    }
.arx5 {
  padding: 6px 0px 2px 10px;
  display: block;
  height:30px; 
  width:100px;
  float:right;
  text-align:left;
  border-left:#676711 1px dotted;
  vertical-align: middle;  
    }
.arx2 {
  padding: 6px 0px 2px 10px;
  display: block;
  height:30px; 
  width:334px;
  float:right;
  text-align:left;
  border-left:#676711 1px dotted;
  vertical-align: middle;
    }
.arx3 {
  padding: 6px 0px 2px 10px;
  display: block;
  height:30px; 
  width:334px;
  float:right;
  text-align:left;
  vertical-align: middle;
    }
	.arx8 {
   padding: 6px 0px 2px 10px;
   display: block;
   float:right;
   margin-right: 10%;  
    }
.arx4 {
  padding: 6px 16px 2px 10px;
  display: block;
  height:30px; 
  width:334px;
  float:right;
  text-align:right;
  vertical-align: middle;
    }
.abst {
	padding: 5px;
	font-family: Sans-serif;
	color: #383805;
	font-size: 13px;
	margin: 4px;
	text-align: left;
	text-align:justify;
	border-radius: 4px 4px 4px 4px;
	border:#585a01 1px;
	box-shadow: 0px 0px 2px 1px #6a6b6c;
	 }
 #close {
	font-weight:bold;
	 position: absolute;
     top: 1px;
	 right: 1px;
	 padding: 0px 3px 0px 3px;
	 margin: 0px;
	 }
	 
.menu {
	display: block;
    min-height:450px;
	height:100%;
    width:98%;
	border:none;
	 }
#block1{
    float: left; 
    width: 40%;
	margin-left: 5%;
}
#block2{
    margin-left: 50%;
	margin-right: 5%
}	 
ul#linemen {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
	display: flex;
    justify-content: center;
	position: -webkit-sticky; /* Safari */
    position: sticky;	
	top: 0;
  }

  li#linemen {
    float: left;
	
  }

  li#linemen a {
    display: block;
    color: white;
    text-align: center;
    padding: 5px 42px;
    text-decoration: none;
	font-size:10px;
  }

  li#linemen a:hover {
    background-color: #111;
	font-size:9,5px;
  }
  ul#linemenru {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
	display: flex;
    justify-content: center;
	position: -webkit-sticky; /* Safari */
    position: sticky;	
	top: 0;
  }
  li#linemenru {
    float: left;
  }

  li#linemenru a {
    display: block;
    color: white;
    text-align: center;
    padding: 10px 32px;
    text-decoration: none;
	font-size:11px;
  }

  li#linemenru a:hover {
    background-color: #111;
	font-size:11px;
  }
  .active {
    background-color: #63506e;
  }
  .meli {
	width: 100%;
	background-color: #333;
	display: flex;
    justify-content: center;
    
}
  ul#linem2 {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #63506e;
	display: flex;
    justify-content: center;
    top: 1;
	border-top: 4px solid white;
  }

  li#linem2 {
    float: left;
  }

  li#linem2 a {
    display: block;
    color: white;
    text-align: center;
    padding: 4px 24px;
    text-decoration: none;
	font-size:10px;
  }

  li#linem2 a:hover {
    background-color: #48275a;
	font-size:10px;
  }
  ul#linem2ru {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #63506e;
	display: flex;
    justify-content: center;
    top: 1;
	border-top: 4px solid white;
  }
li#linem2ru {
    float: left;
  }

  li#linem2ru a {
    display: block;
    color: white;
    text-align: center;
    padding: 3px 25px;
    text-decoration: none;
	font-size:11px;
  }

  li#linem2ru a:hover {
    background-color: #48275a;
	font-size:11px;
  }
  .meli2 {
	width: 100%;
	background-color: #63506e;
	display: flex;
    justify-content: center; 
	border-top: 1px solid white;
}
ul#linem3 {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #beb6c3;
	display: flex;
    justify-content: center;
    top: 1;
	border-top: 3px solid white;
	border-bottom: 2px solid #625669;
	
  }

  li#linem3 {
    float: left;
	
  }

  li#linem3 a {
    display: block;
    color: #230c30;
    text-align: center;
    padding: 3px 25px;
    text-decoration: none;
	font-size:10px;
  }

  li#linem3 a:hover {
    background-color: #63506e;
	color: white;
	font-size:10px;
	
  }
  li#linem3ru a {
    display: block;
    color: #230c30;
    text-align: center;
    padding: 3px 19px;
    text-decoration: none;
	font-size:11px;
	line-height: 28px;
  }

  li#linem3ru a:hover {
    background-color: #63506e;
	color: white;
	font-size:11px;
	
  }
     .parent {
    display: flex;
    justify-content: left;
}
.child {
    width: 25%;
}
.obl {
    float: right;
	width: 30%;
	padding: 6px;
}

.btn {
	width: 200px;
  padding: 10px 20px;
  margin: 2px;
  border: none;
  cursor: pointer;
  font-size: 16px;
  transition: all 0.3s ease;
  float:right;
}

/* 1. Pulse Animation */
.btn-pulse {
  background-color: #84469d;
  color: white;
  animation: pulse 1.7s infinite;
}

@keyframes pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}