/* screen-main0.css * Copyright 2007-2008, PensioenPage B.V. * * CSS voor weergave op het scherm, voor alle browsers. * Dit is de minimale CSS die nodig is voor de Homepage. * De rest van de generieke CSS zit in screen-main1.css. */ /* Elementen die altijd verborgen moeten blijven indien CSS ondersteund wordt */ .Hide {display:none} /* Elementen die niet op het scherm getoond dienen te worden */ .PrintOnly {display:none} /* Een aantal basisstijlen voor de meeste elementen */ div,h1,h2,h3,h4,h5,table,tbody, td,p,ul,ol,form,input,textarea {margin:0;padding:0;text-align:left;vertical-align:top;font-family:"Verdana","Sans","Bitstream Vera Sans", sans-serif;font-size:12px;color:#222} /* Verwijzingen */ a:link,a:visited {color:#008;text-decoration:none} a:link:hover,a:visited:hover {color:#008;text-decoration:underline} /* Knoppen */ .SubmitButton {max-width:300px} .SubmitButton input {height:22px;padding:0 22px;color:#008;border:1px solid #888;background:#ddd} .SubmitButton input[disabled] {color:#888;border-color:#ccc;background:#eee} .SubmitButton input:hover {text-decoration:underline;cursor:pointer;background:#6af;border-color:#008;color:#000} .SubmitButton input[disabled]:hover {text-decoration:none;cursor:default;background:#eee;border-color:#ccc;color:#888} .Button a, .Button .Disabled {float:left;height:22px;background:url(/Buttons.png) no-repeat 0 top;padding:0 0 0 22px;text-decoration:none !important;cursor:default} .Button a span, .Button .Disabled span {display:block;height:20px;background:url(/Buttons.png) no-repeat right top;padding:2px 22px 0 0;color:#aaa;white-space:nowrap} /* XXX: The white-space:nowrap fixes a problem in Opera 9 */ .Button a {background-position:0 -22px;cursor:pointer} .Button a span {background-position:right -22px;color:#222} .Button a:hover, .Button a:focus, .Button .Active {background-position:0 -44px} .Button a:hover span, .Button a:focus span, .Button .Active span {background-position:right -44px;color:#000 !important} /* Invoervelden en labels voor invoervelden */ .TextInput {border:1px solid #8c8c8c;background:#feffb9;padding:2px} .TextInput:active, .TextInput:hover {border-color:black;color:black} .TextInput:focus {border-color:black !important;color:black} /* Centreer de hele pagina, met als achtergrond een kleurverloop */ body {padding:0;margin:0;background:#162b6d} #Main0 {position:absolute;z-index:10;width:100%;text-align:center;background:url(/BackgroundGradient.png) #14296c repeat-x} #Main1 {width:989px;margin:0px auto 2px} /* TODO: Add a min-height here? */ #Main1a,#Main1b {position:absolute;z-index:30;top:107px;height:391px} #Main1a {width:35px;background:url(/Left.png)} #Main1b {width:33px;background:url(/Right.png);margin-left:956px} #Main1c {position:absolute;z-index:40;top:107px;width:68px;height:20px;margin-left:464px;background:url(/LogoBottom.png)} #SiteTitle1 {display:block;position:absolute;z-index:60;top:41px;margin-left:464px;padding-left:69px;width:0;overflow:hidden;height:82px} #SiteSubtitle {display:none} /* Het menu */ #Menu ul {position:absolute;z-index:20;top:0;width:989px;height:107px;background:url(/Menu.jpg);list-style:none} #Menu a {display:block;position:absolute;z-index:60;top:67px;padding:27px 0 0;height:0;overflow:hidden} #MenuItem_1 a {left: 61px;width:202px} #MenuItem_2 a {left:281px;width:154px} #MenuItem_3 a {left:567px;width:202px} #MenuItem_4 a {left:789px;width:143px} #Menu .Active a {top:61px;padding-top:33px} #Menu #MenuItem_1.Active a {background:url(/MenuItem_1.png)} #Menu #MenuItem_2.Active a {background:url(/MenuItem_2.png)} #Menu #MenuItem_3.Active a {background:url(/MenuItem_3.png)} #Menu #MenuItem_4.Active a {background:url(/MenuItem_4.png)} #Menu a:hover {background:url(/MenuItemsHover.png) 0 19px no-repeat} #MenuItem_2 a:hover {background-position:-202px 19px} #MenuItem_3 a:hover {background-position:-356px 19px} #MenuItem_4 a:hover {background-position:-558px 19px} /* Het zoekmenu */ #frmSearch {display:none} /* TODO: Do not even include in output */ /* Main2 zit binnen Main1 */ #Main2 {padding-top:107px} /* Koppen niveau 1 */ h1 {display:none} /* Knop om in- of uit te loggen */ #frmLoginChange {display:none} /* 'Broodkruimels' voor navigatie naar bovenliggende pagina's */ #BreadCrumbs {display:none} /* Main3 is de container onder de broodkruimels, dus binnen Main2 */ #Main3 {width:900px;height:391px;margin:0 0 0 31px;padding:0 8px 0 17px;background:url(/Main3.png) #fff repeat-y} /* SimplePage is de container voor pagina's die geen tabs en geen superform bevatten */ #SimplePage {padding:5px} /* Main4 is de container voor pagina-inhoud */ #Main4 {} #Main4 p,#Main4 ul,#Main4 ol {padding:4px 0} #Main4 p.first, #Main4 ul.first, #Main4 ol.first {padding-top:0} #Main4 ul {margin:0 6px 0 16px;list-style-image:url(/ListBullet.png)} #Main4 ol {margin:0 6px 0 22px} #Main4 li {vertical-align:top;padding:0 0 6px} .FloatClear {clear:both} /* TODO FIXME .swhNotFirst {margin-top:4px} */ /* Voettekst */ #Footer {width:989px;height:36px;margin:0;background:url(/Footer.png) no-repeat} #Footer span {display:none} /* ---------------------------------------------------- */ /* Hieronder is specifiek voor de Homepage */ #swhIntro {} #swhIntro h2 {width:228px;height:0px;padding:18px 0 0;overflow:hidden;background:url(/IntroHeading.png)} /* Tabjes */ #Tabs {position:absolute;top:168px} #Tabs h2 {display:none} #Tabs ul {display:block;width:292px;height:291px;margin:0;padding:0;background:url(/Puzzle.jpg) no-repeat;list-style:none} #Tabs li {display:block;position:absolute;z-index:90;padding:0;width:0} #Tabs a {display:block;position:absolute;height:0;overflow:hidden;background-repeat:no-repeat !important} #Tabs a:hover:active {outline:none} #Tabs .Active {z-index:80} #Tabs .Active a:hover {background:none !important} #Tabs .Active a {display:none} #Tabs a span {display:none} #tliOverRoute65 {left:125px;margin-top:120px} #tliOverRoute65 a {width:46px;height:54px} #tliOverRoute65 a:hover {background:url(/Link_Route65.png)} #tliOverRoute65.Active {width:46px;height:54px;background:url(/Link_Route65.png)} #tabOverRoute65 ul {list-style-image:url(/tabOverRoute65_ListBullet.png)} #tliDeelnemers {} #tliDeelnemers a {margin:3px 0 0 3px;width:123px;padding-top:134px} #tliDeelnemers a:hover {background:url(/Link_Deelnemers.png) 18px 56px} #tliDeelnemers.Active {width:160px;height:171px;background:url(/tliDeelnemers.png)} #tliWerkgever {left:126px;margin-top:1px} #tliWerkgever a {width:129px;padding-top:119px;margin:2px 0 0 36px} #tliWerkgever a:hover {background:url(/Link_Werkgever.png) 23px 56px} #tliWerkgever.Active {width:165px;height:159px;background:url(/tliWerkgever.png)} #tliPensioenfonds {left:133px;top:125px} #tliPensioenfonds a {width:122px;padding-top:126px;margin:37px 0 0 34px} #tliPensioenfonds a:hover {background:url(/Link_Pensioenfonds.png) 8px 44px} #tliPensioenfonds.Active {width:157px;height:164px;background:url(/tliPensioenfonds.png)} #tliConcept {left:2px;top:134px} #tliConcept a {width:130px;padding-top:116px;margin:38px 0 0 2px} #tliConcept a:hover {background:url(/Link_Concept.png) 37px 45px} #tliConcept.Active {width:167px;height:155px;background:url(/tliConcept.png)} .TabContent0 {} .TabContent0 .Active {display:block;position:absolute;z-index:50;top:168px;width:555px;height:236px;margin-left:308px;padding:45px 14px 10px 16px} .TabContent0 .Inactive, .TabContent1 h2 {display:none} #tabOverRoute65 .Active {background:url(/tabOverRoute65.png)} #tabDeelnemers .Active {background:url(/tabDeelnemers.png)} #tabWerkgever .Active {background:url(/tabWerkgever.png)} #tabPensioenfonds .Active {background:url(/tabPensioenfonds.png)} #tabConcept .Active {background:url(/tabConcept.png)} body.PageClass_Plain h2, #body-Contact h2 {height:19px;margin-bottom:4px;padding-left:13px;background:url(/h2_Background.png) repeat-x} body.PageClass_Plain .SubWithHeading .Heading1, #body-Contact .SubWithHeading .Heading1 {display:block;height:19px} body.PageClass_Plain .SubWithHeading .Heading1 span, #body-Contact .SubWithHeading .Heading1 span {display:none} body.PageClass_Plain .swhFirst {float:left;width:523px;height:389px;margin-top:10px} body.PageClass_Plain .swhFirst h2 {width:523px} body.PageClass_Plain .swhNotFirst, #body-Contact .Deck {float:right;width:297px;height:369px;padding:10px 20px;background:url(/Box.png) no-repeat} /*---- Pagina 'Missie' ----*/ #body-Missie #swhEenvoud .Heading1 {width:247px;background:url(/Heading_Eenvoud.png) no-repeat} #body-Missie #swhPensioenVanEigenaar .Heading1 {width:249px;background:url(/Heading_PensioenVanEigenaar.png) no-repeat} /*---- Pagina 'Wie zijn wij' ----*/ #swhWieZijnWij .Heading1 {width:102px;background:url(/Heading_WieZijnWij.png) no-repeat} #swhOnzePartners .Heading1 {width:118px;background:url(/Heading_OnzePartners.png) no-repeat} #swhOnzePartners li {font-weight:bold} #swhOnzePartners li a {display:block;width:100%} #swhOnzePartners li .Tekst {display:block;width:170px} #swhOnzePartners li .Omschrijving {font-weight:normal;color:#222} #liBinckBank a {background:url(/liBinckBank.png) center right no-repeat;min-height:13px} #liPalladyne a {background:url(/liPalladyne.png) center right no-repeat;min-height:22px} #liSwissRe a {background:url(/liSwissRe.png) center right no-repeat;min-height:34px} #liLXY a {background:url(/liLXY.png) center right no-repeat;min-height:31px} /*---- Pagina 'Contact' ----*/ #body-Contact #Main4 {background:url(/page-Contact.jpg) 20px 20px no-repeat;min-width:498px;min-height:363px} #body-Contact .SubContent {min-height:91px;padding-left:120px} #body-Contact .SubContent p {padding-top:14px} #swhAdres {height:130px;padding-top:0;padding-bottom:0px} #swhAdres .Heading1 {width:51px;background:url(/Heading_Adres.png) no-repeat} #swhAdres .SubContent {background:url(/swhAdres.png) top left no-repeat} #swhTelefoon {height:130px;padding-top:0;padding-bottom:0px} #swhTelefoon .Heading1 {width:137px;background:url(/Heading_Telefoon.png) no-repeat} #swhTelefoon .SubContent {background:url(/swhTelefoon.png) top left no-repeat} #swhEmail .Heading1 {width:94px;background:url(/Heading_Email.png) no-repeat} #swhEmail .SubContent {background:url(/swhEmail.png) top left no-repeat} #swhTelefoon .SubContent p, #swhEmail .SubContent p {font-weight:bold}