@charset "UTF-8";

/*
    Document   : frontend.css
    Created on : Aug 30, 2011, 11:18:28 AM
    Author     : Christian Seifert
    Description:
        Stylehseet definitions for the frontend.
*/

/* simple css reset */
* {
  padding: 0px;
  margin: 0px;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 9pt;
  color: #666;
}

/* general stylsheet classes */
.tiny-font { font-size: 65%; }
.small-font { font-size: 85%; }
.big-font, .big-font * { font-size: 130%; }
/* .huge-font { font-size: 150%; } */
.huge-font { font-size: 140%; }
.double-size-font { font-size: 200%; }
.bold { font-weight: bold; }
.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }
.hidden { display: none; }
.show { display: none; }
.transparent { visibility: hidden; }
.visible { visibility: visible; }

.dropshadow-00100-5a5a5a { -webkit-box-shadow: 0px 0px 10px 0px #000; -moz-box-shadow: 0px 0px 10px 0px #000; box-shadow: 0px 0px 10px 0px #000; }
.dropshadow-55105-5a5a5a { -webkit-box-shadow: 1px 1px 10px 0px #666; -moz-box-shadow: 1px 1px 10px 0px #666; box-shadow: 1px 1px 10px 0px #666; }
/* .3px { -webkit-box-shadow: 5px 5px 10px 5px #000; -moz-box-shadow: 5px 5px 10px 5px #000; box-shadow: 5px 5px 10px 5px #000; } */
.border-radius-10 { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
.border-radius-top-only-10 { -moz-border-radius-topleft: 3px; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 0px; -moz-border-radius-bottomleft: 0px; -webkit-border-radius: 3px 3px 0px 0px; border-radius: 3px 3px 0px 0px; }
.border-radius-left-only-10 { -moz-border-radius-topleft: 3px; -moz-border-radius-topright: 0px; -moz-border-radius-bottomright: 0px; -moz-border-radius-bottomleft: 3px; -webkit-border-radius: 3px 0px 0px 3px; border-radius: 3px 0px 0px 3px; }
.border-radius-right-only-10 { -moz-border-radius-topleft: 0px; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 3px; -moz-border-radius-bottomleft: 0px; -webkit-border-radius: 0px 3px 3px 0px; border-radius: 0px 3px 3px 0px; }
.border-radius-bottom-only-10 { -moz-border-radius-topleft: 0px; -moz-border-radius-topright: 0px; -moz-border-radius-bottomright: 3px; -moz-border-radius-bottomleft: 3px; -webkit-border-radius: 0px 0px 3px 3px; border-radius: 0px 0px 3px 3px; }
.image-replacement { text-indent: -500em; overflow: hidden; }
.gradiant-fefefe-dadada {
  background: #fefefe; /* Old browsers */
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlZmVmZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkYWRhZGEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top,  #fefefe 0%, #dadada 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fefefe), color-stop(100%,#dadada)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #fefefe 0%,#dadada 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #fefefe 0%,#dadada 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #fefefe 0%,#dadada 100%); /* IE10+ */
  background: linear-gradient(top,  #fefefe 0%,#dadada 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#dadada',GradientType=0 ); /* IE6-8 */
}
.box-top { background-image: url(images/box-top.gif); background-repeat: repeat-x; }
.box-bottom { background-image: url(images/box-bottom.gif); background-repeat: repeat-x; border: 1px solid #909090; border-top: 0px none; height: 18px; margin-bottom: 1em; }
h2.huge-font a { font-size: 140%; }

input, textarea, select, option { font-family: Arial, Arial, Helvetica, sans-serif; font-size: 9pt; }
h1, h2, h3, h4, h5 { padding: 0.4em 1em; font-family: 'Trebuchet MS', 'Helvetica'; }
div.text input, div.password input, div.textarea textarea { padding: 0.3em; width: 96%; border: 1px solid #aaa;
                                                            -moz-border-radius:2px; /* Firefox */
                                                            -webkit-border-radius:2px; /* Safari, Chrome */
                                                            -khtml-border-radius:2px; /* Konqueror */
                                                            border-radius:2px; /* CSS3 */
                                                            behavior:url(border-radius.htc);
}
div.text, div.textarea, div.password { margin-bottom: 5px; }
div.select select { padding: 0.3em; width: 98%; border: 1px solid #aaa;
                    -moz-border-radius:2px; /* Firefox */
                    -webkit-border-radius:2px; /* Safari, Chrome */
                    -khtml-border-radius:2px; /* Konqueror */
                    border-radius:2px; /* CSS3 */
                    behavior:url(border-radius.htc);
}
div.submit input { cursor: pointer; }
ul { list-style-type: none; }
input[type=checkbox] { margin-right: 0.5em; }
label { cursor: pointer; font-weight: bold; }
a { text-decoration: none; color: #4455aa; }
#top a, #admin a { font-weight: bold; }
#top a:hover, #admin a:hover { text-decoration: underline; }
hr.dashed { margin-top: 1em; border: 0px none; background-image: url(images/dashed-line.gif); background-repeat: repeat-x; height: 5px; }
a, img { border: 0px none; }
a:focus { border: 0px none; outline: none; } /* IE ... prevent the ugly dotted border on active links ... */

body {
  background-color: #283da4;
  background-repeat: repeat-x;
  background-image: url(images/body_gradient.jpg);
  padding: 1em;
  line-height: 1.5em;
}

body#info-popup {
  padding: 0em;
  background-color: white;
}

/* layout containers */
#site {
  background-color: #efefef;
  width: 1230px;
  margin: 0px auto;
}

#wrapper {
  width: 100%;
  float: left;
}

#header {
  /* background-color: #000; */
  height: 180px;
  background-image: url(images/fnet_header_sponsoren_blue.jpg);
  background-repeat: no-repeat;
}

#header .home-link {
  /*background-color: black;*/
  display: block;
  width: 30%;
  height: 180px;
  text-decoration: none !important;
  border: 0px none !important;
}

.header-main {
  height: 125px;
}

.header-info {
  height: 3em;
}

#breadcrumb {
  float:right;
  vertical-align:top;
  padding:10px 30px 0 0;
}

