@charset 'utf-8';
@import url(reset.css);
@import url(lightbox.css);


/* Neuer Kommentar - es geht lustig weiter mit dem Testen */

/* ------------------------------------------------------ All browsers */

html {
	background: #edddcc url(img/pattern-2c-bg.png) -55px -1px repeat fixed;}

body {
	font: 14px/1.4 "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif;
	color: #444;
	background: transparent url(img/pattern-1c-bg.png) left -1px repeat-y fixed;}
	
#header {
	position: fixed;
	left: 0; top: 0;
	width: 295px;
	background: transparent url(img/header-img.jpg) left top no-repeat;
	z-index: 200;}
	
#header, #footer {
	color: #6c7c5f;
	color: #5f6c54;
	font-size: 12px;}
	
#header h1 a {
	position: relative; left: 0; top: 162px;
	display: block;
	width: 100%; height: 85px;
	text-indent: -9999px;
	background: transparent url(img/twittagessen-logo24.png) left -85px no-repeat;}
	
#header h1 a:hover {
	border: none !important;
	background: transparent url(img/twittagessen-logo24.png) left top no-repeat;}
	
#header dl {
	width: 165px;
	margin: 180px 0 0 55px;
	background: #edefe4;}
	
#header dt, #header dd {
	display: inline;}

#header a, #footer a, #content p a, .event-venue a, .twitter-comments a  {
	font-weight: bold;
	color: #009cb3;}
		
#footer a {color: #5f6c54; }
	
#header a:hover, #footer a:hover, #content p a:hover, .event-venue a:hover, .twitter-comments a:hover{
	color: #007b8c;
	border-bottom: 1px solid #007b8c;}
	
#header a:active, #footer a:active, #content p a:active, .event-venue a:active, .twitter-comments a:active {
	position: relative; bottom: -1px;
	color: #006775;
	border-bottom: 2px solid #006775;}	

/* !content ============================ */
	
#content {
	width:420px;
	margin: 0 0 -40px 275px;
	padding: 55px 75px;}

/* !content typo ----- */

h2 {
	clear: both;
	height: 36px; width: 100%;
	margin: 50px 0 15px 0;
	color: #645b4e;
	text-indent: -9999px;
	background: transparent url(img/headlines.png) no-repeat;}
	
h2:first-child {
	margin-top: -20px;}

h2.naechste-te {
	background-position: left top; }
h2.te-details {	
	background-position: left -36px}		
h2.neues-te {	
	background-position: left -72px}
h2.anleitung {	
	background-position: left -108px}
h2.hintergrund {	
	background-position: left -144px}
h2.impressum {	
	background-position: left -180px}

h2#oreilly {width: auto; height: auto; margin: 80px 0 10px 0; background: none; text-indent: 0; font-size: 30px; font-weight: bold; font-family: Helvetica, Arial, sans-serif;}	

	
#content p {
	margin: 0 0 20px 0;}
	
#content em {
	font-family: Georgia, sans-serif;}
	
	
/* !top menu ============================ */

#topmenu {
	position: fixed; left:275px; top: 0; 
	width: 525px; height: 40px;
	padding: 0 0 0 45px;
	-moz-box-shadow: 0 0 5px #ccc;
	-webkit-box-shadow: 0 0 5px #ccc;
	text-align: center;
	background: rgba(250, 250, 250, 0.70);
	z-index: 100;}	
	
#topmenu li {
	float: left;
	width: auto; height: 20px;
	line-height: 20px;
	margin: 10px 10px 0 0;}
	
#topmenu li a {
	display: block;
	padding: 0 8px;
	font-size: 11px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	color: #fff;
	font-weight: bold;
	background: #afaaa4;}
		
#topmenu li a:hover {
	background: #444;}
	
#topmenu li a:active {
	position: relative; bottom: -1px;}

#topmenu li a.active {
	background: #9b0047;}

#erase-the-shadow {
	position: fixed; left: 845px; top: 0;
	width: 20px; height: 60px;
	background: #edddcc;
	z-index: 500;}

/* !search form ============================ */

#search-te {
	margin: 0 0 10px 0;}

#search-te p {
	float: left;}
	
