/*  
Theme Name: ZWANZIG
Theme URI: http://www.olivergast.de/zwanzig/
Description: A modern stylish WordPress-Theme
Version: 1.03
Author: Oliver Gast
Author URI: http://www.olivergast.de
License:
License URI:
Tags: dark, blue, white, two-columns, fixed-layout, responsive-layout, custom-background, custom-header, custom-colors, custom-menu, editor-style, featured-images, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready
Text Domain: og-zwanzig
*/


/*---------- Index ----------

    I. Google Webfont for italic styles
   II. Basics 
  III. Headings 
   IV. Layout 
    V. Content
   VI. Header-Slider
  VII. Navigation
       .1 Top-(Main-)Navigation
       .2 Footer navigation
 VIII. Post & Pages content
       .1 Declarations for all type of posts and pages
       .2 Single-posts or pages
       .3 Blog- & Archive-posts
       .4 Sticky-posts
       .5 404-Page
       .6 Single-attachment-page
       .7 Search-result-page
       .8 Post-images and gallery
   IX. Sidebar
    X. Comments
   XI. Side & Post-Navigation
  XII. Comment-navigation
 XIII. Shortcodes
 XIIV. Special styles for plugins
   XV. Fixes for browsers or devices
       .1 Fix for the Internet Explorer
       .2 Fix for the checkbox hack on old Android-devices
  XVI. Media Queries for the responsive layout
       .1 Generell parameters
       .2 for devices with less than 1200 pixel maximum-width
       .3 for devices with less than 1024 pixel maximum-width
       .4 for devices with less than 800 pixel maximum-width
       .5 for devices with less than 600 pixel maximum-width
       .6 for devices with less than 400 pixel maximum-width

-----------------------------------------------------------*/



/*---------- I. Google Webfont for italic styles ----------*/

@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:400italic);

address,
blockquote,
.gallery .gallery-caption,
.wp-caption-text,
input#s,
input.search-field {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 1.2em;
	font-style: italic;
}


/*---------- II. Basics ----------*/

html,
body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	line-height: 1.6em;
	background-size: cover;
	text-rendering:  optimizeLegibility;
	-webkit-font-smoothing: antialiased !important;
	-moz-font-smoothing: antialiased !important;
}

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

::selection {
	background: #333;
	color: #fff;
}

::-moz-selection {
	background: #333;
	color: #fff;
}

a {
	text-decoration: none;
	font-weight: bold;					/* 8.9.2016 by eppe */
	color: 2c4390;						/* 8.9.2016 by eppe */
	-webkit-transition: color 0.5s linear;
	-moz-transition: color 0.5s linear;
	-o-transition: color 0.5s linear;
	-ms-transition: color 0.5s linear;
	transition: color 0.5s linear;
}

a:hover {
	text-decoration: none;
}

ul li {
	list-style-type: square;
}

ol,
ul {
	padding: 0;
	margin: 20px 0 20px 30px;
}

ol ol,
ul ul {
	margin: 0 0 0 10px;
}

iframe,
embed,
object {
	max-width: 100% !important;
}

img {
	max-width: 100%;
	height: auto;
}

code {
	padding: 2px 4px;
	font-family: Consolas, monospace;
}

form {
	width: 100%;
	margin: 20px 0;
	padding: 30px;
}

textarea,
input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]),
select {
 	margin: 0;
	padding: 7px 10px;
	background: #fff;
	font-style: none;
	border: 1px solid #ccc;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
	-webkit-appearance: none;
	-moz-appearance: window;
	appearance: none;
}

select {
	padding-right: 40px;
	background: #fff url(images/down-arrow.png) right center no-repeat;
}

input[type="submit"] {
	width: auto;
	margin: 10px 0 10px 0;
	padding: 10px 15px;
	font-size: 1.1em;
	text-transform: uppercase;
	border: none;
	background: none;
	cursor: pointer;
	color: #fff;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: 0.2s;
	-webkit-appearance: none;
}

input[type="submit"]::-moz-focus-inner {
	border: 0;
}

input[type="submit"]:hover {
	color: #fff;
	text-decoration: none;
}


/*---------- III. Headings ----------*/

h1, 
h2, 
h3, 
h4, 
h5, 
h6 {
	font-weight: 700;
	line-height: 1.3em;
}

h1 {
	margin: 5px 0 20px 0;
	font-size: 2.3em;
}

h2 {
	margin: 0 0 5px 0;
	color: #210D10;
	font-size: 1.9em;
}

h3 {
	margin: 20px 0 5px 0;
	font-size: 1.7em;
}

h4 {
	margin: 15px 0 5px 0;
	color: #777;
	font-size: 1.6em;
}

h5 {
	margin: 10px 0;
	font-size: 1.4em;
}

h6 {
	margin: 20px 0 10px 0;
	font-size: 1.2em;
	text-transform: uppercase;
}


/*---------- IV. Layout ----------*/

#container {
	position: relative;
	width: 1200px;
	margin: 0 auto;
}

#wrapper {
	float: left;
	width: 100%;
	box-shadow: 0 0 50px rgba(0,0,0,0.8);
	overflow: hidden;
}

header.side-header {
	position: relative;
	float: left;
	width: 100%;
}

#content {
	position: relative;
	top: 0;
	float: left;
	width: 100%;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}

footer.side-footer {
	position: relative;
	top: 0;
	float: left;
	width: 100%;
	color: #ccc;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}


/*---------- V. Content ----------*/

.header-content {
	position: relative;
	top: 0;
	line-height: 0;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}

.menu-bar {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 60px;
	background: #4a4a4a;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
	z-index: 1;
}

.top-bar {
	position: relative;
	left: 0;
	top: 0;
	float: left;
	width: 100%;
	height: 60px;
	padding: 0 20px;
	background: #333;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	-ms-transition: 0.4s;
	transition: width 0.4s;
	z-index: 2;
}

label.top-bar-navigation-label {
	position: absolute;
	top: 15px;
	left: 20px;
	cursor: pointer;
	z-index: 3;
}

label.top-bar-navigation-label .genericon {
	width: 30px;
	height: 30px;
	text-align: center;
	color: #fff;
	font-size: 18px;
	line-height: 30px;
	border-radius: 50%;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	-ms-transition: 0.4s;
	transition: 0.4s;
}

input#top-bar-navigation[type=checkbox] {
	display: none;
}

input#top-bar-navigation[type=checkbox]:checked ~ #content,
input#top-bar-navigation[type=checkbox]:checked ~ .header-content,
input#top-bar-navigation[type=checkbox]:checked ~ .menu-bar {
	top: 60px;
}

input#top-bar-navigation[type=checkbox]:checked ~ #content {
	margin-bottom: 60px;
}	

label.responsive-social-icons {
	position: absolute;
	display: none;
	top: 15px;
	right: 60px;
	cursor: pointer;
	z-index: 3;
}

label.responsive-social-icons .genericon {
	width: 30px;
	height: 30px;
	text-align: center;
	color: #fff;
	font-size: 18px;
	line-height: 30px;
	border-radius: 50%;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	-ms-transition: 0.4s;
	transition: 0.4s;
}

