/* CSS Document */

/**
* Stylesheet for http://www.igraeser.ch/
*
* Standard Stylesheet
*
* @author Beat Schenkel
* @link http://www.webcenter.ch/
* @copyright Copyright 2010, Webcenter
* @license CC-A 3.0 / http://creativecommons.org/licenses/by/3.0/
* @created 13.01.2011
* @updated 08.03.2011
**/

/********************************************************* _Global Styles */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, 
hgroup, menu, nav, section, menu,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	list-style:none;
}

::-moz-selection {
	background:#f0f4c3;
	color:#000;
	}
::selection {
	background:#f0f4c3;
	color:#000;
	}
	
/*	j.mp/webkit-tap-highlight-color: R,G.B,Alpha */
a:link { -webkit-tap-highlight-color:rgba(255,255,255,0.5); }

/* Text tiefer/höher gestellt */
sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }

.ce_wrap hr { display:block; height:1px; border:0; border-top:1px solid #DDD; margin:1em 0; padding:0; }

/* maxvoltar.com/archive/-webkit-font-smoothing */
html { -webkit-font-smoothing: antialiased; }

/* Fonts */

/*
@font-face {
  font-family: "Kimberley";
  src: url(../fonts/larabie/kimberle.ttf) format("truetype");
}
*/

body, html {
	width:100%;
	height:100%;
	}

/* die Klasse page wird benötigt damit es kleinen Konflikt mit dem ckeditor gibt */
html{
}

body.page {
	width:100%;
	}

.bgWrap{
	background-image:url(../images/gras_bg.png);
	background-repeat:no-repeat;
	background-position: right bottom;
}
body, table, input, select, textarea {
	font-family:Arial, Verdana, sans-serif;
	font-size:13px;
	color:#444;
	text-decoration:none;
	}
	
.page a:link,
.page a:visited {
	text-decoration:underline;
	color:#4157b2;
	}
.page a:hover,
.page a:focus {
	color:#000;
	}
	
/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
a:active { outline: none; }
a:focus { outline: thin dotted; }

table {
	border-collapse:collapse;
	border-spacing:0;
	}
	table table {
		margin:0;
		}
	td,
	th {
		font-weight:normal;
		text-align:left;
		vertical-align:top;
		padding:0 2px 2px 1px;
		position:relative;
		}
	td img { vertical-align:top; } 
	table p {
		margin:0;
		}

.clearer {
	display:block;
	clear:both;
	height:1px;
	overflow:hidden;
	background:#FFF;
	visibility:hidden;
	}

.clearfix {
	display:inline-block;
	}

.hidden {
	display: block;
	position: absolute;
	left: -1500px;
	top:-1500px;
	overflow: hidden;
	width:0;
	height:0;
	}
	
mark {
	background:#feffd8;
	}


/********************************************************* _Headings */

h1,h2,h3,h4,h5,h6 { font-weight: bold; text-rendering: optimizeLegibility; }

h1 {
	font-size:32px;
	line-height:30px;
	color:#61a05d;
	}

h1.title { text-transform:uppercase; color:#AAA; }	
h1 .transfTxtNone { text-transform:none; color:#61a05d; }

h2 {
	font-size:16px;
	color:#7da47b;
	}
	
h3 {
	font-size:12px;
	color:#555;
	}
	
/********************************************************* _msg Box */

.ce_wrap .required {
	color:#CC0000;
	}

.msg_box {
	margin:15px 0;
	padding:10px 10px 10px 30px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	-moz-box-shadow:0 0 10px #EEE;
	-webkit-box-shadow:0 0 10px #EEE;
	box-shadow:0 0 10px #EEE;
	background-repeat:no-repeat;
	background-position:10px center;
	color:#666;
}

	.msg_box.error {
		border:1px solid #ebcece;
		background-image:url(../images/icons/error.gif);
	}
	
	.msg_box.success {
		border:1px solid #bdcfb7;
		background-image:url(../images/icons/success.gif);
	}
	
	.msg_box.load {
		border:1px solid #DDD;
		background-image:url(../images/ajax-loader.gif);
		width:400px;
	}

/********************************************************* _Forms */

input, select { vertical-align:middle; }

/* align checkboxes, radios, text inputs with their label
	by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css
	a different value is served to IE 7)*/

input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; *vertical-align: baseline; }

/* hand cursor on clickable input elements */
label, input[type=button], input[type=submit], button { cursor: pointer; }

select {
	}
	select option {
		padding:0 2px;
		}

input,
textarea {
	color:#000;
	line-height:normal;
	overflow:visible;
	}

textarea,
.text {
	cursor:text;
	border:1px solid #999;
	padding:2px 2px;
	}
	
textarea:focus,
.text:focus {
	border-color:#3D7BAD;
	}
	
.text {
	width:180px;
	}

textarea {
	width:100%;
	height:150px;
	}

.radio,
.checkbox {
	background:none;
	border:none;
	width:12px;
	height:12px;
	}

.captcha {
	width:77px;
	}

.submit,
.button,
button {
	padding:1px 4px;
	color:#333;
	overflow:visible;
	background: none repeat scroll 50% 50% #B8DFB5;
	border: 1px solid #61A05D;
	font-weight: bold;
	/* Firefox 3.6+ */
	background: -moz-linear-gradient(100% 100% 90deg, #4AAF41, #B8DFB5);
	
	/* Safari 4-5, Chrome 1-9 */
	/* -webkit-gradient(<type>, <point> [, <radius>]?, <point> [, <radius>]? [, <stop>]*) */
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4AAF41), to(#B8DFB5));
	
	/* Safari 5.1+, Chrome 10+ */
	background: -webkit-linear-gradient(#4AAF41, #B8DFB5);
	
	/* Opera 11.10+ */
	background: -o-linear-gradient(#4AAF41, #B8DFB5);
	
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	opacity:0.8;
}

	
.submit:hover,
.button:hover,
button:hover {
	opacity:1;
}
	
input.highlight {
	border-color:#BF2323;
	}
	
.errorRequired {
	border:1px solid #C00;
	}
	
.errorNumber {
	border:1px solid #CC3;
	}

.delValBtn{
	margin: 0 1px -2px 0;
	background:url(../images/del.png);
	opacity: 0.7;
	display: inline-block;
	height: 16px;
	overflow: hidden;
	text-indent: -9999px;
	width: 16px;
	text-align:left;
}
/********************************************************* _Structure */

.pageWrap {
	position:relative;
	margin:30px 50px 10px;
}

.headerWrap {
	margin-bottom:10px;
	position:relative;
}

	#helpref,
	#logout,
	#loginref {
		font-weight: bold;
		position: absolute;
		text-decoration:none;
		padding:1px 4px;
		color:#333;
		overflow:visible;
		background: none repeat scroll 50% 50% #B8DFB5;
		border: 1px solid #61A05D;
		font-weight: bold;
		/* Firefox 3.6+ */
		background: -moz-linear-gradient(100% 100% 90deg, #4AAF41, #B8DFB5);
		
		/* Safari 4-5, Chrome 1-9 */
		/* -webkit-gradient(<type>, <point> [, <radius>]?, <point> [, <radius>]? [, <stop>]*) */
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4AAF41), to(#B8DFB5));
		
		/* Safari 5.1+, Chrome 10+ */
		background: -webkit-linear-gradient(#4AAF41, #B8DFB5);
		
		/* Opera 11.10+ */
		background: -o-linear-gradient(#4AAF41, #B8DFB5);
		
		-moz-border-radius:3px;
		-webkit-border-radius:3px;
		border-radius:3px;
		opacity:0.8;
	}
	
	#helpref:hover,
	#logout:hover,
	#loginref:hover {
		opacity:1;
	}
	
	#helpref {
		padding: 2px 23px;
		right: 0;
		top: -40px;
	}

	#logout {
		right:10px;
		top:-40px;
		padding:2px 20px;
	}
	
	#loginref {
		right:100px;
		top:-40px;
		padding:2px 20px;
	}
	
	#loginbox td{
		padding: 10px 0 0 5px;;
	}
	
	.usrAct {
		color:#000;
		text-decoration:none;
		text-transform:uppercase;
	}

/********************************************************* _Breadcrumb */

#breadcrumb {
	display:inline-block;
	margin-bottom:15px;
	}
	
#breadcrumb h2 {
	color:#999;
	font-size:11px;
	float:left;
	margin:0;
	margin-right:5px;
	}
	
