/*  
Theme Name: DECAF°
Version: 2
Author: Dirk Schürjohann
*/

/* --------------------------------------------------------------------------------------
 * html and body
 * -------------------------------------------------------------------------------------- */

	html {
		height: 100%;
		padding-bottom: 1px; /* always show vertical scrollbars */
	}
	body {
		background: #fff url(static/images/bgr_body.png) 0 0 repeat-y; color: #444;
		/* font-family: 'Calibri', 'Myriad Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; */
		font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
		font-size: 14px;
		margin: 0; padding: 0;
		width: 100%;
		height: 100%;
		/* -moz-opacity: 0.999; */ /* fix mac firefox opacity bug */
	}
	@media screen, projection {
		body.w1 {
			background-image: none;
		}
		body.w2 {
			background-image: none;
		}
		body.w3 {
		}
		body#showcase {
			background: #222;
			overflow: auto;
		}
	}
	@media print {
		body {
			background: #fff;
			font-size: 100%;
		}
	}

  @font-face {
  	font-family: 'Axel Bold';
  	src: url('./fonts/axel-bold.eot');
  	src: local('☺'), url('./fonts/axel-bold.woff') format('woff'), url('./fonts/axel-bold.ttf') format('truetype'), url('./fonts/axel-bold.svg') format('svg');
  	font-weight: normal;
  	font-style: normal;
  }

/* --------------------------------------------------------------------------------------
 * generic classes
 * -------------------------------------------------------------------------------------- */

	.mb-2 {
		margin-bottom: -30px !important;
	}
	.mb-1 {
		margin-bottom: -10px !important;
	}
	.mb0 {
		margin-bottom: 0 !important;
	}
	.mb1 {
		margin-bottom: 20px !important;
	}
	.mb2 {
		margin-bottom: 40px !important;
	}
	.mb3 {
		margin-bottom: 60px !important;
	}
	.mb4 {
		margin-bottom: 80px !important;
	}
	.clear {
		overflow: hidden;
		clear: both;
		display: table;
		height: 0;
		zoom: 1;
	}


/* --------------------------------------
 * media classes
 * -------------------------------------- */

	/*
	reader  = screen reader only  (eg skip links)
	print   = print only          (eg contact infos, references)
	noprint = don't print         (eg navigation)
	*/

	@media screen, projection {
		.reader {
			position: absolute; left: -990em; height: 1em; width: 1em;
			overflow: hidden;
		}
		.print {
			display: none;
			visibility: hidden;
		}
		.nonprint {
			/* nothing */
		}
	}
	@media print {
		.reader {
			display: none;
			visibility: hidden;
		}
		.print {
			display: block;
			visibility: visible;
		}
		.nonprint {
			display: none;
			visibility: hidden;
		}
	}


/* --------------------------------------------------------------------------------------
 * links
 * -------------------------------------------------------------------------------------- */

	a {
		color: #6e8388;
		text-decoration: underline;
		padding: 0.2em;
		margin: 0 -0.2em;
	}
	a:hover,
	a:focus {
		background: #e6edf0;
		text-decoration: underline;
	}
	a:active {
		outline: 0; /* remove dotted borders */
	}

	@media print {
		a {
			color: #46565A !important;
			text-decoration: underline !important;
			padding: 0.2em;
			margin: 0 -0.2em;
		}
	}

	/* external */

	a.external {
		background-image: url(static/images/icon_external.png) !important;
		background-position: right 20% !important;
		background-repeat: no-repeat !important;
		padding-right: 11px !important;
	}


/* --------------------------------------------------------------------------------------
 * typo
 * -------------------------------------------------------------------------------------- */

	p {
		font-size: 1em; line-height: 1.8em; font-weight: normal;
		margin: 0 0 1em 0; padding: 0;
	}
	
	h4, h5, h6 {
		font-size: 1em; line-height: 1.8em; font-weight: bold;
		margin: 0 0 0.5em 0; padding: 0;
		color: #46565A;
	}
	h3 {
		font-size: 1.3em; line-height: 1.3em; font-weight: bold;
		margin: 0 0 0.5em 0; padding: 0;
		color: #46565A;
	}
	h2 {
		font-size: 1.5em; line-height: 1.3em; font-weight: bold;
		margin: 0 0 1em 0; padding: 0;
		color: #46565A;
	}
	h1 {
	  font-family: 'Axel Bold', 'Helvetica Neue', Arial, Helvetica, sans-serif;
		font-size: 36px; line-height: 1em; font-weight: normal;
		margin: 0 0 30px 0; padding: 0;
		color: #46565A;
		position: relative; left: -1px;
	}
	@media screen, projection {
		body.w1 h1 {
			margin-bottom: 0.5em;
		}
		body.w2 h1 {
			margin-bottom: 15px;
		}
	}
	h1 a {
	  display: block;
	  margin: 0;
	  padding: 0;
		color: #46565A;
		text-decoration: none;
		zoom: 1;
	}
	h1 a:hover,
	h1 a:focus {
		opacity: .8;
		filter: alpha(opacity=80);
		background: none;
		text-decoration: none;
	}

	/* -5 gentle px */
	#content p {
		width: 610px; /* 600 + 10 gentle px */
	}
	@media screen, projection {
		body.w1 #content p {
			width: auto;
		}
	}

	/* lists */

	ul,
	ol {
		margin: 0 0 1.5em 0;
		padding: 0 0 0 2em;
	}
	li {
		line-height: 1.8em;
		margin: 0 0 0.3em 0;
		padding: 0;
	}
	li p {
		width: auto !important;
	}


