@charset "UTF-8";

/* 

Styles made by Wirkstoff . Designbureau | Martin Kaniut | www.derwirkstoff.de
Handmade in CSSEdit by macrabbit | www.macrabbit.com

© 2008 fruux

 */


/*
	box-shadow: 0px 0px 5px #888;
	-webkit-box-shadow: 0px 0px 5px #888;
	-moz-box-shadow: 1px 0px 5px #888;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	*/


/* @group Grundformate */

body { margin:0; padding:0; font-size:100.01%; text-align:left; position:relative;	
	background-color: #e5e2d3;
}
select, input, textarea { font-size:99%; }
form  { margin:0; padding:0; }
img { border:0;	
	vertical-align: bottom;
}

div {
	overflow: hidden;
}

a,
div,
em,
input,
label,
li,
ol,
p,
select,
span,
td,
th,
textarea,
u,
ul
{
	color: #333135;
	font: 12px/20px "Lucida Grande", Arial, Verdana, sans-serif;
}

p {
	margin: 0;
}

h1 {
	font: bold 20px/25px "Lucida Grande", Arial, Verdana, sans-serif;
	margin-bottom: 0px;
	margin-top: 0;
}

h2 {
	font: bold 14px/20px "Lucida Grande", Arial, Verdana, sans-serif;
	margin-bottom: 0px;
	margin-top: 0;
	text-transform: uppercase;
}

h3 {
	font: bold 12px/20px "Lucida Grande", Arial, Verdana, sans-serif;
	margin-top: 0;
	margin-bottom: 0;
}

.flt_left {
	float: left;
}

.flt_right {
	float: right;
}

.clr {
	clear: both;
}

/* @end Grundformate */

/* @group Header */

div#header {	
	width: 880px;
	background-image: url(/tl_files/headnavi/hn_bg.png);
	padding-left: 80px;
	box-shadow: 0px 0px 5px #888;
	-webkit-box-shadow: 0px 0px 5px #888;
	-moz-box-shadow: 1px 0px 5px #888;
	border-bottomradius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;	
	margin: 20px 10px 10px 10px;
}

div#logo {	
	width: 190px;
	background-image: url(/tl_files/headnavi/hn_bg.png);	
	height: 100px;
}

div#header div.mod_customnav.block {
	float: left;
	width: 560px;
	height: 100px;
	padding-right: 100px;	
}

div#header div.inside div.mod_customnav.block ul.level_1 {
	list-style-type: none;
	overflow: hidden;
	margin: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
}

div#header div.inside div.mod_customnav.block ul.level_1 li {
	float: left;
}

div#header div.inside div.mod_customnav.block ul.level_1 li a,
div#header div.inside div.mod_customnav.block ul.level_1 li span {
	width: 79px;
	text-align: center;
	padding-bottom: 5px;
	padding-top: 75px;
	text-decoration: none;
	display: block;
}

/* @group Button Fruux */

div#header div.inside div.mod_customnav.block ul.level_1 li.fruux a {
	background-image: url(/tl_files/headnavi/hn_fruux_n.png);
}

div#header div.inside div.mod_customnav.block ul.level_1 li.fruux a:hover {
	background-image: url(/tl_files/headnavi/hn_fruux_o.png);
}

div#header div.inside div.mod_customnav.block ul.level_1 li.fruux active,
div#header div.inside div.mod_customnav.block ul.level_1 li.fruux a.trail {
	background-image: url(/tl_files/headnavi/hn_fruux_a.png);
	background-color: #ffe83c;
}

div#header div.inside div.mod_customnav.block ul.level_1 li.fruux span.active,
div#header div.inside div.mod_customnav.block ul.level_1 li.fruux a.trail {
	background-image: url(/tl_files/headnavi/hn_fruux_a.png);
}

/* @end Button Fruux */

/* @group Button Blog */

div#header div.inside div.mod_customnav.block ul.level_1 li.blog a {
	background-image: url(/tl_files/headnavi/hn_blog_n.png);
}

div#header div.inside div.mod_customnav.block ul.level_1 li.blog a:hover {
	background-image: url(/tl_files/headnavi/hn_blog_o.png);
}

div#header div.inside div.mod_customnav.block ul.level_1 li.blog span.active,
div#header div.inside div.mod_customnav.block ul.level_1 li.blog a.trail {
	background-image: url(/tl_files/headnavi/hn_blog_a.png);
}

/* @end Button Blog */

