﻿body { background: #dfdfdf url(../images/bg.gif) repeat-x top; margin: 0; color: #555457; font-family: Arial, Sans-Serif; font-size: .8em; }
#all { width: 960px; margin: 0 auto; position: relative; } 

/* header */
.logo { display: block; padding: 33px 0 0 20px; width: 155px; }

/* nav */
/*#nav { padding: 13px 0 0 110px; margin: 12px 0 0 0;  background: #9a9a9b; width: 850px; }*/ /* <-- shift for regular menu */
#nav { padding: 13px 0 0 175px; margin: 12px 0 0 0;  background: #9a9a9b; width: 850px; } /* <-- shift to center when hiding multimedia menu */
#nav li { display: inline; padding: 0; margin: 0; list-style-type: none; position: relative; height: 24px; z-index: 98; }
#nav a { color: #fff; text-decoration: none;  }

/* nav drop-down */
#nav ul { display: none; padding: 10px; margin: 0; left: 0; position: absolute; z-index: 99; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }
#nav ul li { display: block; text-align: left; width: auto; white-space: nowrap; }
#nav1 ul { background: #6fbb42; }
#nav2 ul { background: #00aeef; }
#nav3 ul { background: #f79229; }
#nav4 ul { background: #f4b800; }
#nav5 ul { background: #502d7f; }
#nav6 ul { background: #0072bc; }

/* header login/language */
#login-language { color: #a2a1a3; font-weight: bold; text-transform: uppercase; font-size: 90%; }
#login-form, #loggedIn { position: absolute; top: 14px; right: 21px; text-align: right; }
#loggedIn { text-transform: none; }
#login-form label { margin: 0 8px; font-size: 95%; }
#login-form input { background: #aaaaab; border: 1px solid #656466; width: 105px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }  
#login-button { background: url(../images/login_bg.gif) no-repeat left center; padding-left: 7px; margin-left: 4px; color: #a2a1a3; text-decoration: none; font-size: 95%; }
#login-errForgot { text-transform: none; margin-top: 8px; font-size: 90%; }
#login-errForgot span { color: #fff; margin-right: 5px; }
#login-errForgot a, #loggedIn a { color: #aaaaab; }
#language-font { position: absolute; top: 79px; right: 21px; }
#language-font a { color: #a2a1a3; text-decoration: none; }
#language-font span { margin-left: 20px; }
#font-size-medium { font-size: 120%; }
#font-size-large { font-size: 140%; }

/* body containers */
#bd { background: #dfdfdf; padding: 20px 21px 20px 20px; position: relative; }
#bdBg1 { width: 919px; background: url(../images/bdBg1.gif) no-repeat bottom; padding-bottom: 7px; }
#bdBg2 { width: 919px; background: url(../images/bdBg2.gif); overflow: hidden; }
#bd-l { float: left; width: 182px; padding: 15px 9px; background: url(../images/bd-l_bg-round-top.gif) no-repeat left top; position: relative; z-index: 2; }
#bd-content { float: left; width: 485px; padding: 10px; margin: 0 6px; position: relative; }
#bd-r { float: left; width: 184px; padding: 15px 9px; background: url(../images/bd-r_bg-round-top.gif) no-repeat right top; position: relative; z-index: 2; overflow: hidden; }

/* body */
h1 { margin-top: 0; padding-right: 20px; }
#bd-content h1 { width: 445px; } /* so it doesn't overlap the 'share' icon */
h4 { text-transform: uppercase; }
#bd-content a { color: #555457; }
.listings div { padding: 10px; }
.listings span { font-weight: bold; }
.listings a { display: block; font-weight: bold; margin: 5px 0; }
.listings p { margin: 0; }
.listings-dark { background: #cfcfcf; }
.listings-light { background: #efefef; }
.bigger { font-size: 120%; }
.biggest { font-size: 140%; }
#share { width: 51px; height: 16px; position: absolute; top: 10px; right: 10px; }
#share a { text-decoration: none; font-size: 11px; }

table.fullWidth { width: 100%; }
.fullWidth th { background: #70bc42; text-align: left; color: #fff; text-transform: uppercase; padding: 5px 10px; border-bottom: 4px solid #fff; }
.fullWidth td { padding: 10px; border-left: 2px solid #fff; border-right: 2px solid #fff; }
.fullWidth .centered { text-align: center; }

.innerCallOut { padding:18px; color:#fff; background: #dfdfdf; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.innerCallOut p { margin-top: 0; }
.innerCallOut ul { margin-left:15px; }
.innerCallOut li { color:#fff; list-style-type:disc; list-style-position:outside; list-style-image:none; margin:0; }
#bd-content .innerCallOut a { color:#fff; }
#bd-content .innerCallOut a:hover{color:#fff; text-decoration: none; }

.faq-q { font-weight: bold; cursor: pointer; }
.faq-a { display: none; }

/* left col, subnav and feeds */
#bd-l-bg { background: url(../images/bd-l_bg-round-top.gif); width: 10px; height: 8px; position: absolute; top: 0; left: 0; z-index: 1; }
.bd-l-bg-inner { width: 200px; height: 206px; position: absolute; bottom: 96px; left: 20px; z-index: 1; }
.SocialSideBG { background: url(../images/watermarks/Social.jpg) no-repeat center bottom; }
.SupportSideBG { background: url(../images/watermarks/Support.jpg) no-repeat center bottom; }
.StoriesSideBG, .MultimediaSideBG, .AboutSideBG, .TreatmentsSideBG { background: url(../images/watermarks/Stories.jpg) no-repeat center bottom; }
 .SideBG { }

#section-title { border-top: 3px solid #bfbfbf; position: relative; z-index: 3; }
#section-title div { width: 30px; height: 5px; } /* colour themeable */
#section-title h2 { text-transform: uppercase; margin: 16px 7px; font-size: 125%; } /* colour themeable */
#bd-l ul { list-style: none; margin: 0; padding: 0 0 0 7px; position: relative; z-index: 3; }
#bd-l li { padding: 0 0 10px 0; }
#bd-l ul ul { margin: 7px 0 0 0; padding: 0; }
#bd-l li li { background: url(../images/subnav/li.gif) no-repeat left 8px; padding: 4px 0 4px 14px; }
#bd-l ul a, #bd-l .secondary-selected li a { color: #555457; text-decoration: none; font-weight: normal; }
#bd-l ul a:hover { text-decoration: underline; }
#bd-l .secondary-selected a { font-weight: bold; }
#bd-l li.tertiary-selected  a { font-weight: bold; }

#feeds { width: 178px; background: #cfcfcf; overflow: hidden; margin-top: 10px; position: relative; z-index: 3; }
#feed-tabs { float: left; width: 25px; background: #e6e6e6; height: 259px; }
#feed-tabs img { cursor: pointer; }
#feed-content { float: left; width: 143px; padding: 15px 5px; height: 229px; overflow: auto; }
#feed-content span { font-weight: bold; }
#feed-content a { color: #555457; display: block; margin-top: 4px; padding-bottom: 10px; }
#feed-content a:hover { text-decoration: none; }

.feed-newsLinks { font-weight: bold; }
#feed-content .feed-newsLinks a { display: inline; }

/* right col */
#bd-r-bg { background: url(../images/bd-r_bg-round-top.gif); width: 9px; height: 8px; position: absolute; top: 0; right: 0; z-index: 1; }
#search-q { width: 179px; border: 1px solid #7d7d7d; margin-bottom: 4px; padding: 2px; font-size: 120%; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
#banners img { margin-top: 12px; display: block; }
#bd-r ul { padding-left: 18px; }
#bd-r ul a { color: #555457; text-decoration: none; font-size: 90%; }
#bd-r h2 { color: #f79229; margin: 8px 0; font-size: 140%; }
#bd-r p { font-size: 110%; }
#bd-r p a { color: #f79229; }
#got-an-idea { margin-bottom: 3px; }
#report_reactions_btn{padding-top:3px;}

/* footer */
#ft { clear: both; padding: 30px 0; margin: 0; list-style: none; text-align: center; }
#ft li { display: inline; border-left: 1px solid #555457; padding-left: 5px; margin-left: 2px; }
#ft li.first { border: none; }
#ft a { color: #555457; text-decoration: none; font-size: 90%; }
#ft a:hover { text-decoration: underline; }

/* search */
#searchResults { margin-right: 31px; border-top: 4px solid #dfdfdf; border-bottom: 4px solid #dfdfdf; }
#searchResults div { border-top: 1px solid #dfdfdf; padding: 12px 0; }
#searchResults a { font-size: 14px; font-weight: bold; display: block; }
#searchResults p { margin: 3px 0 0 0; }
#searchPagingTop { margin-bottom: 20px; font-weight: bold; font-size: 14px; }
#searchPaging { margin: 12px 31px 0 0; text-align: right; font-weight: bold; font-size: 14px; }
#searchPaging input { vertical-align: middle; }
#searchPaging a, #searchPaging span {  margin: 0 2px; }

/* videos */
#videoPlayerContainer { text-align: center; position:relative; z-index:2; }
#videoPlayer { width:374px; height:313px; position:relative; z-index:2; } 
#videoListings { margin: 20px auto 0 auto; width: 374px; overflow: hidden; }
#videoListings a { display: block; float: left; width: 50%; padding-bottom: 10px; }

/* thread */
#forum-reply { text-align: right; }
.forum-add { background: #dfdfdf; width: 100%; }
.forum-add th { text-align: left; }
.forum-add input, .forum-add textarea { width: 95%; }
#forum-separator { background: #dfdfdf; border: none; height: 6px; }

/* send to friend */
.sendFriend { width: 100%; }
.sendFriend th { text-align: left; }

/* enrol / submit your story forms */
.enrolTable { width: 100%; }
.enrolTable th { text-align: left; padding: 4px; }
.enrolTable td { padding: 4px; }
#postal { font-size: 80%; }

/* poll results */
p.poll-intro { padding-bottom: 20px; font-weight: bold; text-transform: uppercase; }
div.poll-area { margin-bottom: 25px; }
div.poll-area a { display: block; margin-bottom: 15px; text-decoration: none; font-weight: bold; }
div.poll-answers div { padding-bottom: 5px; }
.poll-answers-hide { display: none; }

/* mask / modal for login */
#mask { position:absolute; top:0; left:0; z-index:998; background:black; }
/*modal height was height: 270px; removed to allow dive to grow for french version*/
#modal { width: 320px;  padding: 15px; background: #fff; position: absolute; z-index: 999; display: none; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; }
#modalForumAudit, #modalSocial { width: 320px;  padding: 15px; background: #fff; position: absolute; z-index: 999; display: none; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; }
#modalClose,#modalForumAuditClose,#modalSocialClose { position: absolute; top: 10px; right: 10px; cursor: pointer; z-index: 1; }
#modal-login { position: relative; margin: 10px 0; width: 290px; overflow: hidden; }
#modal-login form { position: static; text-align: left; }
#modal-login label { margin: 0 0 5px 0; font-size: inherit; float: left; width: 100px; text-transform: uppercase; }
#modal-login input { margin-bottom: 5px; background: #fff; border: 1px solid #000; width: 130px; }  
#modal-login #login-button { background: none; color: #555457; text-transform: uppercase; }
#modal-login #login-errForgot span { color: #555457; }
#modal-login #login-errForgot a { color: #555457; }
#modal h3 { margin: 10px 0 0 0; }
#modal p { margin: 4px 0; }
#modal h3#notMember, #join-now, #modalClose2 { color: #f79229; }

/* misc */
img { border: none; }
form { margin: 0; }
.hide { display: none; }
.bt { height: 19px; display: inline-block; padding-left:25px; text-decoration:none; background:url(../images/bt_bg.gif) no-repeat left center; }
.fineprint { font-size: 80%; }
.err { font-weight: bold; color: Red; }


/* stories single story comment form */

div.single-story-comments-section div {padding:0;}
div.single-story-comments-section{width:446px; border:1px solid #9c9c9e;background:#ebebeb;padding:0;margin:0;padding-left:10px;overflow:hidden;}
div.single-story-comments-section a {display:inline; font-weight:normal; margin:0;}
.text-box-area{width:424px;height:261px;background:url('../images/txtBoxBG.jpg') ;overflow:hidden;}

div.single-story-comments-section textarea {overflow:auto;width:400px;height:235px;border:1px solid #FFFFFF;margin-left:5px;margin-top:5px;}


a.comments-button{width:96px;height:18px;}
.comments-title{font-family:Verdana; font-size:15px; font-weight:bold;padding-left:4px;margin-top:11px; margin-bottom:11px;}

.posted-comment{width:424px; clear:both;margin-bottom:10px;margin-top:35px;}

.posted-comment p{margin:0;padding:0;}

.posted-comment .comment-title{margin-bottom:5px;}
.posted-comments {padding-left:10px;margin-top:45px;overflow:hidden;width:424px;}
.comment-description{margin-top:10px;}
img.text-box-tb{display:block;padding:0;margin:0;}

.hideComment{display:none;}
.showComment{display:block;}
a.showAllComments{float:right; padding:20px;}
#comment-button-area{width:96px;float:right;padding-right:17px;padding-top:9px;padding-bottom:9px;}
#report-delete-buttons{padding-left:210px;}
