/** LAYOUT **/
body {background-color: #f5f5f5;min-width:320px;max-width:100%;}
#headerbg {position:absolute;left:0;top:0;right:0;height:100px;background-color:#2B3034;z-index:-1;
background-image: -webkit-gradient(	linear,left top,left bottom,color-stop(0, #2B3034),color-stop(1, #3E454A));
background-image: -o-linear-gradient(bottom, #2B3034 0%, #3E454A 100%);
background-image: -moz-linear-gradient(bottom, #2B3034 0%, #3E454A 100%);
background-image: -webkit-linear-gradient(bottom, #2B3034 0%, #3E454A 100%);
background-image: -ms-linear-gradient(bottom, #2B3034 0%, #3E454A 100%);
background-image: linear-gradient(to bottom, #2B3034 0%, #3E454A 100%);}

#home .img-wrapper {min-height:180px;padding:10px;text-align:center;}
#home ins {min-width:300px;}
ins {margin-bottom:10px;}
header .navbar.navbar-default {box-shadow: 0px 0px 5px #3c3c3b;}
header .navbar.navbar-default li a {z-index:2;}
header .navbar.navbar-default li.dropdown a {z-index:1002;}
.menu-hover-bubble {width:0px;height:0px;position:absolute;background-color: #CCDAE8;z-index:1;}

a:hover {transition: all 0.2s;}

header h3 {color:#fff;text-shadow: 0px 0px 44px #A5B8C6;}
header h3 a,header h3 a:hover {text-decoration:none;color:#fff;}
.wrapper {box-shadow: 0px 2px 3px #7F8991;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; }

.maintable {display:table;width:100%;}
.wrapper {display:table-row;min-height:800px;margin-bottom: 20px;}
main, aside {min-height:1000px;display:table-cell;vertical-align: top;}
main {background-color:#fff;-webkit-border-bottom-left-radius: 4px;-moz-border-radius-bottomleft: 4px;border-bottom-left-radius: 4px;}
aside {width:260px;background-color:#EFEFEF;-webkit-border-bottom-right-radius: 4px;-moz-border-radius-bottomright: 4px;border-bottom-right-radius: 4px;}
main .page-header, aside .page-header, #sidemenu ul li.main div,aside .headline {
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #2B3034),color-stop(1, #353C40));
    background-image: -o-linear-gradient(bottom, #2B3034 0%, #353C40 100%);
    background-image: -moz-linear-gradient(bottom, #2B3034 0%, #353C40 100%);
    background-image: -webkit-linear-gradient(bottom, #2B3034 0%, #353C40 100%);
    background-image: -ms-linear-gradient(bottom, #2B3034 0%, #353C40 100%);
    background-image: linear-gradient(to bottom, #2B3034 0%, #353C40 100%);
}

aside .page-header {min-height:56px;background-color:#2B3034;margin:0; padding:16px;color:#fff;-webkit-border-top-right-radius: 4px;-moz-border-radius-topright: 4px;border-top-right-radius: 4px;}
main .page-header {min-height:56px;background-color:#2B3034;margin:0; padding:16px;color:#fff;-webkit-border-top-left-radius: 4px;-moz-border-radius-topleft: 4px;border-top-left-radius: 4px;}
main .teaser {padding: 14px;background-color:#353C40;color:#fff;}
main .content {padding: 16px;}
main .page-header h1 {margin:0; color:#fff;font-size:20px;}

/** PAGES **/
#categories .desc {min-height:150px;margin: 0 0 10px 0;}

.itemlist {width:100%;}
.item {display:block;position:relative;border:1px solid #ccc;padding: 5px 5px 0 5px;margin: 0 0 10px 0;border-radius: 3px;cursor:pointer;}
.item:hover {background:#CCDAE8;transition: 0.3s;}
.item h3 {padding: 0px; margin: 0 0 10px 0;}
.itemlist .item a {position:absolute;left:0;top:0;right:0;bottom:0;}
.itemlist .item a span {opacity:0;}
/** ##.itemlist .item a,.itemlist .item a:hover {color:#333;text-decoration: none;} **/


.item .counter {position:absolute;left:0;top:0;bottom:0;font-size:28px;padding:24px 4px 0 10px;color:#AAAAAA;}
.item .meta {font-size:11px;height:20px;}
.item .meta .info {padding:2px 10px;display:inline-block;}
#toplist .item {padding-left:60px;}


/** moRater */
.moRater, .moRaterResult {float:left;width:98px;height:20px;background:transparent url(img/rating-stars-small.png) left top repeat-x;position:relative;}
.moRater .moRating, .moRaterResult .moRatingStars {display:inline-block;height:20px;background:transparent url(img/rating-stars-small.png) left -42px repeat-x;position:absolute;top:0;left:0;}

.moRater.voted .moRating {background-position: left -21px;}
.moRater .moRate {width:100%;height:100%;position:absolute;top:0;left:0;}
.moRater .moRate i {float:left;width:20%;height:20px;cursor:pointer;}
.moRater .moRate i.hover,.moRater .moRate i.active {background:transparent url(img/rating-stars-small.png) left -21px no-repeat;}
.moRaterText {float:left;padding: 6px 0 0 10px;}

#sidemenu {padding:6px;}
#sidemenu ul {margin:0;padding:0;width:100%;}
#sidemenu ul li.main div {cursor:pointer;border-radius: 4px;  padding: 6px 10px; text-decoration: none;color:#fff;margin: 0 0 8px 0;}
#sidemenu ul li.main div a {font-size:10px;color:#fff;padding:4px 0 0 0;}
#sidemenu ul li.main{list-style: none;}
#sidemenu ul li ul {max-height:0px;height:0;padding: 0;overflow:hidden;}
#sidemenu ul li:hover ul {display:block;padding: 0 10px 16px 16px;transition: max-height .4s ease 0s;max-height:160px;height:auto;}

#malightbox{position: fixed;z-index: 8888;-ms-touch-action: none;touch-action: none;}
#malightbox-loader {background:transparent url(img/hourglass.svg) center center no-repeat;width:124px;height:124px;margin:-70px 0 0 -70px;position: fixed;left:50%;top:50%;}
#malightbox-wrapper {;position:fixed;left:0px;top:0px;right:0px;bottom:0px;z-index: 9999;	-ms-touch-action: none; touch-action: none;}
#malightbox-background {background: rgba(0,0,0,0.85);position:fixed;left:-4px;top:-4px;right:-4px;bottom:-4px;z-index: 8000;-ms-touch-action: none;touch-action: none;}
#malightbox-close {cursor:pointer;position: fixed; right: 2%; top:2%;text-decoration: none;width:40px;height:40px;z-index:9999;opacity: 0.6;}
#malightbox-close i {width:40px	;height:40px;font-size:40px;line-height:26px;color:#fff;}
#malightbox-wrapper .icon-ma-goleft,#malightbox-wrapper .icon-ma-goright {height:64px;position:absolute;top:48%;font-size:60px;color:#fff;cursor:pointer;line-height:64px;z-index:9999;opacity: 0.6;}
#malightbox-wrapper .icon-ma-goright {right:20px;}
#malightbox-wrapper .icon-ma-goleft {left:20px;}
#malightbox-info {position:fixed;left: 0px;bottom:0px;right:0px;padding: 4px; text-align: center;color:#fff;font-size:14px;z-index:9999;}

aside .tags {text-align:justify;padding: 10px;}
aside .tags a {font-size:14px;}
.tags a {display:inline-block;margin: 0 6px;}
aside .headline  {border-radius: 4px;  padding: 6px 10px; color:#fff;margin: 0 0 8px 0;}
aside .headline h4 {margin:0;}

.latest-teaser {padding:5px;position:relative;}
.latest-teaser a.link {position:absolute;left:0;top:0;right:0;bottom:20px;outline: none;text-decoration: none;}
.latest-teaser a.link span {opacity:0;}
.media  .latest-teaser:nth-child(even) {background-color:#EEEEEE;}
.latest-teaser:hover, .latest-teaser:nth-child(even):hover {background-color:#CCDAE8;transition: all 0.5s;}
.latest-teaser .thumb {float:left;padding:12px 4px;}
.latest-teaser .content {padding-left: 40px;}
#similar-teaser .content {padding-bottom:2px;}
#similar-teaser .latest-teaser {min-height:110px;}
.btn.btn-usb {background-color:#5F889E;border-color:#5F889E;color:#fff;font-weight:bold;}
.btn.btn-usb:hover {opacity:0.9;transition: all .4s;}
.btn-mia:hover, .btn-primary:hover {background-color:#5F899F;border-color:#5F899F;color:#fff;}

.slot_1 {max-width:400px;max-width:100%;}

@media (max-width: 992px) {
	.slot_1 {max-width:400px;max-width:100%;}
	body {padding:10px;}
	.container {width:auto;}
	aside {width:200px;}
 }

 @media (max-width: 768px) {
	.slot_1 {max-width:400px;max-width:100%;}
	#categories .desc  {min-height:0;}
	body {padding:0px;}
	aside {display:none;}
	main .page-header {-webkit-border-radius: 0px;-moz-border-radius: 0px;border-radius: 0px;}
	main .content {padding: 10px;}
	main .content ul {padding-left: 20px;}
	main .teaser img {max-width:140px;}
	.container {padding:0;}
 }

 .bluebox {border:1px solid #ccc;background-color:#E6F1F7;padding: 10px 0 10px 10px; text-align: center;}

 .panel-heading {cursor:pointer;}
 .panel-heading a:hover {text-decoration: none;}
 .panel-heading:hover {background-color:rgb(231, 231, 231);}

/** BLOG STYLES **/
.blog-container .content {padding: 20px;}

/* Card column – bottom spacing statt Bootstrap-4 mb-4 */
.blog-card-col {margin-bottom: 24px;}

/* Card wrapper */
.blog-card {
	background: #fff;
	border: 1px solid #dde4ea;
	border-radius: 8px;
	overflow: hidden;
	-webkit-transition: -webkit-transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
	height: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}
.blog-card:hover {
	-webkit-transform: translateY(-4px);
	transform: translateY(-4px);
	box-shadow: 0 8px 24px rgba(0,0,0,0.12);
	border-color: #5F889E;
}

/* Image area */
.blog-card-image {
	display: block;
	height: 190px;
	background-size: cover;
	background-position: center;
	background-color: #2B3034;
	-webkit-transition: opacity 0.25s ease;
	transition: opacity 0.25s ease;
}
.blog-card:hover .blog-card-image {opacity: 0.92;}

/* Body */
.blog-card-body {
	padding: 18px 20px 20px;
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

/* Meta (Datum) */
.blog-card-meta {
	color: #888;
	font-size: 12px;
	margin: 0 0 8px;
	letter-spacing: 0.02em;
}

/* Titel */
.blog-card-title {
	margin: 0 0 10px;
	font-size: 15px;
	line-height: 1.45;
	font-weight: 600;
}
.blog-card-title a {
	color: #2B3034;
	text-decoration: none;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}
.blog-card-title a:hover {color: #5F889E;}

/* Beschreibung */
.blog-card-desc {
	color: #666;
	font-size: 13px;
	line-height: 1.65;
	margin: 0 0 16px;
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

/* Button */
.blog-card-btn {margin-top: auto;}

/* Blog-Post Detailseite */

/* Hero-Bild */
.post-hero {
	position: relative;
	height: 260px;
	background-size: cover;
	background-position: center;
	background-color: #2B3034;
	overflow: hidden;
}
.post-hero-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.55) 100%);
}
.post-hero-content {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 20px;
	color: #fff;
}
.post-hero-title {
	margin: 0;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.3;
	text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}

/* Meta-Leiste */
.post-meta-bar {
	padding: 10px 16px;
	background: #f7f9fb;
	border-bottom: 1px solid #e4eaef;
	font-size: 12px;
	color: #666;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}
.post-series-label {
	background: #5F889E;
	color: #fff;
	font-size: 11px;
	letter-spacing: 0.04em;
	padding: 3px 9px;
	border-radius: 20px;
	font-weight: 600;
}
.post-meta-date {
	color: #888;
}

/* Lead-Text */
.post-lead {
	background: #f0f5f8;
	border-left: 4px solid #5F889E;
	padding: 14px 20px;
	margin: 0;
}
.post-lead p {
	margin: 0;
	font-size: 15px;
	line-height: 1.7;
	color: #444;
	font-style: italic;
}

/* Artikel-Inhalt */
#blog-show .post-body {
	font-size: 15px;
	line-height: 1.8;
	color: #333;
	padding: 24px 20px 16px;
}
#blog-show .post-body h2 {
	margin-top: 32px;
	margin-bottom: 10px;
	font-size: 20px;
	color: #2B3034;
	border-bottom: 2px solid #e4eaef;
	padding-bottom: 6px;
}
#blog-show .post-body h3 {
	margin-top: 24px;
	margin-bottom: 8px;
	font-size: 17px;
	color: #353C40;
}
#blog-show .post-body p {margin-bottom: 14px;}
#blog-show .post-body ul, #blog-show .post-body ol {
	padding-left: 24px;
	margin-bottom: 14px;
}
#blog-show .post-body li {margin-bottom: 4px;}
#blog-show .post-body blockquote {
	border-left: 4px solid #5F889E;
	padding: 8px 16px;
	margin: 16px 0;
	font-style: italic;
	color: #555;
	background: #f7f9fb;
	border-radius: 0 4px 4px 0;
}
#blog-show .post-body code {
	background: #f0f0f0;
	padding: 2px 5px;
	border-radius: 3px;
	font-size: 0.88em;
	color: #c7254e;
}
#blog-show .post-body pre {
	background: #f4f4f4;
	padding: 14px;
	border-radius: 4px;
	overflow-x: auto;
	margin-bottom: 16px;
}
#blog-show .post-body pre code {
	background: none;
	color: inherit;
	padding: 0;
}
#blog-show .post-body table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 16px;
	font-size: 14px;
}
#blog-show .post-body th {
	background: #2B3034;
	color: #fff;
	padding: 8px 10px;
	text-align: left;
}
#blog-show .post-body td {
	padding: 7px 10px;
	border-bottom: 1px solid #e0e0e0;
}
#blog-show .post-body tr:nth-child(even) td {background: #f7f9fb;}

/* Footer */
.post-footer {
	padding: 16px 20px 20px;
	border-top: 1px solid #e4eaef;
	margin-top: 8px;
}

@media (max-width: 768px) {
	.post-hero {height: 180px;}
	.blog-card-col {margin-bottom: 16px;}
	.blog-container .content {padding: 12px;}
	#blog-show .post-body {padding: 16px 12px; font-size: 14px;}
	.post-footer {padding: 12px;}
	.post-hero-title {font-size: 20px;}
}
@media (max-width: 480px) {
	.blog-card-image {height: 160px;}
	.post-hero {height: 140px;}
	.post-hero-title {font-size: 18px;}
}

/* AdSense Styles */
.adsense-container {
	margin: 20px 0;
	text-align: center;
	min-height: 50px;
}

.adsense-container ins {
	display: block !important;
	margin: 0 auto;
}

@media (max-width: 768px) {
	.adsense-container {
		margin: 16px 0;
	}
}