/* Templates für die Tramino GUI */

#TraminoHeaderTiny {
	position:fixed;
	top: 0px;
	left: 0px;
	padding:5px;
	background: url("/tramino/gfx/i/bg.png") repeat scroll 0 0 transparent;
	z-index: 9999;
	width:130px;
	height: 20px;
}
	#TraminoHeaderTiny img.logo, #TraminoHeaderTiny a {
		position: inline-block;
	}
	
	
	#TraminoHeaderTiny a img {
		border:0;
	}

#TraminoHeader {
	position: relative;
	background: #ddd;
	font-family: Arial, sans-serif;
	font-weight: normal;
	margin: 0px;
	color: #ddd;
	z-index: 15090;
}
	#TraminoHeader #top {
		padding-top: 60px;
	}



#TraminoUserMenu  {
	position: absolute;
	top: 0px;
	right: 0px;
	margin: 0px;
	color: #ddd;
	width: 200px;
}
	#TraminoUserMenu .TraminoUserInfo {
		position:relative;
		padding: 7px 0 15px 50px;
	}
	#TraminoUserMenu a.UserName {
		color:#666;
		text-decoration:none;
		font-size:14px;
		line-height:14px;
	}
	#TraminoUserMenu a.UserButton {
		color:#999;
		text-decoration:none;
		margin: 3px 0px;
		font-size: 11px;
	}
	#TraminoUserMenu img {
		position:absolute;
		left: 0px;
		width:40px;
		height:40px;
	}
	#TraminoUserMenu A:hover, #TraminoClusterMenu A:hover {
		color: #000;
	}


#TraminoClusterMenu{
	position: absolute;
	top: 7px;
	right: 215px;
	margin: 0px;
	width: 200px;
}
	#TraminoClusterMenu select {
		width:195px;
	}



#TraminoHeaderHelp {
	font-size: 13px;
	line-height: 16px;
	color: #333;
	padding:0 0 15px 100px;
}
	#TraminoHeaderHelp a {
		color: #000;
	}



#TraminoMenu {
	font-size: 13px;
	overflow: hidden;
	border-bottom:1px solid #fff;
}
	#TraminoMenu .menu {
		padding: 0 30px 0 110px;
		z-index: 50;
	}
	#TraminoMenu A {
		display: block;
		float: left;
		color: #999;
		font-weight: normal;
		padding: 6px 11px 4px 11px;
		text-decoration: none;
	}
	
	#TraminoMenu A.spacebefore {
		margin-left: 15px;
	}
	
	#TraminoMenu A.spaceafter {
		margin-right: 15px;
	}
	
	
	#TraminoMenu .menu A {
		color: #fff;
		border-right: 1px solid #ddd;
		background:#888;
	}
	#TraminoMenu .menu A.aktiv {
		color: #111;
		background-color: #fff;
		border-right: 1px solid #fff;
	}
	#TraminoMenu .menu A.aktiv2 {
		background-color: #ddd;
		color:#444;
	}
	#TraminoMenu A.abstand {
		margin-left: 20px;
	}
	#TraminoMenu A:hover {
		background-color: #666;
		color: #fff;
	}
	#TraminoMenu .menu A.aktiv2:hover {
		background-color: #ddd;
		color:#000;
	}
	#TraminoMenu A:hover { background-color: #666; color: #fff; }
	#TraminoMenu A.aktiv:hover { background-color: #fff; color: #333; }
	
	#TraminoMenu A.right {
		float: right;
		margin-top: 5px;
		background-color: #999;
		font-size: 11px;
		padding: 4px 12px 4px 12px;
		color: #fff;
	}
	#TraminoMenu A.right:hover {
		background-color: #363;
		color: #cfc;
	}
	#TraminoMenu ul.mainmenu {
		position:absolute;
		left: 110px;
		top: 6px;
		margin:0;
		padding:0;
	}

	#TraminoMenu ul.mainmenu li {
		display: block;
		position: relative;
		float:left;
	}
	#TraminoMenu ul.mainmenu li a.icon {
		display: block;
		padding: 25px 0 0 0;
		color: #222;
		background: transparent url("/tramino/gfx/icons/home.png") no-repeat center 5px;
		font-size:9px;
		text-align:center;
		width:50px;
		height:15px;
		border-radius: 7px;
		-webkit-border-radius: 7px;
		-moz-border-radius: 7px;
		margin-right: 5px;
		border: 1px solid #bbb;
	}
	#TraminoMenu ul.mainmenu li a.icon:hover {
		background-color: #eee;
	}
	#TraminoMenu ul.mainmenu li a.icon.aktiv {
		color: #000;
		background-color: #fff;
		border: 1px solid #fff;
		border-top: 0px solid #fff;
	}
		#TraminoMenu ul.mainmenu div.submenu {
			position: absolute; 
			top: 30px; 
			left: -10px;
			display: none;
			min-width: 100px;
		}
		#TraminoMenu ul.mainmenu li:hover div { 
			display: block;
			z-index: 100;
		}
		
		#TraminoMenu ul.mainmenu div.submenu div.eck {
			position: relative;
			left: 35px; 
			top: 1px;
			z-index: 200;
			background: url(/tramino/gfx/eck.png) no-repeat;
			width: 16px;
			height: 16px;
		}
		
		#TraminoMenu ul.mainmenu ul {
			margin: 0px;
			background-color: #fff;
			border: 1px solid #ccc;
			color: #666;
			-webkit-border-radius: 7px;
			-moz-border-radius: 7px;
			border-radius: 7px;
			font-size: 12px;
			padding: 8px;
			-webkit-box-shadow: 1px 1px 3px #bbb;
			-moz-box-shadow: 1px 1px 3px #bbb;
			box-shadow: 1px 1px 3px #bbb;
		}
		
		#TraminoMenu ul.mainmenu ul li { 
			float: none;
		}
		#TraminoMenu ul.mainmenu ul li a {
			display: block;
			float: none;
			
			padding: 2px 4px 2px 4px;
			border-top: 1px solid #ddd;
		}
		#TraminoMenu ul.mainmenu ul li.first a {
			border-top: 0px;
		}
		
		

