@font-face{
    font-family: 'GoudyBookletter1911';
    src: url(/images/fonts/GoudyBookletter1911.otf);
}
@font-face{
    font-family: 'Junction02';
    src: url(/images/fonts/Junction02.otf);
    src: local('?'), url(/images/fonts/ttf/Junction02.ttf) format('truetype');
}
@font-face{
    font-family: 'LeagueGothic';
    src: url(/images/fonts/LeagueGothic.otf);
}
@font-face{
	font-family: 'Raleway';
	src: url(/images/fonts/Raleway-Thin.otf);
	src: local('?'), url(/images/fonts/ttf/Raleway-Thin.ttf) format('truetype');
}


* {
	margin: 0px;
	padding: 0px;
}

BODY {
	background-color: #FFFFFF;
	color: #333333;
	font-family: "Trebuchet MS", Verdana, Geneva, Tahoma, Arial, Helvetica, sans-serif;
	margin: 2em 5px 1em;
}


H1, H2, H3, H4, H5 {
	font-weight: bold; 
	font-family: GoudyBookletter1911, Georgia, serif;
	text-rendering: optimizeLegibility;
}

H1 {
	padding-top: 0.333em;
	padding-bottom: 0.333em;
	font-size: 2.2em; 
}

H2 {
    padding-top: 0.333em;
	padding-bottom: 0.333em;
	font-size: 1.75em; 
}

H3 {
    padding-top: 0.333em;
	padding-bottom: 0.333em;
	font-size: 1.333em; 
}

@media screen and (max-width: 640px) {
	H1 {
		font-size: 1.7em;
	}
	H2 {
		font-size: 1.4em;
	}
	H3 {
		font-size: 1.125em;
	}
}

#content H1 {
	text-shadow: 0px 0px 5px #666;
}

#header {
	position: fixed;
	top: 0px;
	left: 0px;
	display: block;
	width: 100%;
	padding: 0.2em 0.5em;
	opacity: .9;
	background-color: #F5F5F5;
	border-bottom: 1px solid #BFBFBF;
	box-shadow: 0px 0px 5px #666;
	z-index: 9000;
}
@media screen and (max-width: 800px) {
	#header {
		font-size: 0.8em;
	}
}

#header:hover, #header:focus {
	opacity: 1;
}

#header TABLE {
	width: 98%;
}
@media print {
	#header {
		display: none ! important;
		opacity: .0;
	}
}

#header A {
	border-bottom: none !important; 
}

#content {
	width: 95%;
	margin-left: 2.49%;
	margin-right: 2.49%;
}
@media screen and (min-width: 2000px) {
	#content {
		margin-left: 10%;
		margin-right: 10%;
	}
}

#content_menu {
	float: right;
	width: 40%;
	padding-bottom: 2em;
}
@media screen and (max-width: 800px) {
	#content_menu {
		float: none;
		width: 100%;
	}
}

#content_menu .fussnote {
	padding: 0.25em;
	margin-top: 1em;
	background: white;
	box-shadow: 0px 0px 5px #666;
	width: 50%;
	min-width: 100px;
	opacity: 0.666;
	border-radius: 0.5em;
}

#counter {
	font-size: 0.666em;
	text-align: center;
	margin-top: 5em;
	background: white;
	opacity: 0.666;
	padding: 0.5em;
	border-radius: 0.5em;
	width: 20%;
	min-width: 250px;	
}

.border_box {
	background-color: #FFFEF6;
	background: #FFFEF6 -moz-linear-gradient(#FFFEF9, #FFFEF3);
	background: #FFFEF6 -webkit-gradient(linear, left top, left bottom, from(#FFFEF9), to(#FFFEF3));
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	border: 1px solid #FEF7C0;
	margin: 0.25em;
}

.border_box H2 {
    padding: 0.15em;
	background-color: #FEF9D6;
	background: #FEF9D6 -moz-linear-gradient(#FFFDEA, #FEF7C0);
	background: #FEF9D6 -webkit-gradient(linear, left top, left bottom, from(#FFFDEA), to(#FEF7C0));
}


