/* -----------------------------------------------------------------------------------

	0.	CSS Reset & Clearfix
	1.	Document Setup
	2.  common styles
	98. Image Viewer
	99.	Responsive

----------------------------------------------------------------------------------- */


/* -------------------------------------------------------------------------------- */
/*	0. CSS Reset
/* -------------------------------------------------------------------------------- */


html, body { margin:0; padding:0;}

div, span, h1, h2, h3, h4, h5, h6, p, blockquote, address, big, cite, code, em, font, img, small, strike, sub, sup, li, ol, ul, fieldset, form, label, legend, button, table, caption, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	font-weight:normal;
	font-style:normal;
	font-size:100%;
	line-height: 1;
	font-family:inherit;
	text-align:left;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

ol, ul {
	list-style:none;
}

a { outline:none; }

input[type=search] {
   -moz-appearance:none;
   -webkit-appearance:none;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
	display: none;
}

div, a, img, h1, h2, h3, p, span, svg {
    -webkit-tap-highlight-color: transparent;
}


/* -------------------------------------------------------------------------------- */
/*	1. Document Setup
/* -------------------------------------------------------------------------------- */


body {
	background-color: hsl(0, 0%, 7%);
	border: none;
	color: hsl(0, 0%, 15%);
	font-family: 'Open Sans', sans-serif;
	font-size: 18px;
	margin: 0;
	padding: 0;
}

body * { -webkit-font-smoothing: antialiased; }

body a {
	color: inherit;
	text-decoration: none;
}

body a:hover {
	color: inherit;
	text-decoration: none;
}

* { 
	box-sizing: border-box; 
}

img {
	max-width: 100%;
	height: auto;
}

.hidden { display: none; }
.clear { clear: both; }
.fleft { float: left; }
.fright { float: right; }

::selection {
	background: #444;
	color: #FFF;
}

