/* =reseting
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

body, h1, h2, , h3, h4, ul, li, dl, dt, dd {
	margin: 0;
	padding: 0;
}

a, a:visited { text-decoration: none; }	
fieldset, img { border: none; }
li { list-style: none; }

/* =main
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

html, body {
	height: 100%;
}

body {
	font: normal 100% "Lucida Sans Unicode", "Lucida Grande", LucidaGrande, "Lucida Sans",
	"Bitstream Vera Sans", Geneva, Verdana, sans-serif;
	display: table;
	max-width: 100%;
	margin: 0 auto;
	background: #004c7f url(../images/lars.png) bottom left fixed no-repeat;
	color: #fff;
}

#wrapper {
	width:25em;
	padding-left:13em;
	display: table-cell;
	vertical-align: top;
}

#cell {
	font-size: 0.69em;
	margin: 20px 0;
	padding-bottom: 20px;
/*	background: url(../images/verlauf.png) 0 100% no-repeat;*/
}

#panels {
	padding: 1.82em;
/*	background-color: #80a6bf;*/
}

dt {
	margin-top: 0.45em;
	text-align:center;
	text-shadow: #000 2px 2px 3px;
	font-size: 1.8em;
	color:#fff;
}

dt dt {
	background: none;
	margin: 0;	
}

#about { margin-top: 0; }
#about { background-color: #0d5586; opacity: 50;}
#writing { background-color: #0d5586; }
#interests { background-color: #0d5586; }
#portfolio { background-color: #0d5586; }
#contact { background-color: #0d5586; }

#about:hover { background-color: #7ca3bd; }
#writing:hover { background-color: #6996b4; }
#interests:hover { background-color: #4e83a6; }
#portfolio:hover { background-color: #316e98; }
#contact:hover { background-color: #165b8a; }

dt strong {
	display: block;
	height: 1.71em;
	line-height: 1.55em;
	font-weight: normal;
	padding: 0 1.09em;
	cursor: default;
/*	background: url(../images/right.png) 100% 0 no-repeat;*/
}

dd {
	color: #b3cad9;
	margin: 0.9em 0;
	padding: 0 1.09em;	
}


dd dd {
	margin: 0;
	padding: 0 0 0 1.09em;
}

dd strong {
	color: #e1d7dc;
	font-weight: normal;
}

dd p {
	margin: 0.45em 0;
}

dd dd p { text-align: left; }

dd p, dd ul, dd ol, dd blockquote { line-height: 150%; }
dd li { margin: 0.45em 0; }

dd abbr {
	border-bottom: none;
}

dd a {
	color: #fff;
	border-bottom: 1px dotted;
	
}

dd a:hover {
	border-bottom-style: solid;
	border-bottom-width: 1px;
}


dd a[hreflang="DE"]::after {
	content: "[DE]";
	color: #b0a3a9;
	font-size: 0.82em;
	padding-left: 1ex;
	border-bottom: 1px solid #1c010e;
}

table, td {
	border: 0px;
	padding: 0.2em;
	vertical-align: top;
	}

.email, .xmpp, .tlen, .gadu { 	
	background-position: 0 50%;
	background-repeat: no-repeat;
	padding-left: 20px;
}
.email { background-image: url(../images/mail.png); }
.xmpp { background-image: url(../images/xmpp.png); }
.gadu { background-image: url(../images/gadu.png); }

.pdf { 

	width: 5.5em;
  	height: 5.5em;

}


h3{
margin-bottom: 1em;
}

dd a.noline {
text-decoration: none;
border: 0px solid	;
}
dd a.noline:hover {
text-decoration: none;
border: 0px solid;
}


/* =JS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */


.rt, .lb, .accordion { display: block; }
.js dt { background: url(../images/lt.png) 0 0 no-repeat; }
/*.rt { background: url(../images/rt.png) 100% 0 no-repeat; }
.lb { background: url(../images/lb.png) 0 100% no-repeat; }*/
.js dt strong { 
	background: url(../images/rb.png) 100% 100% no-repeat;  
	position: relative;
	z-index: 10;
}
.shadow {
	text-shadow: #c0c0c0 3px 3px 5px;
}
.clickable { 
	cursor: pointer; 
	-moz-user-select: none;
}
.accordion {
}
.active .clickable { cursor: default; }
.active .accordion {
	background-image: none;
}

#panels dl dt { background: none; }

hr { border-color: #003357; border-width: 1px; border-style: dotted; }