input#responsive-socialicons[type=checkbox] {
	display: none;
}

.top-bar-social {
	position: relative;
	float: right;
	margin: 15px 0 15px 20px;
}

.top-bar-social ul {
	float: left;
	margin: 0;
	text-align: right;
}

.top-bar-social li {
	float: left;
	list-style: none;
}

.top-bar-social li a span {
	width: 30px;
	height: 30px;
	font-size: 18px;
	color: #fff;
	line-height: 30px;
	border-radius: 50%;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}

label.header-search {
	position: absolute;
	top: 15px;
	right: 20px;
	cursor: pointer;
	z-index: 3;
}

label.header-search .genericon {
	width: 30px;
	height: 30px;
	text-align: center;
	color: #fff;
	font-size: 18px;
	line-height: 30px;
	border-radius: 50%;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	-ms-transition: 0.4s;
	transition: 0.4s;
}

input#header-search[type=checkbox] {
	display: none;
}
 
input#header-search[type=checkbox]:checked ~ #top-search,
input#header-search[type=checkbox]:checked ~ .header-content,
input#header-search[type=checkbox]:checked ~ #content,
input#header-search[type=checkbox]:checked ~ footer.side-footer {
	top: 60px;
}

#top-search {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 60px;
	padding: 0 20px;
	background: #4a4a4a;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
	z-index: 1;
}

#top-search .search-form {
	position: relative;
	width: 100%;
	margin: 10px auto;
}

#top-search .search-form form {
	margin: 0;
	padding: 0;
}

#top-search .search-form #s {
	width: 100%;
	height: 40px;
	background: #fff;
	margin: 0;
	padding: 0 10px;
	font-size: 1.1em;
	line-height: 40px;
	color: #b5b5b5;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	-ms-transition: 0.4s;
	transition: 0.4s;
}

#top-search .search-form #sb {
	position: absolute;
	right: 0;
	top: -10px;
	height: 100%;
	padding: 0 20px;
}

.logo-header {
	float: left;
	margin: 10px 20px 10px 0;
}

.logo-header img {
	height: 40px;
	width: auto;
}

.blog-info {
	width: 100%;
	display: inline-block;
	margin: 0 0 30px 0;
	padding-bottom: 20px;
	border-bottom: 3px solid #555;
}

.blog-info h2 {
	margin: 0;
	font-size: 2.2em;
	line-height: 1em;
}

.blog-info h6 {
	margin: 10px 0 0 0;
	font-size: 1em;
	line-height: 1em;
	color: #fff;
}


.blog-info a:hover {
	text-decoration: none;
}

li.blog-description {
	margin: 0 0 30px 0;
	padding-bottom: 20px;
	border-bottom: 3px solid #555;
	list-style: none;
}

h6.blog-description-title {
	margin-top: 0;
	color: #fff;
}

.blog-description-logo {
	float: right;
	margin: 0 0 10px 10px;
}

.blog-description-logo img {
	border-radius: 50%;
}

body.blog .main-content,
body.page .main-content {
	float: right;
	width: 75%;
	padding: 30px;
	background: #fff;
}

.entry {
	float: left;
	width: 100%;
	margin: 0 0 40px 0;
	padding-bottom: 10px;
	border-bottom: 1px solid #ccc;
}

.entry h2 {
	margin: 0;
	font-size: 2em;
}

.entry span {
	margin-left: 5px;
	text-transform: uppercase;
}

.footer-content {
	width: 100%;
	margin: 0 auto;
	font-size: 0.9em;
	color: #fff;
}

.footer-content a {
	color: #ccc;
}

.site-info {
	float: left;
	width: 100%;
	padding: 30px;
	background: #222;
}

.logo-footer {
	float: left;
	margin-right: 30px;
}

.credits {
	float: left;
	max-width: 80%;
}

a.scroll-top {
	float: right;
	width: 40px;
	height: 40px;
	text-align: center;
	border-radius: 50%;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}

a.scroll-top .genericon {
	font-size: 30px;
	line-height: 40px;
	color: #fff;
}


/*---------- VI. Header-Slider ----------*/

.header-slider {
	position: relative;
	left: 0;
	float: left;
	width: 500%;
	-webkit-animation: 30s header-slider infinite; 
	-moz-animation: 30s header-slider infinite; 
	-o-animation: 30s header-slider infinite; 
	-ms-animation: 30s header-slider infinite; 
	animation: 30s header-slider infinite; 
}

.header-slider:hover,
.header-slider:hover .slider-progressbar {
	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-o-animation-play-state: paused;
	-ms-animation-play-state: paused;
	animation-play-state: paused;
}

.slider-post {
	position: relative;
	float: left;
	width: 20%;
	line-height: 0;
}

.header-slider .slider-thumbnail {
	position: relative;
	margin: 0;
}

.slider-post .slider-paused {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -32px;
	margin-left: -32px;
	opacity: 0;
	z-index: 1;
}

.header-slider .slider-paused .genericon {
	padding: 10px;
	font-size: 64px;
	color: rgba(0,0,0,0.5);
	border: 10px solid rgba(0,0,0,0.5);
	border-radius: 50%;
}

.header-slider:hover .slider-paused {
	opacity: 1;
}

.header-slider .slider-progressbar {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 10px;
	background: rgba(0,0,0,0.5);
	-webkit-animation: 30s slider-progressbar linear infinite; 
	-moz-animation: 30s slider-progressbar linear infinite; 
	-o-animation: 30s slider-progressbar linear infinite; 
	-ms-animation: 30s slider-progressbar linear infinite; 
	animation: 30s slider-progressbar linear infinite; 
}

.header-slider .slider-title {
	position: absolute;
	max-width: 90%;
	bottom: 20px;
	right: 20px;
	padding: 20px 30px;
	background: rgba(0,0,0,0.7);
	text-align: right;
	color: #fff;
}

.header-slider .slider-title h6 {
	margin: 0;
	color: #fff;
	font-size: 1.4em;
}

.header-slider .slider-title p {
	margin: 10px 0;
}

.header-slider .slider-excerpt {
	line-height: 1.3em;
	font-size: 0.9em;
}

.header-slider .slider-excerpt .more-link {
	display: none;
}

@-webkit-keyframes header-slider {
	  0% { left: 0%; }
	 15% { left: 0%; }
	 20% { left: -100%; }
	 35% { left: -100%; }
	 40% { left: -200%; }
	 55% { left: -200%; }
	 60% { left: -300%; }
	 75% { left: -300%; }
	 80% { left: -400%; }
	 95% { left: -400%; }
	100% { left: 0%; }
}

@-moz-keyframes header-slider {
	  0% { left: 0%; }
	 15% { left: 0%; }
	 20% { left: -100%; }
	 35% { left: -100%; }
	 40% { left: -200%; }
	 55% { left: -200%; }
	 60% { left: -300%; }
	 75% { left: -300%; }
	 80% { left: -400%; }
	 95% { left: -400%; }
	100% { left: 0%; }
}

