@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed&display=swap');

@font-face {
    font-family: 'latoblack';
    src: url('../font/lato-black.eot');
    src: url('../font/lato-black.eot?#iefix') format('embedded-opentype'),
         url('../font/lato-black.woff') format('woff'),
         url('../font/lato-black.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

*{
	margin:0;
	padding:0;
}
a{
	text-decoration:none;
}
h1{
    font-family: 'latoblack';
    color:#2d2e2e;
}
html, body {
    height: 100%;
}

body{
    font-family: 'Roboto', sans-serif;
	font-size:16px;
	background-color:#fff; 
}
.top-bar{
	background:#2da397;
}
.top-bar-container{
	max-width:1300px; margin:0 auto; padding:7px 0px 5px 0px;
	overflow:hidden; position: relative;   
}
.element{
	 justify-content:space-between; box-sizing: border-box;
}
.element:first-child {
	margin-right:auto;
}
.element:last-child {
	margin-left:auto;
}
.lang-head{
    float:left;
}
.top-bar-center{
   
}
.top-bar-left{
  float:left;	
}
.top-bar-center .info-box{
        margin-right:20px; height: 27px; float:left;
    }
    .top-bar-center .info-box.link {
       background: url("../images/link.png") left 0px no-repeat;
       padding-left:40px;
    }
    .top-bar-center .info-box .info-text-top{
        font-size: 15px; color:#336; font-family: 'latoblack';
    }
    .top-bar-center .info-box .info-text-bottom{
        font-size: 15px; margin-top:3px;
    }
    .top-bar-center .info-box .info-text-bottom a{
        color:#eefbf3;
    }
    .top-bar-center .info-box .info-text-bottom a:hover{
        color:#2da397;
    }
.top-bar-right{
	float:right;
}  
.header{
	position:relative;
	background-image: url(../images/bg-header.jpg);
	background-size:cover; background-position: center;
	background-repeat:no-repeat; margin-bottom:20px;
}
.header::after{
	content:""; width:100%; height:100%;
	position:absolute; left:0; top:0;
	background-color: rgba(0,0,0,0.2);
}
.header-container{
	max-width:1300px; height:350px; margin:0 auto; 
}
.anim-con {
    max-width:240px; margin:0 auto; 
	position:relative; top:15%; z-index:1;
}
.circle{
    width:240px; height:240px;	
}
.logo{
	position:absolute; top:45px; left:45px;
}
.logo img{
	width:150px;
}

/* Поиск */
.search-head{
	float: left;
}
.search{
			overflow:hidden;
		}
			.search input{
				float:left; outline:none;
			}
			.inputbox{
				width:250px; height:38px; padding:0 10px; font-weight:100; background:#fff; font-style: italic;
	            font-size:14px; color:#555;  border: none; font-family: 'Roboto', sans-serif;
			}
			.button{
				background: #fff url(../images/srch.png) no-repeat center center;
                width:50px; height:38px;
				border: none; cursor: pointer; transition: all 0.3s ease-out;
			}          
/* Поиск */			
/* Main Menu */
.main-menu{
	font-size:16px; max-width:1300px; margin: 0 auto;
}
/*.main-menu li{
	float:left; padding:10px 15px;
	list-style:none;
}
.main-menu li a{
	color:#fff; text-decoration:none;
}
.main-menu li a:hover{
	text-decoration:underline; color:#ffe8c4;
}*/
.slide-contain{
    width:100%; height:auto; margin:0px auto 20px auto; 
}
/* Main Menu */
.top-menu-main{
	background: none; width: 100%;
}
.grue-menu{
   background:none!important;   
}
.icon-menu{
	float:right; overflow:hidden;
}
.icon-menu li{
	float:left; font-family: 'Ubuntu', sans-serif;
    margin:5px 15px 0 0;
    list-style:none;
}
.icon-menu li a{
	color:#fff; display:block;
}
.icon-menu li a:hover{
	text-decoration:underline;
}
.icon-menu li a img{
   width:32px; height:32px;
   vertical-align:middle; margin-right:8px;
}
.icon-menu li a .image-title{   
   color:#fff; font-size:16px;
}
.container{
	
}
.main-content{
	max-width:1300px; margin:0 auto 20px auto;
    position: relative; min-height:100%;
}
.main-content-img{
	margin-bottom:20px;
}
.content{
	max-width:100%; background:#fff;
}
.main-gallery{
    max-width:100%; background:#2da397; padding:30px 0 10px 0;
    background-image: url(../images/bg-decor.png);
}
.gallery-content{
    max-width:1300px; margin:0 auto;
}
.page-single-head{
    overflow:hidden; margin-bottom:20px;
}
.page-single-head h1{
    font-size:32px;
}
.articles-content{
    padding:20px 30px 10px 30px; background:#fff;
}
.main-info{
    padding:25px 25px 0 25px; margin-bottom:20px;
}
.main-info p{
    margin-bottom:25px;
}
.modtitle h1{
    color:#2d2e2e; font-family: 'latoblack'; font-size:25px;
    position: relative; margin:0 0 30px 0; padding-bottom:10px;
}
.modtitle, .modtitle-gr{
    text-align:center;
}
.modtitle h1:after{
  content: "";
  height: 20px;
  width: 100%;
  position: absolute;
  background: url(../images/bg-st.png) no-repeat center;
  top: 100%;
  left: 0;
  z-index: 1;
}
.modtitle-gr h1{
    color:#fff; font-family: 'latoblack'; font-size:25px;
    position: relative; margin:0 0 30px 0; padding-bottom:10px;
}
.modtitle-gr h1:after{
  content: "";
  height: 20px;
  width: 100%;
  position: absolute;
  background: url(../images/bg-stud-white.png) no-repeat center;
  top: 100%;
  left: 0;
  z-index: 1;
}    
.section1-flex, .section2-flex{
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.sec1-info{
    width: 100%;
}
.section1-info-box {
    width: 31%;
}
.section1-item {
    width: 100%;
    margin-bottom: 30px;
}
.align-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.sec1-item-left{
   display:inline-block!important; color:#48497f; background:#2d3e50;
   padding:0 25px 0 25px; height:55px; border-radius:50%; line-height:55px; 
}
.sec1-item-left p{
   font-size: 20px; font-weight:700; color:#fff;
}
.sec1-item-right p, .sect2_bottom p{
   font-size: 17px; font-weight:500; text-align:left;
   color: #2d2e2e; line-height:22px;
}
.sec1-item-right{
    width: calc(95% - 4.27em);
}
.sect2_bottom{
    padding:10px 15px 15px 15px;
}
.section2_element{
    display:flex;
	flex-direction:column;
	flex-basis:31%; align-items:center;
	margin:20px 0 20px 0; 
    background:#eefbf3; position: relative;
    border-top: 3px solid #2da397;
}
.sect2_img {
    line-height:0; margin-top:30px;
}
.sect2_img img {
    width:108px;
}
.sect2_title{
    position: absolute; top:-20px; left:auto; font-size:16px;
    line-height:normal; background-color: #2da397; text-transform:uppercase;
    padding: 8px 10px 8px 10px; border-radius:5px;
}
.sect2_title p{
    color:#fff;
}
.latest-news-main{
    padding:0px 20px 20px 20px; background-color:#fff;
}
.posts_block{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
.posts_element{
	display:flex;
	flex-direction:column;
    background-color:#f2f5f9;
	flex-basis:32%;
	margin:0 0 25px 0;
    box-shadow: 0 6px #eaecf1;
}
.posts_img{
    width:100%; height:250px; position:relative;
}
.posts_element a > div img{
	display:block; object-fit:cover;
	width:100%; height:100%;
}
.posts_element a > div img:hover{
	
}
.posts_info{
	display:flex;
	flex-direction:column;
	justify-content:space-between;
    flex-grow:1;
    padding:15px 20px;
}
.posts_info h3{
	margin-bottom:auto; margin-top:5px;
	font-size:18px; line-height:25px;
	color:#2d2e2e;
	font-weight:700;
	max-height: 52px;
    min-height: 52px;
	overflow: hidden;
    transition: all 0.3s ease-out;
}

.posts_info h3:hover{
	text-decoration:underline; color:#2da397;
}
.posts_date{
    position:absolute;
	bottom:-15px;
	right:10px;
	font-size:15px;
	color:#fff; background:#2da397;
    padding:10px; border-radius:5px;
}
.videos_block{
    display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
.video_element{
	display:flex;
	flex-direction:column;
	background-color:#ddd;
	flex-basis:32%;
	margin:0 0 20px 0;
}
.video_element a{
    position:relative;
}
.video_img{
    width:100%; height:270px;
}
.video_element a div > img{
	display:block;
	width:100%; height:auto;
}
.video_element  .video_img::after{
	content:"";
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	background-image:linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0));
}
.video_info{
    position:absolute;
	bottom:25px;
	left:20px;
	padding:0 20px 0 0;
}
.video_info h3{
	font-size:18px; line-height:25px;
	color:#fff; font-weight:700; max-height: 52px;
	overflow: hidden; transition: all 0.3s ease-out;
}
.video_info h3:hover{
	text-decoration:underline; color:#ddd;
}
.more-link-block{
    text-align:center;
}
.more-link{
   display:inline-block!important; color:#fff; background:#2d3e50;
   padding:0 20px 0 20px; height:50px; border-radius:5px;
   line-height:50px; text-transform: uppercase; font-size: 15px; font-weight:700;
   transition: all 0.3s ease-out;
}
.more-link:hover{
  background:#2da397; color:#fff!important;
}
.page-map{
    font-size:15px; padding:5px 0 5px 10px; margin-top:10px;
}
.page-map p{
    
}
    .page-map a span{
        color:#2da397; font-weight:bold; text-decoration:none; 
    }
    .page-map a span:hover{
        text-decoration:underline;
    }
    .page-map span.itemprop{
        color:#555;
    }
/* Блог */
.main-content .page-title{
	font-size:25px; margin-bottom:15px;
    color:#2d2e2e; font-family: 'latoblack';
}	
.articles{
    overflow:hidden; margin-bottom:25px;
}
.articles-header{
    margin-bottom:15px;	
}
.articles h1{
        font-size:20px; font-weight:700; line-height:30px;
        height:60px; overflow: hidden;
     }
     .bottom-line-h{
        margin:0;
     }
     .articles h1 a{
        color:#2d2e2e; text-decoration:none;
         -moz-transition: all 0.3s 0.01s ease;
         -o-transition: all 0.3s 0.01s ease;
         -webkit-transition: all 0.3s 0.01s ease;
     }
	 .articles h1 a:hover{
        text-decoration: underline; 
     }
.articles-introtext{
    overflow:hidden; height:50px; font-size: 16px;
}     
.articles p{
    text-align: justify; font-size: 16px;
}
    .articles-gen-img{
        float:left; margin-right:20px; position:relative; width:20%; max-height:265px;
    }
    .afisha-gen-img{
        line-height:0;
    }
    .articles-gen-img img{
        max-width:100%; display:block;
    }
    .afisha-gen-img img{
        width:100%; height:380px;
    }
        .articles-gen-img p{
           position:absolute; left:0; top:0; font-size:14px; font-weight:bold; display:inline-block;
           background:#f26c4f; color:#fff; padding:0 10px; height:35px; line-height:35px; border-radius:5px;
        }
        .articles-gen-img p span{
           display:block; font-size:24px; line-height:1; 
        }
.article-footer{
    font-size:14px; color:#000; overflow:hidden;
    margin:20px 0 0 0; background:#eefbf3;
}
.article-footer span.article-meta span{
    margin-right:15px;
}
    .article-footer span.article-meta{
        padding: 10px 0 0px 10px; float:left; margin:0;
    }
.article-meta span.article-meta-date img{
    margin-right:6px; vertical-align:middle; margin-top: -4px;
}
.article-meta span.article-meta-view img{
    margin-right:6px; vertical-align:middle; margin-top: -3px;
}
.article-meta span.article-meta-date{
	font-size:14px; color:#818181; font-weight:bold;
}
.article-meta span.article-meta-view{
	font-size:14px; color:#818181; font-weight:bold;
}
.article-footer a{
    text-decoration:none;
}	
.readmore{
   display:block; float:right;
   background:#2da397;
   font-weight:600;
   color:#fff;
   font-size:16px;
   padding:0 20px;
   height:40px;
   line-height:40px; border-radius:5px;
   transition: all 0.3s 0.01s ease;
}
.readmore:hover{
   background:#2d3e50;
}
.pager{
	overflow:hidden; padding:0 0 20px 0; margin-top:20px; clear:both;
}
	.pager li{
		float:left; list-style:none;
	}
		.pager li a{
			border: 1px solid #0086c8; color: #096766; display: block; font-size: 15px; margin: 0 5px 0 0;
			padding:9px 17px; transition: all 0.3s 0.01s ease;
		}
		.pager li a:hover{
			color: #fff; background:#0086c8;
		}
		.pager li a.now{
			color: #fff; background:#0086c8;
		}
		.pager li a.pager-dot{
			border:none;
		}
/* Блог */
/* Видео */
.video-block{
    display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
.video-item{
	display:flex;
	flex-direction:column;
	background-color:#ddd;
	flex-basis:32%;
	margin:0 0 20px 0; position:relative;
}
.video-gen-img{
    width:100%; height:270px;
}
.video-gen-img a img{
	display:block;
	width:100%; height:auto;
}
.video-gen-img a::after{
	content:"";
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	background-image:linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0));
}
.video-title{
    position:absolute;
	bottom:25px;
	left:20px;
	padding:0 20px 0 0;
}
.video-title h3 a{
	font-size:18px; line-height:25px;
	color:#fff; font-weight:700; max-height: 52px;
	overflow: hidden; transition: all 0.3s ease-out;
}
.video-title h3 a:hover{
	text-decoration:underline; color:#ddd;
}
.video-icon{
    position: absolute; width:35px; height:35px;
    top: 50%; left: 50%;
    margin-top: -20px; margin-left: -20px;
    background: url('http://form.zhofil.kz/images/icons/news-icon.png');
    box-sizing: border-box; z-index:3;
}
/* Видео */
/* Полный текст материала*/
.post-single{
    padding: 20px 10px 20px 10px;
}
.post-single-head{
    overflow:hidden; margin-bottom:20px;
}
.post-single-head h1{
    font-size:32px; margin-bottom:20px;
}
.post-single-head img{
    vertical-align:middle;
}
.post-single-head p{
    position:absolute; top:0; left:0; font-size:14px; background:#008141;
    color:#fff; text-transform:uppercase; padding:10px; text-align:center;
}
.post-single-head p span{
    display:block; font-size:24px; line-height:1;
}
.post-single-meta{
    float:left; font-size:14px; color:#818181;
}
.post-single-meta span{
    margin-right:20px;
}
.post-single-meta span.post-meta-date img{
    margin-right:5px; vertical-align:middle; margin-top:-5px;
}
.post-single-meta span.post-meta-view img{
    margin-right:5px; vertical-align:middle; margin-top:-3px;    
} 
.post-single p{
   margin:0 0px 20px 0px; line-height:24px; font-size:17px; text-align: justify;
   color:#333;
}
.post-single p a{
   color:#3498db;
}
.post-single-info p img{
   max-width:100%; height:auto; 
}
.clearfix{
   clear:both;
}
/* Полный текст материала*/ 		
.footer{
	background-color:#2d3e50; 
    padding:15px 0 15px 0; color:#fff;
}
.footer-main{
	max-width:1200px; margin:0 auto; text-align: center;
    font-size:15px; overflow:hidden; padding:40px 0 40px 0;
}