/*
Theme Name: Lowlifer
Theme URI: http://edgar.bios.ee/wp/themes/lowlifer
Author: Edgar Miadzieles
Author URI: http://edgar.bios.ee
Description: Made for lowlifer.ee
Version: 1.0
Tags: blog, lowlifer
Text Domain: lowlifer
*/

/* --------------------------- *\
	DEFAULTS
\* --------------------------- */
html, body { margin: 0; background: #fdfdfd; font-family: 'Roboto Condensed', sans-serif; }
.w-100 { width: 100%; }
.w-33 { width: 33.3%; }
a:visited { color: #333 }


/* --------------------------- *\
	WEBSITE MAIN STYLES
\* --------------------------- */
#wrapper { max-width: 1600px; margin: 0 auto; }
	header { background: #fff; text-align: center; padding: 21px 0px 26px; box-shadow: 0px 0px 15px rgba(0,0,0,.1); position: fixed; z-index: 5; top: 0; }
		#logo { padding: 14px 38px 0px 0px; border-right: 6px solid #cc3333; display: inline-block; vertical-align: middle; }
			#logo img { max-width: 120px; }
		#menu-main { display: inline-block; list-style: none; vertical-align: middle; padding-left: 36px; }
			#menu-main a { color: #fff; text-decoration: none; }
			#menu-main li { display: inline-block; font-size: 24px; margin-left: -4px; }
			#menu-main li:not(:last-child)::after { content: "♦"; color: #cc3333; padding: 0px 20px;  }
				#menu-main a { opacity: 1; color: #333333; font-weight: bold; font-family: 'Roboto Condensed', sans-serif; text-transform: uppercase; transition: 0.3s; -webkit-transition: 0.3s; }
				#menu-main a:hover { text-decoration: none; opacity: 0.6; }
	.single-article { background: #fff; }
		.single-article .single-inner { padding: 50px 2.5% 25px; width: 95%; background: #fff; }
			.single-article .single-inner img { max-width: 100%; }
			.single-article .single-inner iframe { max-width: 100%; }
	.blogpost { min-height: 640px; position: relative; overflow: hidden; background: #353535; display: flex; justify-content: center; flex-direction: column; }
		.blogpost-overlay { position: absolute; left:0; right: 0; top: 0; bottom: 0; opacity: 0.3; transform: scale(1); -webkit-transform: scale(1); transition: all 1s; -webkit-transform: all 1s; }
			.blogpost-date { text-align: center; }
				.blogpost-date span {color: white; font-size: 22px; font-weight: 300; }
			.blogpost-data {padding: 25px 0px; position: absolute; right: 0; left: 0; top: 50%; transform: translateY(-50%);}
			.blogpost-data iframe {display: none }
			.blogpost-data h3 { text-align: center; margin: 17px; font-size: 45px; line-height: 100%; }
				.blogpost-data h3 a { color: #fff; position: relative; text-transform: uppercase; opacity: 1; }
				.blogpost-ruby { color: #cc3333; }
				.blog-short { text-align: justify; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; margin: 0 auto; max-width: 880px; font-size: 21px; color: white; font-weight: 300; width: 100%; }
	.custom-pagination { width: 100%; text-align: center; padding: 15px 0px;	background: white; }
		.page-numbers.current { color: #333333; font-size: 21px; margin: 0px 4px; }
		a.page-numbers { color: #9A9A9A; font-size: 21px; margin: 0px 4px; transition: 0.3s; -webkit-transition: 0.3s; }
		a.page-numbers:hover { color: #333; text-decoration: none; }
		.next.page-numbers, .prev.page-numbers { margin: 0px 1px; transition: 0.3s; -webkit-transition: 0.3s; }
		.next.page-numbers:hover, .prev.page-numbers:hover { color: #333; text-decoration: none; }
	footer { padding: 25px 0px 20px; position: relative; z-index: 5; background: #fff; }
		.separator-border { display: none; width: 95%; padding: 0px 2.5%; box-sizing: border-box; margin: 0 auto; border-top: 1px solid #ddd; padding-bottom: 24px; }
		.footer-inner { width: 95%; padding-left: 2.5%; display: flex; }
			.footer-widget { padding: 0px; margin: 0px; list-style: none; display: flex; }
			.footer-widget.rightfooter { flex: 1; }
			.footer-widget .textwidget { color: #536482; }
				.footer-container { vertical-align: top; }
				.footer-container .inner {padding: 0px 20px 0px 0px; }
				.footer-container.w-100 { padding: 0px; }
	.clearfix { height: 108px; }
	.single-article .single-inner img { max-width: 100%; height: auto; display: block; margin: 20px auto; }


/* --------------------------- *\
	TEAM PAGE
\* --------------------------- */
.team-holder { display: -webkit-flex; display: flex; padding-top: 50px; -webkit-flex-wrap: wrap; flex-wrap: wrap; background: #fff; }
	.team-member-holder { width: 25%; padding: 15px; box-sizing: border-box; }
		.team-member-inner { width: 300px; margin:0 auto; }
			.team-member-description { width: 300px; padding: 10px; box-sizing: border-box; }
			.team-image-holder { height: 300px; width: 300px; padding: 10px; box-sizing: border-box; box-shadow: 0px 0px 10px rgba(0,0,0,.1); }
				.team-image-inner {	width: 100%; height: 100%; }
.page-team .separator-border { display: block; }


/* --------------------------- *\
	SINGLE ARTICLE
\* --------------------------- */
.single-post .single-article {	background: #333;	margin-top: 287px;	position: relative;	display: flex;}
.single-post .separator-border { display: block; }
.parallax-background-article {	background: #777;	top: 108px;	height: 287px;	position: fixed;	z-index: 0;	max-width: 1600px;}
.parallax-inner { position: absolute; left: 0; right: 0; top: 0; bottom: 0; opacity: 0.6; }
.single-post header.relative-header {position: absolute; top: 247px; }


/* --------------------------- *\
	WP STYLES
\* --------------------------- */
.alignleft { float: left; margin: 20px 20px 20px 0px; }
.alignright { float: right; margin: 20px 0px 20px 20px; }

.admin-bar header { top: 32px; }
.admin-bar .parallax-background-article { top: 156px; }


/* --------------------------- *\
	MEDIA Q
\* --------------------------- */
@media screen and (max-width: 1300px) {
	.team-member-holder { width: 33%; }
}
@media screen and (max-width: 950px) {
	header { padding: 10px 0px 10px;}
		#logo { padding: 11px 19px 0px 0px; }
			.logo-image { height: 35px; }
		#menu-main { padding-left: 20px; margin: 2px;}
			#menu-main li { font-size: 20px; }
			#menu-main li:not(:last-child)::after { padding: 0px 10px; }
	.clearfix { height: 70px; }
	.blogpost { height: auto; min-height: 320px; display: flex; justify-content: center; flex-direction: column; }
		.blogpost-data h3 { font-size: 23px; }
	.blog-short { max-width: 80%; width: 80%; font-size: 18px; }
		.blogpost-date span { font-size: 15px; }

	.team-member-holder { padding: 15px 0px; width: 50%; }
		.team-member-description h3 { margin: 5px 0px; }
	.parallax-background-article { top: 70px; }
	.single-post .single-article { margin-top: 281px;}
	.admin-bar .parallax-background-article { top: 70px; }
}

@media screen and (max-width: 750px) {
	.team-member-description p { margin: 5px 0px; }
	.team-member-holder { padding: 15px 0px; width: 100%; }
	.blog-short {column-count: 1;}
	.parallax-background-article { top: 70px; height: 170px; }
	.single-post .single-article { margin-top: 170px; }
	.single-article .single-inner { padding: 25px 5% 25px; }
	.footer-container { vertical-align: top; width: 100%; }
	.footer-inner { width: 90%; padding-left: 5%; display: flex; }
}

@media screen and (max-width: 450px) {
	#logo {
		border-right: none;
		padding: 0px 0px 0px 5px;
		width: 100%;
	}
	.team-member-inner {
		width: 250px;
	}
	.team-image-holder {
		height: 250px;
		width: 250px;
	}
	.team-member-description {
		width: 250px;
	}
	#logo {
		padding-left: 0;
	}
	#menu-main {
		padding-left: 0px;
	}
}
