/*
Theme Name: Netzberufler
Theme URI: https://themezee.com/themes/netzberufler/
Author: ThemeZee
Author URI: https://themezee.com
Description: Netzberufler is an elegant designed WordPress theme featuring a splendid fullscreen image slideshow. The clean typography and spacious white layout makes it great to share your stories. You can use the theme as simple blog or easily create a news website with the widget-based Magazine Homepage template.
Version: 1.0.5
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: netzberufler
Tags: two-columns, light, blue, custom-background, custom-header, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, custom-colors, full-width-template, sticky-post, threaded-comments, translation-ready, theme-options, fluid-layout, responsive-layout, one-column, left-sidebar, right-sidebar, three-columns, black, red, silver, white, green, gray

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.

Netzberufler is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 - Normalize
2.0 - Typography
3.0 - Elements
4.0 - Forms
5.0 - Accessibility
6.0 - Alignments
7.0 - Clearings
8.0 - Layout Structure
9.0 - Header
10.0 - Navigation
	10.1 - Main Navigation
	10.2 - Social Icon Menu
11.0 - Widgets
	11.1 - Default Widgets
	11.2 - Magazine Posts Widgets
12.0 - Posts and pages
11.0 - Comments
12.0 - Footer
13.0 - Media
	13.1 - Captions
	13.2 - Galleries
14.0 - Media Queries
	14.1 - Desktop Large ( < 1120px )
	14.2 - Desktop Medium ( < 1040px )
	14.3 - Desktop Small ( < 960px )
	14.4 - Tablet Large ( < 880px )
	14.5 - Tablet Medium ( < 800px )
	14.6 - Tablet Small ( < 720px )
	14.7 - Mobile Extra Large ( < 640px )
	14.8 - Mobile Large ( < 560px )
	14.9 - Mobile Medium ( < 480px )
	14.10 - Mobile Small ( < 320px )
15.0 - Theme Option Styles
	15.1 - Sidebar Left Layout
	15.2 - Sticky Header
16.0 - Media Query Fixes
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# 1.0 - Normalize
--------------------------------------------------------------*/
html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}

body {
	margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
	display: block;
}

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

a {
	background-color: transparent;
}

a:active,
a:hover {
	outline: 0;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

mark {
	background: #ff0;
	color: #000;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

img {
	border: 0;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 1em 40px;
}

hr {
	box-sizing: content-box;
	height: 0;
}

pre {
	overflow: auto;
}

code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"] {
	-webkit-appearance: textfield;
	box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
}

/*--------------------------------------------------------------
# 2.0 - Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
	color: #404040;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 16px;
	font-size: 1rem;
	line-height: 1.8;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
	font-size: 15px;
	font-size: 0.9375rem;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	text-decoration: none;
}

big {
	font-size: 125%;
}

/*--------------------------------------------------------------
# 3.0 - Elements
--------------------------------------------------------------*/
html {
	box-sizing: border-box;
}

*,
*:before,
*:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
	box-sizing: inherit;
}

body {
	background: #404040; /* Fallback for when there is no custom background color defined. */
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
}

blockquote,
q {
	quotes: "" "";
}

hr {
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: bold;
}

dd {
	margin: 0 1.5em 1.5em;
}