#search-te label, #add-te label {
	position: absolute;
	left:-9999px;
	top: -9999px;}
	
.error {
	margin: 0 0 15px 0;
	font-style: italic;
	color: #9b0047 !important;}
	
#place, #keyword, #search {
	width: 141px; height: 16px;
	font-size: 13px;
	margin: 0 10px 0 0;
	padding: 5px;
	color: #07889a;
	border: 2px solid #96d8e2;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	background: #96d8e2;}
	
#place:focus, #keyword:focus {
	border-color: #2eb2c5;}
	
#search {
	width: 90px; height:auto;
	margin: 0;
	padding:7px 0 7px 0; 
	color: #fff; 
	font-weight: bold;
	border: none;
	background: #2eb2c5; }
	

#search:hover, .add:hover 106
	
#search:active, .results-moreinfos li a:active, .add:active {
	position: relative; bottom: -1px;
	background-color: #007080;}	


/* !search results ============================ */


#pager {
	position: relative;
	height: 22px;
	line-height: 22px;
	margin: 0 0 30px 0;
	text-align: center;
	font-weight: bold;
	color: #fff;
	font-size: 14px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	background: #666;}

#pager-prev {
	position: absolute;
	left: 3px; bottom: 0;}
	
#pager-next {
	position: absolute;
	right: 3px; bottom: 0; }


.venue {
	position: relative;
	margin: 0 0 40px 0;
	background: #ccc:}

h3, h4 {
	margin: 0 0 10px 0;
	font-size: 18px;font-weight: bold;
	color: #9b0047;
	font-family: Helvetica, Arial, sans-serif;}

h3 span {
	font-weight: bold;
	color: #725546;}
	
h4 {
	position: relative; color: #9b0047;
	font-size: 18px;font-weight: bold;}
	
h4 em span, #event-det em span {
	display: none;}
	
h4 em, #event-det em {
	display: inline-block;
	width: 80px; height: 100%; text-indent: -9999px;}
	
h5 {
	margin: -20px 0 0 0 ;
	font-weight: bold;
	font-style: italic;}

.rating-0 {
	background: transparent url(img/sprites.png) -80px -106px no-repeat;}
.rating-1 {
	background: transparent url(img/sprites.png) -64px -106px no-repeat;}	
.rating-2 {
	background: transparent url(img/sprites.png) -48px -106px no-repeat;}
.rating-3 {
	background: transparent url(img/sprites.png) -32px -106px no-repeat;}
.rating-4 {
	background: transparent url(img/sprites.png) -16px -106px no-repeat;}
.rating-5 {
	background: transparent url(img/sprites.png) left -106px no-repeat;}
		
.venue-img {
	float: left; text-align: center;
	width: 75px; height: 75px;
	margin-right: 15px;
	overflow: hidden;
	color: #d8a193;
	background: transparent /* #edddcc*/;}
	
#content .venue-img p {
	color: #9d805f;
	margin: 25px 0 0 0 !important;}

.vcard {
	float: left;
	width: 230px; min-height: 57px;
	line-height: 1.2em;
	font-weight: bold;}
	
.org {
	display: none;}

.results-moreinfos {
	float: left; width:235px; }

.results-moreinfos li {
	float: left; width: 110px;}