#header-links {
  padding: 0;
  font:10pt normal Arial, Helvetica, sans-serif;
  position: absolute;
  left:646px;
  top:152px;
}


#header .header-link {
	font:11pt normal Arial, Helvetica, sans-serif;
	padding:8px 10px;
}

#header li.header-menu {
	display:inline;	
}

#header-links li .header_menu_home {
    background: #efefef;
	color:#666;
	text-decoration:none;
    cursor: pointer;
    display: none;
    height: 105px;
    width: 122px;
    line-height: 22px;
    position: absolute;
	left:0px;
	top:-111px;
    z-index: 999 !important;
    border-color: #909090 #909090 -moz-use-text-color;
    border-style: solid solid none;
    border-width: 1px 1px 0;
    padding: 5px 1em 0 1em;
}
#header-links li .header_menu_forum {
    background: #efefef;
	color:#666;
	text-decoration:none;
    cursor: pointer;
    display: none;
    height: 105px;
    width: 122px;
    line-height: 22px;
    position: absolute;
	left:0px;
	top:-111px;
    z-index: 999 !important;
    border-color: #909090 #909090 -moz-use-text-color;
    border-style: solid solid none;
    border-width: 1px 1px 0;
    padding: 5px 1em 0 1em;
}
#header-links li .header_menu_wiki {
    background: #efefef;
	color:#666;
	text-decoration:none;
    cursor: pointer;
    display: none;
    height: 105px;
    width: 122px;
    line-height: 22px;
    position: absolute;
	left:0px;
	top:-111px;
    z-index: 999 !important;
    border-color: #909090 #909090 -moz-use-text-color;
    border-style: solid solid none;
    border-width: 1px 1px 0;
    padding: 5px 1em 0 1em;
}

#header-links li:hover .header_menu_home, #header-links li:hover .header_menu_forum, #header-links li:hover .header_menu_wiki {
	display:block;	
}

#header-links a {
	color:#666;
	text-decoration:none;
}

.breadcrumb, #breadcrumb a, #header #login, #header #login a, a.breadcrumb {
  text-decoration:none;
  font-weight:normal;
  color:#fff;
}

.breadcrumb a:hover {
  text-decoration:underline;
}

#left {
  float: left;
  width: 18em;
  margin: 0.5em -100% 0px 0.5em;
}

#left-links {
  padding:8px 10px 0 8px;
  font:11pt normal Arial, Helvetica, sans-serif;
}

#left-links a {
	color:#666;
}

#content {
  position: relative;
  /* margin-left: 18em; */
  margin-left: 18.5em;
}

#stream-internal {
  margin: 0.5em;
}

#footer {
  clear: left;
  margin-bottom: 2em;
  height:360px;
}

#footer .sitemap {
	padding-top: 40px;
}