/* --------------------------------------------------------------------------------------
 * images
 * -------------------------------------------------------------------------------------- */

	img {
		border: 0;
		padding: 0;
		margin: 0;
		display: block;
	}
	img.inline {
		display: inline;
	}


/* --------------------------------------------------------------------------------------
 * layout
 * -------------------------------------------------------------------------------------- */


/* --------------------------------------
 * site wrapper
 * -------------------------------------- */

	#site_wrapper {
		padding: 50px 0 0 0;
	}
	@media screen, projection {
		body.w1 #site_wrapper {
			padding: 5px 0 0 0;
			min-width: 0;
			margin: 0 2%;
		}
		body.w2 #site_wrapper {
			padding: 0 0 0 0;
			width: 600px;
			min-width: 0;
			margin: 0 auto;
		}
		body.w3 #site_wrapper {
			padding: 60px 0 0 0;
			min-width: 940px;
		}
		body#showcase #site_wrapper {
			padding: 0;
			margin: 0;
			min-width: 0;
		}
	}
	@media print {
		#site_wrapper {
			padding: 0;
		}
	}


/* --------------------------------------
 * sidebar
 * -------------------------------------- */

	#sidebar_wrapper {
		width: 27%;
		float: right;
	}
	@media screen, projection {
		body.w1 #sidebar_wrapper {
			width: auto;
			float: none;
		}
		body.w2 #sidebar_wrapper {
			width: auto;
			float: none;
		}
		body.w3 #sidebar_wrapper {
		}
	}
	@media print {
		#sidebar_wrapper {
			width: auto !important;
			float: none !important;
		}
	}
	#sidebar {
		position: relative;
	}
	@media screen, projection {
		body.w1 #sidebar {
		}
		body.w2 #sidebar {
			width: 600px;
			padding: 0 20px 0 10px;
		}
		body.w3 #sidebar {
		}
	}
	@media print {
		#sidebar {
			width: 600px;
			padding: 0 20px 0 10px;
		}
	}


/* --------------------------------------
 * content
 * -------------------------------------- */

	#content_wrapper {
		margin: 0 27% 0 5%;
		padding: 4px 0 0 0;
	}
	@media screen, projection {
		body.w1 #content_wrapper {
			clear: both;
			margin: 0;
		}
		body.w2 #content_wrapper {
			clear: both;
			margin: 0;
		}
		body.w3 #content_wrapper {
			min-width: 610px;
		}
	}
	@media print {
		#content_wrapper {
			clear: both;
			margin: 0;
		}
	}

	#content {
		width: 610px;
		margin: 0 auto;
		padding: 10px 20px 20px 10px;
		overflow: hidden;
	}
	@media screen, projection {
		body.w1 #content {
			width: 100%;
			margin: 0;
			padding: 0;
		}
		body.w2 #content {
			width: 610px;
			margin: 0 auto;
		}
		body.w3 #content {
			width: 610px;
			margin: 0 auto;
		}
	}
	@media print {
		#content {
			width: 610px;
			margin: 0 auto;
		}
	}


/* --------------------------------------
 * footer
 * -------------------------------------- */

	#footer {
		width: 610px;
		margin: 0 auto;
		padding: 50px 20px 10px 10px;
	}
	@media screen, projection {
		body.w1 #footer {
			width: 100%;
			margin: 0;
			padding: 10px 0 10px 0;
		}
		body.w2 #footer {
			width: 610px;
			margin: 0 auto;
			padding: 30px 0 10px 10px;
		}
		body.w3 #footer {
			width: 610px;
			margin: 0 auto;
		}
	}
	@media print {
		#footer {
			display: none;
		}
	}


