/*
Theme Name: Hekris
Theme URI: http://www.stadtkreation.de/wordpress-themes-und-plugins
Author: Johannes Bouchain
Author URI: http://www.stadtkreation.de/ueber-uns
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: hekris
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

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.

Hekris is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later. */

* {
	margin:0;
	padding:0;
}

big {
	font-size:120%;
	font-weight:bold;
}

img {
	border:none;
}

html, body {
	min-height:calc(100% + 1px);
}

body {
	width:100%;
	background-image:url(img/athen.jpg);
	background-size:100% auto;
	background-attachment:fixed;
	background-position:top center;
	text-align:center;
	padding:20px 20px 0 20px;
	box-sizing:border-box;
}

@media screen and (max-width:767px) {
	body {
		padding:10px 10px 0 10px;
	}
}

a {
	outline:none;
	text-decoration:none;
	color:#37476b;
}

a:hover,
a:focus,
a:active {
	color:#516083;
}

h1, h2, h3, h4, h5, h6, h7, h8, h9 {
	padding-bottom:25px;
	font-weight:bold;
	line-height:1.4em;
	font-size:16px;
	color:#37476b;
}

@media screen and (max-width:767px) {
	h1, h2, h3, h4, h5, h6, h7, h8, h9 {
		font-size:15px;
	}
}

h1 {
	font-size:155%;
}
h2 {
	font-size:140%;
}
h3 {
	font-size:125%;
}
h4 {
	font-size:112.5%;
}
h5 {
	font-size:105%;
}

@media screen and (max-width:767px) {
	h1 {
		font-size:140%;
	}
	h2 {
		font-size:13%;
	}
	h3 {
		font-size:12%;
	}
	h4 {
		font-size:110%;
	}
	h5 {
		font-size:105%;
	}
}

/* page */

#page {
	font-family:Roboto;
	line-height:1.4em;
	font-weight:300;
	font-size:16px;
}

@media screen and (max-width:767px) {
	#page {
		font-size:15px;
	}
}

/* top navigation */

nav.top-navigation {
	margin:auto;
	text-align:right;
	max-width:980px;
	box-sizing:border-box;
}

nav.top-navigation li {
	font-size:90%;
	display:inline;
	padding-left:10px;
	font-weight:bold;
}

/* site branding */
header.site-header .site-branding {
	margin:auto;
	text-align:left;
	padding:20px 0 30px;
	max-width:980px;
	box-sizing:border-box;
}

@media screen and (max-width:767px) {
	header.site-header .site-branding {
		padding:15px 0;
	}
}

header.site-header .site-title {
	font-size:180%;
	font-weight:bold;
	line-height:1.2em;
}

header.site-header .site-title a {
	color:#37476b;
}

header.site-header .site-description {
	font-size:130%;
	color:#37476b;
	font-weight:bold;
	line-height:1.2em;
}

/* main navigation */

nav.main-navigation {
	margin:auto;
	text-align:left;
	max-width:980px;
	box-sizing:border-box;
}

@media screen and (max-width:767px) {
	nav.main-navigation {
		padding-bottom:10px;
	}
	
	nav.main-navigation .menu-toggle {
		display:inline-block;
		border:none;
		outline:none;
		font-size:0;
		cursor:pointer;
		background:none;
		margin:0;
		text-align:left;
		z-index:30;
		color:#50698e;
	}

	nav.main-navigation .menu-toggle:after {
		display:inline-block;
		content: "\f214";
		font-size:25px;
		background:none;
		font-family: "dashicons";
		color:#50698e;
		margin:0;
		line-height:1em;
		color:#37476b;
		text-shadow:1px 1px 1px rgba(255,255,255,.4), -1px 1px 1px rgba(255,255,255,.4), -1px -1px 1px rgba(255,255,255,.4), 1px -1px 1px rgba(255,255,255,.4);
	}
}

nav.main-navigation ul {
	font-size:0;
}

nav.main-navigation li {
	display:inline-block;
	font-size:16px;
	margin-right:6px;
	list-style:none;
	position:relative;
}

nav.main-navigation li ul {
	display:none;
	position:absolute;
	left:0;
	width:250px;
	border:1px solid #37476b;
}

nav.main-navigation li:hover ul {
	display:block;
}

nav.main-navigation li ul li {
	width:100%;
	border-bottom:1px solid #37476b;
}

nav.main-navigation li ul li:last-child {
	border-bottom:none;
}

nav.main-navigation li a {
	display:inline-block;
	background-color:rgba(255,255,255,.4);
	padding:6px 9px;
	font-weight:bold;
	text-transform:uppercase;
}

nav.main-navigation li a:hover,
nav.main-navigation li a:focus,
nav.main-navigation li a:active,
nav.main-navigation li.current_page_item a {
	background-color:white;
}

nav.main-navigation li li a {
	width:100%;
	box-sizing:border-box;
	background-color:rgba(241,241,245,.8);
	padding:6px 9px;
	font-weight:bold;
	font-size:90%;
	text-transform:none;
}

nav.main-navigation li li a:hover,
nav.main-navigation li li a:focus,
nav.main-navigation li li a:active,
nav.main-navigation li li.current_page_item a {
	background-color:rgb(241,241,245);
}

@media screen and (min-width:768px) and (max-width:920px) {
	nav.main-navigation div > ul {
		font-size:14px;
	}
	nav.main-navigation li {
		font-size:14px;
		margin-right:2px;
	}
	nav.main-navigation li a {
		padding:3px 5px;
	}
}

