/* FARBEN gelb #ffe52d orange #e16804 schwarzgrau (main text) #3c3c3b dunkelgrau (footer text ) #333333 */ * {border:none; margin:0; padding:0;} .invisible {display:none;} body {font-size:62.5%; font-family:Arial, Helvetica, sans-serif; -webkit-text-size-adjust:none; color:#3c3c3b; background-color:#205ba3;} #superbgimage { display: none; } #wrapper { position: relative; z-index: 3; width:1000px; margin:0 auto; } #header, #container, #footer {margin:0 23px 0 47px; clear:both;} #footer {margin-left:25px; float:left;} /* HEADER **********************************************/ #header {height:121px; position:relative;} /* facebook link */ #header .facebook-link {margin-left:-3px; display:none;} #header .facebook-link a, #header .facebook-link a:hover {float:left; font-size:1.3em; margin:17px 0 0 0; text-decoration:none; color:#fff; background:url(../img/gui/facebook-head.png) left center no-repeat transparent; padding:0 0 0 44px;} #header .facebook-link .company-name {display:block; font-weight:bold;} /* header logo */ #header h1 {position:absolute; left:241px; bottom:-38px; z-index:9;} /* header navigation */ #header nav.mod_navigation {float:right; margin:8px 6px 0 0;} #header nav.mod_navigation ul {} #header nav.mod_navigation ul li {list-style:none; float:left; font-size:1.2em; line-height:1.3em; margin:0 5px 0 0;} #header nav.mod_navigation ul li a, #header nav.mod_navigation ul li a:hover {display:block; padding:5px; color:#fff; text-decoration:none; text-transform:uppercase;} #header nav.mod_navigation ul li a:hover, #header nav.mod_navigation ul li a.active {color:#ffe52d;} /* CONTAINER **********************************************/ #container {} /* navigation */ /* ebene 1 */ #container nav.mod_navigation {float:left; width:278px; position:relative; padding:0 0 30px 0;} #container nav .navigation_before { position:absolute; top:0; left:0; top:-15px; right:-15px; bottom:15px; left:-15px; background:url(../img/navigation_before-hg.png) repeat transparent; } #container nav ul .navigation_before {display:none;} #container nav.mod_navigation ul {position:relative; z-index:999;} #container nav.mod_navigation ul li {list-style:none; font-size:1.7em; background:url(../img/gui/navi-border.gif) 0 0 no-repeat transparent;} #container nav.mod_navigation ul li.item_1 {background-position:-72px 0; text-transform:uppercase;} #container nav.mod_navigation ul li.item_2 {background-position:-26px 0;} #container nav.mod_navigation ul li a, #container nav.mod_navigation ul li a:hover {display:block; padding:6px 0 5px; text-decoration:none; color:#fff; /*text-shadow: 0 -1px #205BA3, 1px 0 #205BA3, 0 1px #205BA3, -1px 0 #205BA3;*/} #container nav.mod_navigation ul li a:hover, #container nav.mod_navigation ul li a.active {color:#ffe52d;} /* ebene 2 */ #container nav.mod_navigation ul ul {margin:5px 0 20px 10px;} #container nav.mod_navigation ul ul li, #container nav.mod_navigation ul ul li.item_1, #container nav.mod_navigation ul ul li.item_2 {background:none; font-size:0.765em; text-transform:none;} #container nav.mod_navigation ul ul li a, #container nav.mod_navigation ul ul li a:hover {padding-top:0;} #container nav.mod_navigation ul ul li a:hover, #container nav.mod_navigation ul ul li a.active {} nav li > ul {display: none;} nav li.active > ul {display: block;} /* mod_article ***************************************/ #container .mod_article {float:right; width:581px; background:#fff; margin:25px 0 12px 0; background:url(../img/gui/article-hg.png) top left scroll repeat-y transparent; position:relative; padding:0 25px 0 25px;} #container .mod_article .before, #container .mod_article .after {height:12px; width:100%; background:url(../img/gui/article-top-folgearticle.png) top left no-repeat transparent; position:absolute; left:0;} #container .mod_article .before {top:-12px;} #container .mod_article .after {background:url(../img/gui/article-bottom.png) top left no-repeat transparent; bottom:-12px;} #container .article_wrapper.item_1 .mod_article {margin-top:51px; padding-top:0;} #container .article_wrapper.item_1 .mod_article .before {top:-35px; height:35px; background-image:url(../img/gui/article-top.png);} /* STILE FÜR ALLE Article */ #container .mod_article h1, #container .mod_article h2, #container .mod_article h3, #container .mod_article h4, #container .mod_article h5, #container .mod_article h6 {font-weight:normal;} #container .mod_article h1 {font-size:2.4em; line-height:1.2em; margin:0 0 3px 0; text-transform:uppercase;} #container .article_wrapper.item_1 .mod_article h1 {margin-top:11px;} #container .mod_article h2 {font-size:1.7em; line-height:1.18em; margin:0 0 20px 0;} #container .mod_article h3 {font-size:1.9em; line-height:1.35em; margin:0 0 20px 0;} #container .mod_article h4 {font-size:1.3em; line-height:1.69em; margin:20px 0 9px 0; font-weight:bold;} #container .mod_article h5 {} #container .mod_article h6 {} #container .mod_article p {font-size:1.3em; line-height:1.69em; margin:0 0 9px 0;} #container .mod_article ul, #container .mod_article ol {margin:0 0 9px 0;} #container .mod_article ol {margin-left:25px;} #container .mod_article ul li, #container .mod_article ol li {font-size:1.2em; line-height:1.167em; margin:0 0 13px 0;} #container .mod_article ul li {background:url(../img/gui/li-hackerl-dunkelgrau.png) 0 2px no-repeat transparent; list-style:none; padding:0 0 0 14px;} #container .mod_article ul ul, #container .mod_article ol ol {margin:5px 0 18px 0;} #container .mod_article ol ol {margin-left:25px;} #container .mod_article ul ul li, #container .mod_article ol ol li {font-size:1em; margin:0 0 5px 0;} #container .mod_article ul ul li {} #container .mod_article a, #container .mod_article a:hover {color:#e16804; text-decoration:none;} #container .mod_article a:hover {text-decoration:underline;} #container .mod_article .img-startseite img {margin:-35px 0 0 -25px; position:relative; z-index:999999;} /* extrastile für startseiten-boxen */ body.home #container .mod_article h1 {font-size:1.8em; line-height:1.111em; margin:0 0 19px 0; font-weight:bold; text-transform:none;} body.home #container .mod_article h2 {font-size:1.5em; line-height:1.2666em; margin:0 0 0 0; font-weight:bold;} body.home #container .mod_article p {color:#777776;} #container form {} #container form .form-zeile {} #container form td {vertical-align:top;} #container form label {float:left; width:115px; padding:4px 0 0 0; font-size:1.2em; line-height:1.2em;} #container form input, #container form select {border:1px solid #2766ab; padding:2px; font-size:1.2em; line-height:1.2em; color:#3C3C3B; margin:0 0 5px 0; width:319px;} #container form select {width:325px;} #container form input[type=text] {} #container form input[type=file] {} #container form input[type=radio] {width:auto; margin:0 2px 0 0; padding:0; border:none; background-color:transparent;} #container form input[type=submit], #container form input[type=submit]:hover {margin:20px 0 0 0; padding:5px 2px; width:325px; background-color:#f49719; border-color:#f49719; color:#fff; text-transform:uppercase;} #container form input[type=submit]:hover {background-color:#215ba4; border-color:#215ba4; cursor:pointer;} #container form textarea {border:1px solid #2766ab; padding:2px; font-size:1.2em; line-height:1.2em; color:#3C3C3B; margin:0 0 5px 0; width:319px; font-family:Arial,Helvetica,sans-serif;} #container form .captcha_text {display:block; margin:0 0 0 0; font-size:1.2em;} #container form p.error {margin:0 0 0 115px; color:#e16804; font-size:1em;} #container form fieldset {margin:4px 0 8px 0; float:left; width:100%;} #container form fieldset legend {padding:0 0 0 0; font-size:1.2em; line-height:1.2em; margin:0 0 5px 0; float:left; width:100%;} #container form fieldset span {margin:0 10px 0 0; float:left;} #container form fieldset span label {width:auto; float:none;} #container form fieldset span input {margin:0;} #container form .checkbox_container span {display:block; float:none; margin:0 0 2px 0;} #container form .checkbox_container input[type=checkbox] {width:20px; border:none;} /* CE ELEMENTE *****************************************/ /* badge Startseite */ #container .mod_article .ce_badge {position:absolute; top:-76px; right:-20px; width:82px; height:82px; z-index:9;} #container .mod_article .ce_badge a, #container .mod_article .ce_badge a:hover {display:block;} /* Feature Block */ #container .mod_article .ce_imagetextoverlay {float:left; width:100%; margin:16px 0 54px; background:url(../img/gui/ce_imagetextoverlay-text-hg.png) right top no-repeat transparent; position:relative;} #container .mod_article .ce_imagetextoverlay .after {width:291px; height:12px; position:absolute; bottom:-12px; right:0; background:url(../img/gui/ce_imagetextoverlay-text-bottom.png) right bottom no-repeat transparent; left:auto;} #container .mod_article .ce_imagetextoverlay figure {float:left; width:290px; line-height:0; margin:0 0 -12px 0;} #container .mod_article .ce_imagetextoverlay figure img {width:100%; height:auto;} #container .mod_article .ce_imagetextoverlay .text {float:left; width:251px; min-height:140px; margin:0; color:#fff; padding:18px 20px 0 20px;} #container .mod_article .ce_imagetextoverlay .text ul {margin-bottom:0;} #container .mod_article .ce_imagetextoverlay .text ul li {background:url(../img/gui/li-hackerl-weiss.png) 0 2px no-repeat transparent;} #container .mod_article .ce_imagetextoverlay .text a, #container .mod_article .ce_imagetextoverlay .text a:hover {color:#575756;} /* ce_gallery */ #container .mod_article .ce_gallery {} #container .mod_article .ce_gallery ul {} #container .mod_article .ce_gallery ul li {list-style:none; float:left; background:none; padding:0; margin:0 7px 7px 0;} #container .mod_article .ce_gallery ul li.col_last {margin-right:0;} /* SITEMAP */ #container .mod_article .mod_sitemap ul li a, #container .mod_article .mod_sitemap ul li a:hover {color:#3C3C3B;} #container .mod_article .mod_sitemap ul.level_1 li {font-weight:bold; background-image:none; padding-left:0;} #container .mod_article .mod_sitemap ul.level_2 li {font-weight:normal; background:url(../img/gui/li-hackerl-dunkelgrau.png) 0 2px no-repeat transparent; list-style:none; padding:0 0 0 14px;} #container .ce_text {clear:both;} /* FOOTER **********************************************/ /* teaser leiste */ #footer #teaserleiste {margin:11px 0 0 0; padding:12px 0; position:relative; float:left;} #footer #teaserleiste .teaserleiste-inner {float:left; background:url(../img/gui/teaserleiste-hg.png) top left repeat-y transparent;} #footer #teaserleiste .before, #footer #teaserleiste .after {height:12px; width:100%; background:url(../img/gui/teaserleiste-top-bottom.png) top left no-repeat transparent; position:absolute; left:0; top:0;} #footer #teaserleiste .after {background-position:bottom left; bottom:0; top:auto;} #footer #teaserleiste .contentelement_wrapper {float:left;} #footer #teaserleiste .ce_siteaser {float:left; width:310px; margin:0 0 0 11px; padding-top:5px;} #footer #teaserleiste .ce_siteaser img {width:100%; height:auto; position:relative; z-index:999; margin-bottom:-15px;} #footer #teaserleiste .contentelement_wrapper.item_1 .ce_siteaser {margin-left:0;} #footer #teaserleiste h1 {font-size:1.8em; line-height:1.111em; font-weight:bold; margin:0 11px 11px 27px; padding:0 16px 0 0;} #footer #teaserleiste h1 a, #footer #teaserleiste h1 a:hover {color:#3c3c3b; text-decoration:none; background:url(../img/gui/pfeil-rechts-rot.png) right 2px no-repeat transparent; display:block;} #footer #teaserleiste h1 a:hover {color:#e16804;} /* kontaktfooter */ #footer .contact-footer {clear:both; background:url(../img/gui/footer-hg.png) top left no-repeat transparent; padding:22px 0 2px 321px; margin:11px 0 30px 0; font-family:"Arial Narrow", Arial, Helvetica, sans-serif; text-align:right; font-size:1.4em; color:#575756; line-height:1.3em; float:left; width:631px;} #footer .contact-footer .seperator {color:#fff; margin:0 2px;} #footer .contact-footer .address .name {color:#fff; font-weight:bold;} #footer .contact-footer a, #footer .contact-footer a:hover {color:#fff; text-decoration:none;} #footer .contact-footer a:hover {color:#575756;} #footer .contact-footer .contact-possibilities .label {font-weight:bold;} #footer .contact-footer .contact-possibilities a, #footer .contact-footer .contact-possibilities a:hover {color:#575756; text-decoration:none;} #footer .contact-footer .contact-possibilities a:hover {color:#fff;} #footer .contact-footer > div {padding-right: 1em;} /* ColorBox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block;} .cboxIframe{width:100%; height:100%; display:block; border:0;} /* User Style: Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay{background:#fff;} #colorbox{} #cboxContent{margin-top:20px;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{border:5px solid #fff; background:#fff;} #cboxTitle{position:absolute; top:-17px; left:5px; font-size:1.2em; text-transform:uppercase; color:#3c3c3b;} #cboxCurrent{position:absolute; top:-17px; right:5px; font-size:1.2em; color:#3c3c3b;} #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;} #cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url("../img/controls.png") no-repeat top left; width:28px; height:65px; text-indent:-9999px;} #cboxPrevious:hover{background-position:bottom left;} #cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url("../img/controls.png") no-repeat top right; width:28px; height:65px; text-indent:-9999px;} #cboxNext:hover{background-position:bottom right;} #cboxLoadingOverlay{background:#fff;} #cboxLoadingGraphic{background:url("../img/loading.gif") no-repeat center center;} #cboxClose{position:absolute; top:5px; right:5px; display:block; background:url("../img/controls.png") no-repeat top center; width:38px; height:19px; text-indent:-9999px;} #cboxClose:hover{background-position:bottom center;}