@-o-keyframes header-slider {
	  0% { left: 0%; }
	 15% { left: 0%; }
	 20% { left: -100%; }
	 35% { left: -100%; }
	 40% { left: -200%; }
	 55% { left: -200%; }
	 60% { left: -300%; }
	 75% { left: -300%; }
	 80% { left: -400%; }
	 95% { left: -400%; }
	100% { left: 0%; }
}

@-ms-keyframes header-slider {
	  0% { left: 0%; }
	 15% { left: 0%; }
	 20% { left: -100%; }
	 35% { left: -100%; }
	 40% { left: -200%; }
	 55% { left: -200%; }
	 60% { left: -300%; }
	 75% { left: -300%; }
	 80% { left: -400%; }
	 95% { left: -400%; }
	100% { left: 0%; }
}

@keyframes header-slider {
	  0% { left: 0%; }
	 15% { left: 0%; }
	 20% { left: -100%; }
	 35% { left: -100%; }
	 40% { left: -200%; }
	 55% { left: -200%; }
	 60% { left: -300%; }
	 75% { left: -300%; }
	 80% { left: -400%; }
	 95% { left: -400%; }
	100% { left: 0%; }
}

@-webkit-keyframes slider-progressbar {
	  0% { width: 0; }
	 15% { width: 100%; }
	 15.01% { width: 0; }
	 20% { width: 0; }
	 35% { width: 100%; }
	 35.01% { width: 0; }
	 40% { width: 0; }
	 55% { width: 100%; }
	 55.01% { width: 0; }
	 60% { width: 0; }
	 75% { width: 100%; }
	 75.01% { width: 0; }
	 80% { width: 0; }
	 95% { width: 100%; }
	95.01% { width: 0; }
	100% { width: 0; }
}

@-moz-keyframes slider-progressbar {
	  0% { width: 0; }
	 15% { width: 100%; }
	 15.01% { width: 0; }
	 20% { width: 0; }
	 35% { width: 100%; }
	 35.01% { width: 0; }
	 40% { width: 0; }
	 55% { width: 100%; }
	 55.01% { width: 0; }
	 60% { width: 0; }
	 75% { width: 100%; }
	 75.01% { width: 0; }
	 80% { width: 0; }
	 95% { width: 100%; }
	95.01% { width: 0; }
	100% { width: 0; }
}

@-o-keyframes slider-progressbar {
	  0% { width: 0; }
	 15% { width: 100%; }
	 15.01% { width: 0; }
	 20% { width: 0; }
	 35% { width: 100%; }
	 35.01% { width: 0; }
	 40% { width: 0; }
	 55% { width: 100%; }
	 55.01% { width: 0; }
	 60% { width: 0; }
	 75% { width: 100%; }
	 75.01% { width: 0; }
	 80% { width: 0; }
	 95% { width: 100%; }
	95.01% { width: 0; }
	100% { width: 0; }
}

@-ms-keyframes slider-progressbar {
	  0% { width: 0; }
	 15% { width: 100%; }
	 15.01% { width: 0; }
	 20% { width: 0; }
	 35% { width: 100%; }
	 35.01% { width: 0; }
	 40% { width: 0; }
	 55% { width: 100%; }
	 55.01% { width: 0; }
	 60% { width: 0; }
	 75% { width: 100%; }
	 75.01% { width: 0; }
	 80% { width: 0; }
	 95% { width: 100%; }
	95.01% { width: 0; }
	100% { width: 0; }
}

@keyframes slider-progressbar {
	  0% { width: 0; }
	 15% { width: 100%; }
	 15.01% { width: 0; }
	 20% { width: 0; }
	 35% { width: 100%; }
	 35.01% { width: 0; }
	 40% { width: 0; }
	 55% { width: 100%; }
	 55.01% { width: 0; }
	 60% { width: 0; }
	 75% { width: 100%; }
	 75.01% { width: 0; }
	 80% { width: 0; }
	 95% { width: 100%; }
	95.01% { width: 0; }
	100% { width: 0; }
}



/*---------- VII. Navigation ----------*/

/*---------- Top-(Main-)Navigation ----------*/

nav.top-nav {
	position: relative;
	z-index: 3;
}

nav.top-nav ul {
	margin: 0;
}

nav.top-nav li {
	position: relative;
	float: left;
	list-style: none;
}

nav.top-nav li a {
	display: inline-block;
	text-transform: uppercase;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}

nav.top-nav li:hover a {
        text-decoration: none;
}


/* first level navigation */

nav.top-nav > ul > li > a {
	margin: 0;
	padding: 0 25px 0 15px;
	color: #fff;
	line-height: 60px;
}

nav.top-nav > ul > li > a:only-child {
	padding: 0 15px;
}

nav.top-nav > ul li > a:after {
	position: absolute;
	right: 10px;
	content: '\f502';
	color: #fff;
        font: normal 8px 'Genericons';
	line-height: 60px;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}

nav.top-nav > ul li > a:only-child:after {
	content: '';
}

nav.top-nav > ul > li:hover a {
	color: #fff;
}


/* sub menu navigation */

nav.top-nav li ul {	
	position: absolute;
	top: -9999px;
	left: 0;
	padding: 0 5px;
	opacity: 0;
	background: #fff;
	box-shadow: 1px 1px 5px rgba(0,0,0,0.4);
	-webkit-transition: opacity .5s ease-in-out;
	-moz-transition: opacity .5s ease-in-out;
	-o-transition: opacity .5s ease-in-out;
	-ms-transition: opacity .5s ease-in-out;
	transition: opacity .5s ease-in-out;
	z-index: 1;
}

nav.top-nav li ul ul:before {
	display: none;
}

nav.top-nav li:hover ul {
	top: 60px;
	opacity: 1;
}

nav.top-nav li:hover li a {
	position: relative;
	float: left;
	width: 250px;
	padding: 10px;
	margin: 0;
	background: #fff;
	font-size: 1em;
	text-transform: none;
}

nav.top-nav li:hover li {
	margin-right: 0;
	border-bottom: 1px solid #eee;
}

nav.top-nav li:hover li:last-child {
	border-bottom: none;
}

nav.top-nav li li:hover > a {
	color: #fff;
}