/* --------------------------------------------------------------------------------------
 * title
 * -------------------------------------------------------------------------------------- */

	#title {
		display: block;
		width: 250px;
		height: 95px;
		font-size: 1em;
		line-height: 1em;
		margin: 0 0 30px 0;
		padding: 0;
		overflow: hidden;
	}
	@media print {
		#title {
			position: static !important;
			float: none !important;
			margin: 0 0 30px 20px !important;
			overflow: auto !important;
		}
	}
	#title img {
		display: block;
	}
	#title a {
		display: block;
		text-decoration: none;
		margin: 0;
		padding: 0;
		border: 0 !important;
	}
	#title a:hover,
	#title a:focus {
		opacity: .8;
		background: none;
	}
	* html #title a:hover,
	* html #title a:focus {
		filter: alpha(opacity=80);
		zoom: 1;
	}
	*+html #title a:hover,
	*+html #title a:focus {
		filter: alpha(opacity=80);
		zoom: 1;
	}
	#title strong {
		display: none;
	}


/* --------------------------------------
 * small screens (body.w1)
 * -------------------------------------- */

	@media screen, projection {
		body.w1 #title {
			width: auto;
			height: auto;
			line-height: 1.2em;
			margin: 0 0 0.5em 0;
		}
		body.w1 #title img {
			display: none;
		}
		body.w1 #title a {
			display: block;
			width: auto;
			height: auto;
			text-decoration: underline;
		}
		body.w1 #title strong {
			display: block;
		}
	}


/* --------------------------------------
 * medium screens (body.w2)
 * -------------------------------------- */

	@media screen, projection {
		body.w2 #title {
			position: relative; left: -10px;
			margin: 0 0 15px 0;
			height: 60px;
			overflow: hidden;
		}
	}


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

	#navigation {
		margin: 0 0 1em 0;
		padding: 0;
	}
	@media print {
		#navigation {
			display: none !important;
		}
	}
	#navigation ol {
		margin: 0;
		padding: 0;
	}
	#navigation ol li {
		display: block;
		width: 100%;
		height: 31px;
		margin: 0 0 1px 0;
		padding: 0;
		list-style-type: none;
		overflow: hidden;
	}
	#navigation ol li .act {
		background-color: #daddde;
	}
	#navigation ol li span {
		position: absolute; left: -990px; height: 1px; width: 1px;
		overflow: hidden;
	}
	#navigation ol li a {
		display: block;
		width: 100%;
		height: 31px;
		text-decoration: none;
		margin: 0;
		padding: 0;
		cursor: pointer;
	}
	* html #navigation ol li a {
		display: inline-block;
	}
	*+html #navigation ol li a {
		display: inline-block;
	}
	#navigation ol li em {
		display: block;
		width: 100%;
		height: 31px;
		background: transparent url(static/images/bgr_navigation.png) 0 0 no-repeat;
		overflow: hidden;
	}
	.en #navigation ol li em {
		background-image: url(static/images/bgr_navigation_en.png);
	}
	* html #navigation ol li em {
		display: inline-block;
	}
	*+html #navigation ol li em {
		display: inline-block;
	}
	#navigation ol li.nav1 em {
		background-position: 0 0;
	}
	#navigation ol li.nav2 em {
		background-position: 0 -32px;
	}
	#navigation ol li.nav3 em {
		background-position: 0 -64px;
	}
	#navigation ol li.nav4 em {
		background-position: 0 -96px;
	}
	#navigation ol li.nav5 em {
		background-position: 0 -128px;
	}
	#navigation ol li.nav6 em {
		background-position: 0 -160px;
	}
	#navigation ol li.nav1 a:hover em,
	#navigation ol li.nav1 a:focus em {
		background-position: 0 -192px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav2 a:hover em,
	#navigation ol li.nav2 a:focus em {
		background-position: 0 -224px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav3 a:hover em,
	#navigation ol li.nav3 a:focus em {
		background-position: 0 -256px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav4 a:hover em,
	#navigation ol li.nav4 a:focus em {
		background-position: 0 -288px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav5 a:hover em,
	#navigation ol li.nav5 a:focus em {
		background-position: 0 -320px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav6 a:hover em,
	#navigation ol li.nav6 a:focus em {
		background-position: 0 -352px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav1 em.act,
	#navigation ol li.nav1 a.act em {
		background-position: 0 -192px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav2 em.act,
	#navigation ol li.nav2 a.act em {
		background-position: 0 -224px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav3 em.act,
	#navigation ol li.nav3 a.act em {
		background-position: 0 -256px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav4 em.act,
	#navigation ol li.nav4 a.act em {
		background-position: 0 -288px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav5 em.act,
	#navigation ol li.nav5 a.act em {
		background-position: 0 -320px;
		background-color: #e6edf0;
	}
	#navigation ol li.nav6 em.act,
	#navigation ol li.nav6 a.act em {
		background-position: 0 -352px;
		background-color: #e6edf0;
	}


