h1
{
	margin:0; padding:0;
	font-size:22px;
	font-weight: bold;
	font-family: Georgia;
	margin-bottom:15px;
	margin-top: 20px;
	padding-bottom:5px;
	padding-top:14px;
	border-top:2px solid #a8a6a0;
}

h2, h3
{
	font-size:120%;
}

h2
{
	padding-top:15px;
	padding-bottom:5px;
	border-bottom:1px solid #CCCCCC;
}

h4, h5, h6
{
	font-size:110%;
}

.header_title{
	font-family: Georgia;
	font-size: 24px;
	color: #262522;
	font-weight: bold;
	font-variant: small-caps;
}

.header_title_text{
	font-family: Georgia;
	font-size: 18px;
	color: #262522;
	font-weight: bold;
	font-variant: small-caps;
	line-height: 1.5;
}

@media only screen
  and (min-device-width: 320px)
  and (max-device-width: 1185px)
{
	.header_title{
font-size: 16px;
}
	.header_title_text{
font-size: 15px;
}
}

.header_arkh{
	font-family: Georgia;
	font-size: 12px;
	color: #36342e;
	font-style: italic;
	letter-spacing: 6px;
}

.magazine_link{
	color: #1896e4;
	font-size: 12px;
	font-family: Arial;
	font-style: italic;
	text-decoration: underline;
}

.magazine_link:hover{
	text-decoration: none;
}

/*Information block*/
.information-block
{
	width:180px;
	margin-bottom:16px;
}

.information-block-head
{
	color:#BC262C;
	font-weight:bold;
	font-size:85%;
	border-bottom:1px solid #CCCCCC;
	margin-bottom:4px;
	padding-bottom:5px;
}

.information-block-body
{
	font-size:85%;
	color:#737373;
	margin-right:20px;
}

/*Content block*/
.content-block
{
	border-top-color:#E4E4E4;
	background:#F5F5F5;
	margin-bottom:5px;
	width:100%;
}

.content-block-head
{
	background-image:url(images/content_block_bg.gif);
	font-weight:bold;
	font-size:95%;
	margin:2px;
	padding: 5px 9px;
}

.content-block-body
{
	padding:4px 5px;
	width:100%;
}

code
{
	font-size:100%;
	font-weight:normal;
	display:block;
	padding:1.5em 1em 1em 1em;
	border-style:solid;
	border-width:1px;
	border-width:1px 0;
	margin:1em 0;
	background-color:#F5F5F5;
	font-family:sans-serif;
}
/*---------*/
.video {
color: #333333;
    font-family: Arial;
    width:100%;
    padding-bottom:15px;
    border-bottom:1px solid #a8a6a0;
}
.main_page_h2 {
    font-family: Georgia;
    font-size: 18px;
    font-weight: normal;
}
.video_item {
    width:180px;
    border:1px solid #dcdbd8;
    padding:9px;
display: inline-block;
margin: 9px;
}
.video_item__inner {
    width:178px;
    height:111px;
    background-size:100% auto;
    position:relative;
    display:block;
}
.video_item__inner:before {
    content:"";
    position:absolute;
    background:url("../video_play.png") 0 0 no-repeat;
    width:38px;
    height:38px;
    top:50%;
    margin-top:-19px;
    left:50%;
    margin-left:-19px;
}
.video__title {
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;
    color:#4f4d47;
    display:inline-block;
    vertical-align:top;
    margin:10px 0 0 0;
}
.video__title:hover {
    text-decoration:none;
}
/*fieldset_frame*/
.fieldset_frame{
border: 1px solid rgba(141, 141, 141, 0.2);
box-shadow: 0px 0px 10px 0 rgb(0 0 0 / 20%);
border-radius:10px;
}
.legend_frame{
box-shadow:-1px -3px 20px 18px white;
background-color:rgba(255, 255, 255, 0.8);
border-radius:15px;
font-size:18px;
font-weight:bold;
}

/*details_box*/

details{
  display:block;
  background: #fff;
  box-shadow: 0 10px 15px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  border-radius: 8px;
  overflow:hidden;
  margin-bottom: 3.5rem;
  outline:none;
  cursor:pointer;
}
summary::-webkit-details-marker{display:none;}
summary::-moz-list-bullet{list-style-type:none;}
summary::marker{display:none;} 
summary {
   display:block;
   font-weight: bold;
   padding: .5em 1em .5em .9em;
   font-size:1.4em;
   cursor: pointer;
   position: relative;
}
summary:before {  
  top: .4em;
  right: .3em;
  color: transparent;
  background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTYuNTkgOC41OUwxMiAxMy4xNyA3LjQxIDguNTkgNiAxMGw2IDYgNi02eiIvPjxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz48L3N2Zz4=") no-repeat 50% 50% / 1em 1em;
  width: 1em;
  height: 1em;  
  content: "";
  position: absolute;
  transition: transform .5s;
}
details[open] > summary:before {
  transform: scale(1,-1);
}
summary ~ * {
   padding: 0 1em 10px 1.4em;
}
details[open] summary ~ *{ 
  animation: slide .9s ease-in-out;
}

details[open] summary ~ div{ 
  animation: slide .9s ease-in-out;
}
@keyframes sweep {
  0%    {opacity: 0;}
  100%  {opacity: 1;}
}

@keyframes slide {0% { opacity: 0; transform:  translate(0, -10px); }

}
/*details_box*/