nav.top-nav li li > a:after {
	position: absolute;
	right: 0;
	top: 50%;
	content: '\f501';
        font: normal .7em 'Genericons';
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

nav.top-nav li ul li ul,
nav.top-nav li:hover ul ul,
nav.top-nav li ul li:hover ul ul,
nav.top-nav li ul ul li:hover ul ul,
nav.top-nav li ul ul ul li:hover ul ul {
	top: -9999px;
	left: 250px;
	margin: 0;
	opacity: 0;
}

nav.top-nav li ul li:hover ul,
nav.top-nav li ul ul li:hover ul,
nav.top-nav li ul ul ul li:hover ul,
nav.top-nav li ul ul ul ul li:hover ul {
	top: 0;
	opacity: 1;
}



/* Footer navigation (only first level) */

nav.footer-nav {
	position: relative;
	float: left;
	width: 100%;
	margin-bottom: 5px;
	font-weight: 700;
}

nav.footer-nav ul.navigation {
	width: auto;
}

nav.footer-nav ul {
	margin: 0;
}

nav.footer-nav li {
	position: relative;
	display: inline;
	list-style: none;
	text-transform: uppercase;
}

nav.footer-nav li a {
	display: inline;
	margin: 0 10px;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}

nav.footer-nav li:first-child a {
	margin-left: 0;
}

nav.footer-nav li:last-child span.menu-divider {
	display: none;
}


/*---------- VIII. Post & Pages content ----------*/

/*---------- Declarations for all type of posts and pages ----------*/

.post {
	position: relative;
	float: left;
	width: 100%;
	margin: 0 0 30px 0;
}

.post-thumbnail {
	float: left;
	width: 100%;
	margin: 20px 0;
	background: #f7f7f7;
	text-align: center;
}

.post-entry {
	font-size: 0.9em;
}

.page-title,
.post-title {
	margin: 0 0 10px 0;
}

.post-meta {
	margin: 10px 0;
	display: none;				/* Walensky am 24.1.2017 */
}

.post-body p, 
.post-body > img {
	margin: 10px 0;
}

blockquote {
	position: relative;
	width: 100%;
	margin: 20px auto;
	padding: 20px;
}

pre {
	position: relative;
	display: inline-block;
	width: 100%;
	margin: 20px 0;
	padding: 20px;
	font-family: Consolas, monospace;
        white-space: pre-wrap;
        white-space: -moz-pre-wrap !important; 
        white-space: -pre-wrap;
        white-space: -o-pre-wrap; 
        word-wrap: break-word;
}

blockquote:before,
pre:before {
	position: relative;
	float: right;
	content: '\f106';
	padding: 0 0 10px 10px;
	font-family: 'Genericons';
	font-size: 48px;
	color: rgba(0,0,0,0.1);
	line-height: 1em;
}

pre:before {
	content: '\f462';
}

a.more-link {
	float: left;
	margin-top: 10px;
	padding: 5px 15px;
	color: #fff;
	text-align: center;
	text-transform: uppercase;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: 0.2s;
}

a.more-link .genericon {
	font-size: 20px;
	vertical-align: middle;
}

a.more-link:hover {
	color: #fff;
	text-decoration: none;
}


/*---------- Single-posts or pages ----------*/

body.single .post {
	margin: 0;
}

.post-meta .genericon {
	margin: 0 5px 0 10px;
	font-size: 24px;
	vertical-align: middle;
}

.post-meta .genericon:first-child {
	margin-left: 0;
}

.post-share {
	float: left;
	width: 100%;
	margin-top: 20px;
	padding: 30px;
}	

.post-share h6 {
	margin: 0 0 10px 0;
}

.post-share ul {
	margin: 0;
}

li.facebook,
li.twitter,
li.google,
li.pinterest {
	float: left;
	width: auto !important;
	margin: 0 10px 0 0 !important;
	border-bottom: none !important;
	list-style: none;
}

body.single .post-thumbnail {
	margin: 10px 0 20px 0;
}

body.single .post-title {
	font-size: 2.1em;
}

body.single .post-body {
	margin-top: 20px;
}

body.single .post-box {
	float: right;
	width: 75%;
	padding: 30px;
	background: #fff;
}

.author-info {
	float: left;
	margin-top: 20px;
	padding: 30px;
}

.author-info h6 {
	margin: 0 0 10px 0;
}

.author-avatar {
	float: right;
	margin: 0 0 20px 20px;
}

.author-avatar img {
	border-radius: 50%;
}

.post-recommendation {
	float: left;
	width: 100%;
	margin-top: 20px;
	padding: 30px;
	background: #efefef;
}

.post-recommendation h6 {
	margin: 0 0 10px 0;
}

.post-recommendation ul {
	margin: 0;
}

.post-recommendation li {
	float: left;
	width: 32%;
	margin: 0 2% 0 0;
	list-style: none;
}

.post-recommendation li:nth-child(3) {
	margin-right: 0;
}

.post-recommendation h2.post-title {
	margin: 0;
	font-size: 1.4em;
}

.post-recommendation .recommendation-thumbnail {
	width: 100%;
	margin: 0 0 10px 0;
}

.post-recommendation .recommendation-thumbnail img {
	width: 100%;
	height: auto;
}

.post-recommendation a.more-link {
	display: none;
}

body.page-template-page-no-sidebar .main-content {
	width: 100%;
}


/*---------- Blog & Archive-posts ----------*/

body.archive #content {
	padding: 30px;
	background: #fff;
}

body.blog .post {
	padding-bottom: 30px;
	border-bottom: 1px solid #ccc;
}

body.blog article:last-of-type {
	padding-bottom: 0;
	margin-bottom: 0;
	border-bottom: none;
}

body.archive .post {
	float: left;
	width: 32%;
	height: 600px;
	margin-right: 2%;
}

body.archive .post:nth-child(3n) {
	margin-right: 0;
}


/*---------- Sticky-posts ----------*/

.sticky .post-title {
	padding-right: 40px;
}

.sticky:after {
	position: absolute;
	content: '\f308';
	top: 0;
	right: 0;
	padding: 4px;
	font-size: 24px;
	font-family: 'Genericons';
	color: #fff;
	border-radius: 50%;
}


/*---------- 404-Page ----------*/

body.error404 .post-body {
	position: relative;
	padding: 100px 30px;
	background: #fff;
	z-index: 1;
}

body.error404 .post-body:before {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: 0 0 0 -350px;
	content: '\f423';
	font-family: 'Genericons';
	font-size: 700px;
	color: #efefef;
	z-index: -1;
}

body.error404 .post-body span.screen-reader-text {
	display: none;
}

body.error404 .post-body form {
	position: relative;
	width: 50%;
	margin: 30px auto;
	padding: 0;
}

body.error404 .post-body input.search-field {
	width: 100%;
	font-size: 1.2em;
}

body.error404 .post-body input.search-submit {
	position: absolute;
	right: 0;
	top: -10px;
	height: 100%;
}


/*---------- Single-attachment-page ----------*/

body.single-attachment #content {
	padding: 30px;
	background: #fff;
}

body.single-attachment .post-body {
	margin-top: 0;
}


/*---------- Search-result-page ----------*/

body.search-results #content,
body.search-no-results #content {
	padding: 30px;
	background: #fff;
}

body.search-results .post {
	float: left;
	width: 32%;
	height: 600px;
	margin-right: 2%;
}

body.search-results .post:nth-child(3n) {
	margin-right: 0;
}

body.search span.screen-reader-text {
	display: none;
}

body.search-no-results .entry {
	margin-bottom: 60px;
}

body.search-no-results .post-body {
	position: relative;
	padding: 100px 0 40px 0;
}

body.search-no-results .post-body form {
	position: relative;
	width: 50%;
	margin: 40px auto;
	padding: 0;
}

body.search-no-results .post-body input.search-field {
	width: 100%;
	font-size: 1.2em;
}

body.search-no-results .post-body input.search-submit {
	position: absolute;
	right: 0;
	top: -10px;
	height: 100%;
}

.search-archive {
	float: left;
	width: 100%;
	margin: 30px 0;
}

.search-archive-column {
	float: left;
	width: 50%;
}

