*, *:after, *:before {
   box-sizing: border-box;
   padding: 0; 
   margin: 0;
	}

@font-face { font-family: Comfortaa; src: url(fonts/Comfortaa.ttf);}


ul { list-style: none; }
a { text-decoration: none; outline: none; }
img { display: block; width: 100%; }
h1, h2, h3, h4, h5, h6 { font-family: 'Tahoma'; font-weight: normal; letter-spacing: 1px;}

body {
   font-family: sans-serif;
   font-size: 16px; line-height: 150%; 
   line-height: 1; 
   color: #373737;
   background: #f2f2f2;
   background-image: url(img/fon_osn.png);
	}
	
/* добавим очистку потока для всех контейнеров, внутри которых задано обтекание дочерних элементов */
header:after, .container:after, footer:after, .widget-posts-list li:after, #subscribe:after {
   content: "";
   display: table;
   clear: both;
}

 .parent {
        width: 100%;
        max-width: 940px;
        margin: 0 auto;
        display: flex;
        flex-wrap: wrap;
    }

    .child {
        width: 100%;
        box-sizing: border-box;
    }

    @media screen and (min-width: 940px) {
        .child {
            width: 50%;
        }
    }

/* стилевой класс, который управляет шириной контейнера сетки*/
.container {   
   margin: 0 auto; 
   width: 100%;
   max-width: 960px;
   padding: 0; 
}

header {   
   width: 100%;
   background: rgba(255,255,255, .97);
   box-shadow: 3px 3px 1px rgba(0, 0, 0, .05);
   padding: 15px 10px;
   margin-bottom: 30px;
   position: relative;
}

/* логотип */
.logo { 
   display: block; background: #fff;
   float: left; margin: 5px 0px 0px;
	}
	
.logo img{ width: 250px; background: #fff;}


#banners_468x60 {
	float: right; width:100%; max-width:468px; height:100%; max-height: 60px; 
	overflow: hidden; display: inline-block; position: relative; 
}

.posts-list {
   margin: 0 auto 30px;   background: rgba(255,255,255, .97);
   width: 100%;  padding: 15px; border-radius: 10px;
}

.post-cont {
   padding-bottom: 15px; font-family: Comfortaa;
   font-size: 15px; line-height: 140%; 
   font-weight: 400;
}

.post-grin {
   padding: 15px 0; font-family: Comfortaa;
   font-size: 15px; line-height: 140%; 
   font-weight: 500; color: #228B22;
}

.post-h1{
   margin-bottom: 15px; padding: 5px;
   font-size: 25px;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-weight: 600; 
   border-bottom: 2px solid #f9dd60;
   background: linear-gradient(90deg, rgba(255,255,255, 1), rgba(255,255,255, 0));
}



.block { 
	width: 100%;
	margin: 0px auto 20px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;  
	background: #FFF;
	border: 4px solid #f2f2f2;
	padding: 15px 15px 0px; 
}

.block-left {   
	width: 60%;
	float: left; 
	font-size: 20px;  
}

.block-left-content {   
	display: inline-block;
	width: 100%; 
	border-bottom: 2px solid #efefef;
}

.block-left-title {  
	float: left;  
	text-align: left; 
	line-height: 150%; 
	font-size: 25px; 
	color: #000; 
}

.block_span_off { 
	display: block; 
	padding: 2px 0px 5px; 
	width: 100%;	
	margin: 0px auto 10px; 
	border-bottom: 2px solid #efefef;
}

.block_span { 
	padding: 5px 0px; 
	margin-right: 5px;
	display: inline-block; 
	font-family: Comfortaa; 
	font-size: 15px; 
	color: #ffb400;  
	}
	
.block_link_bold { 
	padding: 5px 0;  
	display: inline-block; 
	font-size: 18px; 
	color: #0d60a3;   
	text-align: left;     
} 

.block_link_bold:hover { color: #FD5F00;  text-align: center;}

.block-right {  
	width: 40%; 
	float: right; 
	padding-left: 15px;
}

.block-img { 
	margin: 0px auto;
	width: 100%; 
	max-width: 400px; 
	border: 3px solid #f2f2f2;
}


.zn_cont { 
	margin: 0px auto;
	width: 100%; 
	display: table;
	text-align: center;
	font-family: Tahoma; 
	font-weight: 600;  	
	border-bottom: 5px solid #f2f2f2; 
	color: #0d60a3;
}

.zn_b_l {  
	display: table;
	background: #f2f2f2;  
	padding: 10px 0 0 10px; 
	width: 50%; 
	float: left; 
	border-right: 1px solid #0d60a3; 
}

.zn_b_r {   
	background: #f2f2f2; 
	padding: 10px 10px 0 0; 
	width: 50%; 
	float: right; 
	display: table; 
	border-left: 1px solid #0d60a3;
}

.zn_b_1 {  
	display: table; 
	margin: 0 auto; 
	padding-bottom: 5px; 
	font-size: 20px; 
}

.zn_b_2 { 
	margin-top: 5px;  
	width: 100%; 
	display: table; 
	padding: 10px 0 10px;  
	text-transform: uppercase; 
	font-size: 12px;
	border-top: 2px solid #0d60a3; 
}

footer {
   padding: 30px 0;
   background: rgba(255,255,255, .97);
   color: #625223; margin-top: 0px;  
}

.footer-title {  
	float: left;  
	text-align: left; 
	line-height: 150%; 
	font-size: 16px; 
	color: #000; 
}






@media (max-width: 768px) {
  
header {   
   margin-bottom: 10px;
}

.container { 
   width: 100%;
   padding: 10px;
	margin: 0 auto 0px;
}


.logo {
      float: none;
      margin: 0 auto 15px;
      display: table;
 } 
 .logo img{  width:100%; max-width: 250px; background: #fff;}

#banners_468x60 {
	margin: 0px auto; width:100%; max-width:468px; height:100%; max-height: 60px; 
	display: table; float: none;
} 

.block { 
	padding: 10px 10px 0px; 
}

.block-left {  
width: 100%;
float: left;
font-size: 20px; padding: 10px 10px 0px;
}

.block-right { 
width: 100%;
float: left; padding: 0 10px 10px;
}


.zn_cont { 
	margin: 0px auto 10px;
	width: 100%; 
	max-width: 400px; 
	border: 3px solid #f2f2f2;
}

footer {
   padding: 10px 0; margin: -15px auto 0px ;
   background: rgba(255,255,255, .97);
   color: #625223;
}
   
}

@media (max-width: 480px) {
   /* отменяем обтекание для логотипа и выравниваем по центру*/
   .logo {
      float: none;
      margin: 0 auto 15px;
      display: table;
   }
   .logo span {
      margin: 0 2px;
   }
   
#banners_468x60 {
	margin: 0px auto; width:100%;  
	display: table; float: none;
} 
}