#breadcrumb ol {
	margin:0;
	float:left;
	font-size:11px;
	}

	#breadcrumb li {
		display:inline;
		background:url(../images/breadcrumb.gif) right center no-repeat;
		padding-right:11px;
		margin-right:5px;
		}
	
	#breadcrumb .last {
		background:none;
		padding:0;
		margin:0;
		}
	
		#breadcrumb a {
			color:#444;
			text-decoration:none;
			}
		#breadcrumb a:hover {
			text-decoration:underline;
			}
		
		#breadcrumb .last a {
		}

	
	
/********************************************************* _Content */

.ce_wrap {
	line-height:22px;
	position:relative;
	}

.ce_wrap .required {
	color:#CC0000;
	}

.ce_wrap .img_left {
	float:left;
	margin:0 10px 10px 0;
	}
.ce_wrap .img_right {
	float:right;
	margin:0 0 10px 10px;
	}

/* Force CKEditor to underline the Link */
.ce_text a:link,
.ce_text a:visited,
.ce_wrap.ce_text a:hover {
	display:inline-block;
	padding:1px;
	color:#C50A33 !important;
	text-decoration:underline !important;
	}
	
.ce_text a:hover,
.ce_text a:focus {
	outline:1px solid #B9CB00;
	text-decoration:none !important;
}
	