#footer .sitemap_menu {
  float: left;
  margin-right: 1em;
  width: 12.6em;
  border-right: 1px solid #ccc;
}

#footer .sitemap_copy {
	clear:both;
	color:#ccc;
	text-align:center;
}

#footer .link-warning {
	clear:both;
	color:#aaa !important;
	text-align:left;
	width:940px;
	margin:0 auto 20px 228px;
}
#footer .link-warning  a, #footer .link-warning  a:hover, #footer .link-warning  a:visited {
	color:#aaa !important;
}

#footer ul.arrow {
  margin:0;
  padding:0;
}

#footer .home-link_footer {
  background-image: url(images/footer_f.net_logo.png);
  background-position: 60px 3px;
  background-repeat: no-repeat;
  display: block;
  text-decoration: none !important;
  border: 0px none !important;
  float: left;
  margin-right: 1em;
  height: 160px;
  width: 18em;
  margin: 0px 0.5em 0.5em 0.5em;
  border-left:1px solid #999;
	/* behavior:url(border-radius.htc);
	-webkit-box-shadow: 1px 1px 5px #bbb;
    -moz-box-shadow: 1px 1px 5px #bbb;
    box-shadow: 1px 1px 5px #bbb; */
}

#footer .menu {
  margin:5px 0px 0px 0px;
  padding:0px;
  font-size:8pt !important;
  line-height:8pt;
}

#footer .menu a {
  color:#aaa !important;
  font-weight:normal !important;
  font-size:8pt !important;
}

#footer .menu a:hover {
  text-decoration:undeline;
  color:#4455aa !important;
}

body#info-popup #footer {
  margin-bottom: 0em;
}

/* defintions for the ajax stuff */
#ajax-load-indicator {
  position: absolute;
  top: 8px;
  left: 50%;
  margin-left: -110px;
}

#ajax-load-indicator-dialog {
  text-align: center;
}

/* definitions for the left section */
#left fieldset {
  border: 1px solid #909090;
  border-bottom: 0px none;
  background-color: white;
  padding: 0em 1em 1em 1em;
  position: relative;
}

#left fieldset h2 {
  margin-bottom: 0.5em;
  padding: 0.4em 0em;
}

#left fieldset h2.sub {
  margin-bottom: 0em;
  margin-top: 0.5em;
  padding: 0em;
}

#left div.box-bottom {
  border: 1px solid #909090;
  border-top: 0px none;
  height: 18px;
  margin-bottom: 0.5em;
}

#left fieldset a {
  display: block;
  text-align: right;
}

#left .submit {
  position: relative;
}

#left .submit input {
  width: 20px;
  height: 20px;
  border: 0px none;
  background-position: -157px -109px;
  position: absolute;
  bottom: 7px;
  right: 2px;
}

#left input[type=checkbox] {
  float: left;
  clear:both;
  margin-top: 0.25em;
}

#left label {
  display: block;
  font-weight: normal;
  text-indent: -0.2em;
  padding-left: 1.45em;
  margin-top: 1em;

}

#left .input label {
  padding: 0.5em 0 0.1em 0.3em !important;
}

#left span.count {
  color: #4455aa;
}

#left h2.sub {
  padding-left:30px !important;
  line-height:30px;
}

.icon_land {
  margin-top:1.5em !important;
  background:url("images/icon_land.png") no-repeat 0px 4px transparent;
}
.icon_art {
  background:url("images/icon_art.gif") no-repeat 0px 4px transparent;
}
.icon_typ {
  background:url("images/icon_typ.gif") no-repeat 0px 4px transparent;
}
.icon_tag {
  background:url("images/icon_tag.gif") no-repeat 0px 4px transparent;
}
.icon_info {
  background:url("images/icon_info.gif") no-repeat 0px 4px transparent;
}

#left div.small-font {
  margin-bottom:1em;
}

/* definitions for the sponsor info */

.info h2.huge-font {
  padding:0.2em 0 0.5em 0 !important;
}
/*.kinds, .types, .tags,*/ .location {
  font-weight: bold;
}

.kinds, .types, .tags {
  color: #999999;
  padding: 0.2em 0em;
}

.kinds {
	padding-left:25px !important;
	background:url("images/icon_art_s.gif") no-repeat 0px 4px transparent;
}

.types {
	padding-left:25px !important;
	background:url("images/icon_typ_s.gif") no-repeat 0px 4px transparent;
}

.tags {
	padding-left:25px !important;
	background:url("images/icon_tag_s.gif") no-repeat 0px 4px transparent;
}
    