/* --------------------------------------
 * small screens (body.w1)
 * -------------------------------------- */

	@media screen, projection {
		body.w1 #navigation {
			border-top: 1px solid #aaa;
			border-bottom: 1px solid #aaa;
			margin: 0 0 10px 0;
			padding: 0;
		}
		body.w1 #navigation ol {
		}
		body.w1 #navigation ol li {
			line-height: 1.4em;
			display: inline;
			width: auto;
			height: auto;
			margin: 0 0.5em 0 0;
			padding: 0;
			list-style-type: none;
			overflow: hidden;
		}
		body.w1 #navigation ol li.act {
			background-color: #daddde;
		}
		body.w1 #navigation ol li span {
			position: static;
			height: auto;
			width: auto;
			overflow: hidden;
		}
		body.w1 #navigation ol li a {
			display: inline;
			width: auto;
			height: auto;
			text-decoration: underline;
		}
		body.w1 #navigation ol li em {
			display: inline;
			width: auto;
			height: auto;
			background: none;
			overflow: hidden;
			font-style: normal;
		}
	}


/* --------------------------------------
 * medium screens (body.w2)
 * -------------------------------------- */

	@media screen, projection {
		body.w2 #navigation {
			margin: 0 0 1em 0;
			border-top: 1px solid #aaa;
			border-bottom: 1px solid #aaa;
		}
		body.w2 #navigation ol {
		}
		body.w2 #navigation ol li {
			display: block;
			float: left;
			width: 100px;
			height: 31px;
			margin: 0;
			padding: 0;
			list-style-type: none;
			overflow: hidden;
		}
		body.w2 #navigation ol li.nav1 {
			width: 105px;
		}
		body.w2 #navigation ol li.nav2 {
			width: 75px;
		}
		body.w2 #navigation ol li.nav3 {
			width: 135px;
		}
		body.w2 #navigation ol li.nav4 {
			width: 135px;
		}
		body.w2 #navigation ol li.nav5 {
			width: 95px;
		}
		body.w2 #navigation ol li.nav6 {
			width: 55px;
		}
	}



/* --------------------------------------
 * content blocks
 * -------------------------------------- */


	.block {
		margin: 0 0 2em 0;
	}
	@media screen, projection {
		body.w1 .block {
			margin: 0 0 1em 0;
		}
	}


/* --------------------------------------
 * roundups/info boxes
 * -------------------------------------- */

	.roundup {
		margin: 0 10px 1em 0;
		padding: 0 0 12px 0;
		background: url(static/images/bgr_box.png) 400px bottom no-repeat;
	}
	.roundup .inner {
		margin: 0;
		padding: 1em 0.5em 0.8em 1em;
		background: #e6edf0;
	}
	* html .roundup .inner {
		display: inline-block;
	}
	*+html .roundup .inner {
		display: inline-block;
	}
	.roundup .inner .block {
		margin: 0;
	}

	.roundup .image {
		margin-bottom: 0.4em;
	}
	.roundup p {
		display: block;
		width: auto !important;
		/* line-height: 1.8em; */
		margin-bottom: 0.5em;
	}
	.roundup a {
		font-weight: bold;
		text-decoration: underline;
		padding: 0.2em;
		margin: 0 -0.1em;
	}
	.roundup a:hover,
	.roundup a:focus {
		background: #b6bdc1;
		color: #fff;
		text-decoration: underline;
	}
	@media screen, projection {
		body.w1 .roundup {
			background: none;
			margin: 0 0 0.5em 0;
			padding: 0;
		}
	}
	@media print {
		.roundup {
			background: none;
			padding: 0;
			margin: 0 0 2em 0;
		}
		.roundup .inner {
			padding: 0;
			background: none;
		}
	}


	.pic4 {
		margin-left: 155px !important;
	}
	.pic4 p {
		width: 420px !important; /* 575-155 */
	}
	@media screen, projection {
		body.w1 .pic4 p {
			width: auto !important;
		}
	}
	.pic5 {
		margin-left: 128px !important;
	}
	.pic5 p {
		width: 447px !important; /* 575-128 */
	}
	@media screen, projection {
		body.w1 .pic5 p {
			width: auto !important;
		}
	}



/* --------------------------------------
 * small headline (above h1)
 * -------------------------------------- */

	p.headline {
		display: block;
		min-height: 24px;
		padding-top: 2px;
		margin: 0 0 10px 0;
		line-height: 1.2em;
	}
	* html p.headline {
		min-height: 0;
		height: 24px;
	}
	@media only screen and (max-device-width: 480px) {
		p.headline {
			font-size: 1.3em;
		}
	}


