
/* Standard */

BODY {
	margin: 0px;
	font-family: Arial;
}

/* Styles für BODY werden über ID und nicht über TAG definiert */

#body {
	font-family: sans-serif;
	font-size: 1em;
	margin: 0px;
	padding: 0px;
}

#body img { border: 0px; display: block; }
#body input.hasDatepicker + img { display: inline; }

#body .File a:hover { padding: 0px; }

#no_layout .TraminoVorlage { margin:0px; }

/* Vorgaben für alle Stylesheets für Websites und Rahmen */

/* Vorgaben für Blöcke */



.TraminoVorlage {
	margin: 20px 0px 0px 0px;
}

/* Vorgaben für Bilder */

#TraminoArtikel .File img {
	border: 0px;
}

#TraminoArtikel .File a {
	border: 0px;
}

/* Darstellung für Datentyp PDF */

.TraminoFile {
	background-color: #eee;
	padding: 15px;
	font-size: 0.8em;
	color: #666;
	margin-bottom: 20px;
}

.TraminoFile h5 { margin: 3px 0px;  color: #999 !important; }
.TraminoFile h3 { margin: 5px 0px;  color: #000 !important; font-size: 14px !important;}
.TraminoFile p { margin: 3px 0px;  color: #333 !important; }
.TraminoFile .download { margin-top: 7px; text-align: right; }
.TraminoFile .download a { color: #339 !important; }


/* Vorgaben für Artikel */

#TraminoArtikel .Files {
	float: right;
	width: 300px;
	margin-left: 15px;
}

#TraminoArtikel .Headlines h5 {
	font-size: 0.9em;
	text-transform: uppercase;
}





/* Vorgaben für Elemente innerhalb von Textile Feldern */

.TraminoTextile b {
	font-size: 1.2em;
	line-height: 1em;
}

.TraminoTextile i {
	font-size: 1.2em;
	line-height: 1em;
}

.TraminoTextile ins {
	background-color: #eee;
	font-style: normal;
	text-decoration: none;
	line-height: 1em;
	border-bottom: 2px solid #bbb;
	padding: 0.1em 0.3em 0em 0.3em;	
}

.TraminoTextile cite {
	background-color: #eee;
	font-style: oblique;
	text-decoration: none;
	font-family: serif;
	line-height: 1em;
	border-left: 4px solid #bbb;
	padding: 0.1em 0.3em 0.1em 0.3em;
}

.TraminoTextile code {
	display: block;
	white-space: pre;
	background-color: #ddd;
	color: #333;
	margin: 0px;
	padding: 0.1em 0.3em 1.1em 0.3em;
}
	
	.TraminoTextile p code {
		display: inline;
		white-space: normal;
		padding: 0.1em 0.3em 0.1em 0.3em;
	}

.TraminoTextile blockquote {
	font-style: oblique;
	text-decoration: none;
	font-family: serif;
	font-weight: 100;
	font-size: 1.1em;
	padding: 0.2em 1em;
}

.TraminoTextile ul li {
	line-height: 1.3em;
}


.TraminoTextile table {
	table-layout: auto;
	border-collapse: collapse;
	border: 1px solid #999;
}

	.TraminoTextile table th {
		padding: 0.5em 0.3em 0.2em 0.4em;
		border: 1px solid #999;
		text-align: left;
		font-size: 0.9em;
		vertical-align: bottom;
	}


	.TraminoTextile table td {
		padding: 0.2em 0.3em 0.2em 0.4em;
		border: 1px solid #999;
		vertical-align: top;
	}



/* Allgemeine Klassen */

.break {
	clear: both;
}

.clear {
	clear: left;
}

.left {
	float: left;
}

.right {
	float: right;
}


.bold {
	font-weight: bold;
}


@media print {
	.noprint {
		display: none;
	}
}

.nodisplay {
	display: none;
}

span.textmarker {
	background-color: #ff0;
	padding: 0.1em 0.5em 0.1em 0.5em;
}

span.invers {
	background-color: #000;
	color: #fff;
	padding: 0.1em 0.5em 0.1em 0.5em;
}

.code {
	font-family: "Monaco", monospace !important;
	font-size: 12px;
	color: #000;
}

.adresse .nummer { margin-top: 0.3em; }
.adresse .email { margin-top: 0.3em; }


/* Öffnungszeiten Widget */
.oeffnungszeiten .tage { 
	display: inline-block;
	width: 7em;
	float: left;
}

/* ---------- Notizen in Bildern ------------- */

.TraminoStorageMap {
	position: relative;

		-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none
}

.TraminoStorageMap div.MapItem {
	position: absolute;
	border: 1px dotted #fff !important;
	margin: -1px;
	color: #fff; 
	font-size: 11px;
	background-image: url(/tramino/gfx/alpha100.png);

	box-shadow: 2px 2px 3px 3px rgba(0,0,0,0.1);
	
}


.TraminoStorageMap div.MapItem > span { display: block; }

.TraminoStorageMap .MapItem:hover {
	border: 2px solid #fff;
}

.TraminoStorageMap .MapItemInfo {
	padding: 2px 10px 3px 7px;
	display: block;
	font-size: 11px;
	line-height: 14px;
	font-family: Arial;
	color: #fff;
}

.TraminoStorageMap .MapItem:hover .MapItemInfo {
	background-color: #fff;
	color: #000;
	cursor: pointer;
}

.TraminoStorageMap.hover .MapItem {
	display: none;
}

.TraminoStorageMap.hover:hover .MapItem {
	display: block;
}

.Bild .Name { margin-top: 0.3em; }
.Bild a { display: block; margin: 0!important; padding: 0!important; border: 0px !important; }

.Bild.Panorama {
	position: relative;
	width: 100%;
	overflow: hidden;
	height: 500px;
	background-color: #000;
}
.Bild.Panorama img {
	position: absolute;
	left: 0px;
	top: 0px;
	height: 500px;
}


#activeMapItem {
}

#activeMapItemHandle {
	position: absolute;
	bottom: -5px;
	right: -5px;
	background-color: #fff;
	width: 10px;
	height: 10px;
	color: #000;
	cursor: pointer;
}



