/** * Custom Stylesheet for FinishWeb Site www.bernd-zumoberhaus.ch * * Copyright: * BAR Informatik AG * Brig-Glis, Switzerland * * Path: * [finishwebroot]/layout/[Layout]/style.css * * Authors: * bz Bernd Zumoberhaus, BAR Informatik AG * * Changes: * 17.05.2010 bz initial version * 18.07.2010 bz final version */ /************************************************************************************************** * Import base stylesheet for FinishWeb sites: base.css **************************************************************************************************/ @import url("base.css"); /************************************************************************************************** * Default styling of HTML-tags **************************************************************************************************/ * { margin: 0; padding: 0; } html { height:101%; } body { font-family: Arial Regular, sans-serif; font-size: 70%; line-height: 1.6em; margin-top:0; color:#000000; } /************************************************************************************************** * Custom classes **************************************************************************************************/ /* Floating */ .float-left { float: left; } .float-right { float: right; } .clear { clear: both; font-size:0px; height:0px; line-height:0px; display:inline; } .clear-left { clear: left; } .clear-right { clear: right; } /************************************************************************************************** * Default styling of FinishWeb elements **************************************************************************************************/ .fwelement { } /* fwtitle, h1, h2, h3... */ /* color, line-height */ h1, h2, h3, .fwelement h1, .fwelement h2, .fwelement h3 { } /* font-size, font-weight */ h1, .fwelement h1 { } h2, .fwelement h2 { } h3, .fwelement h3 { } /* fw... ... */ /************************************************************************************************** * Layout-styling **************************************************************************************************/ /******************************** * page ********************************/ #page { width:983px; /*height:654px;*/ margin-left:auto; background-color:#FFFFFF; margin-right:auto; margin-top:10px; margin-bottom:10px; } /******************************** * main ********************************/ #main { padding:0px; margin: 0px; } /******************************** * print ********************************/ #print { display:none; } /******************************** * leftcol ********************************/ #leftcol { width:259px; height:654px; float:left; background-image:url("content_background_l-startseite.jpg"); } #leftcol #navigation-left { clear:both; position:relative; top:-20px; } /******************************** * browserswitch-message ********************************/ #layoutmessage { height:20px; position:relative; top:-10px; left:14px; z-index:10; } /******************************** * maincol ********************************/ #maincol { width:396px; height:654px; padding:0 0 0 8px; float:left; display:inline; background-image:url("content_background_c-startseite.jpg"); } #maincol #navigation-center { clear:both; padding-bottom:10px; margin:5px 8px 0 0; border-bottom:1px solid #6F7171; } #maincol #navigation-center #navigation-center-1 { clear:both; } #maincol #navigation-center #navigation-center-2 { clear:both; margin-top:5px; } #maincol #content { width:388px; padding: 10px 8px 0 0; overflow:auto; text-align:justify; } #maincol div.contentheight1 { height:565px; } #maincol div.contentheight2 { height:644px; } #maincol .fwelement { margin-left:0px; margin-right:0px; margin-bottom:0px; padding-bottom:0px; } /******************************** * rightcol ********************************/ #rightcol { width:202px; height:644px; overflow:auto; float:left; padding:10px 8px 0 110px; display:inline; background-image:url("content_background_r-startseite.jpg"); } #rightcol .fwelement { margin-left:0px; margin-right:0px; margin-bottom:0px; padding-bottom:0px; } /************************************************************************************************** * Layout-defined styling of Finishweb elements **************************************************************************************************/ /******************************** * page ********************************/ #page .fwelement { clear:none; } /******************************** * main ********************************/ #main .fwelement { margin:0px; } /******************************** * print ********************************/ /******************************** * leftcol ********************************/ #leftcol .fwelement { margin-left:0px; margin-right:0px; margin-bottom:10px; padding-bottom:0px; } /* menü (level 1 + 2) */ #leftcol #navigation-left a { color:#000000; text-decoration:none; } #leftcol #navigation-left a:hover { color:#000000; text-decoration:none; font-weight:bold; } /* level 1 */ #leftcol #navigation-left ul.menu1items { list-style-type:none; width:200px; margin:0; padding:0; } #leftcol #navigation-left ul.menu1items li.menu1 { font-size:0; line-height:0; margin-top:4px; clear:both; } #leftcol #navigation-left ul.menu1items li.menu1 img { margin:0; border:none; display:block; } #leftcol #navigation-left ul.menu1items li.menusel1 { background-image:url("menu1_background-top.png"); background-repeat:no-repeat; } #leftcol #navigation-left ul.menu1items li.last { height:18px; background-image:url("menu1_background-bottom.png"); background-repeat:no-repeat; background-position:left bottom; } /* level 2 */ #leftcol #navigation-left ul.menu2items { list-style-type:none; margin:0; padding:0; } #leftcol #navigation-left ul.menu2items li.menu2 { font-size:14px; line-height:16px; padding:5px 10px 0 10px; margin:0; background-image:url("menu1_background.png"); } #leftcol #navigation-left ul.menu2items li.menusel2 a { font-weight:bold; } /******************************** * browserswitch-message ********************************/ #layoutmessage div.fwbrowserswitch { clear:both !important; width:231px; font-size:12px; background-color:#FFFFE0; border:1px solid #808080; margin-bottom:0; } #layoutmessage div.fwbrowserswitch a { color:#6F7171; font-weight:bold; text-decoration:none; } #layoutmessage div.fwbrowserswitch a:hover { color:#000000; font-weight:bold; text-decoration:none; } #layoutmessage div.fwbrowserswitch div { padding-top:0; padding-bottom:0; } #layoutmessage div.fwbrowserswitch span { padding-top:0; padding-bottom:0; } #layoutmessage div.fwbrowserswitch div.switchtext { padding:0 5px 0 10px; } /******************************** * maincol ********************************/ #maincol .fwelement { margin:0 0 12px; padding-bottom:0px; font-size:12px; line-height:20px; } #maincol .fwelement p { margin:0 0 10px 0; } #maincol .fwelement th p, #maincol .fwelement td p { margin:0px; } #maincol .fwelement ul { margin-top:0px; margin-bottom:0px; } #maincol .fwelement a { color:#6F7171; font-weight:bold; text-decoration:none; } #maincol .fwelement a:hover { color:#000000; font-weight:bold; text-decoration:none; } #maincol .clear { font-size:0px; height:0px; line-height:0px; } /* menü (3 + 4) */ #maincol #navigation-center ul li a { color:#000000; text-decoration:none; } #maincol #navigation-center ul li a:hover { color:#000000; font-weight:bold; } /* level 3 */ #maincol #navigation-center #navigation-center-1 ul.menu3items { list-style-type: none; margin: 0; padding: 0; } #maincol #navigation-center #navigation-center-1 ul.menu3items li.menu3 { float:left; font-size:14px; line-height:18px; text-align:left; padding:0 10px 0 0; } #maincol #navigation-center #navigation-center-1 ul.menu3items li.menusel3 { } #maincol #navigation-center #navigation-center-1 ul.menu3items li.menusel3 a { font-weight:bold; color:#000000; } #maincol #navigation-center #navigation-center-1 ul.menu3items li.clear { display:block; } /* level 4 */ #maincol #navigation-center #navigation-center-2 ul.menu4items { list-style-type: none; margin: 0; padding: 0; } #maincol #navigation-center #navigation-center-2 ul.menu4items li.menu4 { float:left; font-size:12px; line-height:18px; text-align:left; padding:0 10px 0 0; } #maincol #navigation-center #navigation-center-2 ul.menu4items li.menusel4 { } #maincol #navigation-center #navigation-center-2 ul.menu4items li.menusel4 a { font-weight:bold; color:#000000; } #maincol #navigation-center #navigation-center-2 ul.menu4items li.clear { display:block; } /* titel */ #maincol div.fwtitle { margin-bottom:6px; clear:both; } #maincol div.fwtitle h1 { font-size:16px; text-transform:lowercase; } #maincol div.fwtitle div.picture { display:none; } #maincol div.fwtitle div.picture-left { display:none; } #maincol div.fwtitle div.picture-right { display:none; } #maincol div.fwtitle img.titleasimage {} #maincol div.fwtitle1 {} /* variante überschrift 2 */ #maincol div.fwtitle2 h2 { font-size:14px; text-transform:lowercase; } /* variante überschrift 2 kleinerer abstand */ #maincol div.fwtitle3 { margin-bottom:0px; } /* text */ #maincol div.fwtext { } /* variante quellangaben */ #maincol div.fwtext1 { font-size:11px; line-height:14px; color:#6F7171; border-top:1px solid #6F7171; } /* variante kleinerer abstand */ #maincol div.fwtext3 { margin-bottom:0px; } /* bild */ #maincol div.fwpicture-group { overflow:hidden; } #maincol div.fwpicture-group div.fwpicture { width:100%; margin: 0; } #maincol div.fwpicture-group div.fwpicture div.picture { text-align:center; } #maincol div.fwpicture-group div.fwpicture div.picture img { border:1px solid #000000; } #maincol div.fwpicture-group div.fwpicture div.text { margin-top: 0.5em; } /* abschnitt */ #maincol div.fwparagraph { clear:both; } #maincol div.fwparagraph p.title { font-size:14px; margin-bottom:0px; } #maincol div.fwparagraph div.picture img { border:1px solid #000000; } #maincol div.fwparagraph div.picture-left { float:left; } #maincol div.fwparagraph div.picture-right { float:right; } #maincol div.fwparagraph div.float-left {} #maincol div.fwparagraph div.float-right {} /* link */ #maincol div.fwlink { height:20px; } #maincol div.fwlink div.image { margin: 0 10px 0 0; } /* linkliste */ #maincol div.fwlinklist {} #maincol div.fwlinklist p.title { margin-bottom:0px; } #maincol div.fwlinklist ul.list { list-style-type: none; margin: 0; padding: 0; } #maincol div.fwlinklist ul.list li { clear:both; text-align:left; height:20px; } #maincol div.fwlinklist ul.list li a { text-decoration:none; } #maincol div.fwlinklist ul.list li a:hover { text-decoration:none; } /* tabelle */ #maincol table.fwtable { width:371px; border:none; } #maincol table.fwtable td, #maincol table.fwtable th { height:20px; border: none; border-bottom:1px solid #6F7171; padding:0 10px 0 0; vertical-align:top; } #maincol table.fwtable th.f, #maincol table.fwtable td.f { text-align:left; font-weight:bold; } #maincol table.fwtable th { font-weight:bold; } #maincol table.fwtable td.i1 { background-color: transparent; } #maincol table.fwtable td.i1 a {} #maincol table.fwtable td.i0 { background-color: transparent; } #maincol table.fwtable td.i0 a {} #maincol table.fwtable td.separator { height:25px; } /* dateiliste */ #maincol div.fwfilelist div.fwnavigation { display:none; } #maincol div.fwfilelist table.fwfilelist td { text-align:left; height:20px; padding:0; } #maincol div.fwfilelist table.fwfilelist td a { text-decoration:none; } #maincol div.fwfilelist table.fwfilelist td a:hover { text-decoration:none; } #maincol div.fwfilelist table.fwfilelist td.icon { width:30px; padding-top:2px; } #maincol div.fwfilelist table.fwfilelist td.date, #maincol div.fwfilelist table.fwfilelist td.size, #maincol div.fwfilelist table.fwfilelist td.empty, #maincol div.fwfilelist table.fwfilelist td.description { display:none; } #maincol div.fwfilelist table.fwfilelist td.i0, #maincol div.fwfilelist table.fwfilelist td.i1 { background-color:transparent; } /* sitemap */ #maincol div.fwsitemap { } #maincol div.fwsitemap div.item {} #maincol div.fwsitemap div.item a { text-decoration:none; } #maincol div.fwsitemap div.item1 { font-weight:bold; padding-left:0px; margin-top:20px; } #maincol div.fwsitemap div.item2 { padding-left:10px; } #maincol div.fwsitemap div.item3 { padding-left:20px; } #maincol div.fwsitemap div.item4 { display:none; } /* redirect */ #maincol div.fwredirect {} /* galerie */ #maincol div.fwgallery { width: 100%; clear: both; margin-bottom:0px; } #maincol div.fwgallery a img { border: none; } #maincol div.fwgallery table.fwgallery { clear: both; } #maincol div.fwgallery table.fwgallery td.item { text-align: center; } #maincol div.fwgallery table.fwgallery td.thumbnail { padding: 0 10px 10px 0; height: auto; vertical-align: middle; text-align: center; border: none; width:190px; } #maincol div.fwgallery table.fwgallery td.thumbnail img { border:1px solid #000000; } #maincol div.fwgallery table.fwgallery td.thumbnail div.highslide-caption { display:none; } #maincol div.fwgallery div.fwnavigation table.datanavigation td.first { visibility: hidden; } #maincol div.fwgallery div.fwnavigation table.datanavigation td.last { visibility: hidden; } #maincol div.fwgallery div.navigationitem { } #maincol div.fwgallery div.fwnavigation table.datanavigation td.selected a { color:#000000; } /* diashow */ #maincol div.fwslideshow { margin:0; } #maincol div.fwslideshow div.jquery-cycle-slides { border:1px solid #000000; margin: 0 auto 0 auto; /*position:static !important;*/ } #maincol div.fwslideshow div.jquery-cycle-slides div.jquery-cycle-slide { /*position:static !important;*/ } /* mitteilungen (db, formular-zu-email) */ div.message { font-size:13px; line-height:20px; } div.okmessage { } div.nokmessage { color:red; } /* formular-zu-email */ #maincol div.fwformtomail { padding: 0; border: none; } #maincol div.fwformtomail span.mail-frm-success { color: #00ff00; } #maincol div.fwformtomail span.mail-frm-err { color: #ff0000; } #maincol div.fwformtomail table.mail-tbl { margin: 0; } #maincol div.fwformtomail table.mail-tbl form.mail-frm .mail-tbl-but { margin: 0; } #maincol div.fwformtomail table.mail-tbl form.mail-frm table { border-collapse:collapse; } /* gästebuch */ #maincol div.fwguestbook1 { width:371px; } #maincol div.fwguestbook1 table.text1 table.entry { margin-bottom:20px; border:none; } #maincol div.fwguestbook1 table.text1 table.entry td { padding:0; } #maincol div.fwguestbook1 table.text1 table.entry td.author { font-size:14px; font-weight:bold; } #maincol div.fwguestbook1 table.text1 table.entry td.date { color:#6F7171; padding-bottom:3px; } #maincol div.fwguestbook1 table.text1 table.entry td.title { font-size:12px; font-style:normal; font-weight:bold; border:none; } #maincol div.fwguestbook1 table.text1 table.entry td.text { } /* mediaplayer */ #maincol div.mediaplayer { margin:0 0 25px 0; } /* spezial blogfeed */ #maincol div.fwblogfeedspecial { margin-bottom:0px; } #maincol div.fwblogfeedspecial form { margin:0 0 20px; } #maincol div.fwblogfeedspecial form table { border-spacing:0; } #maincol div.fwblogfeedspecial form table td table td { padding-right:5px; } #maincol div.fwblogfeedspecial form table td table td .frm-frm-but { margin-top:5px; } #maincol div.fwblogfeedspecial div.item { padding-bottom:10px; clear:both; } #maincol div.fwblogfeedspecial div.item div.title { text-transform:lowercase; font-size:14px; font-weight:bold; clear:both; } #maincol div.fwblogfeedspecial div.item div.pubdate { font-size:10px; clear:both; } #maincol div.fwblogfeedspecial div.item div.message { clear:both; } #maincol div.fwblogfeedspecial div.item div.morelink { clear:both; } /* db-tabelle */ #maincol table.tab { border:none; } #maincol table.tab td { border:none; background-color:transparent; } /* musikliste */ #maincol div.fwmusiclist {} #maincol div.fwmusiclist-mini { margin-bottom:0px; height:108px; overflow:hidden; } #maincol div.fwmusiclist-mini table.text { border-collapse:collapse; } #maincol div.fwmusiclist-mini table.text div.image { float:left; padding-right:4px; width:72px; height:72px; text-align:center; overflow:hidden; } #maincol div.fwmusiclist-mini table.text div.image img { border:1px solid #000000; } /******************************** * rightcol ********************************/ #rightcol .fwelement { text-align:center; margin:0 0 10px 0; padding-bottom:0px; font-size:12px; line-height:20px; } #rightcol .fwelement p { margin:0 0 10px 0; } #rightcol .fwelement th p, #rightcol .fwelement td p { margin:0px; } #rightcol .fwelement ul { margin-top:0px; margin-bottom:0px; } #rightcol .fwelement a { color:#6F7171; font-weight:bold; text-decoration:none; } #rightcol .fwelement a:hover { color:#000000; font-weight:bold; text-decoration:none; } #rightcol .clear { font-size:0px; height:0px; line-height:0px; } /* titel */ #rightcol div.fwtitle { margin-bottom:0; clear:both; } #rightcol div.fwtitle h1 { font-size:14px; } #rightcol div.fwtitle div.picture { display:none; } #rightcol div.fwtitle div.picture-left { display:none; } #rightcol div.fwtitle div.picture-right { display:none; } #rightcol div.fwtitle img.titleasimage {} #rightcol div.fwtitle1 {} /* variante überschrift 2 */ #rightcol div.fwtitle2 h2 { font-size:14px; } /* text */ #rightcol div.fwtext { margin: 0; } /* variante linker text für rechte spalte */ #rightcol div.fwtext2 { text-align:left; } /* bild */ #rightcol div.fwpicture-group {} #rightcol div.fwpicture-group div.fwpicture { width:100%; margin: 0; } #rightcol div.fwpicture-group div.fwpicture div.picture { margin:0 auto 0 auto; } #rightcol div.fwpicture-group div.fwpicture div.picture img { border:1px solid #000000; } #rightcol div.fwpicture-group div.fwpicture div.text { margin-top: 0.5em; } /* gästebuch */ #rightcol div.fwguestbook1 form.frm-frm table.text1 table.tbl-frm td.lab { padding:0; } #rightcol div.fwguestbook1 form.frm-frm table.text1 table.tbl-frm td.inp { padding:0 0 5px 0; } #rightcol div.fwguestbook1 form.frm-frm table.text1 table.tbl-frm td.inp input { width:190px; } #rightcol div.fwguestbook1 form.frm-frm table.text1 table.tbl-frm td.inp textarea { width:190px; height:100px; } /* musikliste */ #rightcol div.fwmusiclist {} #rightcol div.fwmusiclist form.frm-frm { margin:0 0 20px 0; } #rightcol div.fwmusiclist form.frm-frm table.text { border-collapse:collapse; } #rightcol div.fwmusiclist form.frm-frm table.text div.search table { border-collapse:collapse; } #rightcol div.fwmusiclist form.frm-frm table.text div.search table td { padding-bottom:3px; } #rightcol div.fwmusiclist form.frm-frm table.text div.search table td.label { padding-right:5px; } #rightcol div.fwmusiclist form.frm-frm table.text div.search table td.input .frm-frm-txt { width:115px; } #rightcol div.fwmusiclist form.frm-frm table.text div.search table td.input .frm-frm-sel { width:119px; } #rightcol div.fwmusiclist table.tab { border-collapse:collapse; border:none; } #rightcol div.fwmusiclist table.tab td { vertical-align:top; background-color:transparent; border-color:transparent; padding-bottom:15px; } #rightcol div.fwmusiclist table.tab td.h { display:none; } #rightcol div.fwmusiclist table.tab td.f { padding-left: 0px; } #rightcol div.fwmusiclist table.tab td { padding-left: 8px; } #rightcol div.fwmusiclist table.tab td div.image { width:72px; height:72px; text-align:center; overflow:hidden; } #rightcol div.fwmusiclist table.tab td div.image img { border:1px solid #000000; } #rightcol div.fwmusiclist div.navigation { text-align:center; } #rightcol div.fwmusiclist div.navigation img { width:10px; height:10px; } #rightcol div.fwmusiclist div.nodata {} /* spezial updates */ #rightcol div.fwupdatesspecial {} #rightcol div.fwupdatesspecial div.updatelist { height:396px; margin-bottom:10px; overflow:hidden; } #rightcol div.fwupdatesspecial div.updatelist table.fwtable { border:none; } #rightcol div.fwupdatesspecial div.updatelist table.fwtable td, #rightcol div.fwupdatesspecial div.updatelist table.fwtable th { height:20px; border: none; padding:5px 0 5px 0; vertical-align:top; } #rightcol div.fwupdatesspecial div.updatelist table.fwtable th.f, #rightcol div.fwupdatesspecial div.updatelist table.fwtable td.f { font-weight:bold; text-align:left; padding-right:5px; } #rightcol div.fwupdatesspecial div.updatelist table.fwtable th { font-weight:bold; } #rightcol div.fwupdatesspecial div.updatelist table.fwtable td.i1 { background-color: transparent; } #rightcol div.fwupdatesspecial div.updatelist table.fwtable td.i1 a {} #rightcol div.fwupdatesspecial div.updatelist table.fwtable td.i0 { background-color: transparent; } #rightcol div.fwupdatesspecial div.updatelist table.fwtable td.i0 a {} #rightcol div.fwupdatesspecial div.updatelist table.fwtable td.separator { height:25px; } #rightcol div.fwupdatesspecial div.sponsorlist {} #rightcol div.fwupdatesspecial div.sponsorlist div.fwpicture-group div.fwpicture div.picture img { border:none; } #rightcol div.fwupdatesspecial div.sponsorlist div.fwpicture-group div.fwpicture div.text { margin-top:0; } #rightcol div.fwupdatesspecial div.sponsorlist div.sponsor1, #rightcol div.fwupdatesspecial div.sponsorlist div.sponsor2, #rightcol div.fwupdatesspecial div.sponsorlist div.sponsor3 { margin:0; } #rightcol div.fwupdatesspecial div.sponsorlist div.sponsor1, #rightcol div.fwupdatesspecial div.sponsorlist div.sponsor2 { width:100px; float:left; display:inline; } #rightcol div.fwupdatesspecial div.sponsorlist div.sponsor1 {} #rightcol div.fwupdatesspecial div.sponsorlist div.sponsor1 div.fwpicture-group div.fwpicture { padding:8px 0 0 0; } #rightcol div.fwupdatesspecial div.sponsorlist div div.title { font-weight:bold; text-align:center; padding:0 0 2px 0; }