/**
 * rastersysteme.de Stylesheet
 *
 * Standard Screen Layout
 *
 * @author  Stephan Zavodny
 * @link    http://www.rastersysteme.de/
 * @media   screen, projection
 * @site    rastersysteme.de
 * @version 1.0
 */


/**
 * Globaler Reset
 * 
 * @section reset
 * @see     Resetting Again,
 *          http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/
 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

:focus {
	outline: 0;
}

ins {
	text-decoration: none;
}

del {
	text-decoration: line-through;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}


/**
 * Allgemeine Formatierungen
 * 
 * @section basics
 */

body {
	font-family: calibri, helvetica, arial, sans-serif;
	color: #333;
	background-color: #fff;
}

body, .inside {
	position: relative;
	text-align: left;
}

#wrapper {
	width: 960px;
	margin: 0 auto;
}

.block {
	overflow: hidden;
}

.clear, #clear {
	height: 0.1px;
	font-size: 0.1px;
	line-height: 0.1px;
	clear: both;
}

.invisible {
	position: absolute;
	left: -1000px;
	top: -1000px;
	width: 0px;
	height: 0px;
	overflow: hidden;
	display: inline;
}


/**
 * Allgemeine Textformatierungen
 * 
 * @section text basics
 */

p, address {
	margin-bottom: 1.5em;
	font-size: 1em;
	line-height: 1.5em;
}

address {
	font-style: normal;
}

strong {
	font-weight: bold;
}

em {
	font-style: italic;
}

ol, ul, dl dd {
	margin-bottom: 1.5em;
}

ol ol, ul ul {
	margin-bottom: 0;
}

ol li, ul li, dl dt, dl dd {
	font-size: 1em;
	line-height: 1.5em;
}

blockquote {
	margin: -0.375em 65px 1.25em 50px;
	padding: 0.625em 10px;
	border-top: 0.0625em dotted #333;
	border-bottom: 0.0625em dotted #333;
}

blockquote h3 {
	margin: 0;
	line-height: 2em;
	text-indent: -0.3889em;
}

cite {
	margin: 0.4375em 0 0.3125em;
	font-family: calibri, helvetica, arial, sans-serif;
	font-style: normal;
	font-size: 0.8889em;
	line-height: 1.5em;
	text-align: right;
	color: #333;
	display: block;
}

pre {
	margin: 0 0 1.6429em 30px;
	padding-top: 0.0714em;
	font-family: consolas, "lucida console", "courier new", monospace;
	font-size: 0.875em;
	line-height: 1.7143em;
}

p code {
	font-size: 0.875em;
	line-height: 1;
}

code {
	font-family: consolas, "lucida console", "courier new", monospace;
	font-size: 1em;
	background: #eee;
}

code.red {
	color: #900;
}

abbr[title], acronym[title] {
	/* font-variant: small-caps; */
	/* text-transform: lowercase; */
	border-bottom: 0.0625em dotted #333;
	cursor: help;
}

sup {
	font-size: 0.625em;
	line-height: 0;
	vertical-align: super;
}

.date {
	color: #fff;
	background-color: #004b4b;
}

.date_ext {
	padding: 0.0714em 0.2857em;
	font-size: 0.875em;
	line-height: 1.3571em;
}

.leaf li {
	padding-left: 20px;
	background: transparent url(../../tl_files/img/li_leaf.gif) no-repeat scroll 0 0.5625em; /* 9px */
}

.leaf_small li {
	padding-left: 20px;
	background: transparent url(../../tl_files/img/li_leaf.gif) no-repeat scroll 0 0.6429em; /* 9px */
}

.std {
	font-size: 1em;
	line-height: 1.5em;
}

.std_small {
	font-size: 0.875em;
	line-height: 1.7143em;
}

.std_margin {
	margin-bottom: 1.5em;
}

.std_doublemargin {
	margin-bottom: 3em;
}

.dt_ext {
	font-family: georgia, times, serif;
	font-style: normal;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: 0.0625em;
}

::-moz-selection{
	color: #fff;
	background-color: #004b4b;
}

.h1_head::-moz-selection, .h3_head::-moz-selection {
	color: #004b4b;
	background-color: #fff;
}


/**
 * Formatierungen fuer Ueberschriften
 * 
 * @section headlines
 */

h1, h2, h3, h4 {
	font-family: georgia, times, serif;
	font-style: normal;
	font-weight: normal;
}

h2 a, h4 a {
	text-decoration: none;
}

h1 {
	font-size: 3em;
	line-height: 1.25em;
}

.h1_head {
	padding: 3.0417em 0.625em 0.2083em;
	color: #fff;
	background-color: #004b4b;
}

