/** * Custom Stylesheet for FinishWeb Site www.ski-valais.ch * * Copyright: * BAR Informatik AG * Brig-Glis, Switzerland * * Path: * [finishwebroot]/layout/[Layout]/style.css * * Authors: * pb Philipp Berchtold, BAR Informatik AG * bz Bernd Zumoberhaus, BAR Informatik AG * * Changes: * 15.09.2009 pb initial version * 07.06.2010 bz added new css-classes (shop) * 14.07.2010 bz updates */ /************************************************************************************************** * 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: Verdana, sans-serif; font-size: 70%; margin:0px; height:100%; } p { padding: 10px; margin:0; } /************************************************************************************************** * Custom classes **************************************************************************************************/ /* Floating */ .float-left { float: left; } .float-right { float: right; } .clear { clear:both;} .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 { margin-top:0px; /*color:#D60000;*/ color:#FE004C; font-size:12pt; font-weight:bold; margin-bottom:5px; } /* font-size, font-weight */ h1, .fwelement h1 { } h2, .fwelement h2 { } h3, .fwelement h3 { } /* fw... ... */ /************************************************************************************************** * Layout-styling **************************************************************************************************/ /******************************** * page ********************************/ div#page { width: 1100px; height:100% } /******************************** * header ********************************/ div#header { width: 1100px; } div.clearingzone { width: 230px; float:left; background-color:#FFFFFF; height:20px; width:230px; padding-top:0px; margin-top:0px; } /******************************** * main ********************************/ div#main { float:left; width:1230px; background-image:url("bg_left.gif"); background-repeat:repeat-y; } /******************************** * leftcol ********************************/ div.leftcol { display: inline; } /* navigation */ #leftcol #navigation { width:230px; } /* level 2 */ #leftcol #language { width:230px; font-weight:bold; font-size:10pt; color:#FFFFFF; font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular; list-style:none; } #leftcol #language a:hover { text-decoration:underline; } #leftcol #navigation ul.menu1items li.menue1 { padding-bottom:3px; padding-top:2px; font-size:10pt; font-weight:bold; color:#FFFFFF; font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular; list-style:none; } #leftcol #navigation ul.menu1items li.menue1-active { padding-bottom:3px; padding-top:2px; font-size:10pt; font-weight:bold; color:#FFFFFF; font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular; list-style:none; } #leftcol #navigation ul.menu1items li.menue1-active a {list-style:none; border: dotted 1px; } #leftcol #navigation ul.menu2items li.menue2 p { font-weight:normal; list-style:none; border: none; } #leftcol #navigation ul.menu2items li.menue2 { height:16px; } #leftcol #navigation ul.menu2items li.menue2 a { font-weight:normal; list-style:none; border: none; } #leftcol #navigation ul.menu2items li.menue2-active { font-weight:normal; list-style:none; border: dotted 0px; padding:0px; margin:0px; height:16px; } #leftcol #navigation ul.menu2items { padding-top:0px; } #leftcol #navigation ul.menu2 { padding-top:0px; } /******************************** * maincol ********************************/ div#maincol a{ color:#FE004C; text-decoration:underline; } div#maincol a:hover{ color:#FE004C; text-decoration:none; } div#maincol .fwgallery{ padding-top: 10px; } div#maincol p{ padding:0px; } div#maincol .fwelement .fwtable p{ padding: 5px; } div#maincol .fwelement .fwtable{ border-bottom:1px solid #000000; border-top:1px solid #000000; margin:0; } div#maincol table.tab td.f { background-color:#FE004C; color:#FFFFFF; font-size:10pt; } div#maincol td.enabled img{ border: 0px; } div#maincol .fwgallery .fwgallery .thumbnail { padding-left: 40px; padding-bottom:20px; } div#maincol table.tab td.i0 { background-color:#FFFFFF; margin-left:15px; vertical-align:top; } div#maincol table.tab td.i1 { background-color:#E0E0E0; vertical-align:top; } div#maincol { margin: 0; height:100%; float:left; padding-left: 15px; width:835px; } div#maincol .fwpicture { padding: 5px; padding-left: 25px; } div#maincol .fwpicture .picture{ vertical-align:middle; } div#maincol .fwpicture .fwpicturegroup { padding:5px 5px 10px 2px; } div#maincol .fwredirect{ padding:20px; } div#maincol .fwlink{ padding-bottom: 10px; } /************************************************************************************************** * Layout-defined styling of Finishweb elements **************************************************************************************************/ /******************************** * page ********************************/ /******************************** * header ********************************/ div.header .fwelement {} div.header{ height:131px; width:100%; } div.logo { float: left; margin:5px 3px 0 6px; text-align:center; vertical-align:middle; width:221px; height:117px; } div.logo div.fwpicture-group { margin:0; padding-left: 0; } div.bannerhome { height:131px; left:221px; padding:0px; margin:0px; float:left; } div.bannerhome div.banner { padding-bottom:0px; width:850px; height:111px; overflow:hidden; background-image: url("top_all.JPG"); } div.bannerhome div.home { padding-top:0px; height: 20px; background-color:#FE004C; margin-top:0px; width:850px; } div.bannerhome div.home a { color:#FFFFFF; font-size:10pt; font-weight:bold; text-decoration:none; font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular; padding-left:18px; text-align:center; } div.bannerhome div.home a:hover { color:#FFFFFF; text-decoration:underline; } div.bannerhome div.home .fwelement { margin:0} div.header .fwelement .title{ padding-top:2px; } /******************************** * navigation ********************************/ div.leftcol .laguagefloat{ float:left; padding-left:15px; padding-right:35px; padding-top:2px; } div.leftcol .fwelement {} div.leftcol{ background-color:#FE004C; padding-top:0; text-align:left; vertical-align:top; width:230px; float:left; margin: 0; height:100%; } div.leftcol ul{ padding-left: 15px; padding-top:21px; padding-bottom:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; margin-top:0px; list-style:none; display:inline-block; } div.leftcol a { color:#FFFFFF; display:block; font-size:10pt; margin:0; padding:0; text-decoration:none; width:auto; } div.baradvertising a { font-size:8pt; } div.leftcol a:hover { color:#FFFFFF; text-decoration:underline; } div.baradvertising{ padding-top:25px; padding-bottom:25px; } div.baradvertising p{ color:#FFFFFF; font-size:8pt; font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular; text-align:center; } div.baradvertising img{ padding-bottom: 20px; padding-top: 0px; } /******************************** * maincontent ********************************/ div#maincontent .fwelement {} div.fwlinklist { font-size:11pt; } .fwelement { margin:0; } .fwelement p { margin:0 0 16px 0; } /* titel */ div.fwtitle {} /* text */ div.fwtext{ font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular; font-size: 11pt; } /* bild */ div.fwpicture-group { padding-left: 2px; margin:0; padding-bottom:10px; } div.fwpicture-group .fwpicture { float:left; } div.fwpicture-group {} div.fwelement .fwpicture .text { text-align:center; } /* tabelle */ table.fwelement { BORDER-TOP: #000000 1px solid; MARGIN: 0px; BORDER-BOTTOM: #000000 1px solid width:100%; font-size:9pt; padding-bottom: 15px; } table.fwelement th.h{ background-color:#FE004C; color:#FFFFFF; font-size:11pt; } table.fwelement td.i0{ background-color:#FFFFFF; padding-right:10px; padding-top:2px; } table.fwelement td.i1{ background-color:#E0E0E0; padding-right:10px; padding-top:2px; } table.fwelement th p, table.fwelement td p { margin:0; } table.fwelement{ background-color:#FFFFFF; width:100%; } div#maincol .sponsoren{ padding-top: 15px; padding-bottom: 15px; } div#maincol .fwlinklist .title{ padding-top: 5px; font-weight:bold; } /* linkliste */ div.fwlink div.image { height:auto; } div.fwlink div.title { clear:both; } /* rss-news-feed */ div#news_js_rss_feed { font-size:12px; } /* gästebuch (materialbörse) */ div.fwguestbook1 {} div.fwguestbook1 table.text1 table.entry { margin-bottom:20px; border:none; } div.fwguestbook1 table.text1 table.entry td { padding:0; } div.fwguestbook1 table.text1 table.entry td.author { font-size:14px; font-weight:bold; } div.fwguestbook1 table.text1 table.entry td.date { color:#6F7171; padding-bottom:3px; } div.fwguestbook1 table.text1 table.entry td.title { font-size:12px; font-style:normal; font-weight:bold; border:none; } div.fwguestbook1 table.text1 table.entry td.text { } /* shop */ #maincol div.shop div.clear { height:1px; } #maincol div.shopnavigation { position:relative; padding-bottom:30px; } #maincol div.shopnavigation a { text-decoration:none; } #maincol div.shopnavigation ul {list-style-type:none; margin:0px; padding:0px; } #maincol div.shopnavigation ul li.menuitem1 { float:left; margin-bottom:1px; padding-right:7px; } #maincol div.shopnavigation ul li.menuitem1 a { color:#FE004C; } #maincol div.shopnavigation ul li.menuitem1 a:hover { color:#000000; } #maincol div.shopnavigation ul li.menuitemselected { font-weight:bold; } #maincol div.shopnavigation ul li.menuitemselected a { color:#000000 } *+html #maincol div.shopnavigation ul li ul li.menuitem2{ margin-top: 20px; } /* nur für den IE7 */ #maincol div.shopnavigation ul li ul { list-style-type:none; position:absolute; left:0px; margin:0px; } #maincol div.shopnavigation ul li ul li.menuitem2 { float:left;margin:1px; } #maincol div.shopnavigation ul li ul li.menuitem2 a { text-decoration:none; font-weight: normal; color:#FE004C; padding-right:7px; } #maincol div.shopnavigation ul li ul li.menuitem2 a:hover { color:#000000; } #maincol div.shopnavigation ul li ul li.menuitemselected a { color:#000000; } #maincol div.shop { } #maincol div.shop a { color:#FE004C; text-decoration:none; } #maincol div.shop div.messages { clear:both; padding:10px 0; } #maincol div.shop div.messages div.success { } #maincol div.shop div.error { margin-top:10px; background-color:#FFFFFF; } #maincol div.shop div.messages div.error { margin-top:0px; background-color:transparent; } #maincol div.shop div.menu { /*width:433px;*/ background-color:transparent; } #maincol div.shop div.menu a { color:#615c5c; } #maincol div.shop div.menu a:hover { color:#000000; } #maincol div.shop div.menu div.selected a { color:#000000; } #maincol div.shop div.menu div.productlist { /*siehe unten*/ } #maincol div.shop div.menu div.basket { /*siehe unten*/ } #maincol div.shop div.menu div.cash { /*siehe unten*/ } #maincol div.shop div.categorypath { margin-bottom:0px; padding:10px 5px 0 5px; background-color:#FFFFFF; border-top:2px solid #FE004C; } #maincol div.shop div.categorypath a { color:#FE004C; } #maincol div.shop div.productdetail div.imagecol { width:370px; float:left; } #maincol div.shop div.productdetail div.imagecol div.productimage { float:left; margin-right:10px; margin-bottom:5px; } #maincol div.shop div.productdetail div.imagecol div.productimage img { } #maincol div.shop div.productdetail div.datacol { width:450px; float:left; text-align:left; } #maincol div.shop div.productdetail { margin-top:10px; padding:5px; background-color:#FFFFFF; } #maincol div.shop div.productdetail div.datacol div.productname { color:#FE004C; font-weight:bold; } #maincol div.shop div.productdetail div.datacol div.productnumber { margin-top:20px; } #maincol div.shop div.productdetail div.datacol div.productnumber div.title { float:left; padding-right:5px; } #maincol div.shop div.productdetail div.datacol div.productdescription { margin-bottom:10px; } #maincol div.shop div.productdetail div.datacol div.productlink { } #maincol div.shop div.productdetail div.datacol div.productdescription2 { } #maincol div.shop div.productdetail div.datacol div.amount { padding-bottom:10px; margin-top:20px; } #maincol div.shop div.productdetail div.datacol div.amount INPUT { } #maincol div.shop div.productdetail div.datacol div.amount div.title { float:left; width:60px; padding-right:5px; } #maincol div.shop div.productdetail div.datacol div.productprice { margin:2px 0 10px 5px; } #maincol div.shop div.productdetail div.datacol div.productprice div.title { float:left;padding-right:5px; } #maincol div.shop div.productdetail div.datacol div.productvariation { clear:both; } #maincol div.shop div.productdetail div.datacol div.productvariation div.title { float:left; } #maincol div.shop div.productdetail div.datacol div.productvariation div.variation { padding-bottom:5px; } #maincol div.shop div.productdetail div.datacol div.productvariation label { width:60px; float:left; padding-right:5px; } #maincol div.shop div.productdetail div.datacol div.productvariation SELECT { } #maincol div.shop div.productdetail div.datacol div.productvariation INPUT { margin-right:5px; } #maincol div.shop div.productdetail div.datacol div.basket { float:right; } #maincol div.shop div.productlist { background-color:#FFFFFF; margin-top:10px; } #maincol div.shop div.menu div.productlist { background-color:transparent; margin-top:0px; } #maincol div.shop div.productlist div.navigation { margin-top:0px; margin-bottom:0px; padding-right:5px; padding-left:5px; } #maincol div.shop div.productlist div.navigation table.datanavigation { margin-right:auto; margin-left:auto; } #maincol div.shop div.productlist div.navigation table.datanavigation td { } #maincol div.shop div.productlist div.navigation table.datanavigation td a { color:#5A5A5A; } #maincol div.shop div.productlist div.navigation table.datanavigation td img { border:none; } #maincol div.shop div.productlist div.navigation table.datanavigation td.page { padding-right:5px; } #maincol div.shop div.productlist div.navigation table.datanavigation td.first { padding-right:5px; } #maincol div.shop div.productlist div.navigation table.datanavigation td.previous { padding-right:5px; } #maincol div.shop div.productlist div.navigation table.datanavigation td.next { padding-right:5px; } #maincol div.shop div.productlist div.navigation table.datanavigation td.last { } #maincol div.shop div.productlist div.navigation table.datanavigation td.selected { } #maincol div.shop div.productlist div.navigation table.datanavigation td.selected a { color:#FE004C; } #maincol div.shop div.productlist div.navigation table.datanavigation td.disabled { } #maincol div.shop div.productlist div.category { padding:10px 5px 20px 10px; border-top:2px solid #FE004C; } #maincol div.shop div.productlist div.category div.categoryimage { float:left; width:110px; display:none; } #maincol div.shop div.productlist div.category div.categoryimage img { border:none; } #maincol div.shop div.productlist div.category div.categoryname { float:left; } #maincol div.shop div.productlist div.category div.categoryname a { float:left; font-size:14px; font-weight:normal; color:#FE004C; line-height:16px; padding-bottom: 5px; } #maincol div.shop div.productlist div.category div.categorydescription { clear:both; } #maincol div.shop div.productlist div.product { clear:both; margin-top:0px; padding:5px; } #maincol div.shop div.productlist div.product div.imagecol { width:140px; float:left; } #maincol div.shop div.productlist div.product div.datacol { width:680px; float:left; text-align:left; } #maincol div.shop div.productlist div.product div.datacol div.productname { margin:0; } #maincol div.shop div.productlist div.product div.datacol div.productname a { color:#FE004C; } #maincol div.shop div.productlist div.product div.datacol div.productname img { } #maincol div.shop div.productlist div.product div.datacol div.productimage {} #maincol div.shop div.productlist div.product div.datacol div.productimage img { } #maincol div.shop div.productlist div.product div.datacol div.productdescription { margin:0 0 20px 0; } #maincol div.shop div.productlist div.product div.datacol div.productnumber { margin:0 0 10px 0; } #maincol div.shop div.productlist div.product div.datacol div.productnumber div.title { float:left; padding-right:5px; } #maincol div.shop div.productlist div.product div.datacol div.amount { width:60px; margin:0; padding-bottom:0px; } #maincol div.shop div.productlist div.product div.datacol div.amount INPUT { } #maincol div.shop div.productlist div.product div.datacol div.amount div.title { } #maincol div.shop div.productlist div.product div.datacol div.productprice { margin:2px 0 10px 5px; } #maincol div.shop div.productlist div.product div.datacol div.productvariation { clear:both; margin:0; } #maincol div.shop div.productlist div.product div.datacol div.productvariation div.variation { padding-bottom:5px; } #maincol div.shop div.productlist div.product div.datacol div.productvariation label { width:60px; padding-right:0px; float:left; } #maincol div.shop div.productlist div.product div.datacol div.productvariation SELECT { margin-left:5px; } #maincol div.shop div.productlist div.product div.datacol div.productvariation INPUT { margin-left:5px; } #maincol div.shop div.productlist div.product div.datacol div.basket { clear:both; text-align:right; } #maincol div.shop div.productlist div.separator { height:0px; border-bottom:1px solid #FE004C; } #maincol div.shop div.productlist div.separator-first { } #maincol div.shop div.productlist div.separator-last { border-bottom:2px solid #FE004C; } #maincol div.shop div.productlist div.product div.clear { } #maincol div.shop div.request { margin-top:10px; padding:5px; background-color:#FFFFFF; } #maincol div.shop div.request div label { width:160px; margin:0px; } #maincol div.shop div.request div input#absenden { margin-left:160px; margin-top:10px; width:auto; color:#FFFFFF; background-color:#FE004C; border:2px outset #FE004C; } #maincol div.shop div.request div textarea { margin-left:160px; width:250px; height:100px; } #maincol div.shop table.basket { margin-top:10px; background-color:#FFFFFF; } #maincol div.shop table.basket div.error { margin-top:0px; background-color:transparent; } #maincol div.shop table.basket td { padding:2px 5px; } #maincol div.shop table.basket td.mwst { padding-right:5px; } #maincol div.shop table.basket tr.header td { } #maincol div.shop table.basket tr.product td { padding-top:4px; } #maincol div.shop table.basket tr.receipt { } #maincol div.shop table.basket tr.receipt td { } #maincol div.shop table.basket tr.basket td { padding:5px; } #maincol div.shop table.basket td input { vertical-align:middle; } #maincol div.shop table.basket input.clearbasket { color:#FFFFFF; background-color:#FE004C; border:2px outset #FE004C; } #maincol div.shop table.basket input.clearbasket:hover { border:2px outset #FE004C; } #maincol div.shop table.basket input.tocash { color:#FFFFFF; background-color:#FE004C; border:2px outset #FE004C; } #maincol div.shop table.basket input.tocash:hover { border:2px outset #FE004C; } #maincol div.shop div.cash { margin-top:10px; background-color:#FFFFFF; } #maincol div.shop div.menu div.cash { background-color:transparent; } #maincol div.shop div.cash div.error { margin-top:0px; background-color:transparent; } #maincol div.shop div.cash div.title { margin-top:0px; padding-top:5px; font-size:14px; font-weight:normal; color:#FE004C; background-color:#FFFFFF; } #maincol div.shop div.cash div.subtitle { } #maincol div.shop div.cash div.description { } #maincol div.shop div.cash div.label { width:160px; } #maincol div.shop div.cash div.input { margin-left:0px; } #maincol div.shop div.cash div.input input { width:250px; } #maincol div.shop div.cash div.input select { } #maincol div.shop div.cash div.button { margin-left:160px; } #maincol div.shop div.cash div.button div.remind { } #maincol div.shop div.cash div.button a { } #maincol div.shop div.cash div.button a:hover { } #maincol div.shop div.cash div.paymentmethods { padding-right:5px; padding-left:5px; } #maincol div.shop div.cash div.paymentmethods div.paymentmethod { } #maincol div.shop div.cash div.paymentmethods div.paymentmethod div.pmcomment { } #maincol div.shop div.cash div.comment div.input { margin-top:5px; } #maincol div.shop div.cash div.comment div.input textarea { margin-left:160px; width:250px; } #maincol div.shop div.cash div.login { padding-right:5px; padding-bottom:5px; padding-left:5px; border-bottom:5px solid #FE004C; } #maincol div.shop div.cash input.login { color:#FFFFFF; background-color:#FE004C; border:2px outset #FE004C; } #maincol div.shop div.cash input.login:hover { border:2px outset #FE004C; } #maincol div.shop div.cash div.billingaddress { padding-right:5px; padding-bottom:5px; padding-left:5px; border-bottom:5px solid #FE004C; } #maincol div.shop div.cash div.registration { padding-right:5px; padding-bottom:5px; padding-left:5px; border-bottom:5px solid #FE004C; } #maincol div.shop div.cash div.deliveryaddress { padding-right:5px; padding-bottom:5px; padding-left:5px; border-bottom:5px solid #FE004C; } #maincol div.shop div.cash div.comment { padding-right:5px; padding-left:5px; } #maincol div.shop div.cash div.agb { padding-right:5px; padding-left:5px; } #maincol div.shop div.cash div.agb div.checkbox { } #maincol div.shop div.cash div.agb div.text { } #maincol div.shop div.cash div.continuebutton { margin-left:160px; padding-right:5px; padding-bottom:5px; padding-left:5px; } #maincol div.shop div.cash input.continue { color:#FFFFFF; background-color:#FE004C; border:2px outset #FE004C; } #maincol div.shop div.cash input.continue:hover { border:2px outset #FE004C; } #maincol div.shop div.cash input.order { color:#FFFFFF; background-color:#FE004C; border:2px outset #FE004C; } #maincol div.shop div.cash input.order:hover { border:2px outset #FE004C; } #maincol div.shop div.cash { } #maincol div.shop div.cash td { } #maincol div.shop div.cash table.receipt { } #maincol div.shop div.cash table.receipt td { padding:2px 5px; } #maincol div.shop div.cash table.receipt td.title { width:160px; } #maincol div.shop div.cash tr.header td { } #maincol div.shop div.cash td.title { } #maincol div.shop div.cash tr.product td { } #maincol div.shop div.cash tr.receipt { } #maincol div.shop div.cash tr.receipt td { } /* #maincol div.shopnavigation { } #maincol div.shopnavigation div.menuitem1 { float:left; padding-right:10px; } #maincol div.shopnavigation div.menuitem1 a { } #maincol div.shopnavigation div.menuitem1 a:hover { } #maincol div.shopnavigation div.menuitemselected a { } */ #maincol div.shop div.deliverytext { background-color:white;padding:5px; } #maincol div.shop div.deliverytext div.title { font-weight:bold; color:#000000; font-size:12px; padding-top:0px; }