.results-moreinfos li a {
	display: block;
	width: 83px; height: 17px;
	padding: 1px 0 0 22px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	background: #afaaa4 url(img/ext-link-icon24.png) 8px 3px no-repeat;}	

.results-moreinfos .qype-link {
	width: 100px;}
	
.results-moreinfos .qype-link a {
	width: 73px !important;}

.results-moreinfos li a {
	color: #fff;font-size: 11px; font-weight: bold; }
.results-moreinfos li a:hover, .results-moreinfos li a:active {
	background-color: #333;}
	

	
	
/* !Add TE Form ============================== */


#add-te {
	position: absolute;
	right: 0; bottom: 0;
	width: 90px; }
	
#add-te p {
	margin: 0;}

.date, .time, .add {
	width: 80px; height: 13px;
	margin: 0 0 3px 0;	
	padding: 3px;
	font-size: 13px; text-align: center;
	color: #07889a;
	border: 2px solid #96d8e2;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	background: #96d8e2;}

.date:focus, .time:focus {
	border-color: #2eb2c5;}
	
	
.add {
	width: 100%; height:auto;
	margin: 0;
	padding:3px 0 3px 0; 
	color: #fff; 
	font-weight: bold;
	border: none;
	background: #2eb2c5; }
	
.bubbleInfo {}
	
/*.popup {
	position: absolute;
	width: 84px;
	padding: 3px;
	color: #07889a;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	background: #96d8e2;}*/
	

/* !events ============================ */

#index-intro {padding-top:20px; color: #333;}
#index-intro ul {margin-bottom: 20px;}
#index-intro li {margin-left:20px; color: #777; font-size: 18px; line-height:1.6em; font-family: Georgia, serif; font-style:italic; list-style-type: disc;}
#index-intro li span {color: #333;}

.ne-te {
	position: relative;
	margin: 0 0 30px 0;
	background: transparent url(img/dotted-line.png) left top repeat-x;}

.te-event {
	position: relative;
	padding: 4px 0 5px 0;
	font-weight: bold;
	background: transparent url(img/dotted-line.png) left bottom repeat-x;}
	
.te-event.oreilly {background-color: rgba(46,178,197,.2);}
	
.event-date {
	color: #9b0047;
	font-weight: normal;}
	
/* !special events ---------- */

#te-451 {background:#d7f1f5; background: rgba(46,178,197,.1)}


	
/* !Listing ---------- */
	
.when {
	float: left;
	width: 70px;
	text-align: right;}
	
.where {
	margin: 0 0 0 90px;
	width: 255px; 
	text-align: left;}
	
.event-city {
	display: block;
	font-size: 16px;}
	

.event-time, .event-venue, .event-part {
	display: block;
	font-size: 14px;}
	
.event-time {
	font-size: 16px;
	background: transparent url(img/sprites.png) -145px 4px no-repeat;}
	
.ne-te .event-time {
	}
	
.ne-te .event-part {
	color: #999;
	padding:0 0 0 23px;
	text-align: left;
	height: 20px;
	background:transparent url(img/sprites.png) -145px -22px no-repeat;}

.event-moreinfos a {
	position: absolute;
	right: 2px; top: 7px;  /* Changing top value affects a:active further down */
	width: 36px; height: 35px;
	padding:0;
	display: block;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-indent: -9999px;
	background: transparent url(img/sprites.png) left top no-repeat;}
	
.event-moreinfos a:hover  {
	background-position: left -35px;}
	
.event-moreinfos a:active  {
	background-position: left -70px;}
	

	 
/* !event details ============================ */	

h3 a.cal-link {padding-left:5px; color:#009cb3;font-size:12px;font-weight:bold;}
h3 a.cal-link:hover {text-decoration:underline;} 

#event-det .te-event {
	margin-left: -15px;
	background: none;}

#event-det .venue-img {
	margin: 0 20px 0 0;}

#event-det .event-venue, #event-det .event-time {
	font-weight: bold;
	font-size: 16px;}

#event-det .where {
	margin: 0 0 0 110px;}
	
#event-det .when {
	margin-left:20px;}
	
#event-det .event-time {
	background-position: -145px 3px;}
	
#event-det .vcard {
	font-weight: normal;}
	
#event-det .results-moreinfos {
	width: 305px}

#event-det .join-te a, #event-det .del-from-te a {
	position: absolute; right: 45px; bottom: 0px;
	display: block; width: 35px; height: 35px;
	margin: 0; padding: 0px;
	text-indent: -9999px;
	border: none;
	text-align: center;
	background: transparent url(img/sprites.png) -36px top no-repeat;}
	
#event-det .del-from-te a {
	right: 0px;
	background: transparent url(img/sprites.png) -71px top no-repeat;}
	
#event-det .join-te a:hover {background-position: -36px -35px;}
#event-det .join-te a:active {background-position: -36px -70px;}
	
#event-det .del-from-te a:hover {background-position: -71px -35px;}
#event-det .del-from-te a:active {background-position: -71px -70px;}
	
.twitter-comments li {
	margin: 0 0 15px 0;}
	
