/* Layout and Positioning ------------------------------------------------------------------------------------------------ */ /* Membership Top Page */ #header {background: transparent url(/img/about_flanders_center/masthead_photo_aboutcenter_1.jpg) left top no-repeat;} #membershipRow { background: #ccc url(/images/bg_pattern_purple.png) repeat-y left top; } #membership { background:url(/img/global/bg_content_9_3.png) repeat-y left top; } #membershipSignup { background:url(/img/global/bg_content_10_2.png) repeat-y left top; } h2#membershipLabel { height:500px; background-position: top left; background-repeat: no-repeat; } body.ja h2#membershipLabel { background-image: url(/img/membership/h2_membership_ja.png); } body.nl h2#membershipLabel { background-image: url(/img/membership/h2_membership_nl.png); } h2#membershipSignupLabel { height:500px; background-position: top left; background-repeat: no-repeat; } body.ja h2#membershipSignupLabel { background-image: url(/img/membership/h2_membership_form_ja.png); } body.nl h2#membershipSignupLabel { background-image: url(/img/membership/h2_membership_form_nl.png); } #mContent {width:600px; overflow:hidden; display:inline; float: left; margin: 0px 75px 0 0;} #mIntro, #signupIntro { display: inline; float: left; height:129px; width: 600px; margin: 15px 75px 0px 0px; padding: 8px 0px 0px 0px; border-top: 1px solid #7c827c;} .ja #mIntro { height:77px; background: transparent url(/img/membership/intro_membership_home_ja.png) 82px 15px no-repeat;} .nl #mIntro { height:78px; background: transparent url(/img/membership/intro_membership_home_nl.png) 82px 15px no-repeat;} .ja #signupIntro { height:102px; background: transparent url(/img/membership/intro_membership_form_ja.png) 82px 15px no-repeat;} .nl #signupIntro { height:100px; background: transparent url(/img/membership/intro_membership_form_nl.png) 82px 15px no-repeat;} #mIntro h2, #signupIntro h3, #signupIntro p, #mIntro p {text-indent: -4000px; overflow: hidden;} #mDetails { display: inline; float: left; width: 600px; padding: 10px 0px 0px 0px; border-top: 1px solid #7c827c; } #mOverview { display: inline; float: left; width: 525px; margin:0 0 0px 75px; } #mOverview p {padding-left:7px; padding-right:7px;} #moreDetailsPrices { display: inline; float: left; width: 600px; margin:0 0 30px 0px; border-top: 1px solid #7c827c;} #moreDetailsPrices h3 { height:10px; width:200px; margin:10px 0px 10px 7px; overflow: hidden; text-indent: -4000px;} #moreDetailsPrices p {padding-left:7px; padding-right:7px;} #moreDetailsPrices li {padding-left:7px; padding-right:7px;} #moreDetailsPrices #moreDetails { display:inline; float:left; width:230px; margin:0 0 0 75px;} .nl #moreDetails h3 {height:20px; background: transparent url(/img/membership/h4_benefits_nl.png) 0px 0px no-repeat;} .ja #moreDetails h3 {height:20px; background: transparent url(/img/membership/h4_benefits_ja.png) 0px 0px no-repeat;} #moreDetailsPrices #prices {display:inline; float:left; width:269px; margin:0 0 0 25px;} .nl #prices h3 {height:20px; width:260px; background: transparent url(/img/membership/h4_pricing_nl.png) 0px 0px no-repeat;} .ja #prices h3 {height:20px; width:260px; background: transparent url(/img/membership/h4_pricing_ja.png) 0px 0px no-repeat;} #prices {width:269px; overflow: hidden;} #prices table {border-top:2px solid #7c827c; border-collapse: collapse;} #prices table tr { } #prices th { text-align:left; width:160px; padding:9px 0 9px 7px; clear:left; border-bottom: 1px solid #535c55;} #prices td { width:100px; text-align:right; padding:9px 7px 9px 0; border-bottom: 1px solid #535c55;} .nl #prices th {width:170px;} .nl #prices td {width:90px;} #howToSignUp { margin:0px 0px 0px 0px; display: inline; float: left; width: 225px; padding: 0px 0px 0px 0px; border-top: 1px solid #7c827c; } #steps { display: inline; float: left; width: 225px; border-top: 1px solid #7c827c; margin-top:1px;} #steps h3 { margin:10px 0px 0px 0px; padding-top:8px; height:24px; width:225px; overflow: hidden; text-indent: -4000px;} .ja #steps h3 {background: transparent url(/img/membership/h3_how_to_ja.png) 0px 0px no-repeat;} .nl #steps h3 {background: transparent url(/img/membership/h3_how_to_nl.png) 0px 0px no-repeat;} #steps ul {border-bottom: 1px solid #7c827c; margin-bottom:10px; padding-bottom:5px;} #steps ul li {padding:20px 7px 0px 7px; list-style: none; text-indent: 0;} #howToSignUp p {padding:0px 7px 0px 7px; margin-bottom:8px;} #steps ul #step1 {background: transparent url(/img/membership/step_no_1.png) 0px 0px no-repeat;} #steps ul #step2 {background: transparent url(/img/membership/step_no_2.png) 0px 0px no-repeat;} #steps ul #step3 {background: transparent url(/img/membership/step_no_3.png) 0px 0px no-repeat;} #applyNow { margin:15px 0px 12px 0px; display: inline; float: left; width: 225px; } #applyNow p {padding:0px 7px 0px 7px; text-align: center;} a#applyButton { overflow: hidden; text-indent: -4000px; width:211px; height:60px; display:block; margin:0px 0px 4px 0px;} .nl a#applyButton:link, .nl a#applyButton:visited { background: transparent url(/img/membership/button_join_nl.png) 0px 0px no-repeat; } .nl a#applyButton:hover, .nl a#applyButton:active { background: transparent url(/img/membership/button_join_nl.png) 0px -60px no-repeat; } .ja a#applyButton:link, .ja #applyButton:visited { background: transparent url(/img/membership/button_join_ja.png) 0px 0px no-repeat; } .ja a#applyButton:hover, .ja a#applyButton:active { background: transparent url(/img/membership/button_join_ja.png) 0px -60px no-repeat; } /* Sign Up Page */ #signupIntro { display: inline; float: left; height:102px; width: 675px; margin: 15px 0px 0px 0px; padding: 0px 0px 0px 0px; border-top: 1px solid #7c827c; border-bottom: 1px solid #7c827c; } #formError { float: left; width: 600px; border: 1px solid #f00; margin-bottom: 20px; } #formError ul { float: none; margin-left: 10px; } #formError li { list-style-position: outside; list-style-type: disc; margin-left: 10px; } #form { display: inline; float: left; width: 615px; margin: 0px 0px 75px 60px; padding: 20px 0px 0px 0px; } #fieldSet1 { display: inline; float: left; width: 315px; margin: 0px 0px 0px 0px; } #fieldSet1 p { width: 315px; } #fieldSet2 { display: inline; float: left; width: 300px; } #fieldSet2 p { width: 300px; } #fieldSet1 p, #fieldSet2 p { margin: 0px 0px 15px 0px; } #form p { display: inline; float: left; } #form label { display: inline; float: left; width: 82px; margin: 2px 7px 0px 0px; } #form input { display: inline; float: left; } #form select { display: inline; float: left; } p#addressField label { height: 80px; } p#addressField input { margin: 0px 0px 6px 0px; color: #999; } p#submitButton { margin:0; padding:0 !important; clear:left; display: inline; float: left; width: 600px !important; height:30px; text-align: right; } p#submitButton input {margin-left:500px; cursor: pointer; width: 95px; display:inline; float:left; border:0; line-height:30px; padding-top:30px; height: 30px; overflow: hidden; } p#submitButton input:hover {cursor: pointer; width: 95px; display:inline; float:left; border:0; line-height:30px; padding-top:30px; height:30px; overflow: hidden;} .ja p#submitButton input { background: transparent url(/img/global/button_send_ja.png) 0 0 no-repeat; } .ja p#submitButton input:hover { background: transparent url(/img/global/button_send_ja.png) -95px 0px no-repeat; } .nl p#submitButton input { background: transparent url(/img/global/button_send_nl.png) 0 0 no-repeat;} .nl p#submitButton input:hover { background: transparent url(/img/global/button_send_nl.png) -95px 0px no-repeat; } #membershiptype {font-size:1em;} #goBack {clear:both; width:750px; background-color: #4a514d; margin-bottom:0;} #goBack a {display:block; padding:7px 7px;} .nl #membershipThankYouIntro {margin-top:15px; margin-bottom:10px; border-top: 1px solid #7c827c; border-bottom: 1px solid #7c827c; width:600px; height:100px; background: transparent url(/img/membership/intro_membership_thankyou_nl.png) 82px 15px no-repeat;} .ja #membershipThankYouIntro {margin-top:15px; margin-bottom:10px; border-top: 1px solid #7c827c; border-bottom: 1px solid #7c827c; width:600px; height:100px; background: transparent url(/img/membership/intro_membership_thankyou_ja.png) 82px 15px no-repeat;} #membershipThankYouIntro p, #membershipThankYouIntro h2 {text-indent: -4000px; overflow: hidden;} #mThanksContent p { margin-left:82px; width:511px;} #mThanksContent #goBack {margin-top:30px; margin-left:0; width:750px;} #formError { float: left; width: 500px; background:#f5e433; border: 1px solid #c5b61d; margin: 0px 0px 20px 7px; padding-bottom:12px; } #formError h4 {float:left; display:inline; width: 496px; color:#2a352e; font-size:1.2em; font-weight: bold; margin:0px 0px 8px 0px; height:24px; padding: 4px 0px 0px 4px; background: #c5b61d; } #formError ul { float:left; display:inline; width:350px; margin-left: 10px; color:#2a352e; } #formError li { list-style-position: outside; list-style-type: disc; margin-left: 10px; float:left; display:inline; width:350px; color:#2a352e; } /* Typography ------------------------------------------------------------------------------------------------ */ /* Membership Top Page */ #mIntro h2 { font-size: 2.0em; } #mIntro p { font-size: 1.6em; } .nl #prices th {font-size:1.2em;} .nl #prices td {font-size:1.2em;} .ja #prices th {font-size:1.2em;} .ja #prices td {font-size:1.2em;} #moreDetails strong {color:#aeedff; font-weight: normal;} .nl #moreDetails li { line-height:1.66; margin:0 0 10px 0;} .ja #moreDetails li { line-height:1.833; margin:0 0 11px 0;} .ja #steps ul li {font-size:1.2em; line-height:1.833;} .nl #steps ul li {font-size:1.2em; line-height:1.666;} .nl #howToSignUp p {font-size:1.0em; line-height:1.666;} .ja #howToSignUp p {font-size:1.0em; line-height:1.833;} /* Sign Up Page */ #form label { text-align: right; }