@import url( http://fonts.googleapis.com/css?family=Allerta );
body {
	margin: 0px; padding: 0px; font-family: Allerta, sans-serif; font-size: 1em;
}
a {
	color: rgb(36, 96, 144); text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a:visited {
	color: rgb(36, 144, 143);
}
abbr {
	border-bottom-color: rgb(136, 136, 136); border-bottom-width: 1px; border-bottom-style: dashed; cursor: help;
}
abbr:hover {
	color: black;
}
dfn {
	letter-spacing: 0.5em;
}
.clr {
	clear: both;
}
#page {
	margin: 15px;
}
#head {
	width: 100%; margin-bottom: 20px; float: left; display: block;
}
#logo {
	background: url("../site_images/xmas.png") no-repeat 0% 0% / contain; height: 150px; letter-spacing: 0.2em; font-size: 3em; font-weight: bold; margin-right: 20px; float: left; text-shadow: 5px 5px 10px #aaa;
}
#head h3 {
	color: rgb(221, 221, 221); vertical-align: middle; float: left; display: table-cell;
}
#nav_main {
	margin: 0px auto; padding: 0px 10px; clear: left; display: table;
}
#nav_main ul {
	list-style: none; margin: 0px; padding: 0px;
}
#nav_main li {
	margin: 5px 2px; padding: 0px; float: left;
}
#nav_main a {
	margin: 0px; padding: 5px 10px; border-radius: 0px; transition:box-shadow 0.2s; color: rgb(68, 68, 68); font-weight: bold; text-decoration: none; display: block; -moz-transition: box-shadow .2s; -khtml-transition: box-shadow .2s; -webkit-transition: box-shadow .2s;
}
#nav_main a:not(#current):hover {
	box-shadow: 0px 15px 10px -15px black;
}
#nav_main a:not(#current):active {
	transition:0.2s; transform: scale(0.8); -webkit-transition: .2s; -webkit-transform: scale(.8);
}
#nav_main #current {
	color: rgb(153, 153, 153);
}
#nav_main a#current {
	cursor: default;
}
#subnav {
	float: right;
}
#subnav ul {
	list-style: none; margin: 0px; padding: 0px;
}
#subnav li {
	margin: 0px 0px 5px; padding: 0px;
}
#subnav a {
	background: rgb(238, 238, 238); padding: 4px 15px; border-radius: 5px; text-align: right; font-size: 0.7em; text-decoration: none; display: block;
}
#subnav a:hover {
	color: black;
}
#subnav a#current {
	color: black;
}
#subnav a#current {
	background: none; border-width: 1px; border-style: solid; border-color: rgb(221, 221, 221) rgb(170, 170, 170) rgb(170, 170, 170) rgb(221, 221, 221); border-image: none; cursor: default;
}
hr.bric {
	border-color: rgb(36, 96, 144); border-radius: 2px; height: 4px; margin-bottom: 1.5em; display: none; box-shadow: 3px 3px 3px rgba(0,0,0,0.5);
}
#content {
	margin-top: 1.5em;
}
.artikel {
	color: rgb(68, 68, 68);
}
.artikel p {
	margin: 0px 0px 1.5em 0.5em; text-align: justify;
}
.artikel h4 {
	margin: 10px 0px; padding: 0px 0px 4px; font-family: serif; font-style: oblique; border-bottom-color: rgb(159, 192, 158); border-bottom-width: 3px; border-bottom-style: solid;
}
.col80 {
	width: 80%; float: left;
}
.col20 {
	width: 20%; float: left;
}
.col20 div {
	margin: 0px 0px 1.5em 1em; padding-left: 0.5em; border-left-color: rgb(204, 204, 204); border-left-width: 1px; border-left-style: solid;
}
.rightpad {
	background: rgb(246, 246, 246); padding: 15px 10px; border-radius: 0px 5px 5px 0px; overflow: hidden;
}
.rightpad span {
	color: rgb(102, 102, 102); font-size: 0.8em; display: block;
}
.rightpad span.head {
	padding-bottom: 10px;
}
.rightpad.tiny a {
	font-size: 0.8em; display: block;
}
.rightpad.tiny li {
	background: linear-gradient(rgb(238, 238, 238) 50%, rgb(221, 221, 221)); margin: 2px 0px; padding: 4px; border-radius: 2px;
}
.rightpad.tiny li span {
	color: rgb(68, 68, 68); font-size: 0.6em;
}
.rightpad ul {
	list-style: none; margin: 0px; padding: 0px;
}
.commerc ul {
	list-style: none; margin: 0px; padding: 0px;
}
.commerc span {
	color: rgb(204, 204, 204); font-size: 0.7em;
}
.commerc li {
	margin: 15px auto; padding: 0px; width: 80%; border-bottom-color: rgb(238, 238, 238); border-bottom-width: 1px; border-bottom-style: solid; max-width: 200px;
}
.commerc li img {
	width: 100%; border-bottom-color: transparent; border-bottom-width: 2px; border-bottom-style: solid;
}
.commerc li a:hover img {
	border-color: rgb(36, 96, 144); opacity: 0.8;
}
.app_contain {
	width: 49%; margin-bottom: 1.5em; float: left;
}
.app_contain.lft {
	padding-right: 1%;
}
.app_contain.rgt {
	padding-left: 1%;
}
.app_contain h4 {
	margin: 10px 0px 5px; color: rgb(102, 102, 102);
}
.app_contain h5 {
	margin: 10px 0px 5px; color: rgb(102, 102, 102);
}
.app_anchor a {
	background: rgb(246, 246, 246); margin: 7px 0px; padding: 0.2em 0.4em; border-radius: 10px; text-decoration: none; border-bottom-color: rgb(187, 187, 187); border-left-color: rgb(187, 187, 187); border-bottom-width: 1px; border-left-width: 1px; border-bottom-style: solid; border-left-style: solid; display: block;
}
.app_anchor a:hover {
	background: rgb(238, 238, 238);
}
.app_anchor a span {
	color: rgb(102, 102, 102); font-size: 0.7em; display: block;
}
.appwin {
	background: rgb(247, 247, 247); margin: 0px auto 2em; border-radius: 10px; font-size: 16px; border-right-color: rgb(204, 204, 204); border-bottom-color: rgb(204, 204, 204); border-right-width: 1px; border-bottom-width: 1px; border-right-style: solid; border-bottom-style: solid; display: table; position: relative;
}
.appwin h4 {
	text-align: center;
}
.app {
	margin: 2em; z-index: -4;
}
.appnav {
	margin: 0px auto 1.5em; width: 80%; display: table; table-layout: fixed; max-width: 1100px;
}
.appnav span {
	text-align: center; display: table-cell;
}
.appnav a {
	background: rgb(221, 221, 221); padding: 4px 10px; border-radius: 5px; font-size: 0.8em;
}
.appnav span.left {
	width: 4.2em;
}
.appnav span.right {
	width: 4.2em;
}
.appnav span.left a {
	text-align: center; display: block;
}
.appnav span.right a {
	text-align: center; display: block;
}
.appnav a:hover {
	color: black; text-decoration: none;
}
.appnav span.left.hide {
	visibility: hidden;
}
.appnav span.right.hide {
	visibility: hidden;
}
.app_context {
	border-width: 1px; border-style: solid; border-color: rgb(232, 232, 232) rgb(170, 170, 170) rgb(170, 170, 170) rgb(232, 232, 232); margin: 0px auto; padding: 10px; border-radius: 10px; border-image: none; width: 78.5%; display: block; max-width: 1080px;
}
.appdate {
	font: italic 1em/normal serif; font-size-adjust: none; font-stretch: normal;
}
.art_copy {
	background: rgb(204, 204, 204); border-radius: 5px; left: 2em; width: 24px; text-align: center; bottom: -10px; line-height: 21px; border-right-color: rgb(102, 102, 102); border-bottom-color: rgb(136, 136, 136); border-right-width: 1px; border-bottom-width: 1px; border-right-style: solid; border-bottom-style: solid; position: absolute; cursor: default;
}
.art_copy::before {
	left: -8px; top: 10px; width: 0px; height: 0px; border-top-color: rgb(170, 170, 170); border-left-color: transparent; border-top-width: 10px; border-left-width: 10px; border-top-style: solid; border-left-style: solid; position: absolute; z-index: -1; content: "";
}
.art_copy span {
	background: rgb(204, 204, 204); padding: 2px 12px; border-radius: 5px; font-size: 0.7em; border-right-color: rgb(102, 102, 102); border-bottom-color: rgb(136, 136, 136); border-right-width: 1px; border-bottom-width: 1px; border-right-style: solid; border-bottom-style: solid; display: none; white-space: nowrap; box-shadow: 1px 1px 4px rgba(128,128,128,0.8), inset 1px 1px 1px white, inset -1px -1px 1px black;
}
.art_copy:hover span {
	left: 25px; top: 0px; display: block; position: absolute;
}
.social {
	background: rgb(244, 244, 244); border-width: 1px 1px 1px medium; border-style: solid solid solid none; border-color: rgb(238, 238, 238) rgb(170, 170, 170) rgb(170, 170, 170) currentColor; margin: -21px 80px 5px auto; padding: 5px; border-radius: 0px 0px 10px 10px; border-image: none; width: 32px; height: 32px; position: relative;
}
.social::before {
	left: -5px; top: -1px; width: 0px; height: 0px; border-top-color: transparent; border-right-color: rgb(221, 221, 221); border-top-width: 10px; border-right-width: 5px; border-top-style: solid; border-right-style: solid; position: absolute; content: "";
}
.social::after {
	left: 43px; top: -1px; width: 0px; height: 0px; border-top-color: transparent; border-left-color: rgb(221, 221, 221); border-top-width: 10px; border-left-width: 5px; border-top-style: solid; border-left-style: solid; position: absolute; content: "";
}
a.tweetthis {
	background: url("../site_images/comment_twitter.png"); width: 32px; height: 32px; clear: right; float: right; display: block;
}
a.tweetthis:hover {
	opacity: 0.7;
}
a.twitter {
	background: url("../site_images/twitter_1.png"); width: 32px; height: 32px; display: block;
}
a.twitter:hover {
	opacity: 0.7;
}
.boxshadow {
	box-shadow: 0px 0px 4px #ddd;
}
.nobg {
	background-color: transparent;
}
.bg_lgray {
	background-color: rgb(221, 221, 221);
}
.w500 {
	width: 500px;
}
.w700 {
	width: 700px;
}
.w800 {
	width: 800px;
}
.minw700 {
	min-width: 700px;
}
.minw800 {
	min-width: 800px;
}
.minw900 {
	min-width: 900px;
}
.maxw700 {
	max-width: 700px;
}
.maxw800 {
	max-width: 800px;
}
.maxw900 {
	max-width: 900px;
}
.browser p {
	margin: 5px 0px; font-size: 0.8em;
}
.browser b {
	background: url("../site_images/browser_logos-16.png") no-repeat; width: 16px; height: 16px; margin-right: 5px; float: left;
}
.browser b.chrome {
	background-position: 0px;
}
.browser b.ff {
	background-position: -18px;
}
.browser b.opera {
	background-position: -36px;
}
.browser b.safari {
	background-position: -53px;
}
.browser b.ie {
	background-position: -70px;
}
.browser b.mobil {
	background-position: -87px;
}
.bbl_info {
	margin: 0px; padding: 0px; text-align: left; font-style: italic; border-bottom-color: rgb(170, 170, 170); border-bottom-width: medium; border-bottom-style: double; display: inline; position: relative;
}
.bbl_info:hover .tooltip {
	visibility: visible; opacity: 1;
}
.bbl_info .tooltip {
	background: linear-gradient(rgb(238, 238, 248), rgb(221, 221, 221)); padding: 5px; border-radius: 7px; border: 1px solid rgb(102, 102, 102); transition:0.3s; border-image: none; left: 0%; top: 170%; color: black; visibility: hidden; position: absolute; max-width: 300px; opacity: 0; box-shadow: 2px 2px 1px #aaa;
}
.bbl_info .tooltip.w200 {
	
}
.bbl_info span.content {
	font: 0.8em/1em sans-serif; display: block; cursor: default; font-size-adjust: none; font-stretch: normal;
}
.bbl_info span.leader {
	left: 10%; top: -20px; width: 80%; height: 20px; overflow: hidden; position: absolute;
}
.bbl_info span.leader span {
	background: rgb(238, 238, 248); border-width: 1px medium medium 1px; border-style: solid none none solid; border-color: rgb(68, 68, 68) currentColor currentColor rgb(68, 68, 68); border-image: none; left: 0px; top: 10px; width: 20px; height: 20px; position: absolute; box-shadow: 2px -2px 5px #aaa; transform: skewY(45deg) rotate(0deg); -webkit-transform: skewy(45deg) rotate(0deg);
}
#footer {
	background: rgb(238, 238, 238); padding: 10px; border-radius: 5px; clear: left; margin-top: 1em;
}
#footer::after {
	height: 0px; clear: both; display: block; visibility: hidden; content: ".";
}
#footer span {
	padding: 0px 10px; font-size: 0.8em; float: left;
}
#footer a {
	padding: 0px 10px; font-size: 0.8em; float: left;
}
#footer span {
	color: rgb(102, 102, 102);
}
#footer a#impress {
	float: right;
}
body.font-selector {
	margin-top: 40px;
}
input.font-switch {
	display: none;
}
#font-size-select {
	top: 0px; right: 10px; color: rgb(187, 187, 187); position: absolute;
}
#font-size-select label {
	padding: 5px; border-radius: 2px; cursor: pointer;
}
#font-size-select label:hover {
	background-color: gray;
}
#fk {
	font-size: 0.8em;
}
#fs {
	font-size: 1.05em;
}
#fg {
	font-size: 1.5em;
}
:checked#font-k ~ #font-size-select #fk {
	color: black;
}
:checked#font-s ~ #font-size-select #fs {
	color: black;
}
:checked#font-g ~ #font-size-select #fg {
	color: black;
}
:checked#font-k ~ div#page {
	font-size: 0.8em;
}
:checked#font-s ~ div#page {
	font-size: 1em;
}
:checked#font-g ~ div#page {
	font-size: 1.5em;
}
@media screen and (max-width:800px)
{
#nav_main {
	display: block;
}
#nav_main li {
	width: 80%; margin-left: 10%; float: none;
}
#nav_main a {
	text-align: center;
}
.col80 {
	width: 100%; float: none;
}
.col20 {
	width: 100%; float: none;
}
.col20 div {
	margin-left: 0px;
}
hr.bric {
	clear: left; display: block;
}
.app_contain {
	width: 100%;
}
.app_contain.lft {
	padding: 0px;
}
.app_contain.rgt {
	padding: 0px;
}
#logo {
	font-size: 2em;
}
#head h3 {
	font-size: 1em;
}
}