.h1_weblog {
	margin: 0.1053em 0 -0.0789em;
	font-size: 2.375em;
	line-height: 1.2632em;
	text-transform: uppercase;
	letter-spacing: 0.0263em;
}

h2 {
	margin: 0.25em 0 0.3333em;
	padding-bottom: 0.125em;
	border-bottom: 0.0417em dotted #333;
	font-size: 1.5em;
	line-height: 1.25em;
}

.h2_head {
	position: relative;
	bottom: 0.0833em;
	width: auto;
	margin: 0;
	padding: 0;
	border: 0;
	line-height: 1.125em;
	float: right;
}

h3 {
	margin: -0.2222em 0 0.2222em;
	font-size: 1.125em;
	font-style: italic;
	line-height: 1.6667em;
	color: #004b4b;
}

.h3_head {
	margin: 0;
	padding: 0 1.6667em 0.8889em;
	line-height: 2em;
	color: #fff;
	background-color: #004b4b;
}

.h3_weblog {
	margin: 0;
	padding: 0.6111em 0 0.7222em;
	font-size: 1.125em;
	line-height: 1.3334em;
}

h4 {
	font-size: 1em;
	text-transform: uppercase;
	letter-spacing: 0.0625em;
	line-height: 1.5em;
}


/**
 * Allgemeine Formatierungen fuer Links
 * 
 * @section links
 */

a {
	color: #004b4b;
	text-decoration: underline;
}

a:visited {
	color: #333;
}

a:hover, a:active, a:focus {
	color: #333;
	background-color: #d7ff00;
	text-decoration: none;
}

a:active {
	position: relative;
	top: 1px;
}


/**
 * Formatierungen fuer rausgehende Links
 * 
 * @subsection outgoing links
 */

a[href^="http://"], a[href^="skype:"] {
	margin-right: 1px;
	padding-right: 10px;
	background: transparent url(../../tl_files/img/link_out.gif) no-repeat scroll right 3px;
}

a[href^="http://"]:visited, a[href^="skype:"]:visited {
	background: transparent url(../../tl_files/img/link_out_hover.gif) no-repeat scroll right 3px;
}

a[href^="http://"]:hover, a[href^="skype:"]:hover,
a[href^="http://"]:active, a[href^="skype:"]:active,
a[href^="http://"]:focus, a[href^="skype:"]:focus {
	background: #d7ff00 url(../../tl_files/img/link_out_hover.gif) no-repeat scroll right 3px;
}

a.img_href {
	margin-right: 0;
	padding-right: 0;
	background: transparent none;
}


/**
 * Formatierungen fuer Glossar-Links
 * 
 * @subsection glossary links
 */

a.glossar {
	margin-right: 1px;
	padding-right: 11px;
	border-bottom: 0.0625em dotted #004b4b; /* 1px */
	text-decoration: none;
	color: #004b4b;
	background: transparent url(../../tl_files/img/link_glossar.gif) no-repeat scroll right top;
}

a.glossar:visited {
	color: #333;
}

a.glossar:hover, a.glossar:active, a.glossar:focus {
	border-color: transparent;
	color: #333;
	background: #d7ff00 url(../../tl_files/img/link_glossar_hover.gif) no-repeat scroll right top;
}


/**
 * Formatierungen fuer Bilder
 * 
 * @section images
 */

img {
	padding: 9px;
	border: 1px dotted #333;
	display: block;
}

.img_projects {
	margin: 6px 30px 0 0;
}

.img_fleft {
	width: auto;
	float: left;
}

.img_fright {
	width: auto;
	float: right;
}

.img_left {
	margin-right: 15px;
}

.img_center {
	margin: 0.375em 0;
}

.img_right {
	margin-left: 15px;
}

.img_mtop {
	margin-top: 0.375em;
}

.img_mbottom {
	margin-bottom: 1.875em;
}

.img_lb:hover {
	border: 1px solid #d7ff00;
}

.img_author {
	margin-left: 10px;
	padding: 0;
	border: 0;
	display: inline;
}

.img_clear {
	padding: 0;
	border: 0;
}

.icon {
	position: relative;
	top: 2px;
	margin-right: 10px;
	display: inline;
}


/**
 * Formatierungen fuer die Navigation
 * 
 * @section navigation
 */

.mod_navigation {
	position: relative;
	bottom: -0.3125em;
}

.mod_navigation a, .mod_navigation span {
	padding: 0 0.25em;
	font-size: 1em;
	line-height: 1.1875em;
	text-decoration: none;
	display: block;
}

.mod_navigation a:visited {
	color: #004b4b;
}

.mod_navigation a.trail, .mod_navigation a.trail:visited, .mod_navigation span, .mod_customnav span {
	color: #fff;
	background-color: #004b4b;
}