p.hint {
	font-size: 11px;
	color: #666;}
	
p.important {}
	
.veryimportant {
	color: #9b0047;}

#content .twitter-comments p.hint {
	font-size: 14px;}
	
.twitter-comments .hint strong {
	color: #444;	font-weight: bold;}	
	
cite.c-user {
	padding: 0 0 6px 0;
	background: transparent url(img/comment-arrow.png) 20px bottom no-repeat;}
	
.c-user small {
	font-size: 0.8em; color: #999;}	

/*.twitter-comments .c-date {
	float: left; 
	width: auto; height:20px;
	padding: 3px 0 0 7px;
	text-align: left;
	color: #999;
	font-size: 0.8em;}	*/
	
blockquote.c-text {
	margin: 4px 0 0 0;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	padding: 8px 40px 8px 8px;
	color: #007b8c;
	font-size: 12px;
	background: #d5f0f3 url(img/twitterbird.png) right top no-repeat;}	 /*rgba(157,232,243,0.50)*/
	
.twitter-comments .c-hash {
	color: #444;}
	
	
/* !Hints Teilnahme/Absage ---------- */

.trigger {
	position: absolute; right: 0;}
	
.popup {
    position: absolute;
	padding: 3px;
	color: #444;
	font-size: 10px;
	text-align: center;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	background: #eee; z-index: 1000;
    display: none; /* keeps the popup hidden if no JS available */
}
	
/* !archive =================== */

#archivtabelle {-webkit-border-top-left-radius:4px;-webkit-border-top-right-radius:4px;-moz-border-radius-topleft:4px;-moz-border-radius-topright:4px;width:420px;table-layout:fixed; font-size:14px;font-family:"Graublau Web", "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif; }
#archivtabelle td {padding:10px 5px;background: transparent url(img/dotted-line.png) left bottom repeat-x;}
#archivtabelle thead {font-weight:bold; color:#fff;}
#archivtabelle th {padding:5px;background:#007b8c;}
#archivtabelle th:first-child {-moz-border-radius-topleft:4px;-webkit-border-top-left-radius:4px;border-top-left-radius:4px}
#archivtabelle th:last-child {-moz-border-radius-topright:4px;-webkit-border-top-right-radius:4px;border-top-right-radius:4px}

td.arc-id, th.arc-id {width:40px;font-weight:bold; color:#fff;}
td.arc-id a {color:#007b8c;}
.arc-date {width:80px;}
.arc-part {width:40px;}
.arc-city {width:140px;}
.arc-venue {}

#archivtabelle .row-even td {background-color: rgba(0,123,140,0.05);}


	
/* !howto, infos ============================ */	
	
blockquote.idea {
	position: relative;
	padding: 0 35px;
	font-weight: bold;
	font-family: Georgia, sans-serif;
	font-style: italic;}

blockquote.idea .openquote, blockquote .closequote {
	position: absolute;
	width:22px; height: 18px;
	text-indent: -99999px;
	background: transparent url(img/quotes24.png) left top no-repeat;}	
	
blockquote.idea span.openquote {
	left: 0; top: 10px;
	background-position: -22px top;}
	
span.closequote {
	right: 0; bottom: 10px;}		
  
/* !footer ============================ */

#footer {
	position: fixed;
	left: 0; bottom: 0;
	width: 280px; height: 90px;
	background: transparent url(img/footer-bg.png) left top no-repeat;}
	
#footer p {
	width: 200px;
	margin: 25px 0 0 40px;
	font-size: 12px;}


/* ----------------------------------------------------- JS enabled browsers */

.js div { }

/* ----------------------------------------------------- IE7 and below */

.ie7 h4 em { 
	display: inline; /* IE ≤ 7 and Firefox < 3 don't know display:inline-block */
	zoom: 1;}
	
.ie7 #topmenu {
	background: #fff;}
	
#header p.ie-hint {
	font-style: italic;
	width: 195px;
	margin: 10px 0 0 55px}

/* ----------------------------------------------------- IE6 and below */

.ie6 #header, ie6 #topmenu {
	position: absolute; }
	
#ie-greetings {
	position: absolute; left: 275px; top: 0;
	width: 560px; padding: 5px;
	color: #fff;
	background: #aa0000;}