/* --------------------------------------
 * quotes
 * -------------------------------------- */

	blockquote {
		margin: 0 0 2em 10px;
		padding: 0 0 0 40px;
		background: transparent url(static/images/bgr_quotes.gif) left 0 no-repeat;
	}
	@media screen, projection {
		body.w1 blockquote {
			margin-left: 0;
		}
	}
	blockquote p {
		width: 555px !important; /* 550 + 5 gentle px */
		width: auto !important;
		font-size: 1.5em;
		line-height: 1.4em;
		font-weight: normal;
		color: #46565A;
		margin: 0 0 0.5em 0;
	}
	blockquote.longtext p {
		font-size: 1.2em; line-height: 1.5em;
	}
	@media screen, projection {
		body.w1 blockquote p {
			width: auto !important;
		}
	}
	blockquote cite,
	blockquote p.cite {
		font-size: 1em;
		font-style: normal;
		font-weight: normal;
		color: #777;
		margin: 0;
	}


/* --------------------------------------------------------------------------------------
 * footer
 * -------------------------------------------------------------------------------------- */

	#footer p {
		font-size: 0.9em; line-height: 1.5em;
		color: #777;
	}
	#footer a {
		color: #777;
	}



/* --------------------------------------------------------------------------------------
 * dm_form
 * -------------------------------------------------------------------------------------- */

	form.dm_form {
		width: 600px;
		font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
		font-size: 1em;
		margin: 0;
		padding: 0;
		border: 0;
	}
	form.dm_form div.form_wrapper {
		margin: 0 -1%;
		padding: 0;
	}
	* html form.dm_form div.form_wrapper {
		display: inline-block;
	}
	*+html form.dm_form div.form_wrapper {
		display: inline-block;
	}
	form.dm_form fieldset {
		clear: both;
		margin: 0 0 20px 0;
		padding: 0;
		border: 0;
	}
	form.preview fieldset {
		display: none;
		visibility: hidden;
	}


/* --------------------------------------
 * labels and wrappers
 * -------------------------------------- */

	form.dm_form label {
		margin: 0 1%;
		padding: 0;
		border: 0;
		float: left;
		display: table;
		width: 1%;
	}
	* html form.dm_form label {
		display: inline-block !important;
		width: 1%;
		height: 1%;
		margin-right: 0.9% !important; /* avoid position bugs */
	}
	*+html form.dm_form label {
		display: inline-block !important;
		width: 1%;
		height: 1%;
		margin-right: 0.9% !important; /* avoid position bugs */
	}
	form.dm_form span.wrapper {
		margin: 0;
		padding: 0;
		display: table-cell;
		width: 1%; /* firefox */
	}
	* html form.dm_form span.wrapper {
		display: block !important;
		width: 100%;
		overflow: hidden;
	}
	*+html form.dm_form span.wrapper {
		display: block !important;
		width: 100%;
		overflow: hidden;
	}
	* html form.dm_form label.radiocheck span.wrapper {
		width: auto;
	}
	*+html form.dm_form label.radiocheck span.wrapper {
		width: auto;
	}


/* --------------------------------------
 * width
 * -------------------------------------- */

	form.dm_form label.w100 {
		width: 98%;
		display: block;
	}
	form.dm_form label.w75 {
		width: 73%;
		display: block;
	}
	form.dm_form label.w50 {
		width: 48%;
		display: block;
	}
	form.dm_form label.w25 {
		width: 23%;
		display: block;
	}


/* --------------------------------------
 * position
 * -------------------------------------- */

	form.dm_form label.p25 {
		margin-left: 26%;
	}
	form.dm_form label.p50 {
		margin-left: 51%;
	}
	form.dm_form label.p75 {
		margin-left: 76%;
	}


/* --------------------------------------
 * input/select fields 
 * -------------------------------------- */

	form.dm_form label input.field,
	form.dm_form label select.field,
	form.dm_form label textarea.field {
		width: 100%;
		display: block;
		border: 0;
		border-bottom: 1px solid #40ABC6;
		border-left: 8px solid #40ABC6;
		background: #e6edf0;
		padding: 4px;
		font-family: 'Consolas', 'Andale Mono', Courier, monospace;
		/* font-size-adjust: 0.51; */
		font-size: 1em;
		box-sizing: border-box;
		-moz-box-sizing: border-box; /* gecko */
		-webkit-box-sizing: border-box; /* khtml/webkit */
	}
	* html form.dm_form label input.field,
	* html form.dm_form label select.field,
	* html form.dm_form label textarea.field {
		position: relative; /* put on top */
		width: expression(parentNode.offsetWidth - 18); /* - border - padding */
		padding-top: 5px;
		padding-bottom: 5px;
	}
	*+html form.dm_form label input.field,
	*+html form.dm_form label select.field,
	*+html form.dm_form label textarea.field {
		position: relative; /* put on top */
		width: expression(parentNode.offsetWidth - 18); /* - border - padding */
		padding-top: 5px;
		padding-bottom: 5px;
	}
	form.dm_form label select.field {
		padding: 4px 1px 1px 1px; /* have to try out */
	}
	* html form.dm_form label select.field {
		width: 100%;
	}
	*+html form.dm_form label select.field {
		width: 100%;
	}

	/* Pflichtfelder
		mandatory fields */
	form.dm_form label.mandatory input.field,
	form.dm_form label.mandatory select.field,
	form.dm_form label.mandatory textarea.field {
	}
	* html form.dm_form label.mandatory input.field,
	* html form.dm_form label.mandatory select.field,
	* html form.dm_form label.mandatory textarea.field {
		width: expression(parentNode.offsetWidth - 18); /* - border - padding */
	}
	*+html form.dm_form label.mandatory input.field,
	*+html form.dm_form label.mandatory select.field,
	*+html form.dm_form label.mandatory textarea.field {
		width: expression(parentNode.offsetWidth - 18); /* - border - padding */
	}
	form.dm_form label input.field:focus,
	form.dm_form label select.field:focus,
	form.dm_form label textarea.field:focus {
		border-color: #46565A;
	}