.mod_navigation a:hover, .mod_navigation a:active, .mod_navigation a:focus,
.mod_navigation a.trail:hover, .mod_navigation a.trail:active, .mod_navigation a.trail:focus {
	color: #333;
	background-color: #d7ff00;
}

.mod_navigation ul, .mod_customnav ul {
	margin-bottom: 0;
}

.mod_navigation li {
	width: auto;
	padding: 0 0.375em;
	border-right: 0.0625em dotted #333;
	line-height: 1;
	float: left;
}

.mod_navigation li.first {
	padding-left: 0;
}

.mod_navigation li.last {
	padding-right: 0;
	border: 0;
}

.mod_customnav, .backtotop {
	position: relative;
	top: 0.2857em;
	width: auto;
	float: right;
}

.mod_customnav a, .mod_customnav span {
	padding: 0 0.2857em;
	text-decoration: none;
	display: block;
}

.mod_customnav a:visited {
	color: #004b4b;
}

.mod_customnav a:hover, .mod_customnav a:active, .mod_customnav a:focus  {
	color: #333;
	background-color: #d7ff00;
}

.mod_customnav li {
	width: auto;
	margin-right: 0.4286em;
	padding-right: 0.4286em;
	border-right: 0.0714em dotted #333;
	line-height: 1.2143em;
	float: left;
}

.backtotop a {
	padding: 0 10px 0 0.2857em;
	text-decoration: none;
	background: transparent url(../../tl_files/img/link_top.gif) no-repeat scroll right 1px;
}

.backtotop a:visited {
	color: #004b4b;
}

.backtotop a:hover, .backtotop a:active, .backtotop a:focus {
	color: #333;
	background: #d7ff00 url(../../tl_files/img/link_top_hover.gif) no-repeat scroll right 1px;
}


/**
 * Formatierungen fuer den Kopfbereich
 * 
 * @section header
 */

#header {
	padding-top: 64px;
}

.typo {
	margin-bottom: 0.6875em;
	padding: 0.9375em 0;
	border-top: 0.0625em dotted #333;
	border-bottom: 0.0625em dotted #333;
	clear: both;
}


/**
 * Formatierungen fuer den Hauptbereich
 * 
 * @section container
 */

#main {
	position: relative;
	width: auto;
	margin-bottom: 0.75em;
}

#right, .right {
	float: right;
	width: 300px;
}

#right ul {
	margin-bottom: 1.4375em;
	padding-top: 0.0625em;
}

#right li {
	font-size: 0.875em;
	line-height: 1.7143em;
}

.col1, .col2, .col3 {
	width: 300px;
	float: left;
}

.col1 {
	clear: left;
}

.col2, .col3 {
	margin-left: 30px;
}

.col1-2 {
	float: left;
	width: 630px;
}

.two-coloumn-layout #main {
	margin-right: 300px;
	padding-right: 30px;
}


/**
 * Formatierungen fuer den Fussbereich
 * 
 * @section footer
 */

#footer {
	margin-bottom: 3.4286em;
	border-top: 0.0714em dotted #333;
	font-size: 0.875em;
	line-height: 1.2143em;
	clear: both;
}

.copyright {
	position: relative;
	top: 0.2857em;
	width: auto;
	float: left;
}

.copyright p {
	margin-bottom: 0;
	line-height: 1.2143em;
}


/**
 * Formatierungen fuer die Projekteseite
 * 
 * @section layout projects
 */

.projects p {
	margin-bottom: 0;
}

.projects ul {
	margin-left: 660px;
}

.projects .ce_text {
	margin-bottom: 1.125em;
}

.projects .last {
	margin-bottom: 1.875em;
}

.projects .date {
	position: absolute;
	top: 16px;
	left: 10px;
	padding: 0 0.2857em;
}


/**
 * Formatierungen fuer die Weblog-Uebersichtseite
 * 
 * @section layout weblog-teaser
 */

.layout_short .date {
	margin-right: 0.5714em;
}


/**
 * Formatierungen fuer die Weblog-Marginalspalte
 * 
 * @section layout weblog-sidebar
 */

.mod_twitterreader .date {
	margin-right: 0.3571em;
	padding: 0.0714em 0.2857em;
}

.mod_twitterreader .even, .mod_twitterreader .odd {
	margin-bottom: 0.8571em;
}

.mod_twitterreader .last {
	margin-bottom: 0;
}

.mod_tagcloudnews li {
	padding-right: 10px;
	display: inline;
}

.abo .rss {
	padding-left: 26px;
	background: transparent url(../../tl_files/img/icons/rss_16x16.png) no-repeat scroll 0 3px;
}

.abo .twitter {
	padding-left: 26px;
	background: transparent url(../../tl_files/img/icons/twitter_16x16.png) no-repeat scroll 0 3px;
}