@media screen and (max-width:767px) {
	nav.main-navigation ul {
		padding:9px 0;
	}
	nav.main-navigation li {
		display:block;
		margin:0 0 3px 0;
	}
	nav.main-navigation li a {
		display:block;
	}
	nav.main-navigation li ul {
		display:block;
		position:relative;
		border:none;
		padding:3px 0 3px;
		width:100%;
	}
	nav.main-navigation li ul li {
		border:none;
	}
	
	nav.main-navigation li li a {
		background-color:rgba(255,255,255,.4);
		padding:6px 9px 6px 15px;
	}

	nav.main-navigation li li a:hover,
	nav.main-navigation li li a:focus,
	nav.main-navigation li li a:active,
	nav.main-navigation li li.current_page_item a {
		background-color:white;
	}
}

/* content */

#content {
	margin:auto;
	padding:50px 50px 0;
	max-width:980px;
	box-sizing:border-box;
	background:white;
}

#content .entry-header {
	padding:20px 0;
}

#content p,
#content ul,
#content ol,
#content table,
#content h1,
#content h2,
#content h3,
#content h4,
#content h5,
#content h6,
#content h7,
#content h8,
#content h9 {
	max-width:740px;
	text-align:left;
	margin-left:auto;
	margin-right:auto;
	padding-bottom:25px;
}

#content intro {
	font-size:120%;
}

#content ul li {
	margin-left:25px;
	margin-bottom:3px;
	list-style:square;
}

#content ol li {
	margin-left:25px;
	margin-bottom:3px;
}

#content p,
#content ul,
#content ol {
	hyphens:auto;
}

#content .gallery + p,
#content .gallery + ol,
#content .gallery + ul,
#content .gallery + table,
#content .gallery + div {
	padding-top:40px;
}

@media screen and (max-width:767px) {
	#content {
		padding:15px 15px 0;
	}
	
	#content .entry-header {
		padding:10px 0;
	}
	
	#content p,
	#content ul,
	#content ol,
	#content table,
	#content h1,
	#content h2,
	#content h3,
	#content h4,
	#content h5,
	#content h6,
	#content h7,
	#content h8,
	#content h9 {
		padding-bottom:15px;
	}
}

#content img {
	max-width:100% !important;
	height:auto !important;
}

/* easyteasers */

.easyteasers {
	margin-left:-50px;
	padding:15px 0 40px;
	width:calc(100% + 100px);
}

@media screen and (max-width:767px) {
	.easyteasers {
		margin-left:-15px;
		padding-bottom:15px;
		width:calc(100% + 30px);
	}
}	

.easyteasers p {
	max-width:100%;
}

#content .easyteasers h3 {
	margin-bottom:0;
	padding-bottom:6px;
}

.easyteaser {
	margin:0;
	width:25%;
	min-width:180px;
	box-sizing:border-box;
}

@media screen and (max-width:399px) {
	.easyteaser {
		width:100%;
	}
	.easyteaser:after {
		display:block;
		content:" ";
		padding-bottom:50%;
	}
}

@media screen and (max-width:799px) and (min-width:400px) {
	.easyteaser {
		width:50%;
	}
	.easyteaser:after {
		display:block;
		content:" ";
		padding-bottom:50%;
	}
}	

.easyteaser a {
	font-weight:bold;
	text-transform:uppercase;
}

.easyteasers:after {
	display:block;
	content:" ";
	clear:both;
}

/* captions */

.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* galleries */

.gallery {
	margin-left:-50px;
	width:calc(100% + 100px);
	text-align:left;
	margin-top:15px;
	background:#dfdfdf;
}

@media screen and (max-width:767px) {
	.gallery {
		margin-left:-15px;
		width:calc(100% + 30px);
	}
}	

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
	font-size:0;
	line-height:0;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-columns-3 .gallery-item {
	max-width: 33.33333%;
}

.gallery-columns-4 .gallery-item {
	max-width: 25%;
}

@media screen and (max-width:399px) {
	.gallery-columns-4 .gallery-item {
		max-width: 100%;
	}
}

@media screen and (min-width:400px) and (max-width:799px) {
	.gallery-columns-4 .gallery-item {
		max-width: 50%;
	}
}

.gallery-columns-5 .gallery-item {
	max-width: 20%;
}

.gallery-columns-6 .gallery-item {
	max-width: 16.66667%;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28571%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11111%;
}

.gallery-caption {
	display: none;
}

.gallery-item img {
	width:100%;
	height:auto;
}

/* site footer */

footer.site-footer {
	margin:auto;
	max-width:980px;
	padding:10px 12px;
	border-top:1px solid #aaaaaa;
	background:#f0f0f0;
	text-align:left;
	font-size:90%;
	color:#808080;
	box-sizing:border-box;
}

footer.site-footer p {
	padding-bottom:12px;
}

footer.site-footer img {
	display:inline-block;
	vertical-align:top;
}


/* general */

nav.top-navigation .menu-toggle,
.screen-reader-text {
	font-size:0;
	text-indent:-9999px;
	position:absolute;
	top:-9999px;
	left:-9999px;
}

@media screen and (min-width:768px) {
	nav.main-navigation .menu-toggle {
		font-size:0;
		text-indent:-9999px;
		position:absolute;
		top:-9999px;
		left:-9999px;
	}
}