.TraminoStorageMap a.MapItem.highlight { border: 1px dotted #ff0 !important;  }
.TraminoStorageMap a.MapItem.highlight #activeMapItemHandle { background-color: #ff0; }
.TraminoStorageMap a.MapItem.highlight .MapItemInfo { color: #ff0;  }
.TraminoStorageMap a.MapItem.highlight:hover .MapItemInfo { background-color: #ff0; color: #000; }


/* ---------- Lightroom ------------- */



#lightroom {
	display: block;
	overflow: hidden;
	margin-left: -10px;
}

#TraminoContent #lightroom {
	background-color: #333;
	padding: 10px 25px;	
	margin: 0px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}

#TraminoContent #lightroom .empty {
	color: #ccc;
	text-align: center;
	padding: 40px;
}

#lightroom a {
	text-decoration: none;
	color: #000;
}

#lightroom .Files {
	float: none;
	width: auto;
	margin: 10px 0px 10px 0px;
}

#lightroom .file {
	float: left;
	width: 150px;
	height: 130px;
	padding: 10px;
	overflow: hidden;
	position:relative;
}
#lightroom .info a {
	color: white;
}

#lightroom .file .geoinfo {
	position:absolute;
	bottom:0px;
	left:0px;
}


#lightroom .bild {
	background-color: #000;
	display: block;
	position: relative;
	width: 150px;
	height: 100px;
	overflow: hidden;
	
}

#lightroom .bild img {
	border: 0px;
	position: absolute;
	left: 0px;
	top: 0px;
}

#lightroom .zoom {
	display: none;
	position: absolute;
	top: 5px;
	left: 5px;
	width: 13px;
	height: 13px;
	cursor: pointer;
}

#lightroom .zoom a, #lightroom .download a {
	display:block;
	width: 100%;
	height: 100%;
}

#lightroom .zoom img {
	width: 13px;
	height: 13px;
}

#lightroom .download {
	display: none;
	position: absolute;
	top: 5px;
	left: 22px;
	width: 14px;
	height: 14px;
	cursor: pointer;
}

#lightroom .zoom a {
	display:block;
	width: 100%;
	height: 100%;
}

#lightroom .file:hover {
	background-color: #ddd !important;
}
	
#lightroom .file:hover .bild {
	background-color: #ddd !important;
}

#lightroom .file:hover .info {
	color: #000 !important;
}


#lightroom .file.highlight  {
	background-color: #555;
}

#lightroom .file:hover .zoom, #lightroom .file:hover .download { display: block; }



#lightroom .info {
	display: block;
	padding: 4px 0px 0px 0px;
	font-size: 11px;
	line-height: 12px;
	text-align: center;
}

	#TraminoContent #lightroom .info {
		color: #aaa;	
	}

#lightroom .info input[type=checkbox] {
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 3px 0px 0px;
}


#lightroom .subtitle { font-size: 8px; line-height: 14px; }

	#TraminoContent #lightroom .subtitle { color: #666; }

#lightroom .info span {
	background-color: #999;
	font-size: 14px;
	color: #666;
	cursor: pointer;
	padding: 0px 4px 0px 4px;
	margin: 0px 5px 0px 0px;
}

#lightroom .file:hover .info  {
	color: #333;
}

#lightroom .file:hover .info span {
	background-color: #999;
}


#lightroom .typ {
	position: absolute;
	top: 10px;
	right: 0px;
	font-weight: normal !important;
	font-size: 9px;
	line-height: 12px;
	color: #333;
	text-align: right;
}

#lightroom .typ span {
	background-color: #fff;
	padding: 1px 4px 2px 4px;
}

#TraminoContent #lightroom .input input {
	
	display: block;
	font-size: 9px;
	font-weight: bold;
	width: 142px;
	background-color: #555;
	padding: 3px 4px;
	border: 0px;
	margin: 0px 0px 0px 0px;
	color: #eee;
}

#TraminoContent #lightroom .input textarea {

	display: block;
	height: 35px;
	font-size: 9px;
	background-color: #444;
	padding: 2px 2px;
	width: 146px;
	border: 0px;
	margin: 0px;
	color: #aaa;
}





/* ---------- Blättern ------------- */



.TraminoPaginator {
	margin: 0px;
	line-height: 1.6em;
}


.TraminoPaginator span.anzahl {
	padding-right: 30px;
	font-size: 11px;
}

.TraminoPaginator span a {
	padding: 2px 5px 2px 5px !important;
	text-decoration: none;
	border: 0px !important;
	color: #666;
}

.TraminoPaginator span.button a {
	display:inline-block;
	font-size:13px;
	background-color: #ccc;
	padding: 2px 10px 2px 10px !important;
	margin-right:4px;
}

.TraminoPaginator span.button.active a {
	background-color: #333;
	color:#fff;

}

.TraminoPaginator span a:hover {
	background-color: #000 !important;
	color: #fff !important;
}

.TraminoPaginator span.aktiv a {
	font-size: 1.4em;
	font-weight: bold;
	color: #000;
}

#lightroom .TraminoPaginator {
	color: #666;
}

#lightroom .TraminoPaginator span a {
	color: #666;
}

#lightroom .TraminoPaginator span.aktiv a {
	color: #fff;
}

#lightroom .TraminoPaginator span a:hover {
	background-color: #fff !important;
	color: #000 !important;
}









/* Stichworter Clouds */