/* @group Button FAQ */

div#header div.inside div.mod_customnav.block ul.level_1 li.faq a {
	background-image: url(/tl_files/headnavi/hn_faq_n.png);
}

div#header div.inside div.mod_customnav.block ul.level_1 li.faq a:hover {
	background-image: url(/tl_files/headnavi/hn_faq_o.png);
}

div#header div.inside div.mod_customnav.block ul.level_1 li.faq span.active,
div#header div.inside div.mod_customnav.block ul.level_1 li.faq a.trail {
	background-image: url(/tl_files/headnavi/hn_faq_a.png);
}

/* @end Button FAQ */

/* @group Button Support Us */

div#header div.inside div.mod_customnav.block ul.level_1 li.support_us a {
	background-image: url(/tl_files/headnavi/hn_supportus_n.png);
}

div#header div.inside div.mod_customnav.block ul.level_1 li.support_us a:hover {
	background-image: url(/tl_files/headnavi/hn_supportus_o.png);
}

div#header div.inside div.mod_customnav.block ul.level_1 li.support_us span.active,
div#header div.inside div.mod_customnav.block ul.level_1 li.support_us a.trail {
	background-image: url(/tl_files/headnavi/hn_supportus_a.png);
}

/* @end Button Support Us */

/* @group Button Contact */

div#header div.inside div.mod_customnav.block ul.level_1 li.contact a {
	background-image: url(/tl_files/headnavi/hn_contact_n.png);
}

div#header div.inside div.mod_customnav.block ul.level_1 li.contact a:hover {
	background-image: url(/tl_files/headnavi/hn_contact_o.png);
}

div#header div.inside div.mod_customnav.block ul.level_1 li.contact span.active,
div#header div.inside div.mod_customnav.block ul.level_1 li.contact a.trail {
	background-image: url(/tl_files/headnavi/hn_contact_a.png);
}

/* @end Button Contact */



/* @end Header */

/* @group Download Area */

div#download_area {
	margin-right: auto;
	margin-left: auto;
	width: 980px;
	height: 320px;
	background-image: url(/tl_files/download/download_area_bg.png);	
	margin-top: 10px;
}

div#download_area div#download_button {
	width: 240px;
	float: left;
}

div#download_area div#quickinfo div#text{
	width: 390px;
	float: left;
	padding-right: 20px;
	padding-left: 10px;
}

div#download_area div#quickinfo div#text h1 {
	margin-top: 65px;
	margin-bottom: 40px;
	color: #666368;
}

div#download_area div#quickinfo div#text p {	
	padding-top: 10px;
}


/* @end Download Area */

/* @group Container */

/* @group Hauptteil */

div#main h1 {
	text-transform: uppercase;
	border-bottom-color: #bdb9be;	
	color: #2c609d;	
	margin: 30px 90px 20px 28px;
}

div#main h2 {
	border-bottom: 1px dashed #bdb9be;
	padding-bottom: 4px;
	color: #696a69;	
}

div#main h3 {
	margin-bottom: 10px;
	border-bottom: 1px dashed #bdb9be;
}

div#main ul {
	list-style-type: none;
	margin: 10px 20px;
	padding: 0;
}

div#main ul li{
	background: url(/tl_files/global/bullet_green.png) no-repeat left 2px;
	padding-left: 20px;
}

div#main .mod_article {	
	background-color: #fff;
	box-shadow: 0px 0px 5px #888;
	-webkit-box-shadow: 0px 0px 5px #888;
	-moz-box-shadow: 1px 0px 5px #888;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;	
	width: 720px;	
	margin-top: 10px;	
	margin-left: 10px;	
	margin-bottom: 10px;
}

/*
div#main div.article {
	margin-top: 20px;
	clear: both;
}

div#main div.article div.block_3 {
	width: 220px;
	float: left;
	margin: 10px;
}

div#main div.article div.block_3 p{
	margin-left: 70px;
}

*/


div#main div.ce_text.block div.image_container {	
	padding-right: 10px;	
	padding-bottom: 10px;
}

/* @group Tabs */

div#main div.inside div.mod_navigation {
	background-image: url(/tl_files/global/content_tab_bg.png);	
	background-color: #fff;
	box-shadow: 0px 0px 5px #888;
	-webkit-box-shadow: 0px 0px 5px #888;
	-moz-box-shadow: 1px 0px 5px #888;
	border-radius:5px 0;
	-webkit-border-radius: 5px;
	-moz-border-radius:5px;	
	width: 720px;	
	margin-bottom: 0;	
	margin-top: 10px;	
	margin-left: 10px;
}

