/* Pernicious Anaemia Society Main Style Sheet J.Patchett - Dec 2008 */ /* Reset */ * {margin:0px;padding:0px;} a img {border:none;} ul a, h1 a,h2 a, h3 a, h4 a {text-decoration:none;} #content-wrapper ul, #content-wrapper ol {margin:5px 0px 15px 40px;} /* Hidden things */ h1 a span, h2 span, #jump-menu, #login legend, #login h2,#credits,.toplink,.hidden, .print-only {display:none;} .button-strip label {visibility:hidden;} hr, .sep, .seperator {clear:both;display:block;height:0px;border:none;} /* Elements */ h2 ,h3,#content legend {color:darkblue;font-weight:normal;letter-spacing:2px;margin-top:15px;margin-bottom:5px;} #content-wrapper h3, #content-wrapper legend {padding-left:19px;} object {margin-left:20px;} h1,h2,h3,p {margin-bottom:8px;} /* Forms */ fieldset {border:none;} #content label, #content form div {display:block;clear:left;margin:1px;padding:3px 0px;background:#ddd;} #content form div:hover, #content label:hover {background:#999;} #content form div span, #content label span {width:170px;text-align:right;padding-right:5px;float:left;padding-top:2px;display:block;} #content form div span.error, #content label span.error {display:block;width:410px;text-align:left;margin:3px 10px;border:solid 1px black;} input.text ,select,textarea {border:solid 1px #666;width:200px;} .required-field input,.required-field select,.required-field select {border:solid 1px black;} #content form div label {display:inline;} #content form div label span {display:none;} #content form div select {width:auto;} #login label {display:block;letter-spacing:0px;} #login label span {width:70px;padding-right:5px;float:left;display:block;margin-top:6px;text-align:right;} #login input {width:84px;margin-top:3px;} .help,.error {background:#AACCFF none repeat scroll 0 0;border-bottom:1px solid #555555;border-top:1px solid #555555;clear:both;font-weight:bold;margin:4px 0;padding:5px 25px;font-size:0.9em;margin-bottom:6px;} .error {background:orange;font-size:1.2em;} /* Colours */ /* White */ .notice {background:white;} /* Black */ ul a {color:black;} /* Blue */ h1, h2, h3, h4, h5, h6 .sub-page-links, .sub-page-links a , #content-wrapper .page-nav li a, #content-wrapper legend, h1 a, h2 a, h3 a, h1 a:visited, h2 a:visited, h3 a:visited {color:#005E81;} /* Light Pink */ body {background-color:#FEF2ED;} /* Med Pink */ #legal {background-color:#FFDDDD;} /* Darker Red */ #container, #login {background-color:#DEA29D;} /* Layout & Positioning */ body {margin:116px auto 30px auto;max-width:1000px;position:relative;border-bottom:solid 1px #ddd;} #branding h1 {position:absolute;width:100%;height:116px;top:-116px;left:0;} #branding h1 a {position:absolute;top:0px;left:0px;width:600px;height:116px;border:none;} #branding h2 {position:absolute;top:-15px;right:-44px;width:69px;height:221px;z-index:101} #content {margin-left:250px;min-height:800px;} #main-menu {position:absolute;left:10px;width:230px;top:10px;} #login {position:absolute;top:-116px;right:0px;width:220px;} #login input#login-button {position:absolute;top:25px;right:10px;width:40px;} #login a {padding-top:6px;display:block;text-align:right;} /* Fonts */ html {font-family:Cambria,Times, Arial,Geneva,sans-serif;font-size:91.01%;letter-spacing:0.5px;} #content-wrapper legend, .button-strip input, .required-field {font-weight:bold;} h1,h2,h3,h4,h5,h6 {font-weight:normal;font-family:Georgia, times;} h2 {font-size:1.8em;} #content h4 {font-size:1.5em;} h3, #content h5 {font-size:1.4em;} h4, #content h6, #content legend, #content input,#content select {font-size:1.2em;} #primary-nav, #main-menu li ul li {font-size:0.9em;} #login {font-size:0.8em;} #legal p, .footnote {font-size:0.7em;letter-spacing:0px;} .center {text-align:center;} .button-strip, #login div {text-align:right;} /* Padding & Margins (doesn't include layout margins) */ #legal, #content {padding:10px 20px;} #login,fieldset {padding:4px 8px;} #main-menu li ul {padding-bottom:10px;} #main-menu li ul li, #content legend {padding:1px 4px 1px 30px;} #primary-nav {padding:5px 0px;} #primary-nav li {padding-left:30px;} #main-content img, .blog-content img {margin:10px;} /* Other Styling */ #main-menu li {list-style-type:none;} /* Images & Backgrounds */ html {background:url(/assets/images/top-repeater.gif) repeat-x white;} #branding h1 {background:url(/assets/images/banner.gif) no-repeat 0 0;} #branding h2 {background:url(/assets/images/top-blur.jpg) no-repeat scroll 100% 0;} .section {background:url(/assets/images/arrow-right.gif) no-repeat 0px 50%;} #content #page-sub-nav li {background:url(/assets/images/arrow-right.gif) no-repeat 10px 50%;} #main-nav li ul, #primary-nav {background:url(/assets/images/main-menu-fader.jpg) repeat-x 0px 100%;} #main-menu li ul li, #primary-nav li, #content legend {background:url(/assets/images/menu-dot.gif) no-repeat 16px 50%;} #content li {background:url(/assets/images/menu-active-dot.gif) no-repeat 16px 3px;} #login {background:url(/assets/images/loginarea.jpg) no-repeat orange 0 100%;} /* Specials */ .notice {background:#FFF9F9;border:2px solid #FFCCAA;padding:10px 15px;margin:20px 5px;} /* Overlay image at top of content */ #main-image {margin-top:-10px;position:relative;margin-right:5px;} #main-image span {position:absolute;top:70px;background:url(/assets/images/top_image_overlay_repeat.png) repeat-x 0 -70px;width:100%;height:13px;z-index:100;left:0px;} #main-image span span.l {background:url(/assets/images/top_image_overlay_left.png) no-repeat 0 0 ;height:83px;top:-70px;width:60px;} #main-image span span.r {background:url(/assets/images/top_image_overlay_right.png) no-repeat 100% 0;height:83px;top:-70px;left:auto;right:0px;width:60px;} /* Nav */ #main-menu a {display:block;} .section {border-bottom:1px solid black;font-size:1.3em;font-weight:bold;margin:15px 0 0;padding:4px 4px 4px 20px;} #content ul {margin:3px 20px 6px 20px;} #content li {list-style-type:none;padding-left:30px;padding-bottom:3px;} #content-wrapper p img {margin:8px;border:solid 3px #ddd;} /* News */ #content .news-item, #downloads .news-item {clear:both;padding:10px; background:url(/assets/images/news_background.jpg) no-repeat 0 0; } #content .news-image {float:left;} #content .news-details {font-size:0.9em;margin-left:280px;border:solid 1px #777;padding:0;} #content .news-details h3 {margin-top:0px;font-size:1.3em;letter-spacing:0;} #content .news-details h4 {font-size:1.1em;} /* on-page news */ #content {position:relative;} #main-content-area {margin-right:230px;border-right:1px solid #aaa;padding-right:10px;} #news-stories-list {position:absolute;right:27px;top:105px;width:212px;margin-bottom:30px;} .news-stories-list {width:212px;margin-bottom:30px;} #news-stories-list h2 {margin-left:10px;} .home-page #news-stories-list {top:175px;} #news-stories-list .news-details, .news-stories-list .news-details {margin:0;background:url(/assets/images/main-menu-fader.jpg) repeat-x scroll 0 100%;} #content #news-stories-list h4, #content #news-stories-list h3, .news-stories-list h4, .news-stories-list h3 {color:black;margin:0;font-weight:bold;} #news-stories-list h3, .news-stories-list h3 {font-size:1.2em;padding:0 5px;} #news-stories-list h4 {font-size:1em;padding:0 5px;} #news-stories-list p {margin-top:3px;padding:0 5px;} #downloads {margin-top:15px;} #downloads .news-details {font-size:0.9em;border:solid 1px #777;padding:0;position:relative;} #downloads .news-item {width:210px;} #downloads h3 {font-size:1.2em;letter-spacing:0px;padding:5px;} #downloads .file-icon {width:32px;position:absolute;top:5px;right:10px;} #downloads .news-details a {position:absolute;top:0;left:0;width:100%;height:100%;display:block;} #downloads .news-details h3 a {position:static;display:inline;} #downloads .news-details a span {display:none;} /* Editor stuff */ .editor-note {border-top:dotted 1px black;border-bottom:dotted 1px black;padding:10px 0px;margin:10px 0px 20px 0;} .editor-note .text {background:black;color:white;opacity:0.6;padding:4px 20px;font-style:italic;} /* Worldpay Styling (ish) */ td {white-space:nowrap;} #legal table img, #main-content table img {height:23px;margin:0 0 3px 0;} #legal table tr, .wp_icons table tr {display:inline;float:right;} .wp_icons {padding-top:10px;border-top:dotted 1px #444;} /* New Home Page styling */ #primary-content.home-page {margin-top:180px;} #home-page-images {position:absolute;top:-3px;overflow:hidden; margin:0 10px 0 0;padding:0 0 0 10px;left:-10px;width:100%;height:180px; background:url(/assets/images/news_background.jpg) no-repeat 0 -18px; } #home-page-images li {position:absolute;top:0px;list-style-type:none; background:url(/assets/images/news_background.jpg) no-repeat 100% -18px; padding:0 10px 0 0;margin:0;display:none;} #home-page-images li.first {display:block;} #home-page-images li span {position:absolute;top:25px;right:40px;letter-spacing:-1px;font-size:12px;} .floating-text {color:white;left:20px;font-size:28px;width:100%;position:absolute;bottom:15px;letter-spacing:-2px;font-weight:bold;font-family:georgia;font-style:italic;} .floating-text-shadow {color:black;left:18px;font-size:28px;width:100%;position:absolute;bottom:13px;letter-spacing:-2px;font-weight:bold;font-family:georgia;font-style:italic;} /* Columns */ #main-content-area {vertical-align:top;} .col-1of2, .col-2of2 {display:inline-block;width:47%;padding:0 10px 0 0;vertical-align:top;} .col-2of2 {padding:0 0 0 10px;} /* Blog */ .cal-date {clear:both;float:left;margin:0;padding:34px 15px;background:url(/assets/images/blog.jpg) no-repeat;margin:-30px 0 0 -15px;} .cal-date span {display:block;width:50px;text-align:center;font-size:0.7em;padding:1px 0;} .cal-date span.month {} .blog-content {margin-left:65px;} .news-sticky {border-width:2px;} /* matts changes */ /*event tickets */ #description {text-align:left; font-weight:bold} .price {font-size:30px;} #purchase {margin-top:8px;} #purchase .price {padding:0 10px 0 10px;color:#F36531;} #product-image {float:left;margin:0 10px 10px 0;} #purchase {clear:left;border-left:dotted 1px #777;border-top:dotted 1px #777;padding:5px} #content #purchase label {background:none} #form .price {font-size:20px; padding:0 0 0 0} #content #purchase div {display:block;line-height:30px;float:left;background:url(/assets/images/arrow.png) no-repeat 100% 50%;padding:5px 30px 5px 10px;height:30px;} #content #purchase .add-to-basket {} #content #purchase .add-to-basket input {float:right;padding:5px;margin-top:-5px;} #content #purchase form div label span {display:block;width:auto;margin-top:-2px;} #content #product-image img {background:transparent url(/assets/images/news_background.jpg) no-repeat scroll 0 -7px;padding-left:10px;} #content #purchase form div {clear:none;} .clear {clear:both;display:block;} /* Product Page */ #content #product-details {position:relative;padding-bottom:60px;border-bottom:dotted 1px #777;} #content #product-details #purchase {position:absolute;right:0;bottom:0;} #content .products {padding:0;margin:0;} #content .products li {position:relative;background:none;margin:0;padding:10px 5px;margin-right:10px;border-bottom:dotted 1px #777;} #content .products li img {background:transparent url(/assets/images/news_background.jpg) no-repeat scroll 0 -7px;padding-left:10px;} #content .products li h3 {margin-top:0;} #content .products li .call-to-action {position:absolute;bottom:0;right:0;padding:5px 10px;text-align:right;border-top:dotted 1px #777;border-left:dotted 1px #777; background:url(/assets/images/arrow.png) no-repeat 100% 50%;padding-right:30px; } #content .products li .call-to-action .price {color:#F36531;font-size:18px;border-right:dotted 1px #777;padding-top:0;padding-right:10px;padding-left:0;} #content .products li .call-to-action a {padding-left:10px;font-size:22px;} #content .products .product-details {float:right;width:480px;} /*basket page*/ #content .basket-items li {float:left; background:white;border:solid 1px #777; text-align:center;padding-left:0px;margin-right:10px;} #content .basket-items li input {font-size:10px;} #content .basket-items {margin:3px 0 6px} #form {clear:left} /* Popup Message */ #popup-message {background:url(/assets/images/pop-up.png) no-repeat;z-index:1000;position:fixed;left:50%;margin-left:-370px;width:500px;height:300px;top:100px;padding:10px 50px 75px 40px;} #popup-message form {padding:10px 0;} #popup-message input, #popup-message select {width:auto;padding:auto;margin-right:5px;} #popup-message .closebox {position:absolute;bottom:55px;right:50px;width:140px;width:90px;height:26px;display:block;} #popup-message .closebox span {display:none;}