/* IMG Border */

/*
.ce_wrap img {
	border:2px solid #EEE;
	padding:2px;
	}
.ce_wrap a:hover img {
	border-color:#B9CB00;
	}
*/
	
/* Text structure */
	
.ce_wrap h1 { margin:0 0 15px 0; zoom:1; padding-right:30px; font-size:25px;}
.ce_wrap h2 { margin:15px 0 10px 0; }
.ce_wrap h3 { margin:10px 0 5px 0; }
	
.ce_text table p { margin:0; }
	
.ce_text ol,
.ce_text ul,
.ce_text p { margin:5px 0 15px 0; }

.ce_text li p { margin:0; }

.ce_text .no-margin { margin:0; }

/* Lists */

.ce_text ol {
	margin-left:-10px;
	padding: 0 0 0 35px; /*--Distance between the order numbers--*/
}
.ce_text ol li {
	padding-left:1px;
	list-style-type:decimal;
}

.ce_text ul li {
	list-style-type:none;
	background:url(../images/layout/li.gif) 0 7px no-repeat transparent;

	padding-left: 16px;
	margin-left:5px;
	}

table.std_format{
	border:1px solid #DDD;
}

table.std_format th,
table.std_format td {
	padding:3px;
}

table.std_format th {
	font-weight:bold;
	border:none;
}

table.std_format td {
	border:1px solid #DDD;
}

/* Icon Link */

.icon {
	padding-left:20px;
	background-repeat:no-repeat;
	display:inline-block;
	line-height:11px;
	padding:1px 0 1px 16px;
	}
	
.icon.pdf { background-image:url(../images/icons/pdf.gif); }
.icon.internal { background-image:url(../images/icons/internal.gif); }
.icon.external { background-image:url(../images/icons/external.gif); }
.icon.back { background-image:url(../images/icons/back.gif); }
.icon.more { background-image:url(../images/icons/more.gif); }
.icon.email { background-image:url(../images/icons/email.gif); }
.icon.tel { background-image:url(../images/icons/tel.gif); }
.icon.download { background-image:url(../images/icons/download.gif); }
.icon.upload { background-image:url(../images/icons/upload.gif); }
	
/* Icon Box */

.icon_box {
	display:block;
	width:16px;
	height:16px;
	text-indent:-9999px;
	overflow:hidden;
	background:none;
	background-repeat:no-repeat;
	cursor:pointer;
	}

.icon_box.view { background-image:url(../images/icons/view.gif); }
.icon_box.solve { background-image:url(../images/icons/solve.gif); }
.icon_box.rate { background-image:url(../images/icons/rate.gif); }
.icon_box.register { background-image:url(../images/icons/register.gif); }
.icon_box.calendar { background-image:url(../images/icons/calendar.gif); }
.icon_box.delete { background-image:url(../images/icons/delete.gif); }

/********************************************************* _Pages */

/* global page styles */

.actIcon {
	cursor:pointer;
	margin-right:5px;
}

.errMsg {
	color:#F00;
	padding:10px 10px 0 10px;
	margin-bottom:15px;
}

.successMsg{
	color:#090;
	padding:10px 0 0 10px;
}