div#main div.inside div.mod_navigation ul {
	margin: 0 0 0 20px;
	padding: 0;
	list-style-type: none;
	overflow: hidden;	
	list-style-image: none;	
	background-image: none;
}

div#main div.inside div.mod_navigation ul li {
	float: left;	
	margin-right: 20px;	
	margin-left: 20px;	
	padding: 0;	
	background-image: none;
}

div#main div.inside div.mod_navigation ul li a,
div#main div.inside div.mod_navigation ul li span {
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: center;
	text-decoration: none;
	color: #728817;	
}

div#main div.inside div.mod_navigation ul li a:hover {
	color: #576600;
}

div#main div.inside div.mod_navigation ul li.active span {
	font-weight: bold;
	color: #fff;	
	background: url(/tl_files/global/content_tab_a.png) no-repeat center bottom;
}

/* @end Tabs */

/* @group Text_Content */

div.ce_text.block {	
	margin: 0 80px 20px 30px;
}



/* @end Text_Content */

/* @group Media */

div#media.article {	
	background-image: url(/tl_files/fruux/bg_hellgruen.png);
}



/* @end */

/* @group Features */

div#features div.ce_text.block,
div#features24 div.ce_text.block {	
	width: 300px;	
	float: left;	
	margin-bottom: 40px;	
	margin-left: 28px;	
	margin-right: 28px;
}

div#features div.ce_text.block p,
div#features24 div.ce_text.block p {	
	padding-left: 70px;
}

/* @end Features */

/* @group Changelog */

div#changelog {
}

div#changelog ul li.cl_feature {
	background: url(/tl_files/global/cl_feature.png) no-repeat left 2px;
	padding-left: 20px;
}

div#changelog ul li.cl_fix {
	background: url(/tl_files/global/cl_fix.png) no-repeat left 2px;
	padding-left: 20px;
}



/* @end Changelog */

/* @group Roadmap */

div#roadmap {
}



/* @end Roadmap */

/* @group FAQ */

#faq div.mod_faqlist {	
	margin-left: 30px;	
	margin-right: 80px;
}

div#main div#read .mod_faqreader h1 {
	font: bold 14px/20px "Lucida Grande", Arial, Verdana, sans-serif;
	margin-bottom: 0px;
	margin-top: 0;
	text-transform: uppercase;
	border-bottom: 1px dashed #bdb9be;
	padding-bottom: 4px;
	color: #696a69;	
	
}

/* @end */

/* @group Sitemap */

div#sitemap div.mod_sitemap.block ul.level_1 li.submenu.faq ul {	
	display: none;
}



/* @end */

/* @group Press */

div#press-kit div.ce_text.block div.image_container,
div#in-the-media div.ce_text.block div.image_container {	
	margin-top: 10px;	
	float: left;
}




div#in-the-media div.ce_download.block,
div#press-kit div.ce_download.block  {	
	margin-left: 30px;	
	margin-right: 80px;	
	padding: 5px 10px;	
	margin-bottom: 30px;	
	background-color: #e5e2d3;
}

div#in-the-media div.ce_text.block p,
div#press-kit div.ce_text.block p {	
	margin-top: 10px;	
	padding-left: 180px;
}



/* @end */


/* @end  */

/* @group Rechte Spalte */

div#right {
	width: 220px;
	float: right;
	padding-top: 0;
	margin-right: 10px;
}

div#right div.bubble {
	background: #fff url(/tl_files/global/bubble_bottom.png) no-repeat center bottom;	
	padding-bottom: 30px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;	
	padding-top: 10px;	
	margin-bottom: 10px;
}

div#right div.bubble h3 {
	padding-right: 10px;
	padding-left: 10px;
	padding-top: 10px;
	text-align: right;
}

div#right div.bubble p {
	padding-right: 10px;
	padding-left: 10px;
	font-size: 10px;
	line-height: 15px;
}

/* @group Twitter Box */

div#right div#twitter.bubble {	
	padding-top: 0;
}

div#right div#twitter.bubble h3 {
	background: #fff url(/tl_files/global/bubble_top_twitter.png) no-repeat center top;
	padding-top: 25px;	
	padding-bottom: 5px;
}

div#right div#twitter.bubble h3 a{
	color: #212d98;
	font-weight: bold;
	text-decoration: none;
}