/* --------------------------------------
 * checkboxes and radios
 * -------------------------------------- */

	form.dm_form input.select {
		display: block;
		float: left;
		margin: 0;
	}
	* html form.dm_form input.select {
		position: relative;
		left: -2px;
		top: -2px;
	}
	*+html form.dm_form input.select {
		position: relative;
		left: -2px;
		top: -2px;
	}


/* --------------------------------------
 * submit button
 * -------------------------------------- */

	form.dm_form input.submit {
		font-size: 1em;
		padding: 3px 20px;
		font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
		/* font-size-adjust: 0.52; */
		font-weight: bold;
		border: 1px solid #40ABC6;
		background: #40ABC6;
		color: #fff;
	}

	form.dm_form input.submit:hover,
	form.dm_form input.submit:focus {
		border: 1px solid #009fc7;
		background: #009fc7;
		cursor: pointer;  /* sorry, can't use that one in front of Opera */
	}


/* --------------------------------------
 * additional styles for
 * input/select fields
 * -------------------------------------- */

	form.dm_form label.inputselect span.title {
		margin: 0 0 2px 0;
		display: table; /* act as inline-block */
	}
	* html form.dm_form label.inputselect span.title {
		display: inline-block !important;
	}
	*+html form.dm_form label.inputselect span.title {
		display: inline-block !important;
	}
	form.dm_form label.mandatory span.title {
		font-weight: bold;
	}

	form.dm_form label span.title:hover,
	form.dm_form label span.title:focus {
		color: #40ABC6;
		cursor: pointer;
	}

	form.dm_form label br {
		margin: 0 0 2px 0;
	}


/* --------------------------------------
 * additional styles for
 * checkboxes and radios
 * -------------------------------------- */

	form.dm_form label.wauto {
		width: auto;
		margin-right: 15px;
	}
	form.dm_form label.radiocheck {
		margin-bottom: 10px;
	}
	* html form.dm_form label.radiocheck {
		width: auto;
	}
	*+html form.dm_form label.radiocheck {
		width: auto;
	}
	* html form.dm_form label.radiocheck.w100 {
		width: 98%; /* avoid label being too short */
	}
	*+html form.dm_form label.radiocheck.w100 {
		width: 98%; /* avoid label being too short */
	}
	form.dm_form label.radiocheck span.wrapper {
		padding-right: 0;
	}
	form.dm_form label.wauto span.wrapper {
		display: inline;
	}
	form.dm_form label.radiocheck span.title {
		display: block;
		margin: 0 0 0 20px;
		padding: 0;
	}
	* html form.dm_form label.radiocheck span.title {
		display: inline-block !important;
		margin-left: 0;
	}
	*+html form.dm_form label.radiocheck span.title {
		display: inline-block !important;
		margin-left: 0;
	}


/* --------------------------------------
 * clearing elements
 * -------------------------------------- */

	form.dm_form .clear {
		clear: both;
		display: block;
		padding: 0 0 10px 0;
	}
	form.dm_form .mb0 {
		margin-bottom: 0 !important;
	}

	form.dm_form .pb20 {
		padding-bottom: 20px !important;
	}


/* --------------------------------------
 * form content
 * -------------------------------------- */

	form.dm_form p,
	form.dm_form h3 {
		margin: 0 1% 10px 1%;
	}
	



	/* maintenance */

	#maintenance {
		background: #40ABC6;
	}
	#maintenance p {
		font-size: 0.9em;
		line-height: 1em;
		display: block;
		text-align: center;
		color: #fff;
		padding: 2px;
		margin: 0;
		border-bottom: 2px solid #fff;
	}





	.item {
		margin: 0 0 3em 0;
		padding: 0 0 3em 0;
		border-bottom: 1px solid #ccc;
	}
	@media screen, projection {
		body.w1 .item {
			margin-bottom: 1em;
			padding-bottom: 1em;
		}
		body.w2 .item {
			margin-bottom: 2em;
			padding-bottom: 2em;
		}
	}
	.item.page,
	.item.single {
		margin: 0;
		padding: 0;
		border: none;
	}
	.item.single {
		margin-bottom: 5em;
	}


	#comments {
		border-top: 1px solid #ccc;
		padding-top: 20px;
	}