.search-archive-column:nth-child(1) {
	border-right: 1px solid #fff;
}

.search-archive input[type=checkbox] {
	display: none;
}

.search-archive label {
	position: relative;
	float: left;
	width: 100%;
	cursor: pointer;
	padding: 10px 20px 10px 50px;
	border-bottom: 1px solid #fff;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}

.search-archive label h6 {
	margin: 0;
	color: #fff;
}

.search-archive label:before {
	position: absolute;
	content: '\f405';
	top: 50%;
	right: 10px;
	margin-top: -12px;
	font-size: 24px;
	font-family: 'Genericons';
	text-decoration: inherit;
	font-weight: normal;
	font-style: normal;
	color: #fff;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}

.search-archive ul {
	float: left;
	width: 100%;
	display: none;
	padding: 20px;
	margin: 0;
	background: #f7f7f7;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
	overflow: hidden;
}

.search-archive input[type=checkbox]:checked ~ ul {
	display: block;
}

.search-archive input[type=checkbox]:checked ~ label:before {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
}
 
.search-archive li {
	display: inline-block;
	list-style: none;
	line-height: 3em;
}

.search-archive a {
	padding: 10px;
	color: #fff;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: 0.2s;
}

.search-archive a:hover {
	color: #fff;
}

.search-archive label span.genericon {
	position: absolute;
	top: 50%;
	left: 10px;
	margin-top: -12px;
	font-size: 24px;
	color: #fff;
}


/*---------- Post-images and gallery ----------*/	

.post-body img,
.wp-post-image {
	max-width: 100%;
	height: auto;
}

.post-content iframe,
.post-content embed {
	margin: 20px 0;
}

img.alignnone {
	margin: 10px 20px 20px 0;
}

img.alignleft {
	float: left;
	margin: 10px 20px 20px 0;
}

img.alignright {
	float: right;
	margin: 10px 0 20px 20px;
}

img.aligncenter {
	display: block; 
	margin: 20px auto;
}

.wp-caption {
	position: relative;
	max-width: 100%;
}

.wp-caption.aligncenter {
	display: block;
	margin: 20px auto;
}

.wp-caption.alignnone {
	margin: 10px 20px 20px 0;
}

.wp-caption.alignleft {
	float: left;
	margin: 10px 20px 20px 0;
}

.wp-caption.alignright {
	float: right;
	margin: 10px 0 20px 20px;
}

.wp-caption img {
	width: auto;
	height: auto;
	margin: 0;
	border: 0 none;
}

.wp-caption-text {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 5px 10px;
	background: rgba(255,255,255,.6);
	font-size: 0.9em;
	line-height: 1.2em;
}

.gallery {
	float: left;
	margin: 40px auto !important;
	padding: 20px 20px 0 20px;
}

.gallery .gallery-item {
	position: relative;
	float: left;
	width: 33%;
	margin: 0 0 20px 0;
}

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

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

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

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

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

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

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

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

.gallery-icon.landscape {
	text-align: center;
}

.gallery img {
	border: none !important;
}

.gallery img:hover {
	background: white;
}

.gallery-columns-2 .attachment-thumbnail {
	max-width: 98%;
	height: auto;
}

.gallery-columns-3 .attachment-thumbnail {
	max-width: 97%;
	height: auto;
}

.gallery-columns-4 .attachment-thumbnail {
	max-width: 96%;
	height: auto;
}

.gallery-columns-5 .attachment-thumbnail {
	max-width: 95%;
	height: auto;
}

.gallery-columns-6 .attachment-thumbnail {
	max-width: 94%;
	height: auto;
}

.gallery-columns-7 .attachment-thumbnail {
	max-width: 93%;
	height: auto;
}

.gallery-columns-8 .attachment-thumbnail {
	max-width: 92%;
	height: auto;
}

.gallery-columns-9 .attachment-thumbnail {
	max-width: 91%;
	height: auto;
}

.gallery dl, .gallery dt { 
	margin: 0; 
}

.gallery br+br { 
	display: none; 
}


/*---------- XI. Sidebar ----------*/

aside a {
	color: #555555;
}

aside > ul,
.sidebar-area > ul {
	margin: 0;
}

.sidebar-blog {
	float: left;
	width: 25%;
	padding: 30px;
	color: #fff;
}

.sidebar-footer,
.sidebar-responsive {
	float: left;
	width: 100%;
	padding: 30px;
	background: #333;
}

.sidebar-responsive {
	display: none;
}

.sidebar-area {
	float: left;
	width: 22.75%;
	margin-right: 3%;
}

.sidebar-area:nth-child(4) {
	margin-right: 0;
}

h6.widgettitle {
	margin: 0 0 10px 0;
	padding-bottom: 5px;
	border-bottom: 2px solid #000;			/* 24.1.2017 by Walensky */
	text-transform: uppercase;
	color: #000;
}

li.widget {
	float: left;
	width: 100%;
	margin: 0 0 10px 0;			/* Walensky, 18.1.2017 */
	padding-bottom: 10px;
	border-bottom: 2px solid #000;		/* Walensky, 18.1.2017 */
	list-style: none;
}

li.widget select {
	width: 100%;
}

li.widget:last-child {
	margin: 0;
}

li.widget ul {
	margin-left: 0;
}

li.widget ul li {
	float: left;
	width: 100%;
	margin: 0 0 5px 0;
	padding-bottom: 5px;
	list-style: none;
	border-bottom: 1px solid #555;
}

li.widget ul li:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

li.widget li > ul.children {
	padding-bottom: 5px;
	border-bottom: 1px solid #555;
}

li.widget li > ul.children,
li.widget li > ul.sub-menu {
	padding-bottom: 5px;
	border-bottom: 1px solid #555;
}

li.widget ul.children {
	width: 100%;
	margin-left: 0;
}

li.widget ul.children li:last-child,
li.widget ul.sub-menu li:last-child {
	padding: 0;
}

li.widget ul.children li:first-child,
li.widget ul.sub-menu li:first-child {
	margin-top: 10px;
}

table#wp-calendar {
	width: 100%;
	text-align: center;
}

table#wp-calendar caption {
	margin-bottom: 10px;
	padding: 5px 10px;
	background: rgba(0,0,0,0.2);
	text-align: left;
	text-transform: uppercase;
}

table#wp-calendar thead {
	background: #222;
	color: #fff;
}

table#wp-calendar tbody tr:nth-child(2n) {
	background: rgba(0,0,0,0.2);
}

li.widget_search form {
	position: relative;
	padding: 0;
	margin: 0;
}

li.widget_search label span.screen-reader-text {
	display: none;
}

li.widget_search input.search-field {
	width: 100%;
	height: 40px;
	padding: 0 100px 0 10px;
	line-height: 40px;
	font-size: 1.2em;
}

li.widget_search input.search-submit {
	position: absolute;
	top: 0;
	right: 0;
	height: 40px;
	margin: 0;
	padding: 0 20px;
	line-height: 40px;
}


/*---------- X. Comments ----------*/

#comments {
	float: left;
	width: 100%;
	margin-top: 40px;
}

.page-template-guestbook-php #comments {
	margin-top: 30px;
}