img {
	height: auto; /* Make sure images are scaled correctly. */
	max-width: 100%; /* Adhere to container width. */
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

a {
	color: #22aadd;
	text-decoration: none;
}

a:link,
a:visited {
	color: #22aadd;
}

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

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/*--------------------------------------------------------------
# 4.0 - Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	padding: 0.4em 0.8em;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 13px;
	font-size: 0.8125rem;
	font-weight: bold;
	color: #fff;
	background: #22aadd;
	border: none;
	text-transform: uppercase;
	text-decoration: none;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
	background: #404040;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
	max-width: 100%;
	padding: 0.3em 0.6em;
	color: #666;
	border: 1px solid #ddd;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
	color: #111;
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# 5.0 - Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}

/*--------------------------------------------------------------
# 6.0 - Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*--------------------------------------------------------------
# 7.0 - Clearings
--------------------------------------------------------------*/
.clearfix:before,
.clearfix:after {
	content: "";
	display: table;
}

.clearfix:after {
	clear: both;
}

/*--------------------------------------------------------------
# 8.0 - Layout Structure
--------------------------------------------------------------*/
.site {
	max-width: 800px;
	width: 100%;
	margin: 5em auto;
	padding: 4em 5em;
	background: #fff;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.site-content {
	margin-top: 2em;
	border-top: 2px solid #404040;
	padding-top: 2em;
}

/*--------------------------------------------------------------
# 9.0 - Header
--------------------------------------------------------------*/
.site-branding {
	max-width: 100%;
	margin: 0;
	padding: 0;
}

/*--------------------------------------------------------------
# 10.0 - Navigation
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 10.1 - Main Navigation
--------------------------------------------------------------*/
.primary-navigation {
	float: right;
	margin: 1em 0;
}

.main-navigation-toggle {
	display: none;
}

.main-navigation-menu {
	float: left;
	margin: 0;
	padding: 0;
	list-style-type: none;
	list-style-position: outside;
	position: relative;
}

.main-navigation-menu li {
	float: left;
	position: relative;
}

.main-navigation-menu a {
	display: block;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 15px;
	font-size: 0.9375rem;
	font-weight: bold;
	padding: 1.2em;
	text-transform: uppercase;
	text-decoration: none;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.main-navigation-menu > .menu-item-has-children > a:after {
	display: inline-block;
	margin: 0.2em 0 0 0.2em;
	font-size: 16px;
	line-height: 1;
	font-family: 'Genericons';
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-decoration: inherit;
	vertical-align: top;
	content: '\f431';
	color: #404040;
}

.main-navigation-menu a:link,
.main-navigation-menu a:visited {
	color: #404040;
	text-decoration: none;
}

.main-navigation-menu a:hover,
.main-navigation-menu a:hover:after {
	color: #22aadd;
}

.main-navigation-menu ul {
	position: absolute;
	display: none;
	z-index: 99;
	margin: 0;
	padding: 0;
	list-style-type: none;
	list-style-position: outside;
	background: #fff;
	border: 1px solid #ddd;
	border-top: 4px solid #404040;
}

.main-navigation-menu ul li{
	margin: 0;
}

.main-navigation-menu ul a {
	width: 250px;
	width: 16rem;
	padding: 1em;
	float: left;
	font-size: 13px;
	font-size: 0.8125rem;
	border-bottom: 1px dotted #ccc;
	-webkit-transition: none;
	-moz-transition: none;
	-ms-transition: none;
	-o-transition: none;
	transition: none;
}

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

.main-navigation-menu ul .menu-item-has-children > a:after {
	display: inline-block;
	margin: 0.2em 0 0 0.2em;
	font-size: 14px;
	line-height: 1;
	font-family: 'Genericons';
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-decoration: inherit;
	vertical-align: top;
	content: '\f431';
	color: #404040;
	-webkit-transform:rotate(270deg);
	-moz-transform:rotate(270deg);
	-o-transform:rotate(270deg);
	-ms-transform:rotate(270deg);
}

.main-navigation-menu li ul ul {
	margin-left: 250px;
	margin-left: 16rem;
	margin-top: -4px;
}

.main-navigation-menu li:hover ul ul,
.main-navigation-menu li:hover ul ul ul,
.main-navigation-menu li:hover ul ul ul ul {
	display: none;
}

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

.main-navigation-menu li.current-menu-item > a {
	color: #22aadd;
}

/*--------------------------------------------------------------
## 10.2 - Social Icons Menu
--------------------------------------------------------------*/
.social-icons-navigation {
	float: left;
}

.social-icons-menu {
	margin: 0;
	padding: 0;
	list-style-type: none;
	list-style-position: outside;
	line-height: 1;
}

.social-icons-menu li {
	float: left;
	margin: 0;
	padding: 0;
}

.social-icons-menu li a {
	position: relative;
	display: inline-block;
	margin: 0 1em;
	text-decoration: none;
}

.social-icons-menu li a .screen-reader-text {
	display: none;
}

/* Add Genericons */
.social-icons-menu li a:before {
	color: #333;
	display: inline-block;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: 32px;
	line-height: 1;
	font-family: 'Genericons';
	text-decoration: inherit;
	vertical-align: top;
}

.social-icons-menu li a:hover:before {
	color: #999;
}

.social-icons-menu li a:before { content: '\f408'; } /* Default Icon */
.social-icons-menu li a[href*="codepen.io"]:before  { content: '\f216'; }
.social-icons-menu li a[href*="digg.com"]:before { content: '\f221'; }
.social-icons-menu li a[href*="dribbble.com"]:before { content: '\f201'; }
.social-icons-menu li a[href*="facebook.com"]:before { content: '\f204'; }
.social-icons-menu li a[href*="flickr.com"]:before { content: '\f211'; }
.social-icons-menu li a[href*="plus.google.com"]:before { content: '\f218'; }
.social-icons-menu li a[href*="github.com"]:before { content: '\f200'; }
.social-icons-menu li a[href*="instagram.com"]:before { content: '\f215'; }
.social-icons-menu li a[href*="linkedin.com"]:before { content: '\f207'; }
.social-icons-menu li a[href*="pinterest.com"]:before { content: '\f209'; }
.social-icons-menu li a[href*="polldaddy.com"]:before { content: '\f217'; }
.social-icons-menu li a[href*="getpocket.com"]:before { content: '\f224'; }
.social-icons-menu li a[href*="reddit.com"]:before { content: '\f222'; }
.social-icons-menu li a[href*="spotify.com"]:before { content: '\f515'; }
.social-icons-menu li a[href*="skype.com"]:before,
.social-icons-menu li a[href*="skype:"]:before { content: '\f220'; }
.social-icons-menu li a[href*="stumbleupon.com"]:before { content: '\f223'; }
.social-icons-menu li a[href*="tumblr.com"]:before { content: '\f214'; }
.social-icons-menu li a[href*="twitch.tv"]:before { content: '\f516'; }
.social-icons-menu li a[href*="twitter.com"]:before { content: '\f202'; }
.social-icons-menu li a[href*="vimeo.com"]:before  { content: '\f212'; }
.social-icons-menu li a[href*="wordpress.org"]:before { content: '\f205'; }
.social-icons-menu li a[href*="wordpress.com"]:before { content: '\f205'; }
.social-icons-menu li a[href*="youtube.com"]:before { content: '\f213'; }
.social-icons-menu li a[href*="newsletter"]:before,
.social-icons-menu li a[href*="mailto"]:before { content: '\f410'; }
.social-icons-menu li a[href*="/feed"]:before,
.social-icons-menu li a[href*="/feed/"]:before,
.social-icons-menu li a[href*="?feed=rss2"]:before,
.social-icons-menu li a[href*="feedburner.google.com"]:before,
.social-icons-menu li a[href*="feedburner.com"]:before { content: '\f413'; }

/*--------------------------------------------------------------
# 12.0 - Posts and pages
--------------------------------------------------------------*/
.type-post,
.type-page,
.type-attachment  {
	margin: 0 0 2em;
	max-width: 100%;
}

.page-title {
	display: inline;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 26px;
	font-size: 1.625rem;
	font-weight: bold;
	padding: 0;
	margin: 0;
	color: #404040;
	-ms-word-wrap: break-word;
	word-wrap: break-word;
}

.entry-content {
	font-size: 18px;
	font-size: 1.125rem;
}

/*--------------------------------------------------------------
# 12.0 - Footer
--------------------------------------------------------------*/
.site-footer {
	border-top: 2px solid #404040;
	padding: 1em 0 0;
	font-size: 15px;
	font-size: 0.9375rem;
}

.footer-navigation {
	float: right;
}

.footer-navigation-menu {
	display: inline;
	margin: 0;
	padding: 0;
	list-style-type: none;
	list-style-position: outside;
	position: relative;
}

.footer-navigation-menu li {
	display: inline-block;
}

.footer-navigation-menu a {
	display: inline-block;
	padding: 0 1em;
	text-decoration: none;
}

.footer-navigation-menu a:link,
.footer-navigation-menu a:visited {
	color: #404040;
	text-decoration: none;
}

.footer-navigation-menu a:hover,
.footer-navigation-menu a:active {
	color: #999;
}

/*--------------------------------------------------------------
# 13.0 - Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/*--------------------------------------------------------------
# 14.0 - Media Queries
--------------------------------------------------------------*/

@media only screen and (max-width: 65em) {

	.site {
		margin: 0;
		max-width: 100%;
		border: 3em solid #404040;
	}

	.page-title {
		font-size: 22px;
		font-size: 1.375rem;
	}

	.entry-content {
		font-size: 17px;
		font-size: 1.0625rem;
	}

}

@media only screen and (max-width: 55em) {

	.site {
		padding: 3em;
		border: 2em solid #404040;
	}

}

@media only screen and (max-width: 45em) {

	.site {
		border: none;
	}

}

@media only screen and (max-width: 25em) {

	.site {
		padding: 2em;
	}

	.page-title {
		font-size: 18px;
		font-size: 1.125rem;
	}

	.entry-content {
		font-size: 16px;
		font-size: 1rem;
	}

}