/* --- Basic Included on All Web site pages --- */ /* Initial CSS rules */ /** http://meyerweb.com/eric/tools/css/reset/ **/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body {line-height: 1;} ol, ul { list-style: none; } blockquote, q { quotes: none;} blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none;} :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through;} table { border-collapse: collapse; border-spacing: 0; } hr { clear: both; } /* typesetting */ body { font: 11px/1.5em Arial, Helvetica, sans-serif; color: #000; background-color: #eaeaea; } a:link, a { color: #999; text-decoration: none; } a:hover { color: #f60; text-decoration: underline; } h2, h3, h4 { margin: 0 0 10px 0; } h2 { font-size: 18px; } h3 { font-size: 14px; } /* links and menu elements colors & size */ #top_menu a { color: #999; font-size: 12px; font-weight: bold; } #top_menu a:hover { color: #f60; } #top_menu li.current a { color: #000; } #top_menu li { font-size:12px; font-weight: bold; color: #ccc; } #user_info a { color: #999; font-size: 12px; } #user_info a:hover, #user_info a.me { color: #f60; } #user_info li.current a { color: #f60; font-weight: bold; } #main_nav a { color: #fff; font-size: 12px; font-weight: bold; } #main_nav li.current a { color: #625d55; } a.plus { padding-left: 15px; padding-top: 5px; background-position: left 10px; background-repeat: no-repeat; float: right; } a.action { color: #f36; padding: 2px 0; } /* generic layout elements */ .container { width: 953px; margin: 0 auto 20px auto; } .wrap { clear: both; position: relative; overflow:hidden; padding: 0 20px; background: url(../images/main_bg.png) repeat-y 0 0; } .col { width: 291px; margin: 0 10px 0 0; float: left; } .wide { width: 594px; margin: 0 0 20px 0; overflow: hidden; clear: both; } .full { width: 100%; overflow: hidden; } .inner { clear: both; overflow: hidden; background: url(../images/boxborder.png) repeat-y right; } .box { clear: both; overflow: hidden; margin-bottom: 20px; background: url(../images/boxborder.png) repeat-y left; } .box.small { background: url(../images/boxborder.png) repeat-y right; } .box.small .inner { background: url(../images/boxborder.png) repeat-y left; margin-right: 2px; } #user_info .last, #main_nav .last, #top_menu .last, #content .last, #main-content .last, #related-content .last, #footer .last, .last { margin-right: 0; border-right: 0; } .frame { float: left; margin-right: 20px; text-align: center; border: 1px solid #ccc; padding: 3px; background: #fff; } .frame img { /* border: 1px solid #ccc; padding: 3px; background: #fff; */ } .frame.sz56 { width: 56px; } .frame.sz100 { width: 100px; } .frame.sz163 { width: 169px; } .frame.sz400 { width: 400px; } /* common layout elements - header, footer, content, main-content, extra-content */ #header, #content, #footer { clear: both; } #content { margin-bottom: 20px; } #content .wrap { padding-bottom: 20px; padding-top: 20px; } #main-content { width: 593px; float: left; display: inline; } #related-content { width: 300px; float: right; display: inline;} /* default rounded corner boxes inside content */ .top { width:100%; height: 5px; float: left; clear: both; background: url(../images/main_top_shadow.png) no-repeat right; } .bottom { width:100%; height: 5px; float: left; clear: both; background: url(../images/main_bottom_shadow.png) no-repeat right; } .tr, .br { height: 5px; width: 90%; float:right;} .box .top { width:100%; height: 5px; background: #fff url(../images/top_box_shadow.png) no-repeat left top; } .box .bottom { width:100%; height: 5px; float: left; clear: both; background: #fff url(../images/bottom_box_shadow.png) no-repeat left top; } .box .tr { height: 5px; background: #fff url(../images/top_box_shadow.png) no-repeat right top; } .box .br { height: 5px; background: #fff url(../images/bottom_box_shadow.png) no-repeat right;} /* header and top inside elements */ #header { margin-bottom: -5px; position: relative; } #header ul li { display: inline; } #header h1 { padding: 10px 0 5px 0; clear: both; overflow: hidden; background: url(../images/top_dots.gif) repeat-x top; } #top_menu { float: left; } #top_menu li { padding-right: 50px; } #user_info, #top_menu { margin-bottom: 5px; padding: 10px 0; } #user_info { float: right; } #user_info li { padding: 0 7px; border-right: 1px solid #999; color: #f60; font-weight: bold; font-size: 12px; } #main_nav { margin: 0 1px 0 2px; padding: 15px 0 5px; background: #a79f91; } #main_nav li { display: inline; padding: 0 20px; border-right: 1px solid #fff; } #swfAnim { margin: 0 1px 0 2px } /* footer elements */ #footer .wrap { padding-top: 5px; padding-bottom: 5px; } #footer ul { margin-bottom: 5px; } #footer ul li { display: inline; padding: 0 8px; border-right: 1px solid #999; } #byOrange { float: right; } #byOrange span { color: #f60; } #footer #languages li { border: 0; background: url(../images/tri_bullet.png) no-repeat left 50%; padding-right: 18px; } /* type specific elements */ #main-content h2 { color: #f36; } #signupForm h3 { color: #625d55; } #signupForm p a { font-size: 12px; font-weight: bold; color: #f60; } #signupForm p label { color: #999; } /* lists with photos */ .friendList { width: 100%; clear: both; } .friendList h4, .friendList h4 a { margin: 0; color: #f36; } .friendList h4 a:hover { text-decoration: none; } .friendList li { overflow: hidden; margin-bottom: 2px; padding: 5px; position: relative; } .friendList li .frame { margin-right: 7px; background: #fff; padding: 3px; border: 1px solid #cecece; } .friendList li div { float: left; width: 75%; } .friendList a.rmUser { position: absolute; top: 5px; right: 5px; width: 16px; height: 16px; text-indent: -9999px; background: url(../images/remove.gif) no-repeat; } li .rmUser, li .rm { display: none; } #scroller { text-align: right; padding: 3px 0; margin-bottom: -1.8em; } .myFriends.view #scroller { float: left; } #scroller a { padding: 3px 6px; } .scroller { position: absolute; left: 225px; top: 3px; font-size: 12px; } #scrollup, #scrolldown { width: 16px; height: 16px; background-position: 0 0; background-repeat: no-repeat; text-indent: -9999px; display: block; float: left;} #scrollup { background-image: url(../images/arrow_up.gif); margin-right: 5px;} #scrolldown { background-image: url(../images/arrow_down.gif); } #scroller #scrollup, #scroller #scrolldown { float: none; display: inline; } #giftIdeas li, #wishList li { cursor: pointer; clear:both;overflow:hidden;} li .rm, li .rmUser { position: absolute; top: 3px; right: 70px; display: none; width: 12px; height: 12px; background: url(../images/delete.gif) no-repeat 0 0; text-indent: -9999px; } #giftIdeas .rm { right: 70px; } ul.mine li .rm { right: 5px; } /* specific right side styles */ #related-content .box .inner { margin-left: 0; padding: 10px 15px; padding-left: 14px; } .addBlock { margin-bottom: 10px; } /* friends on birthday list */ #related-content #friendsBirthday .inner { background-image: url(../images/brownBoxbg.png); } #friendsBirthday .bottom { background: url(../images/brownBoxBottom.png) no-repeat right; } #friendsBirthday .br { background: url(../images/brownBoxBottom.png) no-repeat 100% 0;} #friendsBirthday h3 { color: #fff; background: #f36 url(../images/friendsOnBirthday.png) no-repeat top left; padding: 5px 10px; margin-bottom: 0; } #friendsBirthday ul { margin: 10px 0; } /* profile page styles */ #myProfile { background: url(../images/top_dots.gif) repeat-x bottom left; padding-bottom: 15px; position: relative; overflow: hidden; } #myProfile a.button { position: absolute; top: 0; right: 0; color: #fff; font-weight: bold; } #myProfile .data { width: 300px; float: left;} #myProfile .data h2 a { color: #f36; } #myProfile .data h2 a:hover { text-decoration: none; } #myProfile h2 small { color: #625d55; font-size: 14px; margin: 3px 0; display: block; } #myProfile .data h3 { color: #999;} #myProfile .data h3 span { color: #f36; background: url(../images/cake.png) no-repeat 0 0; margin-left: 25%; padding: 5px 0; padding-left: 32px; } #myProfile .data p { color: #999; font-style: italic; font-size: 12px; } #myProfile .data a.lnk { color: #f60; margin-top: 5px; font-size: 12px; font-weight: bold; display: block; } #myProfile .description { float: left; width:100%; clear: both; margin-top: 30px; } #myProfile .description h4 { margin-bottom: 5px; font-size: 12px; color: #625d55; font-size: 14px; } #myProfile .description p { color: #999; font-size: 12px; } .descriptionChars { color: #666; font-size: 125%; } .descriptionChars span { font-weight: bold; } #giftIdeas, #wishList { background: #fff; background: url(../images/listsBottomsmall.png) no-repeat bottom; padding-bottom: 3px; position: relative; } #giftIdeas { margin-top: 47px; } #wishList h2 { color: #625d55; margin-bottom: 30px;} #wishList h3, #giftIdeas h3 { background-image: url(../images/listsHeaderbgsmall.png); background-repeat: no-repeat; background-position: 0 0; color: #fff; margin-bottom: 0; padding: 5px 0 5px 7px; } #wishList ul, #giftIdeas ul { background-image: url(../images/listsbgsmall.png); background-repeat: repeat-y; background-position: 0 0; padding: 1px 5px 0 5px; width: 281px; height: 110px; overflow-y: auto; overflow-x: hidden; } #giftIdeas h3 { background-color: #31c5ff; } #wishList h3 { background-color: #b8e100; } #giftIdeas a.plus, #wishList a.plus { background-image: url(../images/pinkPlus.gif); color: #f36; float: none; top: 25px; right: 5px; position: absolute; } #giftIdeas a.plus { top: -20px; } #boughtItems { background: #fff; background: url(../images/listsBottom.png) no-repeat bottom; padding-bottom: 3px; position: relative; } #boughtItems h3 { background: #f36 url(../images/listsHeaderbg.png) no-repeat 0 0; color: #fff; margin-bottom: 0; padding: 5px 0 3px 7px; } #boughtItems ul { background: url(../images/listsbg.png) repeat-y 0 0; padding: 1px 5px 0 5px; height: 110px; overflow: auto; } #wishList p.buttons, #giftIdeas p.buttons { clear:both; float:left; margin-top:10px; } p.buttons .btn.grey.small .left { background-image: url(../images/buttongreyBUY.png); background-position: 0 1px; } p.buttons .btn.grey.small .label { background-image: url(../images/buttongreyBUY.png); padding-top: 3px; } p.buttons .btn.grey.small .right { background-image: url(../images/buttongreyBUY.png); background-position: right 1px; } .btn.grey.small .label span { color: #5c5c5c; background: url(../images/buttonarrow.png) no-repeat 0 0; padding-left: 20px; } #giftIdeas li, #wishList li, #boughtItems li { padding: 2px 3px; position: relative; } #giftIdeas li span, #wishList li span, #boughtItems li span { position: absolute; right: 0; } #giftIdeas li span a, #wishList li span a, #boughtItems li span a { color: #f36; } #giftIdeas li.selected, #wishList li.selected { background: #e8e8e8; } #main-content .level h2 { color: #625d55; margin-bottom: 30px; } .level div { width: 100%; float: right; height: 45px; background: url(../images/progressbarbg.png) no-repeat 0 0; position: relative; } .level div { margin-top: 5px; } .level div span { display: block; background: url(../images/progressbar.gif) no-repeat 0 0; height: 22px; display:none; margin-top: 23px; } .level span.bought { background: transparent; color:#fff; display:block; font-size:16px; font-weight:bold; position:absolute; text-align:center; top: 3px; width:100%; } #comments a.plus { background-image: url(../images/greyPlus.gif); color: #70848d; } #comments h3 { color: #625d55; padding: 5px 0 2px 0; margin-bottom: 0; } #comments li { background: #eee7db; } #comments .friendList.public li { background: #e0f6ff; color: #666; } #comments .friendList.private li { background: #ffe0e8; color: #666; } #comments li { background-position: right top; background-repeat: no-repeat; } #comments li.public { background-image: url(../images/public.png); } #comments li.private { background-image: url(../images/private.png); } #comments li, #comments li h4 { color: #666; } li.next, li.prev { opacity: .8; cursor: pointer; font-weight: bold; text-align: center; } li.next:hover, li.prev:hover { opacity: 1; } /* public and private comments */ #comments { position: relative; height: 1%; } #comments.js h3 { position: absolute; top: 0; cursor: pointer; font-size: 12px; } #comments.js h3 span { padding: 7px 0 0 5px; } #comments h3.public { background: #31c5ff url(../images/pubtab.png) no-repeat right top; color: #fff; width: 95px; position: relative;} #comments h3.public span { background: #31c5ff url(../images/pubtab.png) no-repeat left top; text-align: center; padding-left: 25px; } #comments h3.private { background: #f36 url(../images/privtab.png) no-repeat top right; color: #fff; width: 95px; } #comments h3.private span { background: #f36 url(../images/privtab.png) no-repeat left top; text-align: center; padding-left: 10px; } #comments #public { border-top: 5px solid #31c5ff; position: relative; top: 0;} #comments #private { border-top: 5px solid #f36; position: relative; top: 0; } #comments.js h3.private { margin-left: 100px; } /* my Network pages */ .notifications, .addContacts, .importContacts { margin-bottom: 30px; } #main-content.myNetwork h2 { color: #625d55; } #main-content.myNetwork .addContacts h2 { margin-bottom: 30px; } #main-content.myNetwork .importContacts h2 { margin-bottom: 15px; } .myFriends .action { float: right; } .myFriends.view { position: relative; } //.myFriends.view #upcoming { top: 3em; height: 250px; overflow: auto; } #main-content.myNetwork .myFriends.view .friendList li { background: #e8e8e8;} #main-content.myNetwork .friendList li div { width: 70%; } #main-content.myNetwork .notifications h2 { margin-bottom: 31px; } #main-content.myNetwork .notifications .friendList { background: url(../images/top_dots.gif) repeat-x left top; padding-top: 1px; } #main-content.myNetwork .notifications .friendList li { background: #fff url(../images/top_dots.gif) repeat-x left bottom; padding-top: 10px; padding-bottom: 10px; color: #666; } #main-content.myNetwork .notifications .friendList li h4 { color: #666; } #main-content.myNetwork #signUpForm { width: 230px; } /* contact status */ .myFriends li span.status { width: 29px; height: 29px; display: block; background-repeat: no-repeat; background-position: 0 0; position: absolute; left: 40px; top: 3px; } .myFriends li span.updated { width: 16px; height: 16px; display: block; background: url(../images/contactUpdated.png) no-repeat 0 0; position: absolute; left: 45px; top: 56px; } .myFriends li .status.confirmed { background-image: url(../images/confirmed.png); padding: 0; } .myFriends li .status.onhold { background-image: url(../images/onhold.png); } .myFriends li .status.contact { background-image: url(../images/contact.png); } /* invitation actions */ .inviteAction { text-align: right; } .inviteAction .accept { color: #f36; margin-right: 15px; } /* import contacts */ #main-content.importContacts { width: 100%; } .importContacts li { display: inline; } .importContacts li a { display: block; padding: 5px 0 0 25px; background: url(../images/pinkPlus.gif) no-repeat left 50%; border-bottom: 1px solid #e8e8e8;} .importContacts #addImportedContact { width: 750px; margin: 10px auto; } .importContacts table { width: 100%; margin: 1em auto; text-align: left; font-size: 12px; color: #625d55; } .importContacts table tr { border: 1px solid #e7e5e2; } .importContacts table tr.nb { border-width: 1px 0 0 0; text-align: center;} .importContacts table tr.nb td { padding-top: 20px; background: transparent; } .importContacts th { padding: 3px 5px; } .importContacts td { padding: 5px 5px 0 5px; } .importContacts td.chck, .importContacts th.chck { vertical-align: middle; padding: 0; padding-right: 5px; } .importContacts td { background: #eeece9 url(../images/tdsep.gif) repeat-y right; } .importContacts tr.odd td { background-color: #f5f4f2; } td.birthdate { background-image: none; text-align: center } th.nom, th.email { width: 256px; } th.birthdate { width: 200px; } /* Calendar styles */ .myFriends .box.small .inner { position: relative; } .calendar { width: 90%; margin: 15px 5%; font-size: 13px; font-weight: bold; color: #f36;} .calendar caption { font-size: 18px; font-weight: bold; color: #a9a092; margin-top: 10px; padding: 0 0 10px; } .calendar th { font-size: 11px; text-transform: uppercase; color: #625d55; } .calendar td { padding: 4px; text-align: center; border: 1px solid #ccc; } .calendar td.nobgt { border-top: 0; border-left: 0; } .calendar td.nobgb { border-right: 0; border-bottom: 0; } .calendar td.today { background: #ffd6e0; } .calendar td:hover { background: #f36; color: #fff; } .calendar td.event:hover, .calendar td.today:hover { cursor: pointer; } .calendar td.nobgb:hover, .calendar td.nobgt:hover { background: #fff; color: #f36; cursor: default; } .calendar td.event { background: #f36; color: #fff; } .calendar .calendar-prev a, .calendar .calendar-next a { width: 19px; height: 23px; text-indent: -9999px; background-repeat: no-repeat; display: block; position: absolute; } .calendar .calendar-prev a { background-image: url(../images/prevmonth.png); left: 14px; top:10px; } .calendar .calendar-next a { background-image: url(../images/nextmonth.png); right: 14px; top: 10px; } .calendar caption .month { width: 200px; } .calendar td a { color: #fff; } .calendar td a:hover { text-decoration: none; color: #ddd; } .calendar td.selected a { background: #fff; color: #f36; display: block;} /* selected day/month events */ .upcoming { margin-top: 15px; } .view .upcoming { margin-top: 3em; } .upcoming h3 { clear: both; border-bottom: 2px solid #f36; color: #625d55; font-size: 12px; margin-bottom: 5px; } #main-content.myNetwork .upcoming .friendList li { background: #fff; } /* Edit profile styles */ .myInfo h3 { color: #625d55; font-size: 18px; font-weight: bold; margin-bottom: 30px; } .myInfo h3 span { color: #999; font-weight: normal; } .myInfo form legend { font-size: 13px; font-weight: bold; color: #f36; margin-bottom: 25px; display: block; float: left; clear: both; } #uploadAvatar fieldset { padding-bottom: 0; } form.wide { width: 535px; float: left; clear: none; } form.col.last { float: right; clear: none; } .myInfo p { width: 100%; } .myInfo a { font-size: 12px; font-weight: bold; color: #f60; } .myInfo .label_block { width: 152px; padding-right: 5px; color: #625d55; font-size: 12px; font-weight: bold; } .myInfo .txt, .myInfo .help_block { width: 185px; padding: 3px; padding-right: 7px; } .myInfo p.birthdate span.txt { width: 197px; } .myInfo p.birthdate span.err_block { width: 170px; } .myInfo .help_block { background: #f5f5f5; border: 1px solid #e6e6e6; font-size: 95%; line-height: 130%; padding: 5px; float: left; margin-left: 160px; margin-top: 3px; width: 157px; } .myInfo .txt input { width: 166px; } .myInfo .err_block { width: 170px; color: #d80000; font-weight: bold; display: block; float: right; } .myInfo .success .err_block { color: #264409; } .myInfo .error .help_block, .myInfo .success .help_block { font-weight: normal; color: #000; } p.error .txt input { border-color: #d80000; } .myInfo .mod_block { width: 170px; font-weight: bold; display: block; float: right; } .myInfo .mod_block a { margin: 4px 0; display: block; } .myInfo hr { width: 365px; float: left; clear: both; margin: 10px 0; margin-left: 160px; border: 0; background: #ccc; height: 1px; } #country, #language { width: 166px; } .myInfo #months { width: 70px; } .blk span { margin-left: 160px; display: block; } .myInfo .blk span { width: 365px; } .myInfo .blk span label { color: #999; font-weight: normal; font-size: 11px;} p.btns { margin-left: 160px; } .myInfo p.mg { margin-left: 160px; margin-top: 15px; display: inline; } .mgc { text-align: center; margin: 5px 0; } .myInfo img { padding: 3px; background: #fff; } .validated { margin-left: 170px; } .error { color: #da0000; font-weight: bold; } .error .txt { background: #f9d7d7 url(../images/errorarrow.png) no-repeat right; } .error input { border-color: #d80000; } .success .txt { background: #e6efc2 url(../images/tick.png) no-repeat 99%; } .changepass { display: none; background: #ffc; float: left; width: 100%; } .changepass div { padding: 10px 0; } .confirmed { padding: 10em; color: #f36; line-height: 1.5em; text-align: center; font-size: 16px; } /* update birthday styles */ #updateBirthday { margin: 0 10px; } #updateBirthday p.legend { font-size: 16px; color: #625d55; margin-bottom: 15px; font-weight: bold; line-height: 1.5em; } #updateBirthday p.legend small { font-size: smaller; display: block; } #updateBirthday p.legend.moreUpdate { margin: 20px 0; } #updateBirthday ul { margin: 15px 0 20px 0; float: left; width: 100%; } #updateBirthday li { line-height: 2em; clear: both; margin-left: 70px; font-size: 13px; width: 65%; } #updateBirthday label, #updateBirthday input { vertical-align: middle; font-weight: normal; cursor: pointer; } #updateBirthday .btn input { font-weight: bold; } #updateBirthday li input { margin-right: 5px; } #updateBirthday li span { padding: 3px;} #updateBirthday li.odd { background: #e8e8e8; } #updateBirthday select { padding: 3px; font-size: 12px; } #updateBirthday p a { text-decoration: underline; color: #000; font-weight: bold; } #updateBirthday span.label_block { width: 100px; margin-right: 20px; font-size: 16px; padding-top: 7px; } #updateBirthday #months { width: 100px; } #updateBirthday #days { width: 65px; } #updateBirthday #years { width: 75px; } #updateBirthday span.nolabel, #updateBirthday p.btn { padding-left: 120px; } #updateBirthday .txt { width: 42%; padding: 3px; } #updateBirthday .err_block { float: left; clear: both; padding: 5px; margin-left: 120px; width: 42%;} /* blockUI styles */ .blockUI { display: block; overflow: hidden; position: absolute; width: 501px; height: 400px; z-index: 10004; top: 100px; left: 35%; opacity: 1; filter: alpha(opacity=100); outline-color: -moz-use-text-color; outline-style: none; outline-width: 0pt; } .formUIContainer { display: block; width: 100%; float: left; background: transparent url(../images/privCommentPopBottom.png) no-repeat bottom left;} .grey-overlay { border-width: 0pt; margin: 0pt; padding: 0pt; position: absolute; top: 0pt; left: 0pt; width: 100%; height: 100%; z-index: 10003; opacity: 0.7; background-color: #fff; filter:alpha(opacity=70); } .ui-dialog-container { background-color: transparent; background-repeat: no-repeat; background-position: 0 0; clear:both;position: relative; width: 99%; height: 99%; } .blockUI.public .ui-dialog-container { background-image: url(../images/pubCommentPopTop.png); } .blockUI.private .ui-dialog-container { background-image: url(../images/privCommentPopTop.png); } .blockUI.wishList .ui-dialog-container { background-image: url(../images/wishListPopUpTop.png); } .blockUI.giftIdea .ui-dialog-container { background-image: url(../images/giftIdeasPopUpTop.png); } .ui-dialog-titlebar { -moz-user-select: none; } .smalllink { -moz-user-select: none; } span.unselectable { -moz-user-select: none; float: right; margin: 5px 10px 0 0; cursor: hand; } h2.confirmed { border-top: 2px solid #ddd;} .wrap h2.confirmed { border-top: none; } #pophelp { border: 0; position: absolute; top: 30px; left: 5%; width: 90%; background: url(../images/pophelpbottom.png) repeat-x bottom; padding-bottom: 13px; } #pophelp iframe { overflow: auto; border: 0; } #pophelp.Help iframe { height: 500px; } #pophelp.About iframe { height: 400px; } #pophelp h4 { background: #000 url(../images/pophelpbg.png) repeat-x 0 -2px; color: #fff; padding-left: 15px; margin-bottom: 0; font-weight: bold; font-size: 16px; line-height: 27px; } #pophelp #closeHelp { display: block; position: absolute; right: 5px; top: 6px; background: url(../images/closepop.gif) no-repeat 0 0; width: 12px; height: 12px; } #helpcontent { border-right: 1px solid #000; border-left: 1px solid #000; } #overlay { width: 100%!important; left: 0!important;}