.Tagcloud {
	padding: 15px 0px;
	line-height: 17px;
	text-align: center;
	/* margin: 0px 0px 10px 0px; */
	line-height: 18px;
}
	
	.Tagcloud .TagSelected a {
		background-color: #FF6600 !important;
		color: #fff !important;
	}
	
	.Tagcloud span {
		vertical-align: middle;
		padding: 0px 0px 0px 0px;
	}
	
	
	.Tagcloud a {
		padding: 2px 7px 2px 7px !important;
		font-weight: bold;
		text-decoration: none;
		vertical-align: middle;
		border: 0px !important;
	}
	
	.Tagcloud a:hover {
		padding: 2px 7px 2px 7px !important;
		background-color: #666 !important;
		color: #fff !important;
		text-decoration: none;
		border: 0px !important;
	}
	

	.Tagcloud .TagSize1 a { font-size: 12px !important; }
	.Tagcloud .TagSize2 a { font-size: 13px !important; }
	.Tagcloud .TagSize3 a { font-size: 15px !important; }
	.Tagcloud .TagSize4 a { font-size: 17px !important; }
	.Tagcloud .TagSize5 a { font-size: 19px !important; }
	.Tagcloud .TagSize6 a { font-size: 21px !important; }
	
	#TraminoContent .Tagcloud .TagSize1 a { color: #888 !important; }
	#TraminoContent .Tagcloud .TagSize2 a { color: #666 !important; }
	#TraminoContent .Tagcloud .TagSize3 a { color: #444 !important; }
	#TraminoContent .Tagcloud .TagSize4 a { color: #222 !important; }
	#TraminoContent .Tagcloud .TagSize5 a { color: #111 !important; }
	#TraminoContent .Tagcloud .TagSize6 a { color: #000 !important; }
	#TraminoContent .Tagcloud a:hover { color: #fff !important; }
	
	#TraminoContent #lightroom .Tagcloud .TagSize1 a { color: #888 !important; }
	#TraminoContent #lightroom .Tagcloud .TagSize2 a { color: #aaa !important; }
	#TraminoContent #lightroom .Tagcloud .TagSize3 a { color: #ccc !important; }
	#TraminoContent #lightroom .Tagcloud .TagSize4 a { color: #ddd !important; }
	#TraminoContent #lightroom .Tagcloud .TagSize5 a { color: #eee !important; }
	#TraminoContent #lightroom .Tagcloud .TagSize6 a { color: #fff !important; }

	#TraminoContent #lightroom .Tagcloud a:hover { color: #000 !important; background: #fff !important; }
	#TraminoContent #lightroom .Tagcloud .TagSelected a { color: #000 !important; }
	
	body #TraminoContent .Tagcloud a { color: #999; }
	body #TraminoContent .Tagcloud .TagSelected a { color: #fff !important; }
	body #TraminoContent #lightroom .Tagcloud a { color: #999; }
	body #TraminoContent #lightroom .Tagcloud .TagSelected a { color: #fff !important; }
	


/* Kommentare */

#TraminoComment {
	margin-top: 30px;
	position: relative;
}

#TraminoContent #TraminoComment {
	margin-top: 0px;
}

#TraminoComment .error {
	display: inline;
	font-size: 1.1em;
	line-height: 1.5em;
	color: #f00;
	background-color: #fcc;
	padding: 0.1em 0.3em;
}

#TraminoComment .login {
	font-size: 0.9em;
	margin-bottom: 0.8em;
}

#TraminoComment .login span {
	font-size: 0.7em;
}

#TraminoComment .head  {
	margin: 1em 0em 0.5em 0em;
}

#TraminoComment .comment .Bild {
	float:left;
	margin: 2px 15px 15px 0px;
}

#TraminoComment .Bild.userbild {
	float: none;
	position: absolute;
	left : 0px;
}

#TraminoComment .comment .Bild a {
	border: 0px;
	display: block;
	padding: 0px;
	margin: 0px;
}

#TraminoComment .comment .Bild img {
	display: block;
	border: 0px;
}

#TraminoComment .comment .content .File .Name {
	margin-top: 0.3em;
	font-size: 0.8em;
	width: 150px;
}


#TraminoComment .head  {
	margin-bottom: 0.5em;
	margin-left:65px;
}

#TraminoComment .head .subject {
	font-weight: bold;
}

#TraminoComment .head .name {
	font-weight: bold;
}

#TraminoComment .head .name sup {
	font-weight: 200;
	font-size: 0.7em;
}

#TraminoComment .head .date {
	font-size: 0.7em;
	padding-left: 0.5em;
}

#TraminoComment .head .who_likes {
	margin-left: 2em;
	font-size: 0.9em;
}

#TraminoComment .head .like_action {
	margin-left: 2em;
	font-size: 0.7em;
}



#TraminoComment .comment {
	margin-top: 2em;
}

#TraminoContent #TraminoComment .comment {
	margin-top: 0em;
	clear: left;
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 10px;
	margin-bottom: 10px;
}


#TraminoComment .comment .content {
	padding-left: 20px;
	padding-right: 150px;
	margin-top: 10px;
	font-size: 0.9em;
	line-height: 130%;
	margin-left: 45px;
}

#TraminoComment .comment .content.with_image .text {
	margin-top: 20px;
	padding-right: 200px;
}

#TraminoComment .comment .comment .content {
	padding-right: 20px;
}




#TraminoComment .comment .content .text {
}

#TraminoComment .comment .content .reply {
	margin-top: 5px;
	text-align: right;
	font-style: normal;
	font-size: 1em;
}

#TraminoComment .comment .content .reply a {
	font-size: 0.7em;
}



#TraminoCommentForm {
	margin-right: 0px;
	text-align: left;
	margin-bottom: 40px;

}
#TraminoCommentForm .feld {
	float: left;
	margin-bottom: 0.5em;
	margin-right: 1em;
}

#TraminoCommentForm .feld .label {
	font-size: 0.8em;
	margin-top: 0.5em;
	margin-bottom: 0.1em;
}

#TraminoCommentForm .feld .input input {
	font-size: 0.8em;
	font-weight: bold;
}

#TraminoCommentForm .feld .input textarea {
	font-size: 0.8em;
	width: 48em;
	font-weight: bold;
}

#TraminoCommentForm .feld .input input {
	font-size: 0.8em;
	font-weight: bold;
}

#TraminoCommentForm .feld .help {
	font-size: 0.7em;
}

#TraminoContent #TraminoCommentForm .feld .input textarea {

	width: 100%;
}



#TraminoLogin {
	position: relative;
	width: 530px;
	background-color: #fff;
	font-family: Helvetica, Arial, sans-serif;
	margin: 0px;
	color: #333;
	padding-bottom: 15px;
}

#TraminoLogin.mobile {
	width:250px;
}
#TraminoLogin.box {
	border:1px solid #aaa;
}


#TraminoLogin .feld {
	margin-bottom: 4px;
}

#TraminoLogin .left H3, #TraminoLogin .right H3, #TraminoLogin H3 {
	margin: 0px;
	padding: 35px 0px 25px 25px;
	font-size: 30px;
	font-weight: 100;
	color: #333;
}