#TraminoContent {
	min-height: 300px;
	padding: 15px 25px;
}

.TraminoContent a {
	color: #393; text-decoration: none;
}


	@media print {
		#TraminoContent {
			padding: 0;
			min-height: auto;
		}
	}


#TraminoHeaderInfo {
	position: absolute;
	left: 35%;
	top: 0px;
	color: #ddd;
	font-size: 10px;
	height: 45px;
	overflow: hidden;
	width: 300px;
	padding: 3px 10px;
}
	#TraminoHeaderInfo:hover {
		background-color: #777;
		z-index: 15099;
		height: 500px;
		width: 310px;
		overflow: scroll;
	}



A.button {
	background-color: #666;
	color: #fff;
	text-decoration: none;
	padding: 3px 8px;
	line-height: 130%;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
A:hover.button {
	background-color: #222;
	color: #fff;
}



.yui-tabview {
	background-color: #f00;
}



.TraminoAlphabet {
	margin-top: 1em;
	padding-left: 20px;
	padding-top: 0.3em;
	overflow: hidden;
}
.TraminoAlphabet a {
	vertical-align: baseline;
	margin-right: 1px;
	font-weight: bold;
	font-size: 10px;
	line-height: 15px !important;
	text-align: center;
	padding: 0.2em 0.42em 2em 0.42em;
	color: #333;
	background-color: #ddd;
	text-decoration: none;
}


.TraminoAlphabet a:hover {
	background-color: #fff;
	color: #000;
}
.TraminoAlphabet a.aktiv {
	background-color: #777;
	color: #fff;
}
.TraminoAlphabet a.off {
	background-color: #ddd;
	color: #999;
}
.TraminoAlphabet a.off:hover {
	background-color: #ccc;
	color: #999;
}
.TraminoAlphabet .AlphaSize1 { font-size: 12px; line-height: 12px !important; }
.TraminoAlphabet .AlphaSize2 { font-size: 14px; line-height: 14px !important; }
.TraminoAlphabet .AlphaSize3 { font-size: 16px; line-height: 16px !important; }
.TraminoAlphabet .AlphaSize4 { font-size: 18px; line-height: 18px !important; }
.TraminoAlphabet .AlphaSize5 { font-size: 20px; line-height: 20px !important; }
.TraminoAlphabet .AlphaSize6 { font-size: 22px; line-height: 22px !important; }



	table.year2 {
		border: 1px solid #999;
		margin: 0px 15px 25px 0px;
		padding: 0px;
		table-layout: auto;
		border-collapse: collapse;
		font-size: 11px;
	}
	
	table.year2 td {
		border: 1px solid #ccc;
		background-color: #fff;
		width: 18px;
		height: 20px;
		padding: 0px;
		font-size: 11px;
		text-align: center;
	}
	
	table.year2 td.belegt {
		background-color: #aaa;
		border: 1px solid #fff;
		color: #fff;
	}
	
	table.year2 td.head {
		color: #fff;
		background-color: #444;
		border: 1px solid #fff;
		height: 18px;
	}
	
	table.year2 td.head2 {
		color: #fff;
		width: auto;
		font-size: 16px;
		padding: 7px 0px 3px 10px;
		background-color: #777;
		border: 1px solid #fff;
	}
	
	table.year2 td.mon {
		width: 80px;
		text-align: left;
		padding-left: 10px;
	}
	
	table.year {
		border: 1px solid #999;
		margin: 0px 10px 10px 0px;
		padding: 0px;
		table-layout: auto;
		border-collapse: collapse;
		font-size: 11px;
	}
	
	table.year th {
		border: 1px solid #999;
		width: 13px;
		text-align: center;
		background-color: #ddd;
		font-weight: normal;
	}
	
	table.year td {
		border: 1px solid #999;
		width: 13px;
		height: 13px;
		padding: 0px;
		text-align: center;
	}
	
	table.year td input {
		margin: 0px;
		padding: 0px;
		text-align: center;
	}
	
	table.year td.mon {
		width: 10em;
		text-align: left;
		padding-left: 1em;
		background-color: #ccc;
	}
	
	table.year td.frei input {
		background-color: #494;
		border: 1px solid #494;
		color: #fff;
	}
	
	table.year td.off {
		background-color: #ccc;
	}
	
	.TraminoKalenderMonat {
		height: 8em;
		width: 7.5em;
		margin: 0em 1em 1em 0em;
	}
	
	.TraminoKalenderMonat h3 {
		margin: 0px 0px 2px 0px;
		float: right;
		font-size: 13px;
		color: #999;
	}
	
	.TraminoKalenderMonat h4 {
		margin: 0px 0px 2px 0px;
		text-align: left;
		font-size: 13px;
		color: #bbb;
	}
	
	table.monat {
		border: 1px solid #999;
		margin: 0px;
		padding: 0px;
		table-layout: auto;
		border-collapse: collapse;
		font-size: 11px;
	}
	
	table.monat th {
		border: 1px solid #999;
		width: 1.2em;
		text-align: center;
		background-color: #eee;
	}
	
	table.monat td {
		border: 1px solid #999;
		width: 1.2em;
		height: 1.2em;
		text-align: center;
		color: #ccc;
	}
	
	table.monat td.mon {
		width: 10em;
		text-align: left;
		padding-left: 1em;
		background-color: #ccc;
	}
	
	table.monat td.frei {
		background-color: #494;
		color: #fff;
	}
	
	table.monat td.off {
		background-color: #ccc;
	}
	
	
	
	/* EventLine */
	
	table.EventLine {
		border: 1px solid #bbb;
		padding: 0px;
		table-layout: auto;
		border-collapse: collapse;
		font-size: 11px;
	}
	
	table.EventLine td {
		border: 1px solid #bbb;
		width: 1.1em;
		height: 1.2em;
		text-align: center;
		color: #ccc;
		background-color: #fff;
		font-size: 0.9em;
	}
	
	table.EventLine td.jahr {
		font-size: 1.6em;
		color: #666;
		text-align: left;
		vertical-align: top;
		padding: 0.2em 0em 0.2em 0.5em;
	}
	
	table.EventLine td.wochentag {
		color: #666;
		vertical-align: bottom;
		text-align: center;
		font-size: 0.8em;
		padding: 0.2em 0em 0.6em 0.2em;
	}
	
	table.EventLine td.monat {
		width: 7em;
		text-align: left;
		padding-left: 1em;
		color: #666;
	}
	
	table.EventLine td.d1 {
		background-color: #ddd;
	}
	
	table.EventLine td.c1 { background-color: #66C; }
	table.EventLine td.c2 { background-color: #339; }
	table.EventLine td.c3 { background-color: #669; }
	table.EventLine td.c4 { background-color: #996; }
	table.EventLine td.c5 { background-color: #f63; }
	table.EventLine td.c6 { background-color: #f63; }
	
	table.EventLine td.frei {
		background-color: #494;
		color: #fff;
	}
	
	table.EventLine td.off {
		background-color: #ccc;
	}



#TraminoContent .TraminoForm {
	background-color: transparent;
}





#TraminoContent .TraminoForm.randlos {
	background-color: transparent;
}

#TraminoContent .TraminoForm .intro h3 {
	font-size: 26px;
	font-family: "Georgia",serif;
	font-weight:normal;
}

#TraminoContent .TraminoForm .intro h3 b {
	padding: 0px;
	font-weight:normal;
}

#TraminoContent .TraminoForm .intro p {
/*	display:none; */
}

#TraminoContent .TraminoForm .intro {
	background-color: #fff;
	border-bottom: 0px solid #bbb;
}

#TraminoContent .TraminoForm .intro h3 b {
	border: 0px solid #aaa;
	color: #393;
}