#comments ul,
#comments ol {
	margin: 0;
}

h6.notice {
	position: relative;
	margin: 0 0 40px 0;
	padding: 20px 20px 20px 60px;
	font-size: 1.3em;
	color: #fff;
}

h6.notice:before {
	position: absolute;
	content: '\f455';
	top: 0;
	left: 0;
	height: 100%;
	padding: 20px 5px 0 5px;
	background: rgba(0,0,0,0.2);
	font-family: 'Genericons';
	font-size: 28px;
	vertical-align: middle;
}

.page-template-guestbook-php h6.notice {
	margin: 30px 0 10px 0;
}

#comments .error  { 
	color: #f00; 
}

.comment-awaiting-moderation {
	position: relative;
	margin: 10px 0 0 0 !important;
	padding: 15px 20px 15px 50px;
	font-style: normal;
	color: #fff;
	text-transform: uppercase;
}

.comment-awaiting-moderation:before {
	position: absolute;
	content: '\f455';
	top: 0;
	left: 0;
	height: 100%;
	padding: 15px 5px 0 5px;
	background: rgba(0,0,0,0.2);
	font-family: 'Genericons';
	font-size: 24px;
	vertical-align: middle;
}

.comment_approved {
	font-weight: 700;
}

.commentlist li {
	position: relative;
	float: left;
	width: 100%;
	list-style: none;
	margin-top: 30px;
}

.commentlist li:before {
	position: absolute;
	width: 0;
	height: 0;
	top: 20px;
	left: 90px;
	display: block;
	content: '';
	border-width: 10px 10px 10px 0;
	border-style: solid;
	border-color: transparent;
}

.commentlist > ul > li:first-child {
	margin-top: 20px;
}

.commentlist ul.children {
	float: right;
	width: 98%;
}

.commentlist ul.children li {
	margin-top: 10px;
}

.commentlist li .avatar {
	position: absolute;
	left: 0;
	top: 0;
	border-radius: 50%;
}

.commentlist li .comment-author {
	font-size: 1.2em;
	text-transform: uppercase;
}

b.fn {
	font-weight: normal;
}

.commentlist li .comment-author.vcard {
	float: left;
}

li.pingback:before {
	display: none;
}

.commentlist li .comment-author cite {
	font-style: normal;
}

.commentlist li div.comment-author .says {
	display: none;
}

.commentlist li .comment-meta {
	padding: 20px 40px 0 40px;
	margin-left: 100px;
	z-index: 1;
}

li.pingback .comment-meta {
	margin-left: 0;
}

li.bypostauthor > article .comment-meta {
	border-top: 5px solid;
}

.commentlist li .comment-metadata {
	padding-bottom: 10px;
	border-bottom: 1px solid #ccc;
	font-size: 0.9em;
	text-align: right;
}

span.edit-link {
	margin-left: 10px;
	padding-left: 10px;
	border-left: 1px solid #ccc;
}

.commentlist li div.comment-meta a {
	font-size: 0.85em;
}

.comment-content {
	margin-left: 100px;
	padding: 15px 40px 25px 40px;
}

li.pingback .comment-content {
	margin-left: 0;
}

.commentlist li p {
	margin: 0 0 10px 0;
}

.pingback .reply {
	display: none;
}

.reply {
	position: relative;
}

a.comment-reply-link {
	position: absolute;
	bottom: 0;
	right: 0;
	padding: 2px 10px;
	text-transform: uppercase;
	font-size: 10px;
	color: #fff;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: 0.2s;
}

a.comment-reply-link:after {
	position: relative;
	float: left;
	margin-right: 5px;
	content: '\f467';
	font-family: 'Genericons';
	font-size: 14px;
}

a.comment-reply-link:hover {
	color: #fff;
	text-decoration: none;
}

#respond {
	position: relative;
	float: left;
	width: 100%;
	margin: 20px 0 0 0;
	padding: 30px;
}

a#cancel-comment-reply-link {
	position: absolute;
	top: 0;
	right: 0;
	padding: 0 10px;
	font-size: 10px;
	font-weight: 400;
	color: #fff;
	text-transform: uppercase;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: 0.2s;
}

a#cancel-comment-reply-link:after {
	position: relative;
	float: right;
	margin-left: 10px;
	content: '\f406';
	font-family: 'Genericons';
	font-size: 11px;
	font-weight: 700;
}

a#cancel-comment-reply-link:hover {
	text-decoration: none;
}

#respond h3 {
	margin: 0;
}

#respond form {
	padding: 0;
}

.page-template-guestbook-php #respond {
	margin-bottom: 40px;
}

#respond .comment-form p {
	position: relative;
	float: left;
	width: 100%;
	margin: 10px 0 0 0;
	padding: 0;
}

#respond p.comment-form-author,
#respond p.comment-form-email,
#respond p.comment-form-url {
	width: 32%;
	margin-right: 2%;
}

#respond p.comment-form-url {
	margin-right: 0;
}

#respond .comment-form p label {
	float: left;
	margin: 5px 0;
	text-transform: uppercase;
}

#respond .comment-form p label small {
	margin-left: 3px;
	font-size: 0.85em;
}

#respond .comment-form textarea,
#respond .comment-form input {
	width: 100%;
}

#respond .comment-form textarea {
	height: 200px;
	overflow: auto;
} 

#respond .comment-form #submit {
	position: relative;
	float: left;
	width: auto;
	padding: 10px 15px;
}


/*---------- XI. Side- & Post-navigation ----------*/

/*---------- Side-navigation ----------*/

.side-navigation .nav-left a,
.side-navigation .nav-right a {
	position: fixed;
	top: 50%;
	left: 0;
	height: 80px;
	margin-top: -30px;
	padding: 20px 15px;
	background: rgba(0,0,0,0.2);
	font-size: 60px;
	color: #fff;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: 0.2s;
}

.side-navigation .nav-left a:hover,
.side-navigation .nav-right a:hover {
	background: rgba(0,0,0,0.4);
}

.side-navigation .nav-right a {
	left: auto;
	right: 0;
}


/*---------- Post-navigation ----------*/

.post-navigation {
	position: relative;
	float: left;
	width: 100%;
	margin: 20px 0 0 0;
	line-height: 1.3em;
	font-weight: 700;
}

.post-navigation h6 {
	margin: 0;
}

.post-navigation a p {
	margin: 0;
	font-size: 0.85em;
	text-transform: uppercase;
}

.post-navigation .nav-left a,
.post-navigation .nav-right a {
	position: relative;
	float: left;
	width: 49%;
	margin: 0;
	padding: 20px 30px;
	text-transform: none;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}

.post-navigation .nav-left a:before,
.post-navigation .nav-right a:before {
	position: absolute;
	left: 10px;
	top: 50%;
	margin-top: -10px;
	content: '\f503';
        font: normal 20px 'Genericons';
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}

.post-navigation .nav-right a:before {
	right: 10px;
	content: '\f501';
	text-align: right;
}

.post-navigation .nav-left a:hover:before {
	left: 5px;
}

.post-navigation .nav-right a:hover:before {
	right: 5px;
}