#TraminoLogin .left H3, #TraminoLogin .maxi H3 {
	padding: 35px 0px 25px 100px;
	background-image: url(/tramino/gfx/logo.png);
	background-repeat: no-repeat;
	background-position: 20px 15px;
}

#TraminoLogin .left .ssl_label {
	color:#0a0;
}
#TraminoLogin .left {
	width: 250px;
	min-height: 300px;
}
#TraminoLogin .left.wide {
	width: 500px;
}
#TraminoLogin .left ul {
	padding-left: 1em;
}

#TraminoLogin .right {
	background-color: #ccc;	
	width: 280px;
	height:300px;
}

#TraminoLogin .listeData .left {
	width: auto;
	height:auto;
}

#TraminoLogin .listeData .right {
	background-color: transparent;	
	width: auto;
	height:auto;
}
#TraminoLogin.box .left, #TraminoLogin.box .right {
	height:175px;
}

#timegrid_monat {
	position: relative;
	font-size: 10px;
	line-height: 10px;
}

#timegrid_monat span {
	display: inline-block;
	width: 20px;
	height: 10px;
	font-size: 10px;
	line-height: 10px;
	color: #aaa;
	text-align: center;
	padding: 5px 0px 5px 0px;
	margin: 0px;
}


#timegrid_monat span , x:-moz-any-link { display:-moz-inline-box; }
#timegrid_monat span , x:-moz-any-link, x:default {display:inline-block; }

#timegrid_monat .monat {
	border: 1px solid #999;
	margin-top:-1px;
	background: url(/tramino/gfx/timegrid.png);
}

#timegrid_monat span.info {
	width: 72px; 
	background-color: #fff; 
	border-right: 1px solid #999;
	text-align: left;
	padding-left: 7px;
}

#timegrid_monat span.info b {
	font-size:12px;
}
#timegrid_monat span.selected {
	background:#292;
	color:#6c6;
}

#timegrid_monat span.tgf {
	background: #060;
	color:#292;
}

#timegrid_monat span.saison{
	background: #999;
	color: #eee;
	border-right: 1px solid #ddd;
	white-space: nowrap;
}

#timegrid_monat span.saison.color_1 { background: #988; }
#timegrid_monat span.saison.color_2 { background: #889; }
#timegrid_monat span.saison.color_3 { background: #898; }
#timegrid_monat span.saison.color_4 { background: #989; }
#timegrid_monat span.saison.color_5 { background: #899; }
#timegrid_monat span.saison.color_6 { background: #998; }


#timegrid_monat span.markable{	cursor:pointer;}







/* TimeGrid */

#timegrid {
	position: relative;
	background: url(/tramino/gfx/timegrid.png);
	border-bottom: 1px solid #999;
	border-left: 1px solid #999;
	font-size: 10px;
	line-height: 10px;
	overflow: hidden;
}

#timegrid span {
	display: inline-block;
	width: 20px;
	height: 10px;
	font-size: 10px;
	line-height: 10px;
	color: #666;
	text-align: center;
	padding: 5px 0px 5px 0px;
	margin: 0px;
}

#timegrid span , x:-moz-any-link { display:-moz-inline-box; }
#timegrid span , x:-moz-any-link, x:default {display:inline-block; }

#timegrid_menu {
	z-index: 10000;
	background-color: #000;
	border-radius: 5px;
	padding: 10px 0px 10px 10px;
	color: #fff;
	position: absolute;
	left: 0px;
	top: 0px;
	width: 140px;
	height: 85px;
	
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}
#timegrid_menu .close { position: absolute; right: 10px; top: 5px; color: #fff; font-size: 15px; cursor: pointer; }
#timegrid_menu .button {
	cursor: pointer;
	float: left;
	border-radius: 4px;
	padding: 4px 10px;
	font-size: 13px;
	color: #bbb;
	border: 1px solid #999;
	margin: 0px 5px 5px 0px;
}

#timegrid_menu .button:hover {
	color: #fff;
	border: 1px solid #fff;
}


#timegrid .monate {
	border-top: 1px solid #999;
	background:#fff;
}


/* Firefox 2 fix */
#timegrid .monate , x:-moz-any-link { padding-left: 10px; }
#timegrid .monate , x:-moz-any-link, x:default { padding-left: 0px; }

#timegrid .monate span {
	background-color: #fff;
	border-right: 1px solid #999;
	text-align: left;
	overflow: hidden;
	white-space: nowrap;
	padding: 2px 0px 2px 7px;
	height: 10px;
}

/* Firefox 2 fix */
#timegrid .monate span , x:-moz-any-link { height: 16px; }
#timegrid .monate span , x:-moz-any-link, x:default { height: 10px; }


#timegrid .woche { 
	position: fixed;
	left: 26px;
	top: 223px;
	right: 26px;
	height: 20px;
	overflow: hidden;
	z-index: 10000;
	background-color: #fff;
}
#timegrid .woche .weeknumber {
	display: inline-block;
	box-sizing: border-box;
	max-width: 140px;
	height: 20px;
	overflow: hidden;
	border-top: 1px solid #999;
	border-right: 1px solid #999;
}

#timegrid .woche .weeknumber.heute { background-color: #669 !important; }
#timegrid .woche .weeknumber.heute > span { color: #fff; }
#timegrid .woche .weeknumber:nth-child(odd) { background-color: #FFFFFF; }
#timegrid .woche .weeknumber:nth-child(even) { background-color: #F7F7F7; }

#timegrid .tage {
	border-top: 1px solid #999;
}

#timegrid .monate.timeline, #timegrid .tage.timeline {
	border-top: 1px solid #bbb;
}

#timegrid .tage.timeline {
	border-bottom: 1px solid #bbb;
}


/* Firefox 2 fix */
#timegrid .tage , x:-moz-any-link { padding-left: 10px; }
#timegrid .tage , x:-moz-any-link, x:default { padding-left: 0px; }

#timegrid .tage span {
	padding: 3px 0px 2px 0px;
	height: 10px;
	overflow:hidden;
	white-space:nowrap;
}

/* Firefox 2 fix */
#timegrid .tage span , x:-moz-any-link { height: 16px; }
#timegrid .tage span , x:-moz-any-link, x:default { height: 10px; }


#timegrid .tage span.heute {
	background-color: #669;
	color: #fff;
}