/* Elements that should be collapsed when horizontal screen estate shrinks */
.hcollapsible_level1, .hcollapsible_level2 {
}
@media screen and (max-width: 800px) {
	.hcollapsible_level1 {
		display: none;
		visible: false;
	}
}
@media screen and (max-width: 400px) {
	.hcollapsible_level2 {
		display: none;
		visible: false;
	}
}




/* ======  L I N K S  ====== */
.textlink:link, .textlink:visited {
	color: #632F1A;
	border-bottom: 1px dotted; 
	text-decoration: none;
	padding: 0.1em 0.2em;
}

.textlink:hover {
	color: #FBE084;
	background-color: #632F1A;
	background: #632F1A -moz-linear-gradient(#C86135, #632F1A);
	background: #632F1A -webkit-gradient(linear, left top, left bottom, from(#A7512C), to(#632F1A));
	border-radius: 0.25em;
	-moz-border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
	border-bottom: none; 
	text-decoration: none;
}


/* ====== BUTTON LISTS ====== */
.button, UL.buttons LI {
	padding: 0px;
	margin: 4px;
	vertical-align: middle;
	max-width: 24em;
	min-width: 10em;
}
.notiz .button {
	min-width: 4em;
}
@media screen and (max-width: 800px) {
	#content_menu .button, #content_menu UL.buttons LI {
		max-width: 75%;
		min-width: 8em;
	}
}
@media screen and (max-width: 400px) {
	UL.buttons LI, #content_menu UL.buttons LI {
		max-width: 90%;
		min-width: 50%;
	}
}

UL.buttons LI {
	list-style-type: none;
	text-align: left;
}

.button IMG, UL.buttons LI IMG {
	max-height: 32px;
}

/* Selected, not clickable */
.button B, UL.buttons LI B {
	color: #B45C05;
	padding: 0.333em 1em;
	font-weight: bold;
	display: block;
	text-decoration: none;
	background-color: #F9922B;
	background: #F9922B -moz-linear-gradient(#FCC792, #F9922B);
	background: #F9922B -webkit-gradient(linear, left top, left bottom, from(#FCC792), to(#F9922B));
	border: 1px solid #FCC792;
	border-radius: 0.25em;
	-moz-border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
}

INPUT.button, BUTTON,
.button A:link, .button A:visited,
UL.buttons LI A:link, UL.buttons LI A:visited {
	color: #C25900;
	padding: 0.333em 1em;
	font-weight: bold;
	display: block;
	text-decoration: none;
	background-color: #FDD9B5;
	background: #FDD9B5 -moz-linear-gradient(#FDD9B5, #FEEAD6);
	background: #FDD9B5 -webkit-gradient(linear, left top, left bottom, from(#FDD9B5), to(#FEEAD6));
	border-top: 1px solid #FEEAD6;
	border-left: 1px solid #FEEAD6;
	border-right: 1px solid #FDD9B5;
	border-bottom: 1px solid #FDD9B5;
	border-radius: 0.25em;
	-moz-border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
}

/* Reset font weight */
INPUT.button, BUTTON {
	font-weight: normal;
}

.button A:hover, .button A:focus, 
UL.buttons LI A:hover, UL.buttons LI A:focus {
	background-color: #F9922B;
	background: #F9922B -moz-linear-gradient(#FCC792, #F9922B);
	background: #F9922B -webkit-gradient(linear, left top, left bottom, from(#FCC792), to(#F9922B));
}

.inactive_button {
	color: #757575 ! important;
	font-weight: bold;
	display: block;
	padding: 0.2em 0.5em;
	background-color: #D1D1D1 ! important;
	background: #D1D1D1 -moz-linear-gradient(#E6E6E6, #C3C3C3) ! important;
	background: #D1D1D1 -webkit-gradient(linear, left top, left bottom, from(#E6E6E6), to(#C3C3C3)) ! important;
	border-radius: 0.25em;
	-moz-border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
}