.location {
  padding: 0em 0em 0.8em 0em;
}

.kinds/*, .types, .tags*/ {
  border-bottom: 1px solid #ccc;
}

.tags, .tooltip .web, .tooltip .sponsor-since {
  border-top: 1px solid #ccc;
}

.website {
  font-weight: bold;
}

/* definitions for the stream section */
.sponsors {
  background-color: white;
  border: 1px solid #909090;
  border-bottom: 0px none;
  padding-bottom: 2em;
}

a.new_tab_link {
  margin:3px 0 0 8px;
  float:right;
  display: block;
  width: 20px;
  height: 20px;
  text-decoration: none !important;
  border: 0px none !important;
  background-image: url(images/icon_new-tab_off.gif);
  background-repeat: no-repeat;
}
a.new_tab_link:hover {
  margin:3px 0 0 8px;
  float:right;
  display: block;
  width: 20px;
  height: 20px;
  text-decoration: none !important;
  border: 0px none !important;
  background-image: url(images/icon_new-tab.gif);
  background-repeat: no-repeat;
}

#stream .sponsors ul {
  margin: 0em 1em;
}

#stream .sponsors ul li {
  margin-top: 1em;
}

#stream .sponsors ul li .image {
  float: left;
  padding-top: 0.3em;
  width: 350px;
}

#stream .sponsors ul li .info {
  margin-left: 355px;
  padding: 0em 1em 0em 1em;
}

#stream .sponsors ul li .info h2 {
  padding: 0em;
  padding-bottom: 0.5em;
}

#stream hr.dashed {
  clear: both;
}

#stream .social_share {
	padding-left:0.5em;
}

.tooltip {
  width: 360px;
}

.tooltip div.speech-ballon {
  float: left;
  width: 30px;
  height: 50px;
  padding-top: 12px;
  background-image: url(images/speech-ballon-start.gif);
  background-repeat: no-repeat;
  background-position: 0px 20px;
  /*background-color: red;*/
  z-index: 10;
}

.tooltip div.hover-info {
  margin-left: 29px;
  background-color: #eee;
  border: 1px solid #949494;
  padding: 1em;
}

.tooltip div.hover-info h2 {
  padding-left: 0em;
}

.tooltip .stars {
  background: url(images/stars-bg.gif) 0px 0px no-repeat;
  float: left;
  width: 115px;
}

.tooltip .stars div {
  background: url(images/stars-fg.gif) 0 0 no-repeat;
  height: 25px;
}

.tooltip .description {
  padding-top: 1em;
  margin-bottom: 0.5em;
}

.tooltip .web, .tooltip .sponsor-since {
  padding: 0.5em 0em;
  color: #999999;
}

/*
.tooltip .rating {
  padding-top: 0.2em;
  margin-bottom: 1em;
}*/

/*.tooltip {
  width: 480px;
}*/

/*.tooltip iframe {
  width: 480px;
  height: 300px;
  border: 0px none;
  background-color: white;
}*/

/* definitions for the detail view */

a.back_link {
  margin:6px 10px 0 0px;
  float:right;
  display: block;
  width: 20px;
  height: 20px;
  text-decoration: none !important;
  border: 0px none !important;
  background-image: url(images/icon_back_off.png);
  background-repeat: no-repeat;
}
a.back_link:hover {
  margin:6px 10px 0 0px;
  float:right;
  display: block;
  width: 20px;
  height: 20px;
  text-decoration: none !important;
  border: 0px none !important;
  background-image: url(images/icon_back.png);
  background-repeat: no-repeat;
}

.wrapleft {
  float: left;
  width: 100%;
}
.view .detail-info {
  margin-right: 600px;
}

.view .detail-image {
  float: right;
  width: 550px;
  margin-left: -650px;
}

.view h2 {
  padding-left: 0em;
  margin-bottom: 0.2em;
}

.view p {
  margin-top: 1em;
}

.view .detail-image > div:first-child {
  margin-bottom: 2em;
}

.view .detail-info,
.view .detail-image {
  padding: 20px;
}

.view dl {
  line-height: 1.8em;
  margin-top: 1.8em;
}

.view dl dt {
  float: left;
  width: 12em;
  color: #999;
}

.view dl dd {
  padding-left: 12em;
}

.view dl dd {
  margin-bottom: .3em;
  border-bottom: 1px solid #ccc;
}