.pageInfo {
	padding:10px 10px 0 10px;
	border:1px solid #DDD;
	background-color:#F4F4F4;
	margin-bottom:15px;
	}
	
	.pageInfo p {
		margin:0;
		margin-bottom:10px;
		}

table.highlight tr:hover td{
	background:#EEE;
}
	
.description {
	font-size:11px;
	color:#777;
	margin-bottom:5px;
}

.optionWrap {
	margin-bottom:15px;
	position:relative;
}

.clear {
	clear:both;
}
/* main */

.imgGras{
	margin:0 auto;
	background:url(../images/defaultgras.png) no-repeat center;
	width:320px;
	height:480px;
}

.main{
}

.attrWrap{
}

.attrWrap li.curr {
	background: 50% 50% #B8DFB5;
	font-weight:bold;
}

.attrWrap li.disabled {
	color:#777;
	background:none !important;
	cursor:default !important;
	font-weight:normal !important;
}

.attrWrap li:hover,
.grasWrap li:hover,
.slctAttrWrap li:hover{
	background: 50% 50% #9F0;
	cursor:pointer;
	font-weight:bold;
}
	.attrWrap .attrBox{
		position:relative;
	}
	
	.attrWrap .attrBox input{
		float:right;
	}
	
.box{
	margin: 0 10px 10px 0;
	padding: 10px;
	background:#EEE;
	float:left;
	width:200px;
	height:210px;
	border:1px solid #CCC;
}

.slctAttrWrap{
	width:430px;
}

.grasWrap{
	overflow: auto;
}

.detailWrap imgwrap.profile{
	float:left;
	margin:15px 15px 0 0;
}


/* start */

.startWrap {
}

	.startWrap .msg_box.load {
		display:none;
		}
		
			.startWrap .search {
				display:inline-block;
			}
			
				.startWrap .search input,
				.startWrap .search button {
					float:left;
					margin-right:5px;
				}
				
			.startWrap .optionBar {
				position:absolute;
				left:530px;
				top:0px;
			}
			
				.startWrap .optionBar .button {
					margin-right:5px;
					color:#333;
				}
				
	.startWrap .graeser {
			}
			
	.graeser h2 {
		margin:10px 0;
		}
	
	.resultList th {
		font-weight:bold;
		}
		
	.startWrap .resultList .c1 { width:180px; }
	.startWrap .resultList .c2 { width:120px; }
	.startWrap .resultList .c3 { width:120px; }
	
	.startWrap .resultList th.c1 {
		font-style:italic;
		}
/* grasDetail */

/*.grasDetail{
}

	.grasDetail .editBox{
		display:inline-block;
		width:448px;
		border:1px solid #DDD;
	}
	
	.grasDetail .editBox .resultList th,
	.grasDetail .editBox .resultList td {
		padding:5px;
	}
	
	.grasDetail .editBox input.txt {
		width:316px;
	}
	
	.grasDetail .editBox input.txt.nr {
		width:40px;
	}
	
	.grasDetail .editBox .button {
		margin-right:5px;
		color:#333;
	}
	
	.grasDetail .optionBar {
		position:absolute;
		left:480px;
		top:4px;
	}
	
	
	.grasDetail .optionBar .description{
		padding-top:10px;
	}
	
	.grasDetail .grasAttributes {
		border-top:1px solid #DDD;
		padding:4px;
	}
*/
	.grasAttributes .resultList {
	}
	.grasAttributes .resultList td.c1 { width:160px; }
	.grasAttributes .resultList td.c3 { width:160px; }
	.grasAttributes .resultList td.c5 { width:160px; }
	.grasAttributes .resultList td.c7 { width:160px; }
	.grasAttributes .resultList td.c9 { width:78px; white-space:nowrap;}
	.grasAttributes .resultList td.c10 { width:50px; }
	.resultList td.cIcon {
		white-space:nowrap;
		width:46px;
	}
		
