/* --- General style settings --- */
/* version 4.0 */
/* --- Colors --- */
/* #2b506f; RGB(43,80,111), mittel-dunkel Farbton von Cyan-blau */
/* #1b3347; RGB(27,51,71), dunkel Farbton von Cyan-blau */
/* #26729b; RGB(38,114,153), mittel-dunkel Farbton von Cyan-blau */
/* #cadff9; RGB(202,223,249), sehr hell Farbton von Cyan-blau */
/* #4d4d4d; RGB(77,77,77), Nippon Paint Black Swan, mittel-dunkel Farbton von Grau */
/* #dddddd; RGB(221,221,221), sehr hell Farbton von Grau */
/* #ffffff;	RGB(255,255,255), weiß */
/* copyright: 2x-anders */

html {
	/* font-size: 14px; */
	margin: 0;
	padding: 0;
}

body, header, footer {
	margin: 0; 
	padding: 0;
}

/* --- Body --- */

body {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: column;
    flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	width: 100%;
	height: 100%;
	font-family: Helvetica Neue, Helvetica, Verdana, sans-serif;
	font-size: 1.0rem;
	line-height: 1.5rem;
	color: #4d4d4d;
	background: #2b506f;
	word-break: break-word;
	word-wrap: break-word;
	text-align: justify;
}

/* --- Put all in the flexbox from the body --- */

body > * {
  padding: 0;
  flex: 1 1 auto;
}

/* --- Header --- */

header {
	flex-shrink: 0;
	flex: 0 0 100px;
	height: 100px;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 5px 0;
	background: #1b3347 url(/img/style/pixel_1b3347.png) repeat;
	overflow: hidden;
	line-height: 1rem;
}

header > * {	
	margin: 0;
	padding: 0;
}

.header-content {
	height: 100px;
	width: 100%;
	text-align: center;
	vertical-align: middle;
	margin-left: 50%;
	transform: translateX(-50%);
}

.header-content img {
	display: inline-block;
	height: 100px;
}

img.header-img-expanded-800, img.header-img-expanded-1280, img.header-img-expanded-1600 {
	display: none;
	overflow: hidden;
	height: 100px;
}


/* --- Footer --- */

footer {
	flex: 0 1 auto; /* initial */
	height: auto;
	width: 100%;
	max-width: 100%;
	background: #1b3347 url(/img/style/pixel_1b3347.png) repeat;
	min-height: 6rem;
	-ms-flex-item-align: end;
	align-self: flex-end;
	/* position: relative;
	bottom: 0; */
}

.footer > p {
	color: #cadff9;
	font-size: 0.9rem;
	text-decoration: none;
	line-height: 1.4em;
	text-align: center;
	margin: auto;
	padding: 1rem;
}

.footer a {
	color: #dddddd;
	text-decoration: none;
}

.footer a:hover, .footer a:focus {
	color: #ffffff;
	font-weight: 600;
	text-decoration: none;
	text-shadow: none;
}

/* --- Navigation (mobile first) --- */
nav {
	z-index: 1;
	width: 100%;
	max-width: 100%;
	background: #1b3347 url(/img/style/pixel_1b3347.png) repeat;
}

nav, ul, li, a, span {
	margin: 0; 
	padding: 0;
}

nav ul {
	list-style-type: none;
	display: none;
	background-color:#1b3347;
}

nav ul li {
	list-style-type: none;
}

nav ul li a {
	padding: 0.5rem 2rem;
	display:block;
	color:#cadff9;
	text-decoration: none;
	font-weight: 700;
	letter-spacing: 0.05em;
	white-space: nowrap;
}