/* --------------------------------------------------------------------------------------
 * content: images
 * -------------------------------------------------------------------------------------- */

	.item .gallery,
	.item .wp-caption,
	.item .aligncenter,
	.item .alignleft,
	.item .alignright,
	.item .alignnone {
		background: #e6edf0 !important;
		display: block !important;
		border: 0 !important;
		padding: 5px !important;
		border: 0 !important;
	}
	.item .aligncenter {
		margin: 0 auto 5px auto !important;
	}
	.item .alignleft {
		float: left !important;
		margin: 0 15px 5px 0 !important;
	}
	.item .alignright {
		float: right !important;
		margin: 0 5px 5px 10px !important;
	}
	.item .alignnone {
		margin: 0 0 5px 0 !important;
	}
	.item .aligncenter a,
	.item .alignleft a,
	.item .alignright a,
	.item .alignnone a,
	.item .aligncenter img,
	.item .alignleft img,
	.item .alignright img,
	.item .alignnone img {
		display: block !important;
		float: none !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
	}

	/* caption */

	.item .wp-caption {
		background: #e6edf0 !important;
		margin-bottom: 1.5em !important;
		padding: 0 !important;
	}
	.item .wp-caption a,
	.item .wp-caption img {
		padding: 5px !important;
	}
	.item .wp-caption a img {
		padding: 0 !important;
	}
	.item .wp-caption p.wp-caption-text {
		font-size: 0.9em !important;
		padding: 0 5px 5px 5px !important;
		margin: 0 !important;
	}

	/* gallery */

	.item .gallery {
		width: 635px !important;
		background: #e6edf0 !important;
		margin: 0 0 1.5em 0 !important;
		padding: 0 0 5px 0 !important;
	}
	.item .gallery dl.gallery-item {
		display: block !important;
		float: left !important;
		margin: 0 !important;
		padding: 0 !important;
		list-style-type: none;
		width: auto !important;
	}
	.item .gallery dt.gallery-icon {
		margin: 0 !important;
		padding: 0 !important;
		list-style-type: none !important;
	}
	.item .gallery dt.gallery-icon a,
	.item .gallery dt.gallery-icon img {
		display: block !important;
		margin: 0 !important;
		border: 0 !important;
		padding: 5px 0 0 5px !important;
	}
	.item .gallery dt.gallery-icon a img {
		padding: 0 !important;
		margin: 0 !important;
	}
	.item .gallery .gallery-caption {
		display: none !important;
		visibility: hidden !important;
	}






	ul.list,
	ul.blogroll {
		margin: 0 0 1em 0;
		padding: 0;
	}
	ul.blogroll {
		margin-bottom: 2em;
	}
	ul.list li,
	ul.blogroll li {
		clear: both;
		margin: -1px 0 0 0;
		padding: 0.5em 0 0.5em 0.5em;
		list-style-type: none;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		overflow: hidden;
	}
	ul.list li ul {
		margin: 0 0 -1px 0;
	}



	.recentcomments {
		padding: 0;
		margin: 0 0 3em 0;
		border-bottom: 0;
	}
	.recentcomments h2 {
		font-size: 1em; font-weight: bold;
		background: #E6EDF0;
		margin: 0;
		padding: 0.5em;
	}
	ul.recentcomments {
	}
	ul.recentcomments li {
		padding: 0.8em 0 0.5em 0;
	}
	ul.recentcomments li .gravatar {
		display: block;
		float: left;
		width: 65px;
	}
	ul.recentcomments li .gravatar a {
		display: block;
		padding: 0;
		margin: 3px 0 0 0.5em;
		background: none;
	}
	ul.recentcomments li .gravatar img {
		display: block;
		float: left;
		border: 1px solid #ccc;
		padding: 2px;
		margin: 0 0 1em 0;
	}
	ul.recentcomments li .comment {
		margin: 0 0 0 75px;
	}
	ul.recentcomments li .comment p {
		width: auto !important;
		margin: 0;
	}



	ul.relevantarticles {
	}
	ul.relevantarticles li {
		padding: 1em 0 1em 2px;
	}
	.relevantarticles h3 {
		font-weight: normal;
		margin: 0 0 0.2em 0;
	}
	.relevantarticles p {
		margin: 0;
	}


	.tags {
		text-align: center;
		line-height: 2em;
	}
	.tags a {
		margin: 0 5px;
		text-decoration: none;
		white-space: nowrap;
	}
	.tags a:hover,
	.tags a:focus {
		text-decoration: underline;
		background: none;
	}



	#smart-archives-list {
	}
	#smart-archives-list h2 {
		font-size: 1em; font-weight: bold;
		background: #E6EDF0;
		margin: 0;
		padding: 0.5em;
	}
	#smart-archives-list ul {
		margin: 0 0 2em 0;
		padding: 0;
	}
	#smart-archives-list ul li {
		clear: both;
		margin: -1px 0 0 0;
		padding: 0.3em 0 0.3em 0.5em;
		list-style-type: none;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		overflow: hidden;
	}


	/* page id 316: links */

	.page316 h2 {
		font-size: 1em; font-weight: bold;
		background: #E6EDF0;
		margin: 0;
		padding: 0.5em;
	}


	.more-link {
		display: block;
		float: left;
	}


	.paging_top {
		min-height: 82px;
		margin: 10px 0 20px 0;
	}
	* html .paging_top {
		min-height: 0;
		height: 84px;
	}
	.pagex,
	.paging_top p.newer {
		min-height: 20px;
		margin: 0 0 5px 0;
	}
	* html .pagex,
	* html .paging_top p.newer {
		min-height: 0;
		height: 20px;
	}
	.paging_top p.topic {
		font-size: 1.3em; line-height: 1.3em; font-weight: bold;
		margin: 0;
		color: #46565A;
	}

	.paging_bottom {
	}
	.paging_bottom p.older {
	}

	@media screen, projection {
		body.w1 .paging_top {
			min-height: 0;
			margin: 0 0 1em 0;
		}
		body.w1 .pagex,
		body.w1 .paging_top p.newer {
			min-height: 0;
			margin-bottom: 1em;
		}
		body.w1 .paging_top p.topic {
			margin-bottom: 1em;
		}
		body.w2 .paging_top {
			min-height: 0;
			margin: 0 0 1em 0;
		}
		body.w2 .pagex,
		body.w2 .paging_top p.newer {
			min-height: 0;
			margin-bottom: 1em;
		}
		body.w2 .paging_top p.topic {
			margin-bottom: 2em;
		}
	}