.selected_button A {
	color: #763D03 ! important;
	background-color: #F98715 ! important;
	background: #F98715 -moz-linear-gradient(#FCBC7C, #F27C06) ! important;
	background: #F98715 -webkit-gradient(linear, left top, left bottom, from(#FCBC7C), to(#F27C06)) ! important;
	border-top: 1px solid #FCBC7C ! important;
	border-left: 1px solid #FCBC7C ! important;
	border-right: 1px solid #F27C06 ! important;
	border-bottom: 1px solid #F27C06 ! important;
}
.selected_button A:hover, .selected_button A:focus {
	color: #FDDCBB ! important;
	background-color: #C96705 ! important;
	background: #C96705 -moz-linear-gradient(#FBA753, #C96705) ! important;
	background: #C96705 -webkit-gradient(linear, left top, left bottom, from(#FBA753), to(#C96705)) ! important;
	border: 1px solid #FCC792 ! important;
}

.action_button A {
	color: #993333 ! important;
	background-color: #FFA4A4 ! important;
	background: #FFA4A4 -moz-linear-gradient(#FFCECE, #F89C8F) ! important;
	background: #FFA4A4 -webkit-gradient(linear, left top, left bottom, from(#FFCECE), to(#F89C8F)) ! important;
	border-top: 1px solid #FFCECE ! important;
	border-left: 1px solid #FFCECE ! important;
	border-right: 1px solid #F89C8F ! important;
	border-bottom: 1px solid #F89C8F ! important;
}
.action_button A:hover, .action_button A:focus {
	background-color: #FF7979 ! important;
	background: #FF7979 -moz-linear-gradient(#FFA4A4, #F45353) ! important;
	background: #FF7979 -webkit-gradient(linear, left top, left bottom, from(#FFA4A4), to(#F45353)) ! important;
	border: 1px solid #FFCECE ! important;
}

UL.buttons LI.outdated {
	opacity: 0.666;
}

UL.buttons LI.outdated A:link {
	color: #FFA65E;
}

UL.buttons LI.outdated:hover,
UL.buttons LI.outdated:focus,
UL.buttons LI.outdated A:hover,
UL.buttons LI.outdated A:focus {
	opacity: 0.85;
	color: #C25900;
}


.inline_buttons .button {
	display: inline-block;
	margin: 1px;
}

.inline_buttons .button B,
.inline_buttons .button A {
	padding: 0.2em 0.75em;
}

@media screen and (max-width: 800px) {
	.inline_buttons .button B,
	.inline_buttons .button A {
		padding: 0.1em 0.375em;
	}
}


/**
 * Grouping of buttons without spacing and round borders in the middle
 */
.buttongroup {
	display: inline-block;
	border-top: 1px solid #FEEAD6;
	border-left: 1px solid #FEEAD6;
	border-right: 1px solid #FDD9B5;
	border-bottom: 1px solid #FDD9B5;
	border-radius: 0.25em;
	-moz-border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
}

.buttongroup > .button,
.buttongroup > .button a,
.buttongroup > .button b {
	border-top: 0px ! important;
	border-bottom: 0px ! important;
	border-left: 0px ! important;
	margin: 0px ! important;
}

.buttongroup > .button:first-child:not(:last-child),
.buttongroup > .button:first-child:not(:last-child) a,
.buttongroup > .button:first-child:not(:last-child) b {
	border-bottom-right-radius: 0;
	border-top-right-radius: 0;
}


.buttongroup > .button:not(:first-child):not(:last-child),
.buttongroup > .button:not(:first-child):not(:last-child) a,
.buttongroup > .button:not(:first-child):not(:last-child) b {
	border-radius: 0;
	border-radius: 0;
}

.buttongroup > .button:last-child:not(:first-child),
.buttongroup > .button:last-child:not(:first-child) a,
.buttongroup > .button:last-child:not(:first-child) b {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}


/* Zusätzliches für den Header */

.header1 {
	color: #ff6820;
}

.header2 {
	color: #666666;
}

.header3 {
	color: #ffad5b;
}


/* Zusätzliches für den Footer */

.fussnote {
	padding-top: 10px;
	font-size: x-small;
	text-align: center;
}

.versions_info {
	color: #CCCCCC;
}

.versions_info A {
	color: #CCCCCC;
}