#TraminoContent .TraminoForm .footer {
	background-color: transparent;
	border-top: 0px solid #bbb;
}

#tr_modalbox, #tr_modalbox #tr_overlay {
  position: fixed;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
}

#tr_modalbox.modalbox_hide #tr_overlay  {
  z-index:-100;
}

#tr_modalbox.modalbox_BG #tr_overlay {
  background-color: #000;
  z-index: 19999;
}

#tr_modalbox #tr_info {
	position: relative;
	margin: 100px auto;
	padding:50px 0 0 0;
	text-align:center;
	height:125px;
	width:300px;
	background:#000;
	color:#fff;
	z-index: 19999;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	border:2px solid #fff;
}

#tr_modalbox #tr_info a {
	color:#FACF3F;
}

/*  Hovertip */

	.traminoHovertip {
		position: absolute;
		top: 0px;
		left: 0px;
		z-index: 10000;
		background-color: #fff;
		padding: 6px 10px;
		border: 1px solid #bbb;
		max-width: 300px;
	
		font-size: 11px;
		color: #777;
		text-align:left;

		border-radius: 7px;
		-webkit-border-radius: 7px;
		-moz-border-radius: 7px;

		-webkit-box-shadow: 1px 1px 3px #999;
		-moz-box-shadow: 1px 1px 3px #999;
		box-shadow: 1px 1px 3px #999;

	}