#timegrid .belegung span.marker {
	background-color: #ff0;
	background: url(/tramino/gfx/timegrid_marker.png) -10px 0px;
	color: #fff;
	overflow:hidden;
	white-space:nowrap;
}

#timegrid .belegung span.marker2 {
	background-color: #ff0;
	background: url(/tramino/gfx/timegrid_marker2.png) -10px 0px;
	color: #fff;
	overflow:hidden;
	white-space:nowrap;
}


	#timegrid div.belegung {
		border-top: 1px solid #999;
		line-height: 0px;
	}

	#timegrid .belegung.disabled .info {
		color: #aaa;
	}

	#timegrid .belegung.disabled span.frei { background-color: #999; background-image: none; color: #999; }
	#timegrid .belegung.disabled.nolabel span.frei { background-color: #999; background-image: none; color: #999; }

	#timegrid .belegung.kompakt {
		height: 6px;
		line-height: 0px;
	}

	#timegrid .belegung.kompakt span {
		padding: 0px;
		height: 6px;
		line-height: 0px;
	}

	#timegrid .belegung span.frei {
		background-color: #292;
		background: url(/tramino/gfx/timegrid_frei.png);
		color: #fff;
	}
	
	#tpc #timegrid .belegung span.belegt {
		background: url(/tramino/gfx/timegrid-x.png);
	}
	
	#timegrid .belegung.kompakt span.frei {
		background: url(/tramino/gfx/timegrid_frei.png) -10px 0px;
	}
	
	#timegrid .yellow span.frei {
		background: none !important;
		background-color: #993 !important;
		color: #EE9 !important;
	}

	#timegrid .belegung.nolabel span.frei {
		color: #292;
	}

	#timegrid .belegung span.tgs {
		background: #111;
		color: #fff;
	}
	
	#timegrid .belegung.nolabel span.tgs {
		color: #111;
	}

	#timegrid .belegung span.tgf {
		background: #060;
		color: #fff;
	}
	
	#timegrid .belegung.nolabel span.tgf {
		color: #060;
	}
	
	#timegrid .belegung span.kontigent {
		cursor:pointer;
	}

	#timegrid div.aufenthalt {
		border-top:1px solid #ddd;
		padding:0;
		margin:0;
		height:11px;
	}

	#timegrid .aufenthalt span {
		height: 11px;
		font-size: 9px;
		line-height: 11px;
		padding:0;
		margin:0;
		cursor:pointer;
	}
	
	#timegrid .aufenthalt span.frei {
		background-color: #922;
		background: url(/tramino/gfx/timegrid_marker.png);
		color: #fff;
	}


	#timegrid .belegung span.over {
		background-color: #922;
		color: #fff;
	}
	
	#timegrid .aufenthalt span.error {
		background:#999;
	}
	
	#timegrid .aufenthalt span.tgs {
		background: #111;
		color: #fff;
	}

	#timegrid .aufenthalt span.tgf {
		background: #666;
		color: #fff;
	}

	#timegrid .aufenthalt span.info{
		height: 12px;
		font-size: 9px;
		line-height: 12px;
		margin:0;
		text-align: right;
		color:#999;
		width: 132px;
		padding: 0px 7px 0px 0;
	}

	#timegrid .aufenthalt span.info.shifted {
		width:162px;
	}
	
	#timegrid .belegung span.disable,
	#timegrid .aufenthalt span.disable {
		background-color: #ddd;
		color:#bbb;
	}

#timegrid div.termin, #timegrid div.buchung {
	position:relative;
	text-align: left;
	left:0px;
	right:0px;
	background: url(/tramino/gfx/white_pattern.png);
}

#timegrid div.buchung:hover .secondbuchung { background-color: #ff1;  }

#timegrid div.buchung {
	background: url(/tramino/gfx/white_pattern2a.png);
}

#timegrid div.buchung.secondbuchung, #timegrid span.secondbuchung {
	background: url(/tramino/gfx/white_pattern3a.png);
}

#timegrid .termin.divider {
	border-top: 1px solid #999 !important;
	height: 30px;
	
}
#timegrid .termin.divider .info {
	padding-top: 3px;
	height: 22px;
}
#timegrid .termin.divider .termine {
	padding-top: 3px;
}


#timegrid .termine span {
	overflow:hidden;
	padding: 2px 0px 2px 2px;
	height:auto;
	text-align:left;
	border-left:5px solid #ccc;
}



#timegrid .buchung .termine.info {
	width: 100%;
	margin-top: 1px;
}

#timegrid .termine span.terminduration {
	background:#ccc;
}

#timegrid .termine span.terminduration[onclick] {
	cursor:pointer;
}

#timegrid span.spacer {
	width: 131px; 
	background-color: #fff; 
	border-right: 1px solid #999;
	border-left:0px;
	text-align: left;
	padding: 4px 0px 4px 8px;
	font-size: 9px;
	line-height: 13px;
	color: #999;
}
#timegrid span.spacer.shifted{
	width: 161px;
}
#timegrid .spacer.zimmer.click {
	cursor: pointer;
}

#timegrid span.spacer_shift {
	width: 1px;
}
#timegrid span.info {
	width: 152px; 
	background-color: #fff; 
	border-right: 1px solid #999;
	text-align: left;
	padding-left: 7px;
	position: relative;
}

#timegrid span.info.shifted {
	width:162px;
}

#timegrid span.cinfo {
	position: absolute;
	right: 3px;
	top: 3px;
	width: auto;
	height: auto;
	background-color: rgba(0,0,0,0.1);
	color: rgba(0,0,0,0.2);
	border-radius: 7px;
	padding: 2px 4px;
	cursor: help;
}



.Widget.TextWidget { white-space: nowrap; }

.Widget.TextWidget .linkiconbox {
	background: transparent url(/tramino/gfx/icons/link.gif) no-repeat 0px 4px;
	padding: 0 0 0 18px;
}

.Widget.TextWidget .keyiconbox {
	background: transparent url(/tramino/gfx/icons/key.gif) no-repeat 0px 4px;
	padding: 0 0 0 18px;
}

.Widget.TagsWidget {
	background: transparent url(/tramino/gfx/icons/tag.gif) no-repeat 0px 2px;
	padding: 0 0 0 18px;
}