/* ============= Messages and Errors =========== */
.info_rahmen {
	margin: 15px;
	width: 75%;
	font-size: 0.9em;
	text-align: center;
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;	
}
@media screen and (max-width: 800px) {
	.info_rahmen {
		width: 95%;
	}
}

.message_rahmen {
	margin: 15px;
	width: 75%;
	font-size: 0.9em;
	text-align: center;
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;	
}
@media screen and (max-width: 800px) {
	.message_rahmen {
		width: 95%;
	}
}

.message, .error, .info {
	padding: 0.75em 0.25em;
	margin-bottom: 0.25em;
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;	
}


.message {
	background-color: #FFDD99;
	background: #FFDD99 -moz-linear-gradient(#FFF2D9, #FFDD99);
	background: #FFDD99 -webkit-gradient(linear, left top, left bottom, from(#FFF2D9), to(#FFDD99));
}


.error {
	background-color: #FF9999;
	background: #FF9999 -moz-linear-gradient(#FFD9D9, #FF9999);
	background: #FF9999 -webkit-gradient(linear, left top, left bottom, from(#FFD9D9), to(#FF9999));
}

.info {
	background-color: #93FF6F;
	background: #93FF6F -moz-linear-gradient(#E2FFD9, #4EFF1A);
	background: #93FF6F -webkit-gradient(linear, left top, left bottom, from(#E2FFD9), to(#4EFF1A));
}

.error_frame, .error_rahmen {
	margin: 1em;
	width: 75%;
	text-align: center;
	color: #FFFFFF;
	background-color: #FF9999;
	background: #FF9999 -moz-linear-gradient(#FFD9D9, #FF9999);
	background: #FF9999 -webkit-gradient(linear, left top, left bottom, from(#FFD9D9), to(#FF9999));
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;	
}
@media screen and (max-width: 800px) {
	.error_rahmen {
		width: 90%;
	}
}

.error_frame H1, .error_rahmen H1 {
	padding: 0.333em;
	font-size: 1.85em;
	background-color: #FF6F6F;
	border-bottom: 1px solid #FF4444;
	border-radius: 0.5em 0.5em 0em 0em;
	-moz-border-radius: 0.5em 0.5em 0em 0em;
	-webkit-border-radius: 0.5em 0.5em 0em 0em;
}

.error_message {
	text-align: left;
	margin: 0.5em 1em;
	padding: 0.5em 1em;
	font-size: 1.25em;
}

.error_message .key {
	font-weight: bold;
	font-style: italic;
}

.error_footer {
	margin-top: 1em;
	padding: 0.5em;
	font-family: monospace;
	font-weight: bold;
	background-color: #FF6F6F;
	border-top: 1px solid #FF4444;
	border-radius: 0em 0em 0.5em 0.5em;
	-moz-border-radius: 0em 0em 0.5em 0.5em;
	-webkit-border-radius: 0em 0em 0.5em 0.5em;	
}

/* ================= TABS ================= */

UL.tabs {
	display: block;
	font-size: 1.75em;
	margin: 3px;
}
UL.tabs LI {
	list-style-type: none;
	display: inline;
	margin: 0px 2px;
	border-radius: 0.333em 0.333em 0em 0em;
	-moz-border-radius: 0.333em 0.333em 0em 0em;
	-webkit-border-radius: 0.333em 0.333em 0em 0em;
}
UL.tabs LI.selected {
	color: #C25900;
	padding: 0.1em 0.4em;
	font-weight: bold;
	background-color: #FDD9B5;
	background: #FDD9B5 -moz-linear-gradient(#FDD9B5, #FEEAD6);
	background: #FDD9B5 -webkit-gradient(linear, left top, left bottom, from(#FDD9B5), to(#FEEAD6));
}
UL.tabs LI A {
	color: #FFC291;
	padding: 0.1em 0.4em;
	font-weight: bold;
	text-decoration: none;
	background-color: #FEEAD6;
	background: #FEEAD6 -moz-linear-gradient(#FFF4EA, #FEEAD6);
	background: #FEEAD6 -webkit-gradient(linear, left top, left bottom, from(#FFF4EA), to(#FEEAD6));
	border-radius: 0.333em 0.333em 0em 0em;
	-moz-border-radius: 0.333em 0.333em 0em 0em;
	-webkit-border-radius: 0.333em 0.333em 0em 0em;
}
UL.tabs LI A:hover, UL.tabs LI A:focus {
	color: #C25900;
	background-color: #F9922B;
	background: #F9922B -moz-linear-gradient(#FCC792, #F9922B);
	background: #F9922B -webkit-gradient(linear, left top, left bottom, from(#FCC792), to(#F9922B));
}