.post-navigation .nav-right a {
	float: right;
	padding-right: 50px;
	text-align: left;
}

.post-navigation.single .nav-right a {
	text-align: left;
}

.post-navigation .nav-left a {
	padding-left: 50px;
	text-align: right;
}

.post-navigation.single .nav-left a {
	text-align: right;
}

.post-navigation a:hover {
	text-decoration: none;
}	


/*---------- XII. Comment-navigation ----------*/

.comment-navigation {
	float: left;
	width: 100%;
	margin: 20px 0 0 0;
	font-size: 0.85em;
	line-height: 1.3em;
}

.page-template-guestbook-php .comment-navigation {
	margin-bottom: 0;
}

.comment-navigation a {
	position: relative;
	padding: 10px 30px 10px 20px;
	color: #fff;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: all 0.2s;
}	

.comment-navigation a:hover {
	color: #fff;
	text-decoration: none;
}

.comment-navigation a:before {
	position: absolute;
	left: 5px;
	top: 50%;
	margin-top: -7px;
	content: '\f503';
        font: normal 14px 'Genericons';
}

.comment-navigation .nav-right a:before {
	left: auto;
	right: 5px;
	content: '\f501';
}

.comment-navigation .nav-left {
	float: left;
	width: 50%;
}

.comment-navigation .nav-right {
	float: right;
	width: 50%;
	text-align: right;
}

.comment-navigation .nav-left a {
	padding: 10px 20px 10px 30px;
}


/*---------- XIII. Shortcodes ----------*/

/*---------- Multiple columns ----------*/

.two-columns {
	-webkit-column-count: 2;
	-moz-column-count: 2;
	-o-column-count: 2;
	-ms-column-count: 2;
	column-count: 2;
}

.three-columns {
	-webkit-column-count: 3;
	-moz-column-count: 3;
	-o-column-count: 3;
	-ms-column-count: 3;
	column-count: 3;
}

.four-columns {
	-webkit-column-count: 4;
	-moz-column-count: 4;
	-o-column-count: 4;
	-ms-column-count: 4;
	column-count: 4;
}

.five-columns {
	-webkit-column-count: 5;
	-moz-column-count: 5;
	-o-column-count: 5;
	-ms-column-count: 5;
	column-count: 5;
}

/*---------- Infoboxes ----------*/

.infobox {
	position: relative;
	float: left;
	width: 100%;
	margin: 20px 0;
	padding: 30px;
}

.infobox .infobox-title {
	margin-top: 0;
}

.infobox:before {
	float: right;
	margin: -10px -10px 20px 20px;
	font-family: 'Genericons';
	font-size: 64px;
	line-height: 1em;
	opacity: 0.2;
}

.infobox.dashed {
	width: auto;
	margin: 40px 20px;
	border: 2px dashed rgba(0,0,0,0.2);
	outline: 20px solid;
}

.infobox.solid {
	width: auto;
	margin: 40px 20px;
	border: 2px solid rgba(0,0,0,0.2);
	outline: 20px solid;
}

.infobox.dotted {
	width: auto;
	margin: 40px 20px;
	border: 2px dotted rgba(0,0,0,0.2);
	outline: 20px solid;
}

.infobox.yellow {
	outline-color: #FCF6BD;
	background: #FCF6BD;
}

.infobox.orange {
	outline-color: orange;
	background: orange;
	border-color: rgba(255,255,255,0.5);
	color: #fff;
}

.infobox.red {
	outline-color: #990000;
	background: #990000;
	border-color: rgba(255,255,255,0.5);
	color: #fff;
}

.infobox.blue {
	outline-color: #1e5799;
	background: #1e5799;
	border-color: rgba(255,255,255,0.5);
	color: #fff;
}

.infobox.lightgray {
	outline-color: #eee;
	background: #eee;
}

.infobox.darkgray {
	outline-color: #444;
	background: #444;
	border-color: rgba(255,255,255,0.5);
	color: #fff;
}

.infobox.olive {
	outline-color: #556B2F;
	background: #556B2F;
	border-color: rgba(255,255,255,0.5);
	color: #fff;
}

.infobox.white {
	outline-color: #fff;
	background: #fff;
	border-color: rgba(255,255,255,0.5);
	border: 5px solid #ccc;
}

.infobox.transparent {
	outline-color: rgba(0,0,0,.2);
	border-color: rgba(255,255,255,0.5);
	background: rgba(0,0,0,.2);
}

/*---------- Buttons ----------*/

.button a {
	display: inline-block;
	margin: 10px auto;
	padding: 10px 15px;
	font-size: 0.9em;
	color: #fff;
	line-height: 1em;
	text-transform: uppercase;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.button a:before {
	margin-right: 10px;
	-webkit-font-smoothing: antialiased;
	font: normal 1.8em 'Genericons';
	vertical-align: middle;
}

.button.big a:before {
	margin-right: 15px;
}

.button a:hover {
	color: #fff;
	text-decoration: none;
}

.button.left {
	float: left;
	margin-right: 10px!important;
}

.button.center {
	margin: 20px auto;
	text-align: center;
}

.button.right {
	float: right;
	margin-left: 10px!important;
}

.button.medium a {
	font-size: 1.2em;
	padding: 12px 20px;
}

.button.big a {
	font-size: 1.4em;
	padding: 15px 25px;
}

.button.yellow a {
	background: #FCF6BD;
	color: #222;
}

.button.orange a {
	background: orange;
	color: #fff;
}

.button.red a {
	background: #990000;
	color: #fff;
}

.button.blue a {
	background: #1e5799;
	color: #fff;
}

.button.lightgray a {
	background: #eee;
	color: #222;
}

.button.darkgray a {
	background: #444;
	color: #fff;
}

.button.olive a {
	background: #556B2F;
	color: #fff;
}

.button.transparent a {
	background: rgba(0,0,0,.2);
	color: #fff;
}

.button.yellow a:hover {
	background: #F9EC72;
}

.button.orange a:hover {
	background: #c79810;
}

.button.red a:hover {
	background: #cc0000;
}

.button.blue a:hover {
	background: #7270E0;
}

.button.lightgray a:hover {
	background: #ccc;
}

.button.darkgray a:hover {
	background: #666;
}

.button.olive a:hover {
	background: #627d4d;
}

.button.transparent a:hover {
	background: rgba(0,0,0,.5);
}


/*---------- XIV. Special styles for plugins ----------*/

.wpcf7 p,
.wpcf7 input[type="text"],
.wpcf7 input[type="url"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
	width: 100% !important;
}

.wp-pagenavi {
	float: left;
	width: 100%;
	margin: 0;
	padding-top: 30px;
	font-size: 0.9em;
	border-top: 1px solid #ccc;
}

body.blog .wp-pagenavi {
	margin-top: 30px;
}

.wp-pagenavi span,
.wp-pagenavi a {
	padding: 10px 15px !important;
	margin: 0 5px 0 0 !important;
	border: none !important;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}

.wp-pagenavi span.current,
.wp-pagenavi a:hover {
	color: #fff;
}



/*---------- XV. Fixes for browsers or devices ----------*/

/*---------- Fix for the Internet Explorer ----------*/

a img {
	border: none;
}


/*---------- Fix for the checkbox hack on old Android-devices ----------*/

body { 
	-webkit-animation: bugfix infinite 1s; 
}

@-webkit-keyframes bugfix { 
	from { padding: 0; } 
	to { padding: 0; } 
}


/*---------- XVI. Media Queries for the responsive layout ----------*/

/*---------- Generell parameters ----------*/

@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}