::-webkit-input-placeholder { color: #999; }
:-ms-input-placeholder { color: #999; }

em {
    font-style: italic;
}

/* -------------------------------------------------------------------------------- */
/*	2.  common styles
/* -------------------------------------------------------------------------------- */

html {

    /* тёмная тема */

    /* --font-color-green: hsla(110, 91%, 87%, 1);
    --font-color-top-links: hsla(0, 0%, 89%, 1);
    --font-color-text-block-1: hsla(0, 0%, 100%, 0.87);
    --font-color-text-block-2: hsla(0, 0%, 100%, 0.9);
    --font-color-text-block-2-a: hsla(0, 0%, 100%, 0.85);
    --font-color-article-type-1-footer: hsla(0, 0%, 100%, 0.7);
    --font-color-article-type-1-h4: hsla(278, 100%, 11%, 1);
    --font-color-dark-grey: hsl(0, 0%, 15%);

    --back-color-text-block-1: hsla(230, 28%, 13%, 0.32);
    --back-color-article-type-1: hsla(0, 0%, 0%, 0.25);
    --back-color-footer: hsla(0, 0%, 100%, 0.87); */

    /* светлая тема */

    --font-color-green: hsla(110, 91%, 87%, 1);
    --font-color-top-links: hsla(206, 57%, 99%, 89%);
    --font-color-text-block-1: hsla(0, 0%, 100%, 0.87);
    --font-color-text-block-2: hsl(206, 57%, 12%);
    --font-color-text-block-2-a: hsla(206, 57%, 12%, 0.85);
    --font-color-article-type-1-footer: hsl(206, 57%, 11%);
    --font-color-article-type-1-h4: hsla(278, 100%, 11%, 1);
    --font-color-dark-grey: hsl(0, 0%, 15%);

    --back-color-text-block-1: hsla(230, 28%, 13%, 0.32);
    --back-color-article-type-1: hsla(0, 0%, 100%, 0.76);
    --back-color-footer: hsla(0, 0%, 100%, 0.76);
}

#main_background {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: -1;
	overflow: hidden;
	background-position: 50% 50%;
	background-size: cover;
	background-repeat: no-repeat;
}

.all_content {
	max-width: 1290px;
	margin: 50px auto;
}

.text_green {
    color: var(--font-color-green);
}

.link_1 {
    transition-duration: 250ms;
}

.link_1:hover {
	text-decoration: underline;
    opacity: 1!important;
}

.top_links {
    color: var(--font-color-top-links);
    padding: 0 0 38px 0;
    box-sizing: border-box;
    text-align: left;    
}

.top_links .link_1 {
    opacity: 0.8;
}

.header_container {
	color: var(--font-color-top-links);
	padding: 10px 10px 10px 10px;
	box-sizing: border-box;
	text-align: center;
}

.header_container h1 {
	text-align: center;
    font-size: 280%;
    margin-bottom: 32px;
    word-spacing: 2.5px;
    letter-spacing: 0.2px;
    line-height: 113%;
}

.header_container h2 {
	text-align: center;
	max-width: 830px;
	margin: 0px auto 15px;
	font-size: 105%;
	line-height: 130%;
}

.links_block_1 {
	overflow: auto;
	display: grid;
	justify-items: stretch;
	align-items: center;
	grid-template-columns: repeat(3, 1fr);
	padding: 10px 10px 20px 10px;
	box-sizing: border-box;
}

.links_block_1 .link_1 {
	text-align: center;
	line-height: 130%;
}

.text_block_1 {
    display: block;
    font-size: 100%;
    line-height: 147%;
    text-align: justify;
    margin: 24px 0px 0px 0px;
    padding: 35px 142px 63px 142px;
    color: var(--font-color-text-block-1);
    background-color: var(--back-color-text-block-1);

}

.text_block_1 div, .text_block_1 p {
    margin-top: 25px;
    line-height: 146%;
    text-align: justify;
}

.text_block_2 {
	display: block;
    font-size: 100%;
    line-height: 131%;
    text-align: justify;
    margin: 28px 29px 31px 29px;
    color: var(--font-color-text-block-2);
}

.text_block_2 div {
    line-height: 131%;
    text-align: justify;
}

.text_block_2 a {
    border-bottom: 1px dotted var(--font-color-text-block-2-a);
}

.text_block_2 a:hover {
    border-bottom: 1px solid var(--font-color-text-block-2);
}

.subtitle_1 {
    display: block;
    font-size: 164%;
    line-height: 131%;
    text-align: justify;
    margin: 34px 29px 0px 29px;
    color: var(--font-color-text-block-2);
}

.main_content {
	overflow: auto;
	display: grid;
	justify-items: stretch;
	align-items: stretch;
	grid-template-columns: 1fr;
	padding: 10px 0px 40px 0px;
	box-sizing: border-box;
}

.article_type_1 {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    margin: 20px 0;
    padding: 0;
    background-color: var(--back-color-article-type-1);
    text-align: justify;
    overflow: hidden;
    /* max-width: 255px; */
}

.article_type_1_footer {
    display: grid;
    justify-items: right;
    font-size: 83%;
    line-height: 131%;
    margin: -14px 29px 25px 29px;
    color: var(--font-color-article-type-1-footer);
}

.footer_item_1 {
    padding: 0 0 5px 0;
    font-size: 115%;
}

.document_loaded .article_type_1, .document_loaded .img_container, .document_loaded .article_type_1 h3 {
	transition-duration: 340ms;
}

.article_type_1 .img_container {
	display: flex;
	/* min-height: 370px; */
	margin: 22px 0 0 0;
}

.article_type_1 .desc_container {
	
margin: 15px 15px 15px 15px;
}

.article_type_1 h4 {
	font-size: 122%;
	line-height: 134%;
	margin-bottom: 15px;
	/* font-weight: bold; */
	text-align: center;
	color: var(--font-color-article-type-1-h4);
}

.article_type_1 img {
	display: block;
	max-height: calc(100vh - 100px);
	margin: 12px auto 12px auto;
    transition-duration: inherit;
    cursor: pointer;
}

div.imagetitle {
    text-align: center;
    line-height: 131%;
    font-size: 94%;
}

.document_loaded .article_type_1:hover {

}

.document_loaded .article_type_1:hover img {

}

.document_loaded .article_type_1:hover h4 {

}

.footer_container {
	background-color: var(--back-color-footer);
	color: var(--font-color-dark-grey);
	padding: 30px;
	box-sizing: border-box;
	text-align: justify;
	font-size: 108%;
    line-height: 133%;
}

.footer_container h2 {
	font-size: 150%;
	text-align: center;
	margin: 10px 10px 20px 10px;
}

.footer_container div {
	margin: 10px;
	text-align: center;
}


@media (max-width: 1265px) {
	.header_container .links_container, .main_content, .top_links {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 870px) {
	.header_container .links_container, .main_content, .top_links {
		grid-template-columns: 1fr;
	}

    .header_container h1 {
        font-size: 210%;
    }

    .top_links {
        padding: 0 10px 27px 10px;
        text-align: center;
    }
    
    .text_block_1 {
        padding: 35px 15px 63px 15px; 
    }
}

/* -------------------------------------------------------------------------------- */
/*	98. Image Viewer
/* -------------------------------------------------------------------------------- */

.iv-close:hover {
	transform: none;
}

.iv-large-image {
	cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAOxAAADsQBlSsOGwAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAIjSURBVDiNjZPNS5RRFMafc+5977yONk4TCH1RiwrDvTNBXwsHEcuFQuD/ULiclQhB/4JQ+8KVLoZgBpIsFAWjTYs2WQptJHwXkuZ7595zWzQzDWNiv8XlcA7Pc56zuIQOCoXCpRDCc6XUbWbuAwAROfTer3nvH+/v739BF6pV9Pf3VzKZzGut9Q1mzlATZjZa62ta6ydRFOmjo6O3xwzy+fxsT0/PMyIirfXB6OjocqVSeTM+Pv6x0Wj82N7evhBCMFrru0qpTJqmyy0DyufzV40xW8zMAwMDW5ubmy+NMaFzi7WWhoeHp3d3d6+HEIJzbmhvb+8zADCAF8zMWuuD9fX1V91iADDGhI2NjQWl1CERkfd+vjXjKIpuAcDIyMhqNpuVbnGLOI6lXC6vAEAURcW2ATP3AsDk5OTOSeIWU1NTO01R3Ez/52k2j0XvxntPAEBE1NaJyCEALC0tXTnNoFqtXgYAEUkBCACwtfY9ANTr9TvWWjpJ7JyjWq12r1mvthOEEGZERJxzvaVSafpfJtZaKhaLj7z3fc3WTGtGAJDL5Waz2exTANBa/xwbG1uZmJj4rpTC4uLixVqtdt85d6bD8FuSJIMA/m7L5XJzcRzPMfOJZ3Sl+pokyc32X0jT9B0zL4jIIBGdJyINgETkV6PRWBORByJSVkqdAwCl1Nkoih7+17YOdKFQ+GSMGQQAERE+TdGFS5JkyFr7IYQg1trqb7R134u4PDMsAAAAAElFTkSuQmCC), auto;
    will-change: width, height, top, left;
}

.iv-snap-view {
	visibility: hidden;
}

/* -------------------------------------------------------------------------------- */
/*	99. Responsive
/* -------------------------------------------------------------------------------- */


@media (max-width: 1265px) {

	/* Post Content --------------------------------------- */

	.post-content .alignfull {
		margin-left: calc( ( 90vw - 700px ) / -2 );
		max-width: 90vw;
		width: 90vw;
	}
	
	.post-content .alignwide {
		margin-left: calc( ( 90vw - 700px ) / -4 );
		max-width: calc( 90vw - ( ( 90vw - 700px ) / 2 ) );
		width: calc( 90vw - ( ( 90vw - 700px ) / 2 ) );
	}

}

@media (max-width: 1100px) {
	
	
	/* Navigation --------------------------------------- */
	
	/* fix submenu hover on touch */
	
	.main-menu li ul {
		opacity: 1;
		display: none;
	}

	.main-menu > li:hover > ul,
	.main-menu ul li:hover > ul { 
		display: block;
	}
	
	
}


@media (max-width: 1040px) {

	/* header */
	
	.home-first-page .title-section .section-inner { padding: 100px 0; }
	
	/* main content */

	.post-container {
		width: 49.75%;
		padding: 0 1.5% 3% 1.5%;
	}
	
	/* single post */
	
	.post-nav-fixed { display: none; }
	
			
}


@media (max-width: 1000px) {
	
	
	/* navigation */
	
	.main-menu,
	.navigation .section-inner .menu-social { display: none; }
	
	.toggle-container { display: block; }
	
	.mobile-menu li { border-top: 1px solid #333; }
	
	.mobile-menu a {
		display: block;
		padding: 25px 8%;
		font-size: 0.9em;
		color: #999;
	}
	
	.mobile-menu a:hover { 
		background: #ca2017; 
		color: #fff;
	}
	
	.mobile-menu ul a { padding-left: 12%; }
	.mobile-menu ul ul a { padding-left: 16%; }
	.mobile-menu ul ul ul a { padding-left: 20%; }
	.mobile-menu ul ul ul ul a { padding-left: 24%; }
	
	.mobile-menu-container .menu-social {
		border-top: 1px solid #333;
		padding: 30px 8%;
	}
	
	.mobile-menu-container .menu-social .menu-items { text-align: center; }
	
	.mobile-menu-container .menu-social li {
		display: inline-block;
		margin: 0 3px;
	}
	
	.mobile-menu-container .menu-social a { background-color: #2d2d2d; }
	.mobile-menu-container .menu-social a:hover { background-color: #ca2017; }
	
	
}


@media ( max-width: 925px ) {


	/* Post Content --------------------------------------- */

	.post-content .alignfull {
		margin-left: calc( ( 90vw - ( 90vw * .84 ) ) / -2 );
	}

	.post-content .alignwide {
		margin-left: calc( ( 90vw - ( 90vw * .84 ) ) / -4 );
		max-width: calc( 90vw - ( ( 90vw - ( 90vw * .84 ) ) / 2 ) );
		width: calc( 90vw - ( ( 90vw - ( 90vw * .84 ) ) / 2 ) );
	}


}


@media ( max-width: 900px ) {
	
	
	/* widget area */
	
	.widget-area .column { width: 47.5%; }
	
	.widget-area .column:nth-child(3) { display: none; }
	
	
}


@media ( max-width: 800px ) {
	
	
	/* structure */
	
	.section-inner { max-width: 95%; }
	
	/* title section */
	
	.home-first-page .title-section .section-inner,
	.title-section .section-inner { padding: 71px 0 66px; }
	
	.bg-image.master,
	.bg-shader.master {
		height: 600px;
	}
	
	/* widget area */
	
	.widget-area .column { width: 47.5%; }
	
	.widget-area .column:nth-child(3) { display: none; }
	
	/* post formats */
	
	.single-post .post-quote blockquote { font-size: 1.6em; }
	
	.single-post .post-link p { font-size: 1.6em; }


	/* Post Content --------------------------------------- */

	.post-content .alignfull {
		margin-left: calc( ( 95vw - ( 95vw * .84 ) ) / -2 );
		max-width: 95vw;
		width: 95vw;
	}

	.post-content .alignwide {
		margin-left: calc( ( 95vw - ( 95vw * .84 ) ) / -4 );
		max-width: calc( 95vw - ( ( 95vw - ( 95vw * .84 ) ) / 2 ) );
		width: calc( 95vw - ( ( 95vw - ( 95vw * .84 ) ) / 2 ) );
	}
	
	
}


@media (max-width: 600px) {


	body { font-size: 16px; }

	/* structure */
	
	.section-inner { max-width: 92%; }
	
	.wrapper-inner { max-width: 100%; }
	
	.posts { 
		max-width: 92%; 
		margin: 0 auto;
	}
	
	/* header */
	
	.toggle-container {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		text-align: center;
	}
	
	.nav-toggle { 
		padding: 12px; 
		display: inline-block;
		position: static;
		top: auto;
		right: auto;
	}
	
	.blog-logo img { max-height: 100px; }
	
	/* title section */
	
	.title-section .section-inner,
	.home-first-page .title-section .section-inner { padding: 64px 0 30px; }
	
	.bg-image.master,
	.bg-shader.master {
		height: 400px;
	}
	
	.blog-title a { font-size: 2em; }
	
	.blog-subtitle { 
		font-size: 1em; 
		margin-top: 15px;
	}
	
	/* main content */

	.post-container {
		width: 100%;
		padding: 0;
		margin-top: 7.5%;
	}
	
	.posts > .post-container:first-child { margin-top: 0; }
	
	/* single post */
	
	.single-post .post-title { font-size: 1.8em; }
	
	.page-links { font-size: 0.9rem; }
	
	.featured-media .media-caption-container { padding: 40px 0 20px; }
	
	/* post formats */
	
	.single-post .post-quote blockquote { font-size: 1.25em; }
	
	.single-post .post-quote cite { 
		margin-top: 20px; 
		font-size: 14px;
	}
	
	.single-post .post-link p { font-size: 1.25em; }
	
	.single-post .flex-direction-nav { margin-top: -30px; }
	
	.single-post .flex-direction-nav a { height: 60px; }
	
	/* post content */
	
	.post-content h1, .post-content h2, .post-content h3, .post-content h4, .post-content h5, .post-content h6 {
		margin: 40px 0 15px;
	}
	
	.post-content h1 { font-size: 1.5em; }
	.post-content h2 { font-size: 1.35em; }
	.post-content h3 { font-size: 1.25em; }	
	.post-content h4 { font-size: 1.1em; }
	.post-content h5 { font-size: 1em; }
	
	.post-content blockquote,
	.post-content .wp-block-quote.is-large, 
	.post-content .wp-block-quote.is-style-large {
		padding: 20px; 
	}

	.post-content blockquote p { font-size: 1em; }
	.post-content blockquote cite { font-size: 0.9rem; }

	.post-content .wp-block-pullquote blockquote {
		padding: 0;
	}

	.post-content .wp-block-pullquote.alignleft blockquote p,
	.post-content .wp-block-pullquote.alignright blockquote p {
		font-size: 1em;
	}

	.post-content .alignfull {
		margin-left: calc( ( 100vw - ( 100vw * .84 ) ) / -2 );
		max-width: 100vw;
		width: 100vw;
	}

	.post-content .alignwide {
		margin-left: -4vw;
		max-width: 92vw;
		width: 92vw;
	}
		
	/* post meta */
	
	.tab-selector a { padding: 10px 12px; }
	
	.tab-selector span { display: none; }
	
	.tab-selector .genericon {
		font-size: 32px;
		height: 32px;
		width: 32px;
	}
	
	.post-meta-tabs-inner { padding: 40px 0; }
	
	/* tab author meta */
	
	.tab-author-meta .avatar { 
		width: 80px; 
		padding: 6px;
	}
	
	.tab-author-meta .author-meta-inner { 
		margin-left: 100px; 
		min-height: 80px;
	}
	
	.tab-author-meta .author-name { font-size: 1.25em; }
	
	.tab-author-meta .one-half {
		width: 100%;
		margin-left: 0;
		float: none;
	}
	
	.author-content,
	.tab-author-meta .one-half + .one-half { margin-top: 40px; }
	
	/* comments */
	
	.comments div.comment { margin-top: 30px; }
	
	.comment .avatar { width: 50px; }
	
	.comment-inner { margin-left: 70px; }
	
	/* respond */
	
	.comment-form input[type="text"], 
	.comment-form input[type="email"], 
	.comment-form textarea {
		padding: 13px 15px;
		font-size: 0.9em;
	}
    
	.comment-form-comment + .comment-form-author,
    .comment-form-comment + .comment-form-author + .comment-form-email,
	.comment-form p + p { 
        margin-top: 20px; 
    }
	
	p.comment-form-author, 
	p.comment-form-email {
		width: 100%;
		float: none;
		margin: inherit;
	}
	
	.comment-form textarea { height: 150px; }
	
	.comment-form input[type="submit"] { padding: 12px 16px; }
	
	.form-allowed-tags { font-size: 0.8em; }
	
	/* credits */
	
	.credits { padding: 30px 0; }
	
		
}

@media (max-width: 500px) {
	
	/* navigation */
	
	.mobile-menu a { padding: 20px 8%; }
	
	/* post content */
	
	.post-content p,
	.post-content blockquote,
	.post-content ul,
	.post-content ol,
	.post-content address,
	.post-content dl,
	.post-content .wp-caption,
	.post-content pre {
		line-height: 150%;
	}
	
	.post-content .alignnone,
	.post-content .aligncenter,
	.post-content .alignwide,
	.post-content .alignfull {
		margin-bottom: 2em;
		margin-top: 2em;
	}

	.post-content .alignleft,
	.post-content .alignright {
		float: none;
		margin: 2em auto;
		max-width: 100%;
	}
	
	/* tab post meta */
	
	.tab-post-meta .post-nav,
	.tab-post-meta .post-info-items {
		width: 100%;
		float: none;
		margin: 0;
	}
	
	.post-info-items li { font-size: 1em; }
	
	.tab-post-meta .post-nav { 
		margin-top: 30px;
		border-top: 2px solid #ddd;
		padding-top: 30px;
	}
	
	.tab-post-meta .post-nav a + a {
		margin-top: 15px;
		padding-top: 15px;
	}
	
	.tab-post-meta .post-nav p { font-size: 0.9em; }
	
	.tab-post-meta .post-nav h4 { font-size: 1.2em; }
	
	/* comments */
	
	.comment .avatar { display: none; }
	
	.comment-inner { margin-left: 0; }
	
	.comment-header span { display: none; }
	
	/* respond */
	
	.comment-form p.logged-in-as, 
	.comment-form p.comment-notes {
		margin: -30px 0 25px;
	}
	
	.form-allowed-tags { display: none; }
	
	/* widget area */
	
	.widget-area .column {
		display: block !important;
		float: none;
		width: 100%;
		margin-left: 0;
	}
	
	.widget-area .column + .column,
	.widget + .widget { margin-top: 40px; }
	
	/* credits */
	
	.credits-left { 
		float: none; 
		text-align: center;
	}
	
	.credits-right { display: none; }
	
	
}


@media (max-width: 400px) {


	/* author */
	
	.tab-author-meta .avatar {
		width: 60px;
		padding: 4px;
	}
	
	.tab-author-meta .author-meta-inner { margin-left: 75px; }


}
