/* -------------------------------------------------------------- main.css * Custom CSS specific to NG Note: Guidelines are commented inline -------------------------------------------------------------- */ body { margin-top: 0px; } /*Overrides a BlueprintCSS file to keep flush at top */ body.innerPage { margin: 0px; } .iframeContainer { margin: 0 auto; position: relative; } a { outline: none; } #mainContainer {background:#fff url(../images/mainGame-bg.png) top left repeat-x;} /* -------------------------------------------------------------- LEVELS -------------------------------------------------------------- */ /* -------------------------------------------------------------- HEADER AND NAVIGATION -------------------------------------------------------------- */ /* Branding Bars */ .ownerBrandBar { height: 19px; position: relative;} .ownerBrand a { width: 162px; height: 10px; margin: 4px 0 0 26px; background: url(../images/header/parent_logo.png) no-repeat; text-indent: -9999px; display: block; } /* The connection type indicator. */ .NGConnect { position: absolute; top: 0; right: 1px; width: 1px; font-size: 10px; } .NGConnectAjax { float: left; width: 1px; height: 1px; background: #0A0; position: absolute; top: 5px; } /* ajax connected state */ .NGDisconnectAjax { float: left; width: 1px; height: 1px; background: #E00; position: absolute; top: 5px; } /* ajax disconnected state */ .NGConnectFlash { float: left; width: 1px; height: 1px; background: #0A0; position: absolute; top: 10px; } /* flash connected state */ .NGDisconnectFlash { float: left; width: 1px; height: 1px; background: #E00; position: absolute; top: 10px; } /* flash disconnected state */ .gameBrand { position: relative; background: url('../images/header/head_background.jpg') no-repeat; height: 71px; border-bottom: 1px solid #ff5c07; } /* Height is a multiple of 18 (minus 1) */ .gameBrand h1 { width: 112px; height: 120px; display: block; background: url('../images/header/head_beijingLogo.png') no-repeat; text-indent: -9999px; position: absolute; top: -16px; left: 20px; } .gameBrand h3 { width: 79px; height: 59px; display: block; background: url('../images/header/head_cocacolaLogo.gif') no-repeat; text-indent: -9999px; position: absolute; top: 7px; left: 570px; } .gameBrand h3 a {width: 79px; height: 59px; display: block; background:transparent;text-indent:-9999px;overflow:hidden;} /* Utility Navigation */ .utilityNav { position: relative; margin-top: -18px; padding: 0 0 0 30px; float: right; background: #ffffff; filter: alpha(opacity=75); -moz-opacity: .75; opacity:.75; } .utilityNav ul { margin: 0; padding: 0; list-style: none; } .utilityNav ul li { display: inline; margin-right: 20px; } .utilityNav ul li a { text-decoration: none; color: #000; } .utilityNav ul li a:hover { text-decoration: underline; } /* Global navigation / tabs */ .globalNavArea { margin-bottom: 18px; background: url('../images/header/tab_background.png') repeat-x; } .globalNav { height: 35px; background: url('../images/header/tab_background.png') repeat-x; } .globalNav ul { margin: 0; padding: 0; list-style: none; position: relative; } .globalNav ul li { float: left; } .globalNav ul li a { text-decoration: none; color: #222; cursor: pointer; } .globalNav ul li a:hover { text-decoration: underline; } .globalNav ul li.TabPlay a { height: 35px; width: 65px; background: url('../images/header/tab_play_off.png') no-repeat; position: absolute; top: 0; left: 143px; display: block; text-indent: -9999px; z-index: 1; } .globalNav ul li.TabPlay a:hover { background: url('../images/header/tab_play_hover.png') no-repeat; z-index: 5;} .globalNav ul li.TabPlaySelected { height: 52px; width: 65px; background: url('../images/header/tab_play_on.png') no-repeat; position: absolute; top: 0; left: 143px; display: block; text-indent: -9999px; z-index: 10; } .globalNav ul li.TabGroupAdmin a { height: 35px; width: 109px; background: url('../images/header/tab_groups_off.png') no-repeat; position: absolute; top: 0; left: 200px; display: block; text-indent: -9999px; z-index: 1;} .globalNav ul li.TabGroupAdmin a:hover { background: url('../images/header/tab_groups_hover.png') no-repeat; z-index: 5;} .globalNav ul li.TabGroupAdminSelected { height: 52px; width: 109px; background: url('../images/header/tab_groups_on.png') no-repeat; position: absolute; top: 0; left: 200px; display: block; text-indent: -9999px; z-index: 10; } .globalNav ul li.TabLeader a { height: 35px; width: 136px; background: url('../images/header/tab_leaders_off.png') no-repeat; position: absolute; top: 0; left: 300px; display: block; text-indent: -9999px; z-index: 1; } .globalNav ul li.TabLeader a:hover { background: url('../images/header/tab_leaders_hover.png') no-repeat; z-index: 5; } .globalNav ul li.TabLeaderSelected { height: 52px; width: 136px; background: url('../images/header/tab_leaders_on.png') no-repeat; position: absolute; top: 0; left: 300px; display: block; text-indent: -9999px; z-index: 10; } .globalNav ul li.TabPrizes a { height: 35px; width: 75px; background: url('../images/header/tab_prizes_off.png') no-repeat; position: absolute; top: 0; left: 428px; display: block; text-indent: -9999px; z-index: 1; } .globalNav ul li.TabPrizes a:hover { background: url('../images/header/tab_prizes_hover.png') no-repeat; z-index: 5; } .globalNav ul li.TabPrizesSelected { height: 52px; width: 75px; background: url('../images/header/tab_prizes_on.png') no-repeat; position: absolute; top: 0; left: 428px; display: block; text-indent: -9999px; z-index: 10; } .globalNav ul li.TabSchedule a { height: 35px; width: 94px; background: url('../images/header/tab_schedule_off.png') no-repeat; position: absolute; top: 0; left: 499px; display: block; text-indent: -9999px; z-index: 1; } .globalNav ul li.TabSchedule a:hover { background: url('../images/header/tab_schedule_hover.png') no-repeat; z-index: 5; } .globalNav ul li.TabScheduleSelected { height: 52px; width: 94px; background: url('../images/header/tab_schedule_on.png') no-repeat; position: absolute; top: 0; left: 499px; display: block; text-indent: -9999px; z-index: 10; } /* Small Login / Welcome Message */ /* .loginCtrl { background: #eee; height: 35px; } .loginCtrl { position: relative; } .loginCtrl #username { position: relative; width: 110px; float:left; margin-right:7px; } .loginCtrl #password { position: relative; width: 110px; float:left; margin-right:7px; } .loginCtrl .overlabel { position: absolute; top: 16px; left: 0px; color: #999; font-weight: normal; } .loginCtrl .loginField { width: 110px; height: 15px; margin:0.2em 0.5em 0.5em 0; border:1px solid #bbb; background:#f6f6f6; padding:0px; } .loginCtrl .loginField:focus { border:1px solid #999; background:#fff; } .loginCtrl input.submit { width: 60px; height: 17px; margin:0.2em 0.5em 0.5em 0; background: #fff; border: 1px solid #bbb; } .welcomeCtrl { text-align: right; } */ .loginCtrl { margin: 0 0 0 40px; height: 35px; position: relative;} .loginCtrl #username { position: relative; top: 3px; left: 10px; width: 89px; float:left; } .loginCtrl #password { position: relative; top: 3px; left: 20px; width: 89px; float:left; } .loginCtrl #username label, .loginCtrl #password label { position: absolute; top: 13px; left: 1px; color: #fff; font-size: 11px; font-weight: normal; } .loginCtrl #username input, .loginCtrl #password input { font-size: 10px; width: 88px; margin:0 0 0 0; padding: 0 0 0 0; border:1px solid #ffa666; background:#f8f3b4; } .loginCtrl #username input:focus, .loginCtrl #password input:focus { border:1px solid #999; background:#fff; } .loginCtrl input.next { position: relative; top: 0px; left: 26px; width: 52px; height: 35px; float: left; background: url('../images/header/head_signin.gif') no-repeat; border: 0px solid #bbb; cursor: pointer; text-indent: -9999px; } .welcomeCtrl { text-align: right; height: 36px; } .welcomeCtrl p.welcomeBkg { margin: 0; padding: 0;} .welcomeCtrl .UserData { height: 35px; width: 200px; float: left; display: block; border-right: 1px solid #7c7c7c; position: relative; } .welcomeCtrl .Name { font-size: 14px; color: #ffffff; text-transform: uppercase; position: absolute; top: 0; right: 7px; } .welcomeCtrl .Rank { position: absolute; bottom: 0; right: 7px; } .welcomeCtrl .myRankTitle { color: #ffffff; font-size: 10px; left:0px} .welcomeCtrl .myRank { color: #ffffff; right:0px; } .welcomeCtrl .Points { color: #ffffff; font-size: 10px; } .welcomeCtrl #f_balance { margin: 0; padding: 0; height: 35px; overflow: hidden; line-height: 30px; font-size: 30px; font-weight: bold; color: #fff; } a.UpgradeAccount { width: 110px; height: 35px; display: block; float: left; margin-left: 50px; margin-top: -1px; background: url(../images/header/head_upgradeaccount.gif) no-repeat; text-indent: -9999px; cursor: pointer; } /* -------------------------------------------------------------- DIALOGUE STYLE BOXES -------------------------------------------------------------- */ /* Dialogue Style boxes - General Styles */ .dialogueHeader { text-transform: uppercase; color: #333; font-weight: bold; border-bottom: 1px solid #999; margin: 0px 0px 5px 0px; padding: 0px;} .dialogueSubhead { text-transform: uppercase; margin: 0; color: #333; } .closebtn { margin: 0px; padding: 0px; position: absolute; top: -15px; right: -15px; } .closebtn a { width: 29px; height: 29px; display: block; background: url(../images/global_btn_close.png) no-repeat; text-indent: -9999px; } .forgotpwdbtn { position: relative; top: -4px; margin: 0px; padding: 0px; } .forgotpwdbtn a { color: #666; text-decoration: none; font-size: .85em; } .forgotpwdbtn a:Hover { color: #000; text-decoration: underline; } p.or { height: 17px; margin: 0px; padding: 0px; background: url(../images/global_orient_or.gif) center no-repeat; text-indent: -9999px; } .fieldCorrect { margin: 0px; padding: 0px; position: absolute; bottom: 0px; right: -6px; width: 29px; height: 29px; display: block; background: url(../images/global_btn_correct.png) no-repeat; text-indent: -9999px; z-index: 1; } .fieldIncorrect { margin: 0px; padding: 0px; position: absolute; bottom: 0px; right: -6px; width: 29px; height: 29px; display: block; background: url(../images/global_btn_incorrect.png) no-repeat; text-indent: -9999px; z-index: 2; } .checkboxIncorrect { margin: 0px; padding: 0px; position: relative; top: -5px; left: 0; width: 29px; height: 29px; display: block; background: url(../images/global_btn_incorrect.png) no-repeat; text-indent: -9999px; z-index: 1; } .privacyPolicy { position: absolute; top: 10px; right: 10px; } .privacyPolicy a { color: #999; text-decoration: none; } .privacyPolicy a:hover { color: #000; text-decoration: underline; } .LoginDialogMatte { position:absolute; top:125px; left:0px; overflow:visible; display:none; width:100%; height:100%; z-index:100; background-image: url(../images/global_grayout.png); } .overlay { background-image: url(../images/global_grayout.png); } /* Forgot Password - dialogue style */ .forgotCtrl { padding: 0px 10px 0px 0px; margin-left: 0px; } /* Left is calculated at 40px a column */ .forgotCtrlOuter { padding: 10px 0 10px 10px; margin-left: -10px; border: 1px solid #bbb; background: url(../images/dialogue/dia_forgotBkg.gif) no-repeat; position: relative; top: 36px; left: 160px; } .lgForgotiFrame { background: url(../images/dialogue/dia_forgotBkg.gif) -10px -10px no-repeat; } .forgotInfo { color: #333; font-weight: normal; float: left; } #cmdForgotPassword { width: 446px; height: 22px; margin:0.2em 0.5em 0.5em -2px; border: none; } .forgotbtn { background: url(../images/global_btn_forgotpwd.png); } .forgotbtnhover { background: url(../images/global_btn_forgotpwd.png) 0 -23px;} /* Main Login / Registration control -- dialogue style */ .lgLoginCtrl { padding: 10px 0 10px 10px; margin-left: -10px; width: 330px; border: 1px solid #bbb; background: url(../images/dialogue/dia_signinBkg.gif) left bottom no-repeat; position: relative; top: 36px; left: 240px; } /* Left is calculated at 40px a column */ .lgLoginCtrl { background: url(../images/dialogue/dia_noflashBkg.gif) left bottom no-repeat; } /* Left is calculated at 40px a column */ .lgLoginiFrame { background: url(../images/dialogue/dia_signinBkg.gif) -10px -10px no-repeat; } form#lglogin { position: relative; } #username, #password { width: 150px; float:left; margin: 0; display: block; position: relative; } #password .fieldIncorrect { margin: 0px; padding: 0px; position: absolute; bottom: 5px; right: -6px; width: 29px; height: 29px; display: block; background: url(../images/global_btn_incorrect.png) no-repeat; text-indent: -9999px; z-index: 1; } #password .errorMsg { width: 130px; padding: 5px; margin: 0; display: block; background: url(../images/global_errorbox.png) top left no-repeat; position: absolute; bottom: 35px; right: -9px; font-size: .85em; line-height: 1.3em; z-index: 50; } #forgotpwdspacer, #forgotpwd { width: 150px; height: 12px; float:left; margin: 0; display: block; position: relative; } .overlabel { color: #333; font-weight: normal; } .lgLoginField { width: 130px; height: 15px; margin: 0 0 0.5em 0; } .lgLoginField { border:1px solid #bbb; background:#f6f6f6; padding:5px; } .lgLoginField:focus { border:1px solid #999; background:#fff; } .lgLoginCtrl .fieldCorrect { top: 3px; right: -6px; } .lgLoginCtrl .fieldIncorrect { top: 3px; right: -6px; } .errorMsg { width: 130px; padding: 5px; margin: 0; color: #666; display: block; background: url(../images/global_errorbox.png) top left no-repeat; position: absolute; bottom: 27px; right: -9px; font-size: .85em; line-height: 1.3em; z-index: 1; } .checkboxErrorMsg { width: 130px; padding: 5px; margin: 0; color: #666; display: block; background: url(../images/global_errorbox.png) top left no-repeat; position: absolute; bottom: 35px; left: -9px; font-size: .85em; line-height: 1.3em; z-index: 50; } .errorPointer { width: 140px; display: block; background: url(../images/global_errorpointer.png) bottom right no-repeat; position: absolute; bottom: -8px; right: 0px; font-size: .85em; line-height: 1.3em; z-index: 50; } .submitBtn { width: 314px; height: 22px; margin:0.2em 0.5em 0.5em -2px; border: none; background: url(../images/global_btn_signin.png); } .submitBtnHover { width: 314px; height: 22px; margin:0.2em 0.5em 0.5em -2px; border: none; background: url(../images/global_btn_signin.png) 0 -23px; } #butRegister { margin: 0.5em 0.5em 0 -2px; text-indent: -9999px; width: 314px; height: 22px; display: block; } .registerBtn { background: url(../images/global_btn_register.png); } .registerBtnHover { background: url(../images/global_btn_register.png) 0 -23px; } /* Registration */ .registrationCtrl { padding: 10px 0 10px 10px; margin-left: -10px; border: 1px solid #bbb; background: url(../images/dialogue/dia_upgradeBkg.gif) bottom left no-repeat; position: relative; top: 36px; left: 160px; } /* Left is calculated at 40px a column */ .registrationiFrame { background: url(../images/dialogue/dia_regBkg.gif) -10px -10px no-repeat; } .regDialogueHeader { text-transform: uppercase; color: #333; font-weight: bold; border-bottom: 1px solid #bbb; padding: 0; margin: 0; border: 0; } .infoBox { border: 1px solid #666; margin: 0 10px 0 0; position: relative; } .registrationSteps { border-bottom: 1px solid #666; position: relative; } .registrationSteps ul { list-style-type: none; margin: 0; padding: 0; } .registrationSteps ul li { font-size: .85em; line-height: 1.825em; float: left; border-right: 1px solid #333; position: relative; text-transform: uppercase; } .registrationSteps ul li a.active { padding: 3px 10px 3px 10px; text-decoration: none; background: url(../images/dialogue/tab_bkg_over.gif) repeat-x; color: #fff;} .registrationSteps ul li a.inactive { padding: 3px 10px 3px 10px; text-decoration: none; background: url(../images/dialogue/tab_bkg_off.gif) repeat-x; color: #fff;} .registrationSteps ul li a.completed { padding: 3px 10px 3px 10px; text-decoration: none; background: url(../images/dialogue/tab_bkg_over.gif) repeat-x; color: #fff;} .regformarea { padding: 10px; } .regLeftCol, .regRightCol { width: 214px; float:left; margin: 0; position: relative;} .rightRCol { margin-right: 0; } .regTwoCol { width: 428px; float:left; margin: 0; position: relative;} .regFieldReason { float: right; margin: 0 10px 0 0; padding: 0; color: #666; position: relative;} .regFieldReasonHover { float: right; margin: 0 10px 0 0; padding: 0; color: #000; position: relative;} .regFieldReason .reason { display: none; } .regFieldReasonHover .reason { float: none; width: 177px; height: 49px; padding: 8px 5px 0px 10px; margin: 0; display: block; background: url(../images/global_infobox.png) top left no-repeat; position: absolute; bottom: 3px; right: -8px; line-height: 1.3em; color: #fff; } .regOverlabel { color: #333; font-weight: normal; float: left; } .regField { width: 204px; height: 15px; margin: 0 0 0.5em 0 } .regField { border:1px solid #bbb; background:#f6f6f6; } .regField:focus { border:1px solid #999; background:#fff; } .checkBox { float: left; margin: 0 0.5em 0 0; } .checkBoxType { float: left; position: relative; color: #333; width: 220px; } .checkBoxTypeFull { float: left; position: relative; color: #333; width: 380px; } /* Z-Index adjustments for the errors */ #ConfirmPasswordRequired .fieldIncorrect { z-index: 53; } #ConfirmPasswordRequiredMessage .errorMsg { z-index: 52; } #DeclarationErrorContainer { float: left; } #DeclarationError { float: left; position: absolute; } #DeclarationError .checkboxIncorrect { z-index: 53; } #DeclarationErrorMessage { float: left; position: absolute; top: -55px; } #DeclarationErrorMessage .declareErrMsg { position: absolute; color: #666; left: -109px; width: 130px; padding: 5px; margin: 0; display: block; background: url(../images/global_errorbox.png) top left no-repeat; font-size: .85em; line-height: 1.3em; z-index: 52; } .regDay, .regMonth, .regYear { width: 68px; font-size: .85em; margin: 0 0 0.5em 0; height: 18px;} .regDropDown { font-size: .85em; margin: 0 0 0.5em 0; height: 18px;} #cmdOptionalInfo { width: 211px; height: 27px; margin: 0; border: none; position: absolute; bottom: -13px; right: 0px; } .continueTo2 { background: url(../images/global_btn_regstep2.png) 0 -27px no-repeat; } .continueTo2hover { background: url(../images/global_btn_regstep2.png) 0 -54px no-repeat; } .continueTo2Disabled { width: 211px; height: 27px; margin: 0; background: url(../images/global_btn_regstep2.png) 0 1px no-repeat; border: none; position: absolute; bottom: -13px; right: 0px; } #cmdCompleteRegistration { width: 211px; height: 27px; margin: 0; border: none; position: absolute; bottom: -13px; right: 0px; } .completeRegistration { background: url(../images/global_btn_regcomplete.png) 0 -27px no-repeat; } .completeRegistrationHover { background: url(../images/global_btn_regcomplete.png) 0 -54px no-repeat; } #cmdRegContinue { width: 220px; height: 22px; margin:0.2em 0.5em 0.5em -2px; border: none; } .regPersistNo { background: url(../images/global_btn_nothanks.png); } .regPersistNoHover { background: url(../images/global_btn_nothanks.png) 0 -23px; } #cmdRegRememberMe { width: 220px; height: 22px; margin:0.2em 0.5em 0.5em -2px; border: none; } .regPersistYes { background: url(../images/global_btn_yesplease.png); } .regPersistYesHover { background: url(../images/global_btn_yesplease.png) 0 -23px; } /* Invite a friend */ .inviteCtrl { padding: 10px; border: 1px solid #bbb; background: url(../images/dialogue/dia_inviteBkg.gif); position: relative; top: 36px; left: 200px; } /* Left is calculated at 40px a column */ .inviteCtrl .separator { float: left; position: relative; top: 8px; height: 15px; width: 100%; border-top: 1px solid #999; margin:0; } .inviteCtrl .userInput { width: 100%; float:left; margin: 0; position: relative;} .inviteCtrl .fieldIncorrect { bottom: 3px; right: 8px; z-index: 9998;} .inviteCtrl .errorMsg { bottom: 30px; right: 6px; z-index: 9999; } .inviteCtrl .friendEmail { width: 361px; margin:0.5em 0.5em 0.5em 0; border:1px solid #bbb; background:#f6f6f6; padding:2px; } .inviteCtrl .friendEmail:focus { border:1px solid #999; background:#fff; } .inviteCtrl .overlabel { color: #333; font-weight: normal; float: left; } .inviteCtrl .inviteBtn { margin: 0.5em auto 0.5em auto; text-indent: -9999px; } .inviteCtrl .inviteBtn a { width: 356px; height: 22px; display: block; background: url(../images/global_btn_invitefriends.png); } .inviteCtrl .inviteBtn a:hover { background: url(../images/global_btn_invitefriends.png) 0 -23px; } .inviteCtrl textarea { width: 355px; height: 75px; } .inviteCtrl .fieldIncorrectArea { margin: 0px; padding: 0px; position: absolute; bottom: 65px; right: 8px; width: 29px; height: 29px; display: block; background: url(../images/global_btn_incorrect.png) no-repeat; text-indent: -9999px; z-index: 9998; } .inviteCtrl .errorMsgArea { color: #666; width: 130px; padding: 5px; margin: 0; display: block; bottom: 93px; right: 6px; background: url(../images/global_errorbox.png) top left no-repeat; position: absolute; font-size: .85em; line-height: 1.3em; z-index: 9998; } /* -------------------------------------------------------------- GROUP PLAY AREA -------------------------------------------------------------- */ .groupLoggedout { height: 370px; position: relative;background: transparent url(../images/groupBG.png) top left no-repeat; padding-right:322px;margin-left:140px;padding-top:20px;} .groupSidebar { padding: 10px; float: right; } .groupSidebar .signinBtns { position: absolute; bottom: 10px; right: 10px; } #GroupPlaySigninBtn { margin: 0px; padding:0;text-transform: uppercase; cursor: pointer; display:block; background:transparent url(../images/groupLoginBtn.png) top left no-repeat;text-indent:-9999px;width:269px;height:51px;} #GroupPlaySigninBtn.anonButton { margin: 0px; padding:0;text-transform: uppercase; cursor: pointer; display:block; background:transparent url(../images/anonLoginBtn.png) top left no-repeat;text-indent:-9999px;width:269px;height:51px;} .groupSidebar .signinBtns p.signin { color: #000088; } .groupSidebar .signinBtns p.signinHover { background: #666; color: #fff; } .groupsNoGroups { text-transform: uppercase; } .contentContainer { } .sectionHeader { text-transform: uppercase; border-bottom: 1px solid #666; margin-top: 18px; color: #666; } #groupadmin { float: left; width: 320px; } #groupContainer { float: left; width: 308px; } #groupContainer .groupLoading { float: left; width: 31px; height: 31px; background: url('../images/intloader.gif') no-repeat; } #offlineleaders { float: left; } .groupListArea { border: 1px solid #ccc; float: left; margin: 0 8px 0 0; background: #fff; } .groupListArea .groupListHeader { padding: 0 10px; background: #ccc; text-transform: uppercase; margin: 0;} .groupListArea ul { list-style-type: none; margin: 0; padding: 0; } .groupListArea ul li { border-top: 1px dotted #ccc; padding: 0 10px; font-size: .85em; height: 1.75em; position: relative; cursor: pointer; } .groupListArea ul li.first { } .groupListArea ul li.firstHover { background-color: #EEEEEE; } .groupListArea ul li.firstHover .remove A { display: block; } .groupListArea ul li .viewing { margin: 0px; padding: 0px; position: absolute; top: -5px; right: -19px; width: 29px; height: 29px; display: block; background: url(../images/global_btn_arrow.png) 0 -1px no-repeat; text-indent: -9999px; z-index: 1; } .groupListArea ul li .remove { margin: 0px; padding: 0px; position: absolute; top: -6px; left: -15px; } .groupListArea ul li .remove a { width: 29px; height: 29px; display: none; background: url(../images/global_btn_close.png) no-repeat; text-indent: -9999px; } .groupListArea ul li.selected { background: #eee; } .groupListArea ul li.selectedHover { background: #eee; } .groupListArea ul li.selected .remove A { display: block; } .groupListArea ul li.selectedHover .remove A { display: block; } #GroupPlayAddNew { padding: 5px 10px 0 28px; } .groupListArea ul li.addNew { background: url(../images/global_btn_add.png) 0 -3px no-repeat; } .groupListArea ul li.addNewHover { background: url(../images/global_btn_add.png) 0 -31px no-repeat #eee; } .groupLeaders { /* this was the original name, changed for implementation */ } #offlineleaders { float: left; background: #FFF; margin: 0 8px 0 0; width: 312px; } #offlineleaders table { width: 312px; border: 1px solid #bbb; border-bottom: none; margin: 0; padding: 0; } #offlineleaders table thead { padding: 0 10px; background: #ccc; text-transform: uppercase; } #offlineleaders table th { padding: .25em 0px 0 10px; margin: 0; font-size: .85em; } #offlineleaders table td { padding: .25em 0px 0 10px; margin: 0; font-size: .85em; border-top: 1px dotted #ccc; border-bottom: none; } #offlineleaders table td.first { } #offlineleaders .addFriendTable { width: 312px; height: 23px; border: 1px solid #bbb; border-top: none; background: none; margin: 0px; padding: 0px; } #offlineleaders table td.addFriend { padding: 5px 10px 2px 28px; text-transform: uppercase; background: url(../images/global_btn_add.png) 0 -3px no-repeat; } #offlineleaders table td.addFriendHover { padding: 5px 10px 2px 28px; text-transform: uppercase; background: url(../images/global_btn_add.png) 0 -31px no-repeat #eee; cursor: pointer; } .groupInvite { float: left; width: 360px; padding: 10px; color: #333; background: url(../images/groups/offlineLeaderBoardList_bkg.gif) left bottom no-repeat; border: 1px solid #bbb; position: relative; } .groupInvite .friendEmail { width: 340px; border:1px solid #bbb; background:#f6f6f6; padding:5px; } .groupInvite .friendEmail:focus { border: 1px solid #999; background:#fff; } .groupInvite textarea { width: 340px; height: 75px; } .groupInvite .overlabel { color: #333; font-weight: normal; float: left; } .groupInvite .fieldIncorrect { position: absolute; bottom: 12px; left: 350px; } .groupInvite .errorMsg { bottom: 41px; left: 242px; } #GroupPlayInviteBtn { margin: 0.5em auto 0.5em auto; text-indent: -9999px; width: 356px; height: 22px; } .groupInvite .inviteBtn { background: url(../images/global_btn_invitefriends.png); } .groupInvite .inviteBtnHover { background: url(../images/global_btn_invitefriends.png) 0 -23px; } .addNewCtrl { padding: 10px; width: 290px; background: url(../images/groups/groupsList_bg.gif) left bottom no-repeat; position: relative; top: 0px; left: 0px; } /* Left is calculated at 40px a column */ .addNewCtrl .leftCol, .addNewCtrl .rightCol { width: 140px; float:left; margin: 0 10px 0 0; position: relative; } .addNewCtrl .rightCol { margin-right: 0; } .addNewCtrl .overlabel { color: #333; font-weight: normal; float: left; } .addNewCtrl .loginField { width: 136px; margin: 0 0.5em 0.5em 0 } .addNewCtrl .loginField { border:1px solid #bbb; background:#f6f6f6; padding:2px; } .addNewCtrl .loginField:focus { border:1px solid #999; background:#fff; } .addNewCtrl .lgpulldown { width: 136px; font-size: .85em; margin: 0 0 0.5em 0; height: 18px;} #GroupPlayJoinBtn { margin: 0.5em 0.5em 0.5em -2px; text-indent: -9999px; width: 290px; height: 22px; } .addNewCtrl .joinBtn { background: url(../images/global_btn_joingroup.png); } .addNewCtrl .joinBtnHover { background: url(../images/global_btn_joingroup.png) 0 -23px; } .addNewCtrl p.or { margin-bottom: .5em; } .addNewCtrl .regFieldReason { margin-right: 0; } .addNewCtrl .regFieldReasonHover { margin-right: 0; } #GroupPlayCreateBtn { margin: 0.5em 0.5em 0.5em -2px; text-indent: -9999px; width: 290px; height: 22px; } .addNewCtrl .createBtn { background: url(../images/global_btn_creategroup.png); } .addNewCtrl .createBtnHover { background: url(../images/global_btn_creategroup.png) 0 -23px; } /* -------------------------------------------------------------- OFFLINE LEADER BOARDS -------------------------------------------------------------- */ .leaderboard { width: 188px; border: 1px solid #ccc; } /* -------------------------------------------------------------- FOOTER -------------------------------------------------------------- */ .footer { margin: 0; border-top: 1px solid #9f7471;border-bottom: 1px solid #9f7471; /* background: #ccc; */ } .footerBody { font-size: .8333em; line-height: 1.44em; margin-top: 0.28em; } .footerBody .copyright { float: right; } .footerBody .trademarks { } /* -------------------------------------------------------------- RULES -------------------------------------------------------------- */ ul.rulesSubnav { margin: 0 0 1.5em 0; padding: 0; list-style-type: none; } ul.rulesSubnav li { display: inline; padding: 0px 1em; border-left: 1px solid #ccc; } ul.rulesSubnav li.first { border: none; padding: 0 1em 0 0; } ul.rulesSubnav li a { color: #666; text-decoration: none; } ul.rulesSubnav li a:hover { color: #000; } .subhead { border-bottom: 1px solid #666; } /* -------------------------------------------------------------- FAQs -------------------------------------------------------------- */ ul.faqSubnav { margin: 0 0 1.5em 1.5em; padding: 0; } ul.faqSubnav li { padding: 0px; } ul.faqSubnav li.first { border: none; padding: 0 1em 0 0; } ul.faqSubnav li a { color: #666; text-decoration: none; } ul.faqSubnav li a:hover { color: #000; } .faq_exOpen { width: 51px; height: 16px; margin: 0 4px; display: inline-block; display: -moz-inline-stack; background: url(../images/faq_indicator_open.gif); } .faq_exNew { width: 51px; height: 16px; margin: 0 4px; display: inline-block; display: -moz-inline-stack; background: url(../images/faq_indicator_new.gif); } .faq_exTopOpen { width: 16px; height: 16px; margin: 0 0px; display: inline-block; display: -moz-inline-stack; background: url(../images/faq_stillopen.gif); } /* -------------------------------------------------------------- GENERAL STYLES -------------------------------------------------------------- */ .messageArea { margin: 0 0 1.5em 0; padding: 8px 15px 9px 15px; background: #ccc; text-transform: uppercase; } /* -------------------------------------------------------------- PLAY TAB -------------------------------------------------------------- */ .loadingpage { } /* A specific loading background could be placed in here */ .loadingtext { width: 300px; text-align: center; margin: 150px auto 0 auto; font-family: helvetica, arial, sans-serif; text-transform: uppercase; font-size: 10px; } .loadingimage { width: 31px; height: 31px; display: block; text-indent: -9999px; background: url('http://hive.cachefly.net/Default/images/intloader.gif'); margin: 10px auto 0 auto; } .playLoggedout { background: #abc; } .playHowTo { height: 270px; } .playHowTo h4 { text-indent:-9999px;height: 69px; width:768px; background: transparent url(../images/landingHeader.jpg) top left no-repeat; margin:9px 0px 0px 32px;} .playSidebar { width:225px; height:86px; position:absolute; top:22px; right:143px; } .playSidebar h3 { text-indent:-9999px; margin:0; background: transparent url(../images/playNowTitle.png) top left no-repeat; width:225px; height:35px;} .playSidebar .signinBtns { position: relative; } #PlayTabSigninBtn { height:22px; width:225px;display:block; cursor: pointer; color:#fff; margin:0px 0px 0px 0px;} .playSidebar .signinBtns p.signinBtn { text-indent:-9999px; background: transparent url(../images/signinBtn.png) 0px 0px no-repeat; width:225px; height:22px;} .playSidebar .signinBtns p.signinBtnHover { text-indent:-9999px;background: transparent url(../images/signinBtn.png) 0px -22px no-repeat; width:225px; height:22px;} .playSidebar .signinBtns p.anonymous { text-indent:-9999px;display:block;width:225px;height:29px;margin:0px 0px 0px 0px;} .playSidebar .signinBtns p.anonymous a { text-indent:-9999px;display:block;width:225px;height:29px;background:transparent url(../images/anonBtn.png) 0px 0px no-repeat;} .playSidebar .signinBtns p.anonymous a:hover { text-indent:-9999px;display:block;width:225px;height:29px;background:transparent url(../images/anonBtn.png) 0px -29px no-repeat;} .embeddedMovie {background:transparent url(../images/movieTemp.jpg) 2px 3px no-repeat; width:663px; height:279px;position:absolute; top:78px; left:144px;} .sideBarEvents {width:113px; height:409px; position:absolute; top:44px; left:29px;} #playLoggedOut .sideBarEvents {width:113px; height:409px; position:absolute; top:89px; left:33px;} .scheduleArea { padding: 5px; } .playPrizes { background: transparent url(../images/prizes.png) top left no-repeat; height: 276px;width:656px; position:absolute; top:372px; left:148px; } .PlayContentOff {height:1px; float:left; overflow:hidden; position:absolute;} .PlayContentOn {float:left; z-index:2; position:relative;} .GameDivOn {position:relative; top:-18px;} .GameDivOff {position:absolute;} .FirefoxGameDivOn {position:relative; top:-18px;} .FirefoxGameDivOff {position:relative;} .sampleContent { border: 1px solid #ccc; height: 500px; display: block; } /******************************************************************************/ /* Advertising Styles */ /* - All ads have an outer DIV with an IFRAME inside */ /* - the main style (id) belongs to the DIV */ /******************************************************************************/ #top_ad { float: left; width: 228px; height: 54px; position: absolute; right: 45px; top: 1px; } #top_ad IFRAME { width: 228px; height: 54px; } #tower_ad { border:1px solid; float: left; width: 120px; height: 600px; position: absolute; top: 48px; } #tower_ad IFRAME { width: 120px; height: 600px; } /******************************************************************************/ /* END OF Advertising Styles /******************************************************************************/ /******************************************************************************/ /* beginning of schedule styles /******************************************************************************/ #TabGroupAdminContent { position:relative; padding:15px 50px 295px 32px; background: transparent url(../images/footer.jpg) bottom left no-repeat; width:868px; min-height:450px; height:auto !important; height:450px; } selector { min-height:500px; height:auto !important; height:500px; } #TabScheduleContent, #TabLeaderContent { position:relative; padding:15px 146px 195px 32px; background: transparent url(../images/footer.jpg) bottom left no-repeat; width:772px; } #TabPrizesContent { position:relative; padding:15px 32px 195px 32px; background: transparent url(../images/footer.jpg) bottom left no-repeat; width:886px; } #TabGroupAdminContent:after, #TabScheduleContent:after, #TabLeaderContent:after, #TabPrizesContent:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #curEventArea .sideBarEvents { position:relative; background:none; top:0; float:left; left:0; margin-top:9px; height:auto; } #TabScheduleContent .sideBarEvents { position:relative; background:none; top:0; float:left; left:0; margin-top:18px; height:auto; } #TabGroupAdminContent .sideBarEvents { position:absolute; top:90px; left:32px; } .sideBarEvents dd, .sideBarEvents dt, .sideBarEvents dl { margin:0; } #TabScheduleContent dl dt#tonightsEvents {display:none;} #TabScheduleContent h3.sectionHeader { display:block; background:transparent url(../images/schedule/scheduleTitle-bg.png) 0px 0px no-repeat; text-indent:-9999px; border-bottom:4px solid black; margin:20px 0 0 0; height:22px;} #TabScheduleContent h4.subhead { display:block; background:transparent url(../images/schedule/scheduleSubTitle-bg.png) 0px 4px no-repeat; text-indent:-9999px; border-bottom:1px solid black; margin:0; height:18px;} #TabLeaderContent { height:630px; background:transparent url(../images/footer.jpg) bottom left no-repeat; } #TabLeaderContent a { color:#000; font-weight:bold; } #TabLeaderContent a:hover { color:#777; font-weight:bold; } #TabGroupAdminContent h3.sectionHeader { display:block; background:transparent url(../images/groupsTitle-bg.png) 0px 0px no-repeat; text-indent:-9999px; border-bottom:4px solid black; margin:20px 0 0 0; height:22px;} #TabGroupAdminContent h4.subhead { display:block; background:transparent url(../images/groupsSubTitle-bg.png) 0px 0px no-repeat; text-indent:-9999px; border-bottom:1px solid black; margin:0; height:18px;} #TabLeaderContent h3.sectionHeader { display:block; background:transparent url(../images/leaderTitle-bg.png) 0px 0px no-repeat; text-indent:-9999px; border-bottom:4px solid black; margin:20px 0 0 0; height:22px;} #TabLeaderContent h4.subhead { display:block; background:transparent url(../images/leaderSubTitle-bg.png) 0px 0px no-repeat; text-indent:-9999px; border-bottom:1px solid black; margin:0; height:18px;} #TabPrizesContent h3.sectionHeader { display:block; background:transparent url(../images/prizesTitle-bg.png) 0px 0px no-repeat; text-indent:-9999px; border-bottom:4px solid black; margin:20px 0 0 0; height:22px;} #TabPrizesContent h4.subhead { display:block; background:transparent url(../images/prizesSubTitle-bg.png) 0px 0px no-repeat; text-indent:-9999px; border-bottom:1px solid black; margin:0; height:18px;margin-bottom:20px;} .leaderboardRecent { width:266px; float:left; margin-top:10px; } .dayHolder { width:484px; float:left; padding-left:22px; } .dayHolder div { margin-top:10px; float:left; margin-bottom:10px; width:121px; } #TabGroupAdminContent #groupHeader h3.sectionInnerHeader { border-bottom:4px solid black; color:#000; margin-top:16px; text-indent:0px; } #eventsSchedule { width:630px; height:360px; border-right:1px solid #dddcd7; border-bottom:1px solid #dddcd7; margin:20px 0 20px 0px; float:right; } #eventsSchedule li { float:left; width:90px; height:90px; list-style:none; margin:0; } #eventsSchedule li h5 { margin:0; height:0; overflow:hidden; text-indent:-9999px; } #eventsSchedule li.title { width:450px; height:90px; background: transparent url(../images/schedule/title.png) top left no-repeat;} #eventsSchedule li.end { width:540px; height:90px; background: transparent url(../images/schedule/end.png) top left no-repeat;} .prizesSideBar { text-align:right;} .prizesSideBar img {margin:10px -4px 20px 0;}