/*---------- for devices with less than 1200 pixel maximum-width ----------*/

@media screen and (max-width: 1200px) {

#container {
	width: auto;
}

}


/*---------- for devices with less than 1024 pixel maximum-width ----------*/

@media screen and (max-width: 1024px) {

#content,
.header-content {
	top: 0 !important;
	margin-bottom: 0 !important;
}

.menu-bar {
	position: relative;
	height: auto;
	margin-top: -9999px;
}

input#top-bar-navigation[type=checkbox]:checked ~ .menu-bar {
	margin-top: 0;
}

input#top-bar-navigation[type=checkbox]:checked ~ #content,
input#top-bar-navigation[type=checkbox]:checked ~ .header-content,
input#top-bar-navigation[type=checkbox]:checked ~ .menu-bar,
input#top-bar-navigation[type=checkbox]:checked ~ footer.side-footer {
	top: 0;
}

nav.top-nav {
	line-height: 1.3em !important;
}

nav.top-nav li {
	float: none;
	border: 0 !important;
}

nav.top-nav li ul {
	position: relative !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	opacity: 1 !important;
	box-shadow: none !important;
	background: none !important;
}

nav.top-nav li a {
	width: 100% !important;
	padding: 15px 20px !important;
	background: none !important;
	line-height: 1.3em !important;
	color: #fff !important;
	text-transform: none !important;
	border-bottom: 1px solid #555;
}

nav.top-nav ul li.current-menu-item > a,
nav.top-nav li a:hover {
	background: #3a3a3a !important;
}

nav.top-nav > ul li > a:after,
nav.top-nav li li > a:after {
	display: none;
}

}


/*---------- for devices with less than 800 pixel maximum-width ----------*/

@media screen and (max-width: 800px) {

.sidebar,
body.page .main-content, 
body.blog .main-content,
body.single .post-box {
	width: 100%;
}

body.search .post,
body.archive .post {
	width: 48%;
	margin-right: 4%;
}

body.search .post:nth-child(3n),
body.archive .post:nth-child(3n) {
	margin-right: 4%;
}

body.search .post:nth-child(2n),
body.archive .post:nth-child(2n) {
	margin-right: 0;
}

.sidebar-blog,
.sidebar-footer {
	display: none;
}

.sidebar-responsive {
	display: block;
}

#respond .comment-form p.comment-form-author,
#respond .comment-form p.comment-form-email,
#respond .comment-form p.comment-form-url {
	width: 100%;
	margin-right: 0;
}

.four-columns,
.five-columns {
	-webkit-column-count: 3;
	-moz-column-count: 3;
	-o-column-count: 3;
	-ms-column-count: 3;
	column-count: 3;
}



}


/*---------- for devices with less than 700 pixel maximum-width ----------*/

@media screen and (max-width: 700px) {

label.responsive-social-icons {
	display: block;
}

.top-bar-social {
	position: fixed;
	bottom: -100%;
	left: 0;
	width: 100%;
	margin: 0;
	padding: 10px 20px !important;
	background: #333;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}

.top-bar-social ul {
	float: none;
	margin: 0;
	text-align: center;
}

.top-bar-social li {
	float: none;
	display: inline-block;
	margin-right: 10px;
}

.top-bar-social li:last-child {
	margin-right: 0;
}

.top-bar-social li a span {
	width: 30px;
	height: 30px;
	font-size: 20px;
	line-height: 30px;
}

input#responsive-socialicons[type=checkbox]:checked ~ .top-bar-social {
	bottom: 0;
}


}


/*---------- for devices with less than 600 pixel maximum-width ----------*/

@media screen and (max-width: 600px) {

.site-info {
	text-align: center;
}

.header-slider {
	font-size: 0.85em;
}

.credits {
	max-width: 100%;
}

.logo-footer {
	width: 100%;
	margin: 0 0 20px 0;
}

a.scroll-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
}

body.search .post,
body.archive .post {
	width: 100%;
	height: auto;
	margin-right: 0 !important;
	padding-bottom: 30px;
	border-bottom: 1px solid #ccc;
}

body.search .post:last-of-type,
body.archive .post:last-of-type {
	padding-bottom: 0;
	border-bottom: none;
}

body.search .post-thumbnail img,
body.archive .post-thumbnail img {
	width: 100%;
}

.post-recommendation li {
	width: 100%;
	margin: 0 0 20px 0;
	padding-bottom: 20px;
	border-bottom: 1px solid #ccc;
}

.post-recommendation li:last-child {
	margin: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.search-archive-column {
	float: none;
	width: 100%;
}

.search-archive-column:nth-child(1) {
	border-right: none;
}

body.error404 .post-body form,
body.search-no-results .post-body form {
	width: 100%;
}

.three-columns,
.four-columns,
.five-columns {
	-webkit-column-count: 2;
	-moz-column-count: 2;
	-o-column-count: 2;
	-ms-column-count: 2;
	column-count: 2;
}

.commentlist li .comment-meta,
.comment-content {
	margin-left: 0;
	padding-left: 60px;
}

.commentlist li .avatar {
	top: -10px;
	left: -10px;
}

.commentlist li img.avatar {
	width: 60px;
	height: 60px;
}

.commentlist li:before {
	display: none;
}

}


/*---------- for devices with less than 400 pixel maximum-width ----------*/

@media screen and (max-width: 400px) {

.post-navigation .nav-left a,
.post-navigation .nav-right a {
	width: 100%;
}

.post-navigation .nav-left a {
	margin-bottom: 20px;
}

.two-columns,
.three-columns,
.four-columns,
.five-columns {
	-webkit-column-count: 1;
	-moz-column-count: 1;
	-o-column-count: 1;
	-ms-column-count: 1;
	column-count: 1;
}


}


/*---------- Iconlist for the shortcode-page ----------*/
/*---------- The following declarations should be deleted in the final release ----------*/


#iconlist {
	float: left;
	margin: 20px 0;
}

#iconlist div {
	position: relative;
	padding: 20px 20px 50px 20px;
	overflow: hidden;
	white-space: nowrap;
	font-size: 42px;
	line-height: 1;
	width: 42px;
	height: 42px;
	margin-right: 10px;
	margin-bottom: 10px;
	background: #333;
	color: #fff;
}

#iconlist .genericon:before {
	margin-right: 20px;
}

#iconlist .genericon:after {
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 10px 5px;
	background: #3a3a3a;
	content: attr(title);
	display: block;
	font-size: 10px;
	color: #ccc;
	font-family: Consolas, monospace;
	text-align: center;
	white-space: normal;
}

#iconlist *,
#iconlist *:before,
#iconlist *:after {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-ms-box-sizing: content-box;
	box-sizing: content-box;
}


/*---------- End of style.css ----------*/