/**
 * Formatierungen fuer die einzelnen Weblog-Artikel
 * 
 * @section layout weblog-article
 */

.info {
	padding-bottom: 0.1429em;
	text-transform: uppercase;
	letter-spacing: 0.1429em;
}

p.init:first-letter {
	width: auto;
	padding: 0.1373em 0.1176em 0 0;
	font-family: georgia, times, serif;
  font-size: 3.1875em;
  line-height: 0.6275em;
  color: #004b4b;
	float: left;
}

.init .uppercase {
	font-family: georgia, times, serif;
	font-size: 0.875em;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.1429em;
	display: inline-block; /* wichtig fuer Opera */
}

.comment_default {
	min-height: 3em;
	margin-bottom: 0.75em;
	padding-bottom: 2.1875em;
	border-bottom: 0.0625em dotted #333;
}

.comment_author {
	float: left;
	width: 300px;
	margin: 0 30px 1.5em 0;
	overflow: hidden;
}

.comment_author .date {
	color: #333;
	background-color: transparent;
}

.ce_comments .last {
	margin-bottom: 1.1875em;
	border-bottom: 0;
}


/**
 * Formatierungen fuer die Weblog-Schlagwoerter
 * 
 * @section layout weblog-tags
 */

.tag-chain dt {
	padding: 0 0.625em 0 20px;
	background: transparent url(../../tl_files/img/li_leaf.gif) no-repeat scroll 0 0.375em;
	display: inline;
}

.tag-chain dd {
	margin-bottom: 0;
	padding-right: 10px;
	background: transparent none;
	display: inline;
}


/**
 * Formatierungen fuer die Weblog-Formulare
 * 
 * @section layout weblog-form
 */

form {
	margin-bottom: 1.4375em;
	padding-top:  0.0625em;
}

.text, .captcha, .textarea, .submit {
	margin: 0 0 0.75em 0;
	font-family: calibri, helvetica, arial, sans-serif;
	font-size: 1em;
}

.text, .captcha {
	width: 224px;
	padding: 0.0625em 0.25em 0.125em;
	border: 0.0625em solid #ccc;
	color: #333;
	background-color: #fff;
}

.textarea {
	width: 620px;
	height: 9em;
	padding: 0.25em;
	border: 0.0625em solid #ccc;
	line-height: 1.5em;
	color: #333;
	background-color: #fff;
}

.submit {
	width: auto;
	padding: 0.0625em 0.3125em 0.125em;
	border: 0 none;
	color: #fff;
	background-color: #004b4b;
	cursor: pointer;
	overflow: visible;
}

.submit:hover {
	color: #333;
	background-color: #d7ff00;
}

.submit:active {
	position: relative;
	top: 1px;
	color: #333;
	background-color: #d7ff00;
}

.submit:focus {
	color: #333;
	background-color: #d7ff00;
}

button.submit {
	margin: 0 0 0 0.375em;
}

p.error {
	margin: -0.0625em 0 0.8125em;
	color: #c00;
}

.search form {
	margin-bottom: -0.0625em;
}

input#keywords {
	width: 160px;
	margin: 0;
}

input.text:hover, input.captcha:hover, .textarea:hover {
	border: 0.0625em solid #d7ff00;
}

input.text:focus, input.captcha:focus, .textarea:focus {
	border: 0.0625em solid #999;
	background-color: #f7f7f7;
}


/**
 * Formatierungen fuer die Weblog-Suche
 * 
 * @section layout weblog-search
 */

.context {
	margin-bottom: 0;
}

.highlight {
	background-color: #eee;
}

.mod_search .url {
	color: #999;
}


/**
 * Formatierungen fuer die FAQ-Seite
 * 
 * @section layout faq
 */

.mod_glossaryMenu li {
	float: left;
	width: auto;
}

.mod_glossaryMenu a {
	margin-right: 0.3125em;
	padding: 0.125em 0.3125em;
	text-decoration: none;
	color: #fff;
	background-color: #004b4b;
}

.mod_glossaryMenu a:visited {
	color: #fff;
}

.mod_glossaryMenu a:hover, .mod_glossaryMenu a:active, .mod_glossaryMenu a:focus {
	color: #333;
	background-color: #d7ff00;
}

.mod_glossaryList dd {
	margin-bottom: 0;
}

.mod_glossaryList a.jumplabel {
	border-bottom: 0.0625em dotted #004b4b;
	text-decoration: none;
}

.mod_glossaryList a.jumplabel:hover, .mod_glossaryList a.jumplabel:active, .mod_glossaryList a.jumplabel:focus {
	border-color: transparent;
}

.footnote {
	list-style: decimal inside;
	background: transparent none;
}

.source {
	text-decoration: none;
}