.tab_content {
	padding: 1em;
	border: 4px solid #FEEAD6;
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
}


/* ================= TABELLEN  ================= */

THEAD TH, TBODY TH {
	font-weight: bold;
	background-color: #FDEE82;
	background: #FDEE82 -moz-linear-gradient(#FEF8CB, #FDEE82);
	background: #FDEE82 -webkit-gradient(linear, left top, left bottom, from(#FEF8CB), to(#FDEE82));
	padding: 0.3em 0.4em; 
	border-bottom: 1px solid #E8DE97;
	text-shadow: 0 -1px 1px #BBBBBB, 0 1px 1px #FFFFFF;
}

THEAD TH.first {
	border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-webkit-border-top-left-radius: 5px;
}

THEAD TH.last {
	border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	-webkit-border-top-right-radius: 5px;
}

TBODY TH {
	font-size: 0.9em;
}

TFOOT TH {
	font-weight: bold;
	background-color: #FDEE82;
	background: #FDEE82 -moz-linear-gradient(#FDEE82, #FEF5B6);
	background: #FDEE82 -webkit-gradient(linear, left top, left bottom, from(#FDEE82), to(#FEF5B6));
	padding: 2px;
	height: 0.5em;
	border-top: 1px solid #E8DE97;
}

TFOOT TH.first {
	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
}

TFOOT TH.last {
	border-bottom-right-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
}

TR.evenrow TD {
	background: #FFFFD2;
	padding: 3px 1px;
	border-bottom: 1px solid #F7F7DB;
}

TR.oddrow TD {
	background: #FFFFEE;
	padding: 3px 1px;
	border-bottom: 1px solid #F7F7DB;
}


/* ================= Editor / Formular ================= */

/* Der Editor an sich */
.editor {
	margin: 0em 2em 2em;
}

/* Die Überschrift des Use Cases */
.ueberschrift {
	padding: 0.1em 0.5em ! important;

	color: #6F1600;
	background-color: #FF977D;
	background: #FF977D -moz-linear-gradient(#FFEEEA, #FF643E);
	background: #FF977D -webkit-gradient(linear, left top, left bottom, from(#FFEEEA), to(#FF643E));
	border-radius: 0.125em 0.125em 0em 0em;
	-moz-border-radius: 0.125em 0.125em 0em 0em;
	-webkit-border-radius: 0.125em 0.125em 0em 0em;
	border-bottom: 2px solid #6F1600;
	
	font-family: LeagueGothic, Impact, "Arial Black", sans-serif;
	font-size: 2.3em;
	text-transform: uppercase;
	text-shadow: 0 -1px 1px #999999, 0 1px 1px #FFFFFF;
	letter-spacing: 0.2em;
	word-spacing: 0.3em;
}

/* Jede Zelle der Formular-Tabelle */
.editor TD {
	padding: 4px 2px;
}

INPUT, BUTTON {
	font-size: 1em;
	padding: 0.1em;
	border-radius: 0.333em;
	-moz-border-radius: 0.333em;
	-webkit-border-radius: 0.333em;
}

INPUT {
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #EFEFEF;
	border-bottom: 1px solid #EFEFEF;
	border-left: 1px solid #CCCCCC;
	padding: 0.25em;
}

INPUT:focus {
	border: 1px solid #444444;
}

BUTTON, INPUT[type="submit"] {
	padding: 0.1em 0.25em ! important;
	background-color: #FDD9B5;
	background: #FDD9B5 -moz-linear-gradient(#FDD9B5, #FEEAD6);
	background: #FDD9B5 -webkit-gradient(linear, left top, left bottom, from(#FDD9B5), to(#FEEAD6));
	border-top: 2px solid #FEEAD6;
	border-left: 2px solid #FEEAD6;
	border-right: 2px solid #FDD9B5;
	border-bottom: 2px solid #FDD9B5;
}