/* ---------------------------
	code
	--------------------------- */

	.item pre {
    /* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
    white-space: pre; /* CSS2 */
    white-space: pre-wrap; /* CSS 2.1 */
    white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
    word-wrap: break-word; /* IE */
		font-family: 'Consolas', 'Andale Mono', 'Courier New', monospace;
		font-size: 1em; line-height: 1.5em;
	}
	.item code {
		font-family: 'Consolas', 'Andale Mono', 'Courier New', monospace;
		font-size: 1em; line-height: 1.5em;
	}
	.item pre code {
		display: block;
		background: #E6EDF0;
		margin: 0 0 2em 0;
		padding: 1em;
	}




	ul.comments {
		margin: 0 0 4em 0;
		padding: 0;
	}
	ul.comments li {
		border-bottom: 1px solid #ccc;
		margin: 0 0 1em 0;
		padding: 0 0 0.5em 0;
		list-style-type: none;
	}
	ul.comments li .row {
	}
	ul.comments li .comment_1 {
		width: 120px;
		float: left;
	}
	ul.nogravatars li .comment_1 {
		width: 30px;
	}
	ul.comments li a.comment_nr {
		width: 20px;
		display: block;
		float: left;
		padding-top: 0;
		padding-bottom: 0;
		margin: 0 5px 0 0;
		overflow: hidden;
	}
	ul.comments li a.avatar {
		background-image: none !important;
		padding: 0 !important;
		margin: 0 !important;
	}
	ul.comments li img.avatar {
		border: 1px solid #ccc;
		padding: 2px;
	}
	ul.comments li .comment_2 {
		width: 480px;
		float: left;
	}
	ul.nogravatars li .comment_2 {
		width: 570px;
	}
	ul.comments li p.comment_author {
		font-size: 1.2em;
		margin: 0 0 0.5em 0;
	}
	ul.comments li p.comment_author .team {
		color: #2FD5FE;
		padding-left: 5px;
	}

	ul.comments blockquote {
		margin: 0.2em 0 1.2em 0;
		padding: 0 0 0 15px;
		background: none;
		border-left: 10px solid #ccc;
	}
	ul.comments blockquote p {
		width: auto !important;
		font-size: 1em;
		line-height: 1.8em;
		color: #666;
	}


	.item object,
	.item iframe {
		border: 1px solid #ccc;
		display: block;
		padding: 4px;
		margin: 0;
	}

	#twitter {
		position: absolute; top: 82px; left: 150px;
	}
	body.w1 #twitter {
		display: none;
	}
	body.w2 #twitter {
		top: 35px; left: 220px;
	}
	#twitter a {
		padding: 0 !important;
		margin: 0 !important;
	}
	* html #twitter {
		display: none;
	}


	.commentlink {
		text-decoration: none !important;
	}