.Widget.ClientsWidget {
	background: transparent url(/tramino/gfx/icons/inherit.gif) no-repeat 0px 2px;
	padding: 0 0 0 18px;
}

.Widget.ProdukteWidget {
	background: transparent url(/tramino/gfx/icons/cart.gif) no-repeat 0px 2px;
	padding: 0 0 0 18px;
}

.Widget.ProduktWidget {
	background: transparent url(/tramino/gfx/icons/gear.gif) no-repeat 0px 2px;
	padding: 0 0 0 18px;
}


.Widget.KontaktWidget {
	background: transparent url(/tramino/gfx/icons/user.png) no-repeat 0px 2px;
	padding: 0 0 0 18px;
}

.Widget.DatumWidget_ {
	padding: 1px;
}


.Widget.DatumWidget_ input {
	display: block;
}

.Widget.DatumWidget_ label input {
	display: inline-block;
}

.Widget.LinkWidget {
	background: transparent url(/tramino/gfx/icons/link.gif) no-repeat 0px 2px;
	padding: 0 0 0 18px;
}

.Widget.PeriodWidget {
	background: transparent url(/tramino/gfx/icons/calc.gif) no-repeat 0px 2px;
	padding: 0 0 0 18px;
}

.Widget.StaticStarsWidget {
	height:16px;
	width:80px;
	background: transparent url(/tramino/gfx/rating/ui.stars.gif) 0 -32px;
}

.Widget.StaticStarsWidget .StativStarsAktiv{
	height:16px;
	background: transparent url(/tramino/gfx/rating/ui.stars.gif) 0 -48px;
}

.Widget.StaticStarsWidgetSmall {
	height:10px;
	width:50px;
	background: transparent url(/tramino/gfx/rating/ui.stars_s.gif) 0 -10px;
	padding:0px !important;
	margin:0px !important;
}

.Widget.StaticStarsWidgetSmall .StativStarsAktiv{
	height:10px;
	background: transparent url(/tramino/gfx/rating/ui.stars_s.gif) 0 -20px;
}
.Widget.PeriodWidget .content {
	border: 1px solid #999;
	background-color: #fff;
	padding: 8px 12px;
	font-size: 12px;
}

.Widget.ImageButtonsWidget .Element {
	position:relative;
	width:100px;
	height:100px;
	float:left;
	margin: 0 15px 15px 0;
	cursor:pointer;
	border: 2px solid #eee;
	border-radius: 5px;
	background: #fff;
	padding: 10px 10px;
	color:#333;
	font-size:11px;
	text-align:center;
	overflow:hidden;
}

.Widget.ImageButtonsWidget.big .Element {
	width:150px;
	height:125px;
}

.Widget.ImageButtonsWidget .label {
	position: absolute;
	bottom: 0px;
	left: 10px;
	right: 10px;
	font-size: 11px;
	line-height: 11px;
	color: #666;
	height: 23px;
	overflow: hidden;
	text-align: center;
}




.Widget.ImageButtonsWidget .Element.checked {
	color:#000;
	border:1px solid #000;
}



.Widget.ImageButtonsWidget .Element:hover {	border: 2px solid #aaaaaa; }
.Widget.ImageButtonsWidget .Element:hover .label { color: #000; }

.Widget.ImageButtonsWidget .Element.aktiv { border: 2px solid #FF6600 !important; }



.Widget.ImageButtonsWidget .Buttonimage {
}
.Widget.ImageButtonsWidget.big .Buttonimage {
	width:150px;
}

.Widget.ImageButtonsWidget .Buttonheadline {
	font-weight: bold;
	font-size: 12px;
	margin: 8px 0px;
	color: #aaa;
	
}

.Widget.colorpickerWidget {
	position: relative;
	border: 1px solid #999;
	padding: 10px;
	height: 240px;
}

.Widget.colorpickerWidget input {
	width: 100% !important;
	padding: 5px 15px 5px 15px !important;
	font-size: 15px;
	border: 0px solid #000;
	text-align: center;
	box-sizing: border-box;

}

.Widget.colorpickerWidget .farbtastic {
	position: absolute;
	left: 10px;
	top: 50px;
}


/* listeData() Stylesheets */

DIV.listeData form {
	margin: 0px;
}

#TraminoContent .listeData .empty {
	text-align: center;
	margin: 5px 0px;
	padding: 30px;
	border: 1px solid #ccc;
	color: #999;
	font-size: 16px;
	
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	
}

#TraminoContent .box .listeData .empty {
	border-width: 0px !important;
	padding: 30px 30px 20px 30px;
}

#TraminoContent div.listeData {
	padding: 0px 10px 5px 10px;
	border: 1px solid #ccc;
	min-height: 50px;
	background-color: #fff;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}

#TraminoContent .listeData.default { min-height: 20px; }

table.listeData {
	width: 100%;
	table-layout: auto;
	border-collapse: collapse;
	/* border-top: 1px solid #000; */
}

	#TraminoContent table.listeData {
		background-color: #fff;
		color: #000;
	}