nav ul li:hover {
	color:#ffffff;
	background:	rgba(0,0,0,.25);
	background: linear-gradient(top, #1b3347, #2b506f);
	background: -ms-linear-gradient(top, #1b3347, #2b506f);
	background: -webkit-gradient(linear, left top, left bottom, from(#1b3347), to(#2b506f));
	background: -moz-linear-gradient(top, #1b3347, #2b506f);
}

.has-submenu ul li a {
	padding-left: 3rem;
}
.has-submenu ul .has-submenu ul a {
	padding-left: 1.5rem;
}

/* toggle style */
[id^=drop] {
	display: none;
}
.toggle {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: row;
    flex-direction: row;
	justify-content: space-between;
	margin: 1rem 1rem;
	background: #1b3347 url(/img/style/pixel_1b3347.png) repeat;
	content: "\2630";
	font-size: 1.5rem;
	line-height: 1.0em;
	font-weight: 700;
	color:#cadff9;
	text-decoration: none;
	border:none;
	vertical-align: middle;
}

/* display dropdown menu when clicked */
[id^=drop]:checked + ul, .has-submenu ul, .has-submenu ul .has-submenu ul {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: column;
    flex-direction: column;
	background: #1b3347 url(/img/style/pixel_1b3347.png) repeat;
}

/* do not display buttons in dropdown menu */
.btn-all, .btn-infomail, .btn-lang {
	display: none;
}

.menu-btn-all > img {
	height: 1em;
	margin-left: 1em;
}

.toggle:hover, .toggle:focus {
	cursor: pointer;
}

/* --- Main content in a flexbox --- */
#main {	
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: column;
    flex-direction: column; 
	-ms-flex-align: stretch;
    align-items: stretch; 
	width: -webkit-calc(100% - 1rem);
	width: calc(100% - 1rem);
	max-width: 1600px;
	height: 100%;
	min-height: 100%; /* fix IE11 */  
	min-height: -webkit-calc(100vh - 110px - 12rem);
	min-height: calc(100vh - 110px - 12rem);
	margin: 1rem auto;
}

#main > * {
	flex: 1 1 auto;
}

/* --- Mainpage, landingpage (mobile first) --- */

#landingpage, .main-single {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: column;
    flex-direction: column; 
	-ms-flex-align: stretch;
    align-items: stretch; 
	height: 100%;
}

.main-content {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: column;
    flex-direction: column;
	-ms-flex-align: stretch;
    align-items: stretch;  
	background: #ffffff;
	height: 100%;
}

#main-welcome {
	color: #cadff9;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.4em;
	text-align: center;
	max-width: 80%;
	margin: 1.5rem auto;
}

.info-important {
	display: block;
	background-color: #ffffff;
	border: 0.5rem solid;
	border-color: #cadff9;
	-webkit-border-radius: 0.5rem;
	-moz-border-radius: 0.5rem;
	border-radius: 0.5rem;
	margin: 0.5rem 0;
	/* apply animation to this element: */ 
	/* animation: name duration timing-function delay iteration-count direction fill-mode play-state; */
	animation: blink 5s linear 2s infinite alternate;
	-webkit-animation: blink 5s linear 2s infinite alternate; /* Safari 4.0 - 8.0 */
	-moz-animation: blink 5s linear 2s infinite alternate; /* Firefox older Versions */
}

.info-important p {
	color: #1b3347;
	font-size: 1.0rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.2em;
	text-align: left;
	margin: 0;
	padding: 0.5rem 1rem;
}

/* Animation: Standard syntax */
@keyframes blink {
  from {border-color: #cadff9;}
  to {border-color: #1b3347;}
}


/* Animation Safari 4.0 - 8.0 */
@-webkit-keyframes blink {
  from {border-color: #cadff9;}
  to {border-color: #1b3347;}
}

/* Animation Firefox older Versions */
@-moz-keyframes blink {
  from {border-color: #cadff9;}
  to {border-color: #1b3347;}
}

#blog-list {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: column;
    flex-direction: column;
	-ms-flex-flow: -ms-flex-wrap;
	flex-flow: wrap;
	-ms-flex-order: 1;
	-webkit-order: 1;
	order: 1;
	width: 100%;
	max-width: 1600px;
	height: auto;
	margin: 0;
	padding: 0;
}

ul#blog-list {
	list-style: none;
}

#blog-list > li {
	flex: 1 1 100%;
	height: auto;
	margin: 0;
	padding: 0;
	margin-top: 1rem;
}

#blog-list > a {
	margin: 0;
	padding: 0;
}

.blog-entry {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: column;
    flex-direction: column;
	width: 100%;
	height: 100%;
	background: #cadff9;
}

.blog-entry > div {
	flex: 1 1 auto; /* flex: 1 1 100%; caused problem with overflowing text */
}

.blog-entry-thumbnail {
	-ms-flex-order: 1;
	-webkit-order: 1;
	order: 1;
	width: 100%;
	height: auto;
	border: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	min-height: 15rem;
	-webkit-background-size: cover;
	background-size: cover; /* background-size: contain or cover; */
	background-position: center center;
	background-repeat: no-repeat;
}

.blog-entry-text {
	-ms-flex-order: 2;
	-webkit-order: 2;
	order: 2;
	width: 100%;
	height: auto;
	min-height: 12rem;
	text-align: center;
	color: #4d4d4d;
}

.blog-entry-meta {
	margin: 0.5rem;
	margin-top: 1rem;
}

.blog-entry-title {	
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-size: 1.2rem;
	font-weight: 700;
	line-height: 1.2em;
	text-decoration: none;
	margin: 0.5rem;
	margin-top: 1rem;
}

.blog-entry-summary {
	font-weight: 500;
	line-height: 1.2em;	
	margin: 0.5rem;
	margin-bottom: 1rem;
}

.blog-entry-separator {
	text-align: center;
	font-size: 2rem;
	font-weight: 700;
	margin: 1rem auto;
}

.blog-entry:hover, .blog-entry:focus {
	background: #ffffff;
}

#allposts {
	background: #2b506f;
	padding-bottom: 1rem;
}

.pagessummary {
	background: #2b506f;
	color: #ffffff;
}

/* Main content */


.main-single {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
    flex-direction: column;
	padding: 0;
}

article {
	min-height: 100%;
	min-height: -webkit-calc(100vh - 110px - 15rem);
	min-height: calc(100vh - 110px - 15rem);
	padding: 1rem;
	background: #ffffff;
}

.aside-1, .aside-2 {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: column;
    flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	margin: 1rem;
}

.main-post-title {
	font-size: 1.8rem;
	line-height: 1.4em;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	text-align: center;
	text-decoration: none;
	text-shadow: 1px 1px 0px #cadff9;
	padding: 3rem 0 1rem 0;
}

.cat {
	background: #2b506f;
	color: #cadff9;
	text-shadow: none;
	padding: 2rem 0 1.5rem 0;
}

article {
	-ms-flex-order: 1;
	-webkit-order: 1;
	order: 1; 
}
.pagescroller { 
	-ms-flex-order: 2;
	-webkit-order: 2;
	order: 2; 
}
.aside-1 {
	-ms-flex-order: 3;
	-webkit-order: 3;
	order: 3;
}
.aside-2 { 
	-ms-flex-order: 4;
	-webkit-order: 4;
	order: 4;
}

.aside-1-empty, .aside-2-empty {
	display: none;
	background: #ffffff;
}

.aside-entry {
	margin: 0;
	padding-bottom: 1rem;
}

.aside-entry-title {
	font-weight: 700;
	letter-spacing: 0.02em;
}

ul.aside-entry-text {
	list-style: none;
	width: auto;
	height: auto;
	margin-right: auto;
}

.aside-entry-text li {
	padding-top: 0.5rem;
}

.aside-entry a {
	font-weight: 400;
	font-size: 0.9rem;
	text-decoration: none;
	line-height: 1.0em;
	padding: 0 0.5rem;
}
.aside-entry a:hover, .aside-entry a:focus {
	text-decoration: none;
}

/* --- Font-size and decoration ---*/

a {
	color: #26729b;
	font-weight: 500;
	text-decoration: none;
}

h1 {
	text-align: left;
	font-size: 1.8rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2em;
	padding-top: 2.5rem;
}

h2 {
	text-align: left;
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.5em;
	padding-top: 2rem;
}

h3 {
	text-align: left;
	font-size: 1.2rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2em;
	padding-top: 1.5rem;
}

h4 {
	text-align: left;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2em;
	padding-top: 1rem;
}

.main-post-meta {
	text-align: right;
}

.main-post-summary {
	line-height: 1.2em;
	font-weight: 600;
	letter-spacing: 0.01em;
	text-align: center;
}

article > ul, article > ol {
	margin: 0;
	list-style-position: outside;
	list-style-type: square;
	padding: 0 1rem;
}

article blockquote {
	margin: 0;
	padding: 0;
}

article blockquote > p {
	border-left: 2px solid #2b506f;
	font-style: italic;
	padding: 0 0.5rem;
	text-align: left; /* new in version=3 */
}

article .writer {
	padding: 1.5rem 0;
	font-size: 0.9rem;
}


/* --- Taxonomy Term Lists --- */
#term-list {
    width: 100%;
	margin: 0;
	padding: 1rem 0;
}

ul.term-list-entry,  ul.term-list-entry li ul {
	list-style: none;
	width: auto;
	height: auto;
	margin-right: auto;
}

ul.term-list-entry li ul {
	padding-left: 1rem;
}

.term-list-entry li {
	padding-top: 0.5rem;
}

.term-list-entry > li {
	padding-bottom: 1rem;
}

.term-list-title, .term-list-title > a {
	font-size: 1.2rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2em;
	text-transform: uppercase;
}

#term-list a {
	line-height: 1.2em;
}