/* newAttrDB */		
.newAttrDBWrap {
}
	.newAttrDBWrap .selection{
		display:inline-block;
	}
	
	.newAttrDBWrap .optionBar{
		position:fixed;
		bottom:80px;
		right:10px;
		border:1px solid #999;
		padding:8px;
		width:135px;
		background:#FFF;
	}
	
	.newAttrDBWrap .optionBar .button {
		margin-right:5px;
	}
		
	
	.newAttrDBWrap .td_a.c1{ width:90px;}
	.newAttrDBWrap .td_a.c2{ width:250px;}
	.newAttrDBWrap .td_a.c3{ width:20px;}
	
	.newAttrDBWrap .graeser .resultList .marked td{ background:#EEE8AA; }
	
	.newAttrDBWrap .graeser .resultList .c0{ width:20px;}
	.newAttrDBWrap .graeser .resultList .c1{ width:270px;}
	.newAttrDBWrap .graeser .resultList .c2{ width:270px;}
	.newAttrDBWrap .graeser .resultList .c3{ width:105px;}
	
	
/* attrAllWrap */
.attrAllWrap{}

	.attrAllWrap .selection { display:inline-block; }	
	
	.attrAllWrap .optionBar{
		position:fixed;
		bottom:210px;
		right:10px;
		border:1px solid #999;
		padding:8px;
		width:135px;
		background:#FFF;
	}
	
		.attrAllWrap .optionBar .button {
			margin-right:3px;
			margin-bottom:4px;
			color:#333;
		}



.sortAttrWrap{}

.ce_wrap .sortAttrWrap .listBox h3 {
	padding-left:25px;
}
.sortAttrWrap .ui-helper-reset{
    border: 0 none;
    font-size: 100%;
    line-height: 1.3;
    list-style: none outside none;
    margin: 0;
    outline: 0 none;
    padding: 0;
    text-decoration: none;
}

.sortAttrWrap .ui-accordion-header{
	 border: 1px solid #BBB;
	 color: #444;
	 font-weight: bold;
}

.sortAttrWrap .ui-widget-content{
	background:#FFF;
	border:1px solid #BBB;
}

	.sortAttrWrap .optionWrap .editBox {
		position:absolute;
		left: 300px;
		top: 5px;
	}
	.sortAttrWrap .button{
		margin:0 0 0 100px;
	}
	.sortAttrWrap .listBox{
		width:220px;
		margin:0px;
		padding:5px;
	}
	.sortAttrWrap .listBox h2{
		padding-left:25px;
	}
	.sortAttrWrap .listBox .pointer{
		cursor:move;
		border:1px solid #BBB;
		background:#EEE;
		margin:10px;
		text-align:center;
		color:#333;
	}
	
.showImageAttrWrap{}

.ce_wrap .showImageAttrWrap .listBox h3 {
	padding-left:25px;
}
.showImageAttrWrap .ui-helper-reset{
    border: 0 none;
    font-size: 100%;
    line-height: 1.3;
    list-style: none outside none;
    margin: 0;
    outline: 0 none;
    padding: 0;
    text-decoration: none;
}

.showImageAttrWrap .ui-accordion-header{
	 border: 1px solid #BBB;
	 color: #444;
	 font-weight: bold;
}

.showImageAttrWrap .ui-widget-content{
	background:#FFF;
	border:1px solid #BBB;
}

	.showImageAttrWrap .editBox {
		position:absolute;
		left: 300px;
	}
	
	.showImageAttrWrap .editBox .row{
		position:absolute;
		left: 300px;
	}
	
	.showImageAttrWrap select{
		float:left;
	}
	
	.showImageAttrWrap .button{
		margin:-5px 0 0 100px;
	}
	.showImageAttrWrap .listBox{
		width:220px;
		margin:0px;
		padding:5px;
	}
	.showImageAttrWrap .listBox h2{
		padding-left:25px;
	}
	.showImageAttrWrap .listBox .pointer{
		cursor:pointer;
		text-decoration:none;
	}
	.showImageAttrWrap .listBox .row{
		border:1px solid #BBB;
		background:#EEE;
		margin:20px 10px;
		padding:3px;
		height:60px;
		color:#0C3;
	}
	.showImageAttrWrap .listBox .row .lightbox{
		text-align:left;
		float:left;
	}
	.showImageAttrWrap .listBox .row img{
		margin-right:5px;
	}
	.showImageAttrWrap .listBox .row .txt{
		cursor:pointer;
		font-weight:bold;
		opacity:0.8;
	}
	.showImageAttrWrap .listBox .row .txt{ opacity:1;}
	
/********************************************************* Language */

#languagebar{
	margin-top: 10px;
	margin-left: 50px;
}

.graeser .c4 img:first-child{
	margin-right: 30px;
}