/* 1. Allgemeines */ * { margin: 0px; padding: 0px; } img { border: none } a { text-decoration: none; color: #ff9900; } a:hover { text-decoration: underline; } body { color: #555555; background: #F9F9F9; font: normal 10px Verdana,Arial,Helvetica,sans-serif; line-height: 1.2em; } /* 1.1 Textauszeichnuung */ .bold { font-weight:bold; } /* 2. Formatierung der 5 Haupt-Divs */ #wrapper { width: 1000px; height: 594px; margin: 0px auto;} #grau_links { width: 23px; height: 571px; background: url(img/background/bg_li_transparent.png) repeat-y; float: left; } #grau_rechts { width: 23px; height: 571px; background: url(img/background/bg_re_transparent.png) repeat-y; float: left; } #grau_unten { width: 1000px; height: 29px; background: url(img/background/bg_un_transparent.png) no-repeat; float: left; } #main { width: 916px; height: 571px; background-color:#fff; padding-left: 38px; float: left; position: relative; } /* 3. Formatierung des Kopfbereichs */ #head { height: 105px; } #head img { margin-right: 38px; padding-top: 20px; float: right; } #head ul { width: 400px; margin-top: 15px; float: left; list-style-type: none; } #head li { float: left; margin-left: -5px; } #head li a { width: 90px; height: 28px; float: left; line-height: 28px; color: #BCBCBC; text-indent: 30px; font-size: 9px; } #head li a:hover { color: #ff9900; } .englisch { background: url(img/head/sprache_eng_grau.png) no-repeat left; } .deutsch { background: url(img/head/sprache_deu_grau.png) no-repeat left; } .italienisch { background: url(img/head/sprache_ita_grau.png) no-repeat left; } .franz { background: url(img/head/sprache_fra_grau.png) no-repeat left; } .englisch:hover { background: url(img/head/sprache_eng_orange.png) no-repeat left; } .deutsch:hover { background: url(img/head/sprache_deu_orange.png) no-repeat left; } .italienisch:hover { background: url(img/head/sprache_ita_orange.png) no-repeat left; } .franz:hover { background: url(img/head/sprache_fra_orange.png) no-repeat left; } h1.title { display: none; } /* 4. Formatierung des Hauptmenues */ #menue { width: 883px; height: 40px; margin-left: -6px; list-style-type: none; } #menue li { float: left; margin-right: -1px; } #menue a { width: 112px; height: 40px; float: left; overflow: hidden; text-indent: -2000px; background-repeat: no-repeat; background-position: left top; } /* 4.1. Aktivierung Hauptmenue-Button */ a#start { background: url(img/mainnavi/start_inaktiv.png); } a#start:hover { background: url(img/mainnavi/start_hover.png); } a#start.activ { background: url(img/mainnavi/start_aktiv.png); } a#start.activ:hover { background: url(img/mainnavi/start_aktiv.png); } a#home { background: url(img/mainnavi/start_inaktiv_eng.png); } a#home:hover { background: url(img/mainnavi/start_hover_eng.png); } a#home.activ { background: url(img/mainnavi/start_aktiv_eng.png); } a#home.activ:hover { background: url(img/mainnavi/start_aktiv_eng.png); } a#accueil { background: url(img/mainnavi/start_inaktiv_fra.png); } a#accueil:hover { background: url(img/mainnavi/start_hover_fra.png); } a#accueil.activ { background: url(img/mainnavi/start_aktiv_fra.png); } a#accueil.activ:hover { background: url(img/mainnavi/start_aktiv_fra.png); } a#isurvey { background: url(img/mainnavi/isurvey_inaktiv.png); } a#isurvey:hover { background: url(img/mainnavi/isurvey_hover.png); } a#isurvey.activ { background: url(img/mainnavi/isurvey_aktiv.png); } a#isurvey.activ:hover { background: url(img/mainnavi/isurvey_aktiv.png); } a#leistungen { background: url(img/mainnavi/leistungen_inaktiv.png); } a#leistungen:hover { background: url(img/mainnavi/leistungen_hover.png); } a#leistungen.activ { background: url(img/mainnavi/leistungen_aktiv.png); } a#leistungen.activ:hover { background: url(img/mainnavi/leistungen_aktiv.png); } a#services { background: url(img/mainnavi/leistungen_inaktiv_eng.png); } a#services:hover { background: url(img/mainnavi/leistungen_hover_eng.png); } a#services.activ { background: url(img/mainnavi/leistungen_aktiv_eng.png); } a#services.activ:hover { background: url(img/mainnavi/leistungen_aktiv_eng.png); } a#servizi { background: url(img/mainnavi/leistungen_inaktiv_ita.png); } a#servizi:hover { background: url(img/mainnavi/leistungen_hover_ita.png); } a#servizi.activ { background: url(img/mainnavi/leistungen_aktiv_ita.png); } a#servizi.activ:hover { background: url(img/mainnavi/leistungen_aktiv_ita.png); } a#service { background: url(img/mainnavi/leistungen_inaktiv_fra.png); } a#service:hover { background: url(img/mainnavi/leistungen_hover_fra.png); } a#service.activ { background: url(img/mainnavi/leistungen_aktiv_fra.png); } a#service.activ:hover { background: url(img/mainnavi/leistungen_aktiv_fra.png); } a#werkzeuge { background: url(img/mainnavi/werkzeuge_inaktiv.png); } a#werkzeuge:hover { background: url(img/mainnavi/werkzeuge_hover.png); } a#werkzeuge.activ { background: url(img/mainnavi/werkzeuge_aktiv.png); } a#werkzeuge.activ:hover { background: url(img/mainnavi/werkzeuge_aktiv.png); } a#tools { background: url(img/mainnavi/werkzeuge_inaktiv_eng.png); } a#tools:hover { background: url(img/mainnavi/werkzeuge_hover_eng.png); } a#tools.activ { background: url(img/mainnavi/werkzeuge_aktiv_eng.png); } a#tools.activ:hover { background: url(img/mainnavi/werkzeuge_aktiv_eng.png); } a#strumenti { background: url(img/mainnavi/werkzeuge_inaktiv_ita.png); } a#strumenti:hover { background: url(img/mainnavi/werkzeuge_hover_ita.png); } a#strumenti.activ { background: url(img/mainnavi/werkzeuge_aktiv_ita.png); } a#strumenti.activ:hover { background: url(img/mainnavi/werkzeuge_aktiv_ita.png); } a#outils { background: url(img/mainnavi/werkzeuge_inaktiv_fra.png); } a#outils:hover { background: url(img/mainnavi/werkzeuge_hover_fra.png); } a#outils.activ { background: url(img/mainnavi/werkzeuge_aktiv_fra.png); } a#outils.activ:hover { background: url(img/mainnavi/werkzeuge_aktiv_fra.png); } a#referenzen { background: url(img/mainnavi/referenzen_inaktiv.png); } a#referenzen:hover { background: url(img/mainnavi/referenzen_hover.png); } a#referenzen.activ { background: url(img/mainnavi/referenzen_aktiv.png); } a#referenzen.activ:hover { background: url(img/mainnavi/referenzen_aktiv.png); } a#references { background: url(img/mainnavi/referenzen_inaktiv_eng.png); } a#references:hover { background: url(img/mainnavi/referenzen_hover_eng.png); } a#references.activ { background: url(img/mainnavi/referenzen_aktiv_eng.png); } a#references.activ:hover { background: url(img/mainnavi/referenzen_aktiv_eng.png); } a#referenze { background: url(img/mainnavi/referenzen_inaktiv_ita.png); } a#referenze:hover { background: url(img/mainnavi/referenzen_hover_ita.png); } a#referenze.activ { background: url(img/mainnavi/referenzen_aktiv_ita.png); } a#referenze.activ:hover { background: url(img/mainnavi/referenzen_aktiv_ita.png); } #referenc { background: url(img/mainnavi/referenzen_inaktiv_fra.png); } a#referenc:hover { background: url(img/mainnavi/referenzen_hover_fra.png); } a#referenc.activ { background: url(img/mainnavi/referenzen_aktiv_fra.png); } a#referenc.activ:hover { background: url(img/mainnavi/referenzen_aktiv_fra.png); } a#kontakt { background: url(img/mainnavi/kontakt_inaktiv.png); } a#kontakt:hover { background: url(img/mainnavi/kontakt_hover.png); } a#kontakt.activ { background: url(img/mainnavi/kontakt_aktiv.png); } a#kontakt.activ:hover { background: url(img/mainnavi/kontakt_aktiv.png); } a#contact { background: url(img/mainnavi/kontakt_inaktiv_eng.png); } a#contact:hover { background: url(img/mainnavi/kontakt_hover_eng.png); } a#contact.activ { background: url(img/mainnavi/kontakt_aktiv_eng.png); } a#contact.activ:hover { background: url(img/mainnavi/kontakt_aktiv_eng.png); } a#contatto { background: url(img/mainnavi/kontakt_inaktiv_ita.png); } a#contatto:hover { background: url(img/mainnavi/kontakt_hover_ita.png); } a#contatto.activ { background: url(img/mainnavi/kontakt_aktiv_ita.png); } a#contatto.activ:hover { background: url(img/mainnavi/kontakt_aktiv_ita.png); } /* 4.2. Formatierung der Hauptmenue-Linien */ #menueline { width: 877px; height: 12px; background: url(img/menue_line/punkt_grau.png) repeat-x -11px 4px; } #menueline div { width: 877px; height: 12px; overflow: hidden; margin-left: -5px; background: url(img/menue_line/aktiv_streifen.png) repeat-y left top; } #menueline div.leistungen { background-position: 216px top; } #menueline div.isurvey { background-position: 105px top; } #menueline div.werkzeuge { background-position: 327px top; } #menueline div.referenzen { background-position: 438px top; } #menueline div.kontakt { background-position: 549px top; } #menueline div.start { background-position: -6px top; } #linie_orange { width: 877px; height: 4px; background: #F89E39 url(img/menue_line/streifen_li.png) no-repeat left top; } #linie_orange div { width: 877px; height: 4px; overflow: hidden; background: url(img/menue_line/streifen_re.png) no-repeat right top; } #linie_orange_start { width: 881px; height: 4px; margin-left: -6px; background: #F89E39 url(img/menue_line/streifen_start_li_2.png) no-repeat left top; } #linie_orange_start div { width: 883px; height: 4px; overflow: hidden; background: url(img/menue_line/streifen_re.png) no-repeat right top; } /* 5. Formaierung der Teaserboxen */ #teaser1, #teaser2, #teaser3 { width: 226px; margin-top: 10px; float: left; overflow: hidden; position: relative; } #teaser1 { margin-left: -7px } #teaser2, #teaser3 { margin-left: -4px } /* 5.1. Teaser 1 ist max offen */ .left_open #teaser1 { width: 572px } .left_open #teaser2 { width: 53px } .left_open #teaser3 { width: 53px } .left_open .maximizer { display: block } .left_open #teaser1 .maximizer { display: none } .left_open #teaser1 .rechtespalte { display: block } /* 5.2. Teaser 2 ist max offen */ .mid_open #teaser2 { width: 572px } .mid_open #teaser1 { width: 53px } .mid_open #teaser3 { width: 53px } .mid_open .maximizer { display: block } .mid_open #teaser2 .maximizer { display: none } .mid_open #teaser2 .rechtespalte { display: block } /* 5.3. Teaser 3 ist max offen */ .right_open #teaser3 { width: 572px } .right_open #teaser2 { width: 53px } .right_open #teaser1 { width: 53px } .right_open .maximizer { display: block } .right_open #teaser3 .maximizer { display: none } .right_open #teaser3 .rechtespalte { display: block } /* 6. Formatierung Schatten Teaserboxen */ .ecke_lo { background: url(img/teaserboxen/ecke_lo.png) no-repeat left top; } .ecke_ro { background: url(img/teaserboxen/ecke_ro.png) no-repeat right top; padding-top: 10px; position:relative; } .ecke_ru { background: url(img/teaserboxen/ecke_ru.png) no-repeat right bottom; padding-right: 10px; position:relative; } .ecke_lu { background: url(img/teaserboxen/ecke_lu.png) no-repeat left bottom; height: 365px; padding-left: 10px; overflow: hidden; position: relative; } /* 6.1. Icons */ .datenerfassung { background: url(img/teaserboxen/icons/icon_datenerfassung.png) no-repeat left top; } .datenmanagement { background: url(img/teaserboxen/icons/icon_datenmanagement.png) no-repeat left top; } .individualentw { background: url(img/teaserboxen/icons/icon_individualentwicklung.png) no-repeat left top; } .hardware { background: url(img/teaserboxen/icons/icon_hardware.png) no-repeat left top; } .software { background: url(img/teaserboxen/icons/icon_software.png) no-repeat left top; } .service { background: url(img/teaserboxen/icons/icon_service.png) no-repeat left top; } .formular { background: url(img/teaserboxen/icons/icon_formular.png) no-repeat left top; } .impressum { background: url(img/teaserboxen/icons/icon_impressum.png) no-repeat left top; } .kontakt2 { background: url(img/teaserboxen/icons/icon_kontakt.png) no-repeat left top; } #teaser1 .maximizer { background: url(img/teaserboxen/max_min/max_teaser1_grau.png) no-repeat left top; } #teaser2 .maximizer { background: url(img/teaserboxen/max_min/max_teaser2_grau.png) no-repeat left top; } #teaser3 .maximizer { background: url(img/teaserboxen/max_min/max_teaser3_grau.png) no-repeat left top; } #teaser1 .maximizer:hover { background: url(img/teaserboxen/max_min/max_teaser1_orange.png) no-repeat left top; } #teaser2 .maximizer:hover { background: url(img/teaserboxen/max_min/max_teaser2_orange.png) no-repeat left top; } #teaser3 .maximizer:hover { background: url(img/teaserboxen/max_min/max_teaser3_orange.png) no-repeat left top; } #teaser2 .maximizer.kontakt { background: url(img/teaserboxen/max_min/normal_grau.png) no-repeat left top; } #teaser3 .maximizer.kontakt { background: url(img/teaserboxen/max_min/normal_grau.png) no-repeat left top; } #teaser2 .maximizer.kontakt:hover { background: url(img/teaserboxen/max_min/normal_orange.png) no-repeat left top; } #teaser3 .maximizer.kontakt:hover { background: url(img/teaserboxen/max_min/normal_orange.png) no-repeat left top; } .player { height: 28px; margin-right: 17px; background: url(img/teaserboxen/flash_grau.png) no-repeat left; float: right; display: block; line-height: 28px; color: #BCBCBC; text-indent: 30px; } .player:hover { background: url(img/teaserboxen/flash_orange.png) no-repeat left; color: #ff9900; } #willkommen { height: 28px; margin-left: 14px; background: url(img/teaserboxen/willkommen_grau.png) no-repeat left; float: left; display: block; line-height: 28px; color: #BCBCBC; text-indent: 19px; } #willkommen:hover { background: url(img/teaserboxen/willkommen_orange.png) no-repeat left; color: #ff9900; } #neuigkeiten { height: 28px; margin-left: 15px; background: url(img/teaserboxen/neues_grau.png) no-repeat left; float: left; display: block; line-height: 28px; color: #BCBCBC; text-indent: 21px; } #neuigkeiten:hover { background: url(img/teaserboxen/neues_orange.png) no-repeat left; color: #ff9900; } #neuigkeiten.activ { background: url(img/teaserboxen/neues_orange.png) no-repeat left; color: #ff9900;} #willkommen.activ { background: url(img/teaserboxen/willkommen_orange.png) no-repeat left; color: #ff9900; } /* 6.2. Infobox */ .infobox { width: 550px; height: 339px; background: url(img/teaserboxen/punkt_grau.png) repeat-x left bottom; overflow: hidden; position: relative; } .infobox h1 { margin-left: 3px; height: 28px; font: normal 13px Georgia; line-height: 23px; color: #ff9900; background: url(img/teaserboxen/punkt_orange.png) repeat-x 1px bottom; } .infobox h1 a { display: block; height: 28px; padding-left: 33px; line-height: 23px; text-decoration: none } .maximizer { width: 28px; height: 28px; display: none; overflow: hidden; text-indent: -2000px; position: absolute; left: 2px; top: 308px; } #flash { width: 844px; height: 300px; margin: 9px 0px 0px 12px; } /* 6.3. Linke Spalte */ .linkespalte { width: 207px; height: 270px; float: left; position: relative; } .linkespalte h2 { margin-left: 12px; padding-top: 14px; color: #555555; font: normal 19px Georgia, serif; } .linkespalte h3 { margin: 13px 0px 0px 12px; font: italic 13px Georgia; color: #ff9900; } .linkespalte img { position: absolute; left: 5px; top: 92px; } .linkespalte p { width: 180px; position: absolute; left: 13px; top: 204px; } .linkespalte ul { width: 180px; padding-left: 14px; position: absolute; left: 13px; top: 250px; list-style-image: url(img/teaserboxen/pfeil_orange.png); line-height: 16px; } /* 6.4. Rechte Spalte */ .rechtespalte { width: 300px; height: 310px; display: none; background: url(img/teaserboxen/trennstreifen.png) no-repeat left center; float: left; position: relative; } .rechtespalte div { position: absolute; left: 20px; top: 0px } .rechtespalte h1 { margin-left: -2px; padding-top: 14px; background-image: none; font: normal 19px Georgia, serif; color: #ff9900; cursor: default; } .rechtespalte h2 { margin-left: 20px; font: italic 13px Georgia; } .rechtespalte p { width: 300px; margin-top: 20px} .rechtespalte ul { width: 300px; padding: 13px 0px 0px 12px; line-height: 18px; } .rechtespalte li { padding-left: 8px; } .rechtespalte .aufzubutton { width: 28px; height: 28px; background: url(img/teaserboxen/max_min/normal_grau.png) no-repeat left top; display: block; overflow: hidden; text-indent: -2000px; position: absolute; left: 315px; top: 280px } .rechtespalte .aufzubutton:hover { background: url(img/teaserboxen/max_min/normal_orange.png) no-repeat left top } /* 7. Formatierungen von iSurvey */ #isurvey_teaser { width: 670px; margin: 10px 0px 0px -7px; float: left } #isurvey_teaser .infobox { width: 648px } #isurvey_teaser .infobox h1 span { background: url(img/teaserboxen/icons/icon_isurvey.png) no-repeat left top; width: 33px; height: 28px; float: left; } /* 7.1. Linke Spalte */ .isurvey_links { width: 315px; } .isurvey_links ul { margin: 20px 0px 0px 13px; padding-left: 14px; width: 280px; position: static; } .isurvey_links h3 { margin: 5px 0px 0px 32px; color: #555555; } .isurvey_links li { padding-left: 5px } /* 7.2. Rechte Spalte */ .isurvey_rechts { width: 285px; } .isurvey_rechts div { position: absolute; left: 0px; top: 0px } .isurvey_rechts h1 { width: 290px; height: 24px; margin-left: 25px; padding-bottom: 7px; background: url(img/teaserboxen/punkt_orange.png) repeat-x left bottom; text-align: center; font: normal 19px Georgia, serif; } .isurvey_rechts img { margin: 18px 0px 0px 23px;} .isurvey_rechts p { width: 280px; margin: 15px 0px 0px 30px; } /* 7a. Formatierungen von Neuigkeiten bzw News */ #news_teaser { width: 890px; margin: 10px 0px 0px -7px; float: left } #news_teaser .infobox { width: 868px } #news_teaser .infobox h1 span { background: url(img/teaserboxen/icons/icon_news.png) no-repeat left top; width: 33px; height: 28px; float: left; } /* 7a.1. Linke Spalte */ .news_links { width: 217px;} .news_links ul { margin: 20px 0px 0px 13px; padding-left: 14px; width: 280px; position: static; } .news_links h3 { margin: 5px 0px 0px 32px; color: #555555; } .news_links li { padding-left: 5px } /* 7a.2. Rechte Spalte */ .news_rechts { width: 620px; } .news_rechts div { position: absolute; left: 0px; top: 0px } .news_rechts h1 { margin-left: -2px; padding-top: 14px; background-image: none; font: normal 19px Georgia, serif; color: #ff9900; cursor: default; } .news_rechts img { margin: 18px 0px 0px 23px;} .news_rechts p { width: 615px; margin: 15px 0px 0px 0px; } /* 8. Formatierung der Referenzen */ #referenz_teaser { width: 670px; margin: 10px 0px 0px -7px; float: left } #referenz_teaser .infobox { width: 670px; } #referenz_teaser .infobox h1 span { background: url(img/teaserboxen/icons/icon_referenzen.png) no-repeat left top; width: 33px; height: 28px; float: left; } /* 8.1. Oben Spalte */ .obenspalte { position: absolute; left: 0px; top: 28px } .obenspalte h1 { background-image: none; margin-left: 12px; padding-top: 14px; font: normal 19px Georgia, serif; } .obenspalte h2 { margin: 0px 0px 20px 32px; font: italic 13px Georgia; color: #555555; } .obenspalte p { margin: 10px 0px 0px 13px; } .obenspalte span { color: #ff9900; } .text { width: 322px; height: 230px; float: left; } .bild { width: 315px; height: 217px; margin-left: 10px; padding-top: 15px; float: left; } .bild ul { position: relative; top: -8px; padding-right: 10px; height: 28px; } .bild ul li { list-style-type: none; float: right; } .ref_button { width: 28px; height: 28px; background: url(img/referenzen/button_grau.png) no-repeat left top; display: block; overflow: hidden; text-indent: -2000px; } .ref_button:hover { background: url(img/referenzen/button_orange.png) no-repeat left top;} .ref_button1 { background: url(img/referenzen/button_orange.png) no-repeat left top;} /* 8.2. Unten Spalte */ .untenspalte { clear: left; height: 53px; width: 650px; padding-top: 14px; background: url(img/referenzen/trennstreifen.png) no-repeat 20px 0px; position: absolute; left: 0px; top: 263px; } .untenspalte ul { margin-left: 33px; list-style-type: none; } .untenspalte li { float: left; } .untenspalte li a { width: 80px; height: 60px; margin: 0px 5px 0px 11px; float: left; display: block; overflow: hidden; text-indent: -2000px; } #logo_telekom { background: url(img/referenzen/logo/telekom_grau.png) no-repeat left } #logo_mcd { background: url(img/referenzen/logo/mcd_grau.png) no-repeat left } #logo_boa { background: url(img/referenzen/logo/boa_grau.png) no-repeat left } #logo_micro { background: url(img/referenzen/logo/microsoft_grau.png) no-repeat left } #logo_freiburg { background: url(img/referenzen/logo/freiburg_grau.png) no-repeat left } #logo_cartier { background: url(img/referenzen/logo/cartier_grau.png) no-repeat left } #logo_telekom.activ, #logo_telekom:hover { background: url(img/referenzen/logo/telekom_orange.png) no-repeat left } #logo_mcd.activ, #logo_mcd:hover { background: url(img/referenzen/logo/mcd_orange.png) no-repeat left } #logo_boa.activ, #logo_boa:hover { background: url(img/referenzen/logo/boa_orange.png) no-repeat left } #logo_micro.activ, #logo_micro:hover { background: url(img/referenzen/logo/microsoft_orange.png) no-repeat left } #logo_freiburg.activ, #logo_freiburg:hover { background: url(img/referenzen/logo/freiburg_orange.png) no-repeat left } #logo_cartier.activ, #logo_cartier:hover { background: url(img/referenzen/logo/cartier_orange.png) no-repeat left } /* 9. Formatierung der Marginalspalte */ #marginal { width: 220px; margin-top: 10px; margin-right: 25px; float: right; position: relative; } .marg_ecke_lo { background: url(img/marginal/marg_ecke_lo.png) no-repeat left top; width: 220px; } .marg_ecke_ru { background: url(img/marginal/marg_ecke_ru.png) no-repeat right bottom; padding-top: 10px; } .marg_ecke_lu { background: url(img/marginal/marg_ecke_lu.png) no-repeat left bottom; padding-left: 13px; } #marginal h1 { height: 28px; background: url(img/marginal/punkt_linie_grau.png) no-repeat 1px bottom; font: normal 13px Georgia; line-height: 23px; color: #BCBCBC; } #marginal h1 span { width: 35px; height: 28px; float: left; } #marginal ul { padding-bottom: 9px; padding-top: 4px; background: url(img/marginal/punkt_linie_grau.png) no-repeat left bottom; list-style-type: none; } /* 9.1. Marginalbox 0*/ #marg_box0 .marg_ecke_lu { height: 47px; } #marg_box0 h2 { width: 28px; height: 28px; text-indent: -1000px; float: left; overflow: hidden; background: url(img/marginal/ticker.png) no-repeat left top; } #marg_box0 p { display: block; float: left; margin: 2px 0px 0px 7px; color: #BCBCBC; word-spacing: -0.1em } /* 9.2. Marginalbox 1*/ #marg_box1 { margin-top: -3px } #marg_box1 .marg_ecke_lu { height: 152px; } #marg_box1 h1 span { background: url(img/marginal/icon_optionen.png) no-repeat left top; } /* 9.3. Marginalbox 2*/ #marg_box2 { margin-top: -3px } #marg_box2 .marg_ecke_lu { height: 152px; } #marg_box2 h1 span { background: url(img/marginal/icon_direktkontakt.png) no-repeat left top; } /* 9.4. Piktogramme */ .drucken, .link_extern, .link_intern, .link_graebert, .download, .email, .anfrage, .pdf { height: 28px; display: block; line-height: 28px; color: #BCBCBC; text-indent: 35px } .telefon { height: 28px; display: block; line-height: 28px; color: #BCBCBC; text-indent: 35px } .telefon span { margin-left: 35px; } .drucken { background: url(img/marginal/drucken_grau.png) no-repeat left; } .pdf { background: url(img/marginal/pdf_grau.png) no-repeat left; } .link_intern { background: url(img/marginal/link_intern_grau.png) no-repeat left; } .link_extern { background: url(img/marginal/link_extern_grau.png) no-repeat left; } .link_graebert { background: url(img/marginal/link_g_grau.png) no-repeat left; } .download { background: url(img/marginal/download_grau.png) no-repeat left; } .telefon { background: url(img/marginal/telefon_grau.png) no-repeat left; } .email { background: url(img/marginal/email_grau.png) no-repeat left; letter-spacing: -0.02em; word-spacing: -0.1em; } .anfrage { background: url(img/marginal/anfrage_orange.png) no-repeat left; color:#ff9900; } .drucken:hover { background: url(img/marginal/drucken_orange.png) no-repeat left; color: #ff9900; } .pdf:hover { background: url(img/marginal/pdf_orange.png) no-repeat left; color: #ff9900; } .link_intern:hover { background: url(img/marginal/link_intern_orange.png) no-repeat left center; color: #ff9900; } .link_extern:hover { background: url(img/marginal/link_extern_orange.png) no-repeat left; color: #ff9900; } .link_graebert:hover { background: url(img/marginal/link_g_orange.png) no-repeat left; color: #ff9900; } .download:hover { background: url(img/marginal/download_orange.png) no-repeat left; color: #ff9900; } .email:hover { background: url(img/marginal/email_orange.png) no-repeat left; color: #ff9900; } .anfrage:hover { background: url(img/marginal/anfrage_orange.png) no-repeat left; color: #ff9900; } .telefon:hover { background: url(img/marginal/telefon_orange.png) no-repeat left; color: #ff9900; } .hotline:hover { color: #ff9900; } /* 9.5. News Ticker Formatierung */ #ticker { margin-left: 35px; padding-top: 1px; position: relative; } #newslayer1, #newslayer2 { position: absolute; left: 0px; top: 0px; width: 162px; height: 30px; visibility: visible; font: normal 10px Vardana; word-spacing: -0.1em; letter-spacing: -0.02em } #newslayer1 { z-index: 1 } #newslayer2 { z-index: 2 } /* 10. Formatierung Kontaktformular */ form { margin-top: 10px } label { width: 68px; height: 16px; font: normal 10px Verdana,Arial,Helvetica,sans-serif; color: #555555; display: block; float: left; line-height: 20px; } input, textarea { margin-bottom: 5px; float: left; font: normal 10px Verdana,Arial,Helvetica,sans-serif; border: 1px solid gray; color: black; } textarea { margin-left: 68px; width: 208px; font: normal 10px Verdana,Arial,Helvetica,sans-serif; color: black; } input { width: 204px; padding: 2px } .senden { width: 83px; height: 33px; margin-left: 64px; display: block; border: none; overflow: hidden; font-size: 0.01em; color: #ff9900; } .deu { background: url(img/teaserboxen/absenden_inaktiv.png) no-repeat; } .deu:hover { background: url(img/teaserboxen/absenden_aktiv.png) no-repeat; } .eng { background: url(img/teaserboxen/absenden_inaktiv_eng.png) no-repeat; } .eng:hover { background: url(img/teaserboxen/absenden_aktiv_eng.png) no-repeat; } .ita { background: url(img/teaserboxen/absenden_inaktiv_ita.png) no-repeat; } .ita:hover { background: url(img/teaserboxen/absenden_aktiv_ita.png) no-repeat; } .fra { background: url(img/teaserboxen/absenden_inaktiv_fra.png) no-repeat; } .fra:hover { background: url(img/teaserboxen/absenden_aktiv_fra.png) no-repeat; } /* 11. Formatierung speziell Werkzeuge-Software */ #test { margin-top: 8px; } .rechtespalte .link { margin-top: 5px; margin-left: 15px; }