/* --- Paginator --- */

.pagescroller {
	display: block;
	width: 100%;
	margin: 0;
	margin-top: 1rem;
	padding-top: 1rem;
	align-self: center;
}
.pagination {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: row;
    flex-direction: row;
	-ms-flex-pack: center;
	justify-content: center;
}
.page-item { 
	display: block;
	width: 2.5em;
	text-align: center;
}
.page-item > span {
	color: #ffffff;
	text-decoration: none;
	white-space: nowrap;
	vertical-align: top;
	text-align: center;
	padding: 0.5rem;
}
.page-link a {
	text-decoration: none;
	white-space: nowrap;
	vertical-align: top;
	text-align: center;
	padding: 0.5rem;
}
.page-link a:active, .page-link a:target {	
	font-weight: 700;
	text-decoration: none;
	text-decoration: underline;
}

.page-link a:hover, .page-link a:focus {	
	font-weight: 700;
	text-decoration: none;
}

#landingpage .page-item a, #allposts .page-item a {
	color: #ffffff;
}

#landingpage .page-item a:hover, #landingpage .page-item a:focus, #allposts .page-item a:hover, #allposts .page-item a:focus {
	color: #ffffff;
}

.post-paginator {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: row;
    flex-direction: row;
	justify-content: space-between;
	font-size: 0.8rem;
	padding: 0.5rem 0;
}


/* --- Table of Contents --- */
.toc {
    width: 100%;
	margin: 2rem auto;
}
.toc-title {
	font-size: 1.2rem;
	text-align: left;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2em;
	padding: 0.5rem 0;
}

nav#TableOfContents {
    width: 100%;
	margin: 0;
	padding: 0;
	background: #ffffff;
}

#TableOfContents > ul, #TableOfContents ul li, #TableOfContents ul li ul {
	display: inline-block;
	background: none;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;
	margin-right: auto;
	white-space: normal;
	word-wrap: break-word;
}

#TableOfContents ul li {
	padding-top: 0.5rem;
}

#TableOfContents a {
	color: #26729b;
	font-weight: 400;
	font-size: 1.0rem;
	letter-spacing: 0;
	text-decoration: none;
	padding: 0;
}

#TableOfContents ul li ul li a {
	padding: 0 1rem;
}

#TableOfContents a:hover, #TableOfContents a:focus {
	color: #2b506f;
	text-decoration: none;
}

/*--- Images --- */
article img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
	-moz-border-radius: 0.5rem;
	-webkit-border-radius: 0.5rem;
	border-radius: 0.5rem;
}

.img-with-text {
	position: relative;
	width: 100%;
	max-width: 1024px;
	height: auto;
	margin: 1rem auto;
}