.view dt.kind {
	background:url("images/icon_art_s.gif") no-repeat 120px 4px transparent;
}
.view dt.type {
	background:url("images/icon_typ_s.gif") no-repeat 120px 4px transparent;
}
.view dt.tag {
	background:url("images/icon_tag_s.gif") no-repeat 120px 4px transparent;
}
	
.view .stars {
  background: url(images/stars-bg.gif) 230px 0px no-repeat;
  padding-left: 230px;
}

.view .stars div {
  background: url(images/stars-fg.gif) 0 0 no-repeat;
  height: 32px;
}

.view .rating {
  padding-top: 0.2em;
  margin-bottom: 1em;
}

.view .qrcode {
  height: 260px;
}

#socialshareprivacy {
	margin-top: -10px;
}
.view #socialshareprivacy {
  margin-right: 2em;
}

/* fix for heise.de SocialSharePrivacy plugin */
.social_share_privacy_area {
  height: 0px !important;
}

/* comments and ratings section*/
.comments-ratings ul {
  margin-top: 2em !important;
}

#add-comment-and-rating-trigger {
	width: 280px;
	margin: 2em 0 0 10px;
}

#LoadAllComments {
	 background:url("images/icon_comments_m.gif") no-repeat 0px 10px transparent;
	 padding: 1em 0 2em 2.5em;
	 margin:auto 0;
}
.comments-ratings ul div:first-child {
  float: left;
  width: 15em;
  padding-top: 1em;
  background-image: url(images/speech-ballon-start.gif);
  background-repeat: no-repeat;
  background-position: right 20px;
  position: relative;
  z-index: 10;
}

.comments-ratings ul div:last-child {
  margin-left: 14.95em;
  background-color: #eee;
  border: 1px solid #aaa;
  padding: 1em;
  position: relative;

  -moz-border-radius:3px; /* Firefox */
  -webkit-border-radius:3px; /* Safari, Chrome */
  -khtml-border-radius:3px; /* Konqueror */
  border-radius:3px; /* CSS3 */
  behavior:url(border-radius.htc);
}

.comments-ratings ul li {
  margin-bottom: 2em;
}

.comments-ratings .report-comment a {
  color: #aaa !important;
  font-size: 90% !important;
  font-weight:normal !important;
}

.comments-ratings .like-comments {
  position: absolute;
  right: 2em;
  top: 1em;
}

.comments-ratings .like-comments a {
  background-repeat: no-repeat;
  display: block;
  width: 20px;
  height: 29px;
  float: left;
  text-decoration: none;
  margin-right: 5px;
}

.comments-ratings .like-comments a.disabled {
  cursor: default;
}

.comments-ratings .like-comments a:hover {
  text-decoration: none !important;
}

.comments-ratings .like-comments a.thumbs-up {
  background-image: url(images/like_off.gif);
}

.comments-ratings .like-comments a.thumbs-down {
  background-image: url(images/dislike_off.gif);
}

.comments-ratings .like-comments a.thumbs-up:hover {
  background-image: url(images/like.gif);
}

.comments-ratings .like-comments a.thumbs-down:hover {
  background-image: url(images/dislike.gif);
}

.comments-ratings .like-comments a.thumbs-up.disabled {
  background-image: url(images/like.gif);
}

.comments-ratings .like-comments a.thumbs-down.disabled {
  background-image: url(images/dislike.gif);
}

.comments-ratings .like-comments a span {
  position: absolute;
  width: 15px;
  text-align: right;
  color: #666;
}

.comments-ratings .like-comments a.thumbs-up span {
  top: 6px;
  left: -20px;
}

.comments-ratings .like-comments a.thumbs-down span {
  top: 6px;
  left: 40px;
}

.comments-ratings button {
  margin: 2em 45%;
}

.comments-ratings .comment-message {
  padding-right: 15em;
  font-size:8pt;
}

.comments-ratings .comment-message a {
  font-size:8pt !important;
}

.hint-no-ratings-and-comments {
  background:url("images/icon_comments_m.gif") no-repeat 0px 10px transparent;
  padding: 1em 0 2em 2.5em;
  margin:0 0 0 12px;;
}

/* definitions for the info popup */
.info-popup p {
  padding: 0.3em 1em;
}

.info-popup h1 {
  margin-bottom: 2em;
}


/* definitions for the banner-widget */
.banner-container {
  width: 210px;
  height: 60px;
}

/* logout section ... */
#header {
  position: relative;
}

#header span {
  position: absolute;
  right: 1em;
  bottom: 0.5em;
  color: #ccc;
}

#header span a {
  color: #ccc;
}

/* clearfix */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }