﻿/*
Theme Name: encyclopediauniverse
Theme URI: 
Author: BSP
Author URI: 
Description: This theme template suitable for a website of any subject and also for personal blog. The template has a number of settings interface.
Version: 1.0
Tags: blog, left-sidebar, right-sidebar, three-columns, accessibility-ready, custom-colors, custom-header, custom-menu, editor-style, featured-images, post-formats, threaded-comments, translation-ready, theme-options
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: encyclopediauniverse

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/*
>>> HEADER <<<
*/

.social-menu {
	width: 100%;
	background: #000;
	text-align: right;
}

.social-menu ul,
.top-menu ul {
	padding: 0;
	margin: 0;
}

.social-menu li {
	display: inline-block;
	margin-left: 5px;
	color: #fff;
}

.social-menu a,
.top-menu a {
	color: inherit;
}

.top-menu {
	width: 100%;
	background: #ccc;
	text-align: center;
	color: #000;
}

.home {
	padding: 0;
}

.top-menu .home:after {
	content: '\f015';
	font-family: 'FontAwesome';
	font-style: normal;
	font-size: 1.3em;
}

.top-menu li {
	display: inline-block;
	margin-left: 20px;
}

.top-menu p {
	font-family: 'capture';
	color: inherit;
	font-size: 0.8em;
	margin: 0;
}

.head-bg {
	width: 100%;
	height: 20vh;
	text-align: center;
	position: relative;
}

.head-bg img.head-bg-image {
	width: 100%;
	height: 100%;
}

.name-blog {
	margin-top: 10px;
	color: #fff;
	position: absolute;
	z-index: 999;
}

.name-blog h1 {
	font-family: 'capture';
	font-size: 2.5em;
	color: forestgreen;
	font-style: italic;
}

.name-blog span {
	font-size: 1.9em;
}

@media only screen and (max-width: 900px) {
	.head-bg { height: 20vh; }
	.name-blog h1 { font-size: 2em; }
	.name-blog span { font-size: 1.2em; }
}

@media only screen and (max-width: 640px) {
	.head-bg { height: 20vh; }	
	.name-blog h1 { font-size: 1.5em; }
}

/*
>>> content <<<
*/
.wreapper {
	padding-top: 20px;
}

article.index-content {
	height: 300px;
	overflow: hidden;
	margin: 10px 0;
	background: #000;
	border: none;
}

@media only screen and (max-width: 980px) {
	article.index-content { height: 370px; }
}

@media only screen and (max-width: 640px) {
	article.index-content { height: 350px; }
}

@media only screen and (max-width: 360px) {
	article.index-content { height: 400px; }
}

article.index-content img {
	width: 100%;
	height: 100%;
	position: relative;
	opacity: .30;
}

.inform-box {
	padding-left: 5px;
	font-size: 0.8em;
	position: absolute;
	z-index: 999;
}

@media only screen and (max-width: 480px) {
	.inform-box { font-size: 0.6em; }
}

.inform-box li {
	display: inline-block;
}

.inform-box .author {
	color: #fff;
}

.inform-box .share {
	color: #fff;
	font-size: 1.2em;
	margin-left: 7px;

}

.title-content-index {
	position: absolute;
	z-index: 999;
	margin-top: 25px;
}

@media only screen and (max-width: 980px) {
	.title-content-index { font-size: 0.7em; }
}

@media only screen and (max-width: 360px) {
	.title-content-index { font-size: 0.5em; }
}

.title-content-index a {
	color: chartreuse;
}

.title-content-index a:hover {
	color: forestgreen;
}

.content-index {
	width: 95%;
	position: absolute;
	z-index: 9;
	margin-top: 80px;
	padding: 0 15px;
}

@media only screen and (max-width: 1024px) {
	.content-index p { font-size: 0.9em; }
}

@media only screen and (max-width: 360px) {
	.content-index p { font-size: 0.7em; }
}

@media only screen and (max-width: 480px) {
	.content-index { margin-top: 60px; }
	.content-index p { font-size: 0.9em; }
}

.content-index p {
	color: #fff;
	line-height: 1.1;
}

.content-index .read-more {
	margin-left: 10px;
	padding: 0 10px;	
	background: red;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
}

.content-index .read-more:hover {	
	background: none;
}

.meta-box {
	z-index: 999;
	position: absolute;
	margin-top: 240px;
	left: 30px;
	font-size: 0.9em;
}

@media only screen and (max-width: 1024px) {
	.meta-box { margin-top: 240px; }
}

@media only screen and (max-width: 980px) {
	.meta-box { margin-top: 310px; }
}

@media only screen and (max-width: 480px) {
	.meta-box { font-size: 0.7em; }
}

@media only screen and (max-width: 640px) {
	.meta-box { margin-top: 270px; }
}

@media only screen and (max-width: 360px) {
	.meta-box { margin-top: 350px; }
}

.post-categories {
	margin: 0;
}

.post-categories li {
	display: inline-block;
	margin-left: 5px;
}

/*
** --- single
*/
article.content-single {
	height: auto;
	background: none;
}

article.content-single .single-thumbnil {
	width: 40%;
	margin: 0 15px 15px 0;
	float: left;
}

article.content-single .single-thumbnil img {
	width: 100%;
}

@media only screen and (max-width: 640px) {
	article.content-single .single-thumbnil {
		width: 50%;
	}
}

@media only screen and (max-width: 480px) {
	article.content-single .single-thumbnil {
		width: 100%;
		margin: 15px 0;
		float: none;
	}
}

section.single-page,
section.single-page p {
	font-family: 'ag_helvetica';
	line-height: 1.5;
	font-size: 1.1em;
	color: #000;
	text-align: justify;
}

@media only screen and (max-width: 900px) {
	section.single-page,
	section.single-page p {
		font-size: 1em;
	}
}

@media only screen and (max-width: 320px) {
	section.single-page,
	section.single-page p {
		font-size: 0.9em;
	}
}

section.single-page h2,
section.single-page h3,
section.single-page h4,
section.single-page h5,
section.single-page h6 {
	font-family: 'open_sans_bold';
}

.title-content-single {
	width: 100%;
	text-align: center;
	margin-bottom: 20px;
	font-size: 1.8em;
	border-bottom: 1px solid #000;
}

@media only screen and (max-width: 900px) {
	.title-content-single {
		font-size: 1.5em;
	}
}

@media only screen and (max-width: 640px) {
	.title-content-single {
		font-size: 1em;
	}
}

@media only screen and (max-width: 360px) {
	.title-content-single {
		font-size: 0.9em;
	}
}

/*
** --- single-nav-prev-next
*/
.content-single .single-nav-prev-next {
	width: 100%;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	text-align: center;
	padding: 20px 0;
}

.single-nav-prev-next .single-nav-prev-next-list {
	margin-right: 100px;
}

.single-nav-prev-next .single-nav-prev-next-list li {
	display: inline-block;
	margin-left: 100px;
}

.single-nav-prev-next .single-nav-prev-next-list a {
	font-size: 1.3em;
}

@media only screen and (max-width: 420px) {
	.content-single .single-nav-prev-next {
		text-align: left;
	}

	.single-nav-prev-next .single-nav-prev-next-list li {
		margin-left: 0;
		display: block;
	}

	.single-nav-prev-next .single-nav-prev-next-list a {
		font-size: 0.8em;
	}
}

/*
>>> left-bar <<<
*/
.left-bar,
.right-bar {
	background: #999;
	padding-top: 15px;
	padding-bottom: 15px;
}

.left-bar section,
.right-bar section {
	margin-bottom: 30px;
}

.widget-title {
	padding: 5px 0;
	background: #ccc;
	text-align: center;
	border-bottom: 2px solid #000;
}