.img-with-text-640w {
	position: relative;
	width: 100%;
	max-width: 640px;
	height: auto;
	margin: 1rem auto;
}

.img-with-text p, .img-with-text-640w p {
	position: absolute;
	bottom: 0;
	left: 0;
	height: auto;
	color: #ffffff;
	font-size: 0.9rem;
	line-height: 1.0em;
	background: #2b506f;
	-moz-border-radius: 0.5rem;
	-webkit-border-radius: 0.5rem;
	border-radius: 0.5rem;
	margin: 0;
	padding: 0.3rem 1rem;
}

.main-image {
	width: 100%;
	max-width: 1600px;
	height: auto;
	max-height: 400px;
	margin: 0;
	padding: 0;
	font-size: 0;
	line-height: 0;
}

.main-image > img {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
	vertical-align: bottom;
}

.img-fit {
	
}


/*--- Tables ---*/
table {
	display: table;
	margin: 0;
	padding: 0;
	border-collapse: collapse;
}

th, td {
	text-align: left;
	text-decoration: none;
	padding: 0.2rem;
}

#div-table {
	display: table;
	margin: 1rem 0;
	padding: 0;
	border-spacing: 0 0.5rem;
}

#div-theader{
	display: table-header-group;
}

#div-tbody{
	display: table-row-group;
}

.div-row, .div-cell, .div-theader-cell {
	display: table-row;
}

.div-cell, .div-theader-cell {
	display: table-row;
}

.div-theader-cell {
	font-weight: 700;
}

.key-cell {
	font-size: 0.9rem;
	font-style: italic;
	line-height: 1.2em;
}

.value-cell {
	line-height: 1.2em;
	padding: 0 0.5rem;
}

/* --- Profile --- */
#profile {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: column;
    flex-direction: column;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap; /* Safari 6.1+ */
	flex-wrap: wrap;
	width: 100%;
	margin: 0;
	padding: 1rem 0;
}

#profile > * {
	flex: 1 1 auto;
}

#profile > .profile-img {
	display: block;
	width: 100%;
	max-width: 288px;
	height: auto;
	margin: 0 auto;
	padding: 0;
	-moz-border-radius: 0.5rem;
	-webkit-border-radius: 0.5rem;
	border-radius: 0.5rem;
}

/* --- Contact Form --- */

.contact-content {
	padding: 1rem 0;
}

#form-contact {	
	padding: 1rem;
}

#form-contact .form-group-contact > p {
	background: #ffffff;
	color: red;
	font-size: 1.0rem;
	letter-spacing: 0.02em;
	text-decoration: italic;
	text-align: left;
	margin: 0;
	padding: 1.5rem 0;
}

#form-contact a.form-btn {
	color: #ffffff;
	font-size: 0.8rem;
	font-weight: 700;
	line-height: 1.2rem;
	text-align: center;	
	text-decoration: none;
	padding: 0.5rem;
	margin: 1rem auto;
	background: #2b506f;
	border: solid 1px #2b506f;
	width: 7rem;
	max-width: calc(100% - 2rem);
	max-width: -webkit-calc(100% - 2rem);
	overflow: hidden;
	-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	-moz-border-radius: 0.5rem;
	-webkit-border-radius: 0.5rem;
	border-radius: 0.5rem;
}

#form-contact a.form-btn:hover, #form-contact a.form-btn:focus {
	cursor: pointer;
	text-decoration: none;
	text-shadow: none;
	background: #1b3347;
}

#form-contact .form-group-contact > .lb-form {
	text-align: left;
	color: #4d4d4d;
	font-size: 0.9rem;
	padding-bottom: 0;
	padding-top: 1.5rem;
}

#form-contact .form-group-contact > .lb-form-chk {
	text-align: left;
	color: #4d4d4d;
	font-size: 0.9rem;
	padding-bottom: 1rem;
}

.form-group-contact input.contact-input {
	margin: 0.5rem auto 1.5rem auto;
	padding: 0.5rem 0 !important;
	color: #4d4d4d;
	font-size: 0.9rem;
	text-align: left;
	width: -webkit-calc(100% - 2rem);
	width: calc(100% - 2rem);
	max-width: 40rem;
	outline: none;
	border: 0;
	background-color: transparent;
	border-bottom: 1px solid #26729b;
    transition: border-bottom-color 1s; 
}
.form-group-contact input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #4d4d4d !important;
	opacity: 0.5 !important;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}
.form-group-contact input:-moz-placeholder { /* Firefox 18- */
    color: #4d4d4d !important;
	opacity: 0.5 !important;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}
.form-group-contact input::-moz-placeholder { /* Firefox 19+ */
    color: #4d4d4d !important;
	opacity: 0.5 !important;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}
.form-group-contact input:-ms-input-placeholder { /* IE 10+ */
    color: #4d4d4d !important;
	opacity: 0.5 !important;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}

.form-group-contact textarea.contact-msg {	
	margin: 0.5rem auto 2rem auto;
	padding: 0.5rem 0 !important;
	width: -webkit-calc(100% - 2rem);
	width: calc(100% - 2rem);
	max-width: 40rem;
	height: 4rem;
	border: none;
	background-color: transparent;
	border-bottom: 1px solid #26729b;
	color: #4d4d4d;
	font-size: 0.9rem;
	text-align: left;
}

input:invalid+span:after {
  position: absolute; 
  content: '✖';
  color: red;
  padding-top: 0.75rem;
  padding-left: 0.5rem;
}

input:valid+span:after {
  position: absolute;
  content: '✓';
  color: green;
  padding-top: 0.75rem;
  padding-left: 0.5rem;
}

/* --- Info eMail, Newsletter --- */
.lb-overlay {
	width: 0;
	height: 0;
	position: fixed;
	overflow: hidden;
	left: 0;
	top: 0;
	padding: 0;
	z-index: 99;
	text-align: center;
	background: rgb(241,210,194);
	background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%, rgba(183,193,205,1) 100%);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,0.56)), color-stop(100%,rgba(183,193,205,1)));
	background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(183,193,205,1) 100%);
	background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(183,193,205,1) 100%);
	background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(183,193,205,1) 100%);
	background: radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(183,193,205,1) 100%);
}
.lb-overlay > div {
	position: relative;
	text-align: center;
	color: rgba(27,54,81,0.8);
	width: 30rem;
	max-width: -webkit-calc(100% - 2rem);
	max-width: calc(100% - 2rem);
	margin: 0 auto;
}

.lb-overlay:target {
	width: 100%;
    max-width: 100%;
	height: auto;
	bottom: 0px;
	right: 0px;
	padding: 2rem 0 0 0;
}

.btn-infomail, .btn-lang {
	cursor: pointer;
	-webkit-border-radius: 2rem;
	-moz-border-radius: 2rem;
	border-radius: 2rem;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
}

.btn-all > img {
	height: 1.5em;
	margin-left: 0.25em;
}
.btn-lang > img {
	height: 1em;
}

.lb-overlay .infomail-box {
	display: block;
	width: 50rem;
	max-width: -webkit-calc(100% - 2rem);
	max-width: calc(100% - 2rem);
	max-height: -webkit-calc(100% - 3rem);
	max-height: calc(100% - 3rem);
	background: #2b506f;
	padding: 0.5rem;
	-webkit-border-radius: 1rem;
	-moz-border-radius: 1rem;
	border-radius: 1rem;
}

.form-group-infomail {
	background: #ffffff;
	-webkit-border-radius: 1rem;
	-moz-border-radius: 1rem;
	border-radius: 1rem;
	padding: 0.5rem;
	font-size: 0.9rem;
}

.lb-overlay .form-group-infomail > p {
	background: #ffffff;
	color: red;
	font-size: 0.9rem;
	letter-spacing: 0.01em;
	text-decoration: italic;
	text-align: left;
	margin: 0;
	padding: 0.7rem 1rem 0 1rem;
}

.lb-overlay .btn-div {
	margin-top: 1rem;
}

.lb-overlay a.form-btn {
	color: #ffffff;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1.0rem;
	text-align: center;	
	text-decoration: none;
	padding: 0.5rem;
	margin: 0 auto;
	background: #2b506f;
	border: solid 1px #2b506f;
	overflow: hidden;
	-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	-moz-border-radius: 0.5rem;
	-webkit-border-radius: 0.5rem;
	border-radius: 0.5rem;
}

.lb-overlay a.form-btn:hover, .lb-overlay a.form-btn:focus {
	cursor: pointer;
	text-decoration: none;
	text-shadow: none;
	background: #1b3347;
}

.lb-overlay .form-group-infomail > h2 {
	text-align: center;
	padding: 0.5rem 0.5rem 0 0.5rem;
}

.lb-overlay .form-group-infomail > label {
	width: 100%;
	max-width: -webkit-calc(100% - 2rem);
	max-width: calc(100% - 2rem);
	text-align: center;
	color: #4d4d4d;
	font-size: 1.0rem;
	font-weight: 500;
	line-height: 0.9em;
	letter-spacing: 0;
	margin: auto;
	padding-left: 1rem;
	padding-right: 1rem;
}

.lb-overlay .form-group-infomail > .lb-form {
	text-align: left;
	color: #4d4d4d;
	font-size: 0.9rem;
	margin: 0.5rem 1rem 0 1rem;	
}

.lb-overlay .form-group-infomail > .lb-form-chk {
	text-align: left;
	color: #4d4d4d;
	font-size: 1rem;
	margin: auto 1rem;
}

label.hasValue, label.FocusNoValue {
    /* hide the label when appropriate */
    display:none !important;
}

.form-group-infomail input.infomail-input {
	margin: 0.3rem auto 0.5rem auto;
	padding: 0.5rem 0 !important;
	color: #4d4d4d;
	font-size: 0.9rem;
	text-align: left;
	width: 100%;
	max-width: -webkit-calc(100% - 2rem);
	max-width: calc(100% - 2rem);
	outline: none;
	border: 0;
	background-color: transparent;
	border-bottom: 1px solid #26729b;
    transition: border-bottom-color 1s; 
}
.form-group-infomail input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #4d4d4d !important;
	opacity: 0.5 !important;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}
.form-group-infomail input:-moz-placeholder { /* Firefox 18- */
    color: #4d4d4d !important;
	opacity: 0.5 !important;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}
.form-group-infomail input::-moz-placeholder { /* Firefox 19+ */
    color: #4d4d4d !important;
	opacity: 0.5 !important;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}
.form-group-infomail input:-ms-input-placeholder { /* IE 10+ */
    color: #4d4d4d !important;
	opacity: 0.5 !important;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}


/* Search Bar */
input {
	outline: none;
}
input[type=search] {
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
	display: none; 
}
input[type=search] {
	background: url(/img/icon/search-white.svg) no-repeat center center/1.5rem 1.5rem;
	border: none;
	padding: 1rem 1.5rem 0.5rem 2rem;
	width: 1.5rem;
	color: transparent;
	cursor: pointer;
	-webkit-border-radius: 5em;
	-moz-border-radius: 5em;
	border-radius: 5em;	
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
}
input[type=search]:focus {
	-webkit-appearance: textfield;
	-webkit-box-sizing: content-box;
	font-size: 1rem;
	width: 10rem;
	border: solid 0.5px #cadff9;
	background-color: #2b506f;
	border-color: #cadff9;
	background-position: 11rem center; /* position when expanding */
	padding: 1rem 2rem 0.5rem 1rem;
	color: #cadff9;
	cursor: auto;
	-webkit-box-shadow: 0 0 5px rgba(109,207,246,.5);
	-moz-box-shadow: 0 0 5px rgba(109,207,246,.5);
	box-shadow: 0 0 5px rgba(109,207,246,.5);
}
input:-moz-placeholder {
	color: transparent;
}
input::-webkit-input-placeholder {
	color: transparent;
}

/* --- Screens > 600px --- */
@media all and (min-width: 600px) {
	/* --- Navigation --- */
	.toggle, [id^=drop] {
	  display: none;
	}
	.btn-all, .btn-infomail, .btn-lang {
		display: inline-block;
	}
		
	nav ul {
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-border-radius: 0.5rem;
		border-radius: 0.5rem;
		padding-top: 0.5rem;
		max-width: 44rem;
		margin: 0 1rem 0 auto;
	}
		
	nav ul li {
		position:relative;
		flex: 1 0 auto;
		text-align:left;
	}

	nav ul li a {
		padding: 1rem 1rem 0 1rem;
	}

	.has-submenu ul li a {
		padding: 0.5rem 1rem;
	}

	.has-submenu ul, .has-submenu ul .has-submenu ul {
		display:none;
		width:100%;
		position:absolute;
	}
	
	.has-submenu ul .has-submenu ul{
		left:100%;
		top:0;
	}
	
	nav ul li:hover ul, .has-submenu ul .has-submenu:hover ul, .has-submenu:hover ul {	
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-ms-flex-direction: column;
		flex-direction: column;
	}
		
	nav ul li:hover {
		-webkit-border-radius: 0.5rem;
		border-radius: 0.5rem;
	}

	/* --- Main content in a flexbox --- */
	#main {	
		width: -webkit-calc(100% - 2rem);
		width: calc(100% - 2rem);
	}

	/* --- Profile --- */
	#profile {
		-ms-flex-direction: row;
		flex-direction: row;
		-ms-flex-wrap: none;
		flex-wrap: no-wrap;
		-ms-flex-pack: start;
		justify-content: flex-start;
		width: auto;
		margin-right: auto;
		margin-top: 0.5rem;
		padding: 1rem 0;
	}

	#profile > * {
		flex: 1 0 auto;
	}

	#profile > .profile-img {
		margin-right: 1rem;
	}
	#div-table {
		width: 50%;
		vertical-align: middle;
		margin: auto 0;
	}
}

/* --- Screens > (60em == 960px, 720pt // 400px = 25em) --- */
@media all and (min-width: 800px) {
	/* --- Header  --- */
	img.header-img-expanded-800 {
		display: inline-block;
	}
		
	/* --- Mainpage, landingpage  --- */	
	.blog-entry {
		-ms-flex-direction: row;
		flex-direction: row;
		-ms-flex-pack: center;
		justify-content: center;
		-ms-flex-line-pack: center;
		align-content: center;
		-ms-flex-align: center;
		align-items: center;
	}
	.blog-entry {
		width: 100%;
		height: 100%;
		min-height: 100%;
	}
	.blog-entry-thumbnail {
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
		height: inherit;
		min-height: inherit;
		max-height: 20rem;
		object-fit: cover;
	}
	.blog-entry-text {
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
		width: 50%;
		max-width: 50%;
	}	
	.blog-entry > div {
		flex: 1 1 100%;
	}
}