div#right div#twitter.bubble ul#twitter_update_list {
	margin: 0px;
	padding: 0;
	list-style-type: none;
}

div#right div#twitter.bubble ul#twitter_update_list li {
	margin: 10px;
	text-align: right;
}

div#right div#twitter.bubble ul#twitter_update_list li span {
	font-size: 10px;
	display: block;
	text-align: left;
}

div#right div#twitter.bubble ul#twitter_update_list li span a {
	font-size: 10px;
	color: #212d98;
}

/* @end Tab Area */

/* @end Rechte Spalte */
/* @end  */

/* @group Comments */

div#comments_area {
	background: url(/tl_files/fruux/comments_bg.png) center -10px;	
	width: 960px;
	margin: 20px 10px;
	box-shadow: 0px 0px 5px #888;
	-webkit-box-shadow: 0px 0px 5px #888;
	-moz-box-shadow: 1px 0px 5px #888;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;

}

div#comments_area h2,
div#comments_area .comments p {
	color: #273104;
}

div#comments_area div.comment {
	width: 220px;
	height: 144px;
	float: left;
	padding-right: 10px;
	padding-left: 10px;	
	margin-top: 10px;	
	margin-bottom: 10px;
}

div#comments_area div.comment.last {
	border-right: 1px solid #749218;
	
}

div#comments_area div.nextweb {	
	background: url(/tl_files/fruux/comments_thenextweb.png) 0 -10px;
}

div#comments_area div.nextweb p{
	margin-left: 85px;
	margin-top: 60px;
}

div#comments_area div.macupdate {
	background-image: url(/tl_files/fruux/comments_macupdate.png);
}

div#comments_area div.lifehacker {
	border-left: 1px solid #749218;	
	background: url(/tl_files/fruux/comments_lifehacker.png) 0 -10px;
}

div#comments_area div.lifehacker p{
	margin-top: 60px;
	margin-left: 10px;
}

div#comments_area div.macnn {
	border-left: 1px solid #749218;	
	background: url(/tl_files/fruux/comments_macnn.png) 0 -10px;
}

div#comments_area div.macnn p{
	margin-top: 60px;
	margin-left: 10px;
}


/* @end Comments */

/* @group Footer */

div#footer div.wrapper p,
div#footer div.wrapper a {	
	font-size: 10px;	
	color: #666368;	
	line-height: 16px;	
	text-align: center;
}



/* @end */

/* @group Blog Extrastyles */

/* @group Rechte Spalte */

body#blog_index div#right {
	width: 240px;
	float: right;
	padding-top: 0;
	margin-right: 0px;
}

body#blog_index div#right div#sidebar ul {	
	list-style-type: none;	
	margin: 0;	
	padding: 0;
}

body#blog_index div#right div#sidebar ul li.widget {
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;	
	margin: 10px 10px 5px;	
	padding: 10px 10px 30px;	
	background: #fff url(../global/bubble_bottom.png) no-repeat center bottom;
}

body#blog_index div#right div#sidebar ul h2.widgettitle {	
	font-size: 12px;	
	color: #0e660f;	
	margin-bottom: 10px;
}

/* @group Twitter */

body#blog_index div#right div#sidebar ul li#twitters {
	background: #fff url(../global/bubble_top_twitter.png) no-repeat center top;	
	padding-bottom: 10px;	
	padding-top: 30px;
}

body#blog_index div#right div#sidebar ul li#twitters h2.widgettitle {	
	text-align: right;	
}

body#blog_index div#right div#sidebar ul li#twitters h2.widgettitle a{	
	color: #212d98;
	font-weight: bold;
	text-decoration: none;
}

body#blog_index div#right div#sidebar ul li#twitters ul#twitter-list {
	margin: 0px;
	padding: 0;
	list-style-type: none;
}

body#blog_index div#right div#sidebar ul li#twitters ul#twitter-list li {
	margin: 10px 0;
	display: block;
	font-size: 10px;

}

body#blog_index div#right div#sidebar ul li#twitters ul#twitter-list li a {
	font-size: 10px;
	display: block;	
	text-align: right;
}

/* @end */

/* @end */

/* @group Content Bereich */

/* @group Noname */

body#blog_index div#content h2.pagetitle {	
	font: bold 20px/25px "Lucida Grande", Arial, Verdana, sans-serif;	
	margin: 20px;	
	color: #2c609d;
}