.widget-title h4 {
	font-family: 'capture';
	font-size: 1.2em;
}

nav.cat-menu div,
.categorys {
	text-align: center;
}

nav.cat-menu div a,
.categorys a {
	font-weight: bold;
	font-size: 0.8em;
}

nav.cat-menu div > ul > li > a:after,
nav.cat-menu div > ul > li > a:before,
.categorys > ul > li > a:after,
.categorys > ul > li > a:before {
	content: '\f013';
	font-family: 'FontAwesome';
	color: forestgreen;
	font-size: 0.8em;
	font-style: normal;
	padding: 0 10px;
}

nav.cat-menu div > ul > li,
.categorys > ul > li {
	border-bottom: 2px solid #000;
	background: #ccc;
}

nav.cat-menu div > ul > li:hover,
.categorys > ul > li:hover {
	background: #999;
}

nav.cat-menu li:hover .sub-menu {
	display: block;
}

.sub-menu {
	display: none;
	position: relative;
}

.sub-menu li {
	border-bottom: 1px solid #fff;
}

.sub-menu li:hover {
	background: #ccc;
}

/*
** --- right-bar
*/
.imag {
	height: 150px;
	overflow: hidden;
	margin-bottom: 20px;
}

.imag img {
	width: 100%;	
	position: relative;
}

section.title {
	width: 100%;
	position: absolute;
	z-index: 1;
	background: rgba(36,3,3,.50);
	font-size: 1.5em;
	text-align: center;

}

section.title h1 {
	font-size: inherit;
}

section.date {
	width: 100%;
	position: absolute;
	z-index: 1;
	color: #fff;
	font-size: 0.5em;
}   

span.post-date { /*wp-widget-resent-post-date*/
	font-size: 0.7em;
}

/*
 >>> FOOTER <<<
 */
 footer.main-footer {
 	margin-top: 10px;
 	padding: 10px 0;
 	background: #ccc;
 }

 .foot-menu {
 	width: 100%;
 	text-align: center;
 	background: #000;
 }

 .bottom-menu li {
 	display: inline-block;
 	margin-left: 20px;
 }

 .bottom-menu a {
 	color: #fff;
 	font-style: normal;
 }

 .foot-bar {
 	width: 100%;
 }

 .foot-bar p {
 	margin: 0;
 }

 .foot-name-blog {
 	font-size: 0.9em;
 }

/*
>>> Виджет последних коментариев <<<
*/
.encyclopediauniverse-wreapp-comment {
	border-bottom: 1px solid #000;
	text-align: center;
	padding: 5px 0;
}

.encyclopediauniverse-wreapp-comment p {
	margin: 0;
	font-size: 0.9em;
}

.encyclopediauniverse-author-comment span {
	margin-left: 10px;
	color: #fff;
}

 /*
 >>> search-form <<<
 */
 #encyclopediauniverse-input {
 	border: none;
 	width: 90%;
 	height: 30px;
 	padding-left: 5px;
 	margin-top: 15px;
 	margin-bottom: 5px;
 }

 #encyclopediauniverse-input:focus {
 	border: 2px solid #1435FF;
 }

/*
** --- results-search
*/
.index-content.results-search {
	padding: 5px;
	background: #ccc;
}

.wreapp-results-search {
	background: #fff;
	padding: 5px;
}

.wreapp-results-search li {
	display: inline-block;
	font-size: 1.5em;
}

.results-search-for,
.count-results {
	background: #000;
	color: #fff;
	padding: 0 5px 5px 5px;
	border-radius: 5px;
}

 /*
 ** --- rekomendacii po poisku
 */
 .recommendations {
 	width: 60%;
 	height: 60%;
 	background: #fff;
 	margin: 10px auto 0 auto;
 }
 .recommendations ul {
 	margin-left: 5px;
 }
 .recommendations li {
 	color: #000;
 }