table.listeData.chart { border: 1px solid #999; }
table.listeData.chart th { border: 1px solid #999; color: #999; background-color: #ddd; font-size: 12px;}
table.listeData.chart td { border-left: 1px solid #999; padding: 0px; }
table.listeData.chart td input { width: 90% !important; border: 0px; padding: 2px 6px; }
table.listeData.chart td.rowheader { background-color: #ddd; color: #999; font-size: 12px; font-weight: bold; padding: 3px 4px; text-align: right;}

.listeData.verticals table td { border-left: 1px solid #ccc; border-right: 1px solid #ccc; }
.listeData.verticals table { border-bottom: 1px solid #ccc; margin-bottom: 10px; }

table.listeData a.listedata_mouseover { color: inherit !important; display: block; margin: -4px -8px; padding: 4px 8px; }

table.listeData tr.summary td { vertical-align: bottom ;}

table.listeData tr.rowinfo td {
	color: #999;
	font-size: 11px;
	padding-left: 8px;
	border-top: 0px;
	padding-top: 0px;
	padding-bottom: 10px;
	font-style: oblique;
	white-space: normal;
}

table.listeData tr.red {
	color: #a33;
}

table.listeData td.red {
	color: #a33;
}

table.listeData td.green {
	color: #393;
}

table.listeData tr.gold td {
	color: #a93;
}

table.listeData tr.marked {
	color: #339;
}

table.listeData tr.hidden { color: #777; }


table.listeData tr.hidden1 {
	color: #966;
}

table.listeData tr.hidden2 {
	color: #696;
}

table.listeData tr.hidden3 {
	color: #669;
}

table.listeData tr.disabled td {
	color: #888;
	text-decoration: line-through;
}

table.listeData tr.disabled2 td {
	color: #aaa;
	border-top: 1px solid #fff !important;
	background-color: #eee;
}


table.listeData tr.highlight { background-color: #ff0; }
table.listeData tr.active { background-color: #efd; }
table.listeData tr.active2 { background-color: #cea; }
table.listeData tr.fixed { background-color: #e8e8e8; }
table.listeData tr.abgerechnet { background-color: #F7F7F7; }


table.listeData .right {
	float: none;
	text-align: right;
}

table.listeData .center {
	text-align: center;
}

/* Cell based Styles */

table.listeData td.hidden { color: #777; }
table.listeData td.lang  { background-color: #eee; text-transform: uppercase;
	padding: 6px 8px; font-size: 10px; text-align: center; color: #aaa; font-weight: bold; }


	table.listeData td.monospace  {
		font-family: "Monaco", monospace;
	}


/* Headers */


table.listeData th {
	text-align: left;
	border-bottom: 1px solid #ccc;
	vertical-align: bottom; 
	padding: 9px 6px 4px 7px;
	white-space: nowrap;
	color: #999;
	font-size: 11px;
	font-weight: bold;
}

table.listeData th.raw2 {
	padding-left: 0px;
}

table.listeData th a { color: #999 !important; }

table.listeData td {
	text-align: left;
	border-top: 1px solid #ccc;
	vertical-align: top; 
	padding: 4px 8px 4px 8px;
	white-space: nowrap;
	font-size: 13px;
}

table.listeData.mini td {
	padding: 0px 8px 1px 8px;
}

table.listeData tr.noline td {
	border-top: 1px solid #fff;
}





table.listeData td.tiny {
	padding: 3px 8px 3px 8px;
	font-size: 11px;
}
	
	table.listeData tr.tiny td {
		padding: 3px 8px 3px 8px;
		font-size: 11px;
	}
	
	table.listeData div.info {
		margin-top: 4px;
		font-size: 12px; line-height: 14px;
		color: #666;
	}
	
	table.listeData div.info2 {
		margin-top: 4px;
		font-size: 11px; line-height: 13px;
		color: #777;
	}
	
	
table.listeData td.big {
	padding: 4px 8px 4px 8px;
	font-size: 18px;
}

	table.listeData tr.big td {
		padding: 4px 8px 4px 8px;
		font-size: 18px;
	}


table.listeData td.noborder {
	border-top: 0px !important;
	padding: 0px 8px 6px 8px;
	padding: 0px 0px 6px 0px !important;
}

	table.listeData tr.noborder td {
		border-top: 0px !important;
		padding: 0px 8px 6px 8px;
	}


table.listeData td.border {
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
}

table.listeData td.lborder {
	border-left: 1px solid #ccc;
}

table.listeData td.rborder {
	border-right: 1px solid #ccc;
}


table.listeData td.narrow {
	padding-right: 2px !important;
	padding-left: 2px !important;
}

	table.listeData th.narrow {
		padding-right: 0px !important;
		padding-left: 0px !important;
	}

	table.listeData tr.narrow td {
		padding-right: 2px !important;
		padding-left: 2px !important;
	}
	
	
	table.listeData td.narrow2 {
		padding-left: 1px !important;
	}


	table.listeData td.vcenter {
		vertical-align: middle !important; 
	}




table.listeData td.tall {
	padding-top: 6px;
	padding-bottom: 6px;
}

	table.listeData tr.tall td {
		padding-top: 7px;
		padding-bottom: 6px;
	}

	table.listeData tr.subheader td {
		font-size: 11px;
		color: #aaa;
		padding-bottom: 0px;
	}

table.listeData tr.wordwrap td {
	white-space: normal;
}

	table.listeData td.wordwrap {
		white-space: normal;
	}


table.listeData td.header {
	font-size: 15px;
	line-height: 1.1em;
	padding: 4px 300px 4px 10px;
	border-top: 0px solid #000;
	white-space: normal;
}

table.listeData td.highlight {
	background-color: #eee;
}

table.listeData td.gruppe  {
	padding-top: 15px;
	font-size: 12px;
	font-weight: bold;
	color: #777;
	border-top-width: 0px;
}


table.listeData td.none {
	padding: 0px;
	margin: 0px;
}
	table.listeData tr.none td {
		padding: 0px;
		margin: 0px;
	}

table.listeData td.raw  {
	padding: 2px 8px;
	margin: 0px;
}
	table.listeData tr.raw td {
		padding: 2px 8px;
		margin: 0px;
	}

	#TraminoContent table.listeData td.raw.icon {
		vertical-align: top;
		padding: 3px 2px 0px 0px;
	}

table.listeData tr.raw2 td  {
	padding: 2px 2px 1px 0px;
	margin: 0px;
}

	table.listeData td.raw2  {
		padding: 2px 2px 1px 0px;
		margin: 0px;
	}

table.listeData td.icon48  {
	padding: 6px 8px 3px 0px;
	margin: 0px;
}

table.listeData td.icon48 img  {
	width: 48px;
	height: 48px;
}

table.listeData td.href  {
	background-color: #eee;
	background: url(/tramino/gfx/gui_pfeil_r.png) 2px 6px no-repeat;
	padding-left: 17px !important;
	cursor: pointer;
}

table.listeData td.onclick  {
	cursor: pointer;
}

table.listeData td.reorder  {
	cursor: pointer;
}






table.listeData TR:hover tr.editable {
	cursor: text;
	/* background: url(/gfx/editable.png) 0px 3px no-repeat; */
}

table.listeData td select { margin: 0px; }
table.listeData td input { margin: 0px; }

table.listeData tr.edit TH { padding: 0px; }
table.listeData tr.edit td { padding: 0px; }
table.listeData tr.edit { padding: 0px; }

table.listeData tr.edit input {
	width: 90%;
	min-width: 30px;
	font-size: 13px;
	margin-top: 1px;
	font-family: inherit;
	font-weight: inherit;
}

table.listeData td.err { border-bottom: 2px solid #f00 !important; }

table.listeData td.error span.widget {
	border-bottom: 2px solid #f00;
	display: inline-block;
}

table.listeData td.warning span.widget { border-bottom: 2px solid #FC6; display: inline-block; }



table.listeData tr.button {
}

	table.listeData tr.button a {
		padding: 1px 4px 1px 4px;
		background-color: #ccc;
		text-decoration: none;
		color: #000 !important;
		border-bottom: 0px;
	}
	table.listeData tr.button a:hover {
		background-color: #C33 !important;
		color: #fff !important;
		border-bottom: 0px;
	}

table.listeData tr.delete a {
	padding: 1px 4px 1px 4px;
	background-color: #C33;
	text-decoration: none;
	color: #fff;
}
	table.listeData tr.delete a:hover {
		background-color: #000;
		color: #fff;
	}

table.listeData td.header b {
	padding: 2px 6px 2px 6px;
	border: 1px solid #aaa;
}

table.listeData td.header h3 {
	margin: 12px 0px 7px 0px;
	padding: 0px;
	font-size: 19px;
}

table.listeData td.header p {
	margin: 7px 0px;
	padding: 0px;
	font-size: 14px;
	font-weight: 100;
	color: #999;
}


table.listeData.hover tr.data.hover:hover {
	background-color: rgb(255, 102, 0);
	color: #fff !important;
	cursor: pointer;
}

table.listeData.hover tr.data.hover:hover td { color: #fff; background-color: rgb(255, 102, 0); }

table.listeData td.dragHandle  { cursor: move; }
table.listeData tr.onDragHandle  { 
	background-color: #ddd !important; }

table.listeData tr.data.hover:active {
	background-color: #ddd;
	color: inherit;
}




table.listeData td .button {
	display: inline-block;
	background-color: #666;
	margin: 1px;
	padding: 2px 9px 3px 9px;
	font-size: 11px;
	color: #fff;
	cursor: pointer;
	text-align: center;
}
table.listeData td .button:hover { background-color: #333; }


.listeData .button {
	display: inline-block;
	background-color: #999;
	margin: 0px 4px 0px 0px ;
	padding: 2px 8px 3px 8px;
	font-size: 11px;
	color: #fff !important;
	cursor: pointer;
	text-align: center;
}

.listeData .button button {
	background-color: transparent;
	padding: 0px; margin: 0px; border: 0px; color: #fff;
}

.listeData .button:hover { background-color: #333; }


.sepia table.listeData {
	color: #ffc;
	background-color: #997;
	border-bottom: 1px solid #cca;
}

.sepia table.listeData th {
	border-bottom: 1px solid #cca;
	background-color: #fff;
	color: #000;
}

.sepia table.listeData td {
	border-top: 1px solid #bb9;
	font-size: 14px;
}

.sepia table.listeData tr.tiny td {
	font-size: 13px;
}

.sepia table.listeData tr.bold {
	color: #fff !important;
	font-size: 16px;
}
	
.sepia table.listeData tr.gruppe  {
	color: #dda;
	font-size: 25px;
}

@media print {
	table.listeData tr.hidden { color: #444; }
	table.listeData td.hidden { color: #444; }
	table.listeData th { border-bottom: 1px solid #666; }
	table.listeData td { border-top: 1px solid #666; }
}

/* -- viewData() -- */

table.viewData {
	width: 100%;
	table-layout: auto;
	border-collapse: collapse;
	/* border-top: 1px solid #000; */
	font-family: Arial;
}

table.viewData table.viewData {
	width: auto;
	padding: 0px; 
	margin: 0px;
	border-spacing: 0px;
}


table.viewData td {
	text-align: left;
	vertical-align: middle; 
	padding: 5px 10px 4px 0px;
	white-space: nowrap;
	font-size: 13px;
}

table.viewData td.red { color: #f00; }
table.viewData td.green { color: #393; }


table.viewData td.label {
	text-align: right;
	color: #999;
	font-size: 12px;
}

table.viewData td.widget {
	padding: 3px 10px 3px 0px;
}

	table.viewData td.widget input {
		font-size: 12px; padding: 2px 5px;
		height: auto;
	}

table.viewData table.viewData td {
	padding: 0px 10px 0px 0px !important;
}

table.viewData td.error span.widget {
	border-bottom: 2px solid #f00;
	display: inline-block;
}

table.viewData td.warning span.widget {
	border-bottom: 2px solid #FC6;
	display: inline-block;
}

table.viewData td.warning span.content {
	border-bottom: 2px solid #FC6;
	padding-bottom: 1px;
}

table.viewData td.error span.content {
	border-bottom: 2px solid #f00;
	padding-bottom: 1px;
}


table.listeData.mini td {
	padding: 2px 5px;
	font-size: 12px;
}


/* -- Memos -- */

.memo  { margin-bottom: 35px; }

.memo .message { margin-bottom: 15px; min-height: 50px;  }
.memo .avatar { float: left; width: 50px; margin-right: 15px; }
.memo .user { font-weight: bold; }

.memo .info { margin-top: 5px; font-size: 11px; color: #dde0dd; text-align: right; }

.memo .ref { font-size: 14px;}
.memo .ref.content .Bild { float: left; margin: 0px 15px 10px 0px; }

.memo .ref .videobox { cursor: pointer; position: relative; }

.memo .ref .playbutton, #tpc_pictures .playbutton {
	position: absolute; 
	left: 50%; top: 50%; right: 50%; bottom: 50%;
	margin: -32px 0px 0px -32px;
	z-index: 100; width: 64px; height: 45px; border: 1px solid #fff;
	background-color: #444;
	background-color: rgba(30,30,30,0.5);
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}

.memo .ref .playbutton:hover, #tpc_pictures .playbutton:hover {
	background-color: rgba(30,30,30,0.75);
}

.memo .ref .playbutton span, #tpc_pictures .playbutton span {
	margin: 12px 0px 0px 23px;
	display: block;
	border-color: transparent transparent transparent white;
	border-style:solid;
	border-width: 10px 20px 10px 20px;
	width:0;
	height:0;
	
}