/* --- Screens > (80em == 1280px, 960pt) --- */
@media all and (min-width: 1280px) {
	/* --- Header --- */	
	img.header-img-expanded-1280 {
		display: inline-block;
	}
	
	.btn-lang {
		padding-right: 0.2rem;
	}
	
	/* --- Navigation --- */
	nav ul {
		max-width: 50rem;
		margin-right: 2rem;
	}
	
	/* --- Mainpage, landingpage --- */
	
	#main {
		width: -webkit-calc(100% - 5rem);
		width: calc(100% - 5rem);
		margin: 2.5rem auto;
	}
	
	.main-content {
		-ms-flex-direction: row;
		flex-direction: row;
	}
	.main-single {
		-ms-flex-direction: row;
		flex-direction: row;
		-ms-flex-align: stretch;
		align-items: stretch;
	}
	.main-image { 
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1; 
	}
	.main-content, .main-single { 
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2; 
	}
	.aside-1, .aside-1-empty { 
		-ms-flex-order: 3;
		-webkit-order: 3;
		order: 3;
	}
	article { 
		-ms-flex-order: 4;
		-webkit-order: 4;
		order: 4; 
	}
	.aside-2, .aside-2-empty { 
		-ms-flex-order: 5;
		-webkit-order: 5;
		order: 5; 
	}
	.pagescroller { 
		-ms-flex-order: 6;
		-webkit-order: 6;
		order: 6; 
	}

	.aside, .aside-1-empty, .aside-2-empty {
		flex: 1 1 auto; /* initial */
		width: 20rem;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		padding-top: 8rem;
		min-height: -webkit-calc(100vh - 110px - 15rem);
		min-height: calc(100vh - 110px - 15rem);
	}
	
	article {
		flex: 4 1 100%;
	}
		
	.main-content .aside-1 {
		text-align: right;
	}
	
	.main-post-title {
		font-size: 2.0rem;
		line-height: 1.2em;
		padding: 3rem 0;
	}
	
	.blog-entry-thumbnail {
		min-height: 20rem;
		max-height: 25rem;
	}
	.blog-entry-text {
		min-height: 20rem;
		max-height: 25rem;
	}
	.blog-entry-text > div {
		margin: 1rem;
	}
	div.blog-entry-meta {
		margin-top: 2rem;
	}
	
	/* --- Info eMail, Newsletter --- */
	.lb-overlay .infomail-box {
		width: 50rem;
		padding: 1rem;
		-webkit-border-radius: 1rem;
		-moz-border-radius: 1rem;
		border-radius: 1rem;
	}

	.form-group-infomail {
		padding: 1rem;
	}

	.lb-overlay .form-group-infomail > p {
		font-size: 1.0rem;
		letter-spacing: 0.02em;
		margin: 0;
		padding: 1rem 1rem 0 1rem;
	}

	.lb-overlay .btn-div {
		margin-top: 1.5rem;
	}

	.lb-overlay .form-group-infomail > h2 {
		text-align: center;
		padding: 1rem 1rem 0 1rem;
	}

	.lb-overlay .form-group-infomail > label {
		line-height: 1.2rem;
		letter-spacing: 0.02em;
	}

	.lb-overlay .form-group-infomail > .lb-form {
		font-weight: 500;
		margin: 1rem 1rem 0 1rem;	
	}

	.form-group-infomail input.infomail-input {
		margin: 0.5rem auto 1rem auto;
		padding: 0.5rem 0 !important;
	}
	
	/* --- Contact --- */
	.contact-content {
		padding: 2.5rem 0;
	}
	
	/* --- Profile --- */
	#profile {
		max-width: 60rem;
		margin-left: auto;
		margin-right: auto;
	}
	
}

/* --- Screens > (100em == 1600px, 1200pt) --- */
@media all and (min-width: 1600px) {
	/* --- Header --- */	
	img.header-img-expanded-1600 {
		display: inline-block;
	}
	
	/* --- Navigation  --- */	
	nav > ul {
		/* de: + 24rem --- */
		margin-left: -webkit-calc(50%);
		margin-left: calc(50%);
	}
	
	/* ---Main Content --- */
	.blog-entry-thumbnail {
		width: 800px;
		height: 200px;
	}
}

/* --- iPhone 5 --- */
@media screen and (min-device-width: 320px) and (max-device-width: 568px) and (device-aspect-ratio: 40/71) and (-webkit-min-device-pixel-ratio : 2) {
	body {
		display: block;
		min-width: 100%;
		min-height: 100%;
		background: #1b3347 url(/img/style/pixel_1b3347.png) repeat;
	}
	
	/* --- Content --- */
	#main {
		display: block;
		padding: 0;
		margin: 0 auto;
		background: #2b506f;
	}
	
	#allposts, #landingpage {
		display: block;
		padding: 0;
		margin: 0;
	}
		
	.blog-entry-thumbnail {
		max-height: 100px;
	}
	.blog-entry-text {
		max-height: auto;
	}
	
	/* Main content */
	.main-content, .main-single, article, .aside, .main-image {
		display: block;
	}
	
	#term-list ul, #term-list li, #term-list ul li, #term-list ul li ul {
		display: block;
	}
	
	/* --- Paginator --- */
	.pagination {
		display: block;
	}
	.post-paginator {
		display: inline;
	}
	
	/* --- Paginator --- */

	.pagescroller {
		width: 100%;
		margin: 0 auto;
		padding: 0.5rem 0;
		align-self: center;
	}
	.pagination {
		margin: 0 auto;
	}
	ul.pagination {
		display: table;
	}
	li.page-item { 
		display: table-cell;
		vertical-align: top;
		text-align: center;
		width: 3em;
	}

	.post-paginator {
		width: 100%;
		max-width: calc(100% - 1rem);
		max-width: -webkit-calc(100% - 1rem);
		max-width: -moz-calc(100% - 1rem);
		display: table;
	}
	.prev, .next {
		display: table-cell;
		width: 50%;
	}
	.next {
		text-align: right;
	}
		
	/* --- TOC --- */
	nav#TableOfContents, #TableOfContents ul, #TableOfContents li, #TableOfContents ul li, #TableOfContents ul li ul {
		display: block;
		background: #ffffff;
	}
	
	/* --- Profile --- */
	#profile {
		display: block;
	}
	
	
	/* --- Info eMail, Newsletter --- */
	.lb-overlay:target {
		padding-top: 0.5rem;
	}
	.infomail-box {
		width: 100%;
		max-width: 100%;
		max-height: calc(100% - 2rem);
		max-height: -webkit-calc(100% - 2rem);
		max-height: -moz-calc(100% - 2rem);
		padding: 0;	
	}
	
	.form-infomail {
		overflow: hidden;
	}

	.form-group-infomail {
		width: 100%;
		height: 100%;
		max-width: calc(100% - 1rem);
		max-width: -webkit-calc(100% - 1rem);
		max-width: -moz-calc(100% - 0.5rem);
		max-height: calc(100% - 3rem);
		max-height: -webkit-calc(100% - 3rem);
		max-height: -moz-calc(100% - 3rem);
		padding: 0.5rem;
		margin: 0 auto;
	}

	.form-group-infomail > p, .form-group-infomail > .lb-form-chk {
		font-size: 0.8rem;
		letter-spacing: 0;
		line-height: 0.9em;
		padding-top: 0.2rem;
		padding-bottom: 0.2rem;
	}

	.form-group-infomail > h2 {
		text-align: center;
		font-size: 0.9rem;
		line-height: 0.9em;
		padding-top: 0.2rem;
		padding-bottom: 0.2rem;
	}

	.form-group-infomail > label {
		font-size: 0.8rem;
		letter-spacing: 0;
		padding-top: 0.2rem;
		padding-bottom: 0.2rem;
	}

	.form-group-infomail > .lb-form {
		font-size: 0.8rem;
		letter-spacing: 0;
		padding-top: 0.2rem;
		padding-bottom: 0.2rem;
	}
	
	.form-group-infomail input.infomail-input {
		margin: 0 auto;
	}
}

