/** * Atmosphir Main CSS * @author Andres Pagella * @version 1.0 */ html { height: 100%; } /* Force 100% height, even when there's no content */ html > body { font-family: Lucida Grande, Arial, Tahoma, sans-serif; font-size: 12px; } body { background: #E8E8E8; margin: 0px; padding: 0px } a { text-decoration: none; } a:hover { text-decoration: underline; } img { border: 0px; } /* Miscelaneous objects */ .flr { float: right; } .fll { float: left; } .clb { clear: both; } .tal { text-align: left; } .tac { text-align: center; } .tar { text-align: right; } .dn { display: none; } .errorField { background-color: #F5EE98; border: 2px solid #CC0000; } .errorText { font-size: 12px; font-weight: bold; color: #CC0000; } .errorTextMe { font-size: 12px; color: #CC0000; } .textbox { border: 1px solid #ADAAAA; padding: 2px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .button { border: 1px solid #94B5C5; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #BCDDED url(../i/bgdialog.gif) repeat-x top left; font-size: 11px; font-weight: bold; color: #111F2C; padding: 5px; } .button:hover { background: #E4F5FE; color: #284A66; } .button:active { background-color: #94B5C5; background-image: none; color: #666; } .submit { border: 1px solid #115F85; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #1D8AC1 url(../i/submit.gif) repeat-x top left; font-size: 11px; font-weight: bold; color: #F2F2F2; padding: 5px; } .submit:hover { border: 1px solid #000; color: #FFFFFF; } .submit:active { background-color: #115F85; background-image: none; color: #CCC; } .globalNotification { color: #FFF; font-size: 12px; padding: 10px; margin: 10px; margin-bottom: 0px; text-align: left; background-color: #A01818; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } .newPM { background-color: #DBEEF2; } .newPM div { font-weight: bold; } .round { -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } .moderated { width: 100px; font-size: 10px; text-align: center; color: #5D9FBA; font-style: bold; } #section { width: 100%; /* background: transparent url(../i/sideImg.png) no-repeat center 250px; */ } #skybg { background: #044D7A url(../i/bg.gif) repeat top left; margin: 0px; padding: 0px; } /* Used by the play page, check templates/play.jsp */ /******* Header (GLOBAL) *******/ #header { margin: 0px auto 0px auto; width: 900px; background: transparent url(../i/header-characters.png) no-repeat 310px 9px; height: 90px; position: relative; } #header .logo { position: relative; left: 0px; top: 12px; } #header .logo > div { text-align: right; position: absolute; width: 23%; left: 65px; top: 44px; font-size: 11px; color: #505050;} #header .logo > div span { font-weight: bold; } #header .logo .header-search { position: absolute; left: 632px; top: 0px; width: 270px;} #header .logo .header-search .search { margin: 17px 5px 5px 5px; } #header .logo .header-search .search div.search-box { width: 180px; background-color: #CCC; float: left; height: 24px; } #header .logo .header-search .search div.search-box input { width: 180px; background-color: #FFF; float: left; border: 1px solid #AAA; height: 27px; font-size: 14px; } #header .logo .header-search .search div.search-button { width: 77px; float: right; padding-top: 0px;} #header .logo .header-search .levels { padding-right: 8px;} /* Header (PLAY PAGE) */ #section.play #header { background-image: none; height: auto; } #section.play #header .phrase { font-size: 11px; color: #CCC; float: left; width: 500px; padding-top: 15px; } /******* Tab Bar (GLOBAL ) *******/ #bodyShadow .navigation-background { background-color: #A3A3A3; height: 55px; position: relative; } #bodyShadow ul.navigation { margin-bottom: 0px ;padding: 0px; list-style: none; position: absolute; bottom: 8px; left: 17px; } #bodyShadow ul.navigation li {margin-right: 5px; display: inline; border-top-right-radius: 5px; border-top-left-radius: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-topleft: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-top-left-radius: 5px; background: #E0E3E5 url(../i/tab-bg.png) repeat-x bottom left; padding: 10px; padding-top: 15px; padding-left: 45px; cursor: pointer; } #bodyShadow ul.navigation li a { color: #5C9AC1; font-family: Arial, Tahoma, sans-serif; font-size: 20px; text-decoration: none; letter-spacing: -1px; font-weight: bold; text-shadow: 0.0em 0.0em 0.1em #CCC; position: relative; } #bodyShadow ul.navigation li a img { position: absolute; left: -38px; top: -2px; opacity: 0.6; filter:alpha (opacity = 60); border: 0px; } #bodyShadow ul.navigation li:hover { background-color: #E0E3E5 } #bodyShadow ul.navigation li:hover a { color: #3981B5; } #bodyShadow ul.navigation li:hover a img { opacity: 0.8; filter:alpha (opacity = 80); } #bodyShadow ul.navigation li.active { background: #F5F9FB url()} #bodyShadow ul.navigation li.active a { color: #3981B5; text-shadow: none; } #bodyShadow ul.navigation li.active a img { opacity: 1.0; filter:alpha (opacity = 100); } /* Unique to each section */ #bodyShadow ul.navigation #section-store { background-color: #E78922; } #bodyShadow ul.navigation #section-store a { color: #F8F9CC; text-shadow: 0.0em 0.0em 0.1em #EEBD88; } #bodyShadow .navigation-background-play { background-color: #A3A3A3; height: 45px; position: relative; } #bodyShadow ul.play { margin-bottom: 2px ;padding: 0px; list-style: none; position: absolute; bottom: 8px; left: 17px; } #bodyShadow ul.navigation li.play {margin-right: 5px; display: inline; border-top-right-radius: 5px; border-top-left-radius: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-topleft: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-top-left-radius: 5px; background: #E0E3E5 url(../i/tab-bg.png) repeat-x bottom left; padding: 10px; padding-left: 15px; cursor: pointer; } #bodyShadow ul.navigation li a.play { color: #5C9AC1; font-family: Arial, Tahoma, sans-serif; font-size: 14px; text-decoration: none; letter-spacing: -1px; font-weight: bold; text-shadow: 0.0em 0.0em 0.1em #CCC; position: relative; } #bodyShadow ul.navigation li.selected { background-color: #0165A3 } #bodyShadow ul.navigation li a.selected { color: #FFFFFF } /******* Footer (GLOBAL) *******/ #footer { font-family: Arial, Tahoma, sans-serif; font-size: 11px; } #footer p { color: #AAA; text-align: center; } #footer p a { color: #1C83B7; text-decoration: none; } #footer p a:hover { text-decoration: underline; } #footer p.legal, #footer p.copyright { padding-top: 10px; } /******* Columns and content disposition ******/ #bodyShadow { width: 900px; padding: 0px; margin: 0px auto 0px auto; box-shadow: 0px 5px 10px #999; border-radius-bottomright: 10px; border-radius-bottomleft: 10px; -moz-box-shadow: 0px 5px 10px #999; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; -webkit-box-shadow: 0px 5px 10px #999; -webkit-border-radius: 10px; border-right: 1px solid #AAA; border-bottom: 1px solid #AAA; } #contentArea { background-color: #BDC0C1; width: 900px; margin: 0px auto 0px auto; overflow: hidden; } #contentArea #left-column { float: left; width: 640px;} #contentArea #right-column { float: right; width: 260px;} #contentArea #left-column .left { background-color: #F5F9FB; border-right: 4px solid #7A7C7D; border-top: 0px solid white; border-bottom: 0px solid #CCC; border-left; 1px solid white; min-height: 388px; min-height: 660px;} #contentArea #left-column .left .placeholder-left { float: left; min-height: 560px; width: 300px; padding-left: 10px; border-right: 1px solid #CCC; } #contentArea #left-column .left .placeholder-right { float: right; width: 290px; } /* Module title is the blue bg and white text used as a title in most modules */ #contentArea .module-title div { background: transparent url(../i/module-title-bg.png) no-repeat top left; height: 24px; } #contentArea .module-title div.module-title-left { float: left; width: 235px; } #contentArea .module-title div.module-title-left h3 { text-align: left; padding: 5px; margin: 0px; text-transform: uppercase; font-weight: bold; font-size: 12px; color: #FFF; letter-spacing: 1px; } #contentArea .module-title div.module-title-left h3 a { color: white; text-decoration: underline; } #contentArea .module-title div.module-title-right { background-position: top right; float: right; width: 5px; position: relative; } #contentArea .module-title div.clb { height: 0px; background: none; } #contentArea .module-title div.module-title-right .char-icon { background-color: transparent; background-image: url(../i/character-sprite.png); height: 30px; width: 60px; position: absolute; right: 2px; bottom: 0px; z-index: 2; } /* Module title 2 is the gray bg and white text used as a title in most modules in the new homepage design */ #contentArea .module-title-2 { background: #B8B8B8; height: 24px; z-index: 1; -moz-border-radius: 5px; -webkit-border-radius: 5px; o-border-radius: 5px; border-radius: 5px; } #contentArea .module-title-2 div.module-title-left h3 { text-align: left; padding: 5px; margin: 0px; text-transform: uppercase; font-weight: bold; font-size: 12px; color: #FFF; letter-spacing: 1px; } #contentArea .module-title-2 div.module-title-left { float: left; width: 235px; } #contentArea .module-title-2 div.module-title-left h3 a { color: #1D82BA; text-decoration: none; } #contentArea .module-title-2 div.module-title-left h3 a:hover { text-decoration: underline; } #contentArea .module-title-2 div.module-title-right { background-position: top right; float: right; width: 5px; position: relative; } #contentArea .module-title-2 div.clb { height: 0px; background: none; } #contentArea .module-title-2 div.module-title-right .char-icon { background-color: transparent; background-image: url(../i/character-sprite.png); height: 30px; width: 60px; position: absolute; right: 2px; bottom: 0px; z-index: 2; } /* Module title 3 is the white bg / black letters shown in most homepage modules */ #contentArea .module-title-3 div { border-bottom: 1px solid #CCC; padding-bottom: 5px; margin-bottom: 5px; height: 24px; z-index: 1; } #contentArea .module-title-3 div.module-title-left h3 { text-align: left; padding: 5px; margin: 0px; letter-spacing: -1px; font-weight: bold; font-size: 16px; color: #000; letter-spacing: 1px; } #contentArea .module-title-3 div.module-title-left { float: left; width: 235px; } #contentArea .module-title-3 div.module-title-left h3 a { color: #1D82BA; text-decoration: none; } #contentArea .module-title-3 div.module-title-left h3 a:hover { text-decoration: underline; } #contentArea .module-title-3 div.module-title-right { background-position: top right; float: right; width: 5px; position: relative; } #contentArea .module-title-3 div.clb { height: 0px; background: none; } #contentArea .module-title-3 div.module-title-right .char-icon { background-color: transparent; background-image: url(../i/character-sprite.png); height: 30px; width: 60px; position: absolute; right: 2px; bottom: 0px; z-index: 2; } /* Left column */ #contentArea #left-column .left .inner a { color: #1D83B4; font-weight: bold; } #contentArea #left-column .left .inner a:hover { text-decoration: underline; } /* LEFT COLUMN HIGHLIGHT: Top-Body tabs */ #contentArea #left-column .top-body-tabs { padding-bottom: 0px; background: #B3B6B7 url(../i/tabs/bg.gif) repeat-x bottom left; height: 60px; border-right: 4px solid #7A7C7D; } #contentArea #left-column .top-body-tabs .top-body-tabs-left { float: left; width: 340px; } #contentArea #left-column .top-body-tabs .top-body-tabs-left div { padding-left: 10px; padding-top: 10px; } #contentArea #left-column .top-body-tabs .top-body-tabs-right { float: right; width: 290px; overflow: hidden; } #contentArea #left-column .top-body-tabs .top-body-tabs-right div.txt { color: #636667; font-size: 11px; text-align: right; padding-top: 9px; padding-bottom: 5px; padding-right: 10px; } /* LEFT COLUMN HIGHLIGHT: Home Design top */ #contentArea #left-column .left .home-design-top { padding-top: 10px; background: transparent url(/atmosphir/r/i/design-top-bg.jpg) no-repeat bottom right; width: 611px; margin: 0px auto 0px auto; } /* LEFT COLUMN HIGHLIGHT: Home Design Video */ #contentArea #left-column .left .home-design-video { padding: 0px 10px 0px 10px; } #contentArea #left-column .left .home-design-video .module-title-2 { margin-bottom: 10px; } #contentArea #left-column .left .home-design-video .module-title-2 div.module-title-left { width: 611px; } /* LEFT COLUMN HIGHLIGHT: Top Search Bar */ #contentArea #left-column .top-search-bar { padding-bottom: 0px; background: #000 url(../i/bgHomepageTop.gif); height: 60px; } #contentArea #left-column .top-search-bar .top-search-bar-left { padding: 10px; float: left; width: 450px; } #contentArea #left-column .top-search-bar .top-search-bar-left input { width: 200px; padding: 5px; font-size: 13px; color: black; border: none; } #contentArea #left-column .top-search-bar .top-search-bar-right { padding: 10px; float: right; width: 150px; color: white; font-size: 12px; text-align: right; } /* LEFT COLUMN: Feature Spotlight Module: AKA 'Switcher' */ #contentArea #left-column .left .feature-spotlight { padding: 10px 10px 0px 10px; } #contentArea #left-column .left .feature-spotlight .module-title div.module-title-left { width: 611px; } #contentArea #left-column .left .feature-spotlight .module-title div.module-title-right .char-icon { background-position: 0px -30px; } /* LEFT COLUMN: Slideshow */ #contentArea #left-column .left .slide table { width: 100%; } #contentArea #left-column .left .slide table tr td.arrow { height: 100%; text-align: center; width: 60px; } #contentArea #left-column .left .slide table tr td.arrow img { cursor: pointer; } #contentArea #left-column .left .slide table tr td.picture { text-align: center; width: 150px; height: 185px; } #contentArea #left-column .left .slide table tr td.picture .picture-placeholder { width: 150px; height: 185px; margin: 0px 0px 0px 0px; overflow: hidden} #contentArea #left-column .left .slide table tr td.picture .picture-placeholder .pic { width: 150px; height: 185px; border: 0px;} /* LEFT COLUMN HIGHLIGHT: Search Results Module */ #contentArea #left-column .search-highlight { padding: 10px; padding-bottom: 0px; background-color: black; } #contentArea #left-column .search-highlight .module-title div.module-title-left { width: 615px; } #contentArea #left-column .search-highlight .module-title div.module-title-right .char-icon { background-position: -60px -120px; } #contentArea #left-column .search-highlight .search-highlight-input { width: 300px; margin: 0px auto 0px auto; text-align: center; margin-top: 30px; margin-bottom: 30px; } #contentArea #left-column .search-highlight .search-highlight-input input { width: 215px; padding: 6px; border: 1px solid #FFF; font-size: 12px; } #contentArea #left-column .search-highlight .search-highlight-tabs { margin-left: 20px; } #contentArea #left-column .search-highlight .search-highlight-tabs ul { list-style: none; margin: 0px; padding: 0px; } #contentArea #left-column .search-highlight .search-highlight-tabs ul li { cursor: pointer; margin: 0px; margin-right: 10px; padding: 0px; padding-left: 7px; display: inline; height: 30px; width: 180px; background: #464849 url(../i/tab-sprite.gif) no-repeat top left; } #contentArea #left-column .search-highlight .search-highlight-tabs ul li p { text-align: center; font-size: 12px; padding: 0px; padding-top: 7px; margin: 0px; font-weight: bold; background: transparent url(../i/tab-sprite.gif) no-repeat top right; color: white; } #contentArea #left-column .search-highlight .search-highlight-tabs ul li.active { background-position: 0px -30px; } #contentArea #left-column .search-highlight .search-highlight-tabs ul li.active p { background-position: 100% -30px; color: black; } /* LEFT COLUMN HIGHLIGHT: Level Identity Module */ #contentArea .level-identity { padding: 10px; background-color: #E5E5E5; border-bottom: 4px solid #6F6F6F; } #contentArea .level-identity .left { float: left; width: 620px; margin-right: 10px; } #contentArea .level-identity .left h1 { font-size: 21px; font-family: Tahoma, Verdana; color: #222; margin: 0px; padding: 0px; } #contentArea .level-identity .left h2 { font-size: 12px; color: #222; margin: 0px; padding: 0px 0px 10px 0px; } #contentArea .level-identity .left p { margin: 0px; padding: 0px; padding-top: 3px; } #contentArea .level-identity .left p a { font-weight: bold; color: #3292C5; } #contentArea .level-identity .left span.plays { font-size: 16px; font-weight: bold; color: #222; } #contentArea .level-identity .right { float: right; width: 240px; border-left: 1px solid #CCC; min-height: 350px; } #contentArea .level-identity .right ul { list-style: none; margin: 0px; padding: 0px; margin-left: 10px; } #contentArea .level-identity .right ul.level-configuration li { margin-bottom: 10px; cursor: pointer; background: #1A7AAA url(../i/bg-level-buttons.gif) repeat-x top left; -moz-box-shadow: 1px 1px 10px #666, inset 1px 1px 10px #333; -webkit-box-shadow: 1px 1px 10px #666, inset 1px 1px 10px #333; } #contentArea .level-identity .right ul.level-configuration li:hover { -moz-box-shadow: 1px 1px 10px #666, inset 1px 1px 20px #42C9EE; -webkit-box-shadow: 1px 1px 10px #666, inset 1px 1px 20px #42C9EE; } #contentArea .level-identity .right ul.level-configuration li div { height: 40px; position: relative; background: transparent url(../i/btn-level-buttons.gif) no-repeat 5px 6px; padding-left: 30px; } #contentArea .level-identity .right ul.level-configuration li div:hover { background: transparent url(../i/btn-level-buttons-on.gif) no-repeat 5px 6px; } #contentArea .level-identity .right ul.level-configuration li p { padding-left: 13px; margin: 0px; height: 30px; margin-top: -10px; position: absolute; top: 50%; } #contentArea .level-identity .right ul.level-configuration li a { font-size: 11px; font-weight: bold; color: white; text-decoration: none; } #contentArea .level-identity .right ul.sharing { border-top: 1px solid #CCC; padding-top: 10px; } #contentArea .level-identity .right ul.sharing li { padding-left: 35px; height: 30px; padding-top: 5px; } #contentArea .level-identity .right ul.sharing a { font-weight: bold; font-size: 11px; color: #3292C9; } #contentArea .level-identity .right ul.sharing .facebook { background: transparent url(../i/button-share-facebook.gif) no-repeat top left; } #contentArea .level-identity .right ul.sharing .twitter { background: transparent url(../i/button-share-twitter.gif) no-repeat top left; } #contentArea .level-identity .left #tagContainer { line-height: 200%; margin-top: 10px; } #contentArea .level-identity .left #tagContainer span { background-color: #9D9D9D; margin-right: 3px; padding: 3px; color: #FFF; font-size: 11px; cursor: pointer; } #contentArea .level-identity .left #tagContainer span a { color: red; padding: 3px 6px 3px 6px; font-weight: bold; text-decoration: none; } /* LEFT COLUMN HIGHLIGHT: Profile Identity Module */ #contentArea #left-column .profile-identity { padding: 10px; background-color: black; } #contentArea #left-column .profile-identity .module-title div.module-title-left { width: 615px; } #contentArea #left-column .profile-identity .module-title div.module-title-right .char-icon { background-position: -120px -60px; } #contentArea #left-column .profile-identity .profile-identity-holder { margin-top: 10px; color: white; } #contentArea #left-column .profile-identity .profile-identity-holder .bt { border-top: 1px solid #666; } #contentArea #left-column .profile-identity .profile-identity-holder .bb { border-bottom: 1px solid #666; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-avatar { background: transparent url(../i/avatarLoading.gif) no-repeat center center; width: 200px; height: 200px; overflow: hidden; float: left; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-info { margin-left: 10px; width: 380px; min-height: 200px; float: left; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-info div { padding: 10px; font-size: 12px; margin-right: 10px; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-info div a { text-decoration: none; font-weight: bold; color: #2C9ED8; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-info div a:hover { text-decoration: underline; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-info h2 { padding: 0px; margin: 0px; font-size: 16px; font-weight: bold; letter-spacing: -1px; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-info h4 { padding: 0px; margin: 0px; margin-top: 5px; font-size: 12px; font-weight: bold; letter-spacing: -1px; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-info span.click-to-edit { font-size: 11px; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-badges { margin-left: 10px; width: 90px; float: left; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-badges ul { list-style: none; margin: 0px; padding: 0px; text-align: left; } #contentArea #left-column .profile-identity .profile-identity-holder div.profile-identity-badges ul li { margin: 0px; padding: 0px; text-align: left; padding-left: 20px; margin-bottom: 3px; padding-bottom: 3px; } /* LEFT COLUMN HIGHLIGHT: Profile Identity Module 2*/ #contentArea .profile-identity-2 { width:100%; background-color: #E5E5E5; border-bottom: 4px solid #6F6F6F; padding-bottom: 0px; overflow: hidden; -moz-border-radius-topright: 10px; -moz-border-radius-topleft: 10px; -webkit-border-top-left-radius: 10px; -webkit-border-top-ri-radius: 10px;} #contentArea .profile-identity-2 .top-left { padding-left:20px; padding-top: 15px;} #contentArea .profile-identity-2 .top-left .user-info { font-size: 21px; font-style: bold; font-family: Tahoma, Verdana; color: #222; margin-right: 0px;} #contentArea .profile-identity-2 .top-left .user-info .club-icon { margin-left: 5px; margin-top: 3px; } #contentArea .profile-identity-2 .top-left .atmoscore { text-align: right; font-family: Lucida, Tahoma, Arial, sans-serif; color: #424242; } #contentArea .profile-identity-2 .top-left .avatar-container { background-color: #b8b8b8; margin-left: 0px; margin-right: 20px; margin-bottom: 10px;} #contentArea .profile-identity-2 .top-left .avatar-container .avatar { margin-left: 50px; margin-right: 50px; margin-top: 10px; margin-bottom:10px; width:200px; height:200px; } #contentArea .profile-identity-2 .top-right { padding-left: 15px; padding-top: 10px; margin-left: 12px; margin-top: 10px; width: 230px; border-left: 1px solid #808080; height: 245px; } #contentArea .profile-identity-2 .top-right .online { border-bottom: 1px solid #808080; margin-bottom: 10px; padding-bottom: 15px;} #contentArea .profile-identity-2 .top-right .community { border-bottom: 1px solid #808080; margin-bottom: 10px; padding-top: 5px; padding-bottom: 10px;} #contentArea .profile-identity-2 .top-right .community .btn { padding: 8px 5px 5px 35px; height: 18px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; margin-bottom:4px;} #contentArea .profile-identity-2 .top-right .community .addFriend { background : transparent url(/atmosphir/r/i/icon/addFriend-profile.png) no-repeat 1px 1px;} #contentArea .profile-identity-2 .top-right .community .addFriend:hover { background : transparent url(/atmosphir/r/i/icon/addFriend-profile-over.png) no-repeat 1px 1px; cursor: pointer; background-color: #EAEAEA;} #contentArea .profile-identity-2 .top-right .community .sendMessage { background : transparent url(/atmosphir/r/i/icon/sendMessage-profile.png) no-repeat 1px 1px;} #contentArea .profile-identity-2 .top-right .community .sendMessage:hover { background : transparent url(/atmosphir/r/i/icon/sendMessage-profile-over.png) no-repeat 1px 1px; cursor: pointer; background-color: #EAEAEA;} #contentArea .profile-identity-2 .top-right .community .blockUser { background : transparent url(/atmosphir/r/i/icon/blockUser-profile.png) no-repeat 1px 1px;} #contentArea .profile-identity-2 .top-right .community .blockUser:hover { background : transparent url(/atmosphir/r/i/icon/blockUser-profile-over.png) no-repeat 1px 1px; cursor: pointer; background-color: #EAEAEA;} #contentArea .profile-identity-2 .top-right .community a { font-size: 11px; color: #5B95BA; font-weight: bold;} #contentArea .profile-identity-2 .top-right .community a:hover { text-decoration: none;} #contentArea .profile-identity-2 .top-right .signature { padding-top: 5px;} #contentArea .profile-identity-2 .top-left .quick-stats { } #contentArea .profile-identity-2 .top-left .quick-stats .stat { margin: 1px 1px 1px 1px; padding: 2px 2px 2px 2px ;} #contentArea .profile-identity-2 .top-left .quick-stats .odd { background-color: #D2DBE0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } #contentArea #left-column .left .user-comments { margin: 10px 0px 0px 10px; width: 300px; float: right; } #contentArea #left-column .left .user-comments .module-title div.module-title-left { width: 295px; } #contentArea #left-column .left .user-comments .module-title div.module-title-right .char-icon { background-position: -60px -90px; } #contentArea #left-column .left .user-comments .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .user-comments .inner ul { list-style: none; margin: 0px; padding: 0px; } #contentArea #left-column .left .user-comments .inner ul li { padding: 5px 0px 5px 0px; border-bottom: 1px solid #CCC; } #contentArea #left-column .left .user-comments .inner ul li .avatar { width: 45px; float: left; } #contentArea #left-column .left .user-comments .inner a { color: #2FA7E4; } #contentArea #left-column .left .user-comments .inner .deleted { background-color: #EA9C9D; } #contentArea #left-column .left .user-comments .inner #commentArea { margin: 0px auto 10px auto; width: 290px; border-bottom: 1px solid #CCC; padding-bottom: 10px; } #contentArea #left-column .left .user-comments .inner #commentArea textarea { text-align: left; width: 280px; font-size: 12px; height: 90px; padding: 3px; border: 1px solid #CCC; color: #333; } #contentArea #left-column .left .user-comments .inner .notshown { display: none; } /* LEFT COLUMN: (STORE) Checkout */ #contentArea #left-column .left .store-checkout { padding: 10px 10px 0px 10px; } #contentArea #left-column .left .store-checkout .module-title-2 div.module-title-left { width: 611px; } #contentArea #left-column .left .store-checkout .module-title-2 div.module-title-right .char-icon { background-position: -0px 0px; } #contentArea #left-column .left .store-checkout .inner { padding-top: 5px; padding-bottom: 5px; } #contentArea #left-column .left .store-checkout .inner .col { width: 270px; text-align: left; } #contentArea #left-column .left .store-checkout .inner .col p { font-size: 11px; } #contentArea #left-column .left .store-checkout .inner .col p #toolTipBox { width:500px; font-size: 10px; border: black solid 1px;position: absolute;background-color: #000000; color: #FFFFFF; display: none; } #contentArea #left-column .left .store-checkout .inner .col p a:hover { text-decoration: none} #contentArea #left-column .left .store-checkout .inner .col p input { font-size: 12px; width: 100%; border: 1px solid #CCC; padding: 2px; } #contentArea #left-column .left .store-checkout .inner .atmo-license {padding-top: 20px; } #contentArea #left-column .left .store-checkout .inner .atmo-license .title {text-align: center; font-size: 12px; } #contentArea #left-column .left .store-checkout .inner .atmo-license textarea { width: 500px; height: 110px; overflow: auto; font-size: 10px; background-color: #FFFFFF; color: #000000; } #contentArea #left-column .left .store-checkout .inner .atmo-license .license { text-align: center; padding: 5px } #contentArea #left-column .left .store-checkout .inner .atmo-license .purchase { text-align: center; padding: 10px } /* LEFT COLUMN: (STORE) Home */ #contentArea #left-column .left .store-home { padding: 10px 10px 0px 10px; } #contentArea #left-column .left .store-home .module-title-2 div.module-title-left { width: 611px; } #contentArea #left-column .left .store-home .module-title-2 div.module-title-right .char-icon { background-position: -0px 0px; } #contentArea #left-column .left .store-home .inner { padding-top: 5px; padding-bottom: 5px; } #contentArea #left-column .left .store-home .inner .col { float: left; width: 200px; } #contentArea #left-column .left .store-home .inner .container { width: 404px; padding-left: 3px; margin-left: 3px; float: left; } #contentArea #left-column .left .store-home .inner .container ul { padding: 10px; padding-top: 0px; padding-left: 20px; margin: 0px; } #contentArea #left-column .left .store-home .inner .sqr { width: 198px; height: 197px; background: #CED2D1 url(../i/store/square-bg.gif) no-repeat top left; margin: 0px auto 0px auto; } #contentArea #left-column .left .store-home .inner .sqr .logo { padding: 5px; padding-top: 15px; text-align: center; } #contentArea #left-column .left .store-home .inner .sqr .description { margin: 5px; text-align: center; text-transform: uppercase; font-weight: bold; color: black; letter-spacing: 1px; } #contentArea #left-column .left .store-home .inner .sqr .description .value { color: #29711D; } #contentArea #left-column .left .store-home .inner .banner { margin-top: 5px; text-align: center; background: transparent url(../i/storeBanner.jpg) no-repeat top center; width: 616px; height: 200px; } #contentArea #left-column .left .store-home .inner #pcdesc { padding-left: 5px; background: transparent url(/atmosphir/r/i/storeWarrior.png) no-repeat bottom right; margin-top: 10px; height: 320px; } #contentArea #left-column .left .store-home .inner #pcdesc h1 { font-family: Arial, Tahoma, Sans-serif; margin: 0px; padding: 0px; letter-spacing: -1px;} #contentArea #left-column .left .store-home .inner #pcdesc ul li { margin-top: 5px; color: #444; } #contentArea #left-column .left .store-home .inner .sbutton { cursor: pointer; background: #1A7AAA url(../i/bg-level-buttons.gif) repeat-x top left; -moz-box-shadow: 1px 1px 10px #666, inset 1px 1px 10px #333; -webkit-box-shadow: 1px 1px 10px #666, inset 1px 1px 10px #333; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; margin-left: 20px; margin-right: 20px; } #contentArea #left-column .left .store-home .inner .sbutton:hover { -moz-box-shadow: 1px 1px 10px #666, inset 1px 1px 20px #42C9EE; -webkit-box-shadow: 1px 1px 10px #666, inset 1px 1px 20px #42C9EE; } #contentArea #left-column .left .store-home .inner .sbutton div { height: 40px; position: relative; background: transparent url(../i/btn-level-buttons.gif) no-repeat 5px 6px; padding-left: 30px; } #contentArea #left-column .left .store-home .inner .sbutton div:hover { background: transparent url(../i/btn-level-buttons-on.gif) no-repeat 5px 6px; } #contentArea #left-column .left .store-home .inner .sbutton p { padding-left: 13px; margin: 0px; height: 30px; margin-top: -10px; position: absolute; top: 50%; } #contentArea #left-column .left .store-home .inner .sbutton a { font-size: 11px; font-weight: bold; color: white; text-decoration: none; } /* LEFT COLUMN: (HOMEPAGE) Recommended levels listings */ #contentArea #left-column .left .recommended { padding: 10px 10px 0px 10px; } #contentArea #left-column .left .recommended .module-title-2 div.module-title-left { width: 611px; } #contentArea #left-column .left .recommended .module-title-2 div.module-title-right .char-icon { background-position: 0px 0px; } #contentArea #left-column .left .recommended .inner { padding-top: 5px; padding-bottom: 5px; } #contentArea #left-column .left .recommended .inner ul { list-style: none; padding: 0px; margin: 0px; } #contentArea #left-column .left .recommended .inner ul li { float: left; width: 154px; display: inline; } /* LEFT COLUMN: (HOMEPAGE) Active MP Sessions listings */ #contentArea #left-column .left .active-mpsessions { padding: 10px 10px 0px 10px; } #contentArea #left-column .left .active-mpsessions .module-title-2 div.module-title-left { width: 611px; } #contentArea #left-column .left .active-mpsessions .module-title-2 div.module-title-right .char-icon { background-position: 0px 0px; } #contentArea #left-column .left .active-mpsessions .inner { padding-top: 5px; padding-bottom: 5px; } #contentArea #left-column .left .active-mpsessions .inner ul { list-style: none; padding: 0px; margin: 0px; } #contentArea #left-column .left .active-mpsessions .inner ul li { color: #444; float: left; width: 154px; display: inline; } #contentArea #left-column .left .active-mpsessions .inner ul li a { color: #9C611F; } /* LEFT COLUMN: (HOMEPAGE) Top 100 levels listings */ #contentArea #left-column .left .top-100-levels { padding: 10px 10px 0px 10px; } #contentArea #left-column .left .top-100-levels .module-title-2 div.module-title-left { width: 611px; } #contentArea #left-column .left .top-100-levels .module-title-2 div.module-title-right .char-icon { background-position: -120px 0px; } #contentArea #left-column .left .top-100-levels .inner { padding-top: 5px; padding-bottom: 5px; } #contentArea #left-column .left .top-100-levels .inner ul { list-style: none; padding: 0px; margin: 0px; } #contentArea #left-column .left .top-100-levels .inner ul li { float: left; width: 154px; display: inline; } /* LEFT COLUMN: Friend Activity Module */ #contentArea #left-column .left .friend-activity { margin: 10px 10px 0px 10px; width: 300px; float: left; } #contentArea #left-column .left .friend-activity .module-title div.module-title-left { width: 295px; } #contentArea #left-column .left .friend-activity .module-title div.module-title-right .char-icon { background-position: -60px -30px; } #contentArea #left-column .left .friend-activity .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .friend-activity .inner ul { list-style: none; padding: 0px; margin: 0px; } #contentArea #left-column .left .friend-activity .inner li.divider { padding-top: 5px; padding-bottom: 3px; } #contentArea #left-column .left .friend-activity .inner li.divider { border-top: 1px solid #CACDCF; } #contentArea #left-column .left .friend-activity .inner li .avatar { width: 55px; float: left; } #contentArea #left-column .left .friend-activity .inner li .content { width: 235px; float: left; } #contentArea #left-column .left .friend-activity .inner a { color: #2FA7E4; } /* LEFT COLUMN: Top Levels Module */ #contentArea #left-column .left .top-levels { margin: 10px 10px 0px 10px; width: 290px; float: right; } #contentArea #left-column .left .top-levels .module-title div.module-title-left { width: 285px; } #contentArea #left-column .left .top-levels .module-title div.module-title-right .char-icon { background-position: -120px -30px; } #contentArea #left-column .left .top-levels .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .top-levels .inner ul { list-style: none; padding: 0px; margin: 0px; } #contentArea #left-column .left .top-levels .inner li.divider { padding-top: 5px; padding-bottom: 3px; } #contentArea #left-column .left .top-levels .inner li.divider { border-top: 1px solid #CACDCF; } #contentArea #left-column .left .top-levels .inner li .levelScreenshot { width: 145px; height: 100px; float: left; background-repeat: no-repeat; } #contentArea #left-column .left .top-levels .inner li .levelScreenshot .highlight { width: inherit; height: inherit; background: transparent url(../i/level-highlight-bg.png) no-repeat top left; } #contentArea #left-column .left .top-levels .inner li .levelScreenshot .highlight div.position { padding: 10px; font-size: 20px; font-weight: bold; color: #FFFFFF; } #contentArea #left-column .left .top-levels .inner li .content { width: 130px; float: left; vertical-align: middle; } #contentArea #left-column .left .top-levels .inner a { color: #2FA7E4; } /* LEFT COLUMN: (LEVEL PAGES) Comments Module */ #contentArea #left-column .left .level-comments { margin: 10px 10px 0px 10px; width: 300px; float: right; } #contentArea #left-column .left .level-comments .module-title-2 div.module-title-left { width: 295px; } #contentArea #left-column .left .level-comments .module-title-2 div.module-title-right .char-icon { background-position: -60px -90px; } #contentArea #left-column .left .level-comments .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .level-comments .inner ul { list-style: none; margin: 0px; padding: 0px; } #contentArea #left-column .left .level-comments .inner ul li { padding: 5px 0px 5px 0px; border-bottom: 1px solid #CCC; } #contentArea #left-column .left .level-comments .inner ul li .avatar { width: 45px; float: left; } #contentArea #left-column .left .level-comments .inner a { color: #2FA7E4; } #contentArea #left-column .left .level-comments .inner .deleted { background-color: #EA9C9D; } #contentArea #left-column .left .level-comments .inner #commentArea { margin: 0px auto 10px auto; width: 290px; border-bottom: 1px solid #CCC; padding-bottom: 10px; } #contentArea #left-column .left .level-comments .inner #commentArea textarea { text-align: left; width: 280px; font-size: 12px; height: 90px; padding: 3px; border: 1px solid #CCC; color: #333; } #contentArea #left-column .left .level-comments .inner .notshown { display: none; } /* LEFT COLUMN: (LEVEL PAGES) Open Sessions Module */ #contentArea #left-column .left .level-sessions { margin-top: 10px; width: 290px; float: left; } #contentArea #left-column .left .level-sessions .module-title div.module-title-left { width: 285px; } #contentArea #left-column .left .level-sessions .module-title div.module-title-right .char-icon { background-position: -120px -90px; } #contentArea #left-column .left .level-sessions .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .level-sessions .inner a { color: #2FA7E4; } #contentArea #left-column .left .level-sessions .inner ul { list-style: none; margin: 0px; padding: 0px; } #contentArea #left-column .left .level-sessions .inner ul li { padding: 5px 0px 5px 0px; } /* LEFT COLUMN: (LEVEL PAGES) Description */ #contentArea #left-column .left .level-description { margin-top: 10px; width: 290px; float: left; } #contentArea #left-column .left .level-description .module-title-2 div.module-title-left { width: 285px; } #contentArea #left-column .left .level-description .module-title-2 div.module-title-right .char-icon { background-position: -0px -120px; } #contentArea #left-column .left .level-description .inner { padding: 5px; font-size: 12px; color: #111; } /* LEFT COLUMN: (LEVEL PAGES) Stats */ #contentArea #left-column .left .level-stats { margin-top: 10px; width: 290px; float: left; } #contentArea #left-column .left .level-stats .module-title-2 div.module-title-left { width: 285px; } #contentArea #left-column .left .level-stats .module-title-2 div.module-title-right .char-icon { background-position: -0px -120px; } #contentArea #left-column .left .level-stats .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .level-stats .inner .odd { background-color: #E0EFF6; } #contentArea #left-column .left .level-stats .inner .even { } /* LEFT COLUMN: (LEVEL PAGES) Global Leaderboards Module */ #contentArea #left-column .left .level-gleaderboards { margin-top: 10px; width: 290px; float: left; } #contentArea #left-column .left .level-gleaderboards .module-title-2 div.module-title-left { width: 285px; } #contentArea #left-column .left .level-gleaderboards .module-title-2 div.module-title-right .char-icon { background-position: -0px -120px; } #contentArea #left-column .left .level-gleaderboards .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .level-gleaderboards .inner a { color: #2FA7E4; } #contentArea #left-column .left .level-gleaderboards .inner ul { list-style: none; margin: 0px; padding: 0px; } #contentArea #left-column .left .level-gleaderboards .inner ul li { padding: 5px 0px 5px 0px; } /* LEFT COLUMN: (LEVEL PAGES) Friend Leaderboards Module */ #contentArea #left-column .left .level-fleaderboards { margin-top: 10px; width: 290px; float: left; } #contentArea #left-column .left .level-fleaderboards .module-title div.module-title-left { width: 285px; } #contentArea #left-column .left .level-fleaderboards .module-title div.module-title-right .char-icon { background-position: -180px -90px; } #contentArea #left-column .left .level-fleaderboards .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .level-fleaderboards .inner a { color: #2FA7E4; } #contentArea #left-column .left .level-fleaderboards .inner ul { list-style: none; margin: 0px; padding: 0px; } #contentArea #left-column .left .level-fleaderboards .inner ul li { padding: 5px 0px 5px 0px; } /* LEFT COLUMN: (PROFILE PAGES) Plays Module */ #contentArea #left-column .left .profile-plays { margin: 0px 10px 0px 10px; width: 290px; float: right; } #contentArea #left-column .left .profile-plays .module-title div.module-title-left { width: 285px; } #contentArea #left-column .left .profile-plays .module-title div.module-title-right .char-icon { background-position: 0px -60px; } #contentArea #left-column .left .profile-plays .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .profile-plays .inner .linkArea { padding: 3px; margin-top: 5px; border-top: 1px solid #CCC; } #contentArea #left-column .left .profile-plays .inner a { color: #2FA7E4; } /* LEFT COLUMN: (PROFILE PAGES) Designs listings */ #contentArea #left-column .left .profile-plays-list { padding: 0px 10px 0px 10px; } #contentArea #left-column .left .profile-plays-list .module-title div.module-title-left { width: 611px; } #contentArea #left-column .left .profile-plays-list .module-title div.module-title-right .char-icon { background-position: -60px -60px; } /* LEFT COLUMN: (PROFILE PAGES) Designs Module */ #contentArea #left-column .left .profile-designs { margin: 10px 10px 0px 10px; width: 290px; float: right; } #contentArea #left-column .left .profile-designs .module-title div.module-title-left { width: 285px; } #contentArea #left-column .left .profile-designs .module-title div.module-title-right .char-icon { background-position: -60px -60px; } #contentArea #left-column .left .profile-designs .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .profile-designs .inner .linkArea { padding: 3px; margin-top: 5px; border-top: 1px solid #CCC; } #contentArea #left-column .left .profile-designs .inner a { color: #2FA7E4; } /* LEFT COLUMN: (PROFILE PAGES) Designs listings */ #contentArea #left-column .left .profile-designs-list { padding: 0px 10px 0px 10px; } #contentArea #left-column .left .profile-designs-list .module-title div.module-title-left { width: 611px; } #contentArea #left-column .left .profile-designs-list .module-title div.module-title-right .char-icon { background-position: -60px -60px; } /* LEFT COLUMN: (PROFILE PAGES) Friends Module */ #contentArea #left-column .left .profile-friends { margin: 10px 10px 0px 10px; width: 290px; float: right; } #contentArea #left-column .left .profile-friends .module-title div.module-title-left { width: 285px; } #contentArea #left-column .left .profile-friends .module-title div.module-title-right .char-icon { background-position: -60px -30px; } #contentArea #left-column .left .profile-friends .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .profile-friends .inner .friends-avatar-list { width: 300px; } #contentArea #left-column .left .profile-friends .inner .friends-avatar-list .avatar { float: left; width: 45px; padding: 1px; text-align: right; } #contentArea #left-column .left .profile-friends .inner .linkArea { padding: 3px; margin-top: 5px; border-top: 1px solid #CCC; } #contentArea #left-column .left .profile-friends .inner a { color: #2FA7E4; } /* LEFT COLUMN: (PROFILE PAGES) Friends listings */ #contentArea #left-column .left .profile-friends-list { padding: 0px 10px 0px 10px; } #contentArea #left-column .left .profile-friends-list .module-title div.module-title-left { width: 611px; } #contentArea #left-column .left .profile-friends-list .module-title div.module-title-right .char-icon { background-position: -60px -30px; } /* LEFT COLUMN: (PROFILE PAGES) Stats Module */ #contentArea #left-column .left .profile-stats { margin: 0px 10px 0px 10px; width: 290px; float: right; } #contentArea #left-column .left .profile-stats .module-title div.module-title-left { width: 285px; } #contentArea #left-column .left .profile-stats .module-title div.module-title-right .char-icon { background-position: -180px -30px; } #contentArea #left-column .left .profile-stats .inner { padding: 5px; font-size: 12px; color: #111; } #contentArea #left-column .left .profile-stats .inner table { width: 100%; } #contentArea #left-column .left .profile-stats .inner table tr td { width: 60%; font-weight: bold; } #contentArea #left-column .left .profile-stats .inner table tr td:first-child { width: 40%; font-weight: normal; } /* LEFT COLUMN: (FORUM) */ #contentArea #left-column .left .forum-main { padding: 10px 10px 0px 10px; } #contentArea #left-column .left .forum-main .module-title div.module-title-left { width: 611px; } #contentArea #left-column .left .forum-main .module-title div.module-title-right .char-icon { background-position: -120px -120px; } #contentArea #left-column .left .forum-main .inner { margin: 5px 0px 0px 0px; } #contentArea #left-column .left .forum-main .inner .main-content { width: 610px; float: left; } #contentArea #left-column .left .forum-main .inner .main-content h3 { padding: 0px; margin: 0px; font-size: 14px; } #contentArea #left-column .left .forum-main .inner .main-content .thread { background-color: #DEEDF4; border-bottom: 1px solid #CCC; padding: 10px; } #contentArea #left-column .left .forum-main .inner .main-content .thread a.title { font-size: 14px; font-weight: bold; } #contentArea #left-column .left .forum-main .inner .main-content .thread p { padding: 0px; margin: 0px; padding-top: 5px; font-size: 11px; } #contentArea #left-column .left .forum-main .inner .main-content .post { padding: 10px 0px 10px 0px; } #contentArea #left-column .left .forum-main .inner .main-content .enemyPost { padding: 10px 0px 10px 0px; background-color: #BDC0C1;} #contentArea #left-column .left .forum-main .inner .main-content .enemyPost:hover { background-color: yellow;} #contentArea #left-column .left .forum-main .inner .main-content .enemyPost div { margin-top: -10px; padding: 5px;} #contentArea #left-column .left .forum-main .inner .main-content .post .post-left { width: 110px; float: left; } #contentArea #left-column .left .forum-main .inner .main-content .post .post-right { width: 490px; float: left; } #contentArea #left-column .left .forum-main .inner .main-content .post span.username a { font-size: 12px; font-weight: bold; } #contentArea #left-column .left .forum-main .inner .main-content .post p { padding: 0px; margin: 0px; padding-top: 5px; font-size: 12px; } #contentArea #left-column .left .forum-main .inner .main-content .deleted { background-color: #EE9F9F; } #contentArea #left-column .left .forum-main .inner .main-content div .icon { float:left; width: 30px; margin-top: 12px; margin-right: 8px;} #contentArea #left-column .left .forum-main .inner .main-content .read { background-color: #F2F2F2; } #contentArea #left-column .left .forum-main .inner .bb { border-bottom: 1px solid #CCC; padding-bottom: 3px; } #contentArea #left-column .left .forum-main .inner .pager { padding: 5px; border-bottom: 1px solid #CCC; font-size: 11px; } /* LEFT COLUMN: (NEWS PAGES) Content Module */ #contentArea #left-column .content-list { padding: 10px; } #contentArea #left-column .content-list .module-title div.module-title-left { width: 610px; } #contentArea #left-column .content-list .module-title div.module-title-right .char-icon { background-position: -120px -120px; } #contentArea #left-column .content-list .inner h1 { color: #308FBF; font-size: 16px; font-weight: bold; padding: 0px; margin: 0px; margin-top: 10px; height: auto; } #contentArea #left-column .content-list .inner .content-publish-date { font-size: 11px; color: #666; } #contentArea #left-column .content-list .inner p { margin-top: 10px; padding: 0px; font-size: 14px; color: #333; font-family: Lucida, Tahoma, Arial, sans-serif; letter-spacing: 1px; line-height: 140%; } /* BODY: (NEW USERS PAGES ONLY) New Users Module */ #contentArea #left-column .left .new-users .intro-video { padding-top: 15px;} #contentArea #left-column .left .new-users .intro-video div { text-align: center; padding-top: 5px; height: 365px;} #contentArea #left-column .left .new-users .intro-buttons { text-align: center;} #contentArea #left-column .left .new-users .intro-buttons { width: 640px;} #contentArea #left-column .left .new-users .intro-buttons #register { margin-left: 20px; width : 425px; height: 94px; background-image : url(../i/splash_btnregister_off.jpg); cursor: pointer; float:left;} #contentArea #left-column .left .new-users .intro-buttons #register:hover {width : 425px; height: 94px; background-image : url(../i/splash_btnregister_on.jpg); cursor: pointer} #contentArea #left-column .left .new-users .intro-buttons #login { margin-left: 9px; width : 166px; height: 94px; background-image : url(../i/splash_btnlogin_off.jpg); cursor: pointer ; float:left;} #contentArea #left-column .left .new-users .intro-buttons #login:hover {width : 166px; height: 94px; background-image : url(../i/splash_btnlogin_on.jpg); cursor: pointer} /* LEFT COLUMN: (BETA PAGES ONLY) Beta Sign Up */ #contentArea #left-column .left .beta-signup { padding: 10px 10px 0px 10px; } #contentArea #left-column .left .beta-signup .module-title div.module-title-left { width: 611px; } #contentArea #left-column .left .beta-signup .module-title div.module-title-right .char-icon { background-position: -180px -60px; } #contentArea #left-column .left .beta-signup .inner { color: #3E3E3E; padding-top: 50px; line-height: 150%; } #contentArea #left-column .left .beta-signup .inner .inner-left { float: left; width: 300px; margin-left: 15px; } #contentArea #left-column .left .beta-signup .inner .inner-left ul { list-style: none; padding: 0px; margin: 0px; } #contentArea #left-column .left .beta-signup .inner .inner-left ul li { margin-bottom: 5px; font-weight: bold; color: #CC0000; font-size: 12px; } #contentArea #left-column .left .beta-signup .inner .inner-right { float: right; width: 290px; text-align: center; } /* LEFT COLUMN: (Module appearing in lists) Levels */ #contentArea #left-column .left .designs-list-container { padding-bottom: 5px; margin-bottom: 5px; padding-top: 5px; border-bottom: 1px solid #E5E5E5; } #contentArea #left-column .left .designs-list-container a { color: #2FA7E4; } #contentArea #left-column .left .designs-list-container .designs-list-screenshot { width: 200px; float: left; } #contentArea #left-column .left .designs-list-container .designs-list-screenshot img { width: 190px; } #contentArea #left-column .left .designs-list-container .designs-list-info { width: 300px; float: left; } #contentArea #left-column .left .designs-list-container .designs-list-info a.designs-list-name { font-weight: bold; font-size: 18px; } #contentArea #left-column .left .designs-list-container .designs-list-opts { width: 100px; float: right; text-align: center; } /* LEFT COLUMN: (Module appearing in lists) Users */ #contentArea #left-column .left .user-list-container { padding-bottom: 5px; margin-bottom: 5px; padding-top: 5px; border-bottom: 1px solid #E5E5E5; } #contentArea #left-column .left .user-list-container a { color: #2FA7E4; } #contentArea #left-column .left .user-list-container .user-list-avatar { width: 110px; float: left; } #contentArea #left-column .left .user-list-container .user-list-avatar img { width: 100px; } #contentArea #left-column .left .user-list-container .user-list-info { width: 380px; float: left; } #contentArea #left-column .left .user-list-container .user-list-info a.user-list-username { font-weight: bold; font-size: 18px; } #contentArea #left-column .left .user-list-container .user-list-opts { width: 100px; float: right; text-align: right; } /* LEFT COLUMN: (Module appearing in lists) News */ #contentArea #left-column .left .news-list-container { padding-bottom: 5px; margin-bottom: 5px; padding-top: 5px; border-bottom: 1px solid #E5E5E5; } #contentArea #left-column .left .news-list-container a { color: #2FA7E4; font-weight: bold; } #contentArea #left-column .left .news-list-container a.title { font-size: 14px; } #contentArea #left-column .left .news-list-container p.description { padding-top: 10px; font-size: 12px; color: #666; } /* LEFT COLUMN: Pagination */ #contentArea #left-column table.pagination { margin: 0px; padding: 0px; width: 100%; } #contentArea #left-column table.pagination td { padding: 0px; margin: 0px; font-size: 12px; } #contentArea #left-column table.pagination td a { color: #2FA7E4; } #contentArea #left-column table.pagination td.previous { text-align: left; width: 80px; } #contentArea #left-column table.pagination td.center { text-align: center; } #contentArea #left-column table.pagination td.next { text-align: right; width: 80px; } /* LEFT COLUMN: (STANDALONE / GENERIC PAGES) */ /* Body: 'Standalone' module for info pages and other miscelaneous content */ #contentArea #left-column .left .content .standalone { padding: 20px; padding-top: 0px; margin: 0px; } #contentArea #left-column .left .content .standalone p { font-size: 11px; } #contentArea #left-column .left .content .standalone p a { color: #119CCF; text-decoration: none; } #contentArea #left-column .left .content .standalone p a:hover { text-decoration: underline; } /* LEFT COLUMN: Me page */ #contentArea #left-column .left .me { padding: 10px 10px 0px 10px; min-height: 850px;} #contentArea #left-column .left .me .module-title div.module-title-left { width: 611px; } #contentArea #left-column .left .me .module-title div.module-title-right .char-icon { background-position: -120px 0px; } #contentArea #left-column .left .me .content .avatar {margin-right: 5px; margin-top: 0px; border: 0px; float: left;} #contentArea #left-column .left .me .content .info {font-size: 12px; margin-left: 130px;} #contentArea #left-column .left .me .content .info .main-title {font-size: 12px;} #contentArea #left-column .left .me .content .info #title {text-decoration: none; font-weight: bold; margin-top: 15px; border-bottom: 1px solid #B7B7B7; height:15px; margin-bottom: 10px;} #contentArea #left-column .left .me .content .info .setting .error { float:right; color: #FF0000; display:none} #contentArea #left-column .left .me .content .info .setting {border-bottom: 1px solid #CCC; margin-bottom: 30px;} #contentArea #left-column .left .me .content .info .setting .item {font-size: 12px; padding: 5px; float:left; width: 30%; } #contentArea #left-column .left .me .content .info .setting .value {font-size: 12px; padding: 5px; float left;} #contentArea #left-column .left .me .content .info .setting .value a { font-size: 11px; color: #5B95BA; font-weight: bold;} #contentArea #left-column .left .me .content .info .setting .value a:hover { text-decoration: none;} #contentArea #left-column .left .me .content .info .setting #saveChanges {margin-bottom: 25px; margin-top:15px;} #contentArea #left-column .left .me .content .info .setting .changedOk {float:left;font-size: 10px; padding-top: 33px; padding-left: 5px;} #contentArea #left-column .left .me .content .info .setting .title {font-weight: bold; margin-top: 0px; margin-bottom: 5px;} #contentArea #left-column .left .me .content .info .setting .date {float: left; width: 20%; text-align: left;} #contentArea #left-column .left .me .content .info .setting .items {float: left; width: 50%; text-align: left;} #contentArea #left-column .left .me .content .info .setting .price {float: left; width: 20%; text-align: left;} #contentArea #left-column .left .me .content .info .setting .account { margin-top: 20px; margin-bottom: 5px;} #contentArea #left-column .left .me .content .info .setting .account a { font-size: 11px; color: #5B95BA; font-weight: bold;} #contentArea #left-column .left .me .content .info .setting .account a:hover { text-decoration: none;} /* Right column */ #contentArea #right-column .right { color: white; } #contentArea #right-column .right ul { list-style: none; margin: 0px; padding: 0px; } #contentArea #right-column .right .border { border-top: 1px solid #999; } #contentArea #right-column .right .presence { padding: 10px; background-color: #000000; } #contentArea #right-column .right .mailbox { padding: 10px; font-size: 11px; } #contentArea #right-column .right .mailbox img { vertical-align: middle; } #contentArea #right-column .right .mailbox .highlight { color: #26CE26; } #contentArea #right-column .right .mailbox a { color: #2DA7E4; text-decoration: none; font-size: 11px; font-weight: bold; } #contentArea #right-column .right .mailbox a:hover { text-decoration: underline; } /* Make the module titles a little bit more transparent on the right column */ #contentArea .right .module-title div { filter:alpha(opacity=80); -moz-opacity:0.80; -khtml-opacity: 0.8; opacity: 0.8; } /* RIGHT COLUMN: Online Friends Module */ #contentArea #right-column .right .friends { margin: 10px 10px 0px 10px; } #contentArea #right-column .right .friends .module-title div.module-title-right .char-icon { background-position: 0px 0px; } #contentArea #right-column .right .friends .inner { padding: 5px; font-size: 11px; } #contentArea #right-column .right .friends .inner a { color: #2FA7E4; } #contentArea #right-column .right .friends .avatar { float: left; width: 45px; padding: 1px; text-align: right; } #contentArea #right-column .right .friends img { margin: 0px; } /* RIGHT COLUMN: Featured Levels Module */ #contentArea #right-column .right .featured-levels { margin: 10px 10px 0px 10px; } #contentArea #right-column .right .featured-levels .module-title div.module-title-right .char-icon { background-position: 0px 0px; } #contentArea #right-column .right .featured-levels .inner { padding: 5px; font-size: 11px; } #contentArea #right-column .right .featured-levels .inner a { color: #2FA7E4; } #contentArea #right-column .right .featured-levels .inner .picture-placeholder .bottom-radius { border-radius-bottomright: 5px; border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px;-webkit-border-bottom-right-radius: 5px; } #contentArea #right-column .right .featured-levels .inner .picture-placeholder .featuredLevel { background-color: #4696B9; min-height: 205px; } #contentArea #right-column .right .featured-levels .inner .picture-placeholder .featuredLevel ul { margin-top: 0px;} #contentArea #right-column .right .featured-levels .inner .picture-placeholder .featuredLevel ul li.arrow {margin-top: 10px; cursor: pointer;} #contentArea #right-column .right .featured-levels .inner .picture-placeholder .featuredLevel ul li {float: left; height: 40px;} #contentArea #right-column .right .featured-levels .inner .picture-placeholder .featuredLevel ul li a { color: white; } #contentArea #right-column .right .featured-levels .inner .picture-placeholder .featuredLevel ul li a:hover { text-decoration: none; } /* RIGHT COLUMN: My Profile */ #contentArea #right-column .right .my-profile { margin: 10px 10px 0px 10px; } #contentArea #right-column .right .my-profile .module-title div.module-title-left { width: 150px; } #contentArea #right-column .right .my-profile .module-title div.module-title-right { width: 90px; font-size: 11px; text-align: right; padding-top: 3px; } #contentArea #right-column .right .my-profile .module-title div.module-title-right a { color: #FFF; text-decoration: none; } #contentArea #right-column .right .my-profile .module-title div.module-title-right a:hover { text-decoration: underline; } #contentArea #right-column .right .my-profile .module-title div.module-title-right .char-icon { background-position: -60px 0px; } #contentArea #right-column .right .my-profile .inner { padding: 5px; font-size: 11px; } #contentArea #right-column .right .my-profile .inner .lft { width: 95px; float: left; } #contentArea #right-column .right .my-profile .inner .rght { width: 125px; float: right; line-height: 170%; } #contentArea #right-column .right .my-profile .inner a { color: #5B95BA; } #contentArea #right-column .right .my-profile .inner a:hover { text-decoration: none; } #contentArea #right-column .right .my-profile .inner img.icon { top: 2px; position: relative; } /* RIGHT COLUMN: Login Register */ #contentArea #right-column .right .login-register { margin: 10px 10px 0px 10px; } #contentArea #right-column .right .login-register .module-title div.module-title-left { width: 150px; } #contentArea #right-column .right .login-register .module-title div.module-title-right { width: 90px; font-size: 11px; text-align: right; padding-top: 3px; } #contentArea #right-column .right .login-register .module-title div.module-title-right .char-icon { background-position: -60px 0px; } #contentArea #right-column .right .login-register .inner { color: #3E3E3E; padding-top: 5px; line-height: 150%; } #contentArea #right-column .right .login-register .inner .lft { float: left; } #contentArea #right-column .right .login-register .inner .rght { float: right; } #contentArea #right-column .right .login-register .inner a { color: #5B95BA; } #contentArea #right-column .right .login-register .inner a:hover { text-decoration: none; } /* RIGHT COLUMN: News Module */ #contentArea #right-column .right .news { margin: 20px 10px 0px 10px; } #contentArea #right-column .right .news .module-title div.module-title-right .char-icon { background-position: -60px 0px; } #contentArea #right-column .right .news .inner { padding: 5px; font-size: 11px; } #contentArea #right-column .right .news .inner a { color: #2FA7E4; } #contentArea #right-column .right .news .inner a:hover { text-decoration: none; } /* RIGHT COLUMN: Generic Ad Module */ #contentArea #right-column .right .advertisement { margin: 10px 10px 10px 10px; text-align: center; } /* RIGHT COLUMN: Search Module */ #contentArea #right-column .right .search { margin: 10px 10px 10px 10px; } #contentArea #right-column .right .search div.search-box { width: 160px; background-color: #CCC; float: left; height: 24px; } #contentArea #right-column .right .search div.search-box input { width: 160px; background-color: #FFF; float: left; border: 1px solid #AAA; height: 27px; font-size: 14px; } #contentArea #right-column .right .search div.search-button { width: 77px; float: right; } /* RIGHT COLUMN: Twitter Module */ #contentArea #right-column .right .twitter { margin: 10px 10px 0px 10px; } #contentArea #right-column .right .twitter .module-title div.module-title-right .char-icon { background-position: -120px 0px; } #contentArea #right-column .right .twitter .inner { padding: 5px; font-size: 11px; color: #666; } #contentArea #right-column .right .twitter .inner a { color: #1973A1; } #contentArea #right-column .right .twitter .inner a:hover { text-decoration: none; } /* RIGHT COLUMN: Social Media / Follow Module */ #contentArea #right-column .right .follow { text-align: center; margin: 10px 10px 0px 10px; } #contentArea #right-column .right .follow ul { list-style: none; } #contentArea #right-column .right .follow ul li { display: inline; } #contentArea #right-column .right .follow .inner { margin-top: 10px; } #contentArea #right-column .right .follow .module-title div.module-title-right .char-icon { background-position: -180px 0px; } #contentArea #right-column .right .follow .msLogo { background: transparent url(../i/generic-sprite.png) no-repeat 5px -50px; height: 45px; margin-top: 5px; margin-bottom: 5px; } #contentArea #right-column .right .follow .unity3DLogo { background: transparent url(../i/generic-sprite.png) no-repeat 45px -92px; height: 30px; margin-top: 10px; margin-bottom: 10px; } /* RIGHT COLUMN: My Cart */ #contentArea #right-column .right .my-cart { text-align: center; margin: 10px 10px 10px 10px; } #contentArea #right-column .right .my-cart .module-title div.module-title-right .char-icon { background-position: -180px 0px; } #contentArea #right-column .right .my-cart .inner { padding: 5px; font-size: 11px; } #contentArea #right-column .right .my-cart .inner .empty { padding: 10px; text-align: center; font-weight: bold; } #contentArea #right-column .right .my-cart .inner a { color: #2FA7E4; } #contentArea #right-column .right .my-cart .inner a:hover { text-decoration: none; } #contentArea #right-column .right .my-cart div.offer { padding-top: 5px; padding-bottom: 5px; } #contentArea #right-column .right .my-cart .inner .plan-icon { width: 42px; text-align: center; float: left; } #contentArea #right-column .right .my-cart .inner .plan-description { width: 140px; padding-top: 3px; text-align: left; margin-left: 3px; margin-right: 3px; float: left; } #contentArea #right-column .right .my-cart .inner .plan-description a.remove { font-size: 9px; } #contentArea #right-column .right .my-cart .inner .plan-cost { width: 32px; padding-top: 3px; text-align: center; float: left; } #contentArea #right-column .right .my-cart .inner .sbutton { margin-bottom: 10px; cursor: pointer; background: #AA561A url(../i/bg-level-buttons2.gif) repeat-x top left; -moz-box-shadow: 1px 1px 10px #666, inset 1px 1px 10px #333; -webkit-box-shadow: 1px 1px 10px #666, inset 1px 1px 10px #333; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; } #contentArea #right-column .right .my-cart .inner .sbutton:hover { -moz-box-shadow: 1px 1px 10px #666, inset 1px 1px 20px #EE7541; -webkit-box-shadow: 1px 1px 10px #666, inset 1px 1px 20px #EE7541; } #contentArea #right-column .right .my-cart .inner .sbutton div { height: 40px; position: relative; background: transparent url(../i/btn-level-buttons2.gif) no-repeat 5px 6px; padding-left: 30px; } #contentArea #right-column .right .my-cart .inner .sbutton div:hover { background: transparent url(../i/btn-level-buttons-on2.gif) no-repeat 5px 6px; } #contentArea #right-column .right .my-cart .inner .sbutton p { padding-left: 13px; margin: 0px; height: 30px; margin-top: -10px; position: absolute; top: 50%; } #contentArea #right-column .right .my-cart .inner .sbutton a { font-size: 11px; font-weight: bold; color: white; text-decoration: none; } /* RIGHT COLUMN: Store FAQ */ #contentArea #right-column .right .store-faq { text-align: left; margin: 10px 10px 10px 10px; } #contentArea #right-column .right .store-faq .module-title div.module-title-right .char-icon { background-position: -180px 0px; } #contentArea #right-column .right .store-faq .inner { padding: 5px; font-size: 11px; } /* RIGHT COLUMN: (BETA PAGES ONLY) Sidebar buttons */ #contentArea #right-column .right .beta-sidebar-buttons { margin-bottom: 10px; } #contentArea #right-column .right .beta-sidebar-buttons ul { margin: 0px; padding: 0px; } #contentArea #right-column .right .beta-sidebar-buttons ul li { padding: 5px; text-align: center; } #contentArea #right-column .right .beta-sidebar-buttons ul li:first-child { padding-top: 15px; } /* RIGHT COLUMN: (LEVEL PAGES ONLY) playmode buttons */ #contentArea #right-column .right .level-playmodes { background-color: #0D3824; padding: 10px; } #contentArea #right-column .right .level-playmodes .mode-button { background: transparent url(../i/bgButtonLevel.png) no-repeat top left; width: 234px; height: 40px; overflow: hidden; } #contentArea #right-column .right .level-playmodes .mode-button .mode-button-label { float: left; width: 180px; } #contentArea #right-column .right .level-playmodes .mode-button .mode-button-label h3 { padding-left: 10px; } #contentArea #right-column .right .level-playmodes .mode-button .mode-button-label h3 a { color: white; text-decoration: none; } #contentArea #right-column .right .level-playmodes .mode-button .mode-button-label h3 a:hover { text-decoration: underline; } #contentArea #right-column .right .level-playmodes .mode-button .mode-button-icon { float: right; width: 35px; padding-top: 3px; } #contentArea #right-column .right .level-playmodes .aux ul { list-style: none; margin: 0px; padding: 0px; } #contentArea #right-column .right .level-playmodes .aux ul li { font-size: 11px; padding: 3px; padding-left: 10px; } #contentArea #right-column .right .level-playmodes .aux ul li a { color: #2F8810; text-decoration: none; font-weight: bold; } #contentArea #right-column .right .level-playmodes .aux ul li a:hover { text-decoration: underline; } #contentArea #right-column .right .level-playmodes .aux ul li a.white { color: white; font-weight: normal; } /* Tooltips */ #contentArea .avatar-tooltip { z-index: 1; text-align: left; width: 120px; position: absolute; padding: 10px; background: transparent url(../i/tooltip-bg.png) repeat top left; color: white; display: none; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #contentArea .avatar-tooltip p { font-weight: bold; font-size: 11px; padding: 0px; margin: 0px; } #contentArea .avatar-tooltip ul.tooltip-badges { padding: 0px; margin: 0px; margin-top: 3px; list-style: none; } #contentArea .avatar-tooltip ul.tooltip-badges li { width: 25px; height: 15px; float: left; padding: 0px; padding-left: 20px; margin: 0px; margin-right: 5px; margin-top: 5px; font-size: 11px; border: 0px; } #contentArea .screenshot-tooltip { z-index: 1; text-align: left; width: 200px; position: absolute; padding: 10px; background: transparent url(../i/tooltip-bg.png) repeat top left; color: white; display: none; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #contentArea .screenshot-tooltip p { font-size: 11px; padding: 0px; margin: 0px; } #contentArea .screenshot-tooltip ul.tooltip-ratings { padding: 0px; margin: 0px; margin-top: 3px; } #contentArea .screenshot-tooltip ul.tooltip-ratings li { width: 25px; height: 15px; float: left; padding: 0px; padding-left: 20px; margin: 0px; margin-right: 5px; font-size: 11px; } /* Star ratings (big, can be clicked from the site) */ .big_star_rating { width: 115px; height: 22px; background: transparent url(../i/big-star-sprite.gif) no-repeat top left; } .big_star_rating div { cursor: pointer; height: 22px; width: 23px; float: left; } .big_star_rating.unrated { background-position: 0px 0px; } .big_star_rating.rated1 { background-position: 0px -23px; } .big_star_rating.rated2 { background-position: 0px -47px; } .big_star_rating.rated3 { background-position: 0px -70px; } .big_star_rating.rated4 { background-position: 0px -94px; } .big_star_rating.rated5 { background-position: 0px -117px; } .big_star_rating.srated1 { background-position: 0px -139px; } .big_star_rating.srated2 { background-position: 0px -163px; } .big_star_rating.srated3 { background-position: 0px -186px; } .big_star_rating.srated4 { background-position: 0px -210px; } .big_star_rating.srated5 { background-position: 0px -233px; } /* Star ratings (medium) */ .star_rating { width: 79px; height: 15px; background: transparent url(../i/ratings-sprite.png) no-repeat top left; } .star_rating.rated5 { background-position: 0px 0px; } .star_rating.rated4 { background-position: 0px -15px; } .star_rating.rated3 { background-position: 0px -30px; } .star_rating.rated2 { background-position: 0px -45px; } .star_rating.rated1 { background-position: 0px -60px; } .star_rating.unrated { background-position: 0px -75px; } /* Star ratings (small) */ .star_rating_small { width: 60px; height: 11px; background: transparent url(../i/ratings-sprite-small.png) no-repeat top left; } .star_rating_small.rated5 { background-position: 0px 0px; } .star_rating_small.rated4 { background-position: 0px -11px; } .star_rating_small.rated3 { background-position: 0px -23px; } .star_rating_small.rated2 { background-position: 0px -35px; } .star_rating_small.rated1 { background-position: 0px -46px; } .star_rating_small.unrated { background-position: 0px -58px; } /* Square ratings (big, can be clicked from the site) */ .big_square_rating { width: 115px; height: 20px; background: transparent url(../i/big-square-sprite.gif) no-repeat top left; } .big_square_rating div { cursor: pointer; height: 20px; width: 23px; float: left; } .big_square_rating.unrated { background-position: 0px 0px; } .big_square_rating.rated1 { background-position: 0px -20px; } .big_square_rating.rated2 { background-position: 0px -40px; } .big_square_rating.rated3 { background-position: 0px -60px; } .big_square_rating.rated4 { background-position: 0px -80px; } .big_square_rating.rated5 { background-position: 0px -100px; } .big_square_rating.srated1 { background-position: 0px -120px; } .big_square_rating.srated2 { background-position: 0px -140px; } .big_square_rating.srated3 { background-position: 0px -160px; } .big_square_rating.srated4 { background-position: 0px -180px; } .big_square_rating.srated5 { background-position: 0px -200px; } /* Square Ratings (medium) */ .square_rating { width: 79px; height: 14px; margin-top: 1px; background: transparent url(../i/ratings-sprite.png) no-repeat top left; } .square_rating.rated5 { background-position: -79px 0px; } .square_rating.rated4 { background-position: -79px -13px; } .square_rating.rated3 { background-position: -79px -26px; } .square_rating.rated2 { background-position: -79px -39px; } .square_rating.rated1 { background-position: -79px -52px; } .square_rating.unrated { background-position: -79px -65px; } /* Square Ratings (small) */ .square_rating_small { width: 60px; height: 10px; margin-top: 1px; background: transparent url(../i/ratings-sprite-small.png) no-repeat top left; } .square_rating_small.rated5 { background-position: -61px -2px; } .square_rating_small.rated4 { background-position: -61px -16px; } .square_rating_small.rated3 { background-position: -61px -30px; } .square_rating_small.rated2 { background-position: -61px -44px; } .square_rating_small.rated1 { background-position: -61px -58px; } .square_rating_small.unrated { background-position: -61px -72px; } /* Badges */ .badge { background: transparent url(../i/badges-sprite.png) no-repeat center left; height: 16px; border-top: none; margin-top: 5px; } .badge.xplevel-badge { background-position: 0px -8px; } .badge.wins-badge { background-position: 0px -38px; } .badge.abandons-badge { background-position: 0px -66px; } .badge.losses-badge { background-position: 0px -98px; } .badge.vs-badge { background-position: 0px -128px; } .badge.gold-badge { background-position: 0px -156px; } .badge.silver-badge { background-position: 0px -188px; } .badge.bronze-badge { background-position: 0px -218px; } .badge.atmoscore-badge { background-position: 0px -245px; } /* Dialogs */ .dialog { width: 300px; border: 1px solid #94B5C5; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #BCDDED url(../i/bgdialog.gif) repeat-x top left; } .dialog .button { border: 1px solid #94B5C5; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #BCDDED url(../i/bgdialog.gif) repeat-x top left; font-size: 11px; font-weight: bold; color: #111F2C; padding: 5px; } .dialog .button:hover { background: #E4F5FE; color: #284A66; } .levelDetail { width: 150px; min-height: 180px; overflow: hidden; background-color: #D5D9DA; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin-bottom: 10px; padding-bottom: 5px; position: relative; } .levelDetail #levelImg {width: 142px; height: 100px;} .levelDetail #levelImg img { margin: 0px; width: 142px; height: 100px; border: 4px solid black; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; } .levelDetail #levelImg img:hover { border: 4px solid #2C9ED8; } .levelDetail .ratings { width: 100%; position: absolute; bottom: 10px; margin-left: 5px;} .levelDetail .level-detail-body { margin-right: 5px; margin-left: 5px; margin-top: 2px; min-height: 45px;} .levelDetail a { color: #2C9ED8; } .levelDetail a:hover { text-decoration: none; } .sessionDetail { width: 150px; min-height: 170px; overflow: hidden; background-color: #F4D1A7; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin-bottom: 10px; padding-bottom: 5px; } .sessionDetail #levelImg {width: 142px; height: 100px;} .sessionDetail #levelImg img { margin: 0px; width: 142px; height: 100px; border: 4px solid black; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; } .sessionDetail #levelImg img:hover { border: 4px solid #2C9ED8; } .sessionDetail .session-detail-body { margin-right: 5px; margin-left: 5px; margin-top: 2px; min-height: 45px; } .sessionDetail a { color: #9C611F; } .sessionDetail a:hover { text-decoration: underline; } /* Feedback Tab */ #btnFeedback { width: 40px; height: 133px; overflow: hidden; position: absolute; right: 0px; cursor: pointer; z-index: 2; } #btnFeedback:hover { width: 45px; } #dlgFeedback { width: 460px; margin: 0px 20px 0px auto; padding: 10px; z-index: 3000; position: absolute; background-color: #BDC0C1; border: 3px solid #7A7C7D; left: 50%; margin-left: -230px; top: 50px; display: none; } #dlgFeedback h2 { font-family: Arial; font-size: 16px; font-weight: bold; } #dlgFeedback p { text-align: center; } #dlgFeedback #txtFeedback { border: 1px solid #7A7C7D; padding: 3px; width: 98%; height: 200px; } /* Tagedit Tab */ #dlgTagedit { width: 460px; margin: 0px 20px 0px auto; padding: 10px; z-index: 3000; position: absolute; background-color: #BDC0C1; border: 3px solid #7A7C7D; left: 50%; margin-left: -230px; top: 50px; display: none; } #dlgTagedit h2 { font-family: Arial; font-size: 16px; font-weight: bold; } #dlgTagedit p { text-align: center; } #dlgTagedit #txtTagedit { border: 1px solid #7A7C7D; padding: 3px; width: 98%; } #dlgTagedit #txtTagedit .errorCode { color: #CC0000; font-weight: bold; font-size: 11px; } /* Search Page */ #searchArea { background-color: #F5F9FB; width: 900px; margin: 0px auto 0px auto; overflow: hidden; -moz-border-radius: 10px; -webkit-border-radius: 10px; } #searchArea #left-column { float: left; width: 160px; } #searchArea #left-column .left { } #searchArea #left-column .module { padding: 10px; } #searchArea #left-column .module ul { list-style: none; margin: 0px; padding: 0px; } #searchArea #left-column .module ul li { font-size: 11px; font-weight: bold; padding: 2px; padding-left: 15px; } #searchArea #left-column .module ul li.selected { background-image: url(../i/liIconSearch.gif); background-repeat: no-repeat; background-position: 0 50%; } #searchArea #left-column .module ul li a { color: #1E82BD; } #searchArea #left-column .module ul li a:hover { text-decoration: underline; } #searchArea #left-column .module h2.title { color: white; margin: 0px; font-size: 12px; padding: 3px; text-transform: uppercase; background-color: #A5A5A5; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; o-border-radius: 5px; } #searchArea #right-column { float: left; width: 650px; margin: 10px; } #searchArea #right-column .right { } #searchArea #right-column .searchBar .searchBar-left { float: left; width: 313px; overflow: hidden; } #searchArea #right-column .searchBar .searchBar-left #qsText { width: 300px; border: 1px solid #CCC; padding: 6px; font-size: 14px; } #searchArea #right-column .searchBar .searchBar-right { float: left; width: 77px; } #searchArea #right-column .main { margin-top: 10px;} #searchArea #right-column .main .noResults {text-align: left; padding-top: 10px; font-size: 18px; color: #be0000; font-family: Lucida, Tahoma, Arial, sans-serif; font-weight: bold;} #searchArea #right-column .main .tryAgain {padding-top: 5px; font-size: 12px; font-family: Lucida, Tahoma, Arial, sans-serif;} #searchArea #right-column .main .popular {margin-top: 15px;} #searchArea #right-column .main .inner { padding: 0px; font-size: 12px; color: #111; margin-top: 15px;} #searchArea #right-column .main .inner ul { list-style: none; margin: 0px; padding: 0px; } #searchArea #right-column .main .inner li { font-size: 11px; font-weight: bold; padding: 2px; padding-rigth: 8px; float: left} #searchArea #right-column .main .inner ul li.selected { background-image: url(../i/liIconSearch.gif); background-repeat: no-repeat; background-position: 0 50%; } #searchArea #right-column .main .inner ul li a { color: #1E82BD; } #searchArea #right-column .main .inner ul li a:hover { text-decoration: underline; } /* User results */ #searchArea #right-column .user-list-container { padding-bottom: 5px; margin-bottom: 5px; padding-top: 5px; border-bottom: 1px solid #E5E5E5; } #searchArea #right-column .user-list-container a { color: #2FA7E4; } #searchArea #right-column .user-list-container a:hover { text-decoration: underline; } #searchArea #right-column .user-list-container .user-list-avatar { width: 110px; float: left; } #searchArea #right-column .user-list-container .user-list-avatar img { width: 100px; } #searchArea #right-column .user-list-container .user-list-info { width: 480px; float: left; } #searchArea #right-column .user-list-container .user-list-info a.user-list-username { font-weight: bold; font-size: 18px; } #searchArea #right-column .user-list-container .user-list-opts { width: 100px; float: right; text-align: right; } /* Message results (forum, help, news, etc.) */ #searchArea #right-column .message-list-container { padding-bottom: 5px; margin-bottom: 5px; padding-top: 5px; border-bottom: 1px solid #E5E5E5; font-size: 14px; } #searchArea #right-column .message-list-container a { color: #2FA7E4; } #searchArea #right-column .message-list-container a:hover { text-decoration: underline; } #login-dialog { } #register-dialog { } #alert-dialog { } /* Overlay div, the height is retrieved with javascript */ #overlay { background-image: url(../i/overlay.png); position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; z-index: 50; } /* * * Module Section * */ /* MODULE TOP COMMUNITY PICK */ #topCommunityPick { border: 1px solid #CCC; margin-bottom: 5px;} #topCommunityPick .content {padding: 5px; } #topCommunityPick .content p { margin-top: 5px; margin-bottom: 5px; font-weight: bold;} #topCommunityPick .content .info { margin-top : 5px; } #topCommunityPick .content .info a {font-weight: bold;color: #2FA7E4;} #topCommunityPick .content .info a:hover { text-decoration: none;} #topCommunityPick .content .description { margin-top : 5px; margin-bottom: 5px;} #topCommunityPick .content .buttons {margin-top: 10px;} /* MODULE LATEST FORUM THREADS */ #latestForumThreads { border: 1px solid #CCC; margin-bottom: 5px; } #latestForumThreads .content { padding: 5px; } #latestForumThreads .threads {margin-top: 15px; margin-left: 5px;} #latestForumThreads .threads .thread { margin-top: 5px; margin-bottom: 10px; color: #888} #latestForumThreads .threads .thread a {font-weight: bold;color: #2FA7E4;} #latestForumThreads .threads .thread a:hover { text-decoration: none;} /* MODULE LASTEST NEWS */ #latestNews { border: 1px solid #CCC; margin-bottom: 5px;} #latestNews .content { background-color: #50A0C1 ; padding: 5px; padding-bottom: 10px;} #latestNews .content h3 { text-align: left; padding: 2px; margin: 0px; text-transform: uppercase; font-weight: bold; font-size: 12px; color: #FFF; letter-spacing: 1px; } #latestNews .content span { color: #FFF; border-bottom: 2px solid} #latestNews .content span a { font-weight: bold; font-size: 12px; color: #FFF;} #latestNews .content span a:hover { text-decoration: none;} /* MODULE TOP TEN PLAYERS TODAY */ #topTenPlayersToday { border: 1px solid #CCC; margin-bottom: 5px; } #topTenPlayersToday .content {padding: 5px; } #topTenPlayersToday .content .topTen { margin-top: 5px;} #topTenPlayersToday .content .topTen a { font-weight: bold;color: #2FA7E4; } #topTenPlayersToday .content .topTen a:hover { text-decoration: none;} #topTenPlayersToday .content .topTen .first { background-color: #D7D7D7; padding: 5px; width: 283px;;} #topTenPlayersToday .content .topTen .first .avatar { float: left;} #topTenPlayersToday .content .topTen .first .user {margin-left: 5px; width: 233px;} #topTenPlayersToday .content .topTen .first .user .title { color: #555; font-weight: bold; } #topTenPlayersToday .content .topTen .first .regist {float: left; color: #868686; font-weight: bold; font-size: 10px; margin-left: 0px; margin-top: 3px; } #topTenPlayersToday .content .topTen .first .user .num { font-size: 25px; font-weight: bolder; color: #868686; float: right; text-align: center; margin-rigth: -5px; } #topTenPlayersToday .content .topTen .first .user .num .won {float: right ; color: #868686; font-weight: bold; font-size: 10px; padding-right: 5px; margin-top: 2px; text-align: center; width: 90%} #topTenPlayersToday .content .topTen .others { font-size: 10px; margin: 5px; min-height: 30px;} #topTenPlayersToday .content .topTen .others .username { padding-top : 8px; padding-left: 35px; color: #868686; font-size: 12px;} #topTenPlayersToday .content .topTen .others .username .wons { float: right; font-weight: bolder; color: #868686; font-size: 12px; margin-rigth: 10px;} /* MODULE LEVELS BEIGN PLAYED RIGHT NOW */ #levelsPlayedRightNow { border: 1px solid #CCC; margin-bottom: 5px; } #levelsPlayedRightNow .content { padding: 5px; } #levelsPlayedRightNow .content .levels { margin-top: 5px; margin-left: 5px;} #levelsPlayedRightNow .content .levels .level { border-bottom: 1px solid #CCC; margin-bottom: 5px; margin-top: 10px; color: #868686;} #levelsPlayedRightNow .content .levels .level .screenshot {float: left; } #levelsPlayedRightNow .content .levels .level .info { margin-left: 105px; margin-top: 5px } #levelsPlayedRightNow .content .levels .level .info a { font-weight: bold; font-size: 12px; color: #2FA7E4;} #levelsPlayedRightNow .content .levels .level .info a:hover { text-decoration: none;} #levelsPlayedRightNow .content .levels .level .info .description { margin-top: 5px; min-height: 25px;} #levelsPlayedRightNow .content .levels .level .buttons { margin-top: 15px; margin-left: 105px; margin-bottom: 5px;}