@import url(reset.css); @import url(custom-styles.css); html, body {min-height:100%;} body {background:#ededed;} #wrap {width:800px; padding:0 80px; margin:auto; background:url(../images/bgr.jpg) top center repeat-y; position:relative; z-index:100;} .topFlashWrapper {position:relative; z-index:10;} #topFlashHolder {width:800px; position:relative; z-index:120;} .flash-temp {height:350px; background:url(../images/flash-detect-bgr.jpg) 0 0 no-repeat; position:relative;} .flash-temp a { position:absolute; left:50%; top:209px; width:243px; height:36px; margin-left:-121px; text-indent:-9999px; background:url(../images/button-flash-detect.png) 0 0 no-repeat; } .flash-temp a:hover {background-position:0 -36px;} a.logo { position:absolute; left:50%; top:28px; z-index:1000; width:150px; height:109px; margin-left:-498px; text-indent:-9999px; background:url(../images/logo-new.png) 0 0 no-repeat; } /* NO JS MESSAGE -------------------------------------- */ #no-js-popup-bgr { position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; background:url(../images/no-js-bgr.png) 0 0 repeat; } #no-js-popup { position:absolute; top:50%; left:50%; z-index:200; width:308px; height:158px; margin:-79px 0 0 -154px; padding-left:8px; background:url(../images/no-js-popup-bgr.png) 0 0 no-repeat; } #no-js-popup h3 { height:41px; margin:42px 0 8px 0; text-indent:-9999px; background:url(../images/no-js-title.png) 50% top no-repeat; } #no-js-popup a { display:block; width:228px; height:36px; margin:auto; text-indent:-9999px; background:url(../images/no-js-button.png) 50% top no-repeat; } #no-js-popup a:hover { background-position:50% -36px; } /* MAIN NAVIGATION -------------------------------------- */ #mainNav {width:800px; height:60px; background:url(../images/main-nav-bgr.gif) left top repeat-x;} #mainNav ul {width:800px; height:60px;} #mainNav ul li {float:left; height:60px; list-style-type:none;} #mainNav ul li.midBlankBox {background:url(../images/mainmenu/main-nav-mid.jpg) 50% 0 no-repeat; width:89px;} #mainNav ul li a {display:block; height:60px; line-height:60px; text-indent:-9999px; background-position:100% 0px; background-repeat:no-repeat;} #mainNav ul li a.navMembership {background-image:url(../images/mainmenu/membership.png); width:132px;} #mainNav ul li a.navHerostuff {background-image:url(../images/mainmenu/herostuff.png); width:112px;} #mainNav ul li a.navShop {background-image:url(../images/mainmenu/shop.png); width:72px;} #mainNav ul li a.navParents {background-image:url(../images/mainmenu/parents.png); width:102px;} /*#mainNav ul li a.navNews {background-image:url(../images/mainmenu/news.png); width:86px;}*/ #mainNav ul li a.navNews {background-image:url(../images/mainmenu/news.png); width:107px;} #mainNav ul li a.navHelp {background-image:url(../images/mainmenu/help.png); width:65px;} #mainNav ul li a:hover {background-position:100% -60px;} #mainNav ul li a:active {background-position:100% -120px;} #mainNav ul li a.selectedNav {background-position:100% -180px;} #mainNavNoImg {width:800px; height:25px; background:url(../images/main-nav-bgr.gif) left top repeat-x;} #mainNavNoImg ul {width:800px; height:25px;} #mainNavNoImg ul li {float:left; height:25px; list-style-type:none;} #mainNavNoImg ul li.midBlankBox {background:url(../images/main-nav-mid.jpg) 31px 0 no-repeat; width:161px;} #mainNavNoImg ul li a {display:block; height:25px; text-transform:uppercase; line-height:22px; font-size:15px; letter-spacing:-1px; font-weight:bold; background-position:0 -75px; background-repeat:no-repeat; text-align:center; color:#666;} #mainNavNoImg ul li a.navMembership {background-image:url(../images/nav-membership-blank.gif); width:134px;} #mainNavNoImg ul li a.navHerostuff {background-image:url(../images/nav-herostuff-blank.gif); width:109px;} #mainNavNoImg ul li a.navShop {background-image:url(../images/nav-shop-blank.gif); width:76px;} #mainNavNoImg ul li a.navParents {background-image:url(../images/nav-parents-blank.gif); width:94px;} #mainNavNoImg ul li a.navNews {background-image:url(../images/nav-news-blank.gif); width:98px;} #mainNavNoImg ul li a.navHelp {background-image:url(../images/nav-help-blank.gif); width:128px;} #mainNavNoImg ul li a:hover {background-position:0 -50px; color:#666;} #mainNavNoImg ul li a:active {background-position:0 -25px; color:#666; line-height:18px;} #mainNavNoImg ul li a.selectedNav {background-position:0 0; color:#666; line-height:18px;} /* NEW NAV -------------------------------------- */ #top-wrapper { width:800px; margin-left:-43px; padding:0 43px; } #top {background:#81d3f7; padding:50px 0 20px 0;} #top ul { height:40px; width:805px; margin:0 0 0 -40px; padding:32px 0 0 80px; list-style-type:none; background:url(../images/mainmenu/new/menu-bgr.png) 50% 0 no-repeat; } #top ul li {float:left; background:url(../images/mainmenu/new/nav-separator.png) 100% 0 repeat-y; font-family:'vagrundschriftdregular', Arial, Helvetica, sans-serif;} #top ul li.membership {width:115px;} #top ul li.community {width:104px;} #top ul li.story {width:74px;} #top ul li.shop {width:91px;} #top ul li.parents {width:120px;} #top ul li.help {width:64px;} #top ul li a { display:block; height:29px; line-height:29px; color:#808080; text-decoration:none; font-size:16px; text-transform:uppercase; text-align:center; text-shadow:0 1px 1px rgba(255,255,255,0.8); background:url(../images/mainmenu/new/main-nav-sprite.png) 0 -1000px repeat-x; } #top ul li a:hover {color:#515151; background-position:0 0;} #top ul li a:active {color:#515151; background-position:0 -31px;} #top ul li.selectedNav {background:none;} #top ul li.selectedNav a {height:34px; padding-top:5px; background-position:0 -62px; border-radius:0 0 10px 10px; box-shadow:0 0 4px rgba(0, 0, 0, 0.3);} #top ul li.story, #top ul li.play, #top ul li.help {background:none;} #top ul li.play a { width:136px; height:123px; padding:0; margin-top:-73px; text-indent:-9999px; background:url(../images/mainmenu/new/button-play.png) 50% 0 no-repeat; } #top ul li.play a:hover {background-position:50% -150px;} #top ul li a span { display:block; text-indent:-9999px; text-align:left; background-image:url(../images/mainmenu/new/nav-text-sprite.png); background-repeat:no-repeat; } #top ul li.membership a span {background-position:50% 8px;} #top ul li.membership a:hover span, #top ul li.membership.selectedNav a span {background-position:50% -42px;} #top ul li.community a span {background-position:50% -92px;} #top ul li.community a:hover span, #top ul li.community.selectedNav a span {background-position:50% -142px;} #top ul li.story a span {background-position:50% -192px;} #top ul li.story a:hover span, #top ul li.story.selectedNav a span {background-position:50% -242px;} #top ul li.shop a span {background-position:50% -292px;} #top ul li.shop a:hover span, #top ul li.shop.selectedNav a span {background-position:50% -342px;} #top ul li.parents a span {background-position:50% -392px;} #top ul li.parents a:hover span, #top ul li.parents.selectedNav a span {background-position:50% -442px;} #top ul li.help a span {background-position:50% -492px;} #top ul li.help a:hover span, #top ul li.help.selectedNav a span {background-position:50% -542px;} /* CONTENT -------------------------------------- */ #contentHolder {width:800px; background:url(../images/content-top.png) 0 0 no-repeat;} #content {width:800px; background:url(../images/content-bottom.gif) left bottom no-repeat; padding-bottom:15px;} .newsContent {padding-top:100px;} /* Tabbed navigation -------------------------- */ ul#tabbedNav {width:800px; padding-top:35px; text-align:center;} ul#tabbedNav li {width:171px; display:inline-block; zoom:1; *display:inline; list-style-type:none; height:65px; background:url(../images/tab-bgr.png) 0 0 no-repeat;} ul#tabbedNav li a {width:171px; height:65px; line-height:65px; display:block; text-indent:-9999px; background-position:center 0; background-repeat:no-repeat;} ul#tabbedNav li a.tabSignUp {background-image:url(../images/tab-signup.png);} ul#tabbedNav li a.tabBecomeMember {background-image:url(../images/tab-become-member.png);} ul#tabbedNav li a.tabMyAccount {background-image:url(../images/tab-my-account.png);} ul#tabbedNav li a.tabAbout {background-image:url(../images/tab-about.png);} ul#tabbedNav li a.tabInDaNews {background-image:url(../images/tab-in-the-news.png);} ul#tabbedNav li a.tabSafety {background-image:url(../images/tab-safety.png);} ul#tabbedNav li a.tabEduGuide {background-image:url(../images/tab-edu-guide.png);} ul#tabbedNav li a.tabGlobalHero {background-image:url(../images/tab-global-hero.png);} ul#tabbedNav li a.tabWhatsNew {background-image:url(../images/tab-whats-new.png);} ul#tabbedNav li a.tabSuperheroes {background-image:url(../images/tab-superheroes.png);} ul#tabbedNav li a.tabBullies {background-image:url(../images/tab-bullies.png);} ul#tabbedNav li a.tabDownloads {background-image:url(../images/tab-downloads.png);} ul#tabbedNav li a.tabCompany {background-image:url(../images/tab-company.png);} ul#tabbedNav li a.tabPrivacyPolicy {background-image:url(../images/tab-privacy-policy.png);} ul#tabbedNav li a.tabTermsOfUse {background-image:url(../images/tab-terms-of-use.png);} ul#tabbedNav li a.tabContactUs {background-image:url(../images/tab-contact-us.png);} ul#tabbedNav li a.tabHowToPlay {background-image:url(../images/tab-how-to-play.png);} ul#tabbedNav li a.tabFAQ {background-image:url(../images/tab-faq.png);} ul#tabbedNav li a.tabMinigames {background-image:url(../images/tab-minigames.png);} ul#tabbedNav li a.tabBullyBlog {background-image:url(../images/tab-bully-blog.png);} ul#tabbedNav li a.tabHeroScoop {background-image:url(../images/tab-hero-scoop.png);} ul#tabbedNav li.selectedTab {background-position:0 -65px;} #tabContentHolder {width:713px; clear:both; margin:6px auto 0 auto; background:url(../images/tab-content-bottom.gif) left bottom no-repeat #3ea9f5; padding-bottom:0px;} .newsContent #tabContentHolder, .whatsNewContent #tabContentHolder {padding-bottom:0px;} .pageTitle {width:713px; height:47px; position:relative; background:url(../images/tab-content-top.gif) left bottom no-repeat #fff; margin-bottom:10px;} .pageTitle img {float:right;} #tabContent {width:701px; overflow:hidden; padding:10px 0 13px 12px;} #leftColumn {float:left; width:501px;} #rightColumn {float:right; width:200px;} .noPageContent {padding:20px 20px 20px 40px; height:500px;} .noPageContent h3 {font-size:30px; text-align:center; font-family:Verdana, Geneva, sans-serif; color:#fff; margin-bottom:30px;} .noPageContent p {font-size:14px; text-align:center; font-family:Verdana, Geneva, sans-serif; color:#fff;} .noPageContent p a {color:#fff; font-size:13px; text-decoration:underline;} .noPageContent p a:hover {color:#8FEFFF; text-decoration:underline;} .noPageContent p a:active {color:#1FD5FF; text-decoration:underline;} .whyBecomeMemberContent {padding:20px 20px 20px 40px;} .whyBecomeMemberContent p {font-size:14px; float:left; font-weight:bold; width:332px; color:#fff; padding-bottom:25px;} .whyBecomeMemberContent img.leftImg {float:left; margin-right:20px;} .whyBecomeMemberContent img.rightImg {float:right;} ul.membershipPacks {padding:0 0 20px; margin:0 10px 0 15px; list-style-type:none; overflow:hidden;} ul.membershipPacks li { float: left; height: 230px; position: relative; text-align: center; } ul.membershipPacks li.oneMonth {width:210px;} ul.membershipPacks li.sixMonths {width:210px;} ul.membershipPacks li.twelveMonths {width:230px;} ul.membershipPacks li a {display:block; text-indent:-9999px; width:208px; height:241px; background-position:0 0; background-repeat:no-repeat;} ul.membershipPacks li a.oneMonth {background-image:url(../images/banner-one-month.jpg);} ul.membershipPacks li a.sixMonths {background-image:url(../images/banner-six-months.jpg);} ul.membershipPacks li a.twelveMonths {background-image:url(../images/banner-twelve-months.jpg);} .membershipTable {width:646px; margin:30px 0 0 20px; padding-bottom:10px; background:url(../images/table-bgr.png) left bottom no-repeat;} .membershipTable ul {width:646px; height:70px; position:relative; background:url(../images/table-top-bgr-new.png) 0 0 no-repeat;} .membershipTable ul li {list-style-type:none; float:left; height:36px;} .membershipTable ul li.tabeTitleWhyBecome {width:325px; height:30px; background:url("../images/h2-short-bgr.png") no-repeat 0 0; font-size:12px; font-weight:bold; color:#fff; padding:17px 0 0 17px; margin-top:20px;} .membershipTable ul li.tableTitleFree {background:url(../images/table-top-free.png) left top no-repeat; width:146px; text-indent:-9999px;} .membershipTable ul li.tabeTitleAll {background:url(../images/table-top-all.png) left top no-repeat; height:52px; width:145px; text-indent:-9999px; margin-top:-22px;} .membershipTable table {border:0; clear:both; width:630px; margin-left:8px;} .membershipTable table th {text-align:left; font-weight:normal; font-size:14px; color:#29ABE2; background:url(../images/table-separator.gif) left top repeat-x; height:20px; line-height:22px; padding-left:10px;} .membershipTable table td {text-align:center; background:url(../images/table-separator.gif) left top repeat-x; font-size:14px; color:#F15A24; height:20px; line-height:20px; vertical-align:middle;} .membershipTable table th.topRow, .membershipTable table td.topRow {background:none;} #contentFlash {margin-left:38px;} /* Wide content box */ .wideBoxHolder {width:686px; background:url(../images/box-bgr-wide.gif) left top repeat-y;} .wideBoxInner {width:686px; background:url(../images/box-bottom-wide.gif) left bottom no-repeat;} .wideBox {width:686px; padding:6px 0 26px 0; background:url(../images/box-top-wide.gif) left top no-repeat;} .fieldBoxHolder {width:642px; margin-top:20px; background:url(../images/field-box-bgr.jpg) left top repeat-y; margin-left:22px;} .fieldBoxInner {width:642px; background:url(../images/field-box-bottom.jpg) left bottom no-repeat;} .fieldBox {width:642px; clear:both; background:url(../images/field-box-top.jpg) left top no-repeat;} p#errorBox {width:457px; height:70px; color:#fff; font-size:16px; position:relative; margin:10px 0 -10px 20px; background:url(../images/error-box-bgr.jpg) 0 0 no-repeat; padding:49px 0 0 183px;} p.Okbox {background:url(../images/error-box-ok.png) 0 0 no-repeat !important; margin:10px 0 -10px 14px !important; width:470px !important;} #errorBox table {width:640px; height:119px; margin:10px 0 -10px 20px; background:url(../images/error-box-bgr.jpg) 0 0 no-repeat; border:0;} #errorBox table td {color:#fff; font-size:16px; vertical-align:middle; text-align:left; padding:0 40px 0 120px; text-transform:uppercase;} .Okbox table {background:url(../images/error-box-ok.png) 0 0 no-repeat !important; margin:10px 0 -10px 14px !important; width:650px !important;} .fieldBox fieldset {padding:22px 0 0 0; clear:both;} .fieldBox fieldset.headInfo {padding:100px 0; background:url(../images/body-illustration-2.png) -80px -40px no-repeat;} .fieldBox fieldset.headAllAccessInfo {padding:70px 0; background:url(../images/body-illustration-6.png) -15px -16px no-repeat;} .fieldBox fieldset.headInfo p, .fieldBox fieldset.headAllAccessInfo p {font-size:14px; color:#fff; padding-left:215px;} .fieldBox fieldset.headInfo p i {font-style:normal; font-size:16px;} .fieldBox fieldset.headInfo p span, .fieldBox fieldset.headAllAccessInfo p span {font-size:18px;} .fieldBox fieldset.freeAcc {padding:35px 0 110px 0;} .fieldBox fieldset.freeAcc p {line-height:25px;} .fieldBox fieldset.allAccess {padding:75px 0 80px 0;} .fieldBox fieldset.allAccess p {line-height:25px;} fieldset.congratsHolder {padding:3px 0; clear:both; text-align:center;} fieldset.congratsHolder p {font-size:14px; line-height:24px; color:#fff; padding:30px 0;} fieldset.largerTxt p {font-size:16px !important;} fieldset.congratsHolder p a {color:#0000C9;} fieldset.congratsHolder p.congratsText {height:61px; text-indent:-9999px; text-align:left !important; background:url(../images/congrats-text.png) center top no-repeat; padding:0 !important; margin:20px 0 -14px 0;} fieldset.extended img {margin:20px 0;} .fieldBox fieldset ul li small {font-size:14px; line-height:24px;} fieldset.gameRulesBox {background:url(../images/game-rules-graphic.png) 99% 99% no-repeat; padding-bottom:80px;} fieldset.gameRulesBox p {font-size:24px; color:#fff; font-weight:bold; text-align:center; padding:10px 0 30px 0;} fieldset.gameRulesBox ul {padding-left:50px; padding-top:40px;} fieldset.gameRulesBox ul li {margin:0; width:300px; background:url(../images/bullet-star.png) 7px 11px no-repeat;} fieldset.playBox {padding:20px 0; overflow:hidden;} fieldset.playBox p {float:left; width:440px; padding-top:50px; font-size:24px; color:#fff; font-weight:bold; text-align:center;} fieldset.playBox p i {font-size:20px; font-style:normal; display:block; text-align:center; margin:-15px 0 10px 0;} fieldset.playBox p span {font-size:20px;} fieldset.playBox a {display:block; float:right; width:155px; height:155px; text-indent:-9999px; background:url(../images/play-button.jpg) 0 0 no-repeat; margin-right:40px;} fieldset.playBox a.smallPlay {display:block; float:right; width:112px; height:112px; text-indent:-9999px; background:url(../images/play-button-small.jpg) 0 0 no-repeat; margin:20px 80px 0 0;} fieldset.playBoxNew {text-align:center; color:#fff;} fieldset.playBoxNew p {font-size:28px; font-weight:bold; line-height:30px;} fieldset.playBoxNew p small {font-size:16px;} fieldset.playBoxNew ul {overflow:hidden;} fieldset.playBoxNew ul li {float:left; width:301px; text-align:center;} fieldset.playBoxNew ul li p {color:#fff !important; font-size:20px !important; padding:0 !important; width:auto !important; float:none !important; line-height:24px !important; margin-bottom:10px;} fieldset.playBoxNew ul li p span {font-size:16px !important; font-weight:normal;} fieldset.paymentPlanSelected {padding:20px 0; height:168px; overflow:hidden; background-position:320px 4px; background-repeat:no-repeat;} fieldset.oneMonthPlan {background-image:url(../images/paymentmethod/monthly-plan.jpg);} fieldset.sixMonthPlan {background-image:url(../images/paymentmethod/6months-plan.jpg);} fieldset.twelveMonthPlan {background-image:url(../images/paymentmethod/year-plan.jpg);} fieldset.oneMonthPland {background-image:url(../images/paymentmethod/monthly-plan.jpg);} fieldset.sixMonthPland {background-image:url(../images/paymentmethod/6months-plan.jpg);} fieldset.twelveMonthPland {background-image:url(../images/paymentmethod/year-plan.jpg);} fieldset.oneMonthPlanp {background-image:url(../images/paymentmethod/monthly-plan-gb.jpg);} fieldset.sixMonthPlanp {background-image:url(../images/paymentmethod/6months-plan-gb.jpg);} fieldset.twelveMonthPlanp {background-image:url(../images/paymentmethod/year-plan-gb.jpg);} fieldset.paymentPlanSelected p {font-size:11px; text-align:center; font-weight:bold; color:#fff;} fieldset.paymentPlanSelected p.paymentPlanTitle {font-size:30px; width:402px; margin:60px 0;} .chngCurrency { position:relative; z-index:1000; margin:20px 0 5px 35px; } .chngCurrency span { float:left; width:138px; height:22px; text-indent:-9999px; background:url(../images/currency-label.png) 0 50% no-repeat; } .chngCurrency ul {margin:0; list-style-type:none;} .chngCurrency > ul {float:left; margin-left:5px;} .chngCurrency > ul > li { position:relative; width:130px; height:22px; line-height:22px; font-weight:bold; font-size:14px; background:url(../images/blue-button-bgr.png) 0 50% repeat-x; border-radius:10px; } .chngCurrency > ul > li > a {display:block; cursor:default; padding:0 10px; color:#fff; position:relative; z-index:12;} .chngCurrency > ul > li > ul { display:none; position:absolute; left:0; top:13px; z-index:10; width:100%; padding:8px 0 2px; background:#60bdf2; border-radius:0 0 10px 10px; } .chngCurrency > ul > li > ul > li > a {display:block; padding:0 10px; color:#fff;} .chngCurrency > ul > li > ul > li > a:hover {color:#0065ce;} .member-packs, .membershipPacks {clear:both; position:relative; z-index:1;} fieldset.paymentTable {padding:20px 38px 0 38px;} fieldset.paymentTable p {font-size:20px; font-weight:bold; margin:0 0 20px 0; text-align:center; color:#fff;} fieldset.paymentTable p small {font-size:14px; font-weight:normal;} fieldset.paymentTable table {border-top:#fff dashed 1px;} fieldset.paymentTable table td {padding:10px 0; border-bottom:#fff dashed 1px; text-align:left; vertical-align:middle; font-size:11px; color:#fff;} fieldset.transactionBox {padding:40px 60px 20px 60px;} fieldset.transactionBox h3 {font-size:19px; color:#fff; text-align:center; margin-bottom:20px;} fieldset.transactionBox h4 {font-size:16px; color:#fff; text-align:center; margin-bottom:20px;} fieldset.transactionBox p {font-size:14px; font-weight:bold; color:#fff; margin-bottom:20px;} fieldset.transactionBox p.extraMargin {margin-bottom:60px;} fieldset.transactionBox hr {margin:20px 0 !important; background:none !important; border-bottom:#fff dashed 1px !important;} fieldset.tokenBox {background:url(../images/token-bgr.png) center 10px no-repeat; padding-top:200px;} fieldset.transactionBox h4 a, .accInfoTable a {color:#1A4D96 !important;} fieldset.transactionBox h4 a:hover, .accInfoTable a:hover {color:#8FEFFF !important;} p.rightDelAccBox {float:left; width:300px; padding-left:45px; font-size:12px; color:#fff;} p.deleteAccBox {padding:0 43px 20px 20px; float:right; width:200px; overflow:hidden;} p.deleteAccBox img {display:block; margin:0 65px 5px 0; clear:both;} p.deleteAccBox a {margin-top:5px; clear:both;} * html p.deleteAccBox a {margin-bottom:30px;} .fieldBox fieldset.illustrationBgr1 {background:url(../images/body-illustration-1.png) 350px 200px no-repeat;} * html .fieldBox fieldset.illustrationBgr1 {background:url(../images/body-illustration-1.png) right 200px no-repeat;} /*.fieldBox fieldset.illustrationBgr7 {background:url(../images/body-illustration-7.png) 442px 167px no-repeat;} * html .fieldBox fieldset.illustrationBgr7 {background:url(../images/body-illustration-7.png) right 167px no-repeat;}*/ #tabContent p.fieldTitle {font-size:20px; color:#fff; text-align:center; margin-bottom:40px;} #tabContent .fieldBox fieldset p.fieldTitle {font-size:20px; color:#fff; text-align:center; margin-bottom:0;} .fieldBox p.regularTitle {font-size:20px; color:#fff; text-align:center; margin:20px 0 40px 0;} #tabContent .fieldBox fieldset p.smallTitle {font-size:18px !important; margin-bottom:20px !important;} #tabContent p.alredySuperhero {background:url(../images/title-already-superhero.png) top center no-repeat; text-indent:-9999px; text-align:left !important; height:21px; margin-bottom:5px !important;} #tabContent hr {margin:10px 40px 0 40px; height:1px; line-height:1px; color:#fff; background:#fff; border:0;} .fieldBox p.infoFieldTxt {font-size:13px; text-align:center; line-height:30px; color:#fff; padding:0 70px 0 0; height:30px; overflow:hidden;} .fieldBox p.overFlowAuto {overflow:auto; line-height:18px; height:auto; padding:0;} .fieldBox p.darkUrlColor a {color:#1a4d96;} .fieldBox p.darkUrlColor a:hover {color:#8FEFFF;} p.regularTxt {text-align:center; color:#fff; font-size:12px;} img.warningSign {float:right; margin:20px 60px 5px 0;} .fieldBox a {color:#fff; font-family:Verdana, Geneva, sans-serif; font-size:13px; text-decoration:underline;} .fieldBox a:hover {color:#8FEFFF; text-decoration:underline;} .fieldBox a:active {color:#1FD5FF; text-decoration:underline;} .fieldBox ul {padding:10px 20px 15px 20px;} fieldset.illustrationBgr1 ul {padding:10px 13px 15px 20px !important;} .fieldBox ul li {list-style-type:none; overflow:auto; position:relative; margin:15px 0 0 0; font-size:16px; color:#fff;} .fieldBox fieldset label {font-size:14px; line-height:24px; text-align:right; float:left; width:192px; padding-right:10px; color:#fff;} .fieldBox fieldset label.errorLabel {color:#F00;} .fieldBox fieldset input.inputFieldWide {float:left; width:283px; height:21px; padding:5px 15px 0 12px; background:url(../images/formfield-wide.gif) 0 0 no-repeat; font-size:14px; color:#3FA9F5;} .fieldBox fieldset input.inputFieldMedium {float:left; width:182px; height:21px; padding:5px 15px 0 12px; background:url(../images/formfield-normal.gif) 0 0 no-repeat; font-size:14px; color:#3FA9F5;} .fieldBox fieldset input.inputFieldSmall {float:left; width:73px; height:21px; padding:5px 15px 0 12px; background:url(../images/formfield-mid.gif) 0 0 no-repeat; font-size:14px; color:#3FA9F5;} .fieldBox fieldset input.inputFieldShort {float:left; width:46px; height:21px; padding:5px 5px 0 12px; background:url(../images/formfield-short.gif) 0 0 no-repeat; font-size:14px; color:#3FA9F5; margin-right:8px;} .fieldBox fieldset ul li p {float:left; width:200px; min-height:50px; padding:0 0 0 10px; font-size:13px; color:#0c3c5f;} .fieldBox fieldset ul li p.smallMargin {padding-bottom:0;} .fieldBox fieldset input.centeredField {float:none; margin:0 auto; display:block;} .fieldBox fieldset span.textareaHolder {float:left; width:223px; height:103px; padding:5px 15px 0 12px; background:url(../images/textarea-bgr.gif) 0 0 no-repeat;} .fieldBox fieldset span.textareaHolder textarea {float:left; width:223px; height:103px; overflow:auto; border:0; background:none; font-size:14px; color:#3FA9F5;} .fieldBox fieldset label.countryLabel {width:90px;} .fieldBox fieldset select.countrySelectBox {float:right;} .fieldBox fieldset select.wideSelectBox {float:right; width:203px !important;} fieldset.ccSelectForm ul { width:420px; margin-left:100px; } fieldset.ccSelectForm ul li {float:left; width:420px; overflow:visible;} fieldset.ccSelectForm ul li label {text-align:left; padding-left:0px; width:200px; font-size:15px;} fieldset.ccSelectForm ul li select {width:auto !important;} fieldset.ccSelectForm h3 {color:#fff; text-align:center; font-size:30px; margin-top:20px; font-weight:normal;} fieldset.ccSelectForm ul li hr { margin:20px 0 !important;} ul.ccTypeSelection {overflow:hidden; display:block; text-align:center; margin-left:0 !important; padding:10px 0 !important;} ul.ccTypeSelection li {display:inline-block; zoom:1; *display:inline; float:none !important; width:70px !important; overflow:hidden !important;} ul.ccTypeSelection li img {display:block; margin-bottom:10px;} ul.ccTypeSelection li span {display:block; text-align:center;} ul.ccTypeSelection li span span {margin-left:24px;} a.cvvInfo {font-size:14px; float:left; display:block; font-weight:bold; text-decoration:none; position:relative; padding:3px 20px 0 0;} a.cvvInfo span {display:none; padding:10px; background:#fff; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; position:absolute; left:17px; top:-3px; font-size:11px; line-height:14px; font-weight:normal; color:#333; width:200px; cursor:text;} a.cvvInfo:hover {text-decoration:none;} a.cvvInfo:hover span {display:block;} ul.gameCardForm {margin-bottom:20px;} ul.gameCardForm li {text-align:center;} ul.gameCardForm li label {display:block; float:none; background:url(../images/paymentmethod/game-card-label.jpg) top center no-repeat; text-indent:-9999px; height:57px; width:auto !important; text-align:left; margin-bottom:20px;} ul.gameCardForm li input {float:none !important;} .fieldBox fieldset select {width:auto; float:left; margin-right:3px;} .fieldBox fieldset ul li span.radioButtons {float:left; width:150px; position:relative;} .fieldBox fieldset ul li span.radioButtons label {width:auto; padding:0;} .fieldBox fieldset ul li span.radioButtons input {position:relative; float:left;} .selectBoxHolder, .selectBoxShort {position:relative; padding:0 20px 50px 20px;} .selectBoxHolder label, .selectBoxShort label {font-size:18px; text-align:right; float:left; width:220px; padding-right:10px; color:#fff;} .selectBoxHolder p, .selectBoxShort p {float:left; position:relative;} .selectBoxHolder ul, .selectBoxShort ul, .selectBoxHolder li, .selectBoxShort li {margin:0; padding:0;} p.termsLine {width:430px; padding-left:24px; clear:both; text-transform:uppercase; position:relative; bottom:-20px; font-size:12px !important; line-height:22px; color:#1a4d96 !important; margin:0 !important; font-weight:normal !important; text-align:left !important;} /*p.termsLine a {float:left; font-size:14px; line-height:22px; color:#1a4d96; text-decoration:underline; margin:0 10px 0 0;} p.termsLine a i {font-style:normal; color:#1a4d96;} p.termsLine a:hover i {color:#8FEFFF;}*/ p.termsLine a {font-style:normal; color:#1a4d96; font-size:12px !important;} p.termsLine a:hover {color:#8FEFFF;} p.termsLine span {float:right; !important;} .fieldBox input.buttonContinue, .fieldBox a.buttonContinue, .fieldBox input.buttonNext, .fieldBox a.buttonNext {float:right; width:148px; height:57px; text-indent:-9999px; clear:both; position:relative; bottom:-5px; right:22px; background:url(../images/bigbuttons/continue.png) 0 -57px no-repeat; cursor:pointer; margin-top:20px;} .fieldBox input.buttonLogin {float:right; width:148px; height:57px; text-indent:-9999px; clear:both; position:relative; bottom:-5px; right:22px; background:url(../images/bigbuttons/login.png) 0 -57px no-repeat; cursor:pointer; margin-top:20px;} .fieldBox input.buttonContinue:hover, .fieldBox a.buttonContinue:hover, .fieldBox input.buttonLogin:hover, .fieldBox input.buttonNext:hover, .fieldBox a.buttonNext:hover {background-position:0 -114px;} .fieldBox input.buttonContinue:active, .fieldBox a.buttonContinue:active, .fieldBox input.buttonLogin:active, .fieldBox input.buttonNext:active, .fieldBox a.buttonNext:active {background-position:0 -171px;} .fieldBox input.buttonContinueDisabled, .fieldBox a.buttonContinueDisabled, .fieldBox input.buttonNextDisabled, .fieldBox a.buttonNextDisabled {background-position:0 0;} p.inactiveContinue, p.inactiveNext {float:right; width:148px; height:57px; text-indent:-9999px; clear:both; position:relative; bottom:-5px; right:22px; background:url(../images/bigbuttons/continue.png) 0 0 no-repeat; margin-top:20px;} .fieldBox input.centeredContinue {float:left; margin-left:270px;} p.inactiveNext, .fieldBox input.buttonNext, .fieldBox a.buttonNext {background-image:url(../images/bigbuttons/next.png);} .fieldBox input.buttonDone {float:right; width:152px; height:59px; text-indent:-9999px; clear:both; position:relative; bottom:-5px; right:22px; background:url(../images/button-done.png) 0 0 no-repeat; cursor:pointer; margin-top:20px;} .fieldBox input.buttonDone:hover {background-position:0 0;} .fieldBox input.buttonDone:active {background-position:0 0;} .fieldBox input.buttonSend {float:right; width:152px; height:57px; text-indent:-9999px; clear:both; position:relative; bottom:-4px; right:40px; background:url(../images/bigbuttons/submit.png) 0 -57px no-repeat; cursor:pointer; margin-top:20px; overflow:hidden;} .fieldBox input.buttonSend:hover {background-position:0 -114px;} .fieldBox input.buttonSend:active {background-position:0 -171px;} .fieldBox input.buttonSendDisabled {background-position:0 0;} input.centeredSend {margin-right:200px;} a.buttonInviteAnother {float:left; width:168px; height:57px; text-indent:-9999px; position:relative; bottom:-4px; left:146px; background:url(../images/bigbuttons/invite-another.png) 0 -57px no-repeat; cursor:pointer; margin-top:20px; overflow:hidden;} a.buttonInviteAnother:hover {background-position:0 -114px;} a.buttonInviteAnother:active {background-position:0 -171px;} a.buttonInviteAnotherDisabled {background-position:0 0;} a.buttonPlayGame {float:right; width:138px; height:57px; text-indent:-9999px; position:relative; bottom:-4px; right:135px; background:url(../images/bigbuttons/play-game.png) 0 -57px no-repeat; cursor:pointer; margin-top:20px; overflow:hidden;} a.buttonPlayGame:hover {background-position:0 -114px;} a.buttonPlayGame:active {background-position:0 -171px;} a.buttonPlayGameDisabled {background-position:0 0;} .thankYouBox {padding-top:85px !important;} p.largeTitle {margin-bottom:56px !important; font-family:'Arial Rounded MT Bold', Arial, Helvetica, sans-serif;} p.largeTitle span {font-size:37px; display:block; margin-bottom:5px;} a#buttonBack {float:right; width:152px; height:57px; text-indent:-9999px; clear:both; position:absolute; bottom:-4px; left:55px; background:url(../images/bigbuttons/back.png) 0 -57px no-repeat; display:block; cursor:pointer; margin-top:20px;} a#buttonBack:hover {background-position:0 -114px;} .a#buttonBack:active {background-position:0 -171px;} a#buttonBackDisabled {background-position:0 0;} a.centeredBack {left:287px !important; bottom:-6px !important; float:none !important; position:relative !important; margin-top:-30px !important;} ul#captchaContent li {display:block; overflow:hidden;} ul#captchaContent li p {text-align:center; font-family:Verdana, Geneva, sans-serif; font-size:16px; color:#fff; float:none; min-height:auto; padding:0; width:auto;} ul#captchaContent li p.smallTxt {font-size:13px;} ul#captchaContent li input {margin-bottom:5px;} ul#captchaContent li p a.newImageButton {display:block; width:102px; height:30px; text-indent:-9999px; margin:10px auto 30px auto; background:url(../images/smallbuttons/new_image.png) 0 0 no-repeat;} ul#captchaContent li p a.newImageButton:hover {background-position:0 -30px;} ul#captchaContent li p a.newImageButton:active {background-position:0 -60px;} input.buttonSubmitSmall {display:block; width:115px; height:46px; text-indent:-9999px; margin:0 auto 0 auto; margin-bottom:20px !important; background:url(../images/smallbuttons/submit.png) 0 0 no-repeat; cursor:pointer;} input.buttonSubmitSmall:hover {background-position:0 -46px;} input.buttonSubmitSmall:active {background-position:0 -92px;} .captchaBox {background:#7BD3FF; width:150px; height:70px; padding:10px; margin:auto;} .paymentPlans {margin-bottom:80px;} a.buttonContinue {width:179px; display:block; height:57px; text-indent:-9999px; position:absolute; bottom:-6px; right:22px; background:url(../images/button-continue.png) 0 0 no-repeat; cursor:pointer; margin-top:20px; right:30px;} a.buttonContinue:hover {background-position:0 -57px;} a.buttonContinue:active {background-position:0 -114px;} .fieldBox input.buttonCreateAcc {float:right; width:214px; height:57px; text-indent:-9999px; clear:both; position:relative; bottom:-5px; right:22px; background:url(../images/button-create-acc.png) 0 0 no-repeat; cursor:pointer; margin-top:20px;} .fieldBox input.buttonCreateAcc:hover {background-position:0 -57px;} .fieldBox input.buttonCreateAcc:active {background-position:0 -114px;} a.buttonCreateFreeAcc {position:relative; display:block; bottom:-7px; width:334px; height:57px; text-indent:-9999px; clear:both; left:205px; background:url(../images/bigbuttons/free_account.png) 0 -57px no-repeat; cursor:pointer;} a.buttonCreateFreeAcc:hover {background-position:0 -114px;} a.buttonCreateFreeAcc:active {background-position:0 -171px;} a.buttonCreateFreeAccDisabled {background-position:0 0;} a.buttonContinueReg, a.buttonDifferentPayMethod, a.buttonExtendAllAccess {display:inline-block; width:177px; margin:20px 10px 0 10px; height:46px; text-indent:-9999px;} a.buttonContinueReg {background:url(../images/smallbuttons/continue_free_reg.png) 0 0 no-repeat;} a.buttonDifferentPayMethod {background:url(../images/smallbuttons/dif_pay_meth.png) 0 0 no-repeat;} a.buttonExtendAllAccess {background:url(../images/smallbuttons/extend_all_access.png) 0 0 no-repeat;} a.buttonContinueReg:hover, a.buttonDifferentPayMethod:hover, a.buttonExtendAllAccess:hover {background-position:0 -46px;} a.buttonContinueReg:active, a.buttonDifferentPayMethod:active, a.buttonExtendAllAccess:active {background-position:0 -92px;} a.buttonBackToAcc {display:inline-block; width:177px; height:30px; margin:10px 0 20px 0; background:url(../images/smallbuttons/back_to_acc.png) 0 0 no-repeat; text-indent:-9999px;} a.buttonBackToAcc:hover {background-position:0 -30px;} a.buttonBackToAcc:active {background-position:0 -60px;} /* Small buttons */ .fieldBox a.smallButton {float:right; margin:0; display:block; height:30px; text-indent:-9999px; background-position:0 0; background-repeat:no-repeat;} .fieldBox a.smallButtonEdit {width:85px; background-image:url(../images/smallbuttons/edit.png);} .fieldBox a.smallButtonSave {width:85px; background-image:url(../images/smallbuttons/save.png);} .fieldBox a.smallButtonChangePass {width:145px; background-image:url(../images/smallbuttons/change_psswrd.png);} .fieldBox a.smallButtonDeleteAcc {width:145px; margin-top:10px; background-image:url(../images/smallbuttons/delete_account.png);} .fieldBox a.smallButtonCancelAcc {width:154px; margin-top:10px; background-image:url(../images/smallbuttons/cancel_account.png);} .fieldBox a.smallButtonWhyBecome {float:left; margin-top:10px; width:177px; background-image:url(../images/smallbuttons/why_bcm_mbr.png);} .fieldBox a.smallCancelPayments {margin-top:10px; width:145px; background-image:url(../images/smallbuttons/cancel_payments.png);} .fieldBox a.smallButtonBackToAcc {float:none; margin:20px auto 80px auto; width:177px; background-image:url(../images/smallbuttons/back_to_acc.png);} .fieldBox a.Paypal {float:none; display:-moz-inline-stack; display: inline-block; zoom: 1; *display: inline; margin-top:10px; width:85px; background-image:url(../images/smallbuttons/paypal.png);} .fieldBox a.ClickNbuy {float:none; display:-moz-inline-stack; display: inline-block; zoom: 1; *display: inline; margin-top:10px; width:122px; background-image:url(../images/smallbuttons/clicknbuy.png);} .fieldBox a.smallButton:hover {background-position:0 -30px;} .fieldBox a.smallButton:active {background-position:0 -60px;} /* Fixes */ fieldset.borderFix {border-bottom:1px dotted #FFFFFF; width:auto; margin:0 45px; padding:40px 0 25px 0;} p.marginTop {margin-top:15px;} p.extraMarginTop {margin-top:43px;} th.borderTop, td.borderTop {border-top:1px dotted #FFFFFF;} th.centeredContent {text-align:center;} th.centeredContent h4 {text-align:center; font-size:16px; margin:20px 0;} th.centeredContent p {text-align:center; font-size:14px; font-weight:bold; margin-bottom:20px;} p.bottomPageBox {text-align:center; color:#fff; font-size:14px; margin-bottom:20px; font-weight:bold;} p.titleBig {font-size:25px !important; font-weight:bold;} fieldset.borderFix p.titleBig {font-size:28px !important; line-height:28px;} p.titleBig small {font-size:18px !important; line-height:28px;} .fieldBox a.redButton {float:right; height:28px; background:url(../images/button-right.png) right 0 no-repeat; color:#fff; font-size:12px; text-decoration:none; font-weight:bold;} .fieldBox a.redButton span {display:inline-block; zoom:1; *display:inline; height:22px; background:url(../images/button-left.png) 0 0 no-repeat; text-align:center; padding:6px 20px 0 20px; text-align:center; cursor:pointer;} .fieldBox a.redButton:hover {color:#fff; background-position:right -28px;} .fieldBox a.redButton:active {background-position:right -56px;} .fieldBox a.redButton span:hover {background-position:0 -28px;} .fieldBox a.redButton span:active {background-position:0 -56px;} .fieldBox a.redButtonSmall {float:right; height:20px; background:url(../images/smallbuttons/small-button-right.png) right top no-repeat; color:#fff; font-size:12px; text-decoration:none;} .fieldBox a.redButtonSmall span {display:inline-block; zoom:1; *display:inline; height:18px; background:url(../images/smallbuttons/small-button-left.png) left top no-repeat; text-align:center; padding:2px 20px 0 20px; text-align:center; cursor:pointer;} .fieldBox a.redButtonSmall:hover {color:#fff; background-position:right -20px;} .fieldBox a.redButtonSmall:hover span {background-position:left -20px;} .fieldBox a.redButtonSmall:active {background-position:right -40px;} .fieldBox a.redButtonSmall:active span {background-position:left -40px;} .fieldBox p a.leftButton {float:left; clear:both; margin-top:10px;} * html .fieldBox p a.leftButton {margin-left:215px;} .fieldBox p a.leftButton span {font-size:12px; line-height:normal;} .fieldBox a.buttonCheckAvailable {float:right; display:block; width:176px; height:30px; text-indent:-9999px; background:url(../images/button-check-available.png) 0 0 no-repeat;} .fieldBox a.buttonCheckAvailable:hover {background-position:0 -30px;} .fieldBox a.buttonCheckAvailable:active {background-position:0 -60px;} a.smallButton {display:block; float:right; height:29px; background:url(../images/small-button-right.gif) right top no-repeat; margin-left:10px;} a.smallButton span {display:block; height:29px; line-height:26px; font-weight:bold; text-transform:uppercase; text-align:center; color:#fff; font-size:12px; background:url(../images/small-button-left.gif) left top no-repeat;} a.editAccountButton, a.editAccountButton span {width:70px;} a.applyChangesButton, a.applyChangesButton span {width:90px;} a.cancelButton, a.cancelButton span {width:170px;} .joinNow {width:651px; height:486px; margin:20px 0 -10px 23px; background:url(../images/join-img.jpg) 0 0 no-repeat;} .joinNow a {position:absolute; display:block; text-indent:-9999px; width:233px; height:57px; background:url(../images/bigbuttons/join_now.png) 0 -57px no-repeat; bottom:-2px; left:247px;} a.joinForFree {position:absolute; display:block; text-indent:-9999px; width:262px; height:57px; background:url(../images/bigbuttons/join-for-free.png) 0 -57px no-repeat; bottom:-1px; left:200px;} .joinNow a:hover {background-position:0 -114px;} .joinNow a:active {background-position:0 -171px;} .joinNow a.disabled {background-position:0 0;} a.bullyBlogButton {position:absolute; display:block; text-indent:-9999px; width:345px; height:57px; background:url(../images/bigbuttons/checkout-bully-blog.png) 0 -57px no-repeat; bottom:-7px; left:175px;} a.bullyBlogButton:hover {background-position:0 -114px;} a.bullyBlogButton:active {background-position:0 -171px;} a.heroScoopButton {position:absolute; display:block; text-indent:-9999px; width:298px; height:57px; background:url(../images/bigbuttons/click-for-hero-scoop.png) 0 -57px no-repeat; bottom:-5px; left:202px;} a.heroScoopButton:hover {background-position:0 -114px;} a.heroScoopButton:active {background-position:0 -171px;} a.heroCommunityButton {position:absolute; display:block; text-indent:-9999px; width:298px; height:57px; background:url(../images/bigbuttons/click-for-community.png) 0 -57px no-repeat; bottom:-5px; left:202px;} a.heroCommunityButton:hover {background-position:0 -114px;} a.heroCommunityButton:active {background-position:0 -171px;} a.buttonUpgrade, a.buttonBuyMembership {position:absolute; display:block; text-indent:-9999px; width:148px; height:57px; background:url(../images/bigbuttons/upgrade.png) 0 -57px no-repeat; bottom:-5px; right:30px;} a.buttonBuyMembership {background-image:url(../images/bigbuttons/buy-membership.png);} a.buttonUpgrade:hover, a.buttonBuyMembership:hover {background-position:0 -114px;} a.buttonUpgrade:active, a.buttonBuyMembership:hover {background-position:0 -171px;} a.buttonRenew {position:absolute; display:block; text-indent:-9999px; width:148px; height:57px; background:url(../images/bigbuttons/renew.png) 0 -57px no-repeat; bottom:-5px; right:30px;} a.buttonRenew:hover {background-position:0 -114px;} a.buttonRenew:active {background-position:0 -171px;} .createHero {width:640px; height:395px; margin:20px 0 -10px 23px; /*background:url(../images/create-hero-img.jpg) 0 0 no-repeat;*/ background:url(../images/create-hero-img-new.jpg) 0 0 no-repeat; position:relative;} .createHero a {position:absolute; display:block; text-indent:-9999px; width:352px; height:57px; background:url(../images/bigbuttons/create_superhero_acc.png) 0 -57px no-repeat; bottom:-3px; left:150px;} .createHero a:hover {background-position:0 -114px;} .createHero a:active {background-position:0 -171px;} .createHero a.disabled {background-position:0 0;} .superheroesContent, .bulliesBoxStyle {padding-top:20px !important;} .superheroesContent p, .bulliesBoxStyle p {padding:0 40px 16px 37px !important;} .superheroesContent h2, .bulliesBoxStyle h2 {margin-bottom:20px !important;} .superheroesContent h2 span, .bulliesBoxStyle h2 span {margin-top:0 !important;} .superheroesContent dl, .bulliesBoxStyle dl {padding:5px 40px 16px 37px !important;} table.accInfoTable {border:0; margin:20px 0 20px 44px;} table.accInfoTable th, table.accInfoTable td {padding:10px 0; vertical-align:middle; border-bottom:#fff dotted 1px; color:#fff;} table.accInfoTable th {text-align:left; font-weight:normal; font-size:12px;} table.accInfoTable th.topText {vertical-align:top;} table.accInfoTable th.bottomRow, table.accInfoTable td.bottomRow {border-bottom:0;} table.accInfoTable th.bottomPadding, table.accInfoTable td.bottomPadding {padding-bottom:20px;} span#genderinput b {float:left; width:30px; height:22px; line-height:22px; font-weight:normal;} dl.paymentMethod {overflow:hidden; clear:both; margin-bottom:40px; padding:0 0 0 40px;} * html dl.paymentMethod {padding:0 0 40px 40px;} dl.paymentMethod dt {float:left; color:#fff; width:200px; font-size:12px; clear:left; padding-top:20px; height:60px; border-top:#fff solid 1px;} dl.paymentMethod dd {float:left; width:420px; text-align:right; padding-top:20px; height:60px; border-top:#fff solid 1px;} dl.paymentMethod dt.topMethodRow {height:90px; padding-top:20px; border:0;} dl.paymentMethod dd.topMethodRow {height:110px; border:0; padding-top:0;} ul.gameRules {overflow:hidden; clear:both; margin-bottom:40px; padding:0 0 0 120px;} ul.gameRules li {font-size:14px; list-style-type:none; color:#fff; background:url(../images/bullet-large.gif) 0 11px no-repeat; padding:10px 0 10px 30px; width:430px; line-height:18px;} .gameRulesBottom {width:413px; height:385px; margin:0 0 40px 125px; background:url(../images/body-illustration-3.jpg) 0 0 no-repeat; position:relative;} .gameRulesBottom a {position:absolute; left:145px; top:128px; display:block; width:130px; height:130px; background:url(../images/play-button.png) 0 0 no-repeat; text-indent:-9999px;} /* Mid and Wide content box */ .midBoxHolder {width:501px; background:url(../images/box-bgr-mid.gif) left top repeat-y;} .midBoxInner {width:501px; background:url(../images/box-bottom-mid.gif) left bottom no-repeat;} .midBox {width:501px; padding:24px 0; background:url(../images/box-top-mid.gif) left top no-repeat;} .wideContent {padding:24px 0;} .wideContent h2 {margin-left:-4px;} .midBox img, .wideContent img {margin-left:28px;} .midBox h2 span, .wideContent h2 span {height:23px; display:block; margin-top:10px; padding:13px 0 0 37px; font-size:17px; color:#fff;} .midBox h2 span.shortTitle, .wideContent h2 span.shortTitle {background:url(../images/h2-short-bgr.png) 0 0 no-repeat;} .midBox h2 span.midTitle, .wideContent span.midTitle {background:url(../images/h2-mid-bgr.png) 0 0 no-repeat;} .midBox h2 span.wideTitle, .wideContent span.wideTitle {background:url(../images/h2-wide-bgr.png) 0 0 no-repeat;} .midBox ul {padding:10px 40px 0 37px;} .midBox ul li {list-style-type:none; background:url(../images/bullet-blue.png) 10px 5px no-repeat; font-size:12px; line-height:18px; color:#666; padding-left:27px;} .midBox.page-class-41 ul li {padding-left:0; background:none;} .midBox.page-class-41 ul li a {font-size:12px; font-weight:bold; color:#1A4D96; font-family: Verdana,Geneva,sans-serif;} .midBox.page-class-41 ul li a:hover {color:#ed1c24; text-decoration:underline;} .midBox p, .wideContent p {padding:20px 40px 5px 37px; font-size:12px; line-height:18px; color:#666;} .midBox p a, .wideContent p a {font-family:Verdana, Geneva, sans-serif; color:#1a4d96;} .midBox p a:hover, .wideContent p a:hover {color:#ED1C24; text-decoration:underline;} .faqList p {padding-top:10px;} /* News content box */ .newsBoxHolder {width:501px; margin-bottom:20px; background:url(../images/box-bgr-news.gif) right top repeat-y;} .newsBoxInner {width:501px; background:url(../images/box-bottom-news.gif) right bottom no-repeat;} .newsBox {width:501px; padding:24px 0; background:url(../images/box-top-news.gif) right top no-repeat;} .newsBox h2 {height:52px; margin-top:10px; padding:7px 0 0 70px; font-size:17px; color:#fff; background:url(../images/h2-news.png) 0 0 no-repeat;} .newsBox h2 a {color:#fff;} .newsBox h2 a:hover {text-decoration:underline;} .newsBox p {padding:0 40px 20px 70px; font-size:12px; line-height:18px; color:#666;} .newsBox p.date {color:#3ea9f5; padding:0 0 0 70px;} .newsBox p span {float:right; font-size:11px;} .newsBox p span.back {float:left;} .newsBox p span a {color:#3ea9f5;} .newsBox p span a:hover {text-decoration:underline;} #pagination {width:501px; position:relative; height:40px; clear:both; margin-bottom:-13px;} * html #pagination {margin-bottom:-13px;} #pagination p.arrow {position:absolute; top:0; width:50px; height:40px; background-position:0 -120px; background-repeat:no-repeat; text-indent:-9999px} #pagination p.arrow a {display:block; width:50px; height:40px; background-position:0 0; background-repeat:no-repeat;} #pagination p.leftArrow {background-image:url(../images/arrow-left.jpg); left:73px;} #pagination p.leftArrow a {background-image:url(../images/arrow-left.jpg);} #pagination p.rightArrow {background-image:url(../images/arrow-right.jpg); right:54px;} #pagination p.rightArrow a {background-image:url(../images/arrow-right.jpg);} #pagination p.arrow a:hover {background-position:0 -40px;} #pagination ul {width:500px; padding-left:10px; text-align:center;} * html #pagination ul {width:490px;} #pagination ul li {list-style-type:none; display:inline-block; zoom:1; *display:inline; padding:5px 0 0 5px; color:#fff; font-weight:bold;} * html #pagination ul li {display:inline; width:20px;} #pagination ul li a, #pagination ul li b {display:block; font-size:12px; color:#4a7fe5; height:21px; background:url(../images/pagination-sprite.gif) 0 -63px no-repeat #b5cdef;} #pagination ul li a span, #pagination ul li b span {display:block; padding:0 7px; text-align:center; height:21px; line-height:21px; background:url(../images/pagination-sprite.gif) right -42px no-repeat;} #pagination ul li b.activePage, #pagination ul li a:hover {background-position:0 -21px; background-color:#fff;} #pagination ul li b.activePage span, #pagination ul li a:hover span {background-position:right 0;} /* Short content box */ .shortBoxHolder {width:177px; clear:both; margin-left:11px; background:url(../images/box-bgr-short.gif) left top repeat-y;} .shortBoxInner {width:177px; background:url(../images/box-bottom-short.gif) left bottom no-repeat;} .shortBox {width:177px; padding-bottom:15px; background:url(../images/box-top-short.gif) left top no-repeat;} .shortBox p {padding:22px 27px 15px 22px; color:#0077cb; font-size:11px; line-height:16px;} .shortBox h6 {background:url(../images/title-bgr-side.png) top right no-repeat; height:19px; padding:9px 0 0 67px; font-size:15px; color:#fff;} .shortBox h6.high {background:url(../images/title-bgr-side-high.png) top right no-repeat; height:39px; padding:11px 0 0 67px; font-size:15px; color:#fff;} .sideImg {float:right; clear:both;} a.addMargin {margin:30px 0 45px 0; display:block;} div.addMargin {margin-bottom:30px;} ul#newsList {width:160px; padding-left:18px; margin-bottom:50px;} ul#newsList li {list-style-type:none; font-size:15px; color:#fff; border-bottom:#fff dotted 1px; padding:2px 0;} ul#newsList li a {font-size:12px; color:#fff; display:block; padding-left:5px;} ul#newsList li a:hover {color:#ED1C24;} ul#newsList li a.activeSideNews {background:#ED1C24;} ul#newsList li a.activeSideNews:hover {color:#fff;} ul#newsList li ul li {padding-left:10px; border-top:#7cc7f8 dotted 1px; border-bottom:0;} ul#newsList li ul li a {font-size:11px; color:#c6e8fe;} ul.funStuffRight {width:160px; margin:5px 0 50px 18px; border-top:#fff dotted 1px;} ul.funStuffRight li {list-style-type:none; font-size:15px; color:#fff; border-bottom:#fff dotted 1px; padding:4px 0;} ul.funStuffRight li a {font-size:16px; color:#fff; display:block; padding-left:5px;} ul.funStuffRight li a:hover {color:#ED1C24;} ul.funStuffRight li a.activeSideNews {background:#ED1C24;} ul.funStuffRight li a.activeSideNews:hover {color:#fff;} /* Bullies add ons */ #bulliesContent #tabContentHolder {background:url(../images/tab-content-bottom-bullies.gif) left bottom no-repeat #f15a24;} #bulliesContent .pageTitle {background:url(../images/tab-content-top-bullies.gif) left bottom no-repeat #fff;} #bulliesContent .wideBoxHolder {width:686px; margin-bottom:0px; background:url(../images/box-bgr-wide-bullies.gif) left top repeat-y;} #bulliesContent .wideBoxInner {width:686px; background:url(../images/box-bottom-wide-bullies.gif) left bottom no-repeat;} #bulliesContent .wideBox {width:686px; padding:6px 0 12px 0; background:url(../images/box-top-wide-bullies.gif) left top no-repeat;} #bulliesContent img {margin:5px 0 0 13px;} #bulliesContent .wideBox h2 span {height:23px; display:block; margin-top:20px; padding:13px 0 0 37px; font-size:17px; color:#fff;} #bulliesContent .wideBox h2 span.shortTitle {background:url(../images/h2-short-bgr.png) 0 0 no-repeat;} #bulliesContent .wideBox h2 span.midTitle {background:url(../images/h2-mid-bgr.png) 0 0 no-repeat;} #bulliesContent .wideBox h2 span.wideTitle {background:url(../images/h2-wide-bgr.png) 0 0 no-repeat;} #bulliesContent .wideBox p {padding:20px 40px 20px 37px; font-size:12px; line-height:18px; color:#666;} #bulliesContent .wideBox dl {width:600px; overflow:hidden; font-size:12px; color:#666; padding:5px 40px 5px 37px;} #bulliesContent .wideBox dl dt {float:left; width:150px; color:#F15A24; font-weight:bold; padding:2px 0 5px 0; text-align:right;} #bulliesContent .wideBox dl dd {float:left; width:440px; padding:2px 0 5px 10px; text-align:left;} /* Heroes add ons */ #heroesContent #tabContentHolder {background:url(../images/tab-content-bottom-heroes.gif) left bottom no-repeat #8ce03f;} #heroesContent .pageTitle {background:url(../images/tab-content-top-heroes.gif) left bottom no-repeat #fff;} #heroesContent .wideBoxHolder {width:686px; margin-bottom:20px; background:url(../images/hero-box-bgr-wide.png) left top repeat-y;} #heroesContent .wideBoxInner {width:686px; background:url(../images/hero-box-bottom-wide.png) left bottom no-repeat;} #heroesContent .wideBox {width:686px; padding:6px 0 12px 0; background:url(../images/hero-box-top-wide.png) left top no-repeat;} #heroesContent img {margin:5px 0 0 13px;} #heroesContent .wideBox h2 span {height:23px; display:block; margin-top:20px; padding:13px 0 0 37px; font-size:17px; color:#fff;} #heroesContent .wideBox h2 span.shortTitle {background:url(../images/h2-short-bgr.png) 0 0 no-repeat;} #heroesContent .wideBox h2 span.midTitle {background:url(../images/h2-mid-bgr.png) 0 0 no-repeat;} #heroesContent .wideBox h2 span.wideTitle {background:url(../images/h2-wide-bgr.png) 0 0 no-repeat;} #heroesContent .wideBox p {padding:20px 40px 20px 37px; font-size:12px; line-height:18px; color:#666;} #heroesContent .wideBox dl {width:600px; overflow:hidden; font-size:12px; color:#666; padding:5px 40px 5px 37px;} #heroesContent .wideBox dl dt {float:left; width:150px; color:#F15A24; font-weight:bold; padding:2px 0 5px 0; text-align:right;} #heroesContent .wideBox dl dd {float:left; width:440px; padding:2px 0 5px 10px; text-align:left;} /*ul#heroesList {float:left; width:240px; padding-left:10px;} ul#heroesList li {background:url(../images/hero-img-box.png); list-style-type:none; width:114px; height:123px; float:left; margin:0 5px 5px 0;} ul#heroesList li a {display:block; width:114px; height:123px; background-position:6px 22px; background-repeat:no-repeat; text-indent:-9999px;} ul#heroesList li a.heroRockFreely {background-image:url(../images/hero-rock-freely.png);} ul#heroesList li a.heroSammySonic {background-image:url(../images/hero-sammy-sonic.png);} ul#heroesList li a.heroAllyKazam {background-image:url(../images/hero-ally-kazam.png);} ul#heroesList li a.heroKaBoom {background-image:url(../images/hero-ka-boom.png);} ul#heroesList li a.heroTango {background-image:url(../images/hero-tango.png);} ul#heroesList li.lastHeroBox {margin-left:60px;} .heroBoxHolder {float:right; margin:20px 10px 0 0; width:437px; background:url(../images/hero-box-bgr.png) left top repeat-y;} * html .heroBoxHolder {margin-right:5px;} .heroBoxInner {width:437px; background:url(../images/hero-box-bottom.png) left bottom no-repeat; padding-bottom:20px;} .heroBox {width:437px; background:url(../images/hero-box-top.png) left top no-repeat;} .heroBox h2 {width:151px; height:70px; position:relative; left:41px; top:-9px; background:url(../images/hero-title-bgr.png) 0 0 no-repeat;} .heroBox h2 span {display:block; width:134px; height:70px; background-position:0 0; background-repeat:no-repeat; text-indent:-9999px;} .heroBox h2 span.heroTitleRockFreely {background-image:url(../images/hero-title-rock-freely.png);} .heroBox h2 span.heroTitleSammySonic {background-image:url(../images/hero-title-sammy-sonic.png);} .heroBox h2 span.heroTitleAllyKazam {background-image:url(../images/hero-title-ally-kazam.png);} .heroBox h2 span.heroTitleKaBoom {background-image:url(../images/hero-title-ka-boom.png);} .heroBox h2 span.heroTitleTango {background-image:url(../images/hero-title-tango.png);} .heroBox p {color:#4D4D4D; font-size:12px; line-height:16px; width:202px; padding:10px 0 15px 23px;}*/ p.sideDisclaimer {font-size:11px; width:160px; color:#a2ddff; line-height:14px; margin:5px 0 10px 17px; text-align:center;} p.contentDisclaimer {font-size:11px !important; color:#c9c9c9 !important; line-height:14px !important; margin-bottom:35px;} /* FOOTER -------------------------------------- */ #footer {width:800px; overflow:hidden; clear:both; background:url(../images/footer-bgr.png) 0 0 no-repeat; height:33px; padding-top:84px;} #footer ul {width:800px; height:33px; background:url(../images/footer-tile-bgr.gif) left top repeat-x;} #footer ul li {float:left; height:33px; list-style-type:none;} #footer ul li a {float:left; display:block; height:33px; text-indent:-9999px; background-position:0 0; background-repeat:no-repeat;} #footer ul li a.footnavCompany {background-image:url(../images/footermenu/company.gif); width:91px;} #footer ul li a.footnavPolicy {background-image:url(../images/footermenu/privacy_pol.gif); width:124px;} #footer ul li a.footnavTerms {background-image:url(../images/footermenu/terms.gif); width:109px;} #footer ul li a.footnavContact {background-image:url(../images/footermenu/contact.gif); width:98px;} #footer ul li a.footnavSitemap {background-image:url(../images/footermenu/sitemap.gif); width:98px;} #footer ul li.loginFooterNav {float:right;} #footer ul li.loginFooterNav a {background-image:url(../images/footermenu/login.gif); width:68px;} #footer ul li.logoutFooterNav {float:right;} #footer ul li.logoutFooterNav a {background-image:url(../images/footermenu/logout.gif); width:68px;} #footer ul li a:hover {background-position:0 -33px;} #footer ul li a:active {background-position:0 -66px;} #footer ul li a.selectedFoterNav {background-position:0 -66px;} #footer ul li {line-height:33px; font-size:12px; color:#fff;} #footer ul li.rightFooterBox {float:right; padding:0 12px;} #footer ul li.rightFooterBox a {text-indent:0; font-size:12px; color:#fff;} #footer ul li.farRightBgr {text-align:center; width:68px; padding:0;} #footer ul li.farRightBgr a {width:68px; background:url(../images/footermenu/logout.gif) 0 0 no-repeat; width:68px; display:block; text-indent:-9999px;} #footer ul li.farRightBgr a:hover {background-position:0 -33px;} #footer ul li.farRightBgr a:active {background-position:0 -66px;} #footer ul li.rightFooterBox a:hover {text-decoration:underline;} /* POPUPS -------------------------------------- */ .popupWin {width:100%; height:100%; position:absolute; top:0; left:0; display:none; z-index:1000;} .popupWarning {width:370px; height:246px; position:absolute; left:50%; top:400px; margin-left:-185px; background:url(../images/popup-bgr-orange-high.png) left top no-repeat; z-index:1002; text-align:center;} .popupWarning img {margin:20px 0;} .popupWarning p {font-size:16px; padding:0 30px; font-weight:bold; line-height:20px; color:#fff;} .popupWarning p.textOnlyWarning {padding-top:110px;} .popupLowBox {background:url(../images/popup-bgr-orange-low.png) left top no-repeat; width:406px; height:120px; position:absolute; left:50%; top:400px; margin-left:-203px;} .popupLowBox p {font-size:16px; padding:40px 30px 0 110px; font-weight:bold; text-align:center; line-height:20px; color:#fff;} .popupLowBox p.oneRowWarning {padding-top:50px;} .popupInfoLowBox {background:url(../images/popup-bgr-blue-low.png) left top no-repeat; width:475px; height:180px; position:absolute; left:50%; top:400px; margin-left:-240px;} .popupInfoLowBox p {font-size:16px; padding:40px 30px 0 30px; font-weight:bold; text-align:center; line-height:20px; color:#fff;} a.playButton {background:url(../images/button-play.png) 0 0 no-repeat; width:144px; height:31px; display:block; text-indent:-9999px; margin:33px 0 0 135px;} *html a.playButton {margin-left:20px;} a.playButton:hover {background-position:0 -31px;} a.playButton:active {background-position:0 -62px;} .popupInfoLowerBox {background:url(../images/popup-bgr-blue-lower.png) left top no-repeat; width:406px; height:119px; position:absolute; left:50%; top:400px; margin-left:-203px;} .popupInfoLowerBox p {font-size:16px; padding:40px 30px 0 30px; font-weight:bold; text-align:center; line-height:20px; color:#fff;} .popupInfoMidBox {background:url(../images/popup-bgr-blue-mid.png) left top no-repeat; width:376px; height:236px; position:absolute; left:50%; top:400px; margin-left:-203px; font-size:13px; color:#fff; padding:10px 0 0 30px;} .popupInfoMidBox a.closePopup {display:block; position:absolute; top:18px; right:21px; width:30px; height:30px; background:url(../images/popup-close-button.png) 0 0 no-repeat; text-indent:-9999px;} .popupInfoMidBox a.closePopup:hover {background-position:0 -30px;} .popupInfoMidBox a.closePopup:active {background-position:0 -60px;} .popupInfoMidBox p {padding-top:20px;} .popupInfoMidBox p b {font-size:16px;} .popupInfoMidBox fieldset {padding-top:7px;} .popupInfoMidBox label {display:block; font-size:13px; color:#fff; padding-bottom:5px;} .popupInfoMidBox input.popupInput {background:url(../images/popup-input.png) 0 0 no-repeat; width:192px; height:21px; float:left; margin-right:10px; font-size:13px; padding:5px 7px;} .popupInfoMidBox input.popupSend {background:url(../images/button-send.png) 0 0 no-repeat; width:93px; height:31px; float:left; cursor:pointer;} .popupInfoMidBox input.popupSend:hover {background-position:0 -31px;} .popupInfoMidBox input.popupSend:active {background-position:0 -62px;} .popupInfoHighBox {background:#fff; width:415px; height:403px; position:fixed; left:50%; top:50%; margin-left:-207px; margin-top:-201px;} .popupTop {color:#fff; font-size:16px; overflow:hidden; clear:both; margin:10px 12px;} .popupTop p {float:left; width:237px; height:42px; line-height:42px; padding-left:15px; background:url(../images/popup-title-bgr.gif) 0 0 no-repeat;} .popupTop a.closePopupBox {float:right; width:131px; height:42px; line-height:42px; text-align:center; background:url(../images/popup-close-bgr-new.gif) 0 0 no-repeat; color:#fff;} .termsPopupContent {background:url(../images/popup-content-bgr.png); width:391px; height:331px; margin:0 0 0 12px; overflow:hidden;} #termsPopupHolder {width:358px; height:300px; margin:10px 0 0 15px; overflow:auto; position:relative; display:block;} * html .popupInfoHighBox {padding-top:30px;} #termsPopupHolder p {padding:0 5px 15px 0; text-indent:20px; font-size:11px; color:#478BE0;} .termsPopupLine {padding:15px 0 0 110px; clear:both;} .termsPopupLine a {float:left; font-size:14px; line-height:22px; color:#fff; text-decoration:underline; margin:0 10px 0 0;} /* Cards Popup */ .cardsPopupContent {text-align:center;} .cardsPopupContent p {font-size:12px !important; text-indent:0 !important; text-align:left !important; padding:9px 5px !important;} /* Wait loader */ #waitLoader {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:url(../images/wait-loader-bgr.png) repeat; z-index:1000;} #waitLoader img {position:fixed; left:50%; top:50%; width:233px; height:233px; margin:-116px 0 0 -116px; z-index:1002;} #waitLoader.alwaysVisible {background:none; display:block !important;} #waitLoader.alwaysVisible img {position:absolute; margin-top:-180px;} .fieldBox ul li.clearFixLine {clear:both;} .fieldBox ul li.parentMailLine {overflow:visible !important; width:602px; float:left; padding-bottom:15px;} #parentEmailInfo {display:none; position:absolute; left:423px; top:-75px; width:196px; height:174px; background:url(../images/parent-info-box.png) 0 0 no-repeat; font-size:18px; font-weight:bold; z-index:1000; text-align:center; padding:37px 0 0 11px; text-shadow:1px 1px 1px #666;} /* Username input field --------------------------------------------- */ #usernameInputContainer {float: left; width: 182px; height: 21px; padding-right: 27px;} #inputStatusSign {pointer-events: none; position: absolute; width:16px; height:16px; right:6px; top: 5px;} .inputStatusSpinner{background:url(../images/ajax-loader.gif) 0 0 no-repeat;} .inputStatusSuccess{background:url(../images/sign_success.png) 0 0 no-repeat;} .inputStatusException{background:url(../images/sign_exception.png) 0 0 no-repeat;} .inputFieldUsername {position: absolute; width:182px; height:21px; padding:5px 15px 0 12px; background:url(../images/formfield-normal.gif) 0 0 no-repeat; font-size:14px; color:#3FA9F5;} /* Trace window --------------------------------------------- */ #trace{ color: #93D200; position: absolute; top: 0px; left: 0px; font-size: 30pt; } /* Tooltip --------------------------------------------- */ .infoTooltip{ background:url(../images/tooltip_green_small.png) 0 0 no-repeat; pointer-events: none; /*padding-bottom: 40px; padding-top: 20px;*/ } .infoTooltipText{ text-align: center; color: #fff; -webkit-transform: translateY(50%); -ms-transform: translateY(50%); transform: translateY(50%); filter: progid:DXImageTransform.Microsoft.Matrix( M11=1, M12=0, M21=0, M22=1, SizingMethod='auto expand'); filter: progid:DXImageTransform.Microsoft.Matrix( M11=1, M12=0, M21=0, M22=1, SizingMethod='auto expand'); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, SizingMethod='auto expand')"; } .infoTooltipX1{ background:url(../images/tooltip_green_small_x1.png) 0 0 no-repeat; pointer-events: none; padding-bottom: 30px; padding-top: 15px; } .infoTooltipTextX1{ text-align: center; color: #fff; } .exceptionTooltip{ background:url(../images/tooltip_error.png) 0 0 no-repeat; pointer-events: none; padding-bottom: 40px; padding-top: 20px; } .exceptionTooltipText{ text-align: left; color: #fff; padding-left: 124px; padding-right: 32px; padding-top: 10px; } /* 13.10.2010. --------------------------------------------- */ .verifyForm #parentEmailInfo {display:block !important; height:137px;} .verifyForm .parentMailLine {padding-bottom:0 !important; margin-left:40px; width:562px !important;} .newBoxInner { padding:20px 0; } .topButtonContent { overflow:hidden; padding-left:80px; background:url(../images/play-now-blue-button.png) 210px 12px no-repeat; } .playButtonBox { float:left; } .topButtonContent a { display:block; float:left; width:216px; height:130px; padding-top:16px; text-indent:-9999px; } .login-now-button a { width:400px; height:144px; padding:0; margin:7px 0 0 55px; background:url(../images/play-button-static.png) 0 0 no-repeat; } .login-now-button a:hover { background-position:0 -144px; } .login-now-button a:active { background-position:0 -288px; } .topButtonContent p i { font-size:14px; color:#fff; font-style:normal; } .centerImage { padding:3px 0; text-align:center; } .bottomButtonContent { overflow:hidden; padding:10px 26px 0 43px; } .bottomButtonContent img { float:right; margin-left:25px; } .bottomButtonContent h4 { margin:10px 0 5px 0; font-size:26px; font-weight:normal; color:#fff; font-weight:bold; } .bottomButtonContent p { font-size:16px; color:#fff; font-weight:bold; line-height:20px; } .thankYouFix { padding:10px 37px 30px; } .thankYouFix h4 { height:112px; text-indent:-9999px; background:url(../images/upgrade-now-title.png) center 22px no-repeat; border-bottom:#fff solid 1px; } .thankYouFix h4.no-line-fix { border-bottom:0; } .line-fix { padding-bottom:20px; border-bottom:#fff solid 1px; } a.play-top-button { display:block; width:144px; height:144px; margin:0 auto; text-indent:-9999px; background:url(../images/play-button-static.png) 0 0 no-repeat; } a.play-top-button:hover {background-position:0 -144px;} a.play-top-button:active {background-position:0 -288px;} .account-top { margin-top:-50px; padding-bottom:60px; } .thankYouFix a.upgradeNowButton { display:block; width:430px; height:147px; margin:20px auto 30px auto; text-indent:-9999px; background:url(../images/upgrade-now-button.png) 0 0 no-repeat } .thankYouFix a.upgradeNowButton:hover { background-position:0 -147px; } .thankYouFix p { margin:0 70px; color:#fff; font-size:18px; font-weight:bold; text-shadow:1px 1px 1px #1e5075; line-height:20px; } .thankYouFix p a { color:#ffb400; font-size:18px; } .thankYouFix ul { padding:0; margin:10px 70px; } .thankYouFix ul li { padding-left:38px; margin:0; overflow:visible; color:#fff; font-size:18px; font-weight:bold; text-shadow:1px 1px 1px #1e5075; line-height:20px; background:url(../images/bullet-large.png) 18px 5px no-repeat; } .checkEmailBox { position:relative; height:445px; padding:20px 0; background:url(../images/check-mail-artwork.png) 159px 20px no-repeat; } .checkEmailBox div { position:absolute; left:52px; bottom:25px; } .checkEmailBox h4 { margin-bottom:15px; font-size:23px; color:#fff; font-weight:bold; line-height:25px; text-align:center; text-shadow:1px 1px 1px #1e5075; } .checkEmailBox h4 i { font-size:14px; font-style:normal; } .checkEmailBox p { padding-top:10px; font-size:12px; color:#fff; font-weight:bold; line-height:25px; text-align:center; text-shadow:1px 1px 1px #1e5075; line-height:17px; } .checkEmailBox p a { color:#ffb400; font-size:12px; } a.backExpanded { background:url(../images/bigbuttons/back-extended.png) 0 -57px no-repeat !important; } a.backExpanded:hover {background-position:0 -114px !important;} a.backExpanded:active {background-position:0 -171px !important;} .privoLogo {text-align:center; overflow:hidden; margin-right: 13px; padding: 20px 0 10px 0;} #rightColumn .privoLogo {margin-right:0; padding:0 0 30px 0;} .nappaLogo {text-align:center; padding:0 0 20px 0;} p.centeredCancelButton { text-align:center; padding-right:187px; clear:both; overflow:hidden; } /* Selection page update 31.01.2012. */ ul.member-packs { overflow:hidden; margin:0 10px 0 15px; padding:0 0 20px 0; list-style-type:none; } ul.member-packs li { float:left; position:relative; height:230px; margin-bottom:32px; text-align:center; background:none; } ul.member-packs li.one-month {width:210px; margin-right:0;} ul.member-packs li.six-months {width:210px; margin-right:0;} ul.member-packs li.twelve-months {width:230px; margin-right:0;} ul.member-packs li div.member-pack {position:absolute; bottom:0; background:none;} ul.member-packs li span { position:absolute; left:0; bottom:-50px; width:100%; height:40px; } ul.member-packs li.one-month span {background:url(../images/token-info-1.png) 50% 0 no-repeat;} ul.member-packs li.six-months span {background:url(../images/token-info-2.png) 50% 0 no-repeat;} ul.member-packs li.twelve-months span {background:url(../images/token-info-3.png) 50% 0 no-repeat;} ul.selection-page-images { width:678px; margin:0 0 0 3px; list-style-type:none; } ul.selection-page-images li { text-align:center; } ul.selection-page-images li img {display:block;} ul.selection-page-images li.privoLogo img {margin:0 auto 20px auto;} /* Become a member page */ ul.two-columns-signup { overflow:hidden; margin:0 0 20px 16px; padding:10px 0 2px; list-style-type:none; } ul.two-columns-signup li { float:left; position:relative; width:322px; height:220px; padding-top:40px; background:url(../images/become-a-member/box-bgr.png) 0 0 no-repeat; } ul.two-columns-signup li h3, ul.two-columns-signup li.new-player-column p { text-indent:-9999px; background-image:url(../images/become-a-member/text-sprite.png); background-repeat:no-repeat; } ul.two-columns-signup li.existing-player-column {margin-right:12px;} ul.two-columns-signup li.existing-player-column h3 { height:55px; margin-bottom:31px; background-position:50% 0; } ul.two-columns-signup li.new-player-column h3 { height:55px; background-position:50% -83px; } ul.two-columns-signup li.new-player-column p { height:73px; background-position:50% -143px; } ul.two-columns-signup li.existing-player-column p { overflow:hidden; margin-bottom:10px; padding:0 35px; } ul.two-columns-signup li.existing-player-column label { float:left; width:90px; color:#fff; font-size:16px; line-height:25px; font-weight:bold; } ul.two-columns-signup li.existing-player-column input[type=text], ul.two-columns-signup li.existing-player-column input[type=password] { float:right; width:140px; height:25px; padding:0 10px; font-size:12px; background:#fff; border-radius:12px; -moz-border-radius:12px; -webkit-border-radius:12px; } p.become-superhero-bottom-text { padding:20px 0; text-align:center; font-size:11px; color:#4D4D4D; font-weight:bold; line-height:18px; } p.become-superhero-bottom-text a { color:#003D9F; text-decoration:underline; } p.become-superhero-bottom-text a:hover {text-decoration:none;} .two-columns-signup li input.buttonContinue, .new-player-column a {width:148px; height:57px; text-indent:-9999px; clear:both; position:absolute; left:50%; margin-left:-74px; bottom:-2px; background:url(../images/bigbuttons/continue.png) 0 -57px no-repeat; cursor:pointer;} .two-columns-signup input.buttonContinue:hover, .new-player-column a:hover {background-position:0 -114px;} .two-columns-signup input.buttonContinue:active, .new-player-column a:active {background-position:0 -171px;} .new-player-column a {background:url(../images/bigbuttons/create-a-superhero-account.png) 0 -57px no-repeat;} /* Select plan addition */ fieldset.paymentPlanSelected {position:relative;} fieldset.paymentPlanSelected p.paymentPlanTitle {text-align:left; margin:40px 0 80px; padding-left:80px;} fieldset.paymentPlanSelected span.sub-period { position:absolute; left:80px; top:95px; color:#fff; font-size:30px; font-weight:bold; } /* = Responsive layout -------------------------------------------------------------------------------------- @media screen and (max-width: 1600px) { a.logo { width:200px; background-size:100% auto; } } @media screen and (max-width: 1280px) { a.logo {left:10px; width:150px;} }*/