/* --- iPhone <5 --- */
@media screen and (device-aspect-ratio: 2/3) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio : 2) {
	body {
		display: block;
		min-width: 100%;
		min-height: 100%;
		background: #1b3347 url(/img/style/pixel_1b3347.png) repeat;
	}
	
	/* --- Content --- */
	#main {
		display: block;
		padding: 0;
		margin: 0 auto;
		background: #2b506f;
	}
	
	#allposts, #landingpage {
		display: block;
		padding: 0;
		margin: 0;
	}
		
	.blog-entry-thumbnail {
		max-height: 100px;
	}
	.blog-entry-text {
		max-height: auto;
	}
	
	/* Main content */
	.main-content, .main-single, article, .aside, .main-image {
		display: block;
	}
	
	#term-list ul, #term-list li, #term-list ul li, #term-list ul li ul {
		display: block;
	}
	
	/* --- Paginator --- */
	.pagination {
		display: block;
	}
	.post-paginator {
		display: inline;
	}
	
	/* --- Paginator --- */

	.pagescroller {
		width: 100%;
		margin: 0 auto;
		padding: 0.5rem 0;
		align-self: center;
	}
	.pagination {
		margin: 0 auto;
	}
	ul.pagination {
		display: table;
	}
	li.page-item { 
		display: table-cell;
		vertical-align: top;
		text-align: center;
		width: 3em;
	}

	.post-paginator {
		width: 100%;
		max-width: calc(100% - 1rem);
		max-width: -webkit-calc(100% - 1rem);
		max-width: -moz-calc(100% - 1rem);
		display: table;
	}
	.prev, .next {
		display: table-cell;
		width: 50%;
	}
	.next {
		text-align: right;
	}
		
	/* --- TOC --- */
	nav#TableOfContents, #TableOfContents ul, #TableOfContents li, #TableOfContents ul li, #TableOfContents ul li ul {
		display: block;
		background: #ffffff;
	}
	
	/* --- Profile --- */
	#profile {
		display: block;
	}
	
	
	/* --- Info eMail, Newsletter --- */
	.lb-overlay:target {
		padding-top: 0.5rem;
	}
	.infomail-box {
		width: 100%;
		max-width: 100%;
		max-height: calc(100% - 2rem);
		max-height: -webkit-calc(100% - 2rem);
		max-height: -moz-calc(100% - 2rem);
		padding: 0;	
	}
	
	.form-infomail {
		overflow: hidden;
	}

	.form-group-infomail {
		width: 100%;
		height: 100%;
		max-width: calc(100% - 1rem);
		max-width: -webkit-calc(100% - 1rem);
		max-width: -moz-calc(100% - 0.5rem);
		max-height: calc(100% - 3rem);
		max-height: -webkit-calc(100% - 3rem);
		max-height: -moz-calc(100% - 3rem);
		padding: 0.5rem;
		margin: 0 auto;
	}

	.form-group-infomail > p, .form-group-infomail > .lb-form-chk {
		font-size: 0.8rem;
		letter-spacing: 0;
		line-height: 0.9em;
		padding-top: 0.2rem;
		padding-bottom: 0.2rem;
	}

	.form-group-infomail > h2 {
		text-align: center;
		font-size: 0.9rem;
		line-height: 0.9em;
		padding-top: 0.2rem;
		padding-bottom: 0.2rem;
	}

	.form-group-infomail > label {
		font-size: 0.8rem;
		letter-spacing: 0;
		padding-top: 0.2rem;
		padding-bottom: 0.2rem;
	}

	.form-group-infomail > .lb-form {
		font-size: 0.8rem;
		letter-spacing: 0;
		padding-top: 0.2rem;
		padding-bottom: 0.2rem;
	}
	
	.form-group-infomail input.infomail-input {
		margin: 0 auto;
	}
}