body#blog_index div#content h3 {
	font: bold 20px/25px "Lucida Grande", Arial, Verdana, sans-serif;	
	margin: 20px;	
	color: #85c8e6;
}

body#blog_index div#content h3 a{
	font: bold 20px/25px "Lucida Grande", Arial, Verdana, sans-serif;	
	color: #85c8e6;	
	text-decoration: none;
}

body#blog_index div#content img.alignright {	
	float: right;	
	margin-left: 20px;	
	margin-bottom: 10px;
}

body#blog_index div#content img.alignleft {	
	float: left;	
	margin-right: 20px;	
	margin-bottom: 10px;
}


/* @end */

/* @group Navi Mini */

body#blog_index #content div.navigation {
	background-image: url(../global/content_tab_bg.png);	
}

body#blog_index div#content div.navigation div.alignleft {	
	margin: 10px 20px;	
	float: left;
	color: #728817;	
}

body#blog_index div#content div.navigation div.alignright {
	margin: 10px 20px 10px auto;	
	text-align: right;
	color: #728817;	
}

body#blog_index div#content div.navigation a {
	color: #728817;	
	text-decoration: none;
}

body#blog_index div#content div.navigation a:hover {
	color: #576600;
}


/* @end */

/* @group Social Icons */

body#blog_index div#content div.post div.sociable {	
	margin: 10px 20px 0;
}

body#blog_index div#content div.post div.sociable ul {	
	overflow: hidden;	
	margin-bottom: 0;	
	margin-left: 0;	
	margin-top: 10px;
}

body#blog_index div#content div.post div.sociable ul li{
	padding-left: 0px;	
	float: left;	
	background-image: none;	
	padding-right: 10px;
}

/* @end */

/* @group Post */

body#blog_index div#content div.post {	
	border-bottom: 1px solid #e5e2d3;	
	padding-top: 20px;	
	padding-bottom: 20px;
}

body#blog_index div#content div.post h2 {
	font: bold 20px/25px "Lucida Grande", Arial, Verdana, sans-serif;	
	margin: 0 20px 10px;	
	color: #2c609d;
}

body#blog_index div#content div.post h2 a{
	font: bold 20px/25px "Lucida Grande", Arial, Verdana, sans-serif;
	text-decoration: none;	
	color: #2c609d;
}

body#blog_index div#content div.post small {	
	margin-left: 20px;	
}

body#blog_index div#content div.post ul {
	padding: 0;
	margin: 15px 20px 20px 20px;
	list-style-type: none;
}

body#blog_index div#content div.post ul li{
	background: url(../global/bullet_green.png) no-repeat left 2px;
	padding-left: 20px;
}

body#blog_index div#content div.post div.entry p{	
	margin-left: 20px;	
	margin-right: 20px;
}

body#blog_index div#content div.post div.entry p.postmetadata,
body#blog_index div#content div.post p.postmetadata  {	
	background-image: url(../global/bg_hellgruen.png);	
	padding: 10px 20px;	
	margin: 10px 0 0;
}

body#blog_index div#content div.post p.postmetadata a {	
	color: #666368;
}

body#blog_index div#content div.post p.postmetadata small {	
	margin: 0;
}

body#blog_index div#content div.post p.postmetadata small a{	
	font-size: 11px;
}

/* @end */

/* @group Comments */


body#blog_index div#content ol.commentlist {	
	margin: 0;	
	padding-left: 0;	
	list-style-position: inside;
}

body#blog_index div#content ol.commentlist img.avatar {	
	margin-right: 10px;	
	margin-left: 10px;
}

body#blog_index div#content ol.commentlist li.alt {	
	padding: 20px;	
	border-top: 1px dashed #9fcae6;	
	border-bottom: 1px dashed #9fcae6;	
	background-color: #f0f9fe;
}

body#blog_index div#content ol.commentlist li {	
	padding: 20px;	
}

body#blog_index div#content ol.commentlist small.commentmetadata {	
	margin-bottom: 20px;	
	display: block;
}

body#blog_index div#content ol.commentlist small.commentmetadata a{	
	color: #7999b3;	
	text-decoration: none;
}

body#blog_index div#content form#commentform {	
	padding: 20px;
}

body#blog_index div#content textarea#comment {	
	width: 680px;
}

body#blog_index div#content h3#respond {	
	margin-top: 20px;	
	margin-right: 20px;	
	margin-left: 20px;
}

/* @end */

/* @end */


/* @end */