BUTTON:focus, BUTTON:hover, 
INPUT[type="submit"]:focus, INPUT[type="submit"]:hover {
	background-color: #F9922B;
	background: #F9922B -moz-linear-gradient(#FCC792, #F9922B);
	background: #F9922B -webkit-gradient(linear, left top, left bottom, from(#FCC792), to(#F9922B));
}

/* Pflicht-Eingabefelder */
.mussfeld {
	background-color: #FFFF9D;
	background: #FFFF9D -moz-linear-gradient(#FFFFDD, #FFFF88);
	background: #FFFF9D -webkit-gradient(linear, left top, left bottom, from(#FFFFDD), to(#FFFF88));
}

INPUT .mussfeld {
	border: solid 1px; 
}

/* Notiz/Anmerkung/Hinweis */
.notiz {
	font-size: smaller;
	font-weight: normal;
	color: Gray;
	line-height: 1.75em;
}
TD.notiz {
	padding: 0em 0em 0.25em ! important;
}

.diskret, .diskret * {
	opacity: 0.75;
}
.diskret:hover, .diskret:hover *,
.diskret:focus, .diskret:focus * {
	opacity: 1;
}

PRE {
	text-align: left;
	display: block;
}

CODE {
	display: block;
	margin-left: 5%;
	width: 90%;
	padding: 0.5em;
	text-align: left;
	border: 2px dashed #999999;
	background-color: #FFFFD5;
	background: #FFFFD5 -moz-linear-gradient(#FFFFF4, #FFFFBF);
	background: #FFFFD5 -webkit-gradient(linear, left top, left bottom, from(#FFFFF4), to(#FFFFBF));
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}


/* ================= NAVIGATION / STEUERUNG ================= */

.navigations_zeile {
	width: 100%;
	margin-top: 0px;
	border-top: 1px dashed;
	text-align: center;
}

.navigations_element {
	text-decoration: none;
}

.navigations_element A {
	text-decoration: none;
}

@media screen and (max-width: 800px) {
	.navigations_element {
		font-size: 1.1em;
	}
}


/* ================= NEWS ================= */

#news_container {
	width: 55%;
	max-width: 800px;
	margin-bottom: 2em;
	float: left;
	background: white;
	box-shadow: 0px 0px 5px #666;
	opacity: 0.95;
	padding: 0.5em;
	border-radius: 0.5em;
}
#news_container:hover, #news_container:focus {
	opacity: 1;
}
@media screen and (max-width: 800px) {
	#news_container {
		float: none;
		width: 95%;
	}
}
@media (-moz-touch-enabled: 1), (pointer:coarse) {
	#news_container {
		opacity: 0.95;
	}
}

.news_entry {
	margin-bottom: 1.5em;
}

.news_entry .title {
	font-size: 1.3em;
	font-weight: bold;
	border-bottom: 1px dotted #E4D69C;
	text-align: left;
	font-family: GoudyBookletter1911, Georgia, serif;
}

.news_entry .title .date {
	color: #B0A060;
	display: inline;
	font-weight: bold;
}

.news_entry .title .note {
    color: #F5AF2C;
    font-family: LeagueGothic,Impact,"Arial Black",sans-serif;
    font-weight: normal;
    font-size: 0.75em;
}

.news_entry .content {
	font-size: 0.75em;
	margin-top: 1em;
}

.counterBadge {
	color: #FFFFFF;
	background: #333333;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	display: inline-block;
	font: 0.75em monospace;
	font-weight: 700;
	line-height: 1;
	min-width: 10px;
	padding: 3px 7px;
	text-align: center;
	vertical-align: middle;
	white-space: nowrap;
}

.button .counterBadge {
	color: #FDD9B5;
	background-color: #C96705;
}

@media print {
	.unprintable {
		display: none ! important;
		